/* ==========================================================
   LP PRO SUITE
   BOOKING UI
   DESIGN SYSTEM
========================================================== */

/* ==========================================================
   DESIGN TOKENS
========================================================== */

:root{
    --lp-primary:#16D84F;
    --lp-primary-hover:#14C148;
    --lp-success:#16D84F;
    --lp-warning:#F59E0B;
    --lp-danger:#EF4444;

    --lp-radius-sm:10px;
    --lp-radius:18px;
    --lp-radius-lg:28px;

    --lp-space-xs:6px;
    --lp-space-sm:10px;
    --lp-space-md:16px;
    --lp-space-lg:24px;
    --lp-space-xl:32px;

    --lp-title-size:18px;
    --lp-subtitle-size:15px;
    --lp-title-weight:600;
    --lp-subtitle-weight:400;

    --lp-shadow-sm:0 2px 8px rgba(0,0,0,.05);
    --lp-shadow:0 10px 28px rgba(0,0,0,.08);
    --lp-shadow-lg:0 18px 48px rgba(0,0,0,.12);

    --lp-transition:.20s ease;
}

.lp-theme-light{
    --lp-bg:#F6F8FB;
    --lp-surface:#FFFFFF;
    --lp-card:#FFFFFF;
    --lp-border:#E5E7EB;
    --lp-text:#111827;
    --lp-text-light:#6B7280;
}

.lp-theme-dark{
    --lp-bg:#0F1118;
    --lp-surface:#171B22;
    --lp-card:#1E232C;
    --lp-border:#2F3742;
    --lp-text:#FFFFFF;
    --lp-text-light:#B5BFCC;
}

.lp-booking{
    --card-padding:22px;
    color:var(--lp-text);
    font-size:15px;
    line-height:1.5;
}

.lp-booking *,
.lp-booking *::before,
.lp-booking *::after{box-sizing:border-box;}

.lp-booking img{max-width:100%;height:auto;}

.lp-booking .latepoint-heading-w{background:var(--lp-surface);}
.lp-booking .latepoint-body{background:var(--lp-bg);}
.lp-booking .latepoint-footer{background:var(--lp-surface);}
.lp-booking .latepoint-step-content{background:transparent;}

.lp-booking h1,.lp-booking h2,.lp-booking h3,.lp-booking h4,.lp-booking h5,.lp-booking h6{
color:var(--lp-text);margin:0;}

.lp-booking p{color:var(--lp-text-light);}

.lp-booking a{color:var(--lp-primary);text-decoration:none;}
.lp-booking a:hover{text-decoration:underline;}

.lp-booking input,
.lp-booking textarea,
.lp-booking select{
background:var(--lp-surface);
color:var(--lp-text);
border:1px solid var(--lp-border);
border-radius:var(--lp-radius-sm);
}

.lp-booking *:focus-visible{
outline:2px solid var(--lp-primary);
outline-offset:2px;
}

.lp-booking ::selection{
background:var(--lp-primary);
color:#FFF;
}

.lp-booking *::-webkit-scrollbar{width:8px;height:8px;}
.lp-booking *::-webkit-scrollbar-thumb{
background:var(--lp-border);
border-radius:999px;
}

.lp-card{

    background:var(--lp-card);

    border:1px solid var(--lp-border);

    border-radius:var(--lp-radius);

    box-shadow:var(--lp-shadow-sm);

    transition:
        transform .25s ease,
        box-shadow .25s ease,
        border-color .25s ease;

}

.lp-card:hover{

    transform:translateY(-2px);

    border-color:rgba(22,216,79,.18);

    box-shadow:var(--lp-shadow);

}

.lp-card.is-selected{

    border-color:var(--lp-primary);

    box-shadow:0 12px 30px rgba(22,216,79,.15);

}

.lp-title{
color:var(--lp-text);
font-size:var(--lp-title-size);
font-weight:var(--lp-title-weight);
}

.lp-description{
color:var(--lp-text-light);
font-size:var(--lp-subtitle-size);
font-weight:var(--lp-subtitle-weight);
}

.lp-button{
background:var(--lp-primary);
color:#FFF;
border-radius:var(--lp-radius);
transition:var(--lp-transition);
}

.lp-button:hover{background:var(--lp-primary-hover);}

.lp-input{
background:var(--lp-surface);
border:1px solid var(--lp-border);
border-radius:var(--lp-radius-sm);
color:var(--lp-text);
}

.lp-badge{

    display:inline-flex;

    align-items:center;

    justify-content:center;

    gap:6px;

    padding:5px 12px;

    background:var(--lp-bg);

    border:1px solid var(--lp-border);

    border-radius:999px;

    color:var(--lp-text-light);

    font-size:12px;

    font-weight:600;

}

.lp-hidden{display:none!important;}
.lp-disabled{opacity:.5;pointer-events:none;}
.lp-text-center{text-align:center;}
.lp-text-right{text-align:right;}


/* ==========================================================
   LATEPOINT CARD OVERRIDE
========================================================== */

.lp-booking .os-item{

    background:var(--lp-card) !important;

    border:1px solid var(--lp-border) !important;

    border-radius:var(--lp-radius) !important;

    box-shadow:var(--lp-shadow-sm) !important;

    transition:
        transform .25s ease,
        border-color .25s ease,
        box-shadow .25s ease;

}

.lp-booking .os-item:hover{

    transform:translateY(-2px);

    border-color:rgba(22,216,79,.18) !important;

    box-shadow:var(--lp-shadow) !important;

}

.lp-booking .os-item.os-selected,
.lp-booking .os-item.selected,
.lp-booking .os-item.is-selected{

    border-color:var(--lp-primary) !important;

    box-shadow:0 12px 30px rgba(22,216,79,.16) !important;

}