*, *::before, *::after { box-sizing: border-box; }
body {
    font-family: 'Inter', sans-serif;
    background-color: #F5F5F0;
    min-height: 100vh;
    padding-top: env(safe-area-inset-top);
    margin: 0;
}
.font-serif { font-family: 'Playfair Display', serif; }

.holk-layout {
    display: flex;
    min-height: 100vh;
}

.holk-sidebar {
    width: 240px;
    flex-shrink: 0;
    background: #fff;
    border-right: 1px solid rgba(0,0,0,0.06);
    padding: 28px 16px;
    position: sticky;
    top: 0;
    height: 100vh;
    overflow-y: auto;
    display: none;
    flex-direction: column;
    z-index: 1000;
    transition: all 0.3s ease;
}
@media (min-width: 768px) {
    .holk-sidebar { display: flex; }
}
.sidebar-brand {
    font-family: 'Playfair Display', serif;
    font-size: 1.1rem;
    font-weight: 700;
    color: #5A5A40;
    margin-bottom: 4px;
}
.sidebar-brand-sub {
    font-size: 0.65rem;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    color: rgba(26,26,26,0.35);
    font-weight: 600;
}
.sidebar-nav { 
    margin-top: 24px; 
    flex: 1;
    padding: 0;
}
.sidebar-nav a {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 14px;
    border-radius: 14px;
    color: rgba(26,26,26,0.55);
    font-size: 0.875rem;
    font-weight: 500;
    text-decoration: none;
    transition: all 0.2s;
    margin-bottom: 2px;
    min-height: 44px;
    justify-content: flex-start;
}
.sidebar-nav a svg {
    width: 16px;
    height: 16px;
    flex-shrink: 0;
    stroke-width: 1.5;
}
.sidebar-nav a:hover {
    background: rgba(90,90,64,0.06);
    color: #5A5A40;
}
.sidebar-nav a:focus-visible {
    outline: 2px solid #5A5A40;
    outline-offset: 2px;
}
.sidebar-nav a.active {
    background: #5A5A40;
    color: #fff;
    box-shadow: 0 8px 16px rgba(90,90,64,0.25);
    font-weight: 600;
}
.sidebar-nav a.active svg { stroke: #fff; }
.sidebar-divider {
    font-size: 0.6rem;
    text-transform: uppercase;
    letter-spacing: 0.15em;
    color: rgba(26,26,26,0.25);
    font-weight: 700;
    padding: 12px 14px 4px;
}
.sidebar-footer {
    border-top: 1px solid rgba(0,0,0,0.06);
    padding-top: 16px;
    margin-top: auto;
}
.sidebar-user {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 14px;
    border-radius: 14px;
    background: rgba(90,90,64,0.05);
    min-height: 44px;
}
.sidebar-user-avatar {
    width: 36px; height: 36px;
    background: rgba(90,90,64,0.12);
    border-radius: 10px;
    display: flex; align-items: center; justify-content: center;
    color: #5A5A40; flex-shrink: 0;
}
.sidebar-user-name { 
    font-size: 0.825rem; 
    font-weight: 600; 
    color: #1A1A1A;
    line-height: 1.2;
}
.sidebar-user-role { 
    font-size: 0.7rem; 
    color: rgba(26,26,26,0.4);
    line-height: 1.2;
}

.holk-main {
    flex: 1;
    padding: 32px 28px;
    min-width: 0;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}
@media (max-width: 767px) {
    .holk-main { 
        padding: 20px 16px; 
        padding-bottom: 110px;
        overflow-y: auto;
    }
}

.bottom-nav {
    display: none;
    position: fixed;
    bottom: 0; left: 0; right: 0;
    background: #fff;
    border-top: 1px solid rgba(0,0,0,0.07);
    z-index: 1020;
    padding-bottom: env(safe-area-inset-bottom);
    box-shadow: 0 -2px 12px rgba(0,0,0,0.06);
}
@media (max-width: 767px) { 
    .bottom-nav { display: flex; } 
}
.bottom-nav a,
.bottom-nav .mobile-more-button {
    flex: 1 1 20%;
    min-width: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 4px;
    padding: 8px 4px;
    min-height: 64px;
    color: rgba(26,26,26,0.42);
    text-decoration: none;
    font-size: clamp(8px, 2.25vw, 10px);
    font-weight: 700;
    text-transform: none;
    letter-spacing: 0;
    line-height: 1.1;
    text-align: center;
    white-space: normal;
    overflow-wrap: anywhere;
    transition: color .2s, background .2s;
}
.bottom-nav a:active,
.bottom-nav a.active,
.bottom-nav .mobile-more-button:active {
    color: #5A5A40;
    background: rgba(90,90,64,0.06);
}
.bottom-nav a:hover,
.bottom-nav .mobile-more-button:hover { color: #5A5A40; }
.bottom-nav a:focus-visible,
.bottom-nav .mobile-more-button:focus-visible { outline: 2px solid #5A5A40; outline-offset: -3px; }
.bottom-nav a i,
.bottom-nav .mobile-more-button i { width: 21px; height: 21px; flex: 0 0 auto; }
.bottom-nav a span,
.bottom-nav .mobile-more-button span { line-height: 1.1; max-width: 100%; }
.mobile-menu-trigger { display: none; }
.mobile-menu-overlay { display: none; position: fixed; inset: 0; z-index: 2000; background: rgba(26,26,26,.42); backdrop-filter: blur(3px); }
.mobile-menu-overlay.open { display: block; }
.mobile-menu-panel { position: absolute; right: 0; top: 0; bottom: 0; width: min(88vw, 390px); background: #fff; padding: calc(22px + env(safe-area-inset-top)) 20px calc(24px + env(safe-area-inset-bottom)); overflow-y: auto; box-shadow: -12px 0 40px rgba(0,0,0,.18); }
.mobile-menu-close { width: 44px; height: 44px; border: 0; border-radius: 14px; background: #F5F5F0; color: #5A5A40; font-size: 24px; cursor: pointer; }
.mobile-menu-heading { margin: 24px 0 8px; font-size: .68rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: rgba(26,26,26,.35); }
.mobile-menu-link { display: flex; align-items: center; gap: 12px; min-height: 50px; padding: 12px 14px; margin: 4px 0; border-radius: 15px; color: rgba(26,26,26,.68); text-decoration: none; font-weight: 600; font-size: .9rem; }
.mobile-menu-link.active, .mobile-menu-link:active { color: #5A5A40; background: rgba(90,90,64,.09); }
.mobile-menu-link:focus-visible, .mobile-menu-close:focus-visible { outline: 2px solid #5A5A40; outline-offset: 2px; }
@media (max-width: 767px) { .mobile-menu-trigger { display: inline-flex; position: fixed; top: calc(12px + env(safe-area-inset-top)); right: 14px; z-index: 1500; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; border: 0; border-radius: 14px; background: #fff; color: #5A5A40; cursor: pointer; box-shadow: 0 4px 16px rgba(0,0,0,.10); } }

.btn-primary-holk {
    background: #5A5A40;
    color: #fff;
    padding: 11px 24px;
    border-radius: 14px;
    font-weight: 700;
    font-size: 0.825rem;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    border: none;
    cursor: pointer;
    transition: all 0.2s;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    text-decoration: none;
    min-height: 44px;
    justify-content: center;
}
.btn-primary-holk:hover {
    background: #4a4a34;
    box-shadow: 0 8px 20px rgba(90,90,64,0.3);
    transform: translateY(-1px);
    color: #fff;
}
.btn-primary-holk:focus-visible {
    outline: 2px solid #fff;
    outline-offset: 2px;
}
.btn-primary-holk:active {
    transform: translateY(0);
}

.btn-ghost-holk {
    background: transparent;
    color: rgba(26,26,26,0.55);
    padding: 11px 24px;
    border-radius: 14px;
    font-weight: 600;
    font-size: 0.825rem;
    border: 1.5px solid rgba(0,0,0,0.1);
    cursor: pointer;
    transition: all 0.2s;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    text-decoration: none;
    min-height: 44px;
    justify-content: center;
}
.btn-ghost-holk:hover {
    border-color: #5A5A40;
    color: #5A5A40;
    background: rgba(90,90,64,0.02);
}
.btn-ghost-holk:focus-visible {
    outline: 2px solid #5A5A40;
    outline-offset: 2px;
}

.btn-danger-holk {
    background: #ef4444;
    color: #fff;
    padding: 10px 18px;
    border-radius: 12px;
    font-weight: 600;
    font-size: 0.8rem;
    border: none;
    cursor: pointer;
    transition: all 0.2s;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 44px;
}
.btn-danger-holk:hover { 
    background: #dc2626;
    box-shadow: 0 4px 12px rgba(239, 68, 68, 0.3);
}
.btn-danger-holk:focus-visible {
    outline: 2px solid #7f1d1d;
    outline-offset: 2px;
}

.holk-card {
    background: #fff;
    border-radius: 2.5rem;
    border: 1px solid rgba(0,0,0,0.05);
    box-shadow: 0 2px 8px rgba(0,0,0,0.04);
    transition: box-shadow 0.2s;
    padding: 24px;
}
@media (max-width: 767px) {
    .holk-card {
        padding: 16px;
        border-radius: 2rem;
    }
}
.holk-card:hover { 
    box-shadow: 0 6px 24px rgba(0,0,0,0.08); 
}

.holk-input {
    width: 100%;
    padding: 11px 16px;
    border: 1.5px solid rgba(0,0,0,0.1);
    border-radius: 14px;
    font-family: 'Inter', sans-serif;
    font-size: 0.9rem;
    color: #1A1A1A;
    transition: all 0.2s;
    background: #fff;
    outline: none;
    min-height: 44px;
}
.holk-input:focus {
    border-color: #5A5A40;
    box-shadow: 0 0 0 3px rgba(90,90,64,0.1);
}
.holk-label {
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: rgba(26,26,26,0.4);
    display: block;
    margin-bottom: 8px;
}
.holk-badge {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 6px 12px;
    border-radius: 20px;
    font-size: 0.75rem;
    font-weight: 600;
    min-height: 24px;
    white-space: nowrap;
}
.badge-active   { background: #dcfce7; color: #16a34a; }
.badge-warning  { background: #fef9c3; color: #ca8a04; }
.badge-critical { background: #fee2e2; color: #dc2626; }
.badge-expired  { background: #f1f5f9; color: #64748b; }
.badge-unknown  { background: #f3f4f6; color: #9ca3af; }

.page-header { margin-bottom: 2rem; }
@media (max-width: 767px) {
    .page-header { margin-bottom: 1.5rem; }
}

.page-title {
    font-family: 'Playfair Display', serif;
    font-size: 2rem;
    font-weight: 700;
    color: #1A1A1A;
    margin: 0 0 4px 0;
    line-height: 1.2;
}
@media (max-width: 767px) {
    .page-title {
        font-size: 1.5rem;
    }
}

.page-subtitle {
    color: rgba(26,26,26,0.4);
    font-size: 0.9rem;
    font-weight: 500;
    line-height: 1.4;
}
@media (max-width: 767px) {
    .page-subtitle {
        font-size: 0.85rem;
    }
}

.holk-modal {
    display: none;
    position: fixed;
    inset: 0;
    z-index: 1060;
    align-items: center;
    justify-content: center;
}
.holk-modal.open { display: flex; }
.holk-modal-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(0,0,0,0.4);
    backdrop-filter: blur(4px);
}
.holk-modal-box {
    position: relative;
    background: #fff;
    border-radius: 2.5rem;
    padding: 2rem;
    width: 100%;
    max-width: 500px;
    margin: 16px;
    box-shadow: 0 25px 60px rgba(0,0,0,0.2);
    max-height: 90vh;
    overflow-y: auto;
}
@media (max-width: 767px) {
    .holk-modal-box {
        padding: 1.5rem;
        border-radius: 2rem;
    }
}
.holk-modal-title {
    font-family: 'Playfair Display', serif;
    font-size: 1.4rem;
    font-weight: 700;
    color: #1A1A1A;
    margin-bottom: 1.5rem;
    line-height: 1.2;
}

.holk-table { 
    width: 100%; 
    border-collapse: collapse; 
    font-size: 0.9rem;
}
@media (max-width: 767px) {
    .holk-table {
        font-size: 0.85rem;
    }
}
.holk-table th {
    font-size: 0.65rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    color: rgba(26,26,26,0.4);
    padding: 12px 16px;
    text-align: left;
    border-bottom: 1px solid rgba(0,0,0,0.06);
}
@media (max-width: 767px) {
    .holk-table th {
        padding: 10px 12px;
        font-size: 0.6rem;
    }
}
.holk-table td {
    padding: 16px;
    border-bottom: 1px solid rgba(0,0,0,0.04);
    font-size: 0.9rem;
    color: #1A1A1A;
    vertical-align: middle;
}
@media (max-width: 767px) {
    .holk-table td {
        padding: 12px;
        font-size: 0.85rem;
    }
}
.holk-table tr:last-child td { border-bottom: none; }
.holk-table tr:hover td { background: rgba(90,90,64,0.02); }

.stat-card {
    background: #fff;
    border-radius: 2.5rem;
    border: 1px solid rgba(0,0,0,0.05);
    padding: 2rem;
    box-shadow: 0 2px 8px rgba(0,0,0,0.04);
    transition: all 0.2s;
}
@media (max-width: 767px) {
    .stat-card {
        padding: 1.25rem;
        border-radius: 2rem;
    }
}
.stat-card:hover { 
    box-shadow: 0 8px 24px rgba(0,0,0,0.08); 
    transform: translateY(-2px);
}
.stat-icon {
    width: 48px; height: 48px;
    border-radius: 16px;
    display: flex; 
    align-items: center; 
    justify-content: center;
    margin-bottom: 1.5rem;
    flex-shrink: 0;
}
@media (max-width: 767px) {
    .stat-icon {
        width: 40px;
        height: 40px;
        margin-bottom: 1rem;
    }
}
.stat-icon-olive { background: rgba(90,90,64,0.1); color: #5A5A40; }
.stat-icon-green { background: #dcfce7; color: #16a34a; }
.stat-icon-red   { background: #fee2e2; color: #dc2626; }
.stat-icon-blue  { background: #dbeafe; color: #2563eb; }
.stat-icon-yellow{ background: #fef9c3; color: #ca8a04; }
.stat-label {
    font-size: 0.65rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    color: rgba(26,26,26,0.4);
    margin-bottom: 8px;
}
@media (max-width: 767px) {
    .stat-label {
        font-size: 0.6rem;
        margin-bottom: 6px;
    }
}
.stat-value {
    font-family: 'Playfair Display', serif;
    font-size: 2.2rem;
    font-weight: 700;
    color: #1A1A1A;
    line-height: 1;
}
@media (max-width: 767px) {
    .stat-value {
        font-size: 1.5rem;
    }
}

*:focus-visible {
    outline: 2px solid #5A5A40;
    outline-offset: 2px;
}

@media (max-width: 360px) {
    .holk-card {
        padding: 12px;
        border-radius: 1.5rem;
    }
    .stat-card {
        padding: 1rem;
    }
    .btn-primary-holk,
    .btn-ghost-holk {
        padding: 10px 16px;
        font-size: 0.75rem;
    }
}

@media (max-height: 500px) and (orientation: landscape) {
    .page-title {
        font-size: 1.25rem;
        margin-bottom: 0;
    }
    .page-subtitle {
        font-size: 0.75rem;
    }
    .stat-card {
        padding: 1rem;
    }
}

body {
    padding-top: env(safe-area-inset-top);
}

.holk-main {
    padding-right: env(safe-area-inset-right);
    padding-left: env(safe-area-inset-left);
}

@media (max-width: 767px) {
    .holk-main {
        padding-bottom: calc(110px + env(safe-area-inset-bottom));
    }
}

.bottom-nav {
    padding-bottom: env(safe-area-inset-bottom);
}

@media print {
    .bottom-nav,
    .holk-sidebar {
        display: none;
    }
    .holk-main {
        padding-bottom: 20px;
    }
}

:root {
    color-scheme: light;
    --bg: #F5F5F0;
    --surface: #FFFFFF;
    --surface-soft: #FAFAF7;
    --text: #1A1A1A;
    --muted: rgba(26,26,26,.55);
    --border: rgba(0,0,0,.08);
    --accent: #5A5A40;
    --accent-hover: #4a4a34;
    --focus: rgba(90,90,64,.18);
}
[data-theme="dark"] {
    color-scheme: dark;
    --bg: #151612;
    --surface: #20221c;
    --surface-soft: #292b23;
    --text: #F5F5F0;
    --muted: rgba(245,245,240,.64);
    --border: rgba(245,245,240,.13);
    --accent: #b8bb83;
    --accent-hover: #d0d39a;
    --focus: rgba(184,187,131,.28);
}
body { background: var(--bg); color: var(--text); transition: background-color .25s ease, color .25s ease; }
.holk-sidebar, .bottom-nav, .mobile-menu-panel, .holk-card, .stat-card { background: var(--surface); color: var(--text); border-color: var(--border); }
.sidebar-brand, .sidebar-user-name, .stat-value, .holk-table td, .holk-input { color: var(--text); }
.sidebar-brand-sub, .sidebar-user-role, .stat-label, .holk-label { color: var(--muted); }
.sidebar-nav a, .bottom-nav a, .bottom-nav .mobile-more-button { color: var(--muted); }
.sidebar-nav a:hover, .bottom-nav a:hover { color: var(--accent); background: color-mix(in srgb, var(--accent) 12%, transparent); }
.holk-input, textarea.holk-input, select.holk-input { background: var(--surface-soft); border-color: var(--border); }
.holk-input:focus { border-color: var(--accent); box-shadow: 0 0 0 3px var(--focus); }
.holk-table th { background: var(--surface-soft); color: var(--muted); }
.holk-table td { border-color: var(--border); }
.holk-table tr:hover td { background: color-mix(in srgb, var(--accent) 8%, transparent); }
.mobile-menu-close, .mobile-menu-link { background: var(--surface-soft); color: var(--text); }
.mobile-menu-heading { color: var(--muted); }
.theme-toggle { display:inline-flex; align-items:center; justify-content:center; width:44px; height:44px; border:1px solid var(--border); border-radius:14px; background:var(--surface); color:var(--text); cursor:pointer; box-shadow:0 4px 14px rgba(0,0,0,.08); transition:all .2s ease; }
.theme-toggle:hover { color:var(--accent); border-color:var(--accent); transform:translateY(-1px); }
.theme-toggle:focus-visible { outline:2px solid var(--accent); outline-offset:2px; }
.theme-toggle-wrap { position:fixed; top:16px; right:70px; z-index:1490; }
@media (min-width:768px) { .theme-toggle-wrap { top:20px; right:24px; } }
@media print { .theme-toggle-wrap { display:none; } }

.premiumm-client-card {
    min-width: 0;
    border: 1px solid var(--border);
    border-radius: 1.25rem;
    padding: 1rem;
    background: var(--surface);
    color: var(--text);
    box-shadow: 0 6px 18px rgba(0,0,0,.035);
    transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}
.premiumm-client-card:hover { border-color: color-mix(in srgb, var(--accent) 45%, var(--border)); box-shadow: 0 10px 24px rgba(0,0,0,.07); transform: translateY(-1px); }
.premiumm-client-card-missing { border-color: #e7bd68; background: color-mix(in srgb, #fff8e7 82%, var(--surface)); }
[data-theme="dark"] .premiumm-client-card-missing { background: color-mix(in srgb, #60491f 35%, var(--surface)); border-color: #b88d3e; }
.premiumm-field-label { display:flex; align-items:center; gap:.4rem; margin-bottom:.4rem; font-size:.72rem; font-weight:700; letter-spacing:.03em; color:var(--muted); }
.premiumm-phone-required { border-color:#d69b2d !important; box-shadow:0 0 0 3px rgba(214,155,45,.12); }
@media (max-width: 639px) {
    .premiumm-client-card { padding: .9rem; border-radius: 1rem; }
    .premiumm-client-card .holk-input { min-height: 44px; font-size: .95rem; }
}

.integrations-page { max-width: 1180px; }
.integration-page-heading h1 { margin: 0; color: var(--text); font-family: 'Playfair Display', Georgia, serif; font-size: clamp(2.35rem, 5vw, 4.25rem); line-height: .98; letter-spacing: -.04em; }
.integration-page-heading p:not(.integration-eyebrow) { max-width: 560px; margin-top: .7rem; color: var(--muted); font-size: .96rem; line-height: 1.55; }
.integration-eyebrow { margin: 0 0 .65rem; color: var(--accent); font-size: .7rem; font-weight: 800; letter-spacing: .22em; text-transform: uppercase; }
.integration-key-field { position: relative; display: flex; align-items: center; gap: .55rem; }
.integration-key-field .holk-input { min-width: 0; flex: 1; }
.integration-key-status { display: inline-flex; align-items: center; gap: .3rem; white-space: nowrap; border-radius: 999px; padding: .5rem .7rem; background: #e8f7ed; color: #19713c; font-size: .7rem; font-weight: 800; }
.integration-help { margin-top: .45rem; color: var(--muted); font-size: .72rem; line-height: 1.45; }
[data-theme="dark"] .integration-key-status { background: #193d29; color: #a4e5ba; }
@media (max-width: 767px) {
    .integrations-page { padding-left: 1rem; padding-right: 1rem; padding-top: 5.2rem; }
    .integration-page-heading h1 { font-size: 2.8rem; }
    .integration-key-field { align-items: stretch; flex-direction: column; }
    .integration-key-status { width: fit-content; }
    .integrations-page .holk-card { border-radius: 1.4rem; padding: 1.15rem; }
}

.pending-payments-card { padding: 1.35rem; }
.pending-payments-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:1rem; }
.pending-payments-heading h3 { margin:.1rem 0 0; color:var(--text); font-family:'Playfair Display',Georgia,serif; font-size:1.55rem; }
.pending-payments-heading p { margin-top:.35rem; color:var(--muted); font-size:.82rem; line-height:1.45; }
.pending-payments-list { display:grid; gap:.7rem; margin-top:1.2rem; }
.pending-payment-row { display:grid; grid-template-columns:minmax(0,1fr) auto auto; align-items:center; gap:1rem; padding:.85rem; border:1px solid var(--border); border-radius:1rem; background:var(--surface-soft); }
.pending-payment-client { display:flex; min-width:0; align-items:center; gap:.7rem; }
.pending-payment-client strong, .pending-payment-client span, .pending-payment-meta strong, .pending-payment-meta span { display:block; }
.pending-payment-client strong { overflow:hidden; color:var(--text); text-overflow:ellipsis; white-space:nowrap; font-size:.9rem; }
.pending-payment-client span, .pending-payment-meta span { margin-top:.2rem; color:var(--muted); font-size:.72rem; }
.pending-payment-avatar { display:flex; width:2.3rem; height:2.3rem; flex-shrink:0; align-items:center; justify-content:center; border-radius:.8rem; background:var(--accent); color:#fff; font-weight:800; }
.pending-payment-meta { text-align:right; }
.pending-payment-meta strong { color:var(--text); font-size:.9rem; }
.btn-approve-payment { display:inline-flex; align-items:center; justify-content:center; gap:.4rem; min-height:2.55rem; border:0; border-radius:.8rem; padding:.65rem .9rem; background:#19713c; color:#fff; font-size:.76rem; font-weight:800; cursor:pointer; transition:filter .2s ease, transform .2s ease; }
.btn-approve-payment:hover { filter:brightness(1.08); transform:translateY(-1px); }
@media (max-width: 639px) {
    .pending-payments-card { padding:1rem; }
    .pending-payments-heading { flex-direction:column; }
    .pending-payment-row { grid-template-columns:1fr auto; gap:.75rem; }
    .pending-payment-client { grid-column:1 / -1; }
    .pending-payment-meta { text-align:left; }
    .pending-payment-row form { justify-self:stretch; }
    .btn-approve-payment { width:100%; }
}

.page-header { margin: 0 0 1.5rem; }
.page-title { margin: 0; color: var(--text); font-family: 'Playfair Display', Georgia, serif; font-size: clamp(2rem, 4vw, 3.15rem); font-weight: 700; line-height: 1.05; letter-spacing: -.035em; }
.page-subtitle { margin: .55rem 0 0; color: var(--muted); font-size: .92rem; line-height: 1.5; }
.payments-page .holk-card, .page-header + .holk-card { background: var(--surface); color: var(--text); border-color: var(--border); }
.payments-page h3, .payments-page label, .payments-page span, .payments-page p { color: inherit; }
.payments-page .text-\[\#1A1A1A\], .payments-page .text-\[\#1A1A1A\]\/40, .payments-page .text-\[\#1A1A1A\]\/60 { color: var(--text) !important; }
[data-theme="dark"] .page-header + .holk-card .bg-blue-50 { background: #1e304b; }
[data-theme="dark"] .page-header + .holk-card .bg-green-50 { background: #183a27; }
@media (max-width: 639px) {
    .page-header { margin-bottom: 1rem; padding: 0 .25rem; }
    .page-title { font-size: 2.25rem; }
    .page-subtitle { max-width: 34rem; font-size: .84rem; }
}

html { background: var(--bg); }
.auth-page { min-height:100vh; background:var(--bg) !important; color:var(--text); transition:background-color .25s ease,color .25s ease; }
.auth-page main, .auth-page .auth-card { background:var(--surface) !important; color:var(--text) !important; border-color:var(--border) !important; }
.auth-page h1, .auth-page h2, .auth-page h3, .auth-page label, .auth-page strong { color:var(--text) !important; }
.auth-page p, .auth-page .muted, .auth-page small { color:var(--muted) !important; }
.auth-page input, .auth-page select, .auth-page textarea { background:var(--surface-soft) !important; color:var(--text) !important; border-color:var(--border) !important; }
.auth-page input::placeholder, .auth-page textarea::placeholder { color:var(--muted) !important; }
.auth-page a:not(.btn-primary-holk) { color:var(--accent) !important; }
.auth-page .theme-toggle-wrap { position:fixed; top:1rem; right:1rem; z-index:20; }
.auth-page .theme-toggle { background:var(--surface); color:var(--text); }
.auth-page .bg-red-50 { background:color-mix(in srgb, #ef4444 12%, var(--surface)) !important; }
.auth-page .text-red-700 { color:#dc2626 !important; }
.auth-page .bg-green-50 { background:color-mix(in srgb, #22c55e 12%, var(--surface)) !important; }
.auth-page .text-green-700 { color:#15803d !important; }
[data-theme="dark"] .auth-page .text-red-700 { color:#fca5a5 !important; }
[data-theme="dark"] .auth-page .text-green-700 { color:#86efac !important; }
[data-theme="dark"] .auth-page .shadow-sm, [data-theme="dark"] .auth-page .shadow { box-shadow:0 18px 45px rgba(0,0,0,.28) !important; }

[data-theme="dark"] [class~="text-[#1A1A1A]"],
[data-theme="dark"] [class*="text-[#1A1A1A]/"] { color: var(--text) !important; }
[data-theme="dark"] [class~="text-black"],
[data-theme="dark"] [class*="text-black/"] { color: var(--text) !important; }
[data-theme="dark"] [class~="bg-white"],
[data-theme="dark"] [class~="bg-[#FAFAF7]"],
[data-theme="dark"] [class~="bg-[#F5F5F0]"] { background-color: var(--surface) !important; }
[data-theme="dark"] [class~="border-black/5"],
[data-theme="dark"] [class~="border-black/10"],
[data-theme="dark"] [class~="border-black/8"] { border-color: var(--border) !important; }
[data-theme="dark"] input[style*="background:#F5F5F0"],
[data-theme="dark"] textarea[style*="background:#F5F5F0"],
[data-theme="dark"] select[style*="background:#F5F5F0"],
[data-theme="dark"] div[style*="background:#F5F5F0"] { background: var(--surface-soft) !important; color: var(--text) !important; }
[data-theme="dark"] [style*="color:rgba(26,26,26"] { color: var(--muted) !important; }
[data-theme="dark"] .holk-table th, [data-theme="dark"] .holk-table td { color: var(--text); }
[data-theme="dark"] .holk-table th { background: var(--surface-soft); }
[data-theme="dark"] .modal-content, [data-theme="dark"] .modal, [data-theme="dark"] .modal-box { background: var(--surface) !important; color: var(--text) !important; }
[data-theme="dark"] .alert, [data-theme="dark"] .toast { color: var(--text); }

:root {
    --bg: #f6f7fb;
    --surface: #ffffff;
    --surface-soft: #eef1f6;
    --surface-raised: #ffffff;
    --text: #172033;
    --muted: #637084;
    --border: #dfe5ee;
    --accent: #5867d8;
    --accent-hover: #4655c4;
    --accent-soft: #e9ecff;
    --success: #168457;
    --success-soft: #e3f6ed;
    --warning: #b77912;
    --warning-soft: #fff3d8;
    --danger: #c43d4b;
    --danger-soft: #fde8eb;
    --info: #2775c9;
    --info-soft: #e4f0ff;
    --focus: #8390ff;
    color-scheme: light;
}
html[data-theme="dark"] {
    --bg: #0e1524;
    --surface: #172238;
    --surface-soft: #202d45;
    --surface-raised: #1c2940;
    --text: #edf2ff;
    --muted: #a9b7cd;
    --border: #30415e;
    --accent: #aab4ff;
    --accent-hover: #c0c7ff;
    --accent-soft: #2d3764;
    --success: #62d39d;
    --success-soft: #183d35;
    --warning: #f0c56a;
    --warning-soft: #493b20;
    --danger: #ff8995;
    --danger-soft: #4d2934;
    --info: #82baff;
    --info-soft: #203c5d;
    --focus: #b8c0ff;
    color-scheme: dark;
}
html, body { background: var(--bg); color: var(--text); }
body, .holk-layout, .holk-main { transition: background-color .2s ease, color .2s ease; }
.holk-sidebar, .bottom-nav, .mobile-menu-panel { background: var(--surface) !important; border-color: var(--border) !important; }
.sidebar-brand, .sidebar-user-avatar { color: var(--accent) !important; }
.sidebar-brand-sub, .sidebar-divider, .sidebar-user-role { color: var(--muted) !important; }
.sidebar-user-name { color: var(--text) !important; }
.sidebar-nav a, .bottom-nav a, .bottom-nav .mobile-more-button { color: var(--muted) !important; }
.sidebar-nav a:hover, .bottom-nav a:hover, .bottom-nav .mobile-more-button:hover { background: var(--accent-soft) !important; color: var(--accent) !important; }
.sidebar-nav a.active { background: var(--accent) !important; color: #fff !important; }
.sidebar-nav a.active svg { stroke: #fff !important; }
.holk-card, .card, .modal-content, .modal-box { background: var(--surface) !important; color: var(--text); border-color: var(--border) !important; }
.holk-card h1, .holk-card h2, .holk-card h3, .holk-card h4, .card h1, .card h2, .card h3, .card h4 { color: var(--text); }
.holk-card p, .card p, .description, .help-text, .text-muted { color: var(--muted); }
.holk-input, .holk-select, .holk-textarea, input, select, textarea { background: var(--surface-soft); color: var(--text); border-color: var(--border); }
.holk-input::placeholder, input::placeholder, textarea::placeholder { color: var(--muted); opacity: 1; }
.holk-input:focus, .holk-select:focus, .holk-textarea:focus, input:focus, select:focus, textarea:focus { border-color: var(--focus) !important; box-shadow: 0 0 0 3px color-mix(in srgb, var(--focus) 22%, transparent); outline: none; }
.holk-table, table { color: var(--text); border-color: var(--border); }
.holk-table th, table th { background: var(--surface-soft); color: var(--muted); border-color: var(--border); }
.holk-table td, table td { color: var(--text); border-color: var(--border); }
.holk-table tr:hover, table tr:hover { background: color-mix(in srgb, var(--accent-soft) 45%, transparent); }
svg, [data-lucide] { color: currentColor; }
.text-success, .status-success { color: var(--success) !important; }
.text-warning, .status-warning { color: var(--warning) !important; }
.text-danger, .status-danger { color: var(--danger) !important; }
.bg-success-soft { background: var(--success-soft) !important; }
.bg-warning-soft { background: var(--warning-soft) !important; }
.bg-danger-soft { background: var(--danger-soft) !important; }
.bg-info-soft { background: var(--info-soft) !important; }
[data-theme="dark"] [class~="bg-white"], [data-theme="dark"] [class~="bg-[#FAFAF7]"], [data-theme="dark"] [class~="bg-[#F5F5F0]"] { background-color: var(--surface) !important; }
[data-theme="dark"] [class~="text-[#1A1A1A]"], [data-theme="dark"] [class*="text-[#1A1A1A]/"], [data-theme="dark"] [class~="text-black"], [data-theme="dark"] [class*="text-black/"] { color: var(--text) !important; }
[data-theme="dark"] [class~="border-black/5"], [data-theme="dark"] [class~="border-black/10"], [data-theme="dark"] [class~="border-black/20"] { border-color: var(--border) !important; }
[data-theme="dark"] [style*="background:#F5F5F0"], [data-theme="dark"] [style*="background: #F5F5F0"], [data-theme="dark"] [style*="background-color:#F5F5F0"] { background: var(--surface-soft) !important; }
[data-theme="dark"] [style*="color:rgba(26,26,26"], [data-theme="dark"] [style*="color: #1A1A1A"] { color: var(--muted) !important; }

html[data-theme="aurora"] {
    --bg: #f4f1ff;
    --surface: #ffffff;
    --surface-soft: #eeeaff;
    --surface-raised: #ffffff;
    --text: #241b3a;
    --muted: #6e6384;
    --border: #ded5f3;
    --accent: #7956d8;
    --accent-hover: #6240bf;
    --accent-soft: #eee6ff;
    --success: #14856a;
    --success-soft: #e1f6ef;
    --warning: #aa7211;
    --warning-soft: #fff0d0;
    --danger: #bd3f67;
    --danger-soft: #fde7ef;
    --info: #397ac2;
    --info-soft: #e6f0ff;
    --focus: #9b7bf1;
    color-scheme: light;
}
html[data-theme="aurora"] .holk-sidebar,
html[data-theme="aurora"] .bottom-nav { background: linear-gradient(180deg, #ffffff 0%, #f4f0ff 100%) !important; }
html[data-theme="aurora"] .holk-card { box-shadow: 0 12px 30px rgba(93, 62, 160, .09); }
html[data-theme="aurora"] .sidebar-nav a.active { background: linear-gradient(135deg, #7956d8, #a071e9) !important; }
html[data-theme="aurora"] .theme-toggle { color: #7956d8; border-color: #ded5f3; }
[data-theme="dark"] .holk-main .text-gray-400, [data-theme="dark"] .holk-main .text-gray-500,
[data-theme="dark"] .holk-main .text-gray-600, [data-theme="dark"] .holk-main .text-slate-400,
[data-theme="dark"] .holk-main .text-slate-500, [data-theme="dark"] .holk-main .text-slate-600 { color: var(--muted) !important; }
[data-theme="dark"] .holk-main .text-gray-700, [data-theme="dark"] .holk-main .text-gray-800,
[data-theme="dark"] .holk-main .text-gray-900, [data-theme="dark"] .holk-main .text-slate-700,
[data-theme="dark"] .holk-main .text-slate-800, [data-theme="dark"] .holk-main .text-slate-900 { color: var(--text) !important; }
[data-theme="dark"] .holk-main .bg-gray-50, [data-theme="dark"] .holk-main .bg-gray-100,
[data-theme="dark"] .holk-main .bg-slate-50, [data-theme="dark"] .holk-main .bg-slate-100 { background: var(--surface-soft) !important; }
[data-theme="aurora"] .holk-main .text-gray-400, [data-theme="aurora"] .holk-main .text-gray-500,
[data-theme="aurora"] .holk-main .text-gray-600, [data-theme="aurora"] .holk-main .text-slate-400,
[data-theme="aurora"] .holk-main .text-slate-500, [data-theme="aurora"] .holk-main .text-slate-600 { color: var(--muted) !important; }
[data-theme="aurora"] .holk-main .text-gray-700, [data-theme="aurora"] .holk-main .text-gray-800,
[data-theme="aurora"] .holk-main .text-gray-900, [data-theme="aurora"] .holk-main .text-slate-700,
[data-theme="aurora"] .holk-main .text-slate-800, [data-theme="aurora"] .holk-main .text-slate-900 { color: var(--text) !important; }
[data-theme="aurora"] .holk-main .bg-gray-50, [data-theme="aurora"] .holk-main .bg-gray-100,
[data-theme="aurora"] .holk-main .bg-slate-50, [data-theme="aurora"] .holk-main .bg-slate-100 { background: var(--surface-soft) !important; }
.shortcut-label, .quick-action-label { color: var(--text) !important; }

:root {
  color-scheme: light;
  --bg: #f4f6fb;
  --surface: #ffffff;
  --surface-soft: #eef2f7;
  --surface-raised: #ffffff;
  --text: #172033;
  --muted: #647187;
  --border: #dce3ed;
  --accent: #4f46c8;
  --accent-hover: #3f37ad;
  --accent-soft: #e9e8ff;
  --success: #168457;
  --success-soft: #dff7eb;
  --warning: #a86d0a;
  --warning-soft: #fff0ca;
  --danger: #bd3549;
  --danger-soft: #fde4e8;
  --info: #276db6;
  --info-soft: #e2efff;
  --focus: #655ce6;
  --shadow: 0 12px 32px rgba(27, 38, 65, .08);
}
html[data-theme="dark"] {
  color-scheme: dark;
  --bg: #0d1424;
  --surface: #151f33;
  --surface-soft: #1d2a40;
  --surface-raised: #1a2740;
  --text: #f1f5ff;
  --muted: #aebbd0;
  --border: #31415d;
  --accent: #9b9aff;
  --accent-hover: #b7b5ff;
  --accent-soft: #2d2d59;
  --success: #59d69a;
  --success-soft: #173d31;
  --warning: #f4c667;
  --warning-soft: #493a1c;
  --danger: #ff8795;
  --danger-soft: #4a202b;
  --info: #82b9ff;
  --info-soft: #1a3858;
  --focus: #b5b2ff;
  --shadow: 0 18px 40px rgba(0, 0, 0, .28);
}
html[data-theme="aurora"] {
  color-scheme: light;
  --bg: #f3f1ff;
  --surface: #ffffff;
  --surface-soft: #eeebff;
  --surface-raised: #ffffff;
  --text: #241b3a;
  --muted: #6b6281;
  --border: #ddd5f2;
  --accent: #7556d8;
  --accent-hover: #5f42be;
  --accent-soft: #eee6ff;
  --success: #138260;
  --success-soft: #e0f7ef;
  --warning: #9a650b;
  --warning-soft: #fff0cf;
  --danger: #bd3f67;
  --danger-soft: #fde5ef;
  --info: #3978bc;
  --info-soft: #e4f0ff;
  --focus: #8b72e8;
  --shadow: 0 14px 34px rgba(93, 62, 160, .12);
}
html, body { min-height: 100%; }
body { background: var(--bg) !important; color: var(--text) !important; }
*, *::before, *::after { border-color: var(--border); }
.holk-main, .main-content, main { color: var(--text); }
.holk-card, .stat-card, .card, .modal-content, .panel, .table-card { background: var(--surface) !important; color: var(--text) !important; border-color: var(--border) !important; box-shadow: var(--shadow); }
.holk-card p, .stat-card p, .card p, .description, .meta, .text-muted { color: var(--muted); }
input, select, textarea, .holk-input, .holk-select, .holk-textarea { background: var(--surface) !important; color: var(--text) !important; border-color: var(--border) !important; }
input::placeholder, textarea::placeholder { color: var(--muted) !important; opacity: .9; }
input:focus, select:focus, textarea:focus, button:focus-visible, a:focus-visible { outline: 3px solid color-mix(in srgb, var(--focus) 38%, transparent); outline-offset: 2px; }
table, .holk-table { color: var(--text) !important; }
table th, .holk-table th { background: var(--surface-soft) !important; color: var(--muted) !important; border-color: var(--border) !important; }
table td, .holk-table td { color: var(--text) !important; border-color: var(--border) !important; }
svg, [data-lucide] { color: currentColor; stroke: currentColor; }
.icon { display: inline-block; flex: 0 0 auto; vertical-align: middle; }
.icon-sm { width: 20px; height: 20px; }
.icon-md { width: 19px; height: 19px; }
.icon-lg { width: 24px; height: 24px; }
.text-black, .text-gray-700, .text-gray-800, .text-gray-900, .text-slate-700, .text-slate-800, .text-slate-900, [class*="text-[#1A1A1A]"] { color: var(--text) !important; }
.text-gray-400, .text-gray-500, .text-gray-600, .text-slate-400, .text-slate-500, .text-slate-600 { color: var(--muted) !important; }
.bg-white, .bg-gray-50, .bg-gray-100, .bg-slate-50, .bg-slate-100 { background-color: var(--surface) !important; }
.border-black\/5, .border-black\/10, .border-black\/20 { border-color: var(--border) !important; }
.shortcut-label, .quick-action-label { color: var(--text) !important; }
.holk-sidebar, .bottom-nav, .mobile-menu-panel { background: var(--surface) !important; color: var(--text) !important; border-color: var(--border) !important; }
.sidebar-divider, .sidebar-brand-sub { color: var(--muted) !important; }
.sidebar-nav a, .bottom-nav a, .mobile-menu-nav a { color: var(--text); }
.sidebar-nav a:hover, .bottom-nav a:hover, .mobile-menu-nav a:hover { background: var(--accent-soft) !important; color: var(--accent) !important; }
.sidebar-nav a.active, .bottom-nav a.active { background: var(--accent) !important; color: #fff !important; }
.sidebar-nav a.active svg, .bottom-nav a.active svg { stroke: currentColor; }
.alert, [role="alert"] { color: var(--text); background: var(--surface-soft); border-color: var(--border); }
@media (max-width: 767px) {
  .holk-main, .main-content, main { padding-bottom: 76px; }
  .holk-table-wrap, .table-responsive { max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .holk-card, .stat-card, .card { border-radius: 1.25rem; }
  .action-row, .card-actions { flex-wrap: wrap; gap: .625rem; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
}

:root, html[data-theme="light"] {
  --olive: var(--accent);
  --line: var(--border);
  --green: var(--success);
  --amber: var(--warning);
}
html[data-theme="dark"], html[data-theme="aurora"] {
  --olive: var(--accent);
  --line: var(--border);
  --green: var(--success);
  --amber: var(--warning);
}
html[data-theme="dark"] .import-shell .card,
html[data-theme="aurora"] .import-shell .card,
html[data-theme="dark"] .import-shell .card-header,
html[data-theme="aurora"] .import-shell .card-header,
html[data-theme="dark"] .import-shell .form-control,
html[data-theme="aurora"] .import-shell .form-control,
html[data-theme="dark"] .import-shell .btn-outline-secondary,
html[data-theme="aurora"] .import-shell .btn-outline-secondary,
html[data-theme="dark"] .secure-label,
html[data-theme="aurora"] .secure-label { background: var(--surface) !important; color: var(--text) !important; border-color: var(--border) !important; }
html[data-theme="dark"] .import-shell .info-box,
html[data-theme="aurora"] .import-shell .info-box,
html[data-theme="dark"] .import-shell pre,
html[data-theme="aurora"] .import-shell pre,
html[data-theme="dark"] .import-shell .file-input { background: var(--surface-soft) !important; color: var(--text) !important; }
html[data-theme="dark"] .import-shell .alert,
html[data-theme="aurora"] .import-shell .alert { color: var(--text) !important; background: var(--surface-soft) !important; border-color: var(--border) !important; }
html[data-theme="dark"] .page-shell .card,
html[data-theme="aurora"] .page-shell .card { background: var(--surface) !important; color: var(--text) !important; border-color: var(--border) !important; }
html[data-theme="dark"] .page-shell .pill,
html[data-theme="aurora"] .page-shell .pill,
html[data-theme="dark"] .page-shell .summary,
html[data-theme="aurora"] .page-shell .summary { background: var(--surface-soft) !important; color: var(--text) !important; }
html[data-theme="dark"] .page-shell .hero,
html[data-theme="aurora"] .page-shell .hero { background: var(--accent) !important; }
@media (max-width: 639px) {
  .import-shell .row { display: block; }
  .import-shell .row > [class*="col-"] { margin-bottom: 14px; }
}

[class*="text-black/"] { color: var(--muted) !important; }
[class*="text-gray-"], [class*="text-slate-"] { color: var(--muted) !important; }
[class*="text-[var(--text)]"] { color: var(--text) !important; }
[class*="bg-[#FAFAF7]"], [class*="bg-[#F5F5F0]"], [class*="bg-white"] { background-color: var(--surface) !important; }
[class*="border-black/"] { border-color: var(--border) !important; }
.btn-primary-holk, .btn-primary, button[type="submit"].btn-primary-holk { background: var(--accent) !important; color: #fff !important; border-color: var(--accent) !important; }
.btn-primary-holk:hover, .btn-primary:hover { background: var(--accent-hover) !important; color: #fff !important; }
.btn-ghost-holk { color: var(--text) !important; border-color: var(--border) !important; background: transparent !important; }
.btn-ghost-holk:hover { color: var(--accent) !important; border-color: var(--accent) !important; background: var(--accent-soft) !important; }
.btn-danger-holk { background: var(--danger) !important; color: #fff !important; }
.btn-danger-holk:hover { background: color-mix(in srgb, var(--danger) 82%, #000) !important; }
.system-status-value { display: block; margin-top: .25rem; padding: .6rem .7rem; border-radius: .6rem; background: var(--surface-soft); color: var(--muted); font-size: .75rem; }
html[data-theme="dark"] .text-white\/70, html[data-theme="dark"] .text-white\/60, html[data-theme="dark"] .text-white\/50 { color: rgba(255,255,255,.78) !important; }

.theme-setting{display:flex;align-items:flex-start;gap:.75rem;padding:.85rem 1rem;border:1px solid var(--border);border-radius:14px;background:var(--surface-soft);color:var(--text);cursor:pointer;transition:border-color .15s,background .15s}
.theme-setting:hover{border-color:var(--accent);background:var(--surface)}
.theme-setting input{margin-top:.2rem;accent-color:var(--accent)}
.theme-setting strong{display:block;font-size:.82rem;color:var(--text)}
.theme-setting small{display:block;margin-top:.2rem;font-size:.72rem;color:var(--muted);line-height:1.45}
.instance-icon{color:var(--accent);stroke-width:2}
.holk-modal-title .btn-icon-holk{color:var(--muted)}
.holk-modal-title .btn-icon-holk:hover{color:var(--text)}

.theme-setting{position:relative;min-height:72px;align-items:center;padding:1rem 1rem 1rem 3.65rem;border-radius:16px;box-shadow:0 1px 0 color-mix(in srgb,var(--border) 45%,transparent);}
.theme-setting input[type="checkbox"]{position:absolute;left:1rem;top:50%;width:38px;height:22px;margin:0;transform:translateY(-50%);appearance:none;-webkit-appearance:none;border:1px solid var(--border);border-radius:999px;background:var(--surface);cursor:pointer;transition:background .18s,border-color .18s,box-shadow .18s;}
.theme-setting input[type="checkbox"]::after{content:"";position:absolute;top:3px;left:3px;width:14px;height:14px;border-radius:50%;background:var(--muted);box-shadow:0 1px 3px rgba(0,0,0,.18);transition:transform .18s,background .18s;}
.theme-setting input[type="checkbox"]:checked{background:var(--accent);border-color:var(--accent);}
.theme-setting input[type="checkbox"]:checked::after{transform:translateX(16px);background:#fff;}
.theme-setting input[type="checkbox"]:focus-visible{outline:3px solid var(--accent-soft);outline-offset:3px;}
.theme-setting:has(input[type="checkbox"]:checked){border-color:color-mix(in srgb,var(--accent) 65%,var(--border));background:color-mix(in srgb,var(--accent-soft) 42%,var(--surface-soft));}
.theme-setting:has(input[type="checkbox"]:checked) strong{color:var(--accent);}
@media (max-width:767px){.theme-setting{min-height:68px;padding-left:3.55rem}.theme-setting small{font-size:.7rem}}

html[data-theme="quebrada"] {
    color-scheme: dark;
    --bg: #150c05;
    --surface: #241408;
    --surface-soft: #2e1a0a;
    --surface-raised: #2a1709;
    --text: #fdf3df;
    --muted: #d9b98a;
    --border: #4a2c10;
    --accent: #d4a017;
    --accent-hover: #f0b82c;
    --accent-soft: #4a2c10;
    --success: #4fbf6b;
    --success-soft: #1c3322;
    --warning: #f0b82c;
    --warning-soft: #4a3a10;
    --danger: #c1121f;
    --danger-soft: #4a1015;
    --info: #d4a017;
    --info-soft: #3a2408;
    --focus: #f0b82c;
    --shadow: 0 14px 34px rgba(193, 18, 31, .28);
}

html[data-theme="quebrada"] .holk-sidebar,
html[data-theme="quebrada"] .bottom-nav {
    background: linear-gradient(180deg, #241408 0%, #1a0d05 100%) !important;
    border-color: var(--border) !important;
}

html[data-theme="quebrada"] .sidebar-nav a.active,
html[data-theme="quebrada"] .bottom-nav a.active {
    background: linear-gradient(135deg, #c1121f, #d4a017) !important;
    color: #fff !important;
    box-shadow: 0 6px 18px rgba(212, 160, 23, .35);
}

html[data-theme="quebrada"] .holk-card,
html[data-theme="quebrada"] .stat-card {
    border: 1px solid color-mix(in srgb, var(--accent) 35%, var(--border));
    box-shadow: 0 10px 26px rgba(193, 18, 31, .18);
}
html[data-theme="quebrada"] .holk-card:hover,
html[data-theme="quebrada"] .stat-card:hover {
    border-color: var(--accent);
    box-shadow: 0 12px 32px rgba(212, 160, 23, .28);
}

html[data-theme="quebrada"] .btn-primary-holk {
    background: linear-gradient(135deg, #c1121f, #8b0000) !important;
}
html[data-theme="quebrada"] .btn-primary-holk:hover {
    background: linear-gradient(135deg, #d4a017, #f0b82c) !important;
    color: #1a0d05 !important;
    box-shadow: 0 8px 22px rgba(212, 160, 23, .4);
}

html[data-theme="quebrada"] .theme-toggle {
    color: var(--accent);
    border-color: var(--accent);
    background: var(--surface);
}
html[data-theme="quebrada"] .theme-toggle:hover {
    box-shadow: 0 0 12px rgba(212, 160, 23, .45);
}

html[data-theme="quebrada"] .sidebar-brand {
    color: var(--accent) !important;
    text-shadow: 0 0 8px rgba(212, 160, 23, .35);
}

html[data-theme="quebrada"] .page-header {
    border-bottom: 2px solid transparent;
    border-image: linear-gradient(90deg, #c1121f, #d4a017) 1;
    padding-bottom: 10px;
}

html[data-theme="quebrada"] .badge-active   { background: #1c3322; color: #4fbf6b; }
html[data-theme="quebrada"] .badge-warning  { background: #4a3a10; color: #f0b82c; }
html[data-theme="quebrada"] .badge-critical { background: #4a1015; color: #ff8995; }

.holk-table th,
table th {
    background: var(--accent) !important;
    color: #ffffff !important;
}







.holk-modal .holk-modal-box {
    background: var(--surface, #ffffff) !important;
    color: var(--text, #172033) !important;
    border: 1px solid var(--border, #dfe5ee) !important;
    box-shadow: 0 25px 60px rgba(0,0,0,0.22);
}
.holk-modal .holk-modal-title {
    color: var(--text, #172033) !important;
}
.holk-modal .holk-label {
    color: var(--muted, #637084) !important;
}
.holk-modal .holk-input,
.holk-modal select,
.holk-modal textarea {
    background-color: var(--surface-soft, #eef1f6) !important;
    color: var(--text, #172033) !important;
    border: 1px solid var(--border, #dfe5ee) !important;
    box-shadow: none !important;
}
.holk-modal .holk-input:focus,
.holk-modal select:focus,
.holk-modal textarea:focus {
    background-color: var(--surface, #ffffff) !important;
    color: var(--text, #172033) !important;
    border-color: var(--accent, #5867d8) !important;
    box-shadow: 0 0 0 3px var(--accent-soft, #e9ecff) !important;
    outline: none;
}
.holk-modal select option {
    background-color: var(--surface, #ffffff);
    color: var(--text, #172033);
}
.holk-modal .btn-primary-holk {
    background-color: var(--accent, #5867d8) !important;
    color: #fff !important;
    border-color: var(--accent, #5867d8) !important;
    opacity: 1 !important;
}
.holk-modal .btn-primary-holk:hover {
    background-color: var(--accent-hover, #4655c4) !important;
    color: #fff !important;
}
.holk-modal .btn-ghost-holk {
    background-color: var(--surface-soft, #eef1f6) !important;
    color: var(--text, #172033) !important;
    border-color: var(--border, #dfe5ee) !important;
}
.holk-modal .btn-ghost-holk:hover {
    background-color: var(--accent-soft, #e9ecff) !important;
    color: var(--accent, #5867d8) !important;
    border-color: var(--accent, #5867d8) !important;
}
.holk-modal input::placeholder,
.holk-modal textarea::placeholder {
    color: var(--muted, #637084) !important;
    opacity: 1;
}


.instance-settings-modal .theme-setting {
    display: flex;
    position: relative;
    align-items: center;
    gap: 12px;
    min-height: 72px;
    padding: 14px 16px 14px 62px;
    border: 1px solid var(--border, #d9d9d0);
    border-radius: 16px;
    background: var(--surface-soft, #f5f5f0) !important;
    color: var(--text, #1a1a1a) !important;
    cursor: pointer;
    box-sizing: border-box;
}
.instance-settings-modal .theme-setting input[type="checkbox"] {
    position: absolute;
    left: 16px;
    top: 50%;
    width: 38px;
    height: 22px;
    margin: 0;
    transform: translateY(-50%);
    appearance: none;
    -webkit-appearance: none;
    border: 1px solid var(--border, #d9d9d0);
    border-radius: 99px;
    background: var(--surface, #ffffff) !important;
    cursor: pointer;
}
.instance-settings-modal .theme-setting input[type="checkbox"]::after {
    content: "";
    position: absolute;
    top: 3px;
    left: 3px;
    width: 14px;
    height: 14px;
    border-radius: 50%;
    background: var(--muted, #777) !important;
    transition: transform 0.18s, background 0.18s;
}
.instance-settings-modal .theme-setting input[type="checkbox"]:checked {
    background: var(--accent, #5867d8) !important;
    border-color: var(--accent, #5867d8) !important;
}
.instance-settings-modal .theme-setting input[type="checkbox"]:checked::after {
    transform: translateX(16px);
    background: #fff !important;
}
.instance-settings-modal .theme-setting input[type="checkbox"]:focus-visible {
    outline: 3px solid var(--accent-soft, #e9ecff);
    outline-offset: 3px;
}
.instance-settings-modal .theme-setting strong {
    display: block;
    color: var(--text, #1a1a1a) !important;
    font-size: 0.82rem;
}
.instance-settings-modal .theme-setting small {
    display: block;
    margin-top: 3px;
    color: var(--muted, #777) !important;
    font-size: 0.72rem;
    line-height: 1.4;
}
.instance-settings-modal textarea.holk-input {
    display: block;
    width: 100%;
    min-height: 78px;
    resize: vertical;
    background: var(--surface, #ffffff) !important;
    color: var(--text, #1a1a1a) !important;
    border: 1px solid var(--border, #d9d9d0) !important;
    padding: 12px 14px;
    box-sizing: border-box;
}
.instance-settings-modal textarea.holk-input::placeholder {
    color: var(--muted, #777) !important;
    opacity: 1;
}
@media (max-width: 640px) {
    .instance-settings-modal .theme-setting {
        min-height: 66px;
        padding-left: 58px;
    }
    .instance-settings-modal .theme-setting input[type="checkbox"] {
        left: 14px;
    }
}








:root {
    --bg: #f4f1e8; --surface: #ffffff; --surface-soft: #f8f7f2;
    --surface-raised: #ffffff; --text: #171717; --muted: #68655e;
    --border: #e7e3d8; --accent: #d71920; --accent-hover: #b51218;
    --accent-soft: #fde8e8; --focus: rgba(215,25,32,.22);
    --success: #138a52; --success-soft: #e3f5eb; --warning: #b77900;
    --warning-soft: #fff3d6; --danger: #c5222b; --danger-soft: #fde6e7;
    --info: #1769aa; --info-soft: #e5f2fc; --text-rgb: 23,23,23;
    color-scheme: light;
}
html[data-theme="light"] { color-scheme: light; }
html[data-theme="dark"] { --bg:#151515; --surface:#202020; --surface-soft:#292929; --surface-raised:#252525; --text:#f7f5ef; --muted:#aaa69b; --border:#3b3a37; --accent:#ffb000; --accent-hover:#ffc94d; --accent-soft:#4a3510; --focus:rgba(255,176,0,.28); --success:#57cf8e; --success-soft:#173d2a; --warning:#ffd166; --warning-soft:#493c19; --danger:#ff7279; --danger-soft:#4a2023; --info:#6cb8f4; --info-soft:#173a55; --text-rgb:247,245,239; color-scheme:dark; }
html[data-theme="citrus"] { --bg:#f2f0e3; --surface:#fffef8; --surface-soft:#f7f6e9; --surface-raised:#fffefb; --text:#252515; --muted:#76764e; --border:#e4e2c9; --accent:#6b7d12; --accent-hover:#52600d; --accent-soft:#edf3c9; --focus:rgba(107,125,18,.24); color-scheme:light; }
html[data-theme="flame"] { --bg:#fff0eb; --surface:#fffaf8; --surface-soft:#fff4ef; --surface-raised:#fff; --text:#321a16; --muted:#896c64; --border:#f2d8cf; --accent:#e63b1e; --accent-hover:#bd2e16; --accent-soft:#ffe0d7; --focus:rgba(230,59,30,.22); color-scheme:light; }
html[data-theme="ocean"] { --bg:#eaf5f7; --surface:#fff; --surface-soft:#f1fafb; --surface-raised:#fff; --text:#102d35; --muted:#5c7a80; --border:#d4e8eb; --accent:#007f8b; --accent-hover:#00636c; --accent-soft:#d8f2f3; --focus:rgba(0,127,139,.22); color-scheme:light; }
html[data-theme="forest"] { --bg:#edf5ee; --surface:#fff; --surface-soft:#f3faf3; --surface-raised:#fff; --text:#172c1d; --muted:#65806b; --border:#d8e9da; --accent:#1d783e; --accent-hover:#155b2e; --accent-soft:#dff2e3; --focus:rgba(29,120,62,.22); color-scheme:light; }
html[data-theme="berry"] { --bg:#fff0f4; --surface:#fff; --surface-soft:#fff5f7; --surface-raised:#fff; --text:#3a1725; --muted:#8a6470; --border:#f0d7df; --accent:#c51e58; --accent-hover:#9d1646; --accent-soft:#ffe0eb; --focus:rgba(197,30,88,.22); color-scheme:light; }
html[data-theme="royal"] { --bg:#f1efff; --surface:#fff; --surface-soft:#f7f5ff; --surface-raised:#fff; --text:#20183e; --muted:#716a91; --border:#ded9f5; --accent:#6246c9; --accent-hover:#4b34a3; --accent-soft:#e8e2ff; --focus:rgba(98,70,201,.22); color-scheme:light; }
html[data-theme="midnight"] { --bg:#0e1726; --surface:#17243a; --surface-soft:#1d2d47; --surface-raised:#20324f; --text:#f3f7ff; --muted:#9aacc4; --border:#2d415e; --accent:#55c7ff; --accent-hover:#83d8ff; --accent-soft:#173d59; --focus:rgba(85,199,255,.25); --success:#6fe0a2; --success-soft:#18462f; --warning:#ffd166; --warning-soft:#4a3b1b; --danger:#ff7b86; --danger-soft:#4d202a; --info:#83d8ff; --info-soft:#173d59; --text-rgb:243,247,255; color-scheme:dark; }
html[data-theme="sand"] { --bg:#fbf1df; --surface:#fffaf1; --surface-soft:#fff6e8; --surface-raised:#fffdf8; --text:#3c2819; --muted:#8b735c; --border:#ecdcc2; --accent:#8b4d21; --accent-hover:#6e3c19; --accent-soft:#f5dfc8; --focus:rgba(139,77,33,.22); color-scheme:light; }

html, body { min-height:100%; }
body { background:var(--bg) !important; color:var(--text) !important; font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; }
.holk-sidebar, .bottom-nav, .mobile-menu-panel, .holk-card, .stat-card, .holk-modal-box, .card, .modal-box, .table-card { background:var(--surface) !important; color:var(--text); border-color:var(--border) !important; }
.holk-sidebar { width:268px; padding:24px 16px; box-shadow:8px 0 32px rgba(15,20,10,.045); }
.sidebar-brand { font-family:Inter,sans-serif; color:var(--accent) !important; font-weight:900; font-size:1.2rem; letter-spacing:-.04em; }
.sidebar-brand::before { content:none; }
.brand-icon { width:clamp(24px,1.8em,32px); height:clamp(24px,1.8em,32px); margin-right:.55em; border-radius:.32em; object-fit:cover; vertical-align:-.55em; box-shadow:0 4px 10px color-mix(in srgb,var(--accent) 24%,transparent); }
.icon, [data-lucide], svg.icon { width:1.15em; height:1.15em; flex:0 0 auto; stroke-width:2; }
.icon-sm, svg.icon-sm { width:1em; height:1em; }
.icon-md, svg.icon-md { width:1.25em; height:1.25em; }
.stat-icon > svg, .stat-icon > i { width:1.35em !important; height:1.35em !important; }
.sidebar-brand-sub { color:var(--muted) !important; padding-left:39px; }
.sidebar-divider { color:var(--muted) !important; }
.sidebar-nav a { color:var(--muted) !important; border-radius:12px; font-weight:700; }
.sidebar-nav a:hover { color:var(--accent) !important; background:var(--accent-soft) !important; }
.sidebar-nav a.active { background:var(--accent) !important; color:#fff !important; box-shadow:0 8px 20px color-mix(in srgb,var(--accent) 30%,transparent); }
.sidebar-user { background:var(--surface-soft) !important; border:1px solid var(--border); }
.sidebar-user-avatar { background:var(--accent-soft) !important; color:var(--accent) !important; }
.sidebar-user-name, .sidebar-user-role, .page-title, .page-subtitle, .stat-value, .holk-table td, .holk-modal-title { color:var(--text) !important; }
.page-title, .holk-modal-title { font-family:Inter,sans-serif; font-weight:900; letter-spacing:-.04em; }
.page-title { font-size:clamp(1.7rem,3vw,2.5rem); }
.page-subtitle, .stat-label, .holk-label { color:var(--muted) !important; }
.holk-main { padding:34px clamp(18px,3vw,44px); }
.holk-card, .stat-card { border-radius:18px !important; box-shadow:0 3px 16px rgba(15,20,10,.045); }
.holk-card:hover, .stat-card:hover { box-shadow:0 12px 28px rgba(15,20,10,.09); transform:translateY(-2px); }
.stat-card { padding:22px; }
.stat-value { font-family:Inter,sans-serif; font-weight:900; letter-spacing:-.06em; }
.stat-icon { border-radius:13px; }
.btn-primary-holk, .btn-primary, .button-primary, .btn-save { background:var(--accent) !important; color:#fff !important; border:0 !important; border-radius:11px; min-height:44px; font-weight:800; box-shadow:0 5px 12px color-mix(in srgb,var(--accent) 20%,transparent); }
.btn-primary-holk:hover, .btn-primary:hover, .button-primary:hover, .btn-save:hover { background:var(--accent-hover) !important; color:#fff !important; transform:translateY(-1px); }
.btn-ghost-holk, .btn-outline-secondary, .button-light { color:var(--text) !important; background:var(--surface) !important; border:1px solid var(--border) !important; border-radius:11px; min-height:44px; font-weight:800; }
.btn-ghost-holk:hover, .button-light:hover { color:var(--accent) !important; border-color:var(--accent) !important; background:var(--accent-soft) !important; }
.btn-danger-holk, .btn-danger { background:var(--danger) !important; color:#fff !important; border-radius:11px; }
.holk-input, .form-control, input, select, textarea { background:var(--surface-soft) !important; color:var(--text) !important; border:1px solid var(--border) !important; border-radius:11px !important; min-height:44px; }
.holk-input::placeholder, input::placeholder, textarea::placeholder { color:var(--muted) !important; opacity:.8; }
.holk-input:focus, .form-control:focus, input:focus, select:focus, textarea:focus { border-color:var(--accent) !important; box-shadow:0 0 0 3px var(--focus) !important; outline:0; }
.holk-table th { background:var(--surface-soft) !important; color:var(--muted) !important; border-color:var(--border) !important; }
.holk-table td { border-color:var(--border) !important; }
.holk-table tr:hover td { background:var(--accent-soft) !important; }
.holk-badge, .badge, .pill { border:1px solid transparent; }
.badge-active { background:var(--success-soft) !important; color:var(--success) !important; }
.badge-warning { background:var(--warning-soft) !important; color:var(--warning) !important; }
.badge-critical { background:var(--danger-soft) !important; color:var(--danger) !important; }
.badge-expired, .badge-unknown { background:var(--surface-soft) !important; color:var(--muted) !important; }
.holk-modal-box { border:1px solid var(--border); border-radius:20px; }
.holk-modal-backdrop { background:rgba(10,10,10,.66); }
.theme-toggle { background:var(--surface) !important; color:var(--text) !important; border-color:var(--border) !important; border-radius:12px; }
.theme-toggle:hover { color:var(--accent) !important; border-color:var(--accent) !important; background:var(--accent-soft) !important; }
.mobile-menu-link { background:transparent !important; color:var(--text) !important; }
.mobile-menu-link.active, .mobile-menu-link:active { background:var(--accent-soft) !important; color:var(--accent) !important; }
.bottom-nav { border-color:var(--border) !important; }
.bottom-nav a.active, .bottom-nav a:hover, .mobile-more-button:hover { color:var(--accent) !important; background:var(--accent-soft) !important; }
.quick-action, [class*="quick"] a { border-color:var(--border) !important; }
*:focus-visible { outline-color:var(--accent); }
@media (max-width:767px) {
    .holk-main { padding:22px 15px calc(104px + env(safe-area-inset-bottom)); }
    .theme-toggle-wrap { top:12px; right:68px; }
    .page-title { font-size:1.65rem; }
    .holk-card, .stat-card { border-radius:15px !important; }
}
@media print { body { background:#fff !important; } }