/* ============================================================
   PORTAL WARGA - MAIN & REUSABLE STYLESHEET
   ============================================================ */

/* --- 1. ROOT & VARIABLES --- */
:root {
    --primary-green: #176b3a;
    --secondary-green: #2c6b3f;
    --light-green-bg: #f4f8f5;
    --border-green: #c2e7d0;
    --border-strong: #cbd5e1;
    --text-dark: #0f172a;
}
.organization-datetime-settings{padding:.85rem;background:#f8fbf9}.organization-datetime-preview{min-height:38px;display:flex;align-items:center;gap:.5rem;padding:.5rem .65rem;border:1px dashed #afd0b8;border-radius:8px;background:#fff;color:#286d3e}.organization-datetime-preview strong{font-size:.72rem}.organization-setting-accordion{display:grid;gap:.65rem}.organization-setting-panel{overflow:hidden;border:1px solid #d8e7dc;border-radius:11px;background:#fff}.organization-setting-toggle{width:100%;display:flex;align-items:center;gap:.65rem;padding:.75rem .85rem;border:0;background:#fff;text-align:left;color:#34483a}.organization-setting-toggle:hover{background:#f8fbf9}.organization-setting-toggle:focus-visible{outline:2px solid var(--primary-green);outline-offset:-2px}.organization-setting-toggle>span:first-child{width:32px;height:32px;flex:0 0 32px;display:inline-flex;align-items:center;justify-content:center;border-radius:8px;background:#e8f3eb;color:var(--primary-green)}.organization-setting-toggle strong,.organization-setting-toggle small{display:block}.organization-setting-toggle strong{font-size:.73rem}.organization-setting-toggle small{margin-top:.08rem;color:#78847c;font-size:.6rem}.organization-setting-toggle>i{color:#829088;font-size:.68rem;transition:transform .2s}.organization-setting-toggle[aria-expanded="true"]>i{transform:rotate(180deg)}.organization-setting-body{padding:.85rem;border-top:1px solid #e8eee9}@media(max-width:575.98px){.organization-setting-toggle .badge{font-size:.55rem}}
.role-permission-hero-badge{display:inline-flex;align-items:center;gap:.3rem;padding:.35rem .55rem;border:1px solid rgba(255,255,255,.35);border-radius:8px;background:rgba(255,255,255,.14);color:#fff;font-size:.58rem;font-weight:850}.role-permission-summary{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.55rem}.role-permission-summary>div{display:grid;grid-template-columns:36px 1fr;align-items:center;padding:.65rem;border:1px solid #dbe7de;border-radius:10px;background:#fff}.role-permission-summary>div>span{grid-row:1/3;width:32px;height:32px;display:grid;place-items:center;border-radius:8px;background:#e5f3e9;color:#258046}.role-permission-summary small{color:#77847c;font-size:.55rem}.role-permission-summary strong{color:#294b34;font-size:.9rem}.role-permission-notice{display:flex;align-items:flex-start;gap:.6rem;padding:.7rem .8rem;border:1px solid #cfe1d4;border-radius:10px;background:#f4faf6}.role-permission-notice>span{color:#248044}.role-permission-notice strong,.role-permission-notice small{display:block}.role-permission-notice strong{color:#31563d;font-size:.68rem}.role-permission-notice small{margin-top:.1rem;color:#6d7971;font-size:.59rem;line-height:1.45}.role-permission-toolbar{display:flex;align-items:center;justify-content:space-between;gap:.7rem}.role-permission-toolbar label{min-width:0;flex:1;position:relative}.role-permission-toolbar label i{position:absolute;top:50%;left:.7rem;transform:translateY(-50%);color:#7d8981}.role-permission-toolbar input{width:100%;height:38px;padding:.45rem .7rem .45rem 2rem;border:1px solid #d7e2da;border-radius:10px;background:#fff;font-size:.68rem;outline:0}.role-permission-toolbar input:focus{border-color:#77b888;box-shadow:0 0 0 3px rgba(39,135,69,.1)}.role-permission-toolbar>span{color:#77847c;font-size:.57rem}.role-permission-list{display:grid;gap:.55rem}.role-permission-item{overflow:hidden;border:1px solid #d8e4dc!important;border-radius:12px!important;background:#fff;box-shadow:0 3px 12px rgba(27,80,43,.05)}.role-permission-item[hidden]{display:none}.role-permission-item .accordion-button{gap:.65rem;padding:.72rem .8rem;background:#fff;box-shadow:none}.role-permission-item .accordion-button:not(.collapsed){background:#f3faf5;color:inherit}.role-permission-leading{width:38px;height:38px;display:grid;place-items:center;flex:0 0 38px;border-radius:10px;background:#dff1e5;color:#247c42}.role-permission-leading.is-locked{background:#fff0cc;color:#a16b00}.role-permission-title{min-width:0;flex:1}.role-permission-title strong,.role-permission-title small{display:block}.role-permission-title strong{color:#284a33;font-size:.76rem}.role-permission-title small{margin-top:.1rem;color:#748078;font-size:.55rem}.role-permission-title code{color:#39744c;font-size:.52rem}.role-permission-count{margin-right:.35rem;text-align:right}.role-permission-count strong,.role-permission-count small{display:block}.role-permission-count strong{color:#286f3e;font-size:.7rem}.role-permission-count small{color:#879189;font-size:.48rem}.role-permission-item .accordion-body{padding:.8rem;background:#fbfdfb}.role-permission-description{display:flex;align-items:center;gap:.45rem;margin-bottom:.7rem;padding:.55rem .65rem;border-radius:8px;background:#eef5f0;color:#637269;font-size:.6rem}.role-permission-description>span{flex:1}.role-permission-description>b{color:#98701a;font-size:.52rem}.role-permission-form-tools{display:flex;align-items:center;justify-content:space-between;gap:.7rem;margin-bottom:.65rem}.role-permission-form-tools strong,.role-permission-form-tools small{display:block}.role-permission-form-tools strong{color:#31543d;font-size:.65rem}.role-permission-form-tools small{color:#7a867e;font-size:.53rem}.role-permission-form-tools>div{display:flex;gap:.3rem}.role-permission-modules{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.6rem}.role-permission-module{overflow:hidden;border:1px solid #dce7df;border-radius:10px;background:#fff}.role-permission-module>header{display:flex;align-items:center;gap:.45rem;padding:.55rem .6rem;border-bottom:1px solid #e4ebe6;background:#f6faf7}.role-permission-module>header>span{width:28px;height:28px;display:grid;place-items:center;border-radius:7px;background:#e1f1e5;color:#277c42;font-size:.7rem}.role-permission-module>header>div{min-width:0;flex:1}.role-permission-module>header strong,.role-permission-module>header small{display:block}.role-permission-module>header strong{overflow:hidden;color:#31533c;font-size:.62rem;text-overflow:ellipsis;text-transform:uppercase;white-space:nowrap}.role-permission-module>header small{color:#7c887f;font-size:.5rem}.role-permission-module>header button{width:27px;height:27px;border:0;border-radius:7px;background:#fff;color:#538060;font-size:.62rem}.role-permission-module>div{display:grid;padding:.35rem}.role-permission-option{display:flex;align-items:center;gap:.5rem;margin:0;padding:.48rem .45rem;border-radius:7px;cursor:pointer;transition:.16s}.role-permission-option:hover{background:#f3f8f4}.role-permission-option.is-checked{background:#edf8f0}.role-permission-option input{margin:0}.role-permission-option>span{min-width:0;flex:1}.role-permission-option strong,.role-permission-option code{display:block}.role-permission-option strong{color:#435248;font-size:.59rem;line-height:1.35}.role-permission-option code{margin-top:.08rem;color:#809087;font-size:.48rem}.role-permission-option>i{color:#2d9850;font-size:.55rem;opacity:0}.role-permission-option.is-checked>i{opacity:1}.role-permission-actions{display:flex;align-items:center;justify-content:flex-end;gap:.7rem;margin-top:.75rem;padding-top:.7rem;border-top:1px solid #e1e9e3}.role-permission-actions>span{margin-right:auto;color:#9b7020;font-size:.57rem}.role-permission-actions>span strong,.role-permission-actions>span small{display:block}.role-permission-unsaved[hidden]{display:none}.role-permission-actions .btn{font-size:.65rem}.role-permission-actions>span:not(.role-permission-unsaved)>i{float:left;margin:.2rem .5rem 0 0;color:#268147}@media(max-width:991.98px){.role-permission-modules{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:575.98px){.role-permission-summary{grid-template-columns:repeat(2,minmax(0,1fr))}.role-permission-toolbar{align-items:stretch;flex-direction:column}.role-permission-toolbar>span{text-align:right}.role-permission-modules{grid-template-columns:1fr}.role-permission-form-tools{align-items:flex-start;flex-direction:column}.role-permission-form-tools>div{width:100%}.role-permission-form-tools .btn{flex:1}.role-permission-item .accordion-body{padding:.6rem}.role-permission-count{display:none}.role-permission-actions{position:sticky;bottom:66px;z-index:3;margin:0 -.6rem -.6rem;padding:.55rem .6rem;background:rgba(255,255,255,.96);box-shadow:0 -5px 14px rgba(20,60,31,.08)}.role-permission-actions .btn{margin-left:auto}.role-permission-unsaved{max-width:140px}}

/* --- 2. BASE STYLES --- */
body {
    background-image:
        radial-gradient(circle at 8% 12%, rgba(45, 148, 78, .14), transparent 28%),
        radial-gradient(circle at 92% 85%, rgba(122, 190, 97, .13), transparent 30%),
        linear-gradient(rgba(247, 250, 247, .68), rgba(238, 247, 241, .74)),
        url('../img/background_page.png');
    background-repeat: no-repeat;
    background-position: center center;
    background-attachment: fixed;
    background-size: cover;
    background-color: #f4fcf6; /* Fallback */
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    color: var(--text-dark);
    padding-bottom: 90px;
    min-height: 100vh;
}

/* Desktop app shell. Mobile keeps the original PWA layout and bottom navigation. */
.portal-desktop-sidebar,
.portal-desktop-topbar { display: none; }
.dashboard-welcome-desktop { display:none; }

@media (min-width: 992px) {
    :root { --portal-desktop-sidebar: 272px; }

    body {
        padding-bottom: 0;
        background-image:linear-gradient(rgba(250,252,249,.9),rgba(247,250,247,.92)),url('../img/desktop-residence-bg.png');
        background-position:center;
        background-size:cover;
    }

    .portal-app-shell { min-height: 100vh; }
    .portal-desktop-sidebar + .portal-desktop-stage { margin-left: var(--portal-desktop-sidebar); }
    .portal-desktop-stage { min-width: 0; min-height: 100vh; }

    .portal-desktop-sidebar {
        position: fixed;
        inset: 0 auto 0 0;
        z-index: 1035;
        width: var(--portal-desktop-sidebar);
        display: flex;
        flex-direction: column;
        padding: 22px 18px 18px;
        overflow: hidden auto;
        color:#263c2d;
        background:rgba(255,255,255,.96);
        border-right:1px solid #e2ebe4;
        box-shadow:12px 0 38px rgba(31,67,42,.07);
    }

    .portal-desktop-brand { display:flex;align-items:center;gap:12px;padding:0 6px 20px;color:#193b25;border-bottom:1px solid #e5ece7; }
    .portal-desktop-brand:hover { color:#176b3a; }
    .portal-desktop-brand-logo { width:44px;height:44px;display:grid;flex:0 0 44px;place-items:center;overflow:hidden;border-radius:13px;background:#eef8f1;color:#176b3a;font-size:1.05rem;box-shadow:0 7px 18px rgba(31,105,55,.1); }
    .portal-desktop-brand-logo img { width:100%;height:100%;padding:3px;object-fit:contain; }
    .portal-desktop-brand-copy { min-width:0; }
    .portal-desktop-brand-copy small,.portal-desktop-brand-copy strong { display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
    .portal-desktop-brand-copy small { margin-bottom:2px;color:#71907b;font-size:.54rem;font-weight:800;letter-spacing:.16em; }
    .portal-desktop-brand-copy strong { font-size:.86rem;font-weight:780; }

    .portal-desktop-context { display:grid;grid-template-columns:34px minmax(0,1fr);align-items:center;gap:9px;margin:18px 3px 20px;padding:10px;border:1px solid #dceade;border-radius:12px;background:#f4f9f5; }
    .portal-desktop-context>span { width:32px;height:32px;display:grid;place-items:center;border-radius:9px;background:#dff1e4;color:#277a43; }
    .portal-desktop-context small,.portal-desktop-context strong { display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
    .portal-desktop-context small { color:#7d8c82;font-size:.52rem; }
    .portal-desktop-context strong { margin-top:1px;color:#31503a;font-size:.66rem; }

    .portal-desktop-menu { display:grid;gap:4px;margin-top:18px; }
    .portal-desktop-menu-label { padding:0 10px 6px;color:#9aa69e;font-size:.52rem;font-weight:800;letter-spacing:.12em; }
    .portal-desktop-menu a { display:grid;grid-template-columns:34px minmax(0,1fr) 12px;align-items:center;gap:9px;min-height:45px;padding:5px 10px;border-radius:11px;color:#5f6d64;text-decoration:none;transition:background .18s ease,color .18s ease,transform .18s ease; }
    .portal-desktop-menu a:hover { color:#176b3a;background:#f1f7f3;transform:translateX(2px); }
    .portal-desktop-menu a>span { width:32px;height:32px;display:grid;place-items:center;border-radius:9px;color:#61816b;background:#f2f6f3; }
    .portal-desktop-menu a>strong { font-size:.7rem;font-weight:680; }
    .portal-desktop-menu a>i { color:#8ca095;font-size:.52rem; }
    .portal-desktop-menu a.is-active { color:#176b3a;background:linear-gradient(90deg,#e9f5ec,#f2f8f3);box-shadow:inset 3px 0 #238149,0 7px 18px rgba(31,105,55,.07); }
    .portal-desktop-menu a.is-active>span { color:#fff;background:#20834a; }
    .portal-desktop-menu a.is-active>i { color:#5c8b6b; }

    .portal-desktop-residence-art { position:relative;height:76px;margin-top:auto;overflow:hidden;color:rgba(55,132,76,.13);pointer-events:none; }
    .portal-desktop-residence-art::after { content:"";position:absolute;left:-15px;right:-15px;bottom:-21px;height:52px;border-radius:50% 50% 0 0;background:#f1f7f2; }
    .portal-desktop-residence-art i { position:absolute;bottom:7px;font-size:2rem; }
    .portal-desktop-residence-art i:nth-child(1) { left:14px;font-size:1.55rem; }
    .portal-desktop-residence-art i:nth-child(2) { left:88px;font-size:2.25rem; }
    .portal-desktop-residence-art i:nth-child(3) { right:15px;font-size:2.65rem; }

    .portal-desktop-user { display:grid;grid-template-columns:38px minmax(0,1fr) 18px;align-items:center;gap:10px;padding:11px 9px;border-top:1px solid #e5ece7;color:#304538; }
    .portal-desktop-user:hover { color:#176b3a;background:#f5f9f6;border-radius:11px; }
    .portal-desktop-user img { width:38px;height:38px;border:2px solid #fff;border-radius:50%;background:#fff;object-fit:cover;box-shadow:0 3px 10px rgba(23,107,58,.13); }
    .portal-desktop-user strong,.portal-desktop-user small { display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
    .portal-desktop-user strong { font-size:.68rem; }.portal-desktop-user small { margin-top:2px;color:#829087;font-size:.54rem; }
    .portal-desktop-user>i { color:#829087;font-size:.68rem; }

    .portal-desktop-topbar { position:sticky;top:0;z-index:1025;height:60px;display:flex;align-items:center;justify-content:space-between;padding:0 clamp(22px,2.6vw,40px);border-bottom:1px solid rgba(194,215,201,.74);background:rgba(250,253,250,.9);box-shadow:0 5px 20px rgba(24,80,42,.04);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px); }
    .portal-desktop-topbar>div:first-child small,.portal-desktop-topbar>div:first-child strong { display:block; }
    .portal-desktop-topbar>div:first-child small { margin-bottom:2px;color:#6d8a76;font-size:.5rem;font-weight:800;letter-spacing:.11em; }
    .portal-desktop-topbar>div:first-child strong { max-width:58vw;overflow:hidden;color:#203b29;font-size:.88rem;text-overflow:ellipsis;white-space:nowrap; }
    .portal-desktop-topbar-actions { display:flex;align-items:center;gap:17px;color:#617269;font-size:.65rem; }
    .portal-desktop-date { display:flex;align-items:center;gap:7px; }
    .portal-desktop-topbar-actions a { display:block; }
    .portal-desktop-topbar-actions img { width:35px;height:35px;border:2px solid #fff;border-radius:50%;background:#fff;object-fit:cover;box-shadow:0 3px 10px rgba(22,86,44,.16); }

    .portal-mobile-bottom-nav { display:none !important; }
    .portal-main-content { width:100%;max-width:1420px;padding:20px clamp(22px,2.6vw,40px) 40px !important; }

    .portal-main-content .hero-banner { padding:1.25rem 1.4rem !important;border-radius:14px !important; }
    .portal-main-content .dashboard-header { min-height:112px;display:flex;flex-direction:column;justify-content:center;padding:1rem 1.25rem !important;background-image:linear-gradient(90deg,rgba(18,78,40,.91),rgba(32,119,59,.62) 48%,rgba(239,248,237,.06)),url('../img/desktop-residence-hero.png') !important;background-position:center 71%;background-size:cover;box-shadow:0 10px 24px rgba(27,95,48,.12) !important; }
    .portal-main-content .dashboard-header::after { display:none; }
    .portal-main-content .dashboard-header-top { display:none; }
    .portal-main-content .dashboard-header-user { margin-top:0;padding-top:0;border-top:0; }
    .portal-main-content .dashboard-welcome { font-size:.82rem; }
    .portal-main-content .dashboard-welcome-mobile,.portal-main-content .dashboard-welcome-date { display:none; }
    .portal-main-content .dashboard-welcome-desktop { display:inline; }
    .portal-main-content .dashboard-role-trigger { min-width:140px;max-width:180px; }
    .portal-main-content .card,.portal-main-content .dashboard-alert-list,.portal-main-content .dashboard-news-carousel { border-radius:12px; }
    .portal-main-content .table-responsive { border-radius:12px; }
    .portal-main-content .dashboard-metric { min-height:74px;padding:.55rem .65rem; }
    .portal-main-content .dashboard-metric-value { font-size:1rem; }
    .portal-main-content .dashboard-metric-count { font-size:1.15rem; }
    .portal-main-content .dashboard-shortcut { min-height:82px;padding:.55rem .35rem; }
    .portal-main-content .dashboard-shortcut-icon { width:32px;height:32px;flex-basis:32px; }
    .portal-main-content .dashboard-shortcut span:last-child { font-size:.65rem; }
    .portal-main-content:has(.dashboard-header)>section { margin-bottom:1.15rem !important; }
    .portal-main-content:has(.dashboard-header) .section-title { margin-bottom:.45rem !important;font-size:.78rem; }
    .portal-main-content:has(.dashboard-header) .dashboard-important-news { min-height:62px;padding:.55rem .7rem; }
    .portal-main-content:has(.dashboard-header) .dashboard-action-alert { min-height:52px;padding:.45rem .65rem; }
    .portal-main-content .dashboard-metric:where(a,button),.portal-main-content .dashboard-shortcut { transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease; }
    .portal-main-content .dashboard-metric:where(a,button):hover,.portal-main-content .dashboard-shortcut:hover { transform:translateY(-3px);border-color:#9ccaaa !important;box-shadow:0 10px 25px rgba(21,96,49,.11); }
}

@media (min-width: 1200px) {
    .portal-main-content .row:has(> .col-3 .dashboard-shortcut) > .col-3 { width:16.66666667%; }
}

@media (min-width: 1600px) {
    :root { --portal-desktop-sidebar: 288px; }
    .portal-main-content { max-width:1540px; }
}

/* Hierarki teks form global: nilai pengguna tetap utama, placeholder dan petunjuk bersifat sekunder. */
.form-control::placeholder,
textarea.form-control::placeholder,
input::placeholder,
textarea::placeholder {
    color: #8b9690 !important;
    font-size: .88em;
    font-weight: 400;
    opacity: .78 !important;
}
.form-control:focus::placeholder,
textarea.form-control:focus::placeholder,
input:focus::placeholder,
textarea:focus::placeholder {
    opacity: .58 !important;
}
form .form-text,
.modal .form-text {
    color: #7f8a84 !important;
    font-size: .78em;
    font-weight: 400;
    line-height: 1.4;
}
form .form-text code,
.modal .form-text code {
    color: #68746d;
    font-size: .94em;
}

/* Permukaan konten tetap bersih dengan sedikit kedalaman di atas ilustrasi halaman. */
.card {
    background-color: rgba(255, 255, 255, .94);
    border-color: rgba(191, 218, 199, .76);
    box-shadow: 0 8px 24px rgba(26, 83, 44, .07);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
}

@media (max-width: 575.98px) {
    body {
        background-image:
            radial-gradient(circle at 4% 8%, rgba(45, 148, 78, .1), transparent 24%),
            radial-gradient(circle at 96% 88%, rgba(122, 190, 97, .09), transparent 26%),
            linear-gradient(rgba(247, 250, 247, .74), rgba(238, 247, 241, .8)),
            url('../img/background_page.png');
        background-attachment: scroll;
    }
}

.cursor-pointer {
    cursor: pointer;
}

.min-w-0 { min-width: 0; }

.dashboard-brand-icon,
.dashboard-profile-button {
    width: 40px;
    height: 40px;
    flex: 0 0 40px;
    border-radius: 8px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
.dashboard-brand-icon { overflow: hidden; padding: 2px; }
.dashboard-brand-logo { display: block; width: 100%; height: 100%; object-fit: contain; }

.dashboard-brand-name { font-size: 0.95rem; font-weight: 750; letter-spacing: 0; }
.dashboard-caption { font-size: 0.7rem; letter-spacing: 0; }
.portal-confirm-modal { border-radius: 8px; overflow: hidden; }
.portal-confirm-heading { display: flex; align-items: flex-start; gap: 0.75rem; }
.portal-confirm-icon { width: 38px; height: 38px; flex: 0 0 38px; border-radius: 8px; display: inline-flex; align-items: center; justify-content: center; }
.portal-confirm-heading h2 { color: #26372c; font-size: 0.88rem; font-weight: 750; letter-spacing: 0; }
.portal-confirm-heading p { margin: 0.25rem 0 0; color: #64748b; font-size: 0.72rem; line-height: 1.45; }
.portal-toast-container { z-index: 1090; width: min(92vw, 380px); }
#portalFeedbackToast { width: 100%; overflow: hidden; border-radius: 8px; background: #fff; }
.portal-toast-icon { width: 42px; align-self: stretch; flex: 0 0 42px; display: inline-flex; align-items: center; justify-content: center; }
.portal-toast-success .portal-toast-icon { background: #d1e7dd; color: #146c43; }
.portal-toast-danger .portal-toast-icon { background: #f8d7da; color: #b02a37; }
.portal-toast-warning .portal-toast-icon { background: #fff3cd; color: #997404; }
.portal-toast-info .portal-toast-icon { background: #cff4fc; color: #087990; }
#portalFeedbackToast .toast-body { color: #334155; font-size: 0.73rem; font-weight: 600; }
.role-switch-overlay{position:fixed;inset:0;z-index:11050;display:grid;place-items:center;padding:1.25rem;background:rgba(11,35,20,.38);opacity:0;visibility:hidden;backdrop-filter:blur(5px);transition:opacity .2s ease,visibility .2s ease}.role-switch-overlay.is-visible{opacity:1;visibility:visible}.role-switch-status-card{width:min(88vw,360px);padding:1.5rem 1.35rem 1.3rem;border:1px solid rgba(255,255,255,.8);border-radius:18px;background:rgba(255,255,255,.97);box-shadow:0 22px 60px rgba(10,48,24,.25);text-align:center;transform:translateY(10px) scale(.98);transition:transform .25s ease}.role-switch-overlay.is-visible .role-switch-status-card{transform:none}.role-switch-status-icon{display:grid;width:62px;height:62px;margin:0 auto .85rem;place-items:center;border-radius:50%;background:#e3f3e8;color:#198754;font-size:1.45rem;box-shadow:0 0 0 8px rgba(25,135,84,.08)}.role-switch-status-card strong{display:block;color:#24452f;font-size:.95rem}.role-switch-status-card p{margin:.35rem 0 1rem;color:#6b7c70;font-size:.7rem;line-height:1.5}.role-switch-status-progress{display:block;height:4px;overflow:hidden;border-radius:99px;background:#dfeae2}.role-switch-status-progress i{display:block;width:42%;height:100%;border-radius:inherit;background:#198754;animation:role-switch-progress 1.05s ease-in-out infinite}.role-switch-overlay.is-complete .role-switch-status-icon{background:#198754;color:#fff;animation:role-switch-complete .45s ease both}.role-switch-overlay.is-complete .role-switch-status-progress i{width:100%;animation:none}.role-switch-overlay.is-complete .role-switch-status-progress{background:#d5eadb}@keyframes role-switch-progress{0%{transform:translateX(-110%)}50%{transform:translateX(90%)}100%{transform:translateX(240%)}}@keyframes role-switch-complete{0%{transform:scale(.72)}65%{transform:scale(1.12)}100%{transform:scale(1)}}@media(prefers-reduced-motion:reduce){.role-switch-status-card,.role-switch-status-progress i,.role-switch-overlay.is-complete .role-switch-status-icon{animation:none;transition:none}}
.collection-dashboard-hero{background-image:linear-gradient(115deg,rgba(13,92,47,.97),rgba(35,139,77,.78)),url('../img/background_header_3.png')!important}.collection-live-badge{padding:.35rem .55rem;border-radius:999px;background:rgba(255,255,255,.18);color:#fff;font-size:.58rem;font-weight:800;letter-spacing:.08em}.collection-live-badge i{display:inline-block;width:7px;height:7px;margin-right:.3rem;border-radius:50%;background:#8cffad;box-shadow:0 0 0 4px rgba(140,255,173,.15);animation:collection-pulse 1.5s infinite}.collection-metric-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.7rem}.collection-metric-grid>div{position:relative;overflow:hidden;padding:1rem;border:1px solid #dce8df;border-radius:12px;background:#fff;box-shadow:0 4px 14px rgba(30,75,42,.07)}.collection-metric-grid small,.collection-metric-grid strong{display:block}.collection-metric-grid small{color:#708078;font-size:.6rem}.collection-metric-grid strong{margin-top:.25rem;color:#334b3a;font-size:.95rem}.collection-metric-grid>div>i{position:absolute;right:.8rem;bottom:.7rem;color:#cedbd1;font-size:1.3rem}.collection-metric-grid .is-success strong{color:#198754}.collection-metric-grid .is-danger strong{color:#bd3d49}.collection-metric-grid .is-primary strong{color:#2969a8}.collection-progress-card{padding:1rem;border-radius:12px}.collection-progress-card small,.collection-progress-card strong{display:block}.collection-progress-card strong{font-size:.75rem}.collection-progress-card b{color:#198754}.collection-progress-card .progress{height:8px;margin:.8rem 0}.collection-status-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:.5rem}.collection-status-grid span{color:#738078;font-size:.56rem;text-align:center}.collection-status-grid b{display:block;color:#344b3a;font-size:.85rem}.collection-area-row{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.75rem 0;border-top:1px solid #edf1ee}.collection-area-row:first-of-type{border-top:0}.collection-area-row strong,.collection-area-row small{display:block}.collection-area-row small{color:#78837c;font-size:.56rem}.collection-area-row>span{width:min(40%,180px);text-align:right}.collection-area-row>span i{display:block;height:5px;margin-top:.25rem;overflow:hidden;border-radius:9px;background:#e4ece6}.collection-area-row>span em{display:block;height:100%;border-radius:inherit;background:#198754}.collection-trend{display:flex;height:150px;align-items:end;gap:.35rem;padding-top:1rem}.collection-trend>span{display:flex;height:100%;min-width:8px;flex:1;align-items:center;flex-direction:column;justify-content:end}.collection-trend i{display:block;width:100%;max-width:22px;border-radius:5px 5px 0 0;background:linear-gradient(#4fb274,#198754)}.collection-trend small{margin-top:.25rem;color:#879188;font-size:.45rem}.collection-share-card{display:flex;align-items:center;gap:.75rem;padding:1rem;border-radius:12px}.collection-share-card>span{width:42px;height:42px;display:grid;flex:0 0 42px;place-items:center;border-radius:10px;background:#e5f4ea;color:#198754}.collection-share-card>div{min-width:0;flex:1}.collection-share-card strong,.collection-share-card small,.collection-share-card a{display:block}.collection-share-card small,.collection-share-card a{font-size:.58rem}.collection-share-card>div a{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}@keyframes collection-pulse{50%{opacity:.45}}@media(max-width:767.98px){.collection-metric-grid{grid-template-columns:repeat(2,1fr)}.collection-status-grid{grid-template-columns:repeat(3,1fr)}.collection-share-card{align-items:flex-start;flex-wrap:wrap}.collection-share-card>.btn{width:100%}}@media(max-width:380px){.collection-metric-grid{grid-template-columns:1fr}}
.dashboard-insight-tabs{display:grid;grid-template-columns:repeat(3,1fr);gap:.45rem;padding:.35rem;border:1px solid #dce7df;border-radius:12px;background:#fff}.dashboard-insight-tabs a{display:flex;align-items:center;justify-content:center;gap:.4rem;padding:.58rem;border-radius:9px;color:#68766d;font-size:.65rem;font-weight:750;text-decoration:none}.dashboard-insight-tabs a.active{background:#198754;color:#fff;box-shadow:0 4px 10px rgba(25,135,84,.2)}.dashboard-filter-bar{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.65rem;padding:.75rem;border-radius:12px}.dashboard-filter-bar label>span{display:block;margin-bottom:.2rem;color:#758078;font-size:.53rem;font-weight:700}.dashboard-compact-card{padding:.85rem 1rem;border-radius:12px}.dashboard-compact-card>header{display:flex;align-items:center;justify-content:space-between;gap:.7rem;margin-bottom:.35rem}.dashboard-compact-card>header strong,.dashboard-compact-card>header small{display:block}.dashboard-compact-card>header strong{font-size:.76rem}.dashboard-compact-card>header small{color:#78837c;font-size:.55rem}.dashboard-compact-card>header>span{padding:.22rem .45rem;border-radius:999px;background:#e8f4eb;color:#247542;font-size:.52rem;font-weight:750}.dashboard-breakdown-row{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.68rem 0;border-top:1px solid #edf1ee}.dashboard-breakdown-row>span{min-width:0}.dashboard-breakdown-row>span:last-child{text-align:right}.dashboard-breakdown-row strong,.dashboard-breakdown-row small,.dashboard-breakdown-row b{display:block}.dashboard-breakdown-row strong,.dashboard-breakdown-row b{font-size:.68rem}.dashboard-breakdown-row small{color:#7b877f;font-size:.52rem}.finance-highlight-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.65rem}.finance-highlight-grid>div{display:grid;grid-template-columns:34px 1fr;align-items:center;gap:.55rem;padding:.75rem;border:1px solid #dfe8e1;border-radius:11px;background:#fff}.finance-highlight-grid span{grid-row:1/3;width:34px;height:34px;display:grid;place-items:center;border-radius:9px;background:#e8f4eb;color:#198754}.finance-highlight-grid small,.finance-highlight-grid strong{display:block}.finance-highlight-grid small{color:#7c877f;font-size:.5rem}.finance-highlight-grid strong{font-size:.68rem}.finance-monthly-list>div{display:grid;grid-template-columns:72px minmax(80px,1fr) auto;align-items:center;gap:.55rem;padding:.55rem 0;border-top:1px solid #edf1ee}.finance-monthly-list>div:first-child{border-top:0}.finance-monthly-list small{font-size:.52rem}.finance-monthly-list strong{font-size:.52rem;font-weight:650}.finance-monthly-list span{display:flex;height:6px;overflow:hidden;border-radius:99px;background:#edf1ee}.finance-monthly-list i,.finance-monthly-list em{display:block;height:100%}.financial-health-summary{display:flex;align-items:center;gap:1rem;padding:1rem;border-radius:13px}.financial-health-score{width:82px;height:82px;display:grid;flex:0 0 82px;place-items:center;align-content:center;border-radius:50%;background:conic-gradient(#198754 72%,#e5ece7 0);box-shadow:inset 0 0 0 8px #fff}.financial-health-score b,.financial-health-score small{display:block;text-align:center}.financial-health-score small{font-size:.42rem}.financial-health-summary>div small{font-size:.5rem;color:#198754;font-weight:800;letter-spacing:.08em}.financial-health-summary h5{margin:.15rem 0;font-size:1rem;font-weight:800}.financial-health-summary p{margin:0;color:#77827b;font-size:.57rem}.report-summary-links>div{display:flex;align-items:center;gap:.65rem;padding:.65rem 0;border-top:1px solid #edf1ee}.report-summary-links>div:first-child{border-top:0}.report-summary-links>div>i{width:30px;color:#198754;text-align:center}.report-summary-links strong,.report-summary-links small{display:block}.report-summary-links strong{font-size:.67rem}.report-summary-links small{color:#78837c;font-size:.52rem}@media(max-width:575.98px){.dashboard-filter-bar{grid-template-columns:1fr}.finance-highlight-grid{grid-template-columns:1fr}.finance-monthly-list>div{grid-template-columns:62px 1fr}.finance-monthly-list strong{grid-column:2}.financial-health-summary{align-items:flex-start}.financial-health-score{width:68px;height:68px;flex-basis:68px}.dashboard-insight-tabs a{padding:.52rem .25rem}}
.dashboard-context {
    max-width: 48%;
    display: inline-flex;
    align-items: center;
    padding: 0.4rem 0.6rem;
    border: 1px solid var(--border-green);
    border-radius: 8px;
    background: #ffffff;
    color: var(--primary-green);
    font-size: 0.7rem;
    font-weight: 700;
}
.dashboard-context span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dashboard-header {
    z-index: 30;
    overflow: visible !important;
    border-radius: 8px !important;
}
.dashboard-header::after { border-radius: inherit; }
.dashboard-header-top,
.dashboard-header-user { display: flex; align-items: center; justify-content: space-between; gap: 0.75rem; }
.dashboard-header-top,
.dashboard-header-user { z-index: 1; }
.dashboard-header-user { margin-top: 0.65rem; padding-top: 0.6rem; border-top: 1px solid rgba(255,255,255,.18); }
.dashboard-welcome { font-size: 0.88rem; font-weight: 750; letter-spacing: 0; }
.dashboard-profile-button { background: rgba(255,255,255,.18); color: #ffffff; text-decoration: none; position: relative; z-index: 2; }
.dashboard-role-switch { position: relative; z-index: 40; }
.dashboard-role-trigger { min-width: 148px; max-width: 195px; display: grid; grid-template-columns: 30px minmax(0,1fr) 12px; align-items: center; gap: .45rem; padding: .35rem .5rem; border: 1px solid rgba(255,255,255,.5); border-radius: 10px; background: rgba(255,255,255,.96); color: #176b3a; box-shadow: 0 5px 14px rgba(4,39,18,.18); text-align: left; }
.dashboard-role-trigger:hover,.dashboard-role-trigger[aria-expanded="true"] { background:#fff; transform:translateY(-1px); box-shadow:0 8px 20px rgba(4,39,18,.24); }
.dashboard-role-trigger-icon { width:30px;height:30px;display:grid;place-items:center;border-radius:8px;background:#dff2e5;color:#176b3a; }
.dashboard-role-trigger-copy { min-width:0;line-height:1.15; }
.dashboard-role-trigger-copy small,.dashboard-role-trigger-copy strong { display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
.dashboard-role-trigger-copy small { color:#718078;font-size:.52rem;font-weight:650;text-transform:uppercase;letter-spacing:.04em; }
.dashboard-role-trigger-copy strong { margin-top:.1rem;color:#185b34;font-size:.68rem; }
.dashboard-role-trigger-arrow { color:#6d7d73;font-size:.56rem;transition:transform .2s ease; }
.dashboard-role-trigger[aria-expanded="true"] .dashboard-role-trigger-arrow { transform:rotate(180deg); }
.dashboard-role-switch .dropdown-menu {
    z-index: 1080;
    width: min(290px, 82vw);
    max-height: min(360px, 65vh);
    overflow-y: auto;
    padding: .5rem;
    border-radius: 12px;
    border:1px solid #dce8df !important;
    box-shadow:0 18px 45px rgba(18,55,31,.2) !important;
}
.dashboard-role-menu-head { margin:-.5rem -.5rem .4rem;padding:.75rem .85rem;background:#edf7f0;border-radius:12px 12px 8px 8px;color:#245b36; }
.dashboard-role-menu-head span,.dashboard-role-menu-head small { display:block; }
.dashboard-role-menu-head span { font-size:.75rem;font-weight:800; }.dashboard-role-menu-head small { margin-top:.15rem;color:#6d7d73;font-size:.6rem; }
.dashboard-role-option { display:grid;grid-template-columns:34px minmax(0,1fr) 16px;align-items:center;gap:.6rem;border-radius:9px;padding:.55rem .6rem;margin:.15rem 0;white-space:normal; }
.dashboard-role-option-icon { width:34px;height:34px;display:grid;place-items:center;border-radius:8px;background:#edf3ef;color:#39704a;font-size:.75rem; }
.dashboard-role-option-copy { min-width:0; }.dashboard-role-option-copy strong,.dashboard-role-option-copy small { display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
.dashboard-role-option-copy strong { color:#2c4233;font-size:.7rem; }.dashboard-role-option-copy small { margin-top:.1rem;color:#718078;font-size:.58rem; }
.dashboard-role-option-state { color:#9aa69e;font-size:.58rem;justify-self:end; }
.dashboard-role-option.active { background:linear-gradient(135deg,#176b3a,#27864c); }.dashboard-role-option.active .dashboard-role-option-icon { background:rgba(255,255,255,.18);color:#fff; }.dashboard-role-option.active strong,.dashboard-role-option.active small,.dashboard-role-option.active .dashboard-role-option-state { color:#fff; }

.dashboard-metric {
    min-height: 72px;
    border-radius: 8px;
    padding: 0.5rem 0.55rem;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.3rem;
    border-top-width: 3px !important;
    position: relative;
    overflow: hidden;
}
.dashboard-metric-success { border-top-color: #198754 !important; }
.dashboard-alert-list { overflow: hidden; border-radius: 8px; }
.dashboard-action-alert { display: flex; align-items: center; gap: .65rem; min-height: 58px; padding: .55rem .7rem; border-bottom: 1px solid #e7ece8; }
.dashboard-action-alert:last-child { border-bottom: 0; }
.dashboard-action-alert:hover { background: #f8fbf9; }
.dashboard-action-icon { width: 36px; height: 36px; flex: 0 0 36px; border-radius: 8px; display: inline-flex; align-items: center; justify-content: center; }
.dashboard-action-alert strong { font-size: .76rem; }
.dashboard-action-alert small { font-size: .64rem; }
.dashboard-action-alert > .badge { min-width: 28px; }
.dashboard-metric-warning { border-top-color: #d97706 !important; }
.dashboard-metric-danger { border-top-color: #dc3545 !important; }
.dashboard-metric-info { border-top-color: #0284c7 !important; }
.dashboard-metric-secondary { border-top-color: #64748b !important; }
.dashboard-metric-icon,
.dashboard-shortcut-icon,
.dashboard-management-icon {
    width: 36px;
    height: 36px;
    flex: 0 0 36px;
    border-radius: 8px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
.dashboard-metric-title,
.dashboard-metric-value { position: relative; z-index: 1; }
.dashboard-metric-value { font-size: 1rem; line-height: 1.05; letter-spacing: 0; }
.dashboard-metric-count { font-size: 1.35rem; }
.dashboard-metric-currency { font-size: 1rem; }
.dashboard-metric-watermark { position: absolute; right: 0.35rem; bottom: -0.2rem; font-size: 2.4rem; line-height: 1; opacity: 0.09; pointer-events: none; }
.dashboard-metric-link {
    appearance: none;
    color: var(--text-dark);
    cursor: pointer;
    text-align: left;
    transition: box-shadow 0.16s ease, transform 0.16s ease, border-color 0.16s ease;
}
.dashboard-metric-link:hover {
    color: var(--text-dark);
    border-color: var(--border-green) !important;
    box-shadow: 0 4px 10px rgba(15, 23, 42, 0.09);
    transform: translateY(-1px);
}
.dashboard-metric-link:focus-visible {
    outline: 2px solid var(--primary-green);
    outline-offset: 2px;
}

.dashboard-shortcut {
    min-height: 80px;
    border-radius: 8px;
    padding: 0.5rem 0.3rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.35rem;
    color: var(--text-dark);
    text-align: center;
    font-size: 0.62rem;
    font-weight: 650;
    line-height: 1.2;
    transition: all 0.2s ease;
    border-color: #cbd9cf !important;
    background: #fbfefc !important;
    box-shadow: 0 2px 5px rgba(20, 64, 34, 0.12);
}
.dashboard-shortcut:hover {
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
    transform: translateY(-2px);
}
.dashboard-shortcut-icon { width: 44px; height: 44px; flex-basis: 44px; border-radius: 10px; font-size: 1.5rem; display: flex; align-items: center; justify-content: center; box-shadow:inset 0 0 0 1px rgba(20,60,32,.08); }
.dashboard-emergency-shortcut { appearance: none; }
.emergency-shortcut-icon { background:#fff4f1;overflow:hidden; }
.emergency-shortcut-image { width:94%;height:94%;object-fit:contain;display:block; }
.security-duty-panel { position:relative;display:flex;align-items:center;gap:.6rem;min-height:48px;padding:.42rem .55rem;border:1px solid #ead28c;border-left:4px solid #d29d0b;border-radius:9px;background:#fffaf0;box-shadow:0 2px 8px rgba(67,55,18,.07); }
.security-duty-panel.is-active { border-color:#a9d5b7;border-left-color:#198754;background:#f3fbf6;box-shadow:0 2px 8px rgba(25,135,84,.08); }
.security-duty-icon { width:32px;height:32px;flex:0 0 32px;display:inline-flex;align-items:center;justify-content:center;border-radius:8px;background:#fff0bd;color:#765600;font-size:.82rem; }
.security-duty-panel.is-active .security-duty-icon { background:#dff3e6;color:#176f3a; }
.security-duty-copy strong,.security-duty-copy small { display:block; }
.security-duty-copy strong { color:#342b13;font-size:.75rem;line-height:1.15; }
.security-duty-copy small { margin-top:.08rem;color:#756536;font-size:.58rem;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis; }
.security-duty-panel.is-active .security-duty-copy strong{color:#145b32}.security-duty-panel.is-active .security-duty-copy small{color:#527360}
.security-duty-action{flex:0 0 auto}.security-duty-action .btn{display:inline-flex;align-items:center;gap:.35rem;min-width:auto;padding:.35rem .6rem;border-radius:7px;font-size:.62rem;font-weight:800;box-shadow:none}
@media(max-width:575.98px){.security-duty-panel{gap:.45rem;padding:.4rem .45rem}.security-duty-icon{width:30px;height:30px;flex-basis:30px}.security-duty-copy strong{font-size:.7rem}.security-duty-copy small{font-size:.53rem}.security-duty-action .btn{padding:.35rem .5rem}.security-duty-action .btn span{display:none}}

.dashboard-operation,
.dashboard-system {
    min-height: 88px;
    border-radius: 8px;
    padding: 0.55rem 0.3rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.45rem;
    color: var(--text-dark);
    text-align: center;
    font-size: 0.64rem;
    font-weight: 650;
    line-height: 1.15;
}
.dashboard-operation,
.dashboard-management,
.dashboard-more-menu,
.dashboard-system {
    border-color: #cbd9cf !important;
    background: #fbfefc !important;
    box-shadow: 0 2px 5px rgba(20, 64, 34, 0.08);
}
.dashboard-operation-icon,
.dashboard-management-icon,
.dashboard-more-menu .dashboard-management-icon {
    box-shadow: inset 0 0 0 1px rgba(20, 60, 32, 0.1);
}
.dashboard-operation-icon { width: 38px; height: 38px; flex: 0 0 38px; border-radius: 8px; display: inline-flex; align-items: center; justify-content: center; }
.dashboard-system { min-height: 72px; background: #f8fafc !important; }
.dashboard-system > i { font-size: 1rem; }

.emergency-hold-button {
    position: relative;
    width: 100%;
    height: 64px;
    overflow: hidden;
    border: 0;
    border-radius: 8px;
    background: #dc3545;
    color: #ffffff;
    touch-action: none;
    user-select: none;
}
.emergency-hold-progress { position: absolute; inset: 0 auto 0 0; width: 0; background: #8f1d2c; transition: width .1s linear; }
.emergency-hold-button.is-complete { background: #198754; }
.emergency-create-shell{width:min(100%,760px);margin-inline:auto}.emergency-create-header{position:relative;overflow:hidden;margin-bottom:1rem;padding:1.1rem 1.25rem 1.35rem;border-radius:16px;background:linear-gradient(145deg,#7c1724,#c92f43);color:#fff;box-shadow:0 12px 30px rgba(142,27,43,.2)}.emergency-create-header:after{content:"";position:absolute;right:-45px;bottom:-70px;width:190px;height:190px;border:32px solid rgba(255,255,255,.07);border-radius:50%}.emergency-create-header>a{position:relative;z-index:1}.emergency-create-header>div{position:relative;z-index:1;margin-top:1.2rem;padding-left:58px}.emergency-create-symbol{position:absolute;left:0;top:1px;display:grid;place-items:center;width:44px;height:44px;border-radius:13px;background:rgba(255,255,255,.16);font-size:1.15rem}.emergency-create-header small{font-size:.57rem;font-weight:800;letter-spacing:.13em}.emergency-create-header h1{margin:.1rem 0;font-size:1.35rem;font-weight:850}.emergency-create-header p{max-width:480px;margin:0;color:rgba(255,255,255,.78);font-size:.68rem}.emergency-create-card{padding:1rem;border:1px solid #ead6d9;border-radius:14px;background:#fff;box-shadow:0 8px 24px rgba(89,35,43,.07)}.emergency-location-card,.emergency-gps-card{display:grid;grid-template-columns:38px minmax(0,1fr) auto;align-items:center;gap:.7rem;padding:.75rem;border-radius:10px}.emergency-location-card{border:1px solid #dae7dd;background:#f5faf6}.emergency-location-card>span,.emergency-gps-icon{display:grid;place-items:center;width:38px;height:38px;border-radius:10px;background:#e1f1e5;color:#21813e}.emergency-location-card small,.emergency-location-card strong,.emergency-location-card p,.emergency-gps-card small,.emergency-gps-card strong,.emergency-gps-card p{display:block;margin:0}.emergency-location-card small,.emergency-gps-card small{color:#7d8981;font-size:.51rem;font-weight:800;letter-spacing:.08em}.emergency-location-card strong,.emergency-gps-card strong{font-size:.72rem}.emergency-location-card p,.emergency-gps-card p{color:#748078;font-size:.59rem}.emergency-gps-card{margin-top:.6rem;border:1px solid #e3e7e4;background:#fafbfa}.emergency-gps-card.is-loading .emergency-gps-icon i{animation:emergencyPulse 1s infinite}.emergency-gps-card.is-ready{border-color:#b9dcc2;background:#f2faf4}.emergency-gps-card.is-error{border-color:#edd4b3;background:#fff9f0}.emergency-gps-card.is-error .emergency-gps-icon{background:#fff0d9;color:#b66a00}@keyframes emergencyPulse{50%{transform:scale(1.2);opacity:.55}}.emergency-instruction{display:flex;align-items:center;gap:.65rem;margin:1rem 0 .65rem;padding:.65rem .75rem;border-radius:9px;background:#f6f7f6;color:#526058}.emergency-instruction>i{color:#a92739}.emergency-instruction strong,.emergency-instruction small{display:block}.emergency-instruction strong{font-size:.66rem}.emergency-instruction small{font-size:.56rem}.emergency-instruction.is-warning{background:#fff6df;color:#765600}.emergency-instruction.is-error{background:#fde9ec;color:#9f2334}.emergency-page-hold{position:relative;width:100%;height:96px;overflow:hidden;border:0;border-radius:14px;background:linear-gradient(145deg,#d73549,#ae1f33);color:#fff;touch-action:none;user-select:none;box-shadow:0 8px 22px rgba(177,31,51,.23);transition:transform .12s,box-shadow .12s}.emergency-page-hold:not(:disabled):active,.emergency-page-hold.is-holding{transform:scale(.985);box-shadow:0 3px 12px rgba(177,31,51,.2)}.emergency-page-hold:disabled{opacity:.62}.emergency-page-hold-progress{position:absolute;inset:0 auto 0 0;width:0;background:#761422;transition:width .05s linear}.emergency-page-hold-content{position:relative;display:grid;grid-template-columns:38px 1fr;grid-template-rows:auto auto;align-items:center;width:max-content;margin:auto;text-align:left}.emergency-page-hold-content>i{grid-row:1/3;font-size:1.45rem}.emergency-page-hold-content strong{font-size:.86rem;letter-spacing:.04em}.emergency-page-hold-content small{color:rgba(255,255,255,.72);font-size:.56rem}.emergency-result{padding:1rem;border:1px solid #a9d8b6;border-radius:12px;background:#f1faf3;text-align:center}.emergency-result-check{display:grid;place-items:center;width:42px;height:42px;margin:0 auto .5rem;border-radius:50%;background:#198754;color:#fff}.emergency-result>div>small{color:#298449;font-size:.55rem;font-weight:800;letter-spacing:.08em}.emergency-result h2{margin:.15rem 0 .75rem;font-size:1rem}.emergency-result-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border:1px solid #d3e7d8;border-radius:8px;background:#fff}.emergency-result-grid span{padding:.55rem;border-right:1px solid #dce9df}.emergency-result-grid span:last-child{border:0}.emergency-result-grid small,.emergency-result-grid strong{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.emergency-result-grid small{color:#7c8880;font-size:.5rem}.emergency-result-grid strong{font-size:.64rem}.emergency-safety-note{display:flex;gap:.65rem;margin-top:.75rem;padding:.7rem;color:#667169}.emergency-safety-note>i{margin-top:.1rem;color:#b52a3d}.emergency-safety-note strong,.emergency-safety-note small{display:block}.emergency-safety-note strong{font-size:.63rem}.emergency-safety-note small{font-size:.56rem}@media(max-width:575.98px){.emergency-create-header{margin-inline:-.75rem;border-radius:0 0 18px 18px}.emergency-create-card{padding:.8rem}.emergency-result-grid{grid-template-columns:1fr}.emergency-result-grid span{border-right:0;border-bottom:1px solid #dce9df}.emergency-result-grid span:last-child{border-bottom:0}}

.dashboard-management,
.dashboard-announcement {
    min-height: 64px;
    border-radius: 8px;
    padding: 0.7rem;
    display: flex;
    align-items: center;
    gap: 0.7rem;
}
.dashboard-management strong { font-size: 0.8rem; letter-spacing: 0; }
.dashboard-management small { font-size: 0.68rem; }
.dashboard-more-grid { align-items: stretch; }
.dashboard-more-menu {
    min-height: 90px;
    padding: 0.6rem 0.25rem;
    border-radius: 8px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.45rem;
    color: var(--text-dark);
    text-align: center;
}
.dashboard-more-menu .dashboard-management-icon { width: 38px; height: 38px; flex-basis: 38px; border-radius: 8px; }
.dashboard-more-menu strong { width: 100%; font-size: 0.65rem; line-height: 1.15; overflow-wrap: anywhere; }
.dashboard-category-help { display: block; margin-top: 0.12rem; font-size: 0.59rem; }
.dashboard-category-total { flex: 0 0 auto; padding: 0.2rem 0.45rem; border: 1px solid #dce5df; border-radius: 999px; background: #fff; color: #68766d; font-size: 0.55rem; font-weight: 700; }
.dashboard-category-shortcut { min-height: 80px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 0.28rem; padding: 0.5rem 0.3rem; border-radius: 9px; border-color:#cbd9cf!important; background:#fbfefc!important; color: #293d30; text-align: center; box-shadow:0 2px 5px rgba(20,64,34,.08); transition: border-color .16s ease, box-shadow .16s ease, transform .16s ease; }
.dashboard-category-shortcut:hover { border-color: #a9c9b1 !important; box-shadow: 0 4px 12px rgba(32, 66, 42, 0.08); transform: translateY(-1px); }
.dashboard-category-shortcut-icon { width: 38px; height: 38px; flex: 0 0 38px; display: inline-flex; align-items: center; justify-content: center; border-radius: 9px; font-size: 1.25rem; box-shadow:inset 0 0 0 1px rgba(20,60,32,.1); }
.dashboard-category-shortcut strong { width: 100%; display: -webkit-box; overflow: hidden; color: #304238; font-size: 0.61rem; line-height: 1.15; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.dashboard-category-shortcut small { color: #7c8880; font-size: 0.51rem; }
.dashboard-category-modal .modal-content { max-height: min(82vh, 620px); overflow: hidden; }
.dashboard-category-modal-title { min-width: 0; display: flex; align-items: center; gap: 0.55rem; }
.dashboard-category-modal-title > span { width: 34px; height: 34px; flex: 0 0 34px; display: inline-flex; align-items: center; justify-content: center; border: 1px solid rgba(255,255,255,.24); border-radius: 8px; background: rgba(255,255,255,.14); }
.dashboard-category-modal-title h6 { font-size: 0.78rem; font-weight: 750; }
.dashboard-category-modal-title small { display: block; color: rgba(255,255,255,.74); font-size: 0.55rem; }
.dashboard-category-modal-description { margin: 0 0 0.65rem; color: #748078; font-size: 0.61rem; }
.dashboard-category-modal-list { display: grid; gap: 0.5rem; }
.dashboard-category-menu { min-width: 0; min-height: 62px; display: grid; grid-template-columns: 36px minmax(0, 1fr) 10px; align-items: center; gap: 0.55rem; padding: 0.6rem; border: 1px solid #e1e8e3; border-radius: 8px; background: #fff; color: #35463b; transition: border-color .16s ease, background .16s ease, transform .16s ease; }
.dashboard-category-menu:hover { border-color: #a9c9b1; background: #f8fbf9; color: #286e3b; transform: translateY(-1px); }
.dashboard-category-menu-icon { width: 36px; height: 36px; display: inline-flex; align-items: center; justify-content: center; border-radius: 8px; font-size: 1.1rem; }
.dashboard-category-menu-copy { min-width: 0; }
.dashboard-category-menu-copy strong, .dashboard-category-menu-copy small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dashboard-category-menu-copy strong { color: #304238; font-size: 0.66rem; }
.dashboard-category-menu-copy small { margin-top: 0.12rem; color: #7b877f; font-size: 0.53rem; }
.dashboard-category-menu > .fa-chevron-right { color: #9aa49e; font-size: 0.56rem; }
@media (max-width: 575.98px) {
    .dashboard-category-menu { min-height: 58px; }
    .dashboard-category-modal .modal-dialog { margin: 0.75rem; }
}
.dashboard-chevron { font-size: 0.68rem; }
.dashboard-date {
    width: 42px;
    height: 46px;
    flex: 0 0 42px;
    border-radius: 8px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    line-height: 1;
}
.dashboard-date strong { font-size: 0.85rem; }
.dashboard-date small { font-size: 0.55rem; margin-top: 0.2rem; }
.dashboard-announcement strong { font-size: 0.8rem; }
.dashboard-announcement small { font-size: 0.68rem; }
.dashboard-badge { font-size: 0.56rem; }
.dashboard-empty { border-radius: 8px; padding: 1.25rem; }
.dashboard-important-news,
.dashboard-latest-news { border-radius: 8px; display: flex; align-items: center; gap: 0.75rem; }
.dashboard-important-news { min-height: 62px; padding: 0.65rem 0.7rem; }
.dashboard-latest-news { min-height: 108px; padding: 0.7rem; }
.dashboard-important-icon { width: 36px; height: 36px; flex: 0 0 36px; border-radius: 8px; display: inline-flex; align-items: center; justify-content: center; }
.dashboard-important-news strong,
.dashboard-latest-news strong { font-size: 0.78rem; }
.dashboard-important-news small,
.dashboard-news-excerpt { font-size: 0.66rem; }
.dashboard-news-carousel { border-radius: 8px; overflow: hidden; }
.dashboard-news-carousel.has-controls .dashboard-latest-news { padding-right: 5.2rem; }
.dashboard-news-thumb { width: 104px; height: 82px; flex: 0 0 104px; overflow: hidden; border-radius: 7px; background: #edf3ef; }
.dashboard-news-thumb img { display: block; width: 100%; height: 100%; object-fit: cover; }
.dashboard-news-thumb-placeholder { display: inline-flex; align-items: center; justify-content: center; color: var(--primary-green); font-size: 1.45rem; }
.dashboard-news-copy { display: flex; flex-direction: column; align-items: flex-start; }
.dashboard-news-category { margin-bottom: 0.18rem; color: #4f765a; font-size: 0.59rem; font-weight: 700; }
.dashboard-news-title { display: -webkit-box; overflow: hidden; line-height: 1.28; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.dashboard-latest-news .dashboard-news-title { font-size: 0.88rem; }
.dashboard-news-excerpt { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; line-height: 1.3; }
.dashboard-news-copy time { margin-top: 0.32rem; color: #738078; font-size: 0.59rem; }
.dashboard-carousel-controls { position: absolute; right: 0.55rem; bottom: 0.45rem; z-index: 2; display: flex; align-items: center; gap: 0.25rem; color: #64748b; font-size: 0.58rem; }
.dashboard-carousel-controls button { width: 24px; height: 24px; border: 1px solid #dbe4de; border-radius: 6px; background: #ffffff; color: var(--primary-green); display: inline-flex; align-items: center; justify-content: center; font-size: 0.58rem; }
@media (max-width: 420px) { .dashboard-news-thumb { width: 88px; height: 78px; flex-basis: 88px; } .dashboard-latest-news { min-height: 102px; } .dashboard-news-carousel.has-controls .dashboard-latest-news { padding-right: 4.2rem; } }

.header-back-link,
.page-back-link {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.75rem;
    font-weight: 650;
    letter-spacing: 0;
    text-decoration: none;
}
.header-back-link { color: rgba(255,255,255,.82); position: relative; z-index: 2; }
.header-back-link:hover { color: #ffffff; }
.page-back-link { color: var(--primary-green); margin-bottom: 0.5rem; }
.page-back-link:hover { color: var(--secondary-green); }

/* Emergency history */
.emergency-history-heading { display:flex;align-items:flex-start;gap:.8rem;margin:.75rem 0 0; }
.emergency-history-heading > div { min-width:0; }
.emergency-history-hero-icon { display:grid;place-items:center;width:44px;height:44px;flex:0 0 44px;border-radius:14px;background:rgba(255,255,255,.15);font-size:1.35rem; }
.emergency-history-heading h1 { margin:0 0 .4rem;font-size:clamp(1.2rem,3.8vw,1.65rem);line-height:1.3;font-weight:750; }
.emergency-history-heading p { margin:0;color:#e0eee3;font-size:.85rem;line-height:1.6; }
.emergency-history-actions { display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:.8rem; }
.emergency-history-active { display:inline-flex;align-items:center;gap:.4rem;padding:.4rem .6rem;border:1px solid #dce7df;border-radius:8px;background:#fff;color:#53655a;font-size:.8rem; }
.emergency-history-status-dot { width:7px;height:7px;border-radius:50%;background:#81958a; }
.emergency-history-active.has-active { border-color:#f1c9cf;background:#fff1f3;color:#b42335; }
.emergency-history-active.has-active .emergency-history-status-dot { background:#dc3545; }
.emergency-history-create { display:inline-flex;align-items:center;justify-content:center;gap:.6rem;min-height:44px;padding:.65rem .9rem;border-radius:10px;font-size:.85rem;font-weight:700;white-space:nowrap; }
.emergency-history-create .fa-arrow-right { font-size:.7rem; }
.emergency-history-panel { overflow:hidden;border-radius:14px; }
.emergency-history-panel-heading { display:flex;align-items:center;justify-content:space-between;gap:.75rem;padding:1rem 1rem 0; }
.emergency-history-panel-heading h2 { margin:0;font-size:.95rem;font-weight:700;color:#263e30; }
.emergency-history-panel-heading > span { color:#64748b;font-size:.72rem; }
.emergency-history-filter { display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:.6rem;padding:1rem;border-bottom:1px solid #e5ece7; }
.emergency-history-filter .form-label { margin-bottom:.4rem;font-size:.75rem;font-weight:600;color:#53655a; }
.emergency-history-filter .form-select { min-height:44px;border-radius:9px;font-size:.85rem; }
.emergency-history-filter .btn { display:inline-flex;align-items:center;justify-content:center;gap:.4rem;min-height:44px;border-radius:9px;padding:.6rem .85rem;font-size:.85rem; }
.emergency-history-empty { display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.65rem;min-height:240px;padding:2rem 1.25rem;text-align:center; }
.emergency-history-empty-icon { display:grid;place-items:center;width:64px;height:64px;margin-bottom:.25rem;border-radius:50%;background:#edf6ef;color:#27854e;font-size:1.65rem; }
.emergency-history-empty > strong { color:#33483b;font-size:.95rem; }
.emergency-history-empty p { max-width:300px;margin:0;color:#64748b;font-size:.8rem;line-height:1.6; }
.emergency-history-empty a { font-size:.8rem; }
@media (max-width:575.98px) {
    .emergency-history-row { flex-wrap:wrap;gap:.5rem .65rem; }
    .emergency-history-row .transaction-main { flex-basis:calc(100% - 65px); }
    .emergency-history-row .transaction-main strong, .emergency-history-row .transaction-main small { white-space:normal;overflow-wrap:anywhere; }
    .emergency-history-row .transaction-meta { margin-left:calc(40px + .65rem);text-align:left; }
    .emergency-history-row .transaction-arrow { margin-left:auto; }
}
@media (max-width:359.98px) {
    .emergency-history-actions { align-items:stretch;flex-direction:column; }
    .emergency-history-active { align-self:flex-start; }
}
.transaction-list { border-radius: 8px; overflow: hidden; }
.emergency-history-list { border-radius:0; }
.transaction-row {
    min-height: 66px;
    padding: 0.65rem 0.75rem;
    border: 0;
    border-bottom: 1px solid #e2e8f0;
    background: #ffffff;
    display: flex;
    align-items: center;
    gap: 0.65rem;
    text-align: left;
}
.transaction-row:last-child { border-bottom: 0; }
.transaction-row-stacked { display: block; position: relative; padding-right: 2rem; }
.transaction-row-stacked .transaction-arrow { position: absolute; right: 0.75rem; top: 50%; transform: translateY(-50%); }
.transaction-row:hover,
.transaction-row:focus-visible { background: #f4f8f5; outline: 0; }
.transaction-leading { width: 36px; height: 36px; flex: 0 0 36px; border-radius: 8px; display: inline-flex; align-items: center; justify-content: center; }
.transaction-main { min-width: 0; flex: 1 1 auto; }
.transaction-main strong,
.transaction-main small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.transaction-main strong { color: var(--text-dark); font-size: 0.78rem; }
.transaction-main small,
.transaction-meta small { color: #64748b; font-size: 0.65rem; }
.transaction-meta { flex: 0 0 auto; text-align: right; }
.transaction-meta small { display: block; margin-top: 0.2rem; }
.transaction-meta .badge { font-size: 0.56rem; }
.transaction-arrow { color: #94a3b8; font-size: 0.65rem; }
.transaction-empty { min-height: 120px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 0.5rem; color: #64748b; font-size: 0.75rem; }
.staff-portal-header-icon { width: 36px; height: 36px; flex: 0 0 36px; display: inline-flex; align-items: center; justify-content: center; border: 1px solid rgba(255,255,255,.24); border-radius: 8px; background: rgba(255,255,255,.14); color: #fff; }
.staff-portal-summary { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); overflow: hidden; border: 1px solid #dce5df; border-radius: 8px; background: #fff; }
.staff-portal-summary > div { min-width: 0; padding: 0.65rem 0.7rem; border-right: 1px solid #e8eeea; }
.staff-portal-summary > div:last-child { border-right: 0; }
.staff-portal-summary-wide { grid-column: span 2; }
.staff-portal-summary small, .staff-portal-summary strong, .staff-portal-summary span { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.staff-portal-summary small { color: #748078; font-size: 0.6rem; }
.staff-portal-summary strong { margin-top: 0.12rem; color: #2f4135; font-size: 0.9rem; letter-spacing: 0; }
.staff-portal-summary span { color: #809087; font-size: 0.57rem; }
.staff-portal-section-title { color: #31513a; font-size: 0.78rem; font-weight: 750; letter-spacing: 0; }
.staff-portal-row { min-height: 72px; }
.staff-portal-purpose { max-width: min(52vw, 330px); }
.staff-portal-status { display: block; margin-top: 0.18rem; font-size: 0.58rem; font-weight: 700; }
.staff-portal-status.is-approved, .staff-portal-status.is-success { color: #198754; }
.staff-portal-status.is-pending, .staff-portal-status.is-warning { color: #997404; }
.staff-portal-status.is-info { color: #087990; }
.staff-portal-status.is-danger { color: #b02a37; }
@media (max-width: 420px) { .staff-portal-summary > div { padding: 0.55rem; } .staff-portal-summary strong { font-size: 0.78rem; } .staff-portal-purpose { max-width: 42vw; } }
.property-area-filter-menu { min-width: 220px; max-height: 280px; overflow: hidden; }
.property-area-options { max-height: 215px; overflow-y: auto; }
.property-area-option { display: flex; align-items: center; gap: 0.55rem; padding: 0.45rem 0.5rem; border-radius: 6px; color: #334155; font-size: 0.72rem; cursor: pointer; }
.property-area-option:hover { background: #f1f6f2; }
.property-area-option .form-check-input { flex: 0 0 auto; margin: 0; }
.organization-branding { padding-bottom: 1rem; border-bottom: 1px solid #e2e8f0; }
.organization-setting-heading { display: flex; align-items: center; gap: 0.65rem; }
.organization-setting-heading > span:last-child { min-width: 0; }
.organization-setting-heading strong,
.organization-setting-heading small { display: block; }
.organization-setting-heading strong { color: #26372c; font-size: 0.82rem; }
.organization-setting-heading small { color: #64748b; font-size: 0.65rem; }
.organization-setting-icon { width: 34px; height: 34px; flex: 0 0 34px; border-radius: 8px; background: #eaf4ec; color: var(--primary-green); display: inline-flex; align-items: center; justify-content: center; }
.organization-logo-preview { width: 88px; height: 88px; overflow: hidden; border: 1px solid #dbe4de; border-radius: 8px; background: #fff; color: var(--primary-green); display: flex; align-items: center; justify-content: center; font-size: 2rem; }
.organization-logo-preview img { display: block; width: 100%; height: 100%; padding: 4px; object-fit: contain; }
.organization-hero-main { display: flex; align-items: center; gap: 0.75rem; }
.organization-hero-logo { width: 48px; height: 48px; flex: 0 0 48px; display: flex; align-items: center; justify-content: center; overflow: hidden; border: 1px solid rgba(255,255,255,.45); border-radius: 8px; background: #fff; color: var(--primary-green); font-size: 1.25rem; }
.organization-hero-logo img { width: 100%; height: 100%; padding: 3px; object-fit: contain; }
.organization-summary { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); overflow: hidden; border: 1px solid #dce5df; border-radius: 8px; background: #fff; }
.organization-summary > div { min-width: 0; display: flex; align-items: center; gap: 0.55rem; padding: 0.7rem; border-right: 1px solid #e7ede9; }
.organization-summary > div:last-child { border-right: 0; }
.organization-summary > div > span { width: 30px; height: 30px; flex: 0 0 30px; display: inline-flex; align-items: center; justify-content: center; border-radius: 7px; background: #eaf4ec; color: var(--primary-green); }
.organization-summary > div > div { min-width: 0; }
.organization-summary small, .organization-summary strong { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.organization-summary small { color: #748078; font-size: 0.58rem; }
.organization-summary strong { color: #304137; font-size: 0.7rem; letter-spacing: 0; }
.organization-form-tabs { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border-bottom: 1px solid #dce5df; }
.organization-form-tabs button { min-width: 0; min-height: 50px; display: flex; align-items: center; justify-content: center; gap: 0.4rem; padding: 0.55rem 0.4rem; border: 1px solid #dce5df; border-bottom: 0; border-left: 0; background: #f6f8f7; color: #68756c; font-size: 0.7rem; font-weight: 700; }
.organization-form-tabs button:first-child { border-left: 1px solid #dce5df; border-top-left-radius: 8px; }
.organization-form-tabs button:last-child { border-top-right-radius: 8px; }
.organization-form-tabs button.active { background: #fff; color: var(--primary-green); box-shadow: inset 0 3px 0 var(--primary-green); }
.organization-form-tabs button:focus-visible { position: relative; z-index: 1; outline: 2px solid var(--primary-green); outline-offset: -2px; }
.organization-form-content { min-height: 355px; padding: 1rem; border-radius: 0; }
.organization-pane-heading { display: flex; align-items: center; gap: 0.65rem; margin-bottom: 1rem; padding-bottom: 0.75rem; border-bottom: 1px solid #edf1ee; }
.organization-pane-heading > span { width: 36px; height: 36px; flex: 0 0 36px; display: inline-flex; align-items: center; justify-content: center; border-radius: 8px; background: #eaf4ec; color: var(--primary-green); }
.organization-pane-heading h2 { margin: 0; color: #2e4034; font-size: 0.85rem; font-weight: 750; letter-spacing: 0; }
.organization-pane-heading p { margin: 0.1rem 0 0; color: #748078; font-size: 0.63rem; }
.organization-brand-editor { display: flex; align-items: center; gap: 1rem; }
.organization-logo-preview-large { width: 112px; height: 112px; flex: 0 0 112px; }
.organization-remove-logo { display: inline-flex; align-items: center; gap: 0.4rem; color: #7a4b4b; font-size: 0.66rem; cursor: pointer; }
.organization-remove-logo .form-check-input { margin: 0; }
.organization-form .form-label { margin-bottom: 0.3rem; color: #47564c; }
.organization-form .form-text { color: #7a857e; font-size: 0.62rem; }
.organization-form-actions { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 0.75rem 1rem; border-radius: 0 0 8px 8px; }
.organization-form-actions small { color: #748078; font-size: 0.62rem; }
@media (max-width: 767.98px) { .organization-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); } .organization-summary > div:nth-child(2) { border-right: 0; } .organization-summary > div:nth-child(-n+2) { border-bottom: 1px solid #e7ede9; } .organization-form-tabs button { flex-direction: column; gap: 0.15rem; font-size: 0.6rem; } .organization-form-content { min-height: 430px; } .organization-form-actions { align-items: stretch; flex-direction: column; } .organization-form-actions .btn { width: 100%; } }
@media (max-width: 420px) { .organization-brand-editor { align-items: stretch; flex-direction: column; } .organization-logo-preview-large { align-self: center; } }
.billing-admin-tabs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0.5rem; }
.billing-admin-tab { min-height: 48px; padding: 0.55rem 0.75rem; border: 1px solid #d9e2dc; border-radius: 8px; background: #fff; color: #64748b; display: flex; align-items: center; justify-content: center; gap: 0.5rem; font-size: 0.75rem; font-weight: 700; text-decoration: none; }
.billing-admin-tab:hover { border-color: var(--border-green); background: #f6faf7; color: var(--primary-green); }
.billing-admin-tab.active { border-color: var(--primary-green); background: var(--primary-green); color: #fff; }
.billing-template-components { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.45rem; }
.billing-template-components label { min-width: 0; display: flex; align-items: center; gap: 0.55rem; padding: 0.55rem; border: 1px solid #dfe7e1; border-radius: 7px; background: #f8faf9; cursor: pointer; }
.billing-template-components label:has(input:checked) { border-color: #72a780; background: #edf7ef; }
.billing-template-components input { flex: 0 0 auto; margin: 0; }
.billing-template-components .billing-template-amount { width: 7.25rem; margin-left: auto; }
.billing-template-components span { min-width: 0; }
.billing-template-components strong, .billing-template-components small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.billing-template-components strong { color: #33443a; font-size: 0.7rem; }
.billing-template-components small { color: #748078; font-size: 0.6rem; }
.billing-template-actions { display: flex; align-items: center; justify-content: space-between; gap: 0.75rem; }
@media (max-width: 575.98px) { .billing-admin-tab { flex-direction: column; gap: 0.2rem; font-size: 0.65rem; } .billing-template-components { grid-template-columns: 1fr; } }
.billing-section-heading { color: var(--primary-green); font-size: 0.85rem; font-weight: 750; letter-spacing: 0; }
.billing-inline-form { border-radius: 8px; }
.billing-period-row { min-height: 88px; }
.billing-period-main { min-width: 0; flex: 1 1 auto; }
.billing-period-title { display: flex; align-items: center; gap: 0.45rem; min-width: 0; }
.billing-period-title strong { overflow: hidden; color: var(--text-dark); font-size: 0.78rem; text-overflow: ellipsis; white-space: nowrap; }
.billing-period-title .badge { flex: 0 0 auto; font-size: 0.54rem; }
.billing-period-main > small { display: block; margin-top: 0.15rem; overflow: hidden; color: #64748b; font-size: 0.63rem; text-overflow: ellipsis; white-space: nowrap; }
.billing-period-progress { display: block; width: min(220px, 100%); height: 4px; margin-top: 0.4rem; overflow: hidden; border-radius: 4px; background: #e2e8f0; }
.billing-period-progress > span { display: block; height: 100%; background: #198754; }
.billing-period-stats { flex: 0 0 auto; display: grid; grid-template-columns: repeat(3, minmax(88px, 1fr)); gap: 0.45rem; }
.billing-period-stats > span { min-width: 0; padding-left: 0.55rem; border-left: 1px solid #e2e8f0; }
.billing-period-stats small,
.billing-period-stats strong { display: block; overflow: hidden; text-align: right; text-overflow: ellipsis; white-space: nowrap; }
.billing-period-stats small { color: #64748b; font-size: 0.57rem; }
.billing-period-stats strong { margin-top: 0.12rem; color: #334155; font-size: 0.68rem; }
.billing-component-row { color: inherit; }
.billing-component-toggle { position: absolute; left: 1rem; bottom: 1rem; z-index: 2; }
.billing-period-stat { min-height: 68px; padding: 0.6rem 0.7rem; overflow: hidden; border: 1px solid #dfe7e1; border-top: 3px solid #64748b; border-radius: 8px; background: #fff; display: flex; flex-direction: column; justify-content: space-between; }
.billing-period-stat small { color: #64748b; font-size: 0.64rem; }
.billing-period-stat strong { overflow: hidden; color: #26372c; font-size: 0.9rem; letter-spacing: 0; text-overflow: ellipsis; white-space: nowrap; }
.billing-period-stat-paid { border-top-color: #198754; }
.billing-period-stat-paid strong { color: #198754; }
.billing-period-stat-due { border-top-color: #dc3545; }
.billing-period-stat-due strong { color: #dc3545; }
.billing-payment-progress { padding: 0.65rem 0.75rem; border-radius: 8px; }
.billing-payment-progress > span { display: block; margin-bottom: 0.4rem; color: #64748b; font-size: 0.67rem; }
.billing-payment-progress > span strong { color: var(--primary-green); font-size: 0.85rem; }
.billing-payment-progress .progress { height: 6px; }
.billing-snapshot-list { overflow: hidden; border-radius: 8px; }
.billing-snapshot-row { min-height: 52px; padding: 0.55rem 0.7rem; border-bottom: 1px solid #edf1ee; display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.billing-snapshot-row:last-child { border-bottom: 0; }
.billing-snapshot-row > span { min-width: 0; }
.billing-snapshot-row strong,
.billing-snapshot-row small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.billing-snapshot-row strong { color: #26372c; font-size: 0.75rem; }
.billing-snapshot-row small { color: #64748b; font-size: 0.62rem; }
.billing-snapshot-row > strong { flex: 0 0 auto; }
@media (max-width: 767.98px) {
    .billing-period-row { min-height: 0; padding: 0.55rem; display: grid; grid-template-columns: 34px minmax(0, 1fr) 10px; gap: 0.45rem; }
    .billing-period-row .transaction-leading { width: 34px; height: 34px; flex-basis: 34px; }
    .billing-period-row .transaction-arrow { grid-column: 3; grid-row: 1; align-self: center; }
    .billing-period-stats { grid-column: 2 / 4; grid-row: 2; width: 100%; gap: 0; padding-top: 0.4rem; border-top: 1px solid #edf1ee; }
    .billing-period-stats > span { padding: 0 0.35rem; border-left: 1px solid #edf1ee; }
    .billing-period-stats > span:first-child { padding-left: 0; border-left: 0; }
    .billing-period-stats small { font-size: 0.54rem; text-align: left; }
    .billing-period-stats strong { font-size: 0.61rem; text-align: left; }
    .billing-period-progress { width: 100%; }
    .billing-component-toggle { position: static; margin: 0 1rem 1rem; }
}

/* Payroll settings */
.payroll-settings-page { --payroll-border: #dce6df; --payroll-ink: #304238; --payroll-muted: #758179; }
.payroll-overview-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0.65rem; }
.payroll-overview-card { min-width: 0; min-height: 72px; display: flex; align-items: center; gap: 0.7rem; padding: 0.75rem; border: 1px solid var(--payroll-border); border-radius: 10px; background: #fff; box-shadow: 0 3px 12px rgba(32, 66, 42, 0.04); }
.payroll-overview-icon { width: 38px; height: 38px; flex: 0 0 38px; display: inline-flex; align-items: center; justify-content: center; border-radius: 9px; }
.payroll-overview-card span:last-child { min-width: 0; }
.payroll-overview-card small, .payroll-overview-card strong { display: block; }
.payroll-overview-card small { overflow: hidden; color: var(--payroll-muted); font-size: 0.61rem; text-overflow: ellipsis; white-space: nowrap; }
.payroll-overview-card strong { color: var(--payroll-ink); font-size: 1.05rem; line-height: 1.2; }
.payroll-tip { display: flex; align-items: flex-start; gap: 0.7rem; padding: 0.75rem 0.85rem; border: 1px solid #d8e5dc; border-radius: 10px; background: linear-gradient(135deg, #f5faf6, #fff); color: var(--payroll-ink); }
.payroll-tip-icon { width: 30px; height: 30px; flex: 0 0 30px; display: inline-flex; align-items: center; justify-content: center; border-radius: 8px; background: #fff2c7; color: #9a6900; }
.payroll-tip strong, .payroll-tip small { display: block; }
.payroll-tip strong { margin-bottom: 0.1rem; font-size: 0.72rem; }
.payroll-tip small { color: #68766d; font-size: 0.63rem; line-height: 1.5; }
.payroll-section-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 0.75rem; margin-bottom: 0.7rem; }
.payroll-section-heading h5 { margin: 0 0 0.1rem; color: var(--payroll-ink); font-size: 0.86rem; font-weight: 750; }
.payroll-section-heading p { margin: 0; color: var(--payroll-muted); font-size: 0.63rem; }
.payroll-editor-card { padding: 1rem; border: 1px solid #cfe0d3; border-radius: 11px; background: #fff; box-shadow: 0 5px 20px rgba(31, 72, 43, 0.06); }
.payroll-editor-card .form-label, .payroll-template-card .form-label, .payroll-modal-header + .modal-body .form-label { margin-bottom: 0.28rem; color: #46564c; font-size: 0.66rem; font-weight: 700; }
.payroll-editor-title { display: flex; align-items: center; gap: 0.65rem; padding-bottom: 0.75rem; margin-bottom: 0.8rem; border-bottom: 1px solid #edf1ee; }
.payroll-editor-title > span { width: 34px; height: 34px; flex: 0 0 34px; display: inline-flex; align-items: center; justify-content: center; border-radius: 9px; background: #e7f3ea; color: #28713b; }
.payroll-editor-title strong, .payroll-editor-title small { display: block; }
.payroll-editor-title strong { color: var(--payroll-ink); font-size: 0.76rem; }
.payroll-editor-title small { color: var(--payroll-muted); font-size: 0.61rem; }
.payroll-editor-actions { display: flex; justify-content: flex-end; gap: 0.5rem; padding-top: 0.9rem; margin-top: 0.9rem; border-top: 1px solid #edf1ee; }
.payroll-component-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.65rem; }
.payroll-component-card { width: 100%; min-width: 0; display: grid; grid-template-columns: 40px minmax(0, 1fr) auto; align-items: center; gap: 0.7rem; padding: 0.8rem; border: 1px solid var(--payroll-border); border-radius: 10px; background: #fff; color: inherit; text-align: left; box-shadow: 0 3px 12px rgba(32, 66, 42, 0.04); transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease; }
.payroll-component-card:hover { border-color: #9fc2a8; box-shadow: 0 7px 20px rgba(32, 66, 42, 0.09); transform: translateY(-1px); }
.payroll-component-card.is-inactive { opacity: 0.68; }
.payroll-component-icon { width: 40px; height: 40px; display: inline-flex; align-items: center; justify-content: center; border-radius: 10px; font-size: 0.85rem; }
.payroll-component-icon.is-earning { background: #e7f5ea; color: #23713a; }
.payroll-component-icon.is-deduction { background: #fce9e9; color: #b13a3a; }
.payroll-component-content { min-width: 0; }
.payroll-component-content > strong, .payroll-component-content > small, .payroll-component-rule { display: block; }
.payroll-component-content > strong { overflow: hidden; margin: 0.16rem 0 0.05rem; color: var(--payroll-ink); font-size: 0.72rem; text-overflow: ellipsis; white-space: nowrap; }
.payroll-component-content > small { overflow: hidden; color: #89938d; font-size: 0.56rem; text-overflow: ellipsis; white-space: nowrap; }
.payroll-component-badges { display: flex; gap: 0.3rem; }
.payroll-component-badges em { padding: 0.14rem 0.34rem; border-radius: 999px; font-size: 0.51rem; font-style: normal; font-weight: 700; }
.payroll-component-rule { overflow: hidden; margin-top: 0.32rem; color: #69766e; font-size: 0.58rem; text-overflow: ellipsis; white-space: nowrap; }
.payroll-component-rule i { width: 14px; color: #8a958e; }
.payroll-component-side { min-width: 92px; text-align: right; }
.payroll-component-side strong, .payroll-component-side small { display: block; }
.payroll-component-side strong { color: var(--payroll-ink); font-size: 0.66rem; }
.payroll-component-side small { color: var(--payroll-muted); font-size: 0.55rem; }
.payroll-component-side i { margin-top: 0.35rem; color: #91a098; font-size: 0.58rem; }
.payroll-modal-header { border: 0; background: linear-gradient(135deg, #26713b, #38934e); color: #fff; }
.payroll-modal-header small { display: block; color: rgba(255,255,255,.72); font-size: 0.58rem; }
.payroll-code-chip { display: inline-flex; align-items: center; gap: 0.25rem; max-width: 100%; padding: 0.32rem 0.5rem; border-radius: 6px; background: #f0f4f1; color: #68756d; font-size: 0.6rem; }
.payroll-code-chip span { color: #a4ada7; }
.payroll-subheading { display: flex; align-items: center; justify-content: space-between; gap: 0.5rem; margin-bottom: 0.55rem; }
.payroll-subheading span { color: var(--payroll-ink); font-size: 0.7rem; font-weight: 750; }
.payroll-subheading small { color: var(--payroll-muted); font-size: 0.57rem; }
.payroll-template-component-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.55rem; }
.payroll-template-component { min-width: 0; display: grid; grid-template-columns: minmax(0, 1fr) minmax(120px, .55fr); align-items: center; gap: 0.65rem; padding: 0.65rem; border: 1px solid #e0e7e2; border-radius: 8px; background: #fafcfb; transition: border-color .18s ease, background .18s ease; }
.payroll-template-component.is-selected { border-color: #9fcaaa; background: #eef8f0; box-shadow: inset 3px 0 #2f8243; }
.payroll-template-component.is-disabled { opacity: 0.6; }
.payroll-template-component-head { min-width: 0; display: flex; align-items: center; gap: 0.5rem; cursor: pointer; }
.payroll-template-component-head > span { min-width: 0; }
.payroll-template-component-head strong, .payroll-template-component-head small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.payroll-template-component-head strong { color: var(--payroll-ink); font-size: 0.64rem; }
.payroll-template-component-head small { color: var(--payroll-muted); font-size: 0.53rem; }
.payroll-template-list { display: grid; gap: 0.65rem; }
.payroll-template-card { overflow: hidden; border: 1px solid var(--payroll-border) !important; border-radius: 10px !important; background: #fff; box-shadow: 0 3px 12px rgba(32, 66, 42, 0.04); }
.payroll-template-card .accordion-button { display: grid; grid-template-columns: 40px minmax(0, 1fr) auto 16px; gap: 0.7rem; padding: 0.8rem; background: #fff; box-shadow: none; color: inherit; }
.payroll-template-card .accordion-button::after { grid-column: 4; grid-row: 1; width: 14px; height: 14px; margin: auto; background-size: 14px; }
.payroll-template-card .accordion-button:not(.collapsed) { background: #f6faf7; color: inherit; box-shadow: inset 0 -1px #e2e9e4; }
.payroll-template-symbol { width: 40px; height: 40px; display: inline-flex; align-items: center; justify-content: center; border-radius: 10px; background: #e7f3ea; color: #28713b; }
.payroll-template-symbol.is-inactive { background: #eff1f0; color: #7c8780; }
.payroll-template-summary { min-width: 0; }
.payroll-template-summary strong, .payroll-template-summary small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.payroll-template-summary strong { color: var(--payroll-ink); font-size: 0.73rem; }
.payroll-template-summary small { color: var(--payroll-muted); font-size: 0.57rem; }
.payroll-template-metrics { display: flex; align-items: center; gap: 0.85rem; }
.payroll-template-metrics > span { min-width: 46px; text-align: center; }
.payroll-template-metrics b, .payroll-template-metrics small { display: block; }
.payroll-template-metrics b { color: var(--payroll-ink); font-size: 0.69rem; }
.payroll-template-metrics small { color: var(--payroll-muted); font-size: 0.51rem; font-weight: 500; }
.payroll-template-metrics em { padding: 0.2rem 0.42rem; border-radius: 999px; background: #f0f2f1; color: #758079; font-size: 0.53rem; font-style: normal; font-weight: 700; }
.payroll-template-metrics em.is-active { background: #e7f5ea; color: #26713b; }
.payroll-template-card .accordion-body { padding: 1rem; background: #fff; }
.payroll-lock-note { display: flex; align-items: flex-start; gap: 0.45rem; padding: 0.55rem 0.65rem; margin-bottom: 0.8rem; border: 1px solid #ebe2be; border-radius: 7px; background: #fffbeb; color: #76652d; font-size: 0.59rem; }
.payroll-lock-note i { margin-top: 0.08rem; }
.payroll-template-footer { display: flex; align-items: flex-end; justify-content: space-between; gap: 0.75rem; padding-top: 0.9rem; margin-top: 0.9rem; border-top: 1px solid #edf1ee; }
.payroll-status-field { width: min(230px, 50%); }

@media (max-width: 767.98px) {
    .payroll-component-grid, .payroll-template-component-grid { grid-template-columns: 1fr; }
    .payroll-template-metrics > span { display: none; }
}
@media (max-width: 575.98px) {
    .payroll-overview-grid { gap: 0.4rem; }
    .payroll-overview-card { min-height: 58px; justify-content: center; padding: 0.5rem 0.35rem; text-align: center; }
    .payroll-overview-icon { display: none; }
    .payroll-overview-card small { font-size: 0.52rem; }
    .payroll-overview-card strong { font-size: 0.88rem; }
    .payroll-section-heading p { max-width: 235px; }
    .payroll-component-card { grid-template-columns: 36px minmax(0, 1fr) auto; gap: 0.55rem; padding: 0.7rem; }
    .payroll-component-icon { width: 36px; height: 36px; }
    .payroll-component-side { min-width: 70px; }
    .payroll-template-card .accordion-button { grid-template-columns: 36px minmax(0, 1fr) auto 14px; gap: 0.55rem; padding: 0.7rem; }
    .payroll-template-symbol { width: 36px; height: 36px; }
    .payroll-template-metrics { gap: 0.3rem; }
    .payroll-template-metrics em { padding: 0.16rem 0.3rem; font-size: 0.48rem; }
    .payroll-template-card .accordion-body, .payroll-editor-card { padding: 0.8rem; }
    .payroll-template-component { grid-template-columns: 1fr; gap: 0.5rem; }
    .payroll-template-footer { align-items: stretch; flex-direction: column; }
    .payroll-status-field { width: 100%; }
    .payroll-template-footer .btn { width: 100%; }
}

.financial-report-filter { border-radius: 8px; }
.financial-report-mode { display: flex; flex-direction: column; }
.financial-report-mode > * { order: 6; }
.financial-report-mode > .hero-banner { order: 1; }
.financial-report-mode > .financial-report-toolbar { order: 2; }
.financial-report-mode > .report-type-selector { order: 3; }
.financial-report-mode > .report-official-header { order: 4; display: none; }
.financial-report-mode > .financial-report-filter { order: 5; }
.report-type-selector { padding: 0.55rem; border: 1px solid #dfe7e1; border-radius: 8px; background: #fff; }
.mode-cash [aria-labelledby="financialSummaryHeading"], .mode-cash [aria-labelledby="statisticsHeading"], .mode-cash [aria-labelledby="clusterHeading"], .mode-cash [aria-labelledby="monthlyHeading"], .mode-cash [aria-labelledby="annualHeading"] { display: none; }
.mode-non_ipl [aria-labelledby="financialSummaryHeading"], .mode-non_ipl [aria-labelledby="statisticsHeading"], .mode-non_ipl [aria-labelledby="clusterHeading"], .mode-non_ipl [aria-labelledby="monthlyHeading"], .mode-non_ipl [aria-labelledby="annualHeading"], .mode-non_ipl [aria-labelledby="positionHeading"], .mode-non_ipl [aria-labelledby="cashHeading"], .mode-non_ipl [aria-labelledby="cashTransactionHeading"] { display: none; }
@media print { .financial-report-mode > .report-official-header { display: grid !important; } }
.financial-report-toolbar { display: flex; align-items: center; gap: 0.5rem; margin-bottom: 0.6rem; }
.report-theme-header ~ .report-official-header { display: none; }
.report-theme-header + .d-flex.d-print-none { display: none !important; }
.report-theme-header ~ .report-export-toolbar + .d-flex.d-print-none { display: none !important; }
.cluster-native-select { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0, 0, 0, 0) !important; white-space: nowrap !important; border: 0 !important; }
.cluster-multiselect { position: relative; }
.cluster-multiselect > summary { display: flex; align-items: center; justify-content: space-between; min-height: 31px; padding: 0.3rem 0.55rem; border: 1px solid #dee2e6; border-radius: 0.25rem; background: #fff; color: #34463a; font-size: 0.78rem; cursor: pointer; list-style: none; }
.cluster-multiselect > summary::-webkit-details-marker { display: none; }
.cluster-multiselect > summary i { color: #748078; font-size: 0.65rem; transition: transform 0.15s ease; }
.cluster-multiselect[open] > summary i { transform: rotate(180deg); }
.cluster-multiselect-menu { position: absolute; z-index: 20; top: calc(100% + 0.25rem); right: 0; left: 0; max-height: 230px; overflow-y: auto; padding: 0.35rem; border: 1px solid #d9e2dc; border-radius: 0.4rem; background: #fff; box-shadow: 0 8px 24px rgba(30, 55, 37, 0.14); }
.cluster-multiselect-menu label { display: flex; align-items: center; gap: 0.5rem; padding: 0.42rem 0.5rem; border-radius: 0.3rem; color: #425248; font-size: 0.78rem; cursor: pointer; }
.cluster-multiselect-menu label:hover { background: #f1f7f3; }
.cluster-multiselect-menu input { width: 1rem; height: 1rem; accent-color: #215e32; }
.cluster-multiselect.is-invalid > summary { border-color: #dc3545; box-shadow: 0 0 0 0.15rem rgba(220, 53, 69, 0.12); }
.report-official-header { display: grid; grid-template-columns: 68px minmax(0, 1fr) minmax(170px, auto); align-items: center; gap: 0.85rem; padding: 0.9rem 1rem; border: 1px solid #d9e2dc; border-bottom: 3px solid #286e3b; border-radius: 8px; background: #fff; }
.report-official-header > img, .report-official-logo { width: 58px; height: 58px; object-fit: contain; }
.report-official-logo { display: inline-flex; align-items: center; justify-content: center; border-radius: 7px; background: #e9f2eb; color: #286e3b; font-size: 1.35rem; }
.report-official-identity, .report-official-title { min-width: 0; }
.report-official-identity strong, .report-official-identity span, .report-official-identity small, .report-official-title strong, .report-official-title span, .report-official-title small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.report-official-identity strong { color: #215e32; font-size: 1rem; }
.report-official-identity span { margin-top: 0.12rem; color: #4f5f55; font-size: 0.67rem; font-weight: 650; }
.report-official-identity small { margin-top: 0.12rem; color: #78847c; font-size: 0.58rem; }
.report-official-title { padding-left: 1rem; border-left: 1px solid #dfe7e1; text-align: right; }
.report-official-title strong { color: #293b30; font-size: 0.85rem; text-transform: uppercase; }
.report-official-title span { color: #477151; font-size: 0.67rem; font-weight: 700; }
.report-official-title small { color: #78847c; font-size: 0.6rem; }
.financial-report-filter .form-label { margin-bottom: 0.2rem; color: #5d6c62; font-size: 0.64rem; }
.financial-report-heading { color: #2d4134; font-size: 0.86rem; font-weight: 750; letter-spacing: 0; }
.financial-report-summary { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); overflow: hidden; border: 1px solid #dfe7e1; border-radius: 8px; background: #fff; }
.financial-report-summary > div { position: relative; min-width: 0; min-height: 82px; padding: 0.7rem 0.75rem 0.65rem 3.25rem; border-right: 1px solid #e7ede9; border-bottom: 1px solid #e7ede9; }
.financial-report-summary > div:nth-child(3n) { border-right: 0; }
.financial-report-summary > div:nth-last-child(-n+3) { border-bottom: 0; }
.financial-report-summary small, .financial-report-summary strong { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.financial-report-summary small { color: #748078; font-size: 0.61rem; }
.financial-report-summary strong { margin-top: 0.28rem; color: #293b30; font-size: clamp(0.72rem, 1.6vw, 0.96rem); letter-spacing: 0; }
.financial-report-icon { position: absolute; top: 0.75rem; left: 0.72rem; width: 36px; height: 36px; display: inline-flex; align-items: center; justify-content: center; border-radius: 7px; font-size: 0.9rem; }
.financial-collection-progress { height: 5px; overflow: hidden; margin: -1px 5px 0; border-radius: 0 0 5px 5px; background: #e9eeeb; }
.financial-collection-progress span { display: block; height: 100%; background: #2f7d3e; }
.financial-health-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); overflow: hidden; border: 1px solid #dfe7e1; border-radius: 8px; background: #fff; }
.financial-health-grid > div { min-width: 0; display: flex; align-items: center; gap: 0.65rem; min-height: 82px; padding: 0.7rem; border-right: 1px solid #e7ede9; }
.financial-health-grid > div:last-child { border-right: 0; }
.financial-health-grid > div > span:last-child { min-width: 0; }
.financial-health-grid small, .financial-health-grid > div > span:last-child strong { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.financial-health-grid small { color: #748078; font-size: 0.58rem; }
.financial-health-grid > div > span:last-child strong { margin-top: 0.18rem; color: #33443a; font-size: 0.67rem; }
.financial-health-ring { --value: 0; width: 48px; height: 48px; flex: 0 0 48px; display: inline-flex; align-items: center; justify-content: center; position: relative; border-radius: 50%; background: conic-gradient(#2f7d3e calc(var(--value) * 1%), #e4eae6 0); }
.financial-health-ring::after { content: ''; position: absolute; inset: 5px; border-radius: 50%; background: #fff; }
.financial-health-ring strong { position: relative; z-index: 1; color: #2f5d39; font-size: 0.62rem; }
.financial-health-ring.is-danger { background: conic-gradient(#b13a3a calc(var(--value) * 1%), #e4eae6 0); }
.financial-health-ring.is-danger strong { color: #9a3333; }
.financial-health-ring.is-warning { background: conic-gradient(#cb8c17 calc(var(--value) * 1%), #e4eae6 0); }
.financial-health-ring.is-warning strong { color: #8a620b; }
.financial-health-icon { width: 48px; height: 48px; flex: 0 0 48px; display: inline-flex; align-items: center; justify-content: center; border-radius: 7px; background: #e8eff6; color: #32628b; font-size: 1rem; }
.financial-position-band { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr) auto minmax(0, 1fr) auto minmax(0, 1.15fr); align-items: center; gap: 0.65rem; padding: 0.8rem; border: 1px solid #dce6df; border-radius: 8px; background: #fff; }
.financial-position-band > div { min-width: 0; }
.financial-position-band small, .financial-position-band strong { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.financial-position-band small { color: #758279; font-size: 0.61rem; }
.financial-position-band strong { margin-top: 0.18rem; color: #33443a; font-size: 0.78rem; }
.financial-position-result { padding: 0.55rem 0.65rem; border-left: 3px solid #2f7d3e; border-radius: 6px; background: #f0f7f2; }
.financial-pending-strip { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; align-items: center; gap: 0.7rem; margin-top: 0.45rem; padding: 0.55rem 0.7rem; border: 1px solid #ead7a4; border-radius: 7px; background: #fff9e8; color: #75560e; font-size: 0.68rem; }
.financial-cluster-list { overflow: hidden; border-radius: 8px; }
.financial-cluster-row { display: flex; align-items: center; gap: 0.7rem; min-height: 78px; padding: 0.65rem 0.75rem; border-bottom: 1px solid #e8ede9; }
.financial-cluster-row:last-child { border-bottom: 0; }
.financial-cluster-numbers { display: grid; grid-template-columns: repeat(3, minmax(100px, 1fr)); gap: 1rem; margin-left: auto; text-align: right; }
.financial-cluster-numbers small, .financial-cluster-numbers strong { display: block; white-space: nowrap; }
.financial-cluster-numbers small { color: #7a867e; font-size: 0.58rem; }
.financial-cluster-numbers strong { color: #33443a; font-size: 0.69rem; }
.financial-mini-progress { display: block; width: 100%; max-width: 170px; height: 4px; margin-top: 0.4rem; overflow: hidden; border-radius: 4px; background: #e5ebe7; }
.financial-mini-progress span { display: block; height: 100%; background: #39824a; }
.financial-monthly-table { overflow: hidden; border-radius: 8px; }
.financial-monthly-head, .financial-monthly-row { display: grid; grid-template-columns: 70px repeat(4, minmax(120px, 1fr)); align-items: center; column-gap: 0.8rem; padding: 0 0.75rem; }
.financial-monthly-table.is-billing-only .financial-monthly-head, .financial-monthly-table.is-billing-only .financial-monthly-row { grid-template-columns: 70px repeat(2, minmax(140px, 1fr)); }
.financial-monthly-head { min-height: 34px; background: #f3f6f4; color: #66746b; font-size: 0.6rem; font-weight: 700; text-transform: uppercase; }
.financial-monthly-row { min-width: 630px; min-height: 42px; border-top: 1px solid #edf1ee; color: #445148; font-size: 0.65rem; }
.financial-monthly-row.is-selected { background: #eff7f1; box-shadow: inset 3px 0 #2f7d3e; }
.financial-monthly-row > span { position: relative; z-index: 0; overflow: hidden; padding: 0.3rem; white-space: nowrap; }
.financial-data-bar { position: absolute; inset: 0 auto 0 0; z-index: -1; opacity: 0.11; }
.financial-data-bar.billed { background: #2874a6; }
.financial-data-bar.paid { background: #2f7d3e; }
.financial-annual-table th, .financial-annual-table td { padding: 0.55rem 0.65rem; border-color: #e8ede9; font-size: 0.66rem; white-space: nowrap; }
.financial-annual-table thead th { background: #f3f6f4; color: #657269; font-size: 0.59rem; text-transform: uppercase; }
.financial-category-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.5rem; }
.financial-category-row { min-width: 0; display: flex; align-items: center; gap: 0.65rem; min-height: 68px; padding: 0.6rem 0.7rem; border: 1px solid #e0e7e2; border-radius: 8px; background: #fff; }
.financial-category-row > strong { margin-left: auto; font-size: 0.7rem; white-space: nowrap; }

@media (max-width: 767.98px) {
    .financial-report-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .report-official-header { grid-template-columns: 50px minmax(0, 1fr); padding: 0.7rem; }
    .report-official-header > img, .report-official-logo { width: 44px; height: 44px; }
    .report-official-title { grid-column: 1 / -1; padding: 0.55rem 0 0; border-top: 1px solid #e5ebe7; border-left: 0; text-align: left; }
    .financial-health-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .financial-health-grid > div:nth-child(2n) { border-right: 0; }
    .financial-health-grid > div:nth-child(-n+2) { border-bottom: 1px solid #e7ede9; }
    .financial-report-summary > div:nth-child(3n) { border-right: 1px solid #e7ede9; }
    .financial-report-summary > div:nth-child(2n) { border-right: 0; }
    .financial-report-summary > div:nth-last-child(-n+3) { border-bottom: 1px solid #e7ede9; }
    .financial-report-summary > div:nth-last-child(-n+2) { border-bottom: 0; }
    .financial-position-band { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0; padding: 0; overflow: hidden; }
    .financial-position-band > i { display: none; }
    .financial-position-band > div { padding: 0.65rem; border-right: 1px solid #e7ede9; border-bottom: 1px solid #e7ede9; }
    .financial-position-band > div:nth-of-type(2n) { border-right: 0; }
    .financial-position-band > div:nth-last-of-type(-n+2) { border-bottom: 0; }
    .financial-position-result { border-left: 0; border-radius: 0; }
    .financial-cluster-row { align-items: flex-start; flex-wrap: wrap; }
    .financial-cluster-row > .transaction-main { width: calc(100% - 48px); }
    .financial-cluster-numbers { width: 100%; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0.35rem; margin-left: 0; padding-top: 0.5rem; border-top: 1px dashed #e0e7e2; text-align: left; }
    .financial-cluster-numbers strong { overflow: hidden; font-size: 0.62rem; text-overflow: ellipsis; }
    .financial-monthly-table { overflow-x: auto; }
    .financial-monthly-head { min-width: 630px; }
    .financial-monthly-table.is-billing-only .financial-monthly-head, .financial-monthly-table.is-billing-only .financial-monthly-row { min-width: 430px; }
    .financial-category-grid { grid-template-columns: 1fr; }
}

@media print {
    .report-official-header { border-top: 0; border-right: 0; border-left: 0; border-radius: 0; }
    .financial-report-summary, .financial-health-grid, .financial-position-band, .financial-cluster-list, .financial-monthly-table, .financial-category-row, .financial-annual-table { break-inside: avoid; box-shadow: none !important; }
}
.billing-payment-action { border-radius: 8px; }
.billing-payment-icon { width: 34px; height: 34px; flex: 0 0 34px; border-radius: 8px; display: inline-flex; align-items: center; justify-content: center; }
.billing-account-panel { overflow: hidden; border-radius: 8px; }
.billing-account-heading { display: flex; align-items: center; justify-content: space-between; gap: 0.75rem; padding: 0.65rem 0.75rem; border-bottom: 1px solid #e3e9e5; background: #f6f9f7; color: #344139; font-size: 0.75rem; font-weight: 700; }
.billing-account-heading .badge { font-size: 0.58rem; }
.billing-account-item { display: flex; align-items: center; gap: 0.65rem; padding: 0.75rem; border-bottom: 1px solid #edf1ee; }
.billing-account-item:last-child { border-bottom: 0; }
.billing-account-logo { width: 36px; height: 36px; flex: 0 0 36px; border-radius: 8px; display: inline-flex; align-items: center; justify-content: center; background: #eaf4ec; color: var(--primary-green); }
.billing-account-main { min-width: 0; flex: 1 1 auto; }
.billing-account-main small,
.billing-account-main strong,
.billing-account-main span { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.billing-account-main small { color: #758078; font-size: 0.65rem; }
.billing-account-main strong { margin: 0.05rem 0; color: #26372c; font-size: 1rem; letter-spacing: 0; }
.billing-account-main span { color: #66736b; font-size: 0.66rem; }
.billing-account-copy { width: 36px; height: 36px; flex: 0 0 36px; padding: 0; border-radius: 8px; }
.billing-account-empty { display: flex; align-items: center; gap: 0.5rem; padding: 0.8rem; color: #66736b; font-size: 0.72rem; }
.billing-detail-kicker { display:block;margin-bottom:.15rem;color:rgba(255,255,255,.68);font-size:.58rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em; }
.billing-detail-status { flex:0 0 auto;display:inline-flex;align-items:center;gap:.4rem;padding:.38rem .6rem;border-radius:999px;font-size:.62rem;font-weight:800;box-shadow:0 4px 12px rgba(0,0,0,.12); }
.billing-detail-navigation { min-height:34px;display:flex;justify-content:space-between;gap:.6rem; }.billing-detail-navigation .btn { border-color:#c5d9cb;background:rgba(255,255,255,.84);border-radius:9px;font-size:.64rem;font-weight:700; }
.billing-detail-overview { overflow:hidden;border:1px solid #d5e3d9;border-radius:12px;background:rgba(255,255,255,.95);box-shadow:0 6px 18px rgba(26,83,44,.07); }
.billing-detail-balance { display:flex;align-items:center;gap:.75rem;padding:1rem; }.billing-detail-balance-icon { width:44px;height:44px;flex:0 0 44px;display:grid;place-items:center;border-radius:11px;font-size:1rem; }.billing-detail-balance>div { min-width:0; }.billing-detail-balance small,.billing-detail-balance strong,.billing-detail-balance span { display:block; }.billing-detail-balance small { color:#748078;font-size:.6rem; }.billing-detail-balance strong { margin:.08rem 0;font-size:1.25rem;line-height:1.15; }.billing-detail-balance span { color:#849087;font-size:.56rem; }
.billing-detail-progress { height:5px;background:#edf2ee; }.billing-detail-progress>span { display:block;height:100%;background:linear-gradient(90deg,#198754,#59ae72); }
.billing-detail-facts { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid #edf1ee; }.billing-detail-facts>div { min-width:0;display:flex;align-items:center;gap:.5rem;padding:.7rem;border-right:1px solid #edf1ee; }.billing-detail-facts>div:last-child { border-right:0; }.billing-detail-facts i { color:#4d7659;font-size:.72rem; }.billing-detail-facts span { min-width:0; }.billing-detail-facts small,.billing-detail-facts strong { display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }.billing-detail-facts small { color:#829087;font-size:.52rem; }.billing-detail-facts strong { margin-top:.08rem;color:#34483b;font-size:.62rem; }.billing-detail-facts .is-overdue i,.billing-detail-facts .is-overdue small,.billing-detail-facts .is-overdue strong { color:#c43d49; }
.billing-detail-items { overflow:hidden;border:1px solid #d8e4dc;border-radius:12px;background:rgba(255,255,255,.95);box-shadow:0 5px 16px rgba(26,83,44,.055); }.billing-detail-section-heading { padding:.8rem .9rem;border-bottom:1px solid #e3ebe5;background:#f5faf6; }.billing-detail-section-heading>span { display:flex;align-items:center;gap:.6rem; }.billing-detail-section-heading>span>i { width:32px;height:32px;display:grid;place-items:center;border-radius:8px;background:#dff1e5;color:#176b3a;font-size:.72rem; }.billing-detail-section-heading strong,.billing-detail-section-heading small { display:block; }.billing-detail-section-heading strong { color:#31513a;font-size:.72rem; }.billing-detail-section-heading small { color:#7b8980;font-size:.55rem; }
.billing-detail-item { min-height:52px;display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.65rem .9rem;border-bottom:1px solid #edf2ee; }.billing-detail-item>span { min-width:0; }.billing-detail-item strong,.billing-detail-item small { display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }.billing-detail-item strong { color:#34463b;font-size:.68rem; }.billing-detail-item small { color:#87928b;font-size:.54rem; }.billing-detail-item b { flex:0 0 auto;color:#31483a;font-size:.68rem; }
.billing-detail-totals { padding:.55rem .9rem;background:#fbfdfb; }.billing-detail-totals>div { display:flex;justify-content:space-between;gap:1rem;padding:.35rem 0;color:#68766d;font-size:.64rem; }.billing-detail-totals .is-outstanding { margin:.35rem -.9rem -.55rem;padding:.7rem .9rem;border-top:1px solid #e0e8e2;background:#f5f8f6;color:#b72d3a;font-weight:800; }.billing-payment-action { border:1px solid #b7d8c0;background:linear-gradient(135deg,#eff9f2,#e5f4e9);box-shadow:0 5px 16px rgba(25,110,58,.08); }
.billing-pay-header-icon { width:42px;height:42px;flex:0 0 42px;display:grid;place-items:center;border-radius:11px;background:rgba(255,255,255,.18);color:#fff;font-size:1rem;border:1px solid rgba(255,255,255,.2); }
.billing-pay-summary { display:grid;grid-template-columns:40px minmax(0,1fr) auto;align-items:center;gap:.7rem;padding:.8rem;border:1px solid #d6e2d9;border-radius:11px;background:rgba(255,255,255,.95);box-shadow:0 5px 15px rgba(26,83,44,.06); }.billing-pay-summary-icon { width:40px;height:40px;display:grid;place-items:center;border-radius:10px;background:#e3f3e8;color:#176b3a; }.billing-pay-summary small,.billing-pay-summary strong,.billing-pay-summary span { display:block; }.billing-pay-summary>div:nth-child(2) small { color:#536b5b;font-size:.65rem;font-weight:750; }.billing-pay-summary>div:nth-child(2) strong,.billing-pay-summary>div:nth-child(2) span { color:#829087;font-size:.55rem; }.billing-pay-summary-amount { text-align:right; }.billing-pay-summary-amount small { color:#7e8a82;font-size:.54rem; }.billing-pay-summary-amount strong { color:#c33140;font-size:.9rem; }
.billing-payment-form { border-radius:12px!important;box-shadow:0 7px 20px rgba(26,83,44,.07); }.billing-form-heading { display:flex;align-items:center;gap:.7rem;margin:-.2rem 0 1rem;padding-bottom:.8rem;border-bottom:1px solid #e5ece7; }.billing-form-heading>span { width:34px;height:34px;display:grid;place-items:center;border-radius:9px;background:#e2f2e7;color:#176b3a; }.billing-form-heading strong,.billing-form-heading small { display:block; }.billing-form-heading strong { color:#304b38;font-size:.74rem; }.billing-form-heading small { color:#7d8981;font-size:.58rem; }
.billing-proof-upload { min-height:66px;display:grid;grid-template-columns:38px minmax(0,1fr) 12px;align-items:center;gap:.7rem;padding:.7rem;border:1.5px dashed #8bb99a;border-radius:10px;background:#f5faf6;cursor:pointer;transition:.18s ease; }.billing-proof-upload:hover { border-color:#198754;background:#edf7f0; }.billing-proof-upload>span:first-child { width:38px;height:38px;display:grid;place-items:center;border-radius:9px;background:#dcefe2;color:#176b3a; }.billing-proof-upload>span:nth-child(2) { min-width:0; }.billing-proof-upload strong,.billing-proof-upload small { display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }.billing-proof-upload strong { color:#34513d;font-size:.68rem; }.billing-proof-upload small { margin-top:.12rem;color:#7b8980;font-size:.55rem; }.billing-proof-upload>i { color:#7f9185;font-size:.58rem; }
.billing-payment-submit { display:flex;justify-content:flex-end;gap:.6rem;padding-top:.9rem;border-top:1px solid #e5ece7; }.billing-payment-submit .btn-success { min-width:180px; }
@media(max-width:575.98px){.billing-detail-facts{grid-template-columns:1fr}.billing-detail-facts>div{border-right:0;border-bottom:1px solid #edf1ee}.billing-detail-facts>div:last-child{border-bottom:0}.billing-detail-balance strong{font-size:1.08rem}.billing-pay-summary{grid-template-columns:38px minmax(0,1fr)}.billing-pay-summary-amount{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;padding-top:.55rem;border-top:1px solid #edf1ee;text-align:left}.billing-payment-submit{display:grid;grid-template-columns:1fr 1.6fr}.billing-payment-submit .btn-success{min-width:0}.billing-payment-submit .btn{font-size:.68rem;padding-left:.45rem;padding-right:.45rem}}

/* Tipografi billing dibuat nyaman dibaca pada ponsel maupun desktop. */
.billing-detail-kicker { font-size:.7rem; }
.billing-detail-status { font-size:.74rem; }
.billing-detail-navigation .btn { font-size:.75rem; }
.billing-detail-balance small { font-size:.72rem; }
.billing-detail-balance strong { font-size:1.42rem; }
.billing-detail-balance span { font-size:.68rem; }
.billing-detail-facts small { font-size:.64rem; }
.billing-detail-facts strong { font-size:.75rem; }
.billing-detail-section-heading strong { font-size:.82rem; }
.billing-detail-section-heading small { font-size:.66rem; }
.billing-detail-item strong { font-size:.8rem; }
.billing-detail-item small { font-size:.66rem; }
.billing-detail-item b { font-size:.79rem; }
.billing-detail-totals>div { font-size:.77rem; }
.billing-payment-action strong { font-size:.82rem!important; }
.billing-payment-action small { font-size:.72rem;line-height:1.45; }
.billing-pay-header>div small,.billing-pay-header>div p { font-size:.72rem!important; }
.billing-pay-summary>div:nth-child(2) small { font-size:.76rem; }
.billing-pay-summary>div:nth-child(2) strong,.billing-pay-summary>div:nth-child(2) span { font-size:.66rem; }
.billing-pay-summary-amount small { font-size:.65rem; }
.billing-pay-summary-amount strong { font-size:1.02rem; }
.billing-account-heading { font-size:.82rem; }
.billing-account-heading .badge { font-size:.67rem; }
.billing-account-main small { font-size:.73rem; }
.billing-account-main strong { font-size:1.08rem; }
.billing-account-main span { font-size:.74rem; }
.billing-account-empty { font-size:.8rem; }
.billing-form-heading strong { font-size:.84rem; }
.billing-form-heading small { font-size:.69rem;line-height:1.4; }
.billing-payment-form .form-label { font-size:.78rem!important; }
.billing-payment-form .form-control,.billing-payment-form .form-select,.billing-payment-form .input-group-text { font-size:.84rem; }
.billing-payment-form .form-text { font-size:.68rem; }
.billing-proof-upload strong { font-size:.8rem; }
.billing-proof-upload small { font-size:.67rem; }
.billing-payment-submit .btn { font-size:.78rem; }
@media(max-width:575.98px){.billing-detail-balance strong{font-size:1.25rem}.billing-detail-item{padding-top:.75rem;padding-bottom:.75rem}.billing-detail-item strong{white-space:normal;line-height:1.35}.billing-detail-item b{font-size:.75rem}.billing-payment-form .form-label{font-size:.76rem!important}.billing-payment-submit .btn{font-size:.74rem}}

/* Varian compact: ruang vertikal dikurangi, teks tetap dominan. */
.billing-detail-header,.billing-pay-header { padding-top:.85rem!important;padding-bottom:.9rem!important; }
.billing-detail-header .mt-3,.billing-pay-header .mt-3 { margin-top:.65rem!important; }
.billing-detail-header h4,.billing-pay-header h4 { font-size:1.25rem; }
.billing-detail-kicker { font-size:.75rem; }
.billing-detail-status { padding:.32rem .55rem;font-size:.78rem; }
.billing-detail-navigation { min-height:30px;margin-bottom:.55rem!important; }.billing-detail-navigation .btn { padding:.25rem .55rem;font-size:.78rem; }
.billing-detail-overview { margin-bottom:.65rem!important; }
.billing-detail-balance { gap:.65rem;padding:.7rem .8rem; }.billing-detail-balance-icon { width:38px;height:38px;flex-basis:38px;border-radius:9px; }.billing-detail-balance small { font-size:.76rem; }.billing-detail-balance strong { font-size:1.5rem; }.billing-detail-balance span { font-size:.72rem; }
.billing-detail-facts>div { gap:.42rem;padding:.5rem .65rem; }.billing-detail-facts small { font-size:.68rem; }.billing-detail-facts strong { font-size:.8rem; }
.billing-detail-section-heading { padding:.58rem .7rem; }.billing-detail-section-heading>span>i { width:28px;height:28px; }.billing-detail-section-heading strong { font-size:.87rem; }.billing-detail-section-heading small { font-size:.69rem; }
.billing-detail-item { min-height:44px;padding:.45rem .7rem; }.billing-detail-item strong { font-size:.84rem; }.billing-detail-item small { font-size:.69rem; }.billing-detail-item b { font-size:.83rem; }
.billing-detail-totals { padding:.38rem .7rem; }.billing-detail-totals>div { padding:.25rem 0;font-size:.82rem; }.billing-detail-totals .is-outstanding { margin:.25rem -.7rem -.38rem;padding:.55rem .7rem; }
.billing-detail-totals .is-outstanding.is-void{color:#5f6e64;background:#f2f4f2}
.billing-payment-action { padding:.7rem!important;margin-bottom:1rem!important; }.billing-payment-action .mb-3 { margin-bottom:.6rem!important; }.billing-payment-action strong { font-size:.88rem!important; }.billing-payment-action small { font-size:.76rem; }.billing-payment-action .btn { padding:.48rem .7rem;font-size:.82rem; }
.billing-pay-header-icon { width:36px;height:36px;flex-basis:36px; }.billing-pay-header>div small,.billing-pay-header>div p { font-size:.77rem!important; }
.billing-pay-summary { gap:.55rem;padding:.58rem .65rem;margin-bottom:.65rem!important; }.billing-pay-summary-icon { width:34px;height:34px; }.billing-pay-summary>div:nth-child(2) small { font-size:.82rem; }.billing-pay-summary>div:nth-child(2) strong,.billing-pay-summary>div:nth-child(2) span { font-size:.71rem; }.billing-pay-summary-amount small { font-size:.7rem; }.billing-pay-summary-amount strong { font-size:1.08rem; }
.billing-account-panel { margin-bottom:.65rem!important; }.billing-account-heading { padding:.48rem .65rem;font-size:.87rem; }.billing-account-heading .badge { font-size:.7rem; }.billing-account-item { gap:.55rem;padding:.52rem .65rem; }.billing-account-logo { width:32px;height:32px;flex-basis:32px; }.billing-account-main small { font-size:.77rem; }.billing-account-main strong { font-size:1.12rem; }.billing-account-main span { font-size:.78rem; }.billing-account-copy { width:32px;height:32px;flex-basis:32px; }
.billing-payment-form { padding:.85rem!important; }.billing-form-heading { gap:.55rem;margin:0 0 .65rem;padding-bottom:.55rem; }.billing-form-heading>span { width:30px;height:30px; }.billing-form-heading strong { font-size:.9rem; }.billing-form-heading small { font-size:.73rem; }.billing-payment-form>.row { --bs-gutter-y:.65rem;--bs-gutter-x:.75rem; }.billing-payment-form .form-label { margin-bottom:.22rem;font-size:.82rem!important; }.billing-payment-form .form-control,.billing-payment-form .form-select,.billing-payment-form .input-group-text { min-height:38px;font-size:.89rem; }.billing-payment-form textarea.form-control { min-height:auto; }.billing-payment-form .form-text { margin-top:.18rem;font-size:.72rem; }
.billing-proof-upload { min-height:56px;grid-template-columns:32px minmax(0,1fr) 10px;gap:.55rem;padding:.5rem .6rem; }.billing-proof-upload>span:first-child { width:32px;height:32px; }.billing-proof-upload strong { font-size:.85rem; }.billing-proof-upload small { font-size:.71rem; }
.billing-payment-submit { gap:.5rem;margin-top:.7rem!important;padding-top:.65rem; }.billing-payment-submit .btn { padding:.45rem .7rem;font-size:.82rem; }
@media(max-width:575.98px){.billing-detail-facts{grid-template-columns:repeat(2,minmax(0,1fr))}.billing-detail-facts>div{border-right:1px solid #edf1ee;border-bottom:0}.billing-detail-facts>div:first-child{grid-column:1/-1;border-right:0;border-bottom:1px solid #edf1ee}.billing-detail-facts>div:last-child{border-right:0}.billing-detail-balance strong{font-size:1.34rem}.billing-detail-item{padding:.5rem .65rem}.billing-detail-item strong{font-size:.82rem;line-height:1.25}.billing-detail-item b{font-size:.8rem}.billing-payment-form .form-label{font-size:.8rem!important}.billing-payment-submit .btn{font-size:.78rem}.billing-pay-summary-amount{padding-top:.38rem}}
.bank-account-stat { min-height: 62px; padding: 0.65rem 0.75rem; border: 1px solid #e1e8e3; border-radius: 8px; background: #fff; display: flex; flex-direction: column; justify-content: center; }
.bank-account-stat small { color: #718078; font-size: 0.66rem; }
.bank-account-stat strong { color: #26372c; font-size: 1.05rem; line-height: 1.25; letter-spacing: 0; }
.bank-account-management { overflow: hidden; }
.bank-account-management-heading { display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding: 0.7rem 0.8rem; border-bottom: 1px solid #e3e9e5; background: #f6f9f7; }
.bank-account-management-heading span { color: #344139; font-size: 0.78rem; font-weight: 700; }
.bank-account-management-heading small { color: #758078; font-size: 0.65rem; text-align: right; }
.bank-account-row { width: 100%; display: flex; align-items: center; gap: 0.65rem; padding: 0.72rem 0.8rem; border: 0; border-bottom: 1px solid #edf1ee; background: #fff; color: inherit; text-align: left; }
.bank-account-row:last-child { border-bottom: 0; }
.bank-account-row:hover { background: #f8faf9; }
.bank-account-row-main { min-width: 0; flex: 1 1 auto; }
.bank-account-row-main > span { display: flex; min-width: 0; color: #66736b; font-size: 0.69rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.bank-account-row-main strong { color: #26372c; font-size: 0.8rem; }
.bank-account-row-main .badge { font-size: 0.56rem; }
.bank-account-order { color: #758078; font-size: 0.64rem; white-space: nowrap; }
@media (max-width: 575.98px) { .bank-account-order { display: none; } .bank-account-management-heading small { max-width: 48%; } }

/* Notification settings */
.notification-page-hero { overflow: hidden !important; }
.notification-page-badge { flex: 0 0 auto; padding: .3rem .5rem; border: 1px solid rgba(255,255,255,.28); border-radius: 999px; color: rgba(255,255,255,.82); font-size: .62rem; font-weight: 700; }
.notification-tabs { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); border-bottom: 1px solid #dce5df; }
.notification-tabs button { min-width: 0; min-height: 58px; display: grid; grid-template-columns: 26px minmax(0, 1fr); grid-template-rows: 1fr 1fr; align-items: center; column-gap: .35rem; padding: .55rem .7rem; border: 1px solid #dce5df; border-bottom: 0; border-left: 0; background: #f6f9f7; color: #68756c; text-align: left; }
.notification-tabs button:first-child { border-left: 1px solid #dce5df; border-top-left-radius: 8px; }
.notification-tabs button:last-child { border-top-right-radius: 8px; }
.notification-tabs button > i { grid-row: 1 / span 2; width: 26px; height: 26px; display: inline-flex; align-items: center; justify-content: center; border-radius: 7px; background: #e5eee8; color: var(--primary-green); }
.notification-tabs button > span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: .72rem; font-weight: 750; }
.notification-tabs button > small { color: #89938c; font-size: .59rem; }
.notification-tabs button.active { background: #fff; color: var(--primary-green); box-shadow: inset 0 3px 0 var(--primary-green); }
.notification-tabs button.active > i { background: #d1e7dd; color: #146c43; }
.notification-tabs button:focus-visible { position: relative; z-index: 1; outline: 2px solid var(--primary-green); outline-offset: -2px; }
.notification-form-content { min-height: 330px; padding: 1rem; border-radius: 0; }
.notification-pane-heading { display: flex; align-items: flex-start; gap: .7rem; padding-bottom: .9rem; margin-bottom: 1rem; border-bottom: 1px solid #edf1ee; }
.notification-pane-icon { width: 38px; height: 38px; flex: 0 0 38px; display: inline-flex; align-items: center; justify-content: center; border-radius: 9px; font-size: 1.05rem; }
.notification-pane-heading h5 { margin: .1rem 0 .2rem; color: #26372c; font-size: .9rem; font-weight: 750; }
.notification-pane-heading p { margin: 0; color: #748078; font-size: .68rem; line-height: 1.4; }
.notification-template-tabs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.55rem;margin-bottom:1rem;padding:.35rem;border:1px solid #dce7df;border-radius:12px;background:#f6f9f7}.notification-template-tabs .nav-link{display:flex;align-items:center;gap:.65rem;padding:.7rem .8rem;border:1px solid transparent;border-radius:9px;color:#617068;text-align:left}.notification-template-tabs .nav-link>i{width:34px;height:34px;display:grid;flex:0 0 34px;place-items:center;border-radius:9px;background:#e5eee8;color:#547260}.notification-template-tabs .nav-link span,.notification-template-tabs .nav-link strong,.notification-template-tabs .nav-link small{display:block}.notification-template-tabs .nav-link strong{font-size:.72rem}.notification-template-tabs .nav-link small{margin-top:.08rem;color:#839087;font-size:.56rem}.notification-template-tabs .nav-link.active{border-color:#add3b8;background:#fff;color:#176b3a;box-shadow:0 3px 10px rgba(25,92,47,.08)}.notification-template-tabs .nav-link.active>i{background:#dff2e5;color:#17713d}.notification-template-tab-content{min-height:360px}.notification-template-intro{display:flex;align-items:center;margin-bottom:.7rem;padding:.65rem .75rem;border-left:3px solid #2b8b4f;border-radius:0 8px 8px 0;background:#f5faf6}.notification-template-intro strong,.notification-template-intro small{display:block}.notification-template-intro strong{color:#31543d;font-size:.7rem}.notification-template-intro small{margin-top:.1rem;color:#77847c;font-size:.58rem}.notification-template-accordion{display:grid;gap:.55rem}.notification-template-accordion .accordion-item{overflow:hidden;border:1px solid #dce6df;border-radius:10px!important;background:#fff}.notification-template-accordion .accordion-button{gap:.7rem;padding:.7rem .8rem;background:#fff;box-shadow:none}.notification-template-accordion .accordion-button:not(.collapsed){background:#f2f8f4;color:inherit}.notification-template-title{min-width:0;flex:1}.notification-template-title strong,.notification-template-title small{display:block}.notification-template-title strong{color:#2e4937;font-size:.72rem}.notification-template-title small{margin-top:.08rem;color:#88938c;font-size:.52rem;font-weight:500}.notification-template-summary{display:flex;align-items:center;gap:.35rem;margin-right:.5rem}.notification-template-summary span,.notification-template-summary b{padding:.22rem .4rem;border:1px solid #dce6df;border-radius:999px;background:#fff;color:#68766d;font-size:.5rem;white-space:nowrap}.notification-template-summary b{background:#e8f5ec;color:#247542}.notification-template-editor{padding:.8rem;border:1px solid #dfe8e1;border-radius:9px;background:#fff}.notification-template-accordion .accordion-body{padding:.75rem;background:#fafcfb}
@media(max-width:575.98px){.notification-template-tabs{grid-template-columns:repeat(2,minmax(0,1fr));gap:.35rem;padding:.3rem}.notification-template-tabs .nav-link{min-width:0;gap:.4rem;padding:.55rem .45rem}.notification-template-tabs .nav-link>i{width:30px;height:30px;flex-basis:30px;font-size:.8rem}.notification-template-tabs .nav-link span{min-width:0}.notification-template-tabs .nav-link strong{overflow:hidden;font-size:.64rem;text-overflow:ellipsis;white-space:nowrap}.notification-template-tabs .nav-link small{overflow:hidden;font-size:.48rem;text-overflow:ellipsis;white-space:nowrap}.notification-template-summary span{display:none}.notification-template-summary{margin-right:.2rem}.notification-template-editor{padding:.7rem}}
.notification-form-content .form-label { margin-bottom: .3rem; color: #47564c; }
.notification-rule-list { display: grid; gap: .65rem; max-width: 680px; }
.notification-rule-groups { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.notification-rule-groups h6 { margin: 0 0 .55rem; color: #53645a; font-size: .68rem; font-weight: 750; text-transform: uppercase; letter-spacing: .04em; }
.notification-rule-row { display: flex; align-items: center; gap: .7rem; min-height: 68px; padding: .7rem; border: 1px solid #e1e8e3; border-radius: 8px; background: #fbfdfb; cursor: pointer; }
.notification-rule-row > span:nth-child(2) { min-width: 0; flex: 1 1 auto; }
.notification-rule-row strong, .notification-rule-row small { display: block; }
.notification-rule-row strong { color: #304238; font-size: .76rem; }
.notification-rule-row small { margin-top: .15rem; color: #7b877f; font-size: .64rem; line-height: 1.35; }
.notification-rule-icon { width: 34px; height: 34px; flex: 0 0 34px; display: inline-flex; align-items: center; justify-content: center; border-radius: 8px; }
.notification-form-actions { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .75rem 1rem; border-radius: 0 0 8px 8px; }
.notification-form-actions small { color: #748078; font-size: .64rem; }
@media (max-width: 767.98px) { .notification-tabs { grid-template-columns: repeat(3, minmax(0, 1fr)); } .notification-rule-groups { grid-template-columns: 1fr; gap: 1rem; } }
@media (max-width: 575.98px) { .notification-page-badge { display: none; } .notification-tabs button { min-height: 54px; padding: .45rem .35rem; grid-template-columns: 1fr; grid-template-rows: 25px 1fr; justify-items: center; text-align: center; } .notification-tabs button > i { grid-row: 1; } .notification-tabs button > span { max-width: 100%; font-size: .62rem; } .notification-tabs button > small { display: none; } .notification-form-content { padding: .85rem; min-height: 370px; } .notification-pane-heading { gap: .55rem; } .notification-pane-heading p { font-size: .64rem; } .notification-form-actions { align-items: stretch; flex-direction: column; } .notification-form-actions .btn { width: 100%; } }
.grid-two-columns { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.profile-security-shortcut { min-height: 86px; padding: 0.6rem 0.25rem; border: 1px solid #cfe0d4; border-radius: 10px; background: linear-gradient(145deg,#fff,#f1f7f3); color: #23412e; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 0.45rem; text-align: center; font-size: 0.65rem; font-weight: 750; line-height: 1.15; box-shadow:0 4px 12px rgba(24,80,42,.08);transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease; }
.profile-security-shortcut:hover { border-color:#70b584;background:#fff;color:var(--primary-green);transform:translateY(-2px);box-shadow:0 8px 18px rgba(24,80,42,.14); }
.household-member-card { min-height:72px;display:flex;align-items:center;gap:.65rem;padding:.65rem;border:1px solid #dfe7e1;border-radius:9px;background:#fff; }.household-member-card.is-self { border-color:#add2b7;background:#f4fbf6; }.household-member-avatar { width:38px;height:38px;flex:0 0 38px;display:grid;place-items:center;border-radius:50%;background:#dff1e5;color:#198754;font-size:.8rem;font-weight:800; }.household-member-copy { min-width:0;flex:1; }.household-member-copy strong,.household-member-copy small,.household-member-copy span { display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }.household-member-copy strong { color:#2e4335;font-size:.7rem; }.household-member-copy strong small { display:inline;color:#198754;font-size:.56rem; }.household-member-copy>small { color:#69786f;font-size:.6rem; }.household-member-copy>span { color:#89938d;font-size:.54rem; }.household-account-status { color:#a3ada6;font-size:.72rem; }.household-account-status.is-active { color:#198754; }
.household-vehicle-card { min-height:72px;display:flex;align-items:center;gap:.65rem;padding:.65rem;border:1px solid #dfe5ee;border-radius:9px;background:#f9fbfe; }.household-vehicle-icon { width:38px;height:38px;flex:0 0 38px;display:grid;place-items:center;border-radius:9px;background:#e3edfb;color:#2563a8;font-size:.85rem; }.household-vehicle-copy { min-width:0;flex:1; }.household-vehicle-copy strong,.household-vehicle-copy small,.household-vehicle-copy span { display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }.household-vehicle-copy strong { color:#263b55;font-size:.72rem;letter-spacing:.04em; }.household-vehicle-copy small { color:#64748b;font-size:.6rem; }.household-vehicle-copy span { color:#8793a2;font-size:.55rem; }
.profile-security-icon { width: 42px; height: 42px; flex: 0 0 42px; border-radius: 11px; display: inline-flex; align-items: center; justify-content: center; font-size: 1rem;box-shadow:inset 0 0 0 1px rgba(0,0,0,.04); }
.profile-security-icon.bg-success { background:#d8f1df !important;color:#126332 !important; }
.profile-security-icon.bg-primary { background:#dce9fb !important;color:#1e5fa7 !important; }
.profile-security-icon.bg-info { background:#d8f1f5 !important;color:#116b78 !important; }
.profile-security-icon.bg-warning { background:#fff0c7 !important;color:#8a5d00 !important; }
.profile-security-icon.bg-danger { background:#f9dfe2 !important;color:#b32735 !important; }
.profile-security-danger { color: #dc3545; }

@media (max-width: 420px) {
    .dashboard-role-trigger { min-width:132px;max-width:150px;grid-template-columns:28px minmax(0,1fr) 10px;padding:.3rem .4rem; }
    .dashboard-role-trigger-icon { width:28px;height:28px; }
    .dashboard-role-trigger-copy small { display:none; }
}

@media (min-width: 768px) {
    .dashboard-shortcut { min-height: 96px; }
    .dashboard-operation { min-height: 92px; }
    .dashboard-context { max-width: 36%; }
}

/* --- 3. TYPOGRAPHY, TEXT UTILITIES & BADGES --- */
.text-soft { color: #6c757d !important; font-weight: 500 !important; }
.text-strong { color: #212529 !important; font-weight: 700 !important; }
.tracking-wide { letter-spacing: 1px !important; }

.section-title {
    font-size: 0.85rem;
    letter-spacing: 0.8px;
    font-weight: 800 !important;
    color: var(--primary-green);
    text-transform: uppercase;
    border-left: 4px solid var(--secondary-green);
    padding-left: 10px;
    margin-bottom: 1rem;
}

.card-custom span.fw-semibold,
.card-custom h6.fw-bold {
    color: var(--text-dark) !important;
}

.badge-pw-xs { font-size: 0.62rem !important; }
.badge-pw-xxs { font-size: 0.58rem !important; }

/* Buku kas */
.finance-cash-stats { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.55rem; }
.finance-balance-card { grid-column: 1 / -1; display: flex; align-items: center; gap: 0.8rem; min-width: 0; padding: 0.85rem; border: 1px solid #cfe2d4; border-radius: 10px; background: linear-gradient(135deg, #edf8f0, #fff); }
.finance-balance-card.negative { border-color: #efcfd2; background: linear-gradient(135deg, #fff0f1, #fff); }
.finance-stat-icon { width: 2.6rem; height: 2.6rem; flex: 0 0 2.6rem; display: inline-flex; align-items: center; justify-content: center; border-radius: 9px; background: #d8eddd; color: #28703a; }
.finance-balance-card.negative .finance-stat-icon { background: #f5dadd; color: #b72f3b; }
.finance-balance-card > div { min-width: 0; flex: 1; }
.finance-balance-card small, .finance-balance-card strong, .finance-balance-card div > span { display: block; }
.finance-balance-card small { color: #65746a; font-size: 0.63rem; }
.finance-balance-card strong { overflow-wrap: anywhere; color: #245f34; font-size: clamp(1.05rem, 4vw, 1.45rem); line-height: 1.2; }
.finance-balance-card.negative strong { color: #a82d38; }
.finance-balance-card div > span { color: #829087; font-size: 0.57rem; }
.finance-pending-badge { flex: 0 0 auto; padding: 0.35rem 0.5rem; border: 1px solid #ecd48c; border-radius: 999px; background: #fff8df; color: #806513; font-size: 0.6rem; font-weight: 700; text-decoration: none; white-space: nowrap; }
.finance-pending-badge i { margin-right: 0.25rem; }
.finance-flow-stat { display: flex; align-items: center; gap: 0.55rem; min-width: 0; padding: 0.7rem; border: 1px solid #dfe7e1; border-radius: 9px; background: #fff; text-decoration: none; }
.finance-flow-stat > span { width: 2rem; height: 2rem; flex: 0 0 2rem; display: inline-flex; align-items: center; justify-content: center; border-radius: 7px; }
.finance-flow-stat.income > span { background: #e4f3e8; color: #27803d; }
.finance-flow-stat.expense > span { background: #fbe8ea; color: #c23b47; }
.finance-flow-stat div { min-width: 0; }
.finance-flow-stat small, .finance-flow-stat strong { display: block; }
.finance-flow-stat small { overflow: hidden; color: #748078; font-size: 0.58rem; text-overflow: ellipsis; white-space: nowrap; }
.finance-flow-stat strong { overflow-wrap: anywhere; color: #34453a; font-size: 0.78rem; line-height: 1.25; }
.finance-approval-stats { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); overflow: hidden; border: 1px solid #e5dfca; border-radius: 8px; background: #fffcf2; }
.finance-approval-stats a { display: flex; align-items: center; justify-content: space-between; gap: 0.5rem; padding: 0.5rem 0.65rem; color: #655b3b; text-decoration: none; }
.finance-approval-stats a + a { border-left: 1px solid #e9e1c8; }
.finance-approval-stats small { overflow: hidden; font-size: 0.58rem; text-overflow: ellipsis; white-space: nowrap; }
.finance-approval-stats strong { color: #806513; font-size: 0.8rem; }

@media (max-width: 420px) {
    .finance-balance-card { align-items: flex-start; }
    .finance-pending-badge { align-self: center; }
    .finance-flow-stat > span { display: none; }
    .finance-flow-stat strong { font-size: 0.7rem; }
}

/* --- 4. HEADER & BANNERS --- */
.hero-banner,
.pw-hero-banner {
    background-color:var(--primary-green) !important;
    background-image:linear-gradient(90deg,rgba(14,80,39,.95),rgba(27,112,57,.74)),url('../img/background_header_1.png') !important;
    background-position:center !important;
    background-size:cover !important;
    color: white !important;
    border-radius: 1.25rem;
    position: relative;
    overflow: hidden;
}

.hero-banner::after,
.pw-hero-banner::after {
    content: '';
    position: absolute;
    top: 0; right: 0; bottom: 0; left: 0;
    background:linear-gradient(110deg,rgba(255,255,255,.04),transparent 55%);
    opacity:1;
    pointer-events: none;
    border-radius: inherit;
}
.dashboard-header { background-image:linear-gradient(90deg,rgba(12,75,36,.96),rgba(28,116,59,.7)),url('../img/background_header_3.png') !important; }
.profile-hero { background-image:linear-gradient(90deg,rgba(13,76,37,.94),rgba(38,125,66,.68)),url('../img/background_header_5.png') !important; }
.hero-banner:has(.portal-share-group) { overflow:visible;z-index:20; }
.hero-banner:has(.portal-share-group) .portal-share-group { position:relative;z-index:22; }
.hero-banner:has(.portal-share-group) .portal-share-group .dropdown-menu { z-index:1085; }

.content-share-footer { display:flex;align-items:center;justify-content:flex-end;gap:.55rem;padding:.15rem 0;border:0;background:transparent;box-shadow:none; }
.content-share-footer>span { min-width:0;display:flex;align-items:center;gap:.7rem;color:#28523a; }
.content-share-footer>span>span { min-width:0; }.content-share-footer strong,.content-share-footer small { display:block; }.content-share-footer strong { font-size:.72rem; }.content-share-footer small { margin-top:.1rem;color:#748078;font-size:.6rem; }
.content-share-footer .portal-share-group { flex:0 0 auto; }.content-share-footer .js-share-button { min-width:auto;background:#fff!important;color:#42604b!important;border:1px solid #cddbd1!important;box-shadow:none;font-weight:650; }
.content-share-footer .js-share-button:hover { background:#f2f7f3!important;color:#176b3a!important;border-color:#a9c6b1!important; }
@media(max-width:575.98px){.content-share-footer>span>span{display:none}.content-share-footer{gap:.4rem}.content-share-footer .portal-share-group,.content-share-footer .js-share-button{width:auto}}
.receipt-sheet + .d-grid.d-print-none { display:none!important; }
.salary-slip{width:min(100%,960px);margin-inline:auto;padding:24px 28px;border:1px solid #cfd8d1;border-radius:8px;color:#17221b;box-shadow:0 8px 28px rgba(31,55,41,.08);font-size:.76rem}.salary-slip-header{text-align:center}.salary-slip-header small{display:block;font-size:1rem;font-weight:800;letter-spacing:.08em}.salary-slip-header h1{margin:4px 0 2px;font-size:1.15rem;font-weight:800;text-transform:uppercase}.salary-slip-header span{color:#78827b;font-size:.65rem}.salary-slip-identity{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0;border:1px solid #d9dfda;margin:18px 0}.salary-slip-identity div{display:grid;grid-template-columns:85px 1fr;padding:7px 10px;border-bottom:1px solid #eef1ef}.salary-slip-identity div:nth-last-child(-n+2){border-bottom:0}.salary-slip-identity small{color:#6e7971;text-transform:uppercase}.salary-slip-identity strong{color:#183e25}.salary-slip-columns{display:grid;grid-template-columns:1fr 1.15fr;gap:14px;align-items:start}.salary-slip-panel{border:1px solid #263029}.salary-slip-panel h2{margin:0;padding:6px;text-align:center;background:#eef5e9;font-size:.82rem;font-weight:800;text-transform:uppercase}.salary-slip-panel table{width:100%;border-collapse:collapse}.salary-slip-panel th,.salary-slip-panel td{padding:5px 7px;border-top:1px solid #d9dfda;vertical-align:top}.salary-slip-panel thead th{background:#f7f9f7;font-size:.64rem;text-transform:uppercase}.salary-slip-panel td:first-child,.salary-slip-panel th:first-child{text-align:center}.salary-slip-panel td:last-child,.salary-slip-panel th:last-child{text-align:right;white-space:nowrap}.salary-slip-panel td small{display:block;color:#7b857e;font-size:.58rem}.salary-slip-panel tfoot th{background:#f7f9f7;font-weight:800}.salary-slip-net{display:flex;justify-content:space-between;align-items:center;width:48.5%;margin-top:12px;padding:9px 10px;border:1px solid #39553f;background:#eaf4df;font-size:.86rem;font-weight:800;text-transform:uppercase}.salary-slip-note{margin:14px 4px 0;font-size:.67rem;font-style:italic}.salary-slip-signatures{display:grid;grid-template-columns:1fr 1fr;gap:80px;margin:27px 4px 18px}.salary-slip-signatures div{min-height:75px;display:flex;flex-direction:column}.salary-slip-signatures small{text-transform:uppercase}.salary-slip-signatures strong{margin-top:auto;text-transform:uppercase}.salary-slip-signatures span{color:#6f7972;font-size:.62rem}.salary-slip-meta;padding-top:7px;border-top:1px dashed #cbd3cd;color:#7d867f;font-size:.57rem;text-align:center}.salary-slip.document-image-export{width:960px!important;max-width:none!important;margin:0!important;padding:28px!important;border-radius:8px!important}.salary-slip.document-image-export .document-export-watermark{opacity:.035}@media(max-width:767.98px){.salary-slip{padding:18px 14px}.salary-slip-columns{grid-template-columns:1fr}.salary-slip-net{width:100%}.salary-slip-identity{grid-template-columns:1fr}.salary-slip-identity div{border-bottom:1px solid #eef1ef!important}.salary-slip-signatures{gap:25px}}@media print{.salary-slip{width:100%;padding:10mm;border:0;box-shadow:none;font-size:8pt}.salary-slip-columns{grid-template-columns:1fr 1.15fr}.salary-slip-net{width:48.5%}.salary-slip-signatures{margin-top:18px}.document-actions,.page-back-link{display:none!important}}
.receipt-sheet { position:relative;isolation:isolate; }
.salary-slip-meta{padding-top:7px;border-top:1px dashed #cbd3cd;color:#7d867f;font-size:.57rem;text-align:center}
.receipt-sheet.document-image-export { box-sizing:border-box;width:680px!important;max-width:none!important;margin:0!important;padding:34px!important;border:1px solid #b9d2c1!important;border-radius:18px!important;background:#fff!important;box-shadow:none!important;overflow:hidden;color:#21372a;font-family:"Segoe UI",Arial,sans-serif; }
.receipt-sheet.document-image-export>*:not(.document-export-watermark){position:relative;z-index:1}.document-export-watermark { position:absolute;left:50%;top:50%;z-index:0;width:min(48%,260px);height:auto;max-height:52%;object-fit:contain;transform:translate(-50%,-50%) rotate(-8deg);opacity:.055;filter:grayscale(1);pointer-events:none; }
.receipt-sheet.document-image-export header { margin:-34px -34px 26px!important;padding:25px 30px!important;border:0!important;background:linear-gradient(135deg,#125f33,#23804a)!important;color:#fff!important; }
.receipt-sheet.document-image-export header h4 { margin-top:5px!important;color:#fff!important;font-size:23px!important; }.receipt-sheet.document-image-export header small,.receipt-sheet.document-image-export header span:not(.badge),.receipt-sheet.document-image-export header code { color:rgba(255,255,255,.92)!important; }.receipt-sheet.document-image-export header code { display:inline-block;margin-top:2px;padding:3px 7px;border:1px solid rgba(255,255,255,.28);border-radius:5px;background:rgba(255,255,255,.1); }
.receipt-sheet.document-image-export header .badge { padding:6px 9px!important;background:#fff!important;color:#176b3a!important;border-radius:999px!important; }
.receipt-sheet.document-image-export .row.small { margin-bottom:22px!important;padding:0 2px 19px;border-bottom:1px dashed #b9c9be; }.receipt-sheet.document-image-export .row.small>div { padding-top:7px;padding-bottom:7px; }.receipt-sheet.document-image-export .text-muted { color:#718078!important; }.receipt-sheet.document-image-export strong { color:#21372a; }
.receipt-sheet.document-image-export .table-responsive { border-color:#cbdacf!important;border-radius:10px!important; }.receipt-sheet.document-image-export table { margin:0!important;background:rgba(255,255,255,.88)!important; }.receipt-sheet.document-image-export thead th { padding:10px!important;background:#edf6f0!important;color:#315640!important;border-bottom:1px solid #c9ddcf!important; }.receipt-sheet.document-image-export tbody td,.receipt-sheet.document-image-export tbody th { padding:10px!important;vertical-align:middle; }.receipt-sheet.document-image-export .fs-5 { color:#146c3a!important; }
.document-export-verification { position:relative;z-index:1;display:flex;align-items:center;gap:10px;margin:24px -34px -34px;padding:15px 30px;background:#f1f7f3;color:#587064;font-size:11px;border-top:1px solid #d4e2d8; }.document-export-verification i { width:30px;height:30px;display:grid;place-items:center;border-radius:50%;background:#d7ecde;color:#176b3a;font-size:13px; }.document-export-verification strong,.document-export-verification small { display:block; }.document-export-verification strong { color:#315640;font-size:11px; }.document-export-verification small { margin-top:2px;color:#718078;font-size:9px; }
.document-export-stage { position:fixed!important;left:-10000px!important;top:0!important;z-index:-9999!important; }

.pw-back-link {
    color: rgba(255, 255, 255, 0.85) !important;
    text-decoration: none !important;
    font-size: 0.78rem;
    font-weight: 500;
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    margin-bottom: 0.5rem;
    transition: color 0.2s ease-in-out;
}

.pw-back-link:hover {
    color: #ffffff !important;
}

/* --- 5. GLOBAL CARDS & CONTAINERS --- */
.card-pw {
    border-radius: 1.25rem;
    border: 1px solid rgba(255, 255, 255, 0.6);
    background: rgba(255, 255, 255, 0.92) !important;
    backdrop-filter: blur(10px);
    box-shadow: 0 0.5rem 1.5rem rgba(30, 77, 43, 0.06);
}

.card-custom {
    background-color: #ffffff !important;
    border: 1px solid #cbd5e1 !important; /* Border abu-abu tegas */
    border-radius: 16px !important;
    transition: all 0.2s ease-in-out !important;
    box-shadow: 0 4px 10px rgba(15, 23, 42, 0.05) !important; /* Shadow lebih halus */
}

.card-custom:hover,
.card-custom:active {
    transform: translateY(-2px);
    border-color: var(--primary-green) !important;
    box-shadow: 0 6px 15px rgba(23, 107, 58, 0.12) !important; /* Shadow lebih kuat saat hover */
}

.menu-card {
    border: 1px solid var(--border-strong);
    border-radius: 1rem;
    transition: all 0.25s ease-in-out;
    background: #ffffff;
    box-shadow: 0 0.25rem 0.75rem rgba(30, 77, 43, 0.03);
}

.menu-card:hover {
    transform: translateY(-2px); /* Sedikit lebih rendah dari admin-menu-card */
    box-shadow: 0 0.5rem 1rem rgba(30, 77, 43, 0.1);
    border-color: var(--secondary-green);
}

.admin-menu-card {
    border: 1px solid var(--border-strong);
    border-radius: 1rem;
    background: linear-gradient(135deg, #ffffff 0%, #f9fbf9 100%); /* Background gradasi putih */
    box-shadow: 0 0.25rem 0.75rem rgba(30, 77, 43, 0.06);
    transition: all 0.25s ease-in-out;
    position: relative;
    overflow: hidden;
}

.admin-menu-card::before {
    content: '';
    position: absolute;
    left: 0; top: 0; bottom: 0; /* Garis hijau di kiri */
    width: 5px;
    background: linear-gradient(to bottom, var(--primary-green), var(--secondary-green));
}

.admin-menu-card:hover {
    transform: translateY(-4px); /* Efek angkat lebih tinggi */
    box-shadow: 0 0.75rem 1.25rem rgba(30, 77, 43, 0.15);
}

/* Card Information (Soft Style) */
.card-info {
    background-color: #ffffff;
    border: 1px solid rgba(108, 117, 125, 0.25);
    border-radius: 1rem;
    overflow: hidden;
    box-shadow: 0 0.125rem 0.25rem rgba(0,0,0,0.04);
    margin-bottom: 1.5rem;
}

.card-info-header {
    background-color: rgba(23, 107, 58, 0.1);
    padding: 0.5rem 1rem;
    border-bottom: 1px solid rgba(23, 107, 58, 0.1);
    display: flex;
    align-items: center;
    font-weight: 600;
    color: var(--primary-green);
    font-size: 0.85rem;
}

.card-info-body {
    padding: 1rem;
}

/* --- 6. FORMS & INPUTS (Soft Modern Style) --- */
.form-label-soft {
    font-size: 0.85rem;
    font-weight: 600;
    color: #6c757d;
    margin-bottom: 0.35rem;
    display: flex;
    align-items: center;
}

.form-control-soft {
    border: 1px solid rgba(108, 117, 125, 0.4);
    font-weight: 600;
    color: #212529;
    padding: 0.5rem 0.75rem;
    border-radius: 0.5rem;
}

.form-control-soft:focus {
    border-color: var(--primary-green);
    box-shadow: 0 0 0 0.25rem rgba(23, 107, 58, 0.15);
}

.form-control-soft[readonly] {
    background-color: #f8fafc;
    border-color: rgba(108, 117, 125, 0.2);
}

/* Interactive Checkable Boxes */
.box-checkable {
    width: 100%;
    min-height: 50px;
    padding: 0.5rem;
    border-radius: 0.75rem;
    border: 1px solid rgba(108, 117, 125, 0.25);
    background-color: #ffffff;
    display: flex;
    align-items: center;
    cursor: pointer;
    transition: all 0.2s ease-in-out;
    box-shadow: 0 0.125rem 0.25rem rgba(0,0,0,0.02);
}

.box-checkable:active {
    transform: scale(0.97);
}

.box-checkable.selected {
    background-color: rgba(23, 107, 58, 0.1) !important;
    border-color: var(--primary-green) !important;
}

.box-disabled {
    background-color: #f8fafc !important;
    border-color: #f8fafc !important;
    cursor: not-allowed;
    opacity: 0.75;
}

/* --- 7. BUTTONS, ICONS & TABS --- */
.btn-green,
.btn-pw-primary {
    background-color: var(--primary-green) !important;
    color: white !important;
    border: none !important;
    font-weight: 700;
}

.btn-green:hover,
.btn-pw-primary:hover {
    background-color: var(--secondary-green) !important;
    color: white !important;
}

.btn-check:checked + .btn-outline-success { background-color: #198754 !important; color: #ffffff !important; }
.btn-check:checked + .btn-outline-danger { background-color: #dc3545 !important; color: #ffffff !important; }
.btn-check:checked + .btn-outline-warning { background-color: #ffc100 !important; color: #000000 !important; }

/* Solid Icons */
.icon-box {
    display: flex !important; /* Pastikan flexbox */
    align-items: center !important; /* Pusatkan vertikal */
    justify-content: center !important; /* Pusatkan horizontal */
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.08); /* Shadow lebih halus */
}
.icon-box.bg-success   { background-color: var(--primary-green) !important; color: #ffffff !important; }
.icon-box.bg-warning   { background-color: #d97706 !important; color: #ffffff !important; }
.icon-box.bg-info      { background-color: #0284c7 !important; color: #ffffff !important; }
.icon-box.bg-primary   { background-color: #2563eb !important; color: #ffffff !important; }
.icon-box.bg-danger    { background-color: #dc2626 !important; color: #ffffff !important; }
.icon-box.bg-secondary { background-color: #475569 !important; color: #ffffff !important; }
.icon-box.bg-dark      { background-color: #0f172a !important; color: #ffffff !important; }

/* Pertajam teks judul menu */
.card-custom span.fw-semibold,
.card-custom h6.fw-bold {
    color: #0f172a !important; /* Teks hitam pekat */
}

/* Tabs (Nav Pills) */
.custom-tabs-green {
    background-color: #ffffff;
    border: 1px solid var(--border-green);
}
.custom-tabs-green .nav-link {
    color: var(--primary-green) !important;
    background-color: transparent !important;
    border-radius: 50rem !important;
    font-weight: 600;
    font-size: 0.78rem;
    transition: all 0.2s ease-in-out;
}
.custom-tabs-green .nav-link.active {
    color: #ffffff !important;
    background-color: var(--primary-green) !important;
    box-shadow: 0 2px 5px rgba(30, 77, 43, 0.3) !important;
}

/* --- 8. NAVIGATION, PAGINATION & FAB --- */
.mobile-floating-nav {
    position: fixed;
    bottom: 0; left: 0; right: 0;
    background: rgba(255, 255, 255, 0.95);
    backdrop-filter: blur(10px);
    border-top: 1px solid rgba(30, 77, 43, 0.15);
    padding: 10px 16px;
    z-index: 1030;
    box-shadow: 0 -0.5rem 1rem rgba(0, 0, 0, 0.05);
}

.pw-fab {
    position: fixed;
    bottom: 75px;
    right: 20px;
    z-index: 1030;
}

.pw-fab .btn-fab {
    width: 50px; height: 50px;
    border-radius: 50%;
    display: flex;
    align-items: center; justify-content: center;
    box-shadow: 0 0.5rem 1rem rgba(30, 77, 43, 0.3);
    border: none;
}

.pagination {
    margin-bottom: 0;
    gap: 6px;
    justify-content: center;
    align-items: center;
}
.pagination li.item { display: inline-block; }
.pagination li > a,
.pagination li > span,
.pagination-container li > a,
.pagination-container li > span {
    display: flex;
    align-items: center; justify-content: center;
    width: 32px; height: 32px;
    font-size: 0.78rem;
    border-radius: 50% !important;
    border: 1px solid var(--primary-green) !important;
    color: var(--primary-green);
    background-color: #ffffff;
    text-decoration: none;
    transition: all 0.2s;
    box-shadow: 0 1px 3px rgba(0,0,0,0.08);
}
.pagination li.active span, 
.pagination li.active a,
.pagination-container .active span, 
.pagination-container .active a,
.pagination-container li.active span {
    background-color: var(--primary-green) !important;
    border-color: var(--primary-green) !important;
    color: #ffffff !important;
    font-weight: bold;
}
.pagination-container ul,
.pagination-container nav ul {
    display: flex;
    padding-left: 0;
    list-style: none;
    gap: 6px;
    justify-content: center;
    align-items: center;
    margin-bottom: 0;
}

/* Responsive application pager. Mobile deliberately avoids numbered links so
   controls remain usable on narrow screens; desktop shows at most five pages. */
.pw-pagination-nav {
    width: 100%;
    margin: 1rem 0;
}

.pw-pagination-mobile {
    display: grid;
    grid-template-columns: minmax(2.25rem, 1fr) auto minmax(2.25rem, 1fr);
    align-items: center;
    gap: 0.5rem;
    width: 100%;
}

.pw-pagination-action {
    min-width: 0;
    min-height: 2.5rem;
    padding: 0.5rem 0.625rem;
    border: 1px solid var(--primary-green);
    border-radius: 0.625rem;
    color: var(--primary-green);
    background: #fff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.4rem;
    font-size: 0.78rem;
    font-weight: 600;
    line-height: 1;
    text-decoration: none;
    white-space: nowrap;
}

.pw-pagination-action-next {
    justify-self: stretch;
}

.pw-pagination-action.is-disabled {
    opacity: 0.42;
    cursor: default;
}

.pw-pagination-status {
    color: var(--text-muted, #64748b);
    font-size: 0.75rem;
    line-height: 1.2;
    text-align: center;
    white-space: nowrap;
}

.pw-pagination-status strong {
    color: var(--primary-green);
}

.pw-pagination-desktop {
    display: none;
    flex-wrap: nowrap;
    overflow-x: auto;
    justify-content: center;
    padding: 0.125rem 0 0.35rem;
}

.pw-pagination-desktop .page-item {
    margin: 0;
}

.pw-pagination-desktop .page-link {
    width: 2.25rem;
    height: 2.25rem;
    padding: 0;
    flex: 0 0 auto;
}

.pw-pagination-desktop .page-link.pw-pagination-label {
    width: auto;
    min-width: 2.25rem;
    padding: 0 0.65rem;
    border-radius: 0.625rem !important;
    gap: 0.4rem;
    white-space: nowrap;
}

.pw-pagination-desktop .page-item.disabled .page-link {
    color: #64748b;
    border-color: #cbd5e1 !important;
    background: #f8fafc;
    opacity: 0.55;
    box-shadow: none;
}

@media (max-width: 359.98px) {
    .pw-pagination-action-label {
        position: absolute;
        width: 1px;
        height: 1px;
        padding: 0;
        margin: -1px;
        overflow: hidden;
        clip: rect(0, 0, 0, 0);
        white-space: nowrap;
        border: 0;
    }
}

@media (min-width: 576px) {
    .pw-pagination-mobile {
        display: none;
    }

    .pw-pagination-desktop {
        display: flex;
    }
}

@media (min-width: 768px) {
    .pw-pagination-desktop .pw-pagination-wide-label {
        display: inline;
    }
}

@media (min-width: 576px) and (max-width: 767.98px) {
    .pw-pagination-desktop .pw-pagination-wide-label,
    .pw-pagination-desktop .pw-pagination-edge {
        display: none;
    }
}

/* --- 9. LEGACY / SPECIFIC WIDGETS --- */
/* (Grid kotak iuran versi lama - dipertahankan jika masih digunakan di halaman lain) */
.month-card-box {
    display: flex; align-items: center; justify-content: space-between;
    padding: 6px 10px !important;
    border-radius: 10px !important;
    border: 1.5px solid var(--border-strong);
    background-color: #ffffff;
    transition: all 0.2s ease-in-out;
    min-height: 40px;
    cursor: pointer;
}
.month-card-box:not(.month-paid):hover {
    border-color: var(--primary-green);
    background-color: #f8fafc;
}
.month-card-box.selected {
    background-color: #eaf2eb !important;
    border-color: var(--primary-green) !important;
    box-shadow: 0 2px 6px rgba(23, 107, 58, 0.15);
}
.month-card-box.month-paid {
    background-color: #f1f5f9 !important;
    border-color: #e2e8f0 !important;
    cursor: not-allowed;
    opacity: 0.85;
}
.month-label-text {
    font-size: 0.78rem; font-weight: 700; color: var(--text-dark);
    margin-bottom: 0; line-height: 1;
}
.month-card-box.month-paid .month-label-text { color: #64748b; }
.badge-status-soft {
    font-size: 0.6rem !important; font-weight: 700;
    padding: 3px 8px; border-radius: 20px;
}
.badge-status-lunas { background-color: #dcfce7; color: #15803d; border: 1px solid #bbf7d0; }
.badge-status-belum { background-color: #f8fafc; color: #94a3b8; border: 1px solid #e2e8f0; }

/* ============================================================
   TIMELINE STYLES FOR COMPLAINTS
   ============================================================ */
.timeline {
    position: relative;
    padding: 0;
    list-style: none;
}
.timeline:before {
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    left: 30px; /* Adjust based on badge size */
    width: 2px;
    background-color: #e5e5e5;
}
.timeline-item {
    margin-bottom: 20px;
    position: relative;
}
.timeline-item:last-child {
    margin-bottom: 0;
}
.timeline-badge {
    color: #fff;
    width: 40px;
    height: 40px;
    line-height: 40px;
    font-size: 1.2em;
    text-align: center;
    position: absolute;
    top: 0;
    left: 10px; /* Adjust to align with the line */
    margin-left: -25px; /* Half of width + left offset */
    background-color: #999999;
    z-index: 100;
    border-radius: 50%;
}
.timeline-badge i {
    line-height: 40px;
}
.timeline-panel {
    position: relative;
    margin-left: 60px; /* Space for badge and line */
    padding: 10px 15px;
    border: 1px solid #ddd;
    border-radius: 8px;
    background-color: #fff;
    box-shadow: 0 1px 3px rgba(0,0,0,0.05);
}
.timeline-title {
    margin-top: 0;
    color: inherit;
    font-size: 0.85rem;
}
.timeline-body > p,
.timeline-body > ul {
    margin-bottom: 0;
}

/* Property administration */
.property-page-hero {
    overflow: hidden;
}

.property-page-hero::after {
    content: "";
    position: absolute;
    width: 9rem;
    height: 9rem;
    right: -2rem;
    bottom: -4.5rem;
    border: 1.5rem solid rgba(255, 255, 255, 0.08);
    border-radius: 50%;
    pointer-events: none;
}

.property-hero-icon {
    width: 2.8rem;
    height: 2.8rem;
    flex: 0 0 2.8rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 0.5rem;
    color: #fff;
    background: rgba(255, 255, 255, 0.16);
    font-size: 1.15rem;
}

.property-overview,
.property-detail-content,
.property-form-section {
    background: #fff;
    border: 1px solid #dbe4de;
    border-radius: 0.5rem;
}

.property-overview-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    border-bottom: 1px solid #e5ebe7;
}

.property-overview-item {
    display: flex;
    align-items: center;
    gap: 0.7rem;
    min-width: 0;
    padding: 0.9rem;
    border-right: 1px solid #e5ebe7;
}

.property-overview-item:last-child { border-right: 0; }

.property-overview-icon,
.property-section-icon {
    width: 2.25rem;
    height: 2.25rem;
    flex: 0 0 2.25rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 0.45rem;
}

.property-overview-item div,
.property-address div { min-width: 0; }

.property-overview-item small,
.property-address small,
.property-note-row small {
    display: block;
    color: #6c757d;
    font-size: 0.7rem;
    line-height: 1.2;
    margin-bottom: 0.15rem;
}

.property-overview-item strong {
    display: block;
    overflow: hidden;
    color: #1f2933;
    font-size: 0.83rem;
    line-height: 1.25;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.property-address {
    display: flex;
    align-items: flex-start;
    gap: 0.7rem;
    padding: 0.85rem 1rem;
}

.property-address > i { margin-top: 0.2rem; }
.property-address strong { display: block; font-size: 0.82rem; font-weight: 600; line-height: 1.45; }

.property-note-row {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.75rem;
    padding: 0 1rem 0.9rem;
}

.property-note-row > span {
    display: flex;
    gap: 0.55rem;
    padding: 0.65rem 0.75rem;
    border-radius: 0.4rem;
    background: #f7f9f8;
    color: #445049;
    font-size: 0.78rem;
}

.property-tabs-wrap {
    overflow-x: auto;
    scrollbar-width: thin;
}

.property-tabs {
    width: max-content;
    min-width: 100%;
    gap: 0.35rem;
    padding: 0.3rem;
    border: 1px solid #dbe4de;
    border-radius: 0.5rem;
    background: #fff;
}

.property-tabs .nav-link {
    display: flex;
    flex: 1 0 auto;
    align-items: center;
    justify-content: center;
    gap: 0.45rem;
    min-height: 2.4rem;
    padding: 0.4rem 0.8rem;
    border-radius: 0.35rem;
    color: #4b5a51;
    font-size: 0.78rem;
    font-weight: 600;
}

.property-tabs .nav-link b {
    min-width: 1.25rem;
    padding: 0.08rem 0.3rem;
    border-radius: 1rem;
    background: #edf2ef;
    font-size: 0.65rem;
}

.property-tabs .nav-link.active { background: var(--primary-green); color: #fff; }
.property-tabs .nav-link.active b { background: rgba(255, 255, 255, 0.2); }

.property-detail-content { overflow: hidden; }

.property-panel-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.9rem 1rem;
    border-bottom: 1px solid #e5ebe7;
}

.property-panel-heading h6,
.property-section-heading h6 { margin: 0; color: #223028; font-size: 0.9rem; font-weight: 700; }
.property-panel-heading p,
.property-section-heading p { margin: 0.15rem 0 0; color: #7a8680; font-size: 0.7rem; }

.property-inline-form {
    padding: 0.85rem 1rem;
    border-bottom: 1px solid #dbe4de;
    background: #f7faf8;
}

.property-data-table thead th {
    padding: 0.65rem 0.75rem;
    border-bottom-width: 1px;
    background: #f7f9f8;
    color: #6a756f;
    font-size: 0.68rem;
    font-weight: 700;
    text-transform: uppercase;
}

.property-data-table tbody td {
    padding: 0.65rem 0.75rem;
    color: #38443d;
    font-size: 0.77rem;
}

.property-data-table td strong,
.property-data-table td small { display: block; }
.property-data-table td small { margin-top: 0.1rem; color: #7b8580; font-size: 0.67rem; }
.property-row-inactive { opacity: 0.58; }
.property-icon-btn { width: 1.9rem; height: 1.9rem; padding: 0; }

.property-empty {
    height: 8rem;
    text-align: center;
    color: #87918c !important;
}

.property-empty i,
.property-empty span { display: block; }
.property-empty i { margin-bottom: 0.45rem; color: #aebbb4; font-size: 1.35rem; }

.property-edit-form { display: grid; gap: 0.9rem; }
.property-form-section { padding: 1rem; }

.property-section-heading {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-bottom: 1rem;
    padding-bottom: 0.8rem;
    border-bottom: 1px solid #edf1ee;
}

.property-billing-switch {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    min-height: 3.6rem;
    padding: 0.7rem 0.85rem;
    border: 1px solid #dbe4de;
    border-radius: 0.4rem;
    background: #f8faf9;
}

.property-billing-switch label { font-size: 0.82rem; }
.property-billing-switch span { color: #78837d; font-size: 0.7rem; }
.property-billing-switch .form-check-input { width: 2.4rem; height: 1.25rem; cursor: pointer; }

.property-form-actions {
    position: sticky;
    z-index: 5;
    bottom: 4.4rem;
    display: flex;
    justify-content: flex-end;
    gap: 0.5rem;
    padding: 0.75rem;
    border: 1px solid #dbe4de;
    border-radius: 0.5rem;
    background: rgba(255, 255, 255, 0.96);
    box-shadow: 0 -0.25rem 1rem rgba(33, 55, 42, 0.06);
    backdrop-filter: blur(8px);
}
.resident-combobox { position: relative; }
.resident-combobox-clear { width: 42px; padding-inline: 0; }
.resident-combobox-results { position: absolute; z-index: 1030; top: calc(100% - 1.15rem); left: 0; right: 0; max-height: 280px; overflow-y: auto; padding: 0.3rem; border: 1px solid #d6e0d9; border-radius: 8px; background: #ffffff; box-shadow: 0 12px 28px rgba(27, 55, 35, 0.16); }
.resident-combobox-option { width: 100%; min-height: 52px; padding: 0.45rem 0.55rem; border: 0; border-radius: 6px; background: transparent; text-align: left; }
.resident-combobox-option:hover,
.resident-combobox-option.active { background: #edf5ef; }
.resident-combobox-option strong,
.resident-combobox-option small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.resident-combobox-option strong { color: #2f3e34; font-size: 0.76rem; }
.resident-combobox-option small { margin-top: 0.15rem; color: #748078; font-size: 0.64rem; }
.resident-combobox-empty { padding: 1rem 0.5rem; color: #748078; font-size: 0.72rem; text-align: center; }
.property-list-filter .input-group-text { color: #738078; background: #ffffff; }
.user-search-form { display:flex; align-items:stretch; min-height:44px; overflow:hidden; border:1px solid #d5e2d9; border-radius:10px; background:#fff; }
.user-search-icon { display:grid; place-items:center; flex:0 0 42px; color:#74847a; cursor:text; }
.user-search-form .form-control { min-width:0; min-height:44px; padding:.55rem .25rem; border:0; border-radius:0; background:transparent; font-size:16px; box-shadow:none; touch-action:manipulation; }
.admin-search-input { position:relative; z-index:1; min-height:44px; font-size:16px !important; touch-action:auto !important; -webkit-user-select:text; user-select:text; }
label.input-group:has(> .admin-search-input) { cursor:text; }
.property-list-filter .input-group-text,.property-list-filter .input-group,.input-group:has(> .admin-search-input) .input-group-text { min-height:44px; }
.input-group:has(> .admin-search-input) .input-group-text { pointer-events:none; }
.user-search-form .form-control:focus { box-shadow:none; }
.user-search-form:focus-within { border-color:#72b587; box-shadow:0 0 0 3px rgba(25,135,84,.11); }
.user-search-form .btn { min-width:68px; margin:-1px; border-radius:0 9px 9px 0; font-size:.78rem; font-weight:700; }
.user-list-initial { display:grid; place-items:center; border-radius:50%; background:#dff1e5; color:#176b3a; font-size:1rem; font-weight:800; }
.housing-kpi-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .5rem; }
.housing-kpi-grid.status-three-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.housing-kpi-card { display: flex; align-items: center; gap: .55rem; min-width: 0; padding: .55rem .7rem; border: 1px solid #e2eae4; border-radius: .75rem; background: #fff; box-shadow: 0 2px 8px rgba(27, 74, 43, .04); }
.housing-kpi-icon { display: grid; place-items: center; flex: 0 0 2rem; width: 2rem; height: 2rem; border-radius: .55rem; background: #e8f4eb; color: #198754; font-size: .85rem; }
.housing-kpi-primary .housing-kpi-icon { background: #e9eefb; color: #315da6; }
.housing-kpi-warning .housing-kpi-icon { background: #fff3dc; color: #9a6500; }
.housing-kpi-secondary .housing-kpi-icon { background: #edf0ee; color: #617269; }
.housing-kpi-info .housing-kpi-icon { background: #e5f3f5; color: #168396; }
.housing-kpi-success .housing-kpi-icon { background: #e8f4eb; color: #198754; }
.housing-kpi-copy { display: block; min-width: 0; }
.housing-kpi-copy small { display: block; color: #64746b; font-size: .68rem; line-height: 1.15; }
.housing-kpi-copy strong { display: block; color: #223b2b; font-size: 1.18rem; line-height: 1.2; font-variant-numeric: tabular-nums; }
@media (max-width: 767.98px) { .housing-kpi-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .4rem; } .housing-kpi-card { padding: .45rem .5rem; gap: .4rem; } .housing-kpi-icon { flex-basis: 1.75rem; width: 1.75rem; height: 1.75rem; } .housing-kpi-copy small { font-size: .61rem; } .housing-kpi-copy strong { font-size: 1.05rem; } }
@media (max-width: 767.98px) { .housing-kpi-grid.status-three-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.property-list { overflow: hidden; }
.property-list-row { min-height: 74px; padding-block: 0.55rem; }
.property-list-main { display: grid; gap: 0.12rem; }
.property-list-main strong span { margin-left: 0.4rem; color: #758078; font-size: 0.64rem; font-weight: 500; }
.property-list-main small { display: flex; align-items: center; gap: 0.3rem; }
.property-list-main small i { width: 0.7rem; color: #8a9690; font-size: 0.6rem; text-align: center; }
.property-list-meta { width: 5.8rem; }
.property-list-meta .badge { max-width: 100%; overflow: hidden; text-overflow: ellipsis; }
.property-list-meta small { margin-top: 0.08rem; line-height: 1.15; }

@media (max-width: 767.98px) {
    .property-overview-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .property-overview-item:nth-child(2) { border-right: 0; }
    .property-overview-item:nth-child(-n+2) { border-bottom: 1px solid #e5ebe7; }
    .property-note-row { grid-template-columns: 1fr; }
    .property-tabs .nav-link { min-width: 7.2rem; }
    .property-data-table { overflow-x: auto; }
    .property-data-table table { min-width: 40rem; }
    .property-form-actions .btn { flex: 1; }
    .property-list-row { min-height: 72px; padding-inline: 0.6rem; gap: 0.5rem; }
    .property-list-meta { width: 4.9rem; }
}

@media (max-width: 420px) {
    .property-overview-item { align-items: flex-start; padding: 0.75rem; }
    .property-overview-icon { width: 1.9rem; height: 1.9rem; flex-basis: 1.9rem; font-size: 0.8rem; }
    .property-panel-heading p { display: none; }
}

/* Non-IPL workflow */
.non-ipl-program-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.75rem; }
.non-ipl-program { padding: 0.9rem; border-radius: 8px; min-width: 0; }
.non-ipl-program-head { display: flex; align-items: flex-start; gap: 0.7rem; margin-bottom: 0.65rem; }
.non-ipl-program-icon { width: 2.35rem; height: 2.35rem; flex: 0 0 2.35rem; border-radius: 8px; display: inline-flex; align-items: center; justify-content: center; }
.non-ipl-program h6 { margin: 0; color: #26342c; font-size: 0.86rem; font-weight: 700; line-height: 1.3; }
.non-ipl-program > p { min-height: 2.2rem; margin-bottom: 0.75rem; color: #6e7a73; font-size: 0.72rem; line-height: 1.45; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.non-ipl-program-meta { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.5rem; margin-bottom: 0.75rem; padding: 0.65rem; border-radius: 6px; background: #f6f9f7; }
.non-ipl-program-meta span { min-width: 0; }
.non-ipl-program-meta small { display: block; color: #78837d; font-size: 0.63rem; }
.non-ipl-program-meta strong { display: block; overflow: hidden; color: #344139; font-size: 0.73rem; text-overflow: ellipsis; white-space: nowrap; }
.non-ipl-stat { min-height: 72px; padding: 0.55rem; border-radius: 8px; display: grid; grid-template-columns: 2rem 1fr; grid-template-rows: 1fr 1fr; column-gap: 0.5rem; align-items: center; }
.non-ipl-stat > span { grid-row: 1 / 3; width: 2rem; height: 2rem; border-radius: 7px; display: inline-flex; align-items: center; justify-content: center; }
.non-ipl-stat small { align-self: end; color: #748078; font-size: 0.62rem; }
.non-ipl-stat strong { align-self: start; color: #26342c; font-size: 1rem; line-height: 1.1; }
.non-ipl-event-row .transaction-meta { max-width: 8rem; }
.non-ipl-event-row .transaction-meta strong { display: block; overflow: hidden; font-size: 0.75rem; text-overflow: ellipsis; white-space: nowrap; }
.non-ipl-detail-description { max-height: 38vh; overflow-y: auto; padding: 0.75rem; border: 1px solid #e3e9e5; border-radius: 8px; background: #f8faf9; color: #536058; font-size: 0.76rem; line-height: 1.55; }
.non-ipl-create-hero-icon { display: grid; place-items: center; width: 48px; height: 48px; flex: 0 0 48px; border-radius: 14px; color: #fff; background: rgba(255,255,255,.16); font-size: 1.3rem; }
.non-ipl-create-card, .non-ipl-create-form { border-radius: 12px; box-shadow: 0 4px 16px rgba(25,55,39,.045); }
.non-ipl-create-label { display: block; margin-bottom: .3rem; color: #6c757d; font-size: .78rem; font-weight: 600; text-transform: uppercase; letter-spacing: .035em; }
.non-ipl-suggested { min-width: 145px; padding: .7rem .85rem; border-radius: 10px; background: #edf8f1; text-align: right; }
.non-ipl-suggested span, .non-ipl-suggested strong { display: block; }
.non-ipl-suggested span { color: #647268; font-size: .74rem; }
.non-ipl-suggested strong { color: #168348; font-size: 1rem; }
.non-ipl-create-description { max-height: 42vh; overflow-y: auto; padding: 1rem; border: 1px solid #dfe8e2; border-left: 4px solid #23965a; border-radius: 8px; background: #f8fbf9; color: #26342b; font-size: 1rem; line-height: 1.75; white-space: normal; }
.non-ipl-form-icon { display: grid; place-items: center; width: 42px; height: 42px; flex: 0 0 42px; border-radius: 11px; color: #168348; background: #e9f7ef; font-size: 1.05rem; }
.non-ipl-proof-field { display: flex; align-items: center; gap: 1rem; padding: 1rem; border: 1px dashed #b8c8bd; border-radius: 10px; background: #fafcfb; }
.non-ipl-proof-field > i { color: #23965a; font-size: 1.6rem; }
@media (max-width: 575.98px) {
  .non-ipl-suggested { width: 100%; text-align: left; }
  .non-ipl-create-description { padding: .85rem; font-size: .96rem; line-height: 1.65; }
  .non-ipl-proof-field { align-items: flex-start; gap: .75rem; padding: .85rem; }
  .non-ipl-form-actions .btn { width: 100%; min-height: 46px; }
}
.non-ipl-detail-fact { min-height: 58px; padding: 0.65rem; border-radius: 8px; background: #f3f7f4; }
.non-ipl-detail-fact span { display: block; margin-bottom: 0.15rem; color: #77827c; font-size: 0.63rem; }
.non-ipl-detail-fact strong { display: block; color: #2d3932; font-size: 0.74rem; line-height: 1.3; }

/* Berita dan pengumuman */
.announcement-filter { display: grid; grid-template-columns: minmax(0, 1fr) 12rem auto; gap: 0.5rem; padding: 0.65rem; border-radius: 8px; }
.announcement-list { overflow: hidden; }
.announcement-row { min-height: 86px; }
.announcement-row .transaction-main { gap: 0.16rem; }
.announcement-row .transaction-main > strong { display: -webkit-box; overflow: hidden; line-height: 1.3; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.announcement-excerpt { display: -webkit-box; overflow: hidden; line-height: 1.35; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.announcement-row .transaction-meta { min-width: 5.5rem; max-width: 7rem; }
.announcement-row .transaction-meta > strong { color: #405349; }
.announcement-row .transaction-meta small { display: -webkit-box; overflow: hidden; white-space: normal; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.announcement-list-thumb { overflow: hidden; background: #edf3ef; }
.announcement-list-thumb img { width: 100%; height: 100%; object-fit: cover; }
.announcement-manage-row { min-height: 76px; }
.announcement-detail-title { overflow-wrap: anywhere; }
.content-reactions { display:flex; align-items:center; gap:.75rem 1rem; padding:.7rem 1rem; background:#fafcfb; }
.content-reactions h2 { flex:0 0 auto; margin:0; color:#526a59; font-size:.76rem; font-weight:700; }
.content-reactions-grid { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:.35rem; margin-left:auto; }
.content-reactions-grid form { margin:0; }
.content-reaction-option { display:inline-flex; align-items:center; justify-content:center; gap:.32rem; min-height:35px; padding:.28rem .55rem; border:1px solid #dce6df; border-radius:8px; background:#fff; color:#435b4a; transition:background .15s,border-color .15s; }
.content-reaction-option:hover,.content-reaction-option:focus-visible { background:#eef6f0; border-color:#afcbb7; }
.content-reaction-option.is-selected { background:#e9f5ed; border-color:#7eb58d; color:#176b3a; }
.content-reaction-icon { width:1rem; color:#718879; font-size:.86rem; line-height:1; }
.content-reaction-option.is-selected .content-reaction-icon { color:#176b3a; }
.content-reaction-label { font-size:.74rem; }
.content-reaction-option strong { min-width:.6rem; font-size:.7rem; color:#698072; font-weight:600; }
@media(max-width:575.98px){.content-reactions{align-items:flex-start;flex-direction:column}.content-reactions-grid{justify-content:flex-start;margin-left:0}.content-reaction-option{min-height:34px}}
.announcement-detail { overflow: hidden; border-radius: 8px; }
.announcement-detail-cover { display: flex; align-items: center; justify-content: center; width: 100%; max-height: 460px; margin: 0; background: #eef2ef; }
.announcement-detail-cover img { display: block; width: 100%; max-height: 460px; object-fit: contain; }
.announcement-detail-meta { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; padding: 0.75rem 1rem; border-bottom: 1px solid #e3e9e5; background: #f5f8f6; color: #6c776f; font-size: 0.7rem; }
.announcement-detail-body { padding: 1.15rem; color: #354239; font-size: 0.84rem; line-height: 1.75; overflow-wrap: anywhere; }
.announcement-detail-body h2,
.announcement-detail-body h3,
.announcement-detail-body h4 { margin: 1.25rem 0 0.5rem; color: #26372c; letter-spacing: 0; line-height: 1.35; }
.announcement-detail-body h2 { font-size: 1.15rem; }
.announcement-detail-body h3 { font-size: 1rem; }
.announcement-detail-body h4 { font-size: 0.9rem; }
.announcement-detail-body p,
.announcement-detail-body ul,
.announcement-detail-body ol,
.announcement-detail-body blockquote,
.announcement-detail-body figure { margin-bottom: 1rem; }
.announcement-detail-body img { display: block; max-width: 100%; height: auto; margin-inline: auto; border-radius: 6px; }
.announcement-detail-body figure.image { max-width: 100%; margin-inline: auto; text-align: center; }
.announcement-detail-body figcaption { margin-top: 0.35rem; color: #748078; font-size: 0.68rem; line-height: 1.4; }
.announcement-detail-body blockquote { padding: 0.65rem 0.85rem; border-left: 3px solid var(--primary-green); background: #f3f7f4; color: #536058; }
.announcement-detail-body table { display: block; max-width: 100%; overflow-x: auto; border-collapse: collapse; }
.announcement-detail-body th,
.announcement-detail-body td { padding: 0.45rem; border: 1px solid #dce5df; }
.announcement-detail-body a { color: var(--primary-green); }
.announcement-form .form-label { margin-bottom: 0.3rem; color: #465349; font-size: 0.76rem; font-weight: 600; }
.announcement-form textarea { resize: vertical; }
.announcement-form .ck-editor__editable_inline { min-height: 260px; color: #354239; font-size: 0.84rem; line-height: 1.6; }
.announcement-form .ck.ck-editor__main > .ck-editor__editable:focus { border-color: #69a475; box-shadow: 0 0 0 0.2rem rgba(40, 110, 59, 0.12); }
.announcement-cover-preview { display: flex; align-items: center; justify-content: center; max-height: 260px; overflow: hidden; border: 1px solid #dce5df; border-radius: 8px; background: #f3f6f4; }
.announcement-cover-preview img { display: block; max-width: 100%; max-height: 260px; object-fit: contain; }
.announcement-target-dropdown .dropdown-menu { max-height: 280px; overflow-y: auto; border-color: #dce5df; border-radius: 8px; box-shadow: 0 10px 24px rgba(28, 54, 36, 0.12); }
.announcement-target-option { display: flex; align-items: center; gap: 0.65rem; min-height: 48px; padding: 0.4rem 0.45rem; border-radius: 6px; cursor: pointer; }
.announcement-target-option:hover { background: #f0f6f2; }
.announcement-target-option .form-check-input { flex: 0 0 auto; margin: 0; }
.announcement-target-option span { min-width: 0; }
.announcement-target-option strong,
.announcement-target-option small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.announcement-target-option strong { color: #344139; font-size: 0.75rem; }
.announcement-target-option small { color: #748078; font-size: 0.64rem; }
.invitation-panel, .invitation-statistics { overflow: hidden; border-radius: 8px; }
.invitation-heading { display: flex; align-items: center; justify-content: space-between; gap: 0.75rem; padding: 0.75rem; border-bottom: 1px solid #e3e9e5; background: #f6f9f7; }
.invitation-heading > div { min-width: 0; display: flex; align-items: center; gap: 0.6rem; }
.invitation-icon { width: 36px; height: 36px; flex: 0 0 36px; display: inline-flex; align-items: center; justify-content: center; border-radius: 8px; background: #e5f2e8; color: var(--primary-green); }
.invitation-heading small, .invitation-heading strong { display: block; }
.invitation-heading small { color: #748078; font-size: 0.61rem; }
.invitation-heading strong { color: #2e4034; font-size: 0.82rem; }
.invitation-heading .badge { font-size: 0.6rem; }
.invitation-facts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-bottom: 1px solid #e3e9e5; }
.invitation-facts > div { min-width: 0; display: flex; align-items: center; gap: 0.5rem; padding: 0.7rem; border-right: 1px solid #edf1ee; }
.invitation-facts > div:last-child { border-right: 0; }
.invitation-facts > div > i { color: #598064; }
.invitation-facts span { min-width: 0; }
.invitation-facts small, .invitation-facts strong { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.invitation-facts small { color: #748078; font-size: 0.59rem; }
.invitation-facts strong { color: #34463a; font-size: 0.7rem; }
.invitation-response-form { padding: 0.75rem; }
.invitation-response-form legend { margin-bottom: 0.45rem; color: #4c5b51; font-size: 0.67rem; font-weight: 700; }
.invitation-response-options { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0.45rem; }
.invitation-response-options input { position: absolute; opacity: 0; pointer-events: none; }
.invitation-response-options span { min-height: 38px; display: flex; align-items: center; justify-content: center; gap: 0.35rem; padding: 0.45rem; border: 1px solid #dce5df; border-radius: 7px; color: #526158; font-size: 0.68rem; cursor: pointer; }
.invitation-response-options input:checked + span { border-color: #4d8a5b; background: #eaf4ec; color: #286e3b; font-weight: 700; box-shadow: 0 0 0 2px rgba(40, 110, 59, 0.08); }
.invitation-response-options input:focus-visible + span { outline: 2px solid #4d8a5b; outline-offset: 2px; }
.invitation-current-response { padding: 0.7rem 0.75rem; color: #3d5945; font-size: 0.7rem; }
.invitation-statistics { padding: 0.75rem; }
.invitation-statistics-heading { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.invitation-statistics-heading strong, .invitation-statistics-heading small { display: block; }
.invitation-statistics-heading strong { color: #2e4034; font-size: 0.78rem; }
.invitation-statistics-heading small { color: #748078; font-size: 0.61rem; }
.invitation-statistics-heading > span { color: var(--primary-green); font-size: 1rem; font-weight: 800; }
.invitation-progress { height: 5px; margin: 0.55rem 0 0.7rem; background: #edf1ee; }
.invitation-stats-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border: 1px solid #e5ebe7; border-radius: 7px; }
.invitation-stats-grid > div { min-width: 0; padding: 0.55rem; border-right: 1px solid #e5ebe7; }
.invitation-stats-grid > div:last-child { border-right: 0; }
.invitation-stats-grid small, .invitation-stats-grid strong { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.invitation-stats-grid small { color: #748078; font-size: 0.57rem; }
.invitation-stats-grid strong { color: #33443a; font-size: 0.9rem; letter-spacing: 0; }
.invitation-compliance { display: flex; justify-content: space-between; align-items: center; gap: 0.75rem; margin-top: 0.65rem; padding: 0.55rem 0.65rem; border-left: 3px solid #d69b18; background: #fff8e8; color: #70571d; font-size: 0.62rem; }
.invitation-compliance span { font-weight: 700; }
.invitation-compliance b { margin: 0 0.25rem; color: #b39859; font-weight: 400; }
@media (max-width: 575.98px) { .invitation-facts { grid-template-columns: 1fr; } .invitation-facts > div { border-right: 0; border-bottom: 1px solid #edf1ee; } .invitation-facts > div:last-child { border-bottom: 0; } .invitation-stats-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .invitation-stats-grid > div:nth-child(2) { border-right: 0; } .invitation-stats-grid > div:nth-child(-n+2) { border-bottom: 1px solid #e5ebe7; } .invitation-compliance { align-items: flex-start; flex-direction: column; } }
.complaint-summary-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0.5rem; }
.complaint-summary-item { min-width: 0; min-height: 64px; display: flex; align-items: center; gap: 0.55rem; padding: 0.6rem; border: 1px solid #e1e8e3; border-radius: 8px; background: #fff; }
.complaint-summary-item > span { width: 32px; height: 32px; flex: 0 0 32px; display: inline-flex; align-items: center; justify-content: center; border-radius: 7px; }
.complaint-summary-item div { min-width: 0; }
.complaint-summary-item small, .complaint-summary-item strong { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.complaint-summary-item small { color: #748078; font-size: 0.62rem; }
.complaint-summary-item strong { color: #26372c; font-size: 1rem; letter-spacing: 0; }
.complaint-list { overflow: hidden; }
.complaint-row { min-height: 84px; }
.complaint-list-excerpt { display: -webkit-box !important; overflow: hidden; white-space: normal !important; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.complaint-row .transaction-meta > strong { color: #405349; }
.complaint-detail-id { overflow-wrap: anywhere; }
.complaint-detail-summary { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); overflow: hidden; border: 1px solid #e1e8e3; border-radius: 8px; background: #fff; }
.complaint-detail-summary > div { min-width: 0; padding: 0.7rem; border-right: 1px solid #e8ede9; }
.complaint-detail-summary > div:last-child { border-right: 0; }
.complaint-detail-summary small, .complaint-detail-summary strong { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.complaint-detail-summary small { color: #748078; font-size: 0.61rem; }
.complaint-detail-summary strong { color: #2f4035; font-size: 0.76rem; letter-spacing: 0; }
.complaint-description, .complaint-description + section, .complaint-description + section + form { border-radius: 8px; }
.complaint-description p { color: #39483e; font-size: 0.8rem; line-height: 1.65; overflow-wrap: anywhere; }
.complaint-section-title { color: #2d3d33; font-size: 0.86rem; font-weight: 700; letter-spacing: 0; }
.complaint-timeline { position: relative; padding-left: 2.55rem; }
.complaint-timeline::before { content: ''; position: absolute; top: 8px; bottom: 8px; left: 17px; width: 2px; background: #dfe7e1; }
.complaint-timeline-item { position: relative; padding-bottom: 1rem; }
.complaint-timeline-item:last-child { padding-bottom: 0; }
.complaint-timeline-marker { position: absolute; top: 0; left: -2.55rem; z-index: 1; width: 36px; height: 36px; display: inline-flex; align-items: center; justify-content: center; border: 3px solid #fff; border-radius: 50%; color: #fff; box-shadow: 0 0 0 1px #dfe7e1; }
.complaint-timeline-content { min-width: 0; padding: 0.65rem 0.75rem; border: 1px solid #e3e9e5; border-radius: 7px; background: #f9fbfa; }
.complaint-timeline-heading { display: flex; justify-content: space-between; align-items: start; gap: 0.75rem; }
.complaint-timeline-heading strong { color: #2e3f34; font-size: 0.76rem; }
.complaint-timeline-heading time, .complaint-timeline-content > small { color: #78847c; font-size: 0.62rem; }
.complaint-timeline-meta { display: flex; align-items: center; justify-content: space-between; gap: 0.65rem; margin-top: 0.1rem; }
.complaint-timeline-meta small { color: #78847c; font-size: 0.62rem; }
.complaint-duration { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.16rem 0.36rem; border-radius: 5px; background: #edf4ef; color: #42614c; font-size: 0.6rem; white-space: nowrap; }
.complaint-timeline-content p { margin: 0.45rem 0 0; color: #445148; font-size: 0.75rem; line-height: 1.55; overflow-wrap: anywhere; }
.complaint-attachment, .complaint-status-change { display: inline-flex; align-items: center; gap: 0.3rem; margin: 0.5rem 0.45rem 0 0; font-size: 0.64rem; }
.complaint-attachment { color: var(--primary-green); text-decoration: none; }
.complaint-image-preview{position:relative;width:100%;display:block;overflow:hidden;padding:0;border:0;border-radius:8px;background:#edf3ef;cursor:zoom-in}.complaint-image-preview .complaint-inline-image{display:block;margin:0;transition:transform .2s ease,filter .2s ease}.complaint-image-preview>span{position:absolute;right:.4rem;bottom:.4rem;display:inline-flex;align-items:center;gap:.25rem;padding:.24rem .42rem;border-radius:6px;background:rgba(18,47,28,.82);color:#fff;font-size:.58rem;font-weight:700;opacity:0;transform:translateY(3px);transition:opacity .2s ease,transform .2s ease}.complaint-image-preview:hover .complaint-inline-image,.complaint-image-preview:focus-visible .complaint-inline-image{transform:scale(1.025);filter:brightness(.88)}.complaint-image-preview:hover>span,.complaint-image-preview:focus-visible>span{opacity:1;transform:none}.complaint-image-preview:focus-visible{outline:2px solid var(--primary-green);outline-offset:2px}@media(hover:none){.complaint-image-preview>span{opacity:1;transform:none}}
.complaint-status-change { padding: 0.2rem 0.4rem; border-radius: 5px; background: #e9f2eb; color: #356141; }
.complaint-status-select { width: 125px; flex: 0 0 125px; }
@media (max-width: 575.98px) { .complaint-summary-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .complaint-detail-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); } .complaint-detail-summary > div:nth-child(2) { border-right: 0; } .complaint-detail-summary > div:nth-child(-n+2) { border-bottom: 1px solid #e8ede9; } .complaint-row .transaction-meta { max-width: 5.3rem; } }
.dashboard-news-thumb { overflow: hidden; background: #edf3ef; }
.dashboard-news-thumb img { width: 100%; height: 100%; object-fit: cover; }
.patrol-map { width: 100%; height: min(55vh, 420px); min-height: 280px; background: #eef3ef; }
.patrol-route-title { display: -webkit-box; margin-top: 0; overflow: hidden; font-size: clamp(1rem, 3.5vw, 1.2rem); line-height: 1.15; overflow-wrap: anywhere; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.patrol-countdown { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 0.4rem 1rem; border: 1px solid #cfe2ff; border-radius: 10px; background: #f4f8ff; color: #315b86; text-align: center; }
.patrol-countdown > span { font-size: 0.72rem; font-weight: 600; }
.patrol-countdown > strong { margin: -0.08rem 0; font-size: clamp(2.7rem, 9vw, 3.75rem); line-height: 0.95; letter-spacing: 0.04em; font-variant-numeric: tabular-nums; }
.patrol-countdown > small { color: #6b7f94; font-size: 0.68rem; }
.patrol-countdown.is-overdue { border-color: #f1b8bd; background: #fff5f5; color: #b02a37; }
.patrol-countdown.is-overdue > small { color: #8c666a; }
.patrol-issue-item { display: flex; align-items: flex-start; gap: 0.55rem; padding: 0.55rem 0.65rem; border-bottom: 1px solid #edf0ee; }
.patrol-issue-item:last-child { border-bottom: 0; }
.patrol-issue-icon { display: inline-flex; width: 28px; height: 28px; flex: 0 0 28px; align-items: center; justify-content: center; border-radius: 50%; background: #fff3cd; color: #997404; font-size: 0.75rem; }
.patrol-issue-item strong { font-size: 0.82rem; }
.patrol-issue-item time { color: #778079; font-size: 0.72rem; white-space: nowrap; }
.patrol-issue-detail { display: flex; align-items: baseline; gap: 0.4rem; margin-top: 0.08rem; font-size: 0.76rem; }
.patrol-issue-detail span { flex: 0 0 auto; color: #778079; }
.patrol-issue-detail span::after { content: '·'; margin-left: 0.4rem; }
.patrol-issue-detail p { min-width: 0; margin: 0; color: #3f4842; overflow-wrap: anywhere; }
.patrol-issue-modal .input-group-text { border-color: #dee2e6; background: #fff8e1; color: #997404; }
.patrol-summary { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); overflow: hidden; border: 1px solid #dfe7e1; border-radius: 8px; background: #fff; }
.patrol-summary > div { min-width: 0; padding: 0.7rem; border-right: 1px solid #e5ebe7; text-align: center; }
.patrol-summary > div:last-child { border-right: 0; }
.patrol-summary small, .patrol-summary strong { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.patrol-summary small { color: #748078; font-size: 0.6rem; }
.patrol-summary strong { color: #2d4134; font-size: 0.9rem; letter-spacing: 0; }
.patrol-time-card{overflow:hidden;border:1px solid #dce7df;border-radius:12px;background:#fff;box-shadow:0 5px 18px rgba(35,76,47,.07)}
.patrol-time-header{display:flex;align-items:center;gap:.65rem;padding:.75rem .85rem;border-bottom:1px solid #e5ede7;background:linear-gradient(135deg,#f2faf4,#fbfdfb)}
.patrol-time-header-icon{width:36px;height:36px;display:grid;place-items:center;flex:0 0 36px;border-radius:10px;background:#dff2e4;color:#24743a;font-size:.9rem}.patrol-time-header>div{min-width:0;flex:1}.patrol-time-header h6{margin:0;color:#294334;font-size:.82rem;font-weight:800}.patrol-time-header small{display:block;color:#748078;font-size:.58rem}.patrol-time-status{display:inline-flex;align-items:center;gap:.3rem;padding:.28rem .52rem;border-radius:999px;background:#def2e4;color:#24743a;font-size:.56rem;font-weight:800}.patrol-time-card.is-running .patrol-time-status{background:#fff0c7;color:#936600}.patrol-time-card.is-running .patrol-time-status i{animation:patrolTimePulse 1.35s ease-in-out infinite}
.patrol-time-body{display:grid;grid-template-columns:minmax(0,1fr) minmax(150px,.32fr);gap:1rem;align-items:stretch;padding:.9rem}.patrol-time-line{display:grid;grid-template-columns:auto minmax(80px,1fr) auto;align-items:center;min-width:0}.patrol-time-point{display:flex;align-items:center;gap:.55rem;min-width:0}.patrol-time-point>span{width:34px;height:34px;display:grid;place-items:center;flex:0 0 34px;border:3px solid #e3f3e7;border-radius:50%;background:#2e8044;color:#fff;font-size:.65rem;box-shadow:0 0 0 1px #b9d9c1}.patrol-time-point.is-end>span{background:#176b3a}.patrol-time-point.is-pending>span{border-color:#f7ecc9;background:#d49a16;box-shadow:0 0 0 1px #e7ca82}.patrol-time-point small,.patrol-time-point strong,.patrol-time-point time{display:block;white-space:nowrap}.patrol-time-point small{color:#7b877f;font-size:.52rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em}.patrol-time-point strong{color:#263c2d;font-size:.88rem;font-variant-numeric:tabular-nums}.patrol-time-point time{color:#7b877f;font-size:.55rem}.patrol-time-connector{position:relative;display:flex;justify-content:center;min-width:0;padding:0 .6rem}.patrol-time-connector i{position:absolute;top:50%;right:.35rem;left:.35rem;height:2px;background:linear-gradient(90deg,#58a86d,#b7d9c0)}.patrol-time-connector i::after{content:'';position:absolute;top:-3px;right:-1px;border-width:4px 0 4px 6px;border-style:solid;border-color:transparent transparent transparent #b7d9c0}.patrol-time-connector span{position:relative;padding:.18rem .42rem;border:1px solid #dce9df;border-radius:999px;background:#fff;color:#5b6e61;font-size:.52rem;font-weight:700;white-space:nowrap}.patrol-time-duration{display:flex;align-items:center;gap:.65rem;padding:.65rem .75rem;border-radius:9px;background:linear-gradient(135deg,#176b3a,#2e8750);color:#fff}.patrol-time-duration>span{width:32px;height:32px;display:grid;place-items:center;flex:0 0 32px;border-radius:9px;background:rgba(255,255,255,.16)}.patrol-time-duration small,.patrol-time-duration strong{display:block}.patrol-time-duration small{color:rgba(255,255,255,.7);font-size:.52rem}.patrol-time-duration strong{font-size:.9rem;white-space:nowrap}@keyframes patrolTimePulse{50%{opacity:.4;transform:scale(.85)}}
.security-report-summary { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.security-activity-compact-row { width:100%; border:0; border-bottom:1px solid #e5ebe7; padding:.55rem .65rem; display:flex; align-items:center; gap:.55rem; text-align:left; background:#fff; }
.security-activity-compact-row:last-child { border-bottom:0; }
.security-activity-compact-row.is-pending { background:#fffaf0; border-left:4px solid #f0ad00; }
.security-activity-compact-row.is-resolved { background:#f2fbf5; border-left:4px solid #198754; }
.security-activity-state { width:30px; height:30px; flex:0 0 30px; border-radius:50%; display:inline-flex; align-items:center; justify-content:center; }
.is-pending .security-activity-state { background:#fff0bd; color:#a66b00; }.is-resolved .security-activity-state { background:#d9f3e2; color:#198754; }
.security-activity-copy { min-width:0; flex:1; display:flex; flex-direction:column; }.security-activity-copy>span { display:flex; gap:.4rem; align-items:center; }.security-activity-copy strong { font-size:.76rem; }.security-activity-copy small { font-size:.62rem; color:#6d7971; }.security-activity-copy>span small,.security-activity-excerpt { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.security-activity-meta { display:flex; align-items:center; gap:.35rem; color:#758078; font-size:.65rem; }.security-activity-meta .badge { font-size:.52rem; }
.security-activity-audit { border-top:1px dashed #d9e2dc; padding-top:.5rem; }
.patrol-sequence { width: 34px; height: 34px; flex: 0 0 34px; display: inline-flex; align-items: center; justify-content: center; border: 1px solid #dbe4de; border-radius: 50%; background: #f5f8f6; color: #526058; font-weight: 800; }
.patrol-sequence.is-done { border-color: #2f7d3e; background: #e6f3e9; color: #2f7d3e; }
.patrol-sequence.is-warning { border-color: #d69b18; background: #fff5dc; color: #8a620b; }
.patrol-checkpoint-row { min-height: 68px; display: flex; align-items: center; gap: 0.75rem; padding: 0.65rem 0.75rem; border: 0; border-bottom: 1px solid #e8ede9; background: #fff; color: #324238; }
.patrol-checkpoint-row:last-child { border-bottom: 0; }
.patrol-checkpoint-row:hover { background: #f6faf7; }
.patrol-section-title { color: #31513a; font-size: 0.8rem; font-weight: 750; letter-spacing: 0; }
.patrol-progress { display: flex; align-items: center; gap: 0.75rem; padding: 0.65rem 0.75rem; border: 1px solid #dfe7e1; border-radius: 8px; background: #fff; }
.patrol-progress > span { min-width: 96px; }
.patrol-progress > span strong, .patrol-progress > span small { display: block; }
.patrol-progress > span strong { color: #33463a; font-size: 0.7rem; }
.patrol-progress > span small { color: #748078; font-size: 0.58rem; }
.patrol-progress > .progress { height: 6px; flex: 1 1 auto; }
.patrol-progress > strong { color: var(--primary-green); font-size: 0.72rem; }
.patrol-route-launcher, .patrol-route-config, .patrol-filter-bar { border-radius: 8px; overflow: hidden; }
.patrol-route-launch-row { min-height: 74px; display: flex; align-items: center; gap: 0.7rem; padding: 0.65rem 0.75rem; border-bottom: 1px solid #e8ede9; }
.patrol-route-launch-row:last-child { border-bottom: 0; }
.patrol-report-row { min-height: 74px; }
.patrol-manage-summary { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); overflow: hidden; border: 1px solid #dfe7e1; border-radius: 8px; background: #fff; }
.patrol-manage-summary > span { min-width: 0; padding: 0.65rem; border-right: 1px solid #e7ede9; text-align: center; }
.patrol-manage-summary > span:last-child { border-right: 0; }
.patrol-manage-summary strong, .patrol-manage-summary small { display: block; }
.patrol-manage-summary strong { color: #2f4937; font-size: 1rem; }
.patrol-manage-summary small { color: #748078; font-size: 0.6rem; }
.patrol-route-config-header { display: flex; align-items: center; gap: 0.55rem; padding: 0.7rem; border-bottom: 1px solid #e7ede9; }
.patrol-route-description { margin: 0; padding: 0.55rem 0.75rem; border-bottom: 1px solid #edf1ee; color: #67766d; font-size: 0.67rem; }
.patrol-checkpoint-config-row { width: 100%; min-height: 68px; display: flex; align-items: center; gap: 0.65rem; padding: 0.6rem 0.7rem; border: 0; border-bottom: 1px solid #edf1ee; background: #fff; text-align: left; }
.patrol-checkpoint-config-row:last-child { border-bottom: 0; }
.patrol-checkpoint-config-row:hover { background: #f6faf7; }
.patrol-manage-header-actions { flex:0 0 auto;display:flex;gap:.4rem; }.patrol-manage-header-actions .btn { border-radius:8px;font-size:.67rem;font-weight:750;white-space:nowrap; }
.patrol-manage-jump { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.45rem; }.patrol-manage-jump a { min-height:42px;display:flex;align-items:center;justify-content:center;gap:.4rem;border:1px solid #d3e1d7;border-radius:9px;background:rgba(255,255,255,.92);color:#44604d;font-size:.68rem;font-weight:750;text-decoration:none; }.patrol-manage-jump a:hover { border-color:#7db08a;background:#eef7f0;color:#176b3a; }
.patrol-manage-card { border-radius:11px;overflow:hidden; }.patrol-manage-section-head { display:flex;align-items:center;gap:.65rem; }.patrol-manage-section-head>span { width:34px;height:34px;flex:0 0 34px;display:grid;place-items:center;border-radius:9px; }.patrol-manage-section-head>div { min-width:0;flex:1; }.patrol-manage-section-head h6,.patrol-manage-section-head p { margin:0; }.patrol-manage-section-head h6 { color:#304b38;font-size:.78rem;font-weight:800; }.patrol-manage-section-head p { margin-top:.12rem;color:#748078;font-size:.61rem;line-height:1.35; }
.patrol-master-item { min-height:91px;display:grid;grid-template-columns:36px minmax(0,1fr) auto;align-items:start;gap:.55rem;padding:.65rem;border:1px solid #dce6df;border-radius:9px;background:#fbfdfb; }.patrol-master-marker { width:36px;height:36px;display:grid;place-items:center;border-radius:9px;background:#e1f1e6;color:#176b3a; }.patrol-master-copy { min-width:0; }.patrol-master-copy strong,.patrol-master-copy small,.patrol-master-copy span { display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }.patrol-master-copy strong { color:#30483a;font-size:.72rem; }.patrol-master-copy small { margin-top:.1rem;color:#718078;font-size:.58rem; }.patrol-master-copy span { color:#8a958e;font-size:.55rem; }.patrol-master-item>.badge { font-size:.55rem; }.patrol-master-actions { grid-column:2/-1;display:flex;gap:.35rem; }.patrol-master-actions .btn { padding:.25rem .5rem;font-size:.59rem; }
.patrol-route-section-heading { display:flex;align-items:center;gap:.6rem;margin:.9rem 0 .55rem;padding:0 .15rem; }.patrol-route-section-heading>span { width:32px;height:32px;display:grid;place-items:center;border-radius:9px;background:#dff0e5;color:#176b3a; }.patrol-route-section-heading strong,.patrol-route-section-heading small { display:block; }.patrol-route-section-heading strong { color:#304b38;font-size:.8rem; }.patrol-route-section-heading small { color:#748078;font-size:.61rem; }
.patrol-route-manage-card { border-radius:10px;overflow:hidden; }.patrol-route-manage-card .card-header { padding:.6rem .7rem; }.patrol-route-manage-card .card-header strong { color:#30483a;font-size:.73rem; }.patrol-route-manage-card .card-header small { font-size:.58rem; }.patrol-route-checkpoint-row { min-height:52px;display:flex;align-items:center;gap:.5rem;padding:.45rem .65rem;border-top:1px solid #edf1ee;background:#fff; }.patrol-route-checkpoint-row strong { display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#34483b;font-size:.68rem; }.patrol-route-checkpoint-row small { font-size:.55rem; }.patrol-route-sequence { width:42px;flex:0 0 42px; }.patrol-route-sequence .form-control { padding:.25rem;text-align:center;font-weight:750; }.patrol-route-checkpoint-row .btn { width:30px;height:30px;padding:0; }
.patrol-shift-row { display:grid;grid-template-columns:1.4fr repeat(3,1fr) auto;align-items:end;gap:.5rem;padding:.55rem 0;border-top:1px solid #e8eee9; }.patrol-shift-row label { display:block;margin-bottom:.2rem;color:#718078;font-size:.57rem;font-weight:700; }.patrol-shift-row .form-control,.patrol-shift-row .form-select { font-size:.7rem; }.patrol-shift-row .btn { font-size:.65rem; }
.patrol-checkpoint-modal .modal-content { overflow:hidden;border-radius:12px; }.patrol-checkpoint-modal .modal-header { padding:.75rem .9rem; }.patrol-checkpoint-modal .modal-title { font-size:.83rem; }.patrol-checkpoint-modal .modal-header small { font-size:.59rem; }.patrol-checkpoint-modal .modal-body { padding:.8rem .9rem; }.patrol-checkpoint-modal .form-label { margin-bottom:.25rem;color:#53645a;font-size:.65rem;font-weight:750; }.patrol-checkpoint-modal .form-control { font-size:.73rem; }.patrol-coordinate-panel { padding:.65rem;border:1px solid #cce0d2;border-radius:9px;background:#f3f9f5; }.patrol-coordinate-panel>div>span { min-width:0; }.patrol-coordinate-panel strong,.patrol-coordinate-panel small { display:block; }.patrol-coordinate-panel strong { color:#31543d;font-size:.68rem; }.patrol-coordinate-panel small { margin-top:.1rem;color:#718078;font-size:.57rem;line-height:1.3; }.patrol-coordinate-panel small.is-loading { color:#806315; }.patrol-coordinate-panel small.is-success { color:#16713a;font-weight:700; }.patrol-coordinate-panel small.is-error { color:#b02a37; }.patrol-checkpoint-toggle { margin-top:-.4rem;padding:0 .9rem .55rem; }.patrol-checkpoint-toggle .btn { padding:0;font-size:.59rem;text-decoration:none; }
@media(max-width:767.98px){.patrol-shift-row{grid-template-columns:repeat(2,minmax(0,1fr))}.patrol-shift-row>div:first-child{grid-column:1/-1}.patrol-shift-row .btn{width:100%}.patrol-manage-section-head p{font-size:.58rem}}
@media(max-width:575.98px){.patrol-manage-header-actions{flex-direction:column}.patrol-manage-header-actions .btn{font-size:.58rem}.patrol-manage-jump a{min-height:38px;font-size:.61rem}.patrol-manage-summary>span{padding:.5rem .3rem}.patrol-master-item{grid-template-columns:34px minmax(0,1fr) auto}.patrol-route-manage-card .card-header{flex-wrap:wrap}.patrol-route-manage-card .card-header>div{width:calc(100% - 42px)}.patrol-route-checkpoint-row{display:grid;grid-template-columns:40px minmax(0,1fr) 24px 30px 30px}.patrol-route-checkpoint-row .form-check-input{margin:0}.patrol-coordinate-panel .js-patrol-gps{font-size:.59rem;white-space:nowrap}}

/* Tipografi halaman pengaturan patroli. */
.patrol-manage-header>div>div>small,.patrol-manage-header p { font-size:.76rem!important; }
.patrol-manage-header h4 { font-size:1.28rem; }
.patrol-manage-header-actions .btn { font-size:.76rem; }
.patrol-manage-jump a { font-size:.77rem; }
.patrol-manage-summary strong { font-size:1.16rem; }
.patrol-manage-summary small { font-size:.7rem; }
.patrol-manage-section-head h6 { font-size:.9rem; }
.patrol-manage-section-head p { font-size:.72rem; }
.patrol-master-copy strong { font-size:.84rem; }
.patrol-master-copy small { font-size:.69rem; }
.patrol-master-copy span { font-size:.66rem; }
.patrol-master-item>.badge { font-size:.65rem; }
.patrol-master-actions .btn { font-size:.7rem; }
.patrol-route-section-heading strong { font-size:.92rem; }
.patrol-route-section-heading small { font-size:.72rem; }
.patrol-route-manage-card .card-header strong { font-size:.84rem; }
.patrol-route-manage-card .card-header small { font-size:.69rem; }
.patrol-route-checkpoint-row strong { font-size:.8rem; }
.patrol-route-checkpoint-row small { font-size:.67rem; }
.patrol-shift-row label { font-size:.68rem; }
.patrol-shift-row .form-control,.patrol-shift-row .form-select { font-size:.82rem; }
.patrol-shift-row .btn { font-size:.75rem; }
.patrol-checkpoint-modal .modal-title { font-size:.96rem; }
.patrol-checkpoint-modal .modal-header small { font-size:.69rem; }
.patrol-checkpoint-modal .form-label { font-size:.77rem; }
.patrol-checkpoint-modal .form-control { font-size:.84rem; }
.patrol-coordinate-panel strong { font-size:.8rem; }
.patrol-coordinate-panel small { font-size:.69rem; }
.patrol-coordinate-panel .btn { font-size:.72rem; }
.patrol-checkpoint-toggle .btn { font-size:.7rem; }
.patrol-checkpoint-toggle { display:flex;align-items:center;justify-content:space-between;gap:.75rem;margin:0!important;padding:.65rem .9rem!important;border-top:1px solid #e5ece7;background:#f8faf8; }.patrol-checkpoint-toggle-copy { min-width:0;display:flex;align-items:center;gap:.55rem; }.patrol-checkpoint-toggle-copy>i { font-size:1.15rem; }.patrol-checkpoint-toggle-copy strong,.patrol-checkpoint-toggle-copy small { display:block; }.patrol-checkpoint-toggle-copy strong { color:#3c5143;font-size:.76rem; }.patrol-checkpoint-toggle-copy small { margin-top:.08rem;color:#7a877f;font-size:.66rem;line-height:1.3; }.patrol-checkpoint-toggle .btn { flex:0 0 auto;padding:.3rem .55rem!important;font-size:.72rem;text-decoration:none; }
@media(max-width:420px){.patrol-checkpoint-toggle{align-items:stretch;flex-direction:column}.patrol-checkpoint-toggle .btn{width:100%}}
.patrol-shift-manage-item { display:block;margin-top:.55rem;overflow:hidden;border:1px solid #dbe5de;border-radius:10px;background:#fbfdfb; }.patrol-shift-identity { display:grid;grid-template-columns:34px minmax(0,1fr) auto;align-items:center;gap:.55rem;padding:.55rem .65rem;border-bottom:1px solid #e4ebe6;background:#f5f9f6; }.patrol-shift-identity>span { width:34px;height:34px;display:grid;place-items:center;border-radius:9px;background:#e0ecf9;color:#2d66a2; }.patrol-shift-identity strong,.patrol-shift-identity small { display:block; }.patrol-shift-identity strong { color:#30483a;font-size:.82rem; }.patrol-shift-identity small { color:#718078;font-size:.68rem; }.patrol-shift-identity em { padding:.25rem .48rem;border-radius:999px;background:#e9ecef;color:#69736c;font-size:.64rem;font-style:normal;font-weight:750; }.patrol-shift-identity em.is-active { background:#dff1e5;color:#176b3a; }
.patrol-shift-usage { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-bottom:1px solid #e7ede9; }.patrol-shift-usage>span { padding:.45rem .6rem;border-right:1px solid #e7ede9; }.patrol-shift-usage>span:last-child { border-right:0; }.patrol-shift-usage strong,.patrol-shift-usage small { display:block; }.patrol-shift-usage strong { color:#31543d;font-size:.82rem; }.patrol-shift-usage small { color:#7c8981;font-size:.63rem; }
.patrol-shift-fields { display:grid;grid-template-columns:1.4fr repeat(4,minmax(75px,1fr)) auto;align-items:end;gap:.5rem;padding:.6rem; }.patrol-shift-fields label { display:block;margin-bottom:.2rem;color:#65756b;font-size:.68rem;font-weight:700; }.patrol-shift-fields .form-control,.patrol-shift-fields .form-select { font-size:.8rem; }.patrol-shift-fields .btn { font-size:.74rem; }
@media(max-width:991.98px){.patrol-shift-fields{grid-template-columns:repeat(2,minmax(0,1fr))}.patrol-shift-fields>div:first-child{grid-column:1/-1}.patrol-shift-fields .btn{width:100%}}
@media(max-width:575.98px){.patrol-shift-usage strong{font-size:.78rem}.patrol-shift-usage small{font-size:.58rem;line-height:1.25}.patrol-shift-fields{gap:.45rem;padding:.55rem}.patrol-shift-fields label{font-size:.65rem}.patrol-shift-fields .form-control,.patrol-shift-fields .form-select{font-size:.76rem}}
.dashboard-profile-button img { width:100%;height:100%;display:block;border:2px solid rgba(255,255,255,.82);border-radius:inherit;background:#fff;object-fit:cover; }
img.household-member-avatar { object-fit:cover; }
.profile-avatar-uploader { grid-template-columns:42px minmax(0,1fr) auto minmax(150px,auto) auto; }
.profile-avatar-visibility { max-width:190px;font-size:.67rem; }
@media(max-width:767.98px){.profile-avatar-uploader{grid-template-columns:38px minmax(0,1fr) auto}.profile-avatar-visibility{grid-column:1/-1;max-width:none}.profile-avatar-uploader #securityPhotoSubmit{grid-column:1/-1}}
.profile-avatar-header { position:relative;display:inline-flex; }.profile-avatar-edit { position:absolute;right:-3px;bottom:1px;width:28px;height:28px;display:grid;place-items:center;padding:0;border:3px solid #fff;border-radius:50%;background:#176b3a;color:#fff;font-size:.62rem;box-shadow:0 4px 10px rgba(18,62,32,.25); }.profile-avatar-edit:hover { background:#104f2b;color:#fff;transform:scale(1.05); }
.profile-avatar-modal { overflow:hidden;border-radius:14px; }.profile-avatar-modal .modal-header { padding:.8rem 1rem; }.profile-avatar-modal .modal-title { font-size:.92rem; }.profile-avatar-modal .modal-header small { font-size:.68rem; }.profile-avatar-modal .modal-body { padding:1rem; }.profile-avatar-preview { display:flex;align-items:center;gap:.8rem;margin-bottom:.85rem;padding:.75rem;border:1px solid #d9e5dc;border-radius:11px;background:#f7faf8; }.profile-avatar-preview img { width:70px;height:70px;flex:0 0 70px;border:3px solid #fff;border-radius:50%;background:#fff;object-fit:cover;box-shadow:0 4px 12px rgba(24,80,42,.12); }.profile-avatar-preview strong,.profile-avatar-preview small { display:block; }.profile-avatar-preview strong { color:#304b38;font-size:.82rem; }.profile-avatar-preview small { margin-top:.18rem;color:#718078;font-size:.68rem;line-height:1.4; }
.profile-avatar-picker { min-height:60px;display:grid;grid-template-columns:36px minmax(0,1fr) 12px;align-items:center;gap:.65rem;padding:.65rem;border:1.5px dashed #86b596;border-radius:10px;background:#f1f8f3;cursor:pointer; }.profile-avatar-picker:hover { border-color:#198754;background:#eaf5ed; }.profile-avatar-picker>i:first-child { width:36px;height:36px;display:grid;place-items:center;border-radius:9px;background:#d8eddf;color:#176b3a; }.profile-avatar-picker>span { min-width:0; }.profile-avatar-picker strong,.profile-avatar-picker small { display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }.profile-avatar-picker strong { color:#31513a;font-size:.78rem; }.profile-avatar-picker small { color:#748078;font-size:.66rem; }.profile-avatar-picker>i:last-child { color:#7a8c80;font-size:.6rem; }
.profile-avatar-modal .form-label { font-size:.76rem; }.profile-avatar-modal .form-select { font-size:.79rem; }.profile-avatar-privacy { display:flex;align-items:flex-start;gap:.55rem;margin-top:.6rem;padding:.6rem;border-radius:9px;background:#edf5ef;color:#31543d; }.profile-avatar-privacy>i { margin-top:.12rem;color:#176b3a; }.profile-avatar-privacy strong,.profile-avatar-privacy small { display:block; }.profile-avatar-privacy strong { font-size:.72rem; }.profile-avatar-privacy small { margin-top:.12rem;color:#6d7d73;font-size:.64rem;line-height:1.4; }
@media(max-width:420px){.profile-avatar-preview img{width:62px;height:62px;flex-basis:62px}.profile-avatar-preview small{font-size:.64rem}.profile-avatar-modal .modal-body{padding:.8rem}}
.profile-avatar-upload-progress { display:flex;align-items:center;gap:.65rem;margin-top:.7rem;padding:.65rem;border:1px solid #b9dac3;border-radius:9px;background:#edf8f0;animation:avatarProgressPulse 1.4s ease-in-out infinite; }.profile-avatar-upload-progress>span { width:32px;height:32px;flex:0 0 32px;display:grid;place-items:center;border-radius:8px;background:#d3ebda;color:#176b3a; }.profile-avatar-upload-progress strong,.profile-avatar-upload-progress small { display:block; }.profile-avatar-upload-progress strong { color:#31543d;font-size:.74rem; }.profile-avatar-upload-progress small { margin-top:.1rem;color:#718078;font-size:.64rem; }.profile-avatar-modal:has(.profile-avatar-upload-progress) .profile-avatar-picker,.profile-avatar-modal:has(.profile-avatar-upload-progress) .form-select { opacity:.55;pointer-events:none; }
.profile-avatar-client-error{display:grid;gap:.2rem;font-size:.9rem;text-align:left}.profile-avatar-client-error strong{font-size:.95rem}.profile-avatar-client-error span,.profile-avatar-client-error small{display:block}.profile-avatar-client-error small{color:#842029}
img[data-avatar-preview]{cursor:zoom-in;transition:transform .18s ease,box-shadow .18s ease}img[data-avatar-preview]:hover{transform:scale(1.06)}img[data-avatar-preview]:focus-visible{outline:3px solid rgba(25,135,84,.32);outline-offset:3px}.avatar-preview-dialog{max-width:430px}.avatar-preview-modal{overflow:hidden;border-radius:18px;background:#f2f6f3}.avatar-preview-modal .modal-header{padding:.85rem 1rem;border:0;background:linear-gradient(135deg,#176b3a,#27864d);color:#fff}.avatar-preview-modal .modal-title{margin:0;font-size:1rem;font-weight:800}.avatar-preview-modal .modal-header small{display:block;margin-top:.1rem;color:rgba(255,255,255,.75);font-size:.66rem}.avatar-preview-modal .modal-body{position:relative;display:grid;place-items:center;min-height:330px;padding:1rem}.avatar-preview-modal img{display:block;width:min(100%,380px);max-height:70vh;aspect-ratio:1/1;border-radius:15px;background:#dfeae2;object-fit:cover;opacity:0;transition:opacity .18s ease}.avatar-preview-modal img.is-ready{opacity:1}.avatar-preview-loading{position:absolute;display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:#fff;color:#198754;box-shadow:0 4px 15px rgba(19,74,37,.16)}.avatar-preview-name{position:absolute;right:1.5rem;bottom:1.5rem;left:1.5rem;padding:.5rem .7rem;border-radius:10px;background:rgba(13,41,23,.7);color:#fff;font-size:.78rem;font-weight:750;text-align:center;backdrop-filter:blur(6px)}
.user-avatar{width:var(--avatar-size,36px);height:var(--avatar-size,36px);flex:0 0 var(--avatar-size,36px);display:inline-grid;place-items:center;border:2px solid #d6e8dc;border-radius:50%;background:#e8f3eb;color:#247443;object-fit:cover;font-size:calc(var(--avatar-size,36px)*.38);font-weight:850;vertical-align:middle;box-shadow:0 2px 7px rgba(24,88,43,.1)}img.user-avatar[width="24"]{--avatar-size:24px}img.user-avatar[width="28"]{--avatar-size:28px}img.user-avatar[width="32"]{--avatar-size:32px}img.user-avatar[width="36"]{--avatar-size:36px}img.user-avatar[width="40"]{--avatar-size:40px}img.user-avatar[width="44"]{--avatar-size:44px}img.user-avatar[width="48"]{--avatar-size:48px}img.user-avatar[width="56"]{--avatar-size:56px}img.user-avatar[width="64"]{--avatar-size:64px}img.user-avatar[width="72"]{--avatar-size:72px}.user-avatar-fallback{width:var(--avatar-size);height:var(--avatar-size)}.user-avatar-line{display:flex;align-items:center;gap:.5rem;min-width:0}.user-avatar-line>span:last-child{min-width:0}.transaction-leading.user-avatar{border-radius:50%}
.content-author-line{display:flex;align-items:center;gap:.55rem;padding:.55rem .7rem;border:1px solid #d9e8dd;border-radius:10px;background:#fff}.content-author-line small,.content-author-line strong{display:block}.content-author-line small{color:#748078;font-size:.6rem}.content-author-line strong{color:#294b34;font-size:.75rem}.content-people-strip{display:flex;align-items:center;min-height:43px;padding:.35rem .6rem;border:1px solid #e0e9e2;border-radius:10px;background:#f9fbfa}.content-people-strip .user-avatar{margin-right:-7px;border-color:#fff;box-shadow:0 0 0 1px #d7e5db}.content-people-strip small{margin-left:.8rem;color:#6d7971;font-size:.62rem}
.content-author-line time{flex:0 0 auto;color:#63746a;font-size:.65rem;font-weight:650}
.announcement-reading-card{border-color:#dce7df!important;border-radius:14px!important;box-shadow:0 7px 24px rgba(26,79,42,.07)}.announcement-reading-card .announcement-detail-cover{max-height:500px;background:linear-gradient(135deg,#eef4f0,#e3ebe6)}.announcement-reading-card .announcement-detail-cover img{max-height:500px}.announcement-reading-meta{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.85rem 1rem;border-bottom:1px solid #e3ebe5;background:#fbfdfb}.announcement-author{display:flex;align-items:center;gap:.6rem;min-width:0}.announcement-author>span{min-width:0}.announcement-author small,.announcement-author strong,.announcement-author time{display:block}.announcement-author small{color:#7b867f;font-size:.56rem}.announcement-author strong{overflow:hidden;color:#294b34;font-size:.76rem;text-overflow:ellipsis;white-space:nowrap}.announcement-author time{margin-top:.12rem;color:#68776e;font-size:.6rem}.announcement-audience{display:flex;align-items:center;gap:.55rem}.announcement-audience>span:first-child{display:grid;grid-template-columns:24px auto;column-gap:.4rem;align-items:center;padding:.38rem .5rem;border:1px solid #dce8df;border-radius:9px;background:#fff}.announcement-audience>span:first-child>i{grid-row:1/3;width:24px;height:24px;display:grid;place-items:center;border-radius:7px;background:#e5f3e9;color:#248044;font-size:.66rem}.announcement-audience small,.announcement-audience strong{display:block}.announcement-audience small{color:#849087;font-size:.48rem}.announcement-audience strong{max-width:145px;overflow:hidden;color:#405348;font-size:.62rem;text-overflow:ellipsis;white-space:nowrap}.announcement-live-state{display:inline-flex;align-items:center;gap:.25rem;padding:.35rem .5rem;border-radius:8px;font-size:.56rem;font-weight:800}.announcement-live-state.is-live{background:#dff3e5;color:#19713a}.announcement-live-state.is-inactive{background:#edf0ee;color:#657168}.announcement-reading-divider{display:flex;align-items:center;padding:.7rem 1rem 0}.announcement-reading-divider:after{content:"";height:1px;flex:1;margin-left:.65rem;background:#e4ebe6}.announcement-reading-divider span{color:#617168;font-size:.56rem;font-weight:800;letter-spacing:.04em;text-transform:uppercase}.announcement-reading-divider i{margin-right:.3rem;color:#398251}.announcement-reading-card .announcement-detail-body{padding:1rem 1.2rem 1.35rem;font-size:.88rem;line-height:1.78}@media(max-width:575.98px){.announcement-reading-meta{align-items:flex-start;padding:.72rem;flex-direction:column}.announcement-audience{width:100%;justify-content:space-between}.announcement-audience>span:first-child{min-width:0;flex:1}.announcement-audience strong{max-width:130px}.announcement-reading-card .announcement-detail-body{padding:.8rem .9rem 1.15rem;font-size:.84rem}.announcement-reading-divider{padding:.65rem .9rem 0}}
@keyframes avatarProgressPulse{0%,100%{border-color:#b9dac3;background:#edf8f0}50%{border-color:#78b88b;background:#e4f4e9}}
@media(max-width:575.98px){.patrol-manage-header-actions .btn{font-size:.68rem}.patrol-manage-jump a{font-size:.7rem}.patrol-manage-section-head p{font-size:.68rem}.patrol-master-copy strong{font-size:.81rem}.patrol-route-checkpoint-row strong{font-size:.78rem}.patrol-coordinate-panel .js-patrol-gps{font-size:.68rem}}
.patrol-scanner { margin-bottom: 0.65rem; padding: 0.5rem; border-radius: 7px; background: #17231b; color: #fff; text-align: center; }
.patrol-scanner video { display: block; width: 100%; max-height: 240px; margin-bottom: 0.35rem; object-fit: cover; }
.patrol-scanner small { font-size: 0.62rem; }
.patrol-photo-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 0.5rem; }
.patrol-photo-grid a { min-width: 0; overflow: hidden; border: 1px solid #dfe7e1; border-radius: 7px; background: #fff; color: #33443a; text-decoration: none; }
.patrol-photo-grid img { width: 100%; aspect-ratio: 4/3; display: block; object-fit: cover; }
.patrol-photo-grid span { display: block; overflow: hidden; padding: 0.4rem; font-size: 0.62rem; font-weight: 700; text-overflow: ellipsis; white-space: nowrap; }
@media print { body { background: #fff !important; padding-bottom: 0; } .navbar, .d-print-none, .header-back-link { display: none !important; } .container { max-width: none; padding: 0 !important; } .hero-banner::after { display: none; } .patrol-map { height: 360px; } }

/* Area management */
.area-summary-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:.75rem; }
.area-summary-grid > div { display:grid; grid-template-columns:42px 1fr; grid-template-rows:auto auto; column-gap:.75rem; align-items:center; padding:.9rem; border:1px solid #e5ebe7; border-radius:12px; background:#fff; box-shadow:0 2px 8px rgba(26,65,39,.05); }
.area-summary-grid > div > span { grid-row:1/3; width:42px; height:42px; border-radius:10px; display:grid; place-items:center; }
.area-summary-grid small { color:#64748b; font-size:.68rem; }
.area-summary-grid strong { color:#173b25; font-size:1.2rem; line-height:1.1; }
.area-form-icon,.area-card-icon { width:42px; height:42px; flex:0 0 42px; border-radius:11px; display:grid; place-items:center; }
.area-form-icon { color:#198754; background:#e8f5ec; }
.area-create-card,.area-filter-card,.area-card { border-radius:12px; }
.area-card-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.75rem; }
.area-card { transition:transform .16s ease,box-shadow .16s ease; }
.area-card:hover { transform:translateY(-2px); box-shadow:0 .45rem 1rem rgba(23,59,37,.1)!important; }
.area-code { display:block; color:#198754; font-size:.65rem; font-weight:700; letter-spacing:.06em; text-transform:uppercase; }
.area-description { min-height:2.5em; display:-webkit-box; overflow:hidden; -webkit-line-clamp:2; -webkit-box-orient:vertical; }
.area-chip { display:inline-flex; align-items:center; gap:.3rem; padding:.25rem .45rem; border-radius:6px; color:#52665a; background:#f2f6f3; font-size:.65rem; }
.area-list{overflow:hidden;border:1px solid #dce6df;border-radius:11px;background:#fff;box-shadow:0 3px 12px rgba(25,66,39,.06)}
.area-list-head{display:grid;grid-template-columns:minmax(220px,1fr) minmax(190px,.8fr) 90px 58px;gap:.75rem;padding:.52rem .75rem .52rem 4.35rem;border-bottom:1px solid #dce6df;background:#f3f8f4;color:#68776d;font-size:.54rem;font-weight:750;letter-spacing:.04em;text-transform:uppercase}
.area-list-row{display:grid;grid-template-columns:42px minmax(160px,1fr) minmax(190px,.8fr) 90px 58px;align-items:center;gap:.75rem;min-height:68px;padding:.55rem .75rem;border-bottom:1px solid #e8eeea;background:#fff}.area-list-row:last-of-type{border-bottom:0}.area-list-row:hover{background:#f8fbf9}
.area-list-identity strong,.area-list-identity small{display:block}.area-list-identity strong{overflow:hidden;color:#294434;font-size:.72rem;text-overflow:ellipsis;white-space:nowrap}.area-list-description{overflow:hidden;margin-top:.08rem;color:#7a867e;font-size:.53rem;text-overflow:ellipsis;white-space:nowrap}.area-list-meta{display:flex;align-items:center;gap:.35rem;min-width:0}.area-list-status{justify-self:start;font-size:.52rem}.area-list-edit{width:58px;display:inline-flex;align-items:center;justify-content:center;gap:.3rem;font-size:.57rem}
@media(max-width:767.98px){.area-list-head{display:none}.area-list-row{grid-template-columns:36px minmax(0,1fr) auto;grid-template-areas:'icon identity edit' 'icon meta status';gap:.3rem .55rem;padding:.58rem}.area-list-row .area-card-icon{grid-area:icon;width:36px;height:36px;align-self:start}.area-list-identity{grid-area:identity}.area-list-meta{grid-area:meta;overflow:hidden}.area-list-meta .area-chip{padding:.18rem .32rem;font-size:.53rem}.area-list-status{grid-area:status;justify-self:end}.area-list-edit{grid-area:edit;width:34px;height:34px;padding:0}.area-list-edit span{display:none}.area-list-description{max-width:100%}}
.complaint-inline-image { display:block; width:min(100%,420px); max-height:320px; margin-top:.65rem; border:1px solid #dfe8e2; border-radius:10px; object-fit:cover; background:#f5f7f5; }
.contact-directory-empty { padding:1rem;color:#64748b;font-size:.78rem; }
.contact-person-row { display:flex;align-items:center;gap:.3rem;padding:.35rem .65rem;border-bottom:1px solid #edf1ee; }
.contact-person-row:last-child { border-bottom:0; }
.contact-person-row:hover { background:#f5faf7; }
.contact-person-open { display:flex;align-items:center;gap:.6rem;flex:1;min-width:0;min-height:58px;padding:.35rem 0;border:0;background:transparent;text-align:left; }
.contact-person-initial { display:grid;place-items:center;flex:0 0 34px;width:34px;height:34px;border-radius:10px;background:#e3f2e8;color:#247543;font-size:.85rem;font-weight:750; }
.contact-person-copy { min-width:0;flex:1; }
.contact-person-copy strong { display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#294033;font-size:.8rem;font-weight:700;line-height:1.4; }
.contact-person-copy small { display:block;margin-top:.2rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#34744b;font-size:.65rem;line-height:1.5; }
.contact-person-area { color:#748078; }
.contact-person-quick-actions { display:flex;align-items:center;flex:0 0 auto;gap:.15rem; }
.contact-person-quick-actions > a,.contact-person-quick-actions > span,.contact-person-quick-actions > button { display:inline-flex;align-items:center;justify-content:center;width:40px;min-height:44px;padding:0;border:0;border-radius:9px;background:transparent;color:#34744b;text-decoration:none;font-size:.85rem; }
.contact-person-quick-actions > .is-whatsapp { color:#198754;font-size:1.15rem; }
.contact-person-quick-actions > .is-unavailable { color:#b9c2bc; }
.contact-person-quick-actions > .contact-person-arrow { width:28px;color:#8c9b92;font-size:.65rem; }
.contact-person-quick-actions > a:hover,.contact-person-quick-actions > button:hover { background:#e3f2e8; }
.contact-person-open:focus-visible,.contact-person-quick-actions > a:focus-visible,.contact-person-quick-actions > button:focus-visible { outline:2px solid #27854e;outline-offset:2px; }
.contact-person-modal .modal-content { overflow:hidden;border:0;border-radius:16px; }
.contact-person-modal .modal-header { padding:1rem 1.2rem;border-color:#e8eeea; }
.contact-person-modal .modal-title { font-size:.95rem;font-weight:700;color:#294033; }
.contact-person-modal .modal-body { padding:1.2rem; }
.contact-person-detail-heading { display:flex;align-items:center;gap:.8rem;margin-bottom:1.1rem; }
.contact-person-detail-initial { display:grid;place-items:center;flex:0 0 48px;width:48px;height:48px;border-radius:14px;background:#e3f2e8;color:#247543;font-size:1.25rem;font-weight:750; }
.contact-person-detail-heading > div { min-width:0; }
.contact-person-detail-heading strong { display:block;color:#294033;font-size:1rem;overflow-wrap:anywhere; }
.contact-person-detail-heading small { display:block;margin-top:.2rem;color:#34744b;font-size:.78rem; }
.contact-person-detail-fields { margin:0; }
.contact-person-detail-fields > div { padding:.75rem 0;border-top:1px solid #e8eeea; }
.contact-person-detail-fields dt { color:#748078;font-size:.7rem;font-weight:500; }
.contact-person-detail-fields dd { margin:.25rem 0 0;color:#33483b;font-size:.85rem;overflow-wrap:anywhere; }
.contact-person-detail-note { margin:.5rem 0;color:#64748b;font-size:.8rem; }
.contact-person-detail-actions { display:flex;flex-wrap:wrap;gap:.6rem;margin-top:1rem; }
.contact-person-detail-actions a { display:inline-flex;align-items:center;justify-content:center;gap:.5rem;flex:1;min-height:44px;border-radius:10px;font-size:.8rem; }
.contact-person-modal [hidden] { display:none!important; }
@media(max-width:359.98px) { .contact-person-row { padding:.3rem .5rem; } .contact-person-open { gap:.4rem; } .contact-person-quick-actions { gap:0; } .contact-person-quick-actions > a,.contact-person-quick-actions > span { width:34px; } }
.contact-category-strip { display:grid;grid-auto-flow:column;grid-auto-columns:minmax(105px,1fr);gap:.5rem;overflow-x:auto;padding-bottom:.2rem;scrollbar-width:thin; }
.contact-category-strip a { display:grid;grid-template-columns:30px minmax(0,1fr);grid-template-rows:auto auto;align-items:center;column-gap:.45rem;padding:.6rem;border:1px solid #dfe8e1;border-radius:8px;background:#fff;color:#34443a;text-decoration:none;box-shadow:0 .12rem .35rem rgba(39,69,47,.04); }
.contact-category-mini-icon { grid-row:1/span 2;width:30px;height:30px;display:inline-flex;align-items:center;justify-content:center;border-radius:8px;background:#e3f2e8;color:#198754; }
.contact-category-strip strong { overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.66rem; }.contact-category-strip small { color:#7a867e;font-size:.56rem; }
.contact-security-card,.contact-category-card { overflow:hidden;border:1px solid #dfe7e1;border-radius:9px;background:#fff;box-shadow:0 .15rem .5rem rgba(38,62,45,.05);scroll-margin-top:1rem; }
.contact-security-heading { display:flex;align-items:center;gap:.65rem;padding:.75rem;background:linear-gradient(135deg,#eef7f1,#dcefe3);color:#245a3a;border-bottom:1px solid #d3e7da; }.contact-security-heading>span { width:38px;height:38px;display:inline-flex;align-items:center;justify-content:center;border-radius:9px;background:#cde8d8;color:#1f7a45; }.contact-security-heading h5,.contact-category-card h5 { margin:0;font-size:.78rem;font-weight:750; }.contact-security-heading small,.contact-category-card header small { display:block;opacity:.78;font-size:.58rem; }.contact-security-heading b { margin-left:auto;padding:.25rem .45rem;border-radius:999px;background:#fff;color:#1f7a45;box-shadow:inset 0 0 0 1px #cde8d8;font-size:.58rem; }
.contact-security-empty { display:flex;align-items:center;gap:.6rem;padding:.85rem;color:#748078; }.contact-security-empty>i { font-size:1.2rem;color:#a9b7ae; }.contact-security-empty strong,.contact-security-empty small { display:block;font-size:.64rem; }.contact-security-empty small { margin-top:.1rem;font-size:.57rem; }
.contact-officer-row,.contact-action-row { display:flex;align-items:center;gap:.65rem;padding:.7rem .75rem;border-bottom:1px solid #edf1ee;color:#34443a;text-decoration:none; }.contact-officer-row:last-child,.contact-action-row:last-child { border-bottom:0; }.contact-officer-row:hover,.contact-action-row:hover { background:#f5faf7; }
.contact-officer-avatar { width:34px;height:34px;display:inline-flex;align-items:center;justify-content:center;border-radius:50%;background:#dff3e5;color:#198754; }.contact-officer-row strong,.contact-officer-row small,.contact-main strong,.contact-main small,.contact-value strong,.contact-value small { display:block; }.contact-officer-row strong,.contact-main strong { font-size:.7rem; }.contact-officer-row small,.contact-main small,.contact-value small { color:#7b877f;font-size:.57rem; }.contact-call-button,.contact-action-icon { width:32px;height:32px;flex:0 0 32px;display:inline-flex;align-items:center;justify-content:center;border-radius:8px;background:#198754;color:#fff; }
.contact-category-card header { display:flex;align-items:center;gap:.6rem;padding:.65rem .75rem;border-bottom:1px solid #e6ece8;background:#f6f9f7; }.contact-category-icon { width:34px;height:34px;display:inline-flex;align-items:center;justify-content:center;border-radius:8px;background:#dff1e5;color:#198754; }.contact-main { min-width:0;flex:1; }.contact-main strong,.contact-main small { overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }.contact-value { flex:0 1 40%;text-align:right;min-width:0; }.contact-value strong { overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#198754;font-size:.66rem; }
.contact-security-official { display:flex;align-items:center;justify-content:space-between;gap:.75rem;padding:.7rem .75rem;border-bottom:1px solid #e3ebe5;background:#f7faf8; }.contact-security-official small,.contact-security-official strong { display:block; }.contact-security-official small { color:#75827a;font-size:.58rem; }.contact-security-official strong { color:#254432;font-size:.78rem; }.contact-security-official a { min-width:76px;display:inline-flex;align-items:center;justify-content:center;gap:.35rem;padding:.45rem .55rem;border-radius:8px;background:#315e40;color:#fff;text-decoration:none;font-size:.62rem;font-weight:700; }.contact-security-official a.is-whatsapp { background:#198754; }
.contact-officer-grid { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.7rem;padding:.8rem;background:#f4f8f5; }.contact-officer-card { position:relative;min-width:0;display:flex;flex-direction:column;align-items:center;padding:1.05rem .55rem .7rem;border:2px solid #c5dfcc;border-radius:12px;background:linear-gradient(180deg,#fff,#f3faf5);text-align:center;box-shadow:0 5px 14px rgba(24,92,46,.1); }.contact-officer-card.is-on-duty{border-color:#56a86c}.contact-officer-live{position:absolute;top:.4rem;right:.4rem;display:inline-flex;align-items:center;gap:.2rem;padding:.18rem .32rem;border-radius:999px;background:#dff3e5;color:#18743a;font-size:.42rem;font-weight:850;letter-spacing:.03em}.contact-officer-live i{font-size:.35rem}.contact-officer-card img,.contact-officer-photo-placeholder { width:72px;height:72px;display:grid;place-items:center;margin-bottom:.5rem;border:4px solid #c9e7d1;border-radius:50%;object-fit:cover;background:#e5f4e9;color:#198754;font-size:1.35rem;box-shadow:0 3px 10px rgba(25,112,55,.15); }.contact-officer-card>strong { width:100%;overflow:hidden;color:#1f482d;font-size:.72rem;text-overflow:ellipsis;white-space:nowrap; }.contact-officer-card>small { color:#61736a;font-size:.56rem;font-weight:650; }.contact-officer-card>div { width:100%;margin-top:.5rem;padding-top:.45rem;border-top:1px solid #dcebe0; }.contact-officer-card>div span { display:block;font-size:.54rem;color:#586a60; }.contact-officer-card>div span+span { margin-top:.2rem; }.contact-officer-active-status{display:inline-flex!important;align-items:center;justify-content:center;gap:.2rem;padding:.22rem .35rem;border-radius:6px;background:#dff2e5;color:#176f38!important;font-weight:750}
.portal-share-group .dropdown-menu { min-width:155px; }.portal-share-group .dropdown-item { display:flex;align-items:center; }.financial-report-toolbar .portal-share-group { flex:0 0 auto; }
.cashflow-kpi-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.65rem}.cashflow-kpi-grid>div{padding:.8rem;border:1px solid #dfe7e1;border-radius:9px;background:#fff}.cashflow-kpi-grid small,.cashflow-kpi-grid strong,.cashflow-kpi-grid span{display:block}.cashflow-kpi-grid small{color:#758179;font-size:.58rem}.cashflow-kpi-grid strong{margin:.18rem 0;color:#294434;font-size:.82rem}.cashflow-kpi-grid span{color:#8b958e;font-size:.52rem}.cashflow-table thead th{padding:.6rem;background:#245f38;color:#fff;border:0;font-size:.58rem;text-transform:uppercase;letter-spacing:.03em}.cashflow-table td{padding:.6rem;font-size:.62rem}.cashflow-formula-note{display:flex;gap:.5rem;align-items:flex-start;padding:.65rem;margin-top:.6rem;border-radius:8px;background:#f1f6f2;color:#68766d;font-size:.57rem}.cashflow-formula-note i{margin-top:.1rem;color:#198754}@media(max-width:767.98px){.cashflow-kpi-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.cashflow-table{min-width:720px}}
@media(max-width:575.98px){.contact-category-strip{grid-auto-columns:105px}.contact-value{max-width:34%}.contact-value strong{font-size:.6rem}.contact-action-row{padding:.65rem}.contact-security-heading b{font-size:.54rem}}
.contact-admin-summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.6rem}.contact-admin-summary>div{display:grid;grid-template-columns:38px 1fr;grid-template-rows:auto auto;column-gap:.6rem;align-items:center;padding:.7rem;border:1px solid #e0e8e2;border-radius:10px;background:#fff}.contact-admin-summary span{grid-row:1/3;width:38px;height:38px;display:grid;place-items:center;border-radius:9px}.contact-admin-summary small{color:#748078;font-size:.58rem}.contact-admin-summary strong{font-size:.88rem;color:#2c4033}.contact-admin-create .card-header{padding:.8rem}.contact-admin-create .card-header strong,.contact-admin-create .card-header small{display:block}.contact-admin-create .card-header strong{font-size:.75rem}.contact-admin-create .card-header small{color:#78837c;font-size:.58rem}.contact-admin-heading-icon{width:36px;height:36px;display:grid;place-items:center;border-radius:9px;background:#e1f3e7;color:#198754}.contact-admin-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.7rem}.contact-admin-card{overflow:hidden;border:1px solid #dce6df;border-radius:10px;background:#fff;box-shadow:0 2px 8px rgba(35,66,44,.05)}.contact-admin-card.is-inactive{opacity:.72}.contact-admin-card-head{display:flex;align-items:center;gap:.6rem;padding:.7rem;border-bottom:1px solid #edf1ee}.contact-admin-type-icon{width:38px;height:38px;flex:0 0 38px;display:grid;place-items:center;border-radius:9px;background:#e5f3e9;color:#198754}.contact-admin-card-head>div{flex:1}.contact-admin-card-head strong{font-size:.72rem}.contact-admin-card-head small{display:block;color:#77837b;font-size:.57rem}.contact-admin-card-head .badge{font-size:.5rem}.contact-admin-edit-toggle{width:32px;height:32px;padding:0}.contact-admin-card-value{position:relative;padding:.7rem}.contact-admin-card-value strong,.contact-admin-card-value small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.contact-admin-card-value strong{padding-right:55px;color:#24593a;font-size:.78rem}.contact-admin-card-value small{color:#7a857e;font-size:.58rem}.contact-admin-card-value span{position:absolute;right:.7rem;top:.75rem;color:#8a958e;font-size:.52rem}.contact-admin-edit{padding:.75rem;border-top:1px solid #e4ebe6;background:#f8faf9}.contact-admin-edit .form-label{margin-bottom:.2rem;color:#657169;font-size:.55rem;font-weight:700}
@media(max-width:767.98px){.contact-admin-list{grid-template-columns:1fr}.contact-admin-summary>div{grid-template-columns:30px 1fr;padding:.55rem;column-gap:.4rem}.contact-admin-summary span{width:30px;height:30px}.contact-admin-summary small{font-size:.52rem}.contact-admin-summary strong{font-size:.75rem}}
@media (max-width:767.98px) { .area-summary-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:.5rem; } .area-summary-grid > div { padding:.7rem; } .area-card-grid { grid-template-columns:1fr; } }
@media (max-width:390px) { .area-summary-grid > div { grid-template-columns:34px 1fr; column-gap:.55rem; } .area-summary-grid > div > span { width:34px; height:34px; } .area-card .area-chip { font-size:.6rem; } }
.complaint-assignment-option { position: relative; display: block; cursor: pointer; }
.complaint-assignment-option > input { position: absolute; top: 0.65rem; right: 0.65rem; z-index: 1; }
.complaint-assignment-option > span { min-height: 70px; display: flex; flex-direction: column; justify-content: center; padding: 0.65rem 2.2rem 0.65rem 2.7rem; border: 1px solid #dfe7e1; border-radius: 7px; background: #fff; }
.complaint-assignment-option > span > i { position: absolute; left: 0.8rem; color: #4c7657; }
.complaint-assignment-option strong, .complaint-assignment-option small { display: block; font-size: 0.7rem; }
.complaint-assignment-option small { color: #748078; }
.complaint-assignment-option > input:checked + span { border-color: #438352; background: #eef7f0; box-shadow: 0 0 0 2px rgba(47, 125, 62, 0.08); }
.emergency-map { width: 100%; height: min(48vh, 380px); min-height: 280px; background: #eef3ef; }
.emergency-summary { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); overflow: hidden; border: 1px solid #dfe7e1; border-radius: 8px; background: #fff; }
.emergency-summary > div { min-width: 0; padding: 0.7rem; border-right: 1px solid #e5ebe7; text-align: center; }
.emergency-summary > div:last-child { border-right: 0; }
.emergency-summary small, .emergency-summary strong { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.emergency-summary small { color: #748078; font-size: 0.6rem; }
.emergency-summary strong { color: #2d4134; font-size: 0.8rem; letter-spacing: 0; }
.asset-tabs { flex-wrap: nowrap; border-bottom-color: #dce5df; }
.asset-tabs .nav-item { min-width: 0; flex: 1 1 50%; }
.asset-tabs .nav-link { width: 100%; min-height: 44px; padding: 0.55rem 0.4rem; border-radius: 0; color: #647168; font-size: 0.72rem; white-space: nowrap; }
.asset-tabs .nav-link.active { border-color: #dce5df #dce5df #fff; color: #286e3b; font-weight: 700; }
.asset-operation-summary { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); overflow: hidden; border: 1px solid #dfe7e1; border-radius: 8px; background: #fff; }
.asset-operation-summary > a { min-width: 0; display: flex; align-items: center; gap: 0.65rem; min-height: 72px; padding: 0.65rem 0.75rem; border-right: 1px solid #e6ece8; color: #34453a; text-decoration: none; }
.asset-operation-summary > a:last-child { border-right: 0; }
.asset-operation-summary > a > i { width: 30px; text-align: center; font-size: 1rem; }
.asset-operation-summary span, .asset-operation-summary small, .asset-operation-summary strong { min-width: 0; display: block; }
.asset-operation-summary small { overflow: hidden; color: #748078; font-size: 0.58rem; text-overflow: ellipsis; white-space: nowrap; }
.asset-operation-summary strong { color: #2f4135; font-size: 0.92rem; }
.asset-module-tabs { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); overflow: hidden; border: 1px solid #dce5df; border-radius: 8px; background: #fff; }
.asset-module-tabs a { min-width: 0; min-height: 46px; display: flex; align-items: center; justify-content: center; gap: 0.4rem; padding: 0.5rem; border-right: 1px solid #e5ebe7; color: #657269; font-size: 0.67rem; font-weight: 650; text-decoration: none; }
.asset-module-tabs a:last-child { border-right: 0; }
.asset-module-tabs a.active { background: #eaf4ed; color: #286e3b; box-shadow: inset 0 -3px #2f7d3e; }
.asset-primary-tabs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); overflow: hidden; border: 1px solid #d8e3db; border-radius: 9px; background: #fff; box-shadow: 0 3px 12px rgba(34, 65, 43, 0.05); }
.asset-primary-tabs a { display: flex; align-items: center; justify-content: center; gap: 0.5rem; min-height: 50px; color: #647168; font-size: 0.76rem; font-weight: 700; text-decoration: none; }
.asset-primary-tabs a + a { border-left: 1px solid #e1e8e3; }
.asset-primary-tabs a.active { background: #e9f4ec; color: #26713b; box-shadow: inset 0 -3px #2f7d3e; }
.asset-sub-tabs { display: flex; gap: 0.25rem; overflow-x: auto; padding: 0.3rem; border: 1px solid #e1e8e3; border-radius: 8px; background: #f7f9f8; scrollbar-width: none; }
.asset-sub-tabs a { flex: 1 0 auto; padding: 0.42rem 0.7rem; border-radius: 6px; color: #657269; font-size: 0.67rem; font-weight: 650; text-align: center; text-decoration: none; }
.asset-sub-tabs a.active { background: #fff; color: #286e3b; box-shadow: 0 1px 5px rgba(37, 69, 46, 0.1); }
.asset-group-summary { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.asset-group-summary-four { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.asset-group-summary-two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.asset-operation-summary > a:hover { background: #f6faf7; }
.asset-operation-summary > a.asset-summary-alert { background: #fff6f6; }
.asset-value-strip { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .8rem 1rem; border: 1px solid #dfe7e1; border-radius: 9px; background: linear-gradient(135deg,#f8fbf9,#eef7f1); color: #415148; }
.asset-value-strip span { font-size: .78rem; font-weight: 650; }
.asset-value-strip span i { margin-right: .5rem; color: #27814a; }
.asset-value-strip strong { color: #1f713f; font-size: 1rem; white-space: nowrap; }
.asset-filter-panel { display: grid; grid-template-columns: minmax(220px,1.6fr) repeat(3,minmax(135px,.7fr)) auto; gap: .55rem; padding: .75rem; border: 1px solid #dfe7e1; border-radius: 10px; background: #fff; box-shadow: 0 3px 12px rgba(34,65,43,.04); }
.asset-filter-actions { display: flex; gap: .4rem; }
.asset-filter-actions .btn { white-space: nowrap; }
.asset-section-heading { display: flex; align-items: end; justify-content: space-between; gap: 0.75rem; margin-bottom: 0.5rem; }
.asset-filter-bar { display: grid; grid-template-columns: minmax(0, 1fr) minmax(135px, auto) auto auto; gap: 0.4rem; padding: 0.5rem; border: 1px solid #dfe7e1; border-radius: 8px; background: #fff; }
.asset-section-heading strong, .asset-section-heading small { display: block; }
.asset-section-heading strong { color: #304238; font-size: 0.92rem; }
.asset-section-heading small { color: #78847c; font-size: 0.72rem; }
.asset-operation-row { min-height: 72px; }
.asset-detail-summary { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); overflow: hidden; border: 1px solid #dfe7e1; border-radius: 8px; background: #fff; }
.asset-detail-summary > div { min-width: 0; padding: 0.7rem; border-right: 1px solid #e6ece8; }
.asset-detail-summary > div:last-child { border-right: 0; }
.asset-detail-summary small, .asset-detail-summary strong { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.asset-detail-summary small { color: #748078; font-size: 0.72rem; }
.asset-detail-summary strong { margin-top: 0.18rem; color: #304238; font-size: 0.86rem; }
.asset-detail-heading { color: #304238; font-size: 0.95rem; font-weight: 750; letter-spacing: 0; }
.asset-active-process { display: flex; align-items: center; gap: 0.65rem; padding: 0.65rem 0.75rem; border: 1px solid #cddbeb; border-radius: 8px; background: #f4f8fc; color: #33443a; text-decoration: none; }
.asset-active-process > .fa-chevron-right { margin-left: 0.25rem; color: #7a867e; font-size: 0.65rem; }
.asset-process-status { display: grid; grid-template-columns: auto minmax(0, 1fr) minmax(120px, auto); align-items: center; gap: 0.7rem; padding: 0.7rem; border: 1px solid #dfe7e1; border-radius: 8px; background: #fff; }
.asset-process-status small, .asset-process-status strong { display: block; }
.asset-process-status small { color: #748078; font-size: 0.59rem; }
.asset-process-status strong { font-size: 0.72rem; }
.asset-process-timeline { position: relative; padding-left: 2.45rem; }
.asset-process-timeline::before { content: ''; position: absolute; top: 14px; bottom: 14px; left: 16px; width: 2px; background: #dce5df; }
.asset-process-timeline > div { position: relative; min-height: 52px; display: flex; align-items: center; padding: 0.5rem 0.65rem; border: 1px solid #e1e7e3; border-radius: 7px; background: #fff; margin-bottom: 0.5rem; }
.asset-process-timeline > div > i { position: absolute; left: -2.45rem; z-index: 1; width: 34px; height: 34px; display: inline-flex; align-items: center; justify-content: center; border: 3px solid #fff; border-radius: 50%; background: #2f7d3e; color: #fff; box-shadow: 0 0 0 1px #dce5df; }
.asset-process-timeline > div.rejected > i { background: #b23c3c; }
.asset-process-timeline strong, .asset-process-timeline small { display: block; }
.asset-process-timeline strong { color: #34453a; font-size: 0.69rem; }
.asset-process-timeline small { color: #78847c; font-size: 0.59rem; }
.consumable-request-line { display: grid; grid-template-columns: minmax(0, 1fr) 90px 40px; gap: 0.5rem; margin-bottom: 0.5rem; }
.consumable-request-line:last-child { margin-bottom: 0; }
.consumable-request-line .btn { padding: 0; }
@media (max-width: 575.98px) { .asset-operation-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); } .asset-operation-summary > a:nth-child(2n) { border-right: 0; } .asset-operation-summary > a:nth-child(-n+2) { border-bottom: 1px solid #e6ece8; } .asset-module-tabs a { flex-direction: column; gap: 0.2rem; font-size: 0.58rem; } .asset-filter-bar { grid-template-columns: minmax(0, 1fr) auto auto; } .asset-filter-bar > select { grid-column: 1 / -1; grid-row: 2; } .asset-detail-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); } .asset-detail-summary > div:nth-child(2n) { border-right: 0; } .asset-detail-summary > div:nth-child(-n+2) { border-bottom: 1px solid #e6ece8; } .asset-process-status { grid-template-columns: auto minmax(0, 1fr); } .asset-process-status > span:last-child { grid-column: 2; } .consumable-request-line { grid-template-columns: minmax(0, 1fr) 72px 38px; } }
@media (max-width: 767.98px) { .asset-filter-panel { grid-template-columns: 1fr 1fr; } .asset-filter-search { grid-column: 1 / -1; } .asset-filter-actions { grid-column: 1 / -1; } .asset-filter-actions .btn-success { flex: 1; } .asset-value-strip { align-items: flex-start; flex-direction: column; gap: .25rem; } }
@media (max-width: 575.98px) {
    .asset-group-summary { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .asset-group-summary-four { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .asset-group-summary > a { min-height: 62px; padding: 0.5rem; border-bottom: 0 !important; }
    .asset-group-summary-four > a:nth-child(-n+2) { border-bottom: 1px solid #e6ece8 !important; }
    .asset-group-summary > a:nth-child(2) { border-right: 1px solid #e6ece8; }
    .asset-group-summary > a > i { display: none; }
    .asset-group-summary-two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .asset-group-summary-two > a:first-child { border-right: 1px solid #e6ece8; }
}
@media (max-width: 575.98px) { .emergency-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); } .emergency-summary > div:nth-child(2) { border-right: 0; } .emergency-summary > div:nth-child(-n+2) { border-bottom: 1px solid #e5ebe7; } }

/* Resident startup tour */
.startup-tour[hidden]{display:none!important}.startup-tour{position:fixed;inset:0;z-index:2000}.startup-tour-backdrop{position:absolute;inset:0;pointer-events:auto}.startup-tour-backdrop>i{position:fixed;display:block;background:rgba(9,20,13,.68);transition:all .25s ease}.startup-tour-focus{position:fixed;z-index:1;border:3px solid #7bd38e;border-radius:12px;background:transparent;box-shadow:0 0 0 4px rgba(105,195,124,.22),0 8px 28px rgba(0,0,0,.18);pointer-events:none;transition:all .25s ease}.startup-tour-card{position:fixed;z-index:2;width:min(360px,calc(100vw - 16px));padding:1rem;border:0;border-radius:14px;background:#fff;box-shadow:0 18px 55px rgba(0,0,0,.3);transition:top .25s ease,left .25s ease}.startup-tour-top{display:flex;align-items:center;gap:.55rem;margin-bottom:.7rem}.startup-tour-icon{width:38px;height:38px;display:grid;place-items:center;border-radius:10px;background:#e2f3e7;color:#24713b;font-size:.95rem}.startup-tour-step{flex:1;color:#748078;font-size:.58rem;font-style:normal}.startup-tour-step b,.startup-tour-step em{color:#31563d;font-style:normal}.startup-tour-close{width:30px;height:30px;border:0;border-radius:8px;background:#f1f4f2;color:#657269}.startup-tour-card h2{margin:0 0 .35rem;color:#263e2e;font-size:1rem;font-weight:800}.startup-tour-copy{min-height:48px;margin:0;color:#5f6d64;font-size:.7rem;line-height:1.6}.startup-tour-progress{height:5px;overflow:hidden;margin:.8rem 0;border-radius:99px;background:#e6ece8}.startup-tour-progress span{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#2d7a41,#67b878);transition:width .25s ease}.startup-tour-card footer{display:flex;align-items:center;justify-content:space-between;gap:.5rem}.startup-tour-card footer>span{display:flex;gap:.4rem}.startup-tour-card .btn{font-size:.63rem}.startup-tour-open{overflow:hidden}@media(max-width:575.98px){.startup-tour-card{left:8px!important;top:auto!important;bottom:12px;padding:.85rem}.startup-tour-card.is-top{top:12px!important;bottom:auto}.startup-tour-focus{border-radius:9px}.startup-tour-copy{min-height:auto}.startup-tour-card footer{margin-top:.2rem}}
.startup-tour-backdrop>i{background:rgba(6,17,10,.74)}.startup-tour-focus{border:3px solid #8fe5a1;background:rgba(255,255,255,.04);box-shadow:0 0 0 5px rgba(119,218,139,.24),0 0 28px rgba(93,217,119,.38)}.startup-tour-focus>span{position:absolute;top:-10px;right:-10px;width:20px;height:20px;border:3px solid #fff;border-radius:50%;background:#38a856;box-shadow:0 2px 8px rgba(0,0,0,.25);animation:startupTourPulse 1.4s ease-in-out infinite}.startup-tour-card{overflow:hidden;border:1px solid rgba(36,113,59,.16);box-shadow:0 20px 60px rgba(0,0,0,.36)}.startup-tour-brand{display:flex;align-items:center;gap:.5rem;margin:-1rem -1rem .75rem;padding:.65rem 1rem;background:linear-gradient(135deg,#176b3a,#2a8650);color:#fff}.startup-tour-brand>img,.startup-tour-brand>span{width:34px;height:34px;display:grid;place-items:center;flex:0 0 34px;border:2px solid rgba(255,255,255,.65);border-radius:9px;background:#fff;color:#237543;object-fit:contain}.startup-tour-brand small,.startup-tour-brand strong{display:block}.startup-tour-brand small{color:rgba(255,255,255,.68);font-size:.48rem;font-weight:800;letter-spacing:.08em}.startup-tour-brand strong{max-width:240px;overflow:hidden;font-size:.72rem;text-overflow:ellipsis;white-space:nowrap}.startup-tour-top{margin-bottom:.55rem}.startup-tour-hint{display:block;margin-top:.65rem;color:#8a948e;font-size:.52rem;text-align:center}.startup-tour-close:hover{background:#e5ebe7;color:#283d2f}.startup-tour-card .btn{min-height:32px;font-weight:700}@keyframes startupTourPulse{50%{transform:scale(.78);box-shadow:0 0 0 7px rgba(64,184,89,.18)}}@media(max-width:575.98px){.startup-tour-brand{margin:-.85rem -.85rem .65rem;padding:.55rem .85rem}.startup-tour-hint{display:none}.startup-tour-card{max-height:min(48vh,330px)}.startup-tour-copy{font-size:.68rem;line-height:1.45}}
@media (max-width: 575.98px) { .patrol-summary, .security-report-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); } .patrol-summary > div:nth-child(2) { border-right: 0; } .patrol-summary > div:nth-child(-n+2) { border-bottom: 1px solid #e5ebe7; } .patrol-map { min-height: 300px; } }
@media (max-width:575.98px){.patrol-time-header{padding:.65rem .7rem}.patrol-time-body{grid-template-columns:1fr;padding:.75rem}.patrol-time-line{grid-template-columns:1fr;gap:.55rem}.patrol-time-point{padding:0 .15rem}.patrol-time-point.is-end{justify-content:flex-end;text-align:right}.patrol-time-connector{height:18px;margin:-.15rem 0;padding:0}.patrol-time-connector i{top:0;bottom:0;left:31px;width:2px;height:auto;background:linear-gradient(#58a86d,#b7d9c0)}.patrol-time-connector i::after{top:auto;right:-3px;bottom:-1px;border-width:6px 4px 0;border-color:#b7d9c0 transparent transparent}.patrol-time-connector span{align-self:center}.patrol-time-duration{justify-content:center;text-align:left}.patrol-time-status{padding:.25rem .42rem}.patrol-time-status i{display:none}}

@media (max-width: 767.98px) {
    .non-ipl-program-list { grid-template-columns: 1fr; }
    .non-ipl-event-row .transaction-meta { max-width: 6.5rem; }
    .announcement-filter { grid-template-columns: minmax(0, 1fr) auto; }
    .announcement-filter .input-group { grid-column: 1 / -1; }
    .announcement-row .transaction-meta { min-width: 4.25rem; max-width: 5rem; }
}

/* Financial report UX */
.financial-report-controls{display:grid;grid-template-columns:minmax(210px,.7fr) minmax(0,1.8fr);gap:.75rem;padding:.85rem;border:1px solid #dce6df;border-radius:11px;background:#fff;box-shadow:0 3px 12px rgba(31,67,42,.06)}
.financial-report-controls-heading{grid-column:1/-1;display:flex;align-items:center;gap:.6rem;padding-bottom:.65rem;border-bottom:1px solid #e8eeea}.financial-report-controls-heading>span{width:34px;height:34px;display:grid;place-items:center;border-radius:9px;background:#e3f2e8;color:#198754}.financial-report-controls-heading strong,.financial-report-controls-heading small{display:block}.financial-report-controls-heading strong{color:#294434;font-size:.72rem}.financial-report-controls-heading small{color:#7b877f;font-size:.57rem}
.financial-report-controls .report-type-selector,.financial-report-controls .financial-report-filter{margin:0!important;padding:0!important;border:0!important;background:transparent!important}.financial-report-controls .report-type-selector{align-self:end}.financial-report-controls .financial-report-filter .row{align-items:end}.financial-report-controls .form-label{margin-bottom:.25rem;color:#637168;font-size:.57rem}
.financial-report-jump-nav{display:flex;gap:.4rem;overflow-x:auto;margin:0 0 1rem;padding:.15rem 0 .35rem;scrollbar-width:thin}.financial-report-jump-nav a{flex:0 0 auto;padding:.38rem .65rem;border:1px solid #dce6df;border-radius:999px;background:#fff;color:#53665a;text-decoration:none;font-size:.58rem;font-weight:700}.financial-report-jump-nav a:hover{border-color:#198754;background:#eef8f1;color:#198754}.financial-report-mode section[aria-labelledby]{scroll-margin-top:1rem}
.financial-report-toolbar{align-items:center;border:1px solid #dfe7e1;border-radius:9px;background:#fff;box-shadow:0 2px 8px rgba(32,66,42,.05)}.financial-report-toolbar .btn{white-space:nowrap}.financial-report-mode .report-official-header{border-radius:10px;box-shadow:0 2px 8px rgba(32,66,42,.04)}.financial-monthly-table,.financial-cluster-list,.cashflow-professional .table-responsive{box-shadow:0 2px 8px rgba(32,66,42,.04)}
.special-report-table-wrap{overflow:hidden;border:1px solid #dbe5de;border-radius:12px;background:#fff;box-shadow:0 5px 18px rgba(31,66,42,.06)}
.special-report-table-meta{min-height:48px;display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.65rem .8rem;border-bottom:1px solid #e4ebe6;background:linear-gradient(90deg,#f4f9f5,#fff)}
.special-report-table-meta span{display:flex;align-items:center;gap:.45rem;color:#2c5138;font-size:.7rem}.special-report-table-meta span i{width:28px;height:28px;display:grid;place-items:center;border-radius:7px;background:#dff0e4;color:#27713d}.special-report-table-meta small{color:#78857c;font-size:.56rem}
.special-report-table{--bs-table-hover-bg:#f5faf6;min-width:max-content}.special-report-table thead th{position:sticky;top:0;z-index:2;padding:.7rem .75rem;border:0;border-bottom:2px solid #2c6e40;background:#315f40;color:#fff;font-size:.56rem;font-weight:750;letter-spacing:.035em;text-transform:uppercase;white-space:nowrap}.special-report-table thead th:first-child{left:0;z-index:3;min-width:150px}.special-report-table tbody td{max-width:280px;padding:.68rem .75rem;border-color:#e8eeea;color:#435248;font-size:.64rem;line-height:1.45;white-space:nowrap}.special-report-table tbody tr:nth-child(even) td{background:#fbfcfb}.special-report-table tbody tr:hover td{background:#f2f8f4}.special-report-table .is-numeric{text-align:right;font-variant-numeric:tabular-nums}.special-report-table tbody td:first-child{position:sticky;left:0;z-index:1;background:#fff;box-shadow:1px 0 #e2e9e4}.special-report-table tbody tr:nth-child(even) td:first-child{background:#fbfcfb}.special-report-table tbody tr:hover td:first-child{background:#f2f8f4}
.special-report-primary{display:flex;align-items:center;gap:.5rem}.special-report-primary>span{width:24px;height:24px;flex:0 0 24px;display:grid;place-items:center;border-radius:6px;background:#e6f2e9;color:#397348;font-size:.53rem;font-weight:800}.special-report-primary>strong{overflow:hidden;color:#294434;font-size:.64rem;text-overflow:ellipsis}.report-money{display:inline-flex;align-items:baseline;justify-content:flex-end;gap:.2rem;color:#286b3c;font-weight:750}.report-money small{color:#7d8981;font-size:.48rem;font-weight:600}.report-money.is-negative{color:#b23b3b}.report-percent{min-width:84px;display:inline-grid;grid-template-columns:34px 44px;align-items:center;justify-content:end;gap:.35rem}.report-percent strong{font-size:.6rem}.report-percent i{height:4px;overflow:hidden;border-radius:99px;background:#e3eae5}.report-percent i span{display:block;height:100%;border-radius:inherit;background:#3c8b50}.special-report-status{display:inline-flex;padding:.22rem .45rem;border-radius:999px;font-size:.53rem;font-weight:750}.special-report-status.is-success{background:#dff2e5;color:#24703a}.special-report-status.is-warning{background:#fff0ce;color:#8a620b}.special-report-status.is-neutral{background:#edf1ee;color:#657269}.special-report-empty td{position:static!important;padding:2.5rem!important;text-align:center!important}.special-report-empty td>span,.special-report-empty td strong,.special-report-empty td small{display:block}.special-report-empty td i{margin-bottom:.45rem;color:#9aa79e;font-size:1.5rem}.special-report-empty td strong{color:#526158}.special-report-empty td small{margin-top:.2rem;color:#89938c;font-size:.58rem}
@media(max-width:767.98px){.financial-report-controls{grid-template-columns:1fr;padding:.7rem}.financial-report-controls-heading{grid-column:1}.financial-report-toolbar{display:flex;overflow-x:auto;padding:.5rem;gap:.35rem}.financial-report-toolbar>span{display:none}.financial-report-toolbar .btn,.financial-report-toolbar .portal-share-group{flex:0 0 auto}.financial-report-jump-nav{position:sticky;top:.25rem;z-index:12;padding:.35rem;background:rgba(244,247,245,.96);backdrop-filter:blur(6px)}.financial-report-heading{font-size:.75rem}.financial-report-summary{grid-template-columns:repeat(2,minmax(0,1fr))}.financial-position-band{overflow-x:auto}.financial-position-band>div{min-width:135px}.financial-cluster-numbers{min-width:110px}.financial-monthly-table{overflow-x:auto}.financial-monthly-head,.financial-monthly-row{min-width:700px}}
.financial-report-toolbar:has(.portal-share-group .dropdown-menu.show){overflow:visible;position:relative;z-index:1080}
.financial-report-toolbar:has(.portal-share-group .dropdown-menu.show) .portal-share-group{position:relative;z-index:1081}
.pwa-install-card{position:fixed;inset:0;z-index:2100;display:grid;place-items:center;padding:1rem}.pwa-install-card[hidden]{display:none}.pwa-install-backdrop{position:absolute;inset:0;background:rgba(7,24,14,.72);backdrop-filter:blur(3px)}.pwa-install-dialog{position:relative;width:min(460px,calc(100vw - 2rem));overflow:hidden;padding:2rem 1.75rem 1.35rem;border:1px solid rgba(39,122,67,.16);border-radius:22px;background:#fff;box-shadow:0 26px 80px rgba(0,0,0,.34);text-align:center;animation:pwaInstallEnter .28s ease-out}.pwa-install-dialog:before{position:absolute;top:0;right:0;left:0;height:7px;background:linear-gradient(90deg,#176b3a,#5caf74);content:""}.pwa-install-close{position:absolute;top:.75rem;right:.75rem;width:36px;height:36px;padding:0;border:0;border-radius:50%;background:#f0f4f1;color:#607168;font-size:.9rem}.pwa-install-close:hover{background:#e3ece6;color:#244a32}.pwa-install-icon{display:grid;width:82px;height:82px;margin:0 auto 1rem;overflow:hidden;place-items:center;border:1px solid #d9e9de;border-radius:22px;background:#edf7f0;box-shadow:0 12px 28px rgba(37,113,59,.16)}.pwa-install-icon img{width:100%;height:100%;object-fit:cover}.pwa-install-eyebrow{display:block;margin-bottom:.4rem;color:#2b8050;font-size:.63rem;font-weight:800;letter-spacing:.14em}.pwa-install-copy h2{margin:0;color:#203d2c;font-size:1.35rem;font-weight:850;line-height:1.3}.pwa-install-copy p{max-width:380px;margin:.65rem auto 1.2rem;color:#65746c;font-size:.82rem;line-height:1.6}.pwa-install-benefits{display:grid;grid-template-columns:repeat(3,1fr);gap:.55rem;margin-bottom:1.25rem}.pwa-install-benefits span{display:flex;min-height:76px;padding:.65rem .35rem;align-items:center;justify-content:center;flex-direction:column;gap:.4rem;border:1px solid #e2ebe5;border-radius:12px;background:#f7faf8;color:#2d7547}.pwa-install-benefits i{font-size:1.05rem}.pwa-install-benefits small{color:#5f7066;font-size:.57rem;line-height:1.3}.pwa-install-action{width:100%;min-height:46px;border-radius:11px;font-size:.82rem;font-weight:750}.pwa-install-later{margin-top:.4rem;color:#718078;font-size:.7rem;text-decoration:none}.pwa-install-open{overflow:hidden}@keyframes pwaInstallEnter{from{opacity:0;transform:translateY(18px) scale(.97)}to{opacity:1;transform:none}}@media(max-width:575.98px){.pwa-install-dialog{padding:1.65rem 1rem 1rem;border-radius:19px}.pwa-install-icon{width:72px;height:72px;margin-bottom:.8rem;border-radius:19px}.pwa-install-copy h2{font-size:1.15rem}.pwa-install-copy p{font-size:.74rem}.pwa-install-benefits{gap:.35rem}.pwa-install-benefits span{min-height:68px;padding:.5rem .2rem}.pwa-install-benefits small{font-size:.52rem}}@media(prefers-reduced-motion:reduce){.pwa-install-dialog{animation:none}}
.notification-queue-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.6rem}.notification-queue-stats>div{padding:.7rem;border:1px solid #e0e8e2;border-radius:9px;background:#f8faf9}.notification-queue-stats small,.notification-queue-stats strong{display:block}.notification-queue-stats small{color:#738078;font-size:.56rem}.notification-queue-stats strong{margin-top:.15rem;color:#304638;font-size:1rem}@media(max-width:575.98px){.notification-queue-stats{gap:.35rem}.notification-queue-stats>div{padding:.55rem}.notification-queue-stats small{min-height:2.4em}.notification-queue-stats strong{font-size:.85rem}}
.notification-history-filter{position:sticky;top:.5rem;z-index:5}.notification-history-card{overflow:hidden}.notification-history-table thead th{background:#f5f8f6;color:#5c6d62;font-size:.68rem;text-transform:uppercase;letter-spacing:.035em;white-space:nowrap;border-bottom:1px solid #dfe8e2}.notification-history-table tbody>tr:not(.collapse)>td{padding:.85rem .75rem}.notification-history-table pre{font:inherit;white-space:pre-wrap;word-break:break-word}.notification-history-card .collapse td{box-shadow:inset 0 1px 0 #dfe8e2,inset 0 -1px 0 #dfe8e2}.notification-history-card~*+.pagination{margin-top:1rem}.notification-history-filter+.notification-history-card .table-responsive{max-height:70vh}.notification-history-filter+.notification-history-card thead{position:sticky;top:0;z-index:2}.notification-history-filter~.notification-history-card .badge{font-weight:650}.notification-history-filter~.notification-history-card+.card-footer{border-top-color:#e5ece7}.notification-history-filter~.notification-history-card{}.notification-history-filter~*{}.notification-history-filter~.notification-history-card{}.notification-history-filter~.notification-history-card .btn{min-width:34px}.notification-history-filter~.notification-history-card td:nth-child(2){min-width:190px}.notification-history-filter~.notification-history-card td:nth-child(3){min-width:155px}.notification-history-filter~.notification-history-card td:nth-child(4){min-width:105px}.notification-history-filter~.notification-history-card td:nth-child(5){text-align:center}.notification-history-filter~.notification-history-card td:last-child{width:55px}.notification-history-filter~.notification-history-card tr.collapse td{padding:1rem!important}.notification-history-filter~.notification-history-card{}body:has(.notification-history-card) .notification-queue-stats{grid-template-columns:repeat(4,minmax(0,1fr))}@media(max-width:767.98px){.notification-history-filter{position:static}.notification-history-table{min-width:760px}.notification-history-filter+.notification-history-card .table-responsive{max-height:none}body:has(.notification-history-card) .notification-queue-stats{grid-template-columns:repeat(2,minmax(0,1fr))}}
.notification-history-card .badge{font-size:.72rem;padding:.38rem .55rem}.notification-history-table td:nth-child(4) .badge{font-size:.78rem;padding:.4rem .58rem}body:has(.notification-history-card) .notification-queue-stats{gap:.45rem}body:has(.notification-history-card) .notification-queue-stats>div{padding:.5rem .65rem}body:has(.notification-history-card) .notification-queue-stats small{font-size:.68rem;font-weight:600}body:has(.notification-history-card) .notification-queue-stats strong{font-size:1.15rem;line-height:1.15}
.notification-history-card .card-header{min-height:48px}.notification-history-card .notification-history-table tbody>tr>td{padding:.52rem .65rem}.notification-history-card .notification-history-table thead th{padding:.48rem .65rem}.notification-history-card .notification-history-table td small{line-height:1.15}.notification-history-card .notification-history-table td:nth-child(2){min-width:170px}.notification-history-card .notification-history-table td:nth-child(3){min-width:140px}.notification-history-card .notification-history-table td:nth-child(4){min-width:95px}.notification-history-card .notification-history-table .collapse{padding:.7rem!important}.notification-history-card .notification-history-table pre{padding:.65rem!important}.notification-history-card .btn-sm{padding:.24rem .45rem}
.private-attachment-preview{max-width:760px}.private-attachment-image{display:block;width:auto;max-width:100%;max-height:480px;object-fit:contain}.private-attachment-document{background:#fff;border:1px dashed #cbd8cf;border-radius:.5rem}@media(max-width:575.98px){.private-attachment-preview>div:first-child{align-items:flex-start!important;flex-direction:column}.private-attachment-preview>div:first-child>div:last-child{width:100%}.private-attachment-preview>div:first-child .btn{flex:1}.private-attachment-image{max-height:360px}}
.private-preview-modal{overflow:hidden}.private-preview-modal .modal-header{gap:.75rem}.private-preview-modal .private-preview-title{min-width:0;margin-right:auto}.private-preview-actions{display:flex;flex:0 0 auto;align-items:center;gap:.4rem}.private-preview-action{width:34px;height:34px;display:inline-grid;place-items:center;padding:0;border:1px solid rgba(255,255,255,.42);border-radius:50%;background:rgba(255,255,255,.12);color:#fff;text-decoration:none;transition:background-color .18s ease,transform .18s ease}.private-preview-action:hover{background:rgba(255,255,255,.25);color:#fff;transform:translateY(-1px)}.private-preview-action:focus-visible{outline:2px solid #fff;outline-offset:2px}@media(max-width:575.98px){.private-preview-modal .modal-header{padding:.65rem .75rem}.private-preview-action{width:32px;height:32px}.private-preview-modal .modal-body{padding:.65rem}}
.attachment-download-option{margin:.35rem 0 .35rem .35rem;vertical-align:middle}a:has(>img)+.attachment-download-option{display:table;margin:.35rem auto}.complaint-inline-image+.attachment-download-option{display:inline-flex}
.transfer-slip{width:min(100%,620px);margin-inline:auto;border:1px solid #e4e9e6;border-radius:6px;overflow:hidden;box-shadow:0 8px 28px rgba(31,55,41,.08);color:#252a27}.transfer-slip-header{padding:32px 40px 28px;border:0!important;background:#fff}.transfer-slip-brand{display:flex;align-items:center;gap:12px;margin-bottom:35px}.transfer-slip-brand img{width:52px;height:52px;border-radius:12px;object-fit:contain}.transfer-slip-brand strong,.transfer-slip-brand span{display:block}.transfer-slip-brand strong{color:#27834a;font-size:1.1rem}.transfer-slip-brand span{color:#8b938e;font-size:.83rem}.transfer-slip-result{display:flex;gap:17px;align-items:flex-start}.transfer-slip-check{display:grid;place-items:center;flex:0 0 42px;height:42px;border-radius:50%;background:#dcf4e4;color:#188344;font-size:1.1rem}.transfer-slip-check.is-void{background:#fde5e5;color:#c83232}.transfer-slip-result small{display:block;margin-bottom:8px;color:#929994;font-size:1rem}.transfer-slip-result h1{margin:0 0 14px;font-size:1.65rem;font-weight:800}.transfer-slip-result p{margin:0;color:#8a918d;line-height:1.45}.transfer-slip-result p strong{color:#68716b;font-weight:600}.transfer-slip-section{padding:27px 40px;border-top:9px solid #f5f7f6}.transfer-slip-label{display:block;margin-bottom:14px;color:#9aa09c;font-size:1rem}.transfer-slip-section h2{margin:0 0 6px;font-size:1.35rem;font-weight:800;text-transform:uppercase}.transfer-slip-section>p{margin:0;color:#59615c}.transfer-slip-details{margin:0}.transfer-slip-details>div,.transfer-slip-allocations>div{display:flex;justify-content:space-between;align-items:flex-start;gap:18px;padding:11px 0;border-bottom:1px solid #e4e8e5}.transfer-slip-details dt{color:#555d58;font-weight:400}.transfer-slip-details dd{margin:0;text-align:right;color:#555d58}.transfer-slip-details .is-primary dt,.transfer-slip-details .is-primary dd{font-size:1.03rem;font-weight:700}.transfer-slip-details .is-total{margin-top:2px;padding:14px 0;border-top:1px solid #252a27;border-bottom:1px solid #252a27}.transfer-slip-details .is-total dt,.transfer-slip-details .is-total dd{color:#202522;font-size:1.06rem;font-weight:800}.transfer-slip-allocations span,.transfer-slip-allocations small{display:block}.transfer-slip-allocations small{margin-top:2px;color:#929994}.transfer-slip-allocations b{white-space:nowrap}.transfer-slip-note{min-height:130px}.transfer-slip-note>p{white-space:normal}.transfer-slip footer{padding:16px 40px;background:#f7f9f8;color:#89918c;font-size:.72rem;text-align:center}.transfer-slip.document-image-export{width:620px!important;padding:0!important;border-radius:6px!important}.transfer-slip.document-image-export header{margin:0!important;padding:32px 40px 28px!important;background:#fff!important;color:#252a27!important}.transfer-slip.document-image-export header h1{color:#252a27!important}.transfer-slip.document-image-export header small,.transfer-slip.document-image-export header span:not(.transfer-slip-check){color:inherit!important}.transfer-slip.document-image-export .document-export-watermark{display:none}@media(max-width:575.98px){.transfer-slip-header,.transfer-slip-section{padding-left:22px;padding-right:22px}.transfer-slip-brand{margin-bottom:27px}.transfer-slip-result h1{font-size:1.35rem}.transfer-slip-result{gap:12px}.transfer-slip-check{flex-basis:36px;height:36px}.transfer-slip-section h2{font-size:1.15rem}.transfer-slip-details>div{gap:10px}.transfer-slip footer{padding-inline:22px}}@media print{body{background:#fff!important}.container{max-width:none!important;padding:0!important}.transfer-slip{width:100%;max-width:620px;border:0;box-shadow:none}.transfer-slip-header{padding-top:12px}.document-actions,.page-back-link{display:none!important}}
.transfer-slip-compact .transfer-slip-header{padding:22px 30px 20px}.transfer-slip-compact .transfer-slip-brand{margin-bottom:20px}.transfer-slip-compact .transfer-slip-brand img{width:44px;height:44px}.transfer-slip-compact .transfer-slip-result small{margin-bottom:3px;font-size:.82rem}.transfer-slip-compact .transfer-slip-result h1{margin-bottom:7px;font-size:1.42rem}.transfer-slip-compact .transfer-slip-result p{font-size:.78rem;line-height:1.35}.transfer-slip-compact .transfer-slip-section{padding:17px 30px;border-top-width:5px}.transfer-slip-parties{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}.transfer-slip-parties>div{min-width:0}.transfer-slip-parties>div+div{padding-left:22px;border-left:1px solid #e3e8e5}.transfer-slip-compact .transfer-slip-label{margin-bottom:6px;font-size:.76rem}.transfer-slip-compact .transfer-slip-section h2{margin-bottom:3px;font-size:.95rem;overflow-wrap:anywhere}.transfer-slip-compact .transfer-slip-section p{font-size:.75rem;line-height:1.4;overflow-wrap:anywhere}.transfer-slip-compact .transfer-slip-details>div,.transfer-slip-compact .transfer-slip-allocations>div{padding:7px 0;font-size:.78rem}.transfer-slip-compact .transfer-slip-details .is-total{padding:9px 0}.transfer-slip-compact .transfer-slip-note{min-height:0}.transfer-slip-compact footer{padding:11px 30px;font-size:.65rem}.transfer-slip-compact.document-image-export header{padding:22px 30px 20px!important}.transfer-slip-compact.document-image-export .transfer-slip-section{padding:17px 30px!important}@media(max-width:575.98px){.transfer-slip-compact .transfer-slip-header,.transfer-slip-compact .transfer-slip-section{padding-left:18px;padding-right:18px}.transfer-slip-compact .transfer-slip-brand{margin-bottom:16px}.transfer-slip-parties{gap:12px}.transfer-slip-parties>div+div{padding-left:12px}.transfer-slip-compact .transfer-slip-result h1{font-size:1.2rem}.transfer-slip-compact footer{padding-inline:18px}}@media(max-width:380px){.transfer-slip-parties{grid-template-columns:1fr}.transfer-slip-parties>div+div{padding-top:11px;padding-left:0;border-top:1px solid #e3e8e5;border-left:0}}
.device-permission-entry{display:grid;grid-template-columns:44px minmax(0,1fr) 24px;align-items:center;gap:.65rem;padding:.72rem;border:1px solid #a8cfb3;border-radius:11px;background:linear-gradient(135deg,#fff,#eef8f1);box-shadow:0 4px 12px rgba(28,91,44,.12);color:#214d30}.device-permission-entry>span:first-child{width:44px;height:44px;display:grid;place-items:center;border-radius:11px;background:#198754;color:#fff;font-size:1.12rem;box-shadow:0 4px 9px rgba(25,135,84,.25)}.device-permission-entry strong,.device-permission-entry small{display:block}.device-permission-entry strong{font-size:.74rem}.device-permission-entry small{color:#62766a;font-size:.56rem}.device-permission-entry>i{width:24px;height:24px;display:grid;place-items:center;border-radius:7px;background:#d9eee0;color:#176f3a;font-size:.65rem}.device-readiness-summary{display:flex;align-items:center;gap:.7rem;padding:.75rem;border:1px solid #cbdcd0;border-radius:10px;background:#fff;box-shadow:0 3px 10px rgba(32,67,42,.07)}.device-readiness-summary>span{width:42px;height:42px;display:grid;place-items:center;border-radius:10px;background:#5d6f64;color:#fff}.device-readiness-summary strong,.device-readiness-summary small{display:block}.device-readiness-summary strong{font-size:.75rem}.device-readiness-summary small{color:#65766c;font-size:.58rem}.device-readiness-summary.is-ready{border-color:#8ac59b;background:#f2faf4}.device-readiness-summary.is-ready>span{background:#198754;color:#fff}.device-readiness-summary.is-blocked{border-color:#e5a6a6;background:#fff5f5}.device-readiness-summary.is-blocked>span{background:#c53d3d;color:#fff}.device-permission-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.7rem}.device-permission-card{display:grid;grid-template-columns:46px minmax(0,1fr) auto;align-items:center;gap:.7rem;padding:.8rem;border:1px solid #bfd5c5;border-radius:11px;background:#fff;box-shadow:0 4px 12px rgba(32,67,42,.09)}.device-permission-icon{width:46px;height:46px;display:grid;place-items:center;border-radius:11px;background:#198754;color:#fff;font-size:1.08rem;box-shadow:0 3px 8px rgba(25,135,84,.2)}.device-permission-icon.is-location{background:#256fb5;color:#fff;box-shadow:0 3px 8px rgba(37,111,181,.22)}.device-permission-copy{min-width:0}.device-permission-copy>span{display:flex;align-items:center;justify-content:space-between;gap:.4rem}.device-permission-copy strong{font-size:.72rem}.device-permission-copy small{display:block;margin-top:.2rem;color:#68786f;font-size:.55rem}.device-status{padding:.2rem .4rem;border-radius:999px;font-size:.5rem;font-style:normal;font-weight:750;white-space:nowrap}.device-status.is-success{background:#dff2e5;color:#24703a}.device-status.is-danger{background:#f9dddd;color:#ad3535}.device-status.is-warning{background:#fff0ce;color:#87600c}.device-status.is-neutral{background:#edf1ee;color:#66736b}.device-camera-preview{overflow:hidden;border-radius:12px;background:#142119;color:#fff;box-shadow:0 7px 20px rgba(13,31,18,.2)}.device-camera-head{display:flex;align-items:center;justify-content:space-between;padding:.55rem .7rem}.device-camera-head strong{font-size:.65rem}.device-camera-preview video{display:block;width:100%;max-height:420px;aspect-ratio:16/9;object-fit:contain;background:#000}.device-camera-preview>small{display:block;padding:.5rem .7rem;color:#c8d4cb;font-size:.56rem}.device-section-title{margin:0 0 .6rem;font-size:.76rem}.device-capability-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.45rem}.device-capability-list>div{display:flex;align-items:center;justify-content:space-between;gap:.6rem;padding:.55rem .65rem;border:1px solid #d7e3da;border-radius:8px;background:#fff}.device-capability-list span{color:#596d60;font-size:.6rem}.device-capability-list span i{width:20px;color:#176f3a}.device-capability-list strong{font-size:.58rem;text-align:right}.device-permission-help{display:flex;align-items:center;justify-content:space-between;gap:.7rem}.device-permission-help>div{display:flex;align-items:flex-start;gap:.6rem}.device-permission-help>div>i{margin-top:.15rem;color:#176f3a}.device-permission-help strong,.device-permission-help small{display:block}.device-permission-help strong{font-size:.65rem}.device-permission-help small{margin-top:.1rem;color:#64766b;font-size:.55rem}@media(max-width:767.98px){.device-permission-grid{grid-template-columns:1fr}.device-permission-card{grid-template-columns:42px minmax(0,1fr) auto}.device-permission-icon{width:42px;height:42px}.device-capability-list{grid-template-columns:1fr}.device-permission-help{align-items:stretch;flex-direction:column}.device-permission-help .btn{align-self:flex-end}}
.profile-security-photo{width:76px;height:76px;border:4px solid #fff;border-radius:50%;object-fit:cover;background:#fff}.security-photo-uploader{display:grid;grid-template-columns:42px minmax(0,1fr) auto auto;align-items:center;gap:.6rem;padding:.7rem;border:2px solid #b9dbc2;border-radius:10px;background:linear-gradient(135deg,#f4fbf6,#e9f7ed);box-shadow:0 3px 10px rgba(28,91,44,.08)}.security-photo-uploader-icon{width:42px;height:42px;display:grid;place-items:center;border-radius:10px;background:#1d7540;color:#fff}.security-photo-uploader>span:nth-child(3){min-width:0}.security-photo-uploader strong,.security-photo-uploader small{display:block}.security-photo-uploader strong{color:#244d31;font-size:.7rem}.security-photo-uploader small{color:#65776b;font-size:.54rem}.security-photo-uploader input[type=file]{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}.security-photo-uploader .btn{white-space:nowrap;font-size:.58rem}@media(max-width:575.98px){.security-photo-uploader{grid-template-columns:38px minmax(0,1fr) auto}.security-photo-uploader-icon{width:38px;height:38px}.security-photo-uploader #securityPhotoSubmit{grid-column:1/-1;width:100%}.security-photo-uploader small{font-size:.5rem}}
@media(max-width:767.98px){.special-report-table-meta{align-items:flex-start;flex-direction:column;gap:.1rem}.special-report-table-meta small{padding-left:2.15rem}.special-report-table-wrap{overflow:visible;border:0;background:transparent;box-shadow:none}.special-report-table-wrap>.table-responsive{overflow:visible}.special-report-table{display:block;min-width:0}.special-report-table thead{display:none}.special-report-table tbody{display:grid;gap:.65rem}.special-report-table tbody tr{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));overflow:hidden;border:1px solid #dce6df;border-radius:10px;background:#fff;box-shadow:0 3px 10px rgba(32,67,42,.05)}.special-report-table tbody td,.special-report-table tbody td:first-child{position:static;max-width:none;min-width:0;display:flex;align-items:center;justify-content:space-between;gap:.55rem;padding:.55rem .65rem;border:0;border-bottom:1px solid #e9eeeb;background:#fff!important;box-shadow:none;white-space:normal;text-align:right}.special-report-table tbody td::before{content:attr(data-label);color:#7a867e;font-size:.51rem;font-weight:650;text-align:left}.special-report-table tbody td.special-report-primary{grid-column:1/-1;justify-content:flex-start;padding:.65rem;background:#f4f9f5!important}.special-report-table tbody td.special-report-primary::before{display:none}.special-report-table tbody td:nth-last-child(-n+2){border-bottom:0}.special-report-table tbody td:nth-child(even){border-right:1px solid #e9eeeb}.special-report-table tbody td.is-currency{flex-direction:column;align-items:flex-end;gap:.1rem}.special-report-table tbody td.is-currency::before{align-self:flex-start}.report-percent{min-width:74px;grid-template-columns:30px 38px}.special-report-empty{display:block!important}.special-report-empty td{display:block!important;border:1px solid #dce6df!important;border-radius:10px}.special-report-empty td::before{display:none}}

/* Rincian laporan selalu menggunakan mode tabel pada seluruh ukuran layar. */
@media(max-width:767.98px){.special-report-table-wrap{overflow:hidden;border:1px solid #dbe5de;background:#fff;box-shadow:0 4px 14px rgba(31,66,42,.05)}.special-report-table-meta{align-items:center;flex-direction:row}.special-report-table-meta small{padding-left:0;text-align:right}.special-report-table-wrap>.table-responsive{overflow-x:auto;overscroll-behavior-inline:contain;scrollbar-width:thin}.special-report-table{display:table;width:100%;min-width:680px;table-layout:auto}.special-report-table thead{display:table-header-group}.special-report-table tbody{display:table-row-group}.special-report-table tbody tr,.special-report-table tbody tr.special-report-empty{display:table-row;border:0;border-radius:0;background:transparent;box-shadow:none}.special-report-table tbody td,.special-report-table tbody td:first-child,.special-report-table tbody td.special-report-primary{position:static;display:table-cell;max-width:260px;min-width:auto;padding:.58rem .62rem;border:0;border-bottom:1px solid #e8eeea;background:inherit!important;box-shadow:none;white-space:nowrap;text-align:left}.special-report-table tbody td::before{display:none!important;content:none}.special-report-table tbody td:first-child,.special-report-table thead th:first-child{position:sticky;left:0;z-index:3;min-width:132px;max-width:190px;background:#fff!important;box-shadow:2px 0 5px rgba(42,70,50,.08)}.special-report-table thead th:first-child{z-index:4;background:#315f40!important}.special-report-table tbody tr:nth-child(even) td:first-child{background:#fbfcfb!important}.special-report-table tbody td.is-numeric,.special-report-table tbody td.is-currency{text-align:right}.special-report-table tbody td.is-currency{display:table-cell}.special-report-table .special-report-primary{display:flex;align-items:center}.special-report-empty td{display:table-cell!important;padding:2rem!important;border-radius:0}.report-percent{min-width:78px}}
.special-report-table td.special-report-primary{display:table-cell!important;vertical-align:middle}.special-report-table td.special-report-primary>span{display:inline-grid;vertical-align:middle}.special-report-table td.special-report-primary>strong{display:inline-block;max-width:calc(100% - 36px);vertical-align:middle}.special-report-table th.is-numeric,.special-report-table td.is-numeric{width:1%;min-width:105px}.special-report-table td:not(.is-numeric):not(.special-report-primary){min-width:115px}.special-report-table td[data-label="Keterangan"],.special-report-table td[data-label="Kontak"],.special-report-table td[data-label="Pelaku"],.special-report-table td[data-label="Pembayar"]{min-width:150px;max-width:240px;overflow:hidden;text-overflow:ellipsis}.special-report-table td[data-label="Status"]{min-width:110px}.special-report-table-wrap>.table-responsive{scrollbar-color:#a9bbb0 #eef2ef;scrollbar-width:thin}
@media(max-width:767.98px){
  .special-report-table tbody td[data-label="Kategori"],
  .special-report-table tbody td[data-label="Rumah"]{width:88px;min-width:72px!important;max-width:105px!important;white-space:normal!important;overflow-wrap:anywhere;line-height:1.3}
  .special-report-table tbody td.special-report-primary[data-label="Kategori"],
  .special-report-table tbody td.special-report-primary[data-label="Rumah"]{width:96px;min-width:82px!important;max-width:110px!important}
  .special-report-table tbody td.special-report-primary[data-label="Kategori"]>strong,
  .special-report-table tbody td.special-report-primary[data-label="Rumah"]>strong{max-width:calc(100% - 28px);white-space:normal;overflow-wrap:anywhere}
  .special-report-table tbody td.special-report-primary[data-label="Kategori"]>span,
  .special-report-table tbody td.special-report-primary[data-label="Rumah"]>span{width:22px;height:22px;font-size:.52rem}
}

/* Penyesuaian akses sentuh security dan kontras menu izin perangkat. */
.security-duty-action .btn{justify-content:center;min-width:112px;min-height:38px;padding:.48rem .8rem;box-shadow:0 2px 6px rgba(24,75,41,.1)}
.device-permission-entry{border-color:#bcd6c3;background:linear-gradient(135deg,#fff,#f4faf6);box-shadow:0 4px 12px rgba(28,91,44,.09)}
.device-permission-entry>span:first-child{background:#dcefe2;color:#23713b;box-shadow:inset 0 0 0 1px rgba(35,113,59,.08)}
.device-permission-entry>i{background:#edf6f0;color:#438154}
.profile-pwa-install{border-color:#78bc8b;background:linear-gradient(135deg,#f8fff9,#e4f5e9);color:#214d30;text-align:left}.profile-pwa-install>span:first-child{background:#198754;color:#fff;box-shadow:0 5px 12px rgba(25,135,84,.25)}.profile-pwa-install:hover{border-color:#3b9660;background:#eef9f1}.profile-pwa-install[hidden]{display:none!important}
@media(max-width:575.98px){.security-duty-action .btn{min-width:86px;min-height:38px;padding:.45rem .58rem}.security-duty-action .btn span{display:inline}}
.announcement-wa-option{display:grid;grid-template-columns:auto 32px minmax(0,1fr);align-items:center;gap:.55rem;margin:0 0 .55rem;padding:.5rem .65rem;border:1px solid #cde1d2;border-radius:9px;background:#f5fbf7;cursor:pointer}.announcement-wa-option .form-check-input{margin:0}.announcement-wa-icon{width:32px;height:32px;display:grid;place-items:center;border-radius:8px;background:#dff3e5;color:#16833d;font-size:1rem}.announcement-wa-option strong,.announcement-wa-option small{display:block}.announcement-wa-option strong{color:#294c34;font-size:.66rem}.announcement-wa-option small{color:#718078;font-size:.52rem;line-height:1.3}
@media(max-width:767.98px){
  .special-report-income .special-report-table,
  .special-report-expenses .special-report-table,
  .special-report-receivables .special-report-table{width:100%;min-width:420px;table-layout:fixed}
  .special-report-income .special-report-table th:first-child,
  .special-report-income .special-report-table td:first-child,
  .special-report-expenses .special-report-table th:first-child,
  .special-report-expenses .special-report-table td:first-child{width:112px;min-width:112px!important;max-width:112px!important}
  .special-report-income .special-report-table th:nth-child(2),
  .special-report-income .special-report-table td:nth-child(2),
  .special-report-expenses .special-report-table th:nth-child(2),
  .special-report-expenses .special-report-table td:nth-child(2){width:76px;min-width:76px!important}
  .special-report-income .special-report-table th:nth-child(3),
  .special-report-income .special-report-table td:nth-child(3),
  .special-report-expenses .special-report-table th:nth-child(3),
  .special-report-expenses .special-report-table td:nth-child(3){width:126px;min-width:126px!important}
  .special-report-income .special-report-table th:nth-child(4),
  .special-report-income .special-report-table td:nth-child(4),
  .special-report-expenses .special-report-table th:nth-child(4),
  .special-report-expenses .special-report-table td:nth-child(4){width:106px;min-width:106px!important}
  .special-report-receivables .special-report-table th:first-child,
  .special-report-receivables .special-report-table td:first-child{width:92px;min-width:92px!important;max-width:92px!important}
  .special-report-receivables .special-report-table th:nth-child(2),
  .special-report-receivables .special-report-table td:nth-child(2){width:82px;min-width:82px!important;max-width:82px!important;white-space:normal!important}
  .special-report-receivables .special-report-table th:nth-child(3),
  .special-report-receivables .special-report-table td:nth-child(3){width:116px;min-width:116px!important}
  .special-report-receivables .special-report-table th:nth-child(4),
  .special-report-receivables .special-report-table td:nth-child(4){width:130px;min-width:130px!important}
}

/* Keterbacaan role permission dan aksi mobile tanpa overlay. */
.role-permission-title strong{font-size:.88rem}.role-permission-title small{font-size:.64rem}.role-permission-title code{font-size:.6rem}.role-permission-count strong{font-size:.8rem}.role-permission-count small{font-size:.56rem}.role-permission-description{font-size:.7rem}.role-permission-form-tools strong{font-size:.76rem}.role-permission-form-tools small{font-size:.62rem}.role-permission-module>header strong{font-size:.72rem}.role-permission-module>header small{font-size:.59rem}.role-permission-option{padding:.58rem .52rem}.role-permission-option strong{font-size:.7rem;line-height:1.4}.role-permission-option code{font-size:.57rem}.role-permission-actions .btn{min-height:39px;font-size:.72rem}
@media(max-width:575.98px){.role-permission-item .accordion-body{padding:.7rem}.role-permission-actions{position:static;z-index:auto;margin:.85rem 0 0;padding:.75rem 0 0;background:transparent;box-shadow:none}.role-permission-actions .btn{min-width:150px;margin-left:auto}.role-permission-unsaved{max-width:none;font-size:.62rem}.role-permission-option strong{font-size:.74rem}.role-permission-option code{font-size:.6rem}.role-permission-module>header strong{font-size:.76rem}.role-permission-module>header small{font-size:.62rem}}

/* Halaman kontak: interaksi halus, snap scroll, dan status live. */
@media (prefers-reduced-motion:no-preference){ html { scroll-behavior:smooth } }
.contact-category-strip { scroll-snap-type:x proximity; padding-bottom:.35rem }
.contact-category-strip a { scroll-snap-align:start;border-radius:10px;transition:border-color .18s ease,box-shadow .18s ease,transform .18s ease,color .18s ease }
.contact-category-strip a:hover,.contact-category-strip a:focus-visible { transform:translateY(-2px);border-color:#9fd2b1;box-shadow:0 .35rem .8rem rgba(25,90,48,.12);color:#198754;text-decoration:none }
.contact-category-strip a:focus-visible,.contact-action-row:focus-visible,.contact-security-official a:focus-visible { outline:2px solid #56a86c;outline-offset:2px }
.contact-security-heading b::before { content:'';width:.32rem;height:.32rem;margin-right:.3rem;display:inline-block;border-radius:50%;background:#22a055;vertical-align:1px;animation:pwLivePulse 1.6s ease-in-out infinite }
@keyframes pwLivePulse { 0%,100%{opacity:1}50%{opacity:.35} }
.contact-security-official a { transition:filter .15s ease,transform .15s ease,box-shadow .15s ease }
.contact-security-official a:hover { filter:brightness(1.08);box-shadow:0 .2rem .5rem rgba(31,90,52,.22) }
.contact-security-official a:active { transform:scale(.97) }
.contact-officer-grid { gap:.6rem }
.contact-officer-card { transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease }
.contact-officer-card:hover { transform:translateY(-3px);border-color:#43a05e;box-shadow:0 8px 18px rgba(24,92,46,.16) }
.contact-officer-live i { animation:pwLivePulse 1.6s ease-in-out infinite }
.contact-action-row { position:relative;transition:background .15s ease }
.contact-action-row:hover { background:#f2f8f4 }
.contact-action-icon { transition:transform .15s ease }
.contact-action-row:hover .contact-action-icon { transform:scale(1.06) }
@media (max-width:390px){ .contact-officer-grid { gap:.5rem;padding:.6rem } .contact-officer-card { padding:.95rem .4rem .6rem } }
.pwa-launch-screen{display:none}.pwa-standalone .pwa-launch-screen{position:fixed;inset:0;z-index:12000;display:grid;place-items:center;overflow:hidden;background:linear-gradient(155deg,#f8fcf9 0%,#edf7f0 48%,#e4f2e8 100%);opacity:1;transition:opacity .35s ease,visibility .35s ease}.pwa-launch-screen.is-leaving{visibility:hidden;opacity:0}.pwa-launch-content{position:relative;z-index:2;display:flex;width:min(84vw,360px);align-items:center;flex-direction:column;text-align:center}.pwa-launch-logo-wrap{position:relative;display:grid;width:112px;height:112px;margin-bottom:25px;place-items:center;border:1px solid rgba(35,124,69,.16);border-radius:31px;background:rgba(255,255,255,.94);box-shadow:0 18px 42px rgba(28,102,55,.18),inset 0 1px 0 #fff}.pwa-launch-logo-wrap img{position:relative;z-index:2;width:84px;height:84px;padding:5px;object-fit:contain;transform-origin:center;animation:pwa-launch-logo-spin 1.8s linear infinite}.pwa-launch-logo-fallback{position:relative;z-index:2;color:#267947;font-size:2.25rem;font-weight:850;letter-spacing:-.08em;transform-origin:center;animation:pwa-launch-logo-spin 1.8s linear infinite}.pwa-launch-ring{position:absolute;inset:-9px;border:2px solid transparent;border-top-color:#2e9254;border-right-color:rgba(46,146,84,.2);border-radius:37px;animation:pwa-launch-spin 1.8s linear infinite}.pwa-launch-content>small{margin-bottom:7px;color:#4e9968;font-size:.62rem;font-weight:800;letter-spacing:.2em}.pwa-launch-content>strong{max-width:100%;color:#1d4d2d;font-size:1.3rem;font-weight:850;line-height:1.25}.pwa-launch-content>p{margin:7px 0 19px;color:#77847b;font-size:.74rem}.pwa-launch-progress{width:138px;height:4px;overflow:hidden;border-radius:99px;background:#d6e8dc}.pwa-launch-progress span{display:block;width:48%;height:100%;border-radius:inherit;background:linear-gradient(90deg,#247c45,#63b77d);animation:pwa-launch-progress 1.15s ease-in-out infinite}.pwa-launch-glow{position:absolute;border-radius:50%;filter:blur(2px);opacity:.55}.pwa-launch-glow-one{top:-15%;right:-25%;width:75vw;height:75vw;background:radial-gradient(circle,rgba(90,185,119,.23),transparent 68%)}.pwa-launch-glow-two{bottom:-18%;left:-28%;width:80vw;height:80vw;background:radial-gradient(circle,rgba(31,121,67,.14),transparent 68%)}.pwa-launch-secure{position:absolute;right:0;bottom:max(28px,env(safe-area-inset-bottom));left:0;z-index:2;display:flex;justify-content:center;align-items:center;gap:6px;color:#799082;font-size:.6rem}.pwa-launch-secure i{color:#449763}@keyframes pwa-launch-spin{to{transform:rotate(360deg)}}@keyframes pwa-launch-logo-spin{to{transform:rotate(360deg)}}@keyframes pwa-launch-progress{0%{transform:translateX(-110%)}50%{transform:translateX(105%)}100%{transform:translateX(220%)}}@media(prefers-reduced-motion:reduce){.pwa-launch-ring,.pwa-launch-logo-wrap img,.pwa-launch-logo-fallback,.pwa-launch-progress span{animation:none}.pwa-launch-progress span{width:100%}}@media(max-width:390px){.pwa-launch-logo-wrap{width:98px;height:98px;border-radius:27px}.pwa-launch-logo-wrap img{width:74px;height:74px}.pwa-launch-ring{border-radius:33px}.pwa-launch-content>strong{font-size:1.15rem}}
.pwa-standalone.pwa-launch-seen .pwa-launch-screen{display:none}
.report-officer-multiselect .dropdown-toggle{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.report-officer-multiselect .dropdown-menu{min-width:240px}.report-officer-options{max-height:240px;overflow-y:auto;overscroll-behavior:contain}.report-officer-multiselect .dropdown-item{font-size:.75rem;white-space:normal;cursor:pointer}.report-officer-multiselect .dropdown-item:hover{background:#edf7f0}

/* Compact transparency dashboard refresh */
.dashboard-filter-collapse{overflow:hidden;border:1px solid #dce8df;border-radius:14px;background:#fff;box-shadow:0 4px 15px rgba(31,83,47,.06)}
.dashboard-filter-toggle{display:flex;width:100%;align-items:center;justify-content:space-between;gap:.75rem;padding:.78rem .9rem;border:0;background:#fff;color:#344b3a;text-align:left}
.dashboard-filter-toggle>span{display:flex;min-width:0;align-items:center;gap:.65rem}.dashboard-filter-toggle>span>i{display:grid;width:34px;height:34px;flex:0 0 34px;place-items:center;border-radius:10px;background:#e8f5ec;color:#198754}.dashboard-filter-toggle small,.dashboard-filter-toggle strong{display:block}.dashboard-filter-toggle small{color:#7b887f;font-size:.52rem}.dashboard-filter-toggle strong{overflow:hidden;font-size:.68rem;text-overflow:ellipsis;white-space:nowrap}.dashboard-filter-toggle>i{color:#799083;font-size:.65rem;transition:transform .2s}.dashboard-filter-toggle:not(.collapsed)>i{transform:rotate(180deg)}.dashboard-filter-collapse .dashboard-filter-bar{border-top:1px solid #e8efea;border-radius:0;background:#f8fbf9}
.collection-progress-card{padding:1rem;border-radius:14px;box-shadow:0 5px 18px rgba(31,83,47,.06)}.collection-progress-heading{display:flex;align-items:center;gap:.7rem}.collection-progress-heading>div{min-width:0;flex:1}.collection-progress-heading>b{padding:.35rem .55rem;border-radius:999px;background:#e5f5ea;color:#15733d;font-size:.72rem}.collection-progress-icon{display:grid;width:38px;height:38px;flex:0 0 38px;place-items:center;border-radius:11px;background:linear-gradient(145deg,#218c50,#46ad6d);color:#fff}.collection-progress-track{height:9px;margin:.9rem 0 1rem;overflow:hidden;border-radius:99px;background:#e7eee9}.collection-progress-track i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#18824a,#58b978);box-shadow:0 0 10px rgba(25,135,84,.25)}
.collection-status-grid{gap:.45rem}.collection-status-grid span{display:grid;grid-template-columns:auto auto;align-items:center;justify-content:center;gap:0 .3rem;padding:.55rem .25rem;border:1px solid #e5ece7;border-radius:10px;background:#fafcfb;text-align:left}.collection-status-grid span>i{grid-row:1/3;color:#718078;font-size:.65rem}.collection-status-grid span>b{font-size:.78rem;line-height:1}.collection-status-grid span>small{font-size:.45rem}.collection-status-grid .is-paid>i{color:#198754}.collection-status-grid .is-partial>i{color:#df9a21}.collection-status-grid .is-overdue>i{color:#c74652}
.collection-area-card{box-shadow:0 5px 18px rgba(31,83,47,.05)}.collection-area-row{justify-content:flex-start;gap:.65rem}.collection-area-rank{display:grid!important;width:27px!important;height:27px;flex:0 0 27px;place-items:center;border-radius:8px;background:#edf6f0;color:#287747;font-size:.58rem;font-weight:800}.collection-area-info{min-width:0;flex:1}.collection-area-info i{display:block;height:5px;margin-top:.38rem;overflow:hidden;border-radius:99px;background:#e7eee9}.collection-area-info em{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#2c9255,#66bd81)}.collection-area-rate{width:auto!important;min-width:90px}.collection-area-rate b,.collection-area-rate small{display:block}.collection-area-rate b{color:#198754;font-size:.7rem}.collection-area-rate small{font-size:.48rem}
.collection-trend-card{box-shadow:0 5px 18px rgba(31,83,47,.05)}.collection-trend{height:180px;gap:.55rem;padding:1.5rem .3rem 0;border-bottom:1px solid #dfe9e2;background:repeating-linear-gradient(to bottom,transparent 0,transparent 44px,#edf2ee 45px)}.collection-trend>span{position:relative}.collection-trend b{position:absolute;top:-1.15rem;color:#617067;font-size:.43rem;font-weight:650;white-space:nowrap}.collection-trend i{min-height:8px;background:linear-gradient(#63c285,#218d51);box-shadow:0 3px 8px rgba(25,135,84,.18)}.collection-trend-caption{display:flex;justify-content:space-between;padding-top:.55rem;color:#7b887f;font-size:.48rem}.collection-trend-caption span:last-child{display:flex;align-items:center;gap:.3rem}.collection-trend-caption i{display:block;width:7px;height:7px;border-radius:2px;background:#269355}.dashboard-empty-state{display:flex;min-height:105px;align-items:center;justify-content:center;flex-direction:column;gap:.45rem;color:#849087;font-size:.58rem;text-align:center}.dashboard-empty-state>i{color:#b7c9bc;font-size:1.35rem}
.finance-composition-card{box-shadow:0 5px 18px rgba(31,83,47,.05)}.finance-composition-row{display:flex;align-items:center;gap:.7rem;padding:.78rem 0;border-top:1px solid #edf1ee}.finance-composition-row:first-of-type{border-top:0}.finance-composition-icon{display:grid;width:34px;height:34px;flex:0 0 34px;place-items:center;border-radius:10px;font-size:.68rem}.finance-composition-icon.is-income{background:#e7f5eb;color:#198754}.finance-composition-icon.is-expense{background:#fbeaec;color:#c34450}.finance-composition-row>div{min-width:0;flex:1}.finance-composition-row>div>span{display:flex;align-items:flex-end;justify-content:space-between;gap:.7rem}.finance-composition-row strong,.finance-composition-row small{display:block}.finance-composition-row strong{font-size:.67rem}.finance-composition-row small{color:#849087;font-size:.48rem}.finance-composition-row b{display:block;margin-top:-.85rem;font-size:.64rem;text-align:right}.finance-composition-row>div>i{display:block;height:5px;margin-top:.55rem;overflow:hidden;border-radius:99px;background:#edf1ee}.finance-composition-row em{display:block;height:100%;border-radius:inherit}.finance-composition-row em.is-income{background:#39a965}.finance-composition-row em.is-expense{background:#dc5b66}
@media(max-width:575.98px){.collection-metric-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.collection-metric-grid>div{min-height:91px;padding:.82rem}.collection-metric-grid strong{max-width:calc(100% - 22px);font-size:.78rem}.collection-metric-grid>div>i{right:.65rem;bottom:.65rem;font-size:1.05rem}.collection-status-grid{grid-template-columns:repeat(2,1fr)}.collection-status-grid span:last-child:nth-child(odd){grid-column:1/-1}.collection-area-row{align-items:flex-start}.collection-area-rate{min-width:76px}.collection-trend{height:155px;gap:.45rem;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x proximity;overscroll-behavior-inline:contain}.collection-trend>span{min-width:58px;flex:0 0 58px;scroll-snap-align:start}.collection-trend b{font-size:.64rem}.finance-composition-row b{margin-top:.15rem;text-align:left}}

/* Financial report tab readability */
.financial-health-score b{font-size:1rem}.financial-health-score small{font-size:.52rem;line-height:1.2}.financial-health-summary>div>small{font-size:.6rem}.financial-health-summary h5{font-size:1.12rem}.financial-health-summary p{font-size:.68rem;line-height:1.5}.report-summary-links>div{gap:.8rem;padding:.82rem 0}.report-summary-links>div>i{width:34px;font-size:1rem}.report-summary-links strong{font-size:.78rem}.report-summary-links small{margin-top:.12rem;font-size:.63rem;line-height:1.45}
@media(max-width:575.98px){.financial-health-score b{font-size:.9rem}.financial-health-score small{font-size:.48rem}.financial-health-summary h5{font-size:1rem}.financial-health-summary p{font-size:.64rem}.report-summary-links strong{font-size:.76rem}.report-summary-links small{font-size:.61rem}}

/* Dashboard values: stronger visual hierarchy */
.collection-metric-grid strong{font-size:1.9rem;line-height:1.12;letter-spacing:-.035em}.collection-progress-heading>b{font-size:1.4rem;line-height:1}.collection-status-grid span>b{font-size:1.55rem;line-height:1.05}.dashboard-breakdown-row b{font-size:1.25rem}.collection-area-rate b{font-size:1.35rem}.collection-trend b{font-size:.82rem}.finance-composition-row b{font-size:1.2rem}.financial-health-score b{font-size:1.8rem}.financial-health-summary h5{font-size:1.65rem}.report-summary-links small{font-size:.76rem}.report-summary-links small:first-letter{font-size:1em}
@media(max-width:575.98px){.collection-metric-grid strong{max-width:100%;font-size:clamp(1.15rem,5.2vw,1.55rem);overflow-wrap:anywhere}.collection-metric-grid>div>i{opacity:.45}.collection-progress-heading>b{font-size:1.15rem}.collection-status-grid span>b{font-size:1.35rem}.dashboard-breakdown-row b{font-size:1.05rem}.collection-area-rate b{font-size:1.12rem}.finance-composition-row b{font-size:1.05rem}.financial-health-score b{font-size:1.35rem}.financial-health-summary h5{font-size:1.3rem}.report-summary-links small{font-size:.7rem}}

/* Emergency create header refinement */
.emergency-create-header{min-height:0;padding:1.05rem 1.2rem 1.3rem;border-radius:26px}.emergency-create-header:after{right:-35px;bottom:-82px;width:185px;height:185px;border-width:26px}.emergency-create-header .header-back-link{display:inline-flex;align-items:center;gap:.48rem;margin:0;padding:.25rem 0;color:rgba(255,255,255,.94);font-size:.8rem;font-weight:800}.emergency-create-header>div{display:grid;grid-template-columns:48px minmax(0,1fr);column-gap:.85rem;margin-top:.9rem;padding:0}.emergency-create-symbol{position:static;grid-row:1/4;width:48px;height:48px;align-self:center;font-size:1.15rem}.emergency-create-header>div>small,.emergency-create-header>div>h1,.emergency-create-header>div>p{grid-column:2}.emergency-create-header>div>small{font-size:.65rem}.emergency-create-header h1{font-size:1.55rem;line-height:1.15}.emergency-create-header p{font-size:.78rem;line-height:1.45}.emergency-active-alert{display:grid;grid-template-columns:34px minmax(0,1fr) auto;align-items:center;gap:.7rem;padding:.8rem .9rem;border-radius:14px}.emergency-active-alert>i{font-size:1.1rem;text-align:center}.emergency-active-alert strong,.emergency-active-alert small{display:block}.emergency-active-alert strong{font-size:.72rem;line-height:1.3}.emergency-active-alert small{margin-top:.12rem;font-size:.6rem}.emergency-active-alert .btn{white-space:nowrap}
@media(max-width:575.98px){.emergency-create-shell{margin-top:0}.emergency-create-header{margin:0 0 .9rem;padding:.9rem 1.05rem 1.15rem;border-radius:25px}.emergency-create-header:after{right:-58px;bottom:-94px;width:175px;height:175px;border-width:24px}.emergency-create-header .header-back-link{font-size:.76rem}.emergency-create-header>div{grid-template-columns:42px minmax(0,1fr);column-gap:.72rem;margin-top:.65rem}.emergency-create-symbol{width:42px;height:42px;border-radius:12px;font-size:1.05rem}.emergency-create-header>div>small{font-size:.58rem}.emergency-create-header h1{margin:.08rem 0;font-size:1.32rem}.emergency-create-header p{max-width:360px;font-size:.7rem;line-height:1.4}.emergency-active-alert{grid-template-columns:28px minmax(0,1fr) auto;gap:.5rem;margin-bottom:.75rem;padding:.7rem;border-radius:16px}.emergency-active-alert>i{font-size:.95rem}.emergency-active-alert strong{font-size:.66rem}.emergency-active-alert small{font-size:.55rem}.emergency-active-alert .btn{padding:.35rem .5rem;border-radius:9px;font-size:.58rem}}
@media(max-width:575.98px){.emergency-create-shell{padding-bottom:116px}.emergency-create-header{margin-bottom:.6rem;padding:.7rem .9rem .8rem;border-radius:21px}.emergency-create-header .header-back-link{padding:.1rem 0;font-size:.7rem}.emergency-create-header>div{grid-template-columns:36px minmax(0,1fr);column-gap:.6rem;margin-top:.4rem}.emergency-create-symbol{width:36px;height:36px;border-radius:10px;font-size:.9rem}.emergency-create-header>div>small{font-size:.52rem}.emergency-create-header h1{font-size:1.18rem}.emergency-create-header p{font-size:.62rem;line-height:1.3}.emergency-active-alert{margin-bottom:.55rem;padding:.55rem .65rem}.emergency-create-card{padding:.65rem;border-radius:12px}.emergency-location-card,.emergency-gps-card{grid-template-columns:32px minmax(0,1fr) auto;gap:.5rem;padding:.52rem .6rem}.emergency-location-card>span,.emergency-gps-icon{width:32px;height:32px;border-radius:8px;font-size:.75rem}.emergency-location-card small,.emergency-gps-card small{font-size:.46rem}.emergency-location-card strong,.emergency-gps-card strong{font-size:.64rem}.emergency-location-card p,.emergency-gps-card p{font-size:.52rem}.emergency-gps-card{margin-top:.4rem}.emergency-create-card .row.g-3{--bs-gutter-y:.6rem}.emergency-create-card .form-label{margin-bottom:.25rem;font-size:.68rem}.emergency-create-card .form-select{min-height:38px;padding-top:.35rem;padding-bottom:.35rem;font-size:.72rem}.emergency-create-card textarea.form-control{min-height:54px;padding:.5rem .65rem;font-size:.68rem}.emergency-instruction{margin:.55rem 0 0;padding:.48rem .55rem}.emergency-instruction strong{font-size:.59rem}.emergency-instruction small{font-size:.5rem}.emergency-page-hold{position:fixed;left:max(1rem,calc((100vw - 760px)/2 + 1rem));right:max(1rem,calc((100vw - 760px)/2 + 1rem));bottom:calc(72px + env(safe-area-inset-bottom));z-index:1035;width:auto;height:78px;border:3px solid rgba(255,255,255,.9);border-radius:17px;box-shadow:0 8px 26px rgba(102,18,31,.38)}.emergency-page-hold-content>i{font-size:1.2rem}.emergency-page-hold-content strong{font-size:.76rem}.emergency-page-hold-content small{font-size:.5rem}.emergency-safety-note{margin-top:.45rem;padding:.45rem .55rem}.emergency-safety-note strong{font-size:.58rem}.emergency-safety-note small{font-size:.5rem}}

/* Financial health donut follows the calculated expense-coverage value. */
.financial-health-score{--financial-score-color:#198754;position:relative;width:88px;height:88px;flex-basis:88px;background:conic-gradient(var(--financial-score-color) var(--financial-score),#e5ece7 0);box-shadow:none}
.financial-health-score::before{content:"";position:absolute;inset:9px;border-radius:50%;background:#fff}
.financial-health-score.is-warning{--financial-score-color:#d99a28}
.financial-health-score.is-danger{--financial-score-color:#c64a55}
.financial-health-score b,.financial-health-score small{position:relative;z-index:1}
.financial-health-score small{max-width:58px;line-height:1.15}
@media(max-width:575.98px){.financial-health-summary{align-items:center}.financial-health-score{width:78px;height:78px;flex-basis:78px}}

/* Security operations: compact management header and distinct quick actions. */
.security-operations-page.is-management>.hero-banner{padding-top:1rem!important;padding-bottom:1rem!important}.security-operations-page.is-management>.hero-banner>small{display:none}.security-operations-page.is-management>.hero-banner h4{margin-top:.75rem!important}.security-operations-page.is-management>.hero-banner p{max-width:430px}.security-operations-page .security-ops-tabs .nav-link{justify-content:center;min-height:58px;white-space:nowrap}.security-operations-page .security-simple-actions>a,.security-operations-page .security-simple-actions>button{--ops-action:#338552;--ops-bg:#e9f5ec;border-color:color-mix(in srgb,var(--ops-action) 22%,#fff);background:linear-gradient(145deg,#fff,var(--ops-bg));color:#263b2c;box-shadow:0 8px 18px rgba(28,53,35,.05);transition:transform .18s ease,box-shadow .18s ease}.security-operations-page .security-simple-actions>a:hover,.security-operations-page .security-simple-actions>button:hover{transform:translateY(-2px);box-shadow:0 12px 24px rgba(28,53,35,.1)}.security-operations-page .security-simple-actions>a:nth-child(1){--ops-action:#237b57;--ops-bg:#e6f5ee}.security-operations-page .security-simple-actions>a:nth-child(2){--ops-action:#2f6fa8;--ops-bg:#e8f2fa}.security-operations-page .security-simple-actions>a:nth-child(3){--ops-action:#b36a19;--ops-bg:#fff3df}.security-operations-page .security-simple-actions>button:nth-child(4){--ops-action:#7652a8;--ops-bg:#f1ebf9}.security-operations-page .security-simple-actions i{width:46px;height:46px;display:grid;place-items:center;border-radius:14px;background:color-mix(in srgb,var(--ops-action) 13%,#fff);font-size:1.35rem;color:var(--ops-action)}.security-operations-page .security-simple-actions small{text-align:center;padding:0 .35rem;color:#66736a}@media(max-width:575.98px){.security-operations-page .security-ops-tabs{display:flex;overflow-x:auto;scrollbar-width:none}.security-operations-page .security-ops-tabs::-webkit-scrollbar{display:none}.security-operations-page .security-ops-tabs .nav-link{min-width:88px;flex:0 0 auto}.security-operations-page .security-simple-actions>a,.security-operations-page .security-simple-actions>button{min-height:112px}}
/* Precision pass for Security Operations. */
.security-operations-page .security-simple-actions{align-items:stretch;grid-auto-rows:1fr}.security-operations-page .security-simple-actions>a,.security-operations-page .security-simple-actions>button{appearance:none;-webkit-appearance:none;width:100%;height:100%;min-height:116px;margin:0;padding:.75rem .45rem;font:inherit;line-height:1;border-style:solid;display:grid;grid-template-rows:44px 18px 30px;align-content:center;justify-items:center;gap:.35rem;overflow:hidden}.security-operations-page .security-simple-actions i{width:42px;height:42px;border-radius:13px;font-size:1.18rem}.security-operations-page .security-simple-actions strong{width:100%;font-size:.86rem;line-height:18px;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.security-operations-page .security-simple-actions small{width:100%;height:30px;padding:0 .15rem;font-size:.66rem;line-height:1.25;display:flex;align-items:flex-start;justify-content:center}.security-operations-page .security-ops-tabs{box-shadow:0 7px 20px rgba(31,65,41,.05)}.security-operations-page .security-ops-tabs .nav-link{padding:.55rem .35rem;font-size:.68rem;line-height:1.15}.security-operations-page .security-ops-tabs .nav-link i{font-size:.95rem}.security-operations-page #opsToday>h6{margin:1.25rem 0 .65rem;font-size:.84rem;letter-spacing:.01em;color:#263b2c}.security-operations-page .security-shift-card{padding:.85rem;box-shadow:0 6px 18px rgba(31,65,41,.045)}.security-operations-page .security-shift-card>div:first-child strong{font-size:.86rem}.security-operations-page .security-shift-card>div:first-child small{font-size:.68rem}.security-operations-page .security-assignment-list{gap:.35rem;margin-top:.65rem}.security-operations-page .security-assignment-list span{min-height:45px;grid-template-columns:22px minmax(0,1fr) minmax(72px,auto);gap:.25rem;padding:.45rem .55rem}.security-operations-page .security-assignment-list b{font-size:.76rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.security-operations-page .security-assignment-list small{font-size:.65rem;text-align:right}.security-operations-page>.border.bg-white{border-color:#dce7df!important;border-radius:16px!important;box-shadow:0 7px 20px rgba(31,65,41,.045)}.security-operations-page>.border.bg-white>div:first-child strong,.security-operations-page>.border.bg-white>strong:first-child{font-size:.86rem}.security-operations-page .security-calendar-list>article{padding:.75rem;box-shadow:0 4px 12px rgba(31,65,41,.035)}@media(max-width:575.98px){.security-operations-page .security-simple-actions{gap:.55rem}.security-operations-page .security-simple-actions>a,.security-operations-page .security-simple-actions>button{min-height:108px;padding:.65rem .35rem;grid-template-rows:40px 17px 27px;gap:.28rem}.security-operations-page .security-simple-actions i{width:38px;height:38px;border-radius:12px;font-size:1.05rem}.security-operations-page .security-simple-actions strong{font-size:.8rem;line-height:17px}.security-operations-page .security-simple-actions small{height:27px;font-size:.62rem}.security-operations-page .security-assignment-list span{grid-template-columns:20px minmax(0,1fr)}.security-operations-page .security-assignment-list small{grid-column:2;text-align:left}.security-operations-page .security-calendar-list article .w-100 .row>div:nth-child(1){width:100%}.security-operations-page .security-calendar-list article .w-100 .row>div:nth-child(2),.security-operations-page .security-calendar-list article .w-100 .row>div:nth-child(3){width:41.66666667%}.security-operations-page .security-calendar-list article .w-100 .row>div:nth-child(4){width:16.66666667%}}
/* Emergency pages: readable type on small, high-stress mobile screens. */
.emergency-create-header>div>small{font-size:.72rem}.emergency-create-header p{font-size:.84rem}.emergency-active-alert strong{font-size:.82rem}.emergency-active-alert small{font-size:.72rem}.emergency-location-card small,.emergency-gps-card small{font-size:.66rem}.emergency-location-card strong,.emergency-gps-card strong{font-size:.86rem}.emergency-location-card p,.emergency-gps-card p{font-size:.74rem;line-height:1.4}.emergency-instruction strong{font-size:.8rem}.emergency-instruction small{font-size:.72rem;line-height:1.4}.emergency-page-hold-content strong{font-size:.95rem}.emergency-page-hold-content small{font-size:.7rem}.emergency-result>div>small,.emergency-result-grid small{font-size:.68rem}.emergency-result-grid strong{font-size:.82rem}.emergency-safety-note strong{font-size:.78rem}.emergency-safety-note small{font-size:.7rem;line-height:1.45}.emergency-detail-page small,.emergency-detail-page .small{font-size:.76rem}.emergency-detail-page .btn-sm{font-size:.76rem}.emergency-detail-page .form-control-sm{min-height:40px;font-size:.8rem}.emergency-detail-page .complaint-timeline-content p{font-size:.78rem;line-height:1.5}.emergency-summary small{font-size:.72rem}.emergency-summary strong{font-size:.9rem}
@media(max-width:575.98px){.emergency-create-header>div>small{font-size:.65rem}.emergency-create-header p{font-size:.76rem;line-height:1.45}.emergency-active-alert strong{font-size:.76rem}.emergency-active-alert small{font-size:.68rem}.emergency-active-alert .btn{font-size:.7rem}.emergency-location-card small,.emergency-gps-card small{font-size:.62rem}.emergency-location-card strong,.emergency-gps-card strong{font-size:.8rem}.emergency-location-card p,.emergency-gps-card p{font-size:.68rem}.emergency-create-card .form-label{font-size:.78rem}.emergency-create-card .form-select,.emergency-create-card textarea.form-control{font-size:.8rem}.emergency-instruction strong{font-size:.76rem}.emergency-instruction small{font-size:.68rem}.emergency-page-hold-content strong{font-size:.9rem}.emergency-page-hold-content small{font-size:.68rem}.emergency-safety-note strong{font-size:.75rem}.emergency-safety-note small{font-size:.68rem}.emergency-detail-page small,.emergency-detail-page .small{font-size:.74rem}}

/* Public resident registration */
.public-registration-page{min-height:100vh;background:linear-gradient(145deg,#eaf4ed,#f9fcfa);color:#263c2d}.registration-shell{width:min(calc(100% - 1.5rem),760px);margin:1.25rem auto 3rem}.registration-hero{position:relative;overflow:hidden;padding:1.5rem;border-radius:24px;background:linear-gradient(145deg,#245f38,#4c9562);color:#fff;box-shadow:0 18px 42px rgba(34,99,56,.2)}.registration-hero:after{content:"";position:absolute;right:-70px;bottom:-90px;width:230px;height:230px;border:35px solid rgba(255,255,255,.08);border-radius:50%}.brand-row{position:relative;z-index:1;display:flex;align-items:center;gap:1rem}.brand-logo{display:grid;width:58px;height:58px;place-items:center;border-radius:17px;background:#fff;color:#277044;font-size:1.5rem}.brand-logo img{width:46px;height:46px;object-fit:contain}.registration-card{margin-top:1rem;padding:1.25rem;border:1px solid #dce9df;border-radius:20px;background:#fff;box-shadow:0 12px 32px rgba(42,82,54,.08)}.step-note{display:flex;gap:.75rem;padding:.8rem;border-radius:13px;background:#edf7f0;font-size:.82rem}.registration-card .form-label{font-size:.82rem;font-weight:700}.registration-card .form-control,.registration-card .form-select{min-height:46px;border-color:#d8e4dc;border-radius:11px}.btn-submit{min-height:48px;border-radius:12px;background:#287445;color:#fff;font-weight:750}.btn-submit:hover{background:#205f38;color:#fff}.help-row{display:flex;justify-content:center;gap:.5rem;flex-wrap:wrap;margin-top:1rem}@media(max-width:575px){.registration-shell{margin-top:.6rem}.registration-hero{padding:1.15rem;border-radius:20px}.registration-card{padding:1rem}.brand-logo{width:50px;height:50px}}
.announcement-existing-media{display:grid;grid-template-columns:repeat(auto-fill,minmax(110px,1fr));gap:.65rem}.announcement-existing-item{position:relative;min-height:90px;border:1px solid #dce7df;border-radius:12px;overflow:hidden;background:#f4f8f5;display:flex;align-items:center;justify-content:center;cursor:pointer}.announcement-existing-item img{width:100%;height:90px;object-fit:cover}.announcement-existing-item>span{display:flex;gap:.4rem;align-items:center;color:#276b40;font-weight:700}.announcement-existing-item input{position:absolute;top:.45rem;right:.45rem}.announcement-existing-item small{position:absolute;bottom:0;left:0;right:0;padding:.25rem;background:rgba(20,35,25,.78);color:#fff;text-align:center}.announcement-documentation,.announcement-attachments{border-radius:18px;overflow:hidden}.announcement-section-heading{display:flex;align-items:center;gap:.75rem;padding:1rem;border-bottom:1px solid #e6eee8}.announcement-section-heading>span{width:40px;height:40px;border-radius:12px;background:#e6f3e9;color:#26703d;display:grid;place-items:center}.announcement-section-heading>div{display:flex;flex-direction:column;flex:1}.announcement-section-heading small{font-size:.66rem;letter-spacing:.1em;color:#728077}.announcement-section-heading strong{color:#203b2a}.announcement-section-heading>b{font-size:.72rem;color:#26703d;background:#e8f4eb;padding:.3rem .55rem;border-radius:999px}.announcement-gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:.45rem;padding:.75rem}.announcement-gallery-item{position:relative;border:0;padding:0;border-radius:12px;overflow:hidden;background:#eef4ef;aspect-ratio:4/3}.announcement-gallery-item.is-featured{grid-column:span 2;grid-row:span 2}.announcement-gallery-item img{width:100%;height:100%;object-fit:cover;transition:transform .2s}.announcement-gallery-item:hover img{transform:scale(1.03)}.announcement-gallery-item>span{position:absolute;inset:0;display:grid;place-items:center;background:rgba(8,24,14,.18);color:#fff;opacity:0;transition:opacity .2s}.announcement-gallery-item:hover>span{opacity:1}.announcement-videos{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:.75rem;padding:.75rem}.announcement-videos .ratio{border-radius:12px;overflow:hidden;background:#111}.announcement-lightbox-image{max-height:72vh;object-fit:contain}.announcement-attachment-row{display:flex;align-items:center;gap:.75rem;padding:.85rem 1rem}.announcement-attachment-row>span:first-child{width:38px;height:38px;border-radius:10px;background:#eef5f0;color:#26703d;display:grid;place-items:center}.announcement-attachment-row strong,.announcement-attachment-row small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.announcement-attachment-row small{color:#77827b;font-size:.72rem;margin-top:.15rem}@media(max-width:575.98px){.announcement-gallery{grid-template-columns:repeat(2,1fr)}.announcement-gallery-item.is-featured{grid-column:span 2;grid-row:span 1;aspect-ratio:16/9}.announcement-videos{grid-template-columns:1fr}.announcement-section-heading{padding:.85rem}}
.security-ops-tabs{display:grid;grid-template-columns:repeat(auto-fit,minmax(85px,1fr));gap:.4rem;background:#fff;border:1px solid #dce7df;border-radius:16px;padding:.4rem}.security-ops-tabs .nav-link{display:flex;flex-direction:column;align-items:center;gap:.3rem;border-radius:12px;color:#5c6b61;font-size:.72rem;font-weight:700}.security-ops-tabs .nav-link.active{background:#338552;color:#fff}.security-simple-actions{display:grid;grid-template-columns:repeat(2,1fr);gap:.75rem}.security-simple-actions>a,.security-simple-actions>button{min-height:125px;border:1px solid #dce7df;border-radius:18px;background:#fff;color:#244b31;text-decoration:none;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.35rem}.security-simple-actions i{font-size:1.8rem;color:#338552}.security-simple-actions strong{font-size:1rem}.security-simple-actions small{color:#748078}.security-shift-card{border:1px solid #dce7df;border-radius:16px;background:#fff;padding:1rem}.security-shift-card>div:first-child{display:flex;gap:.6rem;align-items:center}.security-shift-card>div:first-child small{margin-left:auto;color:#6c786f}.security-assignment-list{display:grid;gap:.4rem;margin-top:.75rem}.security-assignment-list span{display:grid;grid-template-columns:24px 1fr auto;align-items:center;padding:.5rem;background:#f5f9f6;border-radius:10px}.security-assignment-list small{color:#6e7a72}.security-calendar-list{display:grid;gap:.5rem}.security-calendar-list>article{display:flex;align-items:center;gap:.65rem;flex-wrap:wrap;padding:.65rem;border:1px solid #dce7df;border-radius:14px;background:#fff}.security-calendar-list time{width:42px;text-align:center;font-weight:800}.security-calendar-list time small{display:block;font-size:.6rem;color:#78837c}.security-calendar-list article>div:nth-child(2){display:flex;flex-direction:column;flex:1}.security-calendar-list article>div:nth-child(2) small{color:#778279}.security-shift-code{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;font-weight:800}.security-shift-code.is-p{background:#c8e9f8;color:#17617f}.security-shift-code.is-m{background:#caebd1;color:#216936}.security-shift-code.is-o{background:#e4e6e5;color:#626a65}@media(min-width:768px){.security-simple-actions{grid-template-columns:repeat(4,1fr)}}
@media(max-width:575.98px){.security-operations-page .security-ops-tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));overflow:visible;gap:.4rem}.security-operations-page.is-staff .security-ops-tabs{grid-template-columns:repeat(2,minmax(0,1fr))}.security-operations-page .security-ops-tabs .nav-link{min-width:0;width:100%;min-height:64px;white-space:normal;text-align:center}.security-operations-page .security-simple-actions>a,.security-operations-page .security-simple-actions>button{min-height:112px;padding:.8rem .4rem .45rem;grid-template-rows:40px auto auto;align-content:center;gap:.22rem}.security-operations-page .security-simple-actions strong{height:auto;line-height:1.2}.security-operations-page .security-simple-actions small{height:auto;min-height:26px;align-items:center;line-height:1.25}}

/* Security shift journal */
.journal-month-filter{display:grid;grid-template-columns:auto minmax(190px,320px);align-items:center;justify-content:space-between;gap:.75rem}.security-journal-list{display:grid;gap:.6rem}.security-journal-row{display:grid;grid-template-columns:52px minmax(0,1fr) auto;align-items:center;gap:.75rem;padding:.75rem}.security-journal-date{width:52px;height:52px;display:grid;place-content:center;text-align:center;border-radius:14px;background:#e9f5ec;color:#24703c}.security-journal-date strong{font-size:1.15rem;line-height:1}.security-journal-date small{margin-top:.2rem;font-size:.58rem;font-weight:800}.security-journal-main{min-width:0}.security-journal-main>strong,.security-journal-main>small{display:block}.security-journal-main>strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.88rem}.security-journal-main>small{margin:.18rem 0 .35rem;color:#748078;font-size:.68rem}.security-journal-main .badge{font-size:.6rem}.journal-progress{display:grid;grid-template-columns:1fr auto 1fr auto 1fr;align-items:center;gap:.4rem;padding:.7rem;border:1px solid #dce7df;border-radius:15px;background:#fff}.journal-progress>span{display:flex;flex-direction:column;align-items:center;gap:.2rem;color:#98a29b}.journal-progress>span i{width:32px;height:32px;display:grid;place-items:center;border-radius:50%;background:#edf1ee}.journal-progress>span small{font-size:.61rem;font-weight:700}.journal-progress>span.is-done{color:#287846}.journal-progress>span.is-done i{background:#e0f1e5}.journal-progress>i{font-size:.55rem;color:#b3bcb6}.journal-activity-list>div{display:grid;grid-template-columns:48px minmax(0,1fr) auto;gap:.65rem;padding:.7rem 0;border-top:1px solid #edf1ee}.journal-activity-list time{font-weight:800;color:#287846}.journal-activity-list p{margin:.15rem 0;font-size:.78rem;line-height:1.4}.journal-activity-list small{color:#758078;font-size:.66rem}.journal-readonly-sections{display:grid;gap:.55rem}.journal-readonly-sections>div{padding:.7rem;border-radius:12px;background:#f6f9f7}.journal-readonly-sections small{display:block;color:#6f7a72;font-size:.65rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em}.journal-readonly-sections p{margin:.25rem 0 0;font-size:.8rem}.journal-signatory-list>div{display:flex;align-items:center;gap:.65rem;padding:.6rem 0;border-top:1px solid #edf1ee}.journal-signatory-list .transaction-main{flex:1;min-width:0}.journal-signatory-list .transaction-main strong,.journal-signatory-list .transaction-main small{display:block}.journal-signatory-list .transaction-main strong{font-size:.8rem}.journal-signatory-list .transaction-main small{font-size:.63rem;color:#748078}.journal-document-actions{display:flex;align-items:center;justify-content:flex-end;gap:.5rem}.journal-document-actions>.portal-share-group{margin:0}
@media(max-width:575.98px){.journal-month-filter{grid-template-columns:1fr}.security-journal-row{grid-template-columns:44px minmax(0,1fr) auto;padding:.65rem}.security-journal-date{width:44px;height:44px;border-radius:12px}.security-journal-main>strong{font-size:.79rem}.journal-activity-list>div{grid-template-columns:40px minmax(0,1fr);gap:.5rem}.journal-activity-list>div>a{grid-column:2;justify-self:start}.journal-signatory-list>div{gap:.45rem}.journal-signatory-list .transaction-leading{width:34px;height:34px;flex:0 0 34px}.journal-signatory-list .btn{font-size:.65rem;padding:.35rem .5rem}}
.journal-hero-icon{display:grid;place-items:center;flex:0 0 38px;width:38px;height:38px;border-radius:10px;background:rgba(255,255,255,.16);color:#fff}
.journal-empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;min-height:200px;padding:2rem 1rem;color:#52665a}
.journal-empty-state>span{display:grid;place-items:center;width:52px;height:52px;margin-bottom:.8rem;border-radius:15px;background:#e9f5ec;color:#26824b;font-size:1.3rem}
.journal-empty-state strong{color:#24422e;font-size:.95rem}.journal-empty-state p{max-width:320px;margin:.35rem 0 0;font-size:.76rem;line-height:1.5}
.security-journal-row{border-color:#e2eae4!important;box-shadow:0 2px 8px rgba(27,74,43,.04)}
.security-journal-row .btn{white-space:nowrap}
.loan-policy-toggle:hover{background:#f5faf7}.loan-policy-toggle[aria-expanded="true"]>i{transform:rotate(180deg)}

/* Information center: formal document-library presentation. */
.information-center-page{--information-border:#dbe5de;--information-ink:#263b2d;--information-muted:#728078}.information-center-hero h1{font-size:1.35rem}.information-center-eyebrow{display:block;margin-bottom:.3rem;color:rgba(255,255,255,.68);font-size:.58rem;font-weight:800;letter-spacing:.12em}.information-center-tabs .property-tabs{max-width:520px;margin-inline:auto}.information-collection-nav{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.65rem}.information-collection-item{position:relative;min-width:0;display:grid;grid-template-columns:44px minmax(0,1fr) auto;align-items:center;gap:.7rem;padding:.8rem;border:1px solid var(--information-border);border-radius:12px;background:#fff;color:var(--information-ink);text-decoration:none;box-shadow:0 4px 14px rgba(31,65,41,.045);transition:border-color .18s ease,box-shadow .18s ease,transform .18s ease}.information-collection-item:hover,.information-collection-item.is-active{border-color:#80b28e;box-shadow:0 7px 20px rgba(31,91,50,.09);transform:translateY(-1px)}.information-collection-item.is-active::after{content:"";position:absolute;left:12px;right:12px;bottom:-1px;height:3px;border-radius:3px 3px 0 0;background:#2e7d49}.information-collection-icon,.information-document-icon{display:grid;place-items:center;flex:0 0 auto;border-radius:10px}.information-collection-icon{width:44px;height:44px;font-size:1rem}.information-collection-icon.is-guide,.information-document-icon.is-guide{background:#e7f3ea;color:#287347}.information-collection-icon.is-official,.information-document-icon.is-official{background:#e8eef8;color:#315f99}.information-collection-icon.is-faq,.information-document-icon.is-faq{background:#fff2d9;color:#9a6818}.information-collection-copy{min-width:0}.information-collection-copy strong,.information-collection-copy small{display:block}.information-collection-copy strong{overflow:hidden;color:#2b4032;font-size:.78rem;text-overflow:ellipsis;white-space:nowrap}.information-collection-copy small{margin-top:.16rem;overflow:hidden;color:#7a867e;font-size:.58rem;text-overflow:ellipsis;white-space:nowrap}.information-collection-count{min-width:27px;padding:.2rem .38rem;border-radius:99px;background:#f0f4f1;color:#4e6254;font-size:.64rem;font-weight:800;text-align:center}.information-filter-panel{padding:.8rem;border:1px solid var(--information-border);border-radius:12px;background:#fff;box-shadow:0 4px 14px rgba(31,65,41,.04)}.information-filter-heading{display:flex;align-items:center;gap:.55rem;margin-bottom:.65rem;padding-bottom:.6rem;border-bottom:1px solid #e8eeea}.information-filter-heading>span{width:32px;height:32px;display:grid;place-items:center;border-radius:8px;background:#edf5ef;color:#2c7747}.information-filter-heading strong,.information-filter-heading small{display:block}.information-filter-heading strong{color:#2c4033;font-size:.72rem}.information-filter-heading small{color:#7c8880;font-size:.56rem}.information-filter-form{display:grid;grid-template-columns:minmax(180px,1fr) minmax(145px,.28fr) auto;gap:.5rem}.information-filter-form:has(select[name="status"]){grid-template-columns:minmax(180px,1fr) minmax(130px,.24fr) minmax(120px,.2fr) auto}.information-filter-form .form-control,.information-filter-form .form-select,.information-filter-form .input-group-text{min-height:36px;border-color:#d9e3dc;font-size:.7rem}.information-filter-form .btn{min-width:92px;font-size:.68rem;font-weight:700}.information-list-heading{display:flex;align-items:end;justify-content:space-between;gap:.75rem;margin:.9rem .15rem .45rem}.information-list-heading small{display:block;margin-bottom:.12rem;color:#388056;font-size:.54rem;font-weight:800;letter-spacing:.12em}.information-list-heading h2{margin:0;color:#293d30;font-size:.9rem;font-weight:800}.information-list-heading>span{color:#77837b;font-size:.62rem}.information-document-list{overflow:hidden;border:1px solid var(--information-border);border-radius:13px;background:#fff;box-shadow:0 5px 18px rgba(31,65,41,.045)}.information-document-row{display:grid;grid-template-columns:48px minmax(0,1fr) auto;align-items:center;gap:.8rem;min-height:96px;padding:.8rem .9rem;border-bottom:1px solid #e8eeea;color:inherit;text-decoration:none;transition:background .16s ease}.information-document-row:last-child{border-bottom:0}.information-document-row:hover{background:#f8fbf9}.information-document-icon{width:48px;height:56px;border-radius:8px 8px 11px 11px;font-size:1.05rem;box-shadow:inset 0 0 0 1px rgba(50,75,58,.06)}.information-document-main{min-width:0}.information-document-main>strong,.information-document-main>small{display:block}.information-document-kicker{display:flex;align-items:center;gap:.3rem;margin-bottom:.22rem;color:#587063;font-size:.55rem;font-weight:800;letter-spacing:.035em;text-transform:uppercase}.information-document-kicker b{color:#a0aaa3}.information-document-kicker>i{margin-left:.1rem;color:#36794f}.information-document-kicker em{padding:.13rem .3rem;border-radius:4px;background:#b93f4b;color:#fff;font-size:.48rem;font-style:normal;letter-spacing:.05em}.information-document-main>strong{overflow:hidden;color:#23372a;font-size:.82rem;line-height:1.35;text-overflow:ellipsis;white-space:nowrap}.information-document-main>small{margin-top:.2rem;overflow:hidden;color:#748078;font-size:.66rem;line-height:1.4;text-overflow:ellipsis;white-space:nowrap}.information-document-facts{display:flex;align-items:center;gap:.8rem;margin-top:.42rem;color:#7b867f;font-size:.56rem}.information-document-facts>span{display:inline-flex;align-items:center;gap:.25rem;min-width:0}.information-document-facts i{color:#4d795d}.information-document-state{display:flex;align-items:center;gap:.65rem;color:#89938d;font-size:.62rem}.information-document-state>span{display:inline-flex;align-items:center;gap:.28rem;padding:.28rem .45rem;border-radius:99px;font-weight:700}.information-document-state>.is-reference{background:#eef4f0;color:#4b6f58}.information-document-state>.is-read{background:#e4f2e8;color:#277044}.information-document-state>.is-required{background:#fff0d3;color:#8b5c11}.information-document-state>.fa-chevron-right{font-size:.58rem}.information-empty{min-height:210px;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:1.5rem;text-align:center}.information-empty>span{width:54px;height:54px;display:grid;place-items:center;margin-bottom:.65rem;border-radius:14px;background:#edf4ef;color:#37794e;font-size:1.25rem}.information-empty strong{color:#33463a;font-size:.82rem}.information-empty small{margin-top:.2rem;color:#7d8881;font-size:.64rem}
@media(max-width:767.98px){.information-filter-form,.information-filter-form:has(select[name="status"]){grid-template-columns:minmax(0,1fr) auto}.information-search-input{grid-column:1/-1}.information-filter-form select{min-width:0}.information-filter-form:has(select[name="status"]) .btn{grid-column:1/-1}.information-document-facts{gap:.55rem}.information-document-facts>span:last-child{display:none}}
@media(max-width:575.98px){.information-center-hero h1{font-size:1.12rem}.information-center-hero .btn span{display:none}.information-center-hero .btn{width:38px;height:38px;padding:0;display:grid;place-items:center}.information-center-hero .btn i{margin:0!important}.information-collection-nav{gap:.4rem}.information-collection-item{grid-template-columns:36px minmax(0,1fr);gap:.45rem;min-height:66px;padding:.55rem}.information-collection-icon{width:36px;height:36px;font-size:.84rem}.information-collection-copy strong{font-size:.65rem;line-height:1.15;white-space:normal}.information-collection-copy small{display:none}.information-collection-count{position:absolute;top:.3rem;right:.35rem;min-width:20px;padding:.1rem .25rem;font-size:.52rem}.information-filter-panel{padding:.65rem}.information-filter-heading{margin-bottom:.55rem}.information-filter-form,.information-filter-form:has(select[name="status"]){grid-template-columns:minmax(0,1fr) auto}.information-filter-form:has(select[name="status"]) select{grid-column:auto}.information-filter-form:has(select[name="status"]) .btn{grid-column:1/-1}.information-document-row{grid-template-columns:40px minmax(0,1fr) 10px;gap:.6rem;min-height:104px;padding:.72rem}.information-document-icon{width:40px;height:48px;font-size:.92rem}.information-document-main>strong{font-size:.76rem;white-space:normal}.information-document-main>small{display:-webkit-box;font-size:.61rem;white-space:normal;-webkit-box-orient:vertical;-webkit-line-clamp:2}.information-document-facts{overflow:hidden;gap:.45rem;white-space:nowrap}.information-document-facts>span:first-child{max-width:105px;overflow:hidden;text-overflow:ellipsis}.information-document-state>span{display:none}.information-document-state{gap:0}.information-list-heading h2{font-size:.82rem}}
.information-image-trigger {
    display: block;
    width: 100%;
    padding: 0;
    border: 0;
    background: transparent;
    cursor: zoom-in;
}
.announcement-detail-body a[aria-controls="informationImageModal"] { cursor: zoom-in; }
.information-image-trigger:focus-visible { outline: 3px solid #198754; outline-offset: 4px; }
.information-image-modal .modal-header { flex-shrink: 0; gap: 12px; }
.information-image-modal .modal-body { padding: 12px; overscroll-behavior: contain; }
.information-image-modal .modal-body img { display: block; width: 100%; height: auto; margin: 0 auto; }
.information-image-modal .modal-content { max-height: calc(100dvh - 24px); }

/* Resident billing and payment lists */
.billing-ledger-header-nav{display:flex;align-items:center;justify-content:space-between;gap:.75rem;min-height:24px;position:relative;z-index:2}
.billing-ledger-header-nav .header-back-link{min-height:24px;line-height:1.2;white-space:nowrap}
.billing-ledger-header-action .fa-arrow-right{font-size:.7rem}
.billing-ledger-toolbar{display:flex;align-items:end;justify-content:space-between;gap:1rem}
.billing-ledger-toolbar>div:first-child strong,.billing-ledger-toolbar>div:first-child small{display:block}
.billing-ledger-toolbar>div:first-child strong{color:#183e2b;font-size:.93rem}
.billing-ledger-toolbar>div:first-child small{color:#73867a;font-size:.7rem}
.billing-ledger-filter{display:flex;align-items:end;gap:.45rem}
.billing-ledger-filter label{align-self:center;color:#587163;font-size:.73rem;font-weight:600}
.billing-ledger-filter select{width:auto;min-width:155px;min-height:34px;border-color:#cedfd3;font-size:.76rem}
.billing-ledger-filter .btn{min-height:34px;font-size:.75rem}
.billing-ledger-list{display:grid;gap:.55rem}
.billing-ledger-card{grid-template-columns:44px minmax(0,1fr) auto 24px;gap:.65rem;min-height:68px;padding:.7rem;border-left:3px solid #a8cfb3;transition:background .15s,border-color .15s}
.billing-ledger-card,.billing-ledger-card:hover,.billing-ledger-card:focus,.billing-ledger-card:active{text-decoration:none!important}
.billing-ledger-card:hover,.billing-ledger-card:focus-visible{border-color:#83bd96;background:#f1f9f3;color:inherit}
.billing-ledger-card:focus-visible{outline:2px solid #198754;outline-offset:2px}
.billing-ledger-card.tone-success{border-left-color:#198754}.billing-ledger-card.tone-warning{border-left-color:#d39525}.billing-ledger-card.tone-danger{border-left-color:#dc3545}.billing-ledger-card.tone-secondary{border-left-color:#96a29a}
.billing-ledger-main{min-width:0}.billing-ledger-main strong,.billing-ledger-main small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.billing-ledger-main strong{color:#193e2b;font-size:.82rem;line-height:1.25}.billing-ledger-main small{margin-top:.11rem;color:#66796d;font-size:.66rem;line-height:1.2}
.billing-ledger-amount{text-align:right;white-space:nowrap}.billing-ledger-amount strong{display:block;color:#173e2a;font-size:.86rem;line-height:1.3}.billing-ledger-status{display:block;margin-top:.2rem;color:#137544;font-size:.66rem;font-weight:700;line-height:1.25}.billing-ledger-status i{margin-right:.22rem}.tone-danger .billing-ledger-status{color:#b3313e}.tone-warning .billing-ledger-status{color:#885c11}.tone-secondary .billing-ledger-status{color:#5d6c62}
.billing-ledger-empty{display:flex;align-items:center;flex-direction:column;justify-content:center;min-height:170px;padding:1.5rem;border:1px dashed #cbded0;border-radius:12px;background:#f8fbf9;text-align:center}.billing-ledger-empty>span{display:grid;place-items:center;width:48px;height:48px;margin-bottom:.6rem;border-radius:13px;background:#e4f2e8;color:#198754;font-size:1.2rem}.billing-ledger-empty strong{color:#325441;font-size:.85rem}.billing-ledger-empty small{margin-top:.2rem;color:#718579;font-size:.73rem}
@media(max-width:575.98px){.billing-ledger-toolbar{align-items:stretch;flex-direction:column;gap:.5rem}.billing-ledger-filter{width:100%}.billing-ledger-filter label{display:none}.billing-ledger-filter select{flex:1;min-width:0}.billing-ledger-card{grid-template-columns:40px minmax(0,1fr) auto 18px;gap:.4rem;min-height:68px;padding:.58rem}.billing-ledger-card>span:first-child{width:40px;height:40px;font-size:.95rem}.billing-ledger-card>i:last-child{width:18px;height:18px}.billing-ledger-main strong{font-size:.74rem}.billing-ledger-main small{font-size:.61rem}.billing-ledger-amount strong{font-size:.76rem}.billing-ledger-status{font-size:.58rem}}