:root{font-family:Inter,Segoe UI,Arial,sans-serif;background:#f4f7fb;color:#182230}*{box-sizing:border-box}body{margin:0;display:flex}aside{width:245px;min-height:100vh;background:#10253f;color:#fff;padding:24px 16px;position:fixed}.brand{padding:8px 12px 24px;border-bottom:1px solid #29415d;margin-bottom:18px}.brand b{display:block;font-size:18px;letter-spacing:1px}.brand span{font-size:11px;color:#a9bfd7}nav a,.sidebottom a{display:block;color:#dce8f5;text-decoration:none;padding:12px 14px;border-radius:9px;margin:4px 0}nav a:hover,.sidebottom a:hover{background:#1c3858}.sidebottom{position:absolute;bottom:20px;left:16px;right:16px}main{margin-left:245px;width:calc(100% - 245px);padding:28px 34px}header{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px}h1{margin:0;font-size:26px}header p{margin:5px 0;color:#6a7787}.badge{background:#e8f0fa;color:#1d4d7c;padding:9px 14px;border-radius:20px;font-weight:600}.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:18px}.cards.small{grid-template-columns:repeat(3,1fr)}.cards div,.panel{background:white;border-radius:14px;padding:20px;box-shadow:0 4px 18px #18334d0b}.cards span{display:block;color:#718096;font-size:13px}.cards strong{display:block;margin-top:10px;font-size:23px}.grid{display:grid;grid-template-columns:1.5fr 1fr;gap:18px}.panel{overflow:auto}.panel h2{font-size:17px;margin:0 0 15px}.toolbar{display:flex;gap:10px;align-items:end;margin-bottom:18px}.toolbar label,.form label{display:flex;flex-direction:column;gap:6px;font-size:13px;color:#64748b}.form{display:grid;gap:12px}.form input,.form select,.form textarea,.toolbar input{padding:10px;border:1px solid #d5dde8;border-radius:8px;font:inherit;background:white}.form textarea{min-height:70px}button{background:#1769aa;color:#fff;border:0;border-radius:8px;padding:11px 16px;font-weight:600;cursor:pointer}table{width:100%;border-collapse:collapse;font-size:13px}th,td{padding:10px;border-bottom:1px solid #edf1f5;text-align:left;white-space:nowrap}th{color:#64748b;background:#f8fafc}.quick{display:grid;gap:10px}.quick a{padding:14px;background:#f3f7fb;border-radius:9px;text-decoration:none;color:#174a72}.flash{padding:12px 16px;border-radius:9px;margin-bottom:15px}.flash.success{background:#e9f8ef;color:#176b3a}.flash.error{background:#ffecec;color:#9b2020}.narrow{max-width:650px}@media(max-width:900px){aside{width:190px}main{margin-left:190px;width:calc(100% - 190px);padding:20px}.cards{grid-template-columns:repeat(2,1fr)}.grid{grid-template-columns:1fr}}
fieldset{border:1px solid #ddd;border-radius:10px;padding:12px}legend{font-weight:700}.hint{color:#667085;font-size:14px}.cards small{display:block;margin-top:6px;color:#667085}.form label{display:block}.form input,.form select,.form textarea{width:100%;box-sizing:border-box}.panel.narrow{max-width:720px}

/* Financial report - RT format */
.finance-report { overflow-x:auto; }
.report-title { text-align:center; margin-bottom:18px; }
.report-title h2 { margin:0 0 8px; font-size:20px; }
.finance-table { width:100%; border-collapse:collapse; min-width:760px; }
.finance-table th, .finance-table td { border:1px solid #cfd7e2; padding:7px 9px; vertical-align:middle; }
.finance-table th { background:#eef3f8; text-align:left; }
.finance-table th:nth-child(1), .finance-table td:nth-child(1) { text-align:center; }
.finance-table th:nth-child(3), .finance-table td:nth-child(3) { text-align:right; white-space:nowrap; }
.finance-table .section td { background:#f4f7fa; }
.finance-table .subtotal td { background:#fafafa; font-weight:600; }
.finance-table .grand-total td { background:#e9f3ea; font-weight:700; border-top:2px solid #657b68; }

/* Report adjustments - administrator only */
.report-adjustment-panel{margin-top:18px}.adjustment-form{display:grid;grid-template-columns:1.1fr 1.5fr .9fr 1.1fr 1.5fr auto;gap:10px;align-items:end}.adjustment-form label{display:flex;flex-direction:column;gap:5px;font-size:12px;color:#64748b}.adjustment-form input,.adjustment-form select{padding:9px;border:1px solid #d5dde8;border-radius:7px;font:inherit;background:#fff}.adjustment-form button{height:38px;white-space:nowrap}.adjust-row td{background:#fff8e8}.adjustment-list{margin-top:12px}.btn-danger{background:#b42318;padding:7px 10px;font-size:12px}@media(max-width:1100px){.adjustment-form{grid-template-columns:1fr 1fr 1fr}.adjustment-form button{grid-column:1/-1;width:max-content}}

/* Dashboard V1.7 - elegant finance dashboard */
.dashboard-shell{max-width:1500px;margin:0 auto}
.dashboard-hero{display:flex;justify-content:space-between;align-items:center;gap:28px;padding:28px 30px;margin-bottom:22px;border-radius:18px;background:linear-gradient(135deg,#102b49 0%,#174f78 58%,#1f6f9d 100%);color:#fff;box-shadow:0 12px 30px rgba(16,43,73,.16);position:relative;overflow:hidden}
.dashboard-hero:after{content:"";position:absolute;width:240px;height:240px;border-radius:50%;right:-70px;top:-120px;background:rgba(255,255,255,.07)}
.hero-copy{position:relative;z-index:1}.eyebrow{font-size:11px;letter-spacing:1.8px;font-weight:700;color:#b9d8ed;margin-bottom:8px}.hero-copy h2{margin:0;font-size:27px;letter-spacing:-.4px}.hero-copy p{margin:8px 0 0;color:#d8e8f4;max-width:680px;line-height:1.55;font-size:13px}
.period-card{position:relative;z-index:2;min-width:280px;padding:15px 16px;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.09);border-radius:13px;backdrop-filter:blur(8px)}
.period-card label{display:block;font-size:11px;font-weight:700;letter-spacing:.5px;color:#cfe2ef;margin-bottom:7px}.period-row{display:flex;gap:8px}.period-row input{width:150px;padding:10px 11px;border:0;border-radius:8px;background:#fff;color:#26384a;font:inherit}.period-row button{padding:10px 13px;background:#fff;color:#15557e;border-radius:8px}
.kpi-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:15px;margin-bottom:28px}.kpi-card{background:#fff;border:1px solid #e7edf3;border-radius:15px;padding:19px 20px;box-shadow:0 6px 20px rgba(31,52,73,.055);min-height:132px}.kpi-card.kpi-primary{background:linear-gradient(145deg,#f7fbff,#edf6fc);border-color:#d7e8f4}.kpi-card.kpi-expense{background:linear-gradient(145deg,#fff,#fff8f6)}.kpi-top{display:flex;align-items:center;gap:9px}.kpi-caption{font-size:10px;font-weight:800;letter-spacing:1.1px;color:#728196}.kpi-icon{display:inline-flex;width:29px;height:29px;align-items:center;justify-content:center;border-radius:8px;background:#eaf3fa;color:#17608b;font-size:13px;font-weight:800}.kpi-expense .kpi-icon{background:#fff0ed;color:#b64d39}.kpi-card strong{display:block;margin:14px 0 5px;font-size:22px;letter-spacing:-.3px;color:#162b40}.kpi-card small{color:#8190a1;font-size:11px}
.dashboard-section-head{display:flex;align-items:end;justify-content:space-between;margin:0 2px 12px}.dashboard-section-head h3,.panel-heading h3{margin:0;color:#1c2d3e;font-size:16px}.dashboard-section-head p,.panel-heading p{margin:4px 0 0;color:#7b8998;font-size:12px}.section-link,.panel-heading>a{font-size:12px;color:#1769aa;text-decoration:none;font-weight:700}.section-link:hover,.panel-heading>a:hover{color:#0d4c7d}
.occupancy-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:15px;margin-bottom:28px}.unit-card,.payment-summary-card{background:#fff;border:1px solid #e7edf3;border-radius:15px;padding:18px;box-shadow:0 6px 20px rgba(31,52,73,.045)}.unit-card{display:grid;grid-template-columns:48px 1fr auto auto;gap:12px;align-items:center}.unit-icon{width:44px;height:44px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:21px;font-weight:700}.house-icon{background:#edf7f1;color:#258153}.shop-icon{background:#f0f4ff;color:#4c68b3}.unit-main span{display:block;color:#728196;font-size:11px;font-weight:700}.unit-main strong{display:block;font-size:24px;color:#1d3043;line-height:1.1;margin:4px 0}.unit-main small{color:#8a97a5;font-size:10px}.unit-status{min-width:65px;padding-left:12px;border-left:1px solid #edf1f5}.unit-status b{display:block;color:#2b7a55;font-size:16px}.unit-status.warning b{color:#ba6b27}.unit-status span{display:block;color:#8a97a5;font-size:9px;margin-top:3px;white-space:nowrap}
.payment-summary-card{display:flex;flex-direction:column;justify-content:center}.summary-head{display:flex;gap:10px;align-items:center}.summary-icon{width:38px;height:38px;border-radius:11px;display:flex;align-items:center;justify-content:center;background:#eaf7f0;color:#278157;font-weight:800}.summary-head span:not(.summary-icon){display:block;font-size:12px;font-weight:700;color:#536477}.summary-head small{display:block;color:#98a3af;font-size:10px;margin-top:3px}.payment-summary-card>strong{font-size:28px;color:#1b3043;margin:11px 0 8px}.summary-bar{height:7px;border-radius:99px;background:#edf2f5;overflow:hidden}.summary-bar span{display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,#2a8a62,#53ae7e)}.payment-summary-card>small{margin-top:6px;color:#8996a4;font-size:10px}
.dashboard-content-grid{display:grid;grid-template-columns:1.55fr 1fr;gap:15px}.dashboard-panel{background:#fff;border:1px solid #e7edf3;border-radius:15px;box-shadow:0 6px 20px rgba(31,52,73,.045);overflow:hidden}.panel-heading{display:flex;align-items:center;justify-content:space-between;padding:18px 20px;border-bottom:1px solid #edf1f5}.table-wrap{overflow:auto}.dashboard-table{margin:0;border-collapse:collapse}.dashboard-table th{font-size:10px;letter-spacing:.5px;text-transform:uppercase;background:#fafbfd;color:#8794a3;border-bottom:1px solid #edf1f5;padding:11px 20px}.dashboard-table td{padding:12px 20px;border-bottom:1px solid #f0f3f6;color:#425466;font-size:12px}.dashboard-table tr:last-child td{border-bottom:0}.dashboard-table .amount{text-align:right;font-weight:700;color:#23384c}.date-chip{font-variant-numeric:tabular-nums;color:#6f7e8d}.trx-badge{display:inline-flex;padding:5px 8px;border-radius:20px;font-size:9px;font-weight:800}.trx-badge.income{background:#eaf7f0;color:#267951}.trx-badge.expense{background:#fff0ed;color:#ad4d3c}.empty-state{text-align:center!important;padding:34px 20px!important;color:#8895a3!important}.empty-state>*{display:block;margin:4px auto}.empty-icon{font-size:22px;color:#b0bac5}.empty-state b{color:#58697a;font-size:12px}.empty-state span{font-size:10px}
.quick-panel{padding-bottom:10px}.quick-actions{padding:10px 12px}.quick-action{display:flex;align-items:center;gap:12px;padding:13px 10px;border-bottom:1px solid #f0f3f6;text-decoration:none;color:#23384c;border-radius:9px;transition:.15s ease}.quick-action:last-child{border-bottom:0}.quick-action:hover{background:#f6f9fc;transform:translateX(2px)}.action-icon{width:37px;height:37px;flex:0 0 37px;border-radius:10px;background:#edf5fb;color:#17608b;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:800}.quick-action:nth-child(2) .action-icon{background:#edf8f2;color:#287b57}.quick-action:nth-child(3) .action-icon{background:#f4f0fb;color:#7557a3}.quick-action:nth-child(4) .action-icon{background:#fff5e8;color:#a56a24}.quick-action span:nth-child(2){flex:1}.quick-action b{display:block;font-size:12px}.quick-action small{display:block;color:#8996a4;font-size:10px;margin-top:3px}.quick-action em{font-style:normal;color:#a0acb8;font-size:15px}
@media(max-width:1200px){.kpi-grid{grid-template-columns:repeat(2,1fr)}.occupancy-grid{grid-template-columns:1fr 1fr}.payment-summary-card{grid-column:1/-1}.dashboard-content-grid{grid-template-columns:1fr}}
@media(max-width:760px){main{padding:18px}.dashboard-hero{flex-direction:column;align-items:stretch;padding:22px}.period-card{min-width:0}.period-row input{flex:1;width:auto}.kpi-grid,.occupancy-grid{grid-template-columns:1fr}.payment-summary-card{grid-column:auto}.unit-card{grid-template-columns:45px 1fr 65px 65px}.dashboard-section-head{align-items:flex-start;gap:10px}.dashboard-table th,.dashboard-table td{padding-left:12px;padding-right:12px}}

/* V1.8 login — full-bleed photograph with Stocktake-style centered glass panel */
body:has(.login-scene){margin:0;background:#0b1d2d}body:has(.login-scene) main{padding:0!important;min-height:100vh}.login-scene{min-height:100vh;position:relative;display:flex;align-items:center;justify-content:center;padding:36px 16px;background: url('/static/cipta_mandiri_gate.jpg') center center/cover no-repeat}.login-overlay{position:absolute;inset:0;background:linear-gradient(110deg,rgba(5,18,36,.83),rgba(9,25,42,.42) 62%,rgba(5,18,36,.72))}.login-glass{position:relative;z-index:1;width:min(100%,430px);padding:37px 38px;border:1px solid rgba(255,255,255,.27);border-radius:22px;background:rgba(12,28,48,.78);box-shadow:0 25px 90px rgba(0,0,0,.4);backdrop-filter:blur(17px);color:white}.login-emblem{width:57px;height:57px;display:grid;place-items:center;border-radius:15px;background:linear-gradient(140deg,#fbd567,#bd8b28);font-size:24px;font-weight:900;color:#172d46;margin-bottom:21px}.login-kicker{font-size:11px;font-weight:750;letter-spacing:2px;color:#f7d57d}.login-glass h1{color:white;font-size:31px;line-height:1.2;margin:8px 0}.login-intro{color:#d4deea;line-height:1.7;margin:0 0 27px}.login-form label{display:block;font-size:13px;color:#dce5ef;margin:16px 0 7px;font-weight:600}.login-form input{display:block;box-sizing:border-box;width:100%;height:47px;margin-top:8px;border:1px solid rgba(255,255,255,.27);background:rgba(255,255,255,.95);color:#162d47;border-radius:9px;padding:0 13px}.login-form button{margin-top:24px;width:100%;height:48px;border-radius:9px;background:linear-gradient(120deg,#f7d77d,#d8a945);color:#13263b;font-weight:800;border:0;cursor:pointer}.login-footer{text-align:center;color:#bccad8;font-size:11px;margin:25px 0 0}.login-photo-credit{position:absolute;bottom:19px;right:22px;color:#e6ebf1;font-size:10px;letter-spacing:1.5px;z-index:1}@media(max-width:600px){.login-glass{padding:27px 23px}.login-scene{background-position:center}}


/* V1.9 operational awareness */
.login-created{margin-top:18px;text-align:center;color:#9fb0c0;font-size:10px;letter-spacing:.5px}.login-created strong{color:#f1cf73;font-weight:700}
.entry-table .empty-long{color:#c62828;background:#fff5f5}.entry-table .empty-long strong{color:#c62828}.empty-warning{color:#c62828!important;font-weight:800!important}.a36-mark{display:inline-block;margin-left:4px;padding:2px 5px;border-radius:5px;background:#fff1d6;color:#a15d00;font-size:9px;vertical-align:middle}.a36-warning{color:#a15d00!important;font-weight:800!important}.rt-mark{display:inline-block;margin-left:4px;padding:2px 5px;border-radius:5px;background:#eaf3ff;color:#155b91;font-size:9px;vertical-align:middle}.rt-warning{color:#155b91!important;font-weight:800!important}.entry-alert{margin:10px 0 0;padding:9px 11px;background:#fff8e8;border:1px solid #f3d28a;border-radius:7px;color:#795300}.long-empty-row td{color:#c62828!important;background:#fff7f7}.long-empty-row td:first-child{font-weight:700}.long-empty-row .status.empty{color:#c62828}.report-live{display:inline-block;margin-top:6px;padding:4px 9px;border-radius:999px;background:#eaf7f0;color:#197044;font-size:10px;font-weight:800;letter-spacing:.5px}.report-live::first-letter{color:#16803c}


/* =========================================================
   MOBILE RESPONSIVE PATCH
   Cipta Mandiri Finance System
   ========================================================= */

.mobile-topbar {
    display: none;
}

.mobile-menu-overlay {
    display: none;
}

.sidebar-user {
    padding: 0 12px 14px;
    color: #a9bfd7;
    font-size: 12px;
}

/* Tablet */
@media (max-width: 900px) {
    aside {
        width: 210px;
    }

    main {
        margin-left: 210px;
        width: calc(100% - 210px);
        padding: 22px;
    }

    header {
        gap: 15px;
    }

    .badge {
        white-space: nowrap;
    }

    .toolbar {
        flex-wrap: wrap;
    }

    .toolbar label {
        flex: 1 1 180px;
    }
}

/* Mobile */
@media (max-width: 700px) {

    body {
        display: block;
        overflow-x: hidden;
    }

    body.menu-open {
        overflow: hidden;
    }

    /* Mobile top navigation */
    .mobile-topbar {
        display: flex;
        position: fixed;
        z-index: 1100;
        top: 0;
        left: 0;
        right: 0;
        height: 60px;
        align-items: center;
        gap: 12px;
        padding: 0 14px;
        background: #10253f;
        color: white;
        box-shadow: 0 2px 12px rgba(0,0,0,.15);
    }

    .mobile-menu-btn {
        width: 40px;
        height: 40px;
        padding: 0;
        border-radius: 9px;
        background: #1c3858;
        color: white;
        font-size: 22px;
        line-height: 40px;
    }

    .mobile-brand {
        flex: 1;
        line-height: 1.1;
    }

    .mobile-brand b {
        display: block;
        font-size: 14px;
        letter-spacing: .7px;
    }

    .mobile-brand span {
        display: block;
        margin-top: 3px;
        color: #a9bfd7;
        font-size: 9px;
        letter-spacing: .8px;
    }

    .mobile-logout {
        display: flex;
        width: 40px;
        height: 40px;
        align-items: center;
        justify-content: center;
        border-radius: 9px;
        background: #1c3858;
        color: white;
        text-decoration: none;
        font-size: 20px;
    }

    /* Sidebar becomes off-canvas menu */
    aside {
        position: fixed;
        z-index: 1200;
        top: 0;
        bottom: 0;
        left: 0;
        width: min(82vw, 300px);
        min-height: 100vh;
        padding: 20px 14px;
        overflow-y: auto;
        transform: translateX(-105%);
        transition: transform .22s ease;
        box-shadow: 8px 0 30px rgba(0,0,0,.22);
    }

    aside.mobile-open {
        transform: translateX(0);
    }

    .brand {
        padding: 8px 12px 20px;
        margin-bottom: 16px;
    }

    .brand b {
        font-size: 18px;
    }

    nav a,
    .sidebottom a {
        min-height: 46px;
        display: flex;
        align-items: center;
        padding: 11px 13px;
        margin: 4px 0;
        font-size: 14px;
    }

    .sidebottom {
        position: static;
        margin-top: 20px;
        padding-top: 14px;
        border-top: 1px solid #29415d;
    }

    .mobile-menu-overlay {
        position: fixed;
        z-index: 1150;
        inset: 0;
        background: rgba(5,18,32,.52);
        backdrop-filter: blur(2px);
    }

    .mobile-menu-overlay.show {
        display: block;
    }

    /* Main content */
    main,
    main[style] {
        width: 100% !important;
        margin-left: 0 !important;
        padding: 78px 13px 22px !important;
    }

    header {
        display: block;
        margin-bottom: 18px;
    }

    header h1 {
        font-size: 21px;
        line-height: 1.25;
    }

    header p {
        font-size: 12px;
        margin-top: 4px;
    }

    .badge {
        display: inline-block;
        margin-top: 9px;
        padding: 7px 11px;
        font-size: 11px;
    }

    /* General cards */
    .cards,
    .cards.small,
    .kpi-grid,
    .occupancy-grid {
        grid-template-columns: 1fr;
        gap: 11px;
    }

    .cards div,
    .panel {
        padding: 15px;
        border-radius: 12px;
    }

    .cards strong {
        font-size: 20px;
    }

    .grid,
    .dashboard-content-grid {
        grid-template-columns: 1fr;
        gap: 12px;
    }

    /* Forms */
    .form {
        gap: 11px;
    }

    .form input,
    .form select,
    .form textarea,
    .toolbar input,
    .toolbar select,
    button {
        min-height: 44px;
    }

    .toolbar {
        display: grid;
        grid-template-columns: 1fr;
        gap: 10px;
        align-items: stretch;
    }

    .toolbar label {
        width: 100%;
    }

    button {
        width: 100%;
    }

    /* Tables: retain horizontal scrolling instead of crushing columns */
    .panel {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    table {
        min-width: 620px;
    }

    .finance-report {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    .finance-table {
        min-width: 760px;
    }

    /* Dashboard */
    .dashboard-shell {
        width: 100%;
    }

    .dashboard-hero {
        padding: 19px;
        border-radius: 14px;
        gap: 17px;
        margin-bottom: 14px;
    }

    .hero-copy h2 {
        font-size: 21px;
    }

    .hero-copy p {
        font-size: 12px;
        line-height: 1.5;
    }

    .period-card {
        padding: 13px;
    }

    .period-row {
        display: flex;
    }

    .period-row input {
        min-width: 0;
    }

    .period-row button {
        width: auto;
        min-width: 80px;
    }

    .kpi-card {
        min-height: 110px;
        padding: 16px;
    }

    .kpi-card strong {
        font-size: 20px;
    }

    .unit-card {
        grid-template-columns: 44px 1fr;
        gap: 10px;
    }

    .unit-status {
        grid-column: 2;
        border-left: 0;
        border-top: 1px solid #edf1f5;
        padding: 8px 0 0;
    }

    .payment-summary-card {
        grid-column: auto;
    }

    .dashboard-section-head {
        display: block;
    }

    .section-link {
        display: inline-block;
        margin-top: 7px;
    }

    .dashboard-table {
        min-width: 620px;
    }

    /* Adjustment form */
    .adjustment-form {
        grid-template-columns: 1fr;
    }

    .adjustment-form button {
        grid-column: auto;
        width: 100%;
    }

    /* Login remains full screen */
    body:has(.login-scene) .mobile-topbar {
        display: none;
    }

    body:has(.login-scene) main {
        padding: 0 !important;
    }
}

/* Very small phones */
@media (max-width: 380px) {
    main,
    main[style] {
        padding-left: 10px !important;
        padding-right: 10px !important;
    }

    .dashboard-hero {
        padding: 16px;
    }

    .login-glass {
        padding: 24px 18px;
    }
}