:root{--ink:#11213d;--muted:#667085;--line:#dce3ec;--bg:#f4f7fb;--orange:#ff6b22;--green:#067647;--red:#b42318;--shadow:0 20px 55px rgba(15,34,64,.12)}*{box-sizing:border-box}body{margin:0;font-family:Inter,system-ui,Arial;color:var(--ink);background:var(--bg);line-height:1.6}a{text-decoration:none;color:inherit}img{max-width:100%}.shell{width:min(1480px,calc(100% - 40px));margin:auto}.site-header{position:sticky;top:0;z-index:50;background:#fffc;border-bottom:1px solid var(--line);backdrop-filter:blur(15px)}.nav{height:76px;display:flex;align-items:center;justify-content:space-between;gap:22px}.brand img{width:230px;display:block}.nav nav{display:flex;align-items:center;gap:19px;font-size:14px;font-weight:750}.nav-toggle{display:none;border:0;background:none;font-size:25px}.btn{display:inline-flex;justify-content:center;align-items:center;padding:12px 18px;border:1px solid var(--line);border-radius:11px;background:#fff;font-weight:800;cursor:pointer}.primary{background:var(--orange);border-color:var(--orange);color:#fff}.small{padding:9px 14px}.hero{min-height:625px;display:grid;align-items:center;color:#fff;background:linear-gradient(90deg,#091a33f2,#10294a99,#10294a22),url('../images/hero-repair.jpg') center/cover}.hero-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:55px;align-items:center}.hero h1{font-size:clamp(44px,5.5vw,78px);line-height:1.02;margin:18px 0}.hero p{font-size:20px;color:#e5edf8}.eyebrow,.badge{display:inline-flex;padding:6px 10px;border-radius:999px;font-size:12px;font-weight:900}.eyebrow{border:1px solid #ffffff55;background:#ffffff19}.badge{background:#fff0e8;color:#b54708}.green{background:#ecfdf3;color:var(--green)}.red{background:#fef3f2;color:var(--red)}.hero-card,.panel,.card,.stat{background:#fff;border:1px solid var(--line);border-radius:18px;padding:24px;box-shadow:0 8px 28px #10213d0b}.hero-card{color:var(--ink);border-radius:24px;box-shadow:var(--shadow)}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:15px}.field{display:grid;gap:6px}.field.full{grid-column:1/-1}.field label{font-size:13px;font-weight:800}.field input,.field select,.field textarea{width:100%;padding:13px;border:1px solid #cfd8e5;border-radius:10px;background:#fff;font:inherit}.field textarea{min-height:120px}.trust{background:#fff;border-bottom:1px solid var(--line)}.trust-grid,.grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}.trust-grid{padding:20px 0}.trust-item{font-weight:800}.section{padding:78px 0}.white{background:#fff}.section h2,.page-hero h1{font-size:clamp(32px,4vw,52px);line-height:1.12;margin:0 0 12px}.lead{font-size:18px;color:var(--muted)}.grid-2{display:grid;grid-template-columns:repeat(2,1fr);gap:24px}.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.card p{color:var(--muted)}.media{padding:0;overflow:hidden}.media img{width:100%;height:220px;object-fit:cover}.media .body{padding:22px}.page-hero{padding:76px 0 55px;background:linear-gradient(135deg,#11213d,#285489);color:#fff}.cta{padding:48px;border-radius:26px;background:linear-gradient(135deg,#ff6b22,#ff965e);color:#fff}.table-wrap{overflow:auto;background:#fff;border:1px solid var(--line);border-radius:16px}.table{width:100%;border-collapse:collapse;min-width:780px}.table th,.table td{text-align:left;padding:14px 16px;border-bottom:1px solid #edf1f5}.table th{background:#f8fafc;color:#667085;font-size:12px;text-transform:uppercase}.account{display:grid;grid-template-columns:270px 1fr;gap:28px;padding:38px 0 80px}.account aside{background:#fff;border:1px solid var(--line);border-radius:17px;padding:18px;height:max-content;position:sticky;top:94px}.account aside a{display:block;padding:10px 12px;border-radius:9px;font-weight:700;color:#475467}.account aside a.active,.account aside a:hover{background:#fff1e9;color:#b54708}.account-content{min-width:0}.toolbar{display:flex;justify-content:space-between;align-items:center;gap:15px;margin-bottom:20px}.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.stat strong{display:block;font-size:30px}.timeline-item{position:relative;padding:0 0 24px 42px}.timeline-item:before{content:'';position:absolute;left:13px;top:7px;width:13px;height:13px;border-radius:50%;background:#ccd6e3}.timeline-item:after{content:'';position:absolute;left:19px;top:20px;width:2px;height:calc(100% - 7px);background:#dce3ec}.timeline-item:last-child:after{display:none}.timeline-item.done:before{background:var(--green)}.timeline-item.active:before{background:var(--orange);box-shadow:0 0 0 6px #fff1e9}.auth{min-height:calc(100vh - 76px);display:grid;place-items:center;padding:50px 20px;background:linear-gradient(135deg,#eef4ff,#fff4ee)}.auth-card{width:min(500px,100%);background:#fff;padding:32px;border-radius:22px;box-shadow:var(--shadow)}footer{background:#0c1b31;color:#cbd7e8;padding:58px 0 20px}.footer-grid{display:grid;grid-template-columns:2fr repeat(3,1fr);gap:36px}.footer-grid img{width:210px;filter:brightness(0) invert(1)}footer a{display:block;margin:7px 0}.copyright{border-top:1px solid #ffffff22;margin-top:30px;padding-top:20px}.admin-side{position:fixed;inset:0 auto 0 0;width:275px;background:#0d1b2f;color:#cbd5e1;padding:18px 16px;overflow:auto;z-index:70}.admin-logo{display:block;color:#fff;font-size:22px;font-weight:900;padding:8px 10px 20px}.admin-logo small{display:block;color:#ff9d6b;font-size:12px}.admin-group span{display:block;padding:9px 10px;color:#718096;text-transform:uppercase;font-size:11px;font-weight:900}.admin-group a{display:block;padding:9px 10px;border-radius:8px;font-weight:700;font-size:14px}.admin-group a:hover,.admin-group a.active{background:#1c3151;color:#fff}.admin-main{margin-left:275px;min-height:100vh}.admin-top{height:74px;background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 28px;position:sticky;top:0;z-index:60}.admin-top button{display:none}.admin-content{padding:28px}.order-layout{display:grid;grid-template-columns:1.5fr .7fr;gap:22px}@media(max-width:1100px){.nav nav{display:none;position:absolute;top:76px;left:0;right:0;background:#fff;padding:20px;flex-direction:column;align-items:stretch}.nav nav.open{display:flex}.nav-toggle{display:block}.grid-4{grid-template-columns:repeat(2,1fr)}.admin-side{transform:translateX(-100%);transition:.25s}.admin-side.open{transform:none}.admin-main{margin-left:0}.admin-top button{display:block}.order-layout{grid-template-columns:1fr}}@media(max-width:760px){.shell{width:calc(100% - 24px)}.hero{min-height:auto;padding:50px 0}.hero-grid,.grid-2,.grid-3,.grid-4,.trust-grid,.footer-grid,.account{grid-template-columns:1fr}.form-grid{grid-template-columns:1fr}.field.full{grid-column:auto}.section{padding:55px 0}.account aside{position:static}.stats{grid-template-columns:1fr 1fr}.admin-content{padding:16px}.toolbar{align-items:stretch;flex-direction:column}.hero h1{font-size:42px}}@media(max-width:460px){.stats{grid-template-columns:1fr}.brand img{width:190px}}



/* =========================================================
   INSTANTLCD PUBLIC HEADER
   ========================================================= */

:root {
    --header-white: #ffffff;
    --header-background: #ffffff;
    --header-soft: #f5f7fa;
    --header-border: #e4e9f0;
    --header-text: #14213d;
    --header-muted: #667085;
    --header-primary: #ff641f;
    --header-primary-dark: #e84e0a;
    --header-primary-soft: #fff0e8;
    --header-blue: #145bd7;
    --header-success: #12805c;
    --header-dark: #0e1c32;
    --header-shadow: 0 12px 40px rgba(15, 35, 65, 0.08);
}

body {
    margin: 0;
}

body.nav-open {
    overflow: hidden;
}

.public-header {
    position: sticky;
    top: 0;
    z-index: 1000;
    width: 100%;
    background: var(--header-background);
    box-shadow: 0 1px 0 var(--header-border);
}

.public-header__top {
    background: var(--header-dark);
    color: #dce5f2;
}

.public-header__top-inner {
    min-height: 38px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    font-size: 12px;
    font-weight: 700;
}

.public-header__top-left,
.public-header__top-right {
    display: flex;
    align-items: center;
    gap: 20px;
}

.public-header__top-right a {
    color: #ffffff;
    text-decoration: none;
    transition:
        color 0.2s ease,
        opacity 0.2s ease;
}

.public-header__top-right a:hover {
    color: #ff9a69;
}

.header-benefit {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    white-space: nowrap;
}

.header-benefit__icon {
    width: 17px;
    height: 17px;
    border-radius: 50%;
    display: inline-grid;
    place-items: center;
    background: rgba(255, 255, 255, 0.13);
    color: #ffffff;
    font-size: 10px;
    font-weight: 900;
}

.header-top-separator {
    width: 1px;
    height: 15px;
    background: rgba(255, 255, 255, 0.2);
}

.public-header__main {
    background: rgba(255, 255, 255, 0.98);
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
}

.public-navigation {
    min-height: 84px;
    display: flex;
    align-items: center;
    gap: 34px;
}

.public-brand {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
}

.public-brand img {
    display: block;
    width: 235px;
    max-height: 58px;
    object-fit: contain;
}

.public-navigation__menu {
    min-width: 0;
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 26px;
}

.public-navigation__links {
    display: flex;
    align-items: center;
    gap: 4px;
}

.public-nav-link {
    position: relative;
    display: inline-flex;
    align-items: center;
    min-height: 44px;
    padding: 0 11px;
    border-radius: 10px;
    color: var(--header-text);
    font-size: 14px;
    font-weight: 750;
    text-decoration: none;
    white-space: nowrap;
    transition:
        color 0.2s ease,
        background 0.2s ease,
        transform 0.2s ease;
}

.public-nav-link::after {
    content: "";
    position: absolute;
    left: 12px;
    right: 12px;
    bottom: 4px;
    height: 2px;
    border-radius: 999px;
    background: var(--header-primary);
    transform: scaleX(0);
    transform-origin: center;
    transition: transform 0.2s ease;
}

.public-nav-link:hover {
    color: var(--header-primary-dark);
    background: var(--header-primary-soft);
}

.public-nav-link:hover::after,
.public-nav-link.is-active::after {
    transform: scaleX(1);
}

.public-nav-link.is-active {
    color: var(--header-primary-dark);
}

.public-navigation__actions {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    gap: 10px;
}

.header-account-button {
    min-height: 50px;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 8px 13px;
    border: 1px solid var(--header-border);
    border-radius: 13px;
    color: var(--header-text);
    background: var(--header-white);
    text-decoration: none;
    font-size: 13px;
    font-weight: 850;
    line-height: 1.15;
    transition:
        border-color 0.2s ease,
        background 0.2s ease,
        transform 0.2s ease,
        box-shadow 0.2s ease;
}

.header-account-button small,
.header-repair-button small {
    display: block;
    margin-bottom: 3px;
    color: var(--header-muted);
    font-size: 10px;
    font-weight: 750;
}

.header-account-button:hover,
.header-account-button.is-active {
    border-color: #b9c7da;
    background: #f8fafc;
    transform: translateY(-1px);
    box-shadow: 0 8px 20px rgba(15, 35, 65, 0.08);
}

.header-account-button__icon {
    width: 31px;
    height: 31px;
    border-radius: 10px;
    display: grid;
    place-items: center;
    background: #eef4ff;
    color: var(--header-blue);
}

.header-account-button__icon svg {
    width: 19px;
    height: 19px;
}

.header-repair-button {
    min-height: 52px;
    display: inline-flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 8px 11px 8px 16px;
    border: 1px solid var(--header-primary);
    border-radius: 14px;
    color: #ffffff;
    background:
        linear-gradient(
            135deg,
            var(--header-primary),
            #ff7f42
        );
    box-shadow: 0 9px 24px rgba(255, 100, 31, 0.25);
    text-decoration: none;
    font-size: 13px;
    font-weight: 900;
    line-height: 1.15;
    transition:
        transform 0.2s ease,
        box-shadow 0.2s ease,
        background 0.2s ease;
}

.header-repair-button small {
    color: rgba(255, 255, 255, 0.78);
}

.header-repair-button:hover {
    transform: translateY(-2px);
    background:
        linear-gradient(
            135deg,
            var(--header-primary-dark),
            var(--header-primary)
        );
    box-shadow: 0 13px 30px rgba(255, 100, 31, 0.34);
}

.header-repair-button__arrow {
    width: 32px;
    height: 32px;
    border-radius: 10px;
    display: grid;
    place-items: center;
    background: rgba(255, 255, 255, 0.18);
    font-size: 19px;
    transition: transform 0.2s ease;
}

.header-repair-button:hover .header-repair-button__arrow {
    transform: translateX(3px);
}

.public-navigation__toggle {
    display: none;
    width: 48px;
    height: 48px;
    border: 1px solid var(--header-border);
    border-radius: 13px;
    background: var(--header-white);
    cursor: pointer;
    padding: 0;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 5px;
}

.nav-toggle-line {
    width: 22px;
    height: 2px;
    border-radius: 999px;
    background: var(--header-text);
    transition:
        transform 0.25s ease,
        opacity 0.2s ease;
}

.public-navigation__toggle.is-open .nav-toggle-line:nth-child(1) {
    transform: translateY(7px) rotate(45deg);
}

.public-navigation__toggle.is-open .nav-toggle-line:nth-child(2) {
    opacity: 0;
}

.public-navigation__toggle.is-open .nav-toggle-line:nth-child(3) {
    transform: translateY(-7px) rotate(-45deg);
}

.public-header__mobile-trust {
    display: none;
    border-top: 1px solid var(--header-border);
    border-bottom: 1px solid var(--header-border);
    background: #f8fafc;
}

.public-header__mobile-trust-inner {
    min-height: 38px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    overflow-x: auto;
    scrollbar-width: none;
    color: #475467;
    font-size: 11px;
    font-weight: 750;
    white-space: nowrap;
}

.public-header__mobile-trust-inner::-webkit-scrollbar {
    display: none;
}

/* =========================================================
   LARGE LAPTOPS
   ========================================================= */

@media (max-width: 1320px) {
    .public-navigation {
        gap: 22px;
    }

    .public-brand img {
        width: 205px;
    }

    .public-navigation__links {
        gap: 1px;
    }

    .public-nav-link {
        padding-left: 8px;
        padding-right: 8px;
        font-size: 13px;
    }

    .header-account-button {
        padding-left: 10px;
        padding-right: 10px;
    }

    .header-account-button__icon {
        display: none;
    }

    .header-repair-button {
        padding-left: 13px;
    }
}

/* =========================================================
   TABLET AND MOBILE MENU
   ========================================================= */

@media (max-width: 1100px) {
    .public-header__top {
        display: none;
    }

    .public-navigation {
        min-height: 74px;
        justify-content: space-between;
    }

    .public-brand img {
        width: 210px;
    }

    .public-navigation__toggle {
        display: inline-flex;
        flex: 0 0 auto;
    }

    .public-navigation__menu {
        position: fixed;
        top: 74px;
        left: 0;
        right: 0;
        max-height: calc(100vh - 74px);
        overflow-y: auto;
        display: block;
        padding:
            18px
            max(20px, calc((100vw - 1480px) / 2));
        border-top: 1px solid var(--header-border);
        border-bottom: 1px solid var(--header-border);
        background: rgba(255, 255, 255, 0.99);
        box-shadow: var(--header-shadow);
        opacity: 0;
        visibility: hidden;
        transform: translateY(-12px);
        transition:
            opacity 0.22s ease,
            visibility 0.22s ease,
            transform 0.22s ease;
    }

    .public-navigation__menu.is-open {
        opacity: 1;
        visibility: visible;
        transform: translateY(0);
    }

    .public-navigation__links {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 8px;
    }

    .public-nav-link {
        min-height: 50px;
        padding: 0 15px;
        border: 1px solid var(--header-border);
        background: #ffffff;
    }

    .public-nav-link::after {
        display: none;
    }

    .public-nav-link:hover,
    .public-nav-link.is-active {
        border-color: #ffc5aa;
        background: var(--header-primary-soft);
    }

    .public-navigation__actions {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 10px;
        margin-top: 14px;
        padding-top: 14px;
        border-top: 1px solid var(--header-border);
    }

    .header-account-button,
    .header-repair-button {
        width: 100%;
    }

    .header-account-button__icon {
        display: grid;
    }

    .public-header__mobile-trust {
        display: block;
    }
}

/* =========================================================
   SMALL MOBILE
   ========================================================= */

@media (max-width: 620px) {
    .public-brand img {
        width: 185px;
    }

    .public-navigation__menu {
        padding: 14px 12px 22px;
    }

    .public-navigation__links {
        grid-template-columns: 1fr;
    }

    .public-navigation__actions {
        grid-template-columns: 1fr;
    }

    .public-nav-link {
        min-height: 48px;
    }

    .header-account-button,
    .header-repair-button {
        min-height: 56px;
    }

    .public-header__mobile-trust-inner {
        justify-content: flex-start;
        gap: 20px;
    }
}

/* =========================================================
   LANDSCAPE MOBILE
   ========================================================= */

@media (
    max-width: 950px
) and (
    orientation: landscape
) {
    .public-navigation__menu {
        max-height: calc(100vh - 74px);
    }

    .public-navigation__links {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .public-navigation__actions {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

/* =========================================================
   ACCESSIBILITY
   ========================================================= */

.public-nav-link:focus-visible,
.header-account-button:focus-visible,
.header-repair-button:focus-visible,
.public-navigation__toggle:focus-visible {
    outline: 3px solid rgba(20, 91, 215, 0.3);
    outline-offset: 3px;
}

@media (prefers-reduced-motion: reduce) {
    .public-navigation__menu,
    .public-navigation__toggle,
    .nav-toggle-line,
    .public-nav-link,
    .header-account-button,
    .header-repair-button,
    .header-repair-button__arrow {
        transition: none;
    }
}


/* /public_html/nou/assets/css/admin.css */

:root {
    --admin-sidebar-width: 292px;
    --admin-topbar-height: 76px;
    --admin-bg: #f3f6fa;
    --admin-surface: #ffffff;
    --admin-surface-soft: #f8fafc;
    --admin-sidebar: #08111f;
    --admin-sidebar-soft: #0d1a2d;
    --admin-border: #e2e8f0;
    --admin-border-dark: rgba(255, 255, 255, 0.09);
    --admin-text: #0f172a;
    --admin-muted: #64748b;
    --admin-muted-light: #94a3b8;
    --admin-primary: #ff6a00;
    --admin-primary-dark: #db5200;
    --admin-primary-soft: #fff1e8;
    --admin-success: #15803d;
    --admin-warning: #b45309;
    --admin-danger: #dc2626;
    --admin-shadow-sm: 0 8px 24px rgba(15, 23, 42, 0.06);
    --admin-shadow-lg: 0 24px 60px rgba(15, 23, 42, 0.14);
    --admin-radius-sm: 10px;
    --admin-radius: 16px;
    --admin-radius-lg: 22px;
}

* {
    box-sizing: border-box;
}

html {
    min-width: 320px;
    background: var(--admin-bg);
}

body.admin-body {
    min-width: 320px;
    min-height: 100vh;
    margin: 0;
    overflow-x: hidden;
    color: var(--admin-text);
    background:
        radial-gradient(circle at 92% -10%, rgba(255, 106, 0, 0.09), transparent 24rem),
        var(--admin-bg);
    font-family:
        Inter,
        ui-sans-serif,
        system-ui,
        -apple-system,
        BlinkMacSystemFont,
        "Segoe UI",
        sans-serif;
}

body.admin-menu-open {
    overflow: hidden;
}

.admin-shell {
    min-height: 100vh;
}

.admin-sidebar {
    position: fixed;
    inset: 0 auto 0 0;
    z-index: 1000;
    display: flex;
    width: var(--admin-sidebar-width);
    min-height: 100vh;
    flex-direction: column;
    overflow: hidden;
    color: #e5edf8;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.025), transparent 30%),
        var(--admin-sidebar);
    border-right: 1px solid rgba(255, 255, 255, 0.06);
}

.admin-sidebar::before {
    position: absolute;
    top: -10rem;
    left: -8rem;
    width: 22rem;
    height: 22rem;
    content: "";
    pointer-events: none;
    border-radius: 50%;
    background: rgba(255, 106, 0, 0.09);
    filter: blur(12px);
}

.admin-sidebar__header {
    position: relative;
    z-index: 1;
    display: flex;
    min-height: var(--admin-topbar-height);
    align-items: center;
    justify-content: space-between;
    padding: 14px 18px;
    border-bottom: 1px solid var(--admin-border-dark);
}

.admin-brand {
    display: inline-flex;
    min-width: 0;
    align-items: center;
    gap: 12px;
    color: #fff;
    text-decoration: none;
}

.admin-brand__mark {
    display: grid;
    width: 44px;
    height: 44px;
    flex: 0 0 44px;
    place-items: center;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.13);
    border-radius: 13px;
    background: #fff;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.18);
}

.admin-brand__mark img {
    display: block;
    width: 36px;
    height: 36px;
    object-fit: contain;
}

.admin-brand__text {
    display: flex;
    min-width: 0;
    flex-direction: column;
    line-height: 1.08;
}

.admin-brand__text strong {
    overflow: hidden;
    color: #fff;
    font-size: 18px;
    font-weight: 800;
    letter-spacing: -0.03em;
    text-overflow: ellipsis;
}

.admin-brand__text small {
    margin-top: 5px;
    color: var(--admin-muted-light);
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 0.15em;
    text-transform: uppercase;
}

.admin-sidebar__close {
    display: none;
    width: 40px;
    height: 40px;
    cursor: pointer;
    color: #fff;
    border: 0;
    border-radius: 11px;
    background: rgba(255, 255, 255, 0.08);
    font-size: 28px;
    line-height: 1;
}

.admin-sidebar__search {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    margin: 17px 16px 10px;
}

.admin-sidebar__search input {
    width: 100%;
    min-width: 0;
    height: 44px;
    padding: 0 42px 0 41px;
    color: #eaf0f8;
    border: 1px solid rgba(255, 255, 255, 0.09);
    outline: none;
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.055);
    font: inherit;
    font-size: 13px;
    transition:
        border-color 0.2s ease,
        background-color 0.2s ease,
        box-shadow 0.2s ease;
}

.admin-sidebar__search input::placeholder {
    color: #718198;
}

.admin-sidebar__search input:focus {
    border-color: rgba(255, 106, 0, 0.7);
    background: rgba(255, 255, 255, 0.08);
    box-shadow: 0 0 0 3px rgba(255, 106, 0, 0.12);
}

.admin-sidebar__search-icon {
    position: absolute;
    left: 13px;
    display: grid;
    width: 18px;
    height: 18px;
    place-items: center;
    color: #8fa0b7;
    pointer-events: none;
}

.admin-sidebar__search-icon svg,
.admin-sidebar__search kbd {
    width: 18px;
    height: 18px;
}

.admin-sidebar__search-icon svg,
.admin-topbar svg,
.admin-nav-item svg,
.admin-profile-card__logout svg,
.admin-user-menu svg {
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.admin-sidebar__search kbd {
    position: absolute;
    right: 11px;
    display: grid;
    width: 23px;
    height: 23px;
    place-items: center;
    color: #8595aa;
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 6px;
    background: rgba(255, 255, 255, 0.05);
    font-family: inherit;
    font-size: 11px;
}

.admin-navigation {
    position: relative;
    z-index: 1;
    flex: 1 1 auto;
    overflow-x: hidden;
    overflow-y: auto;
    padding: 5px 12px 18px;
    scrollbar-color: rgba(255, 255, 255, 0.14) transparent;
    scrollbar-width: thin;
}

.admin-navigation::-webkit-scrollbar {
    width: 5px;
}

.admin-navigation::-webkit-scrollbar-track {
    background: transparent;
}

.admin-navigation::-webkit-scrollbar-thumb {
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.14);
}

.admin-nav-group {
    margin: 5px 0 11px;
}

.admin-nav-group__toggle {
    display: flex;
    width: 100%;
    min-height: 34px;
    align-items: center;
    justify-content: space-between;
    padding: 6px 9px;
    cursor: pointer;
    color: #78899f;
    border: 0;
    background: transparent;
    font: inherit;
    font-size: 10px;
    font-weight: 900;
    letter-spacing: 0.13em;
    text-align: left;
    text-transform: uppercase;
}

.admin-nav-group__toggle svg {
    width: 15px;
    height: 15px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
    transition: transform 0.2s ease;
}

.admin-nav-group.is-open .admin-nav-group__toggle svg {
    transform: rotate(180deg);
}

.admin-nav-group__items {
    display: grid;
    max-height: 0;
    gap: 3px;
    overflow: hidden;
    opacity: 0;
    transition:
        max-height 0.28s ease,
        opacity 0.2s ease;
}

.admin-nav-group.is-open .admin-nav-group__items {
    max-height: 900px;
    opacity: 1;
}

.admin-nav-item {
    position: relative;
    display: flex;
    min-width: 0;
    min-height: 52px;
    align-items: center;
    gap: 12px;
    padding: 8px 10px;
    color: #aebacd;
    border: 1px solid transparent;
    border-radius: 12px;
    text-decoration: none;
    transition:
        color 0.18s ease,
        border-color 0.18s ease,
        background-color 0.18s ease,
        transform 0.18s ease;
}

.admin-nav-item:hover {
    color: #fff;
    border-color: rgba(255, 255, 255, 0.07);
    background: rgba(255, 255, 255, 0.055);
    transform: translateX(2px);
}

.admin-nav-item.is-active {
    color: #fff;
    border-color: rgba(255, 106, 0, 0.25);
    background:
        linear-gradient(90deg, rgba(255, 106, 0, 0.22), rgba(255, 106, 0, 0.07));
    box-shadow: inset 3px 0 0 var(--admin-primary);
}

.admin-nav-item__icon {
    display: grid;
    width: 34px;
    height: 34px;
    flex: 0 0 34px;
    place-items: center;
    color: #8fa1b8;
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.05);
}

.admin-nav-item:hover .admin-nav-item__icon,
.admin-nav-item.is-active .admin-nav-item__icon {
    color: #ffb784;
    background: rgba(255, 106, 0, 0.14);
}

.admin-nav-item__icon svg {
    width: 19px;
    height: 19px;
}

.admin-nav-item__content {
    display: flex;
    min-width: 0;
    flex: 1;
    flex-direction: column;
}

.admin-nav-item__content strong {
    overflow: hidden;
    font-size: 13px;
    font-weight: 700;
    line-height: 1.2;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.admin-nav-item__content small {
    display: none;
    margin-top: 4px;
    overflow: hidden;
    color: #718198;
    font-size: 10px;
    line-height: 1.25;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.admin-nav-item__active-dot {
    width: 7px;
    height: 7px;
    flex: 0 0 7px;
    border-radius: 50%;
    background: var(--admin-primary);
    box-shadow: 0 0 0 4px rgba(255, 106, 0, 0.13);
}

.admin-navigation__empty {
    margin: 18px 8px;
    padding: 16px;
    color: #8fa0b7;
    border: 1px dashed rgba(255, 255, 255, 0.12);
    border-radius: 12px;
    font-size: 12px;
    text-align: center;
}

.admin-sidebar__footer {
    position: relative;
    z-index: 1;
    padding: 13px;
    border-top: 1px solid var(--admin-border-dark);
    background: rgba(0, 0, 0, 0.12);
}

.admin-profile-card {
    display: flex;
    min-width: 0;
    align-items: center;
    gap: 10px;
    padding: 9px;
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.045);
}

.admin-avatar {
    display: grid;
    width: 40px;
    height: 40px;
    flex: 0 0 40px;
    place-items: center;
    color: #fff;
    border: 2px solid rgba(255, 255, 255, 0.4);
    border-radius: 50%;
    background:
        linear-gradient(145deg, #ff8a35, var(--admin-primary-dark));
    box-shadow: 0 8px 18px rgba(255, 106, 0, 0.2);
    font-size: 12px;
    font-weight: 900;
    letter-spacing: 0.03em;
}

.admin-avatar--small {
    width: 36px;
    height: 36px;
    flex-basis: 36px;
    font-size: 11px;
}

.admin-profile-card__identity {
    display: flex;
    min-width: 0;
    flex: 1;
    flex-direction: column;
}

.admin-profile-card__identity strong {
    overflow: hidden;
    color: #f5f8fc;
    font-size: 12px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.admin-profile-card__identity small {
    margin-top: 3px;
    overflow: hidden;
    color: #8292a8;
    font-size: 10px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.admin-profile-card__logout {
    display: grid;
    width: 35px;
    height: 35px;
    flex: 0 0 35px;
    place-items: center;
    color: #9aa9bc;
    border-radius: 10px;
    text-decoration: none;
}

.admin-profile-card__logout:hover {
    color: #fff;
    background: rgba(220, 38, 38, 0.18);
}

.admin-profile-card__logout svg {
    width: 18px;
    height: 18px;
}

.admin-workspace {
    display: flex;
    min-height: 100vh;
    flex-direction: column;
    margin-left: var(--admin-sidebar-width);
}

.admin-topbar {
    position: sticky;
    top: 0;
    z-index: 900;
    display: flex;
    min-height: var(--admin-topbar-height);
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 0 28px;
    border-bottom: 1px solid rgba(226, 232, 240, 0.9);
    background: rgba(255, 255, 255, 0.9);
    box-shadow: 0 8px 30px rgba(15, 23, 42, 0.035);
    backdrop-filter: blur(18px);
}

.admin-topbar__left,
.admin-topbar__actions {
    display: flex;
    min-width: 0;
    align-items: center;
}

.admin-topbar__left {
    gap: 13px;
}

.admin-topbar__actions {
    gap: 9px;
}

.admin-menu-button,
.admin-topbar-action {
    display: inline-grid;
    width: 42px;
    height: 42px;
    place-items: center;
    color: #475569;
    border: 1px solid var(--admin-border);
    border-radius: 12px;
    background: #fff;
    box-shadow: 0 3px 10px rgba(15, 23, 42, 0.035);
    text-decoration: none;
    transition:
        color 0.18s ease,
        border-color 0.18s ease,
        background-color 0.18s ease,
        transform 0.18s ease;
}

.admin-menu-button {
    display: none;
    cursor: pointer;
}

.admin-menu-button:hover,
.admin-topbar-action:hover {
    color: var(--admin-primary-dark);
    border-color: #fed7bd;
    background: var(--admin-primary-soft);
    transform: translateY(-1px);
}

.admin-menu-button svg,
.admin-topbar-action svg {
    width: 20px;
    height: 20px;
}

.admin-page-heading {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.admin-page-heading span {
    color: #94a3b8;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 0.13em;
    text-transform: uppercase;
}

.admin-page-heading strong {
    margin-top: 3px;
    overflow: hidden;
    color: var(--admin-text);
    font-size: 20px;
    font-weight: 850;
    letter-spacing: -0.035em;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.admin-topbar-action--site {
    display: inline-flex;
    width: auto;
    padding: 0 14px;
    gap: 8px;
    font-size: 12px;
    font-weight: 750;
}

.admin-user-menu {
    position: relative;
}

.admin-user-menu__toggle {
    display: flex;
    min-width: 0;
    align-items: center;
    gap: 10px;
    padding: 5px 7px 5px 6px;
    cursor: pointer;
    color: var(--admin-text);
    border: 1px solid var(--admin-border);
    border-radius: 14px;
    background: #fff;
    font: inherit;
    box-shadow: 0 3px 10px rgba(15, 23, 42, 0.035);
}

.admin-user-menu__name {
    display: flex;
    max-width: 160px;
    min-width: 0;
    flex-direction: column;
    align-items: flex-start;
    text-align: left;
}

.admin-user-menu__name strong,
.admin-user-menu__name small {
    overflow: hidden;
    max-width: 100%;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.admin-user-menu__name strong {
    font-size: 12px;
}

.admin-user-menu__name small {
    margin-top: 2px;
    color: var(--admin-muted);
    font-size: 10px;
}

.admin-user-menu__chevron {
    width: 16px;
    height: 16px;
    color: #94a3b8;
    transition: transform 0.18s ease;
}

.admin-user-menu.is-open .admin-user-menu__chevron {
    transform: rotate(180deg);
}

.admin-user-menu__dropdown {
    position: absolute;
    top: calc(100% + 10px);
    right: 0;
    z-index: 1200;
    width: 250px;
    padding: 8px;
    border: 1px solid var(--admin-border);
    border-radius: 16px;
    background: #fff;
    box-shadow: var(--admin-shadow-lg);
}

.admin-user-menu__dropdown[hidden] {
    display: none;
}

.admin-user-menu__summary {
    display: flex;
    min-width: 0;
    align-items: center;
    gap: 10px;
    margin-bottom: 7px;
    padding: 10px;
    border-radius: 12px;
    background: var(--admin-surface-soft);
}

.admin-user-menu__summary > span:last-child {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.admin-user-menu__summary strong,
.admin-user-menu__summary small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.admin-user-menu__summary strong {
    font-size: 12px;
}

.admin-user-menu__summary small {
    margin-top: 3px;
    color: var(--admin-muted);
    font-size: 10px;
}

.admin-user-menu__dropdown > a {
    display: block;
    padding: 10px 11px;
    color: #334155;
    border-radius: 9px;
    font-size: 12px;
    font-weight: 650;
    text-decoration: none;
}

.admin-user-menu__dropdown > a:hover {
    color: var(--admin-primary-dark);
    background: var(--admin-primary-soft);
}

.admin-user-menu__dropdown > a.is-danger {
    color: var(--admin-danger);
}

.admin-user-menu__dropdown > a.is-danger:hover {
    background: #fef2f2;
}

.admin-user-menu__dropdown hr {
    height: 1px;
    margin: 6px 4px;
    border: 0;
    background: var(--admin-border);
}

.admin-content {
    flex: 1 1 auto;
    min-width: 0;
    padding: 28px;
}

.admin-content__inner {
    width: min(100%, 1680px);
    margin: 0 auto;
}

.admin-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
    padding: 17px 28px;
    color: #94a3b8;
    border-top: 1px solid var(--admin-border);
    background: rgba(255, 255, 255, 0.7);
    font-size: 11px;
}

.admin-sidebar-overlay {
    position: fixed;
    inset: 0;
    z-index: 990;
    display: none;
    opacity: 0;
    background: rgba(2, 6, 23, 0.68);
    backdrop-filter: blur(3px);
    transition: opacity 0.2s ease;
}

/* Common admin page components */
.admin-content .toolbar {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 22px;
}

.admin-content .toolbar h1 {
    margin: 0;
    color: var(--admin-text);
    font-size: clamp(25px, 3vw, 36px);
    font-weight: 900;
    letter-spacing: -0.045em;
    line-height: 1.05;
}

.admin-content .toolbar p {
    max-width: 720px;
    margin: 8px 0 0;
    color: var(--admin-muted);
    line-height: 1.6;
}

.admin-content .btn {
    display: inline-flex;
    min-height: 43px;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 10px 16px;
    cursor: pointer;
    color: #334155;
    border: 1px solid var(--admin-border);
    border-radius: 11px;
    background: #fff;
    box-shadow: 0 4px 12px rgba(15, 23, 42, 0.04);
    font: inherit;
    font-size: 13px;
    font-weight: 800;
    text-decoration: none;
    transition:
        transform 0.18s ease,
        border-color 0.18s ease,
        background-color 0.18s ease,
        box-shadow 0.18s ease;
}

.admin-content .btn:hover {
    transform: translateY(-1px);
    border-color: #cbd5e1;
    box-shadow: 0 9px 22px rgba(15, 23, 42, 0.08);
}

.admin-content .btn.primary {
    color: #fff;
    border-color: var(--admin-primary);
    background:
        linear-gradient(135deg, #ff7d20, var(--admin-primary-dark));
    box-shadow: 0 10px 24px rgba(255, 106, 0, 0.22);
}

.admin-content .btn.primary:hover {
    border-color: var(--admin-primary-dark);
    background:
        linear-gradient(135deg, #ff6a00, #c94700);
}

.admin-content .stats {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 16px;
}

.admin-content .stat,
.admin-content .panel,
.admin-content .card {
    border: 1px solid rgba(226, 232, 240, 0.96);
    background: rgba(255, 255, 255, 0.95);
    box-shadow: var(--admin-shadow-sm);
}

.admin-content .stat {
    position: relative;
    min-height: 130px;
    overflow: hidden;
    padding: 22px;
    border-radius: var(--admin-radius);
}

.admin-content .stat::after {
    position: absolute;
    right: -25px;
    bottom: -45px;
    width: 110px;
    height: 110px;
    content: "";
    border-radius: 50%;
    background: rgba(255, 106, 0, 0.07);
}

.admin-content .stat small {
    position: relative;
    z-index: 1;
    display: block;
    color: var(--admin-muted);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.admin-content .stat strong {
    position: relative;
    z-index: 1;
    display: block;
    margin-top: 14px;
    color: var(--admin-text);
    font-size: clamp(27px, 3vw, 37px);
    font-weight: 900;
    letter-spacing: -0.045em;
    line-height: 1;
}

.admin-content .grid-2 {
    display: grid;
    grid-template-columns: minmax(0, 1.3fr) minmax(310px, 0.7fr);
    gap: 18px;
}

.admin-content .panel {
    min-width: 0;
    padding: 20px;
    border-radius: var(--admin-radius-lg);
}

.admin-content .panel > h2 {
    margin: 0 0 17px;
    color: var(--admin-text);
    font-size: 17px;
    font-weight: 850;
    letter-spacing: -0.025em;
}

.admin-content .card {
    margin-top: 10px;
    padding: 16px;
    border-radius: 13px;
    box-shadow: none;
    transition:
        transform 0.18s ease,
        border-color 0.18s ease,
        box-shadow 0.18s ease;
}

.admin-content .card:hover {
    transform: translateY(-1px);
    border-color: #cbd5e1;
    box-shadow: 0 8px 20px rgba(15, 23, 42, 0.055);
}

.admin-content .card h3 {
    margin: 8px 0 5px;
    color: var(--admin-text);
    font-size: 14px;
}

.admin-content .card h3 a {
    color: inherit;
    text-decoration: none;
}

.admin-content .card h3 a:hover {
    color: var(--admin-primary-dark);
}

.admin-content .card p {
    margin: 0;
    color: var(--admin-muted);
    font-size: 12px;
    line-height: 1.55;
}

.admin-content .badge {
    display: inline-flex;
    min-height: 25px;
    align-items: center;
    padding: 4px 9px;
    color: #9a4100;
    border: 1px solid #fed7aa;
    border-radius: 999px;
    background: #fff7ed;
    font-size: 10px;
    font-weight: 850;
}

.admin-content .badge.red {
    color: #b91c1c;
    border-color: #fecaca;
    background: #fef2f2;
}

.admin-content table {
    width: 100%;
    border-collapse: collapse;
    border-spacing: 0;
}

.admin-content th,
.admin-content td {
    padding: 13px 12px;
    border-bottom: 1px solid var(--admin-border);
    text-align: left;
    vertical-align: middle;
}

.admin-content th {
    color: #64748b;
    background: #f8fafc;
    font-size: 10px;
    font-weight: 850;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.admin-content td {
    color: #334155;
    font-size: 12px;
}

.admin-content input,
.admin-content select,
.admin-content textarea {
    max-width: 100%;
    color: var(--admin-text);
    border: 1px solid #d7dee8;
    outline: 0;
    border-radius: 11px;
    background: #fff;
    font: inherit;
    transition:
        border-color 0.18s ease,
        box-shadow 0.18s ease;
}

.admin-content input,
.admin-content select {
    min-height: 43px;
    padding: 9px 12px;
}

.admin-content textarea {
    min-height: 120px;
    padding: 12px;
    resize: vertical;
}

.admin-content input:focus,
.admin-content select:focus,
.admin-content textarea:focus {
    border-color: var(--admin-primary);
    box-shadow: 0 0 0 3px rgba(255, 106, 0, 0.11);
}

.admin-content .field label {
    display: block;
    margin-bottom: 7px;
    color: #334155;
    font-size: 11px;
    font-weight: 800;
}

@media (max-width: 1240px) {
    .admin-content .stats {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .admin-topbar-action--site span {
        display: none;
    }

    .admin-topbar-action--site {
        width: 42px;
        padding: 0;
    }
}

@media (max-width: 1024px) {
    .admin-sidebar {
        width: min(88vw, var(--admin-sidebar-width));
        transform: translateX(-105%);
        box-shadow: var(--admin-shadow-lg);
        transition: transform 0.24s ease;
    }

    .admin-menu-open .admin-sidebar {
        transform: translateX(0);
    }

    .admin-sidebar__close,
    .admin-menu-button {
        display: grid;
        place-items: center;
    }

    .admin-menu-open .admin-sidebar-overlay {
        display: block;
        opacity: 1;
    }

    .admin-workspace {
        margin-left: 0;
    }

    .admin-content {
        padding: 22px;
    }

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

    .admin-nav-item__content small {
        display: block;
    }
}

@media (max-width: 720px) {
    .admin-topbar {
        min-height: 68px;
        padding: 0 14px;
    }

    .admin-content {
        padding: 17px 13px 24px;
    }

    .admin-page-heading span,
    .admin-user-menu__name {
        display: none;
    }

    .admin-page-heading strong {
        max-width: 42vw;
        font-size: 17px;
    }

    .admin-topbar__actions {
        gap: 6px;
    }

    .admin-topbar-action--site {
        display: none;
    }

    .admin-user-menu__toggle {
        padding: 4px;
        border-radius: 50%;
    }

    .admin-user-menu__chevron {
        display: none;
    }

    .admin-user-menu__dropdown {
        position: fixed;
        top: 75px;
        right: 12px;
        left: 12px;
        width: auto;
    }

    .admin-content .toolbar {
        flex-direction: column;
        align-items: stretch;
    }

    .admin-content .toolbar .btn {
        width: 100%;
    }

    .admin-content .stats {
        grid-template-columns: 1fr;
        gap: 11px;
    }

    .admin-content .stat {
        min-height: 108px;
        padding: 18px;
    }

    .admin-content .panel {
        padding: 15px;
        border-radius: 16px;
    }

    .admin-content .grid-2 {
        gap: 13px;
    }

    .admin-footer {
        flex-direction: column;
        align-items: flex-start;
        padding: 16px;
    }

    .admin-content table {
        min-width: 700px;
    }

    .admin-content .table-wrap,
    .admin-content .panel:has(table) {
        overflow-x: auto;
    }
}

@media (max-width: 420px) {
    .admin-page-heading strong {
        max-width: 36vw;
        font-size: 15px;
    }

    .admin-menu-button,
    .admin-topbar-action {
        width: 39px;
        height: 39px;
    }

    .admin-avatar--small {
        width: 34px;
        height: 34px;
        flex-basis: 34px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .admin-sidebar,
    .admin-sidebar-overlay,
    .admin-nav-group__items,
    .admin-nav-group__toggle svg,
    .admin-nav-item,
    .admin-content .card,
    .admin-content .btn {
        scroll-behavior: auto;
        transition: none;
    }
}