:root{
    --primary:#5f2f90;
    --accent:#d9408c;
    --accent-dark:#8f2a6d;
    --text:#171822;
    --muted:#677489;
    --line:#e8e4ef;
    --card:#ffffff;
    --shadow:0 20px 60px rgba(58, 30, 86, 0.10);
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
    margin:0;
    font-family:Inter,Segoe UI,Arial,sans-serif;
    color:var(--text);
    background:#fff;
}
a{text-decoration:none;color:inherit}
img{display:block;max-width:100%}

.site-container{
    width:100%;
    max-width:1440px;
    margin:0 auto;
    padding-left:24px;
    padding-right:24px;
}

/* header */
.site-header{
    position:sticky;
    top:0;
    z-index:1000;
    background:rgba(255,255,255,.94);
    backdrop-filter:blur(12px);
    border-bottom:1px solid rgba(232,228,239,.9);
}
.header-wrap{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:20px;
    padding:14px 0;
}
.brand{
    display:flex;
    align-items:center;
    gap:14px;
}
.brand-logo{
    width:220px;
    max-width:52vw;
}
.brand-divider{
    width:1px;
    height:46px;
    background:#d8d3e2;
}
.nabl-logo{
    width:56px;
    height:56px;
    object-fit:contain;
}
.main-nav{
    display:flex;
    align-items:center;
    gap:22px;
}
.main-nav a{
    font-size:14px;
    font-weight:600;
    color:#5d6577;
}
.nav-admin-btn{
    background:linear-gradient(135deg,var(--primary),var(--accent));
    color:#fff !important;
    padding:12px 18px;
    border-radius:999px;
    box-shadow:var(--shadow);
}
.menu-toggle{
    display:none;
    background:none;
    border:none;
    font-size:28px;
    color:var(--primary);
    cursor:pointer;
}

/* common */
.section{
    padding:84px 0;
}
.section-alt{
    background:linear-gradient(180deg,#fff 0%,#faf8fd 100%);
}
.section-heading{
    max-width:860px;
    margin:0 auto 34px;
}
.section-heading.center{
    text-align:center;
}
.section-heading h2{
    margin:14px 0 10px;
    font-size:clamp(32px,3vw,50px);
    line-height:1.08;
    letter-spacing:-.04em;
}
.section-heading p{
    margin:0;
    color:var(--muted);
    line-height:1.8;
}
.eyebrow{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    padding:8px 14px;
    border-radius:999px;
    background:#f2eafc;
    color:var(--primary);
    border:1px solid #eadcf9;
    font-size:12px;
    font-weight:800;
    letter-spacing:.08em;
    text-transform:uppercase;
}

/* hero + form */
.hero-booking-section{
    padding:26px 0 24px;
    background:
        radial-gradient(circle at top left, rgba(220,205,247,0.35) 0%, rgba(255,255,255,0) 28%),
        linear-gradient(180deg,#fff 0%,#fcf9ff 100%);
}
.hero-booking-grid{
    display:grid;
    grid-template-columns:minmax(0,1.15fr) minmax(380px,.85fr);
    gap:26px;
    align-items:stretch;
}
.hero-slider-wrap{
    position:relative;
    border-radius:28px;
    overflow:hidden;
    border:1px solid var(--line);
    box-shadow:var(--shadow);
    background:#fff;
    height:100%;
}
.hero-slide{
    display:none;
    animation:fadeUp .45s ease;
}
.hero-slide.active{
    display:block;
}
.hero-slide img{
    width:100%;
    height:100%;
    min-height:660px;
    object-fit:contain;
    background:#fff;
}
.hero-dots{
    position:absolute;
    left:50%;
    bottom:18px;
    transform:translateX(-50%);
    display:flex;
    gap:10px;
    padding:10px 14px;
    border-radius:999px;
    background:rgba(255,255,255,.88);
    backdrop-filter:blur(8px);
    box-shadow:0 8px 24px rgba(0,0,0,.08);
}
.hero-dot{
    width:12px;
    height:12px;
    border:none;
    border-radius:999px;
    background:#d8c8ef;
    cursor:pointer;
}
.hero-dot.active{
    width:30px;
    background:linear-gradient(135deg,var(--primary),var(--accent));
}

.booking-box{
    background:#fff;
    border:1px solid var(--line);
    border-radius:28px;
    padding:26px;
    box-shadow:var(--shadow);
    height:100%;
}
.booking-box h2{
    margin:14px 0 10px;
    font-size:34px;
    line-height:1.1;
    letter-spacing:-.03em;
}
.booking-subtext{
    margin:0 0 18px;
    color:var(--muted);
    line-height:1.8;
}
.booking-form .form-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:16px;
}
.form-field{
    display:flex;
    flex-direction:column;
    gap:8px;
}
.form-field.full{
    grid-column:1/-1;
}
label{
    font-size:14px;
    font-weight:700;
    color:var(--text);
}
input,select,textarea{
    width:100%;
    padding:14px 16px;
    border:1px solid #dddbe8;
    border-radius:16px;
    background:#fff;
    font:inherit;
    outline:none;
    transition:border-color .2s, box-shadow .2s;
}
input:focus,select:focus,textarea:focus{
    border-color:#c9a7ee;
    box-shadow:0 0 0 4px rgba(201,167,238,.18);
}
.btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:10px;
    padding:14px 22px;
    border:none;
    border-radius:16px;
    font-weight:700;
    cursor:pointer;
    transition:.25s transform,.25s box-shadow;
}
.btn:hover{
    transform:translateY(-2px);
    box-shadow:0 16px 34px rgba(95,47,144,.18);
}
.btn-primary{
    background:linear-gradient(135deg,var(--primary),var(--accent));
    color:#fff;
}
.btn-secondary{
    background:#fff;
    color:var(--primary);
    border:1px solid #ddd5ec;
}
.btn-full{
    width:100%;
}
.form-response{
    margin-top:14px;
    font-weight:700;
}

/* packages */
.package-grid{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:24px;
}
.package-card{
    background:#fff;
    border:1px solid var(--line);
    border-radius:24px;
    overflow:hidden;
    box-shadow:var(--shadow);
}
.package-image{
    position:relative;
    min-height:245px;
    overflow:hidden;
}
.package-image img{
    width:100%;
    height:245px;
    object-fit:cover;
    transition:transform .45s ease;
}
.package-badge{
    position:absolute;
    left:16px;
    bottom:16px;
    background:rgba(255,255,255,.92);
    color:var(--primary);
    padding:8px 12px;
    border-radius:999px;
    font-size:13px;
    font-weight:800;
}
.package-body{
    padding:24px;
}
.package-body h3{
    margin:0 0 10px;
    font-size:25px;
}
.package-price{
    font-size:38px;
    line-height:1;
    font-weight:900;
    color:var(--primary);
    margin-bottom:12px;
}
.package-body p{
    margin:0 0 18px;
    color:var(--muted);
    line-height:1.75;
    min-height:76px;
}
.hover-card{
    transition:transform .28s ease, box-shadow .28s ease, border-color .28s ease;
}
.hover-card:hover{
    transform:translateY(-8px);
    box-shadow:0 24px 54px rgba(95,47,144,.16);
    border-color:#d4b4f3;
}
.hover-card:hover .package-image img{
    transform:scale(1.05);
}

/* achievements */
.achievements-section{
    background:#f8f7fb;
}
.achievement-grid{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:24px;
}
.achievement-card{
    background:#fff;
    border:1px solid var(--line);
    border-radius:24px;
    padding:34px 24px;
    text-align:center;
    box-shadow:var(--shadow);
}
.achievement-icon{
    width:74px;
    height:74px;
    margin:0 auto 20px;
    border-radius:22px;
    display:flex;
    align-items:center;
    justify-content:center;
    background:#f2e9f2;
    color:var(--primary);
    font-size:32px;
}
.achievement-card h3{
    margin:0 0 10px;
    font-size:34px;
    font-weight:900;
    color:#0f2453;
}
.achievement-card p{
    margin:0;
    color:#667893;
    line-height:1.7;
    font-size:16px;
    font-weight:600;
}

/* benefits */
.benefits-grid{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:24px;
}
.info-card{
    background:#fff;
    border:1px solid var(--line);
    border-radius:24px;
    padding:28px;
    box-shadow:var(--shadow);
}
.info-card h3{
    margin:0 0 12px;
    font-size:24px;
}
.info-card p{
    margin:0;
    color:var(--muted);
    line-height:1.85;
}

/* why choose */
.why-section{
    background:
        radial-gradient(circle at top right, rgba(225,214,244,0.40), rgba(255,255,255,0) 34%),
        linear-gradient(180deg,#fff 0%,#fbf9fd 100%);
}
.why-card-grid{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:24px;
}
.why-card{
    background:#fff;
    border:1px solid var(--line);
    border-radius:24px;
    padding:28px;
    box-shadow:var(--shadow);
}
.why-icon{
    width:68px;
    height:68px;
    border-radius:20px;
    display:flex;
    align-items:center;
    justify-content:center;
    background:#f2e9f2;
    color:var(--primary);
    font-size:30px;
    margin-bottom:22px;
}
.why-card h3{
    margin:0 0 12px;
    font-size:24px;
    color:#0f2453;
}
.why-card p{
    margin:0;
    color:#667893;
    line-height:1.9;
}
.website-link-wrap{
    text-align:center;
    margin-top:34px;
}
.link-chip{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    padding:15px 20px;
    border-radius:999px;
    background:#fff;
    border:1px solid var(--line);
    color:var(--primary);
    font-weight:800;
    box-shadow:var(--shadow);
}

/* footer */
.site-footer{
    background:#111420;
    color:#fff;
    padding:54px 0;
}
.footer-grid{
    display:grid;
    grid-template-columns:1.2fr .8fr .8fr;
    gap:26px;
}
.footer-logo{
    width:220px;
    margin-bottom:14px;
}
.site-footer p,
.site-footer a{
    color:rgba(255,255,255,.80);
    line-height:1.8;
}
.site-footer h4{
    margin:0 0 14px;
    font-size:16px;
}
.site-footer a{
    display:block;
    margin-bottom:10px;
}

@keyframes fadeUp{
    from{opacity:0;transform:translateY(14px)}
    to{opacity:1;transform:translateY(0)}
}

/* responsive */
@media (max-width: 1280px){
    .hero-booking-grid{
        grid-template-columns:1fr;
    }
    .hero-slide img{
        min-height:auto;
        height:auto;
    }
}

@media (max-width: 1080px){
    .package-grid,
    .achievement-grid,
    .benefits-grid,
    .why-card-grid,
    .footer-grid{
        grid-template-columns:1fr 1fr;
    }

    .main-nav{
        display:none;
        position:absolute;
        top:78px;
        left:16px;
        right:16px;
        background:#fff;
        border:1px solid var(--line);
        border-radius:20px;
        padding:16px;
        box-shadow:var(--shadow);
    }
    .main-nav.open{
        display:flex;
        flex-direction:column;
        align-items:flex-start;
        gap:14px;
    }
    .menu-toggle{
        display:block;
    }
}

@media (max-width: 767px){
    .site-container{
        padding-left:16px;
        padding-right:16px;
    }

    .header-wrap{
        padding:12px 0;
    }
    .brand-logo{
        width:170px;
    }
    .brand-divider{
        height:36px;
    }
    .nabl-logo{
        width:42px;
        height:42px;
    }

    .booking-form .form-grid,
    .package-grid,
    .achievement-grid,
    .benefits-grid,
    .why-card-grid,
    .footer-grid{
        grid-template-columns:1fr;
    }

    .section{
        padding:68px 0;
    }

    .booking-box{
        padding:20px;
    }
    .booking-box h2{
        font-size:28px;
    }

    .achievement-card h3{
        font-size:30px;
    }
}

/* ===== FRONTEND ONLY SCOPE ===== */
.frontend-page{background:#fff;color:#171822;font-family:Inter,Segoe UI,Arial,sans-serif}
.frontend-page a{text-decoration:none;color:inherit}
.frontend-page img{display:block;max-width:100%}
.frontend-page .site-container{width:100%;max-width:1440px;margin:0 auto;padding:0 24px}
.frontend-page .site-header{position:sticky;top:0;z-index:1000;background:rgba(255,255,255,.94);backdrop-filter:blur(12px);border-bottom:1px solid rgba(232,228,239,.9)}
.frontend-page .header-wrap{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:14px 0}
.frontend-page .brand{display:flex;align-items:center;gap:14px}
.frontend-page .brand-logo{width:220px;max-width:52vw}
.frontend-page .brand-divider{width:1px;height:46px;background:#d8d3e2}
.frontend-page .nabl-logo{width:56px;height:56px;object-fit:contain}
.frontend-page .main-nav{display:flex;align-items:center;gap:22px}
.frontend-page .main-nav a{font-size:14px;font-weight:600;color:#5d6577}
.frontend-page .nav-admin-btn{background:linear-gradient(135deg,#5f2f90,#d9408c);color:#fff !important;padding:12px 18px;border-radius:999px;box-shadow:0 20px 60px rgba(58,30,86,.10)}
.frontend-page .menu-toggle{display:none;background:none;border:none;font-size:28px;color:#5f2f90;cursor:pointer}
.frontend-page .section{padding:84px 0}
.frontend-page .section-alt{background:linear-gradient(180deg,#fff 0%,#faf8fd 100%)}
.frontend-page .section-heading{max-width:860px;margin:0 auto 34px}
.frontend-page .section-heading.center{text-align:center}
.frontend-page .section-heading h2{margin:14px 0 10px;font-size:clamp(32px,3vw,50px);line-height:1.08;letter-spacing:-.04em}
.frontend-page .section-heading p{margin:0;color:#667489;line-height:1.8}
.frontend-page .eyebrow{display:inline-flex;align-items:center;justify-content:center;padding:8px 14px;border-radius:999px;background:#f2eafc;color:#5f2f90;border:1px solid #eadcf9;font-size:12px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}
.frontend-page .hero-booking-section{padding:28px 0 24px;background:radial-gradient(circle at top left, rgba(220,205,247,.35) 0%, rgba(255,255,255,0) 28%), linear-gradient(180deg,#fff 0%,#fcf9ff 100%)}
.frontend-page .hero-booking-grid{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(380px,.85fr);gap:26px;align-items:stretch}
.frontend-page .hero-slider-wrap{position:relative;border-radius:28px;overflow:hidden;border:1px solid #e8e4ef;box-shadow:0 20px 60px rgba(58,30,86,.10);background:#fff;min-height:100%}
.frontend-page .hero-slide{display:none;animation:fadeUp .45s ease}
.frontend-page .hero-slide.active{display:block}
.frontend-page .hero-slide img{width:100%;height:auto;aspect-ratio:16/9;object-fit:contain;background:#fff}
.frontend-page .hero-dots{position:absolute;left:50%;bottom:18px;transform:translateX(-50%);display:flex;gap:10px;padding:10px 14px;border-radius:999px;background:rgba(255,255,255,.88);backdrop-filter:blur(8px);box-shadow:0 8px 24px rgba(0,0,0,.08)}
.frontend-page .hero-dot{width:12px;height:12px;border:none;border-radius:999px;background:#d8c8ef;cursor:pointer}
.frontend-page .hero-dot.active{width:30px;background:linear-gradient(135deg,#5f2f90,#d9408c)}
.frontend-page .booking-box{background:#fff;border:1px solid #e8e4ef;border-radius:28px;padding:26px;box-shadow:0 20px 60px rgba(58,30,86,.10);height:100%}
.frontend-page .booking-box h1{margin:14px 0 10px;font-size:34px;line-height:1.1;letter-spacing:-.03em}
.frontend-page .booking-subtext{margin:0 0 18px;color:#667489;line-height:1.8}
.frontend-page .booking-form .form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.frontend-page .form-field{display:flex;flex-direction:column;gap:8px}
.frontend-page .form-field.full{grid-column:1/-1}
.frontend-page label{font-size:14px;font-weight:700;color:#171822}
.frontend-page input,.frontend-page select,.frontend-page textarea{width:100%;padding:14px 16px;border:1px solid #dddbe8;border-radius:16px;background:#fff;font:inherit;outline:none;transition:border-color .2s, box-shadow .2s}
.frontend-page input:focus,.frontend-page select:focus,.frontend-page textarea:focus{border-color:#c9a7ee;box-shadow:0 0 0 4px rgba(201,167,238,.18)}
.frontend-page .btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:14px 22px;border:none;border-radius:16px;font-weight:700;cursor:pointer;transition:.25s transform,.25s box-shadow}
.frontend-page .btn:hover{transform:translateY(-2px);box-shadow:0 16px 34px rgba(95,47,144,.18)}
.frontend-page .btn-primary{background:linear-gradient(135deg,#5f2f90,#d9408c);color:#fff}
.frontend-page .btn-secondary{background:#fff;color:#5f2f90;border:1px solid #ddd5ec}
.frontend-page .btn-full{width:100%}
.frontend-page .form-response{margin-top:14px;font-weight:700}
.frontend-page .package-grid,.frontend-page .achievement-grid,.frontend-page .benefits-grid,.frontend-page .why-card-grid{display:grid;gap:24px}
.frontend-page .package-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.frontend-page .achievement-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
.frontend-page .benefits-grid,.frontend-page .why-card-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.frontend-page .package-card,.frontend-page .achievement-card,.frontend-page .info-card,.frontend-page .why-card{background:#fff;border:1px solid #e8e4ef;border-radius:24px;overflow:hidden;box-shadow:0 20px 60px rgba(58,30,86,.10)}
.frontend-page .package-image{position:relative;min-height:245px;overflow:hidden}
.frontend-page .package-image img{width:100%;height:245px;object-fit:cover;transition:transform .45s ease}
.frontend-page .package-badge{position:absolute;left:16px;bottom:16px;background:rgba(255,255,255,.92);color:#5f2f90;padding:8px 12px;border-radius:999px;font-size:13px;font-weight:800}
.frontend-page .package-body{padding:24px}
.frontend-page .package-body h3{margin:0 0 10px;font-size:25px}
.frontend-page .package-price{font-size:38px;line-height:1;font-weight:900;color:#5f2f90;margin-bottom:12px}
.frontend-page .package-body p{margin:0 0 18px;color:#667489;line-height:1.75;min-height:76px}
.frontend-page .hover-card{transition:transform .28s ease, box-shadow .28s ease, border-color .28s ease}
.frontend-page .hover-card:hover{transform:translateY(-8px);box-shadow:0 24px 54px rgba(95,47,144,.16);border-color:#d4b4f3}
.frontend-page .hover-card:hover .package-image img{transform:scale(1.05)}
.frontend-page .achievements-section{background:#f8f7fb}
.frontend-page .achievement-card{padding:34px 24px;text-align:center}
.frontend-page .achievement-icon{width:74px;height:74px;margin:0 auto 20px;border-radius:22px;display:flex;align-items:center;justify-content:center;background:#f2e9f2;color:#5f2f90;font-size:32px}
.frontend-page .achievement-card h3{margin:0 0 10px;font-size:34px;font-weight:900;color:#0f2453}
.frontend-page .achievement-card p{margin:0;color:#667893;line-height:1.7;font-size:16px;font-weight:600}
.frontend-page .info-card,.frontend-page .why-card{padding:28px}
.frontend-page .info-card h3,.frontend-page .why-card h3{margin:0 0 12px;font-size:24px}
.frontend-page .info-card p,.frontend-page .why-card p{margin:0;color:#667489;line-height:1.85}
.frontend-page .why-section{background:radial-gradient(circle at top right, rgba(225,214,244,.40), rgba(255,255,255,0) 34%), linear-gradient(180deg,#fff 0%,#fbf9fd 100%)}
.frontend-page .why-icon{width:68px;height:68px;border-radius:20px;display:flex;align-items:center;justify-content:center;background:#f2e9f2;color:#5f2f90;font-size:30px;margin-bottom:22px}
.frontend-page .website-link-wrap{text-align:center;margin-top:34px}
.frontend-page .link-chip{display:inline-flex;align-items:center;justify-content:center;padding:15px 20px;border-radius:999px;background:#fff;border:1px solid #e8e4ef;color:#5f2f90;font-weight:800;box-shadow:0 20px 60px rgba(58,30,86,.10)}
.frontend-page .site-footer{background:#111420;color:#fff;padding:54px 0}
.frontend-page .footer-grid{display:grid;grid-template-columns:1.2fr .8fr .8fr;gap:26px}
.frontend-page .footer-logo{width:220px;margin-bottom:14px}
.frontend-page .site-footer p,.frontend-page .site-footer a{color:rgba(255,255,255,.80);line-height:1.8}
.frontend-page .site-footer h4{margin:0 0 14px;font-size:16px}
.frontend-page .site-footer a{display:block;margin-bottom:10px}
@keyframes fadeUp{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}
@media (max-width:1280px){.frontend-page .hero-booking-grid{grid-template-columns:1fr}}
@media (max-width:1080px){.frontend-page .package-grid,.frontend-page .achievement-grid,.frontend-page .benefits-grid,.frontend-page .why-card-grid,.frontend-page .footer-grid{grid-template-columns:1fr 1fr}.frontend-page .main-nav{display:none;position:absolute;top:78px;left:16px;right:16px;background:#fff;border:1px solid #e8e4ef;border-radius:20px;padding:16px;box-shadow:0 20px 60px rgba(58,30,86,.10)}.frontend-page .main-nav.open{display:flex;flex-direction:column;align-items:flex-start;gap:14px}.frontend-page .menu-toggle{display:block}}
@media (max-width:767px){.frontend-page .site-container{padding:0 16px}.frontend-page .header-wrap{padding:12px 0}.frontend-page .brand-logo{width:170px}.frontend-page .brand-divider{height:36px}.frontend-page .nabl-logo{width:42px;height:42px}.frontend-page .booking-form .form-grid,.frontend-page .package-grid,.frontend-page .achievement-grid,.frontend-page .benefits-grid,.frontend-page .why-card-grid,.frontend-page .footer-grid{grid-template-columns:1fr}.frontend-page .section{padding:68px 0}.frontend-page .booking-box{padding:20px}.frontend-page .booking-box h1{font-size:28px}.frontend-page .achievement-card h3{font-size:30px}}


/* =========================
   ADMIN PANEL STYLES
   Scoped to admin pages only
   ========================= */

body.admin-body{
    margin:0;
    background:#f6f7fb;
    color:var(--text);
}

.admin-header{
    position:sticky;
    top:0;
    z-index:1000;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:20px;
    padding:18px 24px;
    background:rgba(255,255,255,.92);
    backdrop-filter:blur(12px);
    border-bottom:1px solid var(--line);
}

.admin-brand{
    display:flex;
    align-items:center;
    gap:18px;
    min-width:0;
}

.admin-logo{
    width:180px;
    height:auto;
    flex-shrink:0;
}

.admin-brand h1{
    margin:0 0 6px;
    font-size:30px;
    line-height:1.1;
    letter-spacing:-.03em;
}

.admin-brand p{
    margin:0;
    color:var(--muted);
    line-height:1.6;
}

.admin-actions{
    display:flex;
    align-items:center;
    gap:12px;
    flex-wrap:wrap;
}

.admin-main{
    width:min(1400px, calc(100% - 24px));
    margin:24px auto 48px;
}

.stats-grid{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:18px;
    margin-bottom:20px;
}

.stat-card{
    background:#fff;
    border:1px solid var(--line);
    border-radius:22px;
    box-shadow:var(--shadow);
    padding:22px;
}

.stat-card span{
    display:block;
    color:var(--muted);
    margin-bottom:10px;
    line-height:1.5;
}

.stat-card strong{
    display:block;
    font-size:36px;
    line-height:1;
    color:var(--primary);
    letter-spacing:-.04em;
}

.admin-panel-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:20px;
    margin-bottom:20px;
}

.admin-panel{
    background:#fff;
    border:1px solid var(--line);
    border-radius:24px;
    box-shadow:var(--shadow);
    padding:22px;
}

.panel-head{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:16px;
    margin-bottom:18px;
}

.panel-head h2{
    margin:0 0 8px;
    font-size:28px;
    line-height:1.15;
    letter-spacing:-.03em;
}

.panel-head p{
    margin:0;
    color:var(--muted);
    line-height:1.7;
}

.filter-form{
    display:grid;
    grid-template-columns:1.25fr .9fr .9fr .9fr auto;
    gap:14px;
    align-items:end;
}

.chart-wrap{
    display:flex;
    align-items:flex-end;
    gap:16px;
    min-height:220px;
    overflow:auto;
    padding-top:10px;
}

.bar-col{
    min-width:86px;
    text-align:center;
}

.bar{
    display:flex;
    align-items:flex-start;
    justify-content:center;
    min-height:20px;
    padding-top:10px;
    border-radius:18px 18px 8px 8px;
    background:linear-gradient(180deg,var(--accent),var(--primary));
    color:#fff;
    font-weight:800;
}

.bar-col small,
.bar-col em{
    display:block;
    margin-top:8px;
    color:var(--muted);
    font-style:normal;
}

.table-wrap{
    overflow:auto;
    -webkit-overflow-scrolling:touch;
}

.booking-table{
    width:100%;
    min-width:1180px;
    border-collapse:separate;
    border-spacing:0 12px;
}

.booking-table th{
    text-align:left;
    padding:0 14px 8px;
    color:var(--muted);
    font-size:13px;
    text-transform:uppercase;
    letter-spacing:.06em;
    white-space:nowrap;
}

.booking-table td{
    padding:16px 14px;
    background:#fff;
    border-top:1px solid var(--line);
    border-bottom:1px solid var(--line);
    vertical-align:top;
}

.booking-table td:first-child{
    border-left:1px solid var(--line);
    border-radius:16px 0 0 16px;
}

.booking-table td:last-child{
    border-right:1px solid var(--line);
    border-radius:0 16px 16px 0;
}

.booking-table small{
    display:block;
    color:var(--muted);
    margin-top:6px;
    line-height:1.5;
}

.feedback-cell{
    max-width:240px;
}

.mini-update-form{
    display:grid;
    gap:10px;
    min-width:230px;
}

.badge{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    padding:8px 12px;
    border-radius:999px;
    font-size:13px;
    font-weight:700;
    white-space:nowrap;
}

.badge.pending{background:#fff5d9;color:#986500}
.badge.booked{background:#efe5ff;color:var(--primary)}
.badge.completed{background:#dff8eb;color:#128a55}
.badge.cancelled{background:#ffe2ea;color:#d3355a}

body.admin-auth-body{
    min-height:100vh;
    display:grid;
    place-items:center;
    padding:24px;
    background:linear-gradient(160deg,#f5ecff 0%,#fff 100%);
}

.admin-auth-card{
    width:min(520px,100%);
    background:#fff;
    border:1px solid var(--line);
    border-radius:28px;
    box-shadow:var(--shadow);
    padding:28px;
}

.auth-header{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:16px;
    margin-bottom:18px;
}

.auth-logo{
    width:220px;
    height:auto;
}

.auth-nabl{
    width:64px;
    height:64px;
    object-fit:contain;
}

.admin-auth-card h1{
    margin:0 0 8px;
    font-size:36px;
    line-height:1.05;
    letter-spacing:-.03em;
}

.admin-auth-card p{
    margin:0;
    color:var(--muted);
    line-height:1.75;
}

.admin-auth-form{
    display:grid;
    gap:14px;
    margin-top:18px;
}

.alert{
    padding:14px 16px;
    border-radius:14px;
    font-weight:700;
    margin-top:14px;
}

.alert.error{
    background:#ffe6ee;
    color:#a52749;
}

.back-link{
    display:inline-block;
    margin-top:18px;
    color:var(--primary);
    font-weight:700;
}

/* Admin responsive */
@media (max-width: 1180px){
    .stats-grid{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .admin-panel-grid{
        grid-template-columns:1fr;
    }

    .filter-form{
        grid-template-columns:1fr 1fr;
    }
}

@media (max-width: 767px){
    .admin-header{
        padding:16px;
        flex-direction:column;
        align-items:flex-start;
    }

    .admin-brand{
        width:100%;
        flex-direction:column;
        align-items:flex-start;
        gap:12px;
    }

    .admin-logo{
        width:160px;
    }

    .admin-brand h1{
        font-size:24px;
    }

    .admin-main{
        width:calc(100% - 16px);
        margin:16px auto 36px;
    }

    .stats-grid{
        grid-template-columns:1fr;
        gap:14px;
    }

    .stat-card{
        padding:18px;
    }

    .stat-card strong{
        font-size:30px;
    }

    .admin-panel{
        padding:18px;
        border-radius:20px;
    }

    .panel-head{
        flex-direction:column;
        align-items:flex-start;
        gap:8px;
    }

    .panel-head h2{
        font-size:22px;
    }

    .filter-form{
        grid-template-columns:1fr;
    }

    .chart-wrap{
        gap:12px;
        padding-bottom:4px;
    }

    .booking-table{
        min-width:980px;
    }

    .mini-update-form{
        min-width:210px;
    }

    .admin-auth-body{
        padding:16px;
    }

    .admin-auth-card{
        padding:20px;
        border-radius:22px;
    }

    .auth-header{
        align-items:flex-start;
        gap:12px;
    }

    .auth-logo{
        width:170px;
    }

    .auth-nabl{
        width:52px;
        height:52px;
    }

    .admin-auth-card h1{
        font-size:28px;
    }
}