*{box-sizing:border-box}body{margin:0;font-family:Inter,Segoe UI,Arial,sans-serif;background:#f5f3fb;color:#29233a}.top{height:72px;background:linear-gradient(110deg,#43208f,#7043cf);color:#fff;display:flex;align-items:center;justify-content:space-between;padding:0 28px}.brand{display:flex;gap:12px;align-items:center}.brand b{font-size:20px;display:block}.brand small{opacity:.8}.logo{font-size:32px}.topright{display:flex;gap:18px;align-items:center}.topright a{color:#fff;text-decoration:none;background:#ffffff20;padding:8px 12px;border-radius:8px}.layout{display:flex;min-height:calc(100vh - 112px)}aside{width:225px;background:#fff;padding:20px 12px;border-right:1px solid #e5e0f2}aside a{display:block;padding:12px 14px;color:#4d4560;text-decoration:none;border-radius:9px;margin-bottom:4px}aside a:hover{background:#eee7ff;color:#5525ad}main{flex:1;padding:28px;overflow:auto}.alert{padding:12px 16px;border-radius:10px;margin-bottom:18px;background:#e8f8ef}.alert.error{background:#fdeaea}.head{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.head h1{margin:0;font-size:25px}.btn{background:#6333c5;color:white;border:0;border-radius:8px;padding:10px 15px;text-decoration:none;display:inline-block;cursor:pointer}.btn.light{background:#eee9f9;color:#4f2b9d}.btn.danger{background:#d83b4d}.cards{display:grid;grid-template-columns:repeat(5,minmax(140px,1fr));gap:16px;margin-bottom:24px}.card{background:#fff;border-radius:12px;padding:18px;box-shadow:0 2px 10px #3e24690d;border:1px solid #ebe6f5}.stat strong{font-size:28px;display:block;margin-top:8px}.grid2{display:grid;grid-template-columns:1fr 1fr;gap:20px}.tablebox{background:#fff;border:1px solid #e7e1f3;border-radius:12px;overflow:auto}.table{width:100%;border-collapse:collapse}.table th,.table td{padding:11px 12px;border-bottom:1px solid #eee;text-align:left;font-size:13px;white-space:nowrap}.table th{background:#faf8fe;color:#5b4b77}.badge{padding:4px 8px;border-radius:20px;background:#eee7ff;color:#5525ad;font-size:12px}.form{background:#fff;border:1px solid #e7e1f3;border-radius:12px;padding:20px}.fields{display:grid;grid-template-columns:1fr 1fr;gap:14px}.field.full{grid-column:1/-1}.field label{display:block;font-size:13px;font-weight:700;margin-bottom:6px}.form label{font-weight:700}.field input,.field select,.field textarea{width:100%;padding:10px;border:1px solid #dcd5ea;border-radius:8px;background:#fff}.docs{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:10px}.doc{border:1px dashed #cfc3e5;border-radius:10px;padding:12px}.doc input{width:100%;margin-top:8px}.actions{display:flex;gap:8px}.search{padding:10px;border:1px solid #ddd4eb;border-radius:8px;width:260px}.login{min-height:100vh;display:grid;place-items:center;background:linear-gradient(120deg,#2d145f,#8a65d5)}.loginbox{width:390px;background:#ffffffee;border-radius:18px;padding:32px;box-shadow:0 20px 60px #180b333d}.loginbox h1{margin:0;color:#422080}.loginbox p{color:#746c80}.loginbox input{width:100%;padding:12px;margin:7px 0;border:1px solid #ddd3ea;border-radius:9px}.loginbox .btn{width:100%;margin-top:10px}.muted{color:#777;font-size:12px}@media(max-width:900px){aside{width:170px}.cards{grid-template-columns:repeat(2,1fr)}.grid2,.fields{grid-template-columns:1fr}.docs{grid-template-columns:1fr 1fr}}

/* V7 Dashboard - faithful layout based on supplied reference */
.dashboard-page{padding:4px 0 26px}
.dashboard-heading{display:flex;justify-content:space-between;align-items:flex-start;margin:0 0 22px}
.dashboard-heading h1{margin:0 0 4px;font-size:30px;line-height:1.15;color:#17145d;font-weight:750}
.dashboard-heading p{margin:0;color:#6d6b91;font-size:16px}
.dashboard-cards{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:22px;margin-bottom:24px}
.dashboard-card{min-height:132px;border-radius:10px;color:#fff;display:flex;align-items:center;padding:22px 23px;box-shadow:0 8px 24px rgba(36,21,91,.18), 0 2px 6px rgba(36,21,91,.10)}
.card-purple{background:linear-gradient(135deg,#8547e7,#7542db)}
.card-blue{background:linear-gradient(135deg,#347eea,#2e6edb)}
.card-green{background:linear-gradient(135deg,#22b67c,#20a971)}
.card-red{background:linear-gradient(135deg,#f0525a,#ee5a62)}
.card-orange{background:linear-gradient(135deg,#ff9c39,#ff9433)}
.metric-icon{width:48px;min-width:48px;font-size:43px;line-height:1;text-align:center;font-weight:500;margin-right:17px;color:#fff}
.metric-copy{display:flex;flex-direction:column;min-width:0}
.metric-copy span{font-size:17px;line-height:1.2;font-weight:600;margin-bottom:7px}
.metric-copy strong{font-size:37px;line-height:1;font-weight:750;margin-bottom:8px}
.metric-copy small{font-size:16px;line-height:1.1;font-weight:500}
.dashboard-stock-summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;margin:0 0 24px}
.dashboard-stock-box{min-height:126px;border-radius:11px;color:#fff;display:flex;align-items:center;padding:22px 25px;box-shadow:0 8px 24px rgba(36,21,91,.16),0 2px 6px rgba(36,21,91,.08)}
.stock-in-box{background:linear-gradient(135deg,#22b67c,#20a971)}
.stock-out-box{background:linear-gradient(135deg,#f0525a,#e94350)}
.stock-adjust-box{background:linear-gradient(135deg,#69778d,#56657b)}
.dashboard-stock-copy{display:flex;flex-direction:column}
.dashboard-stock-title{font-size:18px;line-height:1.2;font-weight:700;margin-bottom:8px}
.dashboard-stock-copy strong{font-size:38px;line-height:1;font-weight:800;margin-bottom:7px}
.dashboard-stock-copy small{font-size:14px;line-height:1.2;font-weight:500;opacity:.95}
.dashboard-panels{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
.dashboard-panel{background:#fff;border:1px solid #e9e7f1;border-radius:11px;box-shadow:0 2px 10px rgba(37,24,80,.06);overflow:hidden}
.maintenance-dashboard-panel{grid-column:1}
.panel-heading{display:flex;justify-content:space-between;align-items:center;padding:19px 20px 12px}
.panel-heading h2{margin:0;color:#18155f;font-size:19px;font-weight:750}
.panel-heading a{color:#6a3ad3;text-decoration:none;font-size:16px;font-weight:600}
.panel-heading a:hover{text-decoration:underline}
.dashboard-table-wrap{padding:0 14px 14px;overflow:auto}
.dashboard-table{width:100%;border-collapse:separate;border-spacing:0;min-width:560px}
.dashboard-table th{background:#edf2fa;color:#1b2c67;font-size:14px;font-weight:750;padding:11px 13px;text-align:left;border-top:1px solid #e0e5ef;border-bottom:1px solid #dfe4ee}
.dashboard-table th:first-child{border-top-left-radius:4px}.dashboard-table th:last-child{border-top-right-radius:4px}
.dashboard-table td{padding:11px 13px;border-bottom:1px solid #e9edf3;color:#3e4b73;font-size:14px;background:#fff;white-space:nowrap}
.dashboard-table tbody tr:last-child td{border-bottom:0}
.dashboard-table tbody tr:hover td{background:#faf9ff}
.status-pill{display:inline-block;padding:4px 10px;border-radius:5px;font-size:12px;font-weight:650}
.status-owner{background:#d9f5e7;color:#16824e}.status-tenant{background:#e8efff;color:#2971d1}
.empty-cell{text-align:center!important;color:#85839a!important;padding:26px!important}
@media(max-width:1200px){.dashboard-cards{grid-template-columns:repeat(3,1fr)}.dashboard-stock-summary{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.dashboard-panels{grid-template-columns:1fr}}
@media(max-width:760px){.dashboard-cards{grid-template-columns:1fr}.dashboard-stock-summary{grid-template-columns:1fr;gap:12px}.dashboard-stock-box{min-height:112px;padding:18px 20px}.dashboard-stock-title{font-size:16px}.dashboard-stock-copy strong{font-size:32px}.dashboard-stock-copy small{font-size:13px}.dashboard-card{min-height:112px}.dashboard-heading h1{font-size:25px}}


/* V8 Login - supplied property photo as full-screen background */
.login-page{min-height:100vh;margin:0;overflow:hidden}
.login-page .login{
  position:relative;min-height:100vh;width:100%;
  display:flex;align-items:center;justify-content:flex-end;
  padding:48px 7vw;
  background-image:linear-gradient(90deg,rgba(8,7,20,.05) 0%,rgba(8,7,20,.08) 48%,rgba(8,7,20,.30) 100%),url("login-background.jpeg");
  background-size:cover;background-position:center center;background-repeat:no-repeat;
}
.login-page .loginbox{
  position:relative;width:min(430px,92vw);padding:34px 38px 28px;
  border:1px solid rgba(255,255,255,.7);border-radius:18px;
  background:rgba(255,255,255,.40);
  box-shadow:0 24px 70px rgba(0,0,0,.30);
  backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px);
  text-align:center;z-index:2;
}
.login-logo{display:flex;justify-content:center;align-items:center;margin:0 0 8px;line-height:0}.login-logo img{display:block;width:112px;height:auto;max-height:78px;object-fit:contain}
.login-page .loginbox h1{font-size:30px;margin:0;color:#151b72;letter-spacing:-.4px}
.login-page .loginbox h2{font-size:20px;margin:5px 0 0;color:#171d63}
.login-tagline{font-size:16px!important;color:#151b72!important;font-weight:700!important;margin:13px 0 20px!important;text-shadow:0 1px 2px rgba(255,255,255,.55)}
.login-field{display:flex;align-items:center;background:#fff;border:1px solid #e0ddea;border-radius:9px;margin:10px 0;overflow:hidden;box-shadow:0 1px 5px rgba(30,20,70,.04)}
.login-field span{width:45px;color:#5430a5;font-size:21px}
.login-field input{flex:1!important;width:auto!important;margin:0!important;border:0!important;outline:0;padding:13px 12px!important;background:transparent!important}
.remember{display:flex;align-items:center;gap:7px;text-align:left;color:#22286d;font-size:14px;margin:13px 0 15px;cursor:pointer}
.remember input{width:18px;height:18px;margin:0}
.login-page .login-btn{width:100%;margin-top:0;padding:12px;border-radius:8px;background:linear-gradient(135deg,#6f40c5,#4e299e);font-size:15px}
.login-footer{border-top:1px solid #ddd8e4;margin-top:18px;padding-top:14px;color:#77788a;font-size:12px;line-height:1.45}
.login-quote{position:absolute;left:7vw;top:38%;transform:translateY(-50%);width:min(600px,48vw);color:#fff;text-align:left;font-size:30px;font-style:italic;line-height:1.4;text-shadow:0 2px 8px rgba(0,0,0,.8);z-index:1;pointer-events:none}
.login-quote span{display:block;width:90px;height:3px;background:#7d4ed0;border-radius:3px;margin:16px 0 0}
@media(max-width:900px){
 .login-page .login{justify-content:center;padding:24px;background-position:center}
 .login-page .loginbox{width:min(430px,94vw);padding:28px 24px}
 .login-quote{display:none}
}

/* V10 - Daftar Owner reference layout */
.owner-head{align-items:flex-end;margin-bottom:24px}.owner-head h1{font-size:30px;color:#17145d;font-weight:750;letter-spacing:-.3px}.owner-head p{font-size:17px;color:#6d6b91;margin:5px 0 0}.owner-tools{display:flex;align-items:center;gap:22px}
.owner-search{height:58px;width:400px;display:flex;align-items:center;background:#fff;border:1px solid #d9dce8;border-radius:9px;box-shadow:0 2px 8px rgba(40,32,80,.05);overflow:hidden}.owner-search span{font-size:30px;color:#31417a;width:52px;text-align:center}.owner-search input{border:0!important;outline:0!important;width:100%!important;height:100%!important;margin:0!important;padding:0 14px 0 0!important;font-size:17px!important;color:#3f4a70;background:transparent!important}.owner-search input::placeholder{color:#9298ad}
.owner-add{height:58px;display:flex;align-items:center;padding:0 27px;font-size:18px;font-weight:700;border-radius:7px;background:linear-gradient(135deg,#6531c7,#5422b1);box-shadow:0 5px 12px rgba(91,43,184,.17)}
.owner-tablebox{border-radius:11px;padding:12px 12px 0;background:#fff;border:1px solid #e5e7ef;box-shadow:0 2px 12px rgba(42,32,86,.06);overflow:hidden}.owner-table{border-collapse:separate;border-spacing:0;min-width:100%}
.owner-table th{background:#edf2fa;color:#192b68;font-size:17px;font-weight:750;padding:17px;border-top:1px solid #e1e5ef;border-bottom:1px solid #dfe4ed}.owner-table th:first-child{border-top-left-radius:5px}.owner-table th:last-child{border-top-right-radius:5px}
.owner-table td{height:58px;padding:13px 17px;border-bottom:1px solid #e7ebf2;color:#344374;font-size:16px;white-space:nowrap;background:#fff}.owner-table td b{font-weight:600;color:#344374}.owner-table tbody tr:last-child td{border-bottom:0}.owner-table tbody tr:hover td{background:#faf9ff}
.owner-table th:nth-child(1),.owner-table td:nth-child(1){width:70px}.owner-table th:nth-child(2){min-width:210px}.owner-table th:nth-child(3){min-width:105px}.owner-table th:nth-child(4){min-width:190px}.owner-table th:nth-child(5){min-width:220px}.owner-table th:nth-child(6){min-width:190px;text-align:center}.owner-table td:nth-child(6){text-align:center}.owner-table th:last-child,.owner-table td:last-child{text-align:center;min-width:190px}
.owner-actions{display:flex;justify-content:center;gap:12px}.icon-action{width:48px;height:42px;border-radius:8px;display:inline-flex;align-items:center;justify-content:center;text-decoration:none;font-size:22px;font-weight:700}.icon-action.view{background:#e9f2ff;color:#1680ea}.icon-action.edit{background:#edf1f8;color:#253d76}.icon-action.delete{background:#ffe7e9;color:#f22f38}
.owner-table-footer{display:flex;justify-content:space-between;align-items:center;padding:20px 5px 12px;color:#52608b;font-size:17px}.owner-pagination{display:flex;gap:6px;align-items:center}.owner-pagination a{min-width:42px;height:42px;padding:0 11px;border:1px solid #dbe1ed;background:#fff;border-radius:6px;color:#27376d;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;font-size:17px}.owner-pagination a.active{background:linear-gradient(135deg,#6934cc,#5420b4);border-color:#6330c7;color:#fff;font-weight:700}.owner-empty{text-align:center!important;color:#858ba0!important;padding:35px!important}
@media(max-width:1100px){.owner-tools{flex-direction:column;align-items:stretch}.owner-search{width:min(400px,100%)}.owner-head{align-items:flex-start}.owner-tablebox{overflow:auto}}

/* V14 Daftar Penyewa reference layout */
.tenant-status{display:inline-flex;align-items:center;justify-content:center;min-width:72px;padding:7px 13px;border-radius:7px;font-weight:700;border:1px solid transparent;line-height:1}.tenant-status.status-terisi{background:#dff7e9;color:#168a4e;border-color:#b8ebcf}.tenant-status.status-kosong{background:#eef1f6;color:#68738a;border-color:#d7dce6}
.owner-table th:nth-child(5),.owner-table td:nth-child(5){min-width:165px}
.owner-table th:nth-child(6),.owner-table td:nth-child(6){min-width:120px;text-align:center}
.owner-table th:nth-child(7),.owner-table td:nth-child(7){min-width:170px;text-align:center}
.owner-table th:nth-child(8),.owner-table td:nth-child(8){min-width:185px;text-align:center}

/* V15 - Compact Daftar Owner: seluruh tabel terlihat dalam satu layar */
.owner-head{margin-bottom:12px}
.owner-table-wrap{overflow-x:hidden}
.owner-table{
    width:100%;
    table-layout:fixed;
    font-size:13px;
}
.owner-table th,
.owner-table td{
    padding:9px 8px;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
}
.owner-table th:nth-child(1),.owner-table td:nth-child(1){width:5%}
.owner-table th:nth-child(2),.owner-table td:nth-child(2){width:19%}
.owner-table th:nth-child(3),.owner-table td:nth-child(3){width:9%}
.owner-table th:nth-child(4),.owner-table td:nth-child(4){width:17%}
.owner-table th:nth-child(5),.owner-table td:nth-child(5){width:19%}
.owner-table th:nth-child(6),.owner-table td:nth-child(6){width:11%}
.owner-table th:nth-child(7),.owner-table td:nth-child(7){width:20%}
.owner-table .action-cell{
    display:flex;
    justify-content:center;
    gap:6px;
}
.owner-table .action-cell a{
    width:32px;
    height:32px;
    min-width:32px;
}
.owner-count{ text-align:center }
.owner-pagination{margin-top:10px}
@media (max-width:1100px){
    .owner-table{font-size:12px}
    .owner-table th,.owner-table td{padding:7px 5px}
    .owner-table .action-cell a{width:29px;height:29px;min-width:29px}
}

/* V16 - Owner & Penyewa action links */
.owner-actions{display:flex;align-items:center;justify-content:center;gap:6px}
.owner-actions .icon-action{
    display:inline-flex;align-items:center;justify-content:center;
    width:32px;height:32px;border-radius:7px;text-decoration:none;
    font-size:15px;line-height:1;border:1px solid rgba(80,60,160,.08)
}
.owner-actions .view{background:#eef6ff;color:#1677e8}
.owner-actions .edit{background:#f0f3fa;color:#3e4d72}
.owner-actions .delete{background:#fff0f1;color:#e52332}
.owner-actions .icon-action:hover{filter:brightness(.96);transform:translateY(-1px)}

/* V17 - Explicit visible action links for Owner and Penyewa */
.owner-table{width:100%;table-layout:fixed;font-size:12px}
.owner-table th,.owner-table td{padding:8px 6px;white-space:nowrap}
.owner-table th:nth-child(1),.owner-table td:nth-child(1){width:4%}
.owner-table th:nth-child(2),.owner-table td:nth-child(2){width:15%}
.owner-table th:nth-child(3),.owner-table td:nth-child(3){width:8%}
.owner-table th:nth-child(4),.owner-table td:nth-child(4){width:13%}
.owner-table th:nth-child(5),.owner-table td:nth-child(5){width:15%}
.owner-table th:nth-child(6),.owner-table td:nth-child(6){width:11%}
.owner-table th:nth-child(7),.owner-table td:nth-child(7){width:8%}
.owner-table th:nth-child(8),.owner-table td:nth-child(8){width:8%}
.owner-table th:nth-child(9),.owner-table td:nth-child(9){width:18%}
.owner-actions{display:flex!important;align-items:center;justify-content:center;gap:4px!important}
.action-btn{
 display:inline-flex;align-items:center;justify-content:center;
 min-width:48px;height:29px;padding:0 7px;border-radius:6px;
 text-decoration:none!important;font-size:11px;font-weight:700;
 box-sizing:border-box
}
.action-view{background:#eaf3ff;color:#147be8}
.action-edit{background:#eef1f7;color:#344c7e}
.action-delete{background:#ffe9eb;color:#e52535}
.action-btn:hover{filter:brightness(.95)}
@media(max-width:1100px){
 .owner-table{font-size:11px}
 .owner-table th,.owner-table td{padding:6px 4px}
 .action-btn{min-width:42px;height:27px;font-size:10px;padding:0 5px}
}
.occupant-row{display:grid;grid-template-columns:minmax(0,1fr) 150px;gap:8px;align-items:center}.occupant-row select{min-width:0}@media(max-width:700px){.occupant-row{grid-template-columns:1fr}}
.doc-preview{margin-top:9px;margin-bottom:8px;height:130px;border:1px solid #e1d9ee;border-radius:8px;background:#faf9fd;display:flex;align-items:center;justify-content:center;overflow:hidden}.doc-preview img{display:block;width:100%;height:100%;object-fit:contain}.doc-pdf{height:auto;min-height:70px;padding:10px}.doc-pdf a{color:#5b2bb1;font-weight:600;text-decoration:none}.doc-pdf a:hover{text-decoration:underline}.doc-image-link{display:block;width:100%;height:100%;cursor:zoom-in}.doc-image-link img{cursor:zoom-in}.doc-preview{position:relative}.doc-preview img{transition:transform .15s ease}.doc-image-link:hover img{transform:scale(1.03)}

.vehicle-list-inline{margin:10px 0 24px;overflow-x:auto}.vehicle-list-inline .table{min-width:850px}.vehicle-list-inline small{display:block;margin-top:8px}.empty-inline{padding:14px;border:1px dashed #ccc;border-radius:8px;margin:10px 0 24px;color:#666;background:#fafafa}

.status-badge{display:inline-flex;align-items:center;justify-content:center;min-width:68px;padding:6px 12px;border-radius:7px;font-weight:700;font-size:13px;text-transform:lowercase;color:#fff;text-decoration:none}.status-terisi{background:#16a34a}.status-kosong{background:#dc2626}
.vehicle-thumb-link{display:inline-block;width:58px;height:42px;cursor:zoom-in}.vehicle-thumb{width:58px;height:42px;object-fit:cover;border-radius:6px;border:1px solid #ddd}.vehicle-photo-preview{width:180px;height:130px;margin-bottom:8px;border:1px solid #ddd;border-radius:8px;overflow:hidden}.vehicle-photo-preview img{width:100%;height:100%;object-fit:contain;display:block;cursor:zoom-in}

/* V36 - Compact Daftar Owner/Penyewa untuk monitor desktop */
.owner-tablebox{padding:8px 8px 0;border-radius:9px}
.owner-table{width:100%;min-width:0;table-layout:fixed;font-size:11px}
.owner-table th,.owner-table td{padding:6px 5px;font-size:11px;line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.owner-table th{font-size:11px;padding:7px 5px;font-weight:700}
.owner-table td{height:38px}
.owner-table th:nth-child(1),.owner-table td:nth-child(1){width:4%;text-align:center}
.owner-table th:nth-child(2),.owner-table td:nth-child(2){width:16%}
.owner-table th:nth-child(3),.owner-table td:nth-child(3){width:7%}
.owner-table th:nth-child(4),.owner-table td:nth-child(4){width:12%}
.owner-table th:nth-child(5),.owner-table td:nth-child(5){width:16%}
.owner-table th:nth-child(6),.owner-table td:nth-child(6){width:10%;text-align:center}
.owner-table th:nth-child(7),.owner-table td:nth-child(7){width:10%;text-align:center}
.owner-table th:nth-child(8),.owner-table td:nth-child(8){width:8%;text-align:center}
.owner-table th:nth-child(9),.owner-table td:nth-child(9){width:7%;text-align:center}
.owner-table th:nth-child(10),.owner-table td:nth-child(10){width:10%;text-align:center}
.owner-actions{gap:3px!important}
.owner-actions .action-btn{min-width:0;width:31px;height:25px;padding:0 3px;font-size:9px;border-radius:5px}
.owner-table-footer{padding:10px 4px 8px;font-size:11px}
.owner-pagination{gap:3px;margin-top:0}
.owner-pagination a{min-width:28px;height:28px;padding:0 6px;font-size:11px}
@media(max-width:1100px){
 .owner-table{font-size:10px}
 .owner-table th,.owner-table td{padding:5px 3px;font-size:10px}
 .owner-table th{padding:6px 3px}
 .owner-table td{height:34px}
 .owner-actions .action-btn{width:28px;height:23px;font-size:8px}
}

/* V36 - Peringatan masa sewa Penyewa pada heading Dashboard */
.dashboard-title-block{min-width:0}
.rental-warning{display:flex;align-items:center;gap:9px;width:min(58%,760px);height:46px;margin-top:1px;border:1px solid #f2c56d;border-radius:9px;background:#fff8e7;box-shadow:0 2px 8px rgba(119,75,13,.08);overflow:hidden}
.rental-warning-icon{display:flex;align-items:center;justify-content:center;flex:0 0 38px;height:100%;font-size:21px;color:#b86b00;background:#fff0c9;border-right:1px solid #f2d28d}
.rental-warning-track{position:relative;flex:1;min-width:0;height:100%;overflow:hidden;display:flex;align-items:center}
.rental-warning-text{display:flex;align-items:center;gap:52px;white-space:nowrap;animation:rental-warning-move 22s linear infinite;will-change:transform}
.rental-warning-text span{font-size:13px;color:#7b4b00}
.rental-warning-text b{color:#a33b00;font-weight:750}
.rental-warning:hover .rental-warning-text{animation-play-state:paused}
@keyframes rental-warning-move{0%{transform:translateX(-100%)}100%{transform:translateX(100%)}}
@media(max-width:1200px){.rental-warning{width:52%;height:43px}.rental-warning-text span{font-size:12px}}
@media(max-width:760px){.dashboard-heading{display:block}.rental-warning{width:100%;margin-top:12px}.rental-warning-text{animation-duration:18s}}


/* V38 - Inventory List unit PDF attachment */
.unit-inventory-attachment{margin-top:8px;padding:9px 11px;border:1px solid #e2d9ee;border-radius:8px;background:#faf9fd;display:flex;align-items:center;justify-content:space-between;gap:10px}
.unit-inventory-attachment span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12px}
.unit-pdf-link{font-weight:700;color:#5b2bb1;text-decoration:none}
.unit-pdf-link:hover{text-decoration:underline}
.field-help{display:block;margin-top:5px;color:#777;font-size:11px}

.check-inline{display:flex!important;align-items:center;gap:6px;font-weight:400!important;margin-top:6px}.check-inline input{width:auto!important;padding:0!important;margin:0!important}

/* Access Card online/offline controls */
.access-card-control{display:flex;gap:8px;align-items:center}
.access-card-control input[type="text"]{flex:1;min-width:0}
.access-status-btn{border:0;border-radius:8px;padding:9px 12px;font-size:12px;font-weight:700;letter-spacing:.3px;cursor:pointer;min-width:76px;transition:.15s ease}
.access-status-btn.online{background:#198754;color:#fff}
.access-status-btn.offline{background:#6c757d;color:#fff}
.access-status-btn:hover{transform:translateY(-1px);filter:brightness(.96)}

.contractor-ktp-preview{margin-top:8px;width:180px;height:110px;border:1px solid #ddd;border-radius:8px;overflow:hidden;background:#faf9fd}.contractor-ktp-preview a{display:flex;width:100%;height:100%;align-items:center;justify-content:center;text-decoration:none;cursor:zoom-in}.contractor-ktp-preview img{display:block;width:100%;height:100%;object-fit:contain;transition:transform .15s ease}.contractor-ktp-preview a:hover img{transform:scale(1.04)}.contractor-ktp-pdf{font-weight:800;font-size:28px;color:#5b2bb1;border:2px solid #5b2bb1;border-radius:8px;padding:16px 20px}.contractor-ktp-preview a:hover .contractor-ktp-pdf{background:#f0eaff}

/* Rental PDF thumbnails */
.doc-pdf-thumb{display:flex;flex-direction:column;align-items:center;justify-content:center;width:120px;height:90px;border:1px solid #d9d9e5;border-radius:10px;text-decoration:none;background:#f7f7fb;gap:6px;transition:transform .15s ease,box-shadow .15s ease}.doc-pdf-thumb:hover{transform:scale(1.03);box-shadow:0 4px 14px rgba(0,0,0,.12)}.pdf-thumb-icon{font-weight:800;font-size:22px}.pdf-thumb-label{font-size:11px;color:inherit}
/* V55 - Print / PDF / Excel export controls */
.owner-export-tools{display:flex;align-items:center;gap:6px;flex-wrap:wrap;justify-content:flex-end}.export-btn{font-size:11px!important;padding:8px 10px!important;white-space:nowrap}.owner-tools{align-items:center}@media(max-width:900px){.owner-export-tools{justify-content:flex-start}.export-btn{font-size:10px!important;padding:7px 8px!important}}


/* V61 - Professional switchable Blue / Purple themes with curved top-sidebar connection */
:root{
  --theme-dark:#123c73;
  --theme-dark-2:#1c5aa6;
  --theme-page:#eaf4ff;
  --theme-page-2:#dcecff;
  --theme-accent:#2474d8;
  --theme-accent-soft:#e5f0ff;
  --theme-text:#18385f;
  --theme-border:#cbdcf0;
  --theme-shadow:rgba(17,61,113,.12);
}
:root[data-theme="purple"]{
  --theme-dark:#43208f;
  --theme-dark-2:#6337b7;
  --theme-page:#f1eaff;
  --theme-page-2:#e7dcff;
  --theme-accent:#7043cf;
  --theme-accent-soft:#eee5ff;
  --theme-text:#42247b;
  --theme-border:#d9cbed;
  --theme-shadow:rgba(67,32,143,.12);
}
body{background:linear-gradient(180deg,var(--theme-page) 0,var(--theme-page-2) 100%);color:var(--theme-text)}
/* V450 - Expanded professional theme palette */
:root[data-theme="teal"]{--theme-dark:#075e67;--theme-dark-2:#0e8f99;--theme-page:#e9fbfc;--theme-page-2:#d7f2f4;--theme-accent:#0c9aa5;--theme-accent-soft:#ddf7f8;--theme-text:#124f56;--theme-border:#c4e3e6;--theme-shadow:rgba(7,94,103,.14)}
:root[data-theme="green"]{--theme-dark:#185c37;--theme-dark-2:#2d8b57;--theme-page:#eefaf2;--theme-page-2:#dcefe3;--theme-accent:#2f9b61;--theme-accent-soft:#e0f5e8;--theme-text:#245338;--theme-border:#c8e2d1;--theme-shadow:rgba(24,92,55,.14)}
:root[data-theme="crimson"]{--theme-dark:#741f35;--theme-dark-2:#b93655;--theme-page:#fff0f3;--theme-page-2:#fbdde4;--theme-accent:#c83e5c;--theme-accent-soft:#fde2e8;--theme-text:#6c2639;--theme-border:#ecc8d1;--theme-shadow:rgba(116,31,53,.14)}
:root[data-theme="navy"]{--theme-dark:#172b4d;--theme-dark-2:#315b8f;--theme-page:#edf4ff;--theme-page-2:#dbe8f8;--theme-accent:#3b73b9;--theme-accent-soft:#e2edfb;--theme-text:#1e385b;--theme-border:#c8d8ea;--theme-shadow:rgba(23,43,77,.14)}
:root[data-theme="cyan"]{--theme-dark:#075985;--theme-dark-2:#0891b2;--theme-page:#ecfbff;--theme-page-2:#d9f4fa;--theme-accent:#089ec0;--theme-accent-soft:#ddf7fc;--theme-text:#15516a;--theme-border:#c5e5ed;--theme-shadow:rgba(7,89,133,.14)}
:root[data-theme="indigo"]{--theme-dark:#30308f;--theme-dark-2:#5554c7;--theme-page:#f0efff;--theme-page-2:#e0defb;--theme-accent:#5b5bd6;--theme-accent-soft:#e8e7ff;--theme-text:#393978;--theme-border:#d2d1ed;--theme-shadow:rgba(48,48,143,.14)}
:root[data-theme="violet"]{--theme-dark:#5b218c;--theme-dark-2:#8d43c4;--theme-page:#f8efff;--theme-page-2:#eadcf8;--theme-accent:#984dcc;--theme-accent-soft:#f1e3fc;--theme-text:#592c73;--theme-border:#ddc9ea;--theme-shadow:rgba(91,33,140,.14)}
:root[data-theme="magenta"]{--theme-dark:#861b62;--theme-dark-2:#c43d91;--theme-page:#fff0fa;--theme-page-2:#f9dff0;--theme-accent:#cf489b;--theme-accent-soft:#fde5f4;--theme-text:#71305a;--theme-border:#ebc9df;--theme-shadow:rgba(134,27,98,.14)}
:root[data-theme="coral"]{--theme-dark:#9a3d2b;--theme-dark-2:#df6849;--theme-page:#fff4ef;--theme-page-2:#ffe1d7;--theme-accent:#e66c4a;--theme-accent-soft:#ffeadf;--theme-text:#783b2f;--theme-border:#efd0c5;--theme-shadow:rgba(154,61,43,.14)}
:root[data-theme="gold"]{--theme-dark:#795514;--theme-dark-2:#b98222;--theme-page:#fff9e8;--theme-page-2:#f8edc9;--theme-accent:#bd8a22;--theme-accent-soft:#fff1c7;--theme-text:#664d1d;--theme-border:#ead9a8;--theme-shadow:rgba(121,85,20,.14)}
:root[data-theme="slate"]{--theme-dark:#334155;--theme-dark-2:#64748b;--theme-page:#f1f5f9;--theme-page-2:#e2e8f0;--theme-accent:#64748b;--theme-accent-soft:#e8edf3;--theme-text:#334155;--theme-border:#cbd5e1;--theme-shadow:rgba(51,65,85,.14)}
:root[data-theme="black"]{--theme-dark:#171717;--theme-dark-2:#3f3f46;--theme-page:#f4f4f5;--theme-page-2:#e4e4e7;--theme-accent:#52525b;--theme-accent-soft:#ededee;--theme-text:#27272a;--theme-border:#d4d4d8;--theme-shadow:rgba(0,0,0,.16)}
:root[data-theme="coffee"]{--theme-dark:#4b2e24;--theme-dark-2:#8b5e3c;--theme-page:#fbf4ed;--theme-page-2:#efe0d1;--theme-accent:#9b6a43;--theme-accent-soft:#f5e7d9;--theme-text:#5e3b2d;--theme-border:#e2cdbc;--theme-shadow:rgba(75,46,36,.14)}
:root[data-theme="forest"]{--theme-dark:#17452e;--theme-dark-2:#39734f;--theme-page:#eff9f1;--theme-page-2:#dcecdf;--theme-accent:#42885c;--theme-accent-soft:#e2f3e6;--theme-text:#28583b;--theme-border:#c9e0cf;--theme-shadow:rgba(23,69,46,.14)}
:root[data-theme="aqua"]{--theme-dark:#075e73;--theme-dark-2:#16a0b5;--theme-page:#eafcff;--theme-page-2:#d6f3f7;--theme-accent:#18a9bd;--theme-accent-soft:#ddf8fb;--theme-text:#175768;--theme-border:#c4e4e9;--theme-shadow:rgba(7,94,115,.14)}

.top{
  position:relative;height:74px;z-index:20;
  background:linear-gradient(115deg,var(--theme-dark),var(--theme-dark-2));
  box-shadow:0 7px 22px var(--theme-shadow);
}
.layout{position:relative;min-height:calc(100vh - 114px)}
aside{
  position:relative;width:235px;flex:0 0 235px;padding:31px 13px 22px;
  background:linear-gradient(180deg,var(--theme-dark) 0%,var(--theme-dark-2) 100%);
  border:0;box-shadow:8px 0 24px var(--theme-shadow);z-index:5;
}
aside a{color:#fff;padding:12px 15px;border-radius:11px;margin-bottom:6px;font-weight:600;transition:.18s ease}
aside a:hover,aside a.active{background:rgba(255,255,255,.15);color:#fff;transform:translateX(2px)}
main{position:relative;padding:30px 30px 34px;min-width:0}
main::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 95% 0,rgba(255,255,255,.55),transparent 32%);pointer-events:none}
.card,.tablebox,.form,.dashboard-panel{border-color:var(--theme-border);box-shadow:0 4px 18px var(--theme-shadow)}
.table th{background:var(--theme-accent-soft);color:var(--theme-text)}
.btn{background:linear-gradient(135deg,var(--theme-accent),var(--theme-dark-2))}
.btn.light{background:var(--theme-accent-soft);color:var(--theme-text)}
.badge{background:var(--theme-accent-soft);color:var(--theme-accent)}
.field input,.field select,.field textarea,.search{border-color:var(--theme-border)}
.theme-switcher{position:relative}
.theme-btn{border:1px solid rgba(255,255,255,.28);background:rgba(255,255,255,.12);color:#fff;border-radius:9px;padding:8px 11px;cursor:pointer;font-weight:700}
.theme-btn:hover{background:rgba(255,255,255,.2)}
.theme-menu{display:none;position:absolute;right:0;top:42px;width:155px;background:#fff;border:1px solid #ddd;border-radius:12px;padding:6px;box-shadow:0 12px 30px rgba(0,0,0,.18)}
.theme-menu.show{display:block}
.theme-menu button{display:flex;align-items:center;gap:9px;width:100%;border:0;background:transparent;padding:9px 10px;border-radius:8px;text-align:left;cursor:pointer;color:#303544;font-weight:600}
.theme-menu button:hover{background:#f2f4f8}
.theme-dot{width:17px;height:17px;border-radius:50%;display:inline-block;box-shadow:inset 0 0 0 2px #fff,0 0 0 1px #bbb}
.blue-dot{background:linear-gradient(135deg,#123c73,#66a9ef)}
.purple-dot{background:linear-gradient(135deg,#43208f,#b38cff)}
@media(max-width:760px){
 .top::after{width:180px}.top{height:68px;padding:0 14px}.brand b{font-size:16px}.brand small{font-size:10px}
 .topright{gap:8px;font-size:12px}.theme-btn{padding:7px 8px}.layout{display:block}aside{width:100%;display:flex;gap:5px;overflow-x:auto;padding:10px;background:var(--theme-dark)}aside a{white-space:nowrap;margin:0}.layout main{padding:20px 14px}
}

/* V62 - Fixed theme switcher + elegant control */
.theme-switcher{position:relative;z-index:1000}
.theme-btn{display:inline-flex;align-items:center;gap:8px;height:38px;padding:0 13px;border:1px solid rgba(255,255,255,.28);border-radius:12px;background:linear-gradient(135deg,rgba(255,255,255,.18),rgba(255,255,255,.08));color:#fff;box-shadow:0 5px 16px rgba(0,0,0,.12),inset 0 1px 0 rgba(255,255,255,.16);font-size:12px;font-weight:750;letter-spacing:.2px;cursor:pointer;transition:all .2s ease}
.theme-btn:hover{transform:translateY(-1px);background:linear-gradient(135deg,rgba(255,255,255,.26),rgba(255,255,255,.12));box-shadow:0 8px 20px rgba(0,0,0,.18)}
.theme-btn:active{transform:translateY(0)}
.theme-icon{display:inline-flex;align-items:center;justify-content:center;width:21px;height:21px;border-radius:7px;background:rgba(255,255,255,.18);font-size:15px}
.theme-label{font-weight:800}.theme-chevron{font-size:15px;line-height:1;opacity:.85;margin-left:1px}
.theme-menu{display:none;position:absolute;right:0;top:46px;width:178px;padding:7px;background:rgba(255,255,255,.98);border:1px solid rgba(40,50,80,.12);border-radius:14px;box-shadow:0 16px 38px rgba(20,25,50,.22);backdrop-filter:blur(12px);z-index:9999}
.theme-menu.show{display:block;animation:themePop .16s ease-out}
.theme-menu button{position:relative;display:flex;align-items:center;gap:10px;width:100%;height:42px;padding:0 11px;border:0;border-radius:10px;background:transparent;text-align:left;color:#303544;font-size:12px;font-weight:700;cursor:pointer;transition:.16s ease}
.theme-menu button:hover{background:#f1f4f9;transform:translateX(2px)}
.theme-menu button.selected{background:#edf4ff;color:#1e5fae}
.theme-menu button.selected::after{content:'✓';position:absolute;right:11px;font-size:14px}
.theme-dot{width:22px;height:22px;flex:0 0 22px;border-radius:7px;display:inline-block;box-shadow:inset 0 0 0 2px rgba(255,255,255,.75),0 0 0 1px rgba(0,0,0,.12)}
.blue-dot{background:linear-gradient(135deg,#123c73 15%,#2474d8 55%,#b9dcff)}
.purple-dot{background:linear-gradient(135deg,#43208f 15%,#7043cf 55%,#d9c4ff)}
@keyframes themePop{from{opacity:0;transform:translateY(-5px) scale(.98)}to{opacity:1;transform:none}}
@media(max-width:760px){.theme-btn{height:35px;padding:0 9px}.theme-label{display:none}.theme-menu{top:42px}.theme-icon{width:20px;height:20px}}

/* V63 - robust theme override: applies to the complete application shell */
html[data-theme="blue"] body{background:linear-gradient(180deg,#eaf4ff 0%,#dcecff 100%) !important;color:#18385f !important}
html[data-theme="blue"] .top{background:linear-gradient(110deg,#123c73,#1c5aa6) !important}
html[data-theme="blue"] aside{background:linear-gradient(180deg,#123c73,#1c5aa6) !important;border-right:0 !important}
html[data-theme="blue"] aside a{color:#fff !important}
html[data-theme="blue"] aside a:hover,html[data-theme="blue"] aside a.active{background:rgba(255,255,255,.16) !important;color:#fff !important}
html[data-theme="blue"] main{background:transparent !important}
html[data-theme="blue"] .card,html[data-theme="blue"] .tablebox,html[data-theme="blue"] .form,html[data-theme="blue"] .dashboard-panel,html[data-theme="blue"] .owner-tablebox{border-color:#cbdcf0 !important}
html[data-theme="blue"] .table th,html[data-theme="blue"] .dashboard-table th,html[data-theme="blue"] .owner-table th{background:#dcecff !important;color:#18385f !important}
html[data-theme="blue"] .btn:not(.danger){background:linear-gradient(135deg,#2474d8,#123c73) !important;color:#fff !important}
html[data-theme="blue"] .btn.light{background:#e5f0ff !important;color:#18385f !important}
html[data-theme="blue"] .badge{background:#e5f0ff !important;color:#2474d8 !important}
html[data-theme="blue"] .field input,html[data-theme="blue"] .field select,html[data-theme="blue"] .field textarea,html[data-theme="blue"] .search{border-color:#cbdcf0 !important}

html[data-theme="purple"] body{background:linear-gradient(180deg,#f1eaff 0%,#e7dcff 100%) !important;color:#42247b !important}
html[data-theme="purple"] .top{background:linear-gradient(110deg,#43208f,#6337b7) !important}
html[data-theme="purple"] aside{background:linear-gradient(180deg,#43208f,#6337b7) !important;border-right:0 !important}
html[data-theme="purple"] aside a{color:#fff !important}
html[data-theme="purple"] aside a:hover,html[data-theme="purple"] aside a.active{background:rgba(255,255,255,.16) !important;color:#fff !important}
html[data-theme="purple"] main{background:transparent !important}
html[data-theme="purple"] .card,html[data-theme="purple"] .tablebox,html[data-theme="purple"] .form,html[data-theme="purple"] .dashboard-panel,html[data-theme="purple"] .owner-tablebox{border-color:#d9cbed !important}
html[data-theme="purple"] .table th,html[data-theme="purple"] .dashboard-table th,html[data-theme="purple"] .owner-table th{background:#e7dcff !important;color:#42247b !important}
html[data-theme="purple"] .btn:not(.danger){background:linear-gradient(135deg,#7043cf,#43208f) !important;color:#fff !important}
html[data-theme="purple"] .btn.light{background:#eee5ff !important;color:#42247b !important}
html[data-theme="purple"] .badge{background:#eee5ff !important;color:#7043cf !important}
html[data-theme="purple"] .field input,html[data-theme="purple"] .field select,html[data-theme="purple"] .field textarea,html[data-theme="purple"] .search{border-color:#d9cbed !important}

/* connected top/sidebar curve */
html[data-theme] .top{position:relative;z-index:10}
html[data-theme] aside{position:relative;z-index:5}


/* V64 - five professional colour themes */
:root{
 --theme-dark:#123c73;--theme-dark-2:#1c5aa6;--theme-page:#eaf4ff;--theme-page-2:#dcecff;--theme-accent:#2474d8;--theme-accent-soft:#e5f0ff;--theme-text:#18385f;--theme-border:#cbdcf0;--theme-shadow:rgba(17,61,113,.14);
}
html[data-theme="emerald"]{--theme-dark:#075e54;--theme-dark-2:#15947f;--theme-page:#e9fbf6;--theme-page-2:#d5f3ea;--theme-accent:#0f9f88;--theme-accent-soft:#ddf7f0;--theme-text:#14564d;--theme-border:#c5e7de;--theme-shadow:rgba(5,94,84,.14)}
html[data-theme="sunset"]{--theme-dark:#7b321b;--theme-dark-2:#c85d2b;--theme-page:#fff4ec;--theme-page-2:#ffe5d4;--theme-accent:#e87532;--theme-accent-soft:#ffeadb;--theme-text:#713b26;--theme-border:#efd1bd;--theme-shadow:rgba(123,50,27,.14)}
html[data-theme="rose"]{--theme-dark:#721f4f;--theme-dark-2:#b43f79;--theme-page:#fff0f6;--theme-page-2:#fbdce9;--theme-accent:#c94d86;--theme-accent-soft:#fde4ef;--theme-text:#6f3150;--theme-border:#edc7d8;--theme-shadow:rgba(114,31,79,.14)}
html[data-theme="purple"]{--theme-dark:#43208f;--theme-dark-2:#6337b7;--theme-page:#f1eaff;--theme-page-2:#e7dcff;--theme-accent:#7043cf;--theme-accent-soft:#eee5ff;--theme-text:#42247b;--theme-border:#d9cbed;--theme-shadow:rgba(67,32,143,.14)}
html[data-theme] body{background:linear-gradient(180deg,var(--theme-page),var(--theme-page-2)) !important;color:var(--theme-text) !important}
html[data-theme] .top{background:linear-gradient(110deg,var(--theme-dark),var(--theme-dark-2)) !important}
html[data-theme] aside{background:linear-gradient(180deg,var(--theme-dark),var(--theme-dark-2)) !important;border-right:0 !important;box-shadow:8px 0 24px var(--theme-shadow)}
html[data-theme] aside a{color:#fff !important}
html[data-theme] aside a:hover,html[data-theme] aside a.active{background:rgba(255,255,255,.16) !important;color:#fff !important}
html[data-theme] main{background:transparent !important}
html[data-theme] .card,html[data-theme] .tablebox,html[data-theme] .form,html[data-theme] .dashboard-panel,html[data-theme] .owner-tablebox{border-color:var(--theme-border) !important;box-shadow:0 4px 18px var(--theme-shadow)}
html[data-theme] .table th,html[data-theme] .dashboard-table th,html[data-theme] .owner-table th{background:var(--theme-accent-soft) !important;color:var(--theme-text) !important}
html[data-theme] .btn:not(.danger){background:linear-gradient(135deg,var(--theme-accent),var(--theme-dark)) !important;color:#fff !important}
html[data-theme] .btn.light{background:var(--theme-accent-soft) !important;color:var(--theme-text) !important}
html[data-theme] .badge{background:var(--theme-accent-soft) !important;color:var(--theme-accent) !important}
html[data-theme] .field input,html[data-theme] .field select,html[data-theme] .field textarea,html[data-theme] .search{border-color:var(--theme-border) !important}
html[data-theme] .dashboard-heading h1,html[data-theme] .owner-head h1,html[data-theme] .panel-heading h2{color:var(--theme-text) !important}
html[data-theme] .panel-heading a{color:var(--theme-accent) !important}
html[data-theme] .theme-menu button.selected{background:var(--theme-accent-soft);color:var(--theme-accent)}
html[data-theme] .top::after{background:var(--theme-dark) !important}
html[data-theme] aside::before,html[data-theme] aside::after{background:var(--theme-dark) !important}
.blue-dot{background:linear-gradient(135deg,#123c73,#2474d8,#b9dcff)}
.purple-dot{background:linear-gradient(135deg,#43208f,#7043cf,#d9c4ff)}
.emerald-dot{background:linear-gradient(135deg,#075e54,#0f9f88,#a9eee0)}
.sunset-dot{background:linear-gradient(135deg,#7b321b,#e87532,#ffd0b1)}
.rose-dot{background:linear-gradient(135deg,#721f4f,#c94d86,#f7bfd8)}
.theme-menu{width:205px}
.theme-menu button{height:40px}
@media(max-width:760px){.theme-menu{width:190px}}
.attachment-delete{display:block;margin-top:7px;border:0;border-radius:7px;padding:6px 10px;background:#dc2626;color:#fff;cursor:pointer;font-size:12px;font-weight:600}.attachment-delete:hover{opacity:.9}

/* Dashboard metric icons - refined SVG icons */
.metric-icon svg{width:48px;height:48px;display:block;fill:none;stroke:currentColor;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 2px 3px rgba(0,0,0,.10))}
.metric-icon{display:flex;align-items:center;justify-content:center;color:#fff}
@media(max-width:900px){.metric-icon svg{width:40px;height:40px}}

.admin-head-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.admin-head-actions .btn{white-space:nowrap}

/* Sidebar footer credit */
aside{display:flex !important;flex-direction:column !important;}
.sidebar-credit{margin-top:auto;padding:18px 8px 4px;text-align:center;color:rgba(255,255,255,.72);font-size:12px;font-weight:600;letter-spacing:.2px;}
@media(max-width:900px){.sidebar-credit{font-size:11px;padding-top:12px;}}
@media(max-width:760px){aside{display:flex !important;flex-direction:row !important;}.sidebar-credit{display:none;}}

/* Top bar music controls */
.top{position:relative;}
.top-music{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:flex;align-items:center;gap:8px;z-index:20;}
.music-btn{width:34px;height:30px;border:1px solid rgba(255,255,255,.35);border-radius:8px;background:rgba(255,255,255,.14);color:#fff;font-size:14px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 6px rgba(0,0,0,.12);transition:background .18s ease,transform .18s ease;}
.music-btn:hover{background:rgba(255,255,255,.25);transform:translateY(-1px);}
.music-btn:active{transform:translateY(0);}
.youtube-music{position:absolute;width:1px;height:1px;overflow:hidden;left:-9999px;top:-9999px;pointer-events:none;}
@media(max-width:760px){.top-music{left:58%;}.music-btn{width:30px;height:28px;font-size:12px;}.topright{gap:8px;}}

/* V226 dashboard monthly chart */
.monthly-chart-panel{grid-column:2}
.chart-subtitle{margin-top:4px;color:#8a88a0;font-size:12px;font-weight:500}
.monthly-chart-wrap{padding:0 18px 18px}
.chart-legend{display:flex;flex-wrap:wrap;gap:12px 16px;padding:2px 0 12px;color:#5e5b75;font-size:12px;font-weight:650}
.chart-legend span{display:inline-flex;align-items:center;gap:6px}
.legend-dot{width:9px;height:9px;border-radius:50%;display:inline-block}
.legend-owner{background:#6b43d7}.legend-tenant{background:#3182e6}.legend-vehicle{background:#20ad79}.legend-maintenance{background:#f39a35}.legend-unit-request{background:#e34b7b}
.monthly-chart{height:300px;display:flex;position:relative;padding:10px 0 0 38px}
.chart-y-axis{position:absolute;left:0;top:12px;bottom:29px;width:30px;display:flex;flex-direction:column;justify-content:space-between;text-align:right;color:#9794aa;font-size:10px;font-weight:600}
.chart-plot{position:relative;flex:1;min-width:0;border-bottom:1px solid #dfe2eb}
.chart-gridline{position:absolute;left:0;right:0;border-top:1px dashed #e6e8ef}
.chart-grid-top{top:0}.chart-grid-mid{top:50%}.chart-grid-bottom{bottom:0}
.chart-series{position:absolute;inset:0;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));align-items:stretch}
.chart-group{min-width:0;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;position:relative;z-index:2}
.chart-bars{height:calc(100% - 20px);width:80%;max-width:62px;display:flex;align-items:flex-end;justify-content:center;gap:2px}
.chart-bar{width:20%;min-height:0;border-radius:4px 4px 0 0;display:block;position:relative;transition:height .25s ease;opacity:.92}
.chart-bar:hover{opacity:1;filter:brightness(.95)}
.chart-bar[data-value]:not([data-value="0"]){min-height:3px}
.bar-owner{background:linear-gradient(180deg,#825ce1,#623bc5)}
.bar-tenant{background:linear-gradient(180deg,#5b9cf0,#2f77d8)}
.bar-vehicle{background:linear-gradient(180deg,#4bc99a,#1d9f70)}
.bar-maintenance{background:linear-gradient(180deg,#ffb55b,#e98625)}
.chart-group small{height:20px;padding-top:6px;color:#858299;font-size:9px;font-weight:650;white-space:nowrap}
@media(max-width:760px){.monthly-chart-panel{grid-column:1}.monthly-chart{height:260px}.chart-bars{width:92%}.chart-bar{width:22%}.chart-legend{gap:8px 12px}}

/* V228 - colorful icon system with soft depth shadows */
.logo{width:42px;height:42px;display:inline-flex;align-items:center;justify-content:center;border-radius:13px;background:linear-gradient(145deg,rgba(255,255,255,.28),rgba(255,255,255,.10));box-shadow:0 7px 18px rgba(23,10,61,.28),inset 0 1px 0 rgba(255,255,255,.35)}
.logo svg{width:27px;height:27px;fill:none;stroke:#fff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 2px 3px rgba(20,8,55,.25))}
.top-notification{width:34px;height:34px;border-radius:11px;display:inline-flex;align-items:center;justify-content:center;background:rgba(255,255,255,.16);box-shadow:0 5px 14px rgba(25,8,70,.20),inset 0 1px 0 rgba(255,255,255,.22)}
.top-notification svg{width:19px;height:19px;fill:none;stroke:#fff;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.music-btn svg,.theme-icon svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.theme-icon{display:inline-flex!important;align-items:center;justify-content:center;width:24px!important;height:24px!important;border-radius:8px!important;background:rgba(255,255,255,.18)!important;box-shadow:0 3px 8px rgba(20,8,60,.18)}
.theme-icon svg{width:15px;height:15px;color:#fff}
.sidebar-language label{display:flex!important;align-items:center;gap:6px}
.sidebar-language{width:100%;box-sizing:border-box;overflow:hidden}
#sidebarLanguage{width:100%;max-width:100%;box-sizing:border-box;overflow:hidden;text-overflow:ellipsis}
.language-icon{width:18px;height:18px;display:inline-flex;align-items:center;justify-content:center}
.language-icon svg{width:17px;height:17px;fill:none;stroke:#fff;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 1px 2px rgba(0,0,0,.2))}
aside a{position:relative;display:flex!important;align-items:center;gap:11px!important;transition:transform .18s ease,background .18s ease,box-shadow .18s ease,color .18s ease}
aside a:hover{transform:translateX(2px);box-shadow:0 6px 15px rgba(83,44,160,.10)}
aside a .nav-icon{width:34px!important;min-width:34px!important;height:34px!important;border-radius:11px!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;font-size:0!important;box-shadow:0 5px 12px rgba(42,26,90,.18),inset 0 1px 0 rgba(255,255,255,.48);transition:transform .18s ease,box-shadow .18s ease}
aside a:hover .nav-icon{transform:translateY(-1px) scale(1.04);box-shadow:0 7px 15px rgba(42,26,90,.22),inset 0 1px 0 rgba(255,255,255,.55)}
aside a .nav-icon svg{width:19px;height:19px;fill:none;stroke:#fff;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 2px 2px rgba(24,12,63,.25))}
aside a:nth-of-type(2) .nav-icon{background:linear-gradient(145deg,#5e43e8,#7b5cf1)}
aside a:nth-of-type(3) .nav-icon{background:linear-gradient(145deg,#2f83ea,#55a2f3)}
aside a:nth-of-type(4) .nav-icon{background:linear-gradient(145deg,#21b47c,#48d39a)}
aside a:nth-of-type(5) .nav-icon{background:linear-gradient(145deg,#f05a66,#ff7d86)}
aside a:nth-of-type(6) .nav-icon{background:linear-gradient(145deg,#f39a35,#ffbd59)}
aside a:nth-of-type(7) .nav-icon{background:linear-gradient(145deg,#8d55d8,#b278ee)}
aside a:nth-of-type(8) .nav-icon{background:linear-gradient(145deg,#596b85,#7890ad)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;box-shadow:0 6px 14px rgba(76,37,157,.16),inset 0 1px 0 rgba(255,255,255,.18);transition:transform .18s ease,box-shadow .18s ease,filter .18s ease}
.btn:hover{transform:translateY(-1px);box-shadow:0 9px 18px rgba(76,37,157,.22),inset 0 1px 0 rgba(255,255,255,.22);filter:brightness(1.02)}
.btn-icon{width:23px;height:23px;border-radius:7px;display:inline-flex;align-items:center;justify-content:center;background:rgba(255,255,255,.18);box-shadow:0 3px 7px rgba(35,14,85,.18),inset 0 1px 0 rgba(255,255,255,.22)}
.btn-icon svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.btn.light .btn-icon{background:rgba(99,51,197,.10)}

/* V229 - enterprise monthly analytics chart */
.monthly-chart-panel{background:linear-gradient(180deg,#ffffff 0%,#fbfaff 100%);border-color:#e5e1f0;box-shadow:0 10px 30px rgba(50,31,105,.08)}
.monthly-chart-panel .panel-heading{padding-bottom:8px}
.monthly-chart-panel .panel-heading h2{font-size:18px;letter-spacing:-.2px}
.monthly-chart-wrap{padding:0 20px 20px}
.chart-summary-row{display:flex;align-items:center;justify-content:space-between;margin:2px 0 10px;padding:13px 15px;border:1px solid #ece8f5;border-radius:12px;background:linear-gradient(135deg,#fbf9ff,#f5f8ff);box-shadow:inset 0 1px 0 rgba(255,255,255,.8)}
.chart-summary-copy{display:flex;align-items:baseline;gap:8px;min-width:0}
.chart-summary-label{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.65px;color:#88849c}
.chart-summary-value{font-size:22px;line-height:1;color:#2e2550;letter-spacing:-.7px}
.chart-summary-copy small{font-size:10px;color:#9a97a9;font-weight:600}
.chart-period-badge{padding:5px 9px;border-radius:7px;background:#fff;color:#6a49c8;border:1px solid #e4dcfa;font-size:10px;font-weight:800;letter-spacing:.6px;box-shadow:0 3px 8px rgba(89,59,159,.08)}
.chart-legend{padding:5px 2px 12px;gap:10px 17px}
.chart-legend span{font-size:11px;color:#615d73;font-weight:650}
.legend-dot{width:8px;height:8px;box-shadow:0 2px 5px rgba(42,30,75,.16)}
.monthly-chart{height:315px;padding:8px 0 0 42px}
.chart-y-axis{top:10px;bottom:31px;width:31px;font-size:9px;color:#a09caf}
.chart-plot{border-bottom:1px solid #d9d6e4;border-left:1px solid #ebe8f2;background:linear-gradient(180deg,rgba(255,255,255,.5),rgba(248,246,252,.35))}
.chart-gridline{border-top:1px dashed #e1dee9}
.chart-grid-top{top:0}.chart-grid-mid{top:50%}.chart-grid-bottom{bottom:0}
.chart-series{padding:0 4px}
.chart-group{border-radius:8px;transition:background .18s ease}
.chart-group:hover{background:rgba(105,69,202,.045)}
.chart-bars{height:calc(100% - 22px);width:82%;max-width:70px;gap:3px;align-items:flex-end}
.chart-bar{width:19%;border-radius:4px 4px 1px 1px;opacity:1;box-shadow:0 2px 6px rgba(37,25,74,.12);position:relative;transform-origin:bottom;transition:height .35s cubic-bezier(.2,.7,.2,1),filter .18s ease,transform .18s ease}
.chart-bar:hover{filter:brightness(1.06) saturate(1.08);transform:scaleX(1.18);z-index:5}
.chart-bar[data-value="0"]{opacity:.12;box-shadow:none}
.bar-owner{background:linear-gradient(180deg,#8d6be8 0%,#6240c4 100%)}
.bar-tenant{background:linear-gradient(180deg,#67a9f5 0%,#3179d8 100%)}
.bar-vehicle{background:linear-gradient(180deg,#59d1a5 0%,#1c9d6f 100%)}
.bar-maintenance{background:linear-gradient(180deg,#ffc46f 0%,#e98a28 100%)}
.chart-group small{height:22px;padding-top:7px;font-size:9px;color:#77738b;font-weight:700}
.chart-tooltip{position:absolute;left:50%;bottom:calc(100% - 4px);transform:translate(-50%,4px);z-index:20;min-width:68px;padding:6px 8px;border-radius:7px;background:#29233d;color:#fff;box-shadow:0 7px 18px rgba(28,19,55,.22);display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:9px;line-height:1;pointer-events:none;opacity:0;visibility:hidden;transition:opacity .14s ease,transform .14s ease}
.chart-tooltip b{font-weight:700;white-space:nowrap}.chart-tooltip span{font-weight:800}.chart-tooltip.show{opacity:1;visibility:visible;transform:translate(-50%,0)}
.chart-tooltip:after{content:"";position:absolute;left:50%;bottom:-4px;transform:translateX(-50%) rotate(45deg);width:8px;height:8px;background:#29233d}
@media(max-width:760px){.monthly-chart-wrap{padding:0 13px 15px}.chart-summary-row{padding:11px 12px}.chart-summary-label{font-size:9px}.chart-summary-value{font-size:19px}.chart-summary-copy small{font-size:9px}.monthly-chart{height:275px;padding-left:36px}.chart-bars{width:92%;gap:2px}.chart-bar{width:21%}.chart-tooltip{min-width:58px;padding:5px 6px}}

/* V236 persistent drag-and-drop ordering for Penyewa and Penghuni */
.owner-table[data-sortable-people="1"] tbody tr[draggable="true"]{cursor:grab}
.owner-table[data-sortable-people="1"] tbody tr[draggable="true"]:active{cursor:grabbing}
.people-drag-cell{white-space:nowrap;width:58px}
.people-drag-handle{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;margin-right:6px;border-radius:7px;background:linear-gradient(135deg,#eee9ff,#f7f4ff);color:#6b43d7;font-weight:800;letter-spacing:-3px;box-shadow:0 2px 6px rgba(73,49,135,.16);cursor:grab;vertical-align:middle}
.people-row-number{display:inline-block;min-width:18px}
.owner-table tbody tr.is-dragging{opacity:.42;box-shadow:0 8px 22px rgba(62,39,125,.18)}
.owner-table tbody tr.drag-over td{border-top:3px solid #6b43d7}
.owner-table.order-saved{box-shadow:0 0 0 2px rgba(32,173,121,.22),0 8px 24px rgba(32,173,121,.12)}

/* V237 - drag-and-drop ordering for Kendaraan & Perawatan */
.vehicle-sortable-table tbody tr[draggable="true"],
.maintenance-sortable-table tbody tr[draggable="true"]{cursor:grab}
.vehicle-sortable-table tbody tr[draggable="true"]:active,
.maintenance-sortable-table tbody tr[draggable="true"]:active{cursor:grabbing}
.vehicle-drag-cell,.maintenance-drag-cell{white-space:nowrap;width:62px}
.vehicle-drag-handle,.maintenance-drag-handle{display:inline-flex;align-items:center;justify-content:center;width:25px;height:25px;margin-right:5px;border-radius:7px;background:linear-gradient(135deg,#eee9ff,#f7f4ff);color:#6b43d7;font-weight:800;letter-spacing:-3px;box-shadow:0 2px 6px rgba(73,49,135,.16);cursor:grab;vertical-align:middle}
.vehicle-row-number,.maintenance-row-number{display:inline-block;min-width:18px}
.vehicle-sortable-table tbody tr.is-dragging,.maintenance-sortable-table tbody tr.is-dragging{opacity:.42;box-shadow:0 8px 22px rgba(62,39,125,.18)}
.vehicle-sortable-table tbody tr.drag-over td,.maintenance-sortable-table tbody tr.drag-over td{border-top:3px solid #6b43d7}
.vehicle-sortable-table.order-saved,.maintenance-sortable-table.order-saved{box-shadow:0 0 0 2px rgba(32,173,121,.22),0 8px 24px rgba(32,173,121,.12)}

/* V249 - Compact Unit column on Owner, Penyewa, Penghuni tables */
.owner-table th:nth-child(2),
.owner-table td:nth-child(2){
  width:8%;
  min-width:72px;
  max-width:100px;
  white-space:normal;
  overflow-wrap:anywhere;
  word-break:break-word;
  line-height:1.25;
}


/* V250 - Widen name column so Penyewa/Penghuni title is fully visible */
.owner-table.owner-table-penyewa th:nth-child(3),
.owner-table.owner-table-penyewa td:nth-child(3),
.owner-table.owner-table-penghuni th:nth-child(3),
.owner-table.owner-table-penghuni td:nth-child(3){
  width:18%;
  min-width:145px;
  white-space:normal;
  overflow-wrap:anywhere;
  word-break:break-word;
}

/* V251 - Widen Owner name column and compact date columns */
.owner-table.owner-table-owner th:nth-child(3),
.owner-table.owner-table-owner td:nth-child(3){
  width:22%;
  min-width:175px;
  white-space:normal;
  overflow-wrap:anywhere;
  word-break:break-word;
}
.owner-table.owner-table-owner th:nth-child(4),
.owner-table.owner-table-owner td:nth-child(4),
.owner-table.owner-table-owner th:nth-child(5),
.owner-table.owner-table-owner td:nth-child(5){
  width:10%;
  min-width:92px;
  max-width:110px;
  white-space:nowrap;
}


/* V262 - Unified View / Edit / Delete action buttons */
.page-action-cell{width:240px!important;min-width:240px!important;padding:7px 8px!important;white-space:nowrap!important}
.page-actions{display:flex;align-items:center;justify-content:center;gap:7px;flex-wrap:nowrap;white-space:nowrap}
.page-actions .action-btn,.owner-actions .action-btn{height:31px;min-width:58px;padding:0 10px;border-radius:8px;border:1px solid transparent;font-size:11px;font-weight:800;letter-spacing:.1px;box-shadow:0 2px 6px rgba(55,35,100,.10);transition:transform .15s ease,box-shadow .15s ease,filter .15s ease}
.page-actions .action-view,.owner-actions .action-view{background:linear-gradient(135deg,#eaf3ff,#dcecff);color:#1769c2;border-color:#c9def8}
.page-actions .action-edit,.owner-actions .action-edit{background:linear-gradient(135deg,#f1edff,#e7ddff);color:#5a32b2;border-color:#d8c9f6}
.page-actions .action-delete,.owner-actions .action-delete{background:linear-gradient(135deg,#fff0f1,#ffe1e4);color:#d52c3d;border-color:#f4c9ce}
.page-actions .action-btn:hover,.owner-actions .action-btn:hover{transform:translateY(-1px);box-shadow:0 4px 10px rgba(55,35,100,.16);filter:brightness(.98)}
/* Keep the three buttons on one line on desktop and reserve enough action width. */
.table:not(.owner-table) th:last-child,.table:not(.owner-table) td:last-child{min-width:240px}
@media(max-width:1100px){.page-action-cell{width:220px!important;min-width:220px!important}.page-actions{gap:5px}.page-actions .action-btn,.owner-actions .action-btn{min-width:52px;height:29px;padding:0 8px;font-size:10px}}
@media(max-width:700px){.page-action-cell{width:210px!important;min-width:210px!important}.page-actions .action-btn,.owner-actions .action-btn{min-width:50px;height:28px;padding:0 7px;font-size:10px}}

/* V263 - Compact action buttons: 50% smaller while keeping View | Edit | Delete in one row */
.page-action-cell{width:155px!important;min-width:155px!important;padding:5px 6px!important}
.page-actions{gap:4px}
.page-actions .action-btn,.owner-actions .action-btn{
  height:16px;
  min-width:30px;
  padding:0 4px;
  border-radius:4px;
  font-size:7px;
  font-weight:800;
  letter-spacing:0;
  box-shadow:0 1px 3px rgba(55,35,100,.08);
}
.page-actions .action-btn:hover,.owner-actions .action-btn:hover{transform:translateY(-1px);box-shadow:0 2px 5px rgba(55,35,100,.13)}
.table:not(.owner-table) th:last-child,.table:not(.owner-table) td:last-child{min-width:155px}
@media(max-width:1100px){
  .page-action-cell{width:145px!important;min-width:145px!important}
  .page-actions{gap:3px}
  .page-actions .action-btn,.owner-actions .action-btn{min-width:29px;height:15px;padding:0 3px;font-size:6.5px}
}
@media(max-width:700px){
  .page-action-cell{width:140px!important;min-width:140px!important}
  .page-actions .action-btn,.owner-actions .action-btn{min-width:28px;height:15px;font-size:6.5px}
}

/* V264 - Slightly wider Aksi column on Daftar Penghuni for a cleaner three-button fit */
.owner-table.owner-table-penghuni th:last-child,
.owner-table.owner-table-penghuni td:last-child{
  width:175px!important;
  min-width:175px!important;
  padding-left:8px!important;
  padding-right:8px!important;
  white-space:nowrap!important;
}
.owner-table.owner-table-penghuni .owner-actions{
  width:100%;
  justify-content:center!important;
  gap:4px!important;
  flex-wrap:nowrap!important;
}
/* V265 - compact vehicle actions */
.vehicle-sortable-table th:last-child,.vehicle-sortable-table td:last-child{width:120px!important;min-width:120px!important;white-space:nowrap}
.vehicle-sortable-table .page-actions{gap:4px;justify-content:center;flex-wrap:nowrap}
.vehicle-sortable-table .page-actions .action-btn{min-width:45px;height:22px;padding:0 7px;font-size:9px;border-radius:6px}
@media(max-width:1100px){.vehicle-sortable-table th:last-child,.vehicle-sortable-table td:last-child{width:115px!important;min-width:115px!important}}


/* V266 - Moving vehicle cost information from left to right */
.vehicle-cost-marquee{
  margin-bottom:12px;
  width:100%;
  overflow:hidden;
  border-radius:10px;
  padding:8px 0;
  background:linear-gradient(90deg,rgba(111,76,190,.08),rgba(77,135,220,.08),rgba(111,76,190,.08));
  border:1px solid rgba(111,76,190,.14);
  white-space:nowrap;
}
.vehicle-cost-marquee-track{
  display:block;
  width:max-content;
  min-width:100%;
  animation:vehicleCostMove 18s linear infinite;
  will-change:transform;
}
.vehicle-cost-marquee-track span{
  display:inline-block;
  padding-left:100%;
  font-size:12px;
  line-height:1.35;
  color:var(--text,#3d3152);
}
.vehicle-cost-marquee:hover .vehicle-cost-marquee-track{animation-play-state:paused}
@keyframes vehicleCostMove{
  from{transform:translateX(-100%)}
  to{transform:translateX(0)}
}
@media(prefers-reduced-motion:reduce){
  .vehicle-cost-marquee-track{animation:none;transform:none;text-align:center;width:100%}
  .vehicle-cost-marquee-track span{padding-left:0;white-space:normal}
}


/* V289 - dashboard chart full width and three latest-info panels in one row */
.dashboard-panels{grid-template-columns:repeat(3,minmax(0,1fr))}
.dashboard-panels .monthly-chart-panel{grid-column:1 / -1;order:-1}
.dashboard-panels .maintenance-dashboard-panel{grid-column:auto}
@media(max-width:1200px){.dashboard-panels{grid-template-columns:repeat(2,minmax(0,1fr))}.dashboard-panels .monthly-chart-panel{grid-column:1 / -1}}
@media(max-width:760px){.dashboard-panels{grid-template-columns:1fr}.dashboard-panels .monthly-chart-panel{grid-column:1}}


/* V290 - compact 2D line chart */
.monthly-chart{height:158px!important;padding:6px 0 0 38px!important}
.chart-plot{position:relative;overflow:visible}
.chart-total-summary{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:0 0 14px}
.chart-total-item{min-width:0;padding:10px 11px;border:1px solid #e8e3f0;border-radius:9px;background:#faf9fc}
.chart-total-item span{display:block;font-size:11px;color:#7b748d;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.chart-total-item strong{display:block;margin-top:3px;font-size:20px;line-height:1.1;color:#332b46}
@media(max-width:760px){.chart-total-summary{grid-template-columns:repeat(2,minmax(0,1fr))}}
.chart-line-svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible;z-index:3}
.line-series{pointer-events:none}
.line-path{stroke-width:2.5;vector-effect:non-scaling-stroke;stroke-linecap:round;stroke-linejoin:round}
.line-owner .line-path{stroke:#6240c4}.line-tenant .line-path{stroke:#3179d8}.line-vehicle .line-path{stroke:#1c9d6f}.line-maintenance .line-path{stroke:#e98a28}
.line-point{stroke:#fff;stroke-width:1.5;vector-effect:non-scaling-stroke}
.line-owner .line-point{fill:#6240c4}.line-tenant .line-point{fill:#3179d8}.line-vehicle .line-point{fill:#1c9d6f}.line-maintenance .line-point{fill:#e98a28}
.chart-labels{position:absolute;left:0;right:0;bottom:-22px;height:22px;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));padding:0 0}
.chart-label-group{position:relative;text-align:center;min-width:0;cursor:pointer}.chart-label-group small{display:block;height:22px;padding-top:7px;font-size:9px;color:#77738b;font-weight:700;white-space:nowrap}
.chart-label-group .chart-tooltip{bottom:24px;white-space:nowrap;min-width:145px;display:flex;flex-direction:column;align-items:flex-start;gap:3px}
.chart-label-group .chart-tooltip span{font-size:9px}.chart-label-group .chart-tooltip b{margin-right:3px}
@media(max-width:760px){.monthly-chart{height:138px!important;padding-left:34px!important}.chart-labels{bottom:-22px}.chart-label-group .chart-tooltip{min-width:128px}}

/* V291 - chart box 25% shorter + dashboard info boxes 2 per row */
.monthly-chart{height:119px!important}
.dashboard-panels{grid-template-columns:repeat(2,minmax(0,1fr))}
.dashboard-panels .monthly-chart-panel{grid-column:1 / -1;order:-1}
.dashboard-panels .maintenance-dashboard-panel{grid-column:auto}
@media(max-width:760px){
  .monthly-chart{height:104px!important}
  .dashboard-panels{grid-template-columns:1fr}
  .dashboard-panels .monthly-chart-panel{grid-column:1}
}


/* V292 - financial rental box beside monthly chart */
.dashboard-panels{grid-template-columns:repeat(10,minmax(0,1fr))}
.dashboard-panels .monthly-chart-panel{grid-column:span 7;order:-2}
.dashboard-panels .financial-dashboard-panel{grid-column:span 3;order:-1}
.dashboard-panels .maintenance-dashboard-panel,.dashboard-panels > .dashboard-panel:not(.monthly-chart-panel):not(.financial-dashboard-panel){grid-column:span 5}
.financial-dashboard-content{min-height:100px;display:flex;align-items:center;justify-content:center;padding:8px 12px}
.financial-placeholder{width:100%;padding:22px 10px;text-align:center;border:1px dashed rgba(98,64,196,.18);border-radius:10px;color:#817a92;font-size:12px;background:rgba(98,64,196,.035)}
@media(max-width:1200px){
  .dashboard-panels{grid-template-columns:repeat(2,minmax(0,1fr))}
  .dashboard-panels .monthly-chart-panel{grid-column:1 / -1;order:-2}
  .dashboard-panels .financial-dashboard-panel{grid-column:1 / -1;order:-1}
  .dashboard-panels .maintenance-dashboard-panel,.dashboard-panels > .dashboard-panel:not(.monthly-chart-panel):not(.financial-dashboard-panel){grid-column:span 1}
}
@media(max-width:760px){
  .dashboard-panels{grid-template-columns:1fr}
  .dashboard-panels .monthly-chart-panel,.dashboard-panels .financial-dashboard-panel,.dashboard-panels .maintenance-dashboard-panel,.dashboard-panels > .dashboard-panel:not(.monthly-chart-panel):not(.financial-dashboard-panel){grid-column:1}
}

/* V294 - reduce chart and financial box height by 10% */
.monthly-chart{height:107px!important}
.financial-dashboard-content{min-height:90px!important}
@media(max-width:760px){.monthly-chart{height:94px!important}.financial-dashboard-content{min-height:81px!important}}

/* Dashboard Unit Request */
.unit-request-dashboard-content{display:block!important;min-height:90px!important;padding:0 12px 10px!important}
.unit-request-dashboard-table{width:100%;table-layout:fixed}
.unit-request-dashboard-table th,.unit-request-dashboard-table td{padding:7px 8px!important;font-size:12px!important}
.unit-request-dashboard-table th:nth-child(1),.unit-request-dashboard-table td:nth-child(1){width:27%}
.unit-request-dashboard-table th:nth-child(2),.unit-request-dashboard-table td:nth-child(2){width:38%}
.unit-request-dashboard-table th:nth-child(3),.unit-request-dashboard-table td:nth-child(3){width:35%;text-align:center}
.unit-request-dashboard-table .mrc-status{font-size:11px!important;padding:3px 7px!important;white-space:nowrap}
@media(max-width:760px){.unit-request-dashboard-content{padding:0 8px 8px!important}.unit-request-dashboard-table th,.unit-request-dashboard-table td{font-size:11px!important;padding:6px 5px!important}}

/* V307 - Dashboard Unit Request compact 5-row table + blinking status buttons */
.unit-request-dashboard-content{overflow:hidden!important}
.unit-request-dashboard-table{border-collapse:collapse!important;table-layout:fixed!important}
.unit-request-dashboard-table thead th{padding:5px 6px!important;font-size:10px!important;line-height:1.1!important;white-space:nowrap!important}
.unit-request-dashboard-table tbody tr{height:24px!important}
.unit-request-dashboard-table tbody td{padding:4px 6px!important;font-size:11px!important;line-height:1.15!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.unit-request-dashboard-table th:nth-child(1),.unit-request-dashboard-table td:nth-child(1){width:26%!important}
.unit-request-dashboard-table th:nth-child(2),.unit-request-dashboard-table td:nth-child(2){width:34%!important}
.unit-request-dashboard-table th:nth-child(3),.unit-request-dashboard-table td:nth-child(3){width:40%!important;text-align:center!important}
.unit-request-dashboard-table .empty-cell{white-space:normal!important;text-overflow:clip!important;overflow:visible!important}
.unit-request-dashboard-table .mrc-status{display:inline-flex!important;align-items:center;justify-content:center;min-width:76px;height:20px;box-sizing:border-box;padding:2px 7px!important;border-radius:999px;font-size:9px!important;line-height:1!important;font-weight:800!important;letter-spacing:.1px;white-space:nowrap!important;border:1px solid transparent}
.unit-request-dashboard-table .mrc-status-rencana{background:#dc2626!important;color:#fff!important;border-color:#b91c1c!important;animation:unitRequestBlinkRed 1s ease-in-out infinite}
.unit-request-dashboard-table .mrc-status-dikerjakan{background:#facc15!important;color:#4a3500!important;border-color:#eab308!important;animation:unitRequestBlinkYellow 1s ease-in-out infinite}
.unit-request-dashboard-table .mrc-status-selesai{background:#16a34a!important;color:#fff!important;border-color:#15803d!important;animation:unitRequestBlinkGreen 1s ease-in-out infinite}
@keyframes unitRequestBlinkRed{0%,100%{opacity:1;box-shadow:0 0 0 rgba(220,38,38,0)}50%{opacity:.38;box-shadow:0 0 8px rgba(220,38,38,.55)}}
@keyframes unitRequestBlinkYellow{0%,100%{opacity:1;box-shadow:0 0 0 rgba(250,204,21,0)}50%{opacity:.42;box-shadow:0 0 8px rgba(250,204,21,.65)}}
@keyframes unitRequestBlinkGreen{0%,100%{opacity:1;box-shadow:0 0 0 rgba(22,163,74,0)}50%{opacity:.4;box-shadow:0 0 8px rgba(22,163,74,.55)}}
@media(max-width:760px){
  .unit-request-dashboard-content{padding:0 7px 7px!important}
  .unit-request-dashboard-table thead th{font-size:9px!important;padding:4px!important}
  .unit-request-dashboard-table tbody td{font-size:10px!important;padding:3px 4px!important}
  .unit-request-dashboard-table tbody tr{height:22px!important}
  .unit-request-dashboard-table .mrc-status{min-width:68px;height:18px;font-size:8px!important;padding:2px 5px!important}
}

/* V308 - Unit Request Dashboard: table must fit completely inside the box */
.unit-request-dashboard-content{width:100%!important;box-sizing:border-box!important;padding-left:6px!important;padding-right:6px!important;overflow:hidden!important}
.unit-request-dashboard-content .dashboard-table-wrap{width:100%!important;max-width:100%!important;box-sizing:border-box!important;padding:0!important;overflow:hidden!important}
.unit-request-dashboard-table{width:100%!important;min-width:0!important;max-width:100%!important;box-sizing:border-box!important;table-layout:fixed!important}
.unit-request-dashboard-table th,.unit-request-dashboard-table td{box-sizing:border-box!important;overflow:hidden!important}
.unit-request-dashboard-table th:nth-child(1),.unit-request-dashboard-table td:nth-child(1){width:25%!important}
.unit-request-dashboard-table th:nth-child(2),.unit-request-dashboard-table td:nth-child(2){width:36%!important}
.unit-request-dashboard-table th:nth-child(3),.unit-request-dashboard-table td:nth-child(3){width:39%!important}
.unit-request-dashboard-table .mrc-status{min-width:0!important;width:auto!important;max-width:100%!important;padding-left:5px!important;padding-right:5px!important}
@media(max-width:760px){
  .unit-request-dashboard-content{padding-left:4px!important;padding-right:4px!important}
  .unit-request-dashboard-table thead th{font-size:8px!important;padding:3px 2px!important}
  .unit-request-dashboard-table tbody td{font-size:9px!important;padding:3px 2px!important}
  .unit-request-dashboard-table .mrc-status{min-width:0!important;font-size:8px!important;padding-left:4px!important;padding-right:4px!important}
}

/* Unit Request monthly chart */
.line-unit-request .line-path{stroke:#e34b7b}
.line-unit-request .line-point{fill:#e34b7b}

/* V310 - dashboard chart cleanup and 20% height reduction */
.monthly-chart-panel .chart-summary-row{display:none!important}
.monthly-chart{height:86px!important}
.unit-request-dashboard-content{min-height:72px!important}
@media(max-width:760px){
  .monthly-chart{height:75px!important}
  .unit-request-dashboard-content{min-height:58px!important}
}

/* V314: compact, complete page navigation for Owner and Penyewa */
.owner-pagination{display:flex;gap:5px;align-items:center;justify-content:flex-end;flex-wrap:wrap}
.owner-pagination a,.owner-pagination .pager-ellipsis{min-width:34px;height:34px;padding:0 9px;box-sizing:border-box;border:1px solid #dbe1ed;background:#fff;border-radius:6px;color:#27376d;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;font-size:14px;line-height:1}
.owner-pagination a:hover{background:#f5f1ff;border-color:#bda8ee}
.owner-pagination a.active{background:linear-gradient(135deg,#6934cc,#5420b4);border-color:#6330c7;color:#fff;font-weight:700}
.owner-pagination .pager-ellipsis{border-color:transparent;background:transparent;color:#7b8194;min-width:22px;padding:0}
@media(max-width:700px){.owner-pagination{justify-content:center;gap:3px}.owner-pagination a,.owner-pagination .pager-ellipsis{min-width:30px;height:30px;font-size:12px;padding:0 7px}}

/* V320 - Dashboard Unit Relations: show latest Unit Request and Maintenance (max 5 each) */
.unit-relations-dashboard-panel{overflow:hidden!important}
.unit-relations-dashboard-panel .panel-heading-links{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.unit-relations-dashboard-panel .panel-heading-links a{white-space:nowrap}
.unit-relations-dashboard-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;width:100%;box-sizing:border-box}
.unit-relations-dashboard-block{min-width:0;border:1px solid #e7eaf1;border-radius:10px;padding:10px;box-sizing:border-box;background:#fff}
.unit-relations-dashboard-block-heading{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:7px}
.unit-relations-dashboard-block-heading h3{margin:0;font-size:13px;color:#27314d}
.unit-relations-dashboard-block-heading a{font-size:10px;color:#6330c7;text-decoration:none;white-space:nowrap}
.unit-relations-dashboard-block .dashboard-table-wrap{width:100%;overflow:hidden}
.unit-relations-dashboard-block .dashboard-table{width:100%;min-width:0;table-layout:fixed}
.unit-relations-dashboard-block .dashboard-table th,
.unit-relations-dashboard-block .dashboard-table td{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.unit-relations-dashboard-block .dashboard-table th:nth-child(1),.unit-relations-dashboard-block .dashboard-table td:nth-child(1){width:27%}
.unit-relations-dashboard-block .dashboard-table th:nth-child(2),.unit-relations-dashboard-block .dashboard-table td:nth-child(2){width:43%}
.unit-relations-dashboard-block .dashboard-table th:nth-child(3),.unit-relations-dashboard-block .dashboard-table td:nth-child(3){width:30%}
@media(max-width:760px){
  .unit-relations-dashboard-grid{grid-template-columns:1fr;gap:10px}
  .unit-relations-dashboard-panel .panel-heading-links{gap:7px}
  .unit-relations-dashboard-block{padding:8px}
}

/* V321 - Dashboard layout: Grafik bulanan + Perawatan Unit on top; Penghuni Terbaru + Unit Relations below */
@media(min-width:1201px){
  .dashboard-panels{grid-template-columns:repeat(10,minmax(0,1fr))}
  .dashboard-panels .monthly-chart-panel{grid-column:span 7;order:-2}
  .dashboard-panels .maintenance-dashboard-panel{grid-column:span 3;order:-1}
  .dashboard-panels .financial-dashboard-panel{grid-column:span 5;order:0}
  .dashboard-panels > .dashboard-panel:not(.monthly-chart-panel):not(.financial-dashboard-panel):not(.maintenance-dashboard-panel){grid-column:span 5;order:0}
}

/* V321 - Grafik bulanan full width */
.dashboard-panels .monthly-chart-panel{
  grid-column:1 / -1!important;
  width:100%;
}
@media(max-width:760px){
  .dashboard-panels .monthly-chart-panel{grid-column:1!important;width:100%}
}

/* V321 - Dashboard Unit Relations: Maintenance status blinks like Unit Request */
.maintenance-request-dashboard-table .mrc-status-rencana{background:#dc2626!important;color:#fff!important;border-color:#b91c1c!important;animation:unitRequestBlinkRed 1s ease-in-out infinite}
.maintenance-request-dashboard-table .mrc-status-dikerjakan{background:#facc15!important;color:#4a3500!important;border-color:#eab308!important;animation:unitRequestBlinkYellow 1s ease-in-out infinite}
.maintenance-request-dashboard-table .mrc-status-selesai{background:#16a34a!important;color:#fff!important;border-color:#15803d!important;animation:unitRequestBlinkGreen 1s ease-in-out infinite}
.maintenance-request-dashboard-table .mrc-status{display:inline-flex!important;align-items:center;justify-content:center;min-width:76px;height:20px;box-sizing:border-box;padding:2px 7px!important;border-radius:999px;font-size:9px!important;line-height:1!important;font-weight:800!important;letter-spacing:.1px;white-space:nowrap!important;border:1px solid transparent}
@media(max-width:760px){.maintenance-request-dashboard-table .mrc-status{min-width:68px;height:18px;font-size:8px!important;padding:2px 5px!important}}


/* V322 - Dashboard layout: Unit Relations + Perawatan Unit on same row; Penghuni + Kendaraan below */
@media(min-width:1201px){
  .dashboard-panels{grid-template-columns:repeat(10,minmax(0,1fr))}
  .dashboard-panels .monthly-chart-panel{grid-column:1 / -1!important;order:-3}
  .dashboard-panels .maintenance-dashboard-panel{grid-column:span 5!important;order:-2}
  .dashboard-panels .unit-relations-dashboard-panel{grid-column:span 5!important;order:-2}
  .dashboard-panels .penghuni-dashboard-panel{grid-column:span 5!important;order:0}
  .dashboard-panels .kendaraan-dashboard-panel{grid-column:span 5!important;order:0}
}

/* V323 - Dashboard: Unit Relations 60%, Perawatan Unit 40% */
@media(min-width:1201px){
  .dashboard-panels .unit-relations-dashboard-panel{grid-column:span 6!important;order:-2}
  .dashboard-panels .maintenance-dashboard-panel{grid-column:span 4!important;order:-2}
  .dashboard-panels .penghuni-dashboard-panel{grid-column:span 5!important;order:0}
  .dashboard-panels .kendaraan-dashboard-panel{grid-column:span 5!important;order:0}
}

/* V325 - Perawatan Unit: perkecil lagi lebar tabel di dalam box */
@media(min-width:1201px){
  .maintenance-dashboard-panel .dashboard-table-wrap{display:flex;justify-content:center}
  .maintenance-dashboard-panel .maintenance-table{width:40%;max-width:40%;}
}

/* V326 - Perawatan Unit: kolom Tipe diperkecil 50% */
@media(min-width:1201px){
  .maintenance-dashboard-panel .maintenance-table th:nth-child(3),
  .maintenance-dashboard-panel .maintenance-table td:nth-child(3){width:10%!important}
}

/* V327 - Perawatan Unit dashboard: kolom Unit dan Tipe dibuat fit-content */
@media(min-width:1201px){
  .maintenance-dashboard-panel .maintenance-table{table-layout:auto!important}
  .maintenance-dashboard-panel .maintenance-table th:nth-child(2),
  .maintenance-dashboard-panel .maintenance-table td:nth-child(2),
  .maintenance-dashboard-panel .maintenance-table th:nth-child(3),
  .maintenance-dashboard-panel .maintenance-table td:nth-child(3){
    width:1%!important;
    white-space:nowrap!important;
  }
  .maintenance-dashboard-panel .maintenance-table th:nth-child(4),
  .maintenance-dashboard-panel .maintenance-table td:nth-child(4){width:auto!important}
}

/* V329 - Dashboard Perawatan Unit: tabel dan semua kolom fit di dalam box */
@media(min-width:1201px){
  .maintenance-dashboard-panel .dashboard-table-wrap{display:block;width:100%;overflow:hidden}
  .maintenance-dashboard-panel .maintenance-table{width:100%!important;max-width:100%!important;table-layout:fixed!important;margin:0!important}
  .maintenance-dashboard-panel .maintenance-table th,
  .maintenance-dashboard-panel .maintenance-table td{box-sizing:border-box;white-space:normal!important;overflow:hidden;text-overflow:ellipsis;word-break:break-word}
  .maintenance-dashboard-panel .maintenance-table th:nth-child(1),
  .maintenance-dashboard-panel .maintenance-table td:nth-child(1){width:10%!important}
  .maintenance-dashboard-panel .maintenance-table th:nth-child(2),
  .maintenance-dashboard-panel .maintenance-table td:nth-child(2){width:13%!important}
  .maintenance-dashboard-panel .maintenance-table th:nth-child(3),
  .maintenance-dashboard-panel .maintenance-table td:nth-child(3){width:14%!important}
  .maintenance-dashboard-panel .maintenance-table th:nth-child(4),
  .maintenance-dashboard-panel .maintenance-table td:nth-child(4){width:18%!important}
  .maintenance-dashboard-panel .maintenance-table th:nth-child(5),
  .maintenance-dashboard-panel .maintenance-table td:nth-child(5){width:15%!important}
  .maintenance-dashboard-panel .maintenance-table th:nth-child(6),
  .maintenance-dashboard-panel .maintenance-table td:nth-child(6){width:30%!important}
}

/* V330 - Dashboard: split Unit Relations into separate Unit Request/Maintenance boxes; Grafik 60% + Perawatan Unit 40% */
@media(min-width:1201px){
  .dashboard-panels{grid-template-columns:repeat(10,minmax(0,1fr))}
  .dashboard-panels .monthly-chart-panel{grid-column:span 6!important;order:-3}
  .dashboard-panels .maintenance-dashboard-panel{grid-column:span 4!important;order:-2}
  .dashboard-panels .unit-request-dashboard-panel{grid-column:span 5!important;order:0}
  .dashboard-panels .penghuni-dashboard-panel{grid-column:span 5!important;order:0}
  .dashboard-panels .maintenance-request-dashboard-panel{grid-column:span 5!important;order:1}
  .dashboard-panels .kendaraan-dashboard-panel{grid-column:span 5!important;order:1}
}
@media(max-width:1200px) and (min-width:761px){
  .dashboard-panels{grid-template-columns:repeat(2,minmax(0,1fr))}
  .dashboard-panels .monthly-chart-panel{grid-column:1 / -1!important;order:-3}
  .dashboard-panels .maintenance-dashboard-panel{grid-column:span 1!important;order:-2}
  .dashboard-panels .unit-request-dashboard-panel,.dashboard-panels .maintenance-request-dashboard-panel{grid-column:span 1!important;order:0}
  .dashboard-panels .penghuni-dashboard-panel,.dashboard-panels .kendaraan-dashboard-panel{grid-column:span 1!important;order:1}
}
@media(max-width:760px){
  .dashboard-panels{grid-template-columns:1fr}
  .dashboard-panels .monthly-chart-panel,.dashboard-panels .maintenance-dashboard-panel,.dashboard-panels .unit-request-dashboard-panel,.dashboard-panels .maintenance-request-dashboard-panel,.dashboard-panels .penghuni-dashboard-panel,.dashboard-panels .kendaraan-dashboard-panel{grid-column:1!important}
}

/* V332 - Dashboard: Penghuni Terbaru sejajar dengan Unit Request; Maintenance sejajar dengan Kendaraan */
@media(min-width:1201px){
  .dashboard-panels .monthly-chart-panel{grid-column:1 / span 6!important;grid-row:auto!important;order:1!important}
  .dashboard-panels .maintenance-dashboard-panel{grid-column:7 / span 4!important;grid-row:auto!important;order:2!important}
  .dashboard-panels .unit-request-dashboard-panel{grid-column:1 / span 5!important;grid-row:auto!important;order:3!important}
  .dashboard-panels .penghuni-dashboard-panel{grid-column:6 / span 5!important;grid-row:auto!important;order:4!important}
  .dashboard-panels .maintenance-request-dashboard-panel{grid-column:1 / span 5!important;grid-row:auto!important;order:5!important}
  .dashboard-panels .kendaraan-dashboard-panel{grid-column:6 / span 5!important;grid-row:auto!important;order:6!important}
}

/* V333 - Sidebar group titles: polished theme-aware buttons */
aside .nav-group{margin:7px 10px 9px;width:calc(100% - 20px)}
aside .nav-group-toggle{
  position:relative;
  min-height:46px;
  padding:0 12px;
  gap:10px;
  border:1px solid rgba(255,255,255,.20);
  border-radius:13px;
  background:linear-gradient(135deg,var(--theme-accent),var(--theme-dark));
  color:#fff!important;
  box-shadow:0 5px 14px var(--theme-shadow),inset 0 1px 0 rgba(255,255,255,.20);
  transition:transform .18s ease,box-shadow .18s ease,filter .18s ease,background .18s ease;
  overflow:hidden;
}
aside .nav-group-toggle::before{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(110deg,rgba(255,255,255,.14),transparent 45%,rgba(255,255,255,.05));
  pointer-events:none;
}
aside .nav-group-toggle:hover{
  background:linear-gradient(135deg,var(--theme-dark-2),var(--theme-accent));
  transform:translateY(-1px);
  box-shadow:0 8px 20px var(--theme-shadow),inset 0 1px 0 rgba(255,255,255,.24);
  filter:saturate(1.08);
}
aside .nav-group-toggle:active{transform:translateY(0);box-shadow:0 4px 11px var(--theme-shadow)}
aside .nav-group-toggle:focus-visible{outline:2px solid rgba(255,255,255,.9);outline-offset:2px}
aside .nav-group-toggle .nav-icon,
aside .nav-group-toggle .nav-label,
aside .nav-group-toggle .nav-group-chevron{position:relative;z-index:1}
aside .nav-group-toggle .nav-icon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:27px;
  height:27px;
  flex:0 0 27px;
  border-radius:8px;
  background:rgba(255,255,255,.16);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.18);
}
aside .nav-group-toggle .nav-icon svg{width:17px;height:17px}
aside .nav-group-toggle .nav-label{
  font-size:11px;
  font-weight:850;
  letter-spacing:.65px;
  text-transform:uppercase;
  text-shadow:0 1px 2px rgba(0,0,0,.16);
}
aside .nav-group-toggle .nav-group-chevron{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:23px;
  height:23px;
  margin-left:auto;
  margin-right:0;
  border-radius:7px;
  background:rgba(255,255,255,.12);
  font-size:14px;
  opacity:1;
  transition:transform .2s ease,background .18s ease;
}
aside .nav-group.is-open .nav-group-toggle .nav-group-chevron{background:rgba(255,255,255,.20)}
aside .nav-submenu{
  margin:5px 2px 0;
  padding:3px 0 4px;
  border-left:2px solid rgba(255,255,255,.20);
}
aside .nav-submenu>a{margin:2px 0 2px 7px;min-height:38px;padding-left:10px;border-radius:9px}
aside .nav-submenu>a:hover{background:rgba(255,255,255,.10)}

@media(max-width:760px){
  aside .nav-group{margin:0;width:auto}
  aside .nav-group-toggle{min-height:40px;padding:0 10px;border-radius:11px}
  aside .nav-group-toggle .nav-label{font-size:10px}
  aside .nav-submenu{border-left:0;margin-top:2px}
}


/* V334 - Dashboard Total Request & Total Maintenance cards */
.card-cyan{background:linear-gradient(135deg,#0891b2,#0e7490)}
.card-teal{background:linear-gradient(135deg,#0f766e,#115e59)}
@media(min-width:1201px){
  .dashboard-cards{grid-template-columns:repeat(5,minmax(0,1fr))}
  .dashboard-request-card{grid-column:1;grid-row:2}
  .dashboard-maintenance-card{grid-column:2;grid-row:2}
}
@media(max-width:1200px){
  .dashboard-request-card,.dashboard-maintenance-card{grid-column:auto;grid-row:auto}
}

/* V338 - RUANG STOK inventory module integrated with the V337 theme. */
.stock-module{position:relative;z-index:1}
.stock-module .card,
.stock-module .dashboard-panel,
.stock-module .modal-content{border-color:var(--theme-border,#e7e1f2);box-shadow:0 5px 18px var(--theme-shadow,rgba(70,40,120,.10))}
.stock-module .card-header{background:var(--theme-accent-soft,#f0eaff)!important;color:var(--theme-text,#2b2350)!important;border-bottom-color:var(--theme-border,#e7e1f2)!important}
.stock-module .table{margin-bottom:0;color:var(--theme-text,#2b2350)}
.stock-module .table thead th{background:var(--theme-accent-soft,#f0eaff);color:var(--theme-text,#2b2350);border-bottom-color:var(--theme-border,#e7e1f2)}
.stock-module .table td,.stock-module .table th{vertical-align:middle}
.stock-module .form-control,.stock-module .form-select,.stock-module textarea{border-color:var(--theme-border,#ddd5ec)}
.stock-module .form-control:focus,.stock-module .form-select:focus,.stock-module textarea:focus{border-color:var(--theme-accent,#6d4aff);box-shadow:0 0 0 .2rem color-mix(in srgb,var(--theme-accent,#6d4aff) 15%,transparent)}
.stock-module .btn-success{background:linear-gradient(135deg,#16a34a,#15803d);border-color:transparent}
.stock-module .btn-outline-primary{color:var(--theme-accent,#6d4aff);border-color:var(--theme-accent,#6d4aff)}
.stock-module .btn-outline-primary:hover{background:var(--theme-accent,#6d4aff);color:#fff}
.stock-module .stat-card{border:0;color:#fff}
.stock-module .stat-icon{font-size:2rem;opacity:.85}
.stock-module .bg-brand{background:linear-gradient(135deg,var(--theme-accent,#6d4aff),var(--theme-dark-2,#4c2ab8))!important}
.stock-module .bg-brand-dark{background:linear-gradient(135deg,var(--theme-dark-2,#4c2ab8),var(--theme-accent,#6d4aff))!important}
.stock-module .product-thumb,.stock-module .product-thumb-placeholder,.stock-module .product-photo-preview{border-color:var(--theme-border,#ddd5ec)}
/* RUANG STOK: compact product photos */
.stock-module .product-thumb,
.stock-module .product-thumb-placeholder {
  width: 52px !important;
  height: 52px !important;
  max-width: 52px !important;
  max-height: 52px !important;
  object-fit: cover;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  border-radius: 8px;
  border: 1px solid var(--theme-border,#ddd5ec);
}
.stock-module .product-thumb { cursor: zoom-in; }
.stock-module .product-photo-preview {
  width: 90px !important;
  height: 90px !important;
  max-width: 90px !important;
  max-height: 90px !important;
  object-fit: cover;
  display: block;
  overflow: hidden;
  border-radius: 8px;
  border: 1px solid var(--theme-border,#ddd5ec);
}
#photoViewImg {
  max-width: min(520px, 80vw) !important;
  max-height: 65vh !important;
  width: auto !important;
  height: auto !important;
  object-fit: contain;
}

.stock-module .low-stock{background:color-mix(in srgb,#facc15 18%,var(--theme-surface,#fff))!important}
.stock-module .dashboard-panel-header{background:linear-gradient(135deg,var(--theme-dark-2,#4c2ab8),var(--theme-accent,#6d4aff))!important;color:#fff!important}
.stock-module .dashboard-panel-header>div,.stock-module .dashboard-panel-header>div i,.stock-module .dashboard-panel-header .panel-subtitle{color:#fff!important}
.stock-module .pagination .page-link{color:var(--theme-accent,#6d4aff);border-color:var(--theme-border,#ddd5ec)}
.stock-module .pagination .page-item.active .page-link{background:var(--theme-accent,#6d4aff);border-color:var(--theme-accent,#6d4aff);color:#fff}
.stock-module .alert{border-radius:12px}
@media(max-width:900px){.stock-module .table-responsive{border-radius:10px}.stock-module .card-body{padding:1rem}}

/* V365 - dashboard stock boxes positioned under Penyewa, Penghuni and Kendaraan */
.dashboard-cards .dashboard-stock-box{min-height:118px;border-radius:12px;padding:20px 22px;display:flex;align-items:center;box-shadow:0 8px 24px rgba(36,21,91,.18),0 2px 6px rgba(36,21,91,.10);color:#fff}
.dashboard-cards .dashboard-stock-box .dashboard-stock-copy{display:flex;flex-direction:column;gap:3px}
.dashboard-cards .dashboard-stock-icon{flex:0 0 48px;width:48px;height:48px;margin-right:16px;opacity:.95}
.dashboard-cards .dashboard-stock-icon svg{width:48px;height:48px}
.dashboard-cards .dashboard-stock-title{font-size:14px;font-weight:500;line-height:1.2}
.dashboard-cards .dashboard-stock-copy strong{font-size:32px;line-height:1.05;font-weight:800}
.dashboard-cards .dashboard-stock-copy small{font-size:13px;font-weight:600;opacity:.9}
.dashboard-cards .stock-in-box{grid-column:3;background:linear-gradient(135deg,#d39b00,#b87900)}
.dashboard-cards .stock-out-box{grid-column:4;background:linear-gradient(135deg,#d24a9b,#ad2f7a)}
.dashboard-cards .stock-adjust-box{grid-column:5;background:linear-gradient(135deg,#6f4bb8,#50328f)}

@media(max-width:1200px){
  .dashboard-cards .dashboard-stock-box{grid-column:auto}
}

/* V390 - dashboard activity total boxes with clear category colors */
.chart-total-summary{gap:10px;margin:0 0 14px}
.chart-total-item{position:relative;min-height:58px;padding:10px 11px 9px 14px;border:1px solid transparent;border-radius:10px;box-shadow:0 2px 8px rgba(40,30,60,.06);overflow:hidden}
.chart-total-item::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;border-radius:10px 0 0 10px}
.chart-total-item span{font-size:11px;font-weight:600}
.chart-total-item strong{margin-top:4px;font-size:21px}
.chart-total-paket-in{background:#f3edff;border-color:#ddd0f8}.chart-total-paket-in::before{background:#6240c4}.chart-total-paket-in span,.chart-total-paket-in strong{color:#50339f}
.chart-total-paket-out{background:#edf5ff;border-color:#cfe0f7}.chart-total-paket-out::before{background:#3179d8}.chart-total-paket-out span,.chart-total-paket-out strong{color:#245ea9}
.chart-total-parkir-in{background:#ecfaf4;border-color:#ccebdd}.chart-total-parkir-in::before{background:#1c9d6f}.chart-total-parkir-in span,.chart-total-parkir-in strong{color:#147553}
.chart-total-parkir-out{background:#fff5e9;border-color:#f3dcc0}.chart-total-parkir-out::before{background:#e98a28}.chart-total-parkir-out span,.chart-total-parkir-out strong{color:#ad6117}
@media(max-width:760px){.chart-total-summary{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.chart-total-item{padding:9px 9px 8px 12px}.chart-total-item strong{font-size:19px}}


/* V391 - package and parking activity series in dashboard chart */
.line-paket-in .line-path{stroke:#7b52c8}.line-paket-in .line-point{fill:#7b52c8}
.line-paket-out .line-path{stroke:#3f83d8}.line-paket-out .line-point{fill:#3f83d8}
.line-parkir-in .line-path{stroke:#25a574}.line-parkir-in .line-point{fill:#25a574}
.line-parkir-out .line-path{stroke:#e29a3b}.line-parkir-out .line-point{fill:#e29a3b}
.legend-paket-in{background:#7b52c8}.legend-paket-out{background:#3f83d8}.legend-parkir-in{background:#25a574}.legend-parkir-out{background:#e29a3b}
.chart-legend{display:flex;flex-wrap:wrap;gap:7px 12px}
.chart-legend>span{font-size:9px;white-space:nowrap}

/* V407 top bar forum icon - force white */
.top .topright a.top-forum-btn .top-forum-icon svg,.top .topright a.top-forum-btn .top-forum-icon svg path{fill:none!important;stroke:#fff!important;color:#fff!important;}
.top .topright a.top-forum-btn,.top .topright a.top-forum-btn span{color:#fff!important;}
/* V408 - Forum top-bar icon must stay white. */
.top-forum-btn .top-forum-icon svg,.top-forum-btn .top-forum-icon svg *{fill:none!important;stroke:#fff!important;color:#fff!important;}
.vehicle-photo-actions{margin:8px 0 10px;display:flex;align-items:center;gap:8px}.vehicle-photo-actions .btn{font-size:12px;padding:7px 11px}.vehicle-photo-actions .btn.danger{color:#fff}
.ai-photo-tools{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:8px}.ai-photo-btn{font-weight:700}.ai-photo-tools .muted{font-size:12px}

/* V450 theme swatches */
.teal-dot{background:linear-gradient(135deg,#075e67,#0c9aa5)}.green-dot{background:linear-gradient(135deg,#185c37,#2f9b61)}.crimson-dot{background:linear-gradient(135deg,#741f35,#c83e5c)}.navy-dot{background:linear-gradient(135deg,#172b4d,#3b73b9)}.cyan-dot{background:linear-gradient(135deg,#075985,#089ec0)}.indigo-dot{background:linear-gradient(135deg,#30308f,#5b5bd6)}.violet-dot{background:linear-gradient(135deg,#5b218c,#984dcc)}.magenta-dot{background:linear-gradient(135deg,#861b62,#cf489b)}.coral-dot{background:linear-gradient(135deg,#9a3d2b,#e66c4a)}.gold-dot{background:linear-gradient(135deg,#795514,#bd8a22)}.slate-dot{background:linear-gradient(135deg,#334155,#64748b)}.black-dot{background:linear-gradient(135deg,#171717,#52525b)}.coffee-dot{background:linear-gradient(135deg,#4b2e24,#9b6a43)}.forest-dot{background:linear-gradient(135deg,#17452e,#42885c)}.aqua-dot{background:linear-gradient(135deg,#075e73,#18a9bd)}
.theme-menu{max-height:70vh;overflow-y:auto}

/* V504 - Sidebar navigation cleanup: clean, compact and consistent links. */
aside{scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.24) transparent;}
aside::-webkit-scrollbar{width:5px}
aside::-webkit-scrollbar-track{background:transparent}
aside::-webkit-scrollbar-thumb{background:rgba(255,255,255,.22);border-radius:8px}
aside>a{min-height:42px!important;margin:2px 10px!important;padding:0 12px!important;border:1px solid transparent!important;border-radius:10px!important;box-sizing:border-box;transition:background .16s ease,color .16s ease,transform .16s ease,box-shadow .16s ease}
aside>a .nav-icon{width:24px!important;min-width:24px;display:inline-flex;align-items:center;justify-content:center}
aside>a .nav-icon svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
aside>a .nav-label{font-size:12px;font-weight:650;letter-spacing:.15px}
aside>a:hover{background:rgba(255,255,255,.10)!important;color:#fff!important;transform:none!important}
aside>a.nav-active{background:rgba(255,255,255,.15)!important;border-color:rgba(255,255,255,.18)!important;color:#fff!important;box-shadow:inset 3px 0 0 rgba(255,255,255,.88)}
aside>.nav-group{margin:5px 10px 6px!important;width:calc(100% - 20px)!important}
aside .nav-group-toggle{min-height:42px!important;padding:0 11px!important;gap:9px;border:1px solid rgba(255,255,255,.13)!important;border-radius:10px!important;background:rgba(255,255,255,.055)!important;box-shadow:none!important;transform:none!important;filter:none!important}
aside .nav-group-toggle::before{display:none!important}
aside .nav-group-toggle:hover{background:rgba(255,255,255,.11)!important;border-color:rgba(255,255,255,.20)!important;box-shadow:none!important;transform:none!important}
aside .nav-group-toggle .nav-icon{width:25px!important;height:25px!important;flex:0 0 25px;border-radius:7px;background:rgba(255,255,255,.10);box-shadow:none}
aside .nav-group-toggle .nav-label{font-size:11px!important;font-weight:800!important;letter-spacing:.5px!important}
aside .nav-group-toggle .nav-group-chevron{width:21px;height:21px;background:transparent!important;font-size:13px}
aside .nav-submenu{margin:3px 4px 5px!important;padding:3px 0 3px 7px!important;border-left:1px solid rgba(255,255,255,.18)!important}
aside .nav-submenu>a{min-height:36px!important;margin:1px 0!important;padding:0 9px!important;border-radius:8px!important;color:rgba(255,255,255,.84)!important;gap:8px;box-sizing:border-box}
aside .nav-submenu>a .nav-icon{width:22px!important;min-width:22px;transform:none!important;display:inline-flex;align-items:center;justify-content:center}
aside .nav-submenu>a .nav-icon svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
aside .nav-submenu>a .nav-label{font-size:11px!important;font-weight:600!important;letter-spacing:.05px}
aside .nav-submenu>a:hover{background:rgba(255,255,255,.09)!important;color:#fff!important}
aside .nav-submenu>a.nav-active{background:rgba(255,255,255,.13)!important;color:#fff!important;box-shadow:inset 2px 0 0 rgba(255,255,255,.78)}
aside .pm-sidebar-box{margin:9px 10px 11px!important;padding:11px!important;border-radius:10px!important;background:rgba(255,255,255,.075)!important;border:1px solid rgba(255,255,255,.13)!important;box-shadow:none!important}
aside .pm-sidebar-title{color:#fff!important;font-size:12px!important}
aside .pm-sidebar-form label{color:rgba(255,255,255,.72)!important}
aside .sidebar-credit{margin:8px 10px 4px!important;text-align:center;opacity:.65;font-size:10px}
@media(max-width:760px){aside>a{margin:0!important;min-height:40px!important;padding:0 10px!important}aside>.nav-group{margin:0!important;width:auto!important}aside .nav-group-toggle{min-height:40px!important}aside .nav-submenu{padding-left:0!important}aside .pm-sidebar-box{margin:8px 0!important}}

/* V511 - PM Admin sidebar box aligned to the exact width of sidebar links. */
aside .pm-sidebar-box{width:100%!important;box-sizing:border-box!important;margin:0 0 8px!important;}
@media(max-width:900px){aside .pm-sidebar-box{width:100%!important;margin:0 0 8px!important;}}


/* V514 — Premium adaptive brand: transparent logo artwork stays independent from site themes. */
.premium-site-logo{
  display:flex!important;align-items:center;justify-content:center;
  width:168px;height:78px;padding:4px 8px;
  border-radius:15px;text-decoration:none!important;
  background:linear-gradient(135deg,rgba(255,255,255,.12),rgba(255,255,255,.035));
  border:1px solid rgba(255,255,255,.20);
  box-shadow:0 8px 24px rgba(0,0,0,.16),inset 0 1px 0 rgba(255,255,255,.16);
  backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  transition:transform .18s ease,box-shadow .18s ease,background .18s ease;
}
.premium-site-logo:hover{transform:translateY(-1px);box-shadow:0 10px 28px rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.20);background:linear-gradient(135deg,rgba(255,255,255,.17),rgba(255,255,255,.05));}
.premium-site-logo img{display:block;width:100%;height:100%;object-fit:contain;object-position:center;filter:drop-shadow(0 2px 5px rgba(0,0,0,.28));}
.brand{gap:0!important;}
/* The top bar is always a dark theme surface, giving the transparent artwork stable contrast. */
html[data-theme] .premium-site-logo{background:linear-gradient(135deg,rgba(255,255,255,.13),rgba(255,255,255,.035));border-color:rgba(255,255,255,.22);}
@media(max-width:760px){
  .premium-site-logo{width:122px;height:66px;padding:3px 6px;border-radius:12px;}
  .premium-site-logo img{filter:drop-shadow(0 2px 4px rgba(0,0,0,.30));}
}

/* Premium login treatment: the same transparent logo remains legible over every background image. */
.login-logo{padding:7px 12px;border-radius:16px;background:rgba(255,255,255,.18);border:1px solid rgba(255,255,255,.42);box-shadow:0 10px 28px rgba(0,0,0,.14),inset 0 1px 0 rgba(255,255,255,.38);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);}
.login-logo img{width:190px!important;max-height:118px!important;filter:drop-shadow(0 3px 7px rgba(0,0,0,.24));}
@media(max-width:900px){.login-logo img{width:170px!important;max-height:106px!important;}}


/* V516 — VISIBLE CINEMATIC LOGIN INTRO. Repeating moon, lightning, lamp flashes and ambient light. */
.login-page .login-atmosphere{position:absolute;inset:0;z-index:1;pointer-events:none;overflow:hidden;}
.login-page .loginbox,.login-page .login-quote{z-index:4;}
.login-page .login-atmosphere>*{position:absolute;pointer-events:none;}

/* A real visual moon overlay so the moon can move independently of the photo. */
.intro-moon{left:22%;top:7%;width:118px;height:118px;border-radius:50%;
  background:radial-gradient(circle at 38% 34%,#fffef0 0 12%,#f8efc8 36%,#d8cfaa 68%,#b8af90 100%);
  box-shadow:0 0 18px 7px rgba(255,245,202,.52),0 0 65px 22px rgba(255,225,145,.18);
  opacity:.92;animation:introMoonMove 11s ease-in-out infinite;mix-blend-mode:screen;}
.intro-moon::after{content:"";position:absolute;inset:10%;border-radius:50%;opacity:.28;
  background:radial-gradient(circle at 30% 25%,rgba(110,100,80,.35) 0 5%,transparent 6%),
             radial-gradient(circle at 66% 48%,rgba(110,100,80,.26) 0 8%,transparent 9%),
             radial-gradient(circle at 42% 72%,rgba(110,100,80,.22) 0 6%,transparent 7%);}

/* Broad full-screen flashes make the lightning unmistakable without replacing the background. */
.intro-flash{inset:0;background:rgba(235,244,255,.88);opacity:0;mix-blend-mode:screen;animation:introFlash 8s linear infinite;}
.intro-lightning{inset:0;opacity:0;background-repeat:no-repeat;background-size:100% 100%;mix-blend-mode:screen;}
.intro-lightning-a{background-image:linear-gradient(112deg,transparent 0 47.7%,rgba(220,235,255,0) 48%,rgba(245,250,255,.98) 48.25%,rgba(220,235,255,.28) 48.45%,transparent 48.8%);animation:introLightningA 8s linear infinite;}
.intro-lightning-b{background-image:linear-gradient(76deg,transparent 0 66.5%,rgba(220,235,255,0) 67%,rgba(255,255,255,.9) 67.25%,rgba(210,230,255,.2) 67.55%,transparent 68%);animation:introLightningB 11s linear infinite 2.5s;}

/* Visible branching bolt overlays. */
.intro-lightning-bolt{width:42vw;height:58vh;top:2%;opacity:0;mix-blend-mode:screen;filter:drop-shadow(0 0 7px rgba(225,240,255,.95));
  background:rgba(240,248,255,.98);clip-path:polygon(55% 0,47% 26%,55% 23%,42% 49%,49% 45%,35% 74%,44% 69%,31% 100%,54% 67%,47% 70%,63% 43%,55% 47%,70% 21%,61% 25%);}
.intro-bolt-a{left:4%;transform:rotate(7deg);animation:introBoltA 8s linear infinite;}
.intro-bolt-b{right:0;transform:scaleX(-1) rotate(3deg);animation:introBoltB 11s linear infinite 2.5s;}

/* Warm lamp pulses, positioned across the building so they feel attached to the photo. */
.intro-lamp{width:150px;height:150px;border-radius:50%;background:radial-gradient(circle,rgba(255,219,145,.58) 0,rgba(255,184,82,.24) 25%,rgba(255,166,63,0) 68%);filter:blur(10px);opacity:.45;mix-blend-mode:screen;}
.intro-lamp-a{left:48%;top:18%;animation:introLamp 2.7s ease-in-out infinite;}
.intro-lamp-b{left:55%;top:27%;animation:introLamp 3.4s ease-in-out infinite .5s;}
.intro-lamp-c{left:63%;top:36%;animation:introLamp 2.2s ease-in-out infinite 1.1s;}
.intro-lamp-d{left:74%;top:45%;animation:introLamp 3.1s ease-in-out infinite .2s;}
.intro-sheen{inset:-20%;background:radial-gradient(ellipse at 50% 45%,rgba(255,235,183,.10),transparent 48%);opacity:.35;animation:introSheen 7s ease-in-out infinite;}
.login-page.intro-stopped .login-atmosphere>*{animation-play-state:paused!important;}
.login-page.intro-stopped .login-atmosphere{opacity:.92;transition:opacity .6s ease;}

@keyframes introMoonMove{0%,100%{transform:translate3d(0,0,0) scale(.92);opacity:.78}25%{transform:translate3d(22px,8px,0) scale(1)}50%{transform:translate3d(48px,20px,0) scale(1.07);opacity:1}75%{transform:translate3d(25px,10px,0) scale(.98)}}
@keyframes introFlash{0%,36%,37.2%,38%,69%,70.1%,71%,100%{opacity:0}36.4%{opacity:.22}36.7%{opacity:.78}37%{opacity:.08}37.5%{opacity:.52}37.8%{opacity:0}69.4%{opacity:.18}69.7%{opacity:.72}70%{opacity:.05}70.5%{opacity:.4}}
@keyframes introLightningA{0%,67%,71%,100%{opacity:0}68%{opacity:.92}68.7%{opacity:.12}69.4%{opacity:.78}70%{opacity:.08}}
@keyframes introLightningB{0%,54%,58%,100%{opacity:0}55%{opacity:.72}55.8%{opacity:.05}56.5%{opacity:.64}57.2%{opacity:.08}}
@keyframes introBoltA{0%,35%,39%,100%{opacity:0}36.2%{opacity:.9}36.8%{opacity:.08}37.5%{opacity:.72}38.1%{opacity:0}}
@keyframes introBoltB{0%,54%,58%,100%{opacity:0}55%{opacity:.82}55.6%{opacity:.06}56.5%{opacity:.68}57.1%{opacity:0}}
@keyframes introLamp{0%,100%{opacity:.28;transform:scale(.82)}48%{opacity:.95;transform:scale(1.15)}54%{opacity:.28;transform:scale(.88)}60%{opacity:.78;transform:scale(1.08)}}
@keyframes introSheen{0%,100%{transform:translate3d(-2%,0,0);opacity:.18}50%{transform:translate3d(2%,1%,0);opacity:.42}}
@media(max-width:900px){
 .intro-moon{left:18%;top:6%;width:86px;height:86px;}
 .intro-lightning-bolt{width:55vw;height:48vh;}
 .intro-lamp-a{left:44%;top:17%;}.intro-lamp-b{left:56%;top:26%;}.intro-lamp-c{left:68%;top:38%;}.intro-lamp-d{left:78%;top:49%;}
}
@media(prefers-reduced-motion:reduce){
 .intro-moon,.intro-lightning,.intro-lightning-bolt,.intro-lamp,.intro-sheen,.intro-flash{animation:none!important;}
}

/* V517 — Login intro trigger fix: intro stays active until Enter/submit. */
.login-page.intro-active .login-atmosphere{opacity:1;}
.login-page.intro-active .intro-moon{will-change:transform,opacity;}
.login-page.intro-active .intro-flash{z-index:1;}
.login-page.intro-active .intro-lightning,
.login-page.intro-active .intro-lightning-bolt{z-index:2;}
.login-page.intro-active .intro-lamp{z-index:1;}
/* Make the ambient effects visibly read against bright and dark photo areas. */
.login-page.intro-active .intro-sheen{mix-blend-mode:screen;}
@media(max-width:900px){
 .login-page .login-atmosphere{inset:0;}
}

/* V518 — Full-screen luxury login: centered smoked-glass portal, gold branding, adaptive theme-safe composition */
.login-page,.login-page body{background:#050607!important;}
.login-page .login{position:relative;isolation:isolate;min-height:100svh;height:100svh;width:100%;padding:0;display:flex;align-items:center;justify-content:center;overflow:hidden;background-image:linear-gradient(180deg,rgba(2,4,9,.18),rgba(2,4,9,.28)),linear-gradient(90deg,rgba(2,4,9,.18),rgba(2,4,9,.06) 48%,rgba(2,4,9,.20)),url("login-background.jpeg");background-size:cover;background-position:center center;}
.login-page .login:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 50% 43%,rgba(255,209,124,.08),transparent 31%),linear-gradient(180deg,rgba(0,0,0,.03),rgba(0,0,0,.32));pointer-events:none;z-index:0;}
.login-page .loginbox{z-index:8;width:min(548px,calc(100vw - 36px));max-height:calc(100svh - 54px);overflow:auto;padding:42px 44px 30px;border:1px solid rgba(255,219,153,.72);border-radius:24px;background:linear-gradient(145deg,rgba(10,13,16,.74),rgba(15,15,15,.54));box-shadow:0 30px 90px rgba(0,0,0,.56),inset 0 1px 0 rgba(255,255,255,.16),0 0 38px rgba(223,171,83,.12);backdrop-filter:blur(13px) saturate(125%);-webkit-backdrop-filter:blur(13px) saturate(125%);text-align:center;}
.login-page .loginbox:before{content:"";position:absolute;inset:1px;border-radius:23px;border:1px solid rgba(255,236,192,.12);pointer-events:none;}
.login-logo{display:flex;justify-content:center;align-items:center;margin:0 auto 18px;line-height:0;height:196px;filter:drop-shadow(0 9px 20px rgba(0,0,0,.5));}.login-logo img{display:block;width:min(390px,86%);height:auto;max-height:190px;object-fit:contain;}
.login-page .loginbox h1,.login-page .loginbox h2,.login-page .login-tagline{display:none!important;}
.login-field{position:relative;display:flex;align-items:center;background:rgba(6,8,10,.70);border:1px solid rgba(229,190,111,.74);border-radius:12px;margin:13px 0;min-height:58px;overflow:hidden;box-shadow:inset 0 1px 8px rgba(0,0,0,.35),0 5px 16px rgba(0,0,0,.18);}.login-field:focus-within{border-color:#f6d58e;box-shadow:0 0 0 2px rgba(232,190,105,.13),0 7px 22px rgba(0,0,0,.25)}.login-field span{width:52px;color:#e7c477;font-size:22px;flex:none}.login-field input{flex:1!important;width:auto!important;margin:0!important;border:0!important;outline:0;padding:15px 12px!important;background:transparent!important;color:#f7ead0!important;font-size:16px!important}.login-field input::placeholder{color:rgba(238,225,204,.58)}.password-toggle{border:0;background:transparent;color:#dfbb70;font-size:18px;padding:0 18px;cursor:pointer;}
.remember{color:#e5d7bb!important;font-size:14px;margin:15px 0 18px;}.remember input{accent-color:#c9984d;width:18px;height:18px;}
.login-page .login-btn{height:58px;border:1px solid rgba(255,235,190,.82);border-radius:12px;background:linear-gradient(135deg,#f2d28e 0%,#c79243 48%,#edca7d 100%);color:#17130c!important;font-weight:800;font-size:17px;letter-spacing:.2px;box-shadow:0 10px 28px rgba(0,0,0,.34),inset 0 1px 0 rgba(255,255,255,.7);transition:transform .2s ease,filter .2s ease,box-shadow .2s ease}.login-page .login-btn:hover{filter:brightness(1.06);transform:translateY(-2px);box-shadow:0 14px 34px rgba(0,0,0,.38),0 0 24px rgba(230,185,99,.16)}.login-page .login-btn b{font-size:23px;margin-left:12px;font-weight:500}.login-divider{display:flex;align-items:center;gap:12px;margin:22px 12px 12px;color:#e1bd72}.login-divider span{height:1px;flex:1;background:linear-gradient(90deg,transparent,rgba(224,185,110,.7));}.login-divider span:last-child{background:linear-gradient(90deg,rgba(224,185,110,.7),transparent)}.login-divider em{font-style:normal;font-size:15px}.login-footer{border:0!important;margin:0!important;padding:0!important;color:#d4b16b!important;font-size:11px!important;line-height:1.8!important;letter-spacing:3px}.login-footer small{font-size:10px;letter-spacing:1.6px;color:rgba(231,218,194,.55)}
.luxury-side{position:absolute;z-index:3;color:#e6c47b;letter-spacing:4px;font-size:12px;line-height:2.6;text-shadow:0 2px 12px rgba(0,0,0,.85);pointer-events:none}.luxury-side-left{left:3.8vw;top:27%;display:flex;flex-direction:column}.luxury-side-right{right:3.8vw;top:8%;text-align:right;line-height:2.1}.luxury-side i{display:block;width:58px;height:1px;background:#d8ae5d;margin-top:14px}.luxury-side-right i{margin-left:auto}.luxury-features{position:absolute;z-index:3;bottom:4.2vh;left:50%;transform:translateX(-50%);display:flex;align-items:center;justify-content:center;gap:30px;color:#ead08e;text-align:center;text-shadow:0 2px 12px rgba(0,0,0,.9);pointer-events:none}.luxury-features>div{display:flex;flex-direction:column;align-items:center;min-width:125px}.luxury-features b{font-size:29px;font-weight:400;line-height:1;margin-bottom:8px}.luxury-features span{font-size:10px;letter-spacing:2.5px;line-height:1.45}.luxury-features>i{height:55px;width:1px;background:rgba(232,198,126,.62)}
.login-page .login-atmosphere{position:absolute!important;inset:0!important;z-index:2!important;pointer-events:none!important;opacity:1!important}.login-page .intro-sheen{mix-blend-mode:screen}.login-page.intro-active .loginbox{animation:luxuryPanelBreath 5s ease-in-out infinite}.login-page.intro-stopped .loginbox{animation:none}.login-page.intro-active .intro-moon{animation:introMoonMove 18s ease-in-out infinite!important}.login-page.intro-active .intro-flash{animation:introFlash 7s linear infinite!important}.login-page.intro-active .intro-lightning-bolt{animation:introBolt 7s linear infinite!important}.login-page.intro-active .intro-lamp{animation:introLamp 3.8s ease-in-out infinite!important}.login-page.intro-active .intro-sheen{animation:introSheen 9s ease-in-out infinite!important}
@keyframes luxuryPanelBreath{0%,100%{box-shadow:0 30px 90px rgba(0,0,0,.56),inset 0 1px 0 rgba(255,255,255,.16),0 0 32px rgba(223,171,83,.10)}50%{box-shadow:0 34px 100px rgba(0,0,0,.62),inset 0 1px 0 rgba(255,255,255,.19),0 0 48px rgba(223,171,83,.20)}}
@media(max-width:1050px){.luxury-side{display:none}.luxury-features{bottom:2.4vh;gap:14px}.luxury-features>div{min-width:92px}.luxury-features span{font-size:8px;letter-spacing:1.8px}.luxury-features>i{height:42px}}
@media(max-width:700px){.login-page .login{background-position:center center}.login-page .loginbox{width:calc(100vw - 24px);max-height:calc(100svh - 18px);padding:25px 20px 20px;border-radius:20px}.login-logo{height:142px;margin-bottom:8px}.login-logo img{max-height:140px;width:88%}.login-field{min-height:54px}.login-page .login-btn{height:54px}.luxury-features{display:none}.login-footer{letter-spacing:2px}.login-divider{margin-top:17px}}
@media(prefers-reduced-motion:reduce){.login-page.intro-active .loginbox,.login-page.intro-active .intro-moon,.login-page.intro-active .intro-flash,.login-page.intro-active .intro-lightning-bolt,.login-page.intro-active .intro-lamp,.login-page.intro-active .intro-sheen{animation:none!important}}

/* V519 AUTHENTIC STORM CINEMATIC: original building photo remains the base layer. */
.login-page .login{background-image:linear-gradient(180deg,rgba(2,4,9,.10),rgba(2,4,9,.20)),linear-gradient(90deg,rgba(2,4,9,.12),rgba(2,4,9,.03) 48%,rgba(2,4,9,.16)),url("login-background.jpeg");}
.login-page .loginbox{background:linear-gradient(145deg,rgba(7,10,12,.27),rgba(10,12,14,.12));backdrop-filter:blur(9px) saturate(135%);-webkit-backdrop-filter:blur(9px) saturate(135%);border-color:rgba(255,219,153,.82);box-shadow:0 30px 90px rgba(0,0,0,.46),inset 0 1px 0 rgba(255,255,255,.18),0 0 42px rgba(223,171,83,.14);}
.login-page .loginbox:after{content:"";position:absolute;inset:0;border-radius:24px;background:linear-gradient(120deg,rgba(255,255,255,.05),transparent 30%,rgba(255,210,132,.035) 72%,transparent);pointer-events:none;mix-blend-mode:screen;}
.login-page .login-atmosphere{z-index:2!important;}
.storm-clouds{position:absolute;left:-18%;top:-9%;width:136%;height:45%;opacity:.40;filter:blur(10px);mix-blend-mode:screen;background:radial-gradient(ellipse at 18% 54%,rgba(52,67,89,.72) 0 9%,transparent 23%),radial-gradient(ellipse at 38% 30%,rgba(40,52,72,.80) 0 11%,transparent 27%),radial-gradient(ellipse at 57% 58%,rgba(49,63,83,.72) 0 12%,transparent 28%),radial-gradient(ellipse at 78% 34%,rgba(35,48,68,.82) 0 12%,transparent 29%),radial-gradient(ellipse at 91% 65%,rgba(54,67,86,.66) 0 9%,transparent 24%);will-change:transform;}
.storm-clouds-a{animation:stormCloudDriftA 30s ease-in-out infinite;}
.storm-clouds-b{top:-4%;opacity:.24;filter:blur(18px);transform:scale(1.15);animation:stormCloudDriftB 42s ease-in-out infinite reverse;}
.storm-rain{inset:0;opacity:.13;background-image:repeating-linear-gradient(105deg,transparent 0 7px,rgba(225,238,255,.38) 8px,transparent 9px 22px);background-size:170px 170px;animation:rainFall .75s linear infinite;mix-blend-mode:screen;}
.storm-lightning{inset:0;opacity:0;mix-blend-mode:screen;filter:drop-shadow(0 0 8px rgba(220,235,255,.95));}
.storm-lightning-a{background:linear-gradient(116deg,transparent 0 66.5%,rgba(255,255,255,.96) 66.8%,transparent 67.05%),linear-gradient(104deg,transparent 0 70.2%,rgba(226,239,255,.78) 70.45%,transparent 70.72%);animation:stormLightningA 9s linear infinite;}
.storm-lightning-b{background:linear-gradient(73deg,transparent 0 25.5%,rgba(255,255,255,.92) 25.8%,transparent 26.08%),linear-gradient(82deg,transparent 0 29.4%,rgba(225,238,255,.66) 29.7%,transparent 30%);animation:stormLightningB 13s linear infinite 3.4s;}
.road-reflection{position:absolute;left:0;right:0;bottom:0;height:32%;opacity:.26;background:linear-gradient(180deg,transparent 0 7%,rgba(255,198,104,.06) 18%,transparent 27%),repeating-linear-gradient(90deg,transparent 0 5%,rgba(255,196,101,.055) 6%,transparent 7% 11%),linear-gradient(180deg,rgba(255,183,86,.05),transparent 72%);filter:blur(5px);mix-blend-mode:screen;animation:reflectionPulse 4.8s ease-in-out infinite;}
@keyframes stormCloudDriftA{0%,100%{transform:translate3d(-1.5%,0,0) scale(1.02)}50%{transform:translate3d(2.5%,1.2%,0) scale(1.06)}}
@keyframes stormCloudDriftB{0%,100%{transform:translate3d(2%,1%,0) scale(1.12)}50%{transform:translate3d(-3%,-1%,0) scale(1.17)}}
@keyframes rainFall{from{background-position:0 0}to{background-position:-38px 170px}}
@keyframes stormLightningA{0%,70%,100%{opacity:0}71%{opacity:.03}71.6%{opacity:.95}72.1%{opacity:.12}72.7%{opacity:.82}73.4%{opacity:0}}
@keyframes stormLightningB{0%,61%,100%{opacity:0}62%{opacity:.9}62.4%{opacity:.08}63%{opacity:.72}63.7%{opacity:0}}
@keyframes reflectionPulse{0%,100%{opacity:.20;transform:translateY(0)}50%{opacity:.34;transform:translateY(-1px)}}
@media(prefers-reduced-motion:reduce){.storm-clouds,.storm-rain,.storm-lightning,.road-reflection{animation:none!important}}

/* V520 AUTHENTIC 4K FINAL - preserve the original property photo; static cinematic treatment only. */
.login-page .login{
  background-image:linear-gradient(180deg,rgba(2,4,9,.06),rgba(2,4,9,.14)),linear-gradient(90deg,rgba(2,4,9,.08),rgba(2,4,9,.02) 48%,rgba(2,4,9,.12)),url("login-background-4k-authentic.jpeg") !important;
  background-size:cover;background-position:center center;background-repeat:no-repeat;
}
.login-page .login-atmosphere{display:none!important;}
.login-page .loginbox{
  width:min(455px,calc(100vw - 34px));
  max-height:78svh;
  padding:27px 34px 22px;
  margin-bottom:7vh;
  transform:translateY(0);
  background:linear-gradient(145deg,rgba(8,11,13,.16),rgba(8,10,12,.08)) !important;
  border:1px solid rgba(255,219,153,.78);
  border-radius:23px;
  box-shadow:0 25px 70px rgba(0,0,0,.36),inset 0 1px 0 rgba(255,255,255,.18),0 0 32px rgba(223,171,83,.10);
  backdrop-filter:blur(6px) saturate(120%);
  -webkit-backdrop-filter:blur(6px) saturate(120%);
}
.login-page .loginbox:after{background:linear-gradient(120deg,rgba(255,255,255,.035),transparent 34%,rgba(255,210,132,.018) 72%,transparent)!important;}
.login-logo{height:150px;margin-bottom:9px;filter:drop-shadow(0 7px 15px rgba(0,0,0,.45));}
.login-logo img{width:min(300px,82%);max-height:146px;}
.login-field{min-height:55px;margin:10px 0;background:rgba(4,7,8,.55);}
.login-page .login-btn{height:55px;}
.remember{margin:12px 0 14px;}
.login-divider{margin:17px 12px 9px;}
.login-footer{line-height:1.65!important;}
.login-page.intro-active .loginbox,.login-page.intro-stopped .loginbox{animation:none!important;}
.luxury-features{z-index:6;bottom:3.1vh;gap:26px;}
.luxury-features>div{min-width:118px;}
.luxury-features>i{height:52px;}
@media(max-width:1050px){.luxury-features{bottom:2.1vh;gap:13px}.luxury-features>div{min-width:90px}}
@media(max-width:700px){
 .login-page .login{background-position:center center;}
 .login-page .loginbox{width:calc(100vw - 24px);max-height:76svh;padding:20px 18px 17px;margin-bottom:11vh;border-radius:20px;}
 .login-logo{height:118px;margin-bottom:4px}.login-logo img{max-height:115px;width:82%;}
 .login-field{min-height:52px;margin:8px 0}.login-page .login-btn{height:52px}.remember{margin:10px 0 12px}.login-divider{margin-top:14px}.luxury-features{display:none;}
}

/* V522 AUTHENTIC LUXURY REFINEMENT
   Preserve the original 4K property photograph while making the glass login panel
   significantly more transparent and keeping the feature strip unobstructed. */
.login-page .login{
  background-image:linear-gradient(180deg,rgba(2,4,9,.04),rgba(2,4,9,.10)),url("login-background-authentic-rain-4k.jpeg") !important;
  background-size:cover;
  background-position:center center;
  background-repeat:no-repeat;
}
.login-page .loginbox{
  width:min(430px,calc(100vw - 34px));
  max-height:76svh;
  margin-bottom:8.5vh;
  padding:25px 31px 20px;
  background:linear-gradient(145deg,rgba(5,8,10,.09),rgba(5,8,10,.045)) !important;
  border:1px solid rgba(255,219,153,.84);
  box-shadow:0 24px 66px rgba(0,0,0,.28),inset 0 1px 0 rgba(255,255,255,.20),0 0 30px rgba(223,171,83,.10);
  backdrop-filter:blur(3px) saturate(112%);
  -webkit-backdrop-filter:blur(3px) saturate(112%);
}
.login-page .loginbox:after{
  background:linear-gradient(120deg,rgba(255,255,255,.022),transparent 34%,rgba(255,210,132,.012) 72%,transparent) !important;
}
.login-logo{height:142px;margin-bottom:7px;}
.login-logo img{width:min(290px,82%);max-height:138px;}
.login-field{min-height:53px;margin:9px 0;background:rgba(3,6,8,.46);}
.login-page .login-btn{height:53px;}
.remember{margin:10px 0 12px;}
.login-divider{margin:14px 12px 8px;}
.luxury-features{z-index:20;bottom:2.8vh;gap:24px;}
.luxury-features>div{min-width:116px;}
.luxury-features>i{height:50px;}
@media(max-width:1050px){
  .luxury-features{bottom:2vh;gap:12px}
  .luxury-features>div{min-width:88px}
}
@media(max-width:700px){
  .login-page .loginbox{width:calc(100vw - 24px);max-height:74svh;padding:19px 17px 16px;margin-bottom:10vh;}
  .login-logo{height:112px;margin-bottom:3px}
  .login-logo img{max-height:110px;width:82%}
  .login-field{min-height:50px;margin:7px 0}
  .login-page .login-btn{height:50px}
}

/* V524 - USER-SUPPLIED AUTHENTIC LOGIN BACKGROUND
   Use the supplied rainy-night property photograph exactly as the login backdrop.
   No synthetic storm/rain/lightning overlays; keep the road reflections, building lights,
   moon and clouds from the photograph itself. */
.login-page .login{
  background-image:url("login-background-v524.jpg") !important;
  background-size:cover !important;
  background-position:center center !important;
  background-repeat:no-repeat !important;
}
.login-page .login::before{display:none !important;}
.login-page .login-atmosphere{display:none !important;}
.login-page .loginbox{
  width:min(430px,calc(100vw - 34px));
  max-height:76svh;
  margin-bottom:8.5vh;
  padding:25px 31px 20px;
  background:rgba(5,8,10,.20) !important;
  border:1px solid rgba(255,219,153,.84);
  box-shadow:0 24px 66px rgba(0,0,0,.32),inset 0 1px 0 rgba(255,255,255,.18),0 0 30px rgba(223,171,83,.10);
  backdrop-filter:blur(4px) saturate(112%);
  -webkit-backdrop-filter:blur(4px) saturate(112%);
}
.login-page .loginbox:after{display:none !important;}
.luxury-features{z-index:20;bottom:2.8vh;}
@media(max-width:700px){
  .login-page .loginbox{width:calc(100vw - 24px);max-height:74svh;padding:19px 17px 16px;margin-bottom:10vh;}
}


/* NEW PROJECT — Mobile Version entry */
.mobile-version-btn{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;height:48px;margin-top:12px;border:1px solid rgba(231,194,116,.72);border-radius:11px;background:rgba(7,10,12,.48);color:#efd28e;text-decoration:none;font-weight:700;font-size:14px;letter-spacing:.3px;box-shadow:inset 0 1px 0 rgba(255,255,255,.10),0 6px 18px rgba(0,0,0,.18);transition:transform .2s ease,background .2s ease,border-color .2s ease}
.mobile-version-btn span{font-size:17px}.mobile-version-btn:hover{transform:translateY(-1px);background:rgba(28,25,20,.68);border-color:#f2d28e}

/* NEW PROJECT — Mobile welcome page, intentionally uses the login background and luxury treatment. */
.mobile-welcome-page{min-height:100svh;margin:0;overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch;background:#050607;color:#f6e8c9}
.mobile-welcome{position:relative;isolation:isolate;min-height:100svh;width:100%;display:flex;align-items:center;align-items:safe center;justify-content:center;padding:24px 16px;background-image:linear-gradient(180deg,rgba(2,4,9,.12),rgba(2,4,9,.42)),linear-gradient(90deg,rgba(2,4,9,.16),rgba(2,4,9,.05) 50%,rgba(2,4,9,.22)),url("login-background-v524.jpg");background-size:cover;background-position:center center}
.mobile-welcome:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 50% 42%,rgba(255,211,130,.10),transparent 38%),linear-gradient(180deg,rgba(0,0,0,.04),rgba(0,0,0,.36));z-index:0;pointer-events:none}
.mobile-welcome-card{position:relative;z-index:4;width:min(520px,100%);padding:30px 22px 24px;border:1px solid rgba(255,219,153,.78);border-radius:24px;background:linear-gradient(145deg,rgba(7,10,12,.68),rgba(10,12,14,.40));box-shadow:0 25px 70px rgba(0,0,0,.55),inset 0 1px 0 rgba(255,255,255,.16),0 0 38px rgba(223,171,83,.13);backdrop-filter:blur(12px) saturate(130%);-webkit-backdrop-filter:blur(12px) saturate(130%);text-align:center}
.mobile-welcome-logo{display:flex;justify-content:center;align-items:center;height:150px;margin-bottom:8px}.mobile-welcome-logo img{width:min(330px,88%);max-height:145px;object-fit:contain;filter:drop-shadow(0 7px 16px rgba(0,0,0,.52))}
.mobile-welcome-kicker{margin:6px 0 8px;color:#e5bd6c;font-size:11px;font-weight:700;letter-spacing:3px;text-transform:uppercase}.mobile-welcome-title{margin:0;color:#fff0cf;font-size:30px;line-height:1.15;font-weight:700}.mobile-welcome-copy{margin:12px auto 24px;max-width:380px;color:rgba(244,229,202,.82);font-size:14px;line-height:1.7}
.mobile-welcome-actions{display:grid;gap:10px}.mobile-welcome-actions a{height:52px;display:flex;align-items:center;justify-content:center;border-radius:11px;text-decoration:none;font-weight:800;letter-spacing:.2px}.mobile-enter{background:linear-gradient(135deg,#f2d28e,#c79243 52%,#edca7d);color:#17130c;border:1px solid rgba(255,235,190,.82);box-shadow:0 10px 25px rgba(0,0,0,.30)}.mobile-back{background:rgba(8,10,12,.42);color:#e9ca86;border:1px solid rgba(229,190,111,.55)}
.mobile-welcome-footer{margin-top:19px;color:rgba(231,218,194,.58);font-size:10px;letter-spacing:2px;line-height:1.7}
@media(max-width:600px){.mobile-welcome{padding:14px 12px;background-position:center center}.mobile-welcome-card{padding:24px 17px 19px;border-radius:21px}.mobile-welcome-logo{height:126px}.mobile-welcome-logo img{max-height:122px;width:91%}.mobile-welcome-title{font-size:26px}.mobile-welcome-copy{font-size:13px;margin-bottom:20px}.mobile-welcome-actions a{height:50px}.mobile-welcome-footer{letter-spacing:1.5px}}
@media(prefers-reduced-motion:reduce){.mobile-version-btn{transition:none}}

.mobile-provider-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:4px}.mobile-provider{min-height:92px;border:1px solid rgba(229,190,111,.42);border-radius:13px;background:rgba(5,7,9,.48);color:#f5e7c8;cursor:pointer;padding:12px 8px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;font:inherit;transition:.18s ease}.mobile-provider:hover,.mobile-provider.selected{border-color:#efd08a;background:rgba(43,34,21,.70);box-shadow:0 8px 24px rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.1);transform:translateY(-1px)}.mobile-provider .provider-icon{font-size:24px;line-height:1;color:#f0ce83}.mobile-provider strong{font-size:13px}.mobile-provider small{font-size:10px;color:rgba(244,229,202,.62)}@media(max-width:430px){.mobile-provider-grid{grid-template-columns:1fr}.mobile-provider{min-height:72px}}

/* Mobile account choice */
.mobile-account-choice{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:0 0 9px}.mobile-account-choice-btn{border:1px solid rgba(229,190,111,.35);background:rgba(255,255,255,.045);color:#ead39b;border-radius:11px;min-height:46px;padding:8px 10px;font:inherit;font-size:12px;font-weight:800;cursor:pointer}.mobile-account-choice-btn.selected{background:rgba(229,190,111,.14);border-color:rgba(229,190,111,.75);box-shadow:0 0 0 1px rgba(229,190,111,.12) inset}.mobile-mode-hint{font-size:11px;line-height:1.5;color:rgba(244,229,202,.68);margin:0 0 13px;text-align:left}
.mobile-register-card{max-width:620px!important}
.mobile-verified-badge{display:flex;align-items:center;justify-content:center;margin:0 0 14px;padding:10px 12px;border-radius:12px;border:1px solid rgba(92,206,132,.35);background:rgba(62,143,86,.12);color:#bcecc9;font-size:11px;font-weight:900;letter-spacing:.4px}
.mobile-registration-fields{display:grid;gap:11px;text-align:left}
.mobile-reg-field label{display:block;margin:0 0 6px;color:#ead39b;font-size:11px;font-weight:900;letter-spacing:.2px}
.mobile-reg-field input,.mobile-reg-field select{width:100%;box-sizing:border-box;height:48px;border-radius:11px;border:1px solid rgba(229,190,111,.44);background:rgba(4,6,8,.58);color:#fff;padding:0 13px;font:inherit;outline:none}
.mobile-reg-field input[readonly]{background:rgba(255,255,255,.045);color:#f7e5bd;cursor:not-allowed}
.mobile-reg-field small{display:block;margin-top:5px;color:rgba(244,229,202,.56);font-size:9px;line-height:1.45}
.mobile-register-security-note{margin-top:12px;padding:11px 12px;border:1px solid rgba(229,190,111,.22);border-radius:11px;background:rgba(255,255,255,.035);color:rgba(244,229,202,.68);font-size:10px;line-height:1.55;text-align:left}

/* Mobile authentication forms: compact controls on phone-sized screens. */
@media(max-width:600px){
  .mobile-welcome-card .mobile-reg-field input,
  .mobile-welcome-card .mobile-reg-field select{
    height:24px;
    min-height:24px;
    padding:0 7px;
    border-radius:6px;
    font-size:12px;
  }
  .mobile-welcome-card .mobile-phone-row select{
    height:24px;
    min-height:24px;
    padding:0 5px;
  }
  .mobile-welcome-card .mobile-enter{
    min-height:26px;
    height:26px;
    padding:0 8px;
    border-radius:6px;
    font-size:12px;
  }
  .mobile-welcome-card .mobile-back{
    height:25px !important;
    min-height:25px;
    padding:0 8px;
    border-radius:6px !important;
    font-size:12px;
  }
}