
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}
html {
    scroll-behavior: smooth;
    overflow-x: hidden;
}
* {
    -webkit-tap-highlight-color: transparent;
}
body {
    position: relative;
    background-image: url("https://cdn.corenexis.com/f/mpSA4Cnf1Nj.jpeg");
    background-size: cover;
    background-position: center top;
    background-repeat: no-repeat;
    background-attachment: fixed;
    min-height: 100vh;
    color: #334155;
    line-height: 1.6;
    overflow-x: hidden;
    z-index: 0;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
body::before,         body::after {
    content: none;
    display: none;
}
.container {
    width: 100%;
    max-width: 1380px;
    margin: 0 auto;
    padding-left: 24px;
    padding-right: 24px;
    box-sizing: border-box;
}
.wrapper {
    width: 100%;
    max-width: 1380px;
    margin: 0 auto;
    padding-left: 24px;
    padding-right: 24px;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    gap: 24px;
}


.navbar {
    position: relative !important;
    z-index: 5000 !important;
    pointer-events: auto !important;
}
.navbar .nav-right,         .navbar .nav-links,         .navbar .nav-links > li,         .navbar .nav-links > li > a,         .navbar .dropdown,         .navbar .login-dropdown,         .navbar .btn-login {
    pointer-events: auto !important;
}
.navbar .nav-links > li > a {
    position: relative;
    z-index: 5001;
}
.navbar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: rgba(255, 255, 255, 0.78);
    backdrop-filter: blur(12px) saturate(120%);
    -webkit-backdrop-filter: blur(12px) saturate(120%);
    padding: 14px 18px 14px 20px;
    border-radius: 18px;
    box-shadow: 0 8px 18px rgba(15, 23, 42, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.55);
    position: relative;
    z-index: 120;
    flex-wrap: wrap;
    gap: 12px;
}
.brand {
    display: flex;
    align-items: center;
    text-decoration: none;
    cursor: pointer;
    gap: 14px;
    min-width: 0;
}
.logo-img {
    height: 88px;
    width: auto;
    object-fit: contain;
    cursor: pointer;
    transform: scale(2.1);
    transform-origin: left center;
    max-width: 118px;
    display: block;
    flex-shrink: 0;
}
.brand-text {
    display: flex;
    flex-direction: column;
    line-height: 1.1;
    min-width: 0;
}
.brand-title {
    font-size: clamp(1.5rem, 1.8vw, 2.25rem);
    font-weight: 800;
    color: #0f172a;
    letter-spacing: -0.3px;
    white-space: nowrap;
}
.brand-sub {
    font-size: 0.88rem;
    color: #28784a;
    font-weight: 700;
    letter-spacing: 0.02em;
    white-space: nowrap;
}
.nav-right {
    display: flex;
    align-items: center;
    gap: 18px;
    flex-wrap: wrap;
    margin-left: auto;
}
.nav-links {
    display: flex;
    list-style: none;
    gap: 24px;
    align-items: center;
    flex-wrap: wrap;
}
.nav-links li a {
    text-decoration: none;
    color: #0B2A4A;
    font-size: 15px;
    font-weight: 600;
    transition: color 0.2s ease;
    cursor: pointer;
    position: relative;
    padding: 8px 0;
}
.nav-links li a:hover,         .nav-links li a.active {
    color: #087f70;
}
.nav-links li a.active::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: -6px;
    height: 3px;
    border-radius: 99px;
    background: linear-gradient(135deg, #087f70 0%, #075e55 100%);
}

.dropdown,         .login-dropdown {
    position: relative;
}
.dropdown-content {
    position: absolute;
    top: calc(100% + 8px);
    left: 50%;
    transform: translateX(-50%) translateY(-6px);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    background: #ffffff;
    border: 1px solid #dbe4ef;
    border-radius: 16px;
    box-shadow: 0 12px 30px rgba(15, 23, 42, 0.12);
    padding: 8px 0;
    list-style: none;
    z-index: 1100;
    transition: opacity 0.18s ease, transform 0.18s ease, visibility 0.18s ease;
}
.dropdown-content.show {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateX(-50%) translateY(0);
}
.dropdown-content {
    min-width: min(360px, 72vw);
    width: max-content;
}
.dropdown-content li a {
    padding: 12px 18px;
    display: block;
    font-size: 13px;
    color: #475569;
    font-weight: 600;
    text-decoration: none;
    cursor: pointer;
    white-space: nowrap;
}
.dropdown-content li a:hover {
    background-color: #f0f9ff;
    color: #087f70;
}
.arrow-down {
    display: none;
}


.login-dropdown {
    display: inline-flex;
    align-items: center;
    width: auto;
    z-index: 2000;
}
.btn-login {
    position: relative;
    z-index: 2001;
    cursor: pointer !important;
    pointer-events: auto !important;
}
.login-dropdown-content {
    position: absolute !important;
    top: calc(100% + 8px) !important;
    right: 0 !important;
    left: auto !important;
    width: 220px !important;
    min-width: 220px !important;
    max-width: calc(100vw - 30px) !important;
    display: none !important;
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
    background: #ffffff !important;
    border: 1px solid #dbe4ef !important;
    border-radius: 12px !important;
    box-shadow: 0 15px 35px rgba(15, 23, 42, 0.18) !important;
    padding: 6px 0 !important;
    list-style: none !important;
    overflow: hidden !important;
    z-index: 99999 !important;
    transform: translateY(-6px) !important;
    transition: opacity 0.18s ease, transform 0.18s ease, visibility 0.18s ease !important;
}
.login-dropdown-content.show {
    display: block !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    transform: translateY(0) !important;
}
.login-dropdown-content a {
    display: block !important;
    width: 100% !important;
    padding: 12px 16px !important;
    background: transparent !important;
    color: #334155 !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    line-height: 1.4 !important;
    text-decoration: none !important;
    cursor: pointer !important;
    pointer-events: auto !important;
    white-space: normal !important;
    overflow: visible !important;
    text-overflow: clip !important;
}
.login-dropdown-content a:hover,         .login-dropdown-content a:focus {
    background: #f0f9ff !important;
    color: #087f70 !important;
    outline: none !important;
}

.login-modal {
    position: fixed;
    inset: 0;
    background: rgba(15, 23, 42, 0.6);
    display: none;
    align-items: center;
    justify-content: center;
    padding: 20px;
    z-index: 1200;
}
.login-modal.show {
    display: flex;
}


body.login-modal-open {
    overflow: hidden;
}
.login-modal.show {
    position: fixed !important;
    inset: 0 !important;
    width: 100vw !important;
    height: 100vh !important;
    min-height: 100% !important;
    z-index: 2147483000 !important;
    align-items: center !important;
    justify-content: center !important;
    pointer-events: auto !important;
    visibility: visible !important;
    opacity: 1 !important;
}
.login-modal.show .login-panel {
    position: relative;
    z-index: 2147483001;
    pointer-events: auto;
}
.login-modal.show input,         .login-modal.show button,         .login-modal.show a {
    pointer-events: auto;
}

.stock-modal {
    position: fixed;
    inset: 0;
    background: rgba(15, 23, 42, 0.6);
    display: none;
    align-items: center;
    justify-content: center;
    padding: 20px;
    z-index: 1250;
}
.stock-modal.show {
    display: flex;
}
.stock-panel {
    width: min(680px, 96vw);
    background: #ffffff;
    border-radius: 12px;
    box-shadow: 0 20px 50px rgba(15,23,42,0.2);
    border: 1px solid #e6eef7;
    overflow: hidden;
}
.stock-panel-header {
    padding: 14px 18px;
    background: linear-gradient(135deg,#0b917d, #075e55);
    color:#fff;
    position:relative;
}
.stock-panel-header h3 {
    margin:0;
    font-size:1.05rem;
}
.stock-close {
    position:absolute;
    right:12px;
    top:8px;
    width:32px;
    height:32px;
    border-radius:50%;
    border:none;
    background:rgba(255,255,255,0.12);
    color:#fff;
    cursor:pointer;
}
.stock-body {
    padding:16px;
}
.stock-body .field-row {
    margin-bottom:10px;
    display:flex;
    gap:8px;
    align-items:center;
}
.stock-body .field-row label {
    width:140px;
    font-weight:700;
    color:#0f172a;
}
.stock-body .field-row input, .stock-body .field-row select, .stock-body .field-row textarea {
    flex:1;
    padding:8px 10px;
    border-radius:8px;
    border:1px solid #cbd5e1;
}
.stock-actions {
    display:flex;
    gap:8px;
    justify-content:flex-end;
    margin-top:12px;
}
.login-panel {
    width: min(420px, 92vw);
    background: #ffffff;
    border-radius: 16px;
    box-shadow: 0 25px 60px rgba(15, 23, 42, 0.2);
    border: 1px solid #e2e8f0;
    overflow: hidden;
}
.login-panel-header {
    background: linear-gradient(135deg, #0b917d 0%, #075e55 100%);
    color: #ffffff;
    padding: 20px 22px 16px;
    position: relative;
}
.login-panel-header h3 {
    margin: 0;
    font-size: 1.2rem;
    font-weight: 700;
    color: #ffffff;
}
.login-panel-header p {
    margin: 6px 0 0;
    color: rgba(255,255,255,0.8);
    font-size: 0.85rem;
}
.login-close {
    position: absolute;
    right: 16px;
    top: 16px;
    width: 30px;
    height: 30px;
    border: none;
    border-radius: 50%;
    background: rgba(255,255,255,0.12);
    color: #fff;
    font-size: 18px;
    cursor: pointer;
}
.login-body {
    padding: 22px;
}
.login-role-picker {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 18px;
}
.login-role-btn {
    border: 1px solid #cbd5e1;
    background: #f8fafc;
    color: #0f172a;
    border-radius: 10px;
    padding: 12px 10px;
    font-weight: 700;
    cursor: pointer;
    transition: all 0.2s ease;
}
.login-role-btn.active {
    background: #e7f5ee;
    border-color: #6db898;
    color: #145c4d;
    box-shadow: inset 0 0 0 1px rgba(8, 127, 112, 0.16);
}
.login-form {
    display: flex;
    flex-direction: column;
    gap: 14px;
}
.login-field {
    display: flex;
    flex-direction: column;
    gap: 6px;
}
.login-field label {
    font-size: 0.82rem;
    font-weight: 700;
    color: #334155;
}
.login-field input {
    width: 100%;
    border: 1px solid #cbd5e1;
    border-radius: 10px;
    padding: 12px 14px;
    font-size: 0.95rem;
    outline: none;
    background: #ffffff;
}
.login-field input:focus {
    border-color: #49a98a;
    box-shadow: 0 0 0 3px rgba(8, 127, 112, 0.14);
}
.login-actions {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    margin-top: 8px;
}
.login-btn-secondary,         .login-btn-primary {
    border: none;
    border-radius: 10px;
    padding: 11px 18px;
    font-weight: 700;
    cursor: pointer;
}
.login-btn-secondary {
    background: #f1f5f9;
    color: #334155;
}
.login-btn-primary {
    background: linear-gradient(135deg, #087f70 0%, #075e55 100%);
    color: #ffffff;
}
@media (max-width: 480px) {
    .login-role-picker {
        grid-template-columns: 1fr;
    }
    .login-panel-header {
        padding: 18px 18px 14px;
    }
    .login-body {
        padding: 18px;
    }
}

.page-view {
    display: none;
    animation: fadeIn 0.3s ease-in-out;
}
.page-view.active {
    display: flex;
    flex-direction: column;
    gap: 24px;
}
@keyframes fadeIn {
    from {
        opacity: 0;
        transform: translateY(-4px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}


.hero-section {
    position: relative;
    /* background-image: url('https://cdn.corenexis.com/f/zykvYKecSsc.jpeg'); */
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    background-attachment: local;
    color: #ffffff;
    border-radius: 20px;
    padding: clamp(28px, 4vw, 52px) clamp(28px, 4vw, 42px);
    display: grid;
    grid-template-columns: minmax(0, 1.45fr) minmax(280px, 1fr);
    gap: clamp(20px, 2vw, 32px);
    align-items: center;
    box-shadow: 0 8px 36px rgba(15, 23, 42, 0.08);
    overflow: hidden;
    min-height: clamp(320px, 42vw, 560px);
    width: 100%;
    border: 1px solid rgba(255, 255, 255, 0.18);
    margin: 0 auto;
}
.hero-section .decor-bike {
    position: absolute;
    right: 28px;
    top: 18px;
    width: 220px;
    height: auto;
    opacity: 0.16;
    stroke: rgba(15, 23, 42, 0.16);
    fill: none;
    stroke-width: 1.6;
    pointer-events: none;
    transform: translateZ(0);
}
@media (max-width: 900px) {
    .hero-section .decor-bike {
        display: none;
    }
}
.hero-badge {
    display: inline-block;
    background: rgba(255,255,255,0.18);
    color: #0b2d54;
    border: 1px solid rgba(11, 45, 84, 0.35);
    font-size: 12px;
    font-weight: 800;
    padding: 6px 14px;
    border-radius: 20px;
    margin-bottom: 18px;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}
.hero-title {
    font-size: clamp(2.2rem, 3vw, 4rem);
    font-weight: 800;
    line-height: 0.98;
    margin-bottom: 18px;
    color: #0B2A4A;
    max-width: 620px;
    letter-spacing: -0.05em;
}
.hero-desc {
    font-size: 15px;
    color: rgba(11, 42, 74, 0.78);
    line-height: 1.65;
    margin-bottom: 28px;
    max-width: 620px;
}
.hero-actions {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
}
.btn-primary {
    background: linear-gradient(135deg, #0b8978 0%, #075e55 100%);
    color: #ffffff;
    border: none;
    padding: 14px 22px;
    border-radius: 12px;
    font-weight: 700;
    font-size: 14px;
    cursor: pointer;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    transition: transform 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
    box-shadow: 0 10px 16px rgba(8, 112, 91, 0.18);
}
.btn-primary:hover {
    background: linear-gradient(135deg, #087868 0%, #064e46 100%);
    transform: translateY(-1px);
}
.btn-secondary {
    background: rgba(255,255,255,0.78);
    color: #0B2A4A;
    border: 1px solid rgba(11, 42, 74, 0.22);
    padding: 14px 22px;
    border-radius: 12px;
    font-weight: 700;
    font-size: 14px;
    cursor: pointer;
    text-decoration: none;
    transition: all 0.2s ease;
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
}
.btn-secondary:hover {
    background-color: #f7fafc;
    border-color: rgba(11, 42, 74, 0.36);
    color: #0B2A4A;
}

.hero-slogan-card {
    position: relative;
    background: rgba(255, 255, 255, 0.30);
    border: 1px solid rgba(255,255,255,0.30);
    backdrop-filter: blur(4px) saturate(120%);
    -webkit-backdrop-filter: blur(4px) saturate(120%);
    border-radius: 18px;
    padding: 26px 24px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    box-shadow: 0 12px 28px rgba(15, 23, 42, 0.08);
    overflow: hidden;
    min-height: 210px;
}
.hero-slogan-card::before {
    content: none;
    display: none;
}
.slogan-label {
    position: relative;
    z-index: 1;
    font-size: 12px;
    text-transform: uppercase;
    color: #1b364e;
    font-weight: 700;
    letter-spacing: 1px;
    margin-bottom: 8px;
}
.slogan-main {
    position: relative;
    z-index: 1;
    font-size: 22px;
    font-weight: 700;
    color: rgba(11, 42, 74, 0.92);
    margin-bottom: 12px;
    text-shadow: 0 1px 0 rgba(255,255,255,0.12);
}
.slogan-sub {
    position: relative;
    z-index: 1;
    font-size: 13px;
    color: rgba(15, 23, 42, 0.74);
    line-height: 1.5;
}

.pillars-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
}
.pillar-card {
    background-color: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 24px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.02);
    display: flex;
    flex-direction: column;
    gap: 12px;
}
.pillar-icon {
    width: 44px;
    height: 44px;
    background-color: #f0f9ff;
    color: #087f70;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
}
.pillar-title {
    font-size: 16px;
    font-weight: 700;
    color: #0f172a;
}
.pillar-desc {
    font-size: 13px;
    color: #64748b;
    line-height: 1.5;
}

.dashboard-section {
    background-color: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 32px;
}
.tutorial-scroll {
    display: flex;
    gap: 18px;
    overflow-x: auto;
    padding-bottom: 8px;
    scroll-snap-type: x proximity;
}
.tutorial-scroll::-webkit-scrollbar {
    height: 8px;
}
.tutorial-scroll::-webkit-scrollbar-thumb {
    background: #cbd5e1;
    border-radius: 999px;
}
.tutorial-card {
    min-width: 220px;
    max-width: 250px;
    flex: 0 0 auto;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 10px;
    padding: 16px 14px;
    border-radius: 12px;
    background: linear-gradient(180deg, #f8fbff 0%, #f1f5f9 100%);
    border: 1px solid #dbeafe;
    text-decoration: none;
    color: inherit;
    box-shadow: 0 4px 12px rgba(15, 23, 42, 0.04);
    scroll-snap-align: start;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.tutorial-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 12px 24px rgba(8,127,112, 0.12);
}
.tutorial-tag {
    display: inline-flex;
    width: fit-content;
    padding: 5px 8px;
    border-radius: 999px;
    background: rgba(8,127,112, 0.1);
    color: #075e55;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.5px;
    text-transform: uppercase;
}
.tutorial-card h3 {
    font-size: 15px;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.35;
}
.tutorial-card p {
    font-size: 12px;
    color: #64748b;
    line-height: 1.5;
}
.tutorial-meta {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 10px;
    padding-top: 8px;
    border-top: 1px solid #e2e8f0;
    color: #087f70;
    font-size: 11px;
    font-weight: 700;
}
.section-header {
    margin-bottom: 24px;
}
.section-title-text {
    font-size: 20px;
    font-weight: 700;
    color: #0f172a;
    margin-bottom: 4px;
}
.section-sub-text {
    font-size: 14px;
    color: #64748b;
}
.services-dashboard-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 16px;
}

.media-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(200px, 1fr));
    gap: 14px;
    margin-top: 12px;
}
.media-item {
    background-color: #ffffff;
    border: 1px solid #e6eef8;
    border-radius: 10px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}
.media-item img {
    width: 100%;
    height: 200px;
    object-fit: cover;
    display: block;
    cursor: pointer;
    transition: transform 0.18s ease, box-shadow 0.18s ease;
}
.media-item:hover img {
    transform: translateY(-6px) scale(1.03);
    box-shadow: 0 12px 28px rgba(2,6,23,0.10);
}
.media-item figcaption {
    padding: 12px;
    font-size: 13px;
    color: #0f172a;
    background: rgba(255,255,255,.9);
}
.media-item .title {
    font-weight: 800;
    color: #0f172a;
    font-size: 14px;
    margin-bottom: 6px;
    letter-spacing: -0.01em;
}
.media-item .desc {
    color: #475569;
    font-size: 13px;
    line-height: 1.45;
    font-weight: 600;
}

.video-section {
    width: 100%;
    margin: 0 0 12px 0;
}
.video-player {
    position: relative;
    border-radius: 10px;
    overflow: hidden;
    background: #000;
    width: 100%;
    display: block;
}

.video-player video {
    width: 100%;
    height: 200px;
    display: block;
    object-fit: cover;
}
.play-overlay {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(0,0,0,0.35);
    color: #fff;
    font-size: 48px;
    border: none;
    cursor: pointer;
    opacity: 1;
    transition: opacity 0.15s ease;
}
.video-controls {
    display: flex;
    gap: 8px;
    align-items: center;
    padding: 10px 12px;
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    margin-top: 8px;
    width: fit-content;
}
.video-controls button {
    background: #087f70;
    color: #fff;
    border: none;
    padding: 8px 12px;
    border-radius: 6px;
    cursor: pointer;
    font-weight: 700;
}
.video-controls button.secondary {
    background: #f1f5f9;
    color: #0f172a;
}
.video-controls input[type="range"] {
    width: 120px;
}
@media (max-width: 480px) {
    .video-controls input[type="range"] {
        width: 80px;
    }
    .media-grid {
        grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
        gap:10px;
    }
    .media-item img {
        height: 120px;
    }
}

.lightbox-overlay {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.75);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1000;
    padding: 24px;
}
.lightbox-content {
    display: flex;
    flex-direction: column;
    align-items: center;
    background: #ffffff;
    padding: 12px;
    max-width: 90vw;
    max-height: 90vh;
    overflow: hidden;
    border-radius: 10px;
    box-shadow: 0 10px 40px rgba(2,6,23,0.25);
}
.lightbox-img {
    max-width: 100%;
    max-height: calc(80vh - 80px);
    width: auto;
    height: auto;
    object-fit: contain;
    background: transparent;
    display: block;
    box-shadow: none;
    margin-bottom: 12px;
}
.lightbox-caption {
    width: 100%;
    background: rgba(255,255,255,0.95);
    padding: 12px 16px;
    border-radius: 6px;
    color: #000000;
    font-size: 15px;
    line-height: 1.4;
    box-shadow: 0 2px 8px rgba(2,6,23,0.12);
}
.lightbox-caption strong {
    display: block;
    font-size: 16px;
    color: #000000;
    font-weight: 700;
    margin-bottom: 6px;
}
.lightbox-caption p {
    margin: 0;
    color: #000000;
    font-size: 14px;
}
.lightbox-close {
    position: absolute;
    top: 18px;
    right: 18px;
    background: rgba(255,255,255,0.9);
    border: none;
    width: 36px;
    height: 36px;
    border-radius: 6px;
    cursor: pointer;
    font-size: 18px;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 2px 8px rgba(2,6,23,0.12);
}
.lightbox-nav {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background: rgba(255,255,255,0.9);
    border: none;
    width: 42px;
    height: 42px;
    border-radius: 8px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 2px 8px rgba(2,6,23,0.12);
}
.lightbox-nav.prev {
    left: 18px;
}
.lightbox-nav.next {
    right: 18px;
}
.service-item-card {
    border: 1px solid #f1f5f9;
    background-color: #f8fafc;
    border-radius: 8px;
    padding: 20px;
    display: flex;
    gap: 16px;
    align-items: flex-start;
}
.service-item-icon {
    font-size: 22px;
    line-height: 1;
    padding: 8px;
    background-color: #ffffff;
    border-radius: 6px;
    border: 1px solid #e2e8f0;
}
.service-item-title {
    font-size: 15px;
    font-weight: 700;
    color: #1e293b;
    margin-bottom: 4px;
}
.service-item-desc {
    font-size: 13px;
    color: #64748b;
    line-height: 1.4;
}

.card-container {
    background: rgba(255, 255, 255, 0.90);
    border: 1px solid rgba(255,255,255,0.60);
    border-radius: 18px;
    padding: 18px 36px 36px;
    box-shadow: 0 8px 24px rgba(15, 23, 42, 0.06);
    position: relative;
    z-index: 1;
}
.card-container::before,         .navbar::before,         .pillar-card::before,         .service-item-card::before,         .admin-card::before {
    content: none;
    display: none;
}
.page-header-title {
    font-size: 22px;
    font-weight: 700;
    color: #0f172a;
    margin-top: 0;
    margin-bottom: 4px;
}
.page-header-desc {
    font-size: 14px;
    color: #64748b;
    margin-top: 0;
    margin-bottom: 10px;
}

@media (max-width: 900px) {
    .wrapper {
        width: 100%;
        max-width: 100%;
        padding-top: 14px;
        padding-bottom: 14px;
        padding-left: clamp(16px, 4vw, 24px);
        padding-right: clamp(16px, 4vw, 24px);
    }
    .hero-section {
        grid-template-columns: 1fr;
        padding: 26px 22px;
        min-height: clamp(320px, 54vw, 420px);
    }
    .hero-content,             .hero-slogan-card {
        max-width: 100%;
    }
    .hero-title {
        font-size: clamp(1.8rem, 5vw, 2.5rem);
    }
    .pillars-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .services-dashboard-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .tutorial-scroll {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        overflow: visible;
        gap: 12px;
    }
    .tutorial-card {
        min-width: unset;
        max-width: none;
        width: 100%;
        padding: 14px 12px;
    }
}
@media (max-width: 768px) {
    body {
        background-attachment: scroll;
        background-position: center top;
    }
    .wrapper {
        width: 100%;
        max-width: 100%;
        padding-top: 12px;
        padding-bottom: 12px;
        padding-left: 16px;
        padding-right: 16px;
    }
    .navbar {
        flex-direction: column;
        align-items: flex-start;
        padding: 14px 16px;
        gap: 14px;
    }
    .status-form,
    .settings-form-grid,
    .contact-grid,
    .admin-stat-grid {
        grid-template-columns: 1fr;
    }
    .btn-primary,
    .btn-secondary,
    .btn-login,
    .login-btn-primary,
    .login-btn-secondary {
        min-height: 44px;
    }
    .brand {
        width: 100%;
        align-items: center;
    }
    .brand-title {
        font-size: clamp(1.5rem, 4vw, 2rem);
    }
    .brand-sub {
        font-size: 0.8rem;
    }
    .nav-right {
        flex-direction: column;
        align-items: flex-start;
        width: 100%;
        gap: 14px;
    }
    .nav-links {
        flex-direction: column;
        align-items: flex-start;
        width: 100%;
        gap: 10px;
        margin: 0;
        padding: 0;
    }
    .nav-links > li {
        width: 100%;
        margin: 0;
        padding: 0;
    }
    .nav-links > li > a {
        display: inline-flex;
        align-items: center;
        min-height: 38px;
        padding: 7px 0 !important;
    }


    .dropdown {
        width: 100%;
        position: relative;
    }
    .dropdown-content {
        display: none !important;
        position: static !important;
        width: 100% !important;
        min-width: 0 !important;
        max-width: none !important;
        margin-top: 6px !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        padding: 6px 0 !important;
        box-shadow: none !important;
        border: 1px solid #e2e8f0 !important;
        border-radius: 10px !important;
        opacity: 1 !important;
        visibility: visible !important;
        pointer-events: auto !important;
        transform: none !important;
    }
    .dropdown-content.show {
        display: block !important;
    }
    .dropdown-content li a {
        display: block;
        padding: 10px 14px;
        white-space: normal;
    }
    .login-dropdown {
        width: auto !important;
        position: relative !important;
        z-index: 3000 !important;
        margin: 0 !important;
        padding: 0 !important;
    }
    .btn-login {
        width: auto !important;
        min-width: 80px !important;
        text-align: center !important;
        justify-content: center !important;
        padding: 9px 16px !important;
        pointer-events: auto !important;
    }
    .login-dropdown-content {
        left: 0 !important;
        right: auto !important;
        top: calc(100% + 8px) !important;
        width: 210px !important;
        min-width: 210px !important;
        max-width: calc(100vw - 30px) !important;
    }
    .login-dropdown-content.show {
        display: block !important;
    }
}
@media (max-width: 640px) {
    .wrapper {
        width: min(100%, calc(100% - 10px));
        padding: 10px 0;
        gap: 16px;
    }
    .navbar {
        padding: 12px 14px;
        border-radius: 10px;
    }
    .logo-img {
        height: 54px;
        max-width: 72px;
        transform: scale(1.25);
    }
    .brand-title {
        font-size: 1.2rem !important;
    }
    .brand-sub {
        font-size: 0.72rem !important;
    }
    .hero-section {
        padding: 22px 18px;
        border-radius: 12px;
        min-height: 300px;
    }
    .hero-badge {
        font-size: 10px;
        padding: 5px 10px;
    }
    .hero-title {
        font-size: clamp(1.5rem, 7vw, 2rem);
    }
    .hero-desc,             .slogan-sub,             .pillar-desc,             .service-item-desc,             .section-sub-text,             .page-header-desc {
        font-size: 0.82rem;
    }
    .hero-actions {
        flex-direction: column;
        align-items: stretch;
    }
    .btn-primary,             .btn-secondary,             .btn-login {
        width: 100%;
        justify-content: center;
        text-align: center;
    }
    .pillars-grid,             .services-dashboard-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .tutorial-scroll {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        overflow: visible;
        gap: 10px;
    }
    .media-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 10px;
    }
    .media-item img,             .video-player video {
        height: 140px;
    }
    .pillar-card,             .service-item-card,             .dashboard-section,             .card-container {
        padding: 18px 14px;
    }
    .service-item-card {
        flex-direction: column;
        align-items: flex-start;
    }
    .page-header-title {
        font-size: 1.15rem;
    }
}
@media (max-width: 480px) {
    .wrapper {
        padding: 8px 0;
        gap: 14px;
    }
    .brand-title {
        font-size: 1.1rem !important;
    }
    .brand-sub {
        font-size: 0.68rem !important;
    }
    .logo-img {
        height: 52px;
        max-width: 70px;
        transform: scale(1.2);
    }
    .hero-section {
        padding: 18px 14px;
    }
    .hero-title {
        font-size: 1.35rem;
    }
    .slogan-main {
        font-size: 1.1rem;
    }
    .pillars-grid,             .services-dashboard-grid,             .tutorial-scroll,             .media-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .tutorial-card {
        min-width: 0;
        width: 100%;
        padding: 12px 10px;
    }
    .tutorial-card h3 {
        font-size: 0.92rem;
    }
    .tutorial-card p {
        font-size: 0.72rem;
    }
    .media-item img,             .video-player video {
        height: 160px;
    }
    .lightbox-content {
        max-width: 92vw;
        padding: 10px;
    }
}
@media (max-width: 340px) {
    .pillars-grid,             .services-dashboard-grid,             .tutorial-scroll,             .media-grid {
        grid-template-columns: 1fr;
    }
    .hero-title {
        font-size: 1.25rem;
    }
    .hero-desc,             .slogan-sub,             .pillar-desc,             .service-item-desc,             .section-sub-text,             .page-header-desc {
        font-size: 0.78rem;
    }
}

:root {
    --font-sans: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
    --font-base-size: 16px;
    --line-height: 1.45;
    --muted: #64748b;
    --text: #0f172a;
}

html {
    font-size: clamp(14px, 0.9vw + 0.55rem, 17px);
}
body {
    font-family: var(--font-sans);
    font-size: 1rem;
    line-height: var(--line-height);
    color: var(--text);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
h1, .hero-title, .page-header-title {
    font-family: var(--font-sans);
    margin:0 0 8px 0;
}
h1 {
    font-size: 1.5rem;
}
h2, .section-title-text {
    font-size: 1.125rem;
    margin:0 0 6px 0;
}
h3, .section-sub-text {
    font-size: 0.95rem;
    margin:0 0 6px 0;
    color:var(--muted);
}
p {
    font-size: 0.95rem;
    color: var(--muted);
    margin: 0 0 12px 0;
}
section#page-media > h1.page-header-title {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
}
section#page-media > p.page-header-desc {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    padding-top: 0 !important;
    line-height: 1.3 !important;
}
.page-header-desc {
    font-size: 0.98rem;
    color: var(--muted);
}
.hero-desc {
    font-size: 1rem;
    color: var(--muted);
}
:root {
    --base-line-height: 1.6;
}
body {
    line-height: var(--base-line-height) !important;
}
h1 {
    font-size: clamp(1.35rem, 2vw, 2rem) !important;
    margin-bottom: 0.5rem !important;
}
h2, .section-title-text {
    font-size: clamp(1.1rem, 1.5vw, 1.35rem) !important;
    margin-bottom: 0.4rem !important;
}
h3, .section-sub-text {
    font-size: clamp(0.95rem, 1vw, 1.05rem) !important;
}
.page-header-title {
    font-size: clamp(1.2rem, 1.7vw, 1.6rem) !important;
}
.page-header-desc, .hero-desc {
    font-size: clamp(0.9rem, 0.8vw, 1.05rem) !important;
    color: var(--muted) !important;
}
p, .service-item-desc, .media-item .desc {
    font-size: clamp(0.88rem, 0.8vw, 1rem) !important;
    color: var(--muted) !important;
}
.media-item .title {
    font-size: clamp(0.96rem, 0.9vw, 1.05rem) !important;
    font-weight: 700 !important;
}
.brand-title {
    font-size: clamp(1.15rem, 1.7vw, 1.8rem) !important;
    font-weight: 700 !important;
}
.brand-sub {
    font-size: 0.8rem !important;
}
.nav-links li a {
    font-size: clamp(0.9rem, 0.8vw, 0.98rem) !important;
    font-weight: 600 !important;
}
.hero-title {
    font-size: clamp(1.7rem, 3vw, 2.5rem) !important;
}
.lightbox-caption strong {
    font-size: 1.05rem !important;
}
.lightbox-caption p {
    font-size: 1rem !important;
}
@media (max-width: 768px) {
    html {
        font-size: 14px;
    }
    h1 {
        font-size: 1.25rem !important;
    }
    h2, .section-title-text {
        font-size: 1rem !important;
    }
    .page-header-title {
        font-size: 1.2rem !important;
    }
    .hero-title {
        font-size: 1.65rem !important;
    }
    .nav-links li a {
        font-size: 0.92rem !important;
    }
    .brand-title {
        font-size: 1.1rem !important;
    }
}
@media (max-width: 480px) {
    html {
        font-size: 13.5px;
    }
    h1 {
        font-size: 1.2rem !important;
    }
    .hero-title {
        font-size: 1.4rem !important;
    }
    .nav-links li a {
        font-size: 0.88rem !important;
    }
    .brand-title {
        font-size: 1rem !important;
    }
    .page-header-desc, .hero-desc {
        font-size: 0.86rem !important;
    }
}
section#page-media .page-header-desc {
    font-size: 1.02rem !important;
    color: #334155 !important;
    max-width: 820px;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    line-height: 1.3 !important;
    font-weight: 400 !important;
}
section#page-media > h1.page-header-title {
    margin-bottom: 0 !important;
    line-height: 1.2 !important;
}

.status-lookup-wrap {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    padding: 22px;
    box-shadow: 0 10px 25px rgba(15, 23, 42, 0.04);
}
.status-form {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 12px;
    align-items: center;
}
.status-form input,         .status-form select,         .status-form button,         .admin-filter-row input,         .admin-filter-row select,         .admin-table select {
    border-radius: 10px;
    border: 1px solid #cbd5e1;
    padding: 12px 14px;
    font-size: 0.95rem;
    background: #fff;
    color: #0f172a;
}
.status-form button,         .admin-primary-btn,         .save-status-btn {
    background: linear-gradient(135deg, #087f70 0%, #075e55 100%);
    color: #ffffff;
    border: none;
    font-weight: 700;
    cursor: pointer;
}
.status-result {
    margin-top: 22px;
    display: grid;
    gap: 16px;
}
.status-empty,         .admin-empty-state,         .admin-notice {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 18px;
    color: #475569;
}
.status-list {
    display: grid;
    gap: 16px;
}
.service-status-card {
    background: linear-gradient(135deg, #ffffff 0%, #f8fbff 100%);
    border: 1px solid #dbeafe;
    border-radius: 16px;
    padding: 18px;
    box-shadow: 0 10px 24px rgba(8,127,112, 0.06);
}
.service-status-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
    margin-bottom: 12px;
}
.service-status-card h3 {
    margin: 0;
    font-size: 1.05rem;
    color: #0f172a;
}
.status-badge {
    border-radius: 999px;
    padding: 6px 10px;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.02em;
    border: 1px solid transparent;
}

.status-badge.progress {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    background: #fef3c7;
    color: #92400e;
    border-color: #f59e0b;
}
.status-badge.progress::before {
    content: '⟳';
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 15px;
    height: 15px;
    font-size: 15px;
    line-height: 1;
    font-weight: 800;
    animation: statusLoadingSpin 1s linear infinite;
}
.status-badge.done {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    background: #dcfce7;
    color: #166534;
    border-color: #22c55e;
}
.status-badge.done::before {
    content: '✓';
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 15px;
    height: 15px;
    border-radius: 50%;
    background: #22c55e;
    color: #ffffff;
    font-size: 10px;
    line-height: 1;
    font-weight: 900;
}
@keyframes statusLoadingSpin {
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(360deg);
    }
}
.service-meta {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 8px 18px;
    margin-top: 12px;
    font-size: 0.9rem;
    color: #475569;
}
.service-meta strong {
    color: #0f172a;
}
.service-notes {
    margin-top: 12px;
    background: #f8fafc;
    border-left: 4px solid #49a98a;
    padding: 10px 12px;
    border-radius: 8px;
    color: #334155;
    font-size: 0.9rem;
}
.status-tracker {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(128px, 1fr));
    gap: 10px;
    margin-top: 16px;
}
.status-track-step {
    position: relative;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    padding: 10px 8px;
    text-align: center;
    font-size: 0.72rem;
    font-weight: 700;
    color: #64748b;
}
.status-track-step.active {
    background: #fef3c7;
    border-color: #f59e0b;
    color: #92400e;
    box-shadow: inset 0 0 0 1px rgba(245, 158, 11, 0.16);
}
.status-track-step.current-done {
    background: #dcfce7;
    border-color: #22c55e;
    color: #166534;
    box-shadow: inset 0 0 0 1px rgba(34, 197, 94, 0.16);
}
.status-track-step.current-progress::before {
    content: '⟳';
    display: inline-block;
    margin-right: 6px;
    font-size: 13px;
    font-weight: 800;
    animation: statusLoadingSpin 1s linear infinite;
}
.status-track-step.current-done::before {
    content: '✓';
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 15px;
    height: 15px;
    margin-right: 6px;
    border-radius: 50%;
    background: #22c55e;
    color: #fff;
    font-size: 10px;
    line-height: 1;
    vertical-align: -1px;
}
.status-track-step::after {
    content: '→';
    position: absolute;
    right: -10px;
    top: 50%;
    transform: translateY(-50%);
    color: #94a3b8;
    font-size: 0.8rem;
}
.status-track-step:last-child::after {
    content: '';
}
.site-footer {
    background: #0B162B;
    color: #e2e8f0;
    border-radius: 24px 24px 0 0;
    margin-top: 20px;
    padding: 20px 22px 10px;
    box-shadow: 0 -10px 24px rgba(15, 23, 42, 0.08);
}
.site-footer-grid {
    display: grid;
    grid-template-columns: 1.2fr 1fr 1.2fr 1fr;
    gap: 16px 20px;
    align-items: start;
}
.site-footer-grid > div {
    min-width: 0;
}
.site-footer-brand {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 6px;
}
.site-footer-brand img {
    width: 52px;
    height: auto;
    display: block;
    margin: 0;
}
.site-footer h4 {
    color: #ffffff;
    font-size: 20px;
    font-weight: 700;
    margin: 0 0 6px;
    line-height: 1.2;
}
.site-footer p,         .site-footer li,         .site-footer a {
    color: #dfe7f3;
    font-size: 16px;
    text-decoration: none;
    line-height: 1.7;
    margin: 0;
}
.site-footer p {
    max-width: 360px;
    line-height: 1.5;
}
.site-footer ul {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 4px;
}
.site-footer a {
    transition: color 0.2s ease;
}
.site-footer a:hover {
    color: #ffffff;
}
.site-footer-bottom {
    border-top: 1px solid rgba(255, 255, 255, 0.12);
    margin-top: 18px;
    padding-top: 14px;
    font-size: 14px;
    color: #dfe7f3;
    text-align: center;
}
@media (max-width: 900px) {
    .site-footer-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}
@media (max-width: 560px) {
    .site-footer {
        padding: 22px 18px 14px;
        border-radius: 18px 18px 0 0;
    }
    .site-footer-grid {
        grid-template-columns: 1fr;
        gap: 18px;
    }
    .site-footer h4 {
        font-size: 18px;
    }
    .site-footer p,             .site-footer li,             .site-footer a {
        font-size: 15px;
    }
    .site-footer-bottom {
        margin-top: 18px;
        padding-top: 14px;
        font-size: 13px;
    }
}
.contact-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 16px;
    margin-top: 18px;
}
.contact-card {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 14px;
    padding: 18px;
    box-shadow: 0 8px 20px rgba(15, 23, 42, 0.04);
}
.contact-card strong {
    display: block;
    color: #0f172a;
    margin-bottom: 8px;
}
.contact-card a {
    color: #075e55;
    text-decoration: none;
    font-weight: 600;
}
.admin-header-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
    margin-bottom: 18px;
}
.admin-header-row .btn-secondary {
    background: transparent;
    border: 1px solid #cbd5e1;
    color: #334155;
    padding: 10px 14px;
    border-radius: 10px;
    font-weight: 700;
    cursor: pointer;
}
.admin-stat-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
    gap: 16px;
    margin-bottom: 18px;
}
.admin-stat-card {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 14px;
    padding: 16px;
    box-shadow: 0 8px 16px rgba(15, 23, 42, 0.04);
}
.admin-stat-label {
    color: #64748b;
    font-size: 0.76rem;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-weight: 700;
}
.admin-stat-value {
    margin-top: 8px;
    font-size: clamp(1.5rem, 2vw, 2rem);
    font-weight: 800;
    color: #0f172a;
}
.admin-filter-row {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 12px;
    margin-bottom: 18px;
}
.admin-table-wrap {
    overflow-x: auto;
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 14px;
    box-shadow: 0 8px 16px rgba(15, 23, 42, 0.04);
}
.admin-table {
    width: 100%;
    border-collapse: collapse;
    min-width: 760px;
}
.admin-table th,         .admin-table td {
    padding: 12px 14px;
    border-bottom: 1px solid #e2e8f0;
    text-align: left;
    vertical-align: top;
    color: #334155;
    font-size: 0.88rem;
}
.admin-table th {
    background: #f8fafc;
    color: #0f172a;
    font-weight: 800;
}
.admin-table .id-cell {
    font-weight: 700;
    color: #075e55;
}
.admin-table select {
    min-width: 170px;
    width: 100%;
    background: #fff;
}
.save-status-btn {
    padding: 8px 10px;
    border-radius: 8px;
    font-size: 0.78rem;
}

.admin-shell {
    display: grid;
    grid-template-columns: 260px minmax(0, 1fr);
    gap: 20px;
    min-height: 720px;
}
.admin-sidebar {
    background: linear-gradient(180deg, #0f172a 0%, #111827 100%);
    border-radius: 22px;
    padding: 22px 18px;
    color: #e2e8f0;
    box-shadow: 0 18px 40px rgba(15, 23, 42, 0.12);
}
.admin-brand-box {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 26px;
    padding-bottom: 18px;
    border-bottom: 1px solid rgba(148, 163, 184, 0.2);
}
.admin-brand-box .logo-mini {
    width: 42px;
    height: 42px;
    border-radius: 12px;
    background: linear-gradient(135deg, #36a77f 0%, #087f70 100%);
    display: grid;
    place-items: center;
    font-weight: 900;
    color: #fff;
    font-size: 1rem;
}
.admin-brand-box strong {
    display: block;
    font-size: 1rem;
    color: #fff;
}
.admin-brand-box span {
    color: #b8dcca;
    font-size: 0.72rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}
.admin-nav-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: 8px;
}
.admin-nav-list button {
    width: 100%;
    text-align: left;
    background: transparent;
    border: 1px solid transparent;
    border-radius: 12px;
    padding: 12px 14px;
    font-weight: 700;
    color: #e2e8f0;
    cursor: pointer;
    transition: 0.2s ease;
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
}
.admin-nav-list button:hover,         .admin-nav-list button.active {
    background: rgba(8, 127, 112, 0.2);
    border-color: rgba(129, 204, 176, 0.48);
    box-shadow: inset 0 0 0 1px rgba(129, 204, 176, 0.28);
    color: #f8fafc;
}
.admin-nav-icon {
    width: 16px;
    height: 16px;
    flex-shrink: 0;
    stroke: currentColor;
    fill: none;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}
.admin-content {
    min-width: 0;
}
.admin-topbar {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 18px;
    padding: 16px 18px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 18px;
    box-shadow: 0 10px 22px rgba(15, 23, 42, 0.04);
}
.admin-topbar h2 {
    margin: 0;
    font-size: 1.2rem;
    color: #0f172a;
}
.admin-topbar-meta {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}
.admin-user-chip {
    background: #eff6ff;
    color: #075e55;
    border: 1px solid #bfdbfe;
    border-radius: 999px;
    padding: 8px 12px;
    font-weight: 700;
    font-size: 0.8rem;
}
.admin-sync-badge {
    border-radius: 999px;
    padding: 7px 10px;
    font-size: 0.75rem;
    font-weight: 700;
    border: 1px solid #cbd5e1;
    background: #f8fafc;
    color: #334155;
}
.admin-sync-badge.ok {
    background: #ecfdf5;
    border-color: #a7f3d0;
    color: #166534;
}
.admin-sync-badge.error {
    background: #fef2f2;
    border-color: #fecaca;
    color: #b91c1c;
}
.admin-logout-btn {
    background: linear-gradient(135deg, #0b8978 0%, #075e55 100%);
    color: #fff;
    border: none;
    border-radius: 10px;
    padding: 10px 14px;
    font-weight: 700;
    cursor: pointer;
}
.settings-page {
    display: grid;
    gap: 18px;
}
.settings-card {
    background: #ffffff;
    border: 1px solid rgba(148, 163, 184, 0.28);
    border-radius: 18px;
    box-shadow: 0 8px 22px rgba(15, 23, 42, 0.04);
    overflow: hidden;
}
.settings-card-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    padding: 20px 20px 12px;
    border-bottom: 1px solid rgba(148, 163, 184, 0.15);
    background: linear-gradient(180deg, rgba(248, 250, 252, 0.95), rgba(255, 255, 255, 0.98));
}
.settings-card-title-wrap {
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: 0;
}
.settings-card-icon {
    width: 42px;
    height: 42px;
    border-radius: 12px;
    display: grid;
    place-items: center;
    background: linear-gradient(135deg, #dbeafe 0%, #e0f2fe 100%);
    color: #0f172a;
    flex-shrink: 0;
}
.settings-card-icon svg {
    width: 20px;
    height: 20px;
    stroke: currentColor;
    fill: none;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}
.settings-card-title {
    margin: 0;
    font-size: 1.05rem;
    color: #0f172a;
    font-weight: 800;
}
.settings-card-subtitle {
    margin: 0;
    color: #64748b;
    font-size: 0.82rem;
    line-height: 1.5;
    padding: 0 20px 18px;
}
.settings-card-body {
    padding: 0 20px 20px;
}
.settings-form-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}
.settings-field {
    display: flex;
    flex-direction: column;
    gap: 8px;
    min-width: 0;
}
.settings-field label {
    font-size: 0.74rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: #64748b;
}
.settings-field input,         .settings-field select {
    width: 100%;
    min-width: 0;
    box-sizing: border-box;
    border: 1px solid #dbe4ef;
    border-radius: 12px;
    background: #f8fafc;
    color: #0f172a;
    padding: 12px 14px;
    font-size: 0.96rem;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
.settings-field input:focus,         .settings-field select:focus {
    outline: none;
    border-color: #49a98a;
    box-shadow: 0 0 0 3px rgba(8, 127, 112, 0.14);
}
.settings-api-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 10px;
    align-items: center;
}
.settings-api-input {
    width: 100%;
    min-width: 0;
    border: 1px solid #dbe4ef;
    border-radius: 12px;
    background: #f8fafc;
    color: #0f172a;
    padding: 12px 14px;
    font-size: 0.94rem;
    box-sizing: border-box;
    overflow-wrap: anywhere;
    word-break: break-word;
}
.settings-copy-btn,         .settings-test-btn,         .settings-primary-btn {
    border: none;
    border-radius: 10px;
    font-weight: 800;
    cursor: pointer;
    transition: transform 0.15s ease, opacity 0.15s ease;
}
.settings-copy-btn,         .settings-primary-btn {
    background: #e0f2fe;
    color: #0f172a;
    border: 1px solid #b5e8d2;
    padding: 10px 14px;
}
.settings-test-btn {
    background: linear-gradient(135deg, #36a77f 0%, #087f70 100%);
    color: #fff;
    padding: 10px 16px;
    box-shadow: 0 8px 18px rgba(8,127,112, 0.2);
}
.settings-copy-btn:hover,         .settings-test-btn:hover,         .settings-primary-btn:hover {
    transform: translateY(-1px);
}
.settings-copy-btn:disabled,         .settings-test-btn:disabled {
    opacity: 0.7;
    cursor: wait;
    transform: none;
}
.settings-status-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
    padding-top: 12px;
}
.settings-status-badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    border-radius: 999px;
    padding: 8px 12px;
    font-size: 0.78rem;
    font-weight: 800;
    border: 1px solid transparent;
}
.settings-status-badge.success {
    background: #ecfdf5;
    border-color: #a7f3d0;
    color: #166534;
}
.settings-status-badge.warning {
    background: #fff7ed;
    border-color: #fed7aa;
    color: #c2410c;
}
.settings-status-badge.danger {
    background: #fef2f2;
    border-color: #fecaca;
    color: #b91c1c;
}
.settings-status-badge.neutral {
    background: #f8fafc;
    border-color: #e2e8f0;
    color: #475569;
}
.settings-status-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    display: inline-block;
    background: currentColor;
    box-shadow: 0 0 0 4px rgba(255,255,255,0.7);
}
.settings-status-note {
    margin: 12px 0 0;
    color: #475569;
    font-size: 0.84rem;
    line-height: 1.5;
}
.settings-integration-list {
    display: grid;
    gap: 0;
    border-top: 1px solid rgba(148, 163, 184, 0.18);
}
.settings-integration-item {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 14px;
    align-items: center;
    padding: 18px 0;
    border-bottom: 1px solid rgba(148, 163, 184, 0.12);
}
.settings-integration-item:last-child {
    border-bottom: none;
}
.settings-google-icon {
    width: 42px;
    height: 42px;
    border-radius: 12px;
    display: grid;
    place-items: center;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    color: #0f172a;
    font-weight: 900;
    font-size: 1.1rem;
}
.settings-google-icon.form {
    background: linear-gradient(135deg, #e9f5ee 0%, #d8eee3 100%);
    color: #087f70;
}
.settings-google-icon.sheet {
    background: linear-gradient(135deg, #dcfce7 0%, #bbf7d0 100%);
    color: #15803d;
}
.settings-google-meta {
    min-width: 0;
}
.settings-google-name {
    margin: 0;
    font-size: 1.12rem;
    font-weight: 800;
    color: #0f172a;
}
.settings-google-sub {
    margin: 4px 0 0;
    color: #64748b;
    font-size: 0.82rem;
    line-height: 1.5;
}
.settings-google-state {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 8px 12px;
    border-radius: 999px;
    font-size: 0.78rem;
    font-weight: 800;
}
.settings-google-state.success {
    background: #ecfdf5;
    color: #166534;
    border: 1px solid #a7f3d0;
}
.settings-google-state.warning {
    background: #fff7ed;
    color: #c2410c;
    border: 1px solid #fed7aa;
}
.settings-google-state.danger {
    background: #fef2f2;
    color: #b91c1c;
    border: 1px solid #fecaca;
}
.settings-google-state.neutral {
    background: #f8fafc;
    color: #475569;
    border: 1px solid #e2e8f0;
}
.admin-panels {
    display: grid;
    gap: 18px;
}
.admin-card {
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 18px;
    padding: 18px;
    box-shadow: 0 10px 24px rgba(15, 23, 42, 0.04);
}
.admin-card-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    margin-bottom: 16px;
    flex-wrap: wrap;
}
.admin-card-header h3 {
    margin: 0;
    font-size: 1.04rem;
    color: #0f172a;
}
.admin-stat-grid-8 {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
    gap: 14px;
}
.admin-stat-mini {
    background: linear-gradient(135deg, #f8fafc 0%, #eff6ff 100%);
    border: 1px solid #e2e8f0;
    border-radius: 14px;
    padding: 16px 14px;
}
.admin-stat-mini .label {
    display: block;
    font-size: 0.72rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #64748b;
    font-weight: 700;
}
.admin-stat-mini .value {
    display: block;
    margin-top: 8px;
    font-size: clamp(1.4rem, 2vw, 2rem);
    font-weight: 800;
    color: #0f172a;
}
.admin-info-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
    width: 100%;
}
.admin-info-card {
    background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    padding: 16px 14px;
    min-height: 140px;
    height: auto;
    box-shadow: 0 8px 18px rgba(15, 23, 42, 0.04);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 10px;
    min-width: 0;
    box-sizing: border-box;
}
.admin-info-label {
    display: block;
    font-size: 12px;
    line-height: 1.35;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #64748b;
    font-weight: 700;
}
.admin-info-value {
    display: block;
    color: #0f172a;
    font-size: clamp(1.15rem, 1.8vw, 1.6rem);
    line-height: 1.3;
    font-weight: 800;
    word-break: break-word;
    overflow-wrap: anywhere;
    min-width: 0;
}
.admin-info-card.api-card {
    overflow: hidden;
}
.api-url-box {
    display: flex;
    flex-direction: column;
    gap: 8px;
    min-width: 0;
}
.api-url-text {
    display: block;
    font-size: 14px;
    line-height: 1.45;
    color: #0f172a;
    font-weight: 700;
    word-break: break-word;
    overflow-wrap: anywhere;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}
.copy-api-btn {
    align-self: flex-start;
    background: #e0f2fe;
    border: 1px solid #b5e8d2;
    color: #075e55;
    border-radius: 10px;
    padding: 7px 10px;
    cursor: pointer;
    font-size: 12px;
    font-weight: 800;
    transition: 0.2s ease;
}
.copy-api-btn:hover {
    background: #b5e8d2;
}
.admin-form-wrap {
    margin-top: 18px;
}
.settings-field {
    display: flex;
    flex-direction: column;
    gap: 6px;
    min-width: 0;
}
.settings-field label {
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #64748b;
}
.settings-field input {
    width: 100%;
    min-width: 0;
    box-sizing: border-box;
}
.chart-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 16px;
}
.chart-box {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 14px;
    padding: 14px;
}
.chart-box h4 {
    margin: 0 0 12px;
    color: #0f172a;
    font-size: 0.9rem;
}
.operational-chart {
    width:100%;
    min-width:0;
}
.line-chart-wrap {
    width:100%;
    min-height:260px;
    position:relative;
}
.line-chart-svg {
    display:block;
    width:100%;
    height:260px;
    overflow:visible;
}
.line-chart-grid {
    stroke:#e2e8f0;
    stroke-width:1;
}
.line-chart-axis {
    fill:#64748b;
    font-size:11px;
    font-weight:600;
}
.line-chart-line {
    fill:none;
    stroke:#087f70;
    stroke-width:3;
    stroke-linecap:round;
    stroke-linejoin:round;
}
.line-chart-area {
    fill:rgba(8,127,112,.10);
    stroke:none;
}
.line-chart-point {
    fill:#fff;
    stroke:#087f70;
    stroke-width:2.5;
}
.chart-empty {
    display:flex;
    align-items:center;
    justify-content:center;
    min-height:220px;
    color:#64748b;
    font-size:13px;
    text-align:center;
    padding:20px;
}
.pie-layout {
    display:grid;
    grid-template-columns:minmax(180px,230px) 1fr;
    align-items:center;
    gap:22px;
    min-height:250px;
}
.pie-chart {
    width:min(220px,100%);
    aspect-ratio:1;
    border-radius:50%;
    margin:auto;
    position:relative;
    background:#e2e8f0;
}
.pie-chart::after {
    content:"";
    position:absolute;
    inset:28%;
    border-radius:50%;
    background:#f8fafc;
    border:1px solid #e2e8f0;
}
.pie-center {
    position:absolute;
    inset:0;
    display:flex;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    z-index:1;
    pointer-events:none;
}
.pie-center strong {
    font-size:24px;
    color:#0f172a;
    line-height:1;
}
.pie-center span {
    font-size:11px;
    color:#64748b;
    margin-top:5px;
    font-weight:700;
}
.pie-legend {
    display:flex;
    flex-direction:column;
    gap:10px;
}
.pie-legend-item {
    display:grid;
    grid-template-columns:12px 1fr auto;
    align-items:center;
    gap:8px;
    font-size:12px;
    color:#475569;
}
.pie-dot {
    width:10px;
    height:10px;
    border-radius:50%;
    display:block;
}
.pie-legend-item strong {
    color:#0f172a;
    font-size:12px;
}
.histogram-wrap {
    width:100%;
    min-height:260px;
    display:flex;
    align-items:flex-end;
    gap:8px;
    padding:10px 4px 24px;
    box-sizing:border-box;
    position:relative;
}
.histogram-axis {
    display:flex;
    align-items:flex-end;
    gap:8px;
    width:100%;
    height:220px;
    border-bottom:1px solid #cbd5e1;
    position:relative;
}
.histogram-bar {
    flex:1;
    min-width:0;
    height:var(--bar-height,10%);
    background:linear-gradient(180deg,#78d0ac 0%,#087f70 100%);
    border-radius:7px 7px 0 0;
    position:relative;
    transition:height .2s ease;
}
.histogram-bar::after {
    content:attr(data-count);
    position:absolute;
    left:50%;
    top:-18px;
    transform:translateX(-50%);
    font-size:10px;
    font-weight:700;
    color:#475569;
}
.histogram-labels {
    position:absolute;
    left:0;
    right:0;
    bottom:0;
    display:flex;
    gap:8px;
    justify-content:space-between;
    color:#64748b;
    font-size:10px;
    font-weight:700;
}
.histogram-note {
    position:absolute;
    left:4px;
    top:0;
    color:#94a3b8;
    font-size:10px;
    font-weight:700;
}
.item-chart {
    display:flex;
    flex-direction:column;
    gap:11px;
    min-height:250px;
    justify-content:center;
    padding:4px 0;
}
.item-row {
    display:grid;
    grid-template-columns:minmax(90px,1fr) minmax(120px,2fr) 34px;
    gap:9px;
    align-items:center;
}
.item-label {
    font-size:11px;
    font-weight:700;
    color:#475569;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
}
.item-track {
    height:10px;
    background:#e2e8f0;
    border-radius:999px;
    overflow:hidden;
}
.item-fill {
    height:100%;
    background:linear-gradient(90deg,#087f70 0%,#78d0ac 100%);
    border-radius:999px;
}
.item-value {
    font-size:11px;
    font-weight:800;
    color:#0f172a;
    text-align:right;
}
.chart-grid-4 {
    grid-template-columns:repeat(2,minmax(0,1fr));
}
.chart-period-custom {
    display:flex;
    align-items:center;
    gap:8px;
    flex-wrap:wrap;
    margin:10px 0 0 auto;
    justify-content:flex-end;
}
.chart-period-custom[hidden] {
    display:none;
}
.chart-period-custom label {
    font-size:11px;
    font-weight:700;
    color:#64748b;
}
.chart-period-custom input {
    height:36px;
    border:1px solid #dbe5f1;
    background:#fff;
    border-radius:9px;
    padding:0 10px;
    color:#334155;
    font-size:12px;
    font-weight:700;
}
.chart-meta {
    margin-top:8px;
    color:#64748b;
    font-size:11px;
}
@media(max-width:700px) {
    .pie-layout {
        grid-template-columns:1fr;
        gap:14px;
        padding-bottom:4px;
    }
    .pie-chart {
        width:180px;
    }
    .line-chart-svg {
        height:230px;
    }
    .line-chart-wrap {
        min-height:230px;
    }
    .chart-period-custom {
        width:100%;
        justify-content:flex-start;
        margin-left:0;
    }
    .chart-period-custom input {
        flex:1;
        min-width:130px;
    }
}
.mini-bars {
    display: flex;
    align-items: end;
    gap: 8px;
    height: 130px;
    padding-top: 12px;
}
.mini-bars span {
    flex: 1;
    border-radius: 8px 8px 0 0;
    background: linear-gradient(180deg, #78d0ac 0%, #087f70 100%);
    min-height: 12px;
    position: relative;
}
.mini-bars span::after {
    content: attr(data-label);
    position: absolute;
    bottom: -18px;
    left: 50%;
    transform: translateX(-50%);
    font-size: 0.62rem;
    color: #64748b;
}
.mini-donut-wrap {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}
.donut-pill {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 999px;
    padding: 7px 10px;
    font-size: 0.72rem;
    font-weight: 700;
    color: #475569;
}
.admin-status-badges {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 12px;
}
.filter-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
    gap: 10px;
    margin-bottom: 12px;
}
.admin-service-filter-bar {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: nowrap;
    width: 100%;
    min-width: 0;
}
.admin-service-filter-group {
    display: flex;
    align-items: center;
    gap: 8px;
    flex: 0 0 auto;
    min-width: 0;
}
.admin-service-period-select,         .admin-service-search-input {
    height: 42px;
    box-sizing: border-box;
    border: 1px solid #cbd5e1;
    border-radius: 10px;
    padding: 11px 12px;
    font-size: 0.9rem;
    background: #fff;
    color: #0f172a;
    line-height: 1.3;
}
.admin-service-period-select {
    width: 150px;
    min-width: 150px;
}
.admin-service-search-input {
    width: min(100%, 340px);
    min-width: 220px;
    max-width: 340px;
    flex: 0 1 340px;
    padding-right: 14px;
}
.admin-service-search-input::placeholder {
    color: #64748b;
    opacity: 1;
}
.admin-service-total {
    margin-left: auto;
    flex: 0 0 auto;
    white-space: nowrap;
    min-width: 0;
}
.filter-grid input,         .filter-grid select,         .stock-form-grid input,         .stock-form-grid select,         .stock-form-grid textarea {
    width: 100%;
    border: 1px solid #cbd5e1;
    border-radius: 10px;
    padding: 11px 12px;
    font-size: 0.88rem;
    background: #fff;
    color: #0f172a;
}
@media (max-width: 900px) {
    .admin-service-filter-bar {
        flex-wrap: wrap;
    }
    .admin-service-filter-group {
        flex: 1 1 180px;
    }
    .admin-service-period-select {
        width: 100%;
        min-width: 0;
    }
    .admin-service-search-input {
        width: 100%;
        max-width: none;
        min-width: 0;
        flex: 1 1 220px;
    }
}
.stock-form-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
    gap: 12px;
}
.stock-form-grid textarea {
    min-height: 80px;
    resize: vertical;
}
.admin-login-gate {
    background: linear-gradient(135deg, #f8fbff 0%, #eef6ff 100%);
    border: 1px solid #dbeafe;
    border-radius: 22px;
    padding: 26px;
    max-width: 520px;
    margin: 0 auto;
    box-shadow: 0 18px 40px rgba(8,127,112, 0.08);
}
.admin-login-gate .login-panel-header {
    text-align: center;
    margin-bottom: 18px;
}
.admin-login-gate .brand-lock {
    width: 72px;
    height: 72px;
    border-radius: 18px;
    margin: 0 auto 12px;
    display: grid;
    place-items: center;
    background: linear-gradient(135deg, #36a77f 0%, #087f70 100%);
    color: white;
    font-weight: 900;
    font-size: 1.5rem;
}
.admin-login-gate h3 {
    margin: 0;
    color: #0f172a;
    font-size: 1.8rem;
}
.admin-login-gate p {
    color: #475569;
}
.admin-login-gate .login-field {
    display: grid;
    gap: 8px;
    margin-top: 12px;
}
.admin-login-gate .login-field label {
    color: #0f172a;
    font-weight: 700;
}
.admin-login-gate .password-row {
    position: relative;
}
.admin-login-gate .password-row input {
    width: 100%;
    padding-right: 42px;
}
.admin-login-gate .toggle-password {
    position: absolute;
    top: 50%;
    right: 12px;
    transform: translateY(-50%);
    border: none;
    background: transparent;
    color: #64748b;
    font-weight: 700;
    cursor: pointer;
}
.admin-login-gate .login-actions {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    margin-top: 18px;
}
.admin-login-gate .login-btn-primary,         .admin-login-gate .login-btn-secondary {
    border-radius: 10px;
    padding: 11px 16px;
    font-weight: 700;
    cursor: pointer;
}
.admin-login-gate .login-btn-primary {
    background: linear-gradient(135deg, #0b8978 0%, #075e55 100%);
    border: none;
    color: #fff;
}
.admin-login-gate .login-btn-secondary {
    background: #fff;
    border: 1px solid #cbd5e1;
    color: #334155;
}
.submit-loading {
    opacity: 0.7;
    pointer-events: none;
}
.hidden {
    display: none !important;
}
@media (min-width: 1100px) {
    .admin-info-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}
@media (min-width: 768px) and (max-width: 1099px) {
    .admin-shell {
        grid-template-columns: 220px minmax(0, 1fr);
    }
    .admin-info-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}
@media (max-width: 767px) {
    .admin-shell {
        grid-template-columns: 1fr;
    }
    .admin-sidebar {
        padding: 16px 14px;
        border-radius: 16px;
    }
    .admin-nav-list {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .admin-topbar {
        flex-direction: column;
        align-items: flex-start;
    }
    .admin-topbar-meta {
        width: 100%;
        justify-content: space-between;
    }
    .admin-info-grid {
        grid-template-columns: 1fr;
    }
    .status-form {
        grid-template-columns: 1fr;
    }
    .status-form button {
        width: 100%;
        min-height: 46px;
    }
    .admin-card {
        padding: 14px;
    }
}


@media (max-width: 768px) {
    .navbar .nav-right {
        gap: 8px !important;
    }
    .navbar .nav-links {
        gap: 4px !important;
    }
    .navbar .nav-links > li {
        height: auto !important;
        min-height: 0 !important;
    }
    .navbar .dropdown-content:not(.show) {
        display: none !important;
        height: 0 !important;
        min-height: 0 !important;
        max-height: 0 !important;
        overflow: hidden !important;
        margin: 0 !important;
        padding: 0 !important;
        border: 0 !important;
    }
    .navbar .dropdown-content.show {
        display: block !important;
        height: auto !important;
        max-height: none !important;
        overflow: visible !important;
        margin-top: 6px !important;
        padding: 6px 0 !important;
        border: 1px solid #e2e8f0 !important;
    }
    .navbar .login-dropdown {
        margin-top: 2px !important;
    }
}
@media (max-width: 480px) {
    .navbar {
        gap: 8px !important;
    }
    .navbar .nav-right {
        gap: 6px !important;
    }
    .navbar .nav-links {
        gap: 2px !important;
    }
    .navbar .nav-links > li > a {
        min-height: 36px !important;
        padding: 6px 0 !important;
    }
}


@media (max-width: 768px) {
    .site-footer {
        width: 100%;
        margin-top: 14px;
        padding: 16px 14px 10px !important;
        border-radius: 14px 14px 0 0;
        overflow: hidden;
    }
    .site-footer-grid {
        display: flex !important;
        flex-direction: row !important;
        align-items: flex-start !important;
        gap: 18px !important;
        width: 100%;
        overflow-x: auto !important;
        overflow-y: hidden !important;
        padding: 2px 2px 10px !important;
        scroll-snap-type: x proximity;
        -webkit-overflow-scrolling: touch;
    }
    .site-footer-grid::-webkit-scrollbar {
        height: 5px;
    }
    .site-footer-grid > * {
        flex: 0 0 185px !important;
        min-width: 185px !important;
        max-width: 185px !important;
        scroll-snap-align: start;
    }

    .site-footer-grid > :first-child {
        flex-basis: 250px !important;
        min-width: 250px !important;
        max-width: 250px !important;
    }
    .site-footer h4 {
        font-size: 16px !important;
        margin-bottom: 8px !important;
    }
    .site-footer p,             .site-footer li,             .site-footer a {
        font-size: 13px !important;
        line-height: 1.45 !important;
    }
    .site-footer ul {
        margin: 0;
        padding: 0;
    }
    .site-footer-bottom {
        margin-top: 8px !important;
        padding-top: 10px !important;
        font-size: 11px !important;
        text-align: center;
    }
}
@media (max-width: 480px) {
    .site-footer {
        padding: 14px 10px 8px !important;
    }
    .site-footer-grid {
        gap: 14px !important;
        padding-bottom: 8px !important;
    }
    .site-footer-grid > * {
        flex-basis: 165px !important;
        min-width: 165px !important;
        max-width: 165px !important;
    }
    .site-footer-grid > :first-child {
        flex-basis: 220px !important;
        min-width: 220px !important;
        max-width: 220px !important;
    }
    .site-footer h4 {
        font-size: 15px !important;
    }
    .site-footer p,             .site-footer li,             .site-footer a {
        font-size: 12px !important;
    }
}
@media (max-width: 360px) {
    .site-footer-grid > * {
        flex-basis: 150px !important;
        min-width: 150px !important;
        max-width: 150px !important;
    }
    .site-footer-grid > :first-child {
        flex-basis: 195px !important;
        min-width: 195px !important;
        max-width: 195px !important;
    }
}


@media (max-width: 768px) {
    .site-footer {
        font-size: 13px !important;
    }
    .site-footer-grid {
        gap: 16px !important;
    }
    .site-footer-grid > * {
        flex: 0 0 170px !important;
        min-width: 170px !important;
        max-width: 170px !important;
    }
    .site-footer-grid > :first-child {
        flex: 0 0 220px !important;
        min-width: 220px !important;
        max-width: 220px !important;
    }
    .site-footer-brand {
        gap: 4px !important;
    }
    .site-footer-brand img {
        width: 38px !important;
        max-width: 38px !important;
        height: auto !important;
        margin-bottom: 2px !important;
    }
    .site-footer h4 {
        font-size: 15px !important;
        line-height: 1.25 !important;
        font-weight: 700 !important;
        margin: 0 0 7px !important;
    }
    .site-footer p,             .site-footer li,             .site-footer a {
        font-size: 13px !important;
        line-height: 1.45 !important;
        font-weight: 400 !important;
    }
    .site-footer ul {
        display: flex;
        flex-direction: column;
        gap: 5px;
        list-style: none;
    }
    .site-footer-bottom {
        font-size: 10px !important;
        line-height: 1.4 !important;
        margin-top: 8px !important;
        padding-top: 9px !important;
    }
}
@media (max-width: 480px) {
    .site-footer {
        padding: 12px 10px 8px !important;
        font-size: 12px !important;
    }
    .site-footer-grid {
        gap: 12px !important;
        padding-bottom: 7px !important;
    }
    .site-footer-grid > * {
        flex: 0 0 155px !important;
        min-width: 155px !important;
        max-width: 155px !important;
    }
    .site-footer-grid > :first-child {
        flex: 0 0 195px !important;
        min-width: 195px !important;
        max-width: 195px !important;
    }
    .site-footer-brand img {
        width: 34px !important;
        max-width: 34px !important;
    }
    .site-footer h4 {
        font-size: 14px !important;
        margin-bottom: 6px !important;
    }
    .site-footer p,             .site-footer li,             .site-footer a {
        font-size: 12px !important;
        line-height: 1.4 !important;
    }
    .site-footer ul {
        gap: 4px;
    }
    .site-footer-bottom {
        font-size: 9px !important;
        line-height: 1.35 !important;
    }
}
@media (max-width: 360px) {
    .site-footer-grid > * {
        flex: 0 0 145px !important;
        min-width: 145px !important;
        max-width: 145px !important;
    }
    .site-footer-grid > :first-child {
        flex: 0 0 180px !important;
        min-width: 180px !important;
        max-width: 180px !important;
    }
    .site-footer h4 {
        font-size: 13px !important;
    }
    .site-footer p,             .site-footer li,             .site-footer a {
        font-size: 11px !important;
    }
}


.nav-toggle {
    display: none;
    border: 1px solid #cbd5e1;
    border-radius: 8px;
    width: 42px;
    height: 42px;
    background: #ffffff;
    color: #0f172a;
    font-size: 1.35rem;
    line-height: 1;
    cursor: pointer;
}
.admin-menu-toggle {
    display: none;
    width: 38px;
    height: 38px;
    border: 1px solid #b5e8d2;
    border-radius: 9px;
    background: #f0f9ff;
    color: #075e55;
    font-size: 1.2rem;
    cursor: pointer;
    place-items: center;
    flex: 0 0 auto;
}
.admin-title-row {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
}
@media (max-width: 900px) {
    .navbar {
        flex-direction: row;
        align-items: center;
        flex-wrap: wrap;
        padding: 10px 12px;
    }
    .brand {
        width: auto;
        min-width: 0;
        flex: 1 1 auto;
    }
    .nav-toggle {
        display: inline-grid;
        place-items: center;
        flex: 0 0 auto;
        color: #075e55;
        border-color: #b5e8d2;
        background: #f0f9ff;
        box-shadow: 0 10px 18px rgba(15, 23, 42, 0.06);
    }
    .nav-right {
        display: flex !important;
        flex: 1 0 100%;
        flex-direction: column;
        align-items: stretch;
        gap: 10px;
        max-height: 0;
        margin-top: 0;
        padding-top: 0;
        overflow: hidden;
        opacity: 0;
        visibility: hidden;
        border-top: 1px solid transparent;
        transition:                     max-height 0.28s ease,                     opacity 0.18s ease,                     margin 0.28s ease,                     padding 0.28s ease,                     border-color 0.2s ease,                     visibility 0s linear 0.28s;
    }
    .navbar.nav-open .nav-right {
        max-height: 680px;
        margin-top: 4px;
        padding-top: 8px;
        opacity: 1;
        visibility: visible;
        border-top-color: #e2e8f0;
        transition-delay: 0s;
    }
    .nav-links {
        display: flex;
        flex-direction: column;
        align-items: stretch;
        width: 100%;
        gap: 8px;
    }
    .nav-links li,             .nav-links li a,             .login-dropdown,             .btn-login {
        width: 100%;
    }
    .nav-links li a,             .btn-login {
        min-height: 42px;
        padding: 9px 12px !important;
        border: 1px solid #e2e8f0;
        border-radius: 8px;
        justify-content: flex-start;
        color: #334155;
        font-size: 0.95rem !important;
        font-weight: 650 !important;
        line-height: 1.35;
        background: #ffffff;
        box-shadow: 0 4px 10px rgba(15, 23, 42, 0.03);
    }
    .nav-links li a.active {
        color: #075e55;
        background: #e0f2fe;
        border-color: #8ddbb9;
    }
    .dropdown-content,             .login-dropdown-content {
        position: static !important;
        width: 100% !important;
        min-width: 0 !important;
        max-width: none !important;
        transform: none !important;
    }
    .dropdown-content {
        display: none !important;
        margin-top: 6px !important;
        opacity: 1 !important;
        visibility: visible !important;
        height: 0 !important;
        padding: 0 !important;
        border: 0 !important;
        overflow: hidden !important;
    }
    .dropdown-content.show {
        display: block !important;
        height: auto !important;
        padding: 6px 0 !important;
        border: 1px solid #dbe4ef !important;
        overflow: visible !important;
    }
    .dropdown-content li a,             .login-dropdown-content a {
        min-height: 40px;
        padding: 9px 12px !important;
        font-size: 0.9rem !important;
        white-space: normal;
        line-height: 1.45;
    }
    .login-dropdown-content {
        display: none !important;
        opacity: 1 !important;
        visibility: visible !important;
        pointer-events: auto !important;
    }
    .login-dropdown-content.show {
        display: block !important;
    }

    html[data-leressae-theme="dark"] .navbar,
    html[data-theme="dark"] .navbar,
    body.dark-mode .navbar {
        background: rgba(11, 18, 32, 0.96) !important;
        border-color: rgba(148, 163, 184, 0.18) !important;
        box-shadow: 0 12px 28px rgba(2, 6, 23, 0.28) !important;
    }
    html[data-leressae-theme="dark"] .nav-toggle,
    html[data-theme="dark"] .nav-toggle,
    body.dark-mode .nav-toggle {
        background: rgba(15, 23, 42, 0.92) !important;
        border-color: rgba(148, 163, 184, 0.28) !important;
        color: #e2e8f0 !important;
        box-shadow: 0 10px 18px rgba(2, 6, 23, 0.26) !important;
    }
    html[data-leressae-theme="dark"] .nav-right,
    html[data-theme="dark"] .nav-right,
    body.dark-mode .nav-right {
        border-top-color: rgba(148, 163, 184, 0.18) !important;
    }
    html[data-leressae-theme="dark"] .nav-links li a,
    html[data-theme="dark"] .nav-links li a,
    body.dark-mode .nav-links li a,
    html[data-leressae-theme="dark"] .btn-login,
    html[data-theme="dark"] .btn-login,
    body.dark-mode .btn-login {
        background: rgba(15, 23, 42, 0.82) !important;
        border-color: rgba(148, 163, 184, 0.22) !important;
        color: #e2e8f0 !important;
    }
    html[data-leressae-theme="dark"] .nav-links li a.active,
    html[data-theme="dark"] .nav-links li a.active,
    body.dark-mode .nav-links li a.active {
        color: #b5e8d2 !important;
        background: rgba(8,127,112, 0.24) !important;
        border-color: rgba(129, 204, 176, 0.42) !important;
    }
    html[data-leressae-theme="dark"] .dropdown-content.show,
    html[data-theme="dark"] .dropdown-content.show,
    body.dark-mode .dropdown-content.show,
    html[data-leressae-theme="dark"] .login-dropdown-content.show,
    html[data-theme="dark"] .login-dropdown-content.show,
    body.dark-mode .login-dropdown-content.show {
        background: rgba(15, 23, 42, 0.98) !important;
        border-color: rgba(148, 163, 184, 0.2) !important;
    }
    html[data-leressae-theme="dark"] .dropdown-content li a,
    html[data-theme="dark"] .dropdown-content li a,
    body.dark-mode .dropdown-content li a,
    html[data-leressae-theme="dark"] .login-dropdown-content a,
    html[data-theme="dark"] .login-dropdown-content a,
    body.dark-mode .login-dropdown-content a {
        color: #dbeafc !important;
        background: transparent !important;
    }
    html[data-leressae-theme="dark"] .dropdown-content li a:hover,
    html[data-theme="dark"] .dropdown-content li a:hover,
    body.dark-mode .dropdown-content li a:hover,
    html[data-leressae-theme="dark"] .login-dropdown-content a:hover,
    html[data-theme="dark"] .login-dropdown-content a:hover,
    body.dark-mode .login-dropdown-content a:hover {
        background: rgba(8, 127, 112, 0.18) !important;
        color: #8ddbb9 !important;
    }
}
@media (max-width: 767px) {
    .admin-shell {
        gap: 12px;
    }
    .admin-sidebar {
        display: block;
        position: fixed;
        z-index: 1300;
        top: 0;
        left: 0;
        width: min(280px, 86vw);
        height: 100dvh;
        overflow-y: auto;
        border-radius: 0 18px 18px 0;
        transform: translateX(-105%);
        transition: transform 0.24s ease, opacity 0.18s ease,                     visibility 0s linear 0.24s;
        box-shadow: 16px 0 36px rgba(15, 23, 42, 0.22);
        opacity: 0;
        visibility: hidden;
    }
    .admin-shell.admin-menu-open .admin-sidebar {
        transform: translateX(0);
        opacity: 1;
        visibility: visible;
        transition-delay: 0s;
    }
    .admin-menu-toggle {
        display: inline-grid;
    }
    .admin-nav-list {
        grid-template-columns: 1fr !important;
        gap: 6px;
    }
    .admin-nav-list button {
        padding: 11px 12px;
        font-size: 0.9rem;
    }
    .admin-topbar {
        padding: 14px;
        margin-bottom: 12px;
    }
    .admin-topbar-meta {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 8px;
        justify-content: stretch;
    }
    .admin-topbar-meta .admin-logout-btn {
        grid-column: 1 / -1;
    }
    .admin-sidebar .admin-brand-box,             .admin-sidebar .admin-nav-list {
        opacity: 0;
        transform: translateX(-8px);
        transition: opacity 0.18s ease 0.06s,                     transform 0.22s ease 0.06s;
    }
    .admin-shell.admin-menu-open .admin-sidebar .admin-brand-box,             .admin-shell.admin-menu-open .admin-sidebar .admin-nav-list {
        opacity: 1;
        transform: translateX(0);
    }
}

.site-footer {
    width: 100%;
    overflow: hidden;
}
.site-footer-grid {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 18px;
    align-items: start;
}
@media (max-width: 900px) {
    .site-footer-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
        gap: 14px;
    }
    .site-footer h4 {
        font-size: 0.78rem !important;
        margin-bottom: 6px;
        line-height: 1.3;
    }
    .site-footer p,             .site-footer li,             .site-footer a {
        font-size: 0.68rem !important;
        line-height: 1.45;
        overflow-wrap: anywhere;
        word-break: break-word;
    }
}
@media (max-width: 640px) {
    .site-footer {
        margin-top: 18px;
        padding: 20px 12px 14px !important;
        border-radius: 12px 12px 0 0;
    }
    .site-footer-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
        gap: 8px;
        width: 100%;
    }
    .site-footer h4 {
        font-size: 0.72rem !important;
        margin-bottom: 6px;
        line-height: 1.3;
    }
    .site-footer p,             .site-footer li,             .site-footer a {
        font-size: 0.64rem !important;
        line-height: 1.45;
        overflow-wrap: anywhere;
        word-break: break-word;
    }
    .site-footer-bottom {
        margin-top: 14px !important;
        padding-top: 10px !important;
        font-size: 0.65rem !important;
        line-height: 1.4;
    }
}
@media (max-width: 480px) {
    .site-footer {
        padding: 18px 8px 12px !important;
        margin-top: 16px;
    }
    .site-footer-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
        gap: 6px;
    }
    .site-footer h4 {
        font-size: 0.65rem !important;
        margin-bottom: 5px;
    }
    .site-footer p,             .site-footer li,             .site-footer a {
        font-size: 0.58rem !important;
        line-height: 1.4;
    }
    .site-footer-bottom {
        margin-top: 12px !important;
        padding-top: 9px !important;
        font-size: 0.58rem !important;
    }
}
@media (max-width: 360px) {
    .site-footer {
        padding: 16px 6px 10px !important;
    }
    .site-footer-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
        gap: 5px;
    }
    .site-footer h4 {
        font-size: 0.58rem !important;
        margin-bottom: 4px;
    }
    .site-footer p,             .site-footer li,             .site-footer a {
        font-size: 0.52rem !important;
        line-height: 1.35;
    }
    .site-footer-bottom {
        font-size: 0.52rem !important;
    }
}

.hero-desc {
    color: #000000 !important;
}


.btn-login {
    position: relative !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 10px !important;
    min-height: 42px !important;
    padding: 9px 18px !important;
    border: 1px solid rgba(255,255,255,0.16) !important;
    border-radius: 12px !important;
    background: linear-gradient(135deg, #0b917d 0%, #075e55 100%) !important;
    color: #ffffff !important;
    font-size: 0.92rem !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    letter-spacing: 0.01em !important;
    box-shadow:                 0 6px 16px rgba(8, 112, 91, 0.22),                 inset 0 1px 0 rgba(255,255,255,0.16) !important;
    cursor: pointer !important;
    transition: transform 0.2s ease, box-shadow 0.2s ease, background 0.2s ease !important;
    overflow: hidden !important;
}
.btn-login-icon {
    width: 19px !important;
    height: 19px !important;
    flex: 0 0 19px !important;
    display: block !important;
    stroke: #ffffff !important;
    fill: none !important;
    stroke-width: 1.9 !important;
    stroke-linecap: round !important;
    stroke-linejoin: round !important;
}
.btn-login span {
    display: inline-block !important;
    color: #ffffff !important;
}
.btn-login:hover {
    color: #ffffff !important;
    background: linear-gradient(135deg, #087d6d 0%, #064e46 100%) !important;
    transform: translateY(-1px) !important;
    box-shadow:                 0 9px 22px rgba(8, 112, 91, 0.30),                 inset 0 1px 0 rgba(255,255,255,0.20) !important;
}
.btn-login:active {
    transform: translateY(0) scale(0.98) !important;
    box-shadow: 0 3px 8px rgba(8, 112, 91, 0.20) !important;
}
.btn-login:focus-visible {
    outline: 3px solid rgba(8,127,112, 0.28) !important;
    outline-offset: 2px !important;
}

.login-dropdown-content {
    margin-top: 8px !important;
    padding: 6px !important;
    border: 1px solid #dbeafe !important;
    border-radius: 14px !important;
    background: rgba(255,255,255,0.98) !important;
    box-shadow: 0 16px 36px rgba(15,23,42,0.16) !important;
}
.login-dropdown-content a {
    display: flex !important;
    align-items: center !important;
    gap: 9px !important;
    min-height: 42px !important;
    padding: 10px 12px !important;
    border-radius: 9px !important;
    color: #334155 !important;
    transition: background 0.18s ease, color 0.18s ease, transform 0.18s ease !important;
}
.login-dropdown-content a::before {
    content: "•" !important;
    color: #087f70 !important;
    font-size: 18px !important;
    line-height: 1 !important;
}
.login-dropdown-content a:hover {
    background: #eff6ff !important;
    color: #075e55 !important;
    transform: translateX(2px) !important;
}

@media (max-width: 900px) {
    .btn-login {
        width: auto !important;
        min-width: 104px !important;
        min-height: 42px !important;
        padding: 9px 15px !important;
        border-radius: 11px !important;
        font-size: 0.88rem !important;
    }
    .btn-login::before {
        width: 19px !important;
        height: 19px !important;
        font-size: 11px !important;
    }
}
@media (max-width: 480px) {
    .btn-login {
        min-width: 96px !important;
        min-height: 40px !important;
        padding: 8px 13px !important;
        font-size: 0.84rem !important;
    }
}


@media (max-width: 767px) {
    body.admin-mode {
        overflow-x: hidden !important;
    }
    body.admin-mode > .wrapper {
        width: 100% !important;
        max-width: 100% !important;
        padding-left: 10px !important;
        padding-right: 10px !important;
        box-sizing: border-box !important;
    }
    .admin-shell {
        display: block !important;
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
        overflow: visible !important;
    }
    .admin-content {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        overflow: visible !important;
    }

    .admin-topbar {
        width: 100% !important;
        box-sizing: border-box !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 12px !important;
        padding: 12px !important;
        margin-bottom: 12px !important;
        border-radius: 14px !important;
    }
    .admin-title-row {
        width: 100% !important;
        min-width: 0 !important;
        display: flex !important;
        align-items: center !important;
        gap: 9px !important;
    }
    .admin-title-row > div {
        min-width: 0 !important;
    }
    .admin-topbar h2 {
        font-size: 1.05rem !important;
        line-height: 1.25 !important;
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
    }
    .admin-breadcrumb {
        font-size: 0.68rem !important;
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
    }
    .admin-menu-toggle {
        width: 36px !important;
        height: 36px !important;
        min-width: 36px !important;
        border-radius: 9px !important;
        font-size: 1.05rem !important;
    }
    .admin-topbar-meta {
        width: 100% !important;
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
        gap: 7px !important;
    }
    .admin-user-chip,             .admin-sync-badge {
        min-width: 0 !important;
        width: 100% !important;
        box-sizing: border-box !important;
        padding: 7px 8px !important;
        font-size: 0.68rem !important;
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        text-align: center !important;
    }
    .admin-topbar-meta .admin-logout-btn {
        grid-column: 1 / -1 !important;
        width: 100% !important;
        min-height: 38px !important;
        margin: 0 !important;
    }

    .admin-panels {
        width: 100% !important;
        min-width: 0 !important;
        gap: 12px !important;
    }
    .admin-card {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
        padding: 12px !important;
        border-radius: 14px !important;
        overflow: hidden !important;
    }
    .admin-card-header {
        width: 100% !important;
        min-width: 0 !important;
        gap: 8px !important;
        margin-bottom: 12px !important;
    }
    .admin-card-header h3 {
        font-size: 0.88rem !important;
        line-height: 1.3 !important;
    }

    .admin-stat-grid-8 {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 8px !important;
        width: 100% !important;
        min-width: 0 !important;
    }
    .admin-stat-mini {
        min-width: 0 !important;
        width: 100% !important;
        box-sizing: border-box !important;
        padding: 12px 10px !important;
        border-radius: 11px !important;
        min-height: 68px !important;
    }
    .admin-stat-mini .label {
        font-size: 0.55rem !important;
        line-height: 1.3 !important;
        letter-spacing: 0.06em !important;
        white-space: normal !important;
        overflow-wrap: anywhere !important;
    }
    .admin-stat-mini .value {
        margin-top: 6px !important;
        font-size: 1.05rem !important;
        line-height: 1 !important;
    }

    .chart-grid {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
        gap: 10px !important;
        width: 100% !important;
        min-width: 0 !important;
    }
    .chart-box {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
        padding: 11px !important;
        border-radius: 11px !important;
        overflow: hidden !important;
    }
    .chart-box h4 {
        font-size: 0.72rem !important;
        margin-bottom: 9px !important;
    }
    .mini-bars {
        width: 100% !important;
        min-width: 0 !important;
        height: 105px !important;
        gap: 5px !important;
        padding-top: 8px !important;
        box-sizing: border-box !important;
    }
    .mini-bars span {
        min-width: 0 !important;
    }
    .mini-bars span::after {
        font-size: 0.48rem !important;
        bottom: -15px !important;
    }
    .mini-donut-wrap {
        width: 100% !important;
        min-width: 0 !important;
        gap: 6px !important;
    }
    .donut-pill {
        max-width: 100% !important;
        box-sizing: border-box !important;
        padding: 6px 8px !important;
        font-size: 0.58rem !important;
        line-height: 1.25 !important;
        overflow-wrap: anywhere !important;
    }

    .admin-card .admin-table-wrap {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        overflow-x: auto !important;
    }
    .admin-card-header .btn-primary {
        min-height: 34px !important;
        padding: 7px 10px !important;
        font-size: 0.68rem !important;
        border-radius: 8px !important;
    }
}
@media (max-width: 480px) {
    body.admin-mode > .wrapper {
        padding-left: 8px !important;
        padding-right: 8px !important;
    }
    .admin-topbar {
        padding: 10px !important;
        border-radius: 12px !important;
    }
    .admin-topbar-meta {
        gap: 6px !important;
    }
    .admin-user-chip,             .admin-sync-badge {
        font-size: 0.62rem !important;
        padding: 6px !important;
    }
    .admin-topbar-meta .admin-logout-btn {
        min-height: 36px !important;
        font-size: 0.72rem !important;
    }
    .admin-card {
        padding: 10px !important;
        border-radius: 12px !important;
    }
    .admin-card-header h3 {
        font-size: 0.82rem !important;
    }
    .admin-stat-grid-8 {
        gap: 7px !important;
    }
    .admin-stat-mini {
        padding: 10px 8px !important;
        min-height: 62px !important;
        border-radius: 10px !important;
    }
    .admin-stat-mini .label {
        font-size: 0.5rem !important;
    }
    .admin-stat-mini .value {
        font-size: 1rem !important;
    }
    .chart-box {
        padding: 10px !important;
    }
    .mini-bars {
        height: 95px !important;
        gap: 4px !important;
    }
    .donut-pill {
        font-size: 0.54rem !important;
        padding: 5px 7px !important;
    }
}


html, body {
    min-height: 100%;
}
body {
    min-height: 100vh !important;
    display: flex !important;
    flex-direction: column !important;
}

body > .wrapper {
    flex: 1 0 auto !important;
    width: 100%;
}

body > .site-footer {
    flex: 0 0 auto !important;
    width: 100% !important;
    margin-top: auto !important;
    position: relative !important;
    bottom: auto !important;
    transform: none !important;
}

body > script {
    flex: 0 0 auto;
}
@media (max-width: 768px) {
    body > .site-footer {
        margin-top: auto !important;
    }
}


.navbar {
    display: flex !important;
    visibility: visible !important;
    pointer-events: auto !important;
}
.navbar.role-session-navbar-hidden {
    display: none !important;
    visibility: hidden !important;
    pointer-events: none !important;
}


.bon-total-panel {
    overflow: hidden;
}
.bon-total-table-scroll {
    width:100%;
    overflow-x:auto;
    -webkit-overflow-scrolling:touch;
    border:1px solid #e2e8f0;
    border-radius:10px;
    background:#fff;
}
.bon-total-table {
    min-width:2050px;
    margin:0;
}
.bon-total-table th, .bon-total-table td {
    min-width:92px;
    vertical-align:top;
    white-space:normal;
    line-height:1.35;
}
.bon-total-table th:nth-child(1) {
    min-width:170px;
}
.bon-total-table th:nth-child(2) {
    min-width:330px;
}
.bon-total-table th:nth-child(3) {
    min-width:110px;
}
.bon-total-table th:nth-child(4), .bon-total-table th:nth-child(5) {
    min-width:125px;
}
.bon-total-group-row td {
    font-weight:700;
    background:#f8fafc;
    color:#334155;
}
.bon-total-summary-row td {
    font-weight:800;
    background:#f1f5f9;
}


.technician-shell {
    display:grid;
    grid-template-columns:260px minmax(0,1fr);
    min-height:720px;
    background:#f8fafc;
    border:1px solid #dbe4ef;
    border-radius:18px;
    overflow:hidden;
    box-shadow:0 16px 40px rgba(15,23,42,.08);
    margin:-10px -8px 0;
}
.technician-sidebar {
    background:linear-gradient(180deg,#0B2A4A 0%,#061B33 100%);
    color:#fff;
    padding:22px 16px;
    display:flex;
    flex-direction:column;
    min-width:0;
}
.technician-brand {
    padding:4px 14px 18px;
    border-bottom:1px solid rgba(255,255,255,.16)
}
.technician-brand strong {
    display:block;
    font-size:21px;
    letter-spacing:.02em
}
.technician-brand span {
    display:block;
    color:#cbd5e1;
    font-size:13px;
    margin-top:4px
}
.technician-user {
    margin:16px 0;
    padding:13px;
    border:1px solid rgba(255,255,255,.13);
    background:rgba(255,255,255,.08);
    border-radius:16px;
    display:flex;
    align-items:center;
    gap:11px;
}
.technician-avatar {
    width:42px;
    height:42px;
    border-radius:50%;
    background:#fff;
    color:#0B2A4A;
    display:flex;
    align-items:center;
    justify-content:center;
    font-weight:800;
    flex:0 0 auto;
}
.technician-user strong {
    display:block;
    font-size:14px
}
.technician-user small {
    display:block;
    color:#cbd5e1;
    margin-top:2px
}
.technician-nav {
    display:flex;
    flex-direction:column;
    gap:5px
}
.technician-nav button {
    width:100%;
    border:0;
    background:transparent;
    color:#dbeafe;
    text-align:left;
    padding:12px 13px;
    border-radius:12px;
    cursor:pointer;
    font:600 14px inherit;
    display:flex;
    align-items:center;
    gap:10px;
    transition:.18s ease;
}
.technician-nav button:hover {
    background:rgba(255,255,255,.09);
    color:#fff
}
.technician-nav button.active {
    background:#fff;
    color:#0B2A4A;
    box-shadow:0 8px 18px rgba(0,0,0,.12)
}
.technician-nav .tech-icon {
    width:22px;
    text-align:center;
    font-size:16px
}
.technician-logout {
    margin-top:auto!important;
    border:1px solid rgba(255,255,255,.2)!important;
    background:rgba(255,255,255,.06)!important;
    color:#fff!important;
    justify-content:center!important;
}
.technician-content {
    min-width:0;
    padding:24px;
    background:#f8fafc
}
.technician-topbar {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    margin-bottom:20px
}
.technician-topbar h2 {
    margin:0;
    color:#0f172a;
    font-size:24px
}
.technician-topbar p {
    margin:4px 0 0;
    color:#64748b;
    font-size:13px
}
.technician-mobile-menu,.technician-overlay {
    display:none
}
.technician-toolbar {
    display:flex;
    gap:10px;
    flex-wrap:wrap;
    align-items:center
}
.technician-toolbar input,.technician-toolbar select {
    min-height:40px;
    border:1px solid #cbd5e1;
    border-radius:10px;
    padding:9px 12px;
    background:#fff;
    color:#0f172a;
}
.tech-stat-grid {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:12px;
    margin-bottom:18px
}
.tech-stat {
    background:#fff;
    border:1px solid #e2e8f0;
    border-radius:14px;
    padding:16px;
    box-shadow:0 4px 14px rgba(15,23,42,.04)
}
.tech-stat .label {
    display:block;
    color:#64748b;
    font-size:12px;
    font-weight:700
}
.tech-stat .value {
    display:block;
    color:#0f172a;
    font-size:25px;
    font-weight:800;
    margin-top:4px
}
.tech-section {
    background:#fff;
    border:1px solid #e2e8f0;
    border-radius:14px;
    padding:18px;
    margin-bottom:16px;
}
.tech-section-header {
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:12px;
    flex-wrap:wrap;
    margin-bottom:14px
}
.tech-section-header h3 {
    margin:0;
    color:#0f172a;
    font-size:17px
}
.tech-table-wrap {
    overflow:auto;
    border:1px solid #e2e8f0;
    border-radius:12px
}
.tech-table {
    width:100%;
    border-collapse:collapse;
    min-width:760px
}
.tech-table th,.tech-table td {
    padding:11px 12px;
    border-bottom:1px solid #eef2f7;
    text-align:left;
    font-size:13px;
    vertical-align:middle
}
.tech-table th {
    background:#f8fafc;
    color:#475569;
    font-size:11px;
    text-transform:uppercase;
    letter-spacing:.04em
}
.tech-table tr:last-child td {
    border-bottom:0
}
.tech-table tr:hover td {
    background:#f8fbff
}
.tech-action-row {
    display:flex;
    gap:7px;
    flex-wrap:wrap
}
.tech-btn {
    border:0;
    border-radius:9px;
    padding:9px 12px;
    font-weight:700;
    cursor:pointer;
    background:linear-gradient(135deg,#0B2A4A,#061B33);
    color:#fff;
}
.tech-btn.secondary {
    background:#fff;
    color:#0B2A4A;
    border:1px solid #cbd5e1
}
.tech-btn.success {
    background:linear-gradient(135deg,#087f70,#075e55)
}
.tech-empty {
    padding:28px;
    text-align:center;
    color:#64748b
}
.tech-detail-grid {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:10px
}
.tech-detail-item {
    background:#f8fafc;
    border:1px solid #e2e8f0;
    border-radius:10px;
    padding:11px
}
.tech-detail-item span {
    display:block;
    color:#64748b;
    font-size:11px;
    font-weight:700;
    margin-bottom:3px
}
.tech-detail-item strong {
    color:#0f172a;
    font-size:13px
}
.tech-proof-card {
    display:grid;
    grid-template-columns:160px minmax(0,1fr);
    gap:16px;
    align-items:start
}
.tech-proof-preview {
    width:160px;
    height:120px;
    border:1px dashed #cbd5e1;
    border-radius:12px;
    display:flex;
    align-items:center;
    justify-content:center;
    overflow:hidden;
    background:#f8fafc;
    color:#64748b
}
.tech-proof-preview img {
    width:100%;
    height:100%;
    object-fit:cover
}
.tech-proof-input {
    border:1px solid #cbd5e1;
    border-radius:10px;
    padding:10px;
    width:100%;
    background:#fff
}
.tech-stock-summary {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:10px;
    margin-bottom:14px
}
.tech-stock-pill {
    padding:13px;
    border-radius:12px;
    background:#f8fafc;
    border:1px solid #e2e8f0
}
.tech-stock-pill strong {
    display:block;
    font-size:20px;
    color:#0f172a
}
.tech-stock-pill span {
    font-size:11px;
    color:#64748b;
    font-weight:700
}
.tech-status-badge {
    display:inline-flex;
    align-items:center;
    padding:5px 9px;
    border-radius:999px;
    font-size:11px;
    font-weight:800;
    white-space:nowrap
}
.tech-status-badge.safe {
    background:#dcfce7;
    color:#166534
}
.tech-status-badge.low {
    background:#fef3c7;
    color:#92400e
}
.tech-status-badge.empty {
    background:#eef3f0;
    color:#657870
}
.tech-status-badge.progress {
    background:#fff4df;
    color:#926000
}
.tech-status-badge.done {
    background:#dcfce7;
    color:#166534
}
.tech-modal-backdrop {
    position:fixed;
    inset:0;
    background:rgba(15,23,42,.58);
    display:none;
    align-items:center;
    justify-content:center;
    padding:18px;
    z-index:2147482000
}
.tech-modal-backdrop.show {
    display:flex
}
.tech-modal {
    width:min(720px,96vw);
    max-height:90vh;
    overflow:auto;
    background:#fff;
    border-radius:16px;
    border:1px solid #e2e8f0;
    box-shadow:0 25px 70px rgba(15,23,42,.25)
}
.tech-modal-header {
    padding:16px 18px;
    background:linear-gradient(135deg,#087f70,#075e55);
    color:#fff;
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:12px
}
.tech-modal-header h3 {
    margin:0;
    color:#fff;
    font-size:17px
}
.tech-modal-close {
    width:32px;
    height:32px;
    border:0;
    border-radius:50%;
    background:rgba(255,255,255,.12);
    color:#fff;
    cursor:pointer;
    font-size:18px
}
.tech-modal-body {
    padding:18px
}
.tech-form-row {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:12px
}
.tech-form-group {
    margin-bottom:12px
}
.tech-form-group label {
    display:block;
    font-size:12px;
    font-weight:700;
    color:#334155;
    margin-bottom:6px
}
.tech-form-group input,.tech-form-group textarea,.tech-form-group select {
    width:100%;
    border:1px solid #cbd5e1;
    border-radius:10px;
    padding:10px;
    background:#fff;
    color:#0f172a
}
.tech-form-group textarea {
    resize:vertical;
    min-height:90px
}
@media(max-width:900px) {
    .technician-shell {
        grid-template-columns:1fr;
        margin:0;
        border-radius:14px;
        min-height:640px
    }
    .technician-sidebar {
        position:fixed;
        top:0;
        left:0;
        bottom:0;
        width:min(310px,86vw);
        z-index:2147481000;
        transform:translateX(-105%);
        transition:transform .22s ease;
        box-shadow:20px 0 45px rgba(15,23,42,.22);
        border-radius:0;
    }
    .technician-shell.tech-menu-open .technician-sidebar {
        transform:translateX(0)
    }
    .technician-overlay {
        position:fixed;
        inset:0;
        background:rgba(15,23,42,.48);
        z-index:2147480900;
    }
    .technician-shell.tech-menu-open .technician-overlay {
        display:block
    }
    .technician-mobile-menu {
        display:inline-flex;
        width:42px;
        height:42px;
        border:1px solid #dbe4ef;
        border-radius:11px;
        background:#fff;
        color:#0B2A4A;
        align-items:center;
        justify-content:center;
        font-size:22px;
        cursor:pointer;
    }
    .technician-content {
        padding:16px
    }
    .tech-stat-grid {
        grid-template-columns:repeat(2,minmax(0,1fr))
    }
    .tech-stock-summary {
        grid-template-columns:repeat(2,minmax(0,1fr))
    }
}
@media(max-width:600px) {
    .technician-topbar h2 {
        font-size:19px
    }
    .technician-topbar p {
        font-size:12px
    }
    .tech-stat {
        padding:13px
    }
    .tech-stat .value {
        font-size:21px
    }
    .tech-detail-grid,.tech-form-row {
        grid-template-columns:1fr
    }
    .tech-proof-card {
        grid-template-columns:1fr
    }
    .tech-proof-preview {
        width:100%;
        height:180px
    }
    .technician-toolbar>* {
        width:100%
    }
}
@media(max-width:380px) {
    .tech-stat-grid,.tech-stock-summary {
        grid-template-columns:repeat(2,minmax(0,1fr));
        gap:8px
    }
}


.technician-shell, .technician-shell * {
    box-sizing:border-box
}
.technician-shell {
    width:100%;
    max-width:100%;
    min-width:0
}
.technician-content {
    min-width:0;
    overflow:hidden
}
.technician-topbar {
    min-width:0
}
.technician-topbar > div:first-child {
    min-width:0;
    flex:1 1 auto
}
.technician-topbar > div:first-child > div {
    min-width:0;
    max-width:100%
}
.technician-topbar h2 {
    max-width:100%;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis
}
.technician-topbar p {
    max-width:100%;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis
}
.technician-toolbar {
    flex:0 0 auto;
    min-width:0
}
.technician-toolbar .tech-btn {
    white-space:nowrap
}
.technician-nav {
    min-width:0
}
.technician-nav button {
    min-width:0
}
.technician-nav button > span:last-child {
    min-width:0;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap
}
.technician-user > div:last-child {
    min-width:0
}
.technician-user strong,.technician-user small {
    display:block;
    min-width:0;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap
}

.technician-sidebar .technician-logout {
    width:100% !important;
    min-height:42px !important;
    margin-top:auto !important;
    padding:9px 18px !important;
    border:1px solid rgba(255,255,255,.16) !important;
    border-radius:12px !important;
    background:linear-gradient(135deg,#0b8978 0%,#075e55 100%) !important;
    color:#fff !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    gap:10px !important;
    font:700 .92rem/1 inherit !important;
    letter-spacing:.01em !important;
    box-shadow:0 6px 16px rgba(8,127,112,.22),inset 0 1px 0 rgba(255,255,255,.16) !important;
    cursor:pointer !important;
    transition:transform .2s ease,box-shadow .2s ease,background .2s ease !important;
}
.technician-sidebar .technician-logout:hover {
    background:linear-gradient(135deg,#087868 0%,#064e46 100%) !important;
    transform:translateY(-1px) !important;
    box-shadow:0 9px 22px rgba(8,127,112,.28),inset 0 1px 0 rgba(255,255,255,.20) !important;
}
.technician-sidebar .technician-logout:active {
    transform:translateY(0) scale(.98) !important
}
.technician-sidebar .technician-logout:focus-visible {
    outline:3px solid rgba(105,198,159,.5) !important;
    outline-offset:2px !important
}

.technician-shell .tech-table-wrap {
    max-width:100%;
    overflow-x:auto;
    overflow-y:hidden;
    -webkit-overflow-scrolling:touch
}
.technician-shell .tech-table {
    min-width:720px
}
.technician-shell .tech-section {
    min-width:0;
    max-width:100%
}
.technician-shell .tech-section-header > * {
    min-width:0
}
.technician-shell .tech-section-header h3 {
    overflow-wrap:anywhere
}
.technician-shell input,.technician-shell select,.technician-shell textarea,.technician-shell button {
    max-width:100%
}
.technician-shell .tech-proof-input {
    min-width:0
}
@media (max-width: 900px) {
    .technician-shell {
        margin:0;
        border-radius:14px;
        min-height:640px
    }
    .technician-content {
        padding:16px
    }
}
@media (max-width: 600px) {
    .technician-shell {
        border-radius:12px
    }
    .technician-content {
        padding:12px
    }
    .technician-topbar {
        align-items:flex-start;
        gap:9px;
        margin-bottom:14px
    }
    .technician-topbar > div:first-child {
        gap:9px !important
    }
    .technician-mobile-menu {
        width:40px;
        height:40px;
        min-width:40px;
        flex:0 0 40px
    }
    .technician-topbar h2 {
        font-size:18px;
        line-height:1.25
    }
    .technician-topbar p {
        font-size:11px;
        line-height:1.35;
        white-space:normal;
        display:-webkit-box;
        -webkit-box-orient:vertical;
        -webkit-line-clamp:2;
        overflow:hidden;
        text-overflow:ellipsis
    }
    .technician-toolbar {
        width:auto
    }
    .technician-toolbar .tech-btn {
        min-height:40px;
        padding:8px 11px
    }
    .tech-stat-grid,.tech-stock-summary {
        grid-template-columns:repeat(2,minmax(0,1fr));
        gap:8px
    }
    .tech-stat {
        padding:12px;
        border-radius:12px
    }
    .tech-stat .value {
        font-size:20px
    }
    .tech-section {
        padding:13px;
        border-radius:12px
    }
    .tech-section-header {
        align-items:flex-start;
        gap:9px
    }
    .tech-section-header > .technician-toolbar {
        width:100%
    }
    .tech-section-header > .technician-toolbar > * {
        width:100%
    }
    .tech-proof-card {
        grid-template-columns:1fr
    }
    .tech-proof-preview {
        width:100%;
        height:170px
    }
    .tech-form-row,.tech-detail-grid {
        grid-template-columns:1fr
    }
    .tech-action-row {
        width:100%
    }
    .tech-action-row .tech-btn {
        flex:1 1 auto
    }
}
@media (max-width: 380px) {
    .technician-content {
        padding:10px
    }
    .technician-topbar {
        gap:7px
    }
    .technician-mobile-menu {
        width:38px;
        height:38px;
        min-width:38px;
        flex-basis:38px;
        font-size:20px
    }
    .technician-topbar h2 {
        font-size:16px
    }
    .technician-topbar p {
        font-size:10.5px
    }
    .technician-topbar .technician-toolbar {
        display:none
    }
    .tech-stat-grid,.tech-stock-summary {
        grid-template-columns:repeat(2,minmax(0,1fr));
        gap:7px
    }
    .tech-section {
        padding:11px
    }
    .tech-table {
        min-width:680px
    }
}
@media (max-width: 320px) {
    .technician-content {
        padding:8px
    }
    .technician-topbar h2 {
        font-size:15px
    }
    .technician-topbar p {
        -webkit-line-clamp:2
    }
}


.admin-sidebar .admin-sidebar-logout {
    width:100% !important;
    min-height:42px !important;
    margin-top:8px !important;
    padding:9px 18px !important;
    border:1px solid rgba(255,255,255,.16) !important;
    border-radius:12px !important;
    background:linear-gradient(135deg,#0b8978 0%,#075e55 100%) !important;
    color:#fff !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    gap:10px !important;
    font:700 .92rem/1 inherit !important;
    letter-spacing:.01em !important;
    box-shadow:0 6px 16px rgba(8,127,112,.22),inset 0 1px 0 rgba(255,255,255,.16) !important;
    cursor:pointer !important;
    transition:transform .2s ease,box-shadow .2s ease,background .2s ease !important;
}
.admin-sidebar .admin-sidebar-logout .admin-nav-icon {
    width:18px !important;
    height:18px !important;
    flex:0 0 18px !important;
    stroke:currentColor !important;
}
.admin-sidebar .admin-sidebar-logout:hover {
    background:linear-gradient(135deg,#087868 0%,#064e46 100%) !important;
    color:#fff !important;
    transform:translateY(-1px) !important;
    box-shadow:0 9px 22px rgba(8,127,112,.28),inset 0 1px 0 rgba(255,255,255,.20) !important;
}
.admin-sidebar .admin-sidebar-logout:active {
    transform:translateY(0) scale(.98) !important
}
.admin-sidebar .admin-sidebar-logout:focus-visible {
    outline:3px solid rgba(105,198,159,.5) !important;
    outline-offset:2px !important
}

.admin-topbar-meta .admin-logout-btn {
    min-height:42px !important;
    padding:9px 18px !important;
    border:1px solid rgba(8,127,112,.3) !important;
    border-radius:12px !important;
    background:linear-gradient(135deg,#0b8978 0%,#075e55 100%) !important;
    color:#fff !important;
    font:700 .92rem/1 inherit !important;
    letter-spacing:.01em !important;
    box-shadow:0 6px 16px rgba(8,127,112,.22),inset 0 1px 0 rgba(255,255,255,.16) !important;
    cursor:pointer !important;
    transition:transform .2s ease,box-shadow .2s ease,background .2s ease !important;
}
.admin-topbar-meta .admin-logout-btn:hover {
    background:linear-gradient(135deg,#087868 0%,#064e46 100%) !important;
    transform:translateY(-1px) !important;
    box-shadow:0 9px 22px rgba(8,127,112,.28),inset 0 1px 0 rgba(255,255,255,.20) !important;
}
.admin-topbar-meta .admin-logout-btn:active {
    transform:translateY(0) scale(.98) !important
}
.admin-topbar-meta .admin-logout-btn:focus-visible {
    outline:3px solid rgba(105,198,159,.5) !important;
    outline-offset:2px !important
}
@media (max-width:767px) {
    .admin-sidebar .admin-sidebar-logout {
        min-height:42px !important;
        margin-top:8px !important;
    }
    .admin-topbar-meta .admin-logout-btn {
        width:100% !important;
        min-height:42px !important;
        margin:0 !important;
    }
}
@media (max-width:380px) {
    .admin-sidebar .admin-sidebar-logout,   .admin-topbar-meta .admin-logout-btn {
        min-height:40px !important;
        padding:8px 14px !important;
        font-size:.84rem !important;
    }
}
.leressae-back-row {
    display:flex;
    align-items:center;
    gap:10px;
    margin:0 0 14px;
    min-width:0;
}
.leressae-back-btn {
    appearance:none;
    -webkit-appearance:none;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    min-height:40px;
    padding:9px 14px;
    border:1px solid #334155;
    border-radius:10px;
    background:#475569;
    color:#fff;
    font:700 13px/1.2 'Segoe UI',Tahoma,Geneva,Verdana,sans-serif;
    cursor:pointer;
    box-shadow:0 2px 8px rgba(15,23,42,.14);
    transition:background .18s ease,border-color .18s ease,transform .18s ease,box-shadow .18s ease;
}
.leressae-back-btn:hover {
    background:#334155;
    border-color:#1e293b;
    color:#fff;
    transform:translateY(-1px);
    box-shadow:0 5px 12px rgba(15,23,42,.18);
}
.leressae-back-btn:active {
    background:#1e293b;
    transform:translateY(0);
}
.leressae-back-btn:focus-visible {
    outline:3px solid rgba(71,85,105,.28);
    outline-offset:2px;
}
.leressae-detail-back-row {
    margin: 0 0 14px 0;
    display: flex;
    align-items: center;
}
.leressae-detail-back-row .leressae-back-btn {
    margin: 0;
}
.leressae-back-btn:hover {
    background:#f8fafc;
    border-color:#94a3b8;
    transform:translateY(-1px);
    box-shadow:0 5px 12px rgba(15,23,42,.08);
}
.leressae-back-btn:active {
    transform:translateY(0);
}
.leressae-back-btn:focus-visible {
    outline:3px solid rgba(8,127,112,.22);
    outline-offset:2px;
}
.leressae-back-icon {
    font-size:18px;
    line-height:1;
}
.admin-content > .leressae-back-row {
    margin:0 0 12px;
}
.technician-content > .leressae-back-row {
    margin:0 0 12px;
}
.page-view > .leressae-back-row:first-child {
    margin-top:0;
}
@media (max-width:767px) {
    .leressae-back-btn {
        min-height:38px;
        padding:8px 12px;
        font-size:12px;
    }
    .leressae-back-row {
        margin-bottom:10px;
    }
}

#page-admin > .leressae-back-row, #page-admin .leressae-back-row, .admin-shell .leressae-back-row {
    display:none !important;
}


.technician-shell .leressae-back-row, .technician-content > .leressae-back-row, .technician-content .leressae-back-row, #page-technician > .leressae-back-row, #page-technician .leressae-back-row {
    display:none !important;
}
.stock-source-tab {
    border:1px solid #cbd5e1 !important;
    background:#f8fafc !important;
    color:#475569 !important;
    transition:all .18s ease;
}
.stock-source-tab:hover {
    background:#edf7f1 !important;
    border-color:#9dcbb5 !important;
    color:#075e55 !important;
    transform:translateY(-1px);
}
.stock-source-tab.active {
    background:linear-gradient(135deg,#0b917d 0%,#075e55 100%) !important;
    border-color:#087565 !important;
    color:#fff !important;
    box-shadow:0 4px 12px rgba(15,23,42,.12);
}
@media (max-width:600px) {
    .stock-source-tab {
        flex:1 1 100%;
        width:100%;
    }
}
body.admin-mode .admin-content > .leressae-back-row, body.technician-mode .technician-content > .leressae-back-row, #page-admin > .leressae-back-row, #page-technician > .leressae-back-row {
    display:none !important;
}


.admin-shell .admin-content > .leressae-back-row, .admin-shell .admin-content > .admin-topbar + .leressae-back-row {
    display:none !important;
}

.admin-shell .admin-content > .leressae-detail-back-row {
    display:block !important;
}
.tech-proof-state {
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:5px;
    padding:5px 9px;
    border-radius:999px;
    font-size:11px;
    font-weight:800;
    white-space:nowrap
}
.tech-proof-state.uploaded {
    background:#dcfce7;
    color:#166534;
    border:1px solid #bbf7d0
}
.tech-proof-state.missing {
    background:#fef3c7;
    color:#92400e;
    border:1px solid #fde68a
}
.tech-update-proof-box {
    margin-top:16px;
    padding:14px;
    border:1px solid #dbeafe;
    background:#f8fbff;
    border-radius:14px
}
.tech-update-proof-head {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    margin-bottom:12px
}
.tech-update-proof-head strong {
    display:block;
    color:#0f172a;
    font-size:14px
}
.tech-update-proof-head small {
    display:block;
    color:#64748b;
    font-size:11px;
    margin-top:3px
}
.tech-proof-upload-grid {
    display:grid;
    grid-template-columns:180px minmax(0,1fr);
    gap:14px;
    align-items:center
}
.tech-proof-upload-control {
    display:flex;
    flex-direction:column;
    gap:8px;
    min-width:0
}
.tech-proof-upload-control small {
    color:#64748b;
    font-size:11px
}
.tech-proof-upload-control .tech-btn {
    width:max-content
}
.tech-proof-preview {
    width:180px;
    height:130px;
    border:1px dashed #cbd5e1;
    border-radius:12px;
    display:flex;
    align-items:center;
    justify-content:center;
    overflow:hidden;
    background:#fff;
    color:#64748b;
    font-size:12px
}
.tech-proof-preview img {
    width:100%;
    height:100%;
    object-fit:cover;
    display:block
}
.tech-finish-warning {
    margin-top:12px;
    padding:10px 12px;
    border-radius:10px;
    background:#fff7ed;
    border:1px solid #fed7aa;
    color:#9a3412;
    font-size:12px;
    line-height:1.45
}
#techModalSave:disabled {
    opacity:.45;
    cursor:not-allowed;
    filter:grayscale(.25);
    transform:none!important;
    box-shadow:none!important
}
#techModalStatus option:disabled {
    color:#94a3b8
}
@media(max-width:600px) {
    .tech-update-proof-head {
        align-items:flex-start;
        flex-direction:column
    }
    .tech-proof-upload-grid {
        grid-template-columns:1fr
    }
    .tech-proof-preview {
        width:100%;
        height:180px
    }
    .tech-proof-upload-control .tech-btn {
        width:100%
    }
}
[data-tech-menu="proof"] {
    display:none!important
}


.admin-shell [data-admin-page="services"].btn-primary, .admin-shell [data-load-locations].btn-primary, .technician-shell [data-tech-refresh], .technician-shell [data-tech-refresh-stock] {
    display:none !important;
}
.admin-confirm-service-btn {
    min-width:92px;
    border:0;
    border-radius:9px;
    padding:9px 14px;
    font-weight:800;
    color:#fff;
    cursor:pointer;
    transition:.18s ease;
}
.admin-confirm-service-btn.blocked {
    background:#dc2626;
    opacity:.72;
    cursor:not-allowed;
    box-shadow:none;
}
.admin-confirm-service-btn.ready {
    background:#16a34a;
    box-shadow:0 4px 12px rgba(22,163,74,.18);
}
.admin-confirm-service-btn.ready:hover {
    background:#15803d;
    transform:translateY(-1px);
}
.admin-confirm-service-btn:disabled {
    pointer-events:none;
}
@media(max-width:900px) {
    .admin-table-wrap {
        overflow-x:auto;
    }
}
.admin-chart-filter {
    display:flex;
    align-items:center;
    gap:8px;
    flex-wrap:wrap;
    margin-left:auto;
}
.admin-chart-filter-label {
    font-size:12px;
    font-weight:800;
    color:#64748b;
}
.admin-chart-filter-select {
    min-width:180px;
    height:38px;
    border:1px solid #dbe5f1;
    background:#fff;
    color:#334155;
    border-radius:10px;
    padding:0 34px 0 12px;
    font-size:12px;
    font-weight:800;
    cursor:pointer;
    outline:none;
}
.admin-chart-filter-select:focus {
    border-color:#49a98a;
    box-shadow:0 0 0 3px rgba(8,127,112,.12);
}
@media (max-width:700px) {
    .admin-chart-filter {
        width:100%;
        margin-left:0
    }
    .admin-chart-filter-select {
        width:100%;
        min-width:0
    }
}
.admin-chart-filter + * {
}
.chart-box .mini-bars {
    overflow-x:auto;
    overflow-y:hidden;
    padding-bottom:4px;
}
.chart-box .mini-bars > span {
    min-width:18px;
}
.chart-box .mini-bars {
    display:flex !important;
    align-items:flex-end !important;
    justify-content:space-between !important;
    gap:10px !important;
    min-height:170px !important;
    padding:16px 10px 32px !important;
    overflow-x:auto !important;
    overflow-y:visible !important;
}
.chart-box .mini-bars > span {
    position:relative !important;
    display:block !important;
    flex:1 0 34px !important;
    min-width:34px !important;
    max-width:70px !important;
    border-radius:8px 8px 2px 2px !important;
}
.chart-box .mini-bars > span::after {
    content:attr(data-label) !important;
    position:absolute !important;
    left:50% !important;
    top:100% !important;
    transform:translateX(-50%) !important;
    margin-top:8px !important;
    white-space:nowrap !important;
    font-size:11px !important;
    font-weight:700 !important;
    line-height:1 !important;
    color:#64748b !important;
}
@media (max-width:700px) {
    .chart-box .mini-bars {
        justify-content:flex-start !important;
        gap:8px !important;
        min-height:160px !important;
    }
    .chart-box .mini-bars > span {
        flex:0 0 34px !important;
    }
}


@media (max-width: 768px) {
    .admin-content {
        min-width:0 !important;
        width:100% !important;
        overflow-x:hidden !important;
    }
    .admin-card,     .admin-panels,     .admin-table-wrap {
        max-width:100% !important;
        min-width:0 !important;
    }

    .admin-card .filter-grid {
        grid-template-columns:1fr !important;
        gap:10px !important;
    }
    .admin-card .filter-grid input,     .admin-card .filter-grid select {
        width:100% !important;
        min-width:0 !important;
        box-sizing:border-box !important;
    }

    .admin-table-wrap {
        width:100% !important;
        overflow-x:auto !important;
        overflow-y:hidden !important;
        -webkit-overflow-scrolling:touch !important;
    }
    .admin-table-wrap .admin-table {
        min-width:900px !important;
        width:max-content !important;
        table-layout:auto !important;
    }
    .admin-table th,     .admin-table td {
        white-space:normal !important;
        word-break:break-word !important;
    }
    .admin-table th {
        white-space:nowrap !important;
    }
    .admin-table td:first-child {
        max-width:130px !important;
    }

    .admin-table td:last-child {
        min-width:110px !important;
    }
    .admin-table td:last-child button {
        width:100% !important;
        min-height:40px !important;
        margin:2px 0 !important;
    }

    .admin-card-header {
        gap:10px !important;
        align-items:flex-start !important;
    }
    .admin-card-header > div {
        min-width:0 !important;
    }
    .admin-card-header h3 {
        overflow-wrap:anywhere !important;
    }

    .admin-card-header .admin-user-chip {
        flex:0 0 auto !important;
        white-space:nowrap !important;
    }
}
@media (max-width:480px) {
    .admin-content {
        padding-left:10px !important;
        padding-right:10px !important;
    }
    .admin-card {
        border-radius:14px !important;
    }
    .admin-table-wrap {
        border-radius:10px !important;
    }
}


.chart-box .mini-bars {
    display:flex !important;
    align-items:flex-end !important;
    justify-content:space-evenly !important;
    gap:14px !important;
    min-height:175px !important;
    padding:14px 10px 42px !important;
    overflow-x:auto !important;
    overflow-y:visible !important;
    box-sizing:border-box !important;
}
.chart-box .mini-bars > span {
    position:relative !important;
    display:block !important;
    flex:0 0 48px !important;
    width:48px !important;
    min-width:48px !important;
    max-width:48px !important;
    border-radius:7px 7px 2px 2px !important;
}


.chart-box .mini-bars > span::after {
    content:attr(data-label) !important;
    position:absolute !important;
    left:50% !important;
    top:100% !important;
    transform:translateX(-50%) !important;
    width:58px !important;
    margin-top:8px !important;
    white-space:normal !important;
    overflow-wrap:break-word !important;
    word-break:normal !important;
    text-align:center !important;
    font-size:10px !important;
    font-weight:700 !important;
    line-height:1.15 !important;
    color:#64748b !important;
    pointer-events:none !important;
}


@media (max-width:480px) {
    .chart-box .mini-bars {
        justify-content:flex-start !important;
        gap:16px !important;
        min-height:170px !important;
        padding:12px 12px 44px !important;
        overflow-x:hidden !important;
    }
    .chart-box .mini-bars > span {
        flex:1 1 0 !important;
        width:auto !important;
        min-width:48px !important;
        max-width:64px !important;
    }
    .chart-box .mini-bars > span::after {
        width:54px !important;
        font-size:9px !important;
        line-height:1.15 !important;
        margin-top:7px !important;
    }
}

@media (max-width:360px) {
    .chart-box .mini-bars {
        gap:10px !important;
        padding-left:6px !important;
        padding-right:6px !important;
    }
    .chart-box .mini-bars > span {
        min-width:50px !important;
    }
    .chart-box .mini-bars > span::after {
        width:52px !important;
        font-size:8.5px !important;
    }
}

@media (max-width: 768px) {
    .admin-dashboard .operational-summary,     .admin-dashboard .chart-summary,     .admin-dashboard .grafik-summary {
        grid-template-columns:repeat(2,minmax(0,1fr)) !important;
        gap:10px !important;
    }

    .admin-dashboard .chart-box + .chart-box {
        min-width:0 !important;
    }
    .admin-dashboard .chart-box {
        min-width:0 !important;
    }

    .admin-dashboard [class*="summary-grid"],     .admin-dashboard [class*="chart-grid"] {
        grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    }
}
@media (max-width:360px) {
    .admin-dashboard .operational-summary,     .admin-dashboard .chart-summary,     .admin-dashboard .grafik-summary,     .admin-dashboard [class*="summary-grid"],     .admin-dashboard [class*="chart-grid"] {
        grid-template-columns:1fr !important;
    }
}
@media (max-width:768px) {

    .chart-box .status-tech-row,     .chart-box .status-tech-grid {
        display:grid !important;
        grid-template-columns:repeat(2,minmax(0,1fr)) !important;
        gap:10px !important;
    }
    .status-tech-row > *,     .status-tech-grid > * {
        min-width:0 !important;
    }
}
@media (max-width:360px) {
    .chart-box .status-tech-row,     .chart-box .status-tech-grid {
        grid-template-columns:1fr !important;
    }
}
@media (max-width:768px) {

    .chart-box:has(h4, h3, strong) {
        min-width:0 !important;
    }

    .chart-box:has(:is(h3,h4,strong):is(:where(*))) {
        box-sizing:border-box !important;
    }
    .admin-dashboard .chart-box:has(*:is(h3,h4,strong)) {
        overflow:visible !important;
    }
}

.admin-card .chart-grid-4 {
    display:grid !important;
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:16px !important;
    width:100% !important;
    align-items:stretch !important;
}
.admin-card .chart-grid-4 > .chart-box {
    min-width:0 !important;
    width:auto !important;
    box-sizing:border-box !important;
}
@media(max-width:768px) {
    .admin-card .chart-grid-4 {
        grid-template-columns:minmax(0,1fr) !important;
        gap:12px !important;
    }
}
.tech-client-toolbar-wrap {
    align-items:flex-start !important;
}
.tech-client-filters {
    display:flex !important;
    align-items:center !important;
    justify-content:flex-end !important;
    flex-wrap:wrap !important;
    gap:7px !important;
}
.tech-filter-label {
    font-size:11px !important;
    font-weight:800 !important;
    color:#64748b !important;
}
.tech-filter-select, .tech-filter-date, .tech-client-search {
    min-height:38px !important;
    border:1px solid #cbd5e1 !important;
    border-radius:10px !important;
    background:#fff !important;
    color:#0f172a !important;
    padding:8px 11px !important;
    font:600 12px/1.2 inherit !important;
    box-sizing:border-box !important;
    outline:none !important;
}
.tech-filter-select {
    min-width:130px !important;
    cursor:pointer !important;
}
.tech-client-search {
    min-width:220px !important;
}
.tech-custom-date-group {
    display:flex;
    align-items:center;
    gap:5px;
}
.tech-filter-date {
    width:135px !important;
}
.tech-date-separator {
    color:#64748b;
    font-size:11px;
    font-weight:700;
}
.tech-client-period-summary {
    display:flex;
    justify-content:space-between;
    gap:10px;
    margin:0 0 10px;
    padding:8px 10px;
    border:1px solid #e2e8f0;
    border-radius:9px;
    background:#f8fafc;
    color:#64748b;
    font-size:11px;
}
.tech-client-period-summary strong {
    color:#0f172a
}
@media(max-width:768px) {
    .tech-client-toolbar-wrap {
        display:flex !important;
        flex-direction:column !important;
        gap:10px !important;
    }
    .tech-client-filters {
        width:100% !important;
        display:grid !important;
        grid-template-columns:1fr 1fr !important;
        gap:8px !important;
    }
    .tech-filter-label {
        grid-column:1/-1
    }
    .tech-filter-select,.tech-client-search {
        width:100% !important;
        min-width:0 !important;
    }
    .tech-client-search {
        grid-column:1/-1;
    }
    .tech-custom-date-group {
        grid-column:1/-1;
        width:100%;
        display:flex;
    }
    .tech-filter-date {
        width:100% !important;
        min-width:0 !important;
    }
}
@media(max-width:360px) {
    .tech-client-filters {
        grid-template-columns:1fr !important;
    }
    .tech-filter-label,.tech-client-search,.tech-custom-date-group {
        grid-column:1 !important;
    }
}
.tech-update-modal {
    width:min(980px,96vw)!important;
    max-height:92vh!important;
    overflow:auto
}
.tech-update-section {
    margin:0 0 16px;
    padding:16px;
    border:1px solid #e2e8f0;
    border-radius:14px;
    background:#fff
}
.tech-update-section-title {
    display:flex;
    align-items:flex-start;
    gap:10px;
    margin-bottom:14px
}
.tech-update-section-title>span {
    width:28px;
    height:28px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    border-radius:50%;
    background:#e0f2fe;
    color:#075e55;
    font-weight:800;
    flex:0 0 28px
}
.tech-update-section-title strong {
    display:block;
    color:#0f172a;
    font-size:15px
}
.tech-update-section-title small {
    display:block;
    color:#64748b;
    margin-top:2px;
    font-size:12px
}
.tech-readonly-grid {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:12px
}
.tech-readonly-grid label,.tech-cost-grid label,.tech-full-field {
    display:flex;
    flex-direction:column;
    gap:6px;
    color:#334155;
    font-size:12px;
    font-weight:700
}
.tech-readonly-grid input,.tech-readonly-grid textarea,.tech-cost-grid input,.tech-cost-grid select,.tech-full-field input,.tech-full-field textarea {
    width:100%;
    border:1px solid #cbd5e1;
    border-radius:9px;
    padding:9px 11px;
    background:#f8fafc;
    color:#334155;
    font:inherit;
    font-weight:500;
    outline:none
}
.tech-readonly-grid textarea,.tech-full-field textarea {
    min-height:72px;
    resize:vertical
}
.tech-status-action-grid {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:12px
}
.tech-status-choice {
    border:1px solid #cbd5e1;
    border-radius:11px;
    padding:13px 14px;
    background:#f8fafc;
    color:#334155;
    font-weight:800;
    cursor:pointer;
    text-align:left;
    display:flex;
    align-items:center;
    gap:9px
}
.tech-status-choice.progress-choice.active {
    background:#fff7ed;
    border-color:#f59e0b;
    color:#b45309
}
.tech-status-choice.done-choice.active {
    background:#f0fdf4;
    border-color:#22c55e;
    color:#15803d
}
.tech-status-choice:disabled {
    opacity:.45;
    cursor:not-allowed
}
.tech-cost-grid {
    display:grid;
    grid-template-columns:minmax(180px,.7fr) minmax(180px,.9fr) minmax(220px,1.4fr);
    gap:12px;
    align-items:start
}
.tech-cost-grid small {
    font-size:11px;
    color:#075e55;
    font-weight:800
}
.tech-proof-upload-grid {
    display:grid;
    grid-template-columns:minmax(220px,.8fr) minmax(240px,1.2fr);
    gap:14px;
    align-items:center
}
.tech-proof-preview {
    min-height:180px;
    border:1px dashed #cbd5e1;
    border-radius:12px;
    background:#f8fafc;
    display:flex;
    align-items:center;
    justify-content:center;
    color:#64748b;
    overflow:hidden;
    text-align:center;
    padding:8px
}
.tech-proof-preview img {
    max-width:100%;
    max-height:240px;
    object-fit:contain;
    border-radius:8px
}
.tech-proof-upload-control {
    display:flex;
    flex-direction:column;
    gap:8px
}
.tech-proof-upload-control small {
    color:#64748b
}
.tech-proof-state.uploaded {
    color:#15803d;
    font-weight:800
}
.tech-proof-state.missing {
    color:#b45309;
    font-weight:800
}
.tech-submit-summary {
    font-size:13px;
    color:#475569;
    margin-bottom:10px
}
.status-customer-update-summary {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:6px 16px;
    margin-top:10px;
    padding:10px 12px;
    border:1px solid #e2e8f0;
    border-radius:10px;
    background:#f8fafc;
    font-size:12px;
    color:#475569
}
.status-proof-public {
    margin-top:14px;
    padding-top:12px;
    border-top:1px solid #e2e8f0;
    display:flex;
    flex-direction:column;
    gap:8px
}
.status-proof-public img {
    width:min(420px,100%);
    max-height:280px;
    object-fit:contain;
    border-radius:10px;
    border:1px solid #e2e8f0;
    background:#f8fafc
}
@media(max-width:720px) {
    .tech-update-modal {
        width:calc(100vw - 20px)!important;
        max-height:94vh!important
    }
    .tech-readonly-grid,.tech-status-action-grid,.tech-proof-upload-grid,.tech-cost-grid,.status-customer-update-summary {
        grid-template-columns:1fr
    }
    .tech-update-section {
        padding:12px
    }
}

.hero-section {
    background-image: linear-gradient(90deg, rgba(255,255,255,0.18) 0%, rgba(255,255,255,0.08) 38%, rgba(15,23,42,0.04) 100%) !important;
    background-size: cover !important;
    background-position: center center !important;
    background-repeat: no-repeat !important;
}
.hero-content {
    position: relative;
    z-index: 2;
}
.hero-title {
    color: #08264a !important;
    text-shadow:                 0 2px 0 rgba(255,255,255,0.95),                 0 3px 7px rgba(255,255,255,0.70) !important;
}
.hero-desc {
    color: #071a31 !important;
    font-weight: 600 !important;
    text-shadow:                 0 1px 0 rgba(255,255,255,0.98),                 0 2px 5px rgba(255,255,255,0.82) !important;
}
.hero-badge {
    background: rgba(255,255,255,0.30) !important;
    color: #06284e !important;
    border-color: rgba(6,40,78,0.45) !important;
    text-shadow: 0 1px 2px rgba(255,255,255,0.65);
}
.hero-slogan-card {
    background: rgba(255,255,255,0.12) !important;
    backdrop-filter: blur(2px) saturate(110%) !important;
    -webkit-backdrop-filter: blur(2px) saturate(110%) !important;
    border-color: rgba(255,255,255,0.45) !important;
}
.hero-slogan-card::before {
    content: none !important;
    display: none !important;
}
.hero-section .hero-content {
    position: relative;
    z-index: 3;
    text-shadow:         0 1px 0 rgba(255,255,255,.98),         1px 0 0 rgba(255,255,255,.92),         -1px 0 0 rgba(255,255,255,.92),         0 -1px 0 rgba(255,255,255,.92),         0 2px 5px rgba(255,255,255,.72);
}
.hero-section .hero-title {
    color: #062653 !important;
    text-shadow:         0 2px 0 rgba(255,255,255,.98),         2px 0 0 rgba(255,255,255,.92),         -2px 0 0 rgba(255,255,255,.92),         0 -2px 0 rgba(255,255,255,.92),         0 3px 7px rgba(255,255,255,.72) !important;
}
.hero-section .hero-desc {
    color: #071f3d !important;
    font-weight: 600 !important;
    text-shadow:         0 1px 0 rgba(255,255,255,.98),         1px 0 0 rgba(255,255,255,.90),         -1px 0 0 rgba(255,255,255,.90),         0 -1px 0 rgba(255,255,255,.90),         0 2px 5px rgba(255,255,255,.68) !important;
}
.hero-section .hero-badge {
    background: rgba(255,255,255,.62) !important;
    color: #062653 !important;
    border-color: rgba(6,38,83,.55) !important;
    text-shadow: none !important;
}
.hero-section .hero-slogan-card {
    background: rgba(255,255,255,.16) !important;
    backdrop-filter: blur(4px) saturate(115%) !important;
    -webkit-backdrop-filter: blur(4px) saturate(115%) !important;
}
.hero-section .hero-slogan-card::before {
    display: none !important;
}
.hero-section .slogan-label, .hero-section .slogan-main, .hero-section .slogan-sub {
    text-shadow:         0 1px 0 rgba(255,255,255,.98),         1px 0 0 rgba(255,255,255,.90),         -1px 0 0 rgba(255,255,255,.90),         0 -1px 0 rgba(255,255,255,.90) !important;
}

.hero-section .hero-slogan-card {
    background: rgba(255,255,255,0.72) !important;
    border: 1px solid rgba(255,255,255,0.95) !important;
    box-shadow: 0 12px 30px rgba(0,0,0,0.16) !important;
    backdrop-filter: blur(8px) saturate(120%) !important;
    -webkit-backdrop-filter: blur(8px) saturate(120%) !important;
}
.hero-section .hero-slogan-card::before {
    display: none !important;
}
.hero-section .hero-slogan-card .slogan-label, .hero-section .hero-slogan-card .slogan-main, .hero-section .hero-slogan-card .slogan-sub {
    color: #062653 !important;
    text-shadow: none !important;
}
.hero-section .hero-slogan-card .slogan-label {
    font-weight: 800 !important;
    letter-spacing: 0.08em !important;
}
.hero-section .hero-slogan-card .slogan-main {
    font-weight: 800 !important;
}
.hero-section .hero-slogan-card .slogan-sub {
    font-weight: 600 !important;
}

@media (max-width: 768px) {
    .hero-section .hero-slogan-card {
        background: rgba(255,255,255,0.72) !important;
        backdrop-filter: blur(7px) saturate(120%) !important;
        -webkit-backdrop-filter: blur(7px) saturate(120%) !important;
    }
}

.site-footer .site-footer-brand img {
    width: 88px !important;
    height: auto !important;
    max-width: none !important;
    object-fit: contain !important;
    display: block !important;
}

@media (max-width: 768px) {
    .site-footer .site-footer-brand img {
        width: 82px !important;
        height: auto !important;
        max-width: none !important;
    }
}

@media (max-width: 480px) {
    .site-footer .site-footer-brand img {
        width: 76px !important;
        height: auto !important;
        max-width: none !important;
    }
}
.tech-welcome {
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    gap:16px;
    padding:20px;
    background:#fff;
    border:1px solid #e2e8f0;
    border-radius:14px;
    margin-bottom:16px
}
.tech-eyebrow {
    font-size:11px;
    font-weight:800;
    letter-spacing:.08em;
    color:#64748b
}
.tech-welcome h3 {
    margin:5px 0 3px;
    font-size:22px;
    color:#0f172a
}
.tech-welcome p {
    margin:0;
    color:#64748b;
    font-size:13px
}
.tech-dashboard-grid {
    display:grid;
    grid-template-columns:1.5fr 1fr;
    gap:16px;
    margin-bottom:16px
}
.tech-chart {
    height:190px;
    display:flex;
    align-items:flex-end;
    justify-content:space-around;
    gap:8px;
    padding:20px 8px 8px
}
.tech-chart-col {
    height:165px;
    display:flex;
    flex-direction:column;
    justify-content:flex-end;
    align-items:center;
    gap:5px;
    min-width:30px
}
.tech-chart-bar {
    width:28px;
    background:#0f172a;
    border-radius:7px 7px 2px 2px;
    min-height:8px
}
.tech-chart-value {
    font-size:11px;
    font-weight:700;
    color:#334155
}
.tech-chart-col small {
    font-size:10px;
    color:#64748b
}
.tech-status-summary {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:12px;
    padding:18px
}
.tech-status-summary>div {
    padding:20px;
    border:1px solid #e2e8f0;
    border-radius:12px;
    background:#f8fafc
}
.tech-status-summary strong {
    display:block;
    font-size:28px;
    color:#0f172a
}
.tech-status-summary span {
    font-size:12px;
    color:#64748b
}
.tech-profile-grid {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:12px;
    padding:4px 0 18px
}
.tech-profile-grid>div {
    border:1px solid #e2e8f0;
    border-radius:10px;
    padding:14px;
    background:#f8fafc
}
.tech-profile-grid span {
    display:block;
    font-size:11px;
    color:#64748b;
    margin-bottom:4px
}
.tech-profile-grid strong {
    font-size:14px;
    color:#0f172a
}
.tech-action-row {
    display:flex;
    gap:8px;
    align-items:center
}
@media(max-width:760px) {
    .tech-dashboard-grid {
        grid-template-columns:1fr
    }
    .tech-welcome {
        flex-direction:column
    }
    .tech-profile-grid {
        grid-template-columns:1fr
    }
    .tech-chart-bar {
        width:22px
    }
}
.technician-shell .technician-sidebar .technician-logout {
    width:100%!important;
    min-height:42px!important;
    margin-top:auto!important;
    padding:9px 18px!important;
    border:1px solid rgba(255,255,255,.16)!important;
    border-radius:12px!important;
    background:linear-gradient(135deg,#0b8978 0%,#075e55 100%)!important;
    color:#fff!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    gap:10px!important;
    font:700 .92rem/1 inherit!important;
    box-shadow:0 6px 16px rgba(8,127,112,.24),inset 0 1px 0 rgba(255,255,255,.16)!important
}
.technician-shell .technician-sidebar .technician-logout:hover {
    background:linear-gradient(135deg,#087868 0%,#064e46 100%)!important;
    transform:translateY(-1px)!important
}
.technician-shell .technician-sidebar .technician-logout svg {
    width:18px!important;
    height:18px!important;
    stroke:currentColor!important;
    fill:none!important;
    stroke-width:2!important;
    stroke-linecap:round!important;
    stroke-linejoin:round!important
}
.technician-shell .technician-sidebar .technician-logout span:first-child {
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important
}
.navbar.role-session-navbar-hidden,   body.role-session-active .navbar {
    display: none !important;
    visibility: hidden !important;
    pointer-events: none !important;
}


[data-stock-flow-root] .stock-source-panel[hidden] {
    display: none !important;
    visibility: hidden !important;
}

.stock-source-panel[data-stock-panel] {
    display:block;
}

.stock-source-panel {
    width:100% !important;
    min-width:0 !important;
    overflow:visible !important;
    background:#ffffff !important;
    color:#0f172a !important;
}
.stock-source-panel .bon-total-table-scroll {
    display:block !important;
    width:100% !important;
    max-width:100% !important;
    overflow-x:auto !important;
    overflow-y:hidden !important;
    -webkit-overflow-scrolling:touch !important;
    scrollbar-width:thin !important;
    background:#ffffff !important;
    border:1px solid #cbd5e1 !important;
}
.stock-source-panel .bon-total-table-scroll .bon-total-table {
    width:max-content !important;
    min-width:2050px !important;
    max-width:none !important;
    table-layout:auto !important;
    border-collapse:collapse !important;
    background:#ffffff !important;
    color:#0f172a !important;
}
.stock-source-panel .bon-total-table th, .stock-source-panel .bon-total-table td {
    box-sizing:border-box !important;
    min-width:92px !important;
    padding:11px 12px !important;
    border:1px solid #e2e8f0 !important;
    vertical-align:middle !important;
    text-align:left !important;
    font-size:13px !important;
    line-height:1.45 !important;
    color:#1e293b !important;
    background:#ffffff !important;
    opacity:1 !important;
    visibility:visible !important;
}
.stock-source-panel .bon-total-table th {
    position:sticky !important;
    top:0 !important;
    z-index:2 !important;
    min-width:110px !important;
    background:#eaf2f8 !important;
    color:#0f172a !important;
    font-weight:800 !important;
    white-space:nowrap !important;
}
.stock-source-panel .bon-total-table th:nth-child(1), .stock-source-panel .bon-total-table td:nth-child(1) {
    min-width:170px !important;
}
.stock-source-panel .bon-total-table th:nth-child(2), .stock-source-panel .bon-total-table td:nth-child(2) {
    min-width:330px !important;
    max-width:520px !important;
}
.stock-source-panel .bon-total-table th:nth-child(3), .stock-source-panel .bon-total-table td:nth-child(3) {
    min-width:110px !important;
}
.stock-source-panel .bon-total-table th:nth-child(4), .stock-source-panel .bon-total-table td:nth-child(4), .stock-source-panel .bon-total-table th:nth-child(5), .stock-source-panel .bon-total-table td:nth-child(5) {
    min-width:125px !important;
}
.stock-source-panel .bon-total-table td {
    white-space:normal !important;
    overflow:visible !important;
    text-overflow:clip !important;
    word-break:normal !important;
    overflow-wrap:anywhere !important;
}
.stock-source-panel .bon-total-table tbody tr:nth-child(even) td {
    background:#f8fafc !important;
}
.stock-source-panel .bon-total-table .bon-total-group-row td {
    background:#eef6ff !important;
    color:#0f172a !important;
    font-weight:800 !important;
}
.stock-source-panel .bon-total-table .bon-total-summary-row td {
    background:#e2e8f0 !important;
    color:#0f172a !important;
    font-weight:800 !important;
}

.stock-source-panel[data-stock-panel="bon-total-1"] .bon-total-table, .stock-source-panel[data-stock-panel="keluar"] .bon-total-table {
    min-width:900px !important;
}
.stock-source-panel[data-stock-panel="bon-total-1"] .bon-total-table th, .stock-source-panel[data-stock-panel="bon-total-1"] .bon-total-table td, .stock-source-panel[data-stock-panel="keluar"] .bon-total-table th, .stock-source-panel[data-stock-panel="keluar"] .bon-total-table td {
    min-width:150px !important;
}
.stock-source-panel[data-stock-panel="bon-total-1"] .bon-total-table th:nth-child(2), .stock-source-panel[data-stock-panel="bon-total-1"] .bon-total-table td:nth-child(2), .stock-source-panel[data-stock-panel="keluar"] .bon-total-table th:nth-child(2), .stock-source-panel[data-stock-panel="keluar"] .bon-total-table td:nth-child(2) {
    min-width:320px !important;
}
@media (max-width:768px) {
    .stock-source-panel .bon-total-table-scroll {
        max-width:100% !important;
        overflow-x:auto !important;
        overflow-y:hidden !important;
    }
    .stock-source-panel .bon-total-table th,     .stock-source-panel .bon-total-table td {
        font-size:12px !important;
        padding:9px 10px !important;
    }
    .stock-source-panel .bon-total-table th:nth-child(2),     .stock-source-panel .bon-total-table td:nth-child(2) {
        min-width:280px !important;
        max-width:420px !important;
    }
    .stock-source-panel[data-stock-panel="bon-total-1"] .bon-total-table,     .stock-source-panel[data-stock-panel="keluar"] .bon-total-table {
        min-width:760px !important;
    }
}
@media (max-width:480px) {
    .stock-source-panel .bon-total-table-scroll {
        border-radius:8px !important;
    }
    .stock-source-panel .bon-total-table th,     .stock-source-panel .bon-total-table td {
        font-size:11.5px !important;
        padding:8px 9px !important;
    }
    .stock-source-panel .bon-total-table th:nth-child(1),     .stock-source-panel .bon-total-table td:nth-child(1) {
        min-width:145px !important;
    }
    .stock-source-panel .bon-total-table th:nth-child(2),     .stock-source-panel .bon-total-table td:nth-child(2) {
        min-width:250px !important;
        max-width:360px !important;
    }
}

.navbar .brand .logo-img {
    width: auto !important;
    height: 65px !important;
    max-width: 88px !important;
    object-fit: contain !important;
    flex: 0 0 auto !important;
    transform: scale(1.5);
    transform-origin: left center;
}
.navbar .brand {
    gap: 14px !important;
    align-items: center !important;
}
@media (max-width: 768px) {
    .navbar .brand .logo-img {
        height: 82px !important;
        max-width: 80px !important;
        transform: scale(1.7);
    }
    .navbar .brand {
        gap: 10px !important;
    }
}
@media (max-width: 420px) {
    .navbar .brand .logo-img {
        height: 74px !important;
        max-width: 100px !important;
        transform: scale(1.7);
    }
}


.technician-shell {
    display:grid;
    grid-template-columns:260px minmax(0,1fr);
    gap:20px;
    min-height:720px;
    background:#f8fafc;
    border:1px solid #dbe4ef;
    border-radius:22px;
    overflow:hidden;
    box-shadow:0 16px 40px rgba(15,23,42,.08);
    margin:-10px -8px 0;
}
.technician-shell .technician-sidebar {
    background:linear-gradient(180deg,#0f172a 0%,#111827 100%);
    border-radius:22px;
    padding:22px 18px;
    color:#e2e8f0;
    box-shadow:0 18px 40px rgba(15,23,42,.12);
    display:flex;
    flex-direction:column;
    min-width:0;
}
.technician-shell .technician-brand {
    padding:0 0 18px;
    margin-bottom:26px;
    border-bottom:1px solid rgba(148,163,184,.2)
}
.technician-shell .technician-brand strong {
    display:block;
    font-size:1rem;
    color:#fff
}
.technician-shell .technician-brand span {
    display:block;
    color:#b8dcca;
    font-size:.72rem;
    letter-spacing:.08em;
    text-transform:uppercase;
    margin-top:4px
}
.technician-shell .technician-user {
    margin:16px 0;
    padding:12px;
    border:1px solid rgba(148,163,184,.2);
    background:#111827;
    border-radius:12px;
    display:flex;
    align-items:center;
    gap:12px;
}
.technician-shell .technician-avatar {
    width:42px;
    height:42px;
    border-radius:12px;
    background:linear-gradient(135deg,#36a77f 0%,#087f70 100%);
    display:grid;
    place-items:center;
    font-weight:900;
    color:#fff;
    font-size:1rem;
    flex:0 0 42px;
}
.technician-shell .technician-user strong {
    display:block;
    font-size:1rem;
    color:#fff
}
.technician-shell .technician-user small {
    display:block;
    color:#b8dcca;
    font-size:.72rem;
    margin-top:2px;
    letter-spacing:.08em;
    text-transform:uppercase
}
.technician-shell .technician-nav {
    display:flex;
    flex-direction:column;
    gap:8px;
    min-width:0
}
.technician-shell .technician-nav button {
    width:100%;
    text-align:left;
    background:transparent;
    border:1px solid transparent;
    border-radius:12px;
    padding:12px 14px;
    font-weight:700;
    color:#e2e8f0;
    cursor:pointer;
    transition:.2s ease;
    display:flex;
    align-items:center;
    gap:10px;
    min-width:0;
}
.technician-shell .technician-nav button:hover, .technician-shell .technician-nav button.active {
    background:rgba(8,127,112,.22);
    border-color:rgba(129,204,176,.48);
    box-shadow:inset 0 0 0 1px rgba(129,204,176,.28);
    color:#f8fafc;
}
.technician-shell .technician-nav .tech-icon {
    width:16px;
    height:16px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    flex:0 0 16px;
    color:currentColor
}
.technician-shell .technician-nav .tech-icon svg {
    display:block;
    fill:none;
    stroke:currentColor;
    stroke-linecap:round;
    stroke-linejoin:round;
    width:16px;
    height:16px
}
.technician-shell .technician-sidebar .technician-logout > span:first-child {
    display:inline-flex;
    align-items:center;
    justify-content:center
}
.technician-shell .technician-logout {
    margin-top:auto!important
}
.technician-shell .technician-content {
    min-width:0;
    padding:24px;
    background:#f8fafc
}
.technician-shell .technician-topbar {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    margin-bottom:20px
}
.technician-shell .technician-topbar h2 {
    margin:0;
    color:#0f172a;
    font-size:24px
}
.technician-shell .technician-topbar p {
    margin:4px 0 0;
    color:#64748b;
    font-size:13px
}
.technician-shell .technician-mobile-menu,.technician-shell .technician-overlay {
    display:none
}
.technician-shell .technician-toolbar {
    display:flex;
    gap:10px;
    flex-wrap:wrap;
    align-items:center
}
.technician-shell .technician-toolbar input,.technician-shell .technician-toolbar select {
    min-height:40px;
    border:1px solid #cbd5e1;
    border-radius:10px;
    padding:9px 12px;
    background:#fff;
    color:#0f172a
}
.technician-shell .tech-stat-grid {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:12px;
    margin-bottom:18px
}
.technician-shell .tech-stat {
    background:#fff;
    border:1px solid #e2e8f0;
    border-radius:14px;
    padding:16px;
    box-shadow:0 4px 14px rgba(15,23,42,.04)
}
.technician-shell .tech-stat .label {
    display:block;
    color:#64748b;
    font-size:12px;
    font-weight:700
}
.technician-shell .tech-stat .value {
    display:block;
    color:#0f172a;
    font-size:25px;
    font-weight:800;
    margin-top:4px
}
.technician-shell .tech-section {
    background:#fff;
    border:1px solid #e2e8f0;
    border-radius:14px;
    padding:18px;
    margin-bottom:16px
}
.technician-shell .tech-section-header {
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:12px;
    flex-wrap:wrap;
    margin-bottom:14px
}
.technician-shell .tech-section-header h3 {
    margin:0;
    color:#0f172a;
    font-size:17px
}
.technician-shell .tech-table-wrap {
    overflow:auto;
    border:1px solid #e2e8f0;
    border-radius:12px
}
.technician-shell .tech-table {
    width:100%;
    border-collapse:collapse;
    min-width:760px
}
.technician-shell .tech-table th,.technician-shell .tech-table td {
    padding:11px 12px;
    border-bottom:1px solid #eef2f7;
    text-align:left;
    font-size:13px;
    vertical-align:middle
}
.technician-shell .tech-table th {
    background:#f8fafc;
    color:#475569;
    font-size:11px;
    text-transform:uppercase;
    letter-spacing:.04em
}
.technician-shell .tech-table tr:last-child td {
    border-bottom:0
}
.technician-shell .tech-table tr:hover td {
    background:#f8fbff
}
.technician-shell .tech-action-row {
    display:flex;
    gap:7px;
    flex-wrap:wrap
}
.technician-shell .tech-btn {
    border:0;
    border-radius:9px;
    padding:9px 12px;
    font-weight:700;
    cursor:pointer;
    background:linear-gradient(135deg,#0B2A4A,#061B33);
    color:#fff
}
.technician-shell .tech-btn.secondary {
    background:#fff;
    color:#0B2A4A;
    border:1px solid #cbd5e1
}
.technician-shell .tech-btn.success {
    background:linear-gradient(135deg,#087f70,#075e55)
}
.technician-shell .tech-empty {
    padding:28px;
    text-align:center;
    color:#64748b
}
.technician-shell .tech-detail-grid {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:10px
}
.technician-shell .tech-detail-item {
    background:#f8fafc;
    border:1px solid #e2e8f0;
    border-radius:10px;
    padding:11px
}
.technician-shell .tech-detail-item span {
    display:block;
    color:#64748b;
    font-size:11px;
    font-weight:700;
    margin-bottom:3px
}
.technician-shell .tech-detail-item strong {
    color:#0f172a;
    font-size:13px
}
.technician-shell .tech-proof-card {
    display:grid;
    grid-template-columns:160px minmax(0,1fr);
    gap:16px;
    align-items:start
}
.technician-shell .tech-proof-preview {
    width:160px;
    height:120px;
    border:1px dashed #cbd5e1;
    border-radius:12px;
    display:flex;
    align-items:center;
    justify-content:center;
    overflow:hidden;
    background:#f8fafc;
    color:#64748b
}
.technician-shell .tech-proof-preview img {
    width:100%;
    height:100%;
    object-fit:cover
}
.technician-shell .tech-proof-input {
    border:1px solid #cbd5e1;
    border-radius:10px;
    padding:10px;
    width:100%;
    background:#fff
}
.technician-shell .tech-stock-summary {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:10px;
    margin-bottom:14px
}
.technician-shell .tech-stock-pill {
    padding:13px;
    border-radius:12px;
    background:#f8fafc;
    border:1px solid #e2e8f0
}
.technician-shell .tech-stock-pill strong {
    display:block;
    font-size:20px;
    color:#0f172a
}
.technician-shell .tech-stock-pill span {
    font-size:11px;
    color:#64748b;
    font-weight:700
}
.technician-shell .tech-status-badge {
    display:inline-flex;
    align-items:center;
    padding:5px 9px;
    border-radius:999px;
    font-size:11px;
    font-weight:800;
    white-space:nowrap
}
.technician-shell .tech-status-badge.safe {
    background:#dcfce7;
    color:#166534
}
.technician-shell .tech-status-badge.low {
    background:#fef3c7;
    color:#92400e
}
.technician-shell .tech-status-badge.empty {
    background:#eef3f0;
    color:#657870
}
.technician-shell .tech-status-badge.progress {
    background:#fff4df;
    color:#926000
}
.technician-shell .tech-status-badge.done {
    background:#dcfce7;
    color:#166534
}

@media(max-width:900px) {
    .technician-shell {
        grid-template-columns:1fr;
        margin:0;
        border-radius:14px;
        min-height:640px
    }
    .technician-shell .technician-sidebar {
        position:fixed;
        top:0;
        left:0;
        width:min(280px,86vw);
        height:100dvh;
        overflow-y:auto;
        z-index:2147481000;
        transform:translateX(-105%);
        transition:transform .24s ease,opacity .18s ease,visibility 0s linear .24s;
        box-shadow:16px 0 36px rgba(15,23,42,.22);
        opacity:0;
        visibility:hidden;
        border-radius:0 18px 18px 0
    }
    .technician-shell.tech-menu-open .technician-sidebar {
        transform:translateX(0);
        opacity:1;
        visibility:visible;
        transition-delay:0s
    }
    .technician-shell .technician-overlay {
        position:fixed;
        inset:0;
        background:rgba(15,23,42,.48);
        z-index:2147480900
    }
    .technician-shell.tech-menu-open .technician-overlay {
        display:block
    }
    .technician-shell .technician-mobile-menu {
        display:inline-flex;
        width:42px;
        height:42px;
        border:1px solid #dbe4ef;
        border-radius:11px;
        background:#fff;
        color:#0B2A4A;
        align-items:center;
        justify-content:center;
        font-size:22px;
        cursor:pointer
    }
    .technician-shell .technician-content {
        padding:16px
    }
    .technician-shell .tech-stat-grid,.technician-shell .tech-stock-summary {
        grid-template-columns:repeat(2,minmax(0,1fr))
    }
}
@media(max-width:600px) {
    .technician-shell {
        border-radius:12px
    }
    .technician-shell .technician-content {
        padding:12px
    }
    .technician-shell .technician-topbar {
        align-items:flex-start;
        gap:9px;
        margin-bottom:14px
    }
    .technician-shell .technician-topbar > div:first-child {
        gap:9px!important
    }
    .technician-shell .technician-mobile-menu {
        width:40px;
        height:40px;
        min-width:40px;
        flex:0 0 40px
    }
    .technician-shell .technician-topbar h2 {
        font-size:18px;
        line-height:1.25
    }
    .technician-shell .technician-topbar p {
        font-size:11px;
        line-height:1.35;
        white-space:normal;
        display:-webkit-box;
        -webkit-box-orient:vertical;
        -webkit-line-clamp:2;
        overflow:hidden;
        text-overflow:ellipsis
    }
    .technician-shell .technician-toolbar {
        width:auto
    }
    .technician-shell .technician-toolbar .tech-btn {
        min-height:40px;
        padding:8px 11px
    }
    .technician-shell .tech-stat-grid,.technician-shell .tech-stock-summary {
        grid-template-columns:repeat(2,minmax(0,1fr));
        gap:8px
    }
    .technician-shell .tech-stat {
        padding:12px;
        border-radius:12px
    }
    .technician-shell .tech-stat .value {
        font-size:20px
    }
    .technician-shell .tech-section {
        padding:13px;
        border-radius:12px
    }
    .technician-shell .tech-section-header {
        align-items:flex-start;
        gap:9px
    }
    .technician-shell .tech-section-header > .technician-toolbar {
        width:100%
    }
    .technician-shell .tech-section-header > .technician-toolbar > * {
        width:100%
    }
    .technician-shell .tech-proof-card {
        grid-template-columns:1fr
    }
    .technician-shell .tech-proof-preview {
        width:100%;
        height:170px
    }
    .technician-shell .tech-form-row,.technician-shell .tech-detail-grid {
        grid-template-columns:1fr
    }
    .technician-shell .tech-action-row {
        width:100%
    }
    .technician-shell .tech-action-row .tech-btn {
        flex:1 1 auto
    }
}
@media(max-width:380px) {
    .technician-shell .technician-content {
        padding:10px
    }
    .technician-shell .technician-topbar {
        gap:7px
    }
    .technician-shell .technician-mobile-menu {
        width:38px;
        height:38px;
        min-width:38px;
        flex-basis:38px;
        font-size:20px
    }
    .technician-shell .technician-topbar h2 {
        font-size:16px
    }
    .technician-shell .technician-topbar p {
        font-size:10.5px
    }
    .technician-shell .technician-topbar .technician-toolbar {
        display:none
    }
    .technician-shell .tech-stat-grid,.technician-shell .tech-stock-summary {
        grid-template-columns:repeat(2,minmax(0,1fr));
        gap:7px
    }
    .technician-shell .tech-section {
        padding:11px
    }
    .technician-shell .tech-table {
        min-width:680px
    }
}
@media(max-width:320px) {
    .technician-shell .technician-content {
        padding:8px
    }
    .technician-shell .technician-topbar h2 {
        font-size:15px
    }
    .technician-shell .technician-topbar p {
        -webkit-line-clamp:2
    }
}

.technician-shell,.technician-shell * {
    box-sizing:border-box
}
.technician-shell {
    width:100%;
    max-width:100%;
    min-width:0
}
.technician-shell .technician-content {
    min-width:0;
    overflow:hidden
}
.technician-shell .technician-topbar {
    min-width:0
}
.technician-shell .technician-topbar > div:first-child {
    min-width:0;
    flex:1 1 auto
}
.technician-shell .technician-topbar > div:first-child > div {
    min-width:0;
    max-width:100%
}
.technician-shell .technician-topbar h2 {
    max-width:100%;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis
}
.technician-shell .technician-topbar p {
    max-width:100%;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis
}
.technician-shell .technician-toolbar {
    flex:0 0 auto;
    min-width:0
}
.technician-shell .technician-toolbar .tech-btn {
    white-space:nowrap
}
.technician-shell .technician-nav {
    min-width:0
}
.technician-shell .technician-nav button {
    min-width:0
}
.technician-shell .technician-nav button > span:last-child {
    min-width:0;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap
}
.technician-shell .technician-user > div:last-child {
    min-width:0
}
.technician-shell .technician-user strong,.technician-shell .technician-user small {
    display:block;
    min-width:0;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap
}
.technician-shell .tech-table-wrap {
    max-width:100%;
    overflow-x:auto;
    overflow-y:hidden;
    -webkit-overflow-scrolling:touch
}
.technician-shell .tech-table {
    min-width:720px
}
.technician-shell .tech-section {
    min-width:0;
    max-width:100%
}
.technician-shell .tech-section-header > * {
    min-width:0
}
.technician-shell .tech-section-header h3 {
    overflow-wrap:anywhere
}
.technician-shell input,.technician-shell select,.technician-shell textarea,.technician-shell button {
    max-width:100%
}
.technician-shell .tech-proof-input {
    min-width:0
}


.technician-shell .tech-client-section,
.technician-shell .tech-status-page{
  min-width:0;
}
.technician-shell .tech-client-toolbar-wrap{
  align-items:flex-start;
}
.technician-shell .tech-client-toolbar-wrap > div:first-child{
  min-width:220px;
  flex:1 1 320px;
}
.technician-shell .tech-client-toolbar-wrap h3{
  margin:0;
  color:#0f172a;
  font-size:17px;
  font-weight:800;
}
.technician-shell .tech-client-toolbar-wrap p{
  margin:3px 0 0;
  color:#64748b;
  font-size:12px;
  line-height:1.5;
}
.technician-shell .tech-client-filters{
  justify-content:flex-end;
  align-items:center;
  gap:8px;
}
.technician-shell .tech-filter-label{
  color:#475569;
  font-size:11px;
  font-weight:800;
}
.technician-shell .tech-filter-select,
.technician-shell .tech-filter-date,
.technician-shell .tech-client-search{
  min-height:40px;
  border:1px solid #cbd5e1;
  border-radius:10px;
  background:#fff;
  color:#0f172a;
  padding:9px 11px;
  font:inherit;
  font-size:12px;
  outline:none;
}
.technician-shell .tech-client-search{
  width:230px;
}
.technician-shell .tech-custom-date-group{
  display:flex;
  align-items:center;
  gap:6px;
}
.technician-shell .tech-date-separator{
  color:#64748b;
  font-size:11px;
  font-weight:700;
}
.technician-shell .tech-client-period-summary{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
  margin:0 0 10px;
  padding:8px 12px;
  border:1px solid #e2e8f0;
  border-radius:9px;
  background:#f8fafc;
  color:#64748b;
  font-size:11px;
}
.technician-shell .tech-client-period-summary strong{
  color:#0f172a;
}
.technician-shell .tech-client-table-wrap{
  width:100%;
  overflow-x:auto;
  overflow-y:hidden;
  border:1px solid #dbe4ef;
  border-radius:12px;
  background:#fff;
  -webkit-overflow-scrolling:touch;
}
.technician-shell .tech-client-table{
  width:max-content;
  min-width:1180px;
  table-layout:auto;
}
.technician-shell .tech-client-table th{
  height:42px;
  padding:10px 12px;
  background:#f8fafc;
  color:#334155;
  white-space:nowrap;
  font-size:10px;
  font-weight:800;
  letter-spacing:.04em;
  text-transform:uppercase;
}
.technician-shell .tech-client-table td{
  min-height:48px;
  padding:11px 12px;
  color:#475569;
  font-size:12px;
  vertical-align:middle;
  white-space:nowrap;
}
.technician-shell .tech-client-table th:nth-child(1),
.technician-shell .tech-client-table td:nth-child(1){
  min-width:115px;
}
.technician-shell .tech-client-table th:nth-child(2),
.technician-shell .tech-client-table td:nth-child(2){
  min-width:105px;
}
.technician-shell .tech-client-table th:nth-child(3),
.technician-shell .tech-client-table td:nth-child(3){
  min-width:170px;
}
.technician-shell .tech-client-table th:nth-child(4),
.technician-shell .tech-client-table td:nth-child(4){
  min-width:145px;
}
.technician-shell .tech-client-table th:nth-child(5),
.technician-shell .tech-client-table td:nth-child(5){
  min-width:240px;
}
.technician-shell .tech-client-table th:nth-child(6),
.technician-shell .tech-client-table td:nth-child(6){
  min-width:125px;
}
.technician-shell .tech-client-table th:nth-child(7),
.technician-shell .tech-client-table td:nth-child(7){
  min-width:150px;
}
.technician-shell .tech-client-table th:nth-child(8),
.technician-shell .tech-client-table td:nth-child(8){
  min-width:250px;
}
.technician-shell .tech-client-table th:nth-child(9),
.technician-shell .tech-client-table td:nth-child(9){
  min-width:145px;
  text-align:center;
}
.technician-shell .tech-cell-address,
.technician-shell .tech-cell-complaint{
  white-space:normal !important;
  line-height:1.45;
}
.technician-shell .tech-map-link{
  color:#075e55;
  font-weight:800;
  text-decoration:none;
}
.technician-shell .tech-map-link:hover{
  text-decoration:underline;
}
.technician-shell .tech-update-action-btn{
  min-width:120px;
  white-space:nowrap;
  background:linear-gradient(135deg,#0b917d,#075e55);
}
.technician-shell .tech-update-action-btn:hover{
  transform:translateY(-1px);
}
.technician-shell .tech-status-page .tech-client-table{
  min-width:1325px;
}
.tech-modal .tech-technician-field{
  grid-column:1/-1;
}
.tech-modal .tech-technician-field input{
  background:#f8fafc;
  font-weight:700;
}
.tech-modal .tech-update-status-inline{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:12px;
  align-items:end;
}
.tech-modal .tech-update-status-inline .tech-full-field{
  margin:0;
}
@media(max-width:900px){
  .technician-shell .tech-client-toolbar-wrap{
    display:flex;
    flex-direction:column;
    align-items:stretch;
  }
  .technician-shell .tech-client-filters{
    justify-content:flex-start;
    align-items:stretch;
    width:100%;
  }
  .technician-shell .tech-client-search{
    width:100%;
    flex:1 1 220px;
  }
  .technician-shell .tech-filter-select{
    min-width:150px;
  }
  .technician-shell .tech-custom-date-group{
    flex:1 1 100%;
  }
  .technician-shell .tech-custom-date-group .tech-filter-date{
    flex:1 1 0;
    min-width:0;
  }
}

/* ===== Unified public, admin, and technician theme surfaces ===== */
:root {
  --leressae-light-canvas: #f6f9fc;
  --leressae-light-surface: #ffffff;
  --leressae-light-surface-soft: #f8fbfe;
  --leressae-light-border: #dce7f0;
  --leressae-light-ink: #122b45;
  --leressae-light-muted: #5d7185;
  --leressae-dark-canvas: #0b1220;
  --leressae-dark-surface: #111c2d;
  --leressae-dark-surface-soft: #17263a;
  --leressae-dark-border: #31445b;
  --leressae-dark-ink: #f3f7fc;
  --leressae-dark-muted: #b7c6d8;
}

/* Default / light mode: make operational panels crisp and consistent. */
html[data-leressae-theme="light"] :is(.admin-shell, .technician-shell) {
  color: var(--leressae-light-ink);
}
html[data-leressae-theme="light"] :is(.admin-content, .technician-content) {
  background: transparent;
}
html[data-leressae-theme="light"] :is(.admin-card, .tech-section, .tech-card, .admin-topbar) {
  background: var(--leressae-light-surface) !important;
  border-color: var(--leressae-light-border) !important;
  color: var(--leressae-light-ink) !important;
  box-shadow: 0 8px 24px rgba(24, 50, 75, .06);
}
html[data-leressae-theme="light"] :is(.admin-card h1, .admin-card h2, .admin-card h3, .admin-card h4, .tech-section h1, .tech-section h2, .tech-section h3, .tech-section h4, .technician-content h1, .technician-content h2) {
  color: var(--leressae-light-ink) !important;
}
html[data-leressae-theme="light"] :is(.admin-card p, .tech-section p, .technician-content p, .section-sub-text, .tech-section small) {
  color: var(--leressae-light-muted) !important;
}
html[data-leressae-theme="light"] :is(.admin-card input, .admin-card select, .admin-card textarea, .tech-section input, .tech-section select, .tech-section textarea, .technician-content input, .technician-content select, .technician-content textarea) {
  background: #fff !important;
  color: var(--leressae-light-ink) !important;
  border-color: #cbd9e5 !important;
}
html[data-leressae-theme="light"] :is(.admin-table th, .tech-table th) {
  background: #edf4f9 !important;
  color: #183b58 !important;
  border-color: var(--leressae-light-border) !important;
}
html[data-leressae-theme="light"] :is(.admin-table td, .tech-table td) {
  background: #fff !important;
  color: #29465e !important;
  border-color: #e1eaf1 !important;
}
html[data-leressae-theme="light"] :is(.admin-table tbody tr:hover td, .tech-table tbody tr:hover td) {
  background: #f2f8fc !important;
}

/* Dark mode: explicit per-component colors prevent low-contrast inherited text. */
html[data-leressae-theme="dark"] :is(.admin-shell, .technician-shell) {
  color: var(--leressae-dark-ink);
}
html[data-leressae-theme="dark"] :is(.admin-content, .technician-content) {
  background: var(--leressae-dark-canvas) !important;
  color: var(--leressae-dark-ink) !important;
}
html[data-leressae-theme="dark"] :is(.admin-card, .tech-section, .tech-card, .admin-topbar) {
  background: var(--leressae-dark-surface) !important;
  border-color: var(--leressae-dark-border) !important;
  color: var(--leressae-dark-ink) !important;
  box-shadow: 0 12px 30px rgba(0, 0, 0, .24) !important;
}
html[data-leressae-theme="dark"] :is(.admin-card h1, .admin-card h2, .admin-card h3, .admin-card h4, .tech-section h1, .tech-section h2, .tech-section h3, .tech-section h4, .technician-content h1, .technician-content h2, .admin-content h1, .admin-content h2) {
  color: var(--leressae-dark-ink) !important;
}
html[data-leressae-theme="dark"] :is(.admin-card p, .tech-section p, .technician-content p, .admin-content p, .section-sub-text, .tech-section small, .admin-card small) {
  color: var(--leressae-dark-muted) !important;
}
html[data-leressae-theme="dark"] :is(.admin-card input, .admin-card select, .admin-card textarea, .tech-section input, .tech-section select, .tech-section textarea, .technician-content input, .technician-content select, .technician-content textarea) {
  background: #0d1726 !important;
  color: #f3f7fc !important;
  border-color: #3a516a !important;
  -webkit-text-fill-color: #f3f7fc !important;
}
html[data-leressae-theme="dark"] :is(.admin-card input::placeholder, .admin-card textarea::placeholder, .tech-section input::placeholder, .tech-section textarea::placeholder) {
  color: #8fa4ba !important;
  -webkit-text-fill-color: #8fa4ba !important;
}
html[data-leressae-theme="dark"] :is(.admin-table-wrap, .tech-table-wrap) {
  border-color: var(--leressae-dark-border) !important;
  scrollbar-color: #526a82 #0b1220;
}
html[data-leressae-theme="dark"] :is(.admin-table th, .tech-table th) {
  background: #182a40 !important;
  color: #f5f9ff !important;
  border-color: #385069 !important;
}
html[data-leressae-theme="dark"] :is(.admin-table td, .tech-table td) {
  background: var(--leressae-dark-surface) !important;
  color: #dce8f4 !important;
  border-color: #2d4055 !important;
}
html[data-leressae-theme="dark"] :is(.admin-table tbody tr:hover td, .tech-table tbody tr:hover td) {
  background: #1a2c42 !important;
  color: #fff !important;
}
html[data-leressae-theme="dark"] :is(.admin-nav-item, .technician-nav button) {
  color: #c7d6e6 !important;
}
html[data-leressae-theme="dark"] :is(.admin-nav-item:hover, .admin-nav-item.active, .technician-nav button:hover, .technician-nav button.active) {
  background: rgba(8, 127, 112, .2) !important;
  border-color: rgba(129, 204, 176, .4) !important;
  color: #fff !important;
}

/* Public dashboard maintains the same readable hierarchy in dark mode. */
html[data-leressae-theme="dark"] #page-dashboard {
  --pub-ink: #e8f5ee;
  --pub-muted: #b2c8bf;
  --pub-border: #345348;
  --pub-surface: #14241f;
}
html[data-leressae-theme="dark"] #page-dashboard :is(.hero-section, .hero-slogan-card, .pillar-card, .dashboard-section, .service-item-card, .tutorial-card) {
  background: linear-gradient(155deg, #172c25, #10201c) !important;
  border-color: #345348 !important;
  box-shadow: 0 12px 30px rgba(0, 0, 0, .22) !important;
}
html[data-leressae-theme="dark"] #page-dashboard :is(.hero-title, .slogan-main, .pillar-title, .service-item-title, .tutorial-card h3, .section-title-text) {
  color: #e8f5ee !important;
}
html[data-leressae-theme="dark"] #page-dashboard :is(.hero-desc, .slogan-label, .slogan-sub, .pillar-desc, .service-item-desc, .tutorial-card p, .section-sub-text, .tutorial-meta) {
  color: #b2c8bf !important;
}
html[data-leressae-theme="dark"] #page-dashboard :is(.hero-actions .btn-secondary, .pillar-icon, .service-item-icon, .tutorial-tag) {
  background: #19382d !important;
  border-color: #3a6957 !important;
  color: #b8e6d2 !important;
}

html[data-leressae-theme="dark"] :is(.admin-content, .technician-content, #page-dashboard) :is(button, a, input, select, textarea):focus-visible {
  outline: 3px solid #70c6a1 !important;
  outline-offset: 2px;
}
@media(max-width:600px){
  .technician-shell .tech-client-filters{
    display:grid;
    grid-template-columns:1fr;
    gap:8px;
  }
  .technician-shell .tech-filter-label{
    margin-bottom:-2px;
  }
  .technician-shell .tech-filter-select,
  .technician-shell .tech-filter-date,
  .technician-shell .tech-client-search{
    width:100%;
  }
  .technician-shell .tech-custom-date-group{
    display:grid !important;
    grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);
    align-items:center;
  }
  .technician-shell .tech-client-period-summary{
    align-items:flex-start;
    flex-direction:column;
  }
  .technician-shell .tech-client-table{
    min-width:1180px;
  }
  .technician-shell .tech-status-page .tech-client-table{
    min-width:1325px;
  }
  .tech-modal .tech-update-status-inline{
    grid-template-columns:1fr;
  }
}

button, .btn-primary, .btn-secondary, .admin-primary-btn, .save-status-btn, .btn-login, .btn-logout {
  -webkit-tap-highlight-color: transparent;
  transition: transform .18s cubic-bezier(.2,.7,.2,1), box-shadow .22s ease, background-color .22s ease, border-color .22s ease, color .22s ease, filter .22s ease;
}
button:not(:disabled):not([aria-disabled="true"]):hover,
.btn-primary:hover, .btn-secondary:hover, .admin-primary-btn:hover, .save-status-btn:hover {
  filter: brightness(1.025);
}
button:not(:disabled):not([aria-disabled="true"]):active,
.btn-primary:active, .btn-secondary:active, .admin-primary-btn:active, .save-status-btn:active { transform: translateY(1px) scale(.99); }
button:focus-visible, a:focus-visible, .btn-primary:focus-visible, .btn-secondary:focus-visible {
  outline: 3px solid rgba(8,127,112,.32); outline-offset: 3px;
}
button:disabled, [aria-disabled="true"] { cursor: not-allowed; }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { scroll-behavior:auto !important; transition-duration:.01ms !important; animation-duration:.01ms !important; animation-iteration-count:1 !important; } }

.danger-delete-news {
    background: #dc2626 !important;
    color: #ffffff !important;
    border: 1px solid #dc2626 !important;
    font-weight: 700 !important;
}
.danger-delete-news:hover {
    background: #b91c1c !important;
    border-color: #b91c1c !important;
}

body.media-modal-open { overflow: hidden; }
body.media-modal-open::before {
    content: '';
    position: fixed;
    inset: 0;
    background: rgba(15, 23, 42, .58);
    backdrop-filter: blur(2px);
    z-index: 9998;
}
.media-admin-form.media-modal-active {
    display: block !important;
    position: fixed !important;
    top: 50%;
    left: 50%;
    transform: translate3d(-50%, -50%, 0);
    width: min(720px, calc(100vw - 32px));
    box-sizing: border-box;
    max-height: min(88vh, 760px);
    overflow-y: auto;
    z-index: 9999;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 18px !important;
    background: #fff !important;
    box-shadow: 0 24px 70px rgba(15, 23, 42, .30);
}
.media-modal-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 18px 22px;
    background: linear-gradient(135deg, #0b917d 0%, #075e55 100%);
    color: #fff;
    border-radius: 18px 18px 0 0;
    position: sticky;
    top: 0;
    z-index: 2;
}
.media-modal-title { margin: 0; font-size: 20px; font-weight: 800; color: #fff; }
.media-modal-close {
    width: 40px; height: 40px; border: 0; border-radius: 50%;
    background: rgba(255,255,255,.14); color: #fff; font-size: 26px;
    line-height: 1; cursor: pointer;
}
.media-modal-close:hover { background: rgba(255,255,255,.24); }
.media-admin-form.media-modal-active > .field-row,
.media-admin-form.media-modal-active > .stock-actions { margin-left: 22px; margin-right: 22px; }
.media-admin-form.media-modal-active > .field-row:first-of-type { margin-top: 20px; }
.media-admin-form.media-modal-active > .stock-actions { margin-bottom: 22px; }
@media (max-width: 640px) {
    .media-admin-form.media-modal-active { width: calc(100vw - 20px); max-height: 92vh; border-radius: 14px !important; }
    .media-modal-header { padding: 15px 17px; border-radius: 14px 14px 0 0; }
    .media-admin-form.media-modal-active > .field-row,
    .media-admin-form.media-modal-active > .stock-actions { margin-left: 17px; margin-right: 17px; }
}
.news-editor-actions { justify-content: flex-end; gap: 10px; }
.news-editor-actions .danger-delete-news { margin-right: auto; }

/* ===== ORIGINAL STYLE BLOCK 2 id="media-title-description-fix" ===== */
.media-admin-form input[name="judul"],
.media-admin-form textarea[name="deskripsi"] {
    width: 100%;
    border: 1px solid #cbd5e1;
    border-radius: 10px;
    padding: 10px 12px;
    background: #fff;
    color: #0f172a;
    font: inherit;
    line-height: 1.45;
    outline: none;
}
.media-admin-form textarea[name="deskripsi"] {
    min-height: 88px;
    resize: vertical;
}
.media-admin-form input[name="judul"]:focus,
.media-admin-form textarea[name="deskripsi"]:focus {
    border-color: #49a98a;
    box-shadow: 0 0 0 3px rgba(8, 127, 112, 0.12);
}

/* ===== ORIGINAL STYLE BLOCK 3 id="leressae-smooth-social-lightbox" ===== */
#lightbox.lightbox-overlay {
  position: fixed !important;
  inset: 0 !important;
  z-index: 2147483000 !important;
  padding: clamp(12px, 3vw, 32px) !important;
  background: rgba(3, 7, 18, .84) !important;
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
  align-items: center;
  justify-content: center;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  display: flex !important;
  transition: opacity .28s ease, visibility .28s ease;
}
#lightbox.lightbox-overlay[aria-hidden="false"] {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}
#lightbox .lightbox-content {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  width: min(1080px, 100%);
  max-width: 1080px;
  max-height: 90vh;
  padding: 0;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.14);
  border-radius: 20px;
  background: #101319;
  color: #f8fafc;
  box-shadow: 0 28px 90px rgba(0,0,0,.48);
  transform: translateY(14px) scale(.975);
  transition: transform .32s cubic-bezier(.2,.8,.2,1);
}
#lightbox[aria-hidden="false"] .lightbox-content {
  transform: translateY(0) scale(1);
}
#lightbox .lightbox-img,
#lightbox .lightbox-video {
  display: block;
  align-self: center;
  max-width: 100%;
  width: auto;
  height: auto;
  max-height: min(68vh, 720px);
  margin: 0 auto;
  padding: 0;
  object-fit: contain;
  background: #050608;
  box-shadow: none;
}
#lightbox .lightbox-video { width: 100%; }
#lightbox .lightbox-caption {
  flex: 0 0 auto;
  width: 100%;
  padding: 18px 22px 20px;
  border: 0;
  border-radius: 0;
  background: #101319;
  color: #e5e7eb;
  box-shadow: none;
  text-align: left;
}
#lightbox .lightbox-caption strong {
  margin-bottom: 7px;
  color: #fff;
  font-size: 18px !important;
  line-height: 1.35;
}
#lightbox .lightbox-caption p {
  color: #b8c0cc !important;
  font-size: 14px !important;
  line-height: 1.65;
}
#lightbox .lightbox-close,
#lightbox .lightbox-nav {
  z-index: 3;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  border: 1px solid rgba(255,255,255,.18);
  border-radius: 50%;
  background: rgba(15,18,25,.72);
  color: #fff;
  box-shadow: 0 8px 24px rgba(0,0,0,.22);
  cursor: pointer;
  transition: background .2s ease, transform .2s ease;
}
#lightbox .lightbox-close {
  position: fixed;
  top: max(14px, env(safe-area-inset-top));
  right: max(14px, env(safe-area-inset-right));
  font-size: 19px;
}
#lightbox .lightbox-nav {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  font-size: 29px;
}
#lightbox .lightbox-nav.prev { left: 14px; }
#lightbox .lightbox-nav.next { right: 14px; }
#lightbox .lightbox-close:hover,
#lightbox .lightbox-nav:hover { background: rgba(71,85,105,.95); }
#lightbox .lightbox-nav:hover { transform: translateY(-50%) scale(1.06); }
#lightbox .lightbox-close:active { transform: scale(.94); }
#lightbox button:focus-visible {
  outline: 3px solid rgba(8, 127, 112, .48);
  outline-offset: 3px;
}
body.leressae-lightbox-open { overflow: hidden; }
.media-item { cursor: zoom-in; }
.media-item img, .media-item .video-player video {
  transition: transform .28s ease, filter .28s ease;
}
.media-item:hover img, .media-item:hover .video-player video {
  filter: brightness(.94);
}
@media (max-width: 720px) {
  #lightbox.lightbox-overlay { padding: 10px !important; }
  #lightbox .lightbox-content {
    width: 100%;
    max-height: 88dvh;
    border-radius: 16px;
  }
  #lightbox .lightbox-img,
  #lightbox .lightbox-video {
    max-width: 100%;
    max-height: 58dvh;
  }
  #lightbox .lightbox-caption { padding: 14px 16px 16px; }
  #lightbox .lightbox-caption strong { font-size: 16px !important; }
  #lightbox .lightbox-caption p { font-size: 13px !important; }
  #lightbox .lightbox-close { width: 40px; height: 40px; }
  #lightbox .lightbox-nav { width: 38px; height: 38px; }
  #lightbox .lightbox-nav.prev { left: 8px; }
  #lightbox .lightbox-nav.next { right: 8px; }
}
@media (prefers-reduced-motion: reduce) {
  #lightbox, #lightbox .lightbox-content,
  #lightbox .lightbox-close, #lightbox .lightbox-nav {
    transition: none !important;
  }
}

/* ===== ORIGINAL STYLE BLOCK 4 id="leressae-instagram-media-viewer-fix" ===== */
#lightbox .lightbox-content {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(250px, 320px);
  grid-template-rows: minmax(0, 1fr);
  align-items: stretch;
  width: min(1180px, 96vw);
  height: min(780px, 88vh);
  max-height: 88vh;
  background: #111318;
  border-radius: 14px;
}
#lightbox .lightbox-img,
#lightbox .lightbox-video {
  grid-column: 1;
  grid-row: 1;
  width: 100%;
  height: 100%;
  max-width: 100%;
  max-height: 100%;
  min-height: 0;
  object-fit: contain;
  background: #050608;
}
#lightbox .lightbox-video-frame {
  border: 0;
  aspect-ratio: 16 / 9;
}
#lightbox .lightbox-caption {
  grid-column: 2;
  grid-row: 1;
  align-self: stretch;
  box-sizing: border-box;
  width: 100%;
  overflow-y: auto;
  border-left: 1px solid rgba(255,255,255,.1);
  padding: 22px 18px;
}
#lightbox .lightbox-close { z-index: 10; }
#lightbox .lightbox-nav { z-index: 5; }
#publicMediaVideoGrid .video-player { position: relative; cursor: zoom-in; }
#publicMediaVideoGrid .video-player iframe { pointer-events: none; }
#publicMediaVideoGrid .video-player::after {
  content: '⤢';
  position: absolute;
  right: 10px;
  bottom: 10px;
  display: grid;
  place-items: center;
  width: 36px;
  height: 36px;
  border: 1px solid rgba(255,255,255,.35);
  border-radius: 50%;
  background: rgba(0,0,0,.62);
  color: #fff;
  font-size: 22px;
  pointer-events: none;
}
#publicMediaPhotoGrid .media-item img { cursor: zoom-in; }
@media (max-width: 760px) {
  #lightbox.lightbox-overlay { padding: 10px !important; }
  #lightbox .lightbox-content {
    display: flex !important;
    flex-direction: column;
    width: 100%;
    height: auto;
    max-height: 88dvh;
    border-radius: 14px;
  }
  #lightbox .lightbox-img,
  #lightbox .lightbox-video {
    flex: 1 1 auto;
    width: 100%;
    height: auto;
    max-height: 58dvh;
    min-height: 180px;
  }
  #lightbox .lightbox-caption {
    flex: 0 0 auto;
    max-height: 25dvh;
    border-left: 0;
    border-top: 1px solid rgba(255,255,255,.1);
    padding: 14px 16px;
  }
}

/* ===== ORIGINAL STYLE BLOCK 5 id="leressae-ux-polish" ===== */
:root {
  --ui-ink: #172b45;
  --ui-muted: #64748b;
  --ui-line: rgba(148,163,184,.24);
  --ui-surface: rgba(255,255,255,.94);
  --ui-soft: #f4f7fb;
  --ui-primary: #087f70;
  --ui-accent: #087f70;
  --ui-radius: 16px;
  --ui-shadow: 0 10px 30px rgba(15,35,60,.07);
  --ui-shadow-hover: 0 16px 38px rgba(15,35,60,.12);
}
html { scroll-behavior: smooth; }
body { color: var(--ui-ink); text-rendering: optimizeLegibility; }
button, input, select, textarea { font: inherit; }
button, a, input, select, textarea { -webkit-tap-highlight-color: transparent; }
button, .btn-primary, .btn-secondary, .admin-primary-btn, .save-status-btn {
  transition: background-color .18s ease, color .18s ease, border-color .18s ease,
              box-shadow .18s ease, transform .18s ease;
}
button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible,
textarea:focus-visible { outline: 3px solid rgba(8,127,112,.32); outline-offset: 2px; }
.card-container, .dashboard-section, .status-lookup-wrap, .service-status-card,
.pillar-card, .tutorial-card, .admin-card, .tech-card, .stock-panel, .login-panel {
  border-radius: var(--ui-radius);
}
.card-container, .dashboard-section, .status-lookup-wrap, .service-status-card,
.pillar-card, .admin-card, .tech-card {
  box-shadow: var(--ui-shadow);
  border-color: var(--ui-line);
}
.pillar-card, .tutorial-card, .media-item, .service-status-card, .admin-card, .tech-card {
  transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
@media (hover:hover) {
  .pillar-card:hover, .tutorial-card:hover, .media-item:hover, .service-status-card:hover,
  .admin-card:hover, .tech-card:hover { transform: translateY(-2px); box-shadow: var(--ui-shadow-hover); }
}
input, select, textarea {
  max-width: 100%;
  border-color: #d5deea;
  border-radius: 10px;
}
input:focus, select:focus, textarea:focus {
  border-color: #41a28c;
  box-shadow: 0 0 0 3px rgba(8,127,112,.12);
}
button:disabled { opacity: .58; cursor: not-allowed !important; transform: none !important; }
img, video, iframe { max-width: 100%; }
@media (max-width: 768px) {
  .card-container, .dashboard-section { padding: 18px 14px; }
  .status-form { grid-template-columns: minmax(0,1fr); }
  .status-form button { width: 100%; }
  .stock-body .field-row { align-items: stretch; flex-direction: column; }
  .stock-body .field-row label { width: auto; }
  .stock-actions { flex-wrap: wrap; }
  .stock-actions button { flex: 1 1 140px; }
  .lightbox-overlay { padding: 10px; }
  .lightbox-nav.prev { left: 8px; }
  .lightbox-nav.next { right: 8px; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important;
    animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}

/* ===== ORIGINAL STYLE BLOCK 6 ===== */
#page-dashboard {
  --pub-ink: #10243e;
  --pub-muted: #64748b;
  --pub-blue: #087f70;
  --pub-border: rgba(203, 216, 231, .78);
  --pub-surface: rgba(255,255,255,.92);
  gap: clamp(18px, 2.2vw, 28px) !important;
}
#page-dashboard > * { min-width: 0; }
#page-dashboard .hero-section {
  isolation: isolate;
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(260px, .75fr);
  align-items: center;
  gap: clamp(22px, 3vw, 42px);
  min-height: 390px;
  padding: clamp(28px, 4.5vw, 58px);
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.72);
  border-radius: 28px;
  background-color: #edf6f0;
  background-image:
    linear-gradient(112deg, rgba(248,252,249,.97) 0%, rgba(239,248,243,.91) 48%, rgba(224,241,231,.76) 100%),
    radial-gradient(circle at 15% 20%, rgba(52,211,153,.18) 0 6%, transparent 6.5%),
    radial-gradient(circle at 80% 25%, rgba(45,145,103,.12) 0 10%, transparent 10.5%),
    linear-gradient(135deg, transparent 0 66%, rgba(45,145,103,.08) 66% 67%, transparent 67% 100%),
    linear-gradient(315deg, transparent 0 72%, rgba(112,176,140,.09) 72% 73%, transparent 73% 100%);
  background-size: cover, 100% 100%, 100% 100%, 100% 100%, 100% 100%;
  background-position: center;
  box-shadow: 0 18px 50px rgba(24, 87, 62, .09), inset 0 1px 0 rgba(255,255,255,.9);
}
#page-dashboard .hero-section::before,
#page-dashboard .hero-section::after {
  content: ""; position: absolute; z-index: -1; pointer-events: none;
  border-radius: 50%; filter: blur(1px);
}
#page-dashboard .hero-section::before {
  width: 340px; height: 340px; right: 13%; top: -190px;
  background: rgba(255,255,255,.44);
  box-shadow: -160px 90px 0 rgba(255,255,255,.18), -280px 200px 0 rgba(92,163,122,.08);
}
#page-dashboard .hero-section::after {
  width: 260px; height: 260px; right: -110px; bottom: -150px;
  background: rgba(93,157,126,.12);
  box-shadow: -160px -80px 0 rgba(255,255,255,.2), -210px 30px 0 rgba(34,197,94,.08);
}
#page-dashboard .hero-content { position: relative; z-index: 1; max-width: 720px; }
#page-dashboard .hero-badge {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 7px 12px; margin-bottom: 18px;
  border: 1px solid rgba(8,127,112,.18); border-radius: 999px;
  background: rgba(255,255,255,.72); color: #286153;
  font-size: .72rem; letter-spacing: .07em; font-weight: 800;
  box-shadow: 0 4px 14px rgba(25,77,64,.05);
}
#page-dashboard .hero-title {
  max-width: 680px; margin: 0 0 18px !important;
  color: #102b49 !important; font-size: clamp(2rem, 3.6vw, 3.35rem) !important;
  line-height: 1.08 !important; letter-spacing: -.045em;
  text-wrap: balance;
}
#page-dashboard .hero-desc {
  max-width: 650px; margin: 0 0 26px !important;
  color: #52677d !important; font-size: clamp(.94rem, 1.05vw, 1.08rem) !important;
  line-height: 1.8 !important;
}
#page-dashboard .hero-actions { display: flex; flex-wrap: wrap; gap: 11px; }
#page-dashboard .hero-actions .btn-primary,
#page-dashboard .hero-actions .btn-secondary {
  min-height: 48px; display: inline-flex; align-items: center; justify-content: center;
  gap: 8px; padding: 13px 20px; border-radius: 13px;
  font-size: .9rem; font-weight: 750; text-decoration: none;
  transition: transform .22s ease, box-shadow .22s ease, background .22s ease;
}
#page-dashboard .hero-actions .btn-primary {
  color: #fff; background: linear-gradient(135deg,#0b917d,#075e55);
  box-shadow: 0 9px 22px rgba(8,112,91,.2);
}
#page-dashboard .hero-actions .btn-secondary {
  color: #286153; background: rgba(255,255,255,.88);
  border: 1px solid rgba(114,166,144,.28); box-shadow: 0 5px 16px rgba(16,67,57,.06);
}
#page-dashboard .hero-actions .btn-primary:hover,
#page-dashboard .hero-actions .btn-secondary:hover { transform: translateY(-2px); }
#page-dashboard .hero-slogan-card {
  min-height: 0; padding: clamp(22px, 2.6vw, 32px);
  border: 1px solid rgba(255,255,255,.8); border-radius: 22px;
  background: rgba(255,255,255,.64); backdrop-filter: blur(16px) saturate(130%);
  -webkit-backdrop-filter: blur(16px) saturate(130%);
  box-shadow: 0 16px 36px rgba(31,65,91,.09), inset 0 1px 0 rgba(255,255,255,.9);
}
#page-dashboard .slogan-label { color: #54718a; font-size: .72rem; letter-spacing: .12em; font-weight: 800; }
#page-dashboard .slogan-main { color: #183d5b; font-size: clamp(1.15rem,1.6vw,1.5rem); line-height: 1.35; font-weight: 800; text-wrap: balance; }
#page-dashboard .slogan-sub { color: #5c7185; font-size: .9rem; line-height: 1.75; }
#page-dashboard .decor-bike { opacity: .09; }
#page-dashboard .pillars-grid { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 16px; }
#page-dashboard .pillar-card {
  position: relative; gap: 13px; padding: 23px;
  border: 1px solid var(--pub-border); border-radius: 20px;
  background: var(--pub-surface); box-shadow: 0 8px 24px rgba(24,50,75,.045);
  transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}
#page-dashboard .pillar-card:hover { transform: translateY(-3px); border-color: #c0d6e7; box-shadow: 0 14px 30px rgba(24,50,75,.085); }
#page-dashboard .pillar-icon {
  width: 48px; height: 48px; border-radius: 15px;
  color: #087f70; background: linear-gradient(145deg,#e8f6ef,#f7fbf8);
  border: 1px solid #d5e8dd;
}
#page-dashboard .pillar-title { color: var(--pub-ink); font-size: 1rem; line-height: 1.4; }
#page-dashboard .pillar-desc { color: var(--pub-muted); font-size: .88rem; line-height: 1.75; }
#page-dashboard .dashboard-section {
  padding: clamp(20px, 3vw, 32px); border: 1px solid var(--pub-border);
  border-radius: 22px; background: var(--pub-surface);
  box-shadow: 0 10px 28px rgba(24,50,75,.045);
}
#page-dashboard .section-header { margin-bottom: 22px; }
#page-dashboard .section-title-text { color: var(--pub-ink); font-size: clamp(1.15rem,1.5vw,1.4rem) !important; letter-spacing: -.02em; }
#page-dashboard .section-sub-text { max-width: 760px; margin: 0; color: var(--pub-muted); font-size: .91rem !important; line-height: 1.7; }
#page-dashboard .services-dashboard-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 14px; }
#page-dashboard .service-item-card {
  height: 100%; min-width: 0; padding: 20px; gap: 15px;
  border: 1px solid #e2eaf1; border-radius: 17px;
  background: linear-gradient(145deg,#fff 0%,#f8fbfe 100%);
  transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease;
}
#page-dashboard .service-item-card:hover { transform: translateY(-2px); border-color: #b8d9cb; box-shadow: 0 10px 22px rgba(16,67,57,.08); }
#page-dashboard .service-item-icon { flex: 0 0 42px; width: 42px; height: 42px; display: grid; place-items: center; padding: 0; border-radius: 13px; color: #087f70; background: #eaf5ef; border: 1px solid #d5e8dd; }
#page-dashboard .service-item-title { color: #1c3852; font-size: .96rem; line-height: 1.45; }
#page-dashboard .service-item-desc { color: var(--pub-muted); font-size: .86rem !important; line-height: 1.7; }
#page-dashboard .tutorial-scroll { gap: 14px; padding: 2px 2px 10px; }
#page-dashboard .tutorial-card {
  min-width: 230px; padding: 18px; border-radius: 17px;
  border: 1px solid #dcebe2; background: linear-gradient(160deg,#fff,#f6faf7);
  box-shadow: 0 6px 18px rgba(16,67,57,.045);
}
#page-dashboard .tutorial-tag { padding: 5px 9px; background: #eaf5ef; color: #286153; }
#page-dashboard .tutorial-card h3 { color: #1a4038; line-height: 1.45; }
#page-dashboard .tutorial-card p { color: #607872; line-height: 1.65; }
#page-dashboard .tutorial-meta { color: #087f70; border-color: #d5e8dd; }
#page-dashboard #homeNewsList { display: grid; grid-template-columns: repeat(auto-fit,minmax(220px,1fr)); gap: 14px; overflow: visible; }
#page-dashboard button:focus-visible,
#page-dashboard a:focus-visible { outline: 3px solid rgba(8,127,112,.45); outline-offset: 3px; }
@media (max-width: 900px) {
  #page-dashboard .hero-section { grid-template-columns: minmax(0,1fr); min-height: 0; gap: 22px; }
  #page-dashboard .hero-slogan-card { max-width: 620px; }
  #page-dashboard .pillars-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media (max-width: 640px) {
  #page-dashboard { gap: 14px !important; }
  #page-dashboard .hero-section {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    min-height: auto;
    padding: 18px 14px 16px;
    border-radius: 18px;
    gap: 16px;
    background-size: 145% auto;
    background-position: center 38%;
  }
  #page-dashboard .hero-content,
  #page-dashboard .hero-slogan-card {
    position: relative;
    z-index: 1;
    max-width: none;
    width: 100%;
  }
  #page-dashboard .decor-bike {
    display: none;
  }
  #page-dashboard .hero-badge {
    margin-bottom: 10px;
    font-size: .62rem;
    letter-spacing: .08em;
    padding: 6px 10px;
  }
  #page-dashboard .hero-title {
    font-size: clamp(1.72rem, 7vw, 2.25rem) !important;
    line-height: 1.08 !important;
    margin-bottom: 12px !important;
  }
  #page-dashboard .hero-desc {
    font-size: .88rem !important;
    line-height: 1.7 !important;
    margin-bottom: 18px !important;
  }
  #page-dashboard .hero-actions {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
  }
  #page-dashboard .hero-actions .btn-primary,
  #page-dashboard .hero-actions .btn-secondary {
    width: 100%;
    min-height: 46px;
    border-radius: 12px;
    justify-content: center;
  }
  #page-dashboard .hero-slogan-card {
    padding: 16px 14px;
    border-radius: 16px;
    background: rgba(255,255,255,0.78);
  }
  #page-dashboard .slogan-main {
    font-size: 1.08rem;
    line-height: 1.35;
  }
  #page-dashboard .slogan-sub {
    font-size: .8rem;
    line-height: 1.7;
  }
  #page-dashboard .pillars-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; }
  #page-dashboard .pillar-card { padding: 15px 13px; border-radius: 16px; }
  #page-dashboard .pillar-icon { width: 40px; height: 40px; border-radius: 12px; }
  #page-dashboard .pillar-title { font-size: .9rem; }
  #page-dashboard .pillar-desc { font-size: .79rem; line-height: 1.6; }
  #page-dashboard .dashboard-section { padding: 19px 15px; border-radius: 18px; }
  #page-dashboard .section-header { margin-bottom: 17px; }

  #page-dashboard .services-dashboard-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  #page-dashboard .services-dashboard-grid > * { min-width: 0; }
  #page-dashboard .service-item-card { flex-direction: column; align-items: flex-start; height: 100%; }
  #page-dashboard .service-item-title { overflow-wrap: anywhere; }
  #page-dashboard .service-item-desc { overflow-wrap: anywhere; }
  #page-dashboard .service-item-card { padding: 15px; border-radius: 15px; }
  #page-dashboard .tutorial-scroll { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; overflow: visible; }
  #page-dashboard .tutorial-card { min-width: 0; max-width: none; padding: 13px 11px; border-radius: 14px; }
  #page-dashboard .tutorial-card h3 { font-size: .88rem; }
  #page-dashboard .tutorial-card p { font-size: .78rem; }
  #page-dashboard .tutorial-meta { font-size: .7rem; }
  #page-dashboard #homeNewsList { display: grid; grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 480px) {
  #page-dashboard .hero-section {
    padding: 16px 12px 14px;
  }
  #page-dashboard .hero-badge {
    font-size: .58rem;
  }
  #page-dashboard .hero-title {
    font-size: 1.55rem !important;
  }
  #page-dashboard .slogan-main {
    font-size: 1rem;
  }
  #page-dashboard .slogan-sub {
    font-size: .76rem;
  }
  #page-dashboard .pillars-grid,
  #page-dashboard .services-dashboard-grid,
  #page-dashboard .tutorial-scroll {
    grid-template-columns: 1fr;
    gap: 9px;
  }
}
@media (max-width: 360px) {
  #page-dashboard .pillars-grid,
  #page-dashboard .services-dashboard-grid,
  #page-dashboard .tutorial-scroll { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  #page-dashboard .pillar-card,
  #page-dashboard .service-item-card,
  #page-dashboard .tutorial-card { padding: 11px 9px; }
  #page-dashboard #homeNewsList { grid-template-columns: minmax(0, 1fr); }
}
@media (prefers-reduced-motion: reduce) {
  #page-dashboard *, #page-dashboard *::before, #page-dashboard *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
}

/* ===== ORIGINAL STYLE BLOCK 7 id="public-news-polish" ===== */
#page-dashboard #homeNewsList .news-card,
#page-info #publicNewsList .news-card {
  display: flex;
  flex-direction: column;
  gap: 12px;
  min-width: 0;
  height: 100%;
  padding: 18px;
  border: 1px solid #e0eaf2;
  border-radius: 17px;
  background: linear-gradient(160deg, #fff, #f7fbfe);
  box-shadow: 0 6px 18px rgba(24, 50, 75, .045);
  transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}

#page-dashboard #homeNewsList .news-card:hover,
#page-info #publicNewsList .news-card:hover {
  transform: translateY(-2px);
  border-color: #c9dce9;
  box-shadow: 0 12px 24px rgba(24, 50, 75, .08);
}

.news-card .news-card-image {
  display: block;
  width: 100%;
  height: 165px;
  object-fit: cover;
  border-radius: 12px;
  background: #eef4f8;
}

.news-card .tutorial-tag {
  align-self: flex-start;
  font-size: .75rem;
  font-weight: 700;
  letter-spacing: .02em;
}

.news-card h3 {
  margin: 0;
  color: #1b3852;
  font-family: inherit;
  font-size: 1rem;
  font-weight: 750;
  line-height: 1.5;
  overflow-wrap: anywhere;
}

.news-card p {
  margin: 0;
  color: #65788b;
  font-family: inherit;
  font-size: .9rem;
  line-height: 1.7;
  overflow-wrap: anywhere;
}

.news-card .news-read-more {
  width: 100%;
  margin-top: auto;
  min-height: 44px;
  font-family: inherit;
  font-size: .9rem;
  font-weight: 700;
  border-radius: 12px;
}

#page-dashboard #homeNewsList {
  align-items: stretch;
}

#page-info #publicNewsList {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
  overflow: visible;
}

#publicNewsModal {
  position: fixed;
  inset: 0;
  z-index: 10050;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 22px;
  background: rgba(10, 20, 37, .66);
  backdrop-filter: blur(7px);
  -webkit-backdrop-filter: blur(7px);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity .2s ease, visibility .2s ease;
}

#publicNewsModal.is-open {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}

#publicNewsModal .public-news-dialog {
  position: relative;
  display: flex;
  align-items: stretch;
  width: fit-content;
  max-width: min(92vw, 1200px);
  max-height: min(84vh, 820px);
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, .55);
  border-radius: 22px;
  background: #fff;
  box-shadow: 0 24px 80px rgba(0, 0, 0, .25);
  transform: translateY(10px) scale(.985);
  transition: transform .2s ease;
}

#publicNewsModal.is-open .public-news-dialog {
  transform: translateY(0) scale(1);
}

#publicNewsModal .public-news-visual {
  position: relative;
  flex: 0 0 auto;
  width: min(62vw, 760px);
  max-height: min(84vh, 820px);
  display: flex;
  align-items: stretch;
  justify-content: center;
  overflow: hidden;
  background: #edf3f7;
}

#publicNewsModal .public-news-visual img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  background: #edf3f7;
}

#publicNewsModal .public-news-content {
  display: flex;
  flex-direction: column;
  flex: 0 1 420px;
  max-width: 420px;
  min-width: 280px;
  max-height: min(84vh, 820px);
  overflow: hidden;
  padding: 30px;
}

#publicNewsModal .public-news-close {
  position: absolute;
  top: 12px;
  right: 12px;
  z-index: 2;
  width: 40px;
  height: 40px;
  border: 1px solid #dce5ed;
  border-radius: 50%;
  background: rgba(255, 255, 255, .96);
  color: #18324b;
  font-size: 24px;
  line-height: 1;
  cursor: pointer;
  box-shadow: 0 4px 14px rgba(0, 0, 0, .1);
}

#publicNewsModal .public-news-category {
  display: inline-flex;
  padding: 6px 10px;
  border-radius: 999px;
  background: #eaf5ef;
  color: #286153;
  font-size: .75rem;
  font-weight: 750;
}

#publicNewsModal .public-news-title {
  margin: 14px 0 12px;
  color: #142b43;
  font-family: inherit;
  font-size: clamp(1.25rem, 2.2vw, 1.8rem);
  font-weight: 800;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

#publicNewsModal .public-news-body {
  flex: 1 1 auto;
  min-height: 0;
  margin: 3px 0 0;
  color: #607872;
  font-size: .98rem;
  line-height: 1.85;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  overflow-y: auto;
  padding-right: 10px;
  scrollbar-width: thin;
}

@media (max-width: 700px) {
  #page-info #publicNewsList {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
  }

  #page-dashboard #homeNewsList .news-card,
  #page-info #publicNewsList .news-card {
    padding: 13px;
    border-radius: 14px;
  }

  .news-card .news-card-image {
    height: 115px;
  }

  .news-card h3 {
    font-size: .9rem;
  }

  .news-card p {
    font-size: .8rem;
  }

  .news-card .news-read-more {
    padding: 10px 8px;
    font-size: .8rem;
  }

  #publicNewsModal {
    padding: 12px;
  }

  #publicNewsModal .public-news-dialog {
    display: flex;
    flex-direction: column;
    width: min(94vw, 760px);
    max-height: 90vh;
    border-radius: 18px;
  }

  #publicNewsModal .public-news-visual {
    width: 100%;
    min-height: 210px;
    max-height: 320px;
  }

  #publicNewsModal .public-news-visual img {
    width: 100%;
    height: 100%;
    max-height: 320px;
  }

  #publicNewsModal .public-news-content {
    max-width: none;
    min-width: 0;
    padding: 20px;
  }

  #publicNewsModal .public-news-title {
    font-size: 1.25rem;
  }
}

@media (max-width: 360px) {
  #page-info #publicNewsList {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
  }

  .news-card .news-card-image {
    height: 95px;
  }

  .news-card h3 {
    font-size: .82rem;
  }

  .news-card p {
    font-size: .75rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  #publicNewsModal,
  #publicNewsModal .public-news-dialog,
  #page-info #publicNewsList .news-card,
  #page-dashboard #homeNewsList .news-card {
    transition: none;
  }
}


#page-dashboard #homeNewsList {
  display: block;
  min-width: 0;
  overflow: visible;
}

#homeNewsList .home-news-carousel {
  position: relative;
  min-width: 0;
}

#homeNewsList .home-news-viewport {
  width: 100%;
  overflow: hidden;
  padding: 3px 2px 12px;
}

#homeNewsList .home-news-track {
  display: flex;
  align-items: stretch;
  gap: 18px;
  will-change: transform;
  transition: transform .65s cubic-bezier(.22, .75, .25, 1);
}

#homeNewsList .home-news-slide {
  flex: 0 0 calc((100% - 36px)/3);
  min-width: 0;
  display: flex;
}

#homeNewsList .home-news-card {
  display: flex;
  flex-direction: column;
  width: 100%;
  min-width: 0;
  overflow: hidden;
  border: 1px solid #e0eaf2;
  border-radius: 18px;
  background: linear-gradient(160deg, #fff, #f7fbfe);
  box-shadow: 0 7px 22px rgba(24, 50, 75, .055);
  transition: box-shadow .22s ease, border-color .22s ease, transform .22s ease;
}

#homeNewsList .home-news-card:hover {
  transform: translateY(-3px);
  border-color: #c9dce9;
  box-shadow: 0 14px 28px rgba(24, 50, 75, .1);
}

#homeNewsList .home-news-image-wrap {
  position: relative;
  height: 190px;
  overflow: hidden;
  background: #eaf1f6;
}

#homeNewsList .home-news-image {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .6s ease;
}

#homeNewsList .home-news-card:hover .home-news-image {
  transform: scale(1.035);
}

#homeNewsList .home-news-image-placeholder {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 6px;
  color: #087f70;
  background: linear-gradient(135deg, #eaf5ef, #f8fbf9);
  font-weight: 800;
  letter-spacing: .08em;
}

#homeNewsList .home-news-image-placeholder small {
  color: #65788b;
  font-weight: 500;
  letter-spacing: 0;
}

#homeNewsList .home-news-category {
  position: absolute;
  left: 14px;
  bottom: 13px;
  max-width: calc(100% - 28px);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  padding: 6px 10px;
  border: 1px solid rgba(255, 255, 255, .75);
  border-radius: 999px;
  color: #286153;
  background: rgba(255, 255, 255, .92);
  backdrop-filter: blur(8px);
  font-size: .72rem;
  font-weight: 800;
}

#homeNewsList .home-news-content {
  display: flex;
  flex: 1;
  flex-direction: column;
  align-items: flex-start;
  gap: 10px;
  min-width: 0;
  padding: 18px;
}

#homeNewsList .home-news-date {
  color: #8291a0;
  font-size: .78rem;
  line-height: 1.4;
}

#homeNewsList .home-news-content h3 {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  margin: 0;
  color: #1b3852;
  font-family: inherit;
  font-size: 1rem;
  font-weight: 750;
  line-height: 1.5;
  overflow-wrap: anywhere;
}

#homeNewsList .home-news-content p {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  margin: 0 0 4px;
  color: #65788b;
  font-size: .88rem;
  line-height: 1.7;
  overflow-wrap: anywhere;
}

#homeNewsList .home-news-content .news-read-more {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  width: 100%;
  margin-top: auto;
  min-height: 44px;
  padding: 11px 14px;
  border-radius: 12px;
  font-family: inherit;
  font-size: .88rem;
  font-weight: 700;
}

/* The news carousel has its own light palette.  Override every surface and
   text color explicitly so it stays readable in the active dark theme. */
html[data-leressae-theme="dark"] #homeNewsList .home-news-card {
  background: linear-gradient(160deg, #172c25, #111f1b);
  border-color: #355447;
  box-shadow: 0 8px 24px rgba(0, 0, 0, .28);
}
html[data-leressae-theme="dark"] #homeNewsList .home-news-card:hover {
  border-color: #5e977e;
  box-shadow: 0 14px 30px rgba(0, 0, 0, .36);
}
html[data-leressae-theme="dark"] #homeNewsList .home-news-image-wrap { background: #1a3028; }
html[data-leressae-theme="dark"] #homeNewsList .home-news-image-placeholder,
html[data-leressae-theme="dark"] #homeNewsList .home-news-image-wrap.image-unavailable::before {
  color: #c9f2df;
  background: linear-gradient(135deg, #19382d, #11221d);
}
html[data-leressae-theme="dark"] #homeNewsList .home-news-image-placeholder small,
html[data-leressae-theme="dark"] #homeNewsList .home-news-date,
html[data-leressae-theme="dark"] #homeNewsList .home-news-counter { color: #b8c5d6; }
html[data-leressae-theme="dark"] #homeNewsList .home-news-category {
  color: #d9eee5;
  background: rgba(15, 23, 42, .9);
  border-color: rgba(141, 219, 185, .34);
}
html[data-leressae-theme="dark"] #homeNewsList .home-news-content h3 { color: #f8fafc; }
html[data-leressae-theme="dark"] #homeNewsList .home-news-content p { color: #d6e2f0; }
html[data-leressae-theme="dark"] #homeNewsList .home-news-arrow {
  color: #d8eee1;
  background: #172c25;
  border-color: #355447;
}
html[data-leressae-theme="dark"] #homeNewsList .home-news-arrow:hover:not(:disabled) {
  color: #ffffff;
  background: #1b493a;
}

#homeNewsList .home-news-controls {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 2px 3px 0;
}

#homeNewsList .home-news-dots {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 7px;
}

#homeNewsList .home-news-dot {
  width: 8px;
  height: 8px;
  padding: 0;
  border: 0;
  border-radius: 99px;
  background: #cbd8e3;
  cursor: pointer;
  transition: width .2s ease, background .2s ease;
}

#homeNewsList .home-news-dot.is-active {
  width: 24px;
  background: #087f70;
}

#homeNewsList .home-news-arrows {
  display: flex;
  gap: 8px;
}

#homeNewsList .home-news-arrow {
  display: grid;
  place-items: center;
  width: 38px;
  height: 38px;
  border: 1px solid #d5e5dc;
  border-radius: 50%;
  background: #fff;
  color: #286153;
  font-size: 25px;
  line-height: 1;
  cursor: pointer;
  transition: background .2s ease, transform .2s ease;
}

#homeNewsList .home-news-arrow:hover:not(:disabled) {
  background: #eaf5ef;
  transform: translateY(-2px);
  box-shadow: 0 7px 16px rgba(16, 67, 57, .12);
}

#homeNewsList .home-news-arrow:focus-visible,
#homeNewsList .home-news-dot:focus-visible {
  outline: 3px solid rgba(8, 127, 112, .42);
  outline-offset: 3px;
}

#homeNewsList .home-news-arrow:active:not(:disabled) {
  transform: scale(.94);
}

#homeNewsList .home-news-arrow:disabled {
  opacity: .35;
  cursor: default;
}

#homeNewsList .home-news-counter {
  position: absolute;
  right: 0;
  bottom: 46px;
  color: #8291a0;
  font-size: .72rem;
}

@media (max-width: 980px) {
  #homeNewsList .home-news-slide {
    flex-basis: calc((100% - 18px)/2);
  }

  #homeNewsList .home-news-image-wrap {
    height: 170px;
  }
}

@media (max-width: 640px) {
  #homeNewsList .home-news-track {
    gap: 10px;
  }

  #homeNewsList .home-news-slide {
    flex-basis: calc((100% - 10px)/2);
  }

  #homeNewsList .home-news-image-wrap {
    height: 118px;
  }

  #homeNewsList .home-news-content {
    gap: 8px;
    padding: 12px;
  }

  #homeNewsList .home-news-content h3 {
    font-size: .88rem;
    line-height: 1.4;
    -webkit-line-clamp: 3;
  }

  #homeNewsList .home-news-content p {
    font-size: .78rem;
    line-height: 1.55;
    -webkit-line-clamp: 3;
  }

  #homeNewsList .home-news-content .news-read-more {
    min-height: 40px;
    padding: 9px 10px;
    font-size: .78rem;
  }

  #homeNewsList .home-news-controls {
    gap: 8px;
  }

  #homeNewsList .home-news-arrow {
    width: 35px;
    height: 35px;
  }

  #homeNewsList .home-news-counter {
    position: static;
    margin-top: 5px;
    text-align: right;
  }
}

@media (prefers-reduced-motion: reduce) {
  #homeNewsList .home-news-track,
  #homeNewsList .home-news-image,
  #homeNewsList .home-news-card,
  #homeNewsList .home-news-dot {
    transition: none !important;
  }
}

/* ===== ORIGINAL STYLE BLOCK 8 id="leressae-dashboard-media-slideshow" ===== */
.home-media-spotlight{position:relative;overflow:hidden;margin:0 0 28px;padding:clamp(16px,2.2vw,28px);border:1px solid rgba(219,230,241,.9);border-radius:26px;background:linear-gradient(135deg,rgba(255,255,255,.96),rgba(245,249,253,.92));box-shadow:0 18px 45px rgba(15,35,65,.07)}
.home-media-spotlight .media-spotlight-head{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:18px}
.home-media-spotlight .media-spotlight-kicker{display:none}
.home-media-spotlight .media-spotlight-title{margin:0;color:#102746;font-size:clamp(1.25rem,2vw,1.8rem);font-weight:800;letter-spacing:-.025em}
.home-media-spotlight .media-spotlight-subtitle{margin:7px 0 0;color:#64748b;font-size:.95rem;line-height:1.6}
.home-media-stage{position:relative;overflow:hidden;border-radius:22px;background:linear-gradient(135deg,#e8eff6,#dce6f0);isolation:isolate}
.home-media-track{display:flex;align-items:stretch;gap:16px;user-select:none;-webkit-user-select:none;transform:translateX(0);transition:transform .8s cubic-bezier(.22,.75,.25,1);will-change:transform}
.home-media-slide{position:relative;flex:0 0 calc((100% - 32px)/3);min-width:0;overflow:hidden;aspect-ratio:4/3;border-radius:18px;background:#dce6f0;opacity:1;transform:scale(1);transition:transform .55s ease,box-shadow .55s ease;pointer-events:auto}
.home-media-slide:hover{transform:translateY(-3px);box-shadow:0 14px 28px rgba(15,35,65,.16)}
.home-media-slide img{display:block;width:100%;height:100%;min-height:0;object-fit:cover;object-position:center;transition:transform 5s ease}
.home-media-slide:hover img{transform:scale(1.035)}
.home-media-slide::after{content:"";position:absolute;inset:18% 0 0;background:linear-gradient(180deg,transparent 0%,rgba(2,6,23,.18) 30%,rgba(2,6,23,.78) 100%);pointer-events:none}
.home-media-caption{position:absolute;z-index:2;left:18px;right:18px;bottom:18px;color:#fff;max-width:100%;text-shadow:0 2px 12px rgba(0,0,0,.55)}
.home-media-caption .eyebrow{display:inline-flex;padding:5px 9px;border:1px solid rgba(255,255,255,.32);border-radius:999px;background:rgba(15,23,42,.24);backdrop-filter:blur(10px);font-size:.68rem;font-weight:750;letter-spacing:.03em;color:#f8fafc}
.home-media-caption h3{margin:10px 0 5px;font-size:clamp(1rem,1.35vw,1.25rem);line-height:1.25;font-weight:800;color:#ffffff;text-shadow:0 2px 14px rgba(0,0,0,.72)}
.home-media-caption p{margin:0;color:#e2e8f0;font-size:.86rem;line-height:1.5;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;text-shadow:0 2px 10px rgba(0,0,0,.5)}
.home-media-tools{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-top:16px}
.home-media-dots{display:flex;align-items:center;gap:7px;flex-wrap:wrap}
.home-media-dot{width:8px;height:8px;padding:0;border:0;border-radius:99px;background:#cbd5e1;cursor:pointer;transition:width .28s ease,background .28s ease,transform .28s ease}
.home-media-dot.is-active{width:26px;background:#087f70}
.home-media-actions{display:flex;align-items:center;gap:9px}
.home-media-count{color:#64748b;font-size:.84rem;font-variant-numeric:tabular-nums;margin-right:4px}
.home-media-arrow{display:grid;place-items:center;width:42px;height:42px;border:1px solid #dbe4ef;border-radius:50%;background:rgba(255,255,255,.92);color:#102746;font-size:1.4rem;line-height:1;cursor:pointer;box-shadow:0 5px 16px rgba(15,35,65,.07);transition:transform .22s ease,background .22s ease,color .22s ease,border-color .22s ease}
.home-media-arrow:hover{transform:translateY(-2px);background:#087f70;border-color:#087f70;color:#fff}
.home-media-arrow:active{transform:scale(.95)}
.home-media-arrow:focus-visible,.home-media-dot:focus-visible{outline:3px solid rgba(8,127,112,.42);outline-offset:3px}
.home-media-empty{display:grid;place-items:center;min-height:220px;padding:28px;text-align:center;color:#64748b;border:1px dashed #cbd5e1;border-radius:18px;background:#f8fafc}
@media(max-width:900px){.home-media-slide{flex-basis:calc((100% - 16px)/2)}}
@media(max-width:600px){.home-media-spotlight{padding:14px;margin-bottom:20px;border-radius:20px}.home-media-spotlight .media-spotlight-head{align-items:flex-start;margin-bottom:13px}.home-media-spotlight .media-spotlight-subtitle{font-size:.85rem}.home-media-stage{border-radius:16px}.home-media-track{gap:12px}.home-media-slide{flex-basis:100%;aspect-ratio:4/3;border-radius:14px}.home-media-caption{left:15px;right:15px;bottom:15px}.home-media-caption h3{font-size:1.08rem;margin-top:8px}.home-media-caption p{font-size:.8rem}.home-media-tools{margin-top:12px}.home-media-arrow{width:38px;height:38px}.home-media-count{font-size:.76rem}}
@media(prefers-reduced-motion:reduce){.home-media-track,.home-media-slide,.home-media-slide img,.home-media-dot,.home-media-arrow{transition:none!important}}

/* ===== ORIGINAL STYLE BLOCK 9 ===== */
.news-image-unavailable{padding:18px;text-align:center;color:#64748b;background:#eef4f8;border-radius:10px;font-size:.9rem}
#homeNewsList .home-news-image-wrap.image-unavailable::before{content:'Gambar berita tidak dapat dimuat';position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding:18px;text-align:center;color:#64748b;background:linear-gradient(135deg,#e9f3fa,#f9fbfd);font-size:.9rem}

/* ===== ORIGINAL STYLE BLOCK 10 id="allcode2-admin-tech-features" ===== */
.tech-customer-media-overlay{position:fixed;inset:0;z-index:2147483000;background:rgba(10,18,35,.72);display:none;align-items:center;justify-content:center;padding:18px}
      .tech-customer-media-overlay.open{display:flex}
      .tech-customer-media-dialog{width:min(960px,100%);max-height:90vh;overflow:auto;background:#fff;border-radius:16px;padding:18px;box-shadow:0 24px 70px rgba(0,0,0,.3)}
      .tech-customer-media-dialog>header{display:flex;align-items:center;justify-content:space-between;gap:16px;border-bottom:1px solid #e5e7eb;padding-bottom:12px;margin-bottom:16px}
      .tech-customer-media-dialog h3{margin:0}.tech-customer-media-dialog [data-tech-media-close]{border:0;background:#f1f5f9;border-radius:9px;width:38px;height:38px;font-size:24px;cursor:pointer}
      .tech-customer-media-content{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:16px}
      .tech-customer-media-item{min-width:0;border:1px solid #e5e7eb;border-radius:12px;padding:10px;background:#f8fafc}
      .tech-customer-media-item>div{min-height:180px;display:flex;align-items:center;justify-content:center;background:#f8fafc;border:1px solid #e5e7eb;border-radius:10px;overflow:hidden;padding:10px;box-sizing:border-box}
      .tech-customer-media-item img,.tech-customer-media-item video,.tech-customer-media-item iframe{display:block;max-width:100%;max-height:min(60vh,620px);border:0;border-radius:8px;background:#fff}
      .tech-customer-media-item img{width:auto;height:auto;object-fit:contain;max-width:100%}
      .tech-customer-media-item video{width:100%;height:auto;object-fit:contain;max-height:min(60vh,620px)}
      .tech-customer-media-item iframe{width:100%;min-height:320px;height:min(60vh,520px);aspect-ratio:16/10}
      .tech-customer-media-item small{display:block;margin-top:8px;overflow-wrap:anywhere}
      @media(max-width:600px){.tech-customer-media-overlay{padding:8px}.tech-customer-media-dialog{max-height:94vh;padding:12px}.tech-customer-media-item>div{min-height:160px;padding:8px}.tech-customer-media-item iframe{min-height:260px;height:42vh}}
      .admin-dashboard-panels{width:100%;max-width:100%;min-width:0;grid-template-columns:minmax(0,1fr);box-sizing:border-box}
      .admin-dashboard-panels>.admin-card{width:100%;max-width:100%;min-width:0;box-sizing:border-box}
      .admin-dashboard-panels .chart-grid,.admin-dashboard-panels .chart-box{max-width:100%;min-width:0;box-sizing:border-box}
      .admin-activity-card{overflow:hidden}
      .admin-activity-table-wrap{display:block;width:100%;max-width:100%;min-width:0;overflow-x:auto;overflow-y:hidden;box-sizing:border-box;-webkit-overflow-scrolling:touch;overscroll-behavior-inline:contain}
      .admin-activity-table-wrap .admin-activity-table{width:max-content!important;min-width:100%!important;max-width:none!important;table-layout:auto!important}
      .admin-table-wrap .admin-activity-table th{white-space:nowrap}
      .admin-activity-table .admin-activity-address{width:240px;min-width:180px;max-width:240px;white-space:normal;overflow-wrap:anywhere;word-break:normal}
      .admin-table-wrap .admin-running-services-table th{white-space:nowrap!important}
      .admin-table-wrap .admin-completed-services-table th{white-space:nowrap!important}
      .admin-tech-management-wrap{width:100%;max-width:100%;min-width:0;overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch}
      .admin-table-wrap .admin-tech-management-table{width:100%;min-width:1000px;table-layout:auto}
      .admin-table-wrap .admin-tech-management-table th,.admin-table-wrap .admin-tech-management-table td{white-space:nowrap;text-align:center;vertical-align:middle}
      .admin-tech-actions{display:flex;flex-flow:column nowrap;align-items:center;gap:6px;width:140px;min-width:140px;margin-inline:auto}
      .admin-tech-actions>button{flex:0 0 auto;width:100%;box-sizing:border-box;white-space:nowrap}
      .admin-completed-summary-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 14px;
        width: 100%;
        max-width: 900px;
        margin-inline: auto;
      }
      .admin-completed-summary-grid > .admin-stat-mini {
        box-sizing: border-box;
        min-width: 0;
        min-height: 126px;
        padding: 20px 22px;
        border-radius: 16px;
        display: flex;
        flex-direction: column;
        justify-content: center;
        gap: 8px;
      }
      .admin-completed-summary-grid > .admin-stat-mini .label {
        font-size: .76rem;
        letter-spacing: .075em;
        line-height: 1.35;
      }
      .admin-completed-summary-grid > .admin-stat-mini .value {
        margin-top: 0;
        line-height: 1.12;
      }
      .admin-completed-summary-total {
        background: linear-gradient(145deg, #f8fbff 0%, #eef5ff 100%);
        border-color: #d9e6f5;
      }
      .admin-completed-summary-total .value {
        font-size: clamp(2rem, 3vw, 2.5rem);
        color: #13233d;
      }
      .admin-completed-summary-status {
        background: linear-gradient(145deg, #fbfefc 0%, #f1faf4 100%);
        border-color: #d8ebdd;
      }
      .admin-completed-summary-status .value {
        display: inline-flex;
        align-items: center;
        align-self: flex-start;
        padding: 7px 13px;
        border: 1px solid #c8e8d0;
        border-radius: 999px;
        background: #eaf7ed;
        color: #287443;
        font-size: 1.15rem;
        font-weight: 750;
      }
      @media(max-width:560px){.admin-completed-summary-grid{grid-template-columns:minmax(0,1fr);gap:10px}.admin-completed-summary-grid>.admin-stat-mini{min-height:98px;padding:16px 18px}}
      .admin-customers-card{min-width:0;max-width:100%}.admin-customers-card .admin-card-header{align-items:center;gap:16px}.admin-customers-card .admin-card-header h3{margin:0}.admin-customers-card .admin-card-header .section-sub-text{margin:5px 0 0;color:#64748b}.admin-customers-table-wrap{max-width:100%;overflow-x:auto;overscroll-behavior-inline:contain}.admin-customers-table{min-width:900px}.admin-customers-table th,.admin-customers-table td{vertical-align:middle}.admin-customers-table td:first-child{min-width:150px}.admin-customer-profile-modal{position:fixed;inset:0;z-index:10070;display:none;align-items:center;justify-content:center;padding:20px;box-sizing:border-box;background:rgba(10,22,38,.62);backdrop-filter:blur(3px)}.admin-customer-profile-modal.open{display:flex}.admin-customer-profile-dialog{width:min(980px,100%);max-height:min(90vh,900px);overflow:auto;border:1px solid #dce5ef;border-radius:18px;background:#fff;box-shadow:0 24px 80px rgba(0,0,0,.25)}.admin-customer-profile-dialog>header{position:sticky;top:0;z-index:1;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:20px 24px;border-bottom:1px solid #e2eaf2;background:rgba(255,255,255,.96);backdrop-filter:blur(8px)}.admin-customer-profile-dialog h2{margin:0;color:#14243a;font-size:1.35rem}.admin-customer-profile-subtitle{margin:5px 0 0;color:#65758a}.admin-customer-profile-close{flex:0 0 auto;width:40px;height:40px;border:1px solid #d7e1eb;border-radius:50%;background:#f7f9fc;color:#24364b;font-size:25px;cursor:pointer}.admin-customer-profile-body{display:grid;gap:12px;padding:20px 24px 24px}.admin-customer-history-card{padding:16px;border:1px solid #e0e8f0;border-radius:14px;background:#fff}.admin-customer-history-heading{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:14px}.admin-customer-history-heading>div{display:grid;gap:4px;min-width:0}.admin-customer-history-heading>div strong{overflow-wrap:anywhere;color:#087f70}.admin-customer-history-heading>div span{color:#718198;font-size:.9rem}.admin-customer-history-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px 18px}.admin-customer-history-grid>div{display:grid;align-content:start;gap:4px;min-width:0}.admin-customer-history-grid small{color:#718198;font-size:.78rem}.admin-customer-history-grid strong{color:#26384d;font-size:.92rem;font-weight:600;overflow-wrap:anywhere}.admin-customer-history-grid>div:last-child>span{display:flex;flex-wrap:wrap;align-items:center;gap:8px}.admin-customer-map-link{font-weight:700;color:#087f70;text-decoration:none}.admin-customer-map-link:hover{text-decoration:underline}.admin-customer-muted{color:#8995a5;font-size:.83rem}
      .admin-report-page{min-width:0;max-width:100%;overflow:hidden}.admin-report-header{align-items:center;gap:16px}.admin-report-header h3{margin:0}.admin-report-header .section-sub-text{margin:5px 0 0;color:#64748b}.admin-report-filters{display:grid;grid-template-columns:repeat(4,minmax(140px,1fr));gap:12px;margin:18px 0}.admin-report-filter{display:grid;gap:6px;min-width:0;color:#52647a;font-size:.83rem;font-weight:700}.admin-report-filter select,.admin-report-filter input{width:100%;min-width:0;min-height:44px;padding:9px 12px;border:1px solid #d2deea;border-radius:10px;background:#fff;color:#1e293b;font:inherit;font-size:.95rem;box-sizing:border-box}.admin-report-search{grid-column:span 2}.admin-report-summary-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(165px,1fr));gap:12px;margin:8px 0 18px}.admin-report-summary-grid>.admin-stat-mini{min-width:0;min-height:112px;padding:16px;border:1px solid #dce6f0;border-radius:14px;background:linear-gradient(145deg,#f9fbfe,#eff5fb);box-sizing:border-box}.admin-report-summary-grid .label{display:block;line-height:1.35}.admin-report-summary-grid .value{display:block;margin-top:9px;line-height:1.15;overflow-wrap:anywhere}.admin-report-cost-card .value{font-size:clamp(1.15rem,2vw,1.65rem);white-space:nowrap}.admin-report-error{margin-bottom:12px}.admin-report-charts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin:8px 0 20px}.admin-report-chart-card{min-width:0;padding:17px;border:1px solid #dce6f0;border-radius:15px;background:#f8fafc;box-sizing:border-box}.admin-report-volume-card{min-height:300px}.admin-report-chart-heading{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-bottom:14px}.admin-report-chart-heading h4,.admin-report-details-heading h4{margin:0;color:#1b2c43;font-size:1.05rem}.admin-report-chart-heading span,.admin-report-details-heading span{color:#75859a;font-size:.82rem}.admin-report-volume-scroll{width:100%;overflow-x:auto;overflow-y:hidden;overscroll-behavior-inline:contain}.admin-report-volume-chart{display:flex;align-items:stretch;gap:9px;min-width:max-content;height:220px;padding:5px 2px 0}.admin-report-volume-item{display:flex;flex:0 0 42px;flex-direction:column;align-items:center;justify-content:flex-end;gap:6px;color:#5b6d83;font-size:.75rem}.admin-report-volume-item strong{color:#34465d;font-size:.78rem}.admin-report-volume-bar{display:flex;align-items:flex-end;justify-content:center;width:22px;height:155px;border-radius:8px 8px 3px 3px;background:#e3ebf4;overflow:hidden}.admin-report-volume-bar i{display:block;width:100%;min-height:2px;border-radius:8px 8px 2px 2px;background:linear-gradient(180deg,#49a98a,#087f70);box-shadow:0 3px 8px rgba(8,123,181,.16)}.admin-report-volume-item>span{max-width:56px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.admin-report-meter-list{display:grid;gap:15px;padding:5px 0}.admin-report-meter-row{display:grid;grid-template-columns:minmax(90px,1fr) minmax(90px,2fr) 28px;align-items:center;gap:10px;color:#52647a;font-size:.86rem}.admin-report-meter-row>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.admin-report-meter-row>strong{text-align:right;color:#24364b}.admin-report-meter{height:11px;border-radius:99px;background:#e1e9f1;overflow:hidden}.admin-report-meter i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#087f70,#49a98a)}.admin-report-empty-chart{display:grid;min-height:150px;place-items:center;color:#75859a;text-align:center}.admin-report-details{min-width:0}.admin-report-details-heading{display:flex;align-items:center;justify-content:space-between;margin:8px 0 12px}.admin-report-details-heading>div{display:flex;align-items:baseline;gap:12px}.admin-report-table-wrap{max-width:100%;overflow-x:auto;overscroll-behavior-inline:contain}.admin-report-table{min-width:900px}.admin-report-table th,.admin-report-table td{vertical-align:middle;white-space:nowrap}.admin-report-table td:nth-child(3){white-space:normal;min-width:150px}.admin-report-table td.id-cell{max-width:190px;white-space:normal;overflow-wrap:anywhere}
      .admin-report-volume-card{border-top:3px solid #087f70}.admin-report-status-card{border-top:3px solid #31a66f}.admin-report-technician-card{border-top:3px solid #408c6c}.admin-report-item-card{border-top:3px solid #c28b2c}.admin-report-status-card .admin-report-meter i.is-done{background:linear-gradient(90deg,#23a366,#57c58a)}.admin-report-status-card .admin-report-meter i.is-progress{background:linear-gradient(90deg,#d99a25,#f0c15e)}.admin-report-status-card .admin-report-meter i.is-new{background:linear-gradient(90deg,#408c6c,#65b98c)}.admin-report-status-card .admin-report-meter i.is-other{background:linear-gradient(90deg,#64748b,#94a3b8)}.admin-report-tech-meter i{background:linear-gradient(90deg,#408c6c,#65b98c)}.admin-report-item-meter i{background:linear-gradient(90deg,#c28b2c,#e6bd63)}
      .admin-report-export-button{display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;min-height:44px;padding:11px 20px;border-radius:10px;font-weight:700;white-space:nowrap;box-shadow:0 5px 12px rgba(8,127,112,.16)}
      .admin-report-export-button:focus-visible{outline:3px solid rgba(8,127,112,.28);outline-offset:3px}
      @media(max-width:560px){.admin-report-header{align-items:stretch;flex-direction:column}.admin-report-export-button{width:100%}}
      .tech-dashboard-page {
        display: grid;
        gap: 16px;
        width: 100%;
        max-width: 100%;
        min-width: 0;
        overflow: hidden;
      }
      .tech-dashboard-page .tech-welcome {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 20px;
        min-height: 112px;
        margin: 0;
        padding: 20px 24px;
        border-color: #dce6f0;
        border-radius: 16px;
        background: linear-gradient(115deg, #fff 0%, #f8fbfe 100%);
        box-shadow: 0 6px 20px rgba(15, 42, 72, .05);
      }
      .tech-dashboard-page .tech-welcome-main {
        display: flex;
        align-items: center;
        gap: 22px;
        min-width: 0;
      }
      .tech-dashboard-page .tech-welcome-avatar {
        display: grid;
        place-items: center;
        flex: 0 0 68px;
        width: 68px;
        height: 68px;
        border-radius: 17px;
        background: linear-gradient(135deg, #44ad7e, #087f70);
        color: #fff;
        font-size: 30px;
        font-weight: 800;
        box-shadow: 0 7px 16px rgba(8, 127, 112, .18);
      }
      .tech-dashboard-page .tech-welcome-divider {
        align-self: stretch;
        width: 1px;
        max-height: 68px;
        background: #d8e2ed;
      }
      .tech-dashboard-page .tech-welcome-copy {
        min-width: 0;
      }
      .tech-dashboard-page .tech-welcome h3 {
        margin: 5px 0 3px;
        font-size: 24px;
        line-height: 1.2;
      }
      .tech-dashboard-page .tech-welcome p {
        font-size: 14px;
        line-height: 1.5;
      }
      .tech-dashboard-page .tech-eyebrow {
        color: #718198;
        font-size: 11px;
        letter-spacing: .1em;
      }
      .tech-dashboard-page .tech-welcome > .tech-status-badge {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        flex: 0 0 auto;
        padding: 9px 15px;
        border-radius: 999px;
        background: #dcf8e8;
        color: #16814a;
        font-size: 12px;
        font-weight: 800;
      }
      .tech-dashboard-page .tech-welcome > .tech-status-badge i {
        width: 9px;
        height: 9px;
        border-radius: 50%;
        background: #22a86a;
      }
      .tech-dashboard-page .tech-welcome > .tech-status-badge.low {
        background: #fff1d7;
        color: #986000;
      }
      .tech-dashboard-page .tech-welcome > .tech-status-badge.low i {
        background: #d99415;
      }
      .tech-dashboard-page .tech-stat-grid {
        gap: 14px;
        margin: 0;
      }
      .tech-dashboard-page .tech-stat {
        display: grid;
        grid-template-columns: 60px minmax(0, 1fr);
        align-items: center;
        gap: 16px;
        min-width: 0;
        min-height: 106px;
        padding: 17px 19px;
        border-color: #dce6f0;
        border-radius: 15px;
        background: #fff;
        box-shadow: 0 5px 16px rgba(15, 42, 72, .045);
      }
      .tech-dashboard-page .tech-stat-content {
        display: grid;
        gap: 7px;
        min-width: 0;
      }
      .tech-dashboard-page .tech-stat .label {
        color: #64758a;
        font-size: 11px;
        font-weight: 800;
        letter-spacing: .045em;
        line-height: 1.35;
        text-transform: uppercase;
      }
      .tech-dashboard-page .tech-stat .value {
        margin: 0;
        font-size: 31px;
        line-height: 1.05;
      }
      .tech-dashboard-page .tech-stat-icon {
        display: grid;
        place-items: center;
        flex: 0 0 60px;
        width: 60px;
        height: 60px;
        border-radius: 15px;
        background: #e9f5f0;
        color: #087f70;
      }
      .tech-dashboard-page .tech-stat-icon svg,
      .tech-dashboard-page .tech-status-icon svg {
        width: 25px;
        height: 25px;
        fill: none;
        stroke: currentColor;
        stroke-width: 2;
        stroke-linecap: round;
        stroke-linejoin: round;
      }
      .tech-dashboard-page .tech-stat.is-active .tech-stat-icon {
        background: #e9f5f0;
        color: #087f70;
      }
      .tech-dashboard-page .tech-stat.is-progress .tech-stat-icon {
        background: #fff4df;
        color: #d28a12;
      }
      .tech-dashboard-page .tech-stat.is-done .tech-stat-icon {
        background: #e4f8ed;
        color: #20a365;
      }
      .tech-dashboard-page .tech-dashboard-grid {
        grid-template-columns: minmax(0, 1.18fr) minmax(0, .95fr);
        gap: 14px;
        margin: 0;
      }
      .tech-dashboard-page .tech-section {
        min-width: 0;
        margin: 0;
        padding: 19px 20px;
        border-color: #dce6f0;
        border-radius: 16px;
        box-shadow: 0 6px 20px rgba(15, 42, 72, .045);
      }
      .tech-dashboard-page .tech-dashboard-chart-card,
      .tech-dashboard-page .tech-dashboard-status-card {
        min-height: 288px;
      }
      .tech-dashboard-page .tech-section-header {
        align-items: flex-start;
        margin-bottom: 10px;
      }
      .tech-dashboard-page .tech-section-header h3 {
        font-size: 18px;
        line-height: 1.3;
      }
      .tech-dashboard-page .tech-section-header p {
        margin: 4px 0 0;
        color: #718198;
        font-size: 12px;
        line-height: 1.4;
      }
      .tech-dashboard-page .tech-chart {
        display: grid;
        grid-template-columns: 26px minmax(0, 1fr);
        align-items: stretch;
        gap: 8px;
        height: 205px;
        min-width: 0;
        padding: 13px 2px 0;
      }
      .tech-dashboard-page .tech-chart-axis {
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        height: calc(100% - 23px);
        color: #64758a;
        font-size: 10px;
        text-align: right;
      }
      .tech-dashboard-page .tech-chart-main {
        position: relative;
        min-width: 0;
        height: 100%;
      }
      .tech-dashboard-page .tech-chart-grid {
        position: absolute;
        inset: 0 0 23px;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        pointer-events: none;
      }
      .tech-dashboard-page .tech-chart-grid i {
        display: block;
        width: 100%;
        height: 1px;
        border-top: 1px dashed #dce6f0;
      }
      .tech-dashboard-page .tech-chart-columns {
        position: absolute;
        inset: 0;
        display: flex;
        align-items: stretch;
        justify-content: space-around;
        gap: 6px;
      }
      .tech-dashboard-page .tech-chart-col {
        display: flex;
        flex: 1 1 0;
        flex-direction: column;
        align-items: center;
        min-width: 0;
        height: 100%;
        gap: 0;
      }
      .tech-dashboard-page .tech-chart-plot-col {
        position: relative;
        display: flex;
        flex: 1;
        align-items: flex-end;
        justify-content: center;
        width: 100%;
        min-height: 0;
      }
      .tech-dashboard-page .tech-chart-bar {
        width: 24px;
        min-height: 2px;
        border-radius: 8px 8px 2px 2px;
        background: linear-gradient(180deg, #62c4a0 0%, #087f70 100%);
        box-shadow: inset 0 1px 1px rgba(255, 255, 255, .55), 0 3px 7px rgba(8, 127, 112, .16);
      }
      .tech-dashboard-page .tech-chart-value {
        position: absolute;
        left: 50%;
        z-index: 1;
        transform: translateX(-50%);
        color: #24364b;
        font-size: 11px;
        font-weight: 750;
        line-height: 1;
        white-space: nowrap;
      }
      .tech-dashboard-page .tech-chart-col small {
        flex: 0 0 23px;
        padding-top: 6px;
        color: #64748b;
        font-size: 10px;
        white-space: nowrap;
      }
      .tech-dashboard-page .tech-status-summary {
        display: grid;
        grid-template-columns: 1fr;
        gap: 20px;
        padding: 24px 0 5px;
      }
      .tech-dashboard-page .tech-status-summary > .tech-status-row {
        display: grid;
        grid-template-columns: 48px minmax(0, 1fr) 38px;
        align-items: center;
        gap: 12px;
        min-width: 0;
        padding: 0;
        border: 0;
        border-radius: 0;
        background: transparent;
      }
      .tech-dashboard-page .tech-status-icon {
        display: grid;
        place-items: center;
        width: 48px;
        height: 48px;
        border-radius: 13px;
        background: #fff3df;
        color: #da8b0b;
      }
      .tech-dashboard-page .tech-status-row.is-done .tech-status-icon {
        background: #e4f8ed;
        color: #22a365;
      }
      .tech-dashboard-page .tech-status-icon svg {
        width: 23px;
        height: 23px;
      }
      .tech-dashboard-page .tech-status-copy {
        display: grid;
        gap: 9px;
        min-width: 0;
      }
      .tech-dashboard-page .tech-status-copy > span {
        color: #34465d;
        font-size: 13px;
        font-weight: 650;
      }
      .tech-dashboard-page .tech-status-count {
        display: grid;
        justify-items: end;
        gap: 2px;
      }
      .tech-dashboard-page .tech-status-count strong {
        color: #17263b;
        font-size: 20px;
        line-height: 1;
      }
      .tech-dashboard-page .tech-status-count small {
        color: #7b8ba0;
        font-size: 11px;
      }
      .tech-dashboard-page .tech-status-track {
        height: 11px;
        overflow: hidden;
        border-radius: 99px;
        background: #e7edf3;
      }
      .tech-dashboard-page .tech-status-track i {
        display: block;
        height: 100%;
        border-radius: inherit;
        background: linear-gradient(90deg, #eda018, #f5bc4c);
        transition: width .25s ease;
      }
      .tech-dashboard-page .tech-status-row.is-done .tech-status-track i {
        background: linear-gradient(90deg, #26a66d, #5bc88c);
      }
      .tech-dashboard-page .tech-status-footnote {
        margin: 8px 0 0;
        color: #8492a5;
        font-size: 11px;
      }
      .tech-dashboard-page .tech-dashboard-jobs-card .tech-section-header{align-items:center;gap:12px;margin-bottom:14px}
      .tech-dashboard-page .tech-dashboard-jobs-card .tech-status-badge{flex:0 0 auto}
      .tech-dashboard-page .tech-table-wrap{display:block;width:100%;max-width:100%;min-width:0;overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch;overscroll-behavior-inline:contain}
      .tech-dashboard-page .tech-dashboard-jobs-table{width:100%;min-width:940px;table-layout:fixed}
      .tech-dashboard-page .tech-dashboard-jobs-table th,.tech-dashboard-page .tech-dashboard-jobs-table td{white-space:nowrap;vertical-align:middle}
      .tech-dashboard-page .tech-dashboard-jobs-table th{padding:11px 13px;background:#edf6f0;color:#49675a;font-size:10px;letter-spacing:.045em}
      .tech-dashboard-page .tech-dashboard-jobs-table td{padding:7px 10px;font-size:12px}
      .tech-dashboard-page .tech-dashboard-jobs-table th:nth-child(1),.tech-dashboard-page .tech-dashboard-jobs-table td:nth-child(1){width:170px}
      .tech-dashboard-page .tech-dashboard-jobs-table th:nth-child(2),.tech-dashboard-page .tech-dashboard-jobs-table td:nth-child(2){width:125px}
      .tech-dashboard-page .tech-dashboard-jobs-table th:nth-child(3),.tech-dashboard-page .tech-dashboard-jobs-table td:nth-child(3){width:175px}
      .tech-dashboard-page .tech-dashboard-jobs-table th:nth-child(4),.tech-dashboard-page .tech-dashboard-jobs-table td:nth-child(4){width:150px}
      .tech-dashboard-page .tech-dashboard-jobs-table th:nth-child(5),.tech-dashboard-page .tech-dashboard-jobs-table td:nth-child(5){width:155px}
      .tech-dashboard-page .tech-dashboard-jobs-table th:last-child,.tech-dashboard-page .tech-dashboard-jobs-table td:last-child{width:165px;padding-right:8px;padding-left:8px;text-align:center}
      .tech-dashboard-page .tech-dashboard-jobs-table td:first-child{min-width:0;overflow:hidden;text-overflow:ellipsis}
      .tech-dashboard-page .tech-dashboard-jobs-table td:first-child strong{color:#087f70}
      .tech-dashboard-page .tech-dashboard-jobs-table .tech-status-badge{display:inline-flex;align-items:center;min-height:27px;padding:4px 10px;border-radius:999px;font-size:10px;font-weight:750}
      .tech-dashboard-page .tech-dashboard-jobs-table .tech-status-badge.progress{background:#fff0d1;color:#a96b00}
      .tech-dashboard-page .tech-dashboard-jobs-table .tech-status-badge.done{background:#dcf7e8;color:#167c48}
      .tech-dashboard-page .tech-dashboard-jobs-table .tech-btn{min-height:32px;padding:6px 11px;border-radius:9px;font-size:11px;white-space:nowrap}
      .tech-dashboard-page .tech-dashboard-jobs-table .tech-dashboard-action{display:inline-flex;align-items:center;justify-content:center;width:136px;min-width:0;max-width:100%;min-height:34px;margin:0 auto;padding:7px 9px;box-sizing:border-box;line-height:1.2}
      .tech-dashboard-page .tech-dashboard-jobs-table .tech-dashboard-action:not(.secondary){border:1px solid #087565;background:linear-gradient(140deg,#0b917d,#075e55);color:#fff;box-shadow:0 3px 8px rgba(8,127,112,.18)}
      .tech-dashboard-page .tech-dashboard-jobs-table tbody tr:hover{background:#f1f8f3}
      @media(max-width:960px){.tech-dashboard-page .tech-dashboard-grid{grid-template-columns:minmax(0,1fr)}}
      @media(max-width:680px){.tech-dashboard-page{gap:12px}.tech-dashboard-page .tech-welcome{align-items:flex-start;gap:12px;padding:16px}.tech-dashboard-page .tech-welcome-main{gap:13px}.tech-dashboard-page .tech-welcome-avatar{flex-basis:48px;width:48px;height:48px;border-radius:13px;font-size:22px}.tech-dashboard-page .tech-welcome-divider{max-height:52px}.tech-dashboard-page .tech-welcome h3{font-size:20px}.tech-dashboard-page .tech-welcome p{font-size:12px}.tech-dashboard-page .tech-welcome>.tech-status-badge{padding:7px 10px;font-size:10px}.tech-dashboard-page .tech-stat-grid{grid-template-columns:minmax(0,1fr);gap:9px}.tech-dashboard-page .tech-stat{grid-template-columns:40px minmax(0,1fr);gap:10px;min-height:78px;padding:12px;border-radius:13px}.tech-dashboard-page .tech-stat-icon{flex-basis:40px;width:40px;height:40px;border-radius:11px}.tech-dashboard-page .tech-stat-icon svg{width:20px;height:20px}.tech-dashboard-page .tech-stat .label{font-size:9px}.tech-dashboard-page .tech-stat .value{font-size:25px}.tech-dashboard-page .tech-section{padding:15px;border-radius:13px}.tech-dashboard-page .tech-dashboard-chart-card,.tech-dashboard-page .tech-dashboard-status-card{min-height:0}.tech-dashboard-page .tech-chart{height:194px;grid-template-columns:22px minmax(0,1fr);gap:5px;padding:12px 0 0}.tech-dashboard-page .tech-chart-bar{width:19px}.tech-dashboard-page .tech-chart-value{font-size:10px}.tech-dashboard-page .tech-chart-col small{font-size:9px}.tech-dashboard-page .tech-status-summary{gap:17px;padding-top:18px}.tech-dashboard-page .tech-status-summary>.tech-status-row{grid-template-columns:40px minmax(0,1fr) 32px;gap:9px}.tech-dashboard-page .tech-status-icon{width:40px;height:40px;border-radius:11px}.tech-dashboard-page .tech-status-icon svg{width:20px;height:20px}.tech-dashboard-page .tech-status-count strong{font-size:18px}.tech-dashboard-page .tech-dashboard-jobs-card .tech-section-header{align-items:flex-start;flex-direction:column}.tech-dashboard-page .tech-dashboard-jobs-table{min-width:940px}}
      @media(max-width:420px){.tech-dashboard-page .tech-welcome{flex-wrap:wrap}.tech-dashboard-page .tech-welcome-main{flex:1 1 100%}.tech-dashboard-page .tech-welcome>.tech-status-badge{margin-left:61px}}
      .tech-readonly-action{display:flex;align-items:center;min-height:40px;padding:7px 10px;border:1px solid #cbd5e1;border-radius:10px;background:#f8fafc;color:#53657a;font-size:13px;box-sizing:border-box}
      .tech-readonly-action .tech-btn{min-height:30px;padding:5px 10px}

/* ===== ORIGINAL STYLE BLOCK 11 id="navbar-layanan-final-fix" ===== */
.navbar .dropdown,
.navbar .dropdown-content,
.navbar .dropdown-content li,
.navbar .dropdown-content li a.nav-service-link{
    pointer-events:auto !important;
}
.navbar .dropdown-content{
    z-index:999999 !important;
}
.navbar .dropdown-content li a.nav-service-link{
    position:relative !important;
    z-index:1000000 !important;
    cursor:pointer !important;
    display:block !important;
}
.navbar .dropdown-content li a.nav-service-link:hover{
    cursor:pointer !important;
}

/* ===== ORIGINAL STYLE BLOCK 12 id="admin-gmaps-no-overlap" ===== */
.admin-table-wrap{
    width:100% !important;
    max-width:100% !important;
    overflow-x:auto !important;
    overflow-y:hidden !important;
    box-sizing:border-box !important;
}


.admin-services-table,
.admin-running-services-table,
.admin-completed-services-table,
.admin-activity-table{
    width:max-content !important;
    min-width:1500px !important;
    table-layout:auto !important;
    border-collapse:collapse !important;
}

.admin-table td:has(> .admin-gmaps-link),
.admin-table th:has(+ td > .admin-gmaps-link){
    min-width:150px !important;
    width:150px !important;
    padding:12px 14px !important;
    box-sizing:border-box !important;
    vertical-align:middle !important;
}

.admin-gmaps-link{
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    box-sizing:border-box !important;
    width:122px !important;
    min-width:122px !important;
    max-width:122px !important;
    height:44px !important;
    min-height:44px !important;
    margin:0 auto !important;
    padding:0 8px !important;
    border:1px solid #cbd5e1 !important;
    border-radius:12px !important;
    background:#fff !important;
    color:#0f172a !important;
    text-decoration:none !important;
    font-weight:700 !important;
    font-size:.86rem !important;
    line-height:1 !important;
    white-space:nowrap !important;
    word-break:normal !important;
    overflow:hidden !important;
    overflow-wrap:normal !important;
    text-overflow:clip !important;
    position:relative !important;
    z-index:2 !important;
}

.admin-table td:has(> .admin-gmaps-link){
    overflow:visible !important;
    white-space:nowrap !important;
    text-align:center !important;
}

.admin-table td:has(> .admin-gmaps-link) + td{
    min-width:155px !important;
    width:155px !important;
    padding-left:12px !important;
    padding-right:12px !important;
    text-align:center !important;
    vertical-align:middle !important;
}

.admin-table td:has(> .admin-gmaps-link) + td .btn-secondary.small{
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    box-sizing:border-box !important;
    width:122px !important;
    min-width:122px !important;
    max-width:122px !important;
    min-height:52px !important;
    margin:0 auto !important;
    padding:8px 10px !important;
    white-space:normal !important;
    word-break:normal !important;
    line-height:1.25 !important;
}

.admin-table td:has(> .admin-gmaps-link) a{
    flex-shrink:0 !important;
}
@media(max-width:900px){
    .admin-services-table,
    .admin-running-services-table,
    .admin-completed-services-table,
    .admin-activity-table{
        min-width:1450px !important;
    }
    .admin-gmaps-link{
        width:116px !important;
        min-width:116px !important;
        max-width:116px !important;
        font-size:.82rem !important;
    }
}

/* ===== ORIGINAL STYLE BLOCK 13 id="admin-address-wrap-fix" ===== */
.admin-table td.admin-activity-address,
.admin-table td:nth-child(5) {
    width:220px !important;
    min-width:180px !important;
    max-width:240px !important;
    white-space:normal !important;
    overflow-wrap:anywhere !important;
    word-break:normal !important;
    line-height:1.45 !important;
    vertical-align:top !important;
}


.admin-services-table td:nth-child(5),
.admin-running-services-table td:nth-child(5),
.admin-completed-services-table td:nth-child(5),
.admin-activity-table td.admin-activity-address {
    width:220px !important;
    min-width:180px !important;
    max-width:220px !important;
    white-space:normal !important;
    overflow-wrap:anywhere !important;
    word-break:normal !important;
}

.admin-services-table th:nth-child(5),
.admin-running-services-table th:nth-child(5),
.admin-completed-services-table th:nth-child(5),
.admin-activity-table th:nth-child(5) {
    width:220px !important;
    min-width:180px !important;
    max-width:220px !important;
}

.admin-services-table td:nth-child(5) *,
.admin-running-services-table td:nth-child(5) *,
.admin-completed-services-table td:nth-child(5) *,
.admin-activity-table td.admin-activity-address * {
    max-width:100% !important;
    overflow-wrap:anywhere !important;
}


@media(max-width:900px){
    .admin-services-table td:nth-child(5),
    .admin-running-services-table td:nth-child(5),
    .admin-completed-services-table td:nth-child(5),
    .admin-activity-table td.admin-activity-address {
        width:180px !important;
        min-width:160px !important;
        max-width:180px !important;
        font-size:.82rem !important;
        line-height:1.4 !important;
    }
    .admin-services-table th:nth-child(5),
    .admin-running-services-table th:nth-child(5),
    .admin-completed-services-table th:nth-child(5),
    .admin-activity-table th:nth-child(5) {
        width:180px !important;
        min-width:160px !important;
        max-width:180px !important;
    }
}

/* ===== ORIGINAL STYLE BLOCK 14 id="admin-table-final-neat-fix" ===== */
.admin-table-wrap{
    width:100% !important;
    max-width:100% !important;
    overflow-x:auto !important;
    overflow-y:hidden !important;
    box-sizing:border-box !important;
    -webkit-overflow-scrolling:touch !important;
}


.admin-services-table,
.admin-running-services-table,
.admin-completed-services-table,
.admin-activity-table{
    width:max-content !important;
    min-width:1450px !important;
    table-layout:fixed !important;
    border-collapse:collapse !important;
}

.admin-services-table th:nth-child(1),
.admin-services-table td:nth-child(1),
.admin-running-services-table th:nth-child(1),
.admin-running-services-table td:nth-child(1),
.admin-completed-services-table th:nth-child(1),
.admin-completed-services-table td:nth-child(1){
    width:120px !important;
}
.admin-services-table th:nth-child(2),
.admin-services-table td:nth-child(2),
.admin-running-services-table th:nth-child(2),
.admin-running-services-table td:nth-child(2){
    width:120px !important;
}

.admin-services-table th:nth-child(3),
.admin-services-table td:nth-child(3),
.admin-running-services-table th:nth-child(3),
.admin-running-services-table td:nth-child(3){
    width:180px !important;
    max-width:180px !important;
    overflow:hidden !important;
    text-overflow:ellipsis !important;
    white-space:nowrap !important;
}

.admin-services-table th:nth-child(4),
.admin-services-table td:nth-child(4),
.admin-running-services-table th:nth-child(4),
.admin-running-services-table td:nth-child(4){
    width:145px !important;
    max-width:145px !important;
    white-space:nowrap !important;
}

.admin-services-table th:nth-child(5),
.admin-services-table td:nth-child(5),
.admin-running-services-table th:nth-child(5),
.admin-running-services-table td:nth-child(5),
.admin-completed-services-table th:nth-child(5),
.admin-completed-services-table td:nth-child(5),
.admin-activity-table th:nth-child(5),
.admin-activity-table td.admin-activity-address{
    width:230px !important;
    min-width:230px !important;
    max-width:230px !important;
    box-sizing:border-box !important;
    white-space:normal !important;
    overflow-wrap:anywhere !important;
    word-break:normal !important;
    line-height:1.45 !important;
    vertical-align:top !important;
}

.admin-table td:has(> .admin-gmaps-link){
    width:155px !important;
    min-width:155px !important;
    max-width:155px !important;
    padding:12px 10px !important;
    box-sizing:border-box !important;
    text-align:center !important;
    vertical-align:middle !important;
    white-space:nowrap !important;
}
.admin-gmaps-link{
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    width:125px !important;
    min-width:125px !important;
    max-width:125px !important;
    height:44px !important;
    margin:0 auto !important;
    padding:0 8px !important;
    box-sizing:border-box !important;
    border:1px solid #cbd5e1 !important;
    border-radius:12px !important;
    background:#fff !important;
    color:#0f172a !important;
    font-weight:700 !important;
    font-size:.86rem !important;
    line-height:1 !important;
    white-space:nowrap !important;
    overflow:hidden !important;
    text-decoration:none !important;
}

.admin-table td:has(> .admin-gmaps-link) + td{
    width:165px !important;
    min-width:165px !important;
    max-width:165px !important;
    padding:12px 10px !important;
    box-sizing:border-box !important;
    text-align:center !important;
    vertical-align:middle !important;
}
.admin-table td:has(> .admin-gmaps-link) + td .btn-secondary.small{
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    width:125px !important;
    min-width:125px !important;
    max-width:125px !important;
    min-height:52px !important;
    margin:0 auto !important;
    padding:8px 10px !important;
    box-sizing:border-box !important;
    white-space:normal !important;
    line-height:1.2 !important;
}

.admin-services-table th:nth-child(8),
.admin-services-table td:nth-child(8),
.admin-running-services-table th:nth-child(8),
.admin-running-services-table td:nth-child(8){
    width:170px !important;
    max-width:170px !important;
    white-space:normal !important;
    overflow-wrap:anywhere !important;
    line-height:1.4 !important;
}

.admin-services-table th:nth-child(9),
.admin-services-table td:nth-child(9),
.admin-running-services-table th:nth-child(9),
.admin-running-services-table td:nth-child(9){
    width:190px !important;
    max-width:190px !important;
    white-space:normal !important;
    overflow-wrap:anywhere !important;
    line-height:1.4 !important;
}

.admin-services-table th,
.admin-services-table td,
.admin-running-services-table th,
.admin-running-services-table td,
.admin-completed-services-table th,
.admin-completed-services-table td,
.admin-activity-table th,
.admin-activity-table td{
    box-sizing:border-box !important;
    overflow:hidden !important;
}

.admin-services-table th,
.admin-running-services-table th,
.admin-completed-services-table th,
.admin-activity-table th{
    white-space:normal !important;
    line-height:1.3 !important;
    vertical-align:middle !important;
}

@media(min-width:901px){
    .admin-table-wrap{
        scrollbar-width:thin;
    }
}

@media(max-width:900px){
    .admin-services-table,
    .admin-running-services-table,
    .admin-completed-services-table,
    .admin-activity-table{
        min-width:1400px !important;
    }
    .admin-services-table th:nth-child(5),
    .admin-services-table td:nth-child(5),
    .admin-running-services-table th:nth-child(5),
    .admin-running-services-table td:nth-child(5),
    .admin-completed-services-table th:nth-child(5),
    .admin-completed-services-table td:nth-child(5),
    .admin-activity-table td.admin-activity-address{
        width:190px !important;
        min-width:190px !important;
        max-width:190px !important;
        font-size:.82rem !important;
    }
    .admin-table td:has(> .admin-gmaps-link){
        width:145px !important;
        min-width:145px !important;
        max-width:145px !important;
    }
    .admin-gmaps-link{
        width:115px !important;
        min-width:115px !important;
        max-width:115px !important;
        font-size:.8rem !important;
    }
    .admin-table td:has(> .admin-gmaps-link) + td{
        width:150px !important;
        min-width:150px !important;
        max-width:150px !important;
    }
    .admin-table td:has(> .admin-gmaps-link) + td .btn-secondary.small{
        width:115px !important;
        min-width:115px !important;
        max-width:115px !important;
    }
}

/* ===== ORIGINAL STYLE BLOCK 15 id="admin-gmaps-same-as-media" ===== */
.admin-table td:has(> .admin-gmaps-link),
.admin-table td:has(> .admin-gmaps-link) + td {
    width:165px !important;
    min-width:165px !important;
    max-width:165px !important;
    height:76px !important;
    min-height:76px !important;
    padding:10px !important;
    box-sizing:border-box !important;
    text-align:center !important;
    vertical-align:middle !important;
}

.admin-gmaps-link,
.admin-table td:has(> .admin-gmaps-link) + td .btn-secondary.small {
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    width:125px !important;
    min-width:125px !important;
    max-width:125px !important;
    height:52px !important;
    min-height:52px !important;
    max-height:52px !important;
    margin:0 auto !important;
    padding:8px 10px !important;
    box-sizing:border-box !important;
    border-radius:12px !important;
    font-size:.86rem !important;
    font-weight:700 !important;
    line-height:1.2 !important;
    text-align:center !important;
}

.admin-gmaps-link {
    white-space:nowrap !important;
    overflow:hidden !important;
    text-overflow:clip !important;
}

.admin-table td:has(> .admin-gmaps-link) + td .btn-secondary.small {
    white-space:normal !important;
    overflow:hidden !important;
    overflow-wrap:normal !important;
}

.admin-table td:has(> .admin-gmaps-link) > .admin-gmaps-link,
.admin-table td:has(> .admin-gmaps-link) + td > .btn-secondary.small {
    position:relative !important;
    top:auto !important;
    bottom:auto !important;
    transform:none !important;
}

@media(max-width:900px){
    .admin-table td:has(> .admin-gmaps-link),
    .admin-table td:has(> .admin-gmaps-link) + td {
        width:150px !important;
        min-width:150px !important;
        max-width:150px !important;
        height:72px !important;
        min-height:72px !important;
    }
    .admin-gmaps-link,
    .admin-table td:has(> .admin-gmaps-link) + td .btn-secondary.small {
        width:115px !important;
        min-width:115px !important;
        max-width:115px !important;
        height:50px !important;
        min-height:50px !important;
        max-height:50px !important;
        font-size:.8rem !important;
    }
}

/* ===== ORIGINAL STYLE BLOCK 16 id="admin-buttons-exact-match" ===== */
.admin-table td:has(> .admin-gmaps-link),
.admin-table td:has(> .admin-gmaps-link) + td {
    width:165px !important;
    min-width:165px !important;
    max-width:165px !important;
    height:76px !important;
    min-height:76px !important;
    padding:10px !important;
    box-sizing:border-box !important;
    vertical-align:middle !important;
    text-align:center !important;
}

.admin-table td:has(> .admin-gmaps-link) > .admin-gmaps-link,
.admin-table td:has(> .admin-gmaps-link) + td > .btn-secondary.small {
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    width:125px !important;
    min-width:125px !important;
    max-width:125px !important;
    height:52px !important;
    min-height:52px !important;
    max-height:52px !important;
    margin:0 auto !important;
    padding:0 10px !important;
    box-sizing:border-box !important;
    border-radius:12px !important;
    font-family:inherit !important;
    font-size:.86rem !important;
    font-weight:700 !important;
    line-height:1.2 !important;
    text-align:center !important;
    vertical-align:middle !important;
    position:relative !important;
    top:0 !important;
    bottom:auto !important;
    transform:none !important;
}

.admin-table td:has(> .admin-gmaps-link) > .admin-gmaps-link {
    white-space:nowrap !important;
    overflow:hidden !important;
    text-overflow:clip !important;
}

.admin-table td:has(> .admin-gmaps-link) + td > .btn-secondary.small {
    white-space:normal !important;
    overflow:hidden !important;
    overflow-wrap:normal !important;
}

.admin-table td:has(> .admin-gmaps-link) > .admin-gmaps-link:hover,
.admin-table td:has(> .admin-gmaps-link) + td > .btn-secondary.small:hover {
    transform:none !important;
    margin-top:0 !important;
    margin-bottom:0 !important;
}

@media(max-width:900px){
    .admin-table td:has(> .admin-gmaps-link),
    .admin-table td:has(> .admin-gmaps-link) + td {
        width:150px !important;
        min-width:150px !important;
        max-width:150px !important;
        height:72px !important;
        min-height:72px !important;
    }
    .admin-table td:has(> .admin-gmaps-link) > .admin-gmaps-link,
    .admin-table td:has(> .admin-gmaps-link) + td > .btn-secondary.small {
        width:115px !important;
        min-width:115px !important;
        max-width:115px !important;
        height:50px !important;
        min-height:50px !important;
        max-height:50px !important;
        font-size:.8rem !important;
    }
}

/* ===== ORIGINAL STYLE BLOCK 17 id="admin-gmaps-media-true-identical" ===== */
.admin-table td:has(> .admin-gmaps-link),
.admin-table td:has(> .admin-gmaps-link) + td{
    width:170px !important;
    min-width:170px !important;
    max-width:170px !important;
    height:82px !important;
    min-height:82px !important;
    padding:8px !important;
    box-sizing:border-box !important;
    vertical-align:middle !important;
    text-align:center !important;
}

.admin-table td:has(> .admin-gmaps-link) > .admin-gmaps-link,
.admin-table td:has(> .admin-gmaps-link) + td > .btn-secondary.small{
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    flex:0 0 140px !important;
    width:140px !important;
    min-width:140px !important;
    max-width:140px !important;
    height:58px !important;
    min-height:58px !important;
    max-height:58px !important;
    margin:0 auto !important;
    padding:0 12px !important;
    box-sizing:border-box !important;
    border:1px solid #cbd5e1 !important;
    border-radius:14px !important;
    background:#fff !important;
    color:#0f172a !important;
    font-family:inherit !important;
    font-size:.88rem !important;
    font-weight:700 !important;
    line-height:1.2 !important;
    text-align:center !important;
    position:static !important;
    transform:none !important;
}

.admin-table td:has(> .admin-gmaps-link) > .admin-gmaps-link{
    white-space:nowrap !important;
    overflow:hidden !important;
}
.admin-table td:has(> .admin-gmaps-link) + td > .btn-secondary.small{
    white-space:normal !important;
    overflow:hidden !important;
    overflow-wrap:normal !important;
}

.admin-table td:has(> .admin-gmaps-link) + td > .btn-secondary.small::before,
.admin-table td:has(> .admin-gmaps-link) + td > .btn-secondary.small::after{
    box-sizing:border-box !important;
}

@media(max-width:900px){
    .admin-table td:has(> .admin-gmaps-link),
    .admin-table td:has(> .admin-gmaps-link) + td{
        width:155px !important;
        min-width:155px !important;
        max-width:155px !important;
        height:76px !important;
        min-height:76px !important;
    }
    .admin-table td:has(> .admin-gmaps-link) > .admin-gmaps-link,
    .admin-table td:has(> .admin-gmaps-link) + td > .btn-secondary.small{
        flex-basis:125px !important;
        width:125px !important;
        min-width:125px !important;
        max-width:125px !important;
        height:54px !important;
        min-height:54px !important;
        max-height:54px !important;
        font-size:.8rem !important;
    }
}

/* ===== ORIGINAL STYLE BLOCK 18 id="admin-gmaps-final-clean-layout" ===== */
.admin-services-table th:nth-child(5), .admin-services-table td:nth-child(5),
.admin-running-services-table th:nth-child(5), .admin-running-services-table td:nth-child(5),
.admin-completed-services-table th:nth-child(5), .admin-completed-services-table td:nth-child(5) {
    width:230px!important; min-width:230px!important; max-width:230px!important;
    box-sizing:border-box!important; white-space:normal!important;
    overflow-wrap:anywhere!important; line-height:1.45!important; vertical-align:middle!important;
}
.admin-services-table th:nth-child(6), .admin-services-table td:nth-child(6),
.admin-services-table th:nth-child(7), .admin-services-table td:nth-child(7),
.admin-running-services-table th:nth-child(6), .admin-running-services-table td:nth-child(6),
.admin-running-services-table th:nth-child(7), .admin-running-services-table td:nth-child(7),
.admin-completed-services-table th:nth-child(6), .admin-completed-services-table td:nth-child(6),
.admin-completed-services-table th:nth-child(7), .admin-completed-services-table td:nth-child(7) {
    width:150px!important; min-width:150px!important; max-width:150px!important;
    padding:10px!important; box-sizing:border-box!important; text-align:center!important;
    vertical-align:middle!important; white-space:normal!important; overflow:hidden!important;
}
.admin-gmaps-link,
.admin-services-table td:nth-child(7) .btn-secondary.small,
.admin-running-services-table td:nth-child(7) .btn-secondary.small,
.admin-completed-services-table td:nth-child(7) .btn-secondary.small {
    display:inline-flex!important; align-items:center!important; justify-content:center!important;
    width:125px!important; min-width:125px!important; max-width:125px!important;
    height:52px!important; min-height:52px!important; max-height:52px!important;
    margin:0 auto!important; padding:8px 10px!important; box-sizing:border-box!important;
    border:1px solid #cbd5e1!important; border-radius:12px!important; background:#fff!important;
    color:#0f172a!important; font-weight:700!important; font-size:.86rem!important;
    line-height:1.2!important; text-align:center!important; text-decoration:none!important; overflow:hidden!important;
}
.admin-gmaps-link { white-space:nowrap!important; }
.admin-services-table td:nth-child(7) .btn-secondary.small,
.admin-running-services-table td:nth-child(7) .btn-secondary.small,
.admin-completed-services-table td:nth-child(7) .btn-secondary.small { white-space:normal!important; }
@media(max-width:900px){
    .admin-services-table,.admin-running-services-table,.admin-completed-services-table{min-width:1450px!important;}
    .admin-gmaps-link,
    .admin-services-table td:nth-child(7) .btn-secondary.small,
    .admin-running-services-table td:nth-child(7) .btn-secondary.small,
    .admin-completed-services-table td:nth-child(7) .btn-secondary.small {
        width:120px!important; min-width:120px!important; max-width:120px!important;
    }
}

/* ===== ORIGINAL STYLE BLOCK 19 id="admin-layout-consolidated-fix" ===== */
#page-admin, #page-technician, .admin-shell, .technician-shell { min-width:0; max-width:100%; }
.admin-content, .technician-content, #adminDashboardContent, #technicianPanelContent { min-width:0; max-width:100%; }
.admin-card { min-width:0; max-width:100%; box-sizing:border-box; overflow:hidden; }
.admin-card-header { display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; }
.admin-card-header > * { min-width:0; }


.admin-table-wrap, .admin-customers-table-wrap, .admin-tech-management-wrap,
.tech-table-wrap, .tech-client-table-wrap {
  display:block !important; width:100% !important; min-width:0 !important; max-width:100% !important;
  overflow-x:auto !important; overflow-y:hidden !important; box-sizing:border-box !important;
  -webkit-overflow-scrolling:touch; overscroll-behavior-inline:contain;
}
.admin-table, .tech-table, .tech-client-table {
  width:100% !important; min-width:1000px !important; max-width:none !important;
  table-layout:fixed !important; border-collapse:separate !important; border-spacing:0 !important;
}
.admin-table th, .admin-table td, .tech-table th, .tech-table td, .tech-client-table th, .tech-client-table td {
  height:auto !important; min-height:58px; padding:12px 14px !important; box-sizing:border-box;
  vertical-align:middle !important; overflow:hidden; text-overflow:ellipsis;
}
.admin-table th, .tech-table th, .tech-client-table th { white-space:normal !important; line-height:1.3; }
.admin-table td, .tech-table td, .tech-client-table td { white-space:nowrap; line-height:1.4; }
.admin-table td :is(button, a), .tech-table td :is(button, a), .tech-client-table td :is(button, a) { max-width:100%; }


.admin-services-table, .admin-running-services-table, .admin-completed-services-table, .admin-activity-table {
  min-width:1360px !important;
}
.admin-services-table th:nth-child(1), .admin-services-table td:nth-child(1),
.admin-running-services-table th:nth-child(1), .admin-running-services-table td:nth-child(1),
.admin-completed-services-table th:nth-child(1), .admin-completed-services-table td:nth-child(1) { width:120px !important; }
.admin-services-table th:nth-child(2), .admin-services-table td:nth-child(2),
.admin-running-services-table th:nth-child(2), .admin-running-services-table td:nth-child(2) { width:125px !important; }
.admin-services-table th:nth-child(3), .admin-services-table td:nth-child(3),
.admin-running-services-table th:nth-child(3), .admin-running-services-table td:nth-child(3) { width:170px !important; }
.admin-services-table th:nth-child(4), .admin-services-table td:nth-child(4),
.admin-running-services-table th:nth-child(4), .admin-running-services-table td:nth-child(4) { width:145px !important; }
.admin-services-table th:nth-child(5), .admin-services-table td:nth-child(5),
.admin-running-services-table th:nth-child(5), .admin-running-services-table td:nth-child(5),
.admin-completed-services-table th:nth-child(5), .admin-completed-services-table td:nth-child(5),
.admin-activity-table th:nth-child(5), .admin-activity-table td:nth-child(5) {
  width:220px !important; white-space:normal !important; overflow-wrap:anywhere !important; vertical-align:top !important;
}
.admin-services-table th:nth-child(8), .admin-services-table td:nth-child(8),
.admin-services-table th:nth-child(9), .admin-services-table td:nth-child(9),
.admin-running-services-table th:nth-child(8), .admin-running-services-table td:nth-child(8),
.admin-running-services-table th:nth-child(9), .admin-running-services-table td:nth-child(9) { width:180px !important; white-space:normal !important; overflow-wrap:anywhere !important; }


.admin-table td:has(> .admin-gmaps-link), .admin-table td:has(> .admin-gmaps-link) + td { width:154px !important; min-width:154px !important; padding:10px !important; text-align:center; }
.admin-table td:has(> .admin-gmaps-link) > .admin-gmaps-link,
.admin-table td:has(> .admin-gmaps-link) + td > .btn-secondary.small {
  display:inline-flex !important; align-items:center; justify-content:center; width:126px !important; min-width:126px !important;
  min-height:40px !important; height:auto !important; margin:0 auto !important; padding:8px 10px !important;
  white-space:normal !important; line-height:1.2 !important; box-sizing:border-box;
}


.admin-customers-table { min-width:1040px !important; }
.admin-customers-table th:nth-child(1), .admin-customers-table td:nth-child(1) { width:180px !important; white-space:normal !important; }
.admin-customers-table th:nth-child(2), .admin-customers-table td:nth-child(2) { width:145px !important; }
.admin-customers-table th:nth-child(n+3):nth-child(-n+6), .admin-customers-table td:nth-child(n+3):nth-child(-n+6) { width:115px !important; text-align:center; }
.admin-customers-table th:nth-child(7), .admin-customers-table td:nth-child(7) { width:145px !important; }
.admin-customers-table th:nth-child(8), .admin-customers-table td:nth-child(8) { width:110px !important; text-align:center; }
.admin-tech-management-table { min-width:960px !important; }
.admin-tech-management-table th:nth-child(1), .admin-tech-management-table td:nth-child(1) { width:190px !important; white-space:normal !important; }
.admin-tech-management-table th:nth-child(2), .admin-tech-management-table td:nth-child(2) { width:145px !important; }
.admin-tech-management-table th:nth-child(3), .admin-tech-management-table td:nth-child(3) { width:110px !important; text-align:center; }
.admin-tech-management-table th:nth-child(n+4):nth-child(-n+6), .admin-tech-management-table td:nth-child(n+4):nth-child(-n+6) { width:110px !important; text-align:center; }
.admin-tech-management-table th:nth-child(7), .admin-tech-management-table td:nth-child(7) { width:190px !important; text-align:center; }
.admin-action-stack, .admin-tech-actions { display:flex !important; flex-wrap:wrap; justify-content:center; align-items:center; gap:7px; min-width:0; }
.admin-action-stack button, .admin-tech-actions button { min-height:34px; padding:6px 10px !important; white-space:nowrap; }


.filter-grid, .admin-filter-row { display:grid !important; grid-template-columns:minmax(170px, .7fr) minmax(260px, 1.3fr); align-items:end; gap:12px; min-width:0; }
.filter-grid input, .filter-grid select, .admin-filter-row input, .admin-filter-row select { width:100% !important; min-width:0; min-height:42px; box-sizing:border-box; }


.technician-shell .tech-table, #page-technician .tech-table { min-width:900px !important; }
.technician-shell .tech-table th:last-child, .technician-shell .tech-table td:last-child, #page-technician .tech-table th:last-child, #page-technician .tech-table td:last-child { width:150px !important; text-align:center; }
.status-badge { display:inline-flex; align-items:center; justify-content:center; min-height:28px; padding:4px 10px; white-space:nowrap; box-sizing:border-box; }
#page-admin .status-badge,
#page-admin .admin-report-page .status-badge,
#page-admin .admin-report-table .status-badge {
  white-space:normal !important;
  overflow-wrap:anywhere !important;
  word-break:break-word !important;
  text-align:center !important;
  max-width:100% !important;
}

@media (max-width:720px) {
  #page-admin, #page-technician { padding-left:12px; padding-right:12px; }
  .admin-card { border-radius:14px; }
  .admin-card-header { align-items:flex-start; }
  .admin-card-header .btn-primary, .admin-card-header .btn-secondary { width:auto; min-height:40px; }
  .filter-grid, .admin-filter-row { grid-template-columns:1fr; gap:9px; }
  .admin-table th, .admin-table td, .tech-table th, .tech-table td { padding:10px 12px !important; font-size:.84rem; }
  .admin-services-table, .admin-running-services-table, .admin-completed-services-table, .admin-activity-table { min-width:1280px !important; }
  .admin-customers-table { min-width:970px !important; }
  .admin-tech-management-table { min-width:900px !important; }
}

/* ===== ORIGINAL STYLE BLOCK 20 id="admin-final-desktop-neat-fix" ===== */
body.admin-mode{overflow-x:hidden!important}
body.admin-mode>.wrapper{width:100%!important;max-width:1380px!important;min-width:0!important}
#page-admin{width:100%!important;max-width:100%!important;min-width:0!important;box-sizing:border-box!important;overflow:visible!important}
.admin-shell{width:100%!important;max-width:100%!important;min-width:0!important;grid-template-columns:260px minmax(0,1fr)!important;gap:18px!important}
.admin-content{width:100%!important;max-width:100%!important;min-width:0!important;overflow:visible!important}
.admin-panels{width:100%!important;max-width:100%!important;min-width:0!important}
.admin-card{width:100%!important;max-width:100%!important;min-width:0!important;box-sizing:border-box!important;overflow:hidden!important}
.admin-card-header{width:100%!important;max-width:100%!important;min-width:0!important;box-sizing:border-box!important}


.admin-table-wrap,
.admin-customers-table-wrap,
.admin-tech-management-wrap{
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  overflow-x:auto!important;
  overflow-y:hidden!important;
  box-sizing:border-box!important;
  margin-left:0!important;
  margin-right:0!important;
  scrollbar-width:thin;
}


.admin-services-table,
.admin-running-services-table,
.admin-completed-services-table,
.admin-activity-table{
  width:100%!important;
  min-width:0!important;
  max-width:100%!important;
  table-layout:fixed!important;
  border-collapse:collapse!important;
  border-spacing:0!important;
}
.admin-running-services-table th,
.admin-running-services-table td,
.admin-completed-services-table th,
.admin-completed-services-table td,
.admin-services-table th,
.admin-services-table td,
.admin-activity-table th,
.admin-activity-table td{
  box-sizing:border-box!important;
  padding:11px 10px!important;
  vertical-align:middle!important;
  line-height:1.35!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}
.admin-running-services-table th,
.admin-completed-services-table th,
.admin-services-table th,
.admin-activity-table th{
  white-space:normal!important;
  text-align:center!important;
  font-size:.78rem!important;
  line-height:1.25!important;
}
.admin-running-services-table td,
.admin-completed-services-table td,
.admin-services-table td,
.admin-activity-table td{
  font-size:.80rem!important;
}

.admin-running-services-table th:nth-child(1),.admin-running-services-table td:nth-child(1),
.admin-completed-services-table th:nth-child(1),.admin-completed-services-table td:nth-child(1),
.admin-services-table th:nth-child(1),.admin-services-table td:nth-child(1){width:9%!important;text-align:left!important}
.admin-running-services-table th:nth-child(2),.admin-running-services-table td:nth-child(2),
.admin-completed-services-table th:nth-child(2),.admin-completed-services-table td:nth-child(2),
.admin-services-table th:nth-child(2),.admin-services-table td:nth-child(2){width:8%!important;text-align:center!important}
.admin-running-services-table th:nth-child(3),.admin-running-services-table td:nth-child(3),
.admin-completed-services-table th:nth-child(3),.admin-completed-services-table td:nth-child(3),
.admin-services-table th:nth-child(3),.admin-services-table td:nth-child(3){width:12%!important;text-align:left!important}
.admin-running-services-table th:nth-child(4),.admin-running-services-table td:nth-child(4),
.admin-completed-services-table th:nth-child(4),.admin-completed-services-table td:nth-child(4),
.admin-services-table th:nth-child(4),.admin-services-table td:nth-child(4){width:10%!important;text-align:center!important}
.admin-running-services-table th:nth-child(5),.admin-running-services-table td:nth-child(5),
.admin-completed-services-table th:nth-child(5),.admin-completed-services-table td:nth-child(5),
.admin-services-table th:nth-child(5),.admin-services-table td:nth-child(5){width:15%!important;text-align:left!important;white-space:normal!important;overflow-wrap:anywhere!important}
.admin-running-services-table th:nth-child(6),.admin-running-services-table td:nth-child(6),
.admin-completed-services-table th:nth-child(6),.admin-completed-services-table td:nth-child(6),
.admin-services-table th:nth-child(6),.admin-services-table td:nth-child(6){width:9%!important;text-align:center!important}
.admin-running-services-table th:nth-child(7),.admin-running-services-table td:nth-child(7),
.admin-completed-services-table th:nth-child(7),.admin-completed-services-table td:nth-child(7),
.admin-services-table th:nth-child(7),.admin-services-table td:nth-child(7){width:9%!important;text-align:center!important}
.admin-running-services-table th:nth-child(8),.admin-running-services-table td:nth-child(8),
.admin-completed-services-table th:nth-child(8),.admin-completed-services-table td:nth-child(8),
.admin-services-table th:nth-child(8),.admin-services-table td:nth-child(8){width:8%!important;text-align:left!important;white-space:normal!important;overflow-wrap:anywhere!important}
.admin-running-services-table th:nth-child(9),.admin-running-services-table td:nth-child(9),
.admin-completed-services-table th:nth-child(9),.admin-completed-services-table td:nth-child(9),
.admin-services-table th:nth-child(9),.admin-services-table td:nth-child(9){width:8%!important;text-align:center!important;white-space:normal!important}
.admin-running-services-table th:nth-child(10),.admin-running-services-table td:nth-child(10),
.admin-completed-services-table th:nth-child(10),.admin-completed-services-table td:nth-child(10),
.admin-services-table th:nth-child(10),.admin-services-table td:nth-child(10){width:6%!important;text-align:center!important;white-space:normal!important}
.admin-running-services-table th:nth-child(11),.admin-running-services-table td:nth-child(11),
.admin-completed-services-table th:nth-child(11),.admin-completed-services-table td:nth-child(11),
.admin-services-table th:nth-child(11),.admin-services-table td:nth-child(11){width:6%!important;text-align:center!important}


.admin-running-services-table .admin-action-stack,
.admin-completed-services-table .admin-action-stack,
.admin-services-table .admin-action-stack{
  display:flex!important;flex-direction:column!important;align-items:stretch!important;justify-content:center!important;gap:5px!important;width:100%!important;min-width:0!important
}
.admin-running-services-table .admin-action-stack button,
.admin-completed-services-table .admin-action-stack button,
.admin-services-table .admin-action-stack button{
  width:100%!important;min-width:0!important;max-width:100%!important;min-height:34px!important;height:auto!important;padding:6px 5px!important;font-size:.70rem!important;line-height:1.15!important;white-space:normal!important;box-sizing:border-box!important
}
.admin-running-services-table .admin-gmaps-link,
.admin-completed-services-table .admin-gmaps-link,
.admin-services-table .admin-gmaps-link,
.admin-running-services-table td .btn-secondary.small,
.admin-completed-services-table td .btn-secondary.small,
.admin-services-table td .btn-secondary.small{
  max-width:100%!important;min-width:0!important;width:100%!important;height:auto!important;min-height:34px!important;padding:6px 5px!important;font-size:.70rem!important;box-sizing:border-box!important;white-space:normal!important
}


.admin-customers-table{
  width:100%!important;min-width:0!important;max-width:100%!important;table-layout:fixed!important;border-collapse:collapse!important
}
.admin-customers-table th,.admin-customers-table td{
  box-sizing:border-box!important;padding:12px 10px!important;vertical-align:middle!important;overflow:hidden!important;text-overflow:ellipsis!important;line-height:1.35!important
}
.admin-customers-table th{white-space:normal!important;text-align:center!important;font-size:.78rem!important}
.admin-customers-table td{font-size:.82rem!important}
.admin-customers-table th:nth-child(1),.admin-customers-table td:nth-child(1){width:18%!important;text-align:left!important;white-space:normal!important;overflow-wrap:anywhere!important}
.admin-customers-table th:nth-child(2),.admin-customers-table td:nth-child(2){width:15%!important;text-align:left!important}
.admin-customers-table th:nth-child(3),.admin-customers-table td:nth-child(3){width:10%!important;text-align:center!important}
.admin-customers-table th:nth-child(4),.admin-customers-table td:nth-child(4){width:11%!important;text-align:center!important}
.admin-customers-table th:nth-child(5),.admin-customers-table td:nth-child(5){width:12%!important;text-align:center!important}
.admin-customers-table th:nth-child(6),.admin-customers-table td:nth-child(6){width:15%!important;text-align:center!important}
.admin-customers-table th:nth-child(7),.admin-customers-table td:nth-child(7){width:11%!important;text-align:center!important}
.admin-customers-table th:nth-child(8),.admin-customers-table td:nth-child(8){width:8%!important;text-align:center!important}


.admin-tech-management-table{
  width:100%!important;min-width:0!important;max-width:100%!important;table-layout:fixed!important;border-collapse:collapse!important
}
.admin-tech-management-table th,.admin-tech-management-table td{
  box-sizing:border-box!important;padding:12px 10px!important;vertical-align:middle!important;overflow:hidden!important;text-overflow:ellipsis!important;line-height:1.35!important
}
.admin-tech-management-table th{white-space:normal!important;text-align:center!important;font-size:.80rem!important}
.admin-tech-management-table td{font-size:.82rem!important}
.admin-tech-management-table th:nth-child(1),.admin-tech-management-table td:nth-child(1){width:22%!important;text-align:left!important;white-space:normal!important;overflow-wrap:anywhere!important}
.admin-tech-management-table th:nth-child(2),.admin-tech-management-table td:nth-child(2){width:14%!important;text-align:left!important}
.admin-tech-management-table th:nth-child(3),.admin-tech-management-table td:nth-child(3){width:13%!important;text-align:center!important}
.admin-tech-management-table th:nth-child(4),.admin-tech-management-table td:nth-child(4){width:11%!important;text-align:center!important}
.admin-tech-management-table th:nth-child(5),.admin-tech-management-table td:nth-child(5){width:12%!important;text-align:center!important}
.admin-tech-management-table th:nth-child(6),.admin-tech-management-table td:nth-child(6){width:12%!important;text-align:center!important}
.admin-tech-management-table th:nth-child(7),.admin-tech-management-table td:nth-child(7){width:16%!important;text-align:center!important}
.admin-tech-management-table .admin-tech-actions{display:flex!important;flex-direction:column!important;align-items:stretch!important;gap:5px!important;width:100%!important;min-width:0!important}
.admin-tech-management-table .admin-tech-actions button{width:100%!important;min-width:0!important;max-width:100%!important;min-height:34px!important;padding:6px 5px!important;font-size:.70rem!important;box-sizing:border-box!important;white-space:normal!important}


.admin-service-filter-bar,.filter-grid,.admin-filter-row{width:100%!important;max-width:100%!important;min-width:0!important;box-sizing:border-box!important}
.admin-service-filter-bar{display:flex!important;align-items:center!important;gap:10px!important;flex-wrap:wrap!important}
.admin-service-search-input,.admin-service-period-select,.filter-grid input,.filter-grid select,.admin-filter-row input,.admin-filter-row select{min-width:0!important;max-width:100%!important;box-sizing:border-box!important}

@media(max-width:1100px) and (min-width:768px){
  .admin-shell{grid-template-columns:230px minmax(0,1fr)!important;gap:14px!important}
  .admin-card{padding:14px!important}
  .admin-running-services-table th,.admin-running-services-table td,.admin-completed-services-table th,.admin-completed-services-table td,.admin-services-table th,.admin-services-table td{padding:9px 7px!important;font-size:.72rem!important}
  .admin-customers-table th,.admin-customers-table td,.admin-tech-management-table th,.admin-tech-management-table td{padding:9px 7px!important;font-size:.74rem!important}
}

@media(max-width:767px){
  .admin-table-wrap,.admin-customers-table-wrap,.admin-tech-management-wrap{overflow-x:auto!important}
  .admin-running-services-table,.admin-completed-services-table,.admin-services-table,.admin-activity-table{width:max-content!important;min-width:1280px!important;max-width:none!important;table-layout:fixed!important}
  .admin-customers-table{width:max-content!important;min-width:950px!important;max-width:none!important}
  .admin-tech-management-table{width:max-content!important;min-width:900px!important;max-width:none!important}
  .admin-running-services-table th,.admin-running-services-table td,.admin-completed-services-table th,.admin-completed-services-table td,.admin-services-table th,.admin-services-table td{font-size:.78rem!important}
  .admin-customers-table th,.admin-customers-table td,.admin-tech-management-table th,.admin-tech-management-table td{font-size:.78rem!important}
}

/* ===== ORIGINAL STYLE BLOCK 21 id="admin-number-alignment-final" ===== */
#page-admin .admin-table-wrap,
#page-admin .admin-customers-table-wrap,
#page-admin .admin-tech-management-wrap{
  position:relative!important;
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  overflow-x:auto!important;
  overflow-y:hidden!important;
  box-sizing:border-box!important;
}

#page-admin .admin-table,
#page-admin .admin-customers-table,
#page-admin .admin-tech-management-table{
  border-collapse:collapse!important;
  border-spacing:0!important;
}


#page-admin .admin-table th,
#page-admin .admin-table td,
#page-admin .admin-customers-table th,
#page-admin .admin-customers-table td,
#page-admin .admin-tech-management-table th,
#page-admin .admin-tech-management-table td{
  box-sizing:border-box!important;
  vertical-align:middle!important;
  line-height:1.35!important;
  padding-top:12px!important;
  padding-bottom:12px!important;
}


#page-admin .admin-table th,
#page-admin .admin-customers-table th,
#page-admin .admin-tech-management-table th{
  vertical-align:middle!important;
  line-height:1.25!important;
}


#page-admin .admin-tech-management-table{
  width:100%!important;
  min-width:0!important;
  max-width:100%!important;
  table-layout:fixed!important;
}
#page-admin .admin-tech-management-table th,
#page-admin .admin-tech-management-table td{
  vertical-align:middle!important;
  text-align:center!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}
#page-admin .admin-tech-management-table th:nth-child(1),
#page-admin .admin-tech-management-table td:nth-child(1){
  width:22%!important;
  text-align:left!important;
  white-space:normal!important;
  overflow-wrap:anywhere!important;
}
#page-admin .admin-tech-management-table th:nth-child(2),
#page-admin .admin-tech-management-table td:nth-child(2){
  width:14%!important;
  text-align:left!important;
  white-space:nowrap!important;
}
#page-admin .admin-tech-management-table th:nth-child(3),
#page-admin .admin-tech-management-table td:nth-child(3){width:13%!important;text-align:center!important;}
#page-admin .admin-tech-management-table th:nth-child(4),
#page-admin .admin-tech-management-table td:nth-child(4),
#page-admin .admin-tech-management-table th:nth-child(5),
#page-admin .admin-tech-management-table td:nth-child(5),
#page-admin .admin-tech-management-table th:nth-child(6),
#page-admin .admin-tech-management-table td:nth-child(6){
  width:11%!important;
  text-align:center!important;
  white-space:nowrap!important;
  font-variant-numeric:tabular-nums!important;
}
#page-admin .admin-tech-management-table th:nth-child(7),
#page-admin .admin-tech-management-table td:nth-child(7){
  width:18%!important;
  text-align:center!important;
}

#page-admin .admin-tech-management-table tbody tr{
  height:132px!important;
}
#page-admin .admin-tech-management-table tbody td:nth-child(4),
#page-admin .admin-tech-management-table tbody td:nth-child(5),
#page-admin .admin-tech-management-table tbody td:nth-child(6){
  vertical-align:middle!important;
  padding-top:0!important;
  padding-bottom:0!important;
}
#page-admin .admin-tech-management-table .admin-tech-actions,
#page-admin .admin-tech-management-table .admin-action-stack{
  width:100%!important;
  min-width:0!important;
  height:auto!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:stretch!important;
  justify-content:center!important;
  gap:6px!important;
  margin:0!important;
}
#page-admin .admin-tech-management-table .admin-tech-actions button,
#page-admin .admin-tech-management-table .admin-action-stack button{
  width:100%!important;
  min-width:0!important;
  max-width:100%!important;
  height:38px!important;
  min-height:38px!important;
  margin:0!important;
  padding:6px 8px!important;
  line-height:1.15!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  box-sizing:border-box!important;
}
#page-admin .admin-tech-management-table .status-badge{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  vertical-align:middle!important;
  line-height:1!important;
  min-height:30px!important;
}


#page-admin .admin-customers-table{
  width:100%!important;
  min-width:0!important;
  max-width:100%!important;
  table-layout:fixed!important;
}
#page-admin .admin-customers-table th,
#page-admin .admin-customers-table td{
  vertical-align:middle!important;
}
#page-admin .admin-customers-table th:nth-child(1),
#page-admin .admin-customers-table td:nth-child(1){width:18%!important;text-align:left!important;white-space:normal!important;overflow-wrap:anywhere!important;}
#page-admin .admin-customers-table th:nth-child(2),
#page-admin .admin-customers-table td:nth-child(2){width:15%!important;text-align:left!important;white-space:nowrap!important;}
#page-admin .admin-customers-table th:nth-child(3),
#page-admin .admin-customers-table td:nth-child(3){width:10%!important;text-align:center!important;}
#page-admin .admin-customers-table th:nth-child(4),
#page-admin .admin-customers-table td:nth-child(4){width:11%!important;text-align:center!important;}
#page-admin .admin-customers-table th:nth-child(5),
#page-admin .admin-customers-table td:nth-child(5){width:12%!important;text-align:center!important;}
#page-admin .admin-customers-table th:nth-child(6),
#page-admin .admin-customers-table td:nth-child(6){width:15%!important;text-align:center!important;}
#page-admin .admin-customers-table th:nth-child(7),
#page-admin .admin-customers-table td:nth-child(7){width:11%!important;text-align:center!important;}
#page-admin .admin-customers-table th:nth-child(8),
#page-admin .admin-customers-table td:nth-child(8){width:8%!important;text-align:center!important;}
#page-admin .admin-customers-table tbody td:nth-child(n+3){
  font-variant-numeric:tabular-nums!important;
  white-space:nowrap!important;
}


#page-admin .admin-services-table,
#page-admin .admin-running-services-table,
#page-admin .admin-completed-services-table,
#page-admin .admin-activity-table{
  width:100%!important;
  min-width:0!important;
  max-width:100%!important;
  table-layout:fixed!important;
}
#page-admin .admin-services-table th,
#page-admin .admin-services-table td,
#page-admin .admin-running-services-table th,
#page-admin .admin-running-services-table td,
#page-admin .admin-completed-services-table th,
#page-admin .admin-completed-services-table td,
#page-admin .admin-activity-table th,
#page-admin .admin-activity-table td{
  vertical-align:middle!important;
}

#page-admin .admin-services-table td:nth-child(2),
#page-admin .admin-services-table td:nth-child(4),
#page-admin .admin-services-table td:nth-child(6),
#page-admin .admin-services-table td:nth-child(7),
#page-admin .admin-services-table td:nth-child(9),
#page-admin .admin-services-table td:nth-child(10),
#page-admin .admin-services-table td:nth-child(11),
#page-admin .admin-running-services-table td:nth-child(2),
#page-admin .admin-running-services-table td:nth-child(4),
#page-admin .admin-running-services-table td:nth-child(6),
#page-admin .admin-running-services-table td:nth-child(7),
#page-admin .admin-running-services-table td:nth-child(9),
#page-admin .admin-running-services-table td:nth-child(10),
#page-admin .admin-running-services-table td:nth-child(11),
#page-admin .admin-completed-services-table td:nth-child(2),
#page-admin .admin-completed-services-table td:nth-child(4),
#page-admin .admin-completed-services-table td:nth-child(6),
#page-admin .admin-completed-services-table td:nth-child(7),
#page-admin .admin-completed-services-table td:nth-child(9),
#page-admin .admin-completed-services-table td:nth-child(10),
#page-admin .admin-completed-services-table td:nth-child(11){
  text-align:center!important;
  vertical-align:middle!important;
  white-space:nowrap!important;
  font-variant-numeric:tabular-nums!important;
}

#page-admin .admin-services-table td:nth-child(1),
#page-admin .admin-running-services-table td:nth-child(1),
#page-admin .admin-completed-services-table td:nth-child(1){text-align:left!important;vertical-align:middle!important;}
#page-admin .admin-services-table td:nth-child(3),
#page-admin .admin-running-services-table td:nth-child(3),
#page-admin .admin-completed-services-table td:nth-child(3){text-align:left!important;vertical-align:middle!important;white-space:nowrap!important;}
#page-admin .admin-services-table td:nth-child(5),
#page-admin .admin-running-services-table td:nth-child(5),
#page-admin .admin-completed-services-table td:nth-child(5){
  text-align:left!important;
  vertical-align:middle!important;
  white-space:normal!important;
  overflow-wrap:anywhere!important;
}
#page-admin .admin-services-table td:nth-child(8),
#page-admin .admin-running-services-table td:nth-child(8),
#page-admin .admin-completed-services-table td:nth-child(8){
  text-align:left!important;
  vertical-align:middle!important;
  white-space:normal!important;
  overflow-wrap:anywhere!important;
}


#page-admin .admin-services-table td,
#page-admin .admin-running-services-table td,
#page-admin .admin-completed-services-table td{
  font-variant-numeric:tabular-nums;
}


#page-admin .admin-services-table .admin-action-stack,
#page-admin .admin-running-services-table .admin-action-stack,
#page-admin .admin-completed-services-table .admin-action-stack{
  display:flex!important;
  flex-direction:column!important;
  justify-content:center!important;
  align-items:stretch!important;
  gap:5px!important;
  width:100%!important;
  margin:0!important;
}
#page-admin .admin-services-table .admin-action-stack button,
#page-admin .admin-running-services-table .admin-action-stack button,
#page-admin .admin-completed-services-table .admin-action-stack button{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:100%!important;
  height:34px!important;
  min-height:34px!important;
  margin:0!important;
  line-height:1.1!important;
}


#page-admin .admin-table td *,
#page-admin .admin-customers-table td *,
#page-admin .admin-tech-management-table td *{
  top:auto!important;
  bottom:auto!important;
}

@media (max-width:1100px) and (min-width:768px){
  #page-admin .admin-tech-management-table tbody tr{height:122px!important;}
  #page-admin .admin-table th,#page-admin .admin-table td,
  #page-admin .admin-customers-table th,#page-admin .admin-customers-table td,
  #page-admin .admin-tech-management-table th,#page-admin .admin-tech-management-table td{
    padding-top:10px!important;padding-bottom:10px!important;
  }
}

@media (max-width:767px){
  #page-admin .admin-tech-management-table,
  #page-admin .admin-customers-table,
  #page-admin .admin-services-table,
  #page-admin .admin-running-services-table,
  #page-admin .admin-completed-services-table,
  #page-admin .admin-activity-table{
    width:max-content!important;
    min-width:900px!important;
    max-width:none!important;
  }
  #page-admin .admin-tech-management-table tbody tr{height:118px!important;}
}

/* ===== ORIGINAL STYLE BLOCK 22 id="admin-full-audit-final-fix" ===== */
#page-admin .admin-table-wrap,
#page-admin .admin-customers-table-wrap,
#page-admin .admin-tech-management-wrap{
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  overflow-x:auto!important;
  overflow-y:hidden!important;
  box-sizing:border-box!important;
  scrollbar-width:thin;
}

#page-admin .admin-services-table,
#page-admin .admin-running-services-table,
#page-admin .admin-completed-services-table{
  width:100%!important;
  min-width:0!important;
  max-width:100%!important;
  table-layout:fixed!important;
  border-collapse:collapse!important;
  border-spacing:0!important;
}

#page-admin .admin-services-table th,
#page-admin .admin-services-table td,
#page-admin .admin-running-services-table th,
#page-admin .admin-running-services-table td,
#page-admin .admin-completed-services-table th,
#page-admin .admin-completed-services-table td{
  box-sizing:border-box!important;
  min-width:0!important;
  vertical-align:middle!important;
  overflow:hidden!important;
  text-overflow:clip!important;
  line-height:1.25!important;
  padding:9px 7px!important;
  height:72px!important;
  min-height:72px!important;
}

#page-admin .admin-services-table th,
#page-admin .admin-running-services-table th,
#page-admin .admin-completed-services-table th{
  height:56px!important;
  min-height:56px!important;
  padding:8px 6px!important;
  white-space:normal!important;
  overflow-wrap:anywhere!important;
  word-break:normal!important;
  text-align:center!important;
  font-size:.72rem!important;
  line-height:1.18!important;
}

#page-admin .admin-services-table td,
#page-admin .admin-running-services-table td,
#page-admin .admin-completed-services-table td{
  font-size:.76rem!important;
  font-variant-numeric:tabular-nums!important;
}


#page-admin .admin-services-table th:nth-child(1),#page-admin .admin-services-table td:nth-child(1){width:8%!important;text-align:left!important;}
#page-admin .admin-services-table th:nth-child(2),#page-admin .admin-services-table td:nth-child(2){width:7%!important;text-align:center!important;white-space:nowrap!important;}
#page-admin .admin-services-table th:nth-child(3),#page-admin .admin-services-table td:nth-child(3){width:11%!important;text-align:left!important;}
#page-admin .admin-services-table th:nth-child(4),#page-admin .admin-services-table td:nth-child(4){width:9%!important;text-align:center!important;white-space:nowrap!important;}
#page-admin .admin-services-table th:nth-child(5),#page-admin .admin-services-table td:nth-child(5){width:12%!important;text-align:left!important;white-space:normal!important;overflow-wrap:anywhere!important;}
#page-admin .admin-services-table th:nth-child(6),#page-admin .admin-services-table td:nth-child(6){width:8%!important;text-align:center!important;}
#page-admin .admin-services-table th:nth-child(7),#page-admin .admin-services-table td:nth-child(7){width:8%!important;text-align:center!important;}
#page-admin .admin-services-table th:nth-child(8),#page-admin .admin-services-table td:nth-child(8){width:8%!important;text-align:left!important;white-space:normal!important;overflow-wrap:anywhere!important;}
#page-admin .admin-services-table th:nth-child(9),#page-admin .admin-services-table td:nth-child(9){width:8%!important;text-align:left!important;white-space:normal!important;overflow-wrap:anywhere!important;}
#page-admin .admin-services-table th:nth-child(10),#page-admin .admin-services-table td:nth-child(10){width:7%!important;text-align:center!important;}
#page-admin .admin-services-table th:nth-child(11),#page-admin .admin-services-table td:nth-child(11){width:6%!important;text-align:center!important;white-space:normal!important;overflow-wrap:anywhere!important;}
#page-admin .admin-services-table th:nth-child(12),#page-admin .admin-services-table td:nth-child(12){width:8%!important;text-align:center!important;white-space:normal!important;}


#page-admin .admin-running-services-table th:nth-child(1),#page-admin .admin-running-services-table td:nth-child(1){width:9%!important;text-align:left!important;}
#page-admin .admin-running-services-table th:nth-child(2),#page-admin .admin-running-services-table td:nth-child(2){width:7%!important;text-align:center!important;white-space:nowrap!important;}
#page-admin .admin-running-services-table th:nth-child(3),#page-admin .admin-running-services-table td:nth-child(3){width:11%!important;text-align:left!important;}
#page-admin .admin-running-services-table th:nth-child(4),#page-admin .admin-running-services-table td:nth-child(4){width:9%!important;text-align:center!important;white-space:nowrap!important;}
#page-admin .admin-running-services-table th:nth-child(5),#page-admin .admin-running-services-table td:nth-child(5){width:12%!important;text-align:left!important;white-space:normal!important;overflow-wrap:anywhere!important;}
#page-admin .admin-running-services-table th:nth-child(6),#page-admin .admin-running-services-table td:nth-child(6){width:8%!important;text-align:center!important;}
#page-admin .admin-running-services-table th:nth-child(7),#page-admin .admin-running-services-table td:nth-child(7){width:8%!important;text-align:center!important;}
#page-admin .admin-running-services-table th:nth-child(8),#page-admin .admin-running-services-table td:nth-child(8){width:8%!important;text-align:left!important;white-space:normal!important;overflow-wrap:anywhere!important;}
#page-admin .admin-running-services-table th:nth-child(9),#page-admin .admin-running-services-table td:nth-child(9){width:8%!important;text-align:center!important;}
#page-admin .admin-running-services-table th:nth-child(10),#page-admin .admin-running-services-table td:nth-child(10){width:7%!important;text-align:center!important;white-space:normal!important;overflow-wrap:anywhere!important;}
#page-admin .admin-running-services-table th:nth-child(11),#page-admin .admin-running-services-table td:nth-child(11){width:13%!important;text-align:center!important;}


#page-admin .admin-completed-services-table th:nth-child(1),#page-admin .admin-completed-services-table td:nth-child(1){width:8%!important;text-align:left!important;}
#page-admin .admin-completed-services-table th:nth-child(2),#page-admin .admin-completed-services-table td:nth-child(2){width:7%!important;text-align:center!important;white-space:nowrap!important;}
#page-admin .admin-completed-services-table th:nth-child(3),#page-admin .admin-completed-services-table td:nth-child(3){width:7%!important;text-align:center!important;white-space:nowrap!important;}
#page-admin .admin-completed-services-table th:nth-child(4),#page-admin .admin-completed-services-table td:nth-child(4){width:11%!important;text-align:left!important;}
#page-admin .admin-completed-services-table th:nth-child(5),#page-admin .admin-completed-services-table td:nth-child(5){width:12%!important;text-align:left!important;white-space:normal!important;overflow-wrap:anywhere!important;}
#page-admin .admin-completed-services-table th:nth-child(6),#page-admin .admin-completed-services-table td:nth-child(6){width:8%!important;text-align:center!important;}
#page-admin .admin-completed-services-table th:nth-child(7),#page-admin .admin-completed-services-table td:nth-child(7){width:8%!important;text-align:center!important;}
#page-admin .admin-completed-services-table th:nth-child(8),#page-admin .admin-completed-services-table td:nth-child(8){width:8%!important;text-align:left!important;white-space:normal!important;overflow-wrap:anywhere!important;}
#page-admin .admin-completed-services-table th:nth-child(9),#page-admin .admin-completed-services-table td:nth-child(9){width:6%!important;text-align:center!important;white-space:normal!important;overflow-wrap:anywhere!important;}
#page-admin .admin-completed-services-table th:nth-child(10),#page-admin .admin-completed-services-table td:nth-child(10){width:7%!important;text-align:center!important;white-space:normal!important;}
#page-admin .admin-completed-services-table th:nth-child(11),#page-admin .admin-completed-services-table td:nth-child(11){width:7%!important;text-align:center!important;}
#page-admin .admin-completed-services-table th:nth-child(12),#page-admin .admin-completed-services-table td:nth-child(12){width:11%!important;text-align:center!important;}


#page-admin .admin-services-table .admin-gmaps-link,
#page-admin .admin-running-services-table .admin-gmaps-link,
#page-admin .admin-completed-services-table .admin-gmaps-link,
#page-admin .admin-services-table td .btn-secondary.small,
#page-admin .admin-running-services-table td .btn-secondary.small,
#page-admin .admin-completed-services-table td .btn-secondary.small{
  display:flex!important;
  flex:1 1 auto!important;
  align-items:center!important;
  justify-content:center!important;
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  height:38px!important;
  min-height:38px!important;
  margin:0 auto!important;
  padding:4px 5px!important;
  box-sizing:border-box!important;
  font-size:.67rem!important;
  line-height:1.1!important;
  white-space:normal!important;
  overflow:hidden!important;
  text-overflow:clip!important;
  word-break:normal!important;
}
#page-admin .admin-running-services-table .admin-action-stack{
  display:flex!important;
  flex-direction:column!important;
  align-items:stretch!important;
  justify-content:center!important;
  gap:4px!important;
  width:100%!important;
  min-width:0!important;
}
#page-admin .admin-running-services-table .admin-action-stack button{
  width:100%!important;
  min-width:0!important;
  max-width:100%!important;
  min-height:30px!important;
  height:30px!important;
  padding:4px!important;
  font-size:.66rem!important;
  line-height:1!important;
}
#page-admin .admin-completed-services-table td:nth-child(12) .btn-secondary.small{
  width:100%!important;
}


#page-admin .admin-services-table .status-badge,
#page-admin .admin-running-services-table .status-badge,
#page-admin .admin-completed-services-table .status-badge,
#page-admin .admin-report-table .status-badge{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  max-width:100%!important;
  min-width:0!important;
  min-height:28px!important;
  padding:5px 8px!important;
  font-size:.62rem!important;
  line-height:1.05!important;
  white-space:normal!important;
  overflow-wrap:anywhere!important;
  word-break:break-word!important;
  text-align:center!important;
}


#page-admin .admin-customers-table{
  width:100%!important;min-width:0!important;max-width:100%!important;table-layout:fixed!important;border-collapse:collapse!important;
}
#page-admin .admin-customers-table th,#page-admin .admin-customers-table td{
  box-sizing:border-box!important;vertical-align:middle!important;line-height:1.3!important;padding:10px 8px!important;
  overflow:hidden!important;text-overflow:ellipsis!important;
}
#page-admin .admin-customers-table th{font-size:.72rem!important;white-space:normal!important;text-align:center!important;}
#page-admin .admin-customers-table td{font-size:.76rem!important;}
#page-admin .admin-customers-table th:nth-child(1),#page-admin .admin-customers-table td:nth-child(1){width:18%!important;text-align:left!important;white-space:normal!important;overflow-wrap:anywhere!important;}
#page-admin .admin-customers-table th:nth-child(2),#page-admin .admin-customers-table td:nth-child(2){width:15%!important;text-align:left!important;white-space:nowrap!important;}
#page-admin .admin-customers-table th:nth-child(3),#page-admin .admin-customers-table td:nth-child(3){width:10%!important;text-align:center!important;}
#page-admin .admin-customers-table th:nth-child(4),#page-admin .admin-customers-table td:nth-child(4){width:11%!important;text-align:center!important;}
#page-admin .admin-customers-table th:nth-child(5),#page-admin .admin-customers-table td:nth-child(5){width:12%!important;text-align:center!important;}
#page-admin .admin-customers-table th:nth-child(6),#page-admin .admin-customers-table td:nth-child(6){width:15%!important;text-align:center!important;}
#page-admin .admin-customers-table th:nth-child(7),#page-admin .admin-customers-table td:nth-child(7){width:11%!important;text-align:center!important;}
#page-admin .admin-customers-table th:nth-child(8),#page-admin .admin-customers-table td:nth-child(8){width:8%!important;text-align:center!important;}


#page-admin .admin-tech-management-table{
  width:100%!important;min-width:0!important;max-width:100%!important;table-layout:fixed!important;border-collapse:collapse!important;
}
#page-admin .admin-tech-management-table th,#page-admin .admin-tech-management-table td{
  box-sizing:border-box!important;vertical-align:middle!important;line-height:1.3!important;padding:10px 8px!important;overflow:hidden!important;text-overflow:ellipsis!important;
}
#page-admin .admin-tech-management-table th{font-size:.72rem!important;white-space:normal!important;text-align:center!important;}
#page-admin .admin-tech-management-table td{font-size:.76rem!important;}
#page-admin .admin-tech-management-table th:nth-child(1),#page-admin .admin-tech-management-table td:nth-child(1){width:22%!important;text-align:left!important;white-space:normal!important;overflow-wrap:anywhere!important;}
#page-admin .admin-tech-management-table th:nth-child(2),#page-admin .admin-tech-management-table td:nth-child(2){width:13%!important;text-align:left!important;}
#page-admin .admin-tech-management-table th:nth-child(3),#page-admin .admin-tech-management-table td:nth-child(3){width:13%!important;text-align:center!important;}
#page-admin .admin-tech-management-table th:nth-child(4),#page-admin .admin-tech-management-table td:nth-child(4){width:11%!important;text-align:center!important;}
#page-admin .admin-tech-management-table th:nth-child(5),#page-admin .admin-tech-management-table td:nth-child(5){width:12%!important;text-align:center!important;}
#page-admin .admin-tech-management-table th:nth-child(6),#page-admin .admin-tech-management-table td:nth-child(6){width:12%!important;text-align:center!important;}
#page-admin .admin-tech-management-table th:nth-child(7),#page-admin .admin-tech-management-table td:nth-child(7){width:17%!important;text-align:center!important;}
#page-admin .admin-tech-management-table .admin-tech-actions{display:flex!important;flex-direction:column!important;align-items:stretch!important;justify-content:center!important;gap:4px!important;width:100%!important;min-width:0!important;}
#page-admin .admin-tech-management-table .admin-tech-actions button{width:100%!important;min-width:0!important;max-width:100%!important;height:30px!important;min-height:30px!important;padding:4px!important;font-size:.66rem!important;line-height:1!important;white-space:normal!important;}


#page-admin .admin-services-table td:nth-child(2),#page-admin .admin-services-table td:nth-child(4),#page-admin .admin-services-table td:nth-child(6),#page-admin .admin-services-table td:nth-child(7),#page-admin .admin-services-table td:nth-child(10),#page-admin .admin-services-table td:nth-child(11),#page-admin .admin-services-table td:nth-child(12),
#page-admin .admin-running-services-table td:nth-child(2),#page-admin .admin-running-services-table td:nth-child(4),#page-admin .admin-running-services-table td:nth-child(6),#page-admin .admin-running-services-table td:nth-child(7),#page-admin .admin-running-services-table td:nth-child(9),#page-admin .admin-running-services-table td:nth-child(10),#page-admin .admin-running-services-table td:nth-child(11),
#page-admin .admin-completed-services-table td:nth-child(2),#page-admin .admin-completed-services-table td:nth-child(3),#page-admin .admin-completed-services-table td:nth-child(6),#page-admin .admin-completed-services-table td:nth-child(7),#page-admin .admin-completed-services-table td:nth-child(9),#page-admin .admin-completed-services-table td:nth-child(10),#page-admin .admin-completed-services-table td:nth-child(11),#page-admin .admin-completed-services-table td:nth-child(12){
  text-align:center!important;vertical-align:middle!important;font-variant-numeric:tabular-nums!important;
}


@media(min-width:1101px){
  #page-admin .admin-services-table th,#page-admin .admin-services-table td,
  #page-admin .admin-running-services-table th,#page-admin .admin-running-services-table td,
  #page-admin .admin-completed-services-table th,#page-admin .admin-completed-services-table td{
    padding-left:8px!important;padding-right:8px!important;font-size:.78rem!important;
  }
}


@media(max-width:900px){
  #page-admin .admin-services-table,#page-admin .admin-running-services-table,#page-admin .admin-completed-services-table{
    width:1120px!important;min-width:1120px!important;max-width:none!important;
  }
  #page-admin .admin-services-table th,#page-admin .admin-services-table td,
  #page-admin .admin-running-services-table th,#page-admin .admin-running-services-table td,
  #page-admin .admin-completed-services-table th,#page-admin .admin-completed-services-table td{
    height:66px!important;min-height:66px!important;font-size:.70rem!important;padding:8px 6px!important;
  }
  #page-admin .admin-customers-table,#page-admin .admin-tech-management-table{
    width:900px!important;min-width:900px!important;max-width:none!important;
  }
}

/* ===== ORIGINAL STYLE BLOCK 23 id="admin-final-layout-v4" ===== */
body.admin-mode { overflow-x:hidden !important; }
.admin-content, .admin-main, .admin-page, .admin-card { min-width:0 !important; max-width:100% !important; }
.admin-card { overflow:visible !important; }


.admin-table-wrap,
.admin-activity-table-wrap,
.admin-customers-table-wrap,
.admin-tech-management-wrap {
  width:100% !important;
  max-width:100% !important;
  min-width:0 !important;
  overflow-x:auto !important;
  overflow-y:hidden !important;
  -webkit-overflow-scrolling:touch !important;
  overscroll-behavior-inline:contain !important;
  scrollbar-width:thin !important;
}


.admin-services-table,
.admin-running-services-table,
.admin-completed-services-table,
.admin-activity-table,
.admin-customers-table,
.admin-tech-management-table {
  table-layout:auto !important;
  border-collapse:separate !important;
  border-spacing:0 !important;
  width:max-content !important;
  max-width:none !important;
  margin:0 !important;
}


.admin-services-table,
.admin-completed-services-table,
.admin-activity-table { min-width:1810px !important; }
.admin-running-services-table { min-width:1690px !important; }
.admin-customers-table { min-width:1120px !important; }
.admin-tech-management-table { min-width:980px !important; }


.admin-services-table th, .admin-services-table td,
.admin-running-services-table th, .admin-running-services-table td,
.admin-completed-services-table th, .admin-completed-services-table td,
.admin-activity-table th, .admin-activity-table td,
.admin-customers-table th, .admin-customers-table td,
.admin-tech-management-table th, .admin-tech-management-table td {
  box-sizing:border-box !important;
  vertical-align:middle !important;
  line-height:1.35 !important;
}


.admin-services-table th, .admin-running-services-table th,
.admin-completed-services-table th, .admin-activity-table th,
.admin-customers-table th, .admin-tech-management-table th {
  height:64px !important;
  padding:14px 12px !important;
  white-space:normal !important;
  word-break:normal !important;
  overflow-wrap:normal !important;
  text-align:center !important;
}


.admin-services-table td, .admin-running-services-table td,
.admin-completed-services-table td, .admin-activity-table td,
.admin-customers-table td, .admin-tech-management-table td {
  min-height:72px !important;
  padding:16px 12px !important;
  white-space:nowrap !important;
  word-break:normal !important;
  overflow-wrap:normal !important;
}


.admin-services-table td:nth-child(3), .admin-running-services-table td:nth-child(3),
.admin-completed-services-table td:nth-child(3), .admin-activity-table td:nth-child(3),
.admin-services-table td:nth-child(5), .admin-running-services-table td:nth-child(5),
.admin-completed-services-table td:nth-child(5), .admin-activity-table td:nth-child(5),
.admin-services-table td:nth-child(8), .admin-running-services-table td:nth-child(8),
.admin-services-table td:nth-child(9), .admin-activity-table td:nth-child(8),
.admin-activity-table td:nth-child(9) {
  white-space:normal !important;
  overflow-wrap:anywhere !important;
  word-break:normal !important;
}


.admin-services-table th:nth-child(1), .admin-services-table td:nth-child(1),
.admin-activity-table th:nth-child(1), .admin-activity-table td:nth-child(1),
.admin-completed-services-table th:nth-child(1), .admin-completed-services-table td:nth-child(1) { width:150px !important; min-width:150px !important; }
.admin-services-table th:nth-child(2), .admin-services-table td:nth-child(2),
.admin-activity-table th:nth-child(2), .admin-activity-table td:nth-child(2),
.admin-completed-services-table th:nth-child(2), .admin-completed-services-table td:nth-child(2) { width:120px !important; min-width:120px !important; }
.admin-services-table th:nth-child(3), .admin-services-table td:nth-child(3),
.admin-activity-table th:nth-child(3), .admin-activity-table td:nth-child(3),
.admin-completed-services-table th:nth-child(3), .admin-completed-services-table td:nth-child(3) { width:180px !important; min-width:180px !important; max-width:180px !important; }
.admin-services-table th:nth-child(4), .admin-services-table td:nth-child(4),
.admin-activity-table th:nth-child(4), .admin-activity-table td:nth-child(4),
.admin-completed-services-table th:nth-child(4), .admin-completed-services-table td:nth-child(4) { width:150px !important; min-width:150px !important; }
.admin-services-table th:nth-child(5), .admin-services-table td:nth-child(5),
.admin-activity-table th:nth-child(5), .admin-activity-table td:nth-child(5),
.admin-completed-services-table th:nth-child(5), .admin-completed-services-table td:nth-child(5) { width:230px !important; min-width:230px !important; max-width:230px !important; }
.admin-services-table th:nth-child(6), .admin-services-table td:nth-child(6),
.admin-activity-table th:nth-child(6), .admin-activity-table td:nth-child(6),
.admin-completed-services-table th:nth-child(6), .admin-completed-services-table td:nth-child(6) { width:145px !important; min-width:145px !important; text-align:center !important; }
.admin-services-table th:nth-child(7), .admin-services-table td:nth-child(7),
.admin-activity-table th:nth-child(7), .admin-activity-table td:nth-child(7),
.admin-completed-services-table th:nth-child(7), .admin-completed-services-table td:nth-child(7) { width:145px !important; min-width:145px !important; text-align:center !important; }
.admin-services-table th:nth-child(8), .admin-services-table td:nth-child(8),
.admin-activity-table th:nth-child(8), .admin-activity-table td:nth-child(8),
.admin-completed-services-table th:nth-child(8), .admin-completed-services-table td:nth-child(8) { width:150px !important; min-width:150px !important; }
.admin-services-table th:nth-child(9), .admin-services-table td:nth-child(9),
.admin-activity-table th:nth-child(9), .admin-activity-table td:nth-child(9),
.admin-completed-services-table th:nth-child(9), .admin-completed-services-table td:nth-child(9) { width:180px !important; min-width:180px !important; }
.admin-services-table th:nth-child(10), .admin-services-table td:nth-child(10),
.admin-activity-table th:nth-child(10), .admin-activity-table td:nth-child(10),
.admin-completed-services-table th:nth-child(10), .admin-completed-services-table td:nth-child(10) { width:125px !important; min-width:125px !important; text-align:center !important; }
.admin-services-table th:nth-child(11), .admin-services-table td:nth-child(11),
.admin-activity-table th:nth-child(11), .admin-activity-table td:nth-child(11),
.admin-completed-services-table th:nth-child(11), .admin-completed-services-table td:nth-child(11) { width:140px !important; min-width:140px !important; }
.admin-services-table th:nth-child(12), .admin-services-table td:nth-child(12),
.admin-activity-table th:nth-child(12), .admin-activity-table td:nth-child(12),
.admin-completed-services-table th:nth-child(12), .admin-completed-services-table td:nth-child(12) { width:120px !important; min-width:120px !important; text-align:center !important; }


.admin-running-services-table th:nth-child(1), .admin-running-services-table td:nth-child(1) { width:150px !important; min-width:150px !important; }
.admin-running-services-table th:nth-child(2), .admin-running-services-table td:nth-child(2) { width:120px !important; min-width:120px !important; }
.admin-running-services-table th:nth-child(3), .admin-running-services-table td:nth-child(3) { width:180px !important; min-width:180px !important; max-width:180px !important; }
.admin-running-services-table th:nth-child(4), .admin-running-services-table td:nth-child(4) { width:150px !important; min-width:150px !important; }
.admin-running-services-table th:nth-child(5), .admin-running-services-table td:nth-child(5) { width:230px !important; min-width:230px !important; max-width:230px !important; }
.admin-running-services-table th:nth-child(6), .admin-running-services-table td:nth-child(6),
.admin-running-services-table th:nth-child(7), .admin-running-services-table td:nth-child(7) { width:145px !important; min-width:145px !important; text-align:center !important; }
.admin-running-services-table th:nth-child(8), .admin-running-services-table td:nth-child(8) { width:150px !important; min-width:150px !important; white-space:normal !important; }
.admin-running-services-table th:nth-child(9), .admin-running-services-table td:nth-child(9) { width:125px !important; min-width:125px !important; text-align:center !important; }
.admin-running-services-table th:nth-child(10), .admin-running-services-table td:nth-child(10) { width:140px !important; min-width:140px !important; }
.admin-running-services-table th:nth-child(11), .admin-running-services-table td:nth-child(11) { width:155px !important; min-width:155px !important; text-align:center !important; }


.admin-gmaps-link,
.admin-table td .btn-secondary.small[data-tech-customer-media] {
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  position:static !important;
  transform:none !important;
  width:120px !important;
  min-width:120px !important;
  max-width:120px !important;
  height:46px !important;
  min-height:46px !important;
  max-height:46px !important;
  margin:0 auto !important;
  padding:7px 10px !important;
  box-sizing:border-box !important;
  border-radius:12px !important;
  line-height:1.15 !important;
  text-align:center !important;
  white-space:normal !important;
  overflow:hidden !important;
  word-break:normal !important;
}
.admin-table td:has(> .admin-gmaps-link),
.admin-table td:has(> .admin-gmaps-link) + td { text-align:center !important; vertical-align:middle !important; }


.admin-services-table .status-badge,
.admin-running-services-table .status-badge,
.admin-completed-services-table .status-badge,
.admin-activity-table .status-badge { display:inline-flex !important; align-items:center !important; justify-content:center !important; white-space:nowrap !important; width:auto !important; min-width:92px !important; max-width:none !important; height:38px !important; padding:0 12px !important; line-height:1 !important; }


.admin-table td:last-child .admin-action-stack,
.admin-tech-actions,
.admin-action-stack { display:flex !important; flex-direction:column !important; align-items:stretch !important; justify-content:center !important; gap:8px !important; width:100% !important; margin:0 !important; }
.admin-table td:last-child .admin-action-stack > button,
.admin-tech-actions > button,
.admin-action-stack > button { width:100% !important; min-width:0 !important; min-height:40px !important; margin:0 !important; position:static !important; transform:none !important; }


.admin-customers-table th:nth-child(1), .admin-customers-table td:nth-child(1) { width:190px !important; min-width:190px !important; text-align:left !important; }
.admin-customers-table th:nth-child(2), .admin-customers-table td:nth-child(2) { width:160px !important; min-width:160px !important; }
.admin-customers-table th:nth-child(3), .admin-customers-table td:nth-child(3),
.admin-customers-table th:nth-child(4), .admin-customers-table td:nth-child(4),
.admin-customers-table th:nth-child(5), .admin-customers-table td:nth-child(5) { width:130px !important; min-width:130px !important; text-align:center !important; font-variant-numeric:tabular-nums !important; }
.admin-customers-table th:nth-child(6), .admin-customers-table td:nth-child(6) { width:170px !important; min-width:170px !important; text-align:right !important; font-variant-numeric:tabular-nums !important; }
.admin-customers-table th:nth-child(7), .admin-customers-table td:nth-child(7) { width:145px !important; min-width:145px !important; text-align:center !important; }
.admin-customers-table th:nth-child(8), .admin-customers-table td:nth-child(8) { width:110px !important; min-width:110px !important; text-align:center !important; }
.admin-customers-table td:nth-child(1) { white-space:normal !important; overflow-wrap:anywhere !important; font-weight:600 !important; }
.admin-customers-table td:nth-child(n+2) { vertical-align:middle !important; }
.admin-customers-table td:last-child .btn-secondary.small { width:88px !important; min-width:88px !important; min-height:42px !important; margin:0 auto !important; }


.admin-activity-card { min-width:0 !important; overflow:hidden !important; }
.admin-activity-card .admin-card-header { display:flex !important; align-items:center !important; justify-content:space-between !important; gap:16px !important; flex-wrap:wrap !important; }
.admin-activity-card .admin-card-header h3 { margin:0 !important; }
.admin-activity-table-wrap { margin-top:4px !important; border-radius:12px !important; }
.admin-activity-table { min-width:1810px !important; }


.admin-card .filter-grid { width:100% !important; min-width:0 !important; box-sizing:border-box !important; }
.admin-service-filter-bar { min-width:0 !important; }
.admin-service-search-input { min-width:0 !important; max-width:100% !important; box-sizing:border-box !important; }

@media (max-width:900px){
  .admin-services-table, .admin-completed-services-table, .admin-activity-table { min-width:1810px !important; }
  .admin-running-services-table { min-width:1690px !important; }
  .admin-customers-table { min-width:1120px !important; }
  .admin-table th { font-size:.78rem !important; }
  .admin-table td { font-size:.82rem !important; }
}

/* Dark mode: admin dashboard and technician detail panel */
html[data-leressae-theme="dark"] .admin-card,
html[data-theme="dark"] .admin-card,
body.dark-mode .admin-card {
    background: #0d1b2a !important;
    border-color: #29425e !important;
    color: #edf6ff !important;
    box-shadow: 0 12px 30px rgba(0,0,0,.22) !important;
}

html[data-leressae-theme="dark"] .admin-card-header h3,
html[data-theme="dark"] .admin-card-header h3,
body.dark-mode .admin-card-header h3,
html[data-leressae-theme="dark"] .admin-card h3,
html[data-theme="dark"] .admin-card h3,
body.dark-mode .admin-card h3 {
    color: #f8fbff !important;
}

html[data-leressae-theme="dark"] .admin-stat-mini,
html[data-theme="dark"] .admin-stat-mini,
body.dark-mode .admin-stat-mini {
    background: linear-gradient(135deg, #132538 0%, #10263a 100%) !important;
    border-color: #35506d !important;
}

html[data-leressae-theme="dark"] .admin-stat-mini .label,
html[data-theme="dark"] .admin-stat-mini .label,
body.dark-mode .admin-stat-mini .label,
html[data-leressae-theme="dark"] .admin-info-label,
html[data-theme="dark"] .admin-info-label,
body.dark-mode .admin-info-label,
html[data-leressae-theme="dark"] .settings-field label,
html[data-theme="dark"] .settings-field label,
body.dark-mode .settings-field label {
    color: #b9c8da !important;
}

html[data-leressae-theme="dark"] .admin-stat-mini .value,
html[data-theme="dark"] .admin-stat-mini .value,
body.dark-mode .admin-stat-mini .value,
html[data-leressae-theme="dark"] .admin-info-value,
html[data-theme="dark"] .admin-info-value,
body.dark-mode .admin-info-value,
html[data-leressae-theme="dark"] .api-url-text,
html[data-theme="dark"] .api-url-text,
body.dark-mode .api-url-text {
    color: #f3f8ff !important;
}

html[data-leressae-theme="dark"] .admin-info-card,
html[data-theme="dark"] .admin-info-card,
body.dark-mode .admin-info-card {
    background: linear-gradient(180deg, #102033 0%, #0f2033 100%) !important;
    border-color: #35506d !important;
    box-shadow: 0 10px 22px rgba(15, 23, 42, 0.12) !important;
}

html[data-leressae-theme="dark"] .chart-box,
html[data-theme="dark"] .chart-box,
body.dark-mode .chart-box {
    background: #102133 !important;
    border-color: #36516d !important;
}

html[data-leressae-theme="dark"] .chart-box h4,
html[data-theme="dark"] .chart-box h4,
body.dark-mode .chart-box h4 {
    color: #ebf3ff !important;
}

html[data-leressae-theme="dark"] .line-chart-axis,
html[data-theme="dark"] .line-chart-axis,
body.dark-mode .line-chart-axis {
    fill: #b9c8da !important;
}

html[data-leressae-theme="dark"] .line-chart-grid,
html[data-theme="dark"] .line-chart-grid,
body.dark-mode .line-chart-grid {
    stroke: #35506d !important;
}

html[data-leressae-theme="dark"] .copy-api-btn,
html[data-theme="dark"] .copy-api-btn,
body.dark-mode .copy-api-btn {
    background: #17314d !important;
    border-color: #3d6289 !important;
    color: #eaf4ff !important;
}

html[data-leressae-theme="dark"] .copy-api-btn:hover,
html[data-theme="dark"] .copy-api-btn:hover,
body.dark-mode .copy-api-btn:hover {
    background: #1d3d5e !important;
}

/* ===== ORIGINAL STYLE BLOCK 24 id="leressae-settings-dark-fix" ===== */
html[data-leressae-theme="dark"] .settings-card,
html[data-theme="dark"] .settings-card,
body.dark-mode .settings-card{
    background:#0d1b2a !important;
    color:#e8eef7 !important;
    border-color:#29425e !important;
    box-shadow:0 12px 30px rgba(0,0,0,.28) !important;
}

html[data-leressae-theme="dark"] .settings-card-header,
html[data-theme="dark"] .settings-card-header,
body.dark-mode .settings-card-header{
    background:#0d1b2a !important;
    color:#f1f5f9 !important;
    border-color:#29425e !important;
}

html[data-leressae-theme="dark"] .settings-card-title,
html[data-theme="dark"] .settings-card-title,
body.dark-mode .settings-card-title{
    color:#f4f7fb !important;
}

html[data-leressae-theme="dark"] .settings-card-title-wrap,
html[data-theme="dark"] .settings-card-title-wrap,
body.dark-mode .settings-card-title-wrap{
    color:#f4f7fb !important;
}

html[data-leressae-theme="dark"] .settings-card-icon,
html[data-theme="dark"] .settings-card-icon,
body.dark-mode .settings-card-icon{
    background:#17314d !important;
    color:#dcecff !important;
    border-color:#2f506f !important;
}

html[data-leressae-theme="dark"] .settings-card-icon svg,
html[data-theme="dark"] .settings-card-icon svg,
body.dark-mode .settings-card-icon svg{
    stroke:#e8f3ff !important;
}

html[data-leressae-theme="dark"] .settings-card-subtitle,
html[data-theme="dark"] .settings-card-subtitle,
body.dark-mode .settings-card-subtitle{
    color:#9fb2c9 !important;
}

html[data-leressae-theme="dark"] .settings-card-body,
html[data-theme="dark"] .settings-card-body,
body.dark-mode .settings-card-body{
    background:#0d1b2a !important;
    color:#dce7f3 !important;
}

html[data-leressae-theme="dark"] .settings-field label,
html[data-theme="dark"] .settings-field label,
body.dark-mode .settings-field label{
    color:#b9c8da !important;
}

html[data-leressae-theme="dark"] .settings-field input,
html[data-leressae-theme="dark"] .settings-field select,
html[data-leressae-theme="dark"] .settings-api-input,
html[data-theme="dark"] .settings-field input,
html[data-theme="dark"] .settings-field select,
html[data-theme="dark"] .settings-api-input,
body.dark-mode .settings-field input,
body.dark-mode .settings-field select,
body.dark-mode .settings-api-input{
    background:#0a1726 !important;
    color:#f1f5f9 !important;
    border-color:#36516d !important;
    -webkit-text-fill-color:#f1f5f9 !important;
}

html[data-leressae-theme="dark"] .settings-field input::placeholder,
html[data-leressae-theme="dark"] .settings-api-input::placeholder,
html[data-theme="dark"] .settings-field input::placeholder,
html[data-theme="dark"] .settings-api-input::placeholder,
body.dark-mode .settings-field input::placeholder,
body.dark-mode .settings-api-input::placeholder{
    color:#7188a2 !important;
    -webkit-text-fill-color:#7188a2 !important;
}

html[data-leressae-theme="dark"] .settings-field select option,
html[data-theme="dark"] .settings-field select option,
body.dark-mode .settings-field select option{
    background:#0a1726 !important;
    color:#f1f5f9 !important;
}

html[data-leressae-theme="dark"] .settings-api-row,
html[data-theme="dark"] .settings-api-row,
body.dark-mode .settings-api-row{
    color:#e8eef7 !important;
}

html[data-leressae-theme="dark"] .settings-copy-btn,
html[data-leressae-theme="dark"] .settings-primary-btn,
html[data-theme="dark"] .settings-copy-btn,
html[data-theme="dark"] .settings-primary-btn,
body.dark-mode .settings-copy-btn,
body.dark-mode .settings-primary-btn{
    background:#19382d !important;
    color:#d8eee1 !important;
    border-color:#3a6957 !important;
}

html[data-leressae-theme="dark"] .settings-test-btn,
html[data-theme="dark"] .settings-test-btn,
body.dark-mode .settings-test-btn{
    color:#ffffff !important;
}

html[data-leressae-theme="dark"] .settings-test-btn:disabled,
html[data-theme="dark"] .settings-test-btn:disabled,
body.dark-mode .settings-test-btn:disabled{
    background:#1a3027 !important;
    color:#a8c2b7 !important;
    border-color:#355447 !important;
    opacity:1 !important;
}

html[data-leressae-theme="dark"] .settings-status-row,
html[data-theme="dark"] .settings-status-row,
body.dark-mode .settings-status-row{
    color:#d8eee1 !important;
}

html[data-leressae-theme="dark"] .settings-status-note,
html[data-theme="dark"] .settings-status-note,
body.dark-mode .settings-status-note{
    color:#a8c2b7 !important;
}

html[data-leressae-theme="dark"] .settings-integration-list,
html[data-theme="dark"] .settings-integration-list,
body.dark-mode .settings-integration-list{
    border-top-color:#315448 !important;
}

html[data-leressae-theme="dark"] .settings-integration-item,
html[data-theme="dark"] .settings-integration-item,
body.dark-mode .settings-integration-item{
    border-bottom-color:#2c4438 !important;
    color:#e4f3ec !important;
}

html[data-leressae-theme="dark"] .settings-google-icon,
html[data-theme="dark"] .settings-google-icon,
body.dark-mode .settings-google-icon{
    background:#19382d !important;
    border-color:#3a6957 !important;
    color:#d8eee1 !important;
}


html[data-leressae-theme="dark"] .settings-google-icon.form,
html[data-theme="dark"] .settings-google-icon.form,
body.dark-mode .settings-google-icon.form{
    background:linear-gradient(135deg,#17382f 0%,#123027 100%) !important;
    color:#a8e0c8 !important;
    border-color:#3a6957 !important;
}
html[data-leressae-theme="dark"] .settings-google-icon.sheet,
html[data-theme="dark"] .settings-google-icon.sheet,
body.dark-mode .settings-google-icon.sheet{
    background:linear-gradient(135deg,#123c2b 0%,#164d35 100%) !important;
    color:#86efac !important;
    border-color:#327254 !important;
}

html[data-leressae-theme="dark"] .settings-google-name,
html[data-theme="dark"] .settings-google-name,
body.dark-mode .settings-google-name{
    color:#f0f5fb !important;
}

html[data-leressae-theme="dark"] .settings-google-sub,
html[data-theme="dark"] .settings-google-sub,
body.dark-mode .settings-google-sub{
    color:#9fb2c9 !important;
}

html[data-leressae-theme="dark"] .settings-google-sub a,
html[data-theme="dark"] .settings-google-sub a,
body.dark-mode .settings-google-sub a{
    color:#8ddbb9 !important;
}

html[data-leressae-theme="dark"] .settings-google-state.success,
html[data-theme="dark"] .settings-google-state.success,
body.dark-mode .settings-google-state.success{
    background:#0d3025 !important;
    color:#86efac !important;
    border-color:#287553 !important;
}
html[data-leressae-theme="dark"] .settings-google-state.warning,
html[data-theme="dark"] .settings-google-state.warning,
body.dark-mode .settings-google-state.warning{
    background:#3a2613 !important;
    color:#fdba74 !important;
    border-color:#8a5a25 !important;
}
html[data-leressae-theme="dark"] .settings-google-state.danger,
html[data-theme="dark"] .settings-google-state.danger,
body.dark-mode .settings-google-state.danger{
    background:#3b171c !important;
    color:#fca5a5 !important;
    border-color:#8c3943 !important;
}
html[data-leressae-theme="dark"] .settings-google-state.neutral,
html[data-theme="dark"] .settings-google-state.neutral,
body.dark-mode .settings-google-state.neutral{
    background:#172a40 !important;
    color:#b9c8da !important;
    border-color:#3a526d !important;
}


html[data-leressae-theme="dark"] .settings-card [style*="#0f172a"],
html[data-leressae-theme="dark"] .settings-card [style*="#334155"],
html[data-leressae-theme="dark"] .settings-card [style*="#475569"],
html[data-leressae-theme="dark"] .settings-card [style*="#64748b"],
html[data-theme="dark"] .settings-card [style*="#0f172a"],
html[data-theme="dark"] .settings-card [style*="#334155"],
html[data-theme="dark"] .settings-card [style*="#475569"],
html[data-theme="dark"] .settings-card [style*="#64748b"],
body.dark-mode .settings-card [style*="#0f172a"],
body.dark-mode .settings-card [style*="#334155"],
body.dark-mode .settings-card [style*="#475569"],
body.dark-mode .settings-card [style*="#64748b"]{
    color:#dce7f3 !important;
    -webkit-text-fill-color:#dce7f3 !important;
}


html[data-leressae-theme="dark"] #admin-settings,
html[data-theme="dark"] #admin-settings,
body.dark-mode #admin-settings{
    color:#e8eef7 !important;
}

html[data-leressae-theme="dark"] #admin-settings .settings-card *,
html[data-theme="dark"] #admin-settings .settings-card *,
body.dark-mode #admin-settings .settings-card *{
    text-shadow:none;
}

/* ===== ORIGINAL STYLE BLOCK 25 id="leressae-dark-media-stock-sync" ===== */
/* Dark mode: Stock Flow */
html[data-leressae-theme="dark"] .stock-source-panel,
html[data-leressae-theme="dark"] .stock-source-panel .bon-total-table-scroll,
html[data-leressae-theme="dark"] .stock-source-panel .bon-total-table,
html[data-leressae-theme="dark"] .stock-source-panel .bon-total-table tbody,
body.dark-mode .stock-source-panel,
body.dark-mode .stock-source-panel .bon-total-table-scroll,
body.dark-mode .stock-source-panel .bon-total-table,
body.dark-mode .stock-source-panel .bon-total-table tbody {
    background:#101c2c !important;
    color:#e5edf7 !important;
}

html[data-leressae-theme="dark"] .stock-source-panel .bon-total-table-scroll,
body.dark-mode .stock-source-panel .bon-total-table-scroll {
    border-color:#334155 !important;
}

html[data-leressae-theme="dark"] .stock-source-panel .bon-total-table th,
body.dark-mode .stock-source-panel .bon-total-table th {
    background:#162437 !important;
    color:#f8fafc !important;
    border-color:#334155 !important;
}

html[data-leressae-theme="dark"] .stock-source-panel .bon-total-table td,
body.dark-mode .stock-source-panel .bon-total-table td {
    background:#101c2c !important;
    color:#dbe7f5 !important;
    border-color:#26384d !important;
}

html[data-leressae-theme="dark"] .stock-source-panel .bon-total-table tbody tr:nth-child(even) td,
body.dark-mode .stock-source-panel .bon-total-table tbody tr:nth-child(even) td {
    background:#152337 !important;
}

html[data-leressae-theme="dark"] .stock-source-panel .bon-total-table tbody tr:hover td,
body.dark-mode .stock-source-panel .bon-total-table tbody tr:hover td {
    background:#1b3048 !important;
    color:#ffffff !important;
}

html[data-leressae-theme="dark"] .stock-source-panel .bon-total-table .bon-total-group-row td,
body.dark-mode .stock-source-panel .bon-total-table .bon-total-group-row td {
    background:#19314b !important;
    color:#f8fafc !important;
    border-color:#3b526d !important;
}

html[data-leressae-theme="dark"] .stock-source-panel .bon-total-table .bon-total-summary-row td,
body.dark-mode .stock-source-panel .bon-total-table .bon-total-summary-row td {
    background:#24364b !important;
    color:#ffffff !important;
    border-color:#475569 !important;
}

html[data-leressae-theme="dark"] .stock-source-panel strong[style*="color:#0f172a"],
html[data-leressae-theme="dark"] .stock-source-panel strong[style*="color: #0f172a"],
body.dark-mode .stock-source-panel strong[style*="color:#0f172a"],
body.dark-mode .stock-source-panel strong[style*="color: #0f172a"] {
    color:#f8fafc !important;
}

html[data-leressae-theme="dark"] .stock-source-panel div[style*="color:#64748b"],
html[data-leressae-theme="dark"] .stock-source-panel div[style*="color: #64748b"],
body.dark-mode .stock-source-panel div[style*="color:#64748b"],
body.dark-mode .stock-source-panel div[style*="color: #64748b"] {
    color:#aebed0 !important;
}

/* Stock Flow: panel visibility and tab state are controlled by data attributes/JS. */
.stock-source-panel[data-stock-panel] {
    transition: opacity .15s ease;
}

html[data-leressae-theme="dark"] .stock-source-tab,
body.dark-mode .stock-source-tab {
    background:#172437 !important;
    color:#dbe7f5 !important;
    border-color:#3a4b60 !important;
}

html[data-leressae-theme="dark"] .stock-source-tab:hover,
body.dark-mode .stock-source-tab:hover {
    background:#20334b !important;
    color:#ffffff !important;
    border-color:#4b6682 !important;
}

html[data-leressae-theme="dark"] .stock-source-tab.active,
body.dark-mode .stock-source-tab.active {
    background:linear-gradient(135deg,#168c75 0%,#075e55 100%) !important;
    color:#ffffff !important;
    border-color:#78d0ac !important;
}

/* Dark mode: Update Media */
html[data-leressae-theme="dark"] .admin-media-layout,
body.dark-mode .admin-media-layout {
    color:#e5edf7 !important;
}

html[data-leressae-theme="dark"] .admin-media-panel,
body.dark-mode .admin-media-panel {
    background:#101c2c !important;
    border-color:#334155 !important;
    color:#e5edf7 !important;
    box-shadow:0 10px 24px rgba(0,0,0,.16) !important;
}

html[data-leressae-theme="dark"] .admin-media-panel .admin-card-header,
body.dark-mode .admin-media-panel .admin-card-header {
    border-bottom-color:#334155 !important;
}

html[data-leressae-theme="dark"] .admin-media-panel .admin-card-header h3,
body.dark-mode .admin-media-panel .admin-card-header h3,
html[data-leressae-theme="dark"] .admin-media-panel > h3,
body.dark-mode .admin-media-panel > h3 {
    color:#f8fafc !important;
}

html[data-leressae-theme="dark"] .admin-media-panel .section-sub-text,
body.dark-mode .admin-media-panel .section-sub-text {
    color:#aebed0 !important;
}

html[data-leressae-theme="dark"] .admin-media-panel .admin-table-wrap,
body.dark-mode .admin-media-panel .admin-table-wrap {
    background:#101c2c !important;
    border-color:#334155 !important;
}

html[data-leressae-theme="dark"] .admin-media-panel .admin-table,
body.dark-mode .admin-media-panel .admin-table {
    background:#101c2c !important;
    color:#dbe7f5 !important;
}

html[data-leressae-theme="dark"] .admin-media-panel .admin-table th,
body.dark-mode .admin-media-panel .admin-table th {
    background:#162437 !important;
    color:#f8fafc !important;
    border-color:#334155 !important;
}

html[data-leressae-theme="dark"] .admin-media-panel .admin-table td,
body.dark-mode .admin-media-panel .admin-table td {
    background:#101c2c !important;
    color:#dbe7f5 !important;
    border-color:#26384d !important;
}

html[data-leressae-theme="dark"] .admin-media-panel .admin-table tbody tr:nth-child(even) td,
body.dark-mode .admin-media-panel .admin-table tbody tr:nth-child(even) td {
    background:#152337 !important;
}

html[data-leressae-theme="dark"] .admin-media-panel .admin-table tbody tr:hover td,
body.dark-mode .admin-media-panel .admin-table tbody tr:hover td {
    background:#1b3048 !important;
    color:#ffffff !important;
}

html[data-leressae-theme="dark"] .admin-media-panel .admin-empty-state,
body.dark-mode .admin-media-panel .admin-empty-state {
    background:#152337 !important;
    color:#b8c5d6 !important;
    border-color:#334155 !important;
}

html[data-leressae-theme="dark"] .admin-media-panel .btn-secondary,
body.dark-mode .admin-media-panel .btn-secondary {
    background:#172437 !important;
    color:#e5edf7 !important;
    border-color:#3a4b60 !important;
}

html[data-leressae-theme="dark"] .admin-media-panel .btn-secondary:hover,
body.dark-mode .admin-media-panel .btn-secondary:hover {
    background:#20334b !important;
    color:#ffffff !important;
}

/* Override inline light backgrounds/colors used by the media form/panels. */
html[data-leressae-theme="dark"] .admin-media-panel [style*="background:#fff"],
html[data-leressae-theme="dark"] .admin-media-panel [style*="background: #fff"],
html[data-leressae-theme="dark"] .admin-media-panel [style*="background:white"],
html[data-leressae-theme="dark"] .admin-media-panel [style*="background: white"],
body.dark-mode .admin-media-panel [style*="background:#fff"],
body.dark-mode .admin-media-panel [style*="background: #fff"],
body.dark-mode .admin-media-panel [style*="background:white"],
body.dark-mode .admin-media-panel [style*="background: white"] {
    background:#101c2c !important;
}

html[data-leressae-theme="dark"] .admin-media-panel [style*="border-bottom:1px solid #eef2f7"],
body.dark-mode .admin-media-panel [style*="border-bottom:1px solid #eef2f7"] {
    border-bottom-color:#334155 !important;
}

html[data-leressae-theme="dark"] .media-admin-form.media-modal-active,
body.dark-mode .media-admin-form.media-modal-active {
    background:#101c2c !important;
    color:#e5edf7 !important;
    border-color:#334155 !important;
}

html[data-leressae-theme="dark"] .media-admin-form .field-row label,
body.dark-mode .media-admin-form .field-row label {
    color:#dbe7f5 !important;
}

html[data-leressae-theme="dark"] .media-admin-form input[name="judul"],
html[data-leressae-theme="dark"] .media-admin-form textarea[name="deskripsi"],
body.dark-mode .media-admin-form input[name="judul"],
body.dark-mode .media-admin-form textarea[name="deskripsi"] {
    background:#0f172a !important;
    color:#f1f5f9 !important;
    border-color:#3a4b60 !important;
    -webkit-text-fill-color:#f1f5f9 !important;
}

html[data-leressae-theme="dark"] .media-admin-form input[type="file"],
body.dark-mode .media-admin-form input[type="file"] {
    background:#0f172a !important;
    color:#e5edf7 !important;
    border-color:#3a4b60 !important;
}

html[data-leressae-theme="dark"] .media-admin-form select,
body.dark-mode .media-admin-form select {
    background:#0f172a !important;
    color:#f1f5f9 !important;
    border-color:#3a4b60 !important;
}

html[data-leressae-theme="dark"] .media-admin-form input::placeholder,
html[data-leressae-theme="dark"] .media-admin-form textarea::placeholder,
body.dark-mode .media-admin-form input::placeholder,
body.dark-mode .media-admin-form textarea::placeholder {
    color:#8fa1b5 !important;
    -webkit-text-fill-color:#8fa1b5 !important;
}

html[data-leressae-theme="dark"] .media-admin-form .stock-actions,
body.dark-mode .media-admin-form .stock-actions {
    color:#e5edf7 !important;
}

html[data-leressae-theme="dark"] .admin-media-panel img,
body.dark-mode .admin-media-panel img {
    border-color:#3a4b60 !important;
}

/* ===== ORIGINAL STYLE BLOCK 26 id="leressae-mobile-final-optimization" ===== */
@media (max-width: 767px) {

  body.admin-mode {
    overflow-x: hidden !important;
  }
  body.admin-mode .wrapper {
    width: 100% !important;
    max-width: 100% !important;
    padding-left: 8px !important;
    padding-right: 8px !important;
  }
  .admin-shell {
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    gap: 0 !important;
  }
  .admin-content {
    width: 100% !important;
    min-width: 0 !important;
    padding: 0 !important;
    overflow-x: hidden !important;
  }
  .admin-topbar {
    padding: 10px !important;
    gap: 9px !important;
    margin-bottom: 10px !important;
    border-radius: 12px !important;
  }
  .admin-topbar h2 {
    font-size: 0.95rem !important;
  }
  .admin-breadcrumb {
    font-size: 0.62rem !important;
  }
  .admin-menu-toggle {
    width: 34px !important;
    height: 34px !important;
    min-width: 34px !important;
    font-size: 0.95rem !important;
  }
  .admin-topbar-meta {
    gap: 6px !important;
  }
  .admin-user-chip,
  .admin-sync-badge {
    min-height: 32px !important;
    padding: 6px 7px !important;
    font-size: 0.60rem !important;
    border-radius: 8px !important;
  }
  .admin-topbar-meta .admin-logout-btn {
    min-height: 34px !important;
    font-size: 0.68rem !important;
    border-radius: 8px !important;
  }
  .admin-card {
    padding: 10px !important;
    border-radius: 12px !important;
    margin-bottom: 10px !important;
  }
  .admin-card-header {
    gap: 7px !important;
    margin-bottom: 9px !important;
  }
  .admin-card-header h3 {
    font-size: 0.82rem !important;
  }

  .admin-news-page .admin-card-header {
    align-items: center !important;
  }
  .admin-news-page .admin-card-header .btn-primary {
    width: auto !important;
    min-width: 0 !important;
    min-height: 32px !important;
    padding: 7px 9px !important;
    border-radius: 8px !important;
    font-size: 0.64rem !important;
    white-space: nowrap !important;
  }
  .admin-news-page > .section-sub-text {
    font-size: 0.68rem !important;
    line-height: 1.45 !important;
    margin: 0 0 9px !important;
  }


  .admin-news-page .admin-table-wrap {
    width: 100% !important;
    overflow: visible !important;
    border-radius: 10px !important;
    box-shadow: none !important;
  }
  .admin-news-page .admin-table {
    width: 100% !important;
    min-width: 0 !important;
    border-collapse: separate !important;
    border-spacing: 0 7px !important;
  }
  .admin-news-page .admin-table thead {
    display: none !important;
  }
  .admin-news-page .admin-table tbody,
  .admin-news-page .admin-table tr,
  .admin-news-page .admin-table td {
    display: block !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }
  .admin-news-page .admin-table tbody tr {
    background: #fff !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 10px !important;
    overflow: hidden !important;
    box-shadow: 0 3px 10px rgba(15,23,42,.035) !important;
  }
  .admin-news-page .admin-table td {
    min-height: 0 !important;
    padding: 7px 9px !important;
    border-bottom: 1px solid #eef2f7 !important;
    font-size: 0.70rem !important;
    line-height: 1.35 !important;
    text-align: left !important;
    vertical-align: middle !important;
    overflow-wrap: anywhere !important;
  }
  .admin-news-page .admin-table td:last-child {
    border-bottom: 0 !important;
    padding: 8px 9px !important;
  }
  .admin-news-page .admin-table td::before {
    display: inline-block !important;
    min-width: 58px !important;
    margin-right: 7px !important;
    color: #64748b !important;
    font-size: 0.57rem !important;
    font-weight: 800 !important;
    text-transform: uppercase !important;
    letter-spacing: .035em !important;
    vertical-align: middle !important;
  }
  .admin-news-page .admin-table td:nth-child(1)::before { content: "Judul"; }
  .admin-news-page .admin-table td:nth-child(2)::before { content: "Kategori"; }
  .admin-news-page .admin-table td:nth-child(3)::before { content: "Status"; }
  .admin-news-page .admin-table td:nth-child(4)::before { content: "Dibuat"; }
  .admin-news-page .admin-table td:nth-child(5)::before { content: "Aksi"; }
  .admin-news-page .admin-table td:nth-child(1) {
    font-weight: 700 !important;
    color: #1f2937 !important;
    padding-top: 9px !important;
  }
  .admin-news-page .admin-table td:nth-child(5) {
    display: grid !important;
    grid-template-columns: minmax(0,1fr) minmax(0,1fr) !important;
    gap: 6px !important;
    align-items: center !important;
  }
  .admin-news-page .admin-table td:nth-child(5)::before {
    grid-column: 1 / -1 !important;
    margin: 0 0 1px !important;
  }
  .admin-news-page .admin-table td:nth-child(5) .btn-secondary,
  .admin-news-page .admin-table td:nth-child(5) .save-status-btn {
    width: 100% !important;
    min-width: 0 !important;
    min-height: 32px !important;
    height: 32px !important;
    margin: 0 !important;
    padding: 5px 7px !important;
    border-radius: 7px !important;
    font-size: 0.66rem !important;
    line-height: 1 !important;
    font-weight: 800 !important;
  }
  .admin-news-page .admin-table td:nth-child(3) .status-badge {
    display: inline-flex !important;
    min-height: 23px !important;
    padding: 4px 7px !important;
    border-radius: 999px !important;
    font-size: 0.58rem !important;
  }

  .admin-news-page .admin-empty-state {
    padding: 18px 8px !important;
    font-size: 0.72rem !important;
  }

  .admin-table-wrap {
    max-width: 100% !important;
    -webkit-overflow-scrolling: touch !important;
  }
  .admin-table th,
  .admin-table td {
    font-size: 0.68rem !important;
    padding: 8px 9px !important;
  }
  .admin-table .save-status-btn,
  .admin-table .btn-secondary.small {
    min-height: 32px !important;
    padding: 6px 8px !important;
    font-size: 0.65rem !important;
  }

  body.technician-mode {
    overflow-x: hidden !important;
  }
  .technician-shell {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    border-radius: 10px !important;
  }
  .technician-content {
    width: 100% !important;
    min-width: 0 !important;
    padding: 10px !important;
    overflow-x: hidden !important;
  }
  .technician-topbar {
    width: 100% !important;
    gap: 8px !important;
    margin-bottom: 10px !important;
  }
  .technician-topbar h2 {
    font-size: 17px !important;
    line-height: 1.25 !important;
  }
  .technician-topbar p {
    font-size: 10.5px !important;
    line-height: 1.35 !important;
  }
  .technician-mobile-menu {
    width: 36px !important;
    height: 36px !important;
    min-width: 36px !important;
    font-size: 19px !important;
    border-radius: 9px !important;
  }
  .technician-toolbar {
    width: 100% !important;
    gap: 6px !important;
  }
  .technician-toolbar input,
  .technician-toolbar select {
    min-height: 34px !important;
    height: 34px !important;
    padding: 6px 8px !important;
    font-size: 0.70rem !important;
    border-radius: 8px !important;
  }
  .tech-stat-grid,
  .tech-stock-summary {
    gap: 7px !important;
    margin-bottom: 10px !important;
  }
  .tech-stat {
    min-width: 0 !important;
    padding: 10px !important;
    border-radius: 10px !important;
  }
  .tech-stat .label {
    font-size: 0.58rem !important;
    line-height: 1.25 !important;
  }
  .tech-stat .value {
    font-size: 18px !important;
    margin-top: 3px !important;
  }
  .tech-section {
    padding: 10px !important;
    margin-bottom: 10px !important;
    border-radius: 10px !important;
  }
  .tech-section-header {
    gap: 7px !important;
    margin-bottom: 9px !important;
  }
  .tech-section-header h3 {
    font-size: 0.78rem !important;
    line-height: 1.3 !important;
  }
  .tech-table-wrap {
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: auto !important;
    border-radius: 9px !important;
    -webkit-overflow-scrolling: touch !important;
  }
  .tech-table {
    min-width: 600px !important;
  }
  .tech-table th,
  .tech-table td {
    padding: 7px 8px !important;
    font-size: 0.64rem !important;
    line-height: 1.3 !important;
  }
  .tech-table th {
    font-size: 0.55rem !important;
  }
  .tech-action-row {
    gap: 5px !important;
  }
  .tech-btn {
    min-height: 32px !important;
    padding: 6px 8px !important;
    border-radius: 7px !important;
    font-size: 0.64rem !important;
    line-height: 1.1 !important;
  }
  .tech-detail-grid,
  .tech-form-row {
    grid-template-columns: 1fr !important;
    gap: 7px !important;
  }
  .tech-detail-item {
    padding: 9px !important;
    border-radius: 9px !important;
  }
  .tech-detail-item span {
    font-size: 0.56rem !important;
  }
  .tech-detail-item strong {
    font-size: 0.70rem !important;
    line-height: 1.35 !important;
  }
  .tech-form-group {
    margin-bottom: 8px !important;
  }
  .tech-form-group label {
    font-size: 0.64rem !important;
    margin-bottom: 4px !important;
  }
  .tech-form-group input,
  .tech-form-group textarea,
  .tech-form-group select {
    min-height: 34px !important;
    padding: 7px 8px !important;
    font-size: 0.70rem !important;
    border-radius: 8px !important;
  }
  .tech-form-group textarea {
    min-height: 76px !important;
  }
  .tech-proof-card {
    gap: 9px !important;
  }
  .tech-proof-preview {
    width: 100% !important;
    height: 150px !important;
    border-radius: 9px !important;
  }
  .tech-proof-input {
    padding: 8px !important;
    font-size: 0.68rem !important;
    border-radius: 8px !important;
  }
  .tech-empty {
    padding: 18px 8px !important;
    font-size: 0.70rem !important;
  }

  .technician-shell .stock-panel,
  .technician-shell .login-panel {
    width: min(94vw, 430px) !important;
    max-width: 94vw !important;
    border-radius: 12px !important;
  }
  .technician-shell .stock-body {
    padding: 11px !important;
  }
  .technician-shell .stock-body .field-row {
    gap: 5px !important;
    margin-bottom: 8px !important;
  }
  .technician-shell .stock-body .field-row input,
  .technician-shell .stock-body .field-row select,
  .technician-shell .stock-body .field-row textarea {
    min-height: 34px !important;
    padding: 7px 8px !important;
    font-size: 0.70rem !important;
  }
  .technician-shell .stock-actions {
    gap: 6px !important;
    margin-top: 9px !important;
  }
  .technician-shell .stock-actions button {
    min-height: 34px !important;
    padding: 7px 9px !important;
    font-size: 0.68rem !important;
  }
}
@media (max-width: 380px) {
  body.admin-mode .wrapper {
    padding-left: 6px !important;
    padding-right: 6px !important;
  }
  .admin-news-page .admin-card-header .btn-primary {
    font-size: 0.58rem !important;
    padding: 6px 7px !important;
  }
  .admin-news-page .admin-table td {
    padding: 6px 8px !important;
    font-size: 0.64rem !important;
  }
  .admin-news-page .admin-table td::before {
    min-width: 52px !important;
    font-size: 0.52rem !important;
  }
  .admin-news-page .admin-table td:nth-child(5) .btn-secondary,
  .admin-news-page .admin-table td:nth-child(5) .save-status-btn {
    min-height: 30px !important;
    height: 30px !important;
    font-size: 0.60rem !important;
  }
  .technician-content {
    padding: 8px !important;
  }
  .technician-topbar h2 {
    font-size: 16px !important;
  }
  .tech-stat-grid,
  .tech-stock-summary {
    gap: 6px !important;
  }
  .tech-stat {
    padding: 8px !important;
  }
  .tech-stat .label {
    font-size: 0.53rem !important;
  }
  .tech-stat .value {
    font-size: 16px !important;
  }
  .tech-section {
    padding: 8px !important;
  }
  .tech-btn {
    min-height: 30px !important;
    padding: 5px 7px !important;
    font-size: 0.60rem !important;
  }
}

/* ===== ORIGINAL STYLE BLOCK 27 id="admin-clean-final-v5" ===== */
#page-admin { min-width:0 !important; width:100% !important; }
#page-admin .admin-content { min-width:0 !important; overflow:visible !important; }
#page-admin .admin-card { min-width:0 !important; overflow:visible !important; }

#page-admin .admin-table-wrap,
#page-admin .admin-activity-table-wrap,
#page-admin .admin-customers-table-wrap,
#page-admin .admin-tech-management-wrap {
  display:block !important;
  width:100% !important;
  max-width:100% !important;
  min-width:0 !important;
  overflow-x:auto !important;
  overflow-y:hidden !important;
  box-sizing:border-box !important;
  -webkit-overflow-scrolling:touch !important;
  scrollbar-width:thin !important;
}

#page-admin .admin-services-table,
#page-admin .admin-running-services-table,
#page-admin .admin-completed-services-table,
#page-admin .admin-activity-table,
#page-admin .admin-customers-table,
#page-admin .admin-tech-management-table {
  table-layout:fixed !important;
  width:max-content !important;
  max-width:none !important;
  border-collapse:collapse !important;
  border-spacing:0 !important;
  margin:0 !important;
}


#page-admin .admin-activity-table,
#page-admin .admin-services-table,
#page-admin .admin-completed-services-table { min-width:1750px !important; }
#page-admin .admin-running-services-table { min-width:1600px !important; }
#page-admin .admin-customers-table { min-width:1120px !important; }
#page-admin .admin-tech-management-table { min-width:980px !important; }


#page-admin .admin-activity-table th,
#page-admin .admin-activity-table td,
#page-admin .admin-services-table th,
#page-admin .admin-services-table td,
#page-admin .admin-running-services-table th,
#page-admin .admin-running-services-table td,
#page-admin .admin-completed-services-table th,
#page-admin .admin-completed-services-table td,
#page-admin .admin-customers-table th,
#page-admin .admin-customers-table td,
#page-admin .admin-tech-management-table th,
#page-admin .admin-tech-management-table td {
  box-sizing:border-box !important;
  vertical-align:middle !important;
  line-height:1.35 !important;
  border-bottom:1px solid #e2e8f0 !important;
}

#page-admin .admin-activity-table th,
#page-admin .admin-services-table th,
#page-admin .admin-running-services-table th,
#page-admin .admin-completed-services-table th,
#page-admin .admin-customers-table th,
#page-admin .admin-tech-management-table th {
  height:64px !important;
  padding:12px 10px !important;
  text-align:center !important;
  white-space:normal !important;
  word-break:normal !important;
  overflow-wrap:normal !important;
  font-size:.78rem !important;
  line-height:1.2 !important;
}

#page-admin .admin-activity-table td,
#page-admin .admin-services-table td,
#page-admin .admin-running-services-table td,
#page-admin .admin-completed-services-table td,
#page-admin .admin-customers-table td,
#page-admin .admin-tech-management-table td {
  padding:13px 10px !important;
  min-height:68px !important;
  height:68px !important;
  font-size:.82rem !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  white-space:nowrap !important;
}


#page-admin .admin-activity-table td:nth-child(3),
#page-admin .admin-activity-table td:nth-child(5),
#page-admin .admin-activity-table td:nth-child(8),
#page-admin .admin-activity-table td:nth-child(9),
#page-admin .admin-services-table td:nth-child(3),
#page-admin .admin-services-table td:nth-child(5),
#page-admin .admin-services-table td:nth-child(8),
#page-admin .admin-services-table td:nth-child(9),
#page-admin .admin-running-services-table td:nth-child(3),
#page-admin .admin-running-services-table td:nth-child(5),
#page-admin .admin-running-services-table td:nth-child(8),
#page-admin .admin-running-services-table td:nth-child(10),
#page-admin .admin-completed-services-table td:nth-child(4),
#page-admin .admin-completed-services-table td:nth-child(5),
#page-admin .admin-completed-services-table td:nth-child(8) {
  white-space:normal !important;
  overflow-wrap:anywhere !important;
  text-overflow:clip !important;
}


#page-admin .admin-activity-table td:nth-child(1),
#page-admin .admin-activity-table td:nth-child(2),
#page-admin .admin-activity-table td:nth-child(4),
#page-admin .admin-activity-table td:nth-child(10),
#page-admin .admin-activity-table td:nth-child(11),
#page-admin .admin-activity-table td:nth-child(12),
#page-admin .admin-services-table td:nth-child(1),
#page-admin .admin-services-table td:nth-child(2),
#page-admin .admin-services-table td:nth-child(4),
#page-admin .admin-services-table td:nth-child(10),
#page-admin .admin-services-table td:nth-child(11),
#page-admin .admin-services-table td:nth-child(12),
#page-admin .admin-running-services-table td:nth-child(1),
#page-admin .admin-running-services-table td:nth-child(2),
#page-admin .admin-running-services-table td:nth-child(4),
#page-admin .admin-running-services-table td:nth-child(9),
#page-admin .admin-running-services-table td:nth-child(10),
#page-admin .admin-running-services-table td:nth-child(11),
#page-admin .admin-completed-services-table td:nth-child(1),
#page-admin .admin-completed-services-table td:nth-child(2),
#page-admin .admin-completed-services-table td:nth-child(3),
#page-admin .admin-completed-services-table td:nth-child(6),
#page-admin .admin-completed-services-table td:nth-child(7),
#page-admin .admin-completed-services-table td:nth-child(9),
#page-admin .admin-completed-services-table td:nth-child(10),
#page-admin .admin-completed-services-table td:nth-child(11),
#page-admin .admin-completed-services-table td:nth-child(12) {
  text-align:center !important;
  white-space:nowrap !important;
  font-variant-numeric:tabular-nums !important;
}


#page-admin .admin-activity-table .id-cell,
#page-admin .admin-services-table .id-cell,
#page-admin .admin-running-services-table .id-cell,
#page-admin .admin-completed-services-table .id-cell {
  text-align:left !important;
  color:#075e55 !important;
  font-weight:800 !important;
}


#page-admin .admin-activity-table td:nth-child(6),
#page-admin .admin-activity-table td:nth-child(7),
#page-admin .admin-services-table td:nth-child(6),
#page-admin .admin-services-table td:nth-child(7),
#page-admin .admin-running-services-table td:nth-child(6),
#page-admin .admin-running-services-table td:nth-child(7),
#page-admin .admin-completed-services-table td:nth-child(6),
#page-admin .admin-completed-services-table td:nth-child(7) {
  text-align:center !important;
}
#page-admin .admin-activity-table td:nth-child(6) .btn-secondary,
#page-admin .admin-activity-table td:nth-child(7) .btn-secondary,
#page-admin .admin-services-table td:nth-child(6) .btn-secondary,
#page-admin .admin-services-table td:nth-child(7) .btn-secondary,
#page-admin .admin-running-services-table td:nth-child(6) .btn-secondary,
#page-admin .admin-running-services-table td:nth-child(7) .btn-secondary,
#page-admin .admin-completed-services-table td:nth-child(6) .btn-secondary,
#page-admin .admin-completed-services-table td:nth-child(7) .btn-secondary {
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  width:112px !important;
  min-width:112px !important;
  max-width:112px !important;
  min-height:42px !important;
  height:42px !important;
  margin:0 auto !important;
  padding:6px 8px !important;
  white-space:normal !important;
  line-height:1.05 !important;
  text-align:center !important;
  box-sizing:border-box !important;
}


#page-admin .admin-activity-table .status-badge,
#page-admin .admin-services-table .status-badge,
#page-admin .admin-running-services-table .status-badge,
#page-admin .admin-completed-services-table .status-badge {
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  min-width:82px !important;
  max-width:none !important;
  min-height:38px !important;
  padding:7px 12px !important;
  white-space:nowrap !important;
  overflow:visible !important;
  word-break:normal !important;
  overflow-wrap:normal !important;
  line-height:1 !important;
  text-align:center !important;
}


#page-admin .admin-running-services-table td:last-child {
  text-align:center !important;
}
#page-admin .admin-running-services-table .admin-action-stack {
  display:flex !important;
  flex-direction:column !important;
  align-items:stretch !important;
  justify-content:center !important;
  gap:7px !important;
  width:130px !important;
  min-width:130px !important;
  margin:0 auto !important;
}
#page-admin .admin-running-services-table .admin-action-stack > button,
#page-admin .admin-running-services-table .admin-action-stack > .btn-secondary {
  width:130px !important;
  min-width:130px !important;
  max-width:130px !important;
  min-height:40px !important;
  height:40px !important;
  margin:0 !important;
  box-sizing:border-box !important;
}


#page-admin .admin-activity-table th:nth-child(1),#page-admin .admin-activity-table td:nth-child(1),
#page-admin .admin-services-table th:nth-child(1),#page-admin .admin-services-table td:nth-child(1){width:150px!important;min-width:150px!important}
#page-admin .admin-activity-table th:nth-child(2),#page-admin .admin-activity-table td:nth-child(2),
#page-admin .admin-services-table th:nth-child(2),#page-admin .admin-services-table td:nth-child(2){width:120px!important;min-width:120px!important}
#page-admin .admin-activity-table th:nth-child(3),#page-admin .admin-activity-table td:nth-child(3),
#page-admin .admin-services-table th:nth-child(3),#page-admin .admin-services-table td:nth-child(3){width:180px!important;min-width:180px!important}
#page-admin .admin-activity-table th:nth-child(4),#page-admin .admin-activity-table td:nth-child(4),
#page-admin .admin-services-table th:nth-child(4),#page-admin .admin-services-table td:nth-child(4){width:150px!important;min-width:150px!important}
#page-admin .admin-activity-table th:nth-child(5),#page-admin .admin-activity-table td:nth-child(5),
#page-admin .admin-services-table th:nth-child(5),#page-admin .admin-services-table td:nth-child(5){width:220px!important;min-width:220px!important}
#page-admin .admin-activity-table th:nth-child(6),#page-admin .admin-activity-table td:nth-child(6),
#page-admin .admin-services-table th:nth-child(6),#page-admin .admin-services-table td:nth-child(6){width:130px!important;min-width:130px!important}
#page-admin .admin-activity-table th:nth-child(7),#page-admin .admin-activity-table td:nth-child(7),
#page-admin .admin-services-table th:nth-child(7),#page-admin .admin-services-table td:nth-child(7){width:145px!important;min-width:145px!important}
#page-admin .admin-activity-table th:nth-child(8),#page-admin .admin-activity-table td:nth-child(8),
#page-admin .admin-services-table th:nth-child(8),#page-admin .admin-services-table td:nth-child(8){width:150px!important;min-width:150px!important}
#page-admin .admin-activity-table th:nth-child(9),#page-admin .admin-activity-table td:nth-child(9),
#page-admin .admin-services-table th:nth-child(9),#page-admin .admin-services-table td:nth-child(9){width:180px!important;min-width:180px!important}
#page-admin .admin-activity-table th:nth-child(10),#page-admin .admin-activity-table td:nth-child(10),
#page-admin .admin-services-table th:nth-child(10),#page-admin .admin-services-table td:nth-child(10){width:120px!important;min-width:120px!important}
#page-admin .admin-activity-table th:nth-child(11),#page-admin .admin-activity-table td:nth-child(11),
#page-admin .admin-services-table th:nth-child(11),#page-admin .admin-services-table td:nth-child(11){width:245px!important;min-width:245px!important}
#page-admin .admin-activity-table th:nth-child(12),#page-admin .admin-activity-table td:nth-child(12),
#page-admin .admin-services-table th:nth-child(12),#page-admin .admin-services-table td:nth-child(12){width:135px!important;min-width:135px!important}


#page-admin .admin-running-services-table th:nth-child(1),#page-admin .admin-running-services-table td:nth-child(1){width:150px!important;min-width:150px!important}
#page-admin .admin-running-services-table th:nth-child(2),#page-admin .admin-running-services-table td:nth-child(2){width:120px!important;min-width:120px!important}
#page-admin .admin-running-services-table th:nth-child(3),#page-admin .admin-running-services-table td:nth-child(3){width:180px!important;min-width:180px!important}
#page-admin .admin-running-services-table th:nth-child(4),#page-admin .admin-running-services-table td:nth-child(4){width:150px!important;min-width:150px!important}
#page-admin .admin-running-services-table th:nth-child(5),#page-admin .admin-running-services-table td:nth-child(5){width:220px!important;min-width:220px!important}
#page-admin .admin-running-services-table th:nth-child(6),#page-admin .admin-running-services-table td:nth-child(6){width:130px!important;min-width:130px!important}
#page-admin .admin-running-services-table th:nth-child(7),#page-admin .admin-running-services-table td:nth-child(7){width:145px!important;min-width:145px!important}
#page-admin .admin-running-services-table th:nth-child(8),#page-admin .admin-running-services-table td:nth-child(8){width:150px!important;min-width:150px!important}
#page-admin .admin-running-services-table th:nth-child(9),#page-admin .admin-running-services-table td:nth-child(9){width:120px!important;min-width:120px!important}
#page-admin .admin-running-services-table th:nth-child(10),#page-admin .admin-running-services-table td:nth-child(10){width:130px!important;min-width:130px!important}
#page-admin .admin-running-services-table th:nth-child(11),#page-admin .admin-running-services-table td:nth-child(11){width:150px!important;min-width:150px!important}


#page-admin .admin-customers-table th:nth-child(1),#page-admin .admin-customers-table td:nth-child(1){width:230px!important;min-width:230px!important;text-align:left!important;white-space:normal!important;overflow-wrap:anywhere!important}
#page-admin .admin-customers-table th:nth-child(2),#page-admin .admin-customers-table td:nth-child(2){width:170px!important;min-width:170px!important;text-align:center!important;white-space:nowrap!important}
#page-admin .admin-customers-table th:nth-child(3),#page-admin .admin-customers-table td:nth-child(3){width:125px!important;min-width:125px!important;text-align:center!important}
#page-admin .admin-customers-table th:nth-child(4),#page-admin .admin-customers-table td:nth-child(4){width:125px!important;min-width:125px!important;text-align:center!important}
#page-admin .admin-customers-table th:nth-child(5),#page-admin .admin-customers-table td:nth-child(5){width:140px!important;min-width:140px!important;text-align:center!important}
#page-admin .admin-customers-table th:nth-child(6),#page-admin .admin-customers-table td:nth-child(6){width:180px!important;min-width:180px!important;text-align:right!important;white-space:nowrap!important}
#page-admin .admin-customers-table th:nth-child(7),#page-admin .admin-customers-table td:nth-child(7){width:150px!important;min-width:150px!important;text-align:center!important;white-space:nowrap!important}
#page-admin .admin-customers-table th:nth-child(8),#page-admin .admin-customers-table td:nth-child(8){width:110px!important;min-width:110px!important;text-align:center!important}
#page-admin .admin-customers-table td:last-child .btn-secondary{width:90px!important;min-width:90px!important;height:42px!important;margin:0 auto!important}


@media(max-width:767px){
  #page-admin .admin-table-wrap,
  #page-admin .admin-activity-table-wrap,
  #page-admin .admin-customers-table-wrap,
  #page-admin .admin-tech-management-wrap{overflow-x:auto!important}
  #page-admin .admin-activity-table,
  #page-admin .admin-services-table,
  #page-admin .admin-completed-services-table{min-width:1750px!important}
  #page-admin .admin-running-services-table{min-width:1600px!important}
  #page-admin .admin-customers-table{min-width:1120px!important}
}

  .admin-service-assignment{display:grid;gap:7px;min-width:205px}
  .admin-service-assignment-select{width:100%;min-width:0;min-height:36px;padding:7px 9px;border:1px solid #cbd5e1;border-radius:8px;background:#fff;color:#1e293b;font:inherit;font-size:.8rem}
  .admin-service-assign-button{width:100%;min-height:34px}
  .admin-service-assign-button:disabled,.admin-service-assignment-select:disabled{cursor:not-allowed;opacity:.6}
  html[data-leressae-theme="dark"] .admin-service-assignment-select{border-color:#475569;background:#111c2c;color:#e5edf7}


  html {
    color-scheme: light;
}
html[data-leressae-theme="dark"] {
    color-scheme: dark;
}


html[data-leressae-theme="dark"] body {
    background-color: #07111f !important;
    background-image:
        linear-gradient(rgba(3, 10, 20, 0.82), rgba(3, 10, 20, 0.88)),
        url("https://cdn.corenexis.com/f/mpSA4Cnf1Nj.jpeg") !important;
    color: #e5edf7 !important;
}

html[data-leressae-theme="dark"] body,
html[data-leressae-theme="dark"] body * {
    scrollbar-color: #475569 #0f172a;
}
html[data-leressae-theme="dark"] ::selection {
    background: rgba(8, 127, 112, 0.35);
    color: #fff;
}


html[data-leressae-theme="dark"] .navbar {
    background: rgba(10, 20, 34, 0.90) !important;
    border-color: rgba(148, 163, 184, 0.18) !important;
    box-shadow: 0 10px 26px rgba(0,0,0,.30) !important;
}
html[data-leressae-theme="dark"] .brand-title,
html[data-leressae-theme="dark"] .nav-links li a {
    color: #e8eef7 !important;
}
html[data-leressae-theme="dark"] .brand-sub {
    color: #8ddbb9 !important;
}
html[data-leressae-theme="dark"] .nav-links li a:hover,
html[data-leressae-theme="dark"] .nav-links li a.active {
    color: #8ddbb9 !important;
}
html[data-leressae-theme="dark"] .nav-links li a.active::after {
    background: linear-gradient(135deg,#78d0ac 0%,#168c75 100%) !important;
}
html[data-leressae-theme="dark"] .dropdown-content,
html[data-leressae-theme="dark"] .login-dropdown-content {
    background: #111c2c !important;
    border-color: #334155 !important;
    box-shadow: 0 18px 42px rgba(0,0,0,.42) !important;
}
html[data-leressae-theme="dark"] .dropdown-content li a,
html[data-leressae-theme="dark"] .login-dropdown-content a {
    color: #dbe7f5 !important;
}
html[data-leressae-theme="dark"] .dropdown-content li a:hover,
html[data-leressae-theme="dark"] .login-dropdown-content a:hover,
html[data-leressae-theme="dark"] .login-dropdown-content a:focus {
    background: #17263a !important;
    color: #8ddbb9 !important;
}


html[data-leressae-theme="dark"] .card-container,
html[data-leressae-theme="dark"] .dashboard-section,
html[data-leressae-theme="dark"] .pillar-card,
html[data-leressae-theme="dark"] .media-item,
html[data-leressae-theme="dark"] .service-item-card,
html[data-leressae-theme="dark"] .status-lookup-wrap {
    background: rgba(15, 27, 43, 0.94) !important;
    border-color: #26384d !important;
    box-shadow: 0 12px 30px rgba(0,0,0,.20) !important;
}
html[data-leressae-theme="dark"] .section-title-text,
html[data-leressae-theme="dark"] .page-header-title,
html[data-leressae-theme="dark"] .pillar-title,
html[data-leressae-theme="dark"] .media-item .title,
html[data-leressae-theme="dark"] .service-item-title {
    color: #f8fafc !important;
    text-shadow: none !important;
}
html[data-leressae-theme="dark"] .page-header-title,
html[data-leressae-theme="dark"] section#page-media > h1.page-header-title {
    color: #ffffff !important;
    font-weight: 800 !important;
    letter-spacing: -0.02em !important;
    text-shadow: none !important;
}
html[data-leressae-theme="dark"] .section-sub-text,
html[data-leressae-theme="dark"] .page-header-desc,
html[data-leressae-theme="dark"] .pillar-desc,
html[data-leressae-theme="dark"] .media-item figcaption,
html[data-leressae-theme="dark"] .media-item .desc,
html[data-leressae-theme="dark"] .service-item-desc,
html[data-leressae-theme="dark"] section#page-media > p.page-header-desc,
html[data-leressae-theme="dark"] p {
    color: #e0ebf8 !important;
    text-shadow: none !important;
}
html[data-leressae-theme="dark"] #page-kontak .page-header-title {
    color: #ffffff !important;
    text-shadow: none !important;
}
html[data-leressae-theme="dark"] #page-kontak .page-header-desc {
    color: #dfeaf8 !important;
    text-shadow: none !important;
}
html[data-leressae-theme="dark"] #page-kontak .contact-card {
    background: rgba(15, 23, 42, 0.88) !important;
    border-color: rgba(148, 163, 184, 0.22) !important;
    box-shadow: 0 12px 28px rgba(0, 0, 0, 0.18) !important;
    color: #f8fafc !important;
    text-shadow: none !important;
    filter: none !important;
    -webkit-filter: none !important;
}
html[data-leressae-theme="dark"] #page-kontak .contact-card strong,
html[data-leressae-theme="dark"] #page-kontak .contact-card p,
html[data-leressae-theme="dark"] #page-kontak .contact-card a {
    color: #f8fafc !important;
    text-shadow: none !important;
    filter: none !important;
    -webkit-filter: none !important;
}
html[data-leressae-theme="dark"] #page-kontak .contact-card a {
    color: #8ddbb9 !important;
    text-decoration: underline;
}
html[data-leressae-theme="dark"] .pillar-icon {
    background: #102b43 !important;
    color: #8ddbb9 !important;
}
html[data-leressae-theme="dark"] .tutorial-card {
    background: linear-gradient(180deg,#132235 0%,#0f1b2b 100%) !important;
    border-color: #28435e !important;
    color: #e2e8f0 !important;
}
html[data-leressae-theme="dark"] .tutorial-card h3 {
    color: #f1f5f9 !important;
}
html[data-leressae-theme="dark"] .tutorial-card p {
    color: #aebed0 !important;
}
html[data-leressae-theme="dark"] .tutorial-meta {
    border-top-color: #26384d !important;
    color: #8ddbb9 !important;
}
html[data-leressae-theme="dark"] .tutorial-tag {
    background: rgba(8,127,112,.14) !important;
    color: #8ddbb9 !important;
}
html[data-leressae-theme="dark"] .service-item-icon {
    background: #142337 !important;
    border-color: #334155 !important;
}


html[data-leressae-theme="dark"] input,
html[data-leressae-theme="dark"] select,
html[data-leressae-theme="dark"] textarea,
html[data-leressae-theme="dark"] .status-form input,
html[data-leressae-theme="dark"] .status-form select,
html[data-leressae-theme="dark"] .admin-filter-row input,
html[data-leressae-theme="dark"] .admin-filter-row select,
html[data-leressae-theme="dark"] .admin-table select {
    background: #0f1b2b !important;
    color: #e5edf7 !important;
    border-color: #3a4b60 !important;
}
html[data-leressae-theme="dark"] input::placeholder,
html[data-leressae-theme="dark"] textarea::placeholder {
    color: #718096 !important;
}
html[data-leressae-theme="dark"] .btn-secondary,
html[data-leressae-theme="dark"] .login-btn-secondary {
    background: #172437 !important;
    color: #e5edf7 !important;
    border-color: #3a4b60 !important;
}
html[data-leressae-theme="dark"] .btn-secondary:hover,
html[data-leressae-theme="dark"] .login-btn-secondary:hover {
    background: #20334b !important;
    color: #fff !important;
}


html[data-leressae-theme="dark"] .login-panel,
html[data-leressae-theme="dark"] .stock-panel,
html[data-leressae-theme="dark"] .lightbox-content {
    background: #101c2c !important;
    border-color: #334155 !important;
    color: #e5edf7 !important;
}
html[data-leressae-theme="dark"] .login-body,
html[data-leressae-theme="dark"] .stock-body {
    color: #dbe7f5 !important;
}
html[data-leressae-theme="dark"] .stock-panel .service-meta,
html[data-theme="dark"] .stock-panel .service-meta,
body.dark-mode .stock-panel .service-meta,
html[data-leressae-theme="dark"] .stock-panel .service-meta div,
html[data-theme="dark"] .stock-panel .service-meta div,
body.dark-mode .stock-panel .service-meta div,
html[data-leressae-theme="dark"] .stock-panel .service-meta strong,
html[data-theme="dark"] .stock-panel .service-meta strong,
body.dark-mode .stock-panel .service-meta strong,
html[data-leressae-theme="dark"] .stock-panel .admin-table,
html[data-theme="dark"] .stock-panel .admin-table,
body.dark-mode .stock-panel .admin-table,
html[data-leressae-theme="dark"] .stock-panel .admin-table th,
html[data-theme="dark"] .stock-panel .admin-table th,
body.dark-mode .stock-panel .admin-table th,
html[data-leressae-theme="dark"] .stock-panel .admin-table td,
html[data-theme="dark"] .stock-panel .admin-table td,
body.dark-mode .stock-panel .admin-table td,
html[data-leressae-theme="dark"] .stock-panel .admin-empty-state,
html[data-theme="dark"] .stock-panel .admin-empty-state,
body.dark-mode .stock-panel .admin-empty-state {
    color: #edf6ff !important;
}
html[data-leressae-theme="dark"] .login-field label,
html[data-leressae-theme="dark"] .stock-body .field-row label {
    color: #dbe7f5 !important;
}
html[data-leressae-theme="dark"] .login-role-btn {
    background: #142337 !important;
    border-color: #3a4b60 !important;
    color: #e5edf7 !important;
}
html[data-leressae-theme="dark"] .login-role-btn.active {
    background: #12314b !important;
    border-color: #78d0ac !important;
    color: #b5e8d2 !important;
}
html[data-leressae-theme="dark"] .video-controls {
    background: #101c2c !important;
    border-color: #334155 !important;
}
html[data-leressae-theme="dark"] .video-controls button.secondary {
    background: #172437 !important;
    color: #e5edf7 !important;
}
html[data-leressae-theme="dark"] .lightbox-caption {
    background: rgba(15,23,42,.96) !important;
    color: #e5edf7 !important;
}
html[data-leressae-theme="dark"] .lightbox-caption strong,
html[data-leressae-theme="dark"] .lightbox-caption p {
    color: #e5edf7 !important;
}
html[data-leressae-theme="dark"] .lightbox-close,
html[data-leressae-theme="dark"] .lightbox-nav {
    background: rgba(15,23,42,.90) !important;
    color: #fff !important;
}


html[data-leressae-theme="dark"] .admin-shell {
    background: #0b1625 !important;
    border-color: #26384d !important;
    box-shadow: 0 18px 45px rgba(0,0,0,.28) !important;
}
html[data-leressae-theme="dark"] .admin-content {
    background: #0b1625 !important;
    color: #e5edf7 !important;
}
html[data-leressae-theme="dark"] .admin-topbar,
html[data-leressae-theme="dark"] .admin-card,
html[data-leressae-theme="dark"] .admin-stat,
html[data-leressae-theme="dark"] .admin-empty-state,
html[data-leressae-theme="dark"] .admin-notice,
html[data-leressae-theme="dark"] .admin-filter-card,
html[data-leressae-theme="dark"] .admin-section,
html[data-leressae-theme="dark"] .admin-dashboard-card {
    background: #101c2c !important;
    border-color: #2b3d52 !important;
    color: #e5edf7 !important;
}
html[data-leressae-theme="dark"] .admin-topbar h2,
html[data-leressae-theme="dark"] .admin-card h3,
html[data-leressae-theme="dark"] .admin-card h4,
html[data-leressae-theme="dark"] .admin-stat .value,
html[data-leressae-theme="dark"] .admin-breadcrumb,
html[data-leressae-theme="dark"] .admin-card-header,
html[data-leressae-theme="dark"] .admin-empty-state strong {
    color: #f1f5f9 !important;
}
html[data-leressae-theme="dark"] .admin-card p,
html[data-leressae-theme="dark"] .admin-stat .label,
html[data-leressae-theme="dark"] .admin-empty-state,
html[data-leressae-theme="dark"] .admin-notice {
    color: #aebed0 !important;
}


html[data-leressae-theme="dark"] .admin-table-wrap,
html[data-leressae-theme="dark"] .admin-activity-table-wrap,
html[data-leressae-theme="dark"] .admin-customers-table-wrap,
html[data-leressae-theme="dark"] .admin-tech-management-wrap {
    scrollbar-color: #475569 #0f172a;
}
html[data-leressae-theme="dark"] .admin-table,
html[data-leressae-theme="dark"] .admin-table tbody,
html[data-leressae-theme="dark"] .admin-activity-table,
html[data-leressae-theme="dark"] .admin-services-table,
html[data-leressae-theme="dark"] .admin-running-services-table,
html[data-leressae-theme="dark"] .admin-completed-services-table,
html[data-leressae-theme="dark"] .admin-customers-table,
html[data-leressae-theme="dark"] .admin-tech-management-table {
    color: #dbe7f5 !important;
}
html[data-leressae-theme="dark"] .admin-table thead th,
html[data-leressae-theme="dark"] .admin-table th,
html[data-leressae-theme="dark"] .admin-activity-table th,
html[data-leressae-theme="dark"] .admin-services-table th,
html[data-leressae-theme="dark"] .admin-running-services-table th,
html[data-leressae-theme="dark"] .admin-completed-services-table th,
html[data-leressae-theme="dark"] .admin-customers-table th,
html[data-leressae-theme="dark"] .admin-tech-management-table th {
    background: #162437 !important;
    color: #f1f5f9 !important;
    border-color: #2d4056 !important;
}
html[data-leressae-theme="dark"] .admin-table td,
html[data-leressae-theme="dark"] .admin-activity-table td,
html[data-leressae-theme="dark"] .admin-services-table td,
html[data-leressae-theme="dark"] .admin-running-services-table td,
html[data-leressae-theme="dark"] .admin-completed-services-table td,
html[data-leressae-theme="dark"] .admin-customers-table td,
html[data-leressae-theme="dark"] .admin-tech-management-table td {
    background: #101c2c !important;
    color: #dbe7f5 !important;
    border-color: #26384d !important;
}
html[data-leressae-theme="dark"] .admin-table tbody tr:hover td,
html[data-leressae-theme="dark"] .admin-activity-table tbody tr:hover td,
html[data-leressae-theme="dark"] .admin-services-table tbody tr:hover td,
html[data-leressae-theme="dark"] .admin-running-services-table tbody tr:hover td,
html[data-leressae-theme="dark"] .admin-completed-services-table tbody tr:hover td,
html[data-leressae-theme="dark"] .admin-customers-table tbody tr:hover td {
    background: #15253a !important;
}
html[data-leressae-theme="dark"] .admin-table td a,
html[data-leressae-theme="dark"] .admin-customers-table td a {
    color: #8ddbb9 !important;
}


html[data-leressae-theme="dark"] .admin-sidebar {
    box-shadow: inset -1px 0 rgba(148,163,184,.08);
}
html[data-leressae-theme="dark"] .admin-sidebar .admin-nav-item {
    color: #dbe7f5 !important;
}
html[data-leressae-theme="dark"] .admin-sidebar .admin-nav-item:hover {
    background: rgba(125,211,252,.10) !important;
}


html[data-leressae-theme="dark"] .technician-shell {
    background: #0b1625 !important;
    border-color: #26384d !important;
    box-shadow: 0 18px 45px rgba(0,0,0,.30) !important;
}
html[data-leressae-theme="dark"] .technician-content,
html[data-leressae-theme="dark"] .tech-section,
html[data-leressae-theme="dark"] .tech-stat,
html[data-leressae-theme="dark"] .tech-proof-card,
html[data-leressae-theme="dark"] .tech-update-proof-box,
html[data-leressae-theme="dark"] .technician-content .card-container {
    background: #101c2c !important;
    border-color: #2b3d52 !important;
    color: #e5edf7 !important;
}
html[data-leressae-theme="dark"] .technician-topbar h2,
html[data-leressae-theme="dark"] .tech-section h3,
html[data-leressae-theme="dark"] .tech-section-header h3,
html[data-leressae-theme="dark"] .tech-stat .value,
html[data-leressae-theme="dark"] .tech-update-proof-head strong {
    color: #f1f5f9 !important;
}
html[data-leressae-theme="dark"] .technician-topbar p,
html[data-leressae-theme="dark"] .tech-section p,
html[data-leressae-theme="dark"] .tech-stat .label,
html[data-leressae-theme="dark"] .tech-update-proof-head small {
    color: #aebed0 !important;
}
html[data-leressae-theme="dark"] .technician-content .tech-table,
html[data-leressae-theme="dark"] .technician-content .tech-client-table {
    color: #dbe7f5 !important;
}
html[data-leressae-theme="dark"] .technician-content .tech-table th,
html[data-leressae-theme="dark"] .technician-content .tech-client-table th {
    background: #162437 !important;
    color: #f1f5f9 !important;
    border-color: #2d4056 !important;
}
html[data-leressae-theme="dark"] .technician-content .tech-table td,
html[data-leressae-theme="dark"] .technician-content .tech-client-table td {
    background: #101c2c !important;
    color: #dbe7f5 !important;
    border-color: #26384d !important;
}
html[data-leressae-theme="dark"] .technician-content .tech-table tbody tr:hover td,
html[data-leressae-theme="dark"] .technician-content .tech-client-table tbody tr:hover td {
    background: #15253a !important;
}
html[data-leressae-theme="dark"] .technician-content .tech-btn.secondary,
html[data-leressae-theme="dark"] .technician-content .btn-secondary {
    background: #172437 !important;
    color: #e5edf7 !important;
    border-color: #3a4b60 !important;
}
html[data-leressae-theme="dark"] .technician-content .stock-source-tab {
    background: #172437 !important;
    color: #dbe7f5 !important;
    border-color: #3a4b60 !important;
}
html[data-leressae-theme="dark"] .technician-content .stock-source-tab:hover {
    background: #1b3c31 !important;
}
html[data-leressae-theme="dark"] .technician-content .stock-body,
html[data-leressae-theme="dark"] .technician-content .stock-body .field-row input,
html[data-leressae-theme="dark"] .technician-content .stock-body .field-row select,
html[data-leressae-theme="dark"] .technician-content .stock-body .field-row textarea {
    color: #e5edf7 !important;
}


html[data-leressae-theme="dark"] .status-badge,
html[data-leressae-theme="dark"] .tech-proof-state.uploaded {
    filter: brightness(.94) saturate(1.08);
}
html[data-leressae-theme="dark"] .tech-proof-state.missing {
    background: #3b2d0b !important;
    color: #fde68a !important;
    border-color: #785b16 !important;
}


#leressaeThemeToggle {
    position: fixed;
    right: 18px;
    bottom: 18px;
    z-index: 2147482000;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-width: 116px;
    height: 42px;
    padding: 0 14px;
    border: 1px solid rgba(148,163,184,.45);
    border-radius: 999px;
    background: rgba(255,255,255,.94);
    color: #0f172a;
    box-shadow: 0 10px 26px rgba(15,23,42,.20);
    backdrop-filter: blur(12px) saturate(130%);
    -webkit-backdrop-filter: blur(12px) saturate(130%);
    cursor: pointer;
    font: 700 13px/1 'Segoe UI', Tahoma, sans-serif;
    transition: background-color .2s ease, color .2s ease, border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}
#leressaeThemeToggle:hover {
    transform: translateY(-1px);
    box-shadow: 0 13px 30px rgba(15,23,42,.26);
}
#leressaeThemeToggle:focus-visible {
    outline: 3px solid rgba(8,127,112,.35);
    outline-offset: 3px;
}
#leressaeThemeToggle .leressae-theme-icon {
    width: 20px;
    height: 20px;
    display: grid;
    place-items: center;
    font-size: 17px;
    line-height: 1;
}
#leressaeThemeToggle .leressae-theme-text {
    white-space: nowrap;
}
html[data-leressae-theme="dark"] #leressaeThemeToggle {
    background: rgba(15,27,43,.94);
    color: #f8fafc;
    border-color: #475569;
    box-shadow: 0 10px 30px rgba(0,0,0,.38);
}
html[data-leressae-theme="dark"] #leressaeThemeToggle:hover {
    background: #172437;
}


@media (prefers-reduced-motion: reduce) {
    #leressaeThemeToggle,
    html[data-leressae-theme="dark"] * {
        transition-duration: .01ms !important;
    }
}
@media (max-width: 640px) {
    #leressaeThemeToggle {
        right: 12px;
        bottom: 12px;
        min-width: 104px;
        height: 40px;
        padding: 0 12px;
        font-size: 12px;
    }
}


:root{
  --dm-bg:#0b1220;
  --dm-surface:#111827;
  --dm-surface-2:#172033;
  --dm-surface-3:#1e293b;
  --dm-border:#334155;
  --dm-border-soft:#263449;
  --dm-text:#e5edf7;
  --dm-text-strong:#f8fafc;
  --dm-muted:#a9b8ca;
  --dm-muted-2:#8797aa;
  --dm-input:#0f172a;
  --dm-hover:#1b2a3d;
  --dm-shadow:0 12px 30px rgba(0,0,0,.28);
}


html[data-theme="dark"] body,
body.dark-mode{
  color-scheme:dark;
  background-color:var(--dm-bg) !important;
  color:var(--dm-text) !important;
}


html[data-theme="dark"] body,
body.dark-mode{
  background-image:none !important;
}


html[data-theme="dark"] .navbar,
body.dark-mode .navbar{
  background:rgba(17,24,39,.92) !important;
  border-color:var(--dm-border) !important;
  box-shadow:var(--dm-shadow) !important;
}
html[data-theme="dark"] .brand-title,
body.dark-mode .brand-title,
html[data-theme="dark"] .nav-links li a,
body.dark-mode .nav-links li a{
  color:var(--dm-text-strong) !important;
}
html[data-theme="dark"] .brand-sub,
body.dark-mode .brand-sub{color:#8ddbb9 !important}

html[data-theme="dark"] .dropdown-content,
body.dark-mode .dropdown-content,
html[data-theme="dark"] .login-dropdown-content,
body.dark-mode .login-dropdown-content{
  background:var(--dm-surface) !important;
  border-color:var(--dm-border) !important;
  box-shadow:var(--dm-shadow) !important;
}
html[data-theme="dark"] .dropdown-content li a,
body.dark-mode .dropdown-content li a,
html[data-theme="dark"] .login-dropdown-content a,
body.dark-mode .login-dropdown-content a{
  color:var(--dm-text) !important;
}
html[data-theme="dark"] .dropdown-content li a:hover,
body.dark-mode .dropdown-content li a:hover,
html[data-theme="dark"] .login-dropdown-content a:hover,
body.dark-mode .login-dropdown-content a:hover{
  background:var(--dm-hover) !important;
  color:#8ddbb9 !important;
}


html[data-theme="dark"] .card-container,
body.dark-mode .card-container,
html[data-theme="dark"] .pillar-card,
body.dark-mode .pillar-card,
html[data-theme="dark"] .dashboard-section,
body.dark-mode .dashboard-section,
html[data-theme="dark"] .media-item,
body.dark-mode .media-item,
html[data-theme="dark"] .status-lookup-wrap,
body.dark-mode .status-lookup-wrap,
html[data-theme="dark"] .service-status-card,
body.dark-mode .service-status-card,
html[data-theme="dark"] .service-item-card,
body.dark-mode .service-item-card{
  background:var(--dm-surface) !important;
  border-color:var(--dm-border) !important;
  color:var(--dm-text) !important;
  box-shadow:var(--dm-shadow) !important;
}

html[data-theme="dark"] .service-item-card,
body.dark-mode .service-item-card{
  background:var(--dm-surface-2) !important;
}
html[data-theme="dark"] .service-item-icon,
body.dark-mode .service-item-icon{
  background:var(--dm-surface-3) !important;
  border-color:var(--dm-border) !important;
}
html[data-theme="dark"] .pillar-icon,
body.dark-mode .pillar-icon{
  background:#18382c !important;
  color:#8ddbb9 !important;
}


html[data-theme="dark"] h1,
body.dark-mode h1,
html[data-theme="dark"] h2,
body.dark-mode h2,
html[data-theme="dark"] h3,
body.dark-mode h3,
html[data-theme="dark"] h4,
body.dark-mode h4,
html[data-theme="dark"] .page-header-title,
body.dark-mode .page-header-title,
html[data-theme="dark"] .section-title-text,
body.dark-mode .section-title-text,
html[data-theme="dark"] .pillar-title,
body.dark-mode .pillar-title,
html[data-theme="dark"] .service-item-title,
body.dark-mode .service-item-title,
html[data-theme="dark"] .media-item .title,
body.dark-mode .media-item .title,
html[data-theme="dark"] .tutorial-card h3,
body.dark-mode .tutorial-card h3,
html[data-theme="dark"] .service-status-card h3,
body.dark-mode .service-status-card h3{
  color:var(--dm-text-strong) !important;
}
html[data-theme="dark"] p,
body.dark-mode p,
html[data-theme="dark"] .page-header-desc,
body.dark-mode .page-header-desc,
html[data-theme="dark"] .section-sub-text,
body.dark-mode .section-sub-text,
html[data-theme="dark"] .pillar-desc,
body.dark-mode .pillar-desc,
html[data-theme="dark"] .service-item-desc,
body.dark-mode .service-item-desc,
html[data-theme="dark"] .tutorial-card p,
body.dark-mode .tutorial-card p{
  color:var(--dm-muted) !important;
}
html[data-leressae-theme="dark"] .media-item,
html[data-leressae-theme="dark"] .media-item figcaption,
html[data-leressae-theme="dark"] .home-media-spotlight,
html[data-leressae-theme="dark"] .home-media-stage{
  transition: background-color .2s ease, border-color .2s ease, color .2s ease;
}
html[data-leressae-theme="dark"] .media-item{
  background: rgba(15, 23, 42, 0.96) !important;
  border-color: rgba(148, 163, 184, 0.28) !important;
  box-shadow: 0 12px 30px rgba(0,0,0,.18) !important;
}
html[data-leressae-theme="dark"] .media-item figcaption{
  background: #0b1220 !important;
  color: #edf6ff !important;
  border-top: 1px solid rgba(148, 163, 184, 0.24) !important;
}
html[data-leressae-theme="dark"] .media-item .title{
  color: #ffffff !important;
  font-weight: 800 !important;
}
html[data-leressae-theme="dark"] .media-item .desc{
  color: #dfeaf8 !important;
  font-weight: 600 !important;
}
html[data-leressae-theme="dark"] .home-media-spotlight{
  background: linear-gradient(135deg, rgba(15, 23, 42, 0.94), rgba(17, 24, 39, 0.96)) !important;
  border-color: rgba(148, 163, 184, 0.22) !important;
}
html[data-leressae-theme="dark"] .home-media-stage{
  background: linear-gradient(135deg, #10201c, #1a3028) !important;
}
html[data-leressae-theme="dark"] .home-media-caption h3{
  color: #ffffff !important;
}
html[data-leressae-theme="dark"] .home-media-caption p{
  color: #e2ebf7 !important;
}
html[data-leressae-theme="light"] .media-item figcaption,
html[data-leressae-theme="light"] .media-item .title,
html[data-leressae-theme="light"] .media-item .desc,
html[data-leressae-theme="light"] .home-media-caption h3,
html[data-leressae-theme="light"] .home-media-caption p{
  transition: color .2s ease, background-color .2s ease;
}


html[data-theme="dark"] .tutorial-card,
body.dark-mode .tutorial-card{
  background:linear-gradient(180deg,#172c25 0%,#111f1b 100%) !important;
  border-color:var(--dm-border) !important;
  color:var(--dm-text) !important;
}
html[data-theme="dark"] .tutorial-meta,
body.dark-mode .tutorial-meta{
  border-top-color:var(--dm-border) !important;
}
html[data-theme="dark"] .tutorial-scroll::-webkit-scrollbar-thumb,
body.dark-mode .tutorial-scroll::-webkit-scrollbar-thumb{
  background:#475569 !important;
}


html[data-theme="dark"] input:not([type="checkbox"]):not([type="radio"]),
body.dark-mode input:not([type="checkbox"]):not([type="radio"]),
html[data-theme="dark"] select,
body.dark-mode select,
html[data-theme="dark"] textarea,
body.dark-mode textarea{
  background:var(--dm-input) !important;
  color:var(--dm-text) !important;
  border-color:var(--dm-border) !important;
  color-scheme:dark;
}
html[data-theme="dark"] input::placeholder,
body.dark-mode input::placeholder,
html[data-theme="dark"] textarea::placeholder,
body.dark-mode textarea::placeholder{
  color:#718096 !important;
}
html[data-theme="dark"] option,
body.dark-mode option{
  background:var(--dm-surface) !important;
  color:var(--dm-text) !important;
}


html[data-theme="dark"] .login-panel,
body.dark-mode .login-panel,
html[data-theme="dark"] .stock-panel,
body.dark-mode .stock-panel,
html[data-theme="dark"] .lightbox-content,
body.dark-mode .lightbox-content{
  background:var(--dm-surface) !important;
  border-color:var(--dm-border) !important;
  color:var(--dm-text) !important;
  box-shadow:var(--dm-shadow) !important;
}
html[data-theme="dark"] .login-body,
body.dark-mode .login-body,
html[data-theme="dark"] .stock-body,
body.dark-mode .stock-body{
  background:var(--dm-surface) !important;
}
html[data-theme="dark"] .login-field label,
body.dark-mode .login-field label,
html[data-theme="dark"] .stock-body .field-row label,
body.dark-mode .stock-body .field-row label{
  color:var(--dm-text) !important;
}
html[data-theme="dark"] .login-role-btn,
body.dark-mode .login-role-btn{
  background:var(--dm-surface-2) !important;
  border-color:var(--dm-border) !important;
  color:var(--dm-text) !important;
}
html[data-theme="dark"] .login-role-btn.active,
body.dark-mode .login-role-btn.active{
  background:#12314a !important;
  border-color:#78d0ac !important;
  color:#8ddbb9 !important;
}
html[data-theme="dark"] .login-btn-secondary,
body.dark-mode .login-btn-secondary,
html[data-theme="dark"] .video-controls button.secondary,
body.dark-mode .video-controls button.secondary{
  background:var(--dm-surface-3) !important;
  color:var(--dm-text) !important;
}
html[data-theme="dark"] .lightbox-caption,
body.dark-mode .lightbox-caption{
  background:rgba(17,24,39,.96) !important;
  color:var(--dm-text) !important;
}
html[data-theme="dark"] .lightbox-caption strong,
body.dark-mode .lightbox-caption strong,
html[data-theme="dark"] .lightbox-caption p,
body.dark-mode .lightbox-caption p{
  color:var(--dm-text) !important;
}
html[data-theme="dark"] .lightbox-close,
body.dark-mode .lightbox-close,
html[data-theme="dark"] .lightbox-nav,
body.dark-mode .lightbox-nav{
  background:rgba(30,41,59,.94) !important;
  color:#f8fafc !important;
}


html[data-theme="dark"] .status-empty,
body.dark-mode .status-empty,
html[data-theme="dark"] .admin-empty-state,
body.dark-mode .admin-empty-state,
html[data-theme="dark"] .admin-notice,
body.dark-mode .admin-notice{
  background:var(--dm-surface-2) !important;
  border-color:var(--dm-border) !important;
  color:var(--dm-muted) !important;
}


html[data-theme="dark"] table,
body.dark-mode table{
  color:var(--dm-text) !important;
}
html[data-theme="dark"] th,
body.dark-mode th{
  background:#1a3328 !important;
  color:#d8eee1 !important;
  border-color:var(--dm-border) !important;
}
html[data-theme="dark"] td,
body.dark-mode td{
  background:var(--dm-surface) !important;
  color:var(--dm-text) !important;
  border-color:var(--dm-border-soft) !important;
}
html[data-theme="dark"] tbody tr:hover td,
body.dark-mode tbody tr:hover td{
  background:var(--dm-hover) !important;
}
html[data-theme="dark"] .admin-table-wrap,
body.dark-mode .admin-table-wrap,
html[data-theme="dark"] .admin-customers-table-wrap,
body.dark-mode .admin-customers-table-wrap,
html[data-theme="dark"] .admin-tech-management-wrap,
body.dark-mode .admin-tech-management-wrap,
html[data-theme="dark"] .tech-table-wrap,
body.dark-mode .tech-table-wrap,
html[data-theme="dark"] .tech-client-table-wrap,
body.dark-mode .tech-client-table-wrap{
  scrollbar-color:#475569 #111827;
}


html[data-theme="dark"] .admin-shell,
body.dark-mode .admin-shell,
html[data-theme="dark"] .technician-shell,
body.dark-mode .technician-shell,
html[data-theme="dark"] .admin-content,
body.dark-mode .admin-content,
html[data-theme="dark"] .technician-content,
body.dark-mode .technician-content,
html[data-theme="dark"] .admin-topbar,
body.dark-mode .admin-topbar{
  color:var(--dm-text) !important;
}
html[data-theme="dark"] .admin-sidebar,
body.dark-mode .admin-sidebar,
html[data-theme="dark"] .technician-sidebar,
body.dark-mode .technician-sidebar{
  background:#0d1625 !important;
  border-color:var(--dm-border) !important;
}
html[data-theme="dark"] .admin-card,
body.dark-mode .admin-card{
  background:var(--dm-surface) !important;
  border-color:var(--dm-border) !important;
  color:var(--dm-text) !important;
}
html[data-theme="dark"] .admin-topbar,
body.dark-mode .admin-topbar{
  background:var(--dm-surface) !important;
  border-color:var(--dm-border) !important;
}


html[data-theme="dark"] .admin-filter-row input,
body.dark-mode .admin-filter-row input,
html[data-theme="dark"] .admin-filter-row select,
body.dark-mode .admin-filter-row select,
html[data-theme="dark"] .admin-table select,
body.dark-mode .admin-table select{
  background:var(--dm-input) !important;
  color:var(--dm-text) !important;
  border-color:var(--dm-border) !important;
}


html[data-theme="dark"] [style*="background: #fff"],
body.dark-mode [style*="background: #fff"],
html[data-theme="dark"] [style*="background:#fff"],
body.dark-mode [style*="background:#fff"],
html[data-theme="dark"] [style*="background: white"],
body.dark-mode [style*="background: white"],
html[data-theme="dark"] [style*="background:#ffffff"],
body.dark-mode [style*="background:#ffffff"],
html[data-theme="dark"] [style*="background: #ffffff"],
body.dark-mode [style*="background: #ffffff"]{
  background:var(--dm-surface) !important;
}


html[data-theme="dark"] *,
body.dark-mode *{
  scrollbar-color:#475569 #0f172a;
}
html[data-theme="dark"] *::-webkit-scrollbar,
body.dark-mode *::-webkit-scrollbar{background:#0f172a}
html[data-theme="dark"] *::-webkit-scrollbar-thumb,
body.dark-mode *::-webkit-scrollbar-thumb{
  background:#475569;
  border-radius:999px;
}
html[data-theme="dark"] *::-webkit-scrollbar-thumb:hover,
body.dark-mode *::-webkit-scrollbar-thumb:hover{background:#64748b}


html[data-theme="dark"],
body.dark-mode{
  color-scheme:dark;
}


html[data-theme="dark"] .hero-slogan-card,
body.dark-mode .hero-slogan-card{
  background:rgba(10,18,32,.58) !important;
  border-color:rgba(148,163,184,.28) !important;
}
html[data-theme="dark"] .slogan-label,
body.dark-mode .slogan-label,
html[data-theme="dark"] .slogan-main,
body.dark-mode .slogan-main,
html[data-theme="dark"] .slogan-sub,
body.dark-mode .slogan-sub{
  color:#f1f5f9 !important;
}
html[data-theme="dark"] .btn-secondary,
body.dark-mode .btn-secondary{
  background:rgba(15,23,42,.72) !important;
  color:#e2e8f0 !important;
  border-color:#475569 !important;
}
html[data-theme="dark"] .btn-secondary:hover,
body.dark-mode .btn-secondary:hover{
  background:#1e293b !important;
  color:#fff !important;
}


html[data-theme="dark"] body,
body.dark-mode{
  --dm-text:#e8eef7;
  --dm-text-strong:#ffffff;
  --dm-muted:#b8c5d6;
  --dm-muted-2:#9aabc0;
}


html[data-theme="dark"] .admin-content *,
body.dark-mode .admin-content *,
html[data-theme="dark"] .technician-content *,
body.dark-mode .technician-content *,
html[data-theme="dark"] .admin-card *,
body.dark-mode .admin-card *,
html[data-theme="dark"] .tech-card *,
body.dark-mode .tech-card *{
  text-shadow:none;
}


html[data-theme="dark"] .admin-content h1,
body.dark-mode .admin-content h1,
html[data-theme="dark"] .admin-content h2,
body.dark-mode .admin-content h2,
html[data-theme="dark"] .admin-content h3,
body.dark-mode .admin-content h3,
html[data-theme="dark"] .admin-content h4,
body.dark-mode .admin-content h4,
html[data-theme="dark"] .technician-content h1,
body.dark-mode .technician-content h1,
html[data-theme="dark"] .technician-content h2,
body.dark-mode .technician-content h2,
html[data-theme="dark"] .technician-content h3,
body.dark-mode .technician-content h3,
html[data-theme="dark"] .technician-content h4,
body.dark-mode .technician-content h4,
html[data-theme="dark"] .admin-card h1,
body.dark-mode .admin-card h1,
html[data-theme="dark"] .admin-card h2,
body.dark-mode .admin-card h2,
html[data-theme="dark"] .admin-card h3,
body.dark-mode .admin-card h3,
html[data-theme="dark"] .admin-card h4,
body.dark-mode .admin-card h4{
  color:#f8fafc !important;
}

html[data-theme="dark"] .admin-content p,
body.dark-mode .admin-content p,
html[data-theme="dark"] .technician-content p,
body.dark-mode .technician-content p,
html[data-theme="dark"] .admin-card p,
body.dark-mode .admin-card p,
html[data-theme="dark"] .technician-card p,
body.dark-mode .technician-card p,
html[data-theme="dark"] .admin-content small,
body.dark-mode .admin-content small,
html[data-theme="dark"] .technician-content small,
body.dark-mode .technician-content small{
  color:#b8c5d6 !important;
}

html[data-theme="dark"] label,
body.dark-mode label{
  color:#dbe6f2 !important;
}

html[data-theme="dark"] table caption,
body.dark-mode table caption,
html[data-theme="dark"] th,
body.dark-mode th{
  color:#f1f5f9 !important;
}

html[data-theme="dark"] td,
body.dark-mode td{
  color:#dbe6f2 !important;
}


html[data-theme="dark"] a:not(.btn-primary):not(.btn-login),
body.dark-mode a:not(.btn-primary):not(.btn-login){
  color:#8ddbb9;
}
html[data-theme="dark"] a:not(.btn-primary):not(.btn-login):hover,
body.dark-mode a:not(.btn-primary):not(.btn-login):hover{
  color:#c9f2df;
}


html[data-theme="dark"] button:not(.btn-primary):not(.btn-login),
body.dark-mode button:not(.btn-primary):not(.btn-login){
  color:#e5edf7;
}
html[data-theme="dark"] .btn-secondary,
body.dark-mode .btn-secondary{
  color:#f1f5f9 !important;
}


html[data-theme="dark"] input,
body.dark-mode input,
html[data-theme="dark"] select,
body.dark-mode select,
html[data-theme="dark"] textarea,
body.dark-mode textarea{
  color:#f1f5f9 !important;
  -webkit-text-fill-color:#f1f5f9 !important;
  caret-color:#fff !important;
}
html[data-theme="dark"] input::placeholder,
body.dark-mode input::placeholder,
html[data-theme="dark"] textarea::placeholder,
body.dark-mode textarea::placeholder{
  color:#8fa1b5 !important;
  -webkit-text-fill-color:#8fa1b5 !important;
}


html[data-theme="dark"] [style*="color: #000"],
body.dark-mode [style*="color: #000"],
html[data-theme="dark"] [style*="color:#000"],
body.dark-mode [style*="color:#000"],
html[data-theme="dark"] [style*="color: black"],
body.dark-mode [style*="color: black"],
html[data-theme="dark"] [style*="color: #0f172a"],
body.dark-mode [style*="color: #0f172a"],
html[data-theme="dark"] [style*="color:#0f172a"],
body.dark-mode [style*="color:#0f172a"],
html[data-theme="dark"] [style*="color: #1e293b"],
body.dark-mode [style*="color: #1e293b"],
html[data-theme="dark"] [style*="color:#1e293b"],
body.dark-mode [style*="color:#1e293b"],
html[data-theme="dark"] [style*="color: #334155"],
body.dark-mode [style*="color: #334155"],
html[data-theme="dark"] [style*="color:#334155"],
body.dark-mode [style*="color:#334155"],
html[data-theme="dark"] [style*="color: #475569"],
body.dark-mode [style*="color: #475569"],
html[data-theme="dark"] [style*="color:#475569"],
body.dark-mode [style*="color:#475569"],
html[data-theme="dark"] [style*="color: #64748b"],
body.dark-mode [style*="color: #64748b"],
html[data-theme="dark"] [style*="color:#64748b"],
body.dark-mode [style*="color:#64748b"]{
  color:#dbe6f2 !important;
  -webkit-text-fill-color:#dbe6f2 !important;
}


html[data-theme="dark"] [style*="rgba(15, 23, 42"],
body.dark-mode [style*="rgba(15, 23, 42"],
html[data-theme="dark"] [style*="rgba(11, 42, 74"],
body.dark-mode [style*="rgba(11, 42, 74"]{
  color:#dbe6f2 !important;
}


html[data-theme="dark"] :disabled,
body.dark-mode :disabled{
  color:#8293a8 !important;
  -webkit-text-fill-color:#8293a8 !important;
  opacity:.78;
}


html[data-theme="dark"] svg,
body.dark-mode svg{
  color:#dbe6f2;
}
html[data-theme="dark"] svg text,
body.dark-mode svg text{
  fill:#e8eef7 !important;
}


html[data-theme="dark"] .status-badge,
body.dark-mode .status-badge{
  text-shadow:none !important;
}


html[data-theme="dark"] :focus-visible,
body.dark-mode :focus-visible{
  outline:2px solid #78d0ac !important;
  outline-offset:2px;
}


html[data-theme="dark"] input:-webkit-autofill,
body.dark-mode input:-webkit-autofill,
html[data-theme="dark"] textarea:-webkit-autofill,
body.dark-mode textarea:-webkit-autofill,
html[data-theme="dark"] select:-webkit-autofill,
body.dark-mode select:-webkit-autofill{
  -webkit-text-fill-color:#f1f5f9 !important;
  box-shadow:0 0 0 1000px #0f172a inset !important;
  transition:background-color 9999s ease-in-out 0s;
}


html[data-theme="dark"] .btn-primary,
body.dark-mode .btn-primary,
html[data-theme="dark"] .admin-primary-btn,
body.dark-mode .admin-primary-btn,
html[data-theme="dark"] .save-status-btn,
body.dark-mode .save-status-btn{
  color:#fff !important;
  -webkit-text-fill-color:#fff !important;
}


html[data-theme="dark"] .stock-source-panel,
body.dark-mode .stock-source-panel,
html[data-theme="dark"] .stock-source-panel .bon-total-table-scroll,
body.dark-mode .stock-source-panel .bon-total-table-scroll{
  background:#14231e !important;
  color:#e5edf7 !important;
}


html[data-theme="dark"] .stock-source-panel .bon-total-table tbody tr:nth-child(even) td,
body.dark-mode .stock-source-panel .bon-total-table tbody tr:nth-child(even) td,
html[data-theme="dark"] .stock-source-panel .bon-total-table tbody tr:nth-child(odd) td,
body.dark-mode .stock-source-panel .bon-total-table tbody tr:nth-child(odd) td{
  background:#14231e !important;
  color:#d1e4d9 !important;
  border-color:#2c4438 !important;
}


html[data-theme="dark"] .stock-source-panel .bon-total-table tbody tr.bon-total-group-row td,
body.dark-mode .stock-source-panel .bon-total-table tbody tr.bon-total-group-row td{
  background:#19382d !important;
  color:#f8fafc !important;
  border-color:#3a6957 !important;
  font-weight:800 !important;
}


html[data-theme="dark"] .stock-source-panel .bon-total-table tbody tr.bon-total-summary-row td,
body.dark-mode .stock-source-panel .bon-total-table tbody tr.bon-total-summary-row td{
  background:#1a3027 !important;
  color:#ffffff !important;
  border-color:#426956 !important;
  font-weight:800 !important;
}


html[data-theme="dark"] .stock-source-panel .bon-total-table thead th,
body.dark-mode .stock-source-panel .bon-total-table thead th{
  background:#11221d !important;
  color:#d8eee1 !important;
  border-color:#355447 !important;
}


html[data-theme="dark"] .stock-source-panel .bon-total-table tbody tr:hover td,
body.dark-mode .stock-source-panel .bon-total-table tbody tr:hover td{
  background:#1a3027 !important;
  color:#ffffff !important;
}


html[data-theme="dark"] .stock-source-panel strong[style*="color:#0f172a"],
body.dark-mode .stock-source-panel strong[style*="color:#0f172a"],
html[data-theme="dark"] .stock-source-panel strong[style*="color: #0f172a"],
body.dark-mode .stock-source-panel strong[style*="color: #0f172a"]{
  color:#f8fafc !important;
}
html[data-theme="dark"] .stock-source-panel div[style*="color:#64748b"],
body.dark-mode .stock-source-panel div[style*="color:#64748b"],
html[data-theme="dark"] .stock-source-panel div[style*="color: #64748b"],
body.dark-mode .stock-source-panel div[style*="color: #64748b"]{
  color:#aebed0 !important;
}


html[data-theme="dark"] .stock-source-tab,
body.dark-mode .stock-source-tab{
  background:#1b2738 !important;
  color:#dce7f3 !important;
  border:1px solid #3b4d64 !important;
}
html[data-theme="dark"] .stock-source-tab:hover,
body.dark-mode .stock-source-tab:hover{
  background:#1b3c31 !important;
  color:#ffffff !important;
}
html[data-theme="dark"] .stock-source-tab.active,
body.dark-mode .stock-source-tab.active{
  background:#146b58 !important;
  color:#ffffff !important;
  border-color:#68c6a0 !important;
  box-shadow:0 0 0 1px rgba(105,198,159,.25) inset !important;
}


html[data-theme="dark"] .stock-source-panel ~ *,
body.dark-mode .stock-source-panel ~ *{
  color:#e5edf7;
}


html[data-theme="dark"] .stock-source-panel .bon-total-table td[style],
body.dark-mode .stock-source-panel .bon-total-table td[style]{
  color:#e5edf7 !important;
}


html[data-theme="dark"] .stock-source-panel .status-badge,
body.dark-mode .stock-source-panel .status-badge{
  -webkit-text-fill-color:currentColor !important;
}

/* ===== Footer responsive cleanup =====
   This final block intentionally supersedes the older, conflicting mobile
   footer rules above.  Footer content must reflow, never become a horizontal
   slider or four narrow columns. */
.site-footer {
  width: min(100%, 1840px) !important;
  min-width: 0;
  padding: 28px clamp(20px, 3vw, 48px) 20px !important;
  overflow: clip !important;
}

.site-footer-grid {
  display: grid !important;
  grid-template-columns: minmax(190px, 1.15fr) repeat(3, minmax(0, 1fr)) !important;
  gap: 22px clamp(14px, 1.8vw, 30px) !important;
  width: 100% !important;
  align-items: start !important;
}

.site-footer-grid > *,
.site-footer-grid > :first-child {
  min-width: 0 !important;
  max-width: none !important;
}

.site-footer-grid > * {
  flex: initial !important;
}

.site-footer p,
.site-footer li,
.site-footer a,
.site-footer-bottom {
  overflow-wrap: anywhere;
  word-break: normal;
}

.site-footer ul { gap: 6px; }
.site-footer-contact {
  width: 100%;
  margin-top: 0;
}
.site-footer-bottom { margin-top: 26px !important; }

@media (min-width: 641px) and (max-width: 1000px) {
  .site-footer-grid {
    grid-template-columns: minmax(160px, 1.1fr) repeat(3, minmax(0, 1fr)) !important;
    gap: 14px !important;
  }
  .site-footer p,
  .site-footer li,
  .site-footer a {
    font-size: .84rem !important;
  }
}

@media (max-width: 640px) {
  .site-footer {
    margin-top: 16px !important;
    padding: 24px 20px 100px !important;
    border-radius: 18px 18px 0 0;
  }

  .site-footer-grid {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 26px !important;
    overflow: visible !important;
    padding: 0 !important;
  }

  .site-footer-grid > *,
  .site-footer-grid > :first-child {
    flex: initial !important;
    min-width: 0 !important;
    max-width: none !important;
  }

  .site-footer-brand img { width: 64px !important; }
  .site-footer-contact { margin-top: 0; }
  .site-footer h4 { font-size: 1.05rem !important; }
  .site-footer p,
  .site-footer li,
  .site-footer a { font-size: .95rem !important; line-height: 1.6 !important; }
  .site-footer-bottom {
    margin-top: 26px !important;
    padding-top: 16px !important;
    font-size: .78rem !important;
    line-height: 1.5 !important;
  }
}

/* Final theme precedence: kept last so legacy blocks cannot desynchronise the UI. */
html[data-leressae-theme="light"] :is(.admin-card, .tech-section, .tech-card, .admin-topbar) {
  background: #fff !important; border-color: #d5e5dc !important; color: #183a35 !important;
}
html[data-leressae-theme="light"] :is(.admin-card h1, .admin-card h2, .admin-card h3, .admin-card h4, .tech-section h1, .tech-section h2, .tech-section h3, .tech-section h4) { color: #173b35 !important; }
html[data-leressae-theme="light"] :is(.admin-card p, .tech-section p, .admin-card small, .tech-section small) { color: #607872 !important; }
html[data-leressae-theme="light"] :is(.admin-table th, .tech-table th) { background: #edf6f0 !important; color: #315b4b !important; }
html[data-leressae-theme="light"] :is(.admin-table td, .tech-table td) { background: #fff !important; color: #405d53 !important; }

html[data-leressae-theme="dark"] :is(.admin-content, .technician-content) { background: #0d1916 !important; color: #e4f3ec !important; }
html[data-leressae-theme="dark"] :is(.admin-card, .tech-section, .tech-card, .admin-topbar) {
  background: #14231e !important; border-color: #315448 !important; color: #e4f3ec !important;
}
html[data-leressae-theme="dark"] :is(.admin-card h1, .admin-card h2, .admin-card h3, .admin-card h4, .tech-section h1, .tech-section h2, .tech-section h3, .tech-section h4, .admin-content h1, .admin-content h2, .technician-content h1, .technician-content h2) { color: #e8f5ee !important; }
html[data-leressae-theme="dark"] :is(.admin-card p, .tech-section p, .admin-card small, .tech-section small, .admin-content p, .technician-content p) { color: #a8c2b7 !important; }
html[data-leressae-theme="dark"] :is(.admin-card input, .admin-card select, .admin-card textarea, .tech-section input, .tech-section select, .tech-section textarea) {
  background: #10211b !important; color: #e4f3ec !important; border-color: #3b5b4f !important; -webkit-text-fill-color: #e4f3ec !important;
}
html[data-leressae-theme="dark"] :is(.admin-table th, .tech-table th) { background: #1a3328 !important; color: #d8eee1 !important; border-color: #355444 !important; }
html[data-leressae-theme="dark"] :is(.admin-table td, .tech-table td) { background: #14231e !important; color: #d1e4d9 !important; border-color: #2c4438 !important; }
html[data-leressae-theme="dark"] :is(.admin-table tbody tr:hover td, .tech-table tbody tr:hover td) { background: #1a3027 !important; color: #fff !important; }
html[data-leressae-theme="dark"] :is(.admin-nav-item, .technician-nav button) { color: #cce1d6 !important; }
html[data-leressae-theme="dark"] :is(.admin-nav-item:hover, .admin-nav-item.active, .technician-nav button:hover, .technician-nav button.active) { background: rgba(26, 139, 105, .24) !important; color: #fff !important; }
html[data-leressae-theme="dark"] #page-dashboard { --pub-ink: #e8f5ee; --pub-muted: #b2c8bf; --pub-border: #345348; --pub-surface: #14241f; }
html[data-leressae-theme="dark"] #page-dashboard :is(.hero-section, .hero-slogan-card, .pillar-card, .dashboard-section, .service-item-card, .tutorial-card) { background: linear-gradient(155deg, #172c25, #10201c) !important; border-color: #345348 !important; }
html[data-leressae-theme="dark"] #page-dashboard :is(.hero-title, .slogan-main, .pillar-title, .service-item-title, .tutorial-card h3, .section-title-text) { color: #e8f5ee !important; }
html[data-leressae-theme="dark"] #page-dashboard :is(.hero-desc, .slogan-label, .slogan-sub, .pillar-desc, .service-item-desc, .tutorial-card p, .section-sub-text, .tutorial-meta) { color: #b2c8bf !important; }

/* Hero copy: remove legacy outline/shadow layers that made the title look
   duplicated and the subtitle hard to read against the banner. */
#page-dashboard .hero-section .hero-title,
#page-dashboard .hero-section .hero-desc {
  text-shadow: none !important;
  -webkit-text-stroke: 0 !important;
  filter: none !important;
}
html[data-leressae-theme="light"] #page-dashboard .hero-section .hero-title { color: #173b35 !important; }
html[data-leressae-theme="light"] #page-dashboard .hero-section .hero-desc { color: #536d70 !important; font-weight: 600 !important; }
html[data-leressae-theme="dark"] #page-dashboard .hero-section .hero-title { color: #f8fbff !important; }
html[data-leressae-theme="dark"] #page-dashboard .hero-section .hero-desc { color: #c5d8ce !important; font-weight: 500 !important; }

/* ===== TECHNICIAN TABLE COLUMN WIDTHS & HORIZONTAL SCROLL FIX ===== */
.technician-shell .tech-client-table-wrap {
  overflow-x: auto !important;
  -webkit-overflow-scrolling: touch;
}


.technician-shell .tech-client-table {
  min-width: 1400px !important;
}
.technician-shell .tech-status-page .tech-client-table {
  min-width: 1540px !important;
}

/* Explicit widths to maintain proportion with table-layout: fixed */
.technician-shell .tech-client-table th:nth-child(1),
.technician-shell .tech-client-table td:nth-child(1) { width: 140px !important; min-width: 140px !important; }

.technician-shell .tech-client-table th:nth-child(2),
.technician-shell .tech-client-table td:nth-child(2) { width: 115px !important; min-width: 115px !important; }

.technician-shell .tech-client-table th:nth-child(3),
.technician-shell .tech-client-table td:nth-child(3) { width: 155px !important; min-width: 155px !important; }

.technician-shell .tech-client-table th:nth-child(4),
.technician-shell .tech-client-table td:nth-child(4) { width: 140px !important; min-width: 140px !important; }

.technician-shell .tech-client-table th:nth-child(5),
.technician-shell .tech-client-table td:nth-child(5) { width: 220px !important; min-width: 220px !important; }

.technician-shell .tech-client-table th:nth-child(6),
.technician-shell .tech-client-table td:nth-child(6) { width: 135px !important; min-width: 135px !important; text-align: center !important; }

.technician-shell .tech-client-table th:nth-child(7),
.technician-shell .tech-client-table td:nth-child(7) { width: 145px !important; min-width: 145px !important; }

.technician-shell .tech-client-table th:nth-child(8),
.technician-shell .tech-client-table td:nth-child(8) { width: 190px !important; min-width: 190px !important; }

.technician-shell .tech-client-table th:nth-child(9),
.technician-shell .tech-client-table td:nth-child(9),
.technician-shell .tech-media-cell {
  width: 156px !important;
  min-width: 156px !important;
  text-align: center !important;
  vertical-align: middle !important;
  overflow: visible !important;
  padding: 8px 6px !important;
}

.technician-shell .tech-status-page .tech-client-table th:nth-child(10),
.technician-shell .tech-status-page .tech-client-table td:nth-child(10) {
  width: 150px !important;
  min-width: 150px !important;
  text-align: center !important;
  vertical-align: middle !important;
}

/* Neat Google Maps Link Chip */
.technician-shell .tech-map-link {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 5px !important;
  min-height: 32px !important;
  padding: 5px 12px !important;
  border-radius: 8px !important;
  font-size: 11.5px !important;
  font-weight: 700 !important;
  text-decoration: none !important;
  white-space: nowrap !important;
  border: 1px solid rgba(8,127,112, 0.25) !important;
  background: rgba(8,127,112, 0.08) !important;
  color: #087f70 !important;
  transition: all 0.2s ease !important;
}
.technician-shell .tech-map-link:hover {
  background: rgba(8,127,112, 0.18) !important;
  border-color: rgba(8,127,112, 0.45) !important;
  color: #075e55 !important;
  transform: translateY(-1px) !important;
  text-decoration: none !important;
}
html[data-leressae-theme="dark"] .technician-shell .tech-map-link,
body.dark-mode .technician-shell .tech-map-link {
  background: rgba(8, 127, 112, 0.1) !important;
  border-color: rgba(8, 127, 112, 0.25) !important;
  color: #78d0ac !important;
}
html[data-leressae-theme="dark"] .technician-shell .tech-map-link:hover,
body.dark-mode .technician-shell .tech-map-link:hover {
  background: rgba(8, 127, 112, 0.2) !important;
  border-color: rgba(8, 127, 112, 0.5) !important;
  color: #8ddbb9 !important;
}

/* ===== LIHAT MEDIA BUTTON & CELL ENHANCEMENTS ===== */
.tech-media-cell {
  text-align: center !important;
  vertical-align: middle !important;
  overflow: visible !important;
  white-space: nowrap !important;
}
.tech-media-cell :is(button, a, span) {
  max-width: none !important;
}

.tech-media-btn,
.technician-shell .tech-media-button,
.technician-content .tech-media-btn,
.technician-content .tech-media-button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 7px !important;
  width: auto !important;
  min-width: 120px !important;
  max-width: none !important;
  height: 38px !important;
  min-height: 38px !important;
  max-height: 38px !important;
  padding: 0 14px !important;
  margin: 0 auto !important;
  border-radius: 9px !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  letter-spacing: 0.15px !important;
  white-space: nowrap !important;
  overflow: visible !important;
  cursor: pointer !important;
  box-sizing: border-box !important;
  text-decoration: none !important;
  transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1) !important;
  background: linear-gradient(135deg, #f0f9ff 0%, #e0f2fe 100%) !important;
  color: #087f70 !important;
  border: 1px solid #b5e8d2 !important;
  box-shadow: 0 1px 3px rgba(8,127,112, 0.08) !important;
}

.tech-media-btn:hover,
.technician-shell .tech-media-button:hover,
.technician-content .tech-media-btn:hover,
.technician-content .tech-media-button:hover {
  background: linear-gradient(135deg, #087f70 0%, #075e55 100%) !important;
  color: #ffffff !important;
  border-color: #087f70 !important;
  box-shadow: 0 4px 14px rgba(8,127,112, 0.28) !important;
  transform: translateY(-1px) !important;
}

.tech-media-btn:active,
.technician-shell .tech-media-button:active,
.technician-content .tech-media-btn:active,
.technician-content .tech-media-button:active {
  transform: translateY(0) scale(0.98) !important;
  box-shadow: 0 1px 4px rgba(8,127,112, 0.18) !important;
}

.tech-media-btn .tech-media-btn-icon,
.tech-media-button .tech-media-btn-icon {
  width: 15px !important;
  height: 15px !important;
  flex-shrink: 0 !important;
  stroke: currentColor !important;
  transition: transform 0.2s ease !important;
}

.tech-media-btn:hover .tech-media-btn-icon,
.tech-media-button:hover .tech-media-btn-icon {
  transform: scale(1.12) !important;
}

.tech-media-btn-count {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 18px !important;
  height: 18px !important;
  padding: 0 5px !important;
  border-radius: 999px !important;
  font-size: 10px !important;
  font-weight: 800 !important;
  background: rgba(8,127,112, 0.14) !important;
  color: inherit !important;
  line-height: 1 !important;
  transition: all 0.2s ease !important;
}

.tech-media-btn:hover .tech-media-btn-count,
.tech-media-button:hover .tech-media-btn-count {
  background: rgba(255, 255, 255, 0.25) !important;
  color: #ffffff !important;
}

/* Empty State Badge */
.tech-media-empty {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 5px !important;
  min-height: 32px !important;
  padding: 4px 10px !important;
  border-radius: 8px !important;
  font-size: 11.5px !important;
  font-weight: 600 !important;
  color: #64748b !important;
  background: rgba(100, 116, 139, 0.08) !important;
  border: 1px dashed rgba(100, 116, 139, 0.28) !important;
  white-space: nowrap !important;
  user-select: none !important;
}
.tech-media-empty .tech-media-empty-icon {
  width: 13px !important;
  height: 13px !important;
  flex-shrink: 0 !important;
  opacity: 0.7 !important;
}

/* Dark Mode Styling for Media Button */
html[data-leressae-theme="dark"] .tech-media-btn,
html[data-leressae-theme="dark"] .technician-shell .tech-media-button,
html[data-leressae-theme="dark"] .technician-content .tech-btn.secondary.tech-media-button,
html[data-leressae-theme="dark"] .technician-content .tech-btn.secondary[data-tech-customer-media],
html[data-leressae-theme="dark"] .technician-content .btn-secondary[data-tech-customer-media],
html[data-theme="dark"] .tech-media-btn,
body.dark-mode .tech-media-btn,
body.dark-mode .technician-shell .tech-media-button {
  background: linear-gradient(135deg, rgba(8,127,112, 0.16) 0%, rgba(8,127,112, 0.26) 100%) !important;
  color: #78d0ac !important;
  border: 1px solid rgba(8, 127, 112, 0.38) !important;
  box-shadow: 0 2px 8px rgba(8,127,112, 0.18) !important;
}

html[data-leressae-theme="dark"] .tech-media-btn:hover,
html[data-leressae-theme="dark"] .technician-shell .tech-media-button:hover,
html[data-leressae-theme="dark"] .technician-content .tech-btn.secondary.tech-media-button:hover,
html[data-leressae-theme="dark"] .technician-content .tech-btn.secondary[data-tech-customer-media]:hover,
html[data-leressae-theme="dark"] .technician-content .btn-secondary[data-tech-customer-media]:hover,
html[data-theme="dark"] .tech-media-btn:hover,
body.dark-mode .tech-media-btn:hover,
body.dark-mode .technician-shell .tech-media-button:hover {
  background: linear-gradient(135deg, rgba(8,127,112, 0.35) 0%, rgba(8,127,112, 0.5) 100%) !important;
  color: #ffffff !important;
  border-color: #78d0ac !important;
  box-shadow: 0 4px 18px rgba(8,127,112, 0.35), 0 0 0 1px rgba(8, 127, 112, 0.3) !important;
  transform: translateY(-1px) !important;
}

html[data-leressae-theme="dark"] .tech-media-btn .tech-media-btn-count,
html[data-leressae-theme="dark"] .technician-shell .tech-media-button .tech-media-btn-count,
body.dark-mode .tech-media-btn .tech-media-btn-count {
  background: rgba(8, 127, 112, 0.22) !important;
  color: #8ddbb9 !important;
}

html[data-leressae-theme="dark"] .tech-media-btn:hover .tech-media-btn-count,
html[data-leressae-theme="dark"] .technician-shell .tech-media-button:hover .tech-media-btn-count,
body.dark-mode .tech-media-btn:hover .tech-media-btn-count {
  background: rgba(255, 255, 255, 0.25) !important;
  color: #ffffff !important;
}

html[data-leressae-theme="dark"] .tech-media-empty,
body.dark-mode .tech-media-empty {
  color: #8da2ba !important;
  background: rgba(141, 162, 186, 0.08) !important;
  border-color: rgba(141, 162, 186, 0.24) !important;
}

/* Modal Customer Media Dialog Enhancements */
.tech-customer-media-dialog {
  border-radius: 18px !important;
  border: 1px solid rgba(226, 232, 240, 0.8) !important;
  box-shadow: 0 25px 60px -15px rgba(0, 0, 0, 0.35) !important;
}
.tech-customer-media-header-info {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
}
.tech-media-dialog-icon {
  color: #087f70 !important;
  flex-shrink: 0 !important;
}
.tech-customer-media-subtitle {
  display: block !important;
  font-size: 12px !important;
  color: #64748b !important;
  margin-top: 2px !important;
  font-weight: 500 !important;
}
.tech-media-close-btn,
.tech-customer-media-dialog [data-tech-media-close] {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 36px !important;
  height: 36px !important;
  border-radius: 10px !important;
  border: 0 !important;
  background: #f1f5f9 !important;
  color: #475569 !important;
  font-size: 22px !important;
  cursor: pointer !important;
  transition: all 0.2s ease !important;
  line-height: 1 !important;
}
.tech-media-close-btn:hover,
.tech-customer-media-dialog [data-tech-media-close]:hover {
  background: #e2e8f0 !important;
  color: #0f172a !important;
  transform: rotate(90deg) !important;
}
.tech-customer-media-item {
  border-radius: 14px !important;
  transition: transform 0.2s ease, box-shadow 0.2s ease !important;
}
.tech-customer-media-item:hover {
  transform: translateY(-2px) !important;
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.12) !important;
}
.tech-media-direct-link {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 8px 16px !important;
  border-radius: 9px !important;
  background: #087f70 !important;
  color: #ffffff !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  transition: all 0.2s ease !important;
}
.tech-media-direct-link:hover {
  background: #075e55 !important;
  transform: translateY(-1px) !important;
}
.tech-customer-media-empty-dialog {
  grid-column: 1 / -1;
  text-align: center;
  padding: 40px 20px;
  color: #64748b;
  font-size: 14px;
}

/* Dark mode for Media Dialog */
html[data-leressae-theme="dark"] .tech-customer-media-dialog,
body.dark-mode .tech-customer-media-dialog {
  background: #0f1b2d !important;
  color: #e2e8f0 !important;
  border-color: #233852 !important;
  box-shadow: 0 25px 65px rgba(0, 0, 0, 0.65) !important;
}
html[data-leressae-theme="dark"] .tech-customer-media-dialog > header,
body.dark-mode .tech-customer-media-dialog > header {
  border-bottom-color: #1e2f47 !important;
}
html[data-leressae-theme="dark"] .tech-customer-media-dialog h3,
body.dark-mode .tech-customer-media-dialog h3 {
  color: #f8fafc !important;
}
html[data-leressae-theme="dark"] .tech-media-dialog-icon,
body.dark-mode .tech-media-dialog-icon {
  color: #78d0ac !important;
}
html[data-leressae-theme="dark"] .tech-customer-media-subtitle,
body.dark-mode .tech-customer-media-subtitle {
  color: #8da2ba !important;
}
html[data-leressae-theme="dark"] .tech-media-close-btn,
html[data-leressae-theme="dark"] .tech-customer-media-dialog [data-tech-media-close],
body.dark-mode .tech-media-close-btn,
body.dark-mode .tech-customer-media-dialog [data-tech-media-close] {
  background: #18283e !important;
  color: #94a3b8 !important;
}
html[data-leressae-theme="dark"] .tech-media-close-btn:hover,
html[data-leressae-theme="dark"] .tech-customer-media-dialog [data-tech-media-close]:hover,
body.dark-mode .tech-media-close-btn:hover,
body.dark-mode .tech-customer-media-dialog [data-tech-media-close]:hover {
  background: #233852 !important;
  color: #ffffff !important;
}
html[data-leressae-theme="dark"] .tech-customer-media-item,
body.dark-mode .tech-customer-media-item {
  background: #132238 !important;
  border-color: #223750 !important;
}
html[data-leressae-theme="dark"] .tech-customer-media-item > div,
body.dark-mode .tech-customer-media-item > div {
  background: #091322 !important;
  border-color: #1b2d44 !important;
}
html[data-leressae-theme="dark"] .tech-customer-media-item small,
body.dark-mode .tech-customer-media-item small {
  color: #94a3b8 !important;
}
html[data-leressae-theme="dark"] .tech-customer-media-empty-dialog,
body.dark-mode .tech-customer-media-empty-dialog {
  color: #8da2ba !important;
}
@media (max-width: 640px) {
  .technician-shell .tech-media-cell { min-width: 130px !important; }
  .tech-media-btn,
  .technician-shell .tech-media-button {
    min-width: 108px !important;
    height: 36px !important;
    min-height: 36px !important;
    padding: 0 10px !important;
    font-size: 11px !important;
  }
}



/* ================================================================
   LERESSAE — FINAL THEME SYNCHRONIZATION & READABILITY OVERRIDE
   Added as the LAST CSS block intentionally.
   Supports:
   - data-leressae-theme="light|dark"
   - data-theme="light|dark"
   - body.dark-mode
   - legacy selectors that may still exist in older HTML
   ================================================================ */

/* ---------- Theme tokens ---------- */
html[data-leressae-theme="light"],
html[data-theme="light"] {
  color-scheme: light;
  --ler-theme-bg: #f6f9fc;
  --ler-theme-surface: #ffffff;
  --ler-theme-surface-2: #f8fbfe;
  --ler-theme-border: #dce7f0;
  --ler-theme-border-strong: #c6d5e2;
  --ler-theme-text: #122b45;
  --ler-theme-text-strong: #0f2439;
  --ler-theme-muted: #5d7185;
  --ler-theme-link: #075e55;
  --ler-theme-input: #ffffff;
  --ler-theme-input-text: #122b45;
}

html[data-leressae-theme="dark"],
html[data-theme="dark"],
body.dark-mode {
  color-scheme: dark;
  --ler-theme-bg: #0b1220;
  --ler-theme-surface: #111c2d;
  --ler-theme-surface-2: #162437;
  --ler-theme-border: #2d4056;
  --ler-theme-border-strong: #40566f;
  --ler-theme-text: #f3f7fc;
  --ler-theme-text-strong: #ffffff;
  --ler-theme-muted: #b7c6d8;
  --ler-theme-link: #8ddbb9;
  --ler-theme-input: #0d1726;
  --ler-theme-input-text: #f3f7fc;
}

/* ---------- Global admin/technician canvas ---------- */
html[data-leressae-theme="light"] :is(
  .admin-content, .technician-content, .admin-shell, .technician-shell
),
html[data-theme="light"] :is(
  .admin-content, .technician-content, .admin-shell, .technician-shell
) {
  color: var(--ler-theme-text) !important;
}

html[data-leressae-theme="dark"] :is(
  .admin-content, .technician-content, .admin-shell, .technician-shell
),
html[data-theme="dark"] :is(
  .admin-content, .technician-content, .admin-shell, .technician-shell
),
body.dark-mode :is(
  .admin-content, .technician-content, .admin-shell, .technician-shell
) {
  background-color: var(--ler-theme-bg) !important;
  color: var(--ler-theme-text) !important;
}

/* ---------- Cards / panels / sections ---------- */
html[data-leressae-theme="dark"] :is(
  .admin-card,
  .tech-card,
  .tech-section,
  .tech-stat,
  .tech-proof-card,
  .tech-update-proof-box,
  .admin-topbar,
  .technician-topbar,
  .admin-filter-card,
  .admin-panel,
  .settings-card,
  .settings-panel,
  .stock-source-panel,
  .stock-body,
  .card-container
),
html[data-theme="dark"] :is(
  .admin-card,
  .tech-card,
  .tech-section,
  .tech-stat,
  .tech-proof-card,
  .tech-update-proof-box,
  .admin-topbar,
  .technician-topbar,
  .admin-filter-card,
  .admin-panel,
  .settings-card,
  .settings-panel,
  .stock-source-panel,
  .stock-body,
  .card-container
),
body.dark-mode :is(
  .admin-card,
  .tech-card,
  .tech-section,
  .tech-stat,
  .tech-proof-card,
  .tech-update-proof-box,
  .admin-topbar,
  .technician-topbar,
  .admin-filter-card,
  .admin-panel,
  .settings-card,
  .settings-panel,
  .stock-source-panel,
  .stock-body,
  .card-container
) {
  background: var(--ler-theme-surface) !important;
  border-color: var(--ler-theme-border) !important;
  color: var(--ler-theme-text) !important;
}

/* ---------- Headings: always readable ---------- */
html[data-leressae-theme="dark"] :is(
  .admin-content h1, .admin-content h2, .admin-content h3, .admin-content h4,
  .admin-content h5, .admin-content h6,
  .technician-content h1, .technician-content h2, .technician-content h3,
  .technician-content h4, .technician-content h5, .technician-content h6,
  .admin-card h1, .admin-card h2, .admin-card h3, .admin-card h4,
  .admin-card h5, .admin-card h6,
  .tech-section h1, .tech-section h2, .tech-section h3, .tech-section h4,
  .tech-section h5, .tech-section h6,
  .tech-card h1, .tech-card h2, .tech-card h3, .tech-card h4,
  .settings-card h1, .settings-card h2, .settings-card h3,
  .settings-panel h1, .settings-panel h2, .settings-panel h3
),
html[data-theme="dark"] :is(
  .admin-content h1, .admin-content h2, .admin-content h3, .admin-content h4,
  .admin-content h5, .admin-content h6,
  .technician-content h1, .technician-content h2, .technician-content h3,
  .technician-content h4, .technician-content h5, .technician-content h6,
  .admin-card h1, .admin-card h2, .admin-card h3, .admin-card h4,
  .admin-card h5, .admin-card h6,
  .tech-section h1, .tech-section h2, .tech-section h3, .tech-section h4,
  .tech-section h5, .tech-section h6,
  .tech-card h1, .tech-card h2, .tech-card h3, .tech-card h4,
  .settings-card h1, .settings-card h2, .settings-card h3,
  .settings-panel h1, .settings-panel h2, .settings-panel h3
),
body.dark-mode :is(
  .admin-content h1, .admin-content h2, .admin-content h3, .admin-content h4,
  .admin-content h5, .admin-content h6,
  .technician-content h1, .technician-content h2, .technician-content h3,
  .technician-content h4, .technician-content h5, .technician-content h6,
  .admin-card h1, .admin-card h2, .admin-card h3, .admin-card h4,
  .admin-card h5, .admin-card h6,
  .tech-section h1, .tech-section h2, .tech-section h3, .tech-section h4,
  .tech-section h5, .tech-section h6,
  .tech-card h1, .tech-card h2, .tech-card h3, .tech-card h4,
  .settings-card h1, .settings-card h2, .settings-card h3,
  .settings-panel h1, .settings-panel h2, .settings-panel h3
) {
  color: var(--ler-theme-text-strong) !important;
}

/* ---------- Normal text / labels / helper text ---------- */
html[data-leressae-theme="dark"] :is(
  .admin-content p, .admin-content small, .admin-content label,
  .admin-content .muted, .admin-content .description,
  .technician-content p, .technician-content small, .technician-content label,
  .technician-content .muted, .technician-content .description,
  .admin-card p, .admin-card small, .admin-card label,
  .tech-section p, .tech-section small, .tech-section label,
  .tech-card p, .tech-card small, .tech-card label,
  .settings-card p, .settings-card small, .settings-card label,
  .settings-panel p, .settings-panel small, .settings-panel label
),
html[data-theme="dark"] :is(
  .admin-content p, .admin-content small, .admin-content label,
  .admin-content .muted, .admin-content .description,
  .technician-content p, .technician-content small, .technician-content label,
  .technician-content .muted, .technician-content .description,
  .admin-card p, .admin-card small, .admin-card label,
  .tech-section p, .tech-section small, .tech-section label,
  .tech-card p, .tech-card small, .tech-card label,
  .settings-card p, .settings-card small, .settings-card label,
  .settings-panel p, .settings-panel small, .settings-panel label
),
body.dark-mode :is(
  .admin-content p, .admin-content small, .admin-content label,
  .admin-content .muted, .admin-content .description,
  .technician-content p, .technician-content small, .technician-content label,
  .technician-content .muted, .technician-content .description,
  .admin-card p, .admin-card small, .admin-card label,
  .tech-section p, .tech-section small, .tech-section label,
  .tech-card p, .tech-card small, .tech-card label,
  .settings-card p, .settings-card small, .settings-card label,
  .settings-panel p, .settings-panel small, .settings-panel label
) {
  color: var(--ler-theme-muted) !important;
}

/* ---------- Tables: complete synchronization ---------- */
html[data-leressae-theme="dark"] :is(
  .admin-table, .admin-customers-table, .admin-services-table,
  .admin-running-services-table, .admin-completed-services-table,
  .admin-activity-table, .tech-table, .tech-client-table
),
html[data-theme="dark"] :is(
  .admin-table, .admin-customers-table, .admin-services-table,
  .admin-running-services-table, .admin-completed-services-table,
  .admin-activity-table, .tech-table, .tech-client-table
),
body.dark-mode :is(
  .admin-table, .admin-customers-table, .admin-services-table,
  .admin-running-services-table, .admin-completed-services-table,
  .admin-activity-table, .tech-table, .tech-client-table
) {
  color: var(--ler-theme-text) !important;
  border-color: var(--ler-theme-border) !important;
}

html[data-leressae-theme="dark"] :is(
  .admin-table th, .admin-customers-table th, .admin-services-table th,
  .admin-running-services-table th, .admin-completed-services-table th,
  .admin-activity-table th, .tech-table th, .tech-client-table th
),
html[data-theme="dark"] :is(
  .admin-table th, .admin-customers-table th, .admin-services-table th,
  .admin-running-services-table th, .admin-completed-services-table th,
  .admin-activity-table th, .tech-table th, .tech-client-table th
),
body.dark-mode :is(
  .admin-table th, .admin-customers-table th, .admin-services-table th,
  .admin-running-services-table th, .admin-completed-services-table th,
  .admin-activity-table th, .tech-table th, .tech-client-table th
) {
  background: #182a40 !important;
  color: #f8fbff !important;
  border-color: #385069 !important;
  -webkit-text-fill-color: #f8fbff !important;
}

html[data-leressae-theme="dark"] :is(
  .admin-table td, .admin-customers-table td, .admin-services-table td,
  .admin-running-services-table td, .admin-completed-services-table td,
  .admin-activity-table td, .tech-table td, .tech-client-table td
),
html[data-theme="dark"] :is(
  .admin-table td, .admin-customers-table td, .admin-services-table td,
  .admin-running-services-table td, .admin-completed-services-table td,
  .admin-activity-table td, .tech-table td, .tech-client-table td
),
body.dark-mode :is(
  .admin-table td, .admin-customers-table td, .admin-services-table td,
  .admin-running-services-table td, .admin-completed-services-table td,
  .admin-activity-table td, .tech-table td, .tech-client-table td
) {
  background: #111c2d !important;
  color: #e5edf7 !important;
  border-color: #2d4055 !important;
  -webkit-text-fill-color: #e5edf7 !important;
}

html[data-leressae-theme="dark"] :is(
  .admin-table tbody tr:hover td, .admin-customers-table tbody tr:hover td,
  .admin-services-table tbody tr:hover td, .admin-running-services-table tbody tr:hover td,
  .admin-completed-services-table tbody tr:hover td, .admin-activity-table tbody tr:hover td,
  .tech-table tbody tr:hover td, .tech-client-table tbody tr:hover td
),
html[data-theme="dark"] :is(
  .admin-table tbody tr:hover td, .admin-customers-table tbody tr:hover td,
  .admin-services-table tbody tr:hover td, .admin-running-services-table tbody tr:hover td,
  .admin-completed-services-table tbody tr:hover td, .admin-activity-table tbody tr:hover td,
  .tech-table tbody tr:hover td, .tech-client-table tbody tr:hover td
),
body.dark-mode :is(
  .admin-table tbody tr:hover td, .admin-customers-table tbody tr:hover td,
  .admin-services-table tbody tr:hover td, .admin-running-services-table tbody tr:hover td,
  .admin-completed-services-table tbody tr:hover td, .admin-activity-table tbody tr:hover td,
  .tech-table tbody tr:hover td, .tech-client-table tbody tr:hover td
) {
  background: #1a2c42 !important;
  color: #ffffff !important;
}

/* ---------- Table links ---------- */
html[data-leressae-theme="dark"] :is(
  .admin-table a, .admin-customers-table a, .tech-table a, .tech-client-table a
),
html[data-theme="dark"] :is(
  .admin-table a, .admin-customers-table a, .tech-table a, .tech-client-table a
),
body.dark-mode :is(
  .admin-table a, .admin-customers-table a, .tech-table a, .tech-client-table a
) {
  color: #8ddbb9 !important;
  -webkit-text-fill-color: #8ddbb9 !important;
}

/* ---------- Forms / controls ---------- */
html[data-leressae-theme="dark"] :is(
  input, select, textarea
),
html[data-theme="dark"] :is(
  input, select, textarea
),
body.dark-mode :is(
  input, select, textarea
) {
  background-color: var(--ler-theme-input) !important;
  color: var(--ler-theme-input-text) !important;
  border-color: var(--ler-theme-border-strong) !important;
  -webkit-text-fill-color: var(--ler-theme-input-text) !important;
  caret-color: #8ddbb9 !important;
}

html[data-leressae-theme="dark"] :is(
  input::placeholder, textarea::placeholder
),
html[data-theme="dark"] :is(
  input::placeholder, textarea::placeholder
),
body.dark-mode :is(
  input::placeholder, textarea::placeholder
) {
  color: #8194aa !important;
  opacity: 1 !important;
  -webkit-text-fill-color: #8194aa !important;
}

html[data-leressae-theme="dark"] option,
html[data-theme="dark"] option,
body.dark-mode option {
  background: #0d1726 !important;
  color: #f3f7fc !important;
}

/* ---------- Settings controls ---------- */
html[data-leressae-theme="dark"] :is(
  .settings-form-grid, .settings-form, .settings-section,
  .settings-card, .settings-panel
),
html[data-theme="dark"] :is(
  .settings-form-grid, .settings-form, .settings-section,
  .settings-card, .settings-panel
),
body.dark-mode :is(
  .settings-form-grid, .settings-form, .settings-section,
  .settings-card, .settings-panel
) {
  color: #e5edf7 !important;
}

html[data-leressae-theme="dark"] :is(
  .settings-form-grid input, .settings-form-grid select,
  .settings-form-grid textarea, .settings-form input,
  .settings-form select, .settings-form textarea
),
html[data-theme="dark"] :is(
  .settings-form-grid input, .settings-form-grid select,
  .settings-form-grid textarea, .settings-form input,
  .settings-form select, .settings-form textarea
),
body.dark-mode :is(
  .settings-form-grid input, .settings-form-grid select,
  .settings-form-grid textarea, .settings-form input,
  .settings-form select, .settings-form textarea
) {
  background: #0d1726 !important;
  color: #f3f7fc !important;
  border-color: #3a516a !important;
}

/* ---------- Status / badges ---------- */
html[data-leressae-theme="dark"] :is(
  .status-badge, .status-pill, .tech-status-badge,
  .admin-status-badge, .tech-proof-state
),
html[data-theme="dark"] :is(
  .status-badge, .status-pill, .tech-status-badge,
  .admin-status-badge, .tech-proof-state
),
body.dark-mode :is(
  .status-badge, .status-pill, .tech-status-badge,
  .admin-status-badge, .tech-proof-state
) {
  -webkit-text-fill-color: currentColor !important;
}

/* ---------- Media customer / Update Status: clean and readable ---------- */
.technician-shell .tech-status-page .tech-client-table {
  min-width: 1540px !important;
}

.technician-shell .tech-status-page .tech-client-table th,
.technician-shell .tech-status-page .tech-client-table td {
  box-sizing: border-box !important;
  vertical-align: middle !important;
}

.technician-shell .tech-status-page .tech-client-table th:nth-child(10),
.technician-shell .tech-status-page .tech-client-table td:nth-child(10) {
  width: 175px !important;
  min-width: 175px !important;
  text-align: center !important;
  white-space: normal !important;
}

.technician-shell .tech-status-page .tech-client-table th:nth-child(11),
.technician-shell .tech-status-page .tech-client-table td:nth-child(11) {
  width: 185px !important;
  min-width: 185px !important;
  text-align: center !important;
  white-space: normal !important;
}

.technician-shell .tech-status-page .tech-client-table th:nth-child(10),
.technician-shell .tech-status-page .tech-client-table th:nth-child(11) {
  padding: 11px 10px !important;
  line-height: 1.25 !important;
  overflow: visible !important;
}

.technician-shell .tech-status-page .tech-client-table td:nth-child(10),
.technician-shell .tech-status-page .tech-client-table td:nth-child(11) {
  padding: 10px 10px !important;
  overflow: visible !important;
}

.technician-shell .tech-status-page .tech-client-table
td:nth-child(10) :is(button, a),
.technician-shell .tech-status-page .tech-client-table
td:nth-child(11) :is(button, a) {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 150px !important;
  min-width: 150px !important;
  max-width: 150px !important;
  min-height: 44px !important;
  height: 44px !important;
  margin: 0 auto !important;
  padding: 8px 12px !important;
  box-sizing: border-box !important;
  white-space: nowrap !important;
  text-align: center !important;
  line-height: 1.2 !important;
  overflow: hidden !important;
}

.technician-shell .tech-status-page .tech-client-table
td:nth-child(11) .tech-update-action-btn {
  width: 150px !important;
  min-width: 150px !important;
  max-width: 150px !important;
  height: 44px !important;
  min-height: 44px !important;
}

/* ---------- Dark mode: buttons in technician status table ---------- */
html[data-leressae-theme="dark"] .technician-shell .tech-status-page
.tech-client-table td:nth-child(10) :is(button, a),
html[data-theme="dark"] .technician-shell .tech-status-page
.tech-client-table td:nth-child(10) :is(button, a),
body.dark-mode .technician-shell .tech-status-page
.tech-client-table td:nth-child(10) :is(button, a) {
  color: #eaf7ff !important;
  -webkit-text-fill-color: #eaf7ff !important;
}

html[data-leressae-theme="dark"] .technician-shell .tech-status-page
.tech-client-table td:nth-child(11) :is(button, a),
html[data-theme="dark"] .technician-shell .tech-status-page
.tech-client-table td:nth-child(11) :is(button, a),
body.dark-mode .technician-shell .tech-status-page
.tech-client-table td:nth-child(11) :is(button, a) {
  color: #f8fbff !important;
  -webkit-text-fill-color: #f8fbff !important;
}

/* ---------- Navigation ---------- */
html[data-leressae-theme="dark"] :is(
  .admin-nav-item, .technician-nav button, .admin-sidebar a,
  .technician-sidebar a
),
html[data-theme="dark"] :is(
  .admin-nav-item, .technician-nav button, .admin-sidebar a,
  .technician-sidebar a
),
body.dark-mode :is(
  .admin-nav-item, .technician-nav button, .admin-sidebar a,
  .technician-sidebar a
) {
  color: #dbe7f5 !important;
  -webkit-text-fill-color: #dbe7f5 !important;
}

html[data-leressae-theme="dark"] :is(
  .admin-nav-item.active, .technician-nav button.active,
  .admin-nav-item:hover, .technician-nav button:hover
),
html[data-theme="dark"] :is(
  .admin-nav-item.active, .technician-nav button.active,
  .admin-nav-item:hover, .technician-nav button:hover
),
body.dark-mode :is(
  .admin-nav-item.active, .technician-nav button.active,
  .admin-nav-item:hover, .technician-nav button:hover
) {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

/* ---------- Generic dark-mode text that was previously hard-coded dark ---------- */
html[data-leressae-theme="dark"] :is(
  .text-dark, .text-muted, .text-secondary,
  .form-text, .helper-text, .description
),
html[data-theme="dark"] :is(
  .text-dark, .text-muted, .text-secondary,
  .form-text, .helper-text, .description
),
body.dark-mode :is(
  .text-dark, .text-muted, .text-secondary,
  .form-text, .helper-text, .description
) {
  color: #b7c6d8 !important;
}

/* ---------- SVG/chart labels ---------- */
html[data-leressae-theme="dark"] svg text,
html[data-theme="dark"] svg text,
body.dark-mode svg text {
  fill: #dce8f4 !important;
  color: #dce8f4 !important;
}

/* ---------- Accessibility / focus ---------- */
html[data-leressae-theme="dark"] :focus-visible,
html[data-theme="dark"] :focus-visible,
body.dark-mode :focus-visible {
  outline: 3px solid rgba(96, 165, 250, .75) !important;
  outline-offset: 2px !important;
}

/* ---------- Mobile table buttons ---------- */
@media (max-width: 640px) {
  .technician-shell .tech-status-page .tech-client-table {
    min-width: 1540px !important;
  }

  .technician-shell .tech-status-page .tech-client-table th:nth-child(10),
  .technician-shell .tech-status-page .tech-client-table td:nth-child(10) {
    width: 175px !important;
    min-width: 175px !important;
  }

  .technician-shell .tech-status-page .tech-client-table th:nth-child(11),
  .technician-shell .tech-status-page .tech-client-table td:nth-child(11) {
    width: 185px !important;
    min-width: 185px !important;
  }

  .technician-shell .tech-status-page .tech-client-table
  td:nth-child(10) :is(button, a),
  .technician-shell .tech-status-page .tech-client-table
  td:nth-child(11) :is(button, a) {
    width: 145px !important;
    min-width: 145px !important;
    max-width: 145px !important;
    height: 42px !important;
    min-height: 42px !important;
    font-size: 11px !important;
  }
}

/* ---------- Final protection against WebKit text-fill conflicts ---------- */
html[data-leressae-theme="dark"] :is(
  .admin-content, .technician-content, .admin-card, .tech-section,
  .tech-card, .settings-card, .settings-panel
) :is(
  h1, h2, h3, h4, h5, h6, p, span, small, label, td, th
),
html[data-theme="dark"] :is(
  .admin-content, .technician-content, .admin-card, .tech-section,
  .tech-card, .settings-card, .settings-panel
) :is(
  h1, h2, h3, h4, h5, h6, p, span, small, label, td, th
),
body.dark-mode :is(
  .admin-content, .technician-content, .admin-card, .tech-section,
  .tech-card, .settings-card, .settings-panel
) :is(
  h1, h2, h3, h4, h5, h6, p, span, small, label, td, th
) {
  -webkit-text-fill-color: currentColor !important;
}

/* ========================================================================
   FINAL DETAIL VISIBILITY OVERRIDE
   Public + Admin + Teknisi | Light mode unchanged | Dark mode readable
   ======================================================================== */

/* Shared detail cards: Public status, Admin customer/service detail,
   and technician read-only/detail panels. */
html[data-leressae-theme="dark"] .service-status-card,
html[data-theme="dark"] .service-status-card,
body.dark-mode .service-status-card,
html[data-leressae-theme="dark"] .customer-service-detail-list .service-status-card,
html[data-theme="dark"] .customer-service-detail-list .service-status-card,
body.dark-mode .customer-service-detail-list .service-status-card {
    background: #111827 !important;
    border-color: #334155 !important;
    color: #e5edf7 !important;
    box-shadow: 0 12px 30px rgba(0,0,0,.28) !important;
}

html[data-leressae-theme="dark"] .service-status-card h3,
html[data-theme="dark"] .service-status-card h3,
body.dark-mode .service-status-card h3 {
    color: #f8fafc !important;
}

/* The generated detail markup uses plain div text with <strong> labels.
   Set both the container and its direct children so inherited light-mode
   colors cannot make the values disappear on a dark surface. */
html[data-leressae-theme="dark"] .service-status-card .service-meta,
html[data-theme="dark"] .service-status-card .service-meta,
body.dark-mode .service-status-card .service-meta,
html[data-leressae-theme="dark"] .service-status-card .service-meta > div,
html[data-theme="dark"] .service-status-card .service-meta > div,
body.dark-mode .service-status-card .service-meta > div {
    color: #e5edf7 !important;
}

html[data-leressae-theme="dark"] .service-status-card .service-meta strong,
html[data-theme="dark"] .service-status-card .service-meta strong,
body.dark-mode .service-status-card .service-meta strong {
    color: #f8fafc !important;
    font-weight: 800 !important;
}

/* Links/buttons embedded inside detail values, especially Google Maps. */
html[data-leressae-theme="dark"] .service-status-card .service-meta a,
html[data-theme="dark"] .service-status-card .service-meta a,
body.dark-mode .service-status-card .service-meta a,
html[data-leressae-theme="dark"] .service-status-card .admin-gmaps-link,
html[data-theme="dark"] .service-status-card .admin-gmaps-link,
body.dark-mode .service-status-card .admin-gmaps-link {
    color: #eaf6ff !important;
    background: #172033 !important;
    border-color: #4b6480 !important;
}

html[data-leressae-theme="dark"] .service-status-card .service-meta a:hover,
html[data-theme="dark"] .service-status-card .service-meta a:hover,
body.dark-mode .service-status-card .service-meta a:hover,
html[data-leressae-theme="dark"] .service-status-card .admin-gmaps-link:hover,
html[data-theme="dark"] .service-status-card .admin-gmaps-link:hover,
body.dark-mode .service-status-card .admin-gmaps-link:hover {
    color: #ffffff !important;
    background: #22334a !important;
    border-color: #75c7a8 !important;
}

/* Public completion/proof section. */
html[data-leressae-theme="dark"] .status-proof-public,
html[data-theme="dark"] .status-proof-public,
body.dark-mode .status-proof-public {
    border-top-color: #334155 !important;
    color: #e5edf7 !important;
}

html[data-leressae-theme="dark"] .status-proof-public strong,
html[data-theme="dark"] .status-proof-public strong,
body.dark-mode .status-proof-public strong {
    color: #f8fafc !important;
}

html[data-leressae-theme="dark"] .status-proof-public img,
html[data-theme="dark"] .status-proof-public img,
body.dark-mode .status-proof-public img {
    background: #0f172a !important;
    border-color: #334155 !important;
}

/* Admin customer detail heading/list. These classes are generated by the
   customer-detail view and must remain readable in both theme selectors. */
html[data-leressae-theme="dark"] .customer-services-heading,
html[data-theme="dark"] .customer-services-heading,
body.dark-mode .customer-services-heading {
    color: #e5edf7 !important;
}

html[data-leressae-theme="dark"] .customer-services-heading h3,
html[data-theme="dark"] .customer-services-heading h3,
body.dark-mode .customer-services-heading h3 {
    color: #f8fafc !important;
}

html[data-leressae-theme="dark"] .customer-service-detail-list,
html[data-theme="dark"] .customer-service-detail-list,
body.dark-mode .customer-service-detail-list {
    color: #e5edf7 !important;
}

/* Detail back button: keep contrast in dark mode. */
html[data-leressae-theme="dark"] .leressae-detail-back-row .leressae-back-btn,
html[data-theme="dark"] .leressae-detail-back-row .leressae-back-btn,
body.dark-mode .leressae-detail-back-row .leressae-back-btn {
    background: #334155 !important;
    color: #f8fafc !important;
    border-color: #64748b !important;
}

html[data-leressae-theme="dark"] .leressae-detail-back-row .leressae-back-btn:hover,
html[data-theme="dark"] .leressae-detail-back-row .leressae-back-btn:hover,
body.dark-mode .leressae-detail-back-row .leressae-back-btn:hover {
    background: #475569 !important;
    color: #ffffff !important;
    border-color: #94a3b8 !important;
}

/* Technician detail/update panel. */
html[data-leressae-theme="dark"] .tech-update-section,
html[data-theme="dark"] .tech-update-section,
body.dark-mode .tech-update-section,
html[data-leressae-theme="dark"] .tech-readonly-grid,
html[data-theme="dark"] .tech-readonly-grid,
body.dark-mode .tech-readonly-grid {
    color: #e5edf7 !important;
}

html[data-leressae-theme="dark"] .tech-update-section-title strong,
html[data-theme="dark"] .tech-update-section-title strong,
body.dark-mode .tech-update-section-title strong,
html[data-leressae-theme="dark"] .tech-readonly-grid label,
html[data-theme="dark"] .tech-readonly-grid label,
body.dark-mode .tech-readonly-grid label,
html[data-leressae-theme="dark"] .tech-cost-grid label,
html[data-theme="dark"] .tech-cost-grid label,
body.dark-mode .tech-cost-grid label,
html[data-leressae-theme="dark"] .tech-full-field,
html[data-theme="dark"] .tech-full-field,
body.dark-mode .tech-full-field {
    color: #f8fafc !important;
}

html[data-leressae-theme="dark"] .tech-update-section-title small,
html[data-theme="dark"] .tech-update-section-title small,
body.dark-mode .tech-update-section-title small,
html[data-leressae-theme="dark"] .tech-readonly-grid small,
html[data-theme="dark"] .tech-readonly-grid small,
body.dark-mode .tech-readonly-grid small {
    color: #a9b8ca !important;
}

html[data-leressae-theme="dark"] .tech-readonly-grid input,
html[data-theme="dark"] .tech-readonly-grid input,
body.dark-mode .tech-readonly-grid input,
html[data-leressae-theme="dark"] .tech-readonly-grid textarea,
html[data-theme="dark"] .tech-readonly-grid textarea,
body.dark-mode .tech-readonly-grid textarea,
html[data-leressae-theme="dark"] .tech-cost-grid input,
html[data-theme="dark"] .tech-cost-grid input,
body.dark-mode .tech-cost-grid input,
html[data-leressae-theme="dark"] .tech-cost-grid select,
html[data-theme="dark"] .tech-cost-grid select,
body.dark-mode .tech-cost-grid select,
html[data-leressae-theme="dark"] .tech-full-field input,
html[data-theme="dark"] .tech-full-field input,
body.dark-mode .tech-full-field input,
html[data-leressae-theme="dark"] .tech-full-field textarea,
html[data-theme="dark"] .tech-full-field textarea,
body.dark-mode .tech-full-field textarea {
    background: #0f172a !important;
    color: #e5edf7 !important;
    border-color: #475569 !important;
}

html[data-leressae-theme="dark"] .tech-update-proof-box,
html[data-theme="dark"] .tech-update-proof-box,
body.dark-mode .tech-update-proof-box {
    background: #172033 !important;
    color: #e5edf7 !important;
    border-color: #334155 !important;
}

html[data-leressae-theme="dark"] .tech-update-proof-head strong,
html[data-theme="dark"] .tech-update-proof-head strong,
body.dark-mode .tech-update-proof-head strong {
    color: #f8fafc !important;
}

html[data-leressae-theme="dark"] .tech-update-proof-head small,
html[data-theme="dark"] .tech-update-proof-head small,
body.dark-mode .tech-update-proof-head small,
html[data-leressae-theme="dark"] .tech-proof-upload-control small,
html[data-theme="dark"] .tech-proof-upload-control small,
body.dark-mode .tech-proof-upload-control small {
    color: #a9b8ca !important;
}

/* Keep mobile detail readable without changing the existing layout. */
@media (max-width: 720px) {
    html[data-leressae-theme="dark"] .service-status-card .service-meta,
    html[data-theme="dark"] .service-status-card .service-meta,
    body.dark-mode .service-status-card .service-meta {
        color: #e5edf7 !important;
        font-size: .9rem !important;
    }

    html[data-leressae-theme="dark"] .service-status-card .service-meta strong,
    html[data-theme="dark"] .service-status-card .service-meta strong,
    body.dark-mode .service-status-card .service-meta strong {
        color: #ffffff !important;
    }
}

/* =========================================================
   FIX: ADMIN > SERVIS SELESAI > STATUS BADGE
   Memastikan teks "Selesai" selalu terbaca pada Dark Mode.
   Tidak mengubah Light Mode.
   ========================================================= */

html[data-leressae-theme="dark"] .admin-completed-summary-status .value.status-badge,
html[data-leressae-theme="dark"] .admin-completed-summary-status .value,
html[data-theme="dark"] .admin-completed-summary-status .value.status-badge,
html[data-theme="dark"] .admin-completed-summary-status .value,
body.dark-mode .admin-completed-summary-status .value.status-badge,
body.dark-mode .admin-completed-summary-status .value {
  background: #123c2b !important;
  color: #ecfdf5 !important;
  -webkit-text-fill-color: #ecfdf5 !important;
  border: 1px solid #34d399 !important;
  border-radius: 999px !important;
  font-weight: 800 !important;
  text-shadow: none !important;
  opacity: 1 !important;
}

/* Jika badge status menggunakan class .done */
html[data-leressae-theme="dark"] .admin-completed-summary-status .value.done,
html[data-theme="dark"] .admin-completed-summary-status .value.done,
body.dark-mode .admin-completed-summary-status .value.done {
  background: #123c2b !important;
  color: #ecfdf5 !important;
  -webkit-text-fill-color: #ecfdf5 !important;
  border-color: #34d399 !important;
}

/* Menjaga ikon/check pada badge tetap terlihat */
html[data-leressae-theme="dark"] .admin-completed-summary-status .value.status-badge::before,
html[data-theme="dark"] .admin-completed-summary-status .value.status-badge::before,
body.dark-mode .admin-completed-summary-status .value.status-badge::before {
  color: #ecfdf5 !important;
  -webkit-text-fill-color: #ecfdf5 !important;
  opacity: 1 !important;
}

/* Jika struktur HTML berupa .status-badge di dalam .value */
html[data-leressae-theme="dark"] .admin-completed-summary-status .value .status-badge,
html[data-theme="dark"] .admin-completed-summary-status .value .status-badge,
body.dark-mode .admin-completed-summary-status .value .status-badge {
  background: #123c2b !important;
  color: #ecfdf5 !important;
  -webkit-text-fill-color: #ecfdf5 !important;
  border-color: #34d399 !important;
  opacity: 1 !important;
}

/* Admin technician management table and export toolbar. */
#page-admin .admin-tech-toolbar {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 8px;
  margin-left: auto;
}

#page-admin .admin-tech-toolbar button {
  min-height: 38px;
  white-space: nowrap;
}

#page-admin .admin-tech-management-wrap {
  overflow-x: auto;
  border: 1px solid #e2e8f0;
  border-radius: 14px;
  background: #ffffff;
  box-shadow: 0 8px 24px rgba(15, 23, 42, .06);
}

#page-admin .admin-tech-management-table {
  min-width: 760px !important;
}

#page-admin .admin-tech-management-table thead {
  background: linear-gradient(120deg, #087f70, #2e9b68);
}

#page-admin .admin-tech-management-table thead th {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

#page-admin .admin-tech-sort-button {
  display: inline-flex;
  width: 100%;
  min-height: 44px;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 8px 4px;
  border: 0;
  background: transparent;
  color: inherit;
  -webkit-text-fill-color: inherit;
  font: inherit;
  font-weight: 800;
  cursor: pointer;
}

#page-admin .admin-tech-sort-button:hover,
#page-admin .admin-tech-sort-button:focus-visible {
  color: #e8fff2;
  -webkit-text-fill-color: #e8fff2;
  text-decoration: underline;
  text-underline-offset: 3px;
  outline: none;
}

#page-admin .admin-tech-sort-button span {
  color: #c9f1dc;
  -webkit-text-fill-color: #c9f1dc;
  font-size: 1rem;
}

#page-admin .admin-tech-sort-button.is-active span {
  color: #ffffff;
  -webkit-text-fill-color: #ffffff;
}

#page-admin .admin-tech-management-table tbody tr:nth-child(even) {
  background: #f2f8f4;
}

#page-admin .admin-tech-management-table tbody tr:hover {
  background: #eaf5ef;
}

#page-admin .admin-tech-management-table tbody td {
  border-bottom: 1px solid #e1ece5;
  color: #334155;
  font-variant-numeric: tabular-nums;
}

#page-admin .admin-tech-management-table tbody tr:last-child td {
  border-bottom: 0;
}

#page-admin .admin-tech-management-table .status-badge {
  display: inline-flex;
  min-width: 78px;
  justify-content: center;
  border-radius: 999px;
  padding: 5px 10px;
  font-size: .7rem;
  font-weight: 800;
}

#page-admin .admin-tech-table-footer {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 4px 0;
  color: #64748b;
  font-size: .78rem;
}

#page-admin .admin-tech-table-footer strong {
  color: #087f70;
}

@media (max-width: 720px) {
  #page-admin .admin-tech-toolbar {
    width: 100%;
    justify-content: stretch;
    margin-left: 0;
  }

  #page-admin .admin-tech-toolbar button {
    flex: 1 1 140px;
  }

  #page-admin .admin-tech-table-footer {
    flex-direction: column;
    gap: 4px;
  }
}


/* ===== Technician dashboard theme synchronization fixes ===== */
html[data-leressae-theme="light"] .technician-shell .tech-welcome,
html[data-leressae-theme="light"] .technician-shell .tech-stat {
  background: #ffffff !important;
  border-color: #d8e5f0 !important;
  color: #102a43 !important;
}
html[data-leressae-theme="light"] .technician-shell .tech-welcome :is(.tech-eyebrow, h3, p),
html[data-leressae-theme="light"] .technician-shell .tech-stat :is(.label, .value) {
  color: #102a43 !important;
  -webkit-text-fill-color: #102a43 !important;
}
html[data-leressae-theme="light"] .technician-shell .tech-welcome .tech-eyebrow,
html[data-leressae-theme="light"] .technician-shell .tech-stat .label { color: #536b84 !important; -webkit-text-fill-color: #536b84 !important; }
html[data-leressae-theme="light"] .technician-shell .tech-welcome p { color: #526b83 !important; -webkit-text-fill-color: #526b83 !important; }
html[data-leressae-theme="light"] .technician-shell .tech-stat-icon { color: #087f70 !important; }
html[data-leressae-theme="light"] .technician-shell .tech-stat-icon svg,
html[data-leressae-theme="light"] .technician-shell .tech-icon svg,
html[data-leressae-theme="light"] .technician-shell .technician-mobile-menu svg {
  stroke: currentColor !important;
}
html[data-leressae-theme="dark"] .technician-shell .tech-welcome,
html[data-leressae-theme="dark"] .technician-shell .tech-stat {
  background: #111c2d !important;
  border-color: #31445b !important;
  color: #f3f7fc !important;
}
html[data-leressae-theme="dark"] .technician-shell .tech-welcome :is(.tech-eyebrow, h3, p),
html[data-leressae-theme="dark"] .technician-shell .tech-stat :is(.label, .value) {
  color: #f3f7fc !important;
  -webkit-text-fill-color: #f3f7fc !important;
}
html[data-leressae-theme="dark"] .technician-shell .tech-welcome .tech-eyebrow,
html[data-leressae-theme="dark"] .technician-shell .tech-stat .label,
html[data-leressae-theme="dark"] .technician-shell .tech-welcome p {
  color: #b7c6d8 !important;
  -webkit-text-fill-color: #b7c6d8 !important;
}
html[data-leressae-theme="dark"] .technician-shell .tech-stat-icon {
  background: #19382d !important; color: #8ddbb9 !important;
}
html[data-leressae-theme="dark"] .technician-shell .tech-stat.is-progress .tech-stat-icon { background: #3a2d19 !important; color: #ffc96b !important; }
html[data-leressae-theme="dark"] .technician-shell .tech-stat.is-done .tech-stat-icon { background: #153b32 !important; color: #67e8a5 !important; }
html[data-leressae-theme="dark"] .technician-shell .tech-stat-icon svg,
html[data-leressae-theme="dark"] .technician-shell .tech-icon svg,
html[data-leressae-theme="dark"] .technician-shell .technician-mobile-menu svg {
  stroke: currentColor !important;
}
/* The chart/status row was removed from the technician dashboard; retain responsive stat layout. */
.tech-dashboard-page .tech-dashboard-grid { display: none !important; }


/* Admin navigation notification badges */
.admin-nav-notification{display:inline-flex;align-items:center;justify-content:center;min-width:21px;height:21px;padding:0 6px;margin-left:auto;border-radius:999px;background:#328f64;color:#fff!important;font-size:11px;font-weight:800;line-height:1;box-shadow:0 0 0 2px rgba(255,255,255,.08);font-variant-numeric:tabular-nums}
.admin-nav-item{gap:10px}
.admin-nav-item>span:not(.admin-nav-notification){min-width:0}

/* Histogram: weekday/monthly counts with an explicit numeric Y axis */
.histogram-wrap{display:flex;flex-direction:column;align-items:stretch;gap:8px;min-height:260px;padding:10px 4px 24px}
.histogram-plot{display:flex;gap:8px;align-items:stretch;width:100%;min-height:220px}
.histogram-y-labels{display:flex;flex-direction:column;justify-content:space-between;align-items:flex-end;min-width:20px;padding:0 0 23px;color:var(--admin-muted,#64748b);font-size:10px;line-height:1}
.histogram-plot-main{position:relative;flex:1;min-width:0}
.histogram-axis{display:flex;align-items:flex-end;gap:8px;width:100%;height:195px;border-bottom:1px solid var(--admin-border,#cbd5e1);position:relative;background:repeating-linear-gradient(to top,transparent 0,transparent calc(25% - 1px),var(--admin-border,#cbd5e1) calc(25% - 1px),var(--admin-border,#cbd5e1) 25%)}
.histogram-column{height:100%;display:flex;align-items:flex-end;flex:1;min-width:0}
.histogram-bar{width:100%;height:var(--bar-height,0%);min-height:0;background:linear-gradient(180deg,#78d0ac 0%,#087f70 100%);border-radius:7px 7px 0 0;position:relative;transition:height .2s ease}
.histogram-bar[data-count="0"]{height:0!important}
.histogram-bar::after{content:attr(data-count);position:absolute;left:50%;top:-18px;transform:translateX(-50%);font-size:10px;font-weight:700;color:var(--admin-text,#475569)}
.histogram-labels{position:relative;display:flex;gap:8px;justify-content:space-between;color:var(--admin-muted,#64748b);font-size:10px;font-weight:700;margin-top:8px;text-align:center}
.histogram-labels span{flex:1;min-width:0;overflow-wrap:anywhere}
.histogram-note{position:static;color:var(--admin-muted,#94a3b8);font-size:10px;font-weight:700}

/* ===== Public website finish: softened backdrop and clearer navigation ===== */
.navbar .nav-links > li > a {
  display: inline-flex;
  min-height: 44px;
  align-items: center;
  text-underline-offset: 4px;
  transition: color .18s ease, background-color .18s ease, border-color .18s ease;
}
.navbar .nav-links > li > a.active::after,
.navbar .nav-links > li > a[aria-current="page"]::after {
  background: linear-gradient(90deg, #087f70, #49a98a);
}
.navbar .dropdown-content li a.nav-service-link.active,
.navbar .dropdown-content li a.nav-service-link[aria-current="page"] {
  color: #075e55;
  background: #edf5fb;
  border-left: 3px solid #087f70;
  padding-left: 15px;
}
.navbar .nav-links > li > a:focus-visible,
.navbar .dropdown-content a:focus-visible,
.navbar .btn-login:focus-visible,
.navbar .nav-toggle:focus-visible {
  outline: 3px solid rgba(8,127,112, .42);
  outline-offset: 3px;
}

#page-pendaftaran :is(.btn-primary, .btn-secondary),
#page-media-penanganan :is(.btn-primary, .btn-secondary),
#page-media :is(.btn-primary, .btn-secondary),
#page-kontak :is(.btn-primary, .btn-secondary),
#page-status :is(.btn-primary, .btn-secondary),
#page-status .status-form button,
#page-info :is(.btn-primary, .btn-secondary) {
  display: inline-flex;
  min-height: 44px;
  align-items: center;
  justify-content: center;
  line-height: 1.35;
  text-align: center;
}

@media (max-width: 900px) {
  .navbar .nav-links > li > a,
  .navbar .btn-login {
    min-height: 44px;
  }
  .navbar .nav-toggle {
    width: 44px;
    min-width: 44px;
    height: 44px;
    min-height: 44px;
    border-radius: 12px;
  }
  .navbar .dropdown-content li a.nav-service-link.active,
  .navbar .dropdown-content li a.nav-service-link[aria-current="page"] {
    border-radius: 8px;
  }
}

/* ===== Public palette: soft LERESSAE greens, with the backdrop kept clear ===== */
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) {
  --leressae-green: #28784a;
  --leressae-green-deep: #175d38;
  --leressae-green-line: #d7e8da;
  --leressae-green-wash: #f2f8f2;
}

html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) .navbar {
  background: linear-gradient(125deg, rgba(255,255,255,.86), rgba(245,250,245,.84));
  border-color: rgba(214, 232, 216, .78);
}
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) .navbar .nav-links > li > a.active::after,
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) .navbar .nav-links > li > a[aria-current="page"]::after {
  background: linear-gradient(90deg, #28784a, #83b78a);
}
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) .navbar .nav-links > li > a.active,
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) .navbar .nav-links > li > a[aria-current="page"] {
  color: #246b42;
}
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) .navbar .dropdown-content li a.nav-service-link.active,
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) .navbar .dropdown-content li a.nav-service-link[aria-current="page"] {
  color: #1d633b;
  background: #eff7ef;
  border-left-color: #4d925c;
}
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) .navbar .btn-login {
  background: linear-gradient(135deg, #318451, #1b633b) !important;
  box-shadow: 0 6px 16px rgba(38, 111, 62, .2), inset 0 1px 0 rgba(255,255,255,.18) !important;
}
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) .navbar .btn-login:hover {
  background: linear-gradient(135deg, #267346, #155531) !important;
  box-shadow: 0 9px 22px rgba(38, 111, 62, .28), inset 0 1px 0 rgba(255,255,255,.2) !important;
}

html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) #page-dashboard {
  --pub-blue: #28784a;
  --pub-border: rgba(207, 226, 210, .84);
  --pub-surface: rgba(255, 255, 255, .94);
}
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) #page-dashboard .hero-section {
  background-color: #eef6ef;
  background-image:
    radial-gradient(ellipse at 12% 16%, rgba(114, 176, 122, .18), transparent 38%),
    radial-gradient(ellipse at 84% 82%, rgba(159, 199, 143, .18), transparent 35%),
    linear-gradient(118deg, #f7faf7 0%, #eff7f0 52%, #e8f2e9 100%);
  border-color: rgba(255,255,255,.82);
  box-shadow: 0 18px 50px rgba(36, 82, 48, .09), inset 0 1px 0 rgba(255,255,255,.92);
}
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) #page-dashboard .hero-section::before {
  background: radial-gradient(ellipse, rgba(126, 185, 132, .2), rgba(126, 185, 132, 0) 72%);
  filter: none;
  box-shadow: -160px 90px 0 rgba(178, 211, 177, .12), -280px 200px 0 rgba(117, 172, 124, .07);
}
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) #page-dashboard .hero-section::after {
  background: radial-gradient(ellipse, rgba(149, 195, 145, .19), rgba(149, 195, 145, 0) 72%);
  filter: none;
  box-shadow: -160px -80px 0 rgba(255,255,255,.24), -210px 30px 0 rgba(110, 171, 117, .08);
}
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) #page-dashboard .hero-badge,
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) #page-dashboard .pillar-icon,
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) #page-dashboard .service-item-icon,
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) #page-dashboard .tutorial-tag {
  color: #286b42;
  border-color: rgba(87, 145, 96, .2);
  background-color: rgba(237, 247, 238, .84);
}
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) #page-dashboard .hero-slogan-card {
  border-color: rgba(255,255,255,.86);
  background: linear-gradient(145deg, rgba(255,255,255,.78), rgba(245,250,245,.69));
  box-shadow: 0 16px 36px rgba(44, 86, 51, .09), inset 0 1px 0 rgba(255,255,255,.92);
}
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) #page-dashboard :is(.slogan-label, .slogan-main) {
  color: #245d3b;
}
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) #page-dashboard .hero-actions .btn-primary,
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) :is(#page-pendaftaran, #page-media-penanganan, #page-media, #page-kontak, #page-status, #page-info) .btn-primary,
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) #page-status .status-form button,
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) #homeNewsList .home-news-content .news-read-more {
  color: #fff;
  background: linear-gradient(135deg, #318451, #1b633b);
  box-shadow: 0 9px 22px rgba(38, 111, 62, .18);
}
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) #page-dashboard .hero-actions .btn-primary:hover,
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) :is(#page-pendaftaran, #page-media-penanganan, #page-media, #page-kontak, #page-status, #page-info) .btn-primary:hover,
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) #page-status .status-form button:hover,
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) #homeNewsList .home-news-content .news-read-more:hover {
  background: linear-gradient(135deg, #267346, #155531);
  box-shadow: 0 12px 26px rgba(38, 111, 62, .24);
}
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) #page-dashboard .hero-actions .btn-secondary,
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) :is(#page-pendaftaran, #page-media-penanganan, #page-media, #page-kontak, #page-status, #page-info) .btn-secondary {
  color: #28563a;
  border-color: rgba(78, 137, 88, .26);
  background: rgba(250, 253, 250, .88);
}
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) #page-dashboard :is(.pillar-card, .dashboard-section, .service-item-card, .tutorial-card),
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) #page-dashboard #homeNewsList .news-card,
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) #page-info #publicNewsList .news-card,
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) .home-media-spotlight {
  border-color: #d8e9da;
  background-color: rgba(255,255,255,.96);
  box-shadow: 0 10px 28px rgba(38, 80, 47, .055);
}
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) #page-dashboard #homeNewsList .news-card,
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) #page-info #publicNewsList .news-card,
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) #homeNewsList .home-news-card {
  background: linear-gradient(155deg, rgba(255,255,255,.98), rgba(244,250,244,.96));
}
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) #homeNewsList :is(.home-news-category, .home-news-arrow),
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) .home-media-arrow {
  border-color: rgba(79, 139, 88, .24);
  color: #286b42;
}
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) #homeNewsList .home-news-dot.is-active,
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) .home-media-dot.is-active {
  background: #378650;
}
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) #homeNewsList .home-news-arrow:hover,
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) .home-media-arrow:hover {
  color: #fff;
  border-color: #28784a;
  background: #28784a;
}

html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) :is(#page-pendaftaran, #page-media-penanganan, #page-media, #page-kontak, #page-status, #page-info) {
  border-color: rgba(211, 229, 214, .84);
  background: linear-gradient(145deg, rgba(255,255,255,.97), rgba(247,251,247,.95));
  box-shadow: 0 12px 32px rgba(36, 78, 46, .065);
}
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) #page-kontak .contact-card,
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) #page-status .status-lookup-wrap,
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) #page-status .service-status-card {
  border-color: #dceade;
  background: linear-gradient(145deg, rgba(255,255,255,.98), rgba(245,250,245,.94));
}
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) #page-kontak .contact-card a,
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) #page-media a:not(.btn-primary):not(.btn-secondary),
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) #page-info a:not(.btn-primary):not(.btn-secondary) {
  color: #28784a;
}

html[data-leressae-theme="dark"] .navbar .nav-links > li > a.active,
html[data-leressae-theme="dark"] .navbar .nav-links > li > a[aria-current="page"] {
  color: #9fd3a4 !important;
}
html[data-leressae-theme="dark"] .navbar .nav-links > li > a.active::after,
html[data-leressae-theme="dark"] .navbar .nav-links > li > a[aria-current="page"]::after {
  background: linear-gradient(90deg, #58ad6b, #a9dca9) !important;
}
html[data-leressae-theme="dark"] .navbar .dropdown-content li a.nav-service-link.active,
html[data-leressae-theme="dark"] .navbar .dropdown-content li a.nav-service-link[aria-current="page"] {
  color: #b3e1b7 !important;
  background: rgba(61, 128, 72, .2) !important;
  border-left-color: #68b879 !important;
}
html[data-leressae-theme="dark"] .navbar .btn-login {
  background: linear-gradient(135deg, #32814f, #1d5d39) !important;
  box-shadow: 0 6px 16px rgba(34, 103, 54, .34), inset 0 1px 0 rgba(255,255,255,.12) !important;
}
html[data-leressae-theme="dark"] #page-dashboard .hero-actions .btn-primary,
html[data-leressae-theme="dark"] :is(#page-pendaftaran, #page-media-penanganan, #page-media, #page-kontak, #page-status, #page-info) .btn-primary,
html[data-leressae-theme="dark"] #page-status .status-form button,
html[data-leressae-theme="dark"] #homeNewsList .home-news-content .news-read-more {
  background: linear-gradient(135deg, #32814f, #1d5d39) !important;
  box-shadow: 0 8px 20px rgba(34, 103, 54, .24) !important;
}

/* ===== Admin + Technician: LERESSAE soft-green glass surfaces =====
   Keep the existing navy identity, page geometry, and status colors. Green is
   used as a restrained brand accent; no backdrop blur is applied. */
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) #page-admin,
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) .technician-shell {
  --ops-green: #28784a;
  --ops-green-deep: #175d38;
  --ops-green-border: #d5e7d8;
  --ops-green-wash: #f2f8f2;
  --ops-green-shadow: rgba(38, 91, 51, .09);
}

html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) #page-admin .admin-shell,
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) .technician-shell {
  background: linear-gradient(145deg, #f8fbf8 0%, #eff6f0 58%, #f8fbf8 100%);
  border-color: var(--ops-green-border);
  box-shadow: 0 18px 44px var(--ops-green-shadow), inset 0 1px 0 rgba(255,255,255,.9);
}

html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) #page-admin .admin-sidebar,
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) .technician-shell .technician-sidebar {
  background:
    radial-gradient(ellipse at 95% 4%, rgba(81, 153, 91, .2), transparent 36%),
    linear-gradient(160deg, #0d1c2d 0%, #102132 58%, #10251d 100%) !important;
  border: 1px solid rgba(136, 190, 143, .2);
  box-shadow: 0 18px 38px rgba(16, 44, 28, .2), inset 0 1px 0 rgba(255,255,255,.08) !important;
}

html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) #page-admin .admin-brand-box .logo-mini,
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) .technician-shell .technician-avatar,
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) .tech-dashboard-page .tech-welcome-avatar {
  background: linear-gradient(145deg, #5eaa70 0%, #28784a 72%, #1c633a 100%) !important;
  box-shadow: 0 8px 18px rgba(40, 120, 74, .22), inset 0 1px 0 rgba(255,255,255,.3) !important;
}

html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) #page-admin .admin-nav-item:hover,
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) #page-admin .admin-nav-item.active,
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) .technician-shell .technician-nav button:hover,
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) .technician-shell .technician-nav button.active {
  background: linear-gradient(125deg, rgba(71, 145, 86, .34), rgba(39, 111, 62, .2)) !important;
  border-color: rgba(145, 198, 148, .55) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.12), 0 5px 14px rgba(15, 54, 28, .12) !important;
  color: #f7fff8 !important;
}

html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) #page-admin .admin-topbar,
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) #page-admin .admin-card,
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) #page-admin .admin-stat-card,
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) #page-admin .admin-stat-mini,
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) #page-admin .admin-info-card,
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) #page-admin .admin-report-chart-card,
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) .technician-shell .tech-welcome,
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) .technician-shell .tech-stat,
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) .technician-shell .tech-section {
  background:
    radial-gradient(ellipse at 100% 0%, rgba(143, 192, 145, .1), transparent 36%),
    linear-gradient(145deg, rgba(255,255,255,.98), rgba(246,250,246,.96)) !important;
  border-color: var(--ops-green-border) !important;
  box-shadow: 0 10px 26px var(--ops-green-shadow), inset 0 1px 0 rgba(255,255,255,.96) !important;
}

html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) #page-admin .admin-user-chip {
  color: #286b42;
  background: linear-gradient(135deg, #f0f8f0, #e6f3e7);
  border-color: #cfe4d1;
}
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) #page-admin .admin-table-wrap,
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) .technician-shell .tech-table-wrap {
  border-color: #d7e7d9;
  box-shadow: 0 5px 16px rgba(38, 91, 51, .045);
}
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) #page-admin :is(.admin-table th, .admin-report-table th),
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) .technician-shell .tech-table th {
  background: linear-gradient(180deg, #f0f7f0, #eaf3eb) !important;
  color: #315840 !important;
  border-color: #d9e8da !important;
}
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) #page-admin :is(.admin-table td, .admin-report-table td),
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) .technician-shell .tech-table td {
  border-color: #e4eee5 !important;
}
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) #page-admin .admin-table tbody tr:hover td,
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) .technician-shell .tech-table tbody tr:hover td {
  background: #f3f9f3 !important;
}

html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) #page-admin .admin-table .id-cell,
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) #page-admin .admin-customer-map-link,
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) #page-admin .admin-report-table .id-cell {
  color: #28784a;
}
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) #page-admin .admin-report-volume-bar i,
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) #page-admin .admin-report-meter i:not(.is-progress):not(.is-new):not(.is-other),
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) #page-admin .admin-report-tech-meter i,
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) #page-admin .admin-report-item-meter i {
  background: linear-gradient(180deg, #72b982 0%, #28784a 100%);
  box-shadow: 0 4px 10px rgba(40, 120, 74, .18);
}

html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) #page-admin .btn-primary,
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) #page-admin .admin-primary-btn,
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) .technician-shell .tech-btn:not(.secondary),
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) .technician-shell .tech-dashboard-action {
  color: #fff !important;
  background: linear-gradient(140deg, #4b9b60 0%, #28784a 56%, #1b633b 100%) !important;
  border: 1px solid rgba(30, 102, 57, .55) !important;
  box-shadow: 0 7px 16px rgba(34, 105, 55, .2), inset 0 1px 0 rgba(255,255,255,.2) !important;
}
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) #page-admin .btn-primary:hover,
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) #page-admin .admin-primary-btn:hover,
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) .technician-shell .tech-btn:not(.secondary):hover,
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) .technician-shell .tech-dashboard-action:hover {
  background: linear-gradient(140deg, #3e8c53 0%, #206c3f 100%) !important;
  box-shadow: 0 10px 20px rgba(34, 105, 55, .26), inset 0 1px 0 rgba(255,255,255,.22) !important;
}
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) #page-admin .btn-secondary,
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) .technician-shell .tech-btn.secondary {
  color: #28563a !important;
  background: linear-gradient(145deg, #fff, #f2f8f2) !important;
  border-color: #cfe1d1 !important;
  box-shadow: 0 4px 12px rgba(38, 91, 51, .07), inset 0 1px 0 #fff !important;
}
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) .technician-shell .tech-chart-bar {
  background: linear-gradient(180deg, #75bd82 0%, #28784a 100%) !important;
  box-shadow: inset 0 1px 1px rgba(255,255,255,.55), 0 4px 9px rgba(40,120,74,.18) !important;
}
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) .technician-shell .tech-stat:not(.is-progress) .tech-stat-icon {
  color: #28784a !important;
  background: #edf7ee !important;
}
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) .technician-shell .tech-stat.is-progress .tech-stat-icon {
  color: #bd7911 !important;
  background: #fff4df !important;
}
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) .technician-shell .tech-status-row.is-progress .tech-status-track i {
  background: linear-gradient(90deg, #dfa22b, #f2c15e) !important;
}
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) .technician-shell .tech-status-row.is-done .tech-status-track i {
  background: linear-gradient(90deg, #2c9a58, #6dc886) !important;
}
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) :is(#page-admin, .technician-shell) :is(button, a, input, select, textarea):focus-visible {
  outline: 3px solid rgba(64, 139, 78, .42) !important;
  outline-offset: 3px;
}

html[data-leressae-theme="dark"] #page-admin,
html[data-leressae-theme="dark"] .technician-shell {
  --ops-green: #82c890;
  --ops-green-deep: #3b8f59;
  --ops-green-border: #294b39;
}
html[data-leressae-theme="dark"] #page-admin .admin-shell,
html[data-leressae-theme="dark"] .technician-shell {
  background: linear-gradient(145deg, #0d1823 0%, #101d27 58%, #10231b 100%) !important;
  border-color: #294b39 !important;
  box-shadow: 0 18px 46px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.035) !important;
}
html[data-leressae-theme="dark"] #page-admin .admin-sidebar,
html[data-leressae-theme="dark"] .technician-shell .technician-sidebar {
  background:
    radial-gradient(ellipse at 95% 4%, rgba(69, 146, 84, .18), transparent 38%),
    linear-gradient(160deg, #0b1725 0%, #0e1d2b 62%, #10251d 100%) !important;
  border-color: rgba(112, 171, 121, .24) !important;
}
html[data-leressae-theme="dark"] #page-admin .admin-nav-item:hover,
html[data-leressae-theme="dark"] #page-admin .admin-nav-item.active,
html[data-leressae-theme="dark"] .technician-shell .technician-nav button:hover,
html[data-leressae-theme="dark"] .technician-shell .technician-nav button.active {
  background: linear-gradient(125deg, rgba(61, 132, 75, .3), rgba(42, 100, 57, .17)) !important;
  border-color: rgba(121, 184, 129, .48) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 5px 16px rgba(0,0,0,.16) !important;
  color: #f3fff4 !important;
}
html[data-leressae-theme="dark"] #page-admin :is(.admin-topbar, .admin-card, .admin-stat-card, .admin-stat-mini, .admin-info-card, .admin-report-chart-card),
html[data-leressae-theme="dark"] .technician-shell :is(.tech-welcome, .tech-stat, .tech-section) {
  background:
    radial-gradient(ellipse at 100% 0%, rgba(77, 143, 86, .1), transparent 38%),
    linear-gradient(145deg, #14231e, #111d24 70%) !important;
  border-color: #2b4a38 !important;
  box-shadow: 0 12px 30px rgba(0,0,0,.23), inset 0 1px 0 rgba(255,255,255,.045) !important;
}
html[data-leressae-theme="dark"] #page-admin .admin-brand-box .logo-mini,
html[data-leressae-theme="dark"] .technician-shell .technician-avatar,
html[data-leressae-theme="dark"] .tech-dashboard-page .tech-welcome-avatar {
  background: linear-gradient(145deg, #5da96e, #286b42 76%, #1b5735) !important;
  box-shadow: 0 8px 20px rgba(21, 95, 49, .28), inset 0 1px 0 rgba(255,255,255,.16) !important;
}
html[data-leressae-theme="dark"] #page-admin :is(.admin-table th, .admin-report-table th),
html[data-leressae-theme="dark"] .technician-shell .tech-table th {
  background: #1a3024 !important;
  color: #d9f1dc !important;
  border-color: #345440 !important;
}
html[data-leressae-theme="dark"] #page-admin :is(.admin-table td, .admin-report-table td),
html[data-leressae-theme="dark"] .technician-shell .tech-table td {
  border-color: #263d31 !important;
}
html[data-leressae-theme="dark"] #page-admin .admin-table tbody tr:hover td,
html[data-leressae-theme="dark"] .technician-shell .tech-table tbody tr:hover td {
  background: #172a20 !important;
}
html[data-leressae-theme="dark"] #page-admin .admin-user-chip {
  color: #c6ebcc !important;
  background: #1b3425 !important;
  border-color: #345a3d !important;
}
html[data-leressae-theme="dark"] #page-admin .btn-primary,
html[data-leressae-theme="dark"] #page-admin .admin-primary-btn,
html[data-leressae-theme="dark"] .technician-shell .tech-btn:not(.secondary),
html[data-leressae-theme="dark"] .technician-shell .tech-dashboard-action {
  color: #fff !important;
  background: linear-gradient(140deg, #448f57, #236b40) !important;
  border-color: #347549 !important;
  box-shadow: 0 7px 18px rgba(20, 89, 44, .3), inset 0 1px 0 rgba(255,255,255,.14) !important;
}
html[data-leressae-theme="dark"] #page-admin .btn-secondary,
html[data-leressae-theme="dark"] .technician-shell .tech-btn.secondary {
  color: #c8e8ce !important;
  background: linear-gradient(145deg, #1b3024, #15251e) !important;
  border-color: #365742 !important;
}
html[data-leressae-theme="dark"] #page-admin .admin-report-volume-bar i,
html[data-leressae-theme="dark"] #page-admin .admin-report-tech-meter i,
html[data-leressae-theme="dark"] #page-admin .admin-report-item-meter i,
html[data-leressae-theme="dark"] .technician-shell .tech-chart-bar {
  background: linear-gradient(180deg, #78c486, #2e8050) !important;
}
html[data-leressae-theme="dark"] .technician-shell .tech-stat:not(.is-progress) .tech-stat-icon {
  color: #9bd7a4 !important;
  background: #1c3928 !important;
}
html[data-leressae-theme="dark"] .technician-shell .tech-stat.is-progress .tech-stat-icon {
  color: #ffc96b !important;
  background: #3a2d19 !important;
}
html[data-leressae-theme="dark"] :is(#page-admin, .technician-shell) :is(button, a, input, select, textarea):focus-visible {
  outline: 3px solid rgba(126, 202, 139, .62) !important;
  outline-offset: 3px;
}

/* Carry the same restrained green through Admin charts and utility controls. */
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) #page-admin :is(.line-chart-line, .line-chart-point) {
  stroke: #398851;
}
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) #page-admin .line-chart-area {
  fill: rgba(65, 139, 80, .12);
}
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) #page-admin .histogram-bar {
  background: linear-gradient(180deg, #78bd82 0%, #28784a 100%) !important;
  box-shadow: 0 4px 10px rgba(40, 120, 74, .17);
}
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) #page-admin .item-fill,
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) #page-admin .chart-box .mini-bars > span {
  background: linear-gradient(180deg, #75b981 0%, #28784a 100%) !important;
}
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) #page-admin :is(.admin-report-volume-card, .admin-report-status-card, .admin-report-technician-card, .admin-report-item-card) {
  border-top-color: #6ca879;
}
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) #page-admin .admin-report-status-card .admin-report-meter i.is-progress {
  background: linear-gradient(90deg, #dfa22b, #f2c15e) !important;
}
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) #page-admin .save-status-btn:not(.danger-delete-news) {
  border-color: #cfe1d1;
  background: linear-gradient(145deg, #f5faf5, #eaf4eb);
  color: #28563a;
}
html[data-leressae-theme="dark"] #page-admin :is(.line-chart-line, .line-chart-point) {
  stroke: #81c88d;
}
html[data-leressae-theme="dark"] #page-admin .line-chart-area {
  fill: rgba(98, 174, 111, .16);
}
html[data-leressae-theme="dark"] #page-admin .histogram-bar,
html[data-leressae-theme="dark"] #page-admin .item-fill,
html[data-leressae-theme="dark"] #page-admin .chart-box .mini-bars > span {
  background: linear-gradient(180deg, #78c486 0%, #2e8050 100%) !important;
}
html[data-leressae-theme="dark"] #page-admin :is(.admin-report-volume-card, .admin-report-status-card, .admin-report-technician-card, .admin-report-item-card) {
  border-top-color: #4a8a5a;
}

/* ===== Premium full-width LERESSAE finish: clear mint atmosphere + soft glass ===== */
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) {
  --leressae-ink: #10243a;
  --leressae-muted: #60758a;
  --leressae-teal: #087f70;
  --leressae-teal-deep: #075e55;
  --leressae-mint: #dff4ed;
  --leressae-line: rgba(165, 202, 190, .48);
  --leressae-glass: rgba(255, 255, 255, .88);
  --leressae-shadow: 0 18px 48px rgba(16, 67, 57, .075), 0 3px 10px rgba(16, 67, 57, .035);
}

html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) body {
  background-color: #f7fbf9 !important;
  background-image:
    radial-gradient(ellipse at 12% 8%, rgba(132, 205, 183, .15), transparent 30%),
    radial-gradient(ellipse at 88% 24%, rgba(153, 220, 203, .13), transparent 34%),
    linear-gradient(180deg, #f8fbfa 0%, #f4faf7 48%, #f8fbfa 100%) !important;
  background-position: center top !important;
  background-repeat: no-repeat !important;
  background-size: cover !important;
  background-attachment: scroll !important;
  color: var(--leressae-ink) !important;
}

html[data-leressae-theme="dark"] body,
html[data-theme="dark"] body,
body.dark-mode {
  background-color: #0d1715 !important;
  background-image:
    radial-gradient(ellipse at 14% 4%, rgba(30, 105, 81, .18), transparent 32%),
    linear-gradient(180deg, #0c1715, #101b19 58%, #0b1413) !important;
  background-attachment: scroll !important;
}

.wrapper {
  width: min(100%, 1840px) !important;
  max-width: 1840px !important;
  padding-inline: clamp(18px, 3.4vw, 64px) !important;
  padding-top: clamp(12px, 1.6vw, 24px) !important;
  gap: clamp(22px, 3vw, 42px) !important;
}

.navbar {
  min-height: 86px;
  padding: 12px clamp(16px, 2.1vw, 32px) !important;
  border: 1px solid rgba(255, 255, 255, .94) !important;
  border-radius: 23px !important;
  background: rgba(255, 255, 255, .94) !important;
  box-shadow: 0 12px 34px rgba(19, 63, 54, .075), inset 0 1px 0 rgba(255, 255, 255, .98) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

.navbar .logo-img { transform: none !important; max-width: 86px; height: 68px; }
.navbar .brand { gap: 12px; }
.navbar .brand-title { color: #10243a; font-size: clamp(1.28rem, 1.6vw, 1.75rem); }
.navbar .brand-sub { color: #397064; font-size: .78rem; }
.navbar .nav-right { gap: clamp(12px, 1.65vw, 26px); }
.navbar .nav-links { gap: clamp(15px, 1.9vw, 30px); }
.navbar .nav-links > li > a {
  min-height: 48px;
  color: #455b6d;
  font-size: clamp(.9rem, 1vw, 1.02rem);
  font-weight: 700;
}
.navbar .nav-links > li > a:hover,
.navbar .nav-links > li > a.active,
.navbar .nav-links > li > a[aria-current="page"] { color: var(--leressae-teal) !important; }
.navbar .nav-links > li > a.active::after,
.navbar .nav-links > li > a[aria-current="page"]::after {
  bottom: 0;
  height: 3px;
  background: linear-gradient(90deg, #087f70, #69b99d) !important;
}
.navbar .btn-login {
  min-height: 48px;
  padding: 11px 20px;
  border-radius: 14px;
  background: linear-gradient(135deg, #0b8978, #066557) !important;
  box-shadow: 0 8px 20px rgba(8, 127, 112, .18), inset 0 1px 0 rgba(255,255,255,.18) !important;
}
.navbar .dropdown-content,
.navbar .login-dropdown-content {
  border-color: #d8e9e3;
  background: #fff;
  box-shadow: 0 18px 40px rgba(19, 63, 54, .13);
}
.navbar .dropdown-content li a.nav-service-link.active,
.navbar .dropdown-content li a.nav-service-link[aria-current="page"] {
  color: #076b5e !important;
  background: #eaf7f1 !important;
  border-left-color: #15927d !important;
}

#page-dashboard {
  gap: clamp(22px, 3vw, 40px) !important;
}
#page-dashboard .hero-section {
  min-height: clamp(500px, 48vw, 720px) !important;
  grid-template-columns: minmax(0, 1.08fr) minmax(360px, .92fr) !important;
  gap: clamp(30px, 5vw, 88px) !important;
  padding: clamp(38px, 5.2vw, 92px) clamp(30px, 5vw, 88px) !important;
  border: 1px solid rgba(255,255,255,.96) !important;
  border-radius: clamp(24px, 2.4vw, 38px) !important;
  background-color: #eff9f5 !important;
  background-image:
    radial-gradient(ellipse at 68% 18%, rgba(116, 205, 176, .17), transparent 36%),
    radial-gradient(ellipse at 8% 88%, rgba(183, 225, 211, .26), transparent 34%),
    linear-gradient(128deg, #f5faf8 0%, #eef8f4 53%, #e7f5ef 100%) !important;
  box-shadow: 0 24px 64px rgba(16, 67, 57, .085), inset 0 1px 0 rgba(255,255,255,.98) !important;
}
#page-dashboard .hero-section::before,
#page-dashboard .hero-section::after {
  filter: none !important;
  mix-blend-mode: normal;
}
#page-dashboard .hero-section::before {
  width: clamp(220px, 28vw, 430px);
  height: clamp(220px, 28vw, 430px);
  right: 34%;
  top: -42%;
  background: radial-gradient(circle, rgba(255,255,255,.8), rgba(255,255,255,0) 72%) !important;
  box-shadow: 180px 220px 0 rgba(96, 180, 148, .055), -210px 300px 0 rgba(255,255,255,.2) !important;
}
#page-dashboard .hero-section::after {
  width: clamp(190px, 22vw, 340px);
  height: clamp(190px, 22vw, 340px);
  right: -5%;
  bottom: -30%;
  background: radial-gradient(circle, rgba(129, 204, 176, .18), rgba(129, 204, 176, 0) 72%) !important;
  box-shadow: -170px -100px 0 rgba(255,255,255,.28) !important;
}
#page-dashboard .hero-content { max-width: 850px !important; }
#page-dashboard .hero-badge {
  margin-bottom: clamp(20px, 2.5vw, 36px) !important;
  padding: 9px 16px !important;
  color: #087367 !important;
  background: rgba(255,255,255,.8) !important;
  border-color: rgba(8, 127, 112, .2) !important;
  box-shadow: 0 5px 18px rgba(8, 91, 78, .05) !important;
  font-size: .76rem !important;
}
#page-dashboard .hero-title {
  max-width: 850px !important;
  margin-bottom: clamp(18px, 2vw, 28px) !important;
  color: #10243a !important;
  font-size: clamp(3.7rem, 7vw, 7rem) !important;
  line-height: .98 !important;
  letter-spacing: -.065em !important;
  text-wrap: balance;
}
#page-dashboard .hero-desc {
  max-width: 780px !important;
  margin-bottom: clamp(26px, 3vw, 42px) !important;
  color: #536c7c !important;
  font-size: clamp(1.08rem, 1.45vw, 1.4rem) !important;
  line-height: 1.75 !important;
}
html[data-leressae-theme="light"] #page-dashboard .hero-section .hero-title { color: #10243a !important; }
html[data-leressae-theme="light"] #page-dashboard .hero-section .hero-desc { color: #536c7c !important; }
#page-dashboard .hero-actions { gap: 12px !important; }
#page-dashboard .hero-actions .btn-primary,
#page-dashboard .hero-actions .btn-secondary {
  min-height: 56px !important;
  padding: 15px clamp(18px, 2vw, 28px) !important;
  border-radius: 16px !important;
  font-size: .98rem !important;
  font-weight: 750 !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}
#page-dashboard .hero-actions .btn-primary,
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) :is(#page-pendaftaran, #page-media-penanganan, #page-media, #page-kontak, #page-status, #page-info) .btn-primary,
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) #page-status .status-form button,
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) #homeNewsList .home-news-content .news-read-more {
  color: #fff !important;
  background: linear-gradient(135deg, #0b8978, #066557) !important;
  box-shadow: 0 10px 24px rgba(8, 127, 112, .2), inset 0 1px 0 rgba(255,255,255,.18) !important;
}
#page-dashboard .hero-actions .btn-primary:hover,
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) :is(#page-pendaftaran, #page-media-penanganan, #page-media, #page-kontak, #page-status, #page-info) .btn-primary:hover,
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) #page-status .status-form button:hover,
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) #homeNewsList .home-news-content .news-read-more:hover {
  background: linear-gradient(135deg, #087868, #04574e) !important;
  box-shadow: 0 14px 28px rgba(8, 127, 112, .25), inset 0 1px 0 rgba(255,255,255,.2) !important;
}
#page-dashboard .hero-actions .btn-secondary,
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) :is(#page-pendaftaran, #page-media-penanganan, #page-media, #page-kontak, #page-status, #page-info) .btn-secondary {
  color: #31566a !important;
  border: 1px solid rgba(131, 173, 161, .38) !important;
  background: rgba(255,255,255,.92) !important;
  box-shadow: 0 6px 18px rgba(22, 73, 61, .055), inset 0 1px 0 rgba(255,255,255,.98) !important;
}
#page-dashboard .hero-slogan-card {
  width: 100%;
  max-width: 700px;
  justify-self: end;
  min-height: 0 !important;
  padding: clamp(28px, 3.6vw, 54px) !important;
  border: 1px solid rgba(255,255,255,.98) !important;
  border-radius: clamp(22px, 2vw, 32px) !important;
  background: linear-gradient(148deg, rgba(255,255,255,.94), rgba(249,253,251,.88)) !important;
  box-shadow: 0 22px 55px rgba(25, 77, 64, .105), inset 0 1px 0 #fff !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}
#page-dashboard .slogan-label { color: #087367 !important; letter-spacing: .14em !important; }
#page-dashboard .slogan-main {
  margin-bottom: 16px !important;
  color: #123b38 !important;
  font-size: clamp(1.45rem, 2vw, 2rem) !important;
}
#page-dashboard .slogan-sub {
  color: #536d70 !important;
  font-size: clamp(.96rem, 1.12vw, 1.08rem) !important;
  line-height: 1.82 !important;
}
#page-dashboard .decor-bike { opacity: .035 !important; }

#page-dashboard :is(.dashboard-section, .pillar-card, .service-item-card, .tutorial-card, #homeNewsList .news-card),
#page-info #publicNewsList .news-card,
.home-media-spotlight {
  border-color: var(--leressae-line) !important;
  background: linear-gradient(148deg, rgba(255,255,255,.96), rgba(248,252,250,.9)) !important;
  box-shadow: var(--leressae-shadow), inset 0 1px 0 rgba(255,255,255,.98) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}
#page-dashboard .dashboard-section {
  padding: clamp(26px, 3.8vw, 54px) !important;
  border-radius: 28px !important;
}
#page-dashboard .section-header { margin-bottom: clamp(22px, 3vw, 36px) !important; }
#page-dashboard .section-title-text { color: #153d38 !important; font-size: clamp(1.35rem, 1.9vw, 1.8rem) !important; }
#page-dashboard .section-sub-text { color: #657d7c !important; font-size: 1rem !important; }
#page-dashboard .service-item-card,
#page-dashboard .tutorial-card {
  border-radius: 20px !important;
  border-color: rgba(171, 207, 195, .48) !important;
}
#page-dashboard .service-item-icon,
#page-dashboard .tutorial-tag,
#page-dashboard .pillar-icon {
  color: #087367 !important;
  border-color: rgba(8,127,112,.12) !important;
  background: linear-gradient(145deg, #e7f8f2, #f5fbf8) !important;
}

html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) :is(#page-pendaftaran, #page-media-penanganan, #page-media, #page-kontak, #page-status, #page-info) {
  width: 100%;
  min-width: 0;
  padding: clamp(24px, 4vw, 58px) !important;
  border: 1px solid rgba(255,255,255,.96) !important;
  border-radius: clamp(22px, 2.2vw, 34px) !important;
  background: linear-gradient(145deg, rgba(255,255,255,.94), rgba(248,252,250,.9)) !important;
  box-shadow: var(--leressae-shadow), inset 0 1px 0 rgba(255,255,255,.98) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) :is(#page-pendaftaran, #page-media-penanganan, #page-media, #page-kontak, #page-status, #page-info) .page-header-title {
  color: #102e31 !important;
  font-size: clamp(1.8rem, 3.2vw, 3rem) !important;
  letter-spacing: -.045em;
}
html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) :is(#page-pendaftaran, #page-media-penanganan, #page-media, #page-kontak, #page-status, #page-info) .page-header-desc {
  max-width: 900px;
  color: #627b7a !important;
  font-size: clamp(1rem, 1.25vw, 1.18rem) !important;
  line-height: 1.8 !important;
}
#page-media .media-section,
#page-kontak .contact-grid,
#page-media-penanganan .tutorial-scroll { min-width: 0; }
#page-media .media-grid { grid-template-columns: repeat(auto-fit, minmax(min(100%, 250px), 1fr)); gap: clamp(14px, 1.8vw, 24px); }
#page-kontak .contact-card,
#page-status :is(.status-lookup-wrap, .service-status-card) {
  border: 1px solid var(--leressae-line) !important;
  border-radius: 21px !important;
  background: linear-gradient(145deg, rgba(255,255,255,.97), rgba(242,250,246,.93)) !important;
  box-shadow: 0 12px 30px rgba(16,67,57,.06), inset 0 1px 0 #fff !important;
}
#page-status :is(input, select, textarea) {
  border-color: #cfe2dc !important;
  background: rgba(255,255,255,.96) !important;
}
#page-status :is(input, select, textarea):focus {
  border-color: #45a18a !important;
  box-shadow: 0 0 0 4px rgba(8,127,112,.1) !important;
}

.site-footer {
  width: min(100%, 1840px) !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  border-radius: 28px 28px 0 0 !important;
  background: linear-gradient(135deg, #0b3d39, #075c52 58%, #087a67) !important;
  box-shadow: 0 -10px 40px rgba(16,67,57,.08) !important;
}
.site-footer h3, .site-footer h4 { color: #f3fbf8 !important; }
.site-footer p, .site-footer li, .site-footer a, .site-footer-bottom { color: rgba(235,248,243,.82) !important; }
.site-footer a:hover { color: #fff !important; }

@media (min-width: 901px) {
  .wrapper { gap: clamp(28px, 3.2vw, 50px) !important; }
  #page-dashboard .hero-section { margin-top: 2px; }
}

@media (max-width: 1100px) {
  .wrapper { padding-inline: clamp(18px, 2.8vw, 34px) !important; }
  .navbar { min-height: 78px; }
  .navbar .logo-img { height: 58px; max-width: 72px; }
  #page-dashboard .hero-section { grid-template-columns: minmax(0, 1fr) minmax(300px, .82fr) !important; }
}

@media (max-width: 900px) {
  .navbar { border-radius: 19px !important; }
  .navbar .nav-links > li > a.active::after,
  .navbar .nav-links > li > a[aria-current="page"]::after { bottom: 2px; }
  #page-dashboard .hero-section {
    min-height: 0 !important;
    grid-template-columns: minmax(0, 1fr) !important;
    padding: clamp(30px, 6vw, 58px) !important;
  }
  #page-dashboard .hero-content { max-width: 900px !important; }
  #page-dashboard .hero-title { font-size: clamp(3.25rem, 10vw, 5.8rem) !important; }
  #page-dashboard .hero-slogan-card { justify-self: stretch; max-width: 820px; }
  html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) :is(#page-pendaftaran, #page-media-penanganan, #page-media, #page-kontak, #page-status, #page-info) { padding: clamp(22px, 4.5vw, 38px) !important; }
}

@media (max-width: 640px) {
  .wrapper {
    padding: 10px 14px 0 !important;
    gap: 18px !important;
  }
  .navbar {
    min-height: 70px;
    padding: 9px 12px !important;
    border-radius: 17px !important;
  }
  .navbar .brand { gap: 8px; }
  .navbar .logo-img { width: 52px; height: 48px; max-width: 52px; }
  .navbar .brand-title { font-size: 1.1rem; }
  .navbar .brand-sub { font-size: .66rem; }
  #page-dashboard { gap: 18px !important; }
  #page-dashboard .hero-section {
    padding: 27px 20px 22px !important;
    gap: 22px !important;
    border-radius: 23px !important;
  }
  #page-dashboard .hero-badge { font-size: .66rem !important; letter-spacing: .06em !important; }
  #page-dashboard .hero-title { font-size: clamp(2.85rem, 13vw, 4.5rem) !important; }
  #page-dashboard .hero-desc { font-size: 1rem !important; line-height: 1.7 !important; }
  #page-dashboard .hero-actions { display: grid; grid-template-columns: minmax(0, 1fr); gap: 10px !important; }
  #page-dashboard .hero-actions > * { width: 100%; }
  #page-dashboard .hero-slogan-card { padding: 23px 20px !important; border-radius: 20px !important; }
  #page-dashboard .slogan-sub { font-size: .9rem !important; }
  #page-dashboard .dashboard-section { padding: 22px 18px !important; border-radius: 22px !important; }
  html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) :is(#page-pendaftaran, #page-media-penanganan, #page-media, #page-kontak, #page-status, #page-info) {
    padding: 24px 18px !important;
    border-radius: 22px !important;
  }
  #page-media .media-grid { grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr)); }
}

@media (max-width: 380px) {
  .wrapper { padding-inline: 10px !important; }
  #page-dashboard .hero-section { padding: 22px 15px 18px !important; }
  #page-dashboard .hero-title { font-size: 2.7rem !important; }
  #page-dashboard .hero-slogan-card { padding: 19px 16px !important; }
  html:not([data-leressae-theme="dark"]):not([data-theme="dark"]) :is(#page-pendaftaran, #page-media-penanganan, #page-media, #page-kontak, #page-status, #page-info) { padding: 21px 15px !important; }
}

@media (prefers-reduced-motion: reduce) {
  .navbar *, #page-dashboard *, #page-pendaftaran *, #page-media-penanganan *, #page-media *, #page-kontak *, #page-status * {
    animation-duration: .01ms !important;
    transition-duration: .01ms !important;
    scroll-behavior: auto !important;
  }
}

/* Dashboard operating-hours feature and animated status-search affordance. */
.dashboard-hours-card {
  --hours-green: #087f70;
  position: relative;
  display: grid;
  grid-template-columns: auto minmax(190px, .9fr) minmax(300px, 1.2fr) auto;
  grid-template-areas: "icon copy schedule indicator";
  align-items: center;
  gap: clamp(16px, 2vw, 30px);
  width: 100%;
  min-width: 0;
  padding: clamp(19px, 2.2vw, 30px) clamp(20px, 2.8vw, 40px);
  border: 1px solid rgba(165, 202, 190, .55);
  border-radius: 24px;
  background:
    radial-gradient(ellipse at 3% 0%, rgba(121, 201, 174, .1), transparent 40%),
    linear-gradient(145deg, rgba(255,255,255,.96), rgba(246,251,248,.93));
  box-shadow: 0 14px 36px rgba(16, 67, 57, .065), inset 0 1px 0 rgba(255,255,255,.98);
  transform: translateZ(0);
  transition: transform .28s cubic-bezier(.2,.75,.25,1), box-shadow .28s ease, border-color .28s ease, background-color .28s ease;
  overflow: hidden;
}
.dashboard-hours-card::after {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 4px;
  border-radius: inherit;
  background: linear-gradient(180deg, #57b995, #087f70);
  opacity: .78;
  pointer-events: none;
}
.dashboard-hours-icon {
  grid-area: icon;
  display: grid;
  width: clamp(58px, 5vw, 76px);
  height: clamp(58px, 5vw, 76px);
  place-items: center;
  border: 1px solid rgba(8,127,112,.13);
  border-radius: 21px;
  color: #087f70;
  background: linear-gradient(145deg, #e0f6ee, #f4fbf7);
  box-shadow: 0 9px 22px rgba(8,127,112,.12), inset 0 1px 0 rgba(255,255,255,.96), inset 0 -4px 10px rgba(8,127,112,.035);
  transition: transform .35s cubic-bezier(.2,.75,.25,1), box-shadow .35s ease;
}
.dashboard-hours-icon svg { width: 56%; height: 56%; overflow: visible; }
.dashboard-hours-icon svg > circle:first-child { stroke: currentColor; stroke-width: 2.1; }
.dashboard-hours-clock-hands {
  transform-origin: 24px 24px;
  transition: transform .55s cubic-bezier(.2,.8,.25,1);
}
.dashboard-hours-clock-hands path { stroke: currentColor; stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; }
.dashboard-hours-clock-hands circle { fill: currentColor; }
.dashboard-hours-clock-mark { stroke: rgba(8,127,112,.5); stroke-width: 1.8; stroke-linecap: round; }
.dashboard-hours-copy { grid-area: copy; min-width: 0; }
.dashboard-hours-kicker {
  display: block;
  margin-bottom: 4px;
  color: #398878;
  font-size: .68rem;
  font-weight: 850;
  letter-spacing: .13em;
  line-height: 1.4;
}
.dashboard-hours-copy h2 {
  margin: 0;
  color: #133c37;
  font-size: clamp(1.18rem, 1.55vw, 1.55rem);
  font-weight: 800;
  letter-spacing: -.035em;
  line-height: 1.25;
}
.dashboard-hours-copy p { margin: 5px 0 0; color: #6b817e; font-size: .9rem; line-height: 1.55; }
.dashboard-hours-schedule {
  grid-area: schedule;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  min-width: 0;
}
.dashboard-hours-row {
  display: grid;
  gap: 5px;
  min-width: 0;
  padding: 12px 15px;
  border: 1px solid rgba(170, 205, 193, .46);
  border-radius: 15px;
  background: rgba(255,255,255,.78);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.95);
  transition: transform .25s ease, border-color .25s ease, background-color .25s ease;
}
.dashboard-hours-row span { color: #6b817e; font-size: .78rem; font-weight: 700; line-height: 1.3; }
.dashboard-hours-row strong { color: #145d53; font-size: clamp(.84rem, 1vw, .98rem); font-weight: 800; line-height: 1.35; white-space: nowrap; }
.dashboard-hours-indicator {
  grid-area: indicator;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 9px 13px;
  border: 1px solid rgba(87, 177, 144, .2);
  border-radius: 999px;
  color: #267461;
  background: rgba(233, 249, 241, .84);
  font-size: .76rem;
  font-weight: 750;
  white-space: nowrap;
}
.dashboard-hours-indicator i {
  display: block;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #29a77f;
  box-shadow: 0 0 0 4px rgba(41,167,127,.1);
}
@media (hover: hover) and (pointer: fine) {
  .dashboard-hours-card:hover {
    transform: translateY(-5px) perspective(1000px) rotateX(1deg);
    border-color: rgba(97, 174, 148, .58);
    background-color: #fff;
    box-shadow: 0 24px 52px rgba(16, 67, 57, .12), inset 0 1px 0 rgba(255,255,255,.99);
  }
  .dashboard-hours-card:hover .dashboard-hours-icon {
    transform: translateY(-2px) rotate(-4deg) scale(1.045);
    box-shadow: 0 14px 28px rgba(8,127,112,.18), inset 0 1px 0 #fff, inset 0 -4px 10px rgba(8,127,112,.04);
  }
  .dashboard-hours-card:hover .dashboard-hours-clock-hands { transform: rotate(300deg); }
  .dashboard-hours-card:hover .dashboard-hours-row { transform: translateY(-2px); border-color: rgba(87,177,144,.38); background: #fff; }
}

#page-status .status-lookup-wrap {
  padding: clamp(20px, 3vw, 36px) !important;
  border: 1px solid rgba(165, 202, 190, .52) !important;
  border-radius: 24px !important;
  background:
    radial-gradient(ellipse at 100% 0%, rgba(121,201,174,.1), transparent 42%),
    linear-gradient(145deg, rgba(255,255,255,.98), rgba(246,251,248,.95)) !important;
  box-shadow: 0 18px 42px rgba(16,67,57,.075), inset 0 1px 0 rgba(255,255,255,.98) !important;
}
#page-status .status-form { gap: 14px !important; }
#page-status .status-form input {
  min-height: 58px !important;
  padding: 14px 18px !important;
  border: 1px solid #cfe2dc !important;
  border-radius: 15px !important;
  color: #173d3a !important;
  background: rgba(255,255,255,.96) !important;
  box-shadow: inset 0 1px 2px rgba(16,67,57,.025) !important;
}
#page-status .status-form input::placeholder { color: #8b9f9c; }
#page-status .status-form input:focus {
  border-color: #41a28c !important;
  box-shadow: 0 0 0 4px rgba(8,127,112,.1), 0 5px 16px rgba(8,127,112,.06) !important;
}
#page-status .status-form button {
  display: inline-flex !important;
  min-height: 58px !important;
  align-items: center;
  justify-content: center;
  gap: 11px;
  padding: 12px 23px !important;
  border: 1px solid rgba(255,255,255,.18) !important;
  border-radius: 15px !important;
  color: #fff !important;
  background: linear-gradient(145deg, #0a917d 0%, #087669 52%, #075f56 100%) !important;
  box-shadow: 0 10px 22px rgba(8,127,112,.22), inset 0 1px 0 rgba(255,255,255,.2), inset 0 -3px 6px rgba(0,45,39,.12) !important;
  transition: transform .22s ease, box-shadow .22s ease, filter .22s ease !important;
}
#page-status .status-search-icon {
  display: block;
  width: 23px;
  height: 23px;
  flex: 0 0 23px;
  overflow: visible;
  color: currentColor;
  filter: drop-shadow(0 2px 2px rgba(0, 33, 29, .26));
  transform-origin: 45% 45%;
  animation: statusSearchFloat 3.2s ease-in-out infinite;
}
#page-status .status-search-icon circle,
#page-status .status-search-icon path {
  stroke: currentColor;
  stroke-width: 2.1;
  stroke-linecap: round;
  stroke-linejoin: round;
}
@keyframes statusSearchFloat {
  0%, 100% { transform: translateY(0) rotate(0deg); }
  48% { transform: translateY(-2px) rotate(-4deg); }
  72% { transform: translateY(0) rotate(2deg); }
}
@media (hover: hover) and (pointer: fine) {
  #page-status .status-form button:hover {
    transform: translateY(-3px);
    filter: brightness(1.045);
    box-shadow: 0 15px 28px rgba(8,127,112,.28), inset 0 1px 0 rgba(255,255,255,.22), inset 0 -3px 6px rgba(0,45,39,.1) !important;
  }
  #page-status .status-form button:hover .status-search-icon {
    animation: none;
    transform: scale(1.17) rotate(-12deg);
  }
}
#page-status .status-form button:active { transform: translateY(0) scale(.985); }
#page-status .status-form button:focus-visible {
  outline: 3px solid rgba(8,127,112,.35) !important;
  outline-offset: 3px;
}

html[data-leressae-theme="dark"] .dashboard-hours-card,
html[data-theme="dark"] .dashboard-hours-card,
body.dark-mode .dashboard-hours-card {
  border-color: #345347;
  background: radial-gradient(ellipse at 2% 0%, rgba(57,135,105,.14), transparent 42%), linear-gradient(145deg, #13251f, #10201c);
  box-shadow: 0 16px 40px rgba(0,0,0,.22), inset 0 1px 0 rgba(255,255,255,.035);
}
html[data-leressae-theme="dark"] .dashboard-hours-copy h2,
html[data-theme="dark"] .dashboard-hours-copy h2,
body.dark-mode .dashboard-hours-copy h2 { color: #e0f3e9; }
html[data-leressae-theme="dark"] .dashboard-hours-copy p,
html[data-leressae-theme="dark"] .dashboard-hours-row span,
html[data-theme="dark"] .dashboard-hours-copy p,
html[data-theme="dark"] .dashboard-hours-row span,
body.dark-mode .dashboard-hours-copy p,
body.dark-mode .dashboard-hours-row span { color: #a7c2b7; }
html[data-leressae-theme="dark"] .dashboard-hours-row,
html[data-theme="dark"] .dashboard-hours-row,
body.dark-mode .dashboard-hours-row { border-color: #345347; background: #172c25; }
html[data-leressae-theme="dark"] .dashboard-hours-row strong,
html[data-theme="dark"] .dashboard-hours-row strong,
body.dark-mode .dashboard-hours-row strong { color: #a8e0c8; }
html[data-leressae-theme="dark"] .dashboard-hours-icon,
html[data-theme="dark"] .dashboard-hours-icon,
body.dark-mode .dashboard-hours-icon { border-color: #355b4c; color: #88d3b3; background: linear-gradient(145deg,#1a3a30,#142b25); }
html[data-leressae-theme="dark"] #page-status .status-lookup-wrap,
html[data-theme="dark"] #page-status .status-lookup-wrap,
body.dark-mode #page-status .status-lookup-wrap { border-color: #345347 !important; background: linear-gradient(145deg,#13251f,#10201c) !important; }
html[data-leressae-theme="dark"] #page-status .status-form input,
html[data-theme="dark"] #page-status .status-form input,
body.dark-mode #page-status .status-form input { border-color: #3b5b50 !important; color: #e4f3ec !important; background: #172923 !important; }
html[data-leressae-theme="dark"] #page-status .status-form input::placeholder,
html[data-theme="dark"] #page-status .status-form input::placeholder,
body.dark-mode #page-status .status-form input::placeholder { color: #9db6ad; }

@media (max-width: 900px) {
  .dashboard-hours-card {
    grid-template-columns: auto minmax(0, 1fr);
    grid-template-areas: "icon copy" "schedule schedule" "indicator indicator";
    gap: 14px 18px;
  }
  .dashboard-hours-indicator { justify-self: start; }
}
@media (max-width: 640px) {
  .dashboard-hours-card { padding: 19px 17px 17px 20px; border-radius: 20px; }
  .dashboard-hours-icon { width: 56px; height: 56px; border-radius: 17px; }
  .dashboard-hours-schedule { grid-template-columns: minmax(0, 1fr); gap: 8px; }
  .dashboard-hours-row { grid-template-columns: minmax(105px, .8fr) minmax(0, 1fr); align-items: center; padding: 11px 13px; }
  .dashboard-hours-row strong { text-align: right; white-space: normal; }
  #page-status .status-form { grid-template-columns: minmax(0, 1fr) !important; }
  #page-status .status-form button { width: 100%; }
}
@media (prefers-reduced-motion: reduce) {
  #page-status .status-search-icon { animation: none !important; }
  .dashboard-hours-card, .dashboard-hours-icon, .dashboard-hours-row,
  #page-status .status-form button, #page-status .status-search-icon { transition: none !important; }
}

/* Dashboard quick status lookup: a wide, on-brand entry to the existing status flow. */
.dashboard-status-lookup {
  display: grid;
  grid-template-columns: minmax(0, .95fr) minmax(320px, 1.05fr);
  align-items: center;
  gap: clamp(18px, 3vw, 34px);
  width: 100%;
  min-width: 0;
  margin: 0 0 20px;
  padding: clamp(20px, 2.7vw, 32px);
  border: 1px solid rgba(165, 202, 190, .52);
  border-radius: 24px;
  background: radial-gradient(ellipse at 100% 0%, rgba(121,201,174,.12), transparent 42%), linear-gradient(145deg, rgba(255,255,255,.98), rgba(246,251,248,.95));
  box-shadow: 0 16px 38px rgba(16,67,57,.07), inset 0 1px 0 rgba(255,255,255,.98);
}
.dashboard-status-lookup-copy { display: flex; align-items: center; gap: 16px; min-width: 0; }
.dashboard-status-lookup-icon {
  display: grid;
  place-items: center;
  flex: 0 0 58px;
  width: 58px;
  height: 58px;
  border: 1px solid rgba(87,177,144,.28);
  border-radius: 18px;
  color: #087f70;
  background: linear-gradient(145deg, #f5fcf8, #e5f4eb);
  box-shadow: 0 8px 18px rgba(8,127,112,.1), inset 0 1px 0 #fff;
}
.dashboard-status-lookup-icon svg { width: 27px; height: 27px; }
.dashboard-status-lookup-icon circle, .dashboard-status-lookup-icon path,
.dashboard-status-search-icon circle, .dashboard-status-search-icon path {
  stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round;
}
.dashboard-status-lookup-kicker {
  display: block;
  margin-bottom: 4px;
  color: #087f70;
  font-size: .72rem;
  font-weight: 850;
  letter-spacing: .12em;
}
.dashboard-status-lookup-copy h2 { margin: 0; color: #173b35; font-size: clamp(1.05rem, 1.55vw, 1.3rem); line-height: 1.3; }
.dashboard-status-lookup-copy p { margin: 5px 0 0; color: #607872; font-size: .88rem; line-height: 1.5; }
.dashboard-status-lookup-form {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: stretch;
  gap: 10px;
  width: 100%;
  min-width: 0;
  margin: 0;
}
.dashboard-status-lookup-form input {
  width: 100%;
  min-width: 0;
  min-height: 56px;
  padding: 13px 16px;
  border: 1px solid #cfe2dc;
  border-radius: 15px;
  color: #173d3a;
  background: rgba(255,255,255,.97);
  box-shadow: inset 0 1px 2px rgba(16,67,57,.025);
}
.dashboard-status-lookup-form input::placeholder { color: #8b9f9c; }
.dashboard-status-lookup-form input:focus { border-color: #41a28c; box-shadow: 0 0 0 4px rgba(8,127,112,.1); }
.dashboard-status-lookup-form button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  min-width: 146px;
  min-height: 56px;
  padding: 12px 19px;
  border: 1px solid rgba(255,255,255,.2);
  border-radius: 15px;
  color: #fff;
  font-weight: 800;
  white-space: nowrap;
  background: linear-gradient(145deg, #0a917d 0%, #087669 52%, #075f56 100%);
  box-shadow: 0 9px 20px rgba(8,127,112,.2), inset 0 1px 0 rgba(255,255,255,.2), inset 0 -3px 6px rgba(0,45,39,.1);
  transition: transform .2s ease, box-shadow .2s ease, filter .2s ease;
}
.dashboard-status-search-icon { width: 21px; height: 21px; flex: 0 0 21px; animation: statusSearchFloat 3.2s ease-in-out infinite; }
@media (hover: hover) and (pointer: fine) {
  .dashboard-status-lookup:hover { border-color: rgba(97,174,148,.6); box-shadow: 0 21px 44px rgba(16,67,57,.1), inset 0 1px 0 #fff; }
  .dashboard-status-lookup-form button:hover { transform: translateY(-2px); filter: brightness(1.04); box-shadow: 0 13px 26px rgba(8,127,112,.26), inset 0 1px 0 rgba(255,255,255,.22); }
  .dashboard-status-lookup-form button:hover .dashboard-status-search-icon { animation: none; transform: translateY(-2px) scale(1.08); }
}
.dashboard-status-lookup-form button:active { transform: translateY(0) scale(.985); }
.dashboard-status-lookup-form button:focus-visible { outline: 3px solid rgba(8,127,112,.36); outline-offset: 3px; }
@media (max-width: 900px) {
  .dashboard-status-lookup { grid-template-columns: minmax(0,1fr); gap: 16px; }
}
@media (max-width: 640px) {
  .dashboard-status-lookup { padding: 18px 16px; border-radius: 20px; }
  .dashboard-status-lookup-copy { align-items: flex-start; gap: 12px; }
  .dashboard-status-lookup-icon { flex-basis: 50px; width: 50px; height: 50px; border-radius: 15px; }
  .dashboard-status-lookup-form { grid-template-columns: minmax(0,1fr); }
  .dashboard-status-lookup-form button { width: 100%; }
}
@media (prefers-reduced-motion: reduce) {
  .dashboard-status-lookup, .dashboard-status-lookup-form button, .dashboard-status-search-icon { transition: none !important; animation: none !important; }
}

/* ===== Final Admin + Technician palette alignment with the LERESSAE footer =====
   Keep the navy identity, use deep teal for primary actions and mint for surfaces.
   Semantic error, critical-stock, blocked, and destructive states retain red. */
html[data-leressae-theme="light"] {
  --ops-ink: #183a35;
  --ops-muted: #607872;
  --ops-brand: #087f70;
  --ops-brand-deep: #075e55;
  --ops-brand-soft: #eaf5f0;
  --ops-border: #d5e5dc;
  --ops-canvas: #f4f9f6;
  --ops-card: #ffffff;
  --ops-hover: #f0f7f3;
  --ops-shadow: 0 12px 30px rgba(16, 67, 57, .075);
}
html[data-leressae-theme="dark"] {
  --ops-ink: #e4f3ec;
  --ops-muted: #a7c2b7;
  --ops-brand: #75c7a8;
  --ops-brand-deep: #16866f;
  --ops-brand-soft: #19352d;
  --ops-border: #315448;
  --ops-canvas: #0d1916;
  --ops-card: #14231e;
  --ops-hover: #1a3028;
  --ops-shadow: 0 14px 34px rgba(0, 0, 0, .24);
}

/* The existing navy sidebars now carry a subtle teal-green glow in both themes. */
html[data-leressae-theme="light"] #page-admin .admin-sidebar,
html[data-leressae-theme="dark"] #page-admin .admin-sidebar,
html[data-leressae-theme="light"] .technician-shell .technician-sidebar,
html[data-leressae-theme="dark"] .technician-shell .technician-sidebar {
  background:
    radial-gradient(ellipse at 100% 0%, rgba(24, 132, 103, .22), transparent 38%),
    linear-gradient(155deg, #0c1b2b 0%, #102329 62%, #10342b 100%) !important;
  border-color: rgba(123, 184, 151, .25) !important;
  box-shadow: 0 18px 40px rgba(13, 43, 34, .2), inset 0 1px 0 rgba(255,255,255,.07) !important;
}
html[data-leressae-theme="light"] #page-admin .admin-nav-item:hover,
html[data-leressae-theme="light"] #page-admin .admin-nav-item.active,
html[data-leressae-theme="light"] .technician-shell .technician-nav button:hover,
html[data-leressae-theme="light"] .technician-shell .technician-nav button.active,
html[data-leressae-theme="dark"] #page-admin .admin-nav-item:hover,
html[data-leressae-theme="dark"] #page-admin .admin-nav-item.active,
html[data-leressae-theme="dark"] .technician-shell .technician-nav button:hover,
html[data-leressae-theme="dark"] .technician-shell .technician-nav button.active {
  background: linear-gradient(125deg, rgba(26, 139, 105, .35), rgba(13, 94, 77, .22)) !important;
  border-color: rgba(130, 197, 164, .55) !important;
  color: #f5fff9 !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.1), 0 6px 16px rgba(0, 27, 21, .16) !important;
}

/* Light surfaces: align cards, tables, controls, and supporting text. */
html[data-leressae-theme="light"] #page-admin :is(.admin-content, .admin-shell),
html[data-leressae-theme="light"] .technician-shell :is(.technician-content, .technician-main) {
  background: linear-gradient(150deg, #f7fbf8 0%, #eff7f2 54%, #f8fbf9 100%) !important;
  color: var(--ops-ink) !important;
}
html[data-leressae-theme="light"] #page-admin :is(.admin-topbar, .admin-card, .admin-stat-card, .admin-stat-mini, .admin-info-card, .admin-report-chart-card, .admin-report-details, .admin-filter-card, .admin-panel, .settings-card, .settings-panel, .stock-panel, .stock-source-panel, .stock-body),
html[data-leressae-theme="light"] .technician-shell :is(.tech-welcome, .tech-stat, .tech-section, .tech-card, .tech-profile-grid > div, .tech-stock-pill, .tech-status-summary > div) {
  color: var(--ops-ink) !important;
  background: radial-gradient(ellipse at 100% 0%, rgba(126, 194, 160, .09), transparent 38%), linear-gradient(145deg, rgba(255,255,255,.99), rgba(246,250,247,.97)) !important;
  border-color: var(--ops-border) !important;
  box-shadow: var(--ops-shadow), inset 0 1px 0 rgba(255,255,255,.96) !important;
}
html[data-leressae-theme="light"] #page-admin :is(h1, h2, h3, h4, .admin-stat-value, .admin-stat-mini .value, .admin-card-header h3, .admin-report-chart-heading h4, .admin-report-details-heading h4),
html[data-leressae-theme="light"] .technician-shell :is(h1, h2, h3, h4, .tech-stat .value, .tech-welcome h3, .tech-status-count strong) {
  color: #173b35 !important;
  -webkit-text-fill-color: #173b35 !important;
}
html[data-leressae-theme="light"] #page-admin :is(p, small, .admin-breadcrumb, .admin-stat-label, .admin-stat-mini .label, .admin-report-chart-heading span, .admin-report-details-heading span, .admin-filter-label),
html[data-leressae-theme="light"] .technician-shell :is(p, small, .tech-eyebrow, .tech-stat .label, .tech-chart-col small, .tech-status-count small) {
  color: var(--ops-muted) !important;
}
html[data-leressae-theme="light"] #page-admin :is(input, select, textarea),
html[data-leressae-theme="light"] .technician-shell :is(input, select, textarea) {
  color: #24453e !important;
  background: rgba(255,255,255,.97) !important;
  border-color: #cddfd5 !important;
}
html[data-leressae-theme="light"] #page-admin :is(input, textarea)::placeholder,
html[data-leressae-theme="light"] .technician-shell :is(input, textarea)::placeholder { color: #82968e !important; }
html[data-leressae-theme="light"] #page-admin :is(.admin-table, .admin-report-table, .admin-tech-management-table) th,
html[data-leressae-theme="light"] .technician-shell :is(.tech-table, .tech-client-table, .tech-dashboard-jobs-table) th {
  color: #315b4b !important;
  background: linear-gradient(180deg, #f0f7f2, #e8f2eb) !important;
  border-color: #d7e6dc !important;
}
html[data-leressae-theme="light"] #page-admin :is(.admin-table, .admin-report-table, .admin-tech-management-table) td,
html[data-leressae-theme="light"] .technician-shell :is(.tech-table, .tech-client-table, .tech-dashboard-jobs-table) td {
  color: #405d53 !important;
  background: rgba(255,255,255,.97) !important;
  border-color: #e1ece5 !important;
}
html[data-leressae-theme="light"] #page-admin :is(.admin-table, .admin-report-table, .admin-tech-management-table) tbody tr:hover td,
html[data-leressae-theme="light"] .technician-shell :is(.tech-table, .tech-client-table, .tech-dashboard-jobs-table) tbody tr:hover td { background: #f1f8f3 !important; }

/* Brand actions are teal; logout is a routine action, not a destructive alert. */
html[data-leressae-theme="light"] #page-admin :is(.btn-primary, .admin-primary-btn, .admin-sidebar-logout, .admin-logout-btn),
html[data-leressae-theme="light"] .technician-shell :is(.tech-btn:not(.secondary):not(.danger):not(.danger-delete-news), .tech-dashboard-action, .technician-logout) {
  color: #fff !important;
  background: linear-gradient(140deg, #0b917d 0%, #087565 55%, #07594f 100%) !important;
  border-color: rgba(5, 100, 83, .35) !important;
  box-shadow: 0 7px 18px rgba(8, 112, 91, .2), inset 0 1px 0 rgba(255,255,255,.2) !important;
}
html[data-leressae-theme="light"] #page-admin :is(.btn-primary, .admin-primary-btn, .admin-sidebar-logout, .admin-logout-btn):hover,
html[data-leressae-theme="light"] .technician-shell :is(.tech-btn:not(.secondary):not(.danger):not(.danger-delete-news), .tech-dashboard-action, .technician-logout):hover {
  background: linear-gradient(140deg, #087d6d 0%, #066454 100%) !important;
  box-shadow: 0 10px 22px rgba(8, 112, 91, .27), inset 0 1px 0 rgba(255,255,255,.22) !important;
}
html[data-leressae-theme="light"] #page-admin :is(.btn-secondary, .admin-header-row .btn-secondary),
html[data-leressae-theme="light"] .technician-shell .tech-btn.secondary {
  color: #286153 !important;
  background: linear-gradient(145deg, #fff, #f0f7f3) !important;
  border-color: #cfe1d6 !important;
  box-shadow: 0 4px 12px rgba(16, 67, 57, .065), inset 0 1px 0 #fff !important;
}
html[data-leressae-theme="light"] #page-admin .admin-user-chip,
html[data-leressae-theme="light"] .technician-shell .tech-status-badge.done {
  color: #17694e !important;
  background: #e8f6ee !important;
  border-color: #c8e7d3 !important;
}
html[data-leressae-theme="light"] #page-admin .admin-sync-badge.ok {
  color: #17694e !important; background: #e8f6ee !important; border-color: #c8e7d3 !important;
}
html[data-leressae-theme="light"] #page-admin .admin-nav-notification {
  background: linear-gradient(135deg, #36a875, #087f70) !important;
  box-shadow: 0 0 0 2px rgba(16, 67, 57, .1), 0 3px 8px rgba(8, 127, 112, .2) !important;
}
html[data-leressae-theme="light"] .technician-shell .tech-status-badge.progress,
html[data-leressae-theme="light"] .technician-shell .tech-status-choice.progress-choice.active {
  color: #926000 !important; background: #fff5df !important; border-color: #f0d59a !important;
}

/* Shared graph palette: green volume, amber in-progress, green completed. */
html[data-leressae-theme="light"] #page-admin :is(.chart-box, .admin-report-chart-card) {
  border-color: #d5e5dc !important;
  background: linear-gradient(145deg, #fff, #f7fbf8) !important;
}
html[data-leressae-theme="light"] #page-admin :is(.histogram-bar, .item-fill, .chart-box .mini-bars > span, .admin-report-volume-bar i, .admin-report-tech-meter i, .admin-report-item-meter i, .admin-report-meter i:not(.is-progress):not(.is-new):not(.is-other)) {
  background: linear-gradient(180deg, #64b58d 0%, #087f70 100%) !important;
  box-shadow: 0 4px 10px rgba(8, 127, 112, .18) !important;
}
html[data-leressae-theme="light"] #page-admin .admin-report-meter i.is-progress { background: linear-gradient(90deg, #d99c2b, #f0c15f) !important; }
html[data-leressae-theme="light"] #page-admin .admin-report-meter i.is-done { background: linear-gradient(90deg, #19936a, #65c590) !important; }
html[data-leressae-theme="light"] #page-admin .admin-report-meter i.is-new { background: linear-gradient(90deg, #087f70, #49a98a) !important; }
html[data-leressae-theme="light"] #page-admin .admin-report-meter i.is-other { background: linear-gradient(90deg, #6c9c89, #a0c4b1) !important; }
html[data-leressae-theme="light"] #page-admin .admin-report-volume-card { border-top-color: #087f70 !important; }
html[data-leressae-theme="light"] #page-admin .admin-report-status-card { border-top-color: #2e9b68 !important; }
html[data-leressae-theme="light"] #page-admin .admin-report-technician-card { border-top-color: #4e9c79 !important; }
html[data-leressae-theme="light"] #page-admin .admin-report-item-card { border-top-color: #d49a2a !important; }
html[data-leressae-theme="light"] #page-admin .admin-report-export-button { box-shadow: 0 8px 20px rgba(8, 112, 91, .2) !important; }
html[data-leressae-theme="light"] #page-admin .admin-report-export-button:focus-visible { outline-color: rgba(8, 127, 112, .4) !important; }
html[data-leressae-theme="light"] #page-admin :is(.line-chart-line, .line-chart-point) { stroke: #087f70 !important; }
html[data-leressae-theme="light"] #page-admin .line-chart-point { fill: #087f70 !important; }
html[data-leressae-theme="light"] #page-admin .line-chart-area { fill: rgba(8, 127, 112, .13) !important; }
html[data-leressae-theme="light"] #page-admin :is(.line-chart-grid, .histogram-axis) { stroke: #d6e6dc !important; border-color: #d6e6dc !important; }
html[data-leressae-theme="light"] #page-admin .line-chart-axis,
html[data-leressae-theme="light"] .technician-shell :is(.tech-chart-axis, .tech-chart-value) { fill: #58756a !important; color: #58756a !important; }
html[data-leressae-theme="light"] .technician-shell .tech-chart-grid i { border-top-color: #d8e8de !important; }
html[data-leressae-theme="light"] .technician-shell .tech-chart-bar {
  background: linear-gradient(180deg, #62c4a0 0%, #087f70 100%) !important;
  box-shadow: inset 0 1px 1px rgba(255,255,255,.55), 0 4px 10px rgba(8,127,112,.2) !important;
}
html[data-leressae-theme="light"] .technician-shell .tech-status-track { background: #e5eee9 !important; }
html[data-leressae-theme="light"] .technician-shell .tech-status-row.is-progress .tech-status-track i { background: linear-gradient(90deg, #dda22b, #f0c15f) !important; }
html[data-leressae-theme="light"] .technician-shell .tech-status-row.is-done .tech-status-track i { background: linear-gradient(90deg, #19936a, #65c590) !important; }
html[data-leressae-theme="light"] .technician-shell .tech-stat-icon { color: #087f70 !important; background: #e9f5f0 !important; }
html[data-leressae-theme="light"] .technician-shell .tech-stat.is-progress .tech-stat-icon,
html[data-leressae-theme="light"] .technician-shell .tech-status-row.is-progress .tech-status-icon { color: #b47713 !important; background: #fff4df !important; }
html[data-leressae-theme="light"] .technician-shell .tech-stat.is-done .tech-stat-icon,
html[data-leressae-theme="light"] .technician-shell .tech-status-row.is-done .tech-status-icon { color: #178f62 !important; background: #e7f6ed !important; }

/* Recolor older blue utility links/media controls without changing their actions. */
html[data-leressae-theme="light"] .technician-shell :is(.tech-map-link, .tech-media-btn, .tech-media-button, .tech-media-direct-link) {
  color: #087f70 !important;
  border-color: #c9e2d7 !important;
  background: linear-gradient(145deg, #f4faf6, #eaf5ef) !important;
  box-shadow: 0 3px 10px rgba(16, 67, 57, .08) !important;
}
html[data-leressae-theme="light"] .technician-shell :is(.tech-map-link, .tech-media-btn, .tech-media-button, .tech-media-direct-link):hover {
  color: #fff !important; border-color: #087f70 !important; background: linear-gradient(140deg, #0b917d, #075e55) !important;
}
html[data-leressae-theme="light"] :is(.admin-customer-profile-dialog, .stock-modal .stock-panel, .tech-modal-backdrop .tech-modal, .tech-customer-media-dialog) {
  color: #24453e !important; border-color: #d1e3d8 !important;
  background: linear-gradient(145deg, #fff, #f4faf6) !important;
  box-shadow: 0 22px 60px rgba(16, 67, 57, .18), inset 0 1px 0 #fff !important;
}
html[data-leressae-theme="light"] :is(.admin-customer-profile-dialog, .stock-modal .stock-panel, .tech-modal-backdrop .tech-modal, .tech-customer-media-dialog) :is(h2, h3, h4, strong) { color: #173b35 !important; }
html[data-leressae-theme="light"] :is(.admin-customer-profile-dialog, .stock-modal .stock-panel, .tech-modal-backdrop .tech-modal, .tech-customer-media-dialog) :is(p, small, label, .admin-customer-muted, .tech-customer-media-subtitle) { color: #607872 !important; }
html[data-leressae-theme="light"] .admin-customer-profile-dialog :is(.admin-customer-history-heading > div strong, .admin-customer-map-link),
html[data-leressae-theme="light"] .tech-customer-media-dialog .tech-media-dialog-icon { color: #087f70 !important; }
html[data-leressae-theme="light"] .tech-modal-backdrop .tech-modal .tech-btn:not(.secondary):not(.danger) { color: #fff !important; background: linear-gradient(140deg, #0b917d, #075e55) !important; border-color: #087565 !important; }
html[data-leressae-theme="light"] :is(.login-modal .login-panel, .admin-login-gate) { color: #24453e !important; border-color: #d1e3d8 !important; background: linear-gradient(145deg, #fff, #f4faf6) !important; box-shadow: 0 22px 60px rgba(16,67,57,.18), inset 0 1px 0 #fff !important; }
html[data-leressae-theme="light"] :is(.login-modal .login-panel, .admin-login-gate) .login-btn-primary { color: #fff !important; background: linear-gradient(140deg, #0b917d, #075e55) !important; }
html[data-leressae-theme="light"] :is(.login-modal .login-panel, .admin-login-gate) :is(input, select, textarea) { color: #24453e !important; background: #fff !important; border-color: #cddfd5 !important; }
html[data-leressae-theme="light"] :is(.stock-modal .stock-panel-header, .login-modal .login-panel-header, .admin-login-gate .login-panel-header, .tech-modal-header, .media-modal-header) {
  color: #fff !important; background: linear-gradient(140deg, #0b917d, #075e55) !important; border-color: rgba(8, 112, 91, .24) !important;
}
html[data-leressae-theme="light"] :is(.stock-modal .stock-panel-header, .login-modal .login-panel-header, .admin-login-gate .login-panel-header, .tech-modal-header, .media-modal-header) :is(h3, p, .media-modal-title) { color: #fff !important; }
html[data-leressae-theme="light"] .stock-modal .stock-close,
html[data-leressae-theme="light"] .media-modal-close,
html[data-leressae-theme="light"] .tech-modal-close { color: #fff !important; background: rgba(255,255,255,.16) !important; }
html[data-leressae-theme="light"] :is(.stock-modal, .tech-modal-backdrop .tech-modal, .login-modal, .media-admin-form.media-modal-active) :is(input, select, textarea) {
  color: #24453e !important; background: rgba(255,255,255,.98) !important; border-color: #cddfd5 !important;
}
html[data-leressae-theme="light"] :is(.stock-modal, .tech-modal-backdrop .tech-modal, .login-modal, .media-admin-form.media-modal-active) :is(input, select, textarea):focus {
  outline: none !important; border-color: #41a28c !important; box-shadow: 0 0 0 3px rgba(8,127,112,.15) !important;
}
html[data-leressae-theme="light"] .stock-modal :is(.btn-primary, .admin-primary-btn, .save-status-btn:not(.danger-delete-news)),
html[data-leressae-theme="light"] #page-admin .settings-primary-btn {
  color: #fff !important; border-color: #087565 !important; background: linear-gradient(140deg, #0b917d, #075e55) !important; box-shadow: 0 7px 18px rgba(8,112,91,.18) !important;
}
html[data-leressae-theme="light"] #page-admin .settings-copy-btn { color: #286153 !important; background: linear-gradient(145deg,#fff,#edf7f1) !important; border-color: #cfe1d6 !important; }
html[data-leressae-theme="light"] #page-admin .settings-card-icon { color: #087f70 !important; background: linear-gradient(145deg,#eff9f3,#dff0e6) !important; }
html[data-leressae-theme="light"] .tech-modal-backdrop .tech-modal :is(.tech-map-link, .tech-media-btn, .tech-media-button, .tech-media-direct-link) {
  color: #087f70 !important; border-color: #c9e2d7 !important; background: linear-gradient(145deg,#f4faf6,#eaf5ef) !important; box-shadow: 0 3px 10px rgba(16,67,57,.08) !important;
}
html[data-leressae-theme="light"] .tech-modal-backdrop .tech-modal :is(.tech-map-link, .tech-media-btn, .tech-media-button, .tech-media-direct-link):hover { color: #fff !important; border-color: #087f70 !important; background: linear-gradient(140deg,#0b917d,#075e55) !important; }
html[data-leressae-theme="light"] .stock-modal .stock-body .field-row label { color: #286153 !important; border-color: rgba(8,127,112,.25) !important; }
html[data-leressae-theme="light"] .tech-customer-media-dialog [data-tech-media-close] { color: #286153 !important; background: #eaf5ef !important; }
html[data-leressae-theme="light"] .tech-customer-media-dialog .tech-media-direct-link { color: #fff !important; background: linear-gradient(140deg,#0b917d,#075e55) !important; }
html[data-leressae-theme="light"] #page-admin :is(.admin-chart-filter-select, .stock-source-tab):focus-visible { outline-color: rgba(8,127,112,.4) !important; border-color: #49a98a !important; box-shadow: 0 0 0 3px rgba(8,127,112,.12) !important; }
html[data-leressae-theme="light"] :is(#page-admin, .technician-shell) :is(button, a, input, select, textarea):focus-visible {
  outline: 3px solid rgba(8, 127, 112, .4) !important; outline-offset: 3px !important;
}

/* Dark mode keeps the same brand hue with deeper glass surfaces and clear text. */
html[data-leressae-theme="dark"] #page-admin :is(.admin-content, .admin-shell),
html[data-leressae-theme="dark"] .technician-shell :is(.technician-content, .technician-main) {
  background: linear-gradient(150deg, #0d1916, #10201b 58%, #0c1715) !important; color: var(--ops-ink) !important;
}
html[data-leressae-theme="dark"] #page-admin :is(.admin-topbar, .admin-card, .admin-stat-card, .admin-stat-mini, .admin-info-card, .admin-report-chart-card, .admin-report-details, .admin-filter-card, .admin-panel, .settings-card, .settings-panel, .stock-panel, .stock-source-panel, .stock-body),
html[data-leressae-theme="dark"] .technician-shell :is(.tech-welcome, .tech-stat, .tech-section, .tech-card, .tech-profile-grid > div, .tech-stock-pill, .tech-status-summary > div) {
  color: var(--ops-ink) !important;
  background: radial-gradient(ellipse at 100% 0%, rgba(44, 131, 100, .12), transparent 40%), linear-gradient(145deg, #14251f, #12201c 72%) !important;
  border-color: var(--ops-border) !important;
  box-shadow: var(--ops-shadow), inset 0 1px 0 rgba(255,255,255,.045) !important;
}
html[data-leressae-theme="dark"] #page-admin :is(h1, h2, h3, h4, .admin-stat-value, .admin-stat-mini .value, .admin-card-header h3, .admin-report-chart-heading h4, .admin-report-details-heading h4),
html[data-leressae-theme="dark"] .technician-shell :is(h1, h2, h3, h4, .tech-stat .value, .tech-welcome h3, .tech-status-count strong) { color: #e8f5ee !important; -webkit-text-fill-color: #e8f5ee !important; }
html[data-leressae-theme="dark"] #page-admin :is(p, small, .admin-breadcrumb, .admin-stat-label, .admin-stat-mini .label, .admin-report-chart-heading span, .admin-report-details-heading span),
html[data-leressae-theme="dark"] .technician-shell :is(p, small, .tech-eyebrow, .tech-stat .label, .tech-chart-col small, .tech-status-count small) { color: #a8c2b7 !important; }
html[data-leressae-theme="dark"] #page-admin :is(input, select, textarea),
html[data-leressae-theme="dark"] .technician-shell :is(input, select, textarea) { color: #e2f1e9 !important; background: #10211b !important; border-color: #3b5b4f !important; }
html[data-leressae-theme="dark"] #page-admin :is(.admin-table, .admin-report-table, .admin-tech-management-table) th,
html[data-leressae-theme="dark"] .technician-shell :is(.tech-table, .tech-client-table, .tech-dashboard-jobs-table) th { color: #d8eee1 !important; background: #1a3328 !important; border-color: #355444 !important; }
html[data-leressae-theme="dark"] #page-admin :is(.admin-table, .admin-report-table, .admin-tech-management-table) td,
html[data-leressae-theme="dark"] .technician-shell :is(.tech-table, .tech-client-table, .tech-dashboard-jobs-table) td { color: #d1e4d9 !important; background: #14231e !important; border-color: #2c4438 !important; }
html[data-leressae-theme="dark"] #page-admin :is(.admin-table, .admin-report-table, .admin-tech-management-table) tbody tr:hover td,
html[data-leressae-theme="dark"] .technician-shell :is(.tech-table, .tech-client-table, .tech-dashboard-jobs-table) tbody tr:hover td { background: #1a3027 !important; }
html[data-leressae-theme="dark"] #page-admin :is(.btn-primary, .admin-primary-btn, .admin-sidebar-logout, .admin-logout-btn),
html[data-leressae-theme="dark"] .technician-shell :is(.tech-btn:not(.secondary):not(.danger):not(.danger-delete-news), .tech-dashboard-action, .technician-logout) {
  color: #fff !important; background: linear-gradient(140deg, #168c75, #086453 65%, #064e46) !important; border-color: #287b65 !important;
  box-shadow: 0 7px 20px rgba(0, 0, 0, .22), inset 0 1px 0 rgba(255,255,255,.13) !important;
}
html[data-leressae-theme="dark"] #page-admin :is(.btn-secondary, .admin-header-row .btn-secondary),
html[data-leressae-theme="dark"] .technician-shell .tech-btn.secondary { color: #cce9da !important; background: linear-gradient(145deg, #1b3429, #15271f) !important; border-color: #3a5a49 !important; }
html[data-leressae-theme="dark"] #page-admin .admin-nav-notification { background: linear-gradient(135deg, #32a878, #087f70) !important; }
html[data-leressae-theme="dark"] #page-admin :is(.chart-box, .admin-report-chart-card) { border-color: #315448 !important; background: linear-gradient(145deg, #14251f, #11201b) !important; }
html[data-leressae-theme="dark"] #page-admin :is(.histogram-bar, .item-fill, .chart-box .mini-bars > span, .admin-report-volume-bar i, .admin-report-tech-meter i, .admin-report-item-meter i, .admin-report-meter i:not(.is-progress):not(.is-new):not(.is-other)),
html[data-leressae-theme="dark"] .technician-shell .tech-chart-bar { background: linear-gradient(180deg, #69c69f, #087f70) !important; }
html[data-leressae-theme="dark"] #page-admin .admin-report-meter i.is-progress,
html[data-leressae-theme="dark"] .technician-shell .tech-status-row.is-progress .tech-status-track i { background: linear-gradient(90deg, #dca12f, #f0c15f) !important; }
html[data-leressae-theme="dark"] #page-admin .admin-report-meter i.is-done,
html[data-leressae-theme="dark"] .technician-shell .tech-status-row.is-done .tech-status-track i { background: linear-gradient(90deg, #19936a, #65c590) !important; }
html[data-leressae-theme="dark"] #page-admin .admin-report-meter i.is-new { background: linear-gradient(90deg, #168c75, #54b798) !important; }
html[data-leressae-theme="dark"] #page-admin .admin-report-meter i.is-other { background: linear-gradient(90deg, #578a77, #83b7a0) !important; }
html[data-leressae-theme="dark"] #page-admin .admin-report-volume-card { border-top-color: #42b59a !important; }
html[data-leressae-theme="dark"] #page-admin .admin-report-status-card { border-top-color: #58ba80 !important; }
html[data-leressae-theme="dark"] #page-admin .admin-report-technician-card { border-top-color: #64a883 !important; }
html[data-leressae-theme="dark"] #page-admin .admin-report-item-card { border-top-color: #c99b43 !important; }
html[data-leressae-theme="dark"] #page-admin .admin-report-export-button { box-shadow: 0 8px 20px rgba(0,0,0,.24) !important; }
html[data-leressae-theme="dark"] #page-admin .admin-report-export-button:focus-visible { outline-color: rgba(105, 198, 159, .58) !important; }
html[data-leressae-theme="dark"] #page-admin :is(.line-chart-line, .line-chart-point) { stroke: #69c69f !important; }
html[data-leressae-theme="dark"] #page-admin .line-chart-point { fill: #69c69f !important; }
html[data-leressae-theme="dark"] #page-admin .line-chart-area { fill: rgba(105, 198, 159, .16) !important; }
html[data-leressae-theme="dark"] #page-admin .line-chart-axis,
html[data-leressae-theme="dark"] .technician-shell :is(.tech-chart-axis, .tech-chart-value) { fill: #a8c8b8 !important; color: #a8c8b8 !important; }
html[data-leressae-theme="dark"] #page-admin .line-chart-grid,
html[data-leressae-theme="dark"] .technician-shell .tech-chart-grid i { stroke: #345348 !important; border-top-color: #345348 !important; }
html[data-leressae-theme="dark"] .technician-shell .tech-stat-icon { color: #8ddbb9 !important; background: #19382d !important; }
html[data-leressae-theme="dark"] .technician-shell :is(.tech-stat.is-progress .tech-stat-icon, .tech-status-row.is-progress .tech-status-icon) { color: #f2c66d !important; background: #3a301e !important; }
html[data-leressae-theme="dark"] .technician-shell :is(.tech-stat.is-done .tech-stat-icon, .tech-status-row.is-done .tech-status-icon) { color: #75d5a4 !important; background: #17372b !important; }
html[data-leressae-theme="dark"] .technician-shell :is(.tech-map-link, .tech-media-btn, .tech-media-button, .tech-media-direct-link) { color: #8ddbb9 !important; border-color: #396958 !important; background: #18352b !important; }
html[data-leressae-theme="dark"] .technician-shell :is(.tech-map-link, .tech-media-btn, .tech-media-button, .tech-media-direct-link):hover { color: #fff !important; background: linear-gradient(140deg, #168c75, #075e55) !important; }
html[data-leressae-theme="dark"] :is(.admin-customer-profile-dialog, .stock-modal .stock-panel, .tech-modal-backdrop .tech-modal, .tech-customer-media-dialog) { color: #d8eee1 !important; border-color: #315448 !important; background: linear-gradient(145deg, #14251f, #11201b) !important; }
html[data-leressae-theme="dark"] :is(.admin-customer-profile-dialog, .stock-modal .stock-panel, .tech-modal-backdrop .tech-modal, .tech-customer-media-dialog) :is(h2, h3, h4, strong) { color: #e8f5ee !important; }
html[data-leressae-theme="dark"] :is(.admin-customer-profile-dialog, .stock-modal .stock-panel, .tech-modal-backdrop .tech-modal, .tech-customer-media-dialog) :is(p, small, label, .admin-customer-muted, .tech-customer-media-subtitle) { color: #a8c2b7 !important; }
html[data-leressae-theme="dark"] .admin-customer-profile-dialog :is(.admin-customer-history-heading > div strong, .admin-customer-map-link),
html[data-leressae-theme="dark"] .tech-customer-media-dialog .tech-media-dialog-icon { color: #8ddbb9 !important; }
html[data-leressae-theme="dark"] .tech-modal-backdrop .tech-modal .tech-btn:not(.secondary):not(.danger) { color: #fff !important; background: linear-gradient(140deg, #168c75, #075e55) !important; border-color: #287b65 !important; }
html[data-leressae-theme="dark"] :is(.login-modal .login-panel, .admin-login-gate) { color: #d8eee1 !important; border-color: #315448 !important; background: linear-gradient(145deg, #14251f, #11201b) !important; }
html[data-leressae-theme="dark"] :is(.login-modal .login-panel, .admin-login-gate) .login-btn-primary { color: #fff !important; background: linear-gradient(140deg, #168c75, #075e55) !important; }
html[data-leressae-theme="dark"] :is(.login-modal .login-panel, .admin-login-gate) :is(input, select, textarea) { color: #e2f1e9 !important; background: #10211b !important; border-color: #3b5b4f !important; }
html[data-leressae-theme="dark"] :is(.stock-modal .stock-panel-header, .login-modal .login-panel-header, .admin-login-gate .login-panel-header, .tech-modal-header, .media-modal-header) {
  color: #fff !important; background: linear-gradient(140deg, #168c75, #075e55) !important; border-color: #287b65 !important;
}
html[data-leressae-theme="dark"] :is(.stock-modal .stock-panel-header, .login-modal .login-panel-header, .admin-login-gate .login-panel-header, .tech-modal-header, .media-modal-header) :is(h3, p, .media-modal-title) { color: #fff !important; }
html[data-leressae-theme="dark"] .stock-modal .stock-close,
html[data-leressae-theme="dark"] .media-modal-close,
html[data-leressae-theme="dark"] .tech-modal-close { color: #f2fff8 !important; background: rgba(255,255,255,.12) !important; }
html[data-leressae-theme="dark"] :is(.stock-modal, .tech-modal-backdrop .tech-modal, .login-modal, .media-admin-form.media-modal-active) :is(input, select, textarea) {
  color: #e2f1e9 !important; background: #10211b !important; border-color: #3b5b4f !important;
}
html[data-leressae-theme="dark"] :is(.stock-modal, .tech-modal-backdrop .tech-modal, .login-modal, .media-admin-form.media-modal-active) :is(input, select, textarea):focus {
  outline: none !important; border-color: #70c6a1 !important; box-shadow: 0 0 0 3px rgba(105,198,159,.2) !important;
}
html[data-leressae-theme="dark"] .stock-modal :is(.btn-primary, .admin-primary-btn, .save-status-btn:not(.danger-delete-news)),
html[data-leressae-theme="dark"] #page-admin .settings-primary-btn {
  color: #fff !important; border-color: #287b65 !important; background: linear-gradient(140deg,#168c75,#075e55) !important; box-shadow: 0 7px 18px rgba(0,0,0,.22) !important;
}
html[data-leressae-theme="dark"] #page-admin .settings-copy-btn { color: #cce9da !important; background: linear-gradient(145deg,#1b3429,#15271f) !important; border-color: #3a5a49 !important; }
html[data-leressae-theme="dark"] #page-admin .settings-card-icon { color: #8ddbb9 !important; background: linear-gradient(145deg,#1b3a2e,#173126) !important; }
html[data-leressae-theme="dark"] .tech-modal-backdrop .tech-modal :is(.tech-map-link, .tech-media-btn, .tech-media-button, .tech-media-direct-link) { color: #8ddbb9 !important; border-color: #396958 !important; background: #18352b !important; }
html[data-leressae-theme="dark"] .tech-modal-backdrop .tech-modal :is(.tech-map-link, .tech-media-btn, .tech-media-button, .tech-media-direct-link):hover { color: #fff !important; background: linear-gradient(140deg,#168c75,#075e55) !important; }
html[data-leressae-theme="dark"] .stock-modal .stock-body .field-row label { color: #cce9da !important; border-color: rgba(129,204,176,.25) !important; }
html[data-leressae-theme="dark"] .tech-customer-media-dialog [data-tech-media-close] { color: #cce9da !important; background: #18352b !important; }
html[data-leressae-theme="dark"] .tech-customer-media-dialog .tech-media-direct-link { color: #fff !important; background: linear-gradient(140deg,#168c75,#075e55) !important; }
html[data-leressae-theme="dark"] #page-admin :is(.admin-chart-filter-select, .stock-source-tab):focus-visible { outline-color: rgba(105,198,159,.58) !important; border-color: #70c6a1 !important; box-shadow: 0 0 0 3px rgba(105,198,159,.2) !important; }
html[data-leressae-theme="dark"] :is(#page-admin, .technician-shell) :is(button, a, input, select, textarea):focus-visible { outline: 3px solid rgba(105, 198, 159, .58) !important; outline-offset: 3px !important; }

/* The chart-only widgets may be hosted outside the card shell; keep their rails on-brand. */
html[data-leressae-theme="light"] #page-admin :is(.admin-report-meter, .admin-report-volume-bar, .tech-status-track) { background-color: #e5eee9 !important; }
html[data-leressae-theme="dark"] #page-admin :is(.admin-report-meter, .admin-report-volume-bar, .tech-status-track) { background-color: #253b32 !important; }
@media (prefers-reduced-motion: reduce) {
  #page-admin *, .technician-shell * { animation-duration: .01ms !important; transition-duration: .01ms !important; }
}

/* ===== Final interaction polish: consistent actions, compact table controls ===== */
html[data-leressae-theme="light"],
html[data-theme="light"] {
  --ler-action-primary: linear-gradient(140deg, #087f70 0%, #075e55 100%);
  --ler-action-primary-hover: linear-gradient(140deg, #076e61 0%, #064d45 100%);
  --ler-action-shadow: 0 7px 18px rgba(8, 112, 91, .18), inset 0 1px 0 rgba(255,255,255,.18);
  --ler-action-focus: rgba(8, 127, 112, .38);
  --ler-action-secondary-bg: linear-gradient(145deg, #fff 0%, #f0f7f3 100%);
  --ler-action-secondary-text: #286153;
  --ler-action-secondary-border: #cfe1d6;
}

html[data-leressae-theme="dark"],
html[data-theme="dark"] {
  --ler-action-primary: linear-gradient(140deg, #0b7e6b 0%, #07594f 100%);
  --ler-action-primary-hover: linear-gradient(140deg, #0a705f 0%, #064b43 100%);
  --ler-action-shadow: 0 7px 20px rgba(0, 0, 0, .22), inset 0 1px 0 rgba(255,255,255,.12);
  --ler-action-focus: rgba(105, 198, 159, .56);
  --ler-action-secondary-bg: linear-gradient(145deg, #1b3429 0%, #15271f 100%);
  --ler-action-secondary-text: #cce9da;
  --ler-action-secondary-border: #3a5a49;
}

:is(.btn-primary, .admin-primary-btn, .admin-sidebar-logout, .admin-logout-btn,
    .login-btn-primary, .navbar .btn-login, .status-form button,
    .dashboard-status-lookup-form button, .admin-report-export-button,
    .tech-dashboard-action, .technician-logout),
.technician-shell .tech-btn:not(.secondary):not(.danger):not(.danger-delete-news),
.tech-modal-backdrop .tech-btn:not(.secondary):not(.danger):not(.danger-delete-news) {
  border-radius: 12px;
  font-weight: 750;
  transition: background-color .18s ease, border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}

:is(.btn-primary, .admin-primary-btn, .admin-sidebar-logout, .admin-logout-btn,
    .login-btn-primary, .navbar .btn-login, .status-form button,
    .dashboard-status-lookup-form button, .admin-report-export-button,
    .tech-dashboard-action, .technician-logout),
.technician-shell .tech-btn:not(.secondary):not(.danger):not(.danger-delete-news),
.tech-modal-backdrop .tech-btn:not(.secondary):not(.danger):not(.danger-delete-news) {
  background: var(--ler-action-primary) !important;
  border-color: #087565 !important;
  box-shadow: var(--ler-action-shadow) !important;
}

:is(.btn-primary, .admin-primary-btn, .admin-sidebar-logout, .admin-logout-btn,
    .login-btn-primary, .navbar .btn-login, .status-form button,
    .dashboard-status-lookup-form button, .admin-report-export-button,
    .tech-dashboard-action, .technician-logout),
.technician-shell .tech-btn:not(.secondary):not(.danger):not(.danger-delete-news),
.tech-modal-backdrop .tech-btn:not(.secondary):not(.danger):not(.danger-delete-news) {
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
}

:is(.btn-primary, .admin-primary-btn, .admin-sidebar-logout, .admin-logout-btn,
    .login-btn-primary, .navbar .btn-login, .status-form button,
    .dashboard-status-lookup-form button, .admin-report-export-button,
    .tech-dashboard-action, .technician-logout):hover,
.technician-shell .tech-btn:not(.secondary):not(.danger):not(.danger-delete-news):hover,
.tech-modal-backdrop .tech-btn:not(.secondary):not(.danger):not(.danger-delete-news):hover {
  background: var(--ler-action-primary-hover) !important;
  transform: translateY(-1px);
}

:is(.btn-secondary, .login-btn-secondary),
.technician-shell .tech-btn.secondary,
.tech-modal-backdrop .tech-btn.secondary {
  min-height: 40px;
  border-radius: 11px;
  color: var(--ler-action-secondary-text) !important;
  background: var(--ler-action-secondary-bg) !important;
  border-color: var(--ler-action-secondary-border) !important;
  box-shadow: 0 4px 12px rgba(16, 67, 57, .06), inset 0 1px 0 rgba(255,255,255,.8);
}

:is(.btn-primary, .btn-secondary, .admin-primary-btn, .save-status-btn,
    .btn-login, .login-btn-primary, .login-btn-secondary, .tech-btn,
    .admin-table button, .tech-table button):focus-visible,
:is(.btn-primary, .btn-secondary, .login-btn-primary, .login-btn-secondary,
    .tech-btn, .admin-table a, .tech-table a):focus-visible {
  outline: 3px solid var(--ler-action-focus) !important;
  outline-offset: 2px !important;
}

:is(button, .btn-primary, .btn-secondary, .admin-primary-btn, .save-status-btn,
    .tech-btn, .login-btn-primary, .login-btn-secondary):disabled,
:is(button, .btn-primary, .btn-secondary, .admin-primary-btn, .save-status-btn,
    .tech-btn, .login-btn-primary, .login-btn-secondary)[aria-disabled="true"] {
  cursor: not-allowed !important;
  box-shadow: none !important;
  transform: none !important;
  opacity: .62;
}

/* Destructive actions remain clearly distinct from routine green actions. */
:is(button, .save-status-btn)[data-media-action="delete"],
.admin-news-page .danger-delete-news,
.news-editor-actions .danger-delete-news {
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  border-color: #9f261d !important;
  background: linear-gradient(140deg, #b42318 0%, #8f1d17 100%) !important;
  box-shadow: 0 5px 14px rgba(159, 38, 29, .18) !important;
}

/* Keep action groups compact and centered so the action column does not sprawl. */
#page-admin .admin-table:has(tbody td:last-child button) th:last-child,
#page-admin .admin-report-table:has(tbody td:last-child button) th:last-child,
.technician-shell .tech-table:has(tbody td:last-child button) th:last-child,
.technician-shell .tech-client-table:has(tbody td:last-child button) th:last-child {
  text-align: center !important;
}

#page-admin .admin-table td:last-child:has(button),
#page-admin .admin-report-table td:last-child:has(button),
.technician-shell .tech-table td:last-child:has(button),
.technician-shell .tech-client-table td:last-child:has(button) {
  padding-inline: 8px !important;
  text-align: center !important;
  vertical-align: middle !important;
}

#page-admin .admin-table td:last-child :is(.admin-action-stack, .admin-tech-actions),
#page-admin .admin-tech-management-table td:last-child .admin-tech-actions,
.technician-shell .tech-table td:last-child :is(.tech-action-row, .tech-readonly-action) {
  display: flex !important;
  flex-flow: row wrap !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  width: 100% !important;
  min-width: 0 !important;
  margin: 0 auto !important;
}

#page-admin .admin-table td:last-child :is(.admin-action-stack, .admin-tech-actions) > :is(button, a),
#page-admin .admin-tech-management-table td:last-child .admin-tech-actions > button,
.technician-shell .tech-table td:last-child :is(.tech-action-row, .tech-readonly-action) > :is(button, a) {
  flex: 0 1 auto !important;
  width: auto !important;
  min-width: 76px !important;
  max-width: 100% !important;
  min-height: 38px !important;
  margin: 0 !important;
  padding: 8px 11px !important;
  line-height: 1.2 !important;
  white-space: nowrap !important;
}

#page-admin .admin-tech-management-table td:last-child .admin-tech-actions > button {
  flex: 1 1 76px !important;
  max-width: 112px !important;
}

#page-admin :is(.admin-table-wrap, .admin-tech-management-wrap),
.technician-shell :is(.tech-table-wrap, .tech-client-table-wrap) {
  max-width: 100%;
  min-width: 0;
  overflow-x: auto;
  overscroll-behavior-inline: contain;
  -webkit-overflow-scrolling: touch;
}

:is(.stock-actions, .login-actions, .news-editor-actions, .tech-action-row,
    .admin-header-row, .admin-card-header) {
  align-items: center;
  gap: 8px;
}

@media (max-width: 640px) {
  :is(.stock-actions, .login-actions, .news-editor-actions) {
    justify-content: stretch;
    flex-wrap: wrap;
  }
  :is(.stock-actions, .login-actions, .news-editor-actions) > button {
    flex: 1 1 120px;
    min-height: 42px;
  }
  #page-admin .admin-table td:last-child :is(.admin-action-stack, .admin-tech-actions) > :is(button, a),
  #page-admin .admin-tech-management-table td:last-child .admin-tech-actions > button,
  .technician-shell .tech-table td:last-child :is(.tech-action-row, .tech-readonly-action) > :is(button, a) {
    min-height: 40px !important;
  }
}

/* FINAL MOBILE FOOTER + PUBLIC DASHBOARD DARK-MODE CONTRAST FIXES */
@media (max-width: 768px) {
  /* Mobile footer is stacked vertically; never require horizontal swiping. */
  .site-footer {
    overflow: visible !important;
    box-sizing: border-box !important;
    padding: 24px 18px 28px !important;
  }
  .site-footer .site-footer-grid {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    grid-auto-flow: row !important;
    align-items: start !important;
    justify-content: stretch !important;
    gap: 22px !important;
    width: 100% !important;
    max-width: 100% !important;
    overflow: visible !important;
    white-space: normal !important;
    padding: 0 !important;
    scroll-snap-type: none !important;
  }
  .site-footer .site-footer-grid > div,
  .site-footer .site-footer-grid > .site-footer-brand {
    display: block !important;
    flex: initial !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    scroll-snap-align: none !important;
    overflow-wrap: anywhere !important;
  }
  .site-footer .site-footer-bottom {
    display: block !important;
    box-sizing: border-box !important;
    width: 100% !important;
    max-width: 100% !important;
    white-space: normal !important;
    overflow: visible !important;
    text-overflow: clip !important;
    text-align: center !important;
    overflow-wrap: anywhere !important;
    font-size: clamp(9px, 2.7vw, 11px) !important;
    line-height: 1.5 !important;
    padding: 12px 0 0 !important;
    margin-top: 20px !important;
  }
}

/* Use a single, high-contrast palette for public dashboard cards in dark mode.
   Explicitly override legacy [data-theme] and body.dark-mode rules as well. */
html[data-leressae-theme="dark"] #page-dashboard .dashboard-section,
html[data-theme="dark"] #page-dashboard .dashboard-section,
body.dark-mode #page-dashboard .dashboard-section {
  color: #eaf5ef !important;
  background: #14251f !important;
  border-color: #355448 !important;
}
html[data-leressae-theme="dark"] #page-dashboard :is(.section-title-text, .service-item-title, .tutorial-card h3),
html[data-theme="dark"] #page-dashboard :is(.section-title-text, .service-item-title, .tutorial-card h3),
body.dark-mode #page-dashboard :is(.section-title-text, .service-item-title, .tutorial-card h3) {
  color: #f0faf4 !important;
  -webkit-text-fill-color: #f0faf4 !important;
  opacity: 1 !important;
}
html[data-leressae-theme="dark"] #page-dashboard :is(.section-sub-text, .service-item-desc, .tutorial-card p, .tutorial-meta),
html[data-theme="dark"] #page-dashboard :is(.section-sub-text, .service-item-desc, .tutorial-card p, .tutorial-meta),
body.dark-mode #page-dashboard :is(.section-sub-text, .service-item-desc, .tutorial-card p, .tutorial-meta) {
  color: #c4d9ce !important;
  -webkit-text-fill-color: #c4d9ce !important;
  opacity: 1 !important;
}
html[data-leressae-theme="dark"] #page-dashboard :is(.service-item-card, .tutorial-card),
html[data-theme="dark"] #page-dashboard :is(.service-item-card, .tutorial-card),
body.dark-mode #page-dashboard :is(.service-item-card, .tutorial-card) {
  color: #eaf5ef !important;
  background: #1a3028 !important;
  border: 1px solid #3a5c4d !important;
  box-shadow: 0 8px 22px rgba(0,0,0,.22) !important;
}
html[data-leressae-theme="dark"] #page-dashboard .tutorial-tag,
html[data-theme="dark"] #page-dashboard .tutorial-tag,
body.dark-mode #page-dashboard .tutorial-tag {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  background: #145b49 !important;
  border: 1px solid #367c65 !important;
}
html[data-leressae-theme="dark"] #page-dashboard .tutorial-meta,
html[data-theme="dark"] #page-dashboard .tutorial-meta,
body.dark-mode #page-dashboard .tutorial-meta {
  border-top-color: #456658 !important;
}
html[data-leressae-theme="dark"] #page-dashboard .service-item-icon,
html[data-theme="dark"] #page-dashboard .service-item-icon,
body.dark-mode #page-dashboard .service-item-icon {
  color: #d9f7e8 !important;
  background: #174a3a !important;
  border-color: #39745d !important;
}
html[data-leressae-theme="dark"] #page-dashboard .tutorial-card:hover,
html[data-theme="dark"] #page-dashboard .tutorial-card:hover,
body.dark-mode #page-dashboard .tutorial-card:hover {
  background: #203b31 !important;
  border-color: #5b9b7d !important;
}


/* LERES SAE — cohesive soft-3D theme audit (October 2026)
   High-specificity public dashboard overrides prevent legacy theme rules from
   leaving pale text on light cards in dark mode. */
html[data-leressae-theme="dark"] body #page-dashboard .dashboard-section {
  color: #e8f4ee !important;
  background: linear-gradient(145deg, #111e19 0%, #0d1814 100%) !important;
  border: 1px solid #2a4739 !important;
  box-shadow: 0 16px 34px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.025) !important;
}
html[data-leressae-theme="dark"] body #page-dashboard .section-header :is(.section-title-text, .section-sub-text),
html[data-leressae-theme="dark"] body #page-dashboard .service-item-card :is(.service-item-title, .service-item-desc),
html[data-leressae-theme="dark"] body #page-dashboard .tutorial-card :is(h3, p, .tutorial-meta) {
  opacity: 1 !important;
  text-shadow: none !important;
}
html[data-leressae-theme="dark"] body #page-dashboard .section-title-text {
  color: #f4fbf7 !important;
  -webkit-text-fill-color: #f4fbf7 !important;
}
html[data-leressae-theme="dark"] body #page-dashboard .section-sub-text {
  color: #bdd4c8 !important;
  -webkit-text-fill-color: #bdd4c8 !important;
}
html[data-leressae-theme="dark"] body #page-dashboard .service-item-card,
html[data-leressae-theme="dark"] body #page-dashboard .tutorial-card {
  color: #e8f4ee !important;
  background: linear-gradient(145deg, #172b22 0%, #112119 100%) !important;
  border: 1px solid #2f5140 !important;
  box-shadow: 0 10px 22px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.025) !important;
}
html[data-leressae-theme="dark"] body #page-dashboard .service-item-title,
html[data-leressae-theme="dark"] body #page-dashboard .tutorial-card h3 {
  color: #f1faf5 !important;
  -webkit-text-fill-color: #f1faf5 !important;
}
html[data-leressae-theme="dark"] body #page-dashboard .service-item-desc,
html[data-leressae-theme="dark"] body #page-dashboard .tutorial-card p {
  color: #c4dacf !important;
  -webkit-text-fill-color: #c4dacf !important;
}
html[data-leressae-theme="dark"] body #page-dashboard .tutorial-meta {
  color: #8fe0bd !important;
  -webkit-text-fill-color: #8fe0bd !important;
  border-top-color: #456a59 !important;
}
html[data-leressae-theme="dark"] body #page-dashboard .tutorial-tag {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  background: linear-gradient(145deg, #176c54, #10513f) !important;
  border: 1px solid #438a6d !important;
  box-shadow: 0 3px 8px rgba(0,0,0,.18) !important;
}
html[data-leressae-theme="dark"] body #page-dashboard .service-item-icon {
  color: #d9f7e8 !important;
  background: linear-gradient(145deg, #214c3b, #17382b) !important;
  border: 1px solid #47745d !important;
  box-shadow: 0 5px 12px rgba(0,0,0,.18), inset 0 1px 0 rgba(255,255,255,.07) !important;
}
html[data-leressae-theme="dark"] body #page-dashboard .tutorial-card:hover,
html[data-leressae-theme="dark"] body #page-dashboard .service-item-card:hover {
  background: linear-gradient(145deg, #284737, #1a3529) !important;
  border-color: #6bb38d !important;
  box-shadow: 0 14px 28px rgba(0,0,0,.3), inset 0 1px 0 rgba(255,255,255,.07) !important;
}
/* Secondary hero action must match the primary action's text clarity. */
html[data-leressae-theme="dark"] body #page-dashboard .hero-actions .btn-secondary {
  color: #f3fbf7 !important;
  -webkit-text-fill-color: #f3fbf7 !important;
  background: linear-gradient(145deg, #1d3b30, #142c23) !important;
  border: 1px solid #4d8068 !important;
  text-shadow: none !important;
  box-shadow: 0 8px 18px rgba(0,0,0,.2), inset 0 1px 0 rgba(255,255,255,.07) !important;
}
html[data-leressae-theme="dark"] body #page-dashboard .hero-actions .btn-secondary:hover,
html[data-leressae-theme="dark"] body #page-dashboard .hero-actions .btn-secondary:focus-visible {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  background: linear-gradient(145deg, #28664d, #1a4d3a) !important;
  border-color: #82c9a4 !important;
  outline: 3px solid rgba(130,201,164,.28) !important;
  outline-offset: 2px !important;
}
html[data-leressae-theme="light"] body #page-dashboard .hero-actions .btn-secondary {
  color: #123c32 !important;
  -webkit-text-fill-color: #123c32 !important;
  background: linear-gradient(145deg, #ffffff, #eaf5ef) !important;
  border-color: #b8d5c5 !important;
  text-shadow: none !important;
  box-shadow: 0 8px 18px rgba(18,60,50,.10), inset 0 1px 0 #fff !important;
}
@media (max-width: 768px) {
  .site-footer .site-footer-grid { grid-template-columns: minmax(0, 1fr) !important; }
  .site-footer .site-footer-bottom { white-space: normal !important; overflow-wrap: anywhere !important; }
  #page-dashboard .dashboard-section { padding: 22px 18px !important; }
  #page-dashboard .services-dashboard-grid { grid-template-columns: minmax(0, 1fr) !important; }
  #page-dashboard .tutorial-scroll { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; overflow: visible !important; gap: 12px !important; }
  #page-dashboard .tutorial-card { min-width: 0 !important; max-width: none !important; width: 100% !important; box-sizing: border-box !important; }
}
html[data-leressae-theme="dark"] body #page-dashboard .hero-actions .btn-secondary,
html[data-leressae-theme="light"] body #page-dashboard .hero-actions .btn-secondary {
  -webkit-text-stroke: 0 transparent !important;
  text-decoration: none !important;
  filter: none !important;
}

/* FINAL OVERRIDE — public pages unified soft-3D dark palette (v2)
   This block intentionally covers every public page, including generated news/media cards,
   rather than only the dashboard section. */
html[data-leressae-theme="dark"] body :is(#page-dashboard, #page-media, #page-media-penanganan, #page-pendaftaran, #page-kontak, #page-status).page-view {
  color: #eaf4ef !important;
}
html[data-leressae-theme="dark"] body #page-dashboard .dashboard-section,
html[data-leressae-theme="dark"] body #page-media.card-container,
html[data-leressae-theme="dark"] body #page-media-penanganan.card-container,
html[data-leressae-theme="dark"] body #page-pendaftaran.card-container,
html[data-leressae-theme="dark"] body #page-kontak.card-container,
html[data-leressae-theme="dark"] body #page-status.card-container {
  color: #eaf4ef !important;
  background: linear-gradient(145deg, #192d26 0%, #12231d 100%) !important;
  border: 1px solid #345748 !important;
  box-shadow: 0 14px 30px rgba(0,0,0,.24), inset 0 1px 0 rgba(255,255,255,.045) !important;
}
html[data-leressae-theme="dark"] body :is(#page-dashboard, #page-media, #page-media-penanganan, #page-pendaftaran, #page-kontak, #page-status) :is(.page-header-title, .section-title-text, .section-header h2, .section-title, h1, h2) {
  color: #f4faf7 !important;
  -webkit-text-fill-color: #f4faf7 !important;
  opacity: 1 !important;
  text-shadow: none !important;
}
html[data-leressae-theme="dark"] body :is(#page-dashboard, #page-media, #page-media-penanganan, #page-pendaftaran, #page-kontak, #page-status) :is(.page-header-desc, .section-sub-text, .section-header p, .page-description) {
  color: #c6d9cf !important;
  -webkit-text-fill-color: #c6d9cf !important;
  opacity: 1 !important;
}
html[data-leressae-theme="dark"] body #page-dashboard :is(.service-item-card, .tutorial-card, #homeNewsList .news-card),
html[data-leressae-theme="dark"] body #page-media-penanganan .tutorial-card,
html[data-leressae-theme="dark"] body #page-media .media-item,
html[data-leressae-theme="dark"] body #page-media .media-card,
html[data-leressae-theme="dark"] body #page-media .gallery-item,
html[data-leressae-theme="dark"] body #page-info #publicNewsList .news-card {
  color: #eaf4ef !important;
  background: linear-gradient(145deg, #203a30 0%, #172c24 100%) !important;
  border: 1px solid #3d6251 !important;
  box-shadow: 0 10px 24px rgba(0,0,0,.23), inset 0 1px 0 rgba(255,255,255,.055) !important;
}
html[data-leressae-theme="dark"] body :is(#page-dashboard, #page-media, #page-media-penanganan, #page-info) :is(.tutorial-card h3, .news-card h3, .home-news-card h3, .media-item h3, .media-card h3, .gallery-item h3, .service-item-title) {
  color: #f3faf6 !important;
  -webkit-text-fill-color: #f3faf6 !important;
  opacity: 1 !important;
}
html[data-leressae-theme="dark"] body :is(#page-dashboard, #page-media, #page-media-penanganan, #page-info) :is(.tutorial-card p, .news-card p, .home-news-card p, .home-news-date, .media-item p, .media-card p, .gallery-item p, .service-item-desc) {
  color: #c9dbd1 !important;
  -webkit-text-fill-color: #c9dbd1 !important;
  opacity: 1 !important;
}
html[data-leressae-theme="dark"] body :is(#page-dashboard, #page-media, #page-media-penanganan, #page-info) :is(.tutorial-meta, .tutorial-meta span, .news-card .news-read-more, .home-news-category) {
  color: #a7ebcb !important;
  -webkit-text-fill-color: #a7ebcb !important;
  border-color: #426b58 !important;
}
html[data-leressae-theme="dark"] body :is(#page-dashboard, #page-media, #page-media-penanganan, #page-info) .tutorial-tag {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  background: linear-gradient(145deg, #176b53, #10513f) !important;
  border: 1px solid #43886c !important;
}
html[data-leressae-theme="dark"] body #homeNewsList .home-news-card {
  color: #eaf4ef !important;
  background: linear-gradient(145deg, #203a30 0%, #14271f 100%) !important;
  border: 1px solid #3d6251 !important;
  box-shadow: 0 12px 26px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.05) !important;
}
html[data-leressae-theme="dark"] body #homeNewsList .home-news-content :is(h3, p, time) {
  opacity: 1 !important;
  text-shadow: none !important;
}
html[data-leressae-theme="dark"] body #homeNewsList .home-news-content h3 { color: #f3faf6 !important; -webkit-text-fill-color: #f3faf6 !important; }
html[data-leressae-theme="dark"] body #homeNewsList .home-news-content :is(p, time) { color: #c9dbd1 !important; -webkit-text-fill-color: #c9dbd1 !important; }
html[data-leressae-theme="dark"] body #page-dashboard .hero-actions .btn-secondary {
  color: #f6fbf8 !important;
  -webkit-text-fill-color: #f6fbf8 !important;
  background: linear-gradient(145deg, #214838, #173629) !important;
  border: 1px solid #5a8d72 !important;
  text-shadow: none !important;
  -webkit-text-stroke: 0 transparent !important;
  box-shadow: 0 8px 18px rgba(0,0,0,.22), inset 0 1px 0 rgba(255,255,255,.08) !important;
}
html[data-leressae-theme="dark"] body #page-dashboard .hero-actions .btn-secondary:hover,
html[data-leressae-theme="dark"] body #page-dashboard .hero-actions .btn-secondary:focus-visible {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  background: linear-gradient(145deg, #2d7455, #20543e) !important;
  border-color: #9bd7b5 !important;
}
html[data-leressae-theme="dark"] body #page-dashboard :is(.tutorial-card, .service-item-card):hover,
html[data-leressae-theme="dark"] body #page-media-penanganan .tutorial-card:hover,
html[data-leressae-theme="dark"] body #page-info #publicNewsList .news-card:hover {
  background: linear-gradient(145deg, #294b3b, #1b3529) !important;
  border-color: #78b596 !important;
  box-shadow: 0 15px 30px rgba(0,0,0,.3), inset 0 1px 0 rgba(255,255,255,.07) !important;
}
/* Defensive cleanup: dashboard-only status form was retired; keep the dedicated status page intact. */

html[data-leressae-theme="dark"] body #page-media .media-item figcaption :is(.title, .desc),
html[data-leressae-theme="dark"] body #page-media .media-item :is(.title, .desc) {
  color: #d0e0d7 !important;
  -webkit-text-fill-color: #d0e0d7 !important;
  opacity: 1 !important;
}
html[data-leressae-theme="dark"] body #page-media .media-item .title {
  color: #f3faf6 !important;
  -webkit-text-fill-color: #f3faf6 !important;
  font-weight: 750 !important;
}
html[data-leressae-theme="dark"] body #page-media .media-item {
  background: linear-gradient(145deg, #203a30, #172c24) !important;
  border-color: #3d6251 !important;
  box-shadow: 0 10px 24px rgba(0,0,0,.22), inset 0 1px 0 rgba(255,255,255,.05) !important;
}
html[data-leressae-theme="dark"] body #page-media .media-item figcaption {
  background: transparent !important;
}

/* PROFESSIONAL DARK THEME AUDIT — consistent public-page surface hierarchy */
:root {
  --public-dark-bg: #0b1713;
  --public-dark-panel: #12231c;
  --public-dark-card: #192f25;
  --public-dark-card-raised: #203b2e;
  --public-dark-border: #355a47;
  --public-dark-text: #f3f8f5;
  --public-dark-muted: #c4d7cc;
  --public-dark-accent: #9be0bc;
  --public-dark-accent-strong: #167b5d;
}

html[data-leressae-theme="dark"] body #page-dashboard .dashboard-section {
  color: var(--public-dark-text) !important;
  background: linear-gradient(145deg, #14271f 0%, #0f1e18 100%) !important;
  border: 1px solid var(--public-dark-border) !important;
  box-shadow: 0 18px 38px rgba(0, 0, 0, .22), inset 0 1px 0 rgba(255,255,255,.045) !important;
}
html[data-leressae-theme="dark"] body #page-dashboard .section-header :is(h2, p),
html[data-leressae-theme="dark"] body #page-dashboard :is(.section-title-text, .section-sub-text) {
  opacity: 1 !important;
  text-shadow: none !important;
}
html[data-leressae-theme="dark"] body #page-dashboard .section-title-text {
  color: var(--public-dark-text) !important;
  -webkit-text-fill-color: var(--public-dark-text) !important;
}
html[data-leressae-theme="dark"] body #page-dashboard .section-sub-text {
  color: var(--public-dark-muted) !important;
  -webkit-text-fill-color: var(--public-dark-muted) !important;
}
html[data-leressae-theme="dark"] body #page-dashboard .hero-actions .btn-secondary {
  color: #f4faf6 !important;
  -webkit-text-fill-color: #f4faf6 !important;
  background: linear-gradient(145deg, #203e30 0%, #173126 100%) !important;
  border: 1px solid #5d9275 !important;
  text-shadow: none !important;
  -webkit-text-stroke: 0 !important;
  box-shadow: 0 7px 0 #0d2118, 0 12px 22px rgba(0,0,0,.25), inset 0 1px 0 rgba(255,255,255,.12) !important;
}
html[data-leressae-theme="dark"] body #page-dashboard .hero-actions .btn-secondary:hover,
html[data-leressae-theme="dark"] body #page-dashboard .hero-actions .btn-secondary:focus-visible {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  background: linear-gradient(145deg, #2b6549 0%, #20523b 100%) !important;
  border-color: #a3e1bd !important;
  transform: translateY(-1px);
}
html[data-leressae-theme="dark"] body #page-dashboard :is(.service-item-card, .tutorial-card),
html[data-leressae-theme="dark"] body #page-dashboard #homeNewsList .home-news-card,
html[data-leressae-theme="dark"] body #page-dashboard #publicNewsList .news-card {
  color: var(--public-dark-text) !important;
  background: linear-gradient(145deg, #203b2e 0%, #172b22 100%) !important;
  border: 1px solid #3e6751 !important;
  box-shadow: 0 9px 22px rgba(0,0,0,.22), inset 0 1px 0 rgba(255,255,255,.065) !important;
}
html[data-leressae-theme="dark"] body #page-dashboard :is(.service-item-title, .tutorial-card h3, .news-card h3, .home-news-content h3) {
  color: #f5faf7 !important;
  -webkit-text-fill-color: #f5faf7 !important;
  opacity: 1 !important;
}
html[data-leressae-theme="dark"] body #page-dashboard :is(.service-item-desc, .tutorial-card p, .news-card p, .home-news-content p, .home-news-date) {
  color: #c9dbd0 !important;
  -webkit-text-fill-color: #c9dbd0 !important;
  opacity: 1 !important;
}
html[data-leressae-theme="dark"] body #page-dashboard :is(.tutorial-meta, .tutorial-meta span, .news-read-more) {
  color: #a9e8c7 !important;
  -webkit-text-fill-color: #a9e8c7 !important;
}
html[data-leressae-theme="dark"] body :is(#page-media, #page-media-penanganan, #page-pendaftaran, #page-kontak, #page-status) {
  color: var(--public-dark-text) !important;
  background: linear-gradient(145deg, #14271f 0%, #0f1e18 100%) !important;
  border-color: var(--public-dark-border) !important;
  box-shadow: 0 18px 38px rgba(0,0,0,.22), inset 0 1px 0 rgba(255,255,255,.045) !important;
}
html[data-leressae-theme="dark"] body #page-media .media-section,
html[data-leressae-theme="dark"] body #page-media .media-grid,
html[data-leressae-theme="dark"] body #page-kontak .contact-grid {
  color: var(--public-dark-text) !important;
  background: transparent !important;
}
html[data-leressae-theme="dark"] body #page-media .media-grid > .media-item,
html[data-leressae-theme="dark"] body #page-media .media-item,
html[data-leressae-theme="dark"] body #page-kontak .contact-card,
html[data-leressae-theme="dark"] body #page-media-penanganan .tutorial-card,
html[data-leressae-theme="dark"] body #page-info .news-card,
html[data-leressae-theme="dark"] body #publicNewsList .news-card {
  color: var(--public-dark-text) !important;
  background: linear-gradient(145deg, #203b2e 0%, #172b22 100%) !important;
  border: 1px solid #3e6751 !important;
  box-shadow: 0 9px 22px rgba(0,0,0,.22), inset 0 1px 0 rgba(255,255,255,.06) !important;
}
html[data-leressae-theme="dark"] body #page-media .media-item figcaption,
html[data-leressae-theme="dark"] body #page-media .media-item .title,
html[data-leressae-theme="dark"] body #page-media .media-item .desc,
html[data-leressae-theme="dark"] body #page-kontak .contact-card :is(strong, h2, h3, p, a),
html[data-leressae-theme="dark"] body #publicNewsList .news-card :is(h3, p, a) {
  opacity: 1 !important;
  text-shadow: none !important;
}
html[data-leressae-theme="dark"] body #page-media .media-item .title,
html[data-leressae-theme="dark"] body #page-kontak .contact-card strong,
html[data-leressae-theme="dark"] body #publicNewsList .news-card h3 {
  color: #f5faf7 !important;
  -webkit-text-fill-color: #f5faf7 !important;
}
html[data-leressae-theme="dark"] body #page-media .media-item .desc,
html[data-leressae-theme="dark"] body #page-kontak .contact-card p,
html[data-leressae-theme="dark"] body #publicNewsList .news-card p {
  color: #c9dbd0 !important;
  -webkit-text-fill-color: #c9dbd0 !important;
}
html[data-leressae-theme="dark"] body #page-kontak .contact-card a,
html[data-leressae-theme="dark"] body #page-media .media-item a {
  color: #a9e8c7 !important;
  -webkit-text-fill-color: #a9e8c7 !important;
}
html[data-leressae-theme="dark"] body :is(#page-media, #page-media-penanganan, #page-pendaftaran, #page-kontak, #page-status) :is(input, select, textarea) {
  color: #f3f8f5 !important;
  background: #102019 !important;
  border-color: #456a55 !important;
}
html[data-leressae-theme="dark"] body :is(#page-media, #page-media-penanganan, #page-pendaftaran, #page-kontak, #page-status) :is(.btn-secondary, .btn-primary) {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  text-shadow: none !important;
  -webkit-text-stroke: 0 !important;
}
html[data-leressae-theme="dark"] body :is(#page-dashboard, #page-media, #page-media-penanganan, #page-pendaftaran, #page-kontak, #page-status) :is(a, button, input, select, textarea):focus-visible {
  outline: 3px solid #8ddbb4 !important;
  outline-offset: 3px !important;
}
html[data-leressae-theme="light"] body #page-dashboard .dashboard-section {
  background: linear-gradient(145deg, #ffffff 0%, #f3f8f5 100%);
}

/* FINAL ACCESSIBILITY PATCH — dark theme surface and text contrast
   Applied after legacy styles to prevent light panels with pale headings. */
html[data-leressae-theme="dark"] body.dark-mode #page-dashboard .dashboard-section,
html[data-theme="dark"] body.dark-mode #page-dashboard .dashboard-section,
body.dark-mode #page-dashboard .dashboard-section {
  color: #f2f7f4 !important;
  background: linear-gradient(145deg, #14221d 0%, #101b17 58%, #0d1814 100%) !important;
  border: 1px solid #2b4a3b !important;
  box-shadow: 0 16px 34px rgba(0,0,0,.26), inset 0 1px 0 rgba(255,255,255,.035) !important;
}
html[data-leressae-theme="dark"] body.dark-mode #page-dashboard .section-header,
html[data-theme="dark"] body.dark-mode #page-dashboard .section-header,
body.dark-mode #page-dashboard .section-header {
  background: transparent !important;
}
html[data-leressae-theme="dark"] body.dark-mode #page-dashboard .section-title-text,
html[data-theme="dark"] body.dark-mode #page-dashboard .section-title-text,
body.dark-mode #page-dashboard .section-title-text,
html[data-leressae-theme="dark"] body.dark-mode #page-dashboard .section-header h2,
html[data-theme="dark"] body.dark-mode #page-dashboard .section-header h2,
body.dark-mode #page-dashboard .section-header h2 {
  color: #f5faf7 !important;
  -webkit-text-fill-color: #f5faf7 !important;
  opacity: 1 !important;
  text-shadow: none !important;
}
html[data-leressae-theme="dark"] body.dark-mode #page-dashboard .section-sub-text,
html[data-theme="dark"] body.dark-mode #page-dashboard .section-sub-text,
body.dark-mode #page-dashboard .section-sub-text,
html[data-leressae-theme="dark"] body.dark-mode #page-dashboard .section-header p,
html[data-theme="dark"] body.dark-mode #page-dashboard .section-header p,
body.dark-mode #page-dashboard .section-header p {
  color: #c4d3cb !important;
  -webkit-text-fill-color: #c4d3cb !important;
  opacity: 1 !important;
  text-shadow: none !important;
}
/* Slightly deeper card greens: the cards should be distinct from panels, not neon. */
html[data-leressae-theme="dark"] body.dark-mode #page-dashboard .service-item-card,
html[data-theme="dark"] body.dark-mode #page-dashboard .service-item-card,
body.dark-mode #page-dashboard .service-item-card,
html[data-leressae-theme="dark"] body.dark-mode #page-dashboard .tutorial-card,
html[data-theme="dark"] body.dark-mode #page-dashboard .tutorial-card,
body.dark-mode #page-dashboard .tutorial-card,
html[data-leressae-theme="dark"] body.dark-mode #page-dashboard #homeNewsList .home-news-card,
html[data-theme="dark"] body.dark-mode #page-dashboard #homeNewsList .home-news-card,
body.dark-mode #page-dashboard #homeNewsList .home-news-card,
html[data-leressae-theme="dark"] body.dark-mode #page-dashboard #publicNewsList .news-card,
html[data-theme="dark"] body.dark-mode #page-dashboard #publicNewsList .news-card,
body.dark-mode #page-dashboard #publicNewsList .news-card {
  color: #edf5f0 !important;
  background: linear-gradient(145deg, #1a3027 0%, #14261f 58%, #11221b 100%) !important;
  border: 1px solid #315342 !important;
  box-shadow: 0 9px 20px rgba(0,0,0,.24), inset 0 1px 0 rgba(255,255,255,.035) !important;
}
html[data-leressae-theme="dark"] body.dark-mode #page-dashboard .tutorial-card h3,
html[data-theme="dark"] body.dark-mode #page-dashboard .tutorial-card h3,
body.dark-mode #page-dashboard .tutorial-card h3,
html[data-leressae-theme="dark"] body.dark-mode #page-dashboard .service-item-title,
html[data-theme="dark"] body.dark-mode #page-dashboard .service-item-title,
body.dark-mode #page-dashboard .service-item-title,
html[data-leressae-theme="dark"] body.dark-mode #page-dashboard #homeNewsList h3,
html[data-theme="dark"] body.dark-mode #page-dashboard #homeNewsList h3,
body.dark-mode #page-dashboard #homeNewsList h3 {
  color: #f4f8f5 !important;
  -webkit-text-fill-color: #f4f8f5 !important;
  opacity: 1 !important;
}
html[data-leressae-theme="dark"] body.dark-mode #page-dashboard .tutorial-card p,
html[data-theme="dark"] body.dark-mode #page-dashboard .tutorial-card p,
body.dark-mode #page-dashboard .tutorial-card p,
html[data-leressae-theme="dark"] body.dark-mode #page-dashboard .service-item-desc,
html[data-theme="dark"] body.dark-mode #page-dashboard .service-item-desc,
body.dark-mode #page-dashboard .service-item-desc,
html[data-leressae-theme="dark"] body.dark-mode #page-dashboard #homeNewsList p,
html[data-theme="dark"] body.dark-mode #page-dashboard #homeNewsList p,
body.dark-mode #page-dashboard #homeNewsList p {
  color: #c8d8cf !important;
  -webkit-text-fill-color: #c8d8cf !important;
  opacity: 1 !important;
}
html[data-leressae-theme="dark"] body.dark-mode #page-dashboard .tutorial-meta,
html[data-theme="dark"] body.dark-mode #page-dashboard .tutorial-meta,
body.dark-mode #page-dashboard .tutorial-meta {
  color: #a7d9bb !important;
  -webkit-text-fill-color: #a7d9bb !important;
  border-top-color: #345544 !important;
}
html[data-leressae-theme="dark"] body.dark-mode #page-dashboard .tutorial-tag,
html[data-theme="dark"] body.dark-mode #page-dashboard .tutorial-tag,
body.dark-mode #page-dashboard .tutorial-tag {
  color: #eaf5ee !important;
  -webkit-text-fill-color: #eaf5ee !important;
  background: #18392b !important;
  border: 1px solid #426c54 !important;
  box-shadow: 0 3px 8px rgba(0,0,0,.16) !important;
}
html[data-leressae-theme="dark"] body.dark-mode #page-dashboard .hero-actions .btn-secondary,
html[data-theme="dark"] body.dark-mode #page-dashboard .hero-actions .btn-secondary,
body.dark-mode #page-dashboard .hero-actions .btn-secondary {
  color: #f4f8f5 !important;
  -webkit-text-fill-color: #f4f8f5 !important;
  background: linear-gradient(145deg, #1a3328, #13271f) !important;
  border: 1px solid #41664f !important;
  text-shadow: none !important;
  -webkit-text-stroke: 0 transparent !important;
  box-shadow: 0 7px 0 #0a1711, 0 11px 20px rgba(0,0,0,.2), inset 0 1px 0 rgba(255,255,255,.06) !important;
}
html[data-leressae-theme="dark"] body.dark-mode #page-dashboard .hero-actions .btn-secondary:hover,
html[data-theme="dark"] body.dark-mode #page-dashboard .hero-actions .btn-secondary:hover,
body.dark-mode #page-dashboard .hero-actions .btn-secondary:hover,
html[data-leressae-theme="dark"] body.dark-mode #page-dashboard .hero-actions .btn-secondary:focus-visible,
html[data-theme="dark"] body.dark-mode #page-dashboard .hero-actions .btn-secondary:focus-visible,
body.dark-mode #page-dashboard .hero-actions .btn-secondary:focus-visible {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  background: linear-gradient(145deg, #244b38, #193828) !important;
  border-color: #79aa8a !important;
}
/* Selection highlight remains readable and does not mimic a broken text color. */
html[data-leressae-theme="dark"] body ::selection,
html[data-theme="dark"] body ::selection,
body.dark-mode ::selection {
  color: #ffffff !important;
  background: #286b53 !important;
  -webkit-text-fill-color: #ffffff !important;
}


/* Final selection contrast: force a deep teal highlight with white text in dark mode. */
html[data-leressae-theme="dark"] ::selection,
html[data-theme="dark"] ::selection,
body.dark-mode ::selection {
  color: #ffffff !important;
  background-color: #18513f !important;
  -webkit-text-fill-color: #ffffff !important;
  text-shadow: none !important;
}

/* ========================================================================
   LERESSAE THEME SYNCHRONIZATION AUDIT
   The theme controller writes both attributes to <html> and toggles
   body.dark-mode.  Keep all three selectors together so manual, restored,
   and system preferences render the same palette.
   ======================================================================== */
:root {
  color-scheme: light;
  --lr-page: #f4f7f5;
  --lr-surface: #ffffff;
  --lr-surface-raised: #f8fbf9;
  --lr-surface-hover: #edf4f0;
  --lr-text: #17231d;
  --lr-heading: #102018;
  --lr-muted: #52645a;
  --lr-faint: #6f8176;
  --lr-border: #c9d8cf;
  --lr-border-strong: #9bb5a5;
  --lr-accent: #176b4d;
  --lr-accent-hover: #10573e;
  --lr-accent-contrast: #ffffff;
  --lr-focus: #167a57;
  --lr-shadow: 0 10px 26px rgba(24, 51, 38, .10);
  --lr-success-bg: #dff4e7;
  --lr-success-text: #135d38;
  --lr-warning-bg: #fff0c9;
  --lr-warning-text: #765200;
  --lr-danger-bg: #fde2e2;
  --lr-danger-text: #9b2020;
  --lr-info-bg: #deedf8;
  --lr-info-text: #17567e;
}

html[data-leressae-theme="dark"],
html[data-theme="dark"] {
  color-scheme: dark;
  --lr-page: #0c1511;
  --lr-surface: #14211b;
  --lr-surface-raised: #192a22;
  --lr-surface-hover: #20362b;
  --lr-text: #e5f0e9;
  --lr-heading: #f5faf7;
  --lr-muted: #bfcec4;
  --lr-faint: #9fb3a7;
  --lr-border: #345244;
  --lr-border-strong: #577666;
  --lr-accent: #6cc89a;
  --lr-accent-hover: #9ce1b8;
  --lr-accent-contrast: #092116;
  --lr-focus: #9ce1b8;
  --lr-shadow: 0 14px 32px rgba(0, 0, 0, .30);
  --lr-success-bg: #173e29;
  --lr-success-text: #a9edc4;
  --lr-warning-bg: #4a3913;
  --lr-warning-text: #ffe29a;
  --lr-danger-bg: #4a2023;
  --lr-danger-text: #ffb8b8;
  --lr-info-bg: #17384c;
  --lr-info-text: #b9e5ff;
}

body.dark-mode {
  color-scheme: dark;
  --lr-page: #0c1511;
  --lr-surface: #14211b;
  --lr-surface-raised: #192a22;
  --lr-surface-hover: #20362b;
  --lr-text: #e5f0e9;
  --lr-heading: #f5faf7;
  --lr-muted: #bfcec4;
  --lr-faint: #9fb3a7;
  --lr-border: #345244;
  --lr-border-strong: #577666;
  --lr-accent: #6cc89a;
  --lr-accent-hover: #9ce1b8;
  --lr-accent-contrast: #092116;
  --lr-focus: #9ce1b8;
  --lr-shadow: 0 14px 32px rgba(0, 0, 0, .30);
  --lr-success-bg: #173e29;
  --lr-success-text: #a9edc4;
  --lr-warning-bg: #4a3913;
  --lr-warning-text: #ffe29a;
  --lr-danger-bg: #4a2023;
  --lr-danger-text: #ffb8b8;
  --lr-info-bg: #17384c;
  --lr-info-text: #b9e5ff;
}

html, body {
  background: var(--lr-page) !important;
  color: var(--lr-text) !important;
}

body :is(h1, h2, h3, h4, h5, h6, .title, .heading, .page-title, .section-title, .section-title-text,
  .card-title, .modal-title, .dialog-title, .admin-card-header h3, .settings-card-title) {
  color: var(--lr-heading) !important;
  -webkit-text-fill-color: currentColor;
  opacity: 1 !important;
  text-shadow: none !important;
}

body :is(p, small, .subtitle, .description, .section-sub-text, .muted, .text-muted, .helper-text,
  .form-text, .empty-state, .empty-state p, .no-data, .admin-info-label, .settings-card-subtitle,
  .tutorial-meta, .home-news-date, .home-news-counter) {
  color: var(--lr-muted) !important;
  -webkit-text-fill-color: currentColor;
  opacity: 1;
}

body :is(.card, .panel, .box, .column, .content-card, .admin-card, .tech-card, .tech-section,
  .settings-card, .admin-info-card, .chart-box, .dashboard-section, .service-item-card,
  .tutorial-card, .news-card, .home-news-card, .contact-card, .media-item, .table-responsive,
  .table-container, .admin-table-wrap, .tech-table-wrap, .modal-content, .modal-dialog,
  .dialog-content, .dropdown-content, .login-dropdown-content, .popover, .toast) {
  background: var(--lr-surface) !important;
  color: var(--lr-text) !important;
  border-color: var(--lr-border) !important;
  box-shadow: var(--lr-shadow);
}

body :is(.card, .panel, .box, .column, .content-card, .admin-card, .tech-card, .tech-section,
  .settings-card, .admin-info-card, .chart-box, .dashboard-section, .service-item-card,
  .tutorial-card, .news-card, .home-news-card, .contact-card, .media-item):hover {
  background: var(--lr-surface-hover) !important;
  border-color: var(--lr-border-strong) !important;
}

body :is(input, select, textarea, .settings-api-input, .form-control, .form-select) {
  color: var(--lr-text) !important;
  background-color: var(--lr-surface-raised) !important;
  border-color: var(--lr-border-strong) !important;
  caret-color: var(--lr-accent);
}
body :is(input, textarea)::placeholder { color: var(--lr-faint) !important; opacity: 1; }
body select option { color: var(--lr-text); background: var(--lr-surface); }

body :is(input, select, textarea, button, a, [role="button"], .btn):focus-visible {
  outline: 3px solid var(--lr-focus) !important;
  outline-offset: 3px;
  box-shadow: 0 0 0 5px color-mix(in srgb, var(--lr-focus) 24%, transparent) !important;
}

body :is(.btn-primary, .settings-primary-btn, .settings-copy-btn, .copy-api-btn, .btn-success,
  button[type="submit"], .submit-btn) {
  color: var(--lr-accent-contrast) !important;
  -webkit-text-fill-color: currentColor;
  background: var(--lr-accent) !important;
  border-color: var(--lr-accent) !important;
  text-shadow: none !important;
}
body :is(.btn-primary, .settings-primary-btn, .settings-copy-btn, .copy-api-btn, .btn-success,
  button[type="submit"], .submit-btn):is(:hover, :focus-visible) {
  background: var(--lr-accent-hover) !important;
  border-color: var(--lr-accent-hover) !important;
}
body :is(.btn-secondary, .btn-outline, .settings-test-btn, .nav-toggle, .close, .modal-close) {
  color: var(--lr-text) !important;
  -webkit-text-fill-color: currentColor;
  background: var(--lr-surface-raised) !important;
  border-color: var(--lr-border-strong) !important;
}
body :is(.btn-secondary, .btn-outline, .settings-test-btn, .nav-toggle, .close, .modal-close):is(:hover, :focus-visible) {
  background: var(--lr-surface-hover) !important;
  border-color: var(--lr-accent) !important;
}
body :is(button, .btn):disabled { opacity: .58 !important; cursor: not-allowed; }

body :is(table, .admin-table, .tech-table) { color: var(--lr-text) !important; background: var(--lr-surface) !important; }
body :is(th, .admin-table th, .tech-table th) { color: var(--lr-heading) !important; background: var(--lr-surface-raised) !important; border-color: var(--lr-border) !important; }
body :is(td, .admin-table td, .tech-table td) { color: var(--lr-text) !important; background: transparent !important; border-color: var(--lr-border) !important; }
body :is(tbody tr:hover, .admin-table tbody tr:hover, .tech-table tbody tr:hover) > :is(td, th) { background: var(--lr-surface-hover) !important; }

body :is(.dropdown-content, .login-dropdown-content, .dropdown-menu) :is(a, button, li) { color: var(--lr-text) !important; }
body :is(.dropdown-content, .login-dropdown-content, .dropdown-menu) :is(a, button, li):hover { background: var(--lr-surface-hover) !important; color: var(--lr-heading) !important; }
body :is(.modal, .modal-backdrop, .overlay) { color: var(--lr-text); }
body :is(.modal-content, .modal-dialog, .dialog-content) :is(header, .modal-header, .modal-footer, .dialog-header, .dialog-footer) { border-color: var(--lr-border) !important; }

body :is(.chart-box, .chart-container, .line-chart, canvas) { color: var(--lr-text); }
body :is(.line-chart-axis, .line-chart-grid, .chart-label, .chart-legend, .apexcharts-text, .chartjs-render-monitor) { color: var(--lr-muted) !important; stroke: var(--lr-border) !important; }

body :is(.badge, .status-badge, .status, .tag, .pill, .settings-google-state) { color: var(--lr-text) !important; background: var(--lr-surface-raised) !important; border-color: var(--lr-border-strong) !important; }
body :is(.success, .status-success, .badge-success, .settings-google-state.success) { color: var(--lr-success-text) !important; background: var(--lr-success-bg) !important; border-color: currentColor !important; }
body :is(.warning, .status-warning, .badge-warning, .settings-google-state.warning) { color: var(--lr-warning-text) !important; background: var(--lr-warning-bg) !important; border-color: currentColor !important; }
body :is(.danger, .error, .status-danger, .badge-danger, .settings-google-state.danger) { color: var(--lr-danger-text) !important; background: var(--lr-danger-bg) !important; border-color: currentColor !important; }
body :is(.info, .status-info, .badge-info) { color: var(--lr-info-text) !important; background: var(--lr-info-bg) !important; border-color: currentColor !important; }

html[data-leressae-theme="dark"] body ::selection,
html[data-theme="dark"] body ::selection,
body.dark-mode ::selection { color: #ffffff !important; background: #216348 !important; }

/* FINAL PUBLIC-SURFACE THEME PASS
   The public dashboard uses section-specific surfaces (.hero-section,
   .news-section and .tutorial-section) which must not inherit the light
   presentation gradients when the controller has selected dark mode. */
html[data-leressae-theme="dark"] body :is(.page-view, .hero-section, .dashboard-section,
  .news-section, .tutorial-section, .media-section, .contact-section, .status-section,
  .section-block, .content-section, .service-section, .home-section),
html[data-theme="dark"] body :is(.page-view, .hero-section, .dashboard-section,
  .news-section, .tutorial-section, .media-section, .contact-section, .status-section,
  .section-block, .content-section, .service-section, .home-section),
body.dark-mode :is(.page-view, .hero-section, .dashboard-section, .news-section,
  .tutorial-section, .media-section, .contact-section, .status-section, .section-block,
  .content-section, .service-section, .home-section) {
  color: #e5f0e9 !important;
  background: linear-gradient(145deg, #14221d 0%, #101b17 58%, #0d1814 100%) !important;
  border-color: #2f5141 !important;
  box-shadow: 0 16px 34px rgba(0,0,0,.26), inset 0 1px 0 rgba(255,255,255,.035) !important;
}
html[data-leressae-theme="dark"] body :is(.hero-section, .dashboard-section,
  .news-section, .tutorial-section, .media-section, .contact-section, .status-section,
  .section-block, .content-section) :is(h1, h2, h3, h4, .hero-title, .section-title,
  .section-title-text, .card-title, .page-title),
html[data-theme="dark"] body :is(.hero-section, .dashboard-section, .news-section,
  .tutorial-section, .media-section, .contact-section, .status-section, .section-block,
  .content-section) :is(h1, h2, h3, h4, .hero-title, .section-title, .section-title-text,
  .card-title, .page-title),
body.dark-mode :is(.hero-section, .dashboard-section, .news-section, .tutorial-section,
  .media-section, .contact-section, .status-section, .section-block, .content-section)
  :is(h1, h2, h3, h4, .hero-title, .section-title, .section-title-text, .card-title, .page-title) {
  color: #f5faf7 !important;
  -webkit-text-fill-color: #f5faf7 !important;
  opacity: 1 !important;
  text-shadow: none !important;
}
html[data-leressae-theme="dark"] body :is(.hero-section, .dashboard-section,
  .news-section, .tutorial-section, .media-section, .contact-section, .status-section,
  .section-block, .content-section) :is(p, small, .hero-desc, .section-sub-text, .description,
  .subtitle, .tutorial-meta),
html[data-theme="dark"] body :is(.hero-section, .dashboard-section, .news-section,
  .tutorial-section, .media-section, .contact-section, .status-section, .section-block,
  .content-section) :is(p, small, .hero-desc, .section-sub-text, .description, .subtitle,
  .tutorial-meta),
body.dark-mode :is(.hero-section, .dashboard-section, .news-section, .tutorial-section,
  .media-section, .contact-section, .status-section, .section-block, .content-section)
  :is(p, small, .hero-desc, .section-sub-text, .description, .subtitle, .tutorial-meta) {
  color: #c8d8cf !important;
  -webkit-text-fill-color: #c8d8cf !important;
  opacity: 1 !important;
}
html[data-leressae-theme="dark"] body :is(.hero-section, .dashboard-section,
  .news-section, .tutorial-section, .media-section, .contact-section, .status-section,
  .section-block, .content-section) :is(.card, .service-item-card, .tutorial-card,
  .news-card, .home-news-card, .media-item, .contact-card),
html[data-theme="dark"] body :is(.hero-section, .dashboard-section, .news-section,
  .tutorial-section, .media-section, .contact-section, .status-section, .section-block,
  .content-section) :is(.card, .service-item-card, .tutorial-card, .news-card,
  .home-news-card, .media-item, .contact-card),
body.dark-mode :is(.hero-section, .dashboard-section, .news-section, .tutorial-section,
  .media-section, .contact-section, .status-section, .section-block, .content-section)
  :is(.card, .service-item-card, .tutorial-card, .news-card, .home-news-card, .media-item,
  .contact-card) {
  background: linear-gradient(145deg, #1a3027 0%, #14261f 58%, #11221b 100%) !important;
  color: #edf5f0 !important;
  border-color: #315342 !important;
}
html[data-leressae-theme="light"] body :is(.hero-section, .dashboard-section,
  .news-section, .tutorial-section, .media-section, .contact-section, .status-section,
  .section-block, .content-section) {
  color: #17231d !important;
  background: linear-gradient(145deg, #ffffff 0%, #f3f8f5 100%) !important;
  border-color: #c9d8cf !important;
}
html[data-theme="light"] body :is(.hero-section, .dashboard-section, .news-section,
  .tutorial-section, .media-section, .contact-section, .status-section, .section-block,
  .content-section) {
  color: #17231d !important;
  background: linear-gradient(145deg, #ffffff 0%, #f3f8f5 100%) !important;
  border-color: #c9d8cf !important;
}

/* Catch legacy inline/light declarations that otherwise leave white islands
   behind headings when dark mode is active. */
html[data-leressae-theme="dark"] body :is([style*="#fff"], [style*="#FFF"],
  [style*="#ffffff"], [style*="#FFFFFF"], [style*="white"], [style*="rgb(255"],
  .hero-section, .dashboard-section, .news-section, .tutorial-section,
  .media-section, .contact-section, .status-section, .card-container) {
  background-color: #14221d !important;
}
html[data-theme="dark"] body :is([style*="#fff"], [style*="#FFF"], [style*="#ffffff"],
  [style*="#FFFFFF"], [style*="white"], [style*="rgb(255"], .hero-section,
  .dashboard-section, .news-section, .tutorial-section, .media-section,
  .contact-section, .status-section, .card-container) {
  background-color: #14221d !important;
}
body.dark-mode :is([style*="#fff"], [style*="#FFF"], [style*="#ffffff"],
  [style*="#FFFFFF"], [style*="white"], [style*="rgb(255"], .hero-section,
  .dashboard-section, .news-section, .tutorial-section, .media-section,
  .contact-section, .status-section, .card-container) {
  background-color: #14221d !important;
}
html[data-leressae-theme="dark"] body :is(.section-title-text, .media-spotlight-title,
  .page-header-title, .hero-title, .section-title, .card-title, .service-item-title,
  .tutorial-card h3, .news-card h3, .home-news-content h3, .home-media-caption h3,
  .home-media-caption strong) {
  color: #f5faf7 !important;
  -webkit-text-fill-color: #f5faf7 !important;
  opacity: 1 !important;
  text-shadow: none !important;
}
html[data-theme="dark"] body :is(.section-title-text, .media-spotlight-title,
  .page-header-title, .hero-title, .section-title, .card-title, .service-item-title,
  .tutorial-card h3, .news-card h3, .home-news-content h3, .home-media-caption h3,
  .home-media-caption strong),
body.dark-mode :is(.section-title-text, .media-spotlight-title, .page-header-title,
  .hero-title, .section-title, .card-title, .service-item-title, .tutorial-card h3,
  .news-card h3, .home-news-content h3, .home-media-caption h3, .home-media-caption strong) {
  color: #f5faf7 !important;
  -webkit-text-fill-color: #f5faf7 !important;
  opacity: 1 !important;
  text-shadow: none !important;
}

/* Responsive news carousel: keep cards readable at phone widths and prevent
   the legacy two-column rule from collapsing each card to a narrow sliver. */
@media (max-width: 640px) {
  #page-dashboard #homeNewsList {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
  }
  #page-dashboard #homeNewsList .home-news-carousel,
  #page-dashboard #homeNewsList .home-news-viewport {
    width: 100% !important;
    min-width: 0 !important;
  }
  #page-dashboard #homeNewsList .home-news-slide {
    flex: 0 0 calc(100% - 10px) !important;
    min-width: 0 !important;
  }
  #page-dashboard #homeNewsList .home-news-card {
    width: 100% !important;
    min-width: 0 !important;
  }
  #page-dashboard #homeNewsList .home-news-content h3,
  #page-dashboard #homeNewsList .home-news-content p {
    overflow: hidden !important;
    display: -webkit-box !important;
    -webkit-box-orient: vertical !important;
  }
  #page-dashboard #homeNewsList .home-news-content h3 { -webkit-line-clamp: 3 !important; }
  #page-dashboard #homeNewsList .home-news-content p { -webkit-line-clamp: 4 !important; }
}

html[data-leressae-theme="dark"] body #page-dashboard .dashboard-section,
html[data-theme="dark"] body #page-dashboard .dashboard-section,
body.dark-mode #page-dashboard .dashboard-section {
  background-image: linear-gradient(145deg, #14221d 0%, #101b17 58%, #0d1814 100%) !important;
  background-color: #14221d !important;
}

/* LIVE PROJECT DARK-MODE NORMALIZATION
   This block is intentionally last so it wins over older light gradients. */
html[data-leressae-theme="dark"] body #page-dashboard :is(.dashboard-section, .hero-section,
  .news-section, .tutorial-section, .section-block, .content-section),
html[data-theme="dark"] body #page-dashboard :is(.dashboard-section, .hero-section,
  .news-section, .tutorial-section, .section-block, .content-section),
body.dark-mode #page-dashboard :is(.dashboard-section, .hero-section, .news-section,
  .tutorial-section, .section-block, .content-section) {
  color: #edf6f0 !important;
  background: linear-gradient(145deg, #14221d 0%, #101b17 58%, #0d1814 100%) !important;
  background-image: linear-gradient(145deg, #14221d 0%, #101b17 58%, #0d1814 100%) !important;
  border-color: #315342 !important;
  box-shadow: 0 16px 34px rgba(0,0,0,.26), inset 0 1px 0 rgba(255,255,255,.035) !important;
}
html[data-leressae-theme="dark"] body #page-dashboard :is(.dashboard-section, .hero-section,
  .news-section, .tutorial-section, .section-block, .content-section) :is(h1,h2,h3,h4,h5,h6,
  p,span,strong,small,time,label,a,.section-title-text,.page-header-title,.hero-title,
  .hero-desc,.section-sub-text),
html[data-theme="dark"] body #page-dashboard :is(.dashboard-section, .hero-section,
  .news-section, .tutorial-section, .section-block, .content-section) :is(h1,h2,h3,h4,h5,h6,
  p,span,strong,small,time,label,a,.section-title-text,.page-header-title,.hero-title,
  .hero-desc,.section-sub-text),
body.dark-mode #page-dashboard :is(.dashboard-section, .hero-section, .news-section,
  .tutorial-section, .section-block, .content-section) :is(h1,h2,h3,h4,h5,h6,p,span,strong,
  small,time,label,a,.section-title-text,.page-header-title,.hero-title,.hero-desc,
  .section-sub-text) {
  color: #edf6f0 !important;
  -webkit-text-fill-color: #edf6f0 !important;
  opacity: 1 !important;
  text-shadow: none !important;
}
html[data-leressae-theme="dark"] body #page-dashboard :is(.home-news-card,.tutorial-card,
  .service-item-card),
html[data-theme="dark"] body #page-dashboard :is(.home-news-card,.tutorial-card,
  .service-item-card),
body.dark-mode #page-dashboard :is(.home-news-card,.tutorial-card,.service-item-card) {
  background: linear-gradient(145deg,#1a3027 0%,#14261f 58%,#11221b 100%) !important;
  color: #edf6f0 !important;
  border-color: #315342 !important;
}
html[data-leressae-theme="dark"] body #page-dashboard :is(input,select,textarea),
html[data-theme="dark"] body #page-dashboard :is(input,select,textarea),
body.dark-mode #page-dashboard :is(input,select,textarea) {
  color: #edf6f0 !important;
  background: #102019 !important;
  border-color: #456a55 !important;
}

@media (max-width: 640px) {
  #page-dashboard #homeNewsList { display: block !important; width: 100% !important; min-width: 0 !important; }
  #page-dashboard #homeNewsList .home-news-carousel,
  #page-dashboard #homeNewsList .home-news-viewport { width: 100% !important; min-width: 0 !important; }
  #page-dashboard #homeNewsList .home-news-slide { flex: 0 0 calc(100% - 10px) !important; min-width: 0 !important; }
  #page-dashboard #homeNewsList .home-news-card { width: 100% !important; min-width: 0 !important; }
}

/* Direct fallback selectors for browsers that skip complex selector lists. */
body.dark-mode .dashboard-section {
  background: #14221d !important;
  background-image: none !important;
  color: #edf6f0 !important;
  border-color: #315342 !important;
}
body.dark-mode .dashboard-section h1,
body.dark-mode .dashboard-section h2,
body.dark-mode .dashboard-section h3,
body.dark-mode .dashboard-section h4,
body.dark-mode .dashboard-section p,
body.dark-mode .dashboard-section span,
body.dark-mode .dashboard-section small,
body.dark-mode .dashboard-section time,
body.dark-mode .dashboard-section a {
  color: #edf6f0 !important;
  -webkit-text-fill-color: #edf6f0 !important;
  opacity: 1 !important;
  text-shadow: none !important;
}
html[data-leressae-theme="dark"] .dashboard-section,
html[data-theme="dark"] .dashboard-section {
  background: #14221d !important;
  background-image: none !important;
  color: #edf6f0 !important;
  border-color: #315342 !important;
}

/* Runtime-state fallback when a host restores the toggle before theme
   attributes/classes are painted. */
body:has(#leressaeThemeToggle[aria-pressed="true"]) .dashboard-section {
  background: #14221d !important;
  background-image: none !important;
  color: #edf6f0 !important;
  border-color: #315342 !important;
}
body:has(#leressaeThemeToggle[aria-pressed="true"]) .dashboard-section .section-header h2,
body:has(#leressaeThemeToggle[aria-pressed="true"]) .dashboard-section .section-title-text {
  color: #f5faf7 !important;
  -webkit-text-fill-color: #f5faf7 !important;
  opacity: 1 !important;
}
body:has(#leressaeThemeToggle[aria-pressed="true"]) .dashboard-section .section-header p,
body:has(#leressaeThemeToggle[aria-pressed="true"]) .dashboard-section .section-sub-text {
  color: #c8d8cf !important;
  -webkit-text-fill-color: #c8d8cf !important;
  opacity: 1 !important;
}

/* MEDIA + FOOTER CONTRAST PASS (both themes) */
html[data-leressae-theme="light"] body #homeMediaSpotlight,
html[data-theme="light"] body #homeMediaSpotlight,
body:not(.dark-mode) #homeMediaSpotlight {
  color: #17352b !important;
  background: linear-gradient(145deg,#ffffff 0%,#f1f7f3 100%) !important;
  border-color: #c7ded2 !important;
}
html[data-leressae-theme="light"] body #homeMediaSpotlight .home-media-caption,
html[data-theme="light"] body #homeMediaSpotlight .home-media-caption,
body:not(.dark-mode) #homeMediaSpotlight .home-media-caption {
  color: #ffffff !important;
  background: linear-gradient(180deg,transparent 0%,rgba(4,18,14,.22) 22%,rgba(4,18,14,.88) 100%) !important;
  text-shadow: 0 2px 5px rgba(0,0,0,.85) !important;
}
html[data-leressae-theme="light"] body #homeMediaSpotlight .home-media-caption :is(h3,h4,p,span,strong),
html[data-theme="light"] body #homeMediaSpotlight .home-media-caption :is(h3,h4,p,span,strong),
body:not(.dark-mode) #homeMediaSpotlight .home-media-caption :is(h3,h4,p,span,strong) {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  text-shadow: 0 2px 5px rgba(0,0,0,.85) !important;
}
html[data-leressae-theme="dark"] body #homeMediaSpotlight .home-media-caption,
html[data-theme="dark"] body #homeMediaSpotlight .home-media-caption,
body.dark-mode #homeMediaSpotlight .home-media-caption {
  color: #f5faf7 !important;
  text-shadow: 0 2px 5px rgba(0,0,0,.85) !important;
}
html[data-leressae-theme="dark"] body #homeMediaSpotlight .home-media-caption :is(h3,h4,p,span,strong),
html[data-theme="dark"] body #homeMediaSpotlight .home-media-caption :is(h3,h4,p,span,strong),
body.dark-mode #homeMediaSpotlight .home-media-caption :is(h3,h4,p,span,strong) {
  color: #f5faf7 !important;
  -webkit-text-fill-color: #f5faf7 !important;
}
.home-media-image-wrap.image-unavailable {
  background: linear-gradient(145deg,#203d31,#13251e) !important;
}
.home-media-image-wrap.image-unavailable::before {
  color: #eaf5ef !important;
  background: linear-gradient(145deg,#203d31,#13251e) !important;
  text-shadow: none !important;
}
html[data-leressae-theme="light"] body .site-footer,
html[data-theme="light"] body .site-footer,
body:not(.dark-mode) .site-footer,
html[data-leressae-theme="dark"] body .site-footer,
html[data-theme="dark"] body .site-footer,
body.dark-mode .site-footer {
  color: #f3fbf7 !important;
}
.site-footer :is(h2,h3,h4,p,span,a,strong,small,li) {
  color: #f3fbf7 !important;
  -webkit-text-fill-color: #f3fbf7 !important;
}
.site-footer a:hover { color: #b8f0cf !important; -webkit-text-fill-color: #b8f0cf !important; }

/* Highest-specificity correction for the public dashboard cards. */
html[data-leressae-theme="dark"] body.dark-mode #page-dashboard .dashboard-section,
html[data-theme="dark"] body.dark-mode #page-dashboard .dashboard-section,
html[data-leressae-theme="dark"] body #page-dashboard .dashboard-section,
html[data-theme="dark"] body #page-dashboard .dashboard-section {
  background: #14221d !important;
  background-image: none !important;
  color: #edf6f0 !important;
  border-color: #315342 !important;
}
html[data-leressae-theme="dark"] body.dark-mode #page-dashboard .dashboard-section .section-header h2,
html[data-theme="dark"] body.dark-mode #page-dashboard .dashboard-section .section-header h2,
html[data-leressae-theme="dark"] body #page-dashboard .dashboard-section .section-header h2,
html[data-theme="dark"] body #page-dashboard .dashboard-section .section-header h2,
html[data-leressae-theme="dark"] body.dark-mode #page-dashboard .dashboard-section .section-title-text,
html[data-theme="dark"] body.dark-mode #page-dashboard .dashboard-section .section-title-text,
html[data-leressae-theme="dark"] body #page-dashboard .dashboard-section .section-title-text,
html[data-theme="dark"] body #page-dashboard .dashboard-section .section-title-text {
  color: #f5faf7 !important;
  -webkit-text-fill-color: #f5faf7 !important;
  opacity: 1 !important;
  text-shadow: none !important;
}
html[data-leressae-theme="dark"] body.dark-mode #page-dashboard .dashboard-section .section-header p,
html[data-theme="dark"] body.dark-mode #page-dashboard .dashboard-section .section-header p,
html[data-leressae-theme="dark"] body #page-dashboard .dashboard-section .section-header p,
html[data-theme="dark"] body #page-dashboard .dashboard-section .section-header p {
  color: #c8d8cf !important;
  -webkit-text-fill-color: #c8d8cf !important;
  opacity: 1 !important;
}

/* Final theme state bridge: the toggle may set only aria-pressed on the button. */
html:has(#leressaeThemeToggle[aria-pressed="true"]) #page-dashboard .dashboard-section {
  background: linear-gradient(145deg, #14221d 0%, #0f1b17 100%) !important;
  background-image: none !important;
  color: #edf6f0 !important;
  border-color: #315342 !important;
  box-shadow: 0 18px 42px rgba(0,0,0,.28) !important;
}
html:has(#leressaeThemeToggle[aria-pressed="true"]) #page-dashboard .dashboard-section .section-header,
html:has(#leressaeThemeToggle[aria-pressed="true"]) #page-dashboard .dashboard-section .section-header * {
  background: transparent !important;
}
html:has(#leressaeThemeToggle[aria-pressed="true"]) #page-dashboard .dashboard-section :is(h1,h2,h3,.section-title-text,.section-header h2) {
  color: #f7fcf9 !important;
  -webkit-text-fill-color: #f7fcf9 !important;
  opacity: 1 !important;
  text-shadow: none !important;
}
html:has(#leressaeThemeToggle[aria-pressed="true"]) #page-dashboard .dashboard-section :is(p,.section-sub-text,.section-header p) {
  color: #c8d8cf !important;
  -webkit-text-fill-color: #c8d8cf !important;
  opacity: 1 !important;
}
html:has(#leressaeThemeToggle[aria-pressed="true"]) ::selection {
  color: #10231a !important;
  background: #9be5bd !important;
}

/* Soft smoky-green light theme, kept readable without the old white glare. */
html:has(#leressaeThemeToggle[aria-pressed="false"]) #page-dashboard .dashboard-section,
html[data-leressae-theme="light"] #page-dashboard .dashboard-section,
html[data-theme="light"] #page-dashboard .dashboard-section,
body:not(.dark-mode) #page-dashboard .dashboard-section {
  background: linear-gradient(145deg, #edf7f1 0%, #dceee4 100%) !important;
  background-image: none !important;
  color: #173c2d !important;
  border-color: #b9d7c5 !important;
  box-shadow: 0 18px 42px rgba(25,75,53,.14) !important;
}

/* Compact mobile layout: service cards and footer columns remain scannable. */
@media (max-width: 768px) {
  #page-dashboard .services-dashboard-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px !important;
  }
  #page-dashboard .services-dashboard-grid > * {
    min-width: 0 !important;
    padding: 14px !important;
  }
  #page-dashboard .services-dashboard-grid .service-item-title,
  #page-dashboard .services-dashboard-grid h3 {
    font-size: .9rem !important;
    line-height: 1.3 !important;
  }
  #page-dashboard .services-dashboard-grid .service-item-desc,
  #page-dashboard .services-dashboard-grid p {
    font-size: .72rem !important;
    line-height: 1.45 !important;
  }
  .site-footer .site-footer-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 22px 16px !important;
    align-items: start !important;
  }
  .site-footer .site-footer-brand {
    grid-column: 1 / -1 !important;
  }
  .site-footer .site-footer-bottom {
    grid-column: 1 / -1 !important;
    text-align: center !important;
  }
}
@media (max-width: 390px) {
  #page-dashboard .services-dashboard-grid > * { padding: 11px !important; }
  #page-dashboard .services-dashboard-grid .service-item-title,
  #page-dashboard .services-dashboard-grid h3 { font-size: .78rem !important; }
  #page-dashboard .services-dashboard-grid .service-item-desc,
  #page-dashboard .services-dashboard-grid p { font-size: .64rem !important; }
  .site-footer .site-footer-grid { gap: 18px 10px !important; }
  .site-footer p, .site-footer li, .site-footer a { font-size: .78rem !important; }
}
html:has(#leressaeThemeToggle[aria-pressed="false"]) #page-dashboard .dashboard-section :is(h1,h2,h3,.section-title-text,.section-header h2),
html[data-leressae-theme="light"] #page-dashboard .dashboard-section :is(h1,h2,h3,.section-title-text,.section-header h2),
html[data-theme="light"] #page-dashboard .dashboard-section :is(h1,h2,h3,.section-title-text,.section-header h2),
body:not(.dark-mode) #page-dashboard .dashboard-section :is(h1,h2,h3,.section-title-text,.section-header h2) {
  color: #173c2d !important;
  -webkit-text-fill-color: #173c2d !important;
  opacity: 1 !important;
  text-shadow: none !important;
}
html:has(#leressaeThemeToggle[aria-pressed="false"]) #page-dashboard .dashboard-section :is(p,.section-sub-text,.section-header p),
html[data-leressae-theme="light"] #page-dashboard .dashboard-section :is(p,.section-sub-text,.section-header p),
html[data-theme="light"] #page-dashboard .dashboard-section :is(p,.section-sub-text,.section-header p),
body:not(.dark-mode) #page-dashboard .dashboard-section :is(p,.section-sub-text,.section-header p) {
  color: #426653 !important;
  -webkit-text-fill-color: #426653 !important;
  opacity: 1 !important;
}

/* Align dashboard media spotlight with the green service/tutor panels. */
html:has(#leressaeThemeToggle[aria-pressed="true"]) #homeMediaSpotlight,
html[data-leressae-theme="dark"] #homeMediaSpotlight,
html[data-theme="dark"] #homeMediaSpotlight,
body.dark-mode #homeMediaSpotlight {
  background: linear-gradient(145deg, #14221d 0%, #0f1b17 100%) !important;
  background-image: none !important;
  border: 1px solid #315342 !important;
  color: #edf6f0 !important;
  box-shadow: 0 18px 42px rgba(0,0,0,.28) !important;
}
html:has(#leressaeThemeToggle[aria-pressed="true"]) #homeMediaSpotlight .media-spotlight-title,
html[data-leressae-theme="dark"] #homeMediaSpotlight .media-spotlight-title,
html[data-theme="dark"] #homeMediaSpotlight .media-spotlight-title,
body.dark-mode #homeMediaSpotlight .media-spotlight-title {
  color: #f7fcf9 !important;
  -webkit-text-fill-color: #f7fcf9 !important;
}
html:has(#leressaeThemeToggle[aria-pressed="true"]) #homeMediaSpotlight .media-spotlight-subtitle,
html[data-leressae-theme="dark"] #homeMediaSpotlight .media-spotlight-subtitle,
html[data-theme="dark"] #homeMediaSpotlight .media-spotlight-subtitle,
body.dark-mode #homeMediaSpotlight .media-spotlight-subtitle {
  color: #c8d8cf !important;
  -webkit-text-fill-color: #c8d8cf !important;
}
html:has(#leressaeThemeToggle[aria-pressed="true"]) #homeMediaSpotlight .home-media-stage,
html[data-leressae-theme="dark"] #homeMediaSpotlight .home-media-stage,
html[data-theme="dark"] #homeMediaSpotlight .home-media-stage,
body.dark-mode #homeMediaSpotlight .home-media-stage {
  background: linear-gradient(145deg,#17382b,#10251d) !important;
  border-color: #315342 !important;
}
html:has(#leressaeThemeToggle[aria-pressed="true"]) #homeMediaSpotlight :is(.home-media-arrow,.home-media-dot),
html[data-leressae-theme="dark"] #homeMediaSpotlight :is(.home-media-arrow,.home-media-dot),
html[data-theme="dark"] #homeMediaSpotlight :is(.home-media-arrow,.home-media-dot),
body.dark-mode #homeMediaSpotlight :is(.home-media-arrow,.home-media-dot) {
  border-color: #4b7964 !important;
  color: #dff8e9 !important;
}
html:has(#leressaeThemeToggle[aria-pressed="false"]) #homeMediaSpotlight,
html[data-leressae-theme="light"] #homeMediaSpotlight,
html[data-theme="light"] #homeMediaSpotlight,
body:not(.dark-mode) #homeMediaSpotlight {
  background: linear-gradient(145deg,#edf7f1 0%,#dceee4 100%) !important;
  background-image: none !important;
  border-color: #b9d7c5 !important;
  color: #173c2d !important;
  box-shadow: 0 18px 42px rgba(25,75,53,.14) !important;
}
