:root{--blue:#0964db;--blue2:#06479f;--navy:#071b36;--bg:#f3f7fc;--text:#10223e;--muted:#6c7a90;--line:#dfe7f1;--green:#16a34a;--red:#ef4444;--orange:#f59e0b;--purple:#7c3aed}*{box-sizing:border-box}body{margin:0;font-family:Inter,Segoe UI,Arial,sans-serif;background:var(--bg);color:var(--text)}a{text-decoration:none;color:var(--blue)}button,input,select,textarea{font:inherit}.app-shell{display:flex;min-height:100vh}.sidebar{width:245px;background:linear-gradient(180deg,#071b36,#0b294d);color:#fff;position:fixed;left:0;top:0;bottom:0;padding:20px 14px;display:flex;flex-direction:column;z-index:20}.logo{display:flex;gap:10px;align-items:center;padding:0 10px 22px}.logo b{font-size:32px}.logo span{font-size:13px;letter-spacing:.7px}.logo strong{font-size:18px}.sidebar nav{display:grid;gap:4px}.sidebar nav a{color:#caddf6;display:flex;gap:12px;align-items:center;padding:11px 12px;border-radius:10px;font-size:14px}.sidebar nav a.active,.sidebar nav a:hover{background:var(--blue);color:#fff}.sidebar nav i{font-style:normal;width:22px;text-align:center}.sidebar-footer{margin-top:auto;border-top:1px solid #ffffff1f;padding:15px 10px;display:flex;justify-content:space-between;align-items:center}.sidebar-footer a{color:#fff}.main{margin-left:245px;width:calc(100% - 245px)}.topbar{height:70px;background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;padding:0 24px;gap:15px;position:sticky;top:0;z-index:10}.topbar small{display:block;color:var(--muted)}.menu-btn{display:none;border:0;background:none;font-size:22px}.top-actions{margin-left:auto;display:flex;align-items:center;gap:8px;color:var(--muted);font-size:13px}.license-dot{width:9px;height:9px;background:#22c55e;border-radius:50%}.avatar{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:#e1edff;font-weight:800}.content{padding:24px}.page-head{display:flex;justify-content:space-between;gap:15px;align-items:center;margin-bottom:20px}.page-head h1{margin:0;font-size:26px}.page-head p{margin:5px 0 0;color:var(--muted)}.date-chip,.badge{display:inline-flex;align-items:center;padding:6px 10px;border-radius:20px;background:#eef4ff;color:var(--blue2);font-size:12px;font-weight:700}.badge.green{background:#dcfce7;color:#15803d}.badge.gray{background:#edf0f4;color:#64748b}.badge.red{background:#fee2e2;color:#b91c1c}.badge.blue{background:#dbeafe;color:#1d4ed8}.stats-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:14px;margin-bottom:18px}.stat{background:#fff;border:1px solid var(--line);border-radius:15px;padding:16px;display:flex;gap:13px;align-items:center;box-shadow:0 5px 20px #0f376008}.stat>b{width:40px;height:40px;border-radius:12px;background:#e9f2ff;color:var(--blue);display:grid;place-items:center}.stat span{font-size:12px;color:var(--muted)}.stat strong{font-size:24px;color:var(--text);display:block;margin-top:4px}.stat.green>b{background:#dcfce7;color:var(--green)}.stat.orange>b{background:#fef3c7;color:var(--orange)}.stat.red>b{background:#fee2e2;color:var(--red)}.stat.purple>b{background:#ede9fe;color:var(--purple)}.dashboard-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr;gap:16px}.card{background:#fff;border:1px solid var(--line);border-radius:16px;padding:18px;box-shadow:0 6px 25px #173d7408}.card-title{display:flex;justify-content:space-between;align-items:center;margin-bottom:15px}.card-title h3{margin:0;font-size:16px}.card-title small,.card-title span{color:var(--muted);font-size:12px}.fake-chart{height:250px;border-left:1px solid #dbe3ee;border-bottom:1px solid #dbe3ee;position:relative;background:repeating-linear-gradient(to top,transparent 0 48px,#edf2f7 49px 50px)}.chart-line{position:absolute;left:0;right:0;bottom:40px;height:120px}.chart-line:before{content:"";position:absolute;inset:0;background:linear-gradient(165deg,transparent 0 8%,var(--blue) 9% 10%,transparent 11% 18%,var(--blue) 19% 20%,transparent 21% 33%,var(--blue) 34% 35%,transparent 36% 48%,var(--blue) 49% 50%,transparent 51% 62%,var(--blue) 63% 64%,transparent 65% 79%,var(--blue) 80% 81%,transparent 82%)}.chart-line.two{bottom:12px;transform:scaleY(.55);opacity:.6}.chart-line.two:before{filter:hue-rotate(100deg)}.chart-labels{position:absolute;left:0;right:0;bottom:-25px;display:flex;justify-content:space-between;color:var(--muted);font-size:11px}.donut{width:180px;height:180px;margin:12px auto;border-radius:50%;background:conic-gradient(#20b4e8 0 30%,#22c55e 30% 48%,#f59e0b 48% 67%,#7c3aed 67%);display:grid;place-items:center}.donut:before{content:"";width:105px;height:105px;background:#fff;border-radius:50%;position:absolute}.donut span{position:relative;text-align:center;font-size:26px;font-weight:800}.donut small{display:block;font-size:11px;color:var(--muted)}.legend{font-size:11px;display:flex;flex-wrap:wrap;gap:8px}.lg{width:8px;height:8px;border-radius:50%;display:inline-block}.lg.green{background:#22c55e}.lg.orange{background:#f59e0b}.lg.red{background:#ef4444}.activity-row{display:flex;gap:10px;padding:9px 0;border-bottom:1px solid #eef2f7;font-size:13px}.activity-row b{color:var(--blue)}.activity-row small{display:block;color:var(--muted);margin-top:3px}.section-head{display:flex;justify-content:space-between;align-items:center;margin:22px 0 12px}.section-head h2{font-size:18px}.project-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:15px}.project-card,.add-card{background:#fff;border:1px solid var(--line);border-radius:15px;overflow:hidden}.cover{height:130px;background-size:cover;background-position:center}.project-info{padding:13px}.project-info h3{margin:0 0 5px;font-size:15px}.project-info p{margin:0;color:var(--muted);font-size:12px}.project-info>div{display:flex;justify-content:space-between;margin-top:12px;font-size:11px}.project-info b{display:block;font-size:16px}.text-green{color:var(--green)}.text-red{color:var(--red)}.add-card{min-height:210px;display:grid;place-items:center;color:var(--blue);font-size:35px}.add-card span{font-size:13px;display:block}.split{display:grid;grid-template-columns:1.5fr 1fr;gap:18px}.split.wide-left{grid-template-columns:2fr 1fr}.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse;min-width:650px}th,td{text-align:left;padding:12px 10px;border-bottom:1px solid #edf1f6;font-size:13px}th{font-size:11px;text-transform:uppercase;color:var(--muted)}td small{display:block;color:var(--muted)}label{display:block;font-size:12px;font-weight:700;margin:11px 0 6px}input,select,textarea{width:100%;border:1px solid #cfdae8;border-radius:10px;padding:11px;background:#fff;color:var(--text)}textarea{resize:vertical}.btn{border:1px solid #bcd0e8;background:#fff;color:var(--blue);padding:10px 14px;border-radius:10px;font-weight:700;cursor:pointer}.btn.primary{background:var(--blue);color:#fff;border-color:var(--blue)}.btn.small{padding:6px 10px;font-size:12px}.btn.full{width:100%;margin-top:15px}.checks{display:grid;gap:8px;margin:12px 0}.checks label{font-weight:500;margin:0}.checks input{width:auto}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.status-ready{background:#dcfce7!important;color:#15803d!important}.status-booking{background:#dbeafe!important;color:#1d4ed8!important}.status-process{background:#fef3c7!important;color:#b45309!important}.status-sold{background:#fee2e2!important;color:#b91c1c!important}.status-unbuilt,.status-hold{background:#e5e7eb!important;color:#475569!important}.siteplan-layout{display:grid;grid-template-columns:3fr 1fr;gap:18px}.siteplan-canvas{position:relative;border-radius:12px;overflow:hidden;background:#dce7f5;cursor:crosshair}.siteplan-canvas>img{display:block;width:100%;max-height:70vh;object-fit:contain}.marker{position:absolute;transform:translate(-50%,-50%);border:2px solid #fff;border-radius:7px;font-size:10px;font-weight:800;display:grid;place-items:center;box-shadow:0 2px 8px #0004;min-width:38px;min-height:30px}.inline-upload{display:flex;gap:10px;align-items:end;margin-top:12px}.inline-upload input{flex:1}.status-summary{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:14px 0}.status-summary span{padding:12px;border-radius:10px;font-size:11px}.status-summary b{font-size:20px;display:block}.hint,.muted{color:var(--muted);font-size:13px}.settings-grid,.market-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:18px}.switch-row{display:flex;justify-content:space-between;align-items:center;padding:14px;border:1px solid var(--line);border-radius:12px}.switch-row input{width:22px;height:22px}.switch-row small{display:block;color:var(--muted);font-weight:400}.security-card{text-align:center}.shield,.connection-icon{width:78px;height:78px;border-radius:50%;display:grid;place-items:center;background:#e2f7e9;color:var(--green);font-size:38px;margin:10px auto}.security-card li{text-align:left;margin:8px 0}.publish-row{display:flex;justify-content:space-between;align-items:center;padding:13px 0;border-bottom:1px solid #edf1f6}.publish-row small{display:block;color:var(--muted);margin-top:3px}.connection{text-align:center}.privacy-note{background:#eff6ff;border:1px solid #bfdbfe;border-radius:12px;padding:13px;margin-top:14px;font-size:13px}.plugin-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.plugin-card{background:#fff;border:1px solid var(--line);border-radius:16px;padding:17px;display:flex;flex-direction:column}.plugin-icon{font-size:35px}.plugin-card h3{margin:10px 0 5px}.plugin-card p,.plugin-card li{font-size:12px;color:var(--muted)}.plugin-card ul{padding-left:18px;flex:1}.plugin-foot{display:flex;justify-content:space-between;align-items:center;border-top:1px solid #edf1f6;padding-top:12px}.info-list{display:grid;grid-template-columns:140px 1fr;gap:10px;font-size:13px}.info-list dt{color:var(--muted)}.info-list dd{margin:0;font-weight:700;word-break:break-all}.alert{padding:13px 15px;border-radius:11px;margin-bottom:15px}.alert.success{background:#dcfce7;color:#166534}.alert.danger{background:#fee2e2;color:#991b1b}.empty{padding:45px;text-align:center;color:var(--muted);background:#fff;border:1px dashed #b9c7d9;border-radius:15px}.mobile-nav{display:none}.login-body{min-height:100vh;display:grid;place-items:center;background:radial-gradient(circle at top left,#0c67da,#071b36 55%)}.login-shell{width:min(920px,92%);display:grid;grid-template-columns:1fr 1fr;background:#fff;border-radius:24px;overflow:hidden;box-shadow:0 30px 80px #00132866}.login-brand{background:linear-gradient(145deg,#08244a,#0964db);color:#fff;padding:55px;display:flex;flex-direction:column;justify-content:center}.login-brand .brand-mark{font-size:70px}.login-brand h1{font-size:38px;margin:10px 0}.login-brand h1 span{color:#6ee789}.login-card{padding:55px}.login-card h2{font-size:28px;margin:0}.login-card p{color:var(--muted)}
@media(max-width:1100px){.stats-grid{grid-template-columns:repeat(3,1fr)}.dashboard-grid{grid-template-columns:1fr 1fr}.activity{grid-column:1/-1}.project-grid,.plugin-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:760px){body{padding-bottom:67px}.sidebar{transform:translateX(-100%);transition:.25s;width:270px}.sidebar.open{transform:translateX(0)}.main{margin-left:0;width:100%}.menu-btn{display:block}.topbar{height:60px;padding:0 14px}.top-actions>span:not(.license-dot){display:none}.content{padding:14px}.page-head{align-items:flex-start}.page-head h1{font-size:22px}.stats-grid{grid-template-columns:repeat(2,1fr);gap:9px}.stat{padding:12px}.stat strong{font-size:20px}.dashboard-grid,.split,.split.wide-left,.siteplan-layout,.settings-grid,.market-grid{grid-template-columns:1fr}.chart-card{grid-column:auto}.fake-chart{height:210px}.project-grid,.plugin-grid{grid-template-columns:1fr}.cover{height:170px}.form-grid{grid-template-columns:1fr}.inline-upload{display:grid}.mobile-nav{position:fixed;left:0;right:0;bottom:0;height:64px;background:#fff;border-top:1px solid var(--line);display:flex;justify-content:space-around;align-items:center;z-index:15}.mobile-nav a,.mobile-nav button{border:0;background:none;color:#5d6f88;text-align:center;font-size:19px}.mobile-nav small{font-size:9px;display:block;margin-top:3px}.login-shell{grid-template-columns:1fr}.login-brand{padding:28px}.login-card{padding:28px}.login-brand h1{font-size:28px}.login-brand .brand-mark{font-size:44px}.page-head form{max-width:180px}.siteplan-canvas>img{max-height:none}.marker{font-size:7px;min-width:28px;min-height:24px}.info-list{grid-template-columns:110px 1fr}}

/* v1.3 — navigasi mengikuti struktur Rumbai Properti Management */
.logo{position:relative}.logo span small{display:block;font-size:9px;color:#a9c9ee;margin-top:4px}.sidebar-close{display:none;position:absolute;right:0;top:0;border:0;background:#ffffff18;color:#fff;width:34px;height:34px;border-radius:11px;font-size:24px}.side-nav{display:block!important;overflow-y:auto;padding-right:3px}.side-nav::-webkit-scrollbar{width:5px}.side-nav::-webkit-scrollbar-thumb{background:#ffffff30;border-radius:20px}.side-link,.side-submenu a{color:#dcecff;display:flex;align-items:center;gap:10px;border-radius:11px;font-size:13px;font-weight:700}.side-link{padding:11px 12px;margin-bottom:7px}.side-link:hover,.side-link.active,.side-submenu a:hover,.side-submenu a.active{background:#ffffff20;color:#fff;box-shadow:inset 3px 0 0 #fff}.side-link i,.side-submenu i{font-style:normal;width:23px;text-align:center}.side-group{width:100%;border:0;background:transparent;color:#bcd7f6;display:flex;justify-content:space-between;align-items:center;padding:14px 8px 8px;margin-top:3px;font-size:10.5px;font-weight:900;letter-spacing:.5px;text-align:left;cursor:pointer}.side-group small{font-size:20px;transition:.2s}.side-group.open small{transform:rotate(90deg)}.side-submenu{display:none;margin:0 0 5px 9px;padding:3px 0 4px 8px;border-left:1px solid #ffffff24}.side-submenu.open{display:grid;gap:2px}.side-submenu a{padding:9px 9px}.sidebar-footer{display:block}.sidebar-footer>div{margin-bottom:10px}.sidebar-footer b{display:block;font-size:11px;color:#9fc2e9;margin-top:3px}.sidebar-footer a{display:flex;gap:7px;color:#fecaca;background:#ef444415;padding:10px;border-radius:10px}.sidebar-backdrop{display:none}.module-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:15px}.module-card{background:#fff;border:1px solid var(--line);border-radius:16px;padding:18px}.module-card .module-icon{width:46px;height:46px;border-radius:14px;background:#eaf2ff;color:var(--blue);display:grid;place-items:center;font-size:23px}.module-card h3{margin:12px 0 6px}.module-card p{margin:0;color:var(--muted);font-size:13px}.quick-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:15px}.workflow{display:flex;gap:8px;overflow:auto;padding-bottom:6px}.workflow span{white-space:nowrap;padding:9px 12px;border:1px solid var(--line);border-radius:12px;background:#fff;font-size:12px;font-weight:800}.status-construction{background:#dbeafe!important;color:#1d4ed8!important}.status-documents{background:#fef3c7!important;color:#92400e!important}.status-sp3k{background:#ede9fe!important;color:#6d28d9!important}.status-akad{background:#cffafe!important;color:#0e7490!important}.status-cash_installment{background:#ecfccb!important;color:#3f6212!important}.status-cash_full{background:#dcfce7!important;color:#166534!important}.mini-kpi{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-bottom:16px}.mini-kpi>div{padding:14px;border:1px solid var(--line);border-radius:13px;background:#fff}.mini-kpi small{color:var(--muted)}.mini-kpi strong{display:block;font-size:21px;margin-top:4px}.document-link{display:inline-flex;align-items:center;gap:6px}.empty-state{padding:30px;border:1px dashed #b9c7d9;border-radius:14px;text-align:center;color:var(--muted)}
@media(max-width:1100px){.module-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:760px){.sidebar{position:fixed!important;height:100vh!important;overflow:hidden!important;padding-bottom:12px}.side-nav{overflow-y:auto;flex:1}.sidebar-close{display:block}.sidebar-backdrop{position:fixed;inset:0;background:#071b3699;z-index:19;opacity:0;visibility:hidden;display:block;transition:.2s}.sidebar-backdrop.show{opacity:1;visibility:visible}.menu-open{overflow:hidden}.module-grid{grid-template-columns:1fr}.mini-kpi{grid-template-columns:repeat(2,1fr)}.topbar-company{min-width:0}.topbar-company strong,.topbar-company small{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:190px}}

/* =========================================================
   v1.4 — Sidebar bersih, responsif, dan konsisten HP/PC
   ========================================================= */
:root{
    --sidebar-width:264px;
    --sidebar-bg-1:#061a35;
    --sidebar-bg-2:#0a315d;
    --sidebar-text:#dcecff;
    --sidebar-muted:#8fb3da;
    --sidebar-active:#0b6eea;
}
html{scroll-behavior:smooth}
body{overflow-x:hidden}
.app-shell{min-width:0}
.sidebar{
    width:var(--sidebar-width)!important;
    padding:0!important;
    background:linear-gradient(180deg,var(--sidebar-bg-1),var(--sidebar-bg-2))!important;
    box-shadow:12px 0 35px rgba(6,26,53,.14);
    overflow:hidden;
}
.main{margin-left:var(--sidebar-width)!important;width:calc(100% - var(--sidebar-width))!important;min-width:0}
.sidebar-brand{
    min-height:88px;
    display:flex;
    align-items:center;
    gap:10px;
    padding:16px 14px 14px;
    border-bottom:1px solid rgba(255,255,255,.09);
    flex:0 0 auto;
}
.brand-link{display:flex;align-items:center;gap:11px;min-width:0;flex:1;color:#fff!important}
.brand-mark{
    flex:0 0 43px;
    width:43px;height:43px;border-radius:14px;
    display:grid;place-items:center;
    background:linear-gradient(145deg,#1780ff,#0752b9);
    border:1px solid rgba(255,255,255,.24);
    box-shadow:0 8px 20px rgba(0,0,0,.18);
    font-size:15px;font-weight:900;letter-spacing:-.5px;
}
.brand-copy{display:block;min-width:0;line-height:1.05}
.brand-copy strong,.brand-copy b,.brand-copy small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.brand-copy strong{font-size:11px;letter-spacing:.8px;color:#b9d8fa}
.brand-copy b{font-size:19px;letter-spacing:.5px;margin-top:3px;color:#fff}
.brand-copy small{font-size:9px;margin-top:6px;color:#8fb3da;letter-spacing:.5px}
.sidebar-close{
    appearance:none!important;-webkit-appearance:none!important;
    display:none;border:0!important;background:rgba(255,255,255,.1)!important;color:#fff!important;
    width:36px;height:36px;border-radius:11px;font-size:24px;line-height:1;cursor:pointer;
}
.side-nav{
    display:block!important;
    flex:1 1 auto;
    overflow-y:auto!important;
    overflow-x:hidden;
    min-height:0;
    padding:13px 11px 20px!important;
    scrollbar-width:thin;
    scrollbar-color:rgba(255,255,255,.24) transparent;
}
.side-nav::-webkit-scrollbar{width:5px}
.side-nav::-webkit-scrollbar-thumb{background:rgba(255,255,255,.24);border-radius:999px}
.side-link,.side-submenu a{
    color:var(--sidebar-text)!important;
    display:flex!important;
    align-items:center!important;
    gap:10px!important;
    width:100%;
    border-radius:11px!important;
    text-decoration:none!important;
    font-size:13px!important;
    font-weight:650!important;
    line-height:1.25;
    min-width:0;
}
.side-link{padding:11px 12px!important;margin:0 0 8px!important}
.side-link:hover,.side-link.active,.side-submenu a:hover,.side-submenu a.active{
    color:#fff!important;
    background:linear-gradient(135deg,var(--sidebar-active),#0759c4)!important;
    box-shadow:0 7px 18px rgba(0,91,205,.24)!important;
}
.nav-icon{
    flex:0 0 27px;
    width:27px;height:27px;
    display:grid;place-items:center;
    border-radius:9px;
    background:rgba(255,255,255,.08);
    color:#ddecff;
    font-size:14px;
    font-style:normal;
}
.side-link.active .nav-icon,.side-submenu a.active .nav-icon{background:rgba(255,255,255,.17);color:#fff}
.nav-group{margin:3px 0 4px}
.nav-group-toggle{
    appearance:none!important;-webkit-appearance:none!important;
    width:100%!important;
    border:0!important;
    outline:0!important;
    box-shadow:none!important;
    background:transparent!important;
    color:var(--sidebar-muted)!important;
    padding:12px 8px 8px!important;
    margin:0!important;
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:8px!important;
    cursor:pointer!important;
    text-align:left!important;
    border-radius:10px!important;
    font-size:10.5px!important;
    font-weight:850!important;
    letter-spacing:.55px!important;
    line-height:1.25!important;
}
.nav-group-toggle:hover{background:rgba(255,255,255,.055)!important;color:#e7f2ff!important}
.nav-group-toggle>span{display:flex;align-items:center;gap:7px;min-width:0}
.nav-group-toggle>span i{font-style:normal;flex:0 0 16px;text-align:center;color:#74b5ff;font-size:13px}
.nav-group-toggle>span{white-space:normal;word-break:normal}
.nav-group-toggle small{font-size:21px;line-height:1;transition:transform .2s;color:#7da4cc}
.nav-group.open .nav-group-toggle small{transform:rotate(90deg)}
.side-submenu{
    display:none!important;
    margin:1px 0 5px 7px!important;
    padding:2px 0 4px 8px!important;
    border-left:1px solid rgba(255,255,255,.13)!important;
}
.nav-group.open>.side-submenu{display:grid!important;gap:3px!important}
.side-submenu a{padding:8px 8px!important;margin:0!important}
.side-submenu a span:last-child{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.side-submenu .nav-icon{width:24px;height:24px;flex-basis:24px;border-radius:8px;font-size:12px;background:transparent}
.sidebar-footer{
    margin:0!important;
    padding:13px 12px 15px!important;
    border-top:1px solid rgba(255,255,255,.1)!important;
    display:block!important;
    flex:0 0 auto;
    background:rgba(0,0,0,.08);
}
.sidebar-user{display:flex;align-items:center;gap:9px;min-width:0;margin-bottom:10px}
.sidebar-user-avatar{width:34px;height:34px;flex:0 0 34px;border-radius:11px;background:#e9f2ff;color:#06479f;display:grid;place-items:center;font-weight:900}
.sidebar-user>span:last-child{min-width:0}
.sidebar-user strong,.sidebar-user small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sidebar-user strong{font-size:12px;color:#fff}
.sidebar-user small{font-size:10px;color:#8fb3da;margin-top:3px}
.logout-link{display:flex!important;align-items:center;justify-content:center;gap:7px;color:#fecaca!important;background:rgba(239,68,68,.12)!important;border:1px solid rgba(248,113,113,.18);border-radius:10px;padding:9px 10px;font-size:12px;font-weight:750}
.topbar{min-width:0}
.menu-btn{appearance:none;border:0;background:#edf4ff;color:#0755b5;border-radius:10px;width:39px;height:39px;place-items:center;cursor:pointer}
.topbar-company{min-width:0}.topbar-company strong,.topbar-company small{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.license-status{display:flex;align-items:center;gap:7px}.license-status i{width:8px;height:8px;border-radius:50%;background:#22c55e;box-shadow:0 0 0 4px #dcfce7}
.page-head{min-width:0}.page-head>div{min-width:0}.page-head h1{line-height:1.2}.page-head p{line-height:1.55}
.card{min-width:0}.table-wrap{width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}
.mobile-nav a.active{color:var(--blue);font-weight:800}
.mobile-nav a span,.mobile-nav button span{display:block;font-size:18px}

/* Form dan tabel lebih konsisten */
.form-actions{display:flex;gap:9px;flex-wrap:wrap;margin-top:15px}
.btn.danger{background:#fff1f2;color:#be123c;border-color:#fecdd3}
.btn.success{background:#dcfce7;color:#166534;border-color:#bbf7d0}
.btn.warning{background:#fff7ed;color:#c2410c;border-color:#fed7aa}
.filter-bar{display:grid;grid-template-columns:minmax(180px,1fr) repeat(2,minmax(150px,220px));gap:10px;margin-bottom:14px}
.filter-bar.compact{grid-template-columns:minmax(180px,1fr) minmax(150px,220px)}
.data-actions{display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.kpi-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:16px}
.kpi-card{background:#fff;border:1px solid var(--line);border-radius:15px;padding:15px;min-width:0}
.kpi-card small{display:block;color:var(--muted);font-size:11px}.kpi-card strong{display:block;font-size:22px;margin-top:5px}.kpi-card span{font-size:11px;color:var(--muted)}
.progress-track{height:9px;background:#eaf0f7;border-radius:999px;overflow:hidden}.progress-track i{display:block;height:100%;background:linear-gradient(90deg,#0b6eea,#22c55e);border-radius:inherit}
.form-help{display:block;color:var(--muted);font-size:11px;margin-top:5px;line-height:1.45}
.inline-fields{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.file-link{display:inline-flex;align-items:center;gap:6px;font-weight:700}
.status-pending{background:#fef3c7!important;color:#92400e!important}.status-approved,.status-paid{background:#dcfce7!important;color:#166534!important}.status-rejected,.status-cancelled{background:#fee2e2!important;color:#991b1b!important}.status-draft{background:#e5e7eb!important;color:#475569!important}
.permission-table input{width:20px;height:20px}.permission-table td:not(:first-child),.permission-table th:not(:first-child){text-align:center}

@media(max-width:1100px){
    .kpi-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
    .inline-fields{grid-template-columns:1fr 1fr}
}
@media(max-width:820px){
    body{padding-bottom:68px}
    .sidebar{
        width:min(86vw,305px)!important;
        transform:translateX(-105%)!important;
        transition:transform .24s ease!important;
        height:100dvh!important;
    }
    .sidebar.open{transform:translateX(0)!important}
    .main{margin-left:0!important;width:100%!important}
    .sidebar-close{display:grid!important;place-items:center}
    .sidebar-backdrop{display:block!important;position:fixed;inset:0;background:rgba(3,17,35,.62);z-index:19;opacity:0;visibility:hidden;transition:.2s}
    .sidebar-backdrop.show{opacity:1;visibility:visible}
    .menu-open{overflow:hidden}
    .menu-btn{display:grid!important}
    .topbar{height:62px;padding:0 12px;gap:10px}
    .topbar-company strong{font-size:13px}.topbar-company small{font-size:10px;max-width:180px}
    .license-status{display:none}
    .content{padding:13px}
    .page-head{display:block;margin-bottom:15px}.page-head h1{font-size:21px}.page-head>.btn,.page-head>form,.page-head>.date-chip{margin-top:10px;width:100%;max-width:none}
    .page-head form select{width:100%}
    .split,.split.wide-left,.settings-grid,.market-grid,.siteplan-layout{grid-template-columns:1fr!important}
    .filter-bar,.filter-bar.compact{grid-template-columns:1fr}
    .inline-fields{grid-template-columns:1fr}
    .card{padding:14px;border-radius:14px}
    .table-wrap table{min-width:720px}
    .mobile-nav{height:65px;padding-bottom:env(safe-area-inset-bottom)}
}
@media(max-width:520px){
    .stats-grid,.kpi-grid,.mini-kpi{grid-template-columns:repeat(2,minmax(0,1fr))!important}
    .stat{display:block}.stat>b{margin-bottom:8px}.stat strong{font-size:19px}
    .top-actions .avatar{width:34px;height:34px}
    .brand-copy b{font-size:18px}
}
.real-bar-chart{height:205px;display:flex;align-items:flex-end;justify-content:space-around;gap:12px;padding:20px 10px 8px;border-bottom:1px solid var(--line);background:repeating-linear-gradient(to top,transparent 0 39px,#edf2f7 40px)}.month-bar{height:100%;flex:1;min-width:34px;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;gap:5px}.bar-pair{height:155px;display:flex;align-items:flex-end;gap:5px}.bar-pair i{width:12px;min-height:4px;border-radius:6px 6px 2px 2px;display:block}.booking-bar{background:#0b6eea}.deal-bar{background:#22c55e}.month-bar strong{font-size:11px}.month-bar small{font-size:9px;color:var(--muted)}.lg.blue{background:#0b6eea}.lg.purple{background:#7c3aed}
@media(max-width:520px){.real-bar-chart{gap:3px;padding-left:0;padding-right:0}.bar-pair i{width:8px}.month-bar{min-width:26px}}

/* Status lisensi terhubung ke Control Center */
.license-status{color:#64748b;text-decoration:none;font-weight:700}
.license-status.active i{background:#22c55e;box-shadow:0 0 0 4px #dcfce7}
.license-status.reactivation_required{color:#b91c1c}
.license-status.reactivation_required i,.license-status.problem i{background:#ef4444;box-shadow:0 0 0 4px #fee2e2}
.license-status.offline{color:#b45309}
.license-status.offline i{background:#f59e0b;box-shadow:0 0 0 4px #fef3c7}


/* IRK v1.4.6 - penguncian modul berbasis status lisensi */
.side-submenu a.license-locked{opacity:.58;cursor:not-allowed;background:rgba(255,255,255,.035);color:#aabbd0!important}
.side-submenu a.license-locked:hover{background:rgba(255,255,255,.06)!important;color:#c7d3e2!important}
.nav-lock{margin-left:auto;font-size:11px;filter:grayscale(1);opacity:.9}
.license-lock-banner{display:flex;align-items:center;gap:13px;margin-bottom:18px;padding:14px 16px;border:1px solid #fecaca;background:#fff1f2;border-radius:14px;color:#881337;box-shadow:0 7px 24px rgba(190,24,93,.08)}
.license-lock-banner .license-lock-icon{width:42px;height:42px;flex:0 0 42px;border-radius:12px;display:grid;place-items:center;background:#ffe4e6;font-size:21px}
.license-lock-banner strong{display:block;margin-bottom:3px}
.license-lock-banner p{margin:0;font-size:13px;line-height:1.45;color:#9f1239}
.license-lock-banner a{margin-left:auto;white-space:nowrap;background:#be123c;color:#fff;padding:10px 14px;border-radius:10px;font-size:13px;font-weight:800}
.license-impact-card{display:flex;gap:15px;align-items:flex-start;margin:0 0 18px;padding:17px;border-radius:16px;border:1px solid #fecaca;background:#fff7f7}
.license-impact-icon{width:48px;height:48px;flex:0 0 48px;border-radius:14px;background:#fee2e2;display:grid;place-items:center;font-size:23px}
.license-impact-card h3{margin:1px 0 6px;color:#991b1b;font-size:16px}
.license-impact-card p{margin:0;color:#7f1d1d;font-size:13px;line-height:1.55}
.mobile-nav a.license-locked{opacity:.55;color:#94a3b8!important}
@media(max-width:760px){.license-lock-banner{align-items:flex-start;flex-wrap:wrap}.license-lock-banner a{width:100%;margin-left:0;text-align:center}.license-impact-card{padding:14px}.license-impact-icon{width:40px;height:40px;flex-basis:40px}.license-impact-card h3{font-size:14px}}

/* IRK v1.4.7 - modal aktivasi dan penguncian domain */
.license-lock-banner button{margin-left:auto;white-space:nowrap;background:#be123c;color:#fff;padding:10px 14px;border:0;border-radius:10px;font-size:13px;font-weight:800;cursor:pointer}
.irk-modal{position:fixed;inset:0;display:none;z-index:1000;align-items:center;justify-content:center;padding:18px}
.irk-modal.open{display:flex}
.irk-modal-backdrop{position:absolute;inset:0;background:rgba(2,12,27,.62);backdrop-filter:blur(2px)}
.irk-modal-box{position:relative;width:min(560px,100%);max-height:92vh;overflow:auto;background:#fff;border-radius:20px;box-shadow:0 28px 90px rgba(2,12,27,.35)}
.irk-modal-head{display:flex;align-items:center;justify-content:space-between;padding:19px 21px;border-bottom:1px solid var(--line)}
.irk-modal-head small{font-size:10px;font-weight:800;letter-spacing:.08em;color:var(--blue)}
.irk-modal-head h3{margin:4px 0 0;font-size:20px}
.irk-modal-close{width:36px;height:36px;border:0;border-radius:11px;background:#eef3f8;color:#334155;font-size:22px;cursor:pointer}
.irk-modal-body{padding:20px 21px}
.irk-modal-actions{display:flex;justify-content:flex-end;gap:9px;padding:15px 21px 20px;border-top:1px solid var(--line)}
.activation-summary{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:15px}
.activation-summary>div{padding:12px;border:1px solid var(--line);border-radius:12px;background:#f8fbff}
.activation-summary span{display:block;font-size:10px;color:var(--muted);margin-bottom:5px}
.activation-summary strong{display:block;font-size:12px;word-break:break-all}
.activation-help{font-size:13px;line-height:1.55;color:#53657d;margin:0 0 14px}
.activation-input-row{display:grid;grid-template-columns:1fr auto;gap:8px;align-items:center}
.activation-input-row input{text-transform:uppercase;font-weight:800;letter-spacing:.04em}
.activation-security-note{display:flex;flex-direction:column;gap:4px;margin-top:14px;padding:12px;border:1px solid #bfdbfe;border-radius:12px;background:#eff6ff;font-size:12px;color:#1e4e86}
.activation-security-note span{line-height:1.45}
body.irk-modal-open{overflow:hidden}
@media(max-width:760px){.license-lock-banner button{width:100%;margin-left:0}.activation-summary{grid-template-columns:1fr}.activation-input-row{grid-template-columns:1fr}.irk-modal-actions{display:grid;grid-template-columns:1fr 1fr}.irk-modal-actions .btn{width:100%}}
.login-license-lock{width:58px;height:58px;border-radius:17px;display:grid;place-items:center;background:#fee2e2;font-size:28px;margin-bottom:14px}.login-license-help{font-size:12px!important;line-height:1.5;margin-top:14px!important}

/* Lisensi portable v1.5 */
.license-status.activation_required{color:#b91c1c}
.license-status.activation_required i{background:#ef4444;box-shadow:0 0 0 4px #fee2e2}
.login-card label small,.irk-modal label small{font-weight:500;color:#64748b}
