:root {
    --navy: #28344c;
    --blue: #5572ed;
    --blue-dark: #455fd0;
    --cyan: #25cbd3;
    --green: #31bf92;
    --amber: #e9aa42;
    --red: #d95b66;
    --text: #435068;
    --muted: #98a3b3;
    --line: #e7ebf1;
    --soft: #f4f7fb;
    --white: #fff;
    --sidebar: 228px;
    --shadow: 0 4px 14px rgba(37, 51, 79, .055);
    --system-font: "Manrope", "Segoe UI", Arial, sans-serif;
}

* { box-sizing: border-box; }
html { min-height: 100%; }
body { min-height: 100vh; margin: 0; color: var(--text); background: var(--soft); font-family: var(--system-font); font-size: 13px; line-height: 1.5; -webkit-font-smoothing: antialiased; }
a { color: inherit; text-decoration: none; }
button, input, select, textarea { font: inherit; }
button, select { cursor: pointer; }
.app-shell { display: flex; min-height: 100vh; }

/* Sidebar */
.sidebar { position: fixed; inset: 0 auto 0 0; z-index: 40; display: flex; flex-direction: column; width: var(--sidebar); padding: 18px 14px; background: #fff; border-right: 1px solid #e8ecf3; box-shadow: 6px 0 22px rgba(47,60,87,.025); }
.brand { display: flex; align-items: center; gap: 10px; padding: 0 8px 16px; }
.brand-mark { display: grid; place-items: center; width: 35px; height: 35px; color: #fff; background: linear-gradient(145deg,#7188f2,#4d68dc); border-radius: 10px; box-shadow: 0 6px 14px rgba(83,108,226,.22); font-size: 12px; font-weight: 800; }
.brand strong, .brand small { display: block; }
.brand strong { color: var(--navy); font-size: 13px; }
.brand small { color: #a0a9b9; font-size: 9px; }
.user-profile { display: flex; align-items: center; gap: 10px; margin: 8px 4px 18px; padding: 14px 10px; background: #f8faff; border: 1px solid #edf0f6; border-radius: 10px; }
.avatar { position: relative; display: grid; place-items: center; flex: 0 0 39px; height: 39px; color: #4d67df; background: #e3e9ff; border: 2px solid #fff; border-radius: 50%; font-size: 10px; font-weight: 900; }
.online-badge { position: absolute; right: -1px; bottom: 1px; width: 9px; height: 9px; background: #37c78e; border: 2px solid #fff; border-radius: 50%; }
.profile-copy { min-width: 0; }
.profile-copy strong, .profile-copy small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.profile-copy strong { color: #2b3750; font-size: 10.5px; }
.profile-copy small { color: #98a2b2; font-size: 8.5px; }
.profile-more { margin-left: auto; padding: 0; color: #9da7b6; background: none; border: 0; font-size: 10px; }
.main-nav { margin-top: 0; }
.nav-label { margin: 0 10px 8px; color: #aeb6c4; font-size: 8px; font-weight: 800; letter-spacing: .9px; }
.nav-label-spaced { margin-top: 22px; }
.nav-link { display: flex; align-items: center; gap: 10px; min-height: 40px; margin-bottom: 4px; padding: 8px 10px; color: #8d98aa; border-radius: 8px; font-size: 10.5px; font-weight: 650; }
.nav-link:hover { color: var(--blue); background: #f4f6ff; }
.nav-link.active { position: relative; color: var(--blue); background: #f0f3ff; }
.nav-link.active::after { position: absolute; right: 10px; width: 5px; height: 5px; background: var(--blue); border-radius: 50%; content: ""; }
.nav-icon { display: grid; place-items: center; width: 20px; height: 20px; color: #aeb7c8; font-size: 13px; }
.nav-link.active .nav-icon { color: var(--blue); }
.nav-parent { width: 100%; background: transparent; border: 0; text-align: left; }
.nav-parent.active { background: #f0f3ff; }
.nav-parent.active::after { display: none; }
.nav-chevron { margin-left: auto; transition: transform .18s ease; }
.nav-group.open .nav-chevron { transform: rotate(180deg); }
.nav-submenu { margin: -1px 0 7px 20px; padding: 3px 0 3px 13px; border-left: 1px solid #e2e7ef; }
.nav-sublink { display: flex; align-items: center; gap: 8px; min-height: 32px; padding: 6px 9px; color: #98a3b3; border-radius: 7px; font-size: 9.5px; font-weight: 650; }
.nav-sublink > span { font-size: 5px; }
.nav-sublink:hover { color: var(--blue); background: #f4f6ff; }
.nav-sublink.active { color: var(--blue); background: #f0f3ff; }
.icon-dashboard { font-size: 10px; transform: rotate(45deg); }
.nav-link-muted { cursor: default; }
.nav-link-muted:hover { color: #8d98aa; background: transparent; }
.nav-status-dot { width: 6px; height: 6px; margin-left: auto; background: #35c88c; border-radius: 50%; box-shadow: 0 0 0 3px #e2f8f0; }
.sidebar-note { display: flex; align-items: center; gap: 10px; margin: auto 4px 0; padding: 10px; border-top: 1px solid #eef1f5; }
.note-icon { display: grid; place-items: center; flex: 0 0 23px; height: 23px; color: #9ca7b7; background: #f2f4f8; border-radius: 50%; }
.sidebar-note strong, .sidebar-note small { display: block; }
.sidebar-note strong { color: #7e899a; font-size: 9.5px; }
.sidebar-note small { color: #b0b7c2; font-size: 8px; }
.theme-toggle { display: flex; align-items: center; width: 30px; height: 16px; margin-left: auto; padding: 2px; background: var(--blue); border-radius: 999px; }
.theme-toggle i { width: 12px; height: 12px; margin-left: auto; background: #fff; border-radius: 50%; }
.sidebar-backdrop { display: none; }

/* Page shell */
.content-shell { display: flex; flex: 1; flex-direction: column; min-width: 0; margin-left: var(--sidebar); }
.topbar { position: sticky; top: 0; z-index: 25; display: flex; align-items: center; min-height: 62px; padding: 0 28px; background: rgba(244,247,251,.94); border-bottom: 1px solid #e9edf3; backdrop-filter: blur(10px); }
.menu-toggle { display: none; }
.topbar-title span, .topbar-title strong { display: block; }
.topbar-title span { color: #b1b8c5; font-size: 8px; font-weight: 800; letter-spacing: .9px; }
.topbar-title strong { color: #2d3850; font-size: 12px; }
.topbar-meta { display: flex; align-items: center; gap: 10px; margin-left: auto; }
.topbar-icon { position: relative; display: grid; place-items: center; width: 32px; height: 32px; color: #8490a2; background: #fff; border: 1px solid #e6eaf0; border-radius: 8px; }
.topbar-icon i { position: absolute; top: 6px; right: 6px; width: 5px; height: 5px; background: #ef6570; border-radius: 50%; }
.date-pill { padding: 7px 10px; color: #778397; background: #fff; border: 1px solid #e6eaf0; border-radius: 7px; font-size: 9px; }
.date-pill { display:inline-flex;align-items:center;gap:9px;min-height:32px;white-space:nowrap; }
.date-pill-date { font-weight:650; }
.date-pill-time { display:inline-flex;align-items:center;gap:4px;padding-left:9px;color:#008b9b;border-left:1px solid #d9e5eb;font-style:normal;font-variant-numeric:tabular-nums;font-weight:850;letter-spacing:.2px; }
.date-pill-time small { color:#7893a3;font-size:6.5px;font-weight:850;letter-spacing:.4px; }
.main-content { flex: 1; width: 100%; max-width: 1560px; margin: 0 auto; padding: 24px 28px 38px; }
.footer { display: flex; justify-content: space-between; gap: 16px; padding: 16px 28px; color: var(--muted); border-top: 1px solid var(--line); font-size: 9px; }

/* Shared components */
.panel { background: #fff; border: 1px solid var(--line); border-radius: 9px; box-shadow: var(--shadow); }
.panel-header { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 16px 18px; border-bottom: 1px solid #edf0f4; }
.panel-header h2 { margin: 0; color: #313b51; font-size: 12px; }
.panel-header p { margin: 3px 0 0; color: #a5adba; font-size: 8.5px; }
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-height: 37px; padding: 8px 14px; border: 1px solid transparent; border-radius: 7px; font-size: 9.5px; font-weight: 750; white-space: nowrap; }
.btn-primary { color: #fff; background: linear-gradient(135deg,#617af0,#4f68dd); box-shadow: 0 6px 14px rgba(82,106,222,.2); }
.btn-primary:hover { background: linear-gradient(135deg,#5570e8,#465dcd); }
.btn-secondary { color: #647187; background: #fff; border-color: #e0e5ec; }
.btn-ghost { color: #778397; background: transparent; }
.btn-ghost:hover { background: #f1f3f7; }
.btn-danger-outline { color: #bd4651; background: #fff; border-color: #edc0c4; }
.btn-sm { min-height: 32px; padding: 6px 11px; font-size: 8.5px; }
.alert { display: grid; grid-template-columns: auto 1fr auto; gap: 11px; margin-bottom: 18px; padding: 11px 14px; border: 1px solid; border-radius: 8px; font-size: 9.5px; }
.alert ul { grid-column: 2; margin: 0; padding-left: 16px; }
.alert-success { color: #12684f; background: #eaf8f3; border-color: #b8e5d4; }
.alert-danger { color: #942d38; background: #fff0f1; border-color: #f2c4c8; }
.alert-warning { color: #805b13; background: #fff8e5; border-color: #ecd79c; }
.alert-close { padding: 0; color: inherit; background: none; border: 0; font-size: 17px; }
.success-toast { position: fixed; top: 76px; right: 18px; z-index: 10000; display: grid; grid-template-columns: 30px minmax(0,1fr) 22px; gap: 9px; align-items: center; width: min(390px,calc(100vw - 28px)); max-height: calc(100dvh - 96px); padding: 10px 11px; overflow-y: auto; color: #12684f; background: #f0fbf7; border: 1px solid #b6e3d2; border-radius: 10px; box-shadow: 0 10px 28px rgba(28,68,59,.18); isolation: isolate; animation: success-toast-in .22s ease both; }
.success-toast.closing { animation: success-toast-out .22s ease both; }
.success-toast-icon { display: grid; place-items: center; width: 30px; height: 30px; color: #fff; background: #13a47d; border-radius: 50%; font-size: 14px; font-weight: 900; }
.success-toast strong,.success-toast small { display: block; }
.success-toast strong { margin-bottom: 2px; font-size: 9.5px; }
.success-toast small { color: #3f7566; font-size: 8px; line-height: 1.35; }
.success-toast button { padding: 0; color: #37806c; background: transparent; border: 0; font-size: 17px; line-height: 1; }
@keyframes success-toast-in { from { opacity: 0; transform: translateY(-10px); } to { opacity: 1; transform: translateY(0); } }
@keyframes success-toast-out { from { opacity: 1; transform: translateY(0); } to { opacity: 0; transform: translateY(-8px); } }
.page-heading { margin-bottom: 22px; }
.page-heading h1 { margin: 3px 0 5px; color: var(--navy); font-size: 22px; letter-spacing: -.4px; }
.page-heading p { margin: 0; color: var(--muted); font-size: 10px; }
.eyebrow, .page-heading .eyebrow { margin: 0; color: var(--blue); font-size: 8px; font-weight: 800; letter-spacing: 1px; }
.heading-actions { display: flex; align-items: flex-end; justify-content: space-between; gap: 18px; }
.heading-button-group { display: flex; gap: 8px; }
.back-link { display: inline-flex; margin-bottom: 14px; color: var(--blue); font-size: 9.5px; font-weight: 700; }
.required { color: var(--red); }

/* Dashboard */
.dashboard-intro { display: flex; align-items: flex-end; justify-content: space-between; gap: 18px; margin-bottom: 20px; }
.dashboard-intro h1 { margin: 0; color: var(--navy); font-size: 20px; }
.dashboard-intro p:not(.eyebrow) { margin: 4px 0 0; color: var(--muted); font-size: 9.5px; }
.intro-actions { display: flex; gap: 8px; }
.metric-strip { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 13px; margin-bottom: 14px; }
.metric-card { display: grid; grid-template-columns: 36px 1fr; gap: 10px; align-items: center; min-height: 76px; padding: 13px; background: #fff; border: 1px solid #e9edf3; border-radius: 8px; box-shadow: var(--shadow); }
.metric-icon { display: grid; place-items: center; width: 36px; height: 36px; color: var(--metric); background: var(--metric-soft); border-radius: 50%; font-size: 15px; }
.metric-card small, .metric-card strong, .metric-card div span { display: block; }
.metric-card small { color: #9ba5b4; font-size: 8px; }
.metric-card strong { margin: 1px 0; color: #242f45; font-size: 16px; line-height: 1.1; }
.metric-card div span { color: #b4bbc6; font-size: 7.5px; }
.metric-purple { --metric:#5c75eb; --metric-soft:#e8edff; }
.metric-red { --metric:#ef777d; --metric-soft:#ffebec; }
.metric-green { --metric:#31bf92; --metric-soft:#e1f8f0; }
.metric-amber { --metric:#e9aa42; --metric-soft:#fff3dd; }
.analytics-layout { display: grid; grid-template-columns: minmax(0,1fr) 245px; gap: 14px; align-items: start; }
.analytics-main, .analytics-side { display: grid; min-width: 0; gap: 14px; }
.line-chart-panel { min-width: 0; overflow: hidden; }
.panel-tools { display: flex; gap: 7px; }
.panel-tools span, .panel-tools button { padding: 6px 8px; color: #7d889a; background: #fff; border: 1px solid #e8ecf1; border-radius: 5px; font-size: 7.5px; }
.analytics-kpis { display: grid; grid-template-columns: repeat(3,1fr); gap: 20px; padding: 16px 22px 4px; }
.analytics-kpis span, .analytics-kpis strong, .analytics-kpis small { display: block; }
.analytics-kpis span { color: #929dad; font-size: 8px; }
.analytics-kpis strong { margin: 4px 0 2px; color: #273248; font-size: 15px; }
.analytics-kpis small { color: #aeb5c0; font-size: 7px; }
.trend-up { color: #29ae7f !important; }
.line-chart-wrap { display: grid; grid-template-columns: 25px 1fr; gap: 7px; height: 210px; padding: 10px 22px 0; }
.chart-y-axis { display: flex; flex-direction: column; justify-content: space-between; height: 165px; color: #abb4c1; font-size: 7px; text-align: right; }
.line-chart-canvas svg { display: block; width: 100%; height: 178px; overflow: visible; }
.grid-line { stroke: #edf0f5; stroke-width: 1; stroke-dasharray: 4 4; }
.chart-line { fill: none; stroke: #5c76ee; stroke-width: 2.2; vector-effect: non-scaling-stroke; }
.chart-point { fill: #fff; stroke: #5c76ee; stroke-width: 2.2; vector-effect: non-scaling-stroke; }
.chart-point-label { fill: #778398; font-size: 8px; font-weight: 700; }
.chart-x-axis { display: grid; grid-template-columns: repeat(6,1fr); color: #a7afbc; font-size: 7px; text-align: center; }
.chart-x-axis span:first-child { text-align: left; }.chart-x-axis span:last-child { text-align: right; }
.chart-legend { display: flex; justify-content: center; padding: 2px 18px 14px; color: #8f99a9; font-size: 7.5px; }
.chart-legend span { display: flex; align-items: center; gap: 5px; }
.chart-legend i { width: 16px; height: 3px; background: var(--blue); border-radius: 2px; }
.widget-header { display: flex; justify-content: space-between; padding: 14px 14px 8px; }
.widget-header h3 { margin: 0; color: #303a4e; font-size: 10px; }
.widget-header p { margin: 2px 0 0; color: #b0b7c2; font-size: 7px; }
.widget-header > span { padding: 4px 6px; color: #6278dc; background: #f1f3ff; border-radius: 4px; font-size: 6.5px; }
.distribution-list { padding: 5px 14px 13px; }
.distribution-row { display: grid; grid-template-columns: 28px 1fr auto; gap: 8px; align-items: center; min-height: 43px; }
.distribution-icon { display: grid; place-items: center; width: 28px; height: 28px; color: #5a73e6; background: #e9edff; border-radius: 7px; font-size: 8px; font-weight: 850; }
.distribution-icon.c1 { color:#16aeb8; background:#e1f9fa; }.distribution-icon.c2 { color:#d58c29; background:#fff2df; }.distribution-icon.c3 { color:#9b67d8; background:#f2e9fc; }
.distribution-row div { min-width: 0; }
.distribution-row strong { display: block; overflow: hidden; color: #667286; font-size: 7.5px; text-overflow: ellipsis; white-space: nowrap; }
.distribution-row div span { display: block; height: 3px; margin-top: 4px; overflow: hidden; background: #eef1f5; border-radius: 3px; }
.distribution-row div i { display: block; height: 100%; background: linear-gradient(90deg,var(--blue),var(--cyan)); border-radius: 3px; }
.distribution-row b { color: #5d697b; font-size: 8px; }
.widget-empty { padding: 28px 5px; color: #a9b1bd; font-size: 8px; text-align: center; }
.recent-panel { overflow: hidden; }
.text-link, .record-link { color: var(--blue); font-weight: 750; }

/* Tables and filters */
.table-wrap { width: 100%; overflow-x: auto; }
table { width: 100%; border-collapse: collapse; font-size: 10px; }
thead { background: #f8f9fc; }
th { padding: 11px 13px; color: #98a3b3; border-bottom: 1px solid #edf0f4; font-size: 8px; text-align: left; text-transform: uppercase; letter-spacing: .4px; white-space: nowrap; }
td { padding: 13px; color: #647187; border-bottom: 1px solid #f0f2f6; vertical-align: middle; }
tbody tr:last-child td { border-bottom: 0; }
tbody tr:hover { background: #fbfcff; }
td strong { color: #354056; }
.cell-wrap { min-width: 170px; max-width: 260px; white-space: normal; }
.date-cell strong, .date-cell span { display: block; }
.date-cell span { color: #a0a9b7; font-size: 8px; }
.table-actions { display: flex; gap: 5px; }
.icon-btn { display: grid; place-items: center; width: 30px; height: 30px; color: #176aa7; background: #fff; border: 1px solid #d6e7f3; border-radius: 7px; box-shadow: 0 2px 5px rgba(38,101,143,.04); transition: color .16s ease,background .16s ease,border-color .16s ease,transform .16s ease; }
.icon-btn:hover { color: #0b5d99; border-color: #a9d0e8; background: #f5fbff; transform: translateY(-1px); }
.icon-btn.is-danger { color: #c94d5a; border-color: #f1c9cf; background: #fff8f9; }
.icon-btn.is-danger:hover { color: #ac3745; border-color: #eaaab4; background: #fff2f4; }
.icon-btn.is-locked,.icon-btn.is-locked:hover{color:#a46a0d;background:#fff6df;border-color:#edd49d}
.filter-panel { margin-bottom: 16px; padding: 15px; }
.filter-form { display: grid; grid-template-columns: minmax(210px,1.5fr) minmax(140px,.8fr) minmax(140px,.7fr) minmax(140px,.7fr) 44px auto; gap: 11px; align-items: end; }
.filter-actions { display: flex; gap: 4px; }
.register-panel { overflow: hidden; }
.pagination-wrap { display: flex; justify-content: flex-end; padding: 14px 18px; border-top: 1px solid #f0f2f6; }
.pagination { display: flex; gap: 4px; margin: 0; padding: 0; list-style: none; }
.pagination li a, .pagination li span { display: grid; place-items: center; min-width: 29px; height: 29px; padding: 0 7px; color: #778397; border: 1px solid #e1e5eb; border-radius: 6px; font-size: 8px; }
.pagination li a > span { display: inline; min-width: 0; height: auto; padding: 0; color: inherit; border: 0; border-radius: 0; font-size: inherit; }
.pagination li.active a { color: #fff; background: var(--blue); border-color: var(--blue); }

/* Forms and detail */
.form-group { min-width: 0; }
.form-group label { display: block; margin-bottom: 5px; color: #6f7c90; font-size: 9px; font-weight: 750; }
.form-group small { display: block; margin-top: 4px; color: #a0a9b7; font-size: 8px; }
.list-order-filter { position:relative;z-index:25;width:44px;align-self:end; }
.list-order-menu { position:relative; }
.list-order-menu > summary { display:grid;place-items:center;width:44px;height:44px;padding:0;color:#60738b;background:#fff;border:1px solid #d7e1e9;border-radius:10px;box-sizing:border-box;cursor:pointer;list-style:none;transition:border-color .16s ease,background .16s ease,color .16s ease,box-shadow .16s ease; }
.list-order-menu > summary::-webkit-details-marker { display:none; }
.list-order-menu > summary::marker { content:""; }
.list-order-menu > summary:hover,.list-order-menu[open] > summary,.list-order-filter.is-active .list-order-menu > summary { color:#078f95;background:#eefafa;border-color:#8bd7d2;box-shadow:0 4px 12px rgba(15,136,145,.13); }
.list-order-menu > summary svg { width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round; }
.list-order-filter.is-active .list-order-menu > summary::after { position:absolute;top:5px;right:5px;width:6px;height:6px;background:#08a8a3;border:2px solid #fff;border-radius:50%;content:""; }
.list-order-popover { position:absolute;top:calc(100% + 7px);right:0;z-index:80;width:170px;padding:9px;background:#fff;border:1px solid #d7e3e8;border-radius:9px;box-shadow:0 10px 22px rgba(35,58,75,.16);box-sizing:border-box; }
.list-order-popover::before { position:absolute;top:-5px;right:16px;width:9px;height:9px;background:#fff;border-top:1px solid #d7e3e8;border-left:1px solid #d7e3e8;content:"";transform:rotate(45deg); }
.list-order-popover label { margin-bottom:5px;color:#53657b;font-size:8px;font-weight:800; }
.list-order-popover select { position:relative;width:100%;height:34px;padding:0 29px 0 9px;border-radius:8px;font-size:8.5px; }
.list-order-popover small { margin-top:5px;color:#93a0af;font-size:7px;line-height:1.35; }
input, select, textarea { width: 100%; color: #354056; background: #fff; border: 1px solid #e0e5ec; border-radius: 7px; outline: none; font-size: 10px; }
input, select { height: 37px; padding: 8px 10px; }
textarea { min-height: 80px; padding: 9px 10px; resize: vertical; }
input:focus, select:focus, textarea:focus { border-color: #8296ef; box-shadow: 0 0 0 3px rgba(89,116,236,.1); }
input[readonly] { color: #788598; background: #f7f8fa; }
.input-with-icon { position: relative; }
.input-with-icon span { position: absolute; top: 50%; left: 10px; color: #9ca7b6; transform: translateY(-50%); font-size: 15px; }
.input-with-icon input { padding-left: 32px; }
.data-form { display: grid; gap: 15px; }
.form-section { padding: 20px; }
.section-heading { display: flex; gap: 11px; margin-bottom: 18px; padding-bottom: 14px; border-bottom: 1px solid #edf0f4; }
.section-number { display: grid; place-items: center; flex: 0 0 30px; height: 30px; color: var(--blue); background: #edf1ff; border-radius: 7px; font-size: 8px; font-weight: 850; }
.section-heading h2 { margin: 0; color: var(--navy); font-size: 12px; }
.section-heading p { margin: 2px 0 0; color: var(--muted); font-size: 8.5px; }
.form-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 16px 18px; }
.span-2 { grid-column: span 2; }
.form-actions-sticky { position: sticky; bottom: 12px; z-index: 10; display: flex; justify-content: flex-end; gap: 7px; padding: 12px 15px; background: rgba(255,255,255,.96); border: 1px solid var(--line); border-radius: 9px; box-shadow: 0 12px 28px rgba(16,42,71,.12); }
.single-detail { max-width: 920px; overflow: hidden; }
.detail-list { margin: 0; padding: 8px 20px 18px; }
.detail-list.grid-two { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); column-gap: 28px; }
.detail-list .full-detail { grid-column: span 2; }
.detail-list > div { padding: 14px 0; border-bottom: 1px solid #f0f2f6; }
.detail-list dt { margin-bottom: 4px; color: #9aa5b4; font-size: 8px; font-weight: 750; text-transform: uppercase; letter-spacing: .4px; }
.detail-list dd { margin: 0; color: #354056; font-size: 11px; font-weight: 650; }
.empty-state { padding: 48px 20px; color: var(--muted); text-align: center; }
.empty-state > span { display: block; color: #cbd2dc; font-size: 31px; }
.empty-state strong { display: block; margin-top: 3px; color: #697589; font-size: 11px; }
.empty-state p { margin: 3px 0 12px; font-size: 8.5px; }
.empty-state.compact { padding: 30px 20px; }

.construction-panel{display:grid;grid-template-columns:220px minmax(0,1fr);align-items:center;gap:32px;min-height:265px;padding:30px 42px;overflow:hidden;background:linear-gradient(125deg,#f8fcff 0%,#fff 56%,#eefbfa 100%);border-color:#c9e4e8;box-shadow:0 13px 30px rgba(18,80,105,.08)}.construction-visual{position:relative;display:grid;place-items:center;width:180px;height:180px;margin:auto;border:1px solid #cae6e8;border-radius:50%;background:radial-gradient(circle at 35% 28%,#fff 0 16%,#e2f5f4 55%,#cae9e9 100%);isolation:isolate}.construction-orbit{position:absolute;border:1px dashed #78c8c9;border-radius:50%;animation:construction-orbit 9s linear infinite}.construction-orbit-one{inset:13px}.construction-orbit-two{inset:-12px;border-color:#b7ddec;animation-direction:reverse;animation-duration:13s}.construction-gear{position:relative;z-index:2;color:#087f99;font-size:73px;line-height:1;filter:drop-shadow(0 8px 8px rgba(4,108,137,.18));animation:construction-gear 7s linear infinite}.construction-hammer{position:absolute;z-index:3;top:28px;right:19px;color:#ef9b24;font-size:35px;line-height:1;transform-origin:83% 84%;filter:drop-shadow(0 4px 5px rgba(175,96,0,.16));animation:construction-hammer 2.1s ease-in-out infinite}.construction-spark{position:absolute;z-index:4;color:#f5a623;font-size:18px;animation:construction-spark 1.8s ease-in-out infinite}.construction-spark-one{top:30px;left:32px}.construction-spark-two{right:23px;bottom:34px;animation-delay:.62s}.construction-copy{max-width:570px}.construction-label{display:flex;align-items:center;gap:7px;margin:0;color:#098294;font-size:8px;font-weight:900;letter-spacing:1.15px}.construction-label span{width:8px;height:8px;border-radius:50%;background:#08a49f;box-shadow:0 0 0 0 rgba(8,164,159,.45);animation:construction-pulse 1.8s ease-out infinite}.construction-copy h2{margin:9px 0 7px;color:#164b78;font-size:23px}.construction-copy>p:not(.construction-label){max-width:480px;margin:0;color:#6d8398;font-size:10px;line-height:1.7}.construction-progress{width:min(100%,310px);height:7px;margin:18px 0 7px;overflow:hidden;background:#dcecef;border-radius:999px}.construction-progress i{display:block;width:42%;height:100%;border-radius:inherit;background:linear-gradient(90deg,#087eb6,#0ba59e);animation:construction-progress 2.4s ease-in-out infinite}.construction-copy small{color:#8ba0ae;font-size:8px;font-weight:700}@keyframes construction-orbit{to{transform:rotate(360deg)}}@keyframes construction-gear{to{transform:rotate(360deg)}}@keyframes construction-hammer{0%,44%,100%{transform:rotate(-13deg)}55%{transform:rotate(18deg)}64%{transform:rotate(-8deg)}}@keyframes construction-spark{0%,100%{opacity:.2;transform:scale(.55) rotate(0)}50%{opacity:1;transform:scale(1.1) rotate(42deg)}}@keyframes construction-progress{0%,100%{transform:translateX(-5%)}50%{transform:translateX(135%)}}@keyframes construction-pulse{70%{box-shadow:0 0 0 7px rgba(8,164,159,0)}100%{box-shadow:0 0 0 0 rgba(8,164,159,0)}}
@media(max-width:640px){.construction-panel{grid-template-columns:1fr;gap:21px;min-height:0;padding:31px 22px;text-align:center}.construction-visual{width:145px;height:145px}.construction-gear{font-size:58px}.construction-hammer{top:24px;right:16px;font-size:29px}.construction-copy{margin:auto}.construction-label{justify-content:center}.construction-progress{margin-inline:auto}.construction-copy h2{font-size:19px}}
@media(prefers-reduced-motion:reduce){.construction-panel *{animation:none!important}}

/* Modal */
.input-modal[hidden] { display: none; }
.input-modal { position: fixed; inset: 0; z-index: 100; display: grid; place-items: center; padding: 22px; opacity: 0; transition: opacity .18s ease; }
.input-modal.open { opacity: 1; }
.modal-backdrop { position: absolute; inset: 0; width: 100%; height: 100%; background: rgba(28,37,58,.48); border: 0; backdrop-filter: blur(3px); }
.modal-dialog { position: relative; z-index: 1; display: flex; flex-direction: column; width: min(700px,100%); max-height: 88vh; overflow: hidden; background: #fff; border-radius: 13px; box-shadow: 0 24px 70px rgba(25,35,59,.24); transform: translateY(12px) scale(.985); transition: transform .18s ease; }
.input-modal.open .modal-dialog { transform: translateY(0) scale(1); }
.modal-dialog-compact { width: min(680px,100%); max-height: calc(100vh - 44px); }
.modal-header { display: flex; align-items: center; justify-content: space-between; padding: 16px 20px; border-bottom: 1px solid #edf0f4; }
.modal-title-group { display: flex; align-items: center; gap: 11px; }
.modal-title-icon { display: grid; place-items: center; width: 35px; height: 35px; color: #fff; background: linear-gradient(145deg,#6a82f0,#5068dc); border-radius: 9px; font-size: 17px; }
.modal-title-group p { margin: 0; color: #a6afbc; font-size: 7px; font-weight: 800; letter-spacing: .9px; }
.modal-title-group h2 { margin: 0; color: #2c374d; font-size: 14px; }
.modal-close { display: grid; place-items: center; width: 31px; height: 31px; padding: 0; color: #8e99a9; background: #f5f7fa; border: 0; border-radius: 8px; font-size: 18px; }
#modalDokumenForm { display: flex; flex: 1; flex-direction: column; min-height: 0; }
.modal-body.input-modal-body { padding: 14px 18px 16px; overflow: visible; }
.modal-form-grid.input-form-grid { gap: 11px 14px; }
.modal-body { flex: 1; padding: 18px 20px 22px; overflow-y: auto; }
.modal-section-heading { display: flex; align-items: center; gap: 9px; margin-bottom: 14px; padding-bottom: 10px; border-bottom: 1px solid #f0f2f6; }
.modal-section-heading > span { display: grid; place-items: center; width: 25px; height: 25px; color: var(--blue); background: #edf1ff; border-radius: 6px; font-size: 7px; font-weight: 900; }
.modal-section-heading strong, .modal-section-heading small { display: block; }
.modal-section-heading strong { color: #435068; font-size: 9.5px; }.modal-section-heading small { color: #a8b0bd; font-size: 7.5px; }
.modal-form-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 13px 16px; }
.modal-span-2 { grid-column: span 2; }
.modal-alert { margin: 14px 20px 0; padding: 10px 12px; color: #a13640; background: #fff0f1; border: 1px solid #f1c7cb; border-radius: 7px; font-size: 8.5px; }
.modal-alert ul { margin: 5px 0 0; padding-left: 16px; }.modal-alert.success { color: #127054; background: #e8f8f2; border-color: #bce6d6; }
.modal-footer { display: flex; align-items: center; justify-content: flex-end; gap: 7px; min-height: 61px; padding: 11px 20px; background: #fafbfc; border-top: 1px solid #edf0f4; }
.modal-submit-status { margin-right: auto; color: #7e8a9d; font-size: 8px; }
.modal-footer button:disabled { cursor: wait; opacity: .65; }
.btn-shift-handover { color: #087f7d; background: #e8f8f5; border-color: #a9ded8; }
.btn-shift-handover:hover { color: #fff; background: linear-gradient(135deg,#16b9aa,#078f9d); border-color: #078f9d; box-shadow: 0 6px 14px rgba(7,143,157,.2); }
.shift-handover-info { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 12px; color: #68788a; background: #f1faf8; border: 1px solid #cce9e5; border-radius: 8px; font-size: 8px; }
.shift-handover-info[hidden] { display: none; }
.shift-handover-info strong { color: #087f7d; font-size: 8px; text-align: right; }
.shift-handover-form { padding: 14px; background: linear-gradient(120deg,#effaf8,#f7fbff); border: 1px solid #bfe4df; border-radius: 10px; }
.shift-handover-form[hidden] { display: none; }
.shift-handover-form .modal-section-heading { margin-bottom: 12px; }
.shift-handover-form select { background-color: #fff; }
.shift-handover-actions { display: flex; justify-content: flex-end; gap: 8px; margin-top: 12px; }
.security-handover-history { margin: 0 20px 18px; padding: 14px 16px; background: #f8fcfc; border: 1px solid #dcebea; border-radius: 10px; }
.security-handover-history[hidden] { display: none; }
.security-handover-history-list { display: grid; gap: 8px; }
.security-handover-history-item { padding: 10px 12px; background: #fff; border: 1px solid #e2ebeb; border-left: 3px solid #0aa59e; border-radius: 8px; }
.security-handover-route { display: grid; grid-template-columns: minmax(0,1fr) auto minmax(0,1fr); align-items: center; gap: 12px; }
.security-handover-route > span { min-width: 0; }
.security-handover-route small,.security-handover-route strong { display: block; }
.security-handover-route small { margin: 0 0 3px; color: #98a4b2; font-size: 7px; font-weight: 750; text-transform: uppercase; letter-spacing: .35px; }
.security-handover-route strong { overflow: hidden; color: #344158; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.security-handover-route b { color: #0aa59e; font-size: 14px; }
.security-handover-history-item > small { display: block; margin-top: 7px; padding-top: 7px; color: #8997a7; border-top: 1px dashed #e2e9e9; font-size: 7.5px; }

/* Edit popup */
.edit-modal[hidden], .delete-modal[hidden] { display: none; }
.edit-modal, .delete-modal { position: fixed; inset: 0; z-index: 110; display: grid; place-items: center; padding: 22px; opacity: 0; transition: opacity .18s ease; }
.edit-modal.open, .delete-modal.open { opacity: 1; }
.edit-modal.open .modal-dialog, .delete-modal.open .modal-dialog { transform: translateY(0) scale(1); }
.edit-modal-dialog { width: min(680px,100%); max-height: calc(100vh - 44px); }
.edit-title-icon { background: linear-gradient(145deg,#8b74eb,#6558d6); font-size: 13px; }
#modalEditForm { display: flex; flex: 1; flex-direction: column; min-height: 0; }
#modalEditForm[hidden] { display: none; }
.edit-modal-body { flex: 1 1 auto; min-height: 0; padding: 14px 18px 16px; overflow-y: auto; overscroll-behavior: contain; }
.edit-form-grid { gap: 11px 14px; }
.icon-btn-delete { color: #c45862; }
.icon-btn-delete:hover { color: #b33340; background: #fff2f3; border-color: #efc2c6; }

/* Delete confirmation popup */
.delete-modal-dialog { width: min(410px,100%); text-align: center; }
.delete-modal-body { padding: 28px 28px 20px; }
.delete-warning-icon { display: grid; place-items: center; width: 48px; height: 48px; margin: 0 auto 14px; color: #c94d58; background: #ffeaec; border: 1px solid #f5c7cb; border-radius: 50%; font-size: 20px; font-weight: 850; }
.delete-modal-body h2 { margin: 0; color: #303a50; font-size: 16px; }
.delete-modal-body p { margin: 8px auto 0; color: #8995a6; font-size: 9px; line-height: 1.7; }
.delete-modal-body p strong { color: #5b677a; }
.delete-modal-body .modal-alert { margin: 15px 0 0; text-align: left; }
.delete-modal-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; padding: 13px 20px; background: #fafbfc; border-top: 1px solid #edf0f4; }
.delete-modal-actions.locked { grid-template-columns: 1fr; }
[data-delete-submit][hidden] { display: none; }
[data-reopen-progress-submit][hidden] { display: none!important; }
.btn-delete { color: #fff; background: linear-gradient(135deg,#df6670,#c94d58); box-shadow: 0 5px 12px rgba(201,77,88,.18); }
.btn-delete:hover { background: linear-gradient(135deg,#d95a65,#ba414c); }
.btn-delete:disabled { cursor: wait; opacity: .65; }

/* Detail popup */
.detail-modal[hidden] { display: none; }
.detail-modal { position: fixed; inset: 0; z-index: 105; display: grid; place-items: center; padding: 22px; opacity: 0; transition: opacity .18s ease; }
.detail-modal.open { opacity: 1; }
.detail-modal.open .modal-dialog { transform: translateY(0) scale(1); }
.detail-modal-dialog { width: min(680px,100%); max-height: calc(100vh - 44px); }
.detail-title-icon { background: linear-gradient(145deg,#41cad2,#27aebc); }
.detail-loading { display: grid; place-items: center; min-height: 270px; color: #8390a3; font-size: 9px; }
.detail-loading[hidden], .detail-error[hidden], .detail-modal-content[hidden] { display: none; }
.detail-loading span { width: 28px; height: 28px; margin-bottom: 10px; border: 3px solid #e6eaf3; border-top-color: var(--blue); border-radius: 50%; animation: detail-spin .7s linear infinite; }
@keyframes detail-spin { to { transform: rotate(360deg); } }
.detail-error { min-height: 250px; padding: 80px 20px; color: #9b3d47; text-align: center; }
.detail-error strong { display: block; margin-bottom: 10px; }
.detail-error button { padding: 6px 10px; color: var(--blue); background: #f0f3ff; border: 0; border-radius: 6px; font-size: 8px; }
.detail-modal-content { flex: 1 1 auto; min-height: 0; overflow-y: auto; overscroll-behavior: contain; }
.detail-record-head { display: flex; align-items: center; justify-content: flex-start; gap: 16px; padding: 18px 20px; background: linear-gradient(135deg,#f6f8ff,#f5fbfc); border-bottom: 1px solid #edf0f4; }
.detail-record-head span, .detail-record-head strong { display: block; }
.detail-record-head > div > span { color: #9ca7b6; font-size: 8px; }
.detail-record-head strong { margin-top: 2px; color: var(--blue); font-size: 17px; }
.detail-record-times { display: flex; align-items: center; gap: 28px; flex-wrap: wrap; }
.detail-record-times p { display: flex; align-items: center; gap: 7px; margin: 0; color: #9aa5b4; font-size: 8px; line-height: 1.7; text-align: left; }
.detail-record-times p + p { padding-left: 28px; border-left: 1px solid #dde4eb; }
.detail-record-times p span { font-weight: 700; }
.detail-record-times p strong { margin: 0; color: #647389; font-size: 8px; font-weight: 700; }
.modal-detail-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); margin: 0; padding: 5px 20px 16px; gap: 0 22px; }
.modal-detail-grid > div { min-width: 0; padding: 11px 0; border-bottom: 1px solid #f0f2f6; }
.modal-detail-grid .detail-primary { grid-column: auto; }
.modal-detail-grid dt { margin-bottom: 4px; color: #9ba6b5; font-size: 7.5px; font-weight: 750; text-transform: uppercase; letter-spacing: .45px; }
.modal-detail-grid dd { margin: 0; color: #344056; font-size: 11px; font-weight: 650; }
.modal-detail-grid .detail-primary dd { font-size: 11px; }
.detail-modal-footer { display: flex; justify-content: flex-end; }

@media (max-width: 600px) {
    .detail-modal { align-items: end; padding: 0; }
    .detail-modal-dialog { width: 100%; max-height: 92vh; border-radius: 15px 15px 0 0; }
    .modal-detail-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 0 15px; }
    .modal-detail-grid .detail-primary { grid-column: auto; }
    .detail-record-head { align-items: flex-start; }
    .detail-modal-footer { display: flex; }
    .edit-modal, .delete-modal { align-items: end; padding: 0; }
    .edit-modal .modal-dialog, .delete-modal .modal-dialog { width: 100%; max-height: 92vh; border-radius: 15px 15px 0 0; }
}

@media (max-width: 1150px) { .metric-strip { grid-template-columns: repeat(2,1fr); }.filter-form { grid-template-columns: repeat(2,1fr); }.search-group { grid-column: span 2; } }
@media (max-width: 980px) { .analytics-layout { grid-template-columns: 1fr; }.analytics-side { grid-template-columns: repeat(2,1fr); } }
@media (max-width: 900px) {
    .sidebar { transform: translateX(-100%); transition: transform .2s ease; }.sidebar.open { transform: translateX(0); }.sidebar.open + .sidebar-backdrop { position: fixed; inset: 0; z-index: 35; display: block; background: rgba(28,37,58,.4); border: 0; }.content-shell { margin-left: 0; }.menu-toggle { display: grid; place-items: center; width: 34px; height: 34px; margin-right: 11px; color: var(--navy); background: #fff; border: 1px solid var(--line); border-radius: 7px; }
}
@media (max-width: 680px) {
    .topbar { padding: 0 16px; }.date-pill { display: none; }.main-content { padding: 20px 15px 32px; }.dashboard-intro, .heading-actions { align-items: flex-start; flex-direction: column; }.intro-actions, .heading-actions > .btn { width: 100%; }.intro-actions .btn { flex: 1; }.metric-strip { grid-template-columns: 1fr; }.analytics-side { grid-template-columns: 1fr; }.panel-tools { display: none; }.analytics-kpis { gap: 10px; padding-inline: 15px; }.line-chart-wrap { padding-inline: 10px; }.filter-form { grid-template-columns: 1fr; }.search-group { grid-column: auto; }.filter-actions .btn { flex: 1; }.form-grid, .detail-list.grid-two { grid-template-columns: 1fr; }.span-2 { grid-column: auto; }.footer { flex-direction: column; padding-inline: 16px; }
}
@media (max-width: 600px) {
    .input-modal { align-items: end; padding: 0; }.modal-dialog { width: 100%; max-height: 92vh; border-radius: 15px 15px 0 0; }.modal-body { padding: 15px; }.modal-form-grid { grid-template-columns: 1fr; }.modal-span-2 { grid-column: auto; }.modal-alert { margin-inline: 15px; }.modal-submit-status { display: none; }.modal-footer .btn { flex: 1; }
}
@media print { .sidebar,.topbar,.footer,.intro-actions,.heading-button-group,.form-actions-sticky { display:none!important; }.content-shell { margin:0; }.main-content { max-width:none; padding:0; }.panel { box-shadow:none; } }

/* Teal-blue dashboard theme */
:root { --sidebar: 205px; --blue: #0ca7a2; --blue-dark: #078c94; --soft: #eef2f3; --shadow: 0 4px 12px rgba(37,55,70,.12); }
body { background: #e9edef; }
.sidebar { width: var(--sidebar); padding: 20px 14px; color: #fff; background: linear-gradient(150deg,#06b5a8 0%,#078dac 45%,#2867c6 100%); border: 0; box-shadow: 4px 0 14px rgba(20,65,103,.16); overflow: hidden; }
.brand { position: relative; z-index: 2; padding: 0 12px 32px; }
.brand-mark { width: 31px; height: 31px; color: #fff; background: rgba(255,255,255,.16); box-shadow: none; font-size: 19px; }
.brand strong { color: #fff; font-size: 13px; }.brand small { color: rgba(255,255,255,.65); font-size: 7px; }
.main-nav { position: relative; z-index: 2; flex: 1 1 auto; min-height: 0; padding-right: 4px; overflow-x: hidden; overflow-y: auto; scrollbar-width: thin; scrollbar-color: rgba(255,255,255,.45) transparent; }
.main-nav::-webkit-scrollbar { width: 5px; }
.main-nav::-webkit-scrollbar-track { background: transparent; }
.main-nav::-webkit-scrollbar-thumb { background: rgba(255,255,255,.38); border-radius: 999px; }
.main-nav::-webkit-scrollbar-thumb:hover { background: rgba(255,255,255,.62); }
.nav-label { color: rgba(255,255,255,.63); }
.nav-link { color: rgba(255,255,255,.83); border-radius: 9px; font-size: 10px; }
.nav-link .nav-icon { color: rgba(255,255,255,.88); }
.nav-link:hover { color: #fff; background: rgba(255,255,255,.1); }
.nav-link.active { color: #fff; background: rgba(1,79,132,.28); box-shadow: inset 0 0 0 1px rgba(255,255,255,.07); }
.nav-link.active .nav-icon { color: #fff; }.nav-link.active::after { background: #fff; }
.nav-submenu { border-left-color: rgba(255,255,255,.25); }
.nav-sublink { color: rgba(255,255,255,.7); }
.nav-sublink:hover { color: #fff; background: rgba(255,255,255,.09); }
.nav-sublink.active { color: #fff; background: rgba(1,79,132,.25); }
.nav-link-muted, .nav-link-muted:hover { color: rgba(255,255,255,.78); }.nav-status-dot { background: #8df2bb; box-shadow: 0 0 0 3px rgba(141,242,187,.2); }
.sidebar-note { position: relative; z-index: 2; color: #fff; background: rgba(17,75,170,.18); border: 1px solid rgba(255,255,255,.08); border-radius: 10px; }
.sidebar-note .note-icon { color: #fff; background: rgba(255,255,255,.14); }.sidebar-note strong { color: #fff; }.sidebar-note small { color: rgba(255,255,255,.62); }
.theme-toggle { background: rgba(255,255,255,.95); }.theme-toggle i { background: #39b75e; }
.sidebar-pattern { position: absolute; top: 48%; right: -55px; color: rgba(255,255,255,.055); font-size: 18px; font-weight: 900; letter-spacing: 5px; transform: rotate(-50deg); }
.content-shell { margin: 10px 10px 10px var(--sidebar); overflow: hidden; background: #fff; border-radius: 0 18px 18px 0; box-shadow: 0 7px 20px rgba(38,55,67,.16); }
.topbar { min-height: 52px; padding: 0 20px; background: #fff; border-bottom-color: #eef1f3; }.topbar-title strong { color: #26394a; }.topbar-icon { color: #0da5a2; }.date-pill { color: #078e94; }
.main-content { max-width: none; padding: 16px 18px 28px; background: #fff; }.footer { padding: 13px 18px; background: #fff; }
.btn-primary { background: linear-gradient(135deg,#10b5a7,#078ea0); box-shadow: 0 5px 13px rgba(7,151,151,.22); }.btn-primary:hover { background: linear-gradient(135deg,#0ba99c,#077f92); }
.panel, .reference-panel { border-color: #e6e9eb; box-shadow: 0 3px 9px rgba(35,51,62,.13); }
.modal-title-icon { background: linear-gradient(145deg,#12b7aa,#087fa8); }

.reference-top-grid { display: grid; grid-template-columns: 225px minmax(0,1fr); gap: 16px; margin-bottom: 18px; }
.profile-summary-card, .company-summary-card, .reference-panel, .reference-data-section { background: #fff; border: 1px solid #e4e8ea; border-radius: 12px; box-shadow: 0 3px 9px rgba(35,51,62,.14); }
.profile-summary-card { display: flex; flex-direction: column; justify-content: space-between; min-height: 135px; padding: 18px 15px 11px; }
.profile-summary-main { display: flex; align-items: center; gap: 12px; }.profile-avatar { display: grid; place-items: center; flex: 0 0 55px; height: 55px; color: #fff; background: linear-gradient(145deg,#06b6a4,#2782c8); border-radius: 50%; font-size: 13px; font-weight: 850; }.profile-summary-main strong,.profile-summary-main small { display: block; }.profile-summary-main strong { color: #243440; font-size: 12px; }.profile-summary-main small { margin-top: 3px; color: #8e99a2; font-size: 6px; font-weight: 700; }
.profile-summary-meta { display: flex; justify-content: space-between; padding-top: 11px; color: #66737c; border-top: 1px solid #eef0f2; font-size: 6.5px; font-weight: 800; }
.company-summary-card { min-height: 135px; padding: 12px 14px 14px; }.company-summary-card > header { display: flex; align-items: flex-start; justify-content: space-between; margin-bottom: 10px; }.company-summary-card h1 { margin: 0; color: #303e49; font-size: 12px; }.company-summary-card p { margin: 1px 0 0; color: #9da6ad; font-size: 7px; }.company-summary-card header button { padding: 5px 10px; color: #fff; background: #09aaa1; border: 0; border-radius: 999px; font-size: 6.5px; font-weight: 700; }
.company-metrics { display: grid; grid-template-columns: repeat(3,1fr); gap: 28px; padding: 0 12px; }.company-metric { min-height: 62px; padding: 9px 12px; color: #fff; border-radius: 8px; }.company-metric span,.company-metric strong { display: block; }.company-metric span { font-size: 7px; }.company-metric strong { margin-top: 4px; font-size: 21px; text-align: center; }.company-metric.orange { background: linear-gradient(135deg,#ffb238,#ffbd52); }.company-metric.navy { background: linear-gradient(135deg,#27337f,#303fab); }.company-metric.blue { background: linear-gradient(135deg,#1578bd,#2689d2); }

.reference-chart-grid { display: grid; grid-template-columns: minmax(0,1.65fr) minmax(250px,.72fr); gap: 14px; margin-bottom: 17px; }.reference-panel { overflow: hidden; }.reference-panel > header { display: flex; align-items: flex-start; justify-content: space-between; padding: 14px 16px 5px; }.reference-panel h2 { margin: 0; color: #34414a; font-size: 11px; }.reference-panel header p { margin: 2px 0 0; color: #a1aab0; font-size: 7px; }.main-graph-card header a { padding: 5px 9px; color: #fff; background: #0aa79f; border-radius: 999px; font-size: 7px; font-weight: 700; }.donut-project-card header > span { color: #929ca4; font-size: 11px; }
.reference-line-chart { display: grid; grid-template-columns: 27px 1fr; gap: 7px; height: 235px; padding: 16px 24px 4px 17px; }.reference-y-axis { display: flex; flex-direction: column; justify-content: space-between; height: 170px; color: #8d979f; font-size: 7px; text-align: right; }.reference-svg-wrap svg { display: block; width: 100%; height: 185px; overflow: visible; }.reference-grid-line { stroke: #e6e9eb; stroke-width: 1; }.reference-chart-line { fill: none; stroke: #f4a42b; stroke-width: 2; vector-effect: non-scaling-stroke; }.reference-chart-point { fill: #ffab32; stroke: #3d3b35; stroke-width: 1.7; vector-effect: non-scaling-stroke; }.reference-point-label { fill: #6e777e; font-size: 8px; font-weight: 700; }.reference-x-axis { display: grid; grid-template-columns: repeat(6,1fr); color: #717c84; font-size: 7px; text-align: center; }
.reference-legend { display: flex; justify-content: center; gap: 38px; padding: 7px 15px 16px; color: #89939b; font-size: 7px; }.reference-legend span { display: flex; align-items: center; gap: 6px; }.reference-legend i,.reference-donut-legend i { width: 10px; height: 10px; }.reference-legend .orange,.reference-donut-legend .orange { background: #ffad32; }.reference-legend .green,.reference-donut-legend .green { background: #31bc76; }.reference-legend .blue,.reference-donut-legend .blue { background: #167bbb; }.reference-donut-legend .gray { background: #d8dde0; }
.reference-donut { position: relative; display: grid; place-items: center; width: 125px; height: 125px; margin: 20px auto 22px; border-radius: 50%; }.reference-donut::before { position: absolute; width: 78px; height: 78px; background: #fff; border-radius: 50%; content: ""; }.reference-donut > div { position: relative; z-index: 1; text-align: center; }.reference-donut strong,.reference-donut small { display: block; }.reference-donut strong { color: #47525a; font-size: 19px; }.reference-donut small { color: #99a2a8; font-size: 7px; }.reference-donut-legend { display: flex; flex-wrap: wrap; justify-content: center; gap: 14px; padding: 0 10px 18px; color: #8a949b; font-size: 6.5px; }.reference-donut-legend span { display: flex; align-items: center; gap: 5px; }

.reference-data-section { margin-bottom: 17px; padding: 12px 14px 14px; }.reference-section-header { display: grid; grid-template-columns: 1fr 190px auto; gap: 18px; align-items: center; margin-bottom: 10px; }.reference-section-header h2 { margin: 0; color: #34414a; font-size: 11px; }.reference-section-header p { margin: 1px 0 0; color: #9ca6ad; font-size: 7px; }.reference-search { padding: 6px 11px; color: #7f8a91; background: #f1f2f3; border-radius: 999px; font-size: 7px; }.reference-section-header > a { padding: 6px 12px; color: #fff; background: #08a89f; border-radius: 999px; font-size: 7px; font-weight: 700; }.reference-data-grid { display: grid; grid-template-columns: 1fr 1fr 1.12fr; gap: 17px; }.ring-stat-card,.mini-analytics-card { display: flex; align-items: center; gap: 14px; min-height: 108px; padding: 12px; background: #fff; border: 1px solid #e8ebed; border-radius: 10px; box-shadow: 0 2px 6px rgba(37,51,61,.1); }.reference-ring { position: relative; display: grid; place-items: center; flex: 0 0 78px; height: 78px; background: conic-gradient(var(--ring-color) 0 var(--ring-value),#e7eaec var(--ring-value) 360deg); border-radius: 50%; }.reference-ring::before { position: absolute; width: 59px; height: 59px; background: #fff; border-radius: 50%; content: ""; }.reference-ring span { position: relative; z-index: 1; color: var(--ring-color); font-size: 16px; font-weight: 850; }.orange-ring { --ring-color:#ff981a; }.green-ring { --ring-color:#7ac943; }.ring-stat-card > div:last-child span,.ring-stat-card strong,.ring-stat-card small { display: block; }.ring-stat-card > div:last-child span { color: #5f6b73; font-size: 9px; font-weight: 700; }.ring-stat-card strong { color: #555f66; font-size: 15px; }.ring-stat-card small { margin-top: 4px; color: #46b66f; font-size: 7px; }
.mini-analytics-card { display: grid; grid-template-rows: auto 1fr; padding: 10px 14px; }.mini-analytics-card div { display: flex; justify-content: space-between; }.mini-analytics-card strong { color: #5b666d; font-size: 15px; }.mini-analytics-card span { color: #8d979e; font-size: 7px; }.mini-analytics-card svg { width: 100%; height: 54px; }.mini-analytics-card polyline { fill: none; stroke: #08a79e; stroke-width: 2.2; vector-effect: non-scaling-stroke; }
.reference-recent-table { margin-bottom: 4px; }.reference-recent-table > header { padding: 13px 15px; border-bottom: 1px solid #edf0f1; }.reference-recent-table header a { color: #079c98; font-size: 7px; font-weight: 700; }

.filter-panel,.register-panel,.form-section,.single-detail { border-radius: 11px; box-shadow: 0 3px 9px rgba(35,51,62,.1); }.record-link,.text-link,.back-link { color: #079d9a; }.icon-btn:hover { color: #079d9a; border-color: #a8dedb; background: #effaf9; }.modal-close:hover { color: #079d9a; background: #eaf8f7; }.section-number,.modal-section-heading > span { color: #079d9a; background: #e3f7f5; }.input-with-icon span { color: #0ba59f; }input:focus,select:focus,textarea:focus { border-color: #37bcb5; box-shadow: 0 0 0 3px rgba(13,170,162,.1); }

@media (max-width: 1050px) { .reference-top-grid { grid-template-columns: 1fr; }.profile-summary-card { min-height: 105px; }.reference-chart-grid { grid-template-columns: 1fr; }.donut-project-card { min-height: 260px; }.reference-data-grid { grid-template-columns: 1fr 1fr; }.mini-analytics-card { grid-column: span 2; } }
@media (max-width: 900px) { .content-shell { margin: 0; border-radius: 0; }.sidebar { transform: translateX(-100%); }.sidebar.open { transform: translateX(0); } }
@media (max-width: 650px) { .company-metrics { grid-template-columns: 1fr; gap: 8px; padding: 0; }.company-summary-card { min-height: auto; }.company-metric { min-height: 52px; }.reference-data-grid { grid-template-columns: 1fr; }.mini-analytics-card { grid-column: auto; }.reference-section-header { grid-template-columns: 1fr auto; }.reference-search { display: none; }.reference-line-chart { padding-inline: 8px; }.reference-legend { gap: 12px; }.reference-top-grid,.reference-chart-grid { gap: 10px; } }

/* Agendaris - Surat Masuk */
.progress-document-tabs { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; margin: -7px 0 18px; padding: 6px; background: #eef3f6; border: 1px solid #e1e7ec; border-radius: 13px; }
.progress-document-tab { position: relative; display: grid; grid-template-columns: 38px 1fr; grid-template-rows: auto auto; column-gap: 11px; align-items: center; min-height: 67px; padding: 11px 14px; color: #6d7b8d; background: transparent; border: 1px solid transparent; border-radius: 10px; transition: .18s ease; }
.progress-document-tab > span { display: grid; grid-row: 1 / span 2; place-items: center; width: 38px; height: 38px; color: #77909d; background: #e2eaee; border-radius: 10px; font-size: 17px; font-weight: 800; }
.progress-document-tab strong { align-self: end; color: #526075; font-size: 10px; }
.progress-document-tab small { align-self: start; margin-top: 2px; color: #8d99a9; font-size: 7.5px; }
.progress-document-tab:hover { color: #078f91; background: rgba(255,255,255,.65); }
.progress-document-tab.active { background: #fff; border-color: #b9e2df; box-shadow: 0 4px 12px rgba(36,76,83,.09); }
.progress-document-tab.active > span { color: #fff; background: linear-gradient(145deg,#11b7aa,#078fa7); }
.progress-document-tab.active strong { color: #087f82; }
.agendaris-filter-form { display: grid; grid-template-columns: minmax(250px,1.5fr) minmax(145px,.8fr) minmax(165px,.72fr) minmax(165px,.72fr) 44px auto; gap: 11px; align-items: end; }
.agendaris-filter-form.sdm-list-filter-form { grid-template-columns:minmax(250px,1.5fr) minmax(170px,.7fr) 44px auto; }
.agendaris-filter-form.progress-outgoing-filter-form { grid-template-columns:minmax(250px,1.5fr) minmax(170px,.7fr) 44px auto; }
.agendaris-heading-actions { align-items: center; }
.agendaris-heading-actions form { margin: 0; }
.btn-agendaris-sync { color: #078f91; border-color: #b8ddda; background: #f0fbfa; }
.btn-agendaris-sync:hover { color: #067779; border-color: #8ecdc8; background: #e4f7f5; }
.agendaris-table-panel { border-top: 3px solid #0aa39f; }
.table-list-footer { display: flex; align-items: center; justify-content: space-between; min-height: 58px; padding: 0 18px; border-top: 1px solid #f0f2f6; }
.table-list-footer .pagination-wrap { padding: 14px 0; border-top: 0; }
.table-length-form { display: flex; align-items: center; gap: 7px; color: #788598; font-size: 9px; }
.table-length-form label { font-weight: 700; }
.table-length-form select { width: 68px; height: 31px; padding: 5px 9px; font-size: 9px; }
.agendaris-form-modal[hidden],.agendaris-detail-modal[hidden],.agendaris-delete-modal[hidden] { display: none; }
.agendaris-form-modal,.agendaris-detail-modal,.agendaris-delete-modal { position: fixed; inset: 0; z-index: 120; display: grid; place-items: center; padding: 22px; opacity: 0; transition: opacity .18s ease; }
.agendaris-form-modal.open,.agendaris-detail-modal.open,.agendaris-delete-modal.open { opacity: 1; }
.agendaris-form-modal.open .modal-dialog,.agendaris-detail-modal.open .modal-dialog,.agendaris-delete-modal.open .modal-dialog { transform: translateY(0) scale(1); }
.agendaris-modal-dialog { width: min(680px,100%); max-height: calc(100vh - 44px); }
[data-agendaris-form] { display: flex; flex: 1; flex-direction: column; min-height: 0; }
.agendaris-form-modal .outgoing-distribution-steps { justify-content: flex-start; gap: 7px; padding-inline: 16px; overflow-x: auto; scrollbar-width: thin; }
.agendaris-form-modal .outgoing-distribution-steps span { flex: 0 0 auto; }.agendaris-form-modal .outgoing-distribution-steps i { flex: 1 0 24px; max-width: 38px; }
[data-progress-form] { display: flex; flex: 1; flex-direction: column; min-height: 0; }
#progressDocumentFormModal .agendaris-modal-body { overflow-y: auto; }
[data-progress-detail-edit][hidden] { display: none; }
.agendaris-modal-body { padding: 14px 18px 16px; overflow: visible; }
.agendaris-modal-body[data-agendaris-step="3"] { flex: 1 1 auto; min-height: 0; overflow-y: auto; overscroll-behavior: contain; scrollbar-gutter: stable; scrollbar-color: #72c9c2 #edf5f5; scrollbar-width: thin; }
.agendaris-modal-body[data-agendaris-step="3"]::-webkit-scrollbar { width: 7px; }
.agendaris-modal-body[data-agendaris-step="3"]::-webkit-scrollbar-track { background: #edf5f5; border-radius: 999px; }
.agendaris-modal-body[data-agendaris-step="3"]::-webkit-scrollbar-thumb { background: linear-gradient(#20b9ad,#078f9d); border-radius: 999px; }
.agendaris-form-grid { gap: 11px 14px; }
.agenda-number-control { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 8px; align-items: center; }
.agenda-number-control .btn { min-height: 48px; padding-inline: 14px; white-space: nowrap; }
.btn-agenda-generate { color: #fff; background: linear-gradient(135deg,#16c7b7,#078ea0); border-color: #078ea0; box-shadow: 0 6px 14px rgba(7,151,151,.24); }
.btn-agenda-generate:hover { background: linear-gradient(135deg,#0fb6a8,#077f92); border-color: #077f92; box-shadow: 0 8px 17px rgba(7,127,146,.28); }
.btn-agenda-generate:focus-visible { outline: 3px solid rgba(16,181,167,.25); outline-offset: 2px; }
.btn-agenda-generate:disabled { color: #749597; background: #e1f1f0; border-color: #c9e5e2; box-shadow: none; cursor: not-allowed; }
.btn-agenda-generate[data-can-cancel="true"] { color:#668e91;background:#e1f1f0;border-color:#c9e5e2;box-shadow:none;cursor:pointer; }
.btn-agenda-generate[data-can-cancel="true"]:hover { color:#497f82;background:#d6ece9;border-color:#b9ddd9; }
.agenda-number-control input[readonly] { color: #344158; background: #f7f9fb; }
.disposition-form-timeline { display: grid; gap: 11px; }
.disposition-form-stage { display: grid; grid-template-columns: 34px minmax(0,1fr); gap: 10px; }
.disposition-stage-marker { position: relative; display: flex; justify-content: center; }
.disposition-stage-marker span { position: relative; z-index: 1; display: grid; place-items: center; width: 30px; height: 30px; color: #fff; background: linear-gradient(145deg,#13b8aa,#078e9f); border: 3px solid #e7f8f6; border-radius: 50%; font-size: 7px; font-weight: 850; box-sizing: border-box; }
.disposition-stage-marker i { position: absolute; top: 29px; bottom: -14px; width: 2px; background: linear-gradient(#8bd6cf,#dcebea); }
.disposition-form-stage:last-child .disposition-stage-marker i { display: none; }
.disposition-stage-panel { overflow: hidden; background: #fbfdfd; border: 1px solid #dce9e8; border-radius: 10px; box-shadow: 0 3px 9px rgba(37,73,75,.05); }
.disposition-stage-panel > header { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 10px 12px; background: linear-gradient(105deg,#edf9f7,#f7faff); border-bottom: 1px solid #e3ecec; }
.disposition-stage-panel > header strong,.disposition-stage-panel > header small { display: block; }.disposition-stage-panel > header strong { color: #35445a; font-size: 9px; }.disposition-stage-panel > header small { margin-top: 2px; color: #91a0ae; font-size: 7px; }
.disposition-stage-state { padding: 4px 7px; color: #7b8795; background: #eef2f4; border: 1px solid #dce3e7; border-radius: 999px; font-size: 7px; font-weight: 800; white-space: nowrap; }
.disposition-stage-state.filled { color: #087e79; background: #e3f7f4; border-color: #bde5df; }
.disposition-stage-fields { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px 12px; padding: 11px 12px 12px; }
.disposition-stage-fields .form-group { min-width: 0; }.disposition-recipient-field,.disposition-note-field { grid-column: 1/-1; }.disposition-stage-fields textarea { min-height: 58px; resize: vertical; }
.disposition-detail-section { padding-bottom: 15px; }
.disposition-detail-timeline { display: grid; gap: 0; padding: 14px 2px 4px; }
.disposition-detail-item { position: relative; display: grid; grid-template-columns: 34px minmax(0,1fr); gap: 10px; min-height: 84px; }
.disposition-detail-item::before { position: absolute; top: 30px; bottom: 0; left: 15px; width: 2px; background: #dce8e7; content: ""; }.disposition-detail-item:last-child::before { display: none; }
.disposition-detail-dot { position: relative; z-index: 1; display: grid; place-items: center; width: 30px; height: 30px; color: #fff; background: #aeb9c3; border: 4px solid #eef2f4; border-radius: 50%; font-size: 7px; font-weight: 850; box-sizing: border-box; }
.disposition-detail-item.filled .disposition-detail-dot { background: linear-gradient(145deg,#13b8aa,#078e9f); border-color: #e5f7f5; }
.disposition-detail-card { margin-bottom: 10px; padding: 11px 13px; background: #fafcfc; border: 1px solid #e0e9e9; border-radius: 9px; }
.disposition-detail-card header { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; }.disposition-detail-card h3 { margin: 0; color: #344158; font-size: 10px; }.disposition-detail-card time { display: block; margin-top: 3px; color: #8795a5; font-size: 7.5px; }
.disposition-detail-card p { margin: 8px 0 0; padding-top: 8px; color: #657286; border-top: 1px dashed #dde6e7; font-size: 8px; line-height: 1.5; }
.disposition-edit-history { margin: 0 0 14px; padding: 12px 14px 5px; background: #f7fafb; border: 1px solid #dce8eb; border-radius: 10px; }
.disposition-edit-history[hidden] { display: none!important; }
.disposition-edit-history > header { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding-bottom: 9px; border-bottom: 1px solid #e2eaed; }
.disposition-edit-history > header strong,.disposition-edit-history > header small { display: block; }
.disposition-edit-history > header strong { color: #35445a; font-size: 9px; }
.disposition-edit-history > header small { margin-top: 2px; color: #8e9dab; font-size: 7px; }
.disposition-edit-history > header > span { padding: 4px 7px; color: #68788a; background: #edf2f5; border: 1px solid #dce4e9; border-radius: 999px; font-size: 7px; font-weight: 800; white-space: nowrap; }
.disposition-history-compact { display: grid; max-height: 190px; gap: 7px; padding: 10px 1px 3px; overflow-y: auto; scrollbar-width: thin; }
.disposition-history-compact .disposition-detail-item { grid-template-columns: 29px minmax(0,1fr); min-height: 0; gap: 8px; }
.disposition-history-compact .disposition-detail-item::before { display: none; }
.disposition-history-compact .disposition-detail-dot { width: 28px; height: 28px; border-width: 2px; border-radius: 8px; }
.disposition-history-compact .disposition-detail-card { margin: 0; padding: 7px 10px; border-left: 3px solid #10aaa5; border-radius: 8px; }
.disposition-history-compact .disposition-detail-card header { align-items: center; }
.disposition-history-compact .disposition-detail-card header > div { display: flex; min-width: 0; align-items: center; gap: 8px; }
.disposition-history-compact .disposition-detail-card h3 { overflow: hidden; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.disposition-history-compact .disposition-detail-card time { flex: 0 0 auto; margin: 0; font-size: 7px; }
.disposition-history-compact .disposition-detail-card p { overflow: hidden; margin: 5px 0 0; padding-top: 5px; font-size: 7.5px; line-height: 1.35; text-overflow: ellipsis; white-space: nowrap; }
.disposition-history-only { display: inline-flex; align-items: center; padding: 5px 8px; color: #65778b; background: #edf2f5; border: 1px solid #dce5ea; border-radius: 999px; font-size: 7px; font-weight: 850; white-space: nowrap; }
.disposition-status-badge { display: inline-flex; padding: 4px 7px; border: 1px solid; border-radius: 999px; font-size: 7px; font-weight: 850; white-space: nowrap; }.disposition-status-badge.empty { color: #7d8996; background: #f0f3f5; border-color: #dde3e7; }.disposition-status-badge.pending { color: #a36b16; background: #fff4df; border-color: #efd5a0; }.disposition-status-badge.received { color: #3269a8; background: #edf5ff; border-color: #c9dcf3; }.disposition-status-badge.active { color: #087e79; background: #e3f7f4; border-color: #bde5df; }.disposition-status-badge.forwarded { color: #7155a3; background: #f3effc; border-color: #d9cff0; }.disposition-status-badge.completed { color: #31794f; background: #eaf7ef; border-color: #c5e6d1; }
.disposition-table-tracking { display: grid; min-width: 130px; gap: 3px; }.disposition-table-tracking strong { max-width: 180px; overflow: hidden; color: #000; font-size: 8.5px; text-overflow: ellipsis; white-space: nowrap; }.disposition-table-tracking > span { color: #8d99a7; font-size: 7px; }.disposition-table-tracking .disposition-status-badge { justify-self: start; margin-top: 2px; font-style: normal; }
.agendaris-form-grid .field-source-locked label::after { margin-left: 4px; content: "🔒"; }
.agendaris-form-grid .field-source-locked input,.agendaris-form-grid .field-source-locked select { color: #647188; background: #f3f6f8; border-color: #dfe5ea; cursor: not-allowed; }
.agenda-link-field { padding: 10px 12px; background: #f4f9ff; border: 1px dashed #9fcaf5; border-radius: 8px; }
.agenda-link-field input { background: #fff; }
.agenda-file-link { color: #0a65d2; font-weight: 800; text-decoration: underline; text-underline-offset: 2px; }
.agendaris-detail-modal .modal-header,.agendaris-detail-modal .modal-footer { flex: 0 0 auto; }
.agendaris-detail-content { display: grid; flex: 1 1 auto; gap: 14px; min-height: 0; padding: 14px 20px 18px; overflow-y: auto; overscroll-behavior: contain; scrollbar-gutter: stable; }
.agendaris-detail-section { padding: 15px 17px 5px; background: #fff; border: 1px solid #e4e9ed; border-radius: 10px; box-shadow: 0 3px 10px rgba(35,51,62,.05); }
.agendaris-detail-section-heading { margin-bottom: 0; }
.agendaris-detail-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 0 22px; margin: 0; }
.agendaris-detail-grid > div { min-width: 0; padding: 14px 0; border-bottom: 1px solid #edf0f3; }
.agendaris-detail-grid dt { margin-bottom: 4px; color: #96a1af; font-size: 8px; font-weight: 800; text-transform: uppercase; letter-spacing: .4px; }
.agendaris-detail-grid dd { margin: 0; color: #354157; font-size: 11px; font-weight: 700; overflow-wrap: anywhere; }
.agenda-incomplete { display: inline-block; padding: 4px 7px; color: #a56d00; background: #fff6c9; border: 1px solid #f5cf58; border-radius: 999px; font-size: 7.5px; font-weight: 750; }
.agenda-source { display: inline-flex; align-items: center; padding: 4px 8px; border: 1px solid; border-radius: 999px; font-size: 7.5px; font-weight: 800; white-space: nowrap; }
.agenda-source.security { color: #008d58; background: #e4fbef; border-color: #a7edc8; }
.agenda-source.manual { color: #0878c1; background: #e7f5ff; border-color: #b9e1f7; }

@media (max-width: 1150px) {
    .agendaris-filter-form { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .agendaris-filter-form .search-group { grid-column: span 2; }
}

@media (max-width: 650px) {
    .progress-document-tabs { grid-template-columns: 1fr; }
    .agendaris-heading-actions { width: 100%; }
    .agendaris-heading-actions form,.agendaris-heading-actions .btn { flex: 1; }
    .agendaris-heading-actions form .btn { width: 100%; }
    .agendaris-filter-form { grid-template-columns: 1fr; }
    .agendaris-filter-form .search-group { grid-column: auto; }
    .table-list-footer { flex-wrap: wrap; gap: 6px 14px; padding: 10px 14px; }
    .table-list-footer .pagination-wrap { margin-left: auto; padding: 4px 0; }
    .agendaris-form-modal,.agendaris-detail-modal,.agendaris-delete-modal { align-items: end; padding: 0; }
    .agendaris-modal-dialog,.agendaris-delete-modal .modal-dialog { width: 100%; max-height: 92vh; border-radius: 15px 15px 0 0; }
    .agendaris-modal-body { overflow-y: auto; }
    .agendaris-form-grid,.agendaris-detail-grid { grid-template-columns: 1fr; }
    .agenda-number-control { grid-template-columns: 1fr; }
    .disposition-stage-fields { grid-template-columns: 1fr; }.disposition-recipient-field,.disposition-note-field { grid-column: auto; }
    .agendaris-form-grid .modal-span-2,.agendaris-detail-grid .span-2 { grid-column: auto; }
}

/* Distribusi Dokumen */
.distribution-heading { margin-bottom: 16px; }
.distribution-sync-card { display: grid; grid-template-columns: 42px 1fr auto; gap: 13px; align-items: center; margin-bottom: 15px; padding: 13px 16px; background: linear-gradient(110deg,#eefbf9,#f4f8ff); border: 1px solid #cceae7; border-radius: 11px; box-shadow: 0 2px 7px rgba(35,83,86,.08); }
.sync-icon { display: grid; place-items: center; width: 42px; height: 42px; color: #079d98; background: #dff5f2; border-radius: 50%; font-size: 20px; font-weight: 700; }
.distribution-sync-card > div:nth-child(2) strong,.distribution-sync-card > div:nth-child(2) p { display: block; }.distribution-sync-card > div:nth-child(2) strong { color: #37505a; font-size: 10px; }.distribution-sync-card > div:nth-child(2) p { margin: 2px 0 0; color: #839299; font-size: 8px; }
.sync-total { min-width: 110px; padding-left: 16px; border-left: 1px solid #d5e8e6; text-align: right; }.sync-total strong,.sync-total span { display: block; }.sync-total strong { color: #078f91; font-size: 18px; }.sync-total span { color: #8d999f; font-size: 7px; }
.distribution-filter-form { display: grid; grid-template-columns: minmax(240px,1.5fr) minmax(145px,.7fr) minmax(145px,.7fr) 44px auto; gap: 11px; align-items: end; }
.distribution-table-panel { border-top: 3px solid #0aa39f; }
.distribution-outgoing-panel { margin-top: 16px; border-top-color: #3876c8; }
.distribution-section-title { display: flex; align-items: center; justify-content: space-between; padding: 13px 16px; border-bottom: 1px solid #edf0f3; }
.distribution-section-title > div { display: flex; align-items: center; gap: 8px; }.distribution-section-title > div > span { display: grid; place-items: center; width: 27px; height: 27px; color: #078f91; background: #e4f7f5; border-radius: 7px; font-size: 8px; font-weight: 850; }.distribution-section-title h2 { margin: 0; color: #344056; font-size: 11px; }.distribution-section-title small { color: #96a1af; font-size: 8px; }
.distribution-detail-button { color: #078f95; background: #edf9f8; border-color: #cce9e6; }
.distribution-action-button { min-width: 58px; padding: 6px 10px; color: #fff; background: linear-gradient(135deg,#11b4a8,#078f9d); border: 0; border-radius: 7px; box-shadow: 0 4px 9px rgba(8,151,153,.18); font-size: 7.5px; font-weight: 750; }
.distribution-action-button:hover { transform: translateY(-1px); box-shadow: 0 6px 12px rgba(8,151,153,.23); }
.pickup-status { display: inline-block; max-width: 160px; overflow: hidden; padding: 5px 8px; border-radius: 999px; font-size: 7.5px; font-weight: 750; text-overflow: ellipsis; white-space: nowrap; vertical-align: middle; }
.pickup-status.pending { color: #a26b18; background: #fff4de; border: 1px solid #f1d9aa; }.pickup-status.completed { color: #087a71; background: #e2f7f3; border: 1px solid #bfe7e1; }
.locked-pickup-detail { padding: 14px !important; background: #f0faf8; border: 1px solid #cdeae6 !important; border-radius: 8px; }.locked-pickup-detail dt { color: #078f8b; }.locked-pickup-detail small,.pickup-detail-row small { display: block; margin-top: 5px; color: #8b989e; font-size: 7.5px; }.pickup-detail-row { margin-top: 6px; padding: 13px !important; background: #f0faf8; border: 1px solid #cdeae6 !important; border-radius: 8px; }
.locked-pickup-detail .pickup-time,.pickup-detail-row .pickup-time { color: #078f8b; font-weight: 800; }

/* Popup proses distribusi */
.distribution-action-modal[hidden] { display: none; }
.distribution-action-modal { position: fixed; inset: 0; z-index: 115; display: grid; place-items: center; padding: 22px; opacity: 0; transition: opacity .18s ease; }
.distribution-action-modal.open { opacity: 1; }.distribution-action-modal.open .modal-dialog { transform: translateY(0) scale(1); }
.distribution-action-dialog { width: min(720px,100%); }
.distribution-title-icon { background: linear-gradient(145deg,#12b8a8,#087ca9); }
[data-distribution-form],[data-outgoing-distribution-form] { display: flex; flex: 1; flex-direction: column; min-height: 0; }[data-distribution-form][hidden],[data-outgoing-distribution-form][hidden] { display: none; }
.locked-document-grid label { display: flex; align-items: center; justify-content: space-between; }.locked-document-grid label i { color: #9aa5ac; font-size: 8px; font-style: normal; }.locked-document-grid input[readonly] { color: #67747d; background: #f5f7f8; border-color: #e3e7e9; cursor: not-allowed; }
.locked-document-grid textarea[readonly] { color: #67747d; background: #f5f7f8; border-color: #e3e7e9; cursor: not-allowed; }
.pickup-heading { margin-top: 22px; }.pickup-heading > span { color: #fff; background: #0aa59e; }.pickup-field { padding: 14px; background: linear-gradient(110deg,#edfaf8,#f5fbff); border: 1px solid #cae9e5; border-radius: 9px; }.pickup-field input { background: #fff; border-color: #7ecdc7; }.pickup-field label { color: #087e7c; }
.outgoing-distribution-steps { display: flex; align-items: center; justify-content: center; gap: 10px; padding: 14px 20px 0; color: #9aa6b6; font-size: 8px; font-weight: 750; }.outgoing-distribution-steps span { display: flex; align-items: center; gap: 6px; }.outgoing-distribution-steps b { display: grid; place-items: center; width: 25px; height: 25px; background: #edf1f4; border-radius: 7px; font-size: 7px; }.outgoing-distribution-steps i { width: 48px; height: 1px; background: #dfe5ea; }.outgoing-distribution-steps span.active { color: #078f8b; }.outgoing-distribution-steps span.active b { color: #fff; background: #0aa59e; }.outgoing-distribution-step { margin: 14px 20px 18px; padding: 17px; background: #fff; border: 1px solid #e5eaee; border-radius: 11px; box-shadow: 0 4px 12px rgba(35,51,62,.06); }.outgoing-distribution-step[hidden] { display: none; }
[data-outgoing-step="2"] { flex: 1 1 auto; min-height: 0; overflow-y: auto; overscroll-behavior: contain; }
.outgoing-handover-info,.outgoing-handover-form { margin-top: 14px; }
.outgoing-handover-history { margin: 14px 0 0; }
.outgoing-security-locked select { color: #68788a; background: #f2f5f6; border-color: #dfe5e8; pointer-events: none; }
.outgoing-security-locked label::after { margin-left: 5px; content: "🔒"; }
[data-outgoing-step-back][hidden],[data-outgoing-step-next][hidden],[data-outgoing-distribution-submit][hidden],[data-outgoing-handover-open][hidden],[data-agendaris-step-back][hidden],[data-agendaris-step-next][hidden],[data-agendaris-submit][hidden] { display: none; }
.agenda-control-sheet-action { align-items: flex-start; padding: 14px; background: #f4f9ff; border: 1px dashed #9fcaf5; border-radius: 9px; }.agenda-control-sheet-action .btn { align-self: flex-start; color:#0a65d2; border-color:#b8d9f5; background:#fff; }.agenda-control-sheet-action .btn:hover { color:#fff; border-color:#0a65d2; background:#0a65d2; }.agenda-control-sheet-action small { color: #6e7e90; }

@media (max-width: 1000px) { .distribution-filter-form { grid-template-columns: repeat(2,1fr); }.distribution-filter-form .search-group { grid-column: span 2; } }
@media (max-width: 600px) { .distribution-sync-card { grid-template-columns: 38px 1fr; }.sync-icon { width: 38px; height: 38px; }.sync-total { grid-column: span 2; padding: 10px 0 0; border-top: 1px solid #d5e8e6; border-left: 0; text-align: left; }.distribution-filter-form { grid-template-columns: 1fr; }.distribution-filter-form .search-group { grid-column: auto; }.distribution-section-title { align-items: flex-start; flex-direction: column; gap: 5px; }.distribution-action-modal { align-items: end; padding: 0; }.distribution-action-dialog { width: 100%; max-height: 94vh; border-radius: 15px 15px 0 0; } }

/* Authentication and active account */
.sidebar-account { position: relative; z-index: 2; display: grid; grid-template-columns: 31px minmax(0,1fr) 28px; gap: 8px; align-items: center; margin-top: auto; padding: 10px; color: #fff; background: rgba(16,63,147,.22); border: 1px solid rgba(255,255,255,.12); border-radius: 10px; }
.sidebar-account-avatar { display: grid; place-items: center; width: 31px; height: 31px; color: #078f95; background: #fff; border-radius: 50%; font-size: 11px; font-weight: 850; }
.sidebar-account strong,.sidebar-account small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sidebar-account strong { font-size: 9px; }.sidebar-account small { margin-top: 2px; color: rgba(255,255,255,.66); font-size: 7px; }
.sidebar-account form { margin: 0; }.sidebar-account button { display: grid; place-items: center; width: 28px; height: 28px; padding: 0; color: #fff; background: rgba(255,255,255,.12); border: 0; border-radius: 7px; cursor: pointer; }.sidebar-account button:hover { background: rgba(255,255,255,.22); }

.login-page { min-height: 100vh; margin: 0; background: #e8eef1; }
.login-shell { display: grid; grid-template-columns: minmax(320px,.9fr) minmax(420px,1.1fr); width: min(940px,calc(100% - 40px)); min-height: 590px; margin: max(28px,calc((100vh - 590px)/2)) auto; overflow: hidden; background: #fff; border-radius: 22px; box-shadow: 0 18px 50px rgba(31,50,68,.18); }
.login-brand-panel { position: relative; display: flex; flex-direction: column; padding: 42px; overflow: hidden; color: #fff; background: linear-gradient(150deg,#06b5a8 0%,#078dac 48%,#2867c6 100%); }
.login-brand-panel::before,.login-brand-panel::after { position: absolute; border: 1px solid rgba(255,255,255,.1); border-radius: 50%; content: ""; }.login-brand-panel::before { right: -130px; bottom: -130px; width: 340px; height: 340px; }.login-brand-panel::after { right: -65px; bottom: -65px; width: 210px; height: 210px; }
.login-brand { position: relative; z-index: 1; display: flex; align-items: center; gap: 12px; }.login-brand-mark { display: grid; place-items: center; width: 43px; height: 43px; background: rgba(255,255,255,.16); border-radius: 13px; font-size: 26px; font-weight: 850; }.login-brand strong,.login-brand small { display: block; }.login-brand strong { font-size: 17px; }.login-brand small { margin-top: 2px; color: rgba(255,255,255,.7); font-size: 9px; }
.login-brand-copy { position: relative; z-index: 1; margin: auto 0; }.login-brand-copy > span,.login-eyebrow { color: #77f0dd; font-size: 9px; font-weight: 850; letter-spacing: 1.5px; }.login-brand-copy h1 { max-width: 370px; margin: 13px 0 15px; font-size: clamp(27px,3.3vw,41px); line-height: 1.12; }.login-brand-copy p { max-width: 360px; margin: 0; color: rgba(255,255,255,.72); font-size: 12px; line-height: 1.75; }.login-copyright { position: relative; z-index: 1; color: rgba(255,255,255,.55); font-size: 8px; }
.login-form-panel { display: grid; place-items: center; padding: 55px clamp(35px,6vw,82px); }.login-form-wrap { width: 100%; max-width: 410px; }.login-eyebrow { color: #079f9a; }.login-form-wrap h2 { margin: 9px 0 7px; color: #26364c; font-size: 29px; }.login-form-wrap > p { margin: 0 0 28px; color: #909baa; font-size: 11px; }.login-form { display: grid; gap: 18px; }.login-form .form-group { display: grid; gap: 7px; }.login-form label { color: #5f6d82; font-size: 10px; font-weight: 750; }.login-form input { width: 100%; height: 50px; padding: 0 15px; color: #344158; background: #fff; border: 1px solid #dce3eb; border-radius: 10px; font: inherit; font-size: 12px; box-sizing: border-box; }.login-form input:focus { outline: 0; border-color: #25b6ae; box-shadow: 0 0 0 3px rgba(13,170,162,.1); }.password-field { position: relative; }.password-field input { padding-right: 76px; }.password-field button { position: absolute; top: 50%; right: 12px; padding: 5px; color: #078f95; background: transparent; border: 0; font-size: 9px; font-weight: 750; cursor: pointer; transform: translateY(-50%); }.login-submit { width: 100%; min-height: 50px; margin-top: 2px; border: 0; font-size: 11px; }.login-help { margin: 20px 0 0 !important; text-align: center; font-size: 9px !important; }.login-alert { margin: 0 0 20px; padding: 11px 13px; border: 1px solid; border-radius: 9px; font-size: 10px; line-height: 1.5; }.login-alert.danger { color: #a73b42; background: #fff1f2; border-color: #f3c9cd; }.login-alert.success { color: #08765e; background: #eaf9f4; border-color: #bfe7da; }

@media (max-width: 760px) { .login-shell { grid-template-columns: 1fr; min-height: 0; margin: 20px auto; }.login-brand-panel { min-height: 220px; padding: 28px; }.login-brand-copy { margin: 42px 0 22px; }.login-brand-copy h1 { max-width: 500px; font-size: 27px; }.login-brand-copy p { display: none; }.login-form-panel { padding: 38px 28px; } }
@media (max-width: 460px) { .login-shell { width: 100%; min-height: 100vh; margin: 0; border-radius: 0; }.login-brand-panel { min-height: 185px; }.login-brand-copy { margin: 30px 0 12px; }.login-brand-copy h1 { margin-bottom: 0; font-size: 23px; }.login-form-panel { align-items: start; padding: 32px 22px; } }

/* Administrator - Kelola Akun */
.account-heading { margin-bottom: 15px; }.account-stat-grid { display: grid; grid-template-columns: repeat(auto-fit,minmax(125px,1fr)); gap: 12px; margin-bottom: 15px; }.account-stat-grid article { padding: 14px 16px; background: #fff; border: 1px solid #e5eaee; border-radius: 11px; box-shadow: 0 3px 9px rgba(35,51,62,.09); }.account-stat-grid span,.account-stat-grid strong { display: block; }.account-stat-grid span { color: #8e99a8; font-size: 8px; font-weight: 750; text-transform: uppercase; letter-spacing: .5px; }.account-stat-grid strong { margin-top: 5px; color: #25364c; font-size: 21px; }.account-filter-panel { margin-bottom: 15px; padding: 15px; }.account-filter-form { display: grid; grid-template-columns: minmax(260px,1.5fr) minmax(180px,.65fr) 44px auto; gap: 12px; align-items: end; }.account-table-panel { overflow: hidden; border-top: 3px solid #0aa39f; }.account-name-cell { display: flex; align-items: center; gap: 9px; }.account-name-cell > span { display: grid; place-items: center; flex: 0 0 29px; height: 29px; color: #078f91; background: #e3f7f5; border-radius: 50%; font-size: 9px; font-weight: 850; }.account-name-cell strong { color: #344056; }.account-role { display: inline-flex; padding: 5px 8px; border: 1px solid; border-radius: 999px; font-size: 7.5px; font-weight: 800; }.account-role.admin { color: #5369a9; background: #eef2ff; border-color: #d4dcf7; }.account-role.security { color: #087e7a; background: #e7f8f6; border-color: #b9e4df; }.account-role.agendaris { color: #9a671d; background: #fff5df; border-color: #eed6a5; }.account-role.umum { color: #596b7f; background: #f1f4f7; border-color: #d8e0e7; }.account-role.akutansi { color: #7259a3; background: #f4effc; border-color: #ded2f2; }.account-role.sdm { color: #a35f2b; background: #fff1e7; border-color: #efd1bb; }.account-modal[hidden] { display: none; }.account-modal { position: fixed; inset: 0; z-index: 125; display: grid; place-items: center; padding: 22px; opacity: 0; transition: opacity .18s ease; }.account-modal.open { opacity: 1; }.account-modal.open .modal-dialog { transform: translateY(0) scale(1); }.account-modal-dialog { width: min(650px,100%); }.account-modal form:not(.delete-modal-actions) { display: flex; flex: 1; flex-direction: column; min-height: 0; }.account-modal .form-group small { display: block; margin-top: 5px; color: #929eae; font-size: 7.5px; }
.admin-credential-verification { margin-top:4px;padding-top:14px;border-top:1px solid #e4ecef; }.admin-credential-verification .modal-section-heading { margin-bottom:12px; }.admin-credential-verification > .modal-form-grid { gap:11px 15px; }
.account-table-panel .action-buttons { display: flex; align-items: center; gap: 6px; white-space: nowrap; }
@media (max-width: 800px) { .account-stat-grid { grid-template-columns: repeat(2,1fr); }.account-filter-form { grid-template-columns: 1fr 1fr; }.account-filter-form .filter-actions { grid-column: span 2; } }
@media (max-width: 600px) { .account-stat-grid { grid-template-columns: 1fr 1fr; }.account-filter-form { grid-template-columns: 1fr; }.account-filter-form .filter-actions { grid-column: auto; }.account-modal { align-items: end; padding: 0; }.account-modal-dialog,.account-modal .delete-modal-dialog { width: 100%; max-height: 92vh; border-radius: 15px 15px 0 0; }.account-modal .modal-form-grid { grid-template-columns: 1fr; } }

/* Sidebar buka/tutup */
@media (min-width: 901px) {
    .sidebar { transition: width .24s ease, padding .24s ease, transform .24s ease, box-shadow .24s ease; }
    .content-shell { transition: margin-left .24s ease, border-radius .24s ease; }
    .menu-toggle { display: grid; place-items: center; flex: 0 0 34px; width: 34px; height: 34px; margin-right: 11px; padding: 0; color: #078f95; background: #fff; border: 1px solid #dfe6eb; border-radius: 8px; box-shadow: 0 2px 6px rgba(35,51,62,.07); }
    .menu-toggle:hover { color: #fff; background: #0aa59e; border-color: #0aa59e; }
    html.sidebar-collapsed .sidebar { width: 64px; padding-inline: 8px; transform: none; box-shadow: 3px 0 10px rgba(20,65,103,.12); }
    html.sidebar-collapsed .content-shell { margin-left: 64px; border-radius: 0 18px 18px 0; }
    html.sidebar-collapsed .brand { justify-content: center; padding-inline: 0; }
    html.sidebar-collapsed .brand > span:last-child,
    html.sidebar-collapsed .nav-label,
    html.sidebar-collapsed .nav-chevron,
    html.sidebar-collapsed .nav-submenu,
    html.sidebar-collapsed .nav-status-dot,
    html.sidebar-collapsed .sidebar-account > div,
    html.sidebar-collapsed .sidebar-pattern { display: none !important; }
    html.sidebar-collapsed .main-nav { width: 100%; }
    html.sidebar-collapsed .nav-link { justify-content: center; min-height: 42px; padding-inline: 0; gap: 0; font-size: 0; }
    html.sidebar-collapsed .nav-link .nav-icon { width: 32px; height: 32px; font-size: 13px; }
    html.sidebar-collapsed .nav-link.active::after { display: none; }
    html.sidebar-collapsed .nav-group { margin: 0; }
    html.sidebar-collapsed .nav-label-spaced { margin: 0; }
    html.sidebar-collapsed .sidebar-account { grid-template-columns: 1fr; justify-items: center; gap: 6px; padding: 7px; }
    html.sidebar-collapsed .sidebar-account-avatar,
    html.sidebar-collapsed .sidebar-account button { width: 31px; height: 31px; }
}

/* Public landing page */
.landing-page { min-height: 100vh; color: #26364c; background: #f8fbfc; font-size: 15px; }
.landing-page::selection { color: #fff; background: #0aa7a1; }
.landing-container { width: min(1180px,calc(100% - 48px)); margin-inline: auto; }
.landing-skip-link { position: fixed; top: 10px; left: 10px; z-index: 200; padding: 10px 14px; color: #fff; background: #182a43; border-radius: 8px; transform: translateY(-150%); }
.landing-skip-link:focus { transform: translateY(0); }
.landing-header { position: sticky; top: 0; z-index: 80; background: rgba(248,251,252,.9); border-bottom: 1px solid rgba(211,224,230,.75); backdrop-filter: blur(16px); }
.landing-nav { display: flex; align-items: center; min-height: 76px; }
.landing-brand { display: inline-flex; align-items: center; gap: 11px; }
.landing-brand-mark { display: grid; place-items: center; width: 42px; height: 42px; color: #fff; background: linear-gradient(145deg,#11b7aa,#078fa7 62%,#276bc3); border-radius: 13px; box-shadow: 0 8px 20px rgba(6,151,159,.2); font-size: 22px; font-weight: 900; }
.landing-brand strong,.landing-brand small { display: block; }
.landing-brand strong { color: #20324a; font-size: 16px; line-height: 1.2; }
.landing-brand small { margin-top: 2px; color: #8d9bad; font-size: 9px; letter-spacing: .25px; }
.landing-nav-links { display: flex; gap: 34px; margin-left: auto; }
.landing-nav-links a { position: relative; color: #66758a; font-size: 13px; font-weight: 650; }
.landing-nav-links a::after { position: absolute; right: 50%; bottom: -10px; left: 50%; height: 2px; background: #0aa7a1; border-radius: 999px; content: ""; transition: left .2s ease,right .2s ease; }
.landing-nav-links a:hover { color: #087f83; }
.landing-nav-links a:hover::after { right: 0; left: 0; }
.landing-nav-action { display: inline-flex; align-items: center; gap: 10px; margin-left: 42px; padding: 11px 17px; color: #fff; background: #0aa49f; border-radius: 10px; box-shadow: 0 7px 18px rgba(6,153,151,.2); font-size: 12px; font-weight: 800; transition: transform .18s ease,box-shadow .18s ease; }
.landing-nav-action:hover { transform: translateY(-2px); box-shadow: 0 10px 24px rgba(6,153,151,.28); }
.landing-nav-action span { font-size: 16px; }

.landing-hero { position: relative; min-height: 690px; padding: 94px 0 100px; overflow: hidden; background: radial-gradient(circle at 85% 14%,rgba(28,190,180,.11),transparent 29%),linear-gradient(180deg,#f8fbfc 0%,#f3f9fa 100%); }
.landing-hero::before { position: absolute; inset: 0; opacity: .45; background-image: linear-gradient(rgba(33,83,103,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(33,83,103,.04) 1px,transparent 1px); background-size: 42px 42px; content: ""; mask-image: linear-gradient(to right,#0000,#000 38%,#000); }
.landing-orb { position: absolute; border-radius: 50%; filter: blur(2px); }
.landing-orb-one { top: 80px; right: -180px; width: 470px; height: 470px; background: rgba(29,187,183,.09); }
.landing-orb-two { bottom: -220px; left: 22%; width: 410px; height: 410px; background: rgba(42,105,195,.06); }
.landing-hero-grid { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(400px,.84fr) minmax(570px,1.16fr); gap: 54px; align-items: center; }
.landing-eyebrow { display: inline-flex; align-items: center; gap: 9px; color: #078f91; font-size: 10px; font-weight: 850; letter-spacing: 1.45px; }
.landing-eyebrow i { width: 20px; height: 2px; background: #0bad9f; border-radius: 999px; }
.landing-hero-copy h1 { max-width: 620px; margin: 18px 0 23px; color: #1f3048; font-size: clamp(45px,5vw,69px); line-height: 1.04; letter-spacing: -2.8px; }
.landing-hero-copy h1 em { color: #0aa49f; font-style: normal; }
.landing-hero-copy > p { max-width: 580px; margin: 0; color: #66778b; font-size: 16px; line-height: 1.82; }
.landing-hero-actions { display: flex; gap: 12px; margin-top: 32px; }
.landing-btn { display: inline-flex; align-items: center; justify-content: center; gap: 11px; min-height: 50px; padding: 0 21px; border: 1px solid transparent; border-radius: 11px; font-size: 13px; font-weight: 800; transition: transform .18s ease,box-shadow .18s ease,border-color .18s ease; }
.landing-btn:hover { transform: translateY(-2px); }
.landing-btn-primary { color: #fff; background: linear-gradient(135deg,#10b4a8,#078f9f); box-shadow: 0 11px 25px rgba(6,151,153,.22); }
.landing-btn-primary:hover { box-shadow: 0 14px 30px rgba(6,151,153,.3); }
.landing-btn-secondary { color: #3d4e64; background: rgba(255,255,255,.72); border-color: #d7e2e8; }
.landing-btn-secondary:hover { border-color: #9fd5d2; box-shadow: 0 8px 18px rgba(38,64,83,.09); }
.landing-trust-row { display: flex; flex-wrap: wrap; gap: 19px; margin-top: 28px; color: #7b899a; font-size: 11px; font-weight: 650; }
.landing-trust-row span { display: inline-flex; align-items: center; gap: 6px; }
.landing-trust-row b { display: grid; place-items: center; width: 17px; height: 17px; color: #078f89; background: #e2f7f3; border-radius: 50%; font-size: 9px; }

.landing-product-visual { position: relative; padding: 44px 0 38px; perspective: 1200px; }
.landing-visual-glow { position: absolute; inset: 12% 6% 3%; background: radial-gradient(ellipse,rgba(8,167,160,.2),transparent 68%); filter: blur(24px); }
.landing-browser-card { position: relative; z-index: 2; overflow: hidden; background: #fff; border: 1px solid rgba(204,219,228,.9); border-radius: 18px; box-shadow: 0 30px 70px rgba(35,68,91,.18),0 6px 20px rgba(35,68,91,.09); transform: rotateY(-3deg) rotateX(1deg); transform-origin: center; }
.landing-browser-bar { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; min-height: 43px; padding: 0 16px; background: #f7fafb; border-bottom: 1px solid #e8eef1; }
.landing-browser-dots { display: flex; gap: 5px; }
.landing-browser-dots i { width: 7px; height: 7px; background: #d8e1e6; border-radius: 50%; }
.landing-browser-dots i:first-child { background: #f2ad75; }.landing-browser-dots i:nth-child(2) { background: #efd06f; }.landing-browser-dots i:last-child { background: #7ed2b8; }
.landing-browser-address { min-width: 190px; padding: 5px 20px; color: #9aa7b1; background: #fff; border: 1px solid #e8eef1; border-radius: 999px; font-size: 7px; text-align: center; }
.landing-browser-live { justify-self: end; display: inline-flex; align-items: center; gap: 5px; color: #6c7d89; font-size: 7px; font-weight: 750; }
.landing-browser-live i { width: 6px; height: 6px; background: #35c48d; border-radius: 50%; box-shadow: 0 0 0 3px #e1f7ef; }
.landing-browser-body { display: grid; grid-template-columns: 52px 1fr; min-height: 365px; }
.landing-preview-sidebar { display: flex; align-items: center; flex-direction: column; gap: 16px; padding: 14px 9px; background: linear-gradient(180deg,#10aca5,#0b85a4 60%,#2569bd); }
.landing-preview-logo { display: grid; place-items: center; width: 27px; height: 27px; margin-bottom: 15px; color: #fff; background: rgba(255,255,255,.18); border-radius: 8px; font-size: 14px; }
.landing-preview-sidebar i { width: 25px; height: 5px; background: rgba(255,255,255,.22); border-radius: 999px; }
.landing-preview-sidebar i.active { height: 25px; background: rgba(255,255,255,.18); border: 1px solid rgba(255,255,255,.2); }
.landing-preview-main { padding: 20px; background: #f7f9fb; }
.landing-preview-heading { display: flex; justify-content: space-between; align-items: flex-start; }
.landing-preview-heading small,.landing-preview-heading strong { display: block; }
.landing-preview-heading small { color: #08a099; font-size: 6px; font-weight: 850; letter-spacing: .6px; }
.landing-preview-heading strong { margin-top: 3px; color: #25364d; font-size: 13px; }
.landing-preview-heading > span { padding: 5px 8px; color: #798794; background: #fff; border: 1px solid #e4eaee; border-radius: 6px; font-size: 6px; }
.landing-preview-stats { display: grid; grid-template-columns: repeat(3,1fr); gap: 9px; margin: 17px 0 12px; }
.landing-preview-stats article { display: flex; align-items: center; gap: 8px; min-width: 0; padding: 10px; background: #fff; border: 1px solid #e8edf0; border-radius: 9px; box-shadow: 0 3px 8px rgba(32,60,78,.05); }
.landing-preview-stats article > span { display: grid; place-items: center; flex: 0 0 25px; height: 25px; border-radius: 7px; font-size: 10px; font-weight: 850; }
.landing-preview-stats .teal { color: #079c96; background: #e2f7f4; }.landing-preview-stats .blue { color: #3674c6; background: #e8f0fb; }.landing-preview-stats .orange { color: #b17620; background: #fff2dc; }
.landing-preview-stats small,.landing-preview-stats strong { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.landing-preview-stats small { color: #98a4ae; font-size: 5.5px; }.landing-preview-stats strong { margin-top: 2px; color: #33445a; font-size: 12px; }
.landing-preview-content { display: grid; grid-template-columns: 1.5fr .72fr; gap: 9px; }
.landing-preview-chart,.landing-preview-progress { padding: 12px; background: #fff; border: 1px solid #e8edf0; border-radius: 9px; }
.landing-preview-chart > div { display: flex; justify-content: space-between; }.landing-preview-chart strong { color: #3d4c5e; font-size: 7px; }.landing-preview-chart small { color: #9ca7af; font-size: 5.5px; }
.landing-preview-chart svg { display: block; width: 100%; height: 132px; margin-top: 8px; overflow: visible; }
.landing-preview-chart .grid { fill: none; stroke: #edf1f3; stroke-width: 1; }.landing-preview-chart .area { fill: url(#landingChartFill); }.landing-preview-chart .line { fill: none; stroke: #09a59e; stroke-width: 2.5; }.landing-preview-chart circle { fill: #fff; stroke: #09a59e; stroke-width: 2; }
.landing-preview-progress { display: flex; align-items: center; flex-direction: column; text-align: center; }.landing-preview-progress > strong { align-self: flex-start; color: #3d4c5e; font-size: 7px; }.landing-preview-progress > small { max-width: 90px; color: #99a5ae; font-size: 5.5px; }
.landing-progress-ring { display: grid; place-items: center; width: 76px; height: 76px; margin: 23px 0 14px; background: conic-gradient(#0aa59e 0 75%,#e8eff1 75%); border-radius: 50%; }
.landing-progress-ring::before { position: absolute; width: 56px; height: 56px; background: #fff; border-radius: 50%; content: ""; }.landing-progress-ring span { position: relative; color: #087f80; font-size: 12px; font-weight: 850; }
.landing-floating-note { position: absolute; z-index: 4; display: grid; grid-template-columns: 31px 1fr 18px; gap: 8px; align-items: center; min-width: 174px; padding: 10px 11px; background: rgba(255,255,255,.96); border: 1px solid #e1e9ed; border-radius: 11px; box-shadow: 0 14px 32px rgba(27,64,82,.15); }
.landing-floating-note > span { display: grid; place-items: center; width: 31px; height: 31px; color: #078f91; background: #e1f7f4; border-radius: 8px; font-size: 13px; }.landing-floating-note strong,.landing-floating-note small { display: block; }.landing-floating-note strong { color: #34465a; font-size: 8px; }.landing-floating-note small { color: #99a5ae; font-size: 6px; }.landing-floating-note b { display: grid; place-items: center; width: 18px; height: 18px; color: #fff; background: #24b989; border-radius: 50%; font-size: 8px; }
.note-security { top: 8px; left: -25px; }.note-agenda { right: -20px; bottom: 0; }

.landing-feature-section { padding: 100px 0 110px; background: #fff; }
.landing-section-heading { max-width: 680px; margin: 0 auto 48px; text-align: center; }
.landing-section-heading .landing-eyebrow { justify-content: center; }
.landing-section-heading h2,.landing-workflow-copy h2 { margin: 15px 0 14px; color: #21324a; font-size: clamp(31px,3.5vw,44px); line-height: 1.16; letter-spacing: -1.3px; }
.landing-section-heading > p,.landing-workflow-copy > p { margin: 0; color: #78879a; font-size: 15px; line-height: 1.75; }
.landing-feature-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 19px; }
.landing-feature-grid article { position: relative; min-height: 330px; padding: 30px; overflow: hidden; background: #fbfcfd; border: 1px solid #e4ebef; border-radius: 16px; transition: transform .2s ease,border-color .2s ease,box-shadow .2s ease; }
.landing-feature-grid article::after { position: absolute; right: -55px; bottom: -70px; width: 145px; height: 145px; background: #edf8f7; border-radius: 50%; content: ""; }
.landing-feature-grid article:hover { border-color: #b7dedb; box-shadow: 0 18px 38px rgba(29,70,88,.09); transform: translateY(-5px); }
.landing-feature-grid article > small { position: absolute; top: 32px; right: 30px; color: #c4cdd4; font-size: 10px; font-weight: 850; letter-spacing: 1px; }
.landing-feature-icon { display: grid; place-items: center; width: 48px; height: 48px; border-radius: 13px; font-size: 20px; font-weight: 850; }.landing-feature-icon.teal { color: #078e89; background: #dff6f2; }.landing-feature-icon.blue { color: #3671bd; background: #e7effa; }.landing-feature-icon.orange { color: #a96d17; background: #fff0d7; }
.landing-feature-grid h3 { margin: 24px 0 10px; color: #293a50; font-size: 20px; }.landing-feature-grid p { margin: 0; color: #7d8b9b; font-size: 13px; line-height: 1.75; }
.landing-feature-grid ul { position: relative; z-index: 1; display: grid; gap: 8px; margin: 22px 0 0; padding: 0; color: #5e6e80; font-size: 11px; list-style: none; }.landing-feature-grid li::before { margin-right: 7px; color: #0aa49b; content: "✓"; font-weight: 850; }

.landing-workflow-section { padding: 105px 0; background: linear-gradient(135deg,#f0f8f8,#f6f9fc); }
.landing-workflow-grid { display: grid; grid-template-columns: minmax(350px,.86fr) minmax(470px,1.14fr); gap: 90px; align-items: center; }
.landing-workflow-copy > a { display: inline-flex; align-items: center; gap: 10px; margin-top: 28px; color: #078f91; font-size: 13px; font-weight: 850; }
.landing-workflow-copy > a span { transition: transform .18s ease; }.landing-workflow-copy > a:hover span { transform: translateX(4px); }
.landing-workflow-list { display: grid; gap: 13px; margin: 0; padding: 0; list-style: none; counter-reset: workflow; }
.landing-workflow-list li { display: grid; grid-template-columns: 49px 1fr; gap: 18px; align-items: center; min-height: 105px; padding: 19px 23px; background: #fff; border: 1px solid #e1e9ed; border-radius: 14px; box-shadow: 0 7px 20px rgba(31,65,82,.05); }
.landing-workflow-list li > span { display: grid; place-items: center; width: 49px; height: 49px; color: #078f91; background: #e2f7f4; border-radius: 13px; font-size: 11px; font-weight: 900; }
.landing-workflow-list strong { color: #304156; font-size: 15px; }.landing-workflow-list p { margin: 5px 0 0; color: #82909f; font-size: 12px; line-height: 1.6; }

.landing-security-section { padding: 92px 0; background: #fff; }
.landing-security-card { display: grid; grid-template-columns: 70px minmax(0,1fr) auto; gap: 24px; align-items: center; padding: 43px 48px; color: #fff; background: linear-gradient(115deg,#087f91,#0aa59c 58%,#1f72b7); border-radius: 20px; box-shadow: 0 20px 45px rgba(5,122,139,.2); }
.landing-security-card::before { position: absolute; content: ""; }
.landing-security-icon { display: grid; place-items: center; width: 70px; height: 70px; background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.18); border-radius: 18px; font-size: 27px; }
.landing-security-card div:nth-child(2) > span { color: #9df2df; font-size: 9px; font-weight: 850; letter-spacing: 1.2px; }.landing-security-card h2 { margin: 7px 0 5px; color: #fff; font-size: 26px; }.landing-security-card p { margin: 0; color: rgba(255,255,255,.72); font-size: 12px; }
.landing-btn-light { color: #087f8d; background: #fff; box-shadow: 0 10px 22px rgba(13,65,85,.15); }
.landing-footer { padding: 34px 0; background: #f3f7f8; border-top: 1px solid #e1e9ed; }
.landing-footer .landing-container { display: flex; align-items: center; gap: 28px; }.landing-footer-brand .landing-brand-mark { width: 34px; height: 34px; border-radius: 10px; font-size: 17px; }.landing-footer p { margin: 0 auto 0 0; color: #8b99a8; font-size: 11px; }.landing-footer > div > small { color: #9ca8b3; font-size: 10px; }

@media (max-width: 1080px) {
    .landing-hero { padding-top: 72px; }
    .landing-hero-grid { grid-template-columns: 1fr; max-width: 780px; }
    .landing-hero-copy { max-width: 680px; }
    .landing-product-visual { margin-top: 8px; }
    .note-security { left: -10px; }.note-agenda { right: -8px; }
    .landing-workflow-grid { gap: 50px; }
}
@media (max-width: 820px) {
    .landing-container { width: min(100% - 34px,680px); }
    .landing-nav { min-height: 68px; }.landing-nav-links { display: none; }.landing-nav-action { margin-left: auto; }
    .landing-hero { min-height: auto; padding: 64px 0 78px; }.landing-hero-grid { grid-template-columns: minmax(0,1fr); gap: 35px; }.landing-hero-copy h1 { font-size: clamp(42px,11vw,62px); }
    .landing-feature-section,.landing-workflow-section { padding: 78px 0; }.landing-feature-grid { grid-template-columns: 1fr; }.landing-feature-grid article { min-height: auto; }
    .landing-workflow-grid { grid-template-columns: 1fr; gap: 38px; }
    .landing-security-card { grid-template-columns: 58px 1fr; padding: 34px; }.landing-security-icon { width: 58px; height: 58px; }.landing-security-card .landing-btn { grid-column: span 2; justify-self: start; }
}
@media (max-width: 590px) {
    .landing-container { width: min(100% - 28px,520px); }
    .landing-brand small { display: none; }.landing-brand strong { font-size: 14px; }.landing-brand-mark { width: 37px; height: 37px; }
    .landing-nav-action { padding: 10px 13px; font-size: 10px; }
    .landing-hero-copy h1 { margin-top: 14px; letter-spacing: -1.8px; }.landing-hero-copy > p { font-size: 14px; }.landing-hero-actions { align-items: stretch; flex-direction: column; }.landing-btn { width: 100%; }
    .landing-trust-row { align-items: flex-start; flex-direction: column; gap: 9px; }
    .landing-browser-card { transform: none; }.landing-browser-address { display: none; }.landing-browser-bar { grid-template-columns: 1fr 1fr; }.landing-browser-body { grid-template-columns: 38px 1fr; min-height: 300px; }.landing-preview-sidebar { padding-inline: 6px; }.landing-preview-main { padding: 12px; }.landing-preview-stats { gap: 5px; }.landing-preview-stats article { padding: 7px 5px; }.landing-preview-stats article > span { display: none; }.landing-preview-content { grid-template-columns: 1fr; }.landing-preview-progress { display: none; }.landing-preview-chart svg { height: 105px; }
    .landing-floating-note { display: none; }
    .landing-section-heading { margin-bottom: 32px; }.landing-section-heading h2,.landing-workflow-copy h2 { font-size: 30px; }.landing-feature-grid article { padding: 25px; }
    .landing-workflow-list li { grid-template-columns: 42px 1fr; gap: 13px; padding: 16px; }.landing-workflow-list li > span { width: 42px; height: 42px; }
    .landing-security-card { grid-template-columns: 1fr; gap: 16px; padding: 28px 24px; }.landing-security-card .landing-btn { grid-column: auto; justify-self: stretch; }.landing-security-card h2 { font-size: 23px; }
    .landing-footer .landing-container { align-items: flex-start; flex-direction: column; gap: 13px; }.landing-footer p { margin: 0; }
}

/* Single-screen public landing page */
.landing-single-page { position: relative; width: 100%; height: 100dvh; min-height: 520px; overflow: hidden; color: #192b44; background: #fafbfe; }
.single-landing-header { position: relative; z-index: 20; display: flex; align-items: center; width: 100%; height: clamp(74px,11vh,96px); padding: 0 clamp(28px,6.2vw,92px); }
.single-landing-brand { display: inline-flex; align-items: center; flex: 0 0 auto; }
.single-brand-logo { position: relative; display: block; width: 190px; height: 74px; overflow: hidden; flex: 0 0 auto; }
.single-brand-logo img { position: absolute; top: -25px; left: -31px; display: block; width: 245px; max-width: none; height: auto; }
.single-landing-nav { display: flex; align-items: center; gap: clamp(22px,3vw,43px); margin-left: auto; }
.single-landing-nav a { position: relative; padding: 8px 0; color: #28364a; font-size: clamp(11px,1.05vw,14px); font-weight: 750; }.single-landing-nav a::after { position: absolute; right: 50%; bottom: 0; left: 50%; height: 2px; background: #0aa7a1; border-radius: 99px; content: ""; transition: right .18s ease,left .18s ease; }.single-landing-nav a:hover,.single-landing-nav a.active { color: #078f9b; }.single-landing-nav a:hover::after,.single-landing-nav a.active::after { right: 0; left: 0; }
.single-nav-login { display: inline-flex; align-items: center; gap: 9px; margin-left: clamp(22px,3vw,42px); padding: 10px 17px; color: #fff; background: linear-gradient(135deg,#10b4a8,#078f9f); border-radius: 9px; box-shadow: 0 9px 22px rgba(6,151,153,.2); font-size: 11px; font-weight: 850; transition: transform .18s ease,box-shadow .18s ease; }.single-nav-login:hover { color: #fff; box-shadow: 0 12px 27px rgba(6,151,153,.29); transform: translateY(-2px); }.single-nav-login span { font-size: 15px; }
.single-landing-main { position: relative; display: flex; align-items: center; height: calc(100dvh - clamp(74px,11vh,96px)); min-height: 424px; padding: 0 clamp(28px,6.2vw,92px) clamp(24px,5vh,50px); isolation: isolate; }
.single-landing-copy { position: relative; z-index: 5; width: min(50vw,650px); margin-top: -1.5vh; }
.single-landing-kicker { display: flex; align-items: center; gap: 9px; margin: 0; color: #078d98; font-size: clamp(8px,.72vw,10px); font-weight: 900; letter-spacing: 1.45px; }.single-landing-kicker span { width: 23px; height: 2px; background: #0bac9e; border-radius: 99px; }
.single-landing-copy h1 { margin: clamp(12px,2.3vh,22px) 0 0; color: #1e6fc5; font-size: clamp(48px,6vw,84px); line-height: .9; letter-spacing: clamp(-4.2px,-.3vw,-2px); }.single-landing-copy h1 em { color: transparent; background: linear-gradient(105deg,#1b77c4 3%,#0ca6b1 58%,#24b990); background-clip: text; -webkit-background-clip: text; font-style: normal; }
.single-landing-copy h2 { margin: clamp(10px,1.8vh,18px) 0 0; color: #15253b; font-size: clamp(19px,2vw,28px); line-height: 1.15; letter-spacing: -.65px; }
.single-landing-description { max-width: 560px; margin: clamp(12px,2vh,20px) 0 0; color: #66758a; font-size: clamp(11px,1.05vw,15px); line-height: 1.68; }
.single-landing-actions { display: flex; align-items: center; gap: 20px; margin-top: clamp(18px,3.4vh,33px); }
.single-primary-action { display: inline-flex; align-items: center; justify-content: center; gap: 11px; min-height: 46px; padding: 0 21px; color: #fff; background: linear-gradient(135deg,#10b4a8,#078f9f); border-radius: 10px; box-shadow: 0 11px 25px rgba(6,151,153,.22); font-size: 12px; font-weight: 850; transition: transform .18s ease,box-shadow .18s ease; }.single-primary-action:hover { color: #fff; box-shadow: 0 15px 31px rgba(6,151,153,.3); transform: translateY(-2px); }.single-primary-action span { font-size: 17px; }
.single-access-note { display: inline-flex; align-items: center; gap: 7px; color: #718095; font-size: 10px; font-weight: 700; }.single-access-note i { display: grid; place-items: center; width: 19px; height: 19px; color: #078f89; background: #dff6f2; border-radius: 50%; font-size: 9px; font-style: normal; }
.single-feature-row { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 10px; width: min(590px,47vw); margin-top: clamp(18px,3.8vh,38px); }
.single-feature-row article { display: grid; grid-template-columns: 30px 1fr; gap: 9px; align-items: center; min-width: 0; padding: 11px 12px; background: rgba(255,255,255,.75); border: 1px solid #e2e9ed; border-radius: 10px; box-shadow: 0 6px 16px rgba(35,68,91,.05); backdrop-filter: blur(10px); }.single-feature-row article > span { display: grid; place-items: center; width: 30px; height: 30px; color: #078f91; background: #e2f7f4; border-radius: 8px; font-size: 8px; font-weight: 900; }.single-feature-row strong,.single-feature-row small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }.single-feature-row strong { color: #34445a; font-size: 9px; }.single-feature-row small { margin-top: 3px; color: #94a0ae; font-size: 7px; }
.single-landing-dots { display: flex; gap: 7px; margin-top: clamp(14px,2.7vh,25px); }.single-landing-dots i { width: 8px; height: 8px; background: #fff; border: 1.5px solid #40536a; border-radius: 50%; }.single-landing-dots i.active { background: #0aa5ad; border-color: #0aa5ad; }
.single-wave-art { position: absolute; z-index: 1; top: -10px; right: 0; bottom: 0; width: min(60vw,900px); overflow: hidden; pointer-events: none; }.single-wave-art svg { display: block; width: 100%; height: 100%; filter: drop-shadow(-18px 10px 26px rgba(22,93,139,.08)); }
.single-wave-badge { position: absolute; right: clamp(28px,7vw,95px); bottom: clamp(34px,8vh,78px); display: flex; align-items: center; gap: 10px; padding: 12px 16px; background: rgba(255,255,255,.92); border: 1px solid rgba(255,255,255,.75); border-radius: 11px; box-shadow: 0 14px 35px rgba(16,65,98,.18); backdrop-filter: blur(10px); }.single-wave-badge > span { display: grid; place-items: center; width: 30px; height: 30px; color: #fff; background: #10a89e; border-radius: 8px; font-size: 13px; font-weight: 900; }.single-wave-badge small,.single-wave-badge strong { display: block; }.single-wave-badge small { color: #0a9a96; font-size: 7px; font-weight: 900; letter-spacing: .8px; }.single-wave-badge strong { margin-top: 3px; color: #324359; font-size: 10px; }
@media (max-width: 980px) { .single-landing-nav { display: none; }.single-nav-login { margin-left: auto; }.single-landing-copy { width: 62vw; }.single-feature-row { width: 58vw; }.single-wave-art { right: -12%; width: 67vw; opacity: .82; }.single-wave-badge { display: none; } }
@media (max-width: 680px) { .landing-single-page { min-height: 500px; }.single-landing-header { height: 72px; padding-inline: 20px; }.single-brand-logo { width: 165px; height: 64px; }.single-brand-logo img { top: -22px; left: -28px; width: 214px; }.single-nav-login { padding: 9px 12px; font-size: 9px; }.single-landing-main { align-items: flex-start; height: calc(100dvh - 72px); min-height: 428px; padding: clamp(28px,6vh,54px) 20px 16px; }.single-landing-copy { width: 100%; margin: 0; }.single-landing-copy h1 { font-size: clamp(45px,14vw,64px); }.single-landing-copy h2 { font-size: clamp(17px,5vw,23px); }.single-landing-description { max-width: 92%; font-size: 10px; }.single-feature-row { width: 100%; grid-template-columns: 1fr; gap: 6px; margin-top: 15px; }.single-feature-row article { min-height: 40px; padding: 5px 9px; }.single-feature-row article:nth-child(3) { display: none; }.single-landing-dots { margin-top: 10px; }.single-wave-art { top: 38%; right: -48%; bottom: -14%; width: 125vw; opacity: .2; } }
@media (max-height: 650px) and (min-width: 681px) { .single-landing-copy h1 { font-size: clamp(47px,8.8vh,64px); }.single-landing-copy h2 { margin-top: 8px; }.single-landing-description { margin-top: 10px; line-height: 1.5; }.single-landing-actions { margin-top: 16px; }.single-feature-row { margin-top: 17px; }.single-landing-dots { margin-top: 12px; } }

/* Bagian Umum 1 - PKS Barang dan Jasa */
.pks-page-heading { margin-bottom: 16px; }
.pks-summary-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 12px; margin-bottom: 16px; }
.pks-summary-card { display: flex; align-items: center; gap: 12px; min-height: 76px; padding: 13px 15px; color: inherit; text-decoration: none; background: #fff; border: 1px solid #e3e9ed; border-radius: 11px; box-shadow: 0 4px 13px rgba(31,61,76,.06); cursor: pointer; transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease; }
.pks-summary-card:hover { transform: translateY(-2px); border-color: #87d6d3; box-shadow: 0 8px 19px rgba(16,130,137,.12); }
.pks-summary-card:focus-visible { outline: 3px solid rgba(13,170,166,.22); outline-offset: 2px; }
.pks-summary-card.is-active { border-color: #0fa9a5; box-shadow: 0 0 0 2px rgba(15,169,165,.12), 0 8px 19px rgba(16,130,137,.11); }
.pks-summary-grid small,.pks-summary-grid strong { display: block; }.pks-summary-grid small { color: #8c99a8; font-size: 8px; font-weight: 750; text-transform: uppercase; letter-spacing: .45px; }.pks-summary-grid strong { margin-top: 3px; color: #26384d; font-size: 20px; }
.pks-summary-icon { display: grid; place-items: center; flex: 0 0 38px; height: 38px; border-radius: 10px; font-size: 13px; font-weight: 900; }.pks-summary-icon.total { color:#087f94;background:#e1f4f5; }.pks-summary-icon.active { color:#087b65;background:#e1f6ef; }.pks-summary-icon.warning { color:#9b6615;background:#fff2d9; }.pks-summary-icon.expired { color:#a43e48;background:#ffe9eb; }.pks-summary-icon.neutral { color:#68788a;background:#edf1f4; }
.pks-filter-form { display: grid; grid-template-columns: minmax(280px,1fr) 44px auto; gap: 12px; align-items: end; }
.pks-main-modal[hidden] { display:none; }.pks-main-modal { position:fixed;inset:0;z-index:125;display:grid;place-items:center;padding:22px;opacity:0;transition:opacity .18s ease; }.pks-main-modal.open { opacity:1; }.pks-main-modal.open .modal-dialog { transform:translateY(0) scale(1); }.pks-main-modal-dialog { width:min(920px,100%);max-height:calc(100vh - 44px); }.pks-main-modal-dialog > form { display:flex;flex:1;flex-direction:column;min-height:0; }.pks-main-modal .modal-footer [hidden] { display:none; }.pks-modal-icon { background:linear-gradient(145deg,#12b4a8,#078f9d); }.pks-popup-grid { gap:11px 15px; }.pks-popup-grid textarea { min-height:64px; }.pks-popup-second-section { margin-top:20px; }.pks-popup-errors { margin:0 0 14px; }.pks-popup-errors ul { margin:5px 0 0;padding-left:17px; }
.pks-detail-popup-dialog { display:flex;width:min(940px,calc(100% - 32px));max-height:calc(100vh - 64px);flex-direction:column; }.pks-detail-popup .modal-header { padding:11px 15px; }.pks-detail-popup .modal-title-icon { flex-basis:36px;height:36px;border-radius:9px;font-size:13px; }.pks-detail-popup .modal-title-group h2 { font-size:13px; }.pks-detail-popup .modal-footer { padding:9px 14px; }.pks-detail-popup-body { overflow-y:auto;padding:14px;background:#f8fafb; }.pks-wizard-steps.pks-popup-detail-steps { position:sticky;top:-14px;z-index:4;grid-template-columns:minmax(0,1fr) 26px minmax(0,1fr) 26px minmax(0,1fr) 26px minmax(0,1fr);margin:-14px -14px 13px;padding:9px 14px;background:#f4f8f9;border-width:0 0 1px;border-radius:0;box-shadow:0 3px 9px rgba(35,65,77,.04); }.pks-wizard-steps.pks-popup-detail-steps > button { gap:7px;padding:2px; }.pks-wizard-steps.pks-popup-detail-steps > button > span { flex-basis:27px;height:27px;border-radius:7px; }.pks-wizard-steps.pks-popup-detail-steps strong { font-size:8px; }.pks-wizard-steps.pks-popup-detail-steps small { font-size:6.4px; }.pks-popup-step-panel { min-height:300px;animation:pks-step-in .18s ease both; }.pks-popup-step-panel[hidden] { display:none; }.pks-popup-record-heading { margin:0 0 11px;padding:1px 2px 9px;border-bottom:1px solid #e1e8ea; }.pks-popup-record-heading h2 { margin:3px 0 2px;color:#263750;font-size:15px; }.pks-popup-record-heading > p:last-child { margin:0;color:#7f8da0;font-size:8px; }.pks-detail-popup-body .pks-detail-summary { gap:8px;margin-bottom:10px; }.pks-detail-popup-body .pks-detail-summary article { padding:10px 11px;border-radius:9px; }.pks-detail-popup-body .pks-detail-summary article strong { margin-top:5px;font-size:10px; }.pks-detail-popup-body .pks-detail-summary article p { margin-top:3px;font-size:6.8px; }.pks-detail-popup-body .pks-detail-layout { gap:10px;margin-bottom:0; }.pks-detail-popup-body .panel-header { padding:11px 13px; }.pks-detail-popup-body .panel-header h2 { font-size:10px; }.pks-detail-popup-body .pks-detail-list { gap:0 15px;padding:3px 13px 12px; }.pks-detail-popup-body .pks-detail-list > div { padding:8px 0; }.pks-detail-popup-body .pks-detail-list dd { font-size:8.5px;line-height:1.45; }.pks-detail-popup-body .pks-work-panel { margin-bottom:0; }.pks-detail-popup-body .pks-timeline { padding-top:4px;padding-bottom:13px; }.pks-detail-popup-body .pks-timeline-card > header { padding:10px 13px; }.pks-detail-popup-body .pks-timeline-card > dl { padding:4px 13px 8px; }.pks-detail-popup-body .pks-timeline-card > dl div { padding:7px 0; }.pks-detail-popup-body table th,.pks-detail-popup-body table td { padding-top:9px;padding-bottom:9px; }.pks-popup-loading { display:grid;min-height:300px;place-items:center;align-content:center;gap:10px;color:#7c8c9e; }.pks-popup-loading span { width:28px;height:28px;border:3px solid #d6e7e6;border-top-color:#0aa39f;border-radius:50%;animation:pks-popup-spin .75s linear infinite; }.pks-popup-loading p { margin:0;font-size:8px;font-weight:750; }@keyframes pks-popup-spin { to { transform:rotate(360deg); } }
.pks-wizard-steps { display:grid;grid-template-columns:minmax(0,1fr) 38px minmax(0,1fr) 38px minmax(0,1fr) 38px minmax(0,1fr);align-items:center;margin:0 0 20px;padding:11px 14px;background:#f6fafb;border:1px solid #e0e9eb;border-radius:10px; }.pks-wizard-steps > button { display:flex;align-items:center;gap:9px;min-width:0;padding:4px;color:#9aa6b1;background:transparent;border:0;text-align:left; }.pks-wizard-steps > button > span { display:grid;place-items:center;flex:0 0 31px;height:31px;background:#e7ecef;border-radius:8px;font-size:8px;font-weight:900;transition:.18s ease; }.pks-wizard-steps strong,.pks-wizard-steps small { display:block;white-space:nowrap; }.pks-wizard-steps strong { color:#788695;font-size:8.5px; }.pks-wizard-steps small { margin-top:1px;color:#a8b1ba;font-size:6.8px; }.pks-wizard-steps > i { height:2px;background:#dde7e8;border-radius:99px; }.pks-wizard-steps > button.active > span { color:#fff;background:linear-gradient(145deg,#12b4a8,#078f9d);box-shadow:0 5px 12px rgba(7,143,157,.2); }.pks-wizard-steps > button.active strong { color:#087f89; }.pks-wizard-steps > button.complete > span { color:#087f7b;background:#dff5f1; }.pks-wizard-steps > button.complete > span::after { margin-left:2px;content:"✓"; }.pks-wizard-panel { animation:pks-step-in .18s ease both; }.pks-wizard-panel[hidden] { display:none; }.pks-wizard-panel .modal-section-heading { margin-bottom:14px; }.pks-review-card { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 18px;padding:3px 16px 13px;background:#fbfdfd;border:1px solid #dfe9ea;border-radius:10px; }.pks-review-card > div { min-width:0;padding:12px 0;border-bottom:1px solid #edf1f2; }.pks-review-card .wide { grid-column:span 2; }.pks-review-card small,.pks-review-card strong { display:block; }.pks-review-card small { color:#97a3ae;font-size:7.2px;font-weight:800;text-transform:uppercase;letter-spacing:.35px; }.pks-review-card strong { margin-top:4px;color:#37495b;font-size:9.5px;line-height:1.5;overflow-wrap:anywhere;white-space:pre-line; }.pks-review-note { display:flex;align-items:flex-start;gap:10px;margin-top:13px;padding:11px 13px;color:#55717a;background:#eaf8f5;border:1px solid #c8e8e2;border-radius:9px; }.pks-review-note > span { display:grid;place-items:center;flex:0 0 22px;height:22px;color:#fff;background:#0aa29b;border-radius:50%;font-size:8px;font-weight:900; }.pks-review-note p { margin:1px 0 0;font-size:8px;line-height:1.55; }.input-with-suffix { display:flex;align-items:stretch; }.input-with-suffix input { flex:1;min-width:0;border-radius:8px 0 0 8px; }.input-with-suffix > span { display:flex;align-items:center;padding:0 13px;color:#647487;background:#eef5f5;border:1px solid #d8e2e6;border-left:0;border-radius:0 8px 8px 0;font-size:8px;font-weight:800; }@keyframes pks-step-in { from { opacity:0;transform:translateX(7px); } to { opacity:1;transform:translateX(0); } }
.pks-table-panel { border-top: 3px solid #0aa39f; }
.pks-table-realtime { display:flex;align-items:center;justify-content:flex-end;gap:7px;padding:9px 14px;background:#fbfdfd;border-bottom:1px solid #e7edef; }
.pks-table-realtime > span { width:7px;height:7px;background:#08aaa4;border:2px solid #d5f3f0;border-radius:50%;box-shadow:0 0 0 3px rgba(8,170,164,.08); }
.pks-table-realtime p { margin:0;color:#8190a1;font-size:7.5px; }
.pks-table-realtime strong { color:#46617a; }
.pks-expiry-countdown { display:inline-flex!important;align-items:center;width:max-content;margin-top:5px;padding:3px 7px;border:1px solid;border-radius:999px;font-size:7px!important;font-weight:850;line-height:1.2;white-space:nowrap; }
.pks-expiry-countdown.active { color:#087a67;background:#e7f8f3;border-color:#bce4d8; }
.pks-expiry-countdown.warning { color:#9a6517;background:#fff4df;border-color:#ecd3a2; }
.pks-expiry-countdown.today { color:#9a5617;background:#ffead1;border-color:#e9bd84; }
.pks-expiry-countdown.expired { color:#aa3f49;background:#ffedef;border-color:#efc1c6; }
.pks-code-link { color: #087f91; font-weight: 850; }.pks-code-link:hover { text-decoration: underline; }
.pks-name-cell strong,.pks-name-cell span { display: block; }.pks-name-cell strong { max-width: 250px; color: #344057; }.pks-name-cell span { margin-top: 3px; color: #9aa5b2; font-size: 8px; }
.pks-status { display: inline-flex; align-items: center; padding: 5px 9px; border: 1px solid; border-radius: 999px; font-size: 7.5px; font-weight: 850; white-space: nowrap; }.pks-status.active { color:#087a67;background:#e7f8f3;border-color:#bce4d8; }.pks-status.warning { color:#9a6517;background:#fff4df;border-color:#ecd3a2; }.pks-status.expired { color:#aa3f49;background:#ffedef;border-color:#efc1c6; }.pks-status.neutral { color:#647488;background:#f1f4f6;border-color:#d9e0e5; }
.pks-main-form { max-width: 1100px; }.pks-main-form .section-number,.pks-work-panel .section-number { color:#078e91;background:#e1f7f4; }
.pks-detail-heading { align-items: flex-end; }.pks-detail-heading .back-link { margin-bottom: 10px; }
.pks-detail-summary { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 12px; margin-bottom: 15px; }.pks-detail-summary article { min-width: 0; padding: 15px 16px; background: linear-gradient(145deg,#fff,#f9fcfc); border: 1px solid #dfe9eb; border-radius: 11px; box-shadow: 0 3px 11px rgba(31,61,76,.05); }.pks-detail-summary small,.pks-detail-summary strong,.pks-detail-summary p { display: block; }.pks-detail-summary small { color:#8e9ba9;font-size:8px;font-weight:750;text-transform:uppercase;letter-spacing:.45px; }.pks-detail-summary strong { overflow:hidden;margin-top:7px;color:#2f4055;font-size:12px;text-overflow:ellipsis;white-space:nowrap; }.pks-detail-summary p { margin:5px 0 0;color:#9aa5b1;font-size:7.5px; }
.pks-detail-layout { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 15px; margin-bottom: 15px; }.pks-overview-panel { overflow: hidden; }.pks-detail-list { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 22px;margin:0;padding:6px 18px 18px; }.pks-detail-list > div { min-width:0;padding:12px 0;border-bottom:1px solid #eef2f3; }.pks-detail-list .wide { grid-column:span 2; }.pks-detail-list dt { margin-bottom:4px;color:#96a2af;font-size:7.5px;font-weight:800;text-transform:uppercase;letter-spacing:.35px; }.pks-detail-list dd { margin:0;color:#38475b;font-size:9.5px;font-weight:650;line-height:1.6;overflow-wrap:anywhere; }
.pks-work-panel { margin-bottom:15px;overflow:hidden;scroll-margin-top:75px; }.pks-section-header { background:linear-gradient(90deg,#f8fdfc,#fff); }.pks-inline-form { margin:15px 18px;padding:17px;background:#f7fbfb;border:1px solid #cde6e4;border-radius:10px; }.pks-inline-form[hidden],.pks-edit-row[hidden] { display:none; }.pks-inline-form.compact { margin:15px 0 0;padding:15px; }.pks-inline-heading { display:flex;align-items:flex-start;justify-content:space-between;gap:15px;margin-bottom:15px;padding-bottom:11px;border-bottom:1px solid #dfeceb; }.pks-inline-heading strong,.pks-inline-heading small { display:block; }.pks-inline-heading strong { color:#33485a;font-size:10px; }.pks-inline-heading small { margin-top:2px;color:#91a0aa;font-size:7.5px; }.pks-inline-close { padding:0;color:#82909e;background:transparent;border:0;font-size:19px; }.pks-inline-actions { display:flex;justify-content:flex-end;gap:7px;margin-top:14px; }.pks-child-grid,.pks-item-grid { gap:12px 15px; }
.pks-inline-form input[readonly] { color:#68788a;background:#f1f5f6;cursor:not-allowed; }.pks-duration-input { display:grid;grid-template-columns:minmax(0,1fr) 70px; }.pks-duration-input input { border-radius:8px 0 0 8px; }.pks-duration-input span { display:grid;place-items:center;color:#607286;background:#edf4f4;border:1px solid #d7e2e5;border-left:0;border-radius:0 8px 8px 0;font-size:9px;font-weight:750; }
.pks-timeline { position:relative;padding:8px 18px 22px 69px; }.pks-timeline::before { position:absolute;top:20px;bottom:38px;left:40px;width:2px;background:#b9e1dd;content:""; }.pks-timeline-item { position:relative;margin:0 0 14px; }.pks-timeline-item:last-child { margin-bottom:0; }.pks-timeline-number { position:absolute;top:16px;left:-48px;z-index:2;display:grid;place-items:center;width:38px;height:38px;color:#fff;background:linear-gradient(145deg,#13b4a7,#078f9e);border:3px solid #e3f5f3;border-radius:50%;font-size:9px;font-weight:900;box-shadow:0 4px 10px rgba(7,143,151,.2); }.pks-timeline-card { overflow:hidden;background:#fff;border:1px solid #dce7e9;border-radius:11px;box-shadow:0 3px 9px rgba(32,62,76,.05); }.pks-timeline-card > header { display:flex;align-items:center;justify-content:space-between;gap:18px;padding:14px 17px;background:linear-gradient(90deg,#eef9f8,#fbfdfd);border-bottom:1px solid #dfe9ea; }.pks-timeline-card > header span { color:#078e91;font-size:7.5px;font-weight:850;text-transform:uppercase;letter-spacing:.45px; }.pks-timeline-card h3 { margin:3px 0 0;color:#344458;font-size:11px; }.pks-timeline-card > header > strong { color:#263d51;font-size:11px;white-space:nowrap; }.pks-timeline-card > dl { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 24px;margin:0;padding:7px 17px 12px; }.pks-timeline-card > dl div { padding:10px 0;border-bottom:1px solid #eff2f3; }.pks-timeline-card > dl .wide { grid-column:span 2; }.pks-timeline-card dt { margin-bottom:3px;color:#96a1ae;font-size:7px;font-weight:800;text-transform:uppercase; }.pks-timeline-card dd { margin:0;color:#526175;font-size:9px;line-height:1.55; }.pks-timeline-card > footer { display:flex;justify-content:flex-end;gap:6px;padding:10px 17px;background:#fbfcfc;border-top:1px solid #eef2f2; }.pks-timeline-card > footer form { margin:0; }
.pks-item-table .pks-edit-row:hover { background:transparent; }.pks-item-table .pks-edit-row > td { padding:0 13px 13px;background:#fbfdfd; }.pks-delete-form { margin:0; }.pks-delete-modal[hidden] { display:none; }.pks-delete-modal { position:fixed;inset:0;z-index:125;display:grid;place-items:center;padding:22px;opacity:0;transition:opacity .18s ease; }.pks-delete-modal.open { opacity:1; }.pks-delete-modal.open .modal-dialog { transform:translateY(0) scale(1); }
@media (max-width: 1050px) { .pks-summary-grid,.pks-detail-summary { grid-template-columns:repeat(2,1fr); }.pks-detail-layout { grid-template-columns:1fr; } }
@media (max-width: 700px) { .pks-page-heading,.pks-detail-heading { align-items:flex-start;flex-direction:column; }.pks-summary-grid,.pks-detail-summary { grid-template-columns:1fr 1fr; }.pks-filter-form { grid-template-columns:1fr; }.pks-form-heading + .pks-main-form .form-grid,.pks-child-grid,.pks-item-grid,.pks-popup-grid { grid-template-columns:1fr; }.pks-form-heading + .pks-main-form .span-2,.pks-child-grid .span-2,.pks-item-grid .span-2,.pks-popup-grid .modal-span-2 { grid-column:auto; }.pks-wizard-steps { grid-template-columns:1fr 15px 1fr 15px 1fr 15px 1fr;padding:9px; }.pks-wizard-steps > button { justify-content:center;padding:2px; }.pks-wizard-steps > button > div { display:none; }.pks-wizard-steps > button > span { flex-basis:29px;height:29px; }.pks-review-card { grid-template-columns:1fr; }.pks-review-card .wide { grid-column:auto; }.pks-detail-list { grid-template-columns:1fr; }.pks-detail-list .wide { grid-column:auto; }.pks-timeline { padding-left:57px; }.pks-timeline::before { left:30px; }.pks-timeline-number { left:-43px;width:34px;height:34px; }.pks-timeline-card > header { align-items:flex-start;flex-direction:column; }.pks-timeline-card > dl { grid-template-columns:1fr; }.pks-timeline-card > dl .wide { grid-column:auto; }.pks-timeline-card > footer { flex-wrap:wrap; }.pks-delete-modal,.pks-main-modal { align-items:end;padding:0; }.pks-delete-modal .modal-dialog,.pks-main-modal .modal-dialog { width:100%;max-height:94vh;border-radius:15px 15px 0 0; } }
@media (max-width: 460px) { .pks-summary-grid,.pks-detail-summary { grid-template-columns:1fr; } }

/* Role Umum dipisahkan menjadi dua unit dengan penanda visual berbeda. */
.account-role.umum_1 { color:#087e7a;background:#e7f8f6;border-color:#b9e4df; }

/* Bagian Umum 2 - Monitoring Kendaraan */
.vehicle-page-heading { margin-bottom:16px; }
.vehicle-module-tabs { display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin-bottom:16px;padding:6px;background:#eef4f7;border:1px solid #d3e1ea;border-radius:13px; }
.vehicle-module-tabs.vehicle-module-tabs-three { grid-template-columns:repeat(3,minmax(0,1fr)); }
.vehicle-module-tab { display:flex;align-items:center;gap:9px;min-width:0;min-height:61px;padding:9px 10px;color:#61758a;text-decoration:none;background:transparent;border:1px solid transparent;border-radius:10px;transition:transform .18s ease,background .18s ease,border-color .18s ease,box-shadow .18s ease; }
.vehicle-module-tab > span { display:grid;place-items:center;flex:0 0 34px;height:34px;color:#007ca5;background:#fff;border:1px solid #cfe2ea;border-radius:9px;font-size:12px;font-weight:900; }
.vehicle-module-tab strong,.vehicle-module-tab small { display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
.vehicle-module-tab strong { color:#34516b;font-size:8.5px; }.vehicle-module-tab small { margin-top:2px;color:#8999a8;font-size:6.6px; }
.vehicle-module-tab:hover { transform:translateY(-1px);background:rgba(255,255,255,.7); }
.vehicle-module-tab.active { background:#fff;border-color:#8bd3d1;box-shadow:0 4px 12px rgba(21,91,112,.1); }
.vehicle-module-tab.active > span { color:#fff;background:linear-gradient(145deg,#005aa9,#00aaa6);border-color:transparent;box-shadow:0 5px 11px rgba(0,90,169,.18); }
.vehicle-module-tab.active strong { color:#006b91; }
.vehicle-filter-panel { margin-bottom:15px;padding:14px; }.vehicle-filter-form { display:grid;grid-template-columns:minmax(280px,1fr) minmax(170px,.35fr) 44px auto;gap:11px;align-items:end; }.vehicle-filter-form.vehicle-filter-simple { grid-template-columns:minmax(280px,1fr) 44px auto; }
.vehicle-register-panel { overflow:hidden;border-top:3px solid #008da2; }.vehicle-plate { color:#007d98;white-space:nowrap; }.vehicle-name-cell strong,.vehicle-name-cell span { display:block; }.vehicle-name-cell strong { color:#31465c;white-space:nowrap; }.vehicle-name-cell span { margin-top:3px;color:#8f9dad;font-size:7.5px;white-space:nowrap; }
.vehicle-status,.vehicle-document-type,.vehicle-action,.vehicle-expiry { display:inline-flex;align-items:center;padding:5px 8px;border:1px solid;border-radius:999px;font-size:7.2px;font-weight:850;white-space:nowrap; }.vehicle-status.tersedia,.vehicle-action.ditambahkan { color:#fff;background:#069783;border-color:#069783; }.vehicle-status.digunakan,.vehicle-action.diperbarui { color:#fff;background:#087db6;border-color:#087db6; }.vehicle-status.perawatan,.vehicle-expiry.warning { color:#fff;background:#d68a09;border-color:#d68a09; }.vehicle-status.tidak-aktif,.vehicle-action.dihapus,.vehicle-expiry.expired { color:#fff;background:#c44b55;border-color:#c44b55; }.vehicle-status.lainnya { color:#fff;background:#6d28d9;border-color:#6d28d9; }.vehicle-document-type { color:#fff;background:linear-gradient(145deg,#006caf,#009eaa);border-color:transparent; }.vehicle-expiry.active { color:#fff;background:#07947f;border-color:#07947f; }
.vehicle-status.tidak-aktif { background:#dc2626;border-color:#dc2626; }
.vehicle-ownership { display:inline-flex;align-items:center;padding:5px 8px;color:#fff;border:1px solid transparent;border-radius:999px;font-size:7.2px;font-weight:850;white-space:nowrap;box-shadow:0 3px 8px rgba(31,41,55,.12); }.vehicle-ownership.asset { background:#15803d;border-color:#15803d; }.vehicle-ownership.rental { background:#008c95;border-color:#008c95; }
.vehicle-row-deleted { background:#fff7f7;opacity:.78; }.vehicle-row-deleted:hover { background:#fff1f2; }.vehicle-deleted-note { display:inline-flex!important;width:max-content;margin-top:5px!important;padding:3px 6px;color:#fff!important;background:#c44b55;border-radius:999px;font-size:6.7px!important;font-weight:850;line-height:1.2; }
.vehicle-crud-modal[hidden] { display:none; }.vehicle-crud-modal.open { opacity:1; }.vehicle-crud-modal.open .modal-dialog { transform:translateY(0) scale(1); }.vehicle-crud-dialog { width:min(660px,calc(100vw - 40px));max-height:calc(100vh - 32px); }.vehicle-crud-dialog form { display:flex;min-height:0;flex:1;flex-direction:column; }.vehicle-crud-dialog .modal-body { overflow-y:auto; }.vehicle-form-grid { gap:11px 15px; }.vehicle-form-grid textarea { min-height:68px;resize:vertical; }
.vehicle-detail-dialog { display:flex;flex-direction:column; }.vehicle-detail-body { display:grid;min-height:0;grid-auto-rows:max-content;align-content:start;gap:13px;padding:15px 18px;overflow-y:auto;background:#f8fafb;scrollbar-color:#0a65d2 #edf5ff;scrollbar-width:thin; }.vehicle-detail-body::-webkit-scrollbar { width:9px; }.vehicle-detail-body::-webkit-scrollbar-track { background:#edf5ff; }.vehicle-detail-body::-webkit-scrollbar-thumb { background:var(--system-electric-sky-gradient);border:2px solid #edf5ff;border-radius:999px; }.vehicle-detail-section { align-self:start;overflow:hidden;background:#fff;border:1px solid #dce8ec;border-radius:11px;box-shadow:0 3px 10px rgba(38,67,83,.04); }.vehicle-detail-section > header { display:flex;align-items:center;gap:10px;padding:11px 14px;border-bottom:1px solid #e8eef1; }.vehicle-detail-section > header > span { display:grid;place-items:center;flex:0 0 30px;height:30px;color:#fff;background:var(--system-electric-sky-gradient);border-radius:8px;font-size:7.5px;font-weight:900;box-shadow:0 5px 11px rgba(10,101,210,.2); }.vehicle-detail-section > header div { display:grid;gap:2px; }.vehicle-detail-section > header strong { color:#2e4258;font-size:9px; }.vehicle-detail-section > header small { color:#91a0af;font-size:6.8px; }.vehicle-detail-section .modal-detail-grid { padding:2px 14px 11px; }.vehicle-detail-section .modal-detail-grid .detail-wide { grid-column:span 2; }
.vehicle-wizard-body { background:#f8fafb; }.vehicle-form-stepper { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:58px;margin:-1px -20px 18px;padding:12px 20px 18px;background:#fff;border-bottom:1px solid #dce8ec;list-style:none; }.vehicle-form-stepper li { position:relative;display:flex;align-items:center;gap:11px;min-width:0;padding:0;color:#57718a;background:transparent;border:0;transition:color .2s ease; }.vehicle-form-stepper li:not(:last-child)::after { content:"";position:absolute;top:50%;right:-49px;width:40px;height:2px;background:#b9dfe3;border-radius:999px;transform:translateY(-50%);transition:background .2s ease; }.vehicle-form-stepper li > span { display:grid;place-items:center;flex:0 0 46px;height:46px;color:#55728b;background:#edf4f8;border:1px solid #cfe0e8;border-radius:11px;font-size:8px;font-weight:900;box-shadow:0 3px 9px rgba(40,75,96,.04);transition:color .2s ease,background .2s ease,border-color .2s ease,box-shadow .2s ease,transform .2s ease; }.vehicle-form-stepper li div { display:grid;min-width:0;gap:4px; }.vehicle-form-stepper strong { overflow:hidden;font-size:8.5px;text-overflow:ellipsis;white-space:nowrap; }.vehicle-form-stepper small { overflow:hidden;color:#8fa0af;font-size:6.7px;text-overflow:ellipsis;white-space:nowrap; }.vehicle-form-stepper li.active { color:#075b93; }.vehicle-form-stepper li.active > span { color:#fff;background:linear-gradient(145deg,#006caf,#00a6aa);border-color:transparent;box-shadow:0 7px 16px rgba(0,125,156,.22);transform:translateY(-1px); }.vehicle-form-stepper li.complete { color:#087c76; }.vehicle-form-stepper li.complete > span { color:#fff;background:#079b8c;border-color:#079b8c; }.vehicle-form-stepper li.complete::after { background:#74cbc4; }.vehicle-form-step { min-height:245px;align-content:start;animation:vehicle-step-in .2s ease both; }.vehicle-form-step[hidden] { display:none!important; }.vehicle-wizard-footer-spacer { flex:1; }.vehicle-wizard-footer [hidden] { display:none!important; }
.vehicle-form-stepper.maintenance-form-stepper { grid-template-columns:repeat(2,minmax(0,1fr));gap:90px; }.vehicle-form-stepper.maintenance-form-stepper li:not(:last-child)::after { right:-72px;width:54px; }
@keyframes vehicle-step-in { from { opacity:0;transform:translateX(7px); } to { opacity:1;transform:translateX(0); } }
@media (max-width:1100px) { .vehicle-module-tabs { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:700px) { .vehicle-module-tabs { display:flex;overflow-x:auto;scrollbar-width:none; }.vehicle-module-tabs::-webkit-scrollbar { display:none; }.vehicle-module-tab { flex:0 0 178px; }.vehicle-filter-form,.vehicle-filter-form.vehicle-filter-simple { grid-template-columns:1fr; }.vehicle-filter-form .filter-actions { grid-column:auto; }.vehicle-register-panel .table-wrap { overflow-x:auto; }.vehicle-crud-modal { align-items:end;padding:0; }.vehicle-crud-dialog,.vehicle-crud-modal .delete-modal-dialog { width:100%;max-height:94vh;border-radius:15px 15px 0 0; }.vehicle-form-grid { grid-template-columns:1fr; }.vehicle-form-grid .modal-span-2,.vehicle-detail-section .modal-detail-grid .detail-wide { grid-column:auto; }.vehicle-form-stepper { gap:28px;margin:-1px -15px 14px;padding:10px 15px 14px; }.vehicle-form-stepper.maintenance-form-stepper { gap:32px; }.vehicle-form-stepper li { justify-content:center; }.vehicle-form-stepper li:not(:last-child)::after { right:-24px;width:20px; }.vehicle-form-stepper.maintenance-form-stepper li:not(:last-child)::after { right:-27px;width:22px; }.vehicle-form-stepper li > span { flex-basis:34px;height:34px;border-radius:9px; }.vehicle-form-stepper li div { display:none; }.vehicle-form-step { min-height:320px; }.vehicle-wizard-footer-spacer { display:none; } }
.account-role.umum_2 { color:#5369a9;background:#eef2ff;border-color:#d4dcf7; }

/* Halaman pengaman ketika sesi yang sama dibuka dari tab kedua. */
.duplicate-tab-page { display:grid;min-height:100vh;margin:0;padding:24px;place-items:center;background:linear-gradient(145deg,#eef8f8,#f6f8fb); }
.duplicate-tab-card { width:min(480px,100%);padding:42px 36px;text-align:center;background:#fff;border:1px solid #dbe7e9;border-radius:18px;box-shadow:0 20px 55px rgba(36,58,72,.13); }
.duplicate-tab-icon { display:grid;width:58px;height:58px;margin:0 auto 18px;place-items:center;color:#fff;background:linear-gradient(145deg,#14b6aa,#078e9d);border-radius:50%;font-size:25px;font-weight:900;box-shadow:0 8px 20px rgba(8,154,157,.24); }
.duplicate-tab-card p { margin:0;color:#079494;font-size:9px;font-weight:900;letter-spacing:1.4px; }
.duplicate-tab-card h1 { margin:9px 0 10px;color:#2e3c53;font-size:24px;line-height:1.3; }
.duplicate-tab-card > span:not(.duplicate-tab-icon) { display:block;color:#78879a;font-size:12px;line-height:1.7; }
.duplicate-tab-card .btn { margin-top:24px; }
.duplicate-tab-actions { display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:10px;margin-top:24px; }
.duplicate-tab-actions .btn { margin-top:0; }
.duplicate-tab-actions .btn:disabled { cursor:wait;opacity:.62; }
@media (max-width:520px) { .duplicate-tab-actions { align-items:stretch;flex-direction:column; }.duplicate-tab-actions .btn { width:100%; } }

/* Ringkasan popup PKS disusun dua kolom agar padat dan tetap mudah dipindai. */
.pks-detail-popup-body .pks-detail-summary { grid-template-columns:repeat(2,minmax(0,1fr));gap:9px; }
.pks-detail-popup-body .pks-detail-summary article { min-height:88px;padding:11px 13px; }
.pks-detail-popup-body .pks-detail-layout { grid-template-columns:1fr;gap:9px; }
@media (max-width: 560px) { .pks-detail-popup-body .pks-detail-summary { grid-template-columns:1fr; } }

/* Popup detail PKS dibuat lebih ramping pada layar desktop. */
@media (min-width: 701px) {
    .pks-main-modal.pks-detail-popup .modal-dialog.pks-detail-popup-dialog {
        width: min(820px, calc(100vw - 64px));
        max-width: 820px;
    }
}

/* Landing page bergaya kampanye: konten ringkas di kiri dan bidang visual tosca di kanan. */
.campaign-landing-page { position:relative;width:100%;height:100dvh;min-height:520px;overflow:hidden;color:#24242a;background:#fff; }
.campaign-landing-header { position:relative;z-index:20;display:flex;align-items:center;width:100%;height:clamp(76px,12vh,98px);padding:0 clamp(24px,5.5vw,84px); }
.campaign-landing-brand { display:inline-flex;align-items:center;flex:0 0 auto; }
.campaign-brand-logo { position:relative;display:block;width:220px;height:76px;overflow:hidden; }
.campaign-brand-logo img { position:absolute;top:-29px;left:-35px;width:278px;max-width:none;height:auto; }
.campaign-landing-nav { display:flex;align-items:center;gap:clamp(24px,3vw,44px);margin-left:auto; }
.campaign-landing-nav a { position:relative;padding:9px 0;color:#79818a;font-size:9px;font-weight:800;letter-spacing:.85px;text-transform:uppercase; }
.campaign-landing-nav a::after { position:absolute;right:50%;bottom:2px;left:50%;height:2px;background:#10b9ad;border-radius:20px;content:"";transition:right .18s ease,left .18s ease; }
.campaign-landing-nav a:hover,.campaign-landing-nav a.active { color:#079b9d; }
.campaign-landing-nav a:hover::after,.campaign-landing-nav a.active::after { right:0;left:0; }
.campaign-nav-login { display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:38px;margin-left:clamp(24px,3vw,44px);padding:0 17px;color:#fff;background:linear-gradient(135deg,#10b8ab,#078ea3);border-radius:8px;box-shadow:0 9px 22px rgba(5,150,157,.2);font-size:10px;font-weight:850; }
.campaign-nav-login:hover { color:#fff;box-shadow:0 12px 27px rgba(5,150,157,.28);transform:translateY(-1px); }
.campaign-nav-login span { font-size:15px; }
.campaign-landing-main { position:relative;display:flex;align-items:center;height:calc(100dvh - clamp(76px,12vh,98px));min-height:422px;padding:0 clamp(24px,5.5vw,84px) clamp(28px,6vh,58px);isolation:isolate; }
.campaign-landing-copy { position:relative;z-index:5;width:min(43vw,590px);margin-top:-1vh; }
.campaign-landing-kicker { margin:0;color:#0bb4a8;font-size:clamp(8px,.8vw,11px);font-weight:900;letter-spacing:2.4px; }
.campaign-landing-copy h1 { margin:clamp(13px,2.5vh,24px) 0 0;color:#252429;font-size:clamp(47px,5.1vw,73px);line-height:.87;letter-spacing:-2.5px; }
.campaign-landing-copy h1 strong,.campaign-landing-copy h1 span { display:block; }
.campaign-landing-copy h1 strong { font-weight:900; }
.campaign-landing-copy h1 span { margin-top:8px;font-weight:350;letter-spacing:-1px;text-transform:uppercase; }
.campaign-landing-copy h2 { margin:clamp(13px,2.4vh,22px) 0 0;color:#078f9a;font-size:clamp(13px,1.35vw,19px);font-weight:850;letter-spacing:.3px; }
.campaign-landing-description { max-width:500px;margin:clamp(12px,2vh,19px) 0 0;color:#68727e;font-size:clamp(10px,.95vw,13px);line-height:1.72; }
.campaign-landing-actions { display:flex;align-items:center;gap:16px;margin-top:clamp(20px,3.8vh,35px); }
.campaign-primary-action { display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:42px;padding:0 18px;color:#078e9b;background:#fff;border:2px solid #0aabb0;border-radius:999px;box-shadow:0 7px 18px rgba(9,159,165,.09);font-size:9px;font-weight:900;letter-spacing:.55px;text-transform:uppercase; }
.campaign-primary-action:hover { color:#fff;background:linear-gradient(135deg,#0db6aa,#078fa2);box-shadow:0 10px 22px rgba(7,150,157,.22);transform:translateY(-1px); }
.campaign-primary-action span { font-size:13px; }
.campaign-text-action { color:#0aa9a4;font-size:9px;font-weight:900;letter-spacing:.45px;text-transform:uppercase; }
.campaign-text-action:hover { color:#087e96;text-decoration:underline; }
.campaign-feature-note { display:flex;flex-wrap:wrap;gap:8px 15px;margin-top:clamp(17px,3.2vh,29px);color:#74808c;font-size:8px;font-weight:750; }
.campaign-feature-note span { display:inline-flex;align-items:center;gap:5px; }
.campaign-feature-note i { display:grid;width:16px;height:16px;place-items:center;color:#078d91;background:#e0f7f3;border-radius:50%;font-size:7px;font-style:normal; }
.campaign-landing-dots { display:flex;gap:7px;margin-top:clamp(20px,4.5vh,42px); }
.campaign-landing-dots i { width:25px;height:3px;background:#e9edef;border-radius:99px; }
.campaign-landing-dots i.active { background:#0bb8ac; }
.campaign-landing-art { position:absolute;z-index:1;top:clamp(-175px,-18vh,-105px);right:-7vw;width:min(65vw,990px);height:calc(100% + clamp(175px,25vh,245px));overflow:hidden;background:linear-gradient(145deg,#0788ba 0%,#08adb7 43%,#10bda2 100%);border-radius:58% 0 0 50% / 49% 0 0 56%;box-shadow:-22px 24px 55px rgba(5,117,155,.13); }
.campaign-landing-art::before { position:absolute;inset:-12%;background:repeating-radial-gradient(ellipse at 63% 52%,transparent 0 13px,rgba(255,255,255,.13) 14px 15px,transparent 16px 25px);content:"";opacity:.52;transform:rotate(-10deg); }
.campaign-landing-art::after { position:absolute;top:21%;right:-8%;width:63%;height:26%;background:linear-gradient(115deg,rgba(19,197,147,.05),rgba(18,205,143,.72));border-radius:45% 0 0 55%;content:"";transform:rotate(3deg); }
.campaign-orbit-lines { position:absolute;z-index:2;border:1px solid rgba(255,255,255,.2);border-radius:50%; }
.campaign-orbit-lines::before,.campaign-orbit-lines::after { position:absolute;inset:18px;border:inherit;border-radius:inherit;content:""; }
.campaign-orbit-lines::after { inset:39px; }
.campaign-orbit-lines.orbit-one { right:8%;bottom:-12%;width:63%;height:55%;transform:rotate(-18deg); }
.campaign-orbit-lines.orbit-two { top:4%;left:30%;width:56%;height:30%;transform:rotate(11deg); }
.campaign-dot-cloud { position:absolute;z-index:3;width:112px;height:90px;background-image:radial-gradient(rgba(255,255,255,.9) 1.5px,transparent 1.7px);background-size:10px 10px; }
.dot-cloud-top { top:24%;left:37%;transform:rotate(5deg); }
.dot-cloud-bottom { bottom:7%;left:11%; }
.campaign-ring { position:absolute;z-index:4;width:32px;height:32px;border:1.5px solid rgba(255,255,255,.72);border-radius:50%; }
.ring-one { top:35%;left:42%; }.ring-two { top:18%;right:12%;width:18px;height:18px; }
.campaign-stroke { position:absolute;z-index:4;width:39px;height:4px;background:rgba(255,255,255,.8);border-radius:99px;transform:rotate(48deg); }
.stroke-one { top:29%;left:58%; }.stroke-two { top:50%;left:22%; }.stroke-three { right:22%;bottom:24%;transform:rotate(-37deg); }
.campaign-art-status { position:absolute;z-index:5;right:14%;bottom:8%;display:flex;gap:12px; }
.campaign-art-status span { display:grid;width:29px;height:29px;place-items:center;color:#079aab;background:#fff;border-radius:50%;box-shadow:0 7px 17px rgba(0,80,110,.16);font-size:10px;font-weight:900; }
@media (max-width: 1040px) { .campaign-landing-nav { gap:22px; }.campaign-landing-copy { width:47vw; }.campaign-landing-art { right:-13vw;width:68vw; }.campaign-feature-note { max-width:430px; } }
@media (max-width: 760px) { .campaign-landing-header { height:72px;padding-inline:20px; }.campaign-brand-logo { width:180px;height:64px; }.campaign-brand-logo img { top:-24px;left:-29px;width:228px; }.campaign-landing-nav { display:none; }.campaign-nav-login { margin-left:auto; }.campaign-landing-main { align-items:flex-start;height:calc(100dvh - 72px);min-height:448px;padding:clamp(35px,8vh,70px) 20px 18px; }.campaign-landing-copy { width:100%;max-width:540px;margin:0; }.campaign-landing-copy h1 { font-size:clamp(44px,12.5vw,63px); }.campaign-landing-description { max-width:88%; }.campaign-landing-art { top:43%;right:-45%;width:125vw;height:78%;border-radius:58% 0 0 0 / 55% 0 0 0;opacity:.2; }.campaign-art-status { display:none; }.campaign-feature-note { max-width:94%; }.campaign-landing-dots { margin-top:22px; } }
@media (max-width: 460px) { .campaign-brand-logo { width:158px; }.campaign-brand-logo img { left:-26px;width:207px; }.campaign-nav-login { min-height:34px;padding-inline:12px;font-size:9px; }.campaign-landing-main { padding-top:34px; }.campaign-landing-copy h1 { letter-spacing:-2px; }.campaign-landing-copy h1 span { margin-top:6px; }.campaign-landing-copy h2 { margin-top:12px; }.campaign-feature-note span:nth-child(3) { display:none; } }
@media (max-height: 650px) and (min-width: 761px) { .campaign-landing-copy h1 { font-size:clamp(44px,9.5vh,60px); }.campaign-landing-copy h2 { margin-top:10px; }.campaign-landing-description { margin-top:9px;line-height:1.5; }.campaign-landing-actions { margin-top:16px; }.campaign-feature-note { margin-top:14px; }.campaign-landing-dots { margin-top:17px; } }

/* Landing page geometris penuh dengan gradasi ungu, biru, dan tosca. */
.geo-landing-page { position:relative;width:100%;height:100dvh;min-height:520px;overflow:hidden;color:#fff;background:linear-gradient(132deg,#d819aa 0%,#9f42be 20%,#6369ca 40%,#198fc9 68%,#0bd1bf 100%); }
.geo-landing-page::before { position:absolute;z-index:1;inset:0;background:radial-gradient(circle at 66% 72%,rgba(255,255,255,.13),transparent 29%),linear-gradient(90deg,rgba(39,24,115,.24) 0%,rgba(38,39,137,.13) 38%,transparent 61%),linear-gradient(115deg,transparent 0 45%,rgba(11,228,205,.14) 72%,transparent 100%);content:"";pointer-events:none; }
.geo-landing-page::after { position:fixed;z-index:40;inset:0;box-shadow:inset 0 0 0 7px rgba(255,255,255,.96);content:"";pointer-events:none; }
.geo-landing-header { position:relative;z-index:20;display:flex;align-items:center;width:100%;height:clamp(76px,13vh,102px);padding:0 clamp(28px,7.5vw,112px); }
.geo-landing-brand { display:inline-flex;align-items:center;flex:0 0 auto; }
.geo-brand-logo { position:relative;display:block;width:205px;height:72px;overflow:hidden; }
.geo-brand-logo img { position:absolute;top:-27px;left:-33px;width:258px;max-width:none;height:auto;filter:brightness(0) invert(1); }
.geo-landing-nav { display:flex;align-items:center;gap:clamp(27px,3.4vw,51px);margin-left:auto; }
.geo-landing-nav a { position:relative;padding:9px 0;color:rgba(255,255,255,.76);font-size:8px;font-weight:750;letter-spacing:1.15px;text-transform:uppercase; }
.geo-landing-nav a::after { position:absolute;right:50%;bottom:2px;left:50%;height:2px;background:#fff;border-radius:10px;content:"";transition:right .18s ease,left .18s ease; }
.geo-landing-nav a:hover,.geo-landing-nav a.active { color:#fff; }.geo-landing-nav a:hover::after,.geo-landing-nav a.active::after { right:0;left:0; }
.geo-nav-login { display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:36px;margin-left:clamp(27px,3.4vw,51px);padding:0 16px;color:#fff;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.62);border-radius:999px;backdrop-filter:blur(8px);font-size:8px;font-weight:900;letter-spacing:.75px;text-transform:uppercase; }
.geo-nav-login:hover { color:#2168ae;background:#fff;transform:translateY(-1px); }.geo-nav-login span { font-size:13px; }
.geo-landing-main { position:relative;display:flex;align-items:center;height:calc(100dvh - clamp(76px,13vh,102px));min-height:418px;padding:0 clamp(28px,7.5vw,112px) clamp(30px,7vh,66px);isolation:isolate; }
.geo-landing-copy { position:relative;z-index:8;width:min(43vw,580px);margin-top:-1vh; }
.geo-landing-copy::before { position:absolute;z-index:-1;inset:-42px -70px -50px -45px;background:radial-gradient(ellipse at 38% 48%,rgba(36,35,131,.22),rgba(36,35,131,.08) 45%,transparent 74%);content:"";pointer-events:none; }
.geo-landing-kicker { margin:0;color:#7dfff2;font-size:clamp(8px,.75vw,10px);font-weight:900;letter-spacing:2.9px; }
.geo-landing-copy h1 { margin:clamp(15px,2.7vh,26px) 0 0;color:#fff;font-size:clamp(42px,4.8vw,68px);line-height:.84;text-shadow:0 3px 18px rgba(30,28,111,.2);text-transform:uppercase; }
.geo-landing-copy h1 span,.geo-landing-copy h1 strong { display:block; }
.geo-landing-copy h1 span { margin-bottom:8px;font-size:.62em;font-style:italic;font-weight:300;letter-spacing:2.3px; }
.geo-landing-copy h1 strong { font-weight:900;letter-spacing:.6px; }
.geo-landing-copy h1 strong + strong { margin-top:10px;font-size:.82em; }
.geo-landing-description { max-width:475px;margin:clamp(17px,3vh,29px) 0 0;color:rgba(255,255,255,.94);font-size:clamp(9px,.9vw,12px);line-height:1.75;text-shadow:0 2px 10px rgba(29,31,113,.2); }
.geo-landing-actions { display:flex;align-items:center;margin-top:clamp(24px,4.8vh,44px); }
.geo-primary-action { display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:39px;padding:0 18px;color:#fff;background:linear-gradient(90deg,#29e3cb 0%,#0cc8bf 36%,#db1eaa 100%);border:1px solid rgba(255,255,255,.34);border-radius:999px;box-shadow:0 10px 23px rgba(49,30,127,.2);font-size:8px;font-weight:900;letter-spacing:.8px;text-transform:uppercase; }
.geo-primary-action:hover { color:#fff;box-shadow:0 14px 28px rgba(49,30,127,.3);transform:translateY(-2px); }.geo-primary-action span { font-size:13px; }
.geo-feature-note { display:flex;align-items:center;gap:9px;margin-top:clamp(22px,5vh,46px);color:rgba(255,255,255,.82);font-size:7px;font-weight:800;letter-spacing:.5px;text-shadow:0 1px 8px rgba(28,31,112,.18);text-transform:uppercase; }
.geo-feature-note i { width:3px;height:3px;background:#75fff2;border-radius:50%; }
.geo-plus { position:absolute;z-index:10;color:#fff;font-weight:200;line-height:1; }
.plus-copy-one { top:-47px;left:0;font-size:24px; }.plus-copy-two { right:10px;bottom:23%;font-size:25px; }
.geo-landing-art { position:fixed;z-index:2;inset:0;overflow:hidden;pointer-events:none; }
.geo-top-arc { position:absolute;top:-56%;left:-12%;box-sizing:border-box;width:46vw;height:46vw;min-width:560px;min-height:560px;background:linear-gradient(142deg,#eb1aa9 8%,#aa35bc 62%,#665dcc 100%);border:44px solid rgba(20,231,211,.82);border-radius:50%;box-shadow:0 0 0 1px rgba(255,255,255,.04);opacity:.88; }
.geo-right-panel { position:absolute;z-index:4;top:26%;right:-7%;width:45%;height:33%;background:linear-gradient(135deg,rgba(91,215,221,.32),rgba(128,108,208,.79) 58%,rgba(217,30,169,.73));clip-path:polygon(0 19%,100% 0,100% 100%,0 82%);opacity:.84; }
.geo-bottom-circle { position:absolute;z-index:2;right:-18%;bottom:-65%;width:64vw;height:64vw;min-width:760px;min-height:760px;background:linear-gradient(132deg,rgba(91,224,220,.32),rgba(10,207,191,.88) 55%,rgba(3,159,181,.94));border:1px solid rgba(255,255,255,.16);border-radius:50%;box-shadow:inset 0 0 0 78px rgba(255,255,255,.085),inset 0 0 0 154px rgba(255,255,255,.06); }
.geo-inner-arc { position:absolute;z-index:3;right:-14%;bottom:-60%;box-sizing:border-box;width:62vw;height:62vw;min-width:740px;min-height:740px;border:7px solid rgba(255,255,255,.9);border-radius:50%; }
.geo-orbit { position:absolute;z-index:6;top:22%;right:17%;width:106px;height:106px;border:1.5px solid rgba(255,255,255,.88);border-radius:50%; }
.geo-orbit i { position:absolute;top:50%;left:50%;width:40px;height:40px;background:linear-gradient(145deg,#19decb 0%,#1bc3c2 37%,#da20aa 72%,#c61fa9 100%);border-radius:50%;box-shadow:0 7px 18px rgba(61,27,124,.18);transform:translate(-50%,-50%); }
.plus-art-one { top:24%;left:47%;font-size:25px; }.plus-art-two { top:17%;right:7%;font-size:26px; }.plus-art-three { right:22%;bottom:10%;font-size:25px; }
.geo-line { position:absolute;z-index:6;width:2px;background:rgba(255,255,255,.82); }
.line-art-one { top:39%;right:8%;bottom:-2px;height:auto; }.line-art-two { right:10.5%;bottom:-2px;height:19%; }
@media (max-width: 1040px) { .geo-landing-header { padding-inline:55px; }.geo-landing-main { padding-inline:55px; }.geo-landing-copy { width:48vw; }.geo-landing-nav { gap:22px; }.geo-top-arc { left:-24%; }.geo-bottom-circle { right:-25%; }.geo-right-panel { width:47%; } }
@media (max-width: 760px) { .geo-landing-header { height:72px;padding-inline:20px; }.geo-brand-logo { width:172px;height:62px; }.geo-brand-logo img { top:-23px;left:-28px;width:218px; }.geo-landing-nav { display:none; }.geo-nav-login { margin-left:auto; }.geo-landing-main { align-items:flex-start;height:calc(100dvh - 72px);min-height:448px;padding:clamp(52px,10vh,82px) 20px 20px; }.geo-landing-copy { width:100%;max-width:520px;margin:0; }.geo-landing-copy::before { inset:-34px -24px -42px; }.geo-landing-copy h1 { font-size:clamp(43px,12vw,62px); }.geo-landing-description { max-width:90%; }.geo-landing-art { inset:0;opacity:.48; }.geo-top-arc { top:-42%;left:-92%; }.geo-right-panel { top:49%;right:-28%;width:92%; }.geo-bottom-circle { right:-98%;bottom:-45%; }.geo-inner-arc { right:-92%;bottom:-40%; }.geo-orbit { top:18%;right:7%; }.plus-copy-one { top:-38px; }.plus-copy-two { display:none; }.geo-feature-note span:nth-of-type(3),.geo-feature-note i:last-of-type { display:none; } }
@media (max-width: 460px) { .geo-landing-page::after { box-shadow:inset 0 0 0 4px rgba(255,255,255,.96); }.geo-brand-logo { width:150px; }.geo-brand-logo img { left:-26px;width:202px; }.geo-nav-login { min-height:33px;padding-inline:12px;font-size:7.5px; }.geo-landing-main { padding-top:43px; }.geo-landing-copy h1 span { margin-bottom:6px; }.geo-landing-copy h1 strong + strong { margin-top:7px; }.geo-landing-description { line-height:1.6; }.geo-feature-note { gap:6px;font-size:6.4px; } }
@media (max-height: 650px) and (min-width: 761px) { .geo-landing-copy h1 { font-size:clamp(39px,9.4vh,56px); }.geo-landing-description { margin-top:13px;line-height:1.5; }.geo-landing-actions { margin-top:18px; }.geo-feature-note { margin-top:20px; }.plus-copy-one { top:-34px; } }

/* Palet login mengikuti landing geometris ungu, biru, dan tosca. */
.login-page { position:relative;overflow-x:hidden;background:linear-gradient(132deg,#cf1eaa 0%,#8b4cc2 22%,#4f6dcc 44%,#138fc9 69%,#09cfc1 100%); }
.login-page::before { position:fixed;top:-260px;left:-210px;width:610px;height:610px;border:48px solid rgba(30,238,215,.62);border-left-color:transparent;border-bottom-color:transparent;border-radius:50%;content:"";transform:rotate(24deg); }
.login-page::after { position:fixed;right:-260px;bottom:-370px;width:720px;height:720px;border:90px solid rgba(255,255,255,.1);border-radius:50%;content:""; }
.login-shell { position:relative;z-index:2;background:rgba(255,255,255,.96);border:1px solid rgba(255,255,255,.5);box-shadow:0 24px 65px rgba(42,28,105,.28); }
.login-brand-panel { background:linear-gradient(148deg,#c921ad 0%,#7c4fc4 35%,#246fc6 67%,#08bdb6 100%); }
.login-brand-panel::before { right:-150px;bottom:-145px;width:380px;height:380px;border:52px solid rgba(255,255,255,.09); }
.login-brand-panel::after { right:-52px;bottom:-52px;width:215px;height:215px;border-color:rgba(102,255,238,.26); }
.login-brand-mark { background:linear-gradient(145deg,rgba(255,255,255,.26),rgba(255,255,255,.1));border:1px solid rgba(255,255,255,.24);box-shadow:0 10px 25px rgba(54,30,125,.16); }
.login-brand-copy > span { color:#77fff0; }.login-brand-copy p { color:rgba(255,255,255,.78); }
.login-form-panel { background:rgba(255,255,255,.97); }
.login-eyebrow { color:#a541b8;background:linear-gradient(90deg,#bc2bac,#127fc3,#08ada9);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent; }
.login-form-wrap h2 { color:#334160; }
.login-form input { border-color:#dcdceb; }
.login-form input:focus { border-color:#5e73ca;box-shadow:0 0 0 3px rgba(92,94,198,.12); }
.password-field button { color:#8f45b9; }
.login-submit { color:#fff;background:linear-gradient(90deg,#13cbb8 0%,#177fc6 51%,#c625ad 100%);box-shadow:0 11px 24px rgba(87,61,181,.22); }
.login-submit:hover { color:#fff;background:linear-gradient(90deg,#0fb6aa 0%,#176fb8 50%,#ac219b 100%);box-shadow:0 14px 29px rgba(87,61,181,.3);transform:translateY(-1px); }
.login-alert.danger { color:#9c3762;background:#fff0f6;border-color:#efbed3; }.login-alert.success { color:#08766b;background:#e8faf7;border-color:#b5e8df; }
@media (max-width: 760px) { .login-page::before { top:-330px;left:-330px; }.login-page::after { right:-470px;bottom:-470px; }.login-shell { border-color:rgba(255,255,255,.32); } }

/* Landing page gradasi dengan ornamen garis dan lingkaran seperti referensi terbaru. */
.geo-landing-page {
    position:relative;
    width:100%;
    height:100dvh;
    min-height:520px;
    overflow:hidden;
    color:#fff;
    background:linear-gradient(118deg,#bb46f3 0%,#805cf4 22%,#3568f4 48%,#087fcf 69%,#08bca9 100%);
}
.geo-landing-page::before {
    position:fixed;
    z-index:1;
    inset:0;
    background:
        linear-gradient(118deg,rgba(232,49,255,.24) 0%,transparent 29%),
        linear-gradient(298deg,rgba(18,218,165,.28) 0%,transparent 36%),
        repeating-linear-gradient(135deg,rgba(255,255,255,.018) 0 1px,transparent 1px 7px);
    content:"";
    pointer-events:none;
}
.geo-landing-page::after { display:none; }
.geo-landing-header {
    position:relative;
    z-index:20;
    display:flex;
    align-items:center;
    width:100%;
    height:clamp(70px,11vh,88px);
    padding:0 clamp(34px,7.5vw,112px);
}
.geo-landing-brand { display:inline-flex;align-items:center;flex:0 0 auto; }
.geo-brand-logo { position:relative;display:block;width:188px;height:64px;overflow:hidden; }
.geo-brand-logo img { position:absolute;top:-24px;left:-30px;width:236px;max-width:none;height:auto;filter:brightness(0) invert(1);opacity:.92; }
.geo-landing-nav { display:flex;align-items:center;gap:clamp(23px,2.8vw,43px);margin-left:auto; }
.geo-landing-nav a {
    position:relative;
    padding:8px 0;
    color:rgba(255,255,255,.78);
    font-size:clamp(8px,.72vw,10px);
    font-weight:500;
    letter-spacing:.12px;
    text-transform:none;
    text-shadow:0 1px 8px rgba(31,38,130,.18);
}
.geo-landing-nav a::after { position:absolute;right:50%;bottom:2px;left:50%;height:1px;background:rgba(255,255,255,.9);border-radius:10px;content:"";transition:right .18s ease,left .18s ease; }
.geo-landing-nav a:hover,.geo-landing-nav a.active { color:#fff; }
.geo-landing-nav a:hover::after,.geo-landing-nav a.active::after { right:0;left:0; }
.geo-landing-main {
    position:relative;
    display:flex;
    align-items:flex-start;
    height:calc(100dvh - clamp(70px,11vh,88px));
    min-height:432px;
    padding:clamp(90px,17.5vh,138px) clamp(30px,7.5vw,112px) 34px clamp(78px,15.4vw,238px);
    isolation:isolate;
}
.geo-landing-copy {
    position:relative;
    z-index:8;
    width:min(41vw,520px);
    margin:0;
}
.geo-landing-copy::before {
    position:absolute;
    z-index:-1;
    inset:-45px -90px -58px -52px;
    background:radial-gradient(ellipse at 34% 44%,rgba(66,53,177,.16),transparent 70%);
    content:"";
    pointer-events:none;
}
.geo-landing-copy h1 {
    margin:0;
    color:#fff;
    font-size:clamp(39px,4.2vw,61px);
    font-weight:320;
    line-height:1.08;
    letter-spacing:.4px;
    text-shadow:0 3px 18px rgba(43,39,139,.2);
    text-transform:uppercase;
    white-space:nowrap;
}
.geo-landing-description {
    max-width:340px;
    margin:clamp(15px,2.6vh,24px) 0 0;
    color:rgba(255,255,255,.78);
    font-size:clamp(9px,.78vw,11px);
    font-weight:400;
    line-height:1.62;
    text-shadow:0 1px 9px rgba(40,40,136,.2);
}
.geo-landing-actions { display:flex;align-items:center;margin-top:clamp(24px,4.7vh,43px); }
.geo-primary-action {
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:36px;
    padding:0 18px;
    color:#fff;
    background:linear-gradient(90deg,#d953e9 0%,#ec54be 100%);
    border:1px solid rgba(255,255,255,.17);
    border-radius:8px;
    box-shadow:0 9px 20px rgba(75,39,171,.17);
    font-size:clamp(8px,.7vw,10px);
    font-weight:500;
    letter-spacing:.1px;
    text-transform:none;
}
.geo-primary-action:hover { color:#fff;background:linear-gradient(90deg,#d148e2,#f25aaf);box-shadow:0 12px 24px rgba(75,39,171,.25);transform:translateY(-1px); }
.geo-landing-art { position:fixed;z-index:2;inset:0;overflow:hidden;pointer-events:none; }
.geo-landing-art::before {
    position:absolute;
    top:-16%;
    right:14%;
    width:46%;
    height:92%;
    background:repeating-linear-gradient(135deg,rgba(255,255,255,.035) 0 1px,transparent 1px 5px);
    content:"";
    opacity:.5;
    transform:rotate(-7deg);
}
.geo-stripe-circle {
    position:absolute;
    border-radius:50%;
    background:repeating-linear-gradient(45deg,rgba(255,255,255,.72) 0 2px,transparent 2px 7px);
    opacity:.48;
}
.stripe-left { top:20%;left:-5.4%;width:190px;height:190px; }
.stripe-top-right { top:-17%;right:-5%;width:330px;height:330px;opacity:.42; }
.stripe-mid-right { top:34%;right:-7%;width:255px;height:255px;opacity:.62; }
.stripe-center { top:46%;right:27%;width:98px;height:98px;opacity:.5; }
.stripe-bottom-left { bottom:-4%;left:34%;width:112px;height:112px;opacity:.43; }
.stripe-bottom-center { bottom:-12%;left:55%;width:174px;height:174px;opacity:.36; }
.stripe-bottom-right { right:7%;bottom:-17%;width:218px;height:218px;opacity:.38; }
.geo-orbit-path { position:absolute;border:1px solid rgba(255,255,255,.35);border-radius:50%; }
.orbit-path-one { left:-5%;bottom:-42%;width:74%;height:66%;transform:rotate(-13deg); }
.orbit-path-two { top:-38%;right:-9%;width:47%;height:65%;border-color:rgba(255,255,255,.18);transform:rotate(17deg); }
.geo-accent-line { position:absolute;height:3px;background:rgba(255,255,255,.72);border-radius:99px;transform-origin:left center; }
.accent-line-one { left:5%;bottom:9%;width:142px;transform:rotate(-46deg); }
.accent-line-two { top:5%;left:19%;width:240px;height:1px;background:rgba(63,61,202,.29);transform:rotate(-43deg); }
.accent-line-three { top:56%;right:32%;width:285px;height:2px;background:rgba(44,66,196,.27);transform:rotate(-44deg); }
@media (max-width: 1040px) {
    .geo-landing-header { padding-inline:54px; }
    .geo-landing-nav { gap:22px; }
    .geo-landing-main { padding-left:13vw; }
    .geo-landing-copy { width:49vw; }
    .stripe-top-right { right:-13%; }
    .stripe-mid-right { right:-12%; }
}
@media (max-width: 760px) {
    .geo-landing-header { height:70px;padding-inline:20px; }
    .geo-brand-logo { width:166px;height:60px; }
    .geo-brand-logo img { top:-22px;left:-27px;width:211px; }
    .geo-landing-nav { display:none; }
    .geo-landing-main { height:calc(100dvh - 70px);min-height:450px;padding:clamp(68px,13vh,105px) 24px 24px; }
    .geo-landing-copy { width:100%;max-width:520px; }
    .geo-landing-copy::before { inset:-36px -24px -50px; }
    .geo-landing-copy h1 { font-size:clamp(34px,10.4vw,52px);white-space:normal; }
    .geo-landing-description { max-width:88%; }
    .geo-landing-art { opacity:.68; }
    .stripe-left { left:-25%; }
    .stripe-top-right { top:-8%;right:-34%; }
    .stripe-mid-right { top:46%;right:-29%; }
    .stripe-center { right:15%; }
    .accent-line-three { right:-10%; }
}
@media (max-height: 650px) and (min-width: 761px) {
    .geo-landing-main { padding-top:9vh; }
    .geo-landing-copy h1 { font-size:clamp(38px,8vh,54px); }
    .geo-landing-description { margin-top:13px;line-height:1.5; }
    .geo-landing-actions { margin-top:22px; }
}

/* Konsep landing baru: pusat register yang menghubungkan seluruh alur dokumen. */
.geo-landing-page {
    background:linear-gradient(122deg,#5b557d 0%,#596c9c 30%,#4d7fa3 55%,#3f8fa1 78%,#65a593 100%);
}
.geo-landing-page::before {
    display:block;
    background:
        radial-gradient(circle at 84% 48%,rgba(58,246,219,.19),transparent 27%),
        radial-gradient(circle at 12% 88%,rgba(235,76,246,.23),transparent 29%),
        linear-gradient(90deg,rgba(55,31,139,.16),transparent 51%),
        repeating-linear-gradient(135deg,rgba(255,255,255,.016) 0 1px,transparent 1px 8px);
}
.geo-landing-header { height:clamp(76px,12vh,94px); }
.geo-landing-main {
    align-items:center;
    height:calc(100dvh - clamp(76px,12vh,94px));
    min-height:426px;
    padding:0 clamp(34px,7.5vw,112px) clamp(22px,4vh,40px);
}
.geo-landing-copy { width:min(46vw,620px);margin-top:-2vh; }
.geo-landing-copy::before {
    inset:-72px -105px -70px -55px;
    background:radial-gradient(ellipse at 34% 48%,rgba(45,35,147,.2),rgba(45,35,147,.07) 48%,transparent 74%);
}
.geo-landing-kicker {
    display:flex;
    align-items:center;
    gap:13px;
    margin:0 0 clamp(14px,2.2vh,21px);
    color:#83fff1;
    font-size:clamp(8px,.68vw,10px);
    font-weight:850;
    letter-spacing:2.5px;
}
.geo-landing-kicker::before { width:31px;height:2px;background:#5cfff0;border-radius:99px;content:""; }
.geo-landing-copy h1 {
    margin:0;
    color:#fff;
    font-size:clamp(53px,6vw,86px);
    font-weight:300;
    line-height:.86;
    letter-spacing:-2.8px;
    text-transform:none;
    white-space:normal;
}
.geo-landing-copy h1 span,.geo-landing-copy h1 strong { display:block; }
.geo-landing-copy h1 span { margin:0;color:rgba(255,255,255,.94);font-size:1em;font-style:normal;font-weight:320;letter-spacing:-2.8px; }
.geo-landing-copy h1 strong {
    width:max-content;
    max-width:100%;
    margin:10px 0 0;
    padding:0;
    color:#fff;
    background:transparent;
    border:0;
    border-radius:0;
    box-shadow:none;
    font-size:.98em;
    font-weight:850;
    letter-spacing:-2.5px;
}
.geo-landing-copy h2 {
    margin:clamp(15px,2.5vh,24px) 0 0;
    color:rgba(255,255,255,.96);
    font-size:clamp(15px,1.35vw,20px);
    font-weight:800;
    letter-spacing:.2px;
}
.geo-landing-description { max-width:510px;margin:clamp(12px,2vh,18px) 0 0;color:rgba(255,255,255,.79);font-size:clamp(9px,.86vw,12px);line-height:1.7; }
.geo-landing-actions { gap:20px;margin-top:clamp(22px,3.8vh,35px); }
.geo-primary-action {
    min-height:42px;
    gap:10px;
    padding:0 19px;
    background:linear-gradient(92deg,#10c8b8,#078fc0);
    border-color:rgba(164,255,245,.35);
    border-radius:10px;
    box-shadow:0 12px 26px rgba(27,55,150,.2);
    font-size:clamp(8px,.7vw,10px);
    font-weight:850;
    text-transform:uppercase;
}
.geo-primary-action:hover { background:linear-gradient(92deg,#0bb6aa,#087daf); }
.geo-primary-action span { font-size:14px; }
.geo-text-action { color:rgba(255,255,255,.76);font-size:9px;font-weight:800;letter-spacing:.45px;text-transform:uppercase; }
.geo-text-action:hover { color:#86fff3;text-decoration:underline;text-underline-offset:4px; }
.geo-feature-note { display:flex;gap:10px;margin-top:clamp(21px,4vh,36px);color:rgba(255,255,255,.69);font-size:7px;font-weight:750;letter-spacing:.5px;text-transform:uppercase; }
.geo-feature-note i { width:3px;height:3px;background:#76fff1;border-radius:50%; }
.geo-landing-art { opacity:1; }
.geo-landing-art::before {
    top:9%;
    right:2%;
    width:52vw;
    height:78vh;
    background:
        linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),
        linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);
    background-size:34px 34px;
    border-radius:50%;
    content:"";
    opacity:.44;
    -webkit-mask-image:radial-gradient(circle,black 0 48%,transparent 72%);
    mask-image:radial-gradient(circle,black 0 48%,transparent 72%);
    transform:none;
}
.geo-tech-grid {
    position:absolute;
    top:8%;
    right:-11%;
    width:54vw;
    height:84vh;
    background:radial-gradient(circle at center,rgba(80,255,230,.14),rgba(68,125,229,.07) 42%,transparent 70%);
    border:1px solid rgba(255,255,255,.08);
    border-radius:50%;
}
.geo-system-visual {
    position:absolute;
    top:50%;
    right:clamp(34px,5vw,78px);
    width:min(43vw,560px);
    height:min(43vw,560px);
    transform:translateY(-47%);
}
.geo-system-orbit { position:absolute;border:1px solid rgba(255,255,255,.25);border-radius:50%; }
.geo-system-orbit::before,.geo-system-orbit::after { position:absolute;width:8px;height:8px;background:#79fff0;border:3px solid rgba(255,255,255,.28);border-radius:50%;box-shadow:0 0 18px rgba(85,255,235,.7);content:""; }
.geo-system-orbit.orbit-one { inset:9%; }
.geo-system-orbit.orbit-one::before { top:11%;left:13%; }
.geo-system-orbit.orbit-one::after { right:9%;bottom:19%; }
.geo-system-orbit.orbit-two { inset:23%;border-color:rgba(255,255,255,.17);border-style:dashed;transform:rotate(27deg); }
.geo-system-orbit.orbit-two::before { top:3%;left:46%; }
.geo-system-orbit.orbit-two::after { right:5%;bottom:27%; }
.geo-core-card {
    position:absolute;
    z-index:5;
    top:50%;
    left:50%;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    width:178px;
    height:178px;
    color:#fff;
    background:linear-gradient(145deg,rgba(255,255,255,.25),rgba(255,255,255,.1));
    border:1px solid rgba(255,255,255,.38);
    border-radius:38px;
    box-shadow:0 25px 70px rgba(29,52,145,.28),inset 0 1px 0 rgba(255,255,255,.25);
    backdrop-filter:blur(16px);
    transform:translate(-50%,-50%) rotate(-5deg);
}
.geo-core-card::before { position:absolute;inset:10px;border:1px solid rgba(128,255,241,.22);border-radius:30px;content:""; }
.geo-core-icon { display:grid;width:51px;height:51px;place-items:center;margin-bottom:11px;color:#fff;background:linear-gradient(145deg,#3ff3dc,#0a9bc6);border-radius:15px;box-shadow:0 10px 23px rgba(13,109,183,.25);font-size:24px; }
.geo-core-card strong { font-size:12px;letter-spacing:2px; }
.geo-core-card small { margin-top:4px;color:rgba(255,255,255,.69);font-size:7px;letter-spacing:1.7px; }
.geo-system-connection { position:absolute;z-index:2;top:50%;left:50%;width:31%;height:1px;background:linear-gradient(90deg,rgba(121,255,240,.72),rgba(255,255,255,.12));transform-origin:left center; }
.connection-one { transform:rotate(-144deg); }.connection-two { transform:rotate(-36deg); }.connection-three { transform:rotate(144deg); }.connection-four { transform:rotate(36deg); }
.geo-flow-node {
    position:absolute;
    z-index:4;
    display:flex;
    align-items:center;
    gap:10px;
    min-width:132px;
    padding:10px 13px;
    color:#fff;
    background:linear-gradient(115deg,rgba(255,255,255,.2),rgba(255,255,255,.08));
    border:1px solid rgba(255,255,255,.28);
    border-radius:14px;
    box-shadow:0 13px 28px rgba(30,51,142,.16);
    backdrop-filter:blur(12px);
    font-size:9px;
    font-weight:750;
}
.geo-flow-node b { display:grid;width:28px;height:28px;place-items:center;color:#fff;background:rgba(62,237,216,.25);border:1px solid rgba(133,255,241,.3);border-radius:9px;font-size:8px; }
.node-incoming { top:14%;left:0; }.node-agenda { top:13%;right:0; }.node-distribution { bottom:14%;left:1%; }.node-archive { right:0;bottom:13%; }
.geo-decor-dot { position:absolute;border:1px solid rgba(255,255,255,.34);border-radius:50%;box-shadow:inset 0 0 0 6px rgba(255,255,255,.05); }
.dot-one { top:15%;right:44%;width:18px;height:18px; }.dot-two { right:3%;bottom:14%;width:25px;height:25px; }.dot-three { bottom:8%;left:46%;width:11px;height:11px;background:#70ffef;border:0;box-shadow:0 0 20px rgba(112,255,239,.65); }
@media (max-width: 1080px) {
    .geo-landing-copy { width:48vw; }
    .geo-system-visual { right:20px;width:47vw;height:47vw; }
    .geo-flow-node { min-width:116px;padding:8px 10px; }
}
@media (max-width: 760px) {
    .geo-landing-main { align-items:flex-start;padding:clamp(50px,9vh,78px) 22px 20px; }
    .geo-landing-copy { width:100%;max-width:560px;margin:0; }
    .geo-landing-copy h1 { font-size:clamp(47px,14vw,69px); }
    .geo-landing-copy h1 span { letter-spacing:-2px; }
    .geo-landing-copy h1 strong { margin-top:8px;padding:0;letter-spacing:-2px; }
    .geo-landing-copy h2 { margin-top:15px; }
    .geo-landing-description { max-width:92%; }
    .geo-feature-note span:nth-of-type(3),.geo-feature-note i:last-of-type { display:none; }
    .geo-system-visual { top:78%;right:-35%;width:86vw;height:86vw;opacity:.23; }
    .geo-tech-grid { top:43%;right:-54%;width:110vw;height:75vh;opacity:.45; }
    .geo-decor-dot { opacity:.5; }
}
@media (max-height: 650px) and (min-width: 761px) {
    .geo-landing-main { padding-top:0; }
    .geo-landing-copy h1 { font-size:clamp(50px,10vh,70px); }
    .geo-landing-kicker { margin-bottom:12px; }
    .geo-landing-copy h2 { margin-top:12px; }
    .geo-landing-description { margin-top:9px;line-height:1.5; }
    .geo-landing-actions { margin-top:17px; }
    .geo-feature-note { margin-top:17px; }
}

/* Login landing ditampilkan sebagai popup tanpa meninggalkan halaman utama. */
.geo-nav-login-trigger {
    position:relative;
    padding:8px 0;
    color:rgba(255,255,255,.78);
    background:none;
    border:0;
    cursor:pointer;
    font:inherit;
    font-size:clamp(8px,.72vw,10px);
    font-weight:500;
    letter-spacing:.12px;
    text-shadow:0 1px 8px rgba(31,38,130,.18);
}
.geo-nav-login-trigger::after { position:absolute;right:50%;bottom:2px;left:50%;height:1px;background:rgba(255,255,255,.9);border-radius:10px;content:"";transition:right .18s ease,left .18s ease; }
.geo-nav-login-trigger:hover { color:#fff; }
.geo-nav-login-trigger:hover::after,.geo-nav-login-trigger:focus-visible::after { right:0;left:0; }
.geo-primary-action[type="button"] { cursor:pointer;font-family:inherit; }
.landing-modal-open { overflow:hidden; }
.landing-login-modal[hidden] { display:none; }
.landing-login-modal {
    position:fixed;
    z-index:150;
    inset:0;
    display:grid;
    place-items:center;
    padding:22px;
    opacity:0;
    transition:opacity .18s ease;
}
.landing-login-modal.open { opacity:1; }
.landing-login-backdrop { position:absolute;inset:0;background:rgba(24,27,92,.62);border:0;backdrop-filter:blur(11px);cursor:pointer; }
.landing-login-dialog {
    position:relative;
    z-index:1;
    width:min(430px,100%);
    max-height:calc(100dvh - 44px);
    overflow:hidden auto;
    background:rgba(255,255,255,.98);
    border:1px solid rgba(255,255,255,.62);
    border-radius:23px;
    box-shadow:0 30px 80px rgba(24,29,102,.34);
    opacity:0;
    transform:translateY(18px) scale(.97);
    transition:opacity .18s ease,transform .18s ease;
}
.landing-login-modal.open .landing-login-dialog { opacity:1;transform:translateY(0) scale(1); }
.landing-login-close {
    position:absolute;
    z-index:3;
    top:15px;
    right:15px;
    display:grid;
    width:34px;
    height:34px;
    place-items:center;
    color:rgba(255,255,255,.88);
    background:rgba(255,255,255,.13);
    border:1px solid rgba(255,255,255,.25);
    border-radius:11px;
    cursor:pointer;
    font-size:20px;
    line-height:1;
}
.landing-login-close:hover { color:#fff;background:rgba(255,255,255,.22); }
.landing-login-header {
    position:relative;
    display:flex;
    align-items:center;
    gap:15px;
    padding:25px 58px 23px 25px;
    color:#fff;
    background:linear-gradient(120deg,#a446ed 0%,#5267e9 52%,#09adad 100%);
    overflow:hidden;
}
.landing-login-header::after { position:absolute;right:-55px;bottom:-88px;width:185px;height:185px;border:25px solid rgba(255,255,255,.09);border-radius:50%;content:""; }
.landing-login-mark { position:relative;z-index:1;display:grid;flex:0 0 auto;width:49px;height:49px;place-items:center;background:linear-gradient(145deg,#46f2dc,#079ac2);border:1px solid rgba(255,255,255,.35);border-radius:15px;box-shadow:0 11px 24px rgba(28,54,152,.2); }
.landing-login-mark::before { position:absolute;top:11px;left:50%;width:11px;height:11px;background:#fff;border-radius:50%;content:"";transform:translateX(-50%); }
.landing-login-mark::after { position:absolute;bottom:9px;left:50%;width:25px;height:14px;background:#fff;border-radius:14px 14px 7px 7px;content:"";transform:translateX(-50%); }
.landing-login-header > div { position:relative;z-index:1;min-width:0; }
.landing-login-header small,.landing-login-header strong,.landing-login-header p { display:block; }
.landing-login-header small { margin-bottom:4px;color:#8dfff2;font-size:7px;font-weight:850;letter-spacing:1.25px; }
.landing-login-header strong { font-size:19px;letter-spacing:-.2px; }
.landing-login-header p { margin:4px 0 0;color:rgba(255,255,255,.76);font-size:8px;line-height:1.45; }
.landing-login-body { padding:23px 25px 24px; }
.landing-login-alert { margin-bottom:15px;padding:10px 12px;border:1px solid;border-radius:10px;font-size:8.5px;font-weight:700;line-height:1.45; }
.landing-login-alert.danger { color:#a13b61;background:#fff0f5;border-color:#f0bfd1; }
.landing-login-alert.success { color:#08766b;background:#e9faf7;border-color:#b8e8e0; }
.admin-takeover-dialog { width:min(470px,100%); }.admin-takeover-mark { display:grid;place-items:center;color:#fff;background:linear-gradient(145deg,#006caf,#00a6aa);font-style:normal;font-weight:900; }.admin-takeover-device { display:grid;gap:3px;margin-bottom:15px;padding:12px 14px;background:#f2f8fa;border:1px solid #cfe2e7;border-radius:11px; }.admin-takeover-device strong { color:#174466;font-size:10px; }.admin-takeover-device span { color:#41667d;font-size:8.5px;font-weight:750; }.admin-takeover-device small { color:#7b919f;font-size:7.5px; }.admin-takeover-submit { background:linear-gradient(135deg,#006caf,#00a6aa); }
.landing-login-form { display:grid;gap:15px; }
.landing-login-form .form-group { margin:0; }
.landing-login-form label { display:block;margin-bottom:6px;color:#59647b;font-size:8.5px;font-weight:800; }
.landing-login-form input {
    width:100%;
    min-height:48px;
    padding:0 14px;
    color:#354157;
    background:#fff;
    border:1px solid #dce2eb;
    border-radius:11px;
    outline:none;
    font:inherit;
    font-size:10px;
    transition:border-color .16s ease,box-shadow .16s ease;
}
.landing-login-form input:focus { border-color:#6770df;box-shadow:0 0 0 3px rgba(93,100,218,.12); }
.landing-password-field { position:relative; }
.landing-password-field input { padding-right:76px; }
.landing-password-field button { position:absolute;top:50%;right:8px;padding:7px 9px;color:#5d62c9;background:#f0f2fb;border:0;border-radius:8px;cursor:pointer;font-size:7.5px;font-weight:800;transform:translateY(-50%); }
.landing-password-field button:hover { color:#fff;background:#6b67db; }
.landing-login-submit {
    display:flex;
    align-items:center;
    justify-content:center;
    gap:10px;
    min-height:48px;
    margin-top:3px;
    color:#fff;
    background:linear-gradient(92deg,#13c8b7 0%,#167fc8 52%,#9d48df 100%);
    border:0;
    border-radius:11px;
    box-shadow:0 12px 24px rgba(70,70,184,.2);
    cursor:pointer;
    font-size:9px;
    font-weight:850;
    letter-spacing:.25px;
    text-transform:uppercase;
}
.landing-login-submit:hover { background:linear-gradient(92deg,#0eb5a7,#126fb8 52%,#8b3dcc);box-shadow:0 15px 28px rgba(70,70,184,.28);transform:translateY(-1px); }
.landing-login-submit span { font-size:14px; }
.landing-login-help { margin:16px 0 0;color:#98a2b1;font-size:7.5px;text-align:center; }
@media (max-width: 520px) {
    .landing-login-modal { align-items:end;padding:0; }
    .landing-login-dialog { width:100%;max-height:92dvh;border-radius:22px 22px 0 0; }
    .landing-login-header { padding-left:20px; }
    .landing-login-body { padding:20px; }
}
@media (prefers-reduced-motion: reduce) {
    .landing-login-modal,.landing-login-dialog { transition:none; }
}

/* Tema internal mengikuti palet landing: ungu, biru, dan tosca. */
:root {
    --navy:#303853;
    --blue:#5b63df;
    --blue-dark:#484fc4;
    --cyan:#20c5cf;
    --green:#0eb6a5;
    --soft:#f1f3f9;
    --line:#e4e7f1;
    --shadow:0 5px 16px rgba(58,55,133,.1);
    --brand-purple:#a447e8;
    --brand-indigo:#5d63df;
    --brand-blue:#2774dc;
    --brand-teal:#09b5a8;
    --brand-gradient:linear-gradient(118deg,#a447e8 0%,#5d63df 46%,#2774dc 70%,#09b5a8 100%);
}
body { background:#eef1f7; }
.content-shell { background:linear-gradient(145deg,#f5f6fb 0%,#eef2f7 100%); }
.sidebar {
    color:#fff;
    background:linear-gradient(165deg,#a246e7 0%,#6a5fe0 29%,#3370d5 61%,#08aaad 100%);
    box-shadow:8px 0 28px rgba(60,55,147,.2);
}
.sidebar::before { position:absolute;top:-115px;left:-105px;width:290px;height:290px;border:38px solid rgba(92,255,235,.12);border-radius:50%;content:"";pointer-events:none; }
.brand { position:relative;z-index:2; }
.brand-mark { color:#fff;background:linear-gradient(145deg,#44efd9,#1888d1);border:1px solid rgba(255,255,255,.22);box-shadow:0 8px 20px rgba(49,39,146,.22); }
.brand strong { color:#fff; }.brand small { color:rgba(255,255,255,.68); }
.nav-label { color:rgba(255,255,255,.6); }
.nav-link { position:relative;z-index:2;color:rgba(255,255,255,.76); }
.nav-link:hover { color:#fff;background:rgba(255,255,255,.1); }
.nav-link.active,.nav-parent.active { color:#fff;background:linear-gradient(100deg,rgba(255,255,255,.2),rgba(255,255,255,.1));box-shadow:inset 0 0 0 1px rgba(255,255,255,.08),0 9px 20px rgba(50,41,144,.12); }
.nav-link.active::after { background:#79fff0;box-shadow:0 0 0 4px rgba(121,255,240,.12); }
.nav-icon,.nav-link.active .nav-icon { color:rgba(255,255,255,.9); }
.nav-submenu { border-left-color:rgba(255,255,255,.18); }
.nav-sublink { color:rgba(255,255,255,.64); }
.nav-sublink:hover,.nav-sublink.active { color:#fff;background:rgba(255,255,255,.11); }
.nav-link-muted,.nav-link-muted:hover { color:rgba(255,255,255,.72); }
.nav-status-dot { background:#70ffdf;box-shadow:0 0 0 4px rgba(112,255,223,.16),0 0 13px rgba(112,255,223,.65); }
.sidebar-pattern { color:rgba(255,255,255,.06); }
.sidebar-account { background:linear-gradient(110deg,rgba(71,48,164,.3),rgba(12,143,170,.22));border-color:rgba(255,255,255,.17);box-shadow:0 12px 27px rgba(41,35,121,.14); }
.sidebar-account-avatar { color:#6758d8;background:linear-gradient(145deg,#fff,#e5fffb); }
.sidebar-account button { background:rgba(255,255,255,.15); }.sidebar-account button:hover { background:rgba(255,255,255,.26); }
.topbar { background:rgba(255,255,255,.94);border-bottom-color:#e7e8f1;box-shadow:0 4px 16px rgba(56,54,122,.045); }
.topbar::after { position:absolute;right:0;bottom:-1px;left:0;height:2px;background:linear-gradient(90deg,rgba(164,71,232,.72),rgba(39,116,220,.5),rgba(9,181,168,.68));content:"";opacity:.36; }
.topbar-title span { color:#a5a5bd; }.topbar-title strong { color:#303853; }
.menu-toggle,.topbar-icon,.date-pill { color:#5e62d4;background:#fff;border-color:#e1e3ef;box-shadow:0 4px 12px rgba(70,65,145,.07); }
.menu-toggle:hover,.topbar-icon:hover { color:#fff;background:var(--brand-gradient);border-color:transparent; }
.date-pill { color:#4f62c9; }
.footer { background:rgba(255,255,255,.78);border-top-color:#e3e5ef; }
.panel,.reference-panel,.profile-summary-card,.company-summary-card,.reference-data-section,.ring-stat-card,.mini-analytics-card,.filter-panel,.register-panel,.form-section,.single-detail {
    border-color:#e2e4ef;
    box-shadow:0 5px 16px rgba(58,55,133,.1);
}
.profile-summary-card,.company-summary-card,.reference-panel,.reference-data-section { background:linear-gradient(145deg,#fff 0%,#fdfdff 100%); }
.profile-avatar { background:linear-gradient(145deg,#a547e7 0%,#4c66df 50%,#0ab5a8 100%);box-shadow:0 10px 24px rgba(79,78,190,.22); }
.profile-summary-meta { border-top-color:#e8e8f2; }
.eyebrow,.page-heading .eyebrow,.record-link,.text-link,.back-link { color:#625edb; }
.btn-primary {
    color:#fff;
    background:var(--brand-gradient);
    border-color:transparent;
    box-shadow:0 7px 17px rgba(80,72,190,.23);
}
.btn-primary:hover { color:#fff;background:linear-gradient(118deg,#923bd3,#5055cd 49%,#078f99);box-shadow:0 10px 22px rgba(80,72,190,.3);transform:translateY(-1px); }
.btn-secondary { color:#565f7c;background:#fff;border-color:#dbdeeb; }
.btn-secondary:hover { color:#5d5bd0;background:#f4f2ff;border-color:#c8c5ea; }
.btn-ghost { color:#6d718b; }.btn-ghost:hover { color:#5c59ca;background:#f1effd; }
.company-summary-card header button,.main-graph-card header a,.reference-section-header > a,.distribution-action-button {
    color:#fff;
    background:linear-gradient(105deg,#7659df,#2874d7 55%,#09b2a7);
    border-color:transparent;
    box-shadow:0 6px 15px rgba(72,78,186,.18);
}
.company-summary-card header button:hover,.main-graph-card header a:hover,.reference-section-header > a:hover,.distribution-action-button:hover { color:#fff;background:linear-gradient(105deg,#694dd1,#2267c7 55%,#079c94);transform:translateY(-1px); }
.company-metric.orange { background:linear-gradient(135deg,#ae4be4,#8159e5); }
.company-metric.navy { background:linear-gradient(135deg,#5555cb,#3868db); }
.company-metric.blue { background:linear-gradient(135deg,#2377d8,#09b4ae); }
.reference-chart-line { stroke:#7463df; }
.reference-chart-point { fill:#43dfcb;stroke:#4c55c5; }
.reference-legend .orange,.reference-donut-legend .orange { background:#a548e5; }
.reference-legend .green,.reference-donut-legend .green { background:#0ab6a7; }
.reference-legend .blue,.reference-donut-legend .blue { background:#2875df; }
.reference-search { color:#6e6f8b;background:#f0f0f8; }
.orange-ring { --ring-color:#9d4fe0; }.green-ring { --ring-color:#0bb5a5; }
.ring-stat-card small { color:#0ca38f; }
.mini-analytics-card polyline { stroke:#5c61d9; }
.reference-recent-table header a { color:#5b5ed1; }
thead { background:linear-gradient(90deg,#f6f4fd,#f2f7fb); }
tbody tr:hover { background:#faf9ff; }
.icon-btn:hover { color:#5d5cd1;border-color:#c7c5ec;background:#f3f1fe; }
.pagination li.active a { color:#fff;background:linear-gradient(145deg,#8555df,#4e63d9 55%,#0aaea4);border-color:transparent;box-shadow:0 5px 12px rgba(79,74,184,.2); }
input:focus,select:focus,textarea:focus { border-color:#7771df;box-shadow:0 0 0 3px rgba(104,99,217,.12); }
.input-with-icon span { color:#675fd5; }
.section-number,.modal-section-heading > span { color:#625ad1;background:linear-gradient(145deg,#f0ebff,#e4f7f6); }
.modal-title-icon,.distribution-title-icon { background:linear-gradient(145deg,#a548e5,#4d65d9 55%,#0aafa6); }
.modal-close:hover { color:#625bd2;background:#f0edfd; }
.progress-document-tabs { background:linear-gradient(100deg,#f0edfb,#eef6f7);border-color:#e0dfeb; }
.progress-document-tab:hover { color:#625bd0; }
.progress-document-tab.active { border-color:#c9c5eb;box-shadow:0 5px 14px rgba(74,65,157,.1); }
.progress-document-tab.active > span { background:linear-gradient(145deg,#9750df,#5164da 55%,#0baba4); }
.progress-document-tab.active strong { color:#5b58c7; }
.btn-agendaris-sync,.btn-shift-handover { color:#5e5bc7;background:#f1effd;border-color:#cbc7eb; }
.btn-agendaris-sync:hover,.btn-shift-handover:hover { color:#fff;background:linear-gradient(120deg,#8f50d9,#4e62d3 55%,#0aa69e);border-color:transparent; }
.btn-agenda-generate { color:#fff;background:var(--brand-gradient);border-color:transparent;box-shadow:0 7px 17px rgba(80,72,190,.23); }
.btn-agenda-generate:hover { background:linear-gradient(118deg,#923bd3,#5055cd 49%,#078f99);border-color:transparent;box-shadow:0 10px 22px rgba(80,72,190,.28); }
.btn-agenda-generate:focus-visible { outline-color:rgba(100,91,211,.3); }
.btn-agenda-generate:disabled { color:#77749f;background:linear-gradient(118deg,#eeeafd,#e8effb 58%,#e1f7f3);border-color:#d4d0ea;box-shadow:none;opacity:1; }
.btn-agenda-generate[data-can-cancel="true"] { color:#625bd1;background:#f1effd;border-color:#c9c4ee;box-shadow:none;cursor:pointer; }
.btn-agenda-generate[data-can-cancel="true"]:hover { color:#5149c1;background:#e9e5fb;border-color:#b8b1e6;box-shadow:0 6px 14px rgba(87,78,180,.12);transform:translateY(-1px); }
.agendaris-modal-body[data-agendaris-step="3"] { scrollbar-color:#8178dc #f0eff9; }
.agendaris-modal-body[data-agendaris-step="3"]::-webkit-scrollbar-track { background:#f0eff9; }
.agendaris-modal-body[data-agendaris-step="3"]::-webkit-scrollbar-thumb { background:linear-gradient(#8a62df,#536bd9 55%,#13ada4); }
.disposition-stage-marker span { background:linear-gradient(145deg,#8b5ddf,#5467d9 58%,#13aaa4);border-color:#eeeafd;box-shadow:0 4px 10px rgba(85,76,181,.16);transition:transform .18s ease,box-shadow .18s ease; }
.disposition-stage-marker i { background:linear-gradient(#a9a3e7,#d9e8ed); }
.disposition-stage-panel { border-color:#e0deec;box-shadow:0 3px 10px rgba(63,59,133,.045);transition:border-color .18s ease,box-shadow .18s ease,transform .18s ease; }
.disposition-stage-panel > header { background:linear-gradient(105deg,#f2effd,#f2f9fa);border-bottom-color:#e5e3ef; }
.disposition-form-stage:hover .disposition-stage-panel { border-color:#cec9e9;box-shadow:0 7px 17px rgba(71,65,151,.09);transform:translateY(-1px); }
.disposition-form-stage:hover .disposition-stage-marker span { box-shadow:0 7px 15px rgba(85,76,181,.22);transform:scale(1.04); }
.disposition-stage-panel:focus-within { border-color:#aaa3df;box-shadow:0 0 0 3px rgba(105,96,207,.09),0 8px 18px rgba(71,65,151,.08); }
.disposition-stage-state { color:#77758e;background:#f2f2f7;border-color:#dedee8; }
.disposition-stage-state.filled { color:#5a54c5;background:#efedfb;border-color:#cdc8ec; }
.agendaris-form-modal .outgoing-distribution-steps {
    box-sizing:border-box;
    flex:0 0 auto;
    min-height:60px;
    padding:11px 18px 10px;
    overflow-x:auto;
    overflow-y:hidden;
    scroll-padding-inline:18px;
    overscroll-behavior-inline:contain;
}
.agendaris-form-modal .outgoing-distribution-steps span { min-height:38px;padding:3px 0;white-space:nowrap; }
.agendaris-form-modal .outgoing-distribution-steps b { flex:0 0 25px; }
.agendaris-form-modal .outgoing-distribution-steps i { align-self:center;min-width:22px; }
@media (max-width:600px) {
    .agendaris-form-modal .outgoing-distribution-steps { min-height:58px;padding-inline:14px;scroll-padding-inline:14px; }
}
.agendaris-table-panel { border-top-color:#6a5fda; }
.distribution-table-panel { border-top-color:#7560dc; }.distribution-outgoing-panel { border-top-color:#1b92bd; }
.success-toast { color:#425e8b;background:linear-gradient(105deg,#f5f0ff,#ebfaf7);border-color:#ccc7eb;box-shadow:0 12px 30px rgba(66,61,149,.2); }
.success-toast-icon { background:linear-gradient(145deg,#7a58dc,#0db09f); }
.pks-wizard-steps > button.active > span { background:linear-gradient(145deg,#9a4fe2,#5164da 55%,#0bada4);box-shadow:0 5px 12px rgba(79,72,184,.22); }
.pks-wizard-steps > button.active strong { color:#5e5acb; }
.pks-wizard-steps > button.complete > span { color:#514fc2;background:linear-gradient(145deg,#eee9ff,#ddf7f3); }
.pks-review-note > span { background:linear-gradient(145deg,#8256dd,#0baca2); }
.pks-popup-loading span { border-color:#dddaf0;border-top-color:#635ed4; }
.outgoing-distribution-steps span.active b { background:linear-gradient(145deg,#8c51db,#5264d8 55%,#0bada4); }
.outgoing-distribution-steps span.active,.pickup-field label { color:#5c58c7; }
.pickup-field { background:linear-gradient(110deg,#f4efff,#eefafa);border-color:#d7d1ee; }
.pickup-field input { border-color:#aaa4df; }
.btn:focus-visible,.icon-btn:focus-visible,.menu-toggle:focus-visible,.topbar-icon:focus-visible,.nav-link:focus-visible,.nav-sublink:focus-visible,.distribution-action-button:focus-visible {
    outline:3px solid rgba(111,98,220,.28);
    outline-offset:2px;
}

/* Landing page tanpa latar berwarna; ornamen dipertahankan dengan kontras lembut. */
.geo-landing-page { background:#fff; }
.geo-landing-page::before,.geo-landing-copy::before { background:none; }
.geo-brand-logo img { filter:none;opacity:1; }
.geo-landing-nav a,.geo-nav-login-trigger { color:#657189;text-shadow:none; }
.geo-landing-nav a::after,.geo-nav-login-trigger::after { background:#278f99; }
.geo-landing-nav a:hover,.geo-landing-nav a.active,.geo-nav-login-trigger:hover { color:#24364d; }
.geo-landing-kicker { color:#168f91; }
.geo-landing-kicker::before { background:#37aaa6; }
.geo-landing-copy h1,.geo-landing-copy h1 span { color:#2e3c56; }
.geo-landing-copy h1 strong { color:#268b94; }
.geo-landing-copy h2 { color:#34435c; }
.geo-landing-description { color:#68768c;text-shadow:none; }
.geo-text-action { color:#4e6e9e; }
.geo-text-action:hover { color:#247f88; }
.geo-feature-note { color:#778398;text-shadow:none; }
.geo-feature-note i { background:#45aaa5; }
.geo-landing-art::before {
    background:
        linear-gradient(rgba(55,80,116,.055) 1px,transparent 1px),
        linear-gradient(90deg,rgba(55,80,116,.055) 1px,transparent 1px);
}
.geo-tech-grid { background:radial-gradient(circle at center,rgba(61,190,175,.12),rgba(79,119,188,.065) 42%,transparent 70%);border-color:rgba(61,86,122,.09); }
.geo-system-orbit { border-color:rgba(58,83,121,.2); }
.geo-system-orbit.orbit-two { border-color:rgba(58,83,121,.14); }
.geo-system-orbit::before,.geo-system-orbit::after { background:#49b7aa;border-color:rgba(255,255,255,.8);box-shadow:0 0 16px rgba(73,183,170,.32); }
.geo-system-connection { background:linear-gradient(90deg,rgba(42,151,151,.52),rgba(64,91,128,.1)); }
.geo-core-card { color:#32425c;background:rgba(255,255,255,.76);border-color:rgba(65,94,132,.18);box-shadow:0 25px 70px rgba(45,72,111,.14),inset 0 1px 0 #fff; }
.geo-core-card::before { border-color:rgba(51,161,154,.17); }
.geo-core-card small { color:#758198; }
.geo-flow-node { color:#34445e;background:rgba(255,255,255,.78);border-color:rgba(66,95,132,.17);box-shadow:0 13px 28px rgba(45,72,111,.1); }
.geo-flow-node b { color:#277c88;background:#e4f5f2;border-color:#c2e4df; }
.geo-decor-dot { border-color:rgba(60,87,123,.25);box-shadow:inset 0 0 0 6px rgba(71,100,137,.045); }
.dot-three { background:#4bb4a7;box-shadow:0 0 17px rgba(75,180,167,.34); }

/* Tema terpadu landing, login, dan dashboard: putih dengan aksen biru-teal lembut. */
:root {
    --navy:#314158;
    --blue:#3f7f9f;
    --blue-dark:#336d89;
    --cyan:#58a9ac;
    --green:#43998f;
    --soft:#f3f6f8;
    --line:#e0e7eb;
    --shadow:0 5px 16px rgba(42,65,84,.08);
    --brand-purple:#71849e;
    --brand-indigo:#557a9d;
    --brand-blue:#3f7f9f;
    --brand-teal:#43998f;
    --brand-gradient:linear-gradient(115deg,#527b9b 0%,#3f8798 55%,#489b91 100%);
}
body { color:#34445b;background:#eef3f5; }
.content-shell { background:linear-gradient(145deg,#f7f9fa,#f1f5f7); }
.sidebar { color:#34445b;background:#fff;border-right:1px solid #e1e8eb;box-shadow:7px 0 24px rgba(42,65,84,.08); }
.sidebar::before { border-color:rgba(70,157,150,.07); }
.brand-mark { color:#fff;background:linear-gradient(145deg,#5196a8,#489b91);border-color:rgba(67,132,145,.12);box-shadow:0 8px 19px rgba(54,111,126,.17); }
.brand strong { color:#314158; }.brand small { color:#8995a5; }
.nav-label { color:#9aa6b2; }
.nav-link { color:#66758a; }
.nav-link:hover { color:#316f7a;background:#f1f7f7; }
.nav-link.active,.nav-parent.active { color:#2f7078;background:#eaf4f4;box-shadow:inset 0 0 0 1px #d9e9e8; }
.nav-link.active::after { background:#459c92;box-shadow:0 0 0 4px rgba(69,156,146,.11); }
.nav-icon,.nav-link.active .nav-icon { color:#4e8190; }
.nav-submenu { border-left-color:#dfe8eb; }
.nav-sublink { color:#798798; }
.nav-sublink:hover,.nav-sublink.active { color:#326f78;background:#eef6f5; }
.nav-link-muted,.nav-link-muted:hover { color:#718196; }
.nav-status-dot { background:#55a996;box-shadow:0 0 0 4px rgba(85,169,150,.12); }
.sidebar-pattern { color:rgba(55,92,112,.035); }
.sidebar-account { color:#34445b;background:#f4f7f8;border-color:#dfe7ea;box-shadow:none; }
.sidebar-account-avatar { color:#317d83;background:#e3f3f1; }
.sidebar-account small { color:#8b98a7; }
.sidebar-account button { color:#3d7c88;background:#e8f1f2; }
.sidebar-account button:hover { color:#fff;background:#4b8e95; }
.topbar { background:rgba(255,255,255,.96);border-bottom-color:#e1e8eb;box-shadow:0 4px 15px rgba(42,65,84,.045); }
.topbar::after { background:linear-gradient(90deg,transparent,#80aaa9 30%,#568da0 70%,transparent);opacity:.26; }
.topbar-title span { color:#a0aab4; }.topbar-title strong { color:#314158; }
.menu-toggle,.topbar-icon,.date-pill { color:#477e8d;background:#fff;border-color:#dce5e9;box-shadow:0 4px 11px rgba(42,65,84,.06); }
.menu-toggle:hover,.topbar-icon:hover { color:#fff;background:var(--brand-gradient);border-color:transparent; }
.date-pill { color:#47768a; }
.footer { background:rgba(255,255,255,.82);border-top-color:#dfe7ea; }
.panel,.reference-panel,.profile-summary-card,.company-summary-card,.reference-data-section,.ring-stat-card,.mini-analytics-card,.filter-panel,.register-panel,.form-section,.single-detail { border-color:#dfe7ea;box-shadow:0 5px 16px rgba(42,65,84,.075); }
.profile-summary-card,.company-summary-card,.reference-panel,.reference-data-section { background:#fff; }
.profile-avatar { background:linear-gradient(145deg,#548ca6,#499d92);box-shadow:0 9px 22px rgba(57,120,130,.17); }
.profile-summary-meta { border-top-color:#e7edef; }
.eyebrow,.page-heading .eyebrow,.record-link,.text-link,.back-link { color:#3a838a; }
.btn-primary { color:#fff;background:var(--brand-gradient);border-color:transparent;box-shadow:0 6px 15px rgba(52,117,126,.18); }
.btn-primary:hover { color:#fff;background:linear-gradient(115deg,#456f90,#347988 55%,#388a81);box-shadow:0 9px 20px rgba(52,117,126,.23); }
.btn-secondary { color:#536679;background:#fff;border-color:#d8e2e6; }
.btn-secondary:hover { color:#337780;background:#eef6f5;border-color:#bad8d5; }
.btn-ghost { color:#6f7d8e; }.btn-ghost:hover { color:#337780;background:#edf5f5; }
.company-summary-card header button,.main-graph-card header a,.reference-section-header > a,.distribution-action-button { color:#fff;background:var(--brand-gradient);border-color:transparent;box-shadow:0 5px 13px rgba(52,117,126,.15); }
.company-summary-card header button:hover,.main-graph-card header a:hover,.reference-section-header > a:hover,.distribution-action-button:hover { color:#fff;background:linear-gradient(115deg,#456f90,#347988 55%,#388a81); }
.company-metric { color:#34455d;border:1px solid #dce7ea;box-shadow:none; }
.company-metric span { color:#78879a; }
.company-metric.orange { background:#f0f5f7;border-color:#dbe6ea; }.company-metric.orange strong { color:#547a91; }
.company-metric.navy { background:#eef4f7;border-color:#d8e4e9; }.company-metric.navy strong { color:#3f7895; }
.company-metric.blue { background:#edf7f5;border-color:#d2e7e3; }.company-metric.blue strong { color:#3e9187; }
.reference-chart-line { stroke:#46889c; }.reference-chart-point { fill:#55a99c;stroke:#376a7c; }
.reference-legend .orange,.reference-donut-legend .orange { background:#3f7f9f; }
.reference-legend .green,.reference-donut-legend .green { background:#43a398; }
.reference-legend .blue,.reference-donut-legend .blue { background:#91a4b5; }
.orange-ring { --ring-color:#4d879e; }.green-ring { --ring-color:#4a9e91; }
.ring-stat-card small { color:#438e84; }.mini-analytics-card polyline { stroke:#4c8e9b; }
.reference-search { color:#6f7d8c;background:#f0f4f6; }
.reference-recent-table header a { color:#3c8088; }
thead { background:#f4f7f8; }
tbody tr:hover { background:#f8fbfb; }
.icon-btn:hover { color:#337c83;border-color:#bcd8d7;background:#eef7f6; }
.pagination li.active a { color:#fff;background:var(--brand-gradient);border-color:transparent;box-shadow:0 4px 11px rgba(52,117,126,.17); }
input:focus,select:focus,textarea:focus { border-color:#65a6a5;box-shadow:0 0 0 3px rgba(76,153,150,.1); }
.input-with-icon span { color:#3d858b; }
.section-number,.modal-section-heading > span { color:#3d858b;background:#e8f4f2; }
.modal-title-icon,.distribution-title-icon { background:linear-gradient(145deg,#548ca6,#499d92); }
.modal-close:hover { color:#337c83;background:#edf6f5; }
.progress-document-tabs { background:#eef3f5;border-color:#dfe7ea; }
.progress-document-tab:hover { color:#337c83; }.progress-document-tab.active { border-color:#bedbd8;box-shadow:0 4px 12px rgba(48,105,112,.08); }
.progress-document-tab.active > span { background:linear-gradient(145deg,#548ca6,#499d92); }.progress-document-tab.active strong { color:#337780; }
.btn-agendaris-sync,.btn-shift-handover,.btn-agenda-generate[data-can-cancel="true"] { color:#337780;background:#edf6f5;border-color:#bad8d5;box-shadow:none; }
.btn-agendaris-sync:hover,.btn-shift-handover:hover,.btn-agenda-generate[data-can-cancel="true"]:hover { color:#28666e;background:#e1efee;border-color:#a5ccca;box-shadow:0 5px 12px rgba(52,117,126,.1); }
.btn-agenda-generate { color:#fff;background:var(--brand-gradient);border-color:transparent;box-shadow:0 6px 15px rgba(52,117,126,.18); }
.btn-agenda-generate:hover { background:linear-gradient(115deg,#456f90,#347988 55%,#388a81); }
.agendaris-table-panel,.distribution-table-panel { border-top-color:#4b8f95; }.distribution-outgoing-panel { border-top-color:#4e839d; }
.success-toast { color:#416b6d;background:#eff8f6;border-color:#bddbd6;box-shadow:0 11px 27px rgba(42,85,88,.14); }.success-toast-icon { background:linear-gradient(145deg,#548ca6,#499d92); }
.disposition-stage-marker span { background:linear-gradient(145deg,#548ca6,#499d92);border-color:#e8f3f2;box-shadow:0 4px 10px rgba(52,117,126,.13); }
.disposition-stage-marker i { background:linear-gradient(#9dcac5,#dce8e9); }
.disposition-stage-panel > header { background:linear-gradient(105deg,#eef6f5,#f3f7f9); }
.disposition-form-stage:hover .disposition-stage-panel { border-color:#bfd9d6;box-shadow:0 7px 16px rgba(52,101,108,.075); }
.disposition-stage-panel:focus-within { border-color:#8abbb8;box-shadow:0 0 0 3px rgba(74,151,147,.08),0 7px 17px rgba(52,101,108,.07); }
.disposition-stage-state.filled { color:#337780;background:#eaf5f3;border-color:#bfded9; }
.agendaris-modal-body[data-agendaris-step="3"] { scrollbar-color:#6aa7a2 #eef4f5; }
.agendaris-modal-body[data-agendaris-step="3"]::-webkit-scrollbar-track { background:#eef4f5; }
.agendaris-modal-body[data-agendaris-step="3"]::-webkit-scrollbar-thumb { background:linear-gradient(#5d8fa4,#55a297); }

/* Form login mengikuti tema landing yang terang. */
.landing-login-backdrop { background:rgba(35,52,68,.5); }
.landing-login-dialog { border-color:#e0e8eb;box-shadow:0 28px 75px rgba(31,51,68,.24); }
.landing-login-header { color:#314158;background:linear-gradient(120deg,#f4f8fa,#edf7f5);border-bottom:1px solid #dce8e8; }
.landing-login-header::after { border-color:rgba(70,151,150,.08); }
.landing-login-close { color:#607386;background:#fff;border-color:#d9e4e7; }
.landing-login-close:hover { color:#2f7279;background:#e8f4f2; }
.landing-login-mark { background:linear-gradient(145deg,#548ca6,#499d92);border-color:rgba(66,139,144,.18);box-shadow:0 10px 22px rgba(49,107,118,.16); }
.landing-login-header small { color:#34878a; }.landing-login-header strong { color:#314158; }.landing-login-header p { color:#7c8999; }
.landing-login-form input:focus { border-color:#69aaa7;box-shadow:0 0 0 3px rgba(74,151,147,.1); }
.landing-password-field button { color:#367a82;background:#edf5f5; }.landing-password-field button:hover { color:#fff;background:#468d91; }
.landing-login-submit,.geo-primary-action { background:var(--brand-gradient);border-color:rgba(82,153,151,.2);box-shadow:0 10px 22px rgba(52,117,126,.17); }
.landing-login-submit:hover,.geo-primary-action:hover { background:linear-gradient(115deg,#456f90,#347988 55%,#388a81);box-shadow:0 13px 25px rgba(52,117,126,.22); }

/* Penguatan warna: tetap terang, tetapi lebih segar dan tegas. */
:root {
    --blue:#2f789c;
    --blue-dark:#286985;
    --cyan:#36a8aa;
    --green:#2f9b8e;
    --brand-blue:#2f789c;
    --brand-teal:#2f9b8e;
    --brand-gradient:linear-gradient(115deg,#3f729a 0%,#25869a 52%,#2f9b8e 100%);
}
.geo-landing-kicker { color:#087f84; }.geo-landing-kicker::before { background:#209a96; }
.geo-landing-copy h1 strong { color:#187f8b; }
.geo-landing-nav a::after,.geo-nav-login-trigger::after { background:#178b91; }
.geo-primary-action,.landing-login-submit { box-shadow:0 11px 24px rgba(30,112,124,.23); }
.geo-tech-grid { background:radial-gradient(circle at center,rgba(35,177,160,.2),rgba(49,107,181,.1) 43%,transparent 71%);border-color:rgba(35,100,130,.14); }
.geo-system-orbit { border-color:rgba(38,91,127,.3); }.geo-system-orbit.orbit-two { border-color:rgba(38,91,127,.21); }
.geo-system-orbit::before,.geo-system-orbit::after { background:#23a99d;box-shadow:0 0 18px rgba(35,169,157,.48); }
.geo-system-connection { background:linear-gradient(90deg,rgba(24,144,148,.7),rgba(47,89,127,.18)); }
.geo-core-card { background:rgba(255,255,255,.93);border-color:rgba(37,104,136,.29);box-shadow:0 25px 70px rgba(35,78,112,.19),inset 0 1px 0 #fff; }
.geo-core-card::before { border-color:rgba(29,151,143,.28); }
.geo-core-icon { background:linear-gradient(145deg,#36cab9,#1684ae);box-shadow:0 10px 23px rgba(22,116,147,.27); }
.geo-flow-node { color:#263c58;background:rgba(255,255,255,.94);border-color:rgba(37,104,136,.27);box-shadow:0 13px 28px rgba(35,78,112,.15); }
.geo-flow-node b { color:#176f7b;background:#d8f0ed;border-color:#9fd4ce; }
.geo-decor-dot { border-color:rgba(34,91,126,.36);box-shadow:inset 0 0 0 6px rgba(38,107,142,.07); }
.dot-three { background:#20a99c;box-shadow:0 0 19px rgba(32,169,156,.48); }
.sidebar { border-right-color:#d6e2e6;box-shadow:8px 0 27px rgba(35,65,84,.115); }
.brand-mark { background:linear-gradient(145deg,#3b8eaa,#249d8f);box-shadow:0 9px 21px rgba(32,111,126,.23); }
.nav-link { color:#586b81; }.nav-link:hover { color:#176d78;background:#e8f4f3; }
.nav-link.active,.nav-parent.active { color:#116a73;background:#dcefed;box-shadow:inset 0 0 0 1px #c7e4df; }
.nav-icon,.nav-link.active .nav-icon { color:#367b8d; }.nav-link.active::after { background:#229c90; }
.nav-sublink:hover,.nav-sublink.active { color:#176d78;background:#e3f1f0; }
.nav-status-dot { background:#2eae93;box-shadow:0 0 0 4px rgba(46,174,147,.18),0 0 10px rgba(46,174,147,.28); }
.sidebar-account { background:#edf4f5;border-color:#ccdde1; }.sidebar-account-avatar { color:#176f79;background:#d6efeb; }
.topbar::after { background:linear-gradient(90deg,transparent,#3b9e99 28%,#357f9c 72%,transparent);opacity:.43; }
.menu-toggle,.topbar-icon,.date-pill { color:#2d7588;border-color:#d2e0e5; }
.panel,.reference-panel,.profile-summary-card,.company-summary-card,.reference-data-section,.ring-stat-card,.mini-analytics-card,.filter-panel,.register-panel,.form-section,.single-detail { border-color:#d7e2e6;box-shadow:0 6px 18px rgba(36,67,86,.105); }
.profile-avatar,.modal-title-icon,.distribution-title-icon,.success-toast-icon { background:linear-gradient(145deg,#3b8eaa,#249d8f);box-shadow:0 9px 22px rgba(32,111,126,.21); }
.btn-primary,.company-summary-card header button,.main-graph-card header a,.reference-section-header > a,.distribution-action-button,.btn-agenda-generate { box-shadow:0 7px 17px rgba(27,111,126,.24); }
.company-metric { border-width:1px;box-shadow:0 4px 11px rgba(37,74,94,.075); }
.company-metric.orange { background:#e5eff4;border-color:#c8dbe4; }.company-metric.orange strong { color:#3d708a; }
.company-metric.navy { background:#dfeaf1;border-color:#c2d6df; }.company-metric.navy strong { color:#2c7293; }
.company-metric.blue { background:#def1ed;border-color:#badfd7; }.company-metric.blue strong { color:#21877b; }
.company-metric span { color:#65788c;font-weight:750; }
.reference-chart-line { stroke:#2d7898;stroke-width:2.3; }.reference-chart-point { fill:#2ca392;stroke:#285f78; }
.reference-legend .orange,.reference-donut-legend .orange { background:#2f789c; }.reference-legend .green,.reference-donut-legend .green { background:#2f9b8e; }.reference-legend .blue,.reference-donut-legend .blue { background:#7d94aa; }
.orange-ring { --ring-color:#2f789c; }.green-ring { --ring-color:#2f9b8e; }
.pagination li.active a { box-shadow:0 5px 13px rgba(27,111,126,.24); }
.progress-document-tab.active { border-color:#a9d3ce;background:#fff;box-shadow:0 5px 14px rgba(30,102,108,.115); }
.section-number,.modal-section-heading > span { color:#187b82;background:#dff1ef; }
.btn-agendaris-sync,.btn-shift-handover,.btn-agenda-generate[data-can-cancel="true"] { color:#176f79;background:#e4f2f0;border-color:#afd5d1; }
.disposition-stage-panel > header { background:linear-gradient(105deg,#e5f3f1,#eef5f7); }
.disposition-stage-state.filled { color:#176f79;background:#def0ed;border-color:#add7d1; }
.landing-login-header { background:linear-gradient(120deg,#e7f1f5,#dff2ee);border-bottom-color:#c8dedf; }
.landing-login-header::after { border-color:rgba(32,145,141,.14); }
.landing-login-mark { background:linear-gradient(145deg,#3b8eaa,#249d8f);box-shadow:0 10px 23px rgba(32,111,126,.23); }
.landing-login-header small { color:#137c82; }.landing-login-header p { color:#687b8b; }

/* Varian lebih terang dengan saturasi rendah. */
:root {
    --blue:#6d96aa;
    --blue-dark:#527e95;
    --cyan:#78adae;
    --green:#69a89e;
    --brand-blue:#648fa7;
    --brand-teal:#69a89e;
    --brand-gradient:linear-gradient(115deg,#628ca5 0%,#5b969d 52%,#67a398 100%);
}
.geo-landing-kicker { color:#4e8d91; }.geo-landing-kicker::before { background:#74aaa7; }
.geo-landing-copy h1 strong { color:#4e8791; }
.geo-landing-nav a::after,.geo-nav-login-trigger::after { background:#60999b; }
.geo-primary-action,.landing-login-submit { box-shadow:0 9px 20px rgba(76,125,135,.16); }
.geo-primary-action:hover,.landing-login-submit:hover { background:linear-gradient(115deg,#567f9a,#4f8b92 52%,#5c968c);box-shadow:0 11px 23px rgba(76,125,135,.19); }
.geo-tech-grid { background:radial-gradient(circle at center,rgba(101,170,162,.14),rgba(100,135,181,.065) 43%,transparent 71%);border-color:rgba(78,112,139,.1); }
.geo-system-orbit { border-color:rgba(72,108,137,.21); }.geo-system-orbit.orbit-two { border-color:rgba(72,108,137,.15); }
.geo-system-orbit::before,.geo-system-orbit::after { background:#74b0a7;box-shadow:0 0 15px rgba(91,158,150,.3); }
.geo-system-connection { background:linear-gradient(90deg,rgba(91,157,154,.5),rgba(83,111,138,.1)); }
.geo-core-card { background:rgba(255,255,255,.88);border-color:rgba(79,116,143,.19);box-shadow:0 22px 58px rgba(68,99,122,.12),inset 0 1px 0 #fff; }
.geo-core-card::before { border-color:rgba(101,169,160,.18); }
.geo-core-icon { background:linear-gradient(145deg,#82bbb5,#648fac);box-shadow:0 8px 18px rgba(77,126,141,.17); }
.geo-flow-node { color:#42536b;background:rgba(255,255,255,.88);border-color:rgba(79,116,143,.18);box-shadow:0 10px 22px rgba(68,99,122,.09); }
.geo-flow-node b { color:#507f88;background:#eaf4f2;border-color:#d0e5e1; }
.geo-decor-dot { border-color:rgba(74,108,136,.24);box-shadow:inset 0 0 0 6px rgba(83,116,143,.04); }.dot-three { background:#78aea6;box-shadow:0 0 15px rgba(100,166,157,.26); }
.sidebar { border-right-color:#e0e8eb;box-shadow:7px 0 23px rgba(53,79,96,.075); }
.brand-mark { background:linear-gradient(145deg,#75a2b5,#6eaaa1);box-shadow:0 7px 16px rgba(75,126,137,.13); }
.nav-link { color:#65768a; }.nav-link:hover { color:#477983;background:#f1f7f6; }
.nav-link.active,.nav-parent.active { color:#46787e;background:#edf6f5;box-shadow:inset 0 0 0 1px #dcebea; }
.nav-icon,.nav-link.active .nav-icon { color:#608b99; }.nav-link.active::after { background:#75aaa2;box-shadow:0 0 0 4px rgba(117,170,162,.1); }
.nav-sublink:hover,.nav-sublink.active { color:#477983;background:#eff6f5; }
.nav-status-dot { background:#79b3a6;box-shadow:0 0 0 4px rgba(121,179,166,.12); }
.sidebar-account { background:#f3f7f8;border-color:#dbe6e9; }.sidebar-account-avatar { color:#527f88;background:#e7f2f1; }
.topbar::after { background:linear-gradient(90deg,transparent,#82afaa 28%,#759caf 72%,transparent);opacity:.28; }
.menu-toggle,.topbar-icon,.date-pill { color:#64889a;border-color:#dce6e9; }
.panel,.reference-panel,.profile-summary-card,.company-summary-card,.reference-data-section,.ring-stat-card,.mini-analytics-card,.filter-panel,.register-panel,.form-section,.single-detail { border-color:#e0e7ea;box-shadow:0 5px 15px rgba(53,79,96,.075); }
.profile-avatar,.modal-title-icon,.distribution-title-icon,.success-toast-icon { background:linear-gradient(145deg,#75a2b5,#6eaaa1);box-shadow:0 7px 17px rgba(75,126,137,.14); }
.btn-primary,.company-summary-card header button,.main-graph-card header a,.reference-section-header > a,.distribution-action-button,.btn-agenda-generate { box-shadow:0 6px 14px rgba(76,125,135,.16); }
.company-metric { box-shadow:0 3px 9px rgba(61,87,104,.045); }
.company-metric.orange { background:#f0f5f7;border-color:#dce7eb; }.company-metric.orange strong { color:#68889b; }
.company-metric.navy { background:#edf4f7;border-color:#d9e5ea; }.company-metric.navy strong { color:#5f879d; }
.company-metric.blue { background:#edf7f5;border-color:#d7e9e5; }.company-metric.blue strong { color:#5f948a; }
.company-metric span { color:#7b8999; }
.reference-chart-line { stroke:#6d96aa;stroke-width:2.1; }.reference-chart-point { fill:#69a89e;stroke:#668492; }
.reference-legend .orange,.reference-donut-legend .orange { background:#6d96aa; }.reference-legend .green,.reference-donut-legend .green { background:#69a89e; }.reference-legend .blue,.reference-donut-legend .blue { background:#a5b2be; }
.orange-ring { --ring-color:#6d96aa; }.green-ring { --ring-color:#69a89e; }
.pagination li.active a { box-shadow:0 4px 10px rgba(76,125,135,.15); }
.progress-document-tab.active { border-color:#cde0dd;background:#fff;box-shadow:0 4px 11px rgba(67,105,110,.075); }
.section-number,.modal-section-heading > span { color:#5b878d;background:#edf6f4; }
.btn-agendaris-sync,.btn-shift-handover,.btn-agenda-generate[data-can-cancel="true"] { color:#527f87;background:#f0f6f5;border-color:#cce0dd; }
.disposition-stage-panel > header { background:linear-gradient(105deg,#eff6f5,#f4f8f9); }
.disposition-stage-state.filled { color:#527f87;background:#edf6f4;border-color:#cce2de; }
.landing-login-header { background:linear-gradient(120deg,#f2f6f8,#edf7f5);border-bottom-color:#dce8e8; }
.landing-login-header::after { border-color:rgba(103,166,159,.09); }.landing-login-mark { background:linear-gradient(145deg,#75a2b5,#6eaaa1);box-shadow:0 8px 18px rgba(75,126,137,.14); }
.landing-login-header small { color:#5a8b8f; }.landing-login-header p { color:#7c8a98; }

/* Palet identitas Jamkrindo Kanwil Surabaya: biru korporat dan tosca kuat. */
:root {
    --navy:#073b73;
    --blue:#005aa9;
    --blue-dark:#003f7d;
    --cyan:#00b9b1;
    --green:#00a8a2;
    --brand-purple:#005aa9;
    --brand-indigo:#00529b;
    --brand-blue:#005aa9;
    --brand-teal:#00aaa6;
    --brand-gradient:linear-gradient(115deg,#004f99 0%,#0079ad 52%,#00aaa6 100%);
}

body { color:#203a59;background:#f3f7fa; }
.content-shell { background:linear-gradient(145deg,#f8fbfd,#f1f6f9); }

/* Landing page tetap putih, dengan ornamen berwarna tegas sesuai logo. */
.geo-landing-kicker { color:#006c9d; }
.geo-landing-kicker::before { background:#00aaa6; }
.geo-landing-copy h1 { color:#073b73; }
.geo-landing-copy h1 strong { color:#005aa9; }
.geo-landing-copy p { color:#536b83; }
.geo-landing-nav a,.geo-nav-login-trigger { color:#17466f; }
.geo-landing-nav a:hover,.geo-nav-login-trigger:hover { color:#005aa9; }
.geo-landing-nav a::after,.geo-nav-login-trigger::after { background:#00aaa6; }
.geo-tech-grid {
    background:radial-gradient(circle at center,rgba(0,185,177,.2),rgba(0,90,169,.1) 43%,transparent 71%);
    border-color:rgba(0,82,155,.16);
}
.geo-system-orbit { border-color:rgba(0,82,155,.33); }
.geo-system-orbit.orbit-two { border-color:rgba(0,170,166,.28); }
.geo-system-orbit::before,.geo-system-orbit::after {
    background:#00b9b1;
    border-color:#fff;
    box-shadow:0 0 20px rgba(0,185,177,.55);
}
.geo-system-connection { background:linear-gradient(90deg,rgba(0,170,166,.82),rgba(0,82,155,.22)); }
.geo-core-card {
    color:#073b73;
    background:rgba(255,255,255,.96);
    border-color:rgba(0,82,155,.32);
    box-shadow:0 25px 70px rgba(0,63,125,.18),inset 0 1px 0 #fff;
}
.geo-core-card::before { border-color:rgba(0,170,166,.32); }
.geo-core-card small { color:#52718e; }
.geo-core-icon { background:var(--brand-gradient);box-shadow:0 10px 24px rgba(0,90,169,.3); }
.geo-flow-node {
    color:#073b73;
    background:rgba(255,255,255,.97);
    border-color:rgba(0,82,155,.28);
    box-shadow:0 13px 30px rgba(0,63,125,.15);
}
.geo-flow-node b { color:#006c75;background:#e8f8f7;border-color:#8bd8d3; }
.geo-decor-dot { border-color:rgba(0,82,155,.4);box-shadow:inset 0 0 0 6px rgba(0,90,169,.08); }
.dot-three { background:#00b9b1;box-shadow:0 0 20px rgba(0,185,177,.52); }
.geo-primary-action { color:#fff;background:var(--brand-gradient);border-color:transparent;box-shadow:0 11px 25px rgba(0,90,169,.28); }
.geo-primary-action:hover { background:linear-gradient(115deg,#003f7d,#006b9f 52%,#00958f);box-shadow:0 14px 28px rgba(0,90,169,.34); }

/* Navigasi dan dashboard. */
.sidebar { color:#203a59;background:#fff;border-right-color:#d6e3ec;box-shadow:8px 0 27px rgba(0,63,125,.12); }
.sidebar::before { border-color:rgba(0,170,166,.09); }
.brand-mark,.profile-avatar,.modal-title-icon,.distribution-title-icon,.success-toast-icon {
    color:#fff;
    background:var(--brand-gradient);
    box-shadow:0 9px 22px rgba(0,90,169,.24);
}
.brand strong { color:#073b73; }
.brand small { color:#648098; }
.nav-label { color:#8094a6; }
.nav-link { color:#48647d; }
.nav-link:hover { color:#005aa9;background:#edf7fa; }
.nav-link.active,.nav-parent.active { color:#00529b;background:#e7f5f6;box-shadow:inset 0 0 0 1px #bfe4e3; }
.nav-link.active::after { background:#00aaa6;box-shadow:0 0 0 4px rgba(0,170,166,.16); }
.nav-icon,.nav-link.active .nav-icon { color:#007ca5; }
.nav-submenu { border-left-color:#cfdee8; }
.nav-sublink { color:#637b91; }
.nav-sublink:hover,.nav-sublink.active { color:#005aa9;background:#edf7fa; }
.nav-status-dot { background:#00aaa6;box-shadow:0 0 0 4px rgba(0,170,166,.17),0 0 10px rgba(0,170,166,.28); }
.sidebar-account { color:#203a59;background:#f1f7fa;border-color:#d3e2eb; }
.sidebar-account-avatar { color:#00529b;background:#e3f3f5; }
.sidebar-account small { color:#71869a; }
.sidebar-account button { color:#005aa9;background:#e3f1f6; }
.sidebar-account button:hover { color:#fff;background:var(--brand-gradient); }
.topbar { background:rgba(255,255,255,.97);border-bottom-color:#d6e3ec;box-shadow:0 4px 15px rgba(0,63,125,.07); }
.topbar::after { background:linear-gradient(90deg,transparent,#00aaa6 28%,#005aa9 72%,transparent);opacity:.55; }
.topbar-title span { color:#8a9bad; }
.topbar-title strong { color:#073b73; }
.menu-toggle,.topbar-icon,.date-pill { color:#006d9e;background:#fff;border-color:#cedfe9; }
.menu-toggle:hover,.topbar-icon:hover { color:#fff;background:var(--brand-gradient);border-color:transparent; }
.date-pill { color:#005a8f; }

.panel,.reference-panel,.profile-summary-card,.company-summary-card,.reference-data-section,.ring-stat-card,.mini-analytics-card,.filter-panel,.register-panel,.form-section,.single-detail {
    border-color:#d5e3ec;
    box-shadow:0 6px 18px rgba(0,63,125,.1);
}
.eyebrow,.page-heading .eyebrow,.record-link,.text-link,.back-link { color:#007d98; }
.btn-primary,.company-summary-card header button,.main-graph-card header a,.reference-section-header > a,.distribution-action-button,.btn-agenda-generate {
    color:#fff;
    background:var(--brand-gradient);
    border-color:transparent;
    box-shadow:0 7px 18px rgba(0,90,169,.27);
}
.btn-primary:hover,.company-summary-card header button:hover,.main-graph-card header a:hover,.reference-section-header > a:hover,.distribution-action-button:hover,.btn-agenda-generate:hover {
    color:#fff;
    background:linear-gradient(115deg,#003f7d,#006b9f 52%,#00958f);
    box-shadow:0 10px 22px rgba(0,90,169,.32);
}
.btn-secondary { color:#17466f;background:#fff;border-color:#cadce8; }
.btn-secondary:hover,.btn-ghost:hover { color:#005aa9;background:#edf7fa;border-color:#8fc9d2; }

.company-metric { color:#fff;border:0;box-shadow:0 7px 17px rgba(0,63,125,.17); }
.company-metric span,.company-metric strong { color:#fff; }
.company-metric.orange { background:linear-gradient(135deg,#0079b2,#009fba); }
.company-metric.navy { background:linear-gradient(135deg,#003f7d,#005fa3); }
.company-metric.blue { background:linear-gradient(135deg,#008f9d,#00b9b1); }
.reference-chart-line { stroke:#005aa9;stroke-width:2.4; }
.reference-chart-point { fill:#00b9b1;stroke:#004b87; }
.reference-legend .orange,.reference-donut-legend .orange { background:#005aa9; }
.reference-legend .green,.reference-donut-legend .green { background:#00aaa6; }
.reference-legend .blue,.reference-donut-legend .blue { background:#2398c5; }
.orange-ring { --ring-color:#005aa9; }
.green-ring { --ring-color:#00aaa6; }
.ring-stat-card small { color:#007d98; }
.mini-analytics-card polyline { stroke:#007fa8; }
.reference-search { color:#526b82;background:#eef4f7; }
.reference-recent-table header a { color:#006d9e; }
thead { background:#f0f5f8; }
tbody tr:hover { background:#f3fafb; }
.icon-btn:hover { color:#005aa9;border-color:#8fc9d2;background:#edf7fa; }
.pagination li.active a { color:#fff;background:var(--brand-gradient);border-color:transparent;box-shadow:0 5px 13px rgba(0,90,169,.25); }
input:focus,select:focus,textarea:focus { border-color:#00aaa6;box-shadow:0 0 0 3px rgba(0,170,166,.14); }
.input-with-icon span { color:#007d98; }
.section-number,.modal-section-heading > span { color:#006f83;background:#e5f6f5; }
.progress-document-tabs { background:#eef4f7;border-color:#d3e1ea; }
.progress-document-tab:hover { color:#005aa9; }
.progress-document-tab.active { border-color:#9ed6d3;background:#fff;box-shadow:0 5px 14px rgba(0,90,120,.12); }
.progress-document-tab.active > span { background:var(--brand-gradient); }
.progress-document-tab.active strong { color:#00529b; }
.btn-agendaris-sync,.btn-shift-handover,.btn-agenda-generate[data-can-cancel="true"] { color:#005aa9;background:#f4f8ff;border-color:#aebfe9;box-shadow:none; }
.btn-agendaris-sync:hover,.btn-shift-handover:hover,.btn-agenda-generate[data-can-cancel="true"]:hover { color:#003f7d;background:#eaf1ff;border-color:#86a3df;box-shadow:0 5px 12px rgba(0,82,155,.13); }
.agendaris-table-panel,.distribution-table-panel { border-top-color:#00aaa6; }
.distribution-outgoing-panel { border-top-color:#005aa9; }
.success-toast { color:#006b67;background:#effaf9;border-color:#9bd8d3;box-shadow:0 11px 27px rgba(0,100,98,.15); }
.disposition-stage-marker span { background:var(--brand-gradient);border-color:#e7f5f5;box-shadow:0 5px 12px rgba(0,90,169,.2); }
.disposition-stage-marker i { background:#0a65d2; }
.disposition-stage-panel > header { background:linear-gradient(105deg,#e5f1ff,#f2f8ff);border-bottom-color:#0a65d2; }
.disposition-form-stage:hover .disposition-stage-panel { border-color:#9fcaf5;box-shadow:0 7px 17px rgba(10,101,210,.11); }
.disposition-stage-panel:focus-within { border-color:#0a65d2;box-shadow:0 0 0 3px rgba(10,101,210,.1),0 7px 18px rgba(10,101,210,.1); }
.disposition-stage-state.filled { color:#006f76;background:#e6f7f5;border-color:#9ddbd6; }
.agendaris-modal-body[data-agendaris-step="3"] { scrollbar-color:#0a65d2 #edf5ff; }
.agendaris-modal-body[data-agendaris-step="3"]::-webkit-scrollbar-track { background:#edf5ff; }
.agendaris-modal-body[data-agendaris-step="3"]::-webkit-scrollbar-thumb { background:var(--system-electric-sky-gradient); }

/* Form login menggunakan warna logo secara penuh tanpa tampilan pastel. */
.landing-login-backdrop { background:rgba(0,39,77,.58); }
.landing-login-dialog { border-color:rgba(0,82,155,.24);box-shadow:0 28px 75px rgba(0,39,77,.32); }
.landing-login-header { color:#fff;background:var(--brand-gradient);border-bottom-color:transparent; }
.landing-login-header::after { border-color:rgba(255,255,255,.15); }
.landing-login-mark { color:#fff;background:rgba(255,255,255,.14);border-color:rgba(255,255,255,.34);box-shadow:0 10px 23px rgba(0,42,83,.22); }
.landing-login-close { color:#fff;background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.34); }
.landing-login-close:hover { color:#00529b;background:#fff; }
.landing-login-header small,.landing-login-header strong,.landing-login-header p { color:#fff; }
.landing-login-header p { opacity:.88; }
.landing-login-form input:focus { border-color:#00aaa6;box-shadow:0 0 0 3px rgba(0,170,166,.14); }
.landing-password-field button { color:#006d9e;background:#edf7fa; }
.landing-password-field button:hover { color:#fff;background:#005aa9; }
.landing-login-submit { color:#fff;background:var(--brand-gradient);border-color:transparent;box-shadow:0 10px 23px rgba(0,90,169,.28); }
.landing-login-submit:hover { background:linear-gradient(115deg,#003f7d,#006b9f 52%,#00958f);box-shadow:0 13px 27px rgba(0,90,169,.34); }

/* Sidebar: state hover dan aktif dibuat utuh agar tidak bertabrakan dengan latar putih. */
.sidebar { isolation:isolate; }
.sidebar::before { display:none; }
.sidebar > .brand,.sidebar > .main-nav,.sidebar > .sidebar-account { position:relative;z-index:2; }
.sidebar-pattern { z-index:0;pointer-events:none; }
.nav-group,.nav-submenu,.nav-sublink { position:relative;z-index:2; }
.nav-link,.nav-sublink {
    overflow:hidden;
    transition:color .18s ease,background-color .18s ease,box-shadow .18s ease,transform .18s ease;
}
.nav-link:hover {
    color:#004f99;
    background:linear-gradient(90deg,rgba(0,170,166,.13),rgba(0,90,169,.08));
    box-shadow:inset 3px 0 0 #00aaa6;
}
.nav-link.active,.nav-parent.active {
    color:#004f99;
    background:linear-gradient(90deg,#e2f5f4 0%,#edf5fb 100%);
    box-shadow:inset 3px 0 0 #00aaa6,inset 0 0 0 1px #acdcd9;
}
.nav-link.active .nav-icon,.nav-parent.active .nav-icon { color:#007ca5; }
.nav-link.active::after { background:#00aaa6;box-shadow:0 0 0 4px rgba(0,170,166,.15); }
.nav-parent.active::after { display:none; }
.nav-submenu {
    margin-top:4px;
    padding-top:3px;
    padding-bottom:3px;
    border-left-color:#bfd7e4;
}
.nav-sublink {
    margin:3px 0;
    color:#536d85;
    background:transparent;
}
.nav-sublink:hover {
    color:#004f99;
    background:#e8f5f7;
    box-shadow:inset 3px 0 0 #00aaa6;
    transform:translateX(2px);
}
.nav-sublink.active {
    color:#fff;
    background:linear-gradient(100deg,#005aa9 0%,#007da8 55%,#00a6a1 100%);
    box-shadow:0 6px 14px rgba(0,82,155,.19);
}
.nav-sublink.active > span { color:#fff; }
.nav-link-muted:hover {
    color:#48647d;
    background:transparent;
    box-shadow:none;
    transform:none;
}

/* Ikon sidebar mengikuti identitas visual Jamkrindo. */
.brand-mark {
    color:#fff;
    background:linear-gradient(145deg,#005aa9 0%,#007fae 55%,#00aaa6 100%);
    border-color:rgba(0,82,155,.14);
}
.nav-icon {
    flex:0 0 26px;
    width:26px;
    height:26px;
    color:#005aa9;
    background:#edf7fa;
    border:1px solid #cfe6ed;
    border-radius:8px;
    font-size:12px;
    transition:color .18s ease,background .18s ease,border-color .18s ease,box-shadow .18s ease,transform .18s ease;
}
.nav-link:hover .nav-icon {
    color:#fff;
    background:linear-gradient(145deg,#0072aa,#00aaa6);
    border-color:transparent;
    box-shadow:0 4px 10px rgba(0,113,152,.2);
    transform:scale(1.04);
}
.nav-link.active .nav-icon,.nav-parent.active .nav-icon {
    color:#fff;
    background:linear-gradient(145deg,#005aa9,#00aaa6);
    border-color:transparent;
    box-shadow:0 4px 11px rgba(0,90,169,.22);
}
.nav-sublink > span {
    color:#007ca5;
    transition:color .18s ease,transform .18s ease;
}
.nav-sublink:hover > span { color:#00aaa6;transform:scale(1.15); }
.nav-sublink.active > span { color:#fff; }
.nav-link-muted .nav-icon {
    color:#00a19c;
    background:#e7f7f5;
    border-color:#c4e8e4;
}
.nav-link-muted:hover .nav-icon {
    color:#00a19c;
    background:#e7f7f5;
    border-color:#c4e8e4;
    box-shadow:none;
    transform:none;
}

/* Seluruh indikator tahapan mengikuti palet biru-tosca Jamkrindo. */
.outgoing-distribution-steps {
    color:#668098;
}
.outgoing-distribution-steps span {
    color:#668098;
    transition:color .18s ease;
}
.outgoing-distribution-steps b {
    color:#52758f;
    background:#edf5fa;
    border:1px solid #d4e4ed;
    box-shadow:inset 0 1px 0 #fff;
    transition:color .18s ease,background .18s ease,border-color .18s ease,box-shadow .18s ease;
}
.outgoing-distribution-steps i {
    background:linear-gradient(90deg,#c6dbe7 0%,#aadbd7 100%);
}
.outgoing-distribution-steps span.active {
    color:#00529b;
}
.outgoing-distribution-steps span.active b {
    color:#fff;
    background:linear-gradient(145deg,#005aa9 0%,#007fae 55%,#00aaa6 100%);
    border-color:transparent;
    box-shadow:0 5px 13px rgba(0,90,169,.25);
}

.pks-wizard-steps {
    background:#f5f9fb;
    border-color:#d6e4ec;
}
.pks-wizard-steps > button { color:#70869a; }
.pks-wizard-steps > button > span {
    color:#52758f;
    background:#edf5fa;
    border:1px solid #d4e4ed;
}
.pks-wizard-steps strong { color:#55718a; }
.pks-wizard-steps small { color:#8396a8; }
.pks-wizard-steps > i { background:linear-gradient(90deg,#c6dbe7,#aadbd7); }
.pks-wizard-steps > button.active > span {
    color:#fff;
    background:linear-gradient(145deg,#005aa9 0%,#007fae 55%,#00aaa6 100%);
    border-color:transparent;
    box-shadow:0 5px 13px rgba(0,90,169,.25);
}
.pks-wizard-steps > button.active strong { color:#00529b; }
.pks-wizard-steps > button.complete > span {
    color:#007c78;
    background:#e2f6f4;
    border-color:#a9ddd8;
}
.pks-wizard-steps > button.complete strong { color:#006d83; }

/* Ikon menu yang belum dipilih tetap menggunakan gradasi identitas. */
.nav-link:not(.active) .nav-icon,
.nav-parent:not(.active) .nav-icon,
.nav-link-muted .nav-icon {
    color:#fff;
    background:linear-gradient(145deg,#005aa9 0%,#007fae 55%,#00aaa6 100%);
    border-color:transparent;
    box-shadow:0 3px 9px rgba(0,90,169,.17);
}
.nav-link:not(.active):hover .nav-icon,
.nav-parent:not(.active):hover .nav-icon {
    color:#fff;
    background:linear-gradient(145deg,#004b91 0%,#00769f 52%,#009c97 100%);
    box-shadow:0 5px 12px rgba(0,90,169,.25);
}
.nav-link-muted:hover .nav-icon {
    color:#fff;
    background:linear-gradient(145deg,#005aa9 0%,#007fae 55%,#00aaa6 100%);
    border-color:transparent;
    box-shadow:0 3px 9px rgba(0,90,169,.17);
}

/* Koreksi ikon: kotak putih saat nonaktif, simbol gradasi; dibalik saat aktif. */
.nav-icon,
.nav-link:not(.active) .nav-icon,
.nav-parent:not(.active) .nav-icon,
.nav-link-muted .nav-icon {
    color:#005aa9;
    background:#fff;
    border-color:#c8e1eb;
    box-shadow:0 3px 9px rgba(0,82,155,.08);
}
.nav-icon > i {
    display:inline-block;
    color:#005aa9;
    background:linear-gradient(145deg,#005aa9 0%,#007fae 55%,#00aaa6 100%);
    background-clip:text;
    -webkit-background-clip:text;
    -webkit-text-fill-color:transparent;
    font-style:normal;
    line-height:1;
}
.nav-link:not(.active):hover .nav-icon,
.nav-parent:not(.active):hover .nav-icon,
.nav-link-muted:hover .nav-icon {
    color:#005aa9;
    background:#fff;
    border-color:#77c6d0;
    box-shadow:0 5px 12px rgba(0,90,169,.14);
}
.nav-link.active .nav-icon,
.nav-parent.active .nav-icon {
    color:#fff;
    background:linear-gradient(145deg,#005aa9 0%,#007fae 55%,#00aaa6 100%);
    border-color:transparent;
    box-shadow:0 5px 12px rgba(0,90,169,.24);
}
.nav-link.active .nav-icon > i,
.nav-parent.active .nav-icon > i {
    color:#fff;
    background:none;
    -webkit-text-fill-color:#fff;
}

/* Bilah tahapan tetap terlihat; hanya isi formulir yang bergulir. */
.pks-main-modal:not(.pks-detail-popup) .modal-body {
    position:relative;
    overscroll-behavior:contain;
    scrollbar-gutter:stable;
}
.pks-main-modal:not(.pks-detail-popup) .pks-wizard-steps {
    position:sticky;
    top:-18px;
    z-index:12;
    margin:-18px -20px 20px;
    padding:13px 20px;
    background:rgba(255,255,255,.98);
    border-width:0 0 1px;
    border-color:#d3e3ec;
    border-radius:0;
    box-shadow:0 7px 16px rgba(0,63,125,.08);
    backdrop-filter:blur(8px);
}
.agendaris-form-modal .outgoing-distribution-steps,
.distribution-action-modal .outgoing-distribution-steps {
    position:relative;
    z-index:10;
    flex:0 0 auto;
    background:#fff;
}
@media (max-width:700px) {
    .pks-main-modal:not(.pks-detail-popup) .pks-wizard-steps {
        top:-15px;
        margin:-15px -15px 16px;
        padding:11px 15px;
    }
}

/* Kartu ringkasan: permukaan putih, lis dan angka memakai gradasi. */
.company-metric,
.company-metric.orange,
.company-metric.navy,
.company-metric.blue {
    color:#203a59;
    background:linear-gradient(#fff,#fff) padding-box,var(--brand-gradient) border-box;
    border:1.5px solid transparent;
    box-shadow:0 7px 17px rgba(0,63,125,.1);
    transition:transform .18s ease,box-shadow .18s ease;
}
.company-metric:hover {
    transform:translateY(-2px);
    box-shadow:0 10px 22px rgba(0,82,155,.14);
}
.company-metric span {
    color:#365773;
    font-weight:800;
}
.company-metric strong,
.company-metric.orange strong,
.company-metric.navy strong,
.company-metric.blue strong {
    color:#005aa9;
    background:var(--brand-gradient);
    background-clip:text;
    -webkit-background-clip:text;
    -webkit-text-fill-color:transparent;
}

/* Ringkasan PKS memakai gaya kartu putih dan lis gradasi yang sama. */
.pks-summary-card {
    background:linear-gradient(#fff,#fff) padding-box,var(--brand-gradient) border-box;
    border:1.5px solid transparent;
    box-shadow:0 7px 17px rgba(0,63,125,.09);
}
.pks-summary-card:hover {
    border-color:transparent;
    box-shadow:0 10px 22px rgba(0,82,155,.14);
}
.pks-summary-card.is-active {
    background:linear-gradient(#fff,#fff) padding-box,var(--brand-gradient) border-box;
    border:2px solid transparent;
    box-shadow:0 0 0 3px rgba(0,170,166,.1),0 10px 22px rgba(0,82,155,.14);
}
.pks-summary-grid small {
    color:#526e87;
    font-weight:800;
}
.pks-summary-grid strong {
    color:#005aa9;
    background:var(--brand-gradient);
    background-clip:text;
    -webkit-background-clip:text;
    -webkit-text-fill-color:transparent;
}
.pks-summary-icon,
.pks-summary-icon.total,
.pks-summary-icon.active,
.pks-summary-icon.warning,
.pks-summary-icon.expired,
.pks-summary-icon.neutral {
    color:#007e9e;
    background:linear-gradient(#fff,#fff) padding-box,var(--brand-gradient) border-box;
    border:1.5px solid transparent;
    box-shadow:0 4px 11px rgba(0,82,155,.1);
}
.pks-summary-card.is-active .pks-summary-icon {
    color:#fff;
    background:var(--brand-gradient);
    border-color:transparent;
}

/* Ringkasan PKS: ikon status memakai gradasi solid agar konsisten dengan Dokumen SPK. */
.pks-summary-card.is-active {
    border:2px solid transparent;
    box-shadow:0 7px 17px rgba(0,63,125,.09);
}
.pks-summary-grid small {
    color:#8c99a8;
    font-weight:750;
}
.pks-summary-icon {
    border:0;
    color:#fff;
    box-shadow:0 7px 15px rgba(0,72,128,.18);
}
.pks-summary-icon.total,
.pks-summary-card.is-active .pks-summary-icon.total {
    color:#fff;
    background:linear-gradient(145deg,#0066b3,#009da4);
}
.pks-summary-icon.active,
.pks-summary-card.is-active .pks-summary-icon.active {
    color:#fff;
    background:linear-gradient(145deg,#007f70,#13ad98);
}
.pks-summary-icon.warning,
.pks-summary-card.is-active .pks-summary-icon.warning {
    color:#fff;
    background:linear-gradient(145deg,#c87508,#efa820);
}
.pks-summary-icon.expired,
.pks-summary-card.is-active .pks-summary-icon.expired {
    color:#fff;
    background:linear-gradient(145deg,#ad2942,#e34d5c);
}
.pks-summary-icon.neutral,
.pks-summary-card.is-active .pks-summary-icon.neutral {
    color:#fff;
    background:linear-gradient(145deg,#526d84,#7892a7);
}

/* Wordmark utama menggantikan judul teks pada hero landing. */
.geo-landing-copy h1.geo-landing-wordmark {
    display:block;
    width:min(100%,580px);
    margin:0;
    padding:0;
    font-size:0;
    line-height:0;
    filter:drop-shadow(0 8px 18px rgba(0,63,125,.08));
}
.geo-landing-wordmark img {
    display:block;
    width:106%;
    max-width:none;
    height:auto;
    margin-left:-6%;
    object-fit:contain;
}
@media (max-width:760px) {
    .geo-landing-copy h1.geo-landing-wordmark { width:min(100%,520px); }
}

/* Kepanjangan JAKSA di bawah wordmark dengan aksen gradasi identitas. */
.geo-landing-copy h2.geo-landing-acronym {
    display:flex;
    align-items:baseline;
    flex-wrap:wrap;
    gap:5px 9px;
    margin:clamp(13px,2.2vh,20px) 0 0;
    color:#273f5b;
    font-size:clamp(13px,1.18vw,18px);
    font-weight:500;
    letter-spacing:.05px;
    line-height:1.45;
}
.geo-landing-acronym span { white-space:nowrap; }
.geo-landing-acronym b {
    color:#005aa9;
    background:var(--brand-gradient);
    background-clip:text;
    -webkit-background-clip:text;
    -webkit-text-fill-color:transparent;
    font-size:1.14em;
    font-weight:900;
}
.geo-landing-acronym i {
    color:#8ba0b3;
    font-style:normal;
    font-weight:400;
}
@media (max-width:460px) {
    .geo-landing-copy h2.geo-landing-acronym { gap:3px 6px;font-size:12px; }
}

/* Bagian Umum 1 - Register Dokumen SPK */
.spk-page-heading { margin-bottom:16px; }
.spk-filter-panel { margin-bottom:15px; }
.spk-filter-form { display:grid;grid-template-columns:minmax(270px,1.3fr) repeat(2,minmax(135px,.45fr)) 44px auto;gap:10px;align-items:end; }
.spk-table-panel { overflow:hidden;border-top:3px solid #007e9f; }
.spk-register-header { align-items:center; }
.spk-register-header > span { padding:6px 9px;color:#006f89;background:#e9f7f7;border-radius:999px;font-size:7.5px;font-weight:850;white-space:nowrap; }
.spk-register-table { min-width:1080px; }
.spk-register-table th:nth-child(1) { width:62px; }
.spk-register-table th:nth-child(2) { min-width:185px; }
.spk-register-table th:nth-child(3) { min-width:105px; }
.spk-register-table th:nth-child(4) { min-width:330px; }
.spk-sequence { display:block;margin-top:3px;color:#95a4b1;font-size:6.7px;white-space:nowrap; }
.spk-number-cell .spk-number-trigger,.spk-number-cell small { display:block; }
.spk-number-trigger { max-width:190px;padding:0;color:#007d98;background:transparent;border:0;font:inherit;font-size:8.2px;font-weight:900;text-align:left;overflow-wrap:anywhere;cursor:pointer; }
.spk-number-trigger:hover { color:#005a9f;text-decoration:underline; }
.spk-number-cell small { margin-top:4px;color:#91a0af;font-size:7px; }
.spk-type-badge { display:inline-grid;min-width:36px;padding:6px 8px;place-items:center;color:#006a9e;background:#e8f5fb;border:1px solid #b9dceb;border-radius:8px;font-size:7.5px;font-weight:900;letter-spacing:.35px; }
.spk-subject-cell { max-width:420px;margin:0;color:#3e566c;font-size:8px;font-weight:650;line-height:1.55; }
.spk-file-button { min-width:88px;justify-content:center; }
.spk-missing-value { display:inline-flex;padding:5px 8px;color:#9c6b23;background:#fff7e8;border:1px dashed #e4c58a;border-radius:7px;font-size:7px;font-weight:750;white-space:nowrap; }
.spk-completeness { display:inline-flex;width:max-content;padding:5px 8px;border:1px solid;border-radius:999px;font-size:7px;font-weight:850;white-space:nowrap; }
.spk-completeness.complete { color:#087764;background:#e7f8f3;border-color:#b7e2d7; }
.spk-completeness.incomplete { color:#9a681d;background:#fff5e2;border-color:#ead09d; }
.spk-number-generator { display:flex;align-items:stretch;gap:8px; }
.spk-number-generator input { flex:1;min-width:0;color:#164a70;background:#f5f9fb;font-weight:800;letter-spacing:.2px; }
.spk-number-generator .btn { flex:0 0 auto;white-space:nowrap; }
[data-spk-edit-number-hint].is-warning { color:#a16a17; }
.spk-detail-grid { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 24px;margin:0;padding:5px 18px 18px; }
.spk-detail-grid > div { min-width:0;padding:13px 0;border-bottom:1px solid #edf2f4; }
.spk-detail-grid .wide { grid-column:span 2; }
.spk-detail-grid dt { margin-bottom:4px;color:#8c9cab;font-size:7px;font-weight:800;text-transform:uppercase;letter-spacing:.35px; }
.spk-detail-grid dd { margin:0;color:#36516a;font-size:9px;font-weight:700;line-height:1.6;overflow-wrap:anywhere; }
.spk-view-dialog { width:min(760px,100%); }
.spk-edit-dialog { width:min(820px,100%); }
.spk-edit-body { max-height:calc(88vh - 132px);overflow-y:auto; }
.spk-edit-modal .modal-alert { margin:14px 18px 0; }
.spk-view-body { overflow-y:auto;padding:0; }
.spk-popup-status { display:flex;align-items:center;justify-content:space-between;gap:14px;padding:15px 18px;background:linear-gradient(105deg,#f4fafd,#f2fbf9);border-bottom:1px solid #dcebee; }
.spk-popup-status > div { display:flex;align-items:center;gap:10px; }
.spk-popup-status > div small { color:#597287;font-size:8px;font-weight:800; }
.spk-popup-status .spk-type-badge { min-width:44px;min-height:38px;color:#fff;background:var(--brand-gradient);border:0;box-shadow:0 5px 12px rgba(0,84,150,.15); }
.spk-popup-grid { padding-top:5px; }

@media (max-width:1180px) {
    .spk-filter-form { grid-template-columns:repeat(3,minmax(0,1fr)); }
    .spk-filter-form .search-group { grid-column:span 2; }
}
@media (max-width:760px) {
    .spk-filter-form { grid-template-columns:1fr 1fr; }
    .spk-filter-form .search-group { grid-column:1 / -1; }
    .spk-filter-form .filter-actions { grid-column:1 / -1; }
    .spk-register-table { min-width:940px; }
}
@media (max-width:480px) {
    .spk-filter-form,.spk-detail-grid { grid-template-columns:1fr; }
    .spk-filter-form .search-group,.spk-filter-form .filter-actions,.spk-detail-grid .wide { grid-column:auto; }
    .spk-popup-status { align-items:flex-start;flex-direction:column; }
    .spk-number-generator { align-items:stretch;flex-direction:column; }
    .spk-number-generator .btn { width:100%; }
}

/* Profil pengguna dipindahkan dari sidebar ke navbar kanan atas. */
.topbar-profile { position:relative; }
.topbar-notification { position:relative; }
.topbar-notification-trigger { overflow:visible; }
.topbar-bell-icon { width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round; }
.topbar-notification-badge { position:absolute;top:-6px;right:-7px;display:grid;min-width:17px;height:17px;padding:0 4px;place-items:center;color:#fff;background:#eb5866;border:2px solid #fff;border-radius:999px;box-shadow:0 4px 10px rgba(188,42,59,.25);font-size:6.5px;font-weight:900;line-height:1; }
.topbar-notification-dropdown { position:absolute;top:calc(100% + 12px);left:0;z-index:72;width:340px;overflow:hidden;color:#29435c;background:#fff;border:1px solid #cfdee7;border-radius:14px;box-shadow:0 18px 45px rgba(0,48,91,.18);animation:topbar-profile-in .16s ease both; }
.topbar-notification-dropdown[hidden] { display:none; }
.topbar-notification-dropdown > header { display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 15px;background:linear-gradient(115deg,#edf7fa,#effafa);border-bottom:1px solid #d8e7ec; }
.topbar-notification-dropdown > header small,.topbar-notification-dropdown > header strong { display:block; }
.topbar-notification-dropdown > header small { color:#007b8e;font-size:6.8px;font-weight:850;letter-spacing:.75px; }
.topbar-notification-dropdown > header strong { margin-top:2px;color:#073b73;font-size:11px; }
.topbar-notification-dropdown > header > span { padding:4px 7px;color:#9b4651;background:#fff;border:1px solid #efc9ce;border-radius:999px;font-size:6.8px;font-weight:850;white-space:nowrap; }
.topbar-notification-summary { display:grid;grid-template-columns:1fr 1fr;gap:7px;padding:9px 12px;background:#fbfdfd;border-bottom:1px solid #e6eef1; }
.topbar-notification-summary span { display:flex;align-items:center;gap:5px;padding:6px 8px;color:#71879a;background:#fff;border:1px solid #e2ebef;border-radius:8px;font-size:7.3px;font-weight:750; }
.topbar-notification-summary b { color:#007e96;font-size:9px; }
.topbar-notification-list { max-height:320px;overflow-y:auto; }
.topbar-notification-item { display:grid;grid-template-columns:32px minmax(0,1fr) 10px;gap:9px;align-items:center;padding:11px 13px;color:inherit;border-bottom:1px solid #edf2f4;transition:background .16s ease; }
.topbar-notification-item:hover { background:#f3fafb; }
.topbar-notification-item-icon { display:grid;width:32px;height:32px;place-items:center;color:#fff;background:var(--brand-gradient);border-radius:9px;box-shadow:0 5px 11px rgba(0,90,169,.16);font-size:11px;font-weight:900; }
.topbar-notification-item.outgoing .topbar-notification-item-icon { background:linear-gradient(145deg,#005aa9,#147bc2); }
.topbar-notification-item-copy { min-width:0; }
.topbar-notification-item-copy strong,.topbar-notification-item-copy small,.topbar-notification-item-copy time { display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
.topbar-notification-item-copy strong { color:#254866;font-size:8.5px; }
.topbar-notification-item-copy small { margin-top:2px;color:#788b9c;font-size:7.3px; }
.topbar-notification-item-copy time { margin-top:4px;color:#00a09c;font-size:6.7px;font-weight:750; }
.topbar-notification-item > i { color:#8ba2b2;font-size:15px;font-style:normal; }
.topbar-notification-empty { display:grid;min-height:170px;padding:24px;place-items:center;align-content:center;text-align:center; }
.topbar-notification-empty > span { display:grid;width:36px;height:36px;place-items:center;color:#078f89;background:#e2f7f3;border-radius:50%;font-size:13px;font-weight:900; }
.topbar-notification-empty strong { margin-top:9px;color:#294b68;font-size:9px; }
.topbar-notification-empty p { margin:4px 0 0;color:#8b9baa;font-size:7.5px; }
.topbar-notification-dropdown > footer { padding:9px 12px;background:#fbfdfd;border-top:1px solid #e3ecef; }
.topbar-notification-dropdown > footer a { display:flex;align-items:center;justify-content:center;gap:7px;min-height:32px;color:#006d9e;background:#fff;border:1px solid #c9dfe8;border-radius:8px;font-size:8px;font-weight:850; }
.topbar-notification-dropdown > footer a:hover { color:#fff;background:var(--brand-gradient);border-color:transparent; }
.topbar-profile-trigger {
    display:flex;
    align-items:center;
    gap:9px;
    min-height:38px;
    padding:4px 9px 4px 5px;
    color:#24445f;
    background:#fff;
    border:1px solid #cedfe9;
    border-radius:11px;
    box-shadow:0 4px 12px rgba(0,63,125,.07);
    transition:border-color .18s ease,box-shadow .18s ease,transform .18s ease;
}
.topbar-profile-trigger:hover,.topbar-profile.open .topbar-profile-trigger {
    border-color:#79c8ca;
    box-shadow:0 7px 17px rgba(0,90,169,.13);
    transform:translateY(-1px);
}
.topbar-profile-trigger:focus-visible,.topbar-logout:focus-visible {
    outline:3px solid rgba(0,170,166,.18);
    outline-offset:2px;
}
.topbar-profile-avatar {
    display:grid;
    place-items:center;
    flex:0 0 28px;
    width:28px;
    height:28px;
    color:#fff;
    background:var(--brand-gradient);
    border-radius:9px;
    box-shadow:0 5px 12px rgba(0,90,169,.2);
    font-size:10px;
    font-weight:900;
}
.topbar-profile-copy { min-width:0;text-align:left; }
.topbar-profile-copy strong,.topbar-profile-copy small { display:block;max-width:125px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
.topbar-profile-copy strong { color:#173d61;font-size:9px;line-height:1.25; }
.topbar-profile-copy small { margin-top:1px;color:#7f91a3;font-size:7px;line-height:1.2; }
.topbar-profile-chevron { margin-left:2px;color:#39738e;font-size:11px;transition:transform .18s ease; }
.topbar-profile.open .topbar-profile-chevron { transform:rotate(180deg); }
.topbar-profile-dropdown {
    position:absolute;
    top:calc(100% + 10px);
    right:0;
    z-index:70;
    width:280px;
    overflow:hidden;
    color:#29435c;
    background:#fff;
    border:1px solid #cfdee7;
    border-radius:14px;
    box-shadow:0 18px 45px rgba(0,48,91,.18);
    animation:topbar-profile-in .16s ease both;
}
.topbar-profile-dropdown[hidden] { display:none; }
.topbar-profile-dropdown header { display:flex;align-items:center;gap:11px;padding:15px;background:linear-gradient(115deg,#edf7fa,#effafa);border-bottom:1px solid #d8e7ec; }
.topbar-profile-avatar-large { flex-basis:40px;width:40px;height:40px;border-radius:12px;font-size:13px; }
.topbar-profile-dropdown header div { min-width:0; }
.topbar-profile-dropdown header div > small,.topbar-profile-dropdown header div > strong,.topbar-profile-dropdown header div > span { display:block; }
.topbar-profile-dropdown header small { color:#007b8e;font-size:7px;font-weight:850;letter-spacing:.8px; }
.topbar-profile-dropdown header strong { margin-top:2px;overflow:hidden;color:#073b73;font-size:11px;text-overflow:ellipsis;white-space:nowrap; }
.topbar-profile-dropdown header div > span { color:#72879a;font-size:8px; }
.topbar-profile-details { display:grid;gap:0;margin:0;padding:7px 15px; }
.topbar-profile-details div { display:grid;grid-template-columns:72px minmax(0,1fr);gap:8px;padding:8px 0;border-bottom:1px solid #edf2f5; }
.topbar-profile-details div:last-child { border-bottom:0; }
.topbar-profile-details dt { color:#8798a8;font-size:8px;font-weight:700; }
.topbar-profile-details dd { margin:0;overflow:hidden;color:#294b68;font-size:8.5px;font-weight:750;text-align:right;text-overflow:ellipsis;white-space:nowrap; }
.topbar-profile-dropdown form { margin:0;padding:0 15px 14px; }
.topbar-logout { display:flex;align-items:center;justify-content:center;gap:7px;width:100%;min-height:36px;color:#005a9f;background:#f3f8fb;border:1px solid #bfd8e5;border-radius:9px;font-size:8.5px;font-weight:800;transition:color .18s ease,background .18s ease,border-color .18s ease,box-shadow .18s ease; }
.topbar-logout:hover { color:#fff;background:var(--brand-gradient);border-color:transparent;box-shadow:0 7px 16px rgba(0,90,169,.2); }
@keyframes topbar-profile-in { from { opacity:0;transform:translateY(-5px) scale(.98); } to { opacity:1;transform:translateY(0) scale(1); } }
@media (max-width:700px) {
    .topbar-notification-dropdown { left:-45px;width:min(340px,calc(100vw - 24px)); }
    .topbar-profile-trigger { gap:5px;padding-right:7px; }
    .topbar-profile-copy { display:none; }
    .topbar-profile-dropdown { width:min(280px,calc(100vw - 24px)); }
}
@media print { .topbar-profile,.topbar-notification { display:none!important; } }

/* Ikon bergambar: gradasi saat normal, putih saat menu aktif. */
.image-nav-icon,
.nav-link:hover .image-nav-icon {
    color:#005aa9;
    background:#fff;
    border-color:#cfe6ed;
    box-shadow:0 3px 9px rgba(0,90,169,.1);
}
.image-nav-icon img { display:none; }
.image-nav-icon::before {
    width:16px;
    height:16px;
    background:linear-gradient(145deg,#005aa9 0%,#007fae 55%,#00aaa6 100%);
    content:"";
    -webkit-mask:var(--nav-image) center/contain no-repeat;
    mask:var(--nav-image) center/contain no-repeat;
}
.security-nav-icon { --nav-image:url("images/security-policeman-64.webp"); }
.agendaris-nav-icon { --nav-image:url("images/agendaris-agenda-64.webp"); }
.sdm-nav-icon { --nav-image:url("images/people-64.webp"); }
.accounting-nav-icon { --nav-image:url("images/indonesian-rupiah-64.webp"); }
.sdm-document-modal-dialog{width:min(820px,100%)}.sdm-document-detail-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 28px;margin:0}.sdm-document-detail-grid>div{padding:11px 0;border-bottom:1px solid #e6edf1}.sdm-document-detail-grid .wide{grid-column:1/-1}.sdm-document-detail-grid dt{margin-bottom:5px;color:#94a1b3;font-size:9px;font-weight:850;text-transform:uppercase;letter-spacing:.05em}.sdm-document-detail-grid dd{margin:0;color:#2c3e58;font-size:12px;font-weight:750;line-height:1.5}.sdm-disposition-heading{margin-top:22px}.sdm-disposition-history{display:grid;gap:10px}.sdm-disposition-history article{display:grid;grid-template-columns:42px minmax(0,1fr) auto;gap:13px;align-items:start;padding:13px;background:#f7fafb;border:1px solid #dfe9ed;border-radius:12px}.sdm-disposition-history article>span{display:grid;width:36px;height:36px;place-items:center;color:#fff;background:linear-gradient(145deg,#0073ad,#00a7a4);border-radius:10px;font-size:10px;font-weight:900}.sdm-disposition-history strong,.sdm-disposition-history small,.sdm-disposition-history p{display:block}.sdm-disposition-history strong{color:#273d59;font-size:11px}.sdm-disposition-history small{margin-top:3px;color:#8898ab;font-size:8px}.sdm-disposition-history p{margin:7px 0 0;color:#64768d;font-size:9px;line-height:1.5}.sdm-disposition-history em{padding:5px 8px;color:#007b82;background:#e4f6f4;border-radius:999px;font-size:8px;font-style:normal;font-weight:850}.sdm-add-disposition-control{display:flex;align-items:center;gap:12px;margin-top:20px;padding-top:16px;border-top:1px solid #e1e9ed}.sdm-add-disposition-control small{color:#9b6870;font-size:8px}.sdm-next-disposition{margin-top:18px;padding:16px;background:#f4fafb;border:1px solid #cfe5e8;border-radius:13px}.sdm-next-disposition[hidden]{display:none}
.sdm-document-edit-form{display:flex;flex:1;flex-direction:column;min-height:0}.sdm-document-edit-body{flex:1 1 auto;min-height:0;overflow-y:auto}.disposition-form-stage.sdm-next-disposition{margin-top:0;padding:0;background:transparent;border:0;border-radius:0}.sdm-edit-confirmation{display:grid;gap:4px;padding:13px 14px;background:#eef9f8;border:1px solid #cce8e5;border-radius:9px}.sdm-edit-confirmation strong{color:#176f73;font-size:10px}.sdm-edit-confirmation small{color:#6f8290;font-size:8px;line-height:1.5}
[data-sdm-edit-step][hidden],[data-sdm-step-back][hidden],[data-sdm-step-next][hidden],[data-sdm-document-edit-submit][hidden],[data-sdm-document-edit-errors][hidden],[data-sdm-penyerahan-time][hidden],[data-sdm-detail-link][hidden],[data-sdm-detail-no-link][hidden],[data-sdm-detail-edit][hidden],[data-sdm-add-disposition][hidden],[data-sdm-disposition-capacity][hidden]{display:none!important}
.nav-deleted-badge{margin-left:auto;display:inline-grid;min-width:20px;height:20px;padding:0 6px;place-items:center;border-radius:999px;background:#e45864;color:#fff;font-size:9px;font-weight:900}.deleted-by-marker{display:inline-flex;padding:5px 9px;border-radius:999px;background:#fff1d9;color:#a96300;font-size:10px;font-weight:900}.deleted-by-name{display:block;margin-top:5px;color:#8795aa}.deleted-data-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.deleted-data-actions form{margin:0}
.general-nav-icon { --nav-image:url("images/general-section-64.webp"); }
.general-nav-icon::before { width:18px;height:18px; }
.nav-link.active .image-nav-icon,
.nav-parent.active .image-nav-icon {
    color:#fff;
    background:linear-gradient(145deg,#005aa9 0%,#007fae 55%,#00aaa6 100%);
    border-color:transparent;
    box-shadow:0 4px 11px rgba(0,90,169,.22);
}
.nav-link.active .image-nav-icon::before,
.nav-parent.active .image-nav-icon::before { background:#fff; }

/* Administrator - Session Account */
.session-account-heading { align-items:center; }
.session-live-indicator {
    display:inline-flex;
    align-items:center;
    gap:8px;
    padding:9px 12px;
    color:#006f83;
    background:#edf9f8;
    border:1px solid #bfe7e3;
    border-radius:999px;
    font-size:8px;
    font-weight:850;
    letter-spacing:.35px;
    text-transform:uppercase;
}
.session-live-indicator i { width:7px;height:7px;background:#00aaa6;border-radius:50%;box-shadow:0 0 0 4px rgba(0,170,166,.13); }
.session-stat-grid { grid-template-columns:repeat(3,minmax(150px,1fr)); }
.session-stat-grid article { position:relative;overflow:hidden; }
.session-stat-grid article::after { position:absolute;top:0;right:0;left:0;height:3px;background:linear-gradient(90deg,#005aa9,#00aaa6);content:""; }
.session-stat-active { background:linear-gradient(135deg,#f3f9fd,#effbf9)!important;border-color:#b9dfe4!important; }
.session-filter-form { grid-template-columns:minmax(260px,1.5fr) minmax(180px,.65fr) 44px auto; }
.session-table-panel { border-top-color:#005aa9; }
.session-table-header { display:flex;align-items:center;justify-content:space-between;gap:16px;padding:15px 17px;border-bottom:1px solid #e5edf1; }
.session-table-header strong,.session-table-header small { display:block; }
.session-table-header strong { color:#173b5e;font-size:11px; }
.session-table-header small { margin-top:3px;color:#8a9aaa;font-size:8px; }
.session-table-header > span { padding:6px 9px;color:#007d8c;background:#e9f7f6;border-radius:999px;font-size:7.5px;font-weight:800;white-space:nowrap; }
.session-usage-panel { margin-bottom:16px;padding:0;overflow:hidden;border-top-color:#00aaa6; }
.session-usage-header { display:flex;align-items:flex-start;justify-content:space-between;gap:20px;padding:17px 19px 15px;border-bottom:1px solid #e5edf1;background:linear-gradient(110deg,#f5fcfd,#fff); }
.session-usage-header .eyebrow { font-size:7px; }
.session-usage-header h2 { margin:5px 0 0;color:#173b5e;font-size:15px; }
.session-usage-header p { margin:4px 0 0;color:#74889d;font-size:8px; }
.session-usage-period { padding:7px 10px;color:#087b69;background:#e8f8f2;border:1px solid #bee5d7;border-radius:999px;font-size:7.5px;font-weight:850;white-space:nowrap; }
.session-usage-filter { display:flex;align-items:end;gap:6px; }
.session-usage-filter label { position:absolute;overflow:hidden;width:1px;height:1px;clip:rect(0,0,0,0);white-space:nowrap; }
.session-usage-filter select { min-width:90px;height:31px;padding:5px 24px 5px 9px;color:#31506e;border:1px solid #cfe0e9;border-radius:8px;background:#fff;font:inherit;font-size:7.5px;font-weight:800; }
.session-usage-filter select[name=usage_year] { min-width:64px;padding-right:18px; }
.session-usage-filter .btn { min-height:31px;padding:6px 9px;font-size:7.5px; }
.session-usage-line-panel { height:270px;padding:12px 19px 6px;border-bottom:1px solid #e8eff3;background:linear-gradient(180deg,#fbfdfe,#fff); }
.session-usage-line-panel canvas { display:block;width:100%;height:100%; }
.session-usage-chart { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;padding:14px 19px 19px; }
.session-usage-row { display:grid;grid-template-columns:minmax(150px,1fr) minmax(150px,.95fr) minmax(86px,.5fr);align-items:center;gap:10px;padding:10px;border:1px solid #e3edf1;border-radius:10px;background:#fff; }
.session-usage-row.is-active { border-color:#a9dfda;background:linear-gradient(135deg,#f7fdfd,#f1fbfa); }
.session-usage-account { display:flex;align-items:center;gap:8px;min-width:0; }
.session-usage-account > span { display:grid;place-items:center;flex:0 0 auto;width:25px;height:25px;color:#fff;background:var(--account-color,#168fd1);border-radius:50%;box-shadow:0 4px 8px color-mix(in srgb,var(--account-color,#168fd1) 28%,transparent);font-size:8px;font-weight:850; }
.session-usage-account div { min-width:0; }
.session-usage-account strong,.session-usage-account small { display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
.session-usage-account strong { color:#31506e;font-size:8.5px; }
.session-usage-account small { margin-top:3px;color:#8293a4;font-size:7px; }
.session-usage-access,.session-usage-duration { display:block;color:#173b5e;white-space:nowrap; }
.session-usage-access small,.session-usage-access strong,.session-usage-duration small,.session-usage-duration strong { display:block; }
.session-usage-access small,.session-usage-duration small { margin-bottom:3px;color:#8293a4;font-size:7px;font-weight:700; }
.session-usage-access strong,.session-usage-duration strong { overflow:hidden;font-size:8.2px;text-overflow:ellipsis; }
.session-usage-duration { text-align:right; }.session-usage-duration strong { font-size:8.5px; }
.session-usage-empty { min-height:122px; }
.session-table-panel table { min-width:1210px; }
.session-table-panel td { vertical-align:middle; }
.session-table-panel .account-name-cell > div { min-width:0; }
.session-table-panel .account-name-cell strong,.session-table-panel .account-name-cell small { display:block; }
.session-table-panel .account-name-cell small { margin-top:2px;color:#8797a8;font-size:7.5px; }
.session-device { display:inline-flex;align-items:center;gap:7px;color:#45617a;font-size:8.5px;font-weight:700;white-space:nowrap; }
.session-device i { display:grid;place-items:center;width:23px;height:23px;color:#007f9e;background:#e8f5f7;border-radius:7px;font-size:9px;font-style:normal; }
.session-ip { padding:5px 7px;color:#315e74;background:#f0f6f8;border:1px solid #dce9ed;border-radius:6px;font-family:inherit;font-size:8px;white-space:nowrap; }
.session-status { display:inline-flex;align-items:center;gap:6px;padding:6px 9px;border:1px solid #bee5d7;border-radius:999px;color:#087b69;background:#e8f8f2;font-size:7.5px;font-weight:850;white-space:nowrap; }
.session-status i { width:6px;height:6px;background:#11ad8f;border-radius:50%;box-shadow:0 0 0 3px rgba(17,173,143,.13); }
.session-time { display:block;min-width:114px;white-space:nowrap; }
.session-time strong,.session-time small { display:block; }
.session-time strong { color:#31506e;font-size:8.5px;font-weight:800; }
.session-time small { margin-top:3px;color:#8092a5;font-size:7.5px; }
.session-current-badge { display:inline-flex;padding:6px 9px;color:#087b69;background:#e8f8f2;border:1px solid #bee5d7;border-radius:999px;font-size:7.5px;font-weight:850;white-space:nowrap; }
.session-reset-button { min-height:30px;padding:0 10px;border-radius:8px;font-size:7.5px;white-space:nowrap; }
.session-reset-button:hover { color:#fff;background:#bd4651;border-color:#bd4651;box-shadow:0 6px 13px rgba(189,70,81,.19); }
.session-reset-warning { display:grid;place-items:center;width:48px;height:48px;margin:0 auto 13px;color:#fff;background:linear-gradient(145deg,#005aa9,#00aaa6);border-radius:15px;box-shadow:0 9px 20px rgba(0,90,169,.22);font-size:24px;font-weight:850; }
@media (max-width:800px) {
    .session-filter-form { grid-template-columns:1fr 1fr; }
    .session-filter-form .filter-actions { grid-column:span 2; }
}
@media (max-width:600px) {
    .session-account-heading { align-items:flex-start; }
    .session-live-indicator { margin-top:8px; }
    .session-stat-grid { grid-template-columns:1fr; }
    .session-filter-form { grid-template-columns:1fr; }
    .session-filter-form .filter-actions { grid-column:auto; }
    .session-table-header { align-items:flex-start;flex-direction:column; }
    .session-usage-header { align-items:flex-start;flex-direction:column;gap:9px; }
    .session-usage-filter { width:100%; }
    .session-usage-filter select:first-of-type { flex:1; }
    .session-usage-chart { grid-template-columns:1fr; }
    .session-usage-row { grid-template-columns:1fr;gap:7px; }
    .session-usage-duration { text-align:left; }
}

/* Brand sidebar JAKSA. */
.brand.brand-jaksa {
    align-items:center;
    flex-direction:column;
    gap:5px;
    min-height:61px;
    padding:3px 10px 17px;
}
.brand-jaksa-wordmark {
    display:block;
    width:112px;
    height:auto;
    object-fit:contain;
    filter:drop-shadow(0 4px 7px rgba(0,82,155,.11));
}
.brand-jaksa-expansion {
    color:#5d748a;
    font-size:6.2px;
    font-weight:700;
    letter-spacing:.02px;
    line-height:1.35;
    text-align:center;
    white-space:nowrap;
}
.brand-jaksa-expansion b {
    color:#005aa9;
    background:linear-gradient(135deg,#005aa9,#0785c7 56%,#00aaa6);
    background-clip:text;
    -webkit-background-clip:text;
    -webkit-text-fill-color:transparent;
    font-size:1.08em;
    font-weight:900;
}
.brand-jaksa-expansion i { color:#9ab0be;font-style:normal; }
@media (min-width:901px) {
    .sidebar {
        transition:
            width .38s cubic-bezier(.22,1,.36,1),
            padding .38s cubic-bezier(.22,1,.36,1),
            transform .38s cubic-bezier(.22,1,.36,1),
            box-shadow .38s ease;
    }
    .content-shell { transition:margin-left .38s cubic-bezier(.22,1,.36,1),border-radius .38s ease; }
    .brand.brand-jaksa {
        overflow:hidden;
        transition:min-height .34s cubic-bezier(.22,1,.36,1),padding .34s cubic-bezier(.22,1,.36,1),gap .28s ease;
    }
    .brand-jaksa-wordmark {
        transform-origin:center;
        transition:width .38s cubic-bezier(.22,1,.36,1),transform .38s cubic-bezier(.22,1,.36,1),filter .3s ease;
        will-change:width,transform;
    }
    .brand-jaksa-expansion {
        display:block!important;
        max-width:180px;
        max-height:18px;
        overflow:hidden;
        opacity:1;
        visibility:visible;
        transform:translateY(0) scale(1);
        transform-origin:top center;
        transition:max-width .32s cubic-bezier(.22,1,.36,1),max-height .28s ease,opacity .2s ease .1s,transform .3s cubic-bezier(.22,1,.36,1),visibility 0s linear 0s;
    }
    .nav-link { transition:color .18s ease,background-color .18s ease,box-shadow .18s ease,transform .18s ease,font-size .28s ease,padding .32s cubic-bezier(.22,1,.36,1),gap .28s ease; }
    .nav-link .nav-icon { transition:color .18s ease,background .18s ease,border-color .18s ease,box-shadow .18s ease,transform .28s cubic-bezier(.22,1,.36,1),width .3s ease,height .3s ease,flex-basis .3s ease; }
    .nav-link-text {
        display:block;
        max-width:145px;
        overflow:hidden;
        opacity:1;
        visibility:visible;
        transform:translateX(0);
        white-space:nowrap;
        transition:max-width .34s cubic-bezier(.22,1,.36,1),opacity .2s ease .1s,transform .3s cubic-bezier(.22,1,.36,1),visibility 0s linear 0s;
    }
    .main-nav > .nav-label {
        display:block!important;
        max-height:20px;
        overflow:hidden;
        opacity:1;
        visibility:visible;
        transform:translateX(0);
        transition:max-height .3s cubic-bezier(.22,1,.36,1),margin .3s cubic-bezier(.22,1,.36,1),opacity .2s ease .1s,transform .3s cubic-bezier(.22,1,.36,1),visibility 0s linear 0s;
    }
    .nav-group.open > .nav-submenu {
        max-height:640px;
        overflow:hidden;
        opacity:1;
        visibility:visible;
        transform:translateX(0);
        transition:max-height .34s cubic-bezier(.22,1,.36,1),margin .3s ease,padding .3s ease,opacity .22s ease .08s,transform .3s cubic-bezier(.22,1,.36,1),visibility 0s linear 0s;
    }
    html.sidebar-collapsed .brand.brand-jaksa { min-height:50px;padding-inline:0;gap:0; }
    html.sidebar-collapsed .brand-jaksa-wordmark { width:46px;transform:translateY(2px); }
    html.sidebar-collapsed .brand.brand-jaksa > .brand-jaksa-expansion:last-child {
        display:block!important;
        max-width:0;
        max-height:0;
        opacity:0;
        visibility:hidden;
        transform:translateY(-5px) scale(.94);
        transition:max-width .24s ease,max-height .22s ease,opacity .14s ease,transform .24s ease,visibility 0s linear .24s;
    }
    html.sidebar-collapsed .nav-link .nav-icon { flex-basis:32px; }
    html.sidebar-collapsed .nav-link { font-size:10.5px; }
    html.sidebar-collapsed .nav-link-text {
        max-width:0;
        opacity:0;
        visibility:hidden;
        transform:translateX(-7px);
        transition:max-width .26s ease,opacity .12s ease,transform .22s ease,visibility 0s linear .25s;
    }
    html.sidebar-collapsed .main-nav > .nav-label {
        display:block!important;
        max-height:0;
        margin-top:0;
        margin-bottom:0;
        opacity:0;
        visibility:hidden;
        transform:translateX(-7px);
        transition:max-height .22s ease,margin .24s ease,opacity .1s ease,transform .2s ease,visibility 0s linear .22s;
    }
    html.sidebar-collapsed .nav-group.open > .nav-submenu {
        display:block!important;
        max-height:0;
        margin-top:0;
        margin-bottom:0;
        padding-top:0;
        padding-bottom:0;
        opacity:0;
        visibility:hidden;
        transform:translateX(-8px);
        transition:max-height .22s ease,margin .22s ease,padding .22s ease,opacity .1s ease,transform .2s ease,visibility 0s linear .22s;
    }
}

@media (prefers-reduced-motion:reduce) and (min-width:901px) {
    .sidebar,.content-shell,.brand.brand-jaksa,.brand-jaksa-wordmark,.brand-jaksa-expansion,.nav-link,.nav-link .nav-icon,.nav-link-text,.main-nav > .nav-label,.nav-group.open > .nav-submenu { transition:none!important; }
}

/* Navbar dashboard tetap terlihat ketika halaman digulir. */
.content-shell { overflow:visible; }
.topbar {
    position:sticky;
    top:0;
    z-index:60;
    flex:0 0 auto;
    border-radius:0 18px 0 0;
}
@media (max-width:900px) {
    .topbar { border-radius:0; }
}

/* ========================================================================== */
/* Responsive application layer                                               */
/* Menyatukan perilaku mobile tanpa mengubah komposisi tampilan desktop.       */
/* ========================================================================== */
@media (max-width:900px) {
    :root { --mobile-gutter:14px; }

    html,body { max-width:100%;overflow-x:hidden; }
    body { min-width:0; }
    .app-shell,.content-shell,.main-content { min-width:0; }
    .content-shell { width:100%;margin-left:0; }

    .sidebar {
        width:min(286px,86vw);
        max-width:100%;
        padding:16px 14px;
        overflow-x:hidden;
        overflow-y:auto;
        overscroll-behavior:contain;
        transform:translate3d(-102%,0,0);
        transition:transform .3s cubic-bezier(.22,1,.36,1),box-shadow .3s ease;
        will-change:transform;
    }
    .sidebar.open {
        transform:translate3d(0,0,0);
        box-shadow:18px 0 45px rgba(0,48,91,.2);
    }
    .sidebar.open + .sidebar-backdrop {
        position:fixed;
        inset:0;
        z-index:35;
        display:block;
        background:rgba(12,35,56,.46);
        border:0;
        backdrop-filter:blur(2px);
        animation:mobile-backdrop-in .2s ease both;
    }
    .brand.brand-jaksa { flex-shrink:0; }
    .main-nav { min-height:max-content; }
    .nav-link { min-height:44px; }
    .nav-sublink { min-height:36px; }

    .topbar {
        min-height:60px;
        padding:7px var(--mobile-gutter);
        gap:9px;
    }
    .menu-toggle {
        display:grid;
        flex:0 0 38px;
        width:38px;
        height:38px;
        margin-right:0;
        place-items:center;
        border-radius:10px;
    }
    .topbar-title { flex:1;min-width:0; }
    .topbar-title span,.topbar-title strong {
        overflow:hidden;
        text-overflow:ellipsis;
        white-space:nowrap;
    }
    .topbar-meta { flex:0 0 auto;gap:7px;margin-left:0; }
    .topbar-icon { flex:0 0 38px;width:38px;height:38px;border-radius:10px; }
    .date-pill { min-height:38px;padding:7px 9px;gap:7px; }
    .date-pill-time { padding-left:7px; }
    .topbar-profile-trigger { min-height:38px; }

    .topbar-notification-dropdown,
    .topbar-profile-dropdown {
        position:fixed;
        top:68px;
        right:12px;
        left:auto;
        width:min(360px,calc(100vw - 24px));
        max-height:calc(100dvh - 80px);
    }
    .topbar-notification-list { max-height:min(320px,calc(100dvh - 260px)); }

    .main-content { padding:20px var(--mobile-gutter) 34px; }
    .footer { padding:14px var(--mobile-gutter); }

    .page-heading,.dashboard-intro,.heading-actions,.pks-page-heading,.pks-detail-heading {
        min-width:0;
        gap:12px;
    }
    .page-heading h1,.dashboard-intro h1 { font-size:clamp(19px,4.5vw,23px);line-height:1.25; }
    .page-heading p,.dashboard-intro p:not(.eyebrow) { max-width:70ch;line-height:1.6; }
    .heading-button-group,.intro-actions { flex-wrap:wrap; }

    .reference-top-grid,.reference-chart-grid,.analytics-layout,.pks-detail-layout { grid-template-columns:1fr; }
    .reference-data-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .mini-analytics-card { grid-column:span 2; }

    .panel,.reference-panel,.filter-panel,.register-panel,.form-section,.single-detail { min-width:0; }
    .panel-header { flex-wrap:wrap;padding:14px 15px; }
    .filter-panel { padding:14px; }
    .form-section { padding:17px; }

    .table-wrap {
        position:relative;
        max-width:100%;
        overflow-x:auto;
        overflow-y:hidden;
        overscroll-behavior-inline:contain;
        scrollbar-width:thin;
        -webkit-overflow-scrolling:touch;
    }
    .table-wrap table { min-width:760px; }
    .pks-table-panel .table-wrap table { min-width:1080px; }
    .session-table-panel .table-wrap table { min-width:1210px; }
    .distribution-table-panel .table-wrap table,
    .distribution-outgoing-panel .table-wrap table,
    .progress-document-panel .table-wrap table,
    .agendaris-table-panel .table-wrap table { min-width:920px; }
    th,td { padding:11px; }

    .modal-dialog,.pks-detail-popup-dialog { max-width:calc(100vw - 28px); }
}

@media (max-width:700px) {
    :root { --mobile-gutter:12px; }

    .topbar { min-height:58px;padding-block:6px; }
    .menu-toggle,.topbar-icon { flex-basis:36px;width:36px;height:36px; }
    .date-pill { display:none; }
    .topbar-profile-trigger { min-height:36px;padding:3px 6px; }
    .topbar-profile-avatar { flex-basis:30px;width:30px;height:30px;border-radius:9px; }
    .topbar-profile-copy { display:none; }
    .topbar-profile-chevron { margin-left:0; }
    .topbar-notification-dropdown,.topbar-profile-dropdown { top:64px;right:10px;width:calc(100vw - 20px); }

    .main-content { padding:16px var(--mobile-gutter) 28px; }
    .footer { align-items:flex-start;flex-direction:column;gap:5px;padding-inline:var(--mobile-gutter); }

    .geo-landing-page { height:auto;min-height:100dvh;overflow-x:hidden;overflow-y:auto; }
    .geo-landing-header { height:70px;padding-inline:18px; }
    .geo-landing-main {
        height:auto;
        min-height:calc(100dvh - 70px);
        padding:42px 18px 34px;
    }
    .geo-landing-copy { width:100%;max-width:560px; }
    .geo-landing-copy h1.geo-landing-wordmark { width:min(100%,520px); }
    .geo-landing-description { max-width:95%; }
    .geo-primary-action { min-height:44px; }
    .landing-login-dialog { max-height:94dvh; }
    .login-shell { width:min(100% - 24px,680px);margin:12px auto; }

    .page-heading,.dashboard-intro,.heading-actions,.pks-page-heading,.pks-detail-heading {
        align-items:flex-start;
        flex-direction:column;
        margin-bottom:16px;
    }
    .page-heading > div:first-child,.dashboard-intro > div:first-child { min-width:0;width:100%; }
    .heading-actions > div:first-child { min-width:0; }
    .heading-button-group,.intro-actions,.agendaris-heading-actions { width:100%; }
    .heading-button-group .btn,.intro-actions .btn,.agendaris-heading-actions > .btn,.agendaris-heading-actions > form { flex:1; }
    .agendaris-heading-actions > form .btn { width:100%; }

    .metric-strip,.pks-summary-grid,.pks-detail-summary,.account-stat-grid,.company-metrics {
        grid-template-columns:repeat(2,minmax(0,1fr));
        gap:9px;
    }
    .metric-card,.pks-summary-card,.company-metric { min-width:0; }
    .analytics-side,.reference-data-grid { grid-template-columns:1fr; }
    .mini-analytics-card { grid-column:auto; }
    .analytics-kpis { grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;padding-inline:14px; }

    .filter-form,.distribution-filter-form,.agendaris-filter-form,.account-filter-form,.session-filter-form,.pks-filter-form {
        grid-template-columns:1fr;
    }
    .search-group,
    .distribution-filter-form .search-group,
    .agendaris-filter-form .search-group,
    .account-filter-form .filter-actions,
    .session-filter-form .filter-actions { grid-column:auto; }
    .filter-actions { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));width:100%;gap:7px; }
    .filter-actions .btn { width:100%; }

    .form-grid,.modal-form-grid,.agendaris-form-grid,.pks-child-grid,.pks-item-grid,.pks-popup-grid,
    .detail-list.grid-two,.modal-detail-grid,.agendaris-detail-grid,.pks-detail-list {
        grid-template-columns:1fr;
    }
    .span-2,.modal-span-2,.detail-list .full-detail,.pks-detail-list .wide { grid-column:auto; }
    .section-heading { align-items:flex-start; }
    .form-actions-sticky { bottom:8px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));padding:10px; }
    .form-actions-sticky .btn { width:100%; }

    .progress-document-tabs {
        display:flex;
        gap:7px;
        padding:5px;
        overflow-x:auto;
        scroll-snap-type:x proximity;
        scrollbar-width:none;
        -webkit-overflow-scrolling:touch;
    }
    .progress-document-tabs::-webkit-scrollbar { display:none; }
    .progress-document-tab { flex:0 0 min(250px,78vw);scroll-snap-align:start; }

    .outgoing-distribution-steps {
        justify-content:flex-start;
        gap:7px;
        overflow-x:auto;
        overflow-y:hidden;
        scroll-padding-inline:14px;
        overscroll-behavior-inline:contain;
        scrollbar-width:none;
    }
    .outgoing-distribution-steps::-webkit-scrollbar { display:none; }
    .outgoing-distribution-steps span { flex:0 0 auto;white-space:nowrap; }
    .outgoing-distribution-steps i { flex:0 0 24px;width:24px; }

    .input-modal,.detail-modal,.edit-modal,.delete-modal,.account-modal,
    .agendaris-form-modal,.agendaris-detail-modal,.agendaris-delete-modal,
    .distribution-action-modal,.pks-main-modal,.pks-delete-modal {
        align-items:end;
        padding:0;
    }
    .modal-dialog,.detail-modal-dialog,.edit-modal-dialog,.account-modal-dialog,
    .agendaris-modal-dialog,.distribution-action-dialog,.pks-main-modal-dialog,
    .pks-detail-popup-dialog,.delete-modal-dialog {
        width:100%;
        max-width:none;
        max-height:94dvh;
        border-radius:16px 16px 0 0;
    }
    .modal-header { flex:0 0 auto;padding:13px 15px; }
    .modal-title-group { min-width:0; }
    .modal-title-group > div { min-width:0; }
    .modal-title-group h2 { overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
    .modal-body,.modal-body.input-modal-body,.edit-modal-body,.pks-detail-popup-body { padding:15px; }
    .modal-footer { flex:0 0 auto;flex-wrap:wrap;padding:10px 15px; }
    .modal-footer .btn { flex:1; }
    .modal-submit-status { flex:1 0 100%;margin:0 0 3px;text-align:center; }
    .delete-modal-body { padding:24px 18px 18px; }
    .delete-modal-actions { padding:11px 15px; }
    .outgoing-distribution-step { margin:12px 14px 16px;padding:14px; }

    .table-list-footer { align-items:flex-start;flex-direction:column;gap:8px;padding:11px 13px; }
    .table-list-footer .pagination-wrap,.pagination-wrap {
        justify-content:flex-start;
        width:100%;
        margin-left:0;
        padding:7px 0;
        overflow-x:auto;
    }
    .pagination { min-width:max-content; }
    .table-length-form { width:100%; }

    .session-table-header,.distribution-section-title { align-items:flex-start;flex-direction:column; }
    .pks-table-realtime { justify-content:flex-start; }
    .pks-inline-form { margin:12px;padding:14px; }
    .pks-inline-actions { display:grid;grid-template-columns:repeat(2,minmax(0,1fr)); }
    .pks-inline-actions .btn { width:100%; }
    .pks-timeline { padding-right:0; }

    .success-toast { top:64px;right:10px;left:10px;width:auto;max-height:calc(100dvh - 80px); }
    .alert { grid-template-columns:auto minmax(0,1fr) auto;padding:10px 11px; }
}

@media (max-width:460px) {
    :root { --mobile-gutter:10px; }

    .topbar { gap:7px; }
    .topbar-title span { display:none; }
    .topbar-title strong { font-size:10.5px; }
    .topbar-profile-chevron { display:none; }
    .topbar-notification-dropdown,.topbar-profile-dropdown { right:8px;width:calc(100vw - 16px); }
    .topbar-notification-summary { grid-template-columns:1fr; }
    .topbar-notification-list { max-height:calc(100dvh - 290px); }

    .main-content { padding-top:13px; }
    .page-heading h1,.dashboard-intro h1 { font-size:19px; }
    .heading-button-group,.intro-actions,.agendaris-heading-actions { display:grid;grid-template-columns:1fr; }
    .heading-button-group .btn,.intro-actions .btn,.agendaris-heading-actions > .btn,.agendaris-heading-actions > form { width:100%; }

    .metric-strip,.pks-summary-grid,.pks-detail-summary,.account-stat-grid,.company-metrics,.analytics-kpis {
        grid-template-columns:1fr;
    }
    .metric-card { min-height:70px; }
    .pks-summary-card { min-height:68px;padding:11px 13px; }

    .panel-header { align-items:flex-start;flex-direction:column;gap:7px; }
    .panel-header > * { max-width:100%; }
    .filter-actions,.form-actions-sticky,.pks-inline-actions,.delete-modal-actions { grid-template-columns:1fr; }

    .modal-header { gap:8px; }
    .modal-title-icon { flex:0 0 33px;width:33px;height:33px; }
    .modal-footer { display:grid;grid-template-columns:1fr;width:100%; }
    .modal-footer .btn { width:100%; }
    .detail-record-times { align-items:flex-start;flex-direction:column;gap:5px; }
    .detail-record-times p + p { padding-left:0;border-left:0; }

    .pks-wizard-steps { grid-template-columns:1fr 10px 1fr 10px 1fr 10px 1fr;padding-inline:7px; }
    .pks-wizard-steps > button > span { flex-basis:27px;height:27px; }
    .pks-wizard-steps > i { min-width:0; }
    .pks-timeline { padding-left:48px; }
    .pks-timeline::before { left:24px; }
    .pks-timeline-number { left:-38px;width:31px;height:31px; }

    .duplicate-tab-page { padding:12px; }
    .duplicate-tab-card { padding:32px 20px;border-radius:15px; }
    .duplicate-tab-card h1 { font-size:20px; }
    .duplicate-tab-card > span:not(.duplicate-tab-icon) { font-size:10px; }

    .geo-landing-header { padding-inline:14px; }
    .geo-brand-logo { width:142px;height:56px; }
    .geo-brand-logo img { top:-20px;left:-24px;width:190px; }
    .geo-landing-main { padding:34px 15px 28px; }
    .geo-landing-kicker { gap:8px;letter-spacing:1.5px; }
    .geo-landing-kicker::before { width:22px; }
    .geo-landing-copy h1.geo-landing-wordmark { width:100%; }
    .geo-landing-copy h2.geo-landing-acronym { gap:3px 6px;font-size:11px;line-height:1.55; }
    .geo-landing-description { max-width:100%;font-size:9px; }
    .geo-primary-action { width:100%; }

    .login-shell { width:100%;min-height:100dvh;margin:0;border-radius:0; }
    .login-brand-panel { min-height:170px;padding:24px 22px; }
    .login-brand-copy { margin:24px 0 10px; }
    .login-form-panel { padding:28px 20px; }
}

@media (max-height:540px) and (max-width:900px) {
    .sidebar { padding-block:10px; }
    .brand.brand-jaksa { min-height:48px;padding-bottom:8px; }
    .brand-jaksa-wordmark { width:92px; }
    .brand-jaksa-expansion { display:none; }
}

@media (prefers-reduced-motion:reduce) and (max-width:900px) {
    .sidebar,.sidebar-backdrop { animation:none!important;transition:none!important; }
}

@keyframes mobile-backdrop-in { from { opacity:0; } to { opacity:1; } }

/* Penanda field wajib dipusatkan di sini agar seluruh form dan modal konsisten. */
label .required-label-title {
    display:inline-flex;
    align-items:baseline;
    min-width:0;
    width:auto;
    max-width:100%;
    gap:3px;
    overflow-wrap:anywhere;
}

label .required-marker,
label span.required {
    display:inline;
    flex:0 0 auto;
    margin-left:1px;
    color:#d7263d!important;
    font-weight:900;
    line-height:1;
}

label .required-marker[hidden],
label span.required[hidden] {
    display:none!important;
}

/* Dashboard Administrator */
.admin-dashboard-hero {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:24px;
    margin-bottom:18px;
    padding:23px 25px;
    color:#fff;
    border-radius:18px;
    background:linear-gradient(125deg,#003f78 0%,#006da6 56%,#00a49d 100%);
    box-shadow:0 14px 30px rgba(0,69,118,.16);
}
.admin-dashboard-welcome,.admin-dashboard-hero-actions,.admin-dashboard-account-link,.admin-module-heading { display:flex;align-items:center; }
.admin-dashboard-welcome { gap:17px;min-width:0; }
.admin-dashboard-avatar {
    display:grid;
    flex:0 0 58px;
    width:58px;
    height:58px;
    place-items:center;
    color:#00548d;
    font-size:17px;
    font-weight:900;
    border:2px solid rgba(255,255,255,.55);
    border-radius:16px;
    background:#fff;
}
.admin-dashboard-kicker,.admin-dashboard-section-heading span,.admin-dashboard-panel > header div > span,.admin-module-heading > div > span {
    display:block;
    margin-bottom:4px;
    font-size:10px;
    font-weight:900;
    letter-spacing:1.2px;
}
.admin-dashboard-welcome h1 { margin:0;font-size:24px;line-height:1.22; }
.admin-dashboard-welcome p { margin:5px 0 0;color:rgba(255,255,255,.78);font-size:12px; }
.admin-dashboard-hero-actions { flex:0 0 auto;gap:9px; }
.admin-dashboard-account-link,.admin-dashboard-print {
    min-height:48px;
    padding:8px 14px;
    color:#fff;
    border:1px solid rgba(255,255,255,.3);
    border-radius:12px;
    background:rgba(255,255,255,.12);
}
.admin-dashboard-account-link { gap:9px;text-decoration:none; }
.admin-dashboard-account-link > span:first-child { font-size:21px; }
.admin-dashboard-account-link strong,.admin-dashboard-account-link small { display:block; }
.admin-dashboard-account-link strong { font-size:12px; }
.admin-dashboard-account-link small { margin-top:2px;color:rgba(255,255,255,.72);font-size:9px; }
.admin-dashboard-print { cursor:pointer;font-family:inherit;font-size:11px;font-weight:800; }
.admin-dashboard-account-link:hover,.admin-dashboard-print:hover { background:rgba(255,255,255,.2); }

.admin-dashboard-overview { display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:13px;margin-bottom:22px; }
.admin-overview-card {
    --admin-tone:#0075b6;
    --admin-tint:#e4f4fb;
    display:flex;
    align-items:center;
    gap:13px;
    min-width:0;
    padding:16px;
    border:1px solid #d7e4ec;
    border-top:3px solid var(--admin-tone);
    border-radius:14px;
    background:#fff;
    box-shadow:0 8px 22px rgba(23,55,87,.055);
}
.admin-overview-card.red { --admin-tone:#db3348;--admin-tint:#ffeaed; }
.admin-overview-card.teal { --admin-tone:#009e91;--admin-tint:#ddf7f2; }
.admin-overview-card.purple { --admin-tone:#7053c7;--admin-tint:#eeeafd; }
.admin-overview-icon { display:grid;flex:0 0 46px;width:46px;height:46px;place-items:center;color:var(--admin-tone);font-size:19px;font-weight:900;border-radius:13px;background:var(--admin-tint); }
.admin-overview-card > div { min-width:0; }
.admin-overview-card small { display:block;color:#8392a6;font-size:9px;font-weight:900;letter-spacing:.65px;text-transform:uppercase; }
.admin-overview-card strong { display:block;margin-top:2px;color:#103c69;font-size:24px;line-height:1.15; }
.admin-overview-card p { overflow:hidden;margin:4px 0 0;color:#8795a8;font-size:9.5px;line-height:1.35;text-overflow:ellipsis;white-space:nowrap; }

.admin-visual-grid { display:grid;grid-template-columns:minmax(0,1.55fr) minmax(310px,.65fr);gap:14px;margin-bottom:22px; }
.admin-trend-panel > header,.admin-donut-panel > header { padding:15px 18px; }
.admin-chart-summary { display:block;text-align:right; }
.admin-chart-summary strong,.admin-chart-summary small { display:block; }
.admin-chart-summary strong { color:#0879ad;font-size:20px; }
.admin-chart-summary small { margin-top:2px;color:#8c99a9;font-size:8px;font-weight:800; }
.admin-line-chart { display:flex;gap:11px;padding:17px 18px 12px; }
.admin-chart-y-axis { display:flex;flex:0 0 25px;flex-direction:column;justify-content:space-between;height:180px;padding:2px 0 27px;color:#9ba7b5;font-size:7.5px;text-align:right; }
.admin-chart-canvas { min-width:0;flex:1; }
.admin-chart-canvas svg { display:block;width:100%;height:180px;overflow:visible; }
.admin-chart-grid-line { stroke:#e6edf1;stroke-width:1;stroke-dasharray:4 5; }
.admin-chart-line { fill:none;stroke:#007daf;stroke-width:4;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke; }
.admin-chart-point { fill:#00a49d;stroke:#fff;stroke-width:3;vector-effect:non-scaling-stroke; }
.admin-chart-value { fill:#174a70;font-size:12px;font-weight:900; }
.admin-chart-x-axis { display:grid;grid-template-columns:repeat(6,minmax(0,1fr));margin-top:-19px; }
.admin-chart-x-axis span { display:block;color:#4e647b;font-size:8px;font-weight:900;text-align:center; }
.admin-chart-x-axis span:first-child { text-align:left; }
.admin-chart-x-axis span:last-child { text-align:right; }
.admin-chart-x-axis small { display:block;margin-top:1px;color:#a0abb8;font-size:7px;font-weight:600; }
.admin-trend-panel > footer { display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 18px 13px;border-top:1px solid #edf1f4; }
.admin-trend-panel > footer span { color:#486078;font-size:8.5px;font-weight:800; }
.admin-trend-panel > footer i { display:inline-block;width:17px;height:3px;margin-right:6px;vertical-align:middle;border-radius:99px;background:linear-gradient(90deg,#007daf,#00a49d); }
.admin-trend-panel > footer small { color:#96a2b0;font-size:7.5px;text-align:right; }
.admin-donut-content { display:grid;grid-template-columns:140px minmax(0,1fr);align-items:center;gap:18px;padding:21px 18px 23px; }
.admin-donut-chart { position:relative;display:grid;width:140px;height:140px;place-items:center;border-radius:50%;box-shadow:0 10px 22px rgba(19,69,104,.12); }
.admin-donut-chart::after { content:"";position:absolute;inset:25px;border:1px solid #e3ebf0;border-radius:50%;background:#fff;box-shadow:inset 0 3px 10px rgba(18,63,109,.05); }
.admin-donut-chart > div { position:relative;z-index:1;text-align:center; }
.admin-donut-chart strong,.admin-donut-chart small { display:block; }
.admin-donut-chart strong { color:#123f6d;font-size:22px;line-height:1; }
.admin-donut-chart small { margin-top:5px;color:#8f9dad;font-size:8px;font-weight:800;text-transform:uppercase; }
.admin-donut-legend { display:grid;gap:9px;min-width:0; }
.admin-donut-legend > div { --legend-tone:#087bb8;display:grid;grid-template-columns:9px minmax(0,1fr) auto;align-items:center;gap:8px; }
.admin-donut-legend > div.purple { --legend-tone:#7152c2; }
.admin-donut-legend > div.orange { --legend-tone:#e18a12; }
.admin-donut-legend > div.teal { --legend-tone:#009e91; }
.admin-donut-legend > div.navy { --legend-tone:#153e6c; }
.admin-donut-legend i { width:8px;height:8px;border-radius:3px;background:var(--legend-tone); }
.admin-donut-legend span { min-width:0; }
.admin-donut-legend strong,.admin-donut-legend small { display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
.admin-donut-legend strong { color:#38526d;font-size:9px; }
.admin-donut-legend small { margin-top:1px;color:#97a3b1;font-size:7.5px; }
.admin-donut-legend b { color:var(--legend-tone);font-size:10px; }

.admin-dashboard-section { margin-top:3px; }
.admin-dashboard-section-heading { display:flex;align-items:flex-end;justify-content:space-between;margin-bottom:12px; }
.admin-dashboard-section-heading span,.admin-dashboard-panel > header div > span { color:#008f99; }
.admin-dashboard-section-heading h2,.admin-dashboard-panel h2 { margin:0;color:#073e75;font-size:19px; }
.admin-dashboard-section-heading p,.admin-dashboard-panel header p { margin:4px 0 0;color:#8897aa;font-size:10.5px; }
.admin-module-grid { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px; }
.admin-module-card {
    --module-tone:#0379b8;
    --module-tint:#e8f5fb;
    overflow:hidden;
    border:1px solid #d7e4ec;
    border-radius:16px;
    background:#fff;
    box-shadow:0 8px 24px rgba(23,55,87,.055);
}
.admin-module-card.purple { --module-tone:#7152c2;--module-tint:#f0edfc; }
.admin-module-card.orange { --module-tone:#d77b08;--module-tint:#fff1dc; }
.admin-module-card.teal { --module-tone:#00988c;--module-tint:#e2f6f2; }
.admin-module-card > header { display:flex;align-items:center;justify-content:space-between;gap:12px;padding:15px 17px;border-bottom:1px solid #e4ebf0; }
.admin-module-heading { gap:11px;min-width:0; }
.admin-module-icon { display:grid;flex:0 0 42px;width:42px;height:42px;place-items:center;color:#fff;font-size:17px;font-weight:900;border-radius:12px;background:var(--module-tone);box-shadow:0 7px 15px color-mix(in srgb,var(--module-tone) 22%,transparent); }
.admin-module-heading > div { min-width:0; }
.admin-module-heading > div > span { margin-bottom:2px;color:var(--module-tone);font-size:8px; }
.admin-module-heading h3 { margin:0;color:#153d65;font-size:15px; }
.admin-module-heading p { margin:2px 0 0;color:#8a98a9;font-size:9px; }
.admin-module-card > header > a { flex:0 0 auto;color:var(--module-tone);font-size:10px;font-weight:900;text-decoration:none; }
.admin-module-metrics { display:grid;grid-template-columns:repeat(2,minmax(0,1fr)); }
.admin-module-metric { display:block;min-width:0;padding:14px 17px;color:inherit;border-right:1px solid #ebf0f4;border-bottom:1px solid #ebf0f4;text-decoration:none;transition:background .16s ease; }
.admin-module-metric:nth-child(2n) { border-right:0; }
.admin-module-metric:nth-child(odd):nth-last-child(-n+2),.admin-module-metric:nth-child(odd):nth-last-child(-n+2) ~ .admin-module-metric { border-bottom:0; }
.admin-module-metric:hover { background:var(--module-tint); }
.admin-module-metric > span { display:block;color:#8392a5;font-size:9px;font-weight:900;text-transform:uppercase; }
.admin-module-metric strong { display:block;margin:4px 0 2px;color:#123f6d;font-size:21px; }
.admin-module-metric small { display:block;overflow:hidden;color:#8997a8;font-size:9.5px;line-height:1.4;text-overflow:ellipsis;white-space:nowrap; }

.admin-dashboard-lower-grid { display:grid;grid-template-columns:minmax(320px,.85fr) minmax(440px,1.15fr);gap:14px;margin-top:14px; }
.admin-dashboard-panel { overflow:hidden;border:1px solid #d7e4ec;border-radius:16px;background:#fff;box-shadow:0 8px 24px rgba(23,55,87,.055); }
.admin-dashboard-panel > header { display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px 18px;border-bottom:1px solid #e4ebf0; }
.admin-dashboard-panel > header > strong { display:grid;min-width:43px;height:43px;padding-inline:10px;place-items:center;color:#d22f45;font-size:18px;border-radius:12px;background:#ffeaed; }
.admin-attention-list,.admin-activity-list { padding:6px 14px 10px; }
.admin-attention-item { --item-tone:#087bb8;display:grid;grid-template-columns:37px minmax(0,1fr) auto;align-items:center;gap:10px;padding:10px 3px;color:inherit;border-bottom:1px solid #edf1f4;text-decoration:none; }
.admin-attention-item:last-child,.admin-activity-item:last-child { border-bottom:0; }
.admin-attention-item.purple { --item-tone:#7152c2; }
.admin-attention-item.orange { --item-tone:#d77b08; }
.admin-attention-item.teal { --item-tone:#00988c; }
.admin-attention-count { display:grid;width:34px;height:34px;place-items:center;color:var(--item-tone);font-size:12px;font-weight:900;border-radius:10px;background:color-mix(in srgb,var(--item-tone) 11%,white); }
.admin-attention-item strong,.admin-attention-item small { display:block; }
.admin-attention-item strong { color:#294563;font-size:10.5px;line-height:1.35; }
.admin-attention-item small { margin-top:2px;color:#929eae;font-size:8.5px; }
.admin-attention-item i { color:var(--item-tone);font-style:normal;font-weight:900; }
.admin-activity-item { --activity-tone:#087bb8;display:grid;grid-template-columns:10px minmax(0,1fr) auto;gap:10px;padding:10px 3px;color:inherit;border-bottom:1px solid #edf1f4;text-decoration:none; }
.admin-activity-item.purple { --activity-tone:#7152c2; }
.admin-activity-item.orange { --activity-tone:#d77b08; }
.admin-activity-item.teal { --activity-tone:#00988c; }
.admin-activity-dot { width:8px;height:8px;margin-top:5px;border:2px solid #fff;border-radius:50%;background:var(--activity-tone);box-shadow:0 0 0 2px color-mix(in srgb,var(--activity-tone) 24%,white); }
.admin-activity-copy { min-width:0; }
.admin-activity-copy small { display:block;color:var(--activity-tone);font-size:8px;font-weight:900;letter-spacing:.6px; }
.admin-activity-copy strong { display:block;overflow:hidden;margin:2px 0;color:#294563;font-size:10.5px;text-overflow:ellipsis;white-space:nowrap; }
.admin-activity-copy p { overflow:hidden;margin:0;color:#8997a8;font-size:9px;text-overflow:ellipsis;white-space:nowrap; }
.admin-activity-item time { color:#536b84;font-size:9px;font-weight:800;text-align:right; }
.admin-activity-item time small { display:block;margin-top:2px;color:#9aa6b5;font-size:8px;font-weight:600; }
.admin-dashboard-empty { padding:35px 20px;color:#8796a9;text-align:center; }
.admin-dashboard-empty span,.admin-dashboard-empty strong { display:block; }
.admin-dashboard-empty span { font-size:24px; }
.admin-dashboard-empty strong { margin-top:5px;color:#38536e;font-size:12px; }
.admin-dashboard-empty p { margin:3px 0;font-size:10px; }

@media (max-width:1180px) {
    .admin-dashboard-overview { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .admin-visual-grid { grid-template-columns:1fr; }
    .admin-donut-content { grid-template-columns:160px minmax(0,1fr); }
    .admin-dashboard-lower-grid { grid-template-columns:1fr; }
}
@media (max-width:900px) {
    .admin-dashboard-hero { align-items:flex-start;flex-direction:column; }
    .admin-dashboard-hero-actions { width:100%; }
    .admin-dashboard-account-link,.admin-dashboard-print { flex:1;justify-content:center; }
    .admin-module-grid { grid-template-columns:1fr; }
}
@media (max-width:600px) {
    .admin-dashboard-hero { padding:18px; }
    .admin-dashboard-welcome { align-items:flex-start; }
    .admin-dashboard-welcome h1 { font-size:19px; }
    .admin-dashboard-welcome p { line-height:1.5; }
    .admin-dashboard-avatar { flex-basis:44px;width:44px;height:44px;border-radius:12px; }
    .admin-dashboard-hero-actions { align-items:stretch;flex-direction:column; }
    .admin-dashboard-overview { grid-template-columns:1fr; }
    .admin-line-chart { padding-inline:11px; }
    .admin-donut-content { grid-template-columns:1fr;justify-items:center; }
    .admin-donut-legend { width:min(100%,290px); }
    .admin-trend-panel > footer { align-items:flex-start;flex-direction:column; }
    .admin-trend-panel > footer small { text-align:left; }
    .admin-module-card > header { align-items:flex-start; }
    .admin-module-card > header > a { padding-top:5px; }
    .admin-module-metrics { grid-template-columns:1fr; }
    .admin-module-metric,.admin-module-metric:nth-child(2n),.admin-module-metric:nth-last-child(-n+2) { border-right:0;border-bottom:1px solid #ebf0f4; }
    .admin-module-metric:last-child { border-bottom:0; }
    .admin-activity-item { grid-template-columns:10px minmax(0,1fr); }
    .admin-activity-item time { grid-column:2;text-align:left; }
}

@media print {
    .admin-dashboard-hero-actions,.admin-module-card > header > a { display:none!important; }
    .admin-dashboard-hero { color:#123f6d;border:1px solid #cbdbe5;background:#fff;box-shadow:none; }
    .admin-dashboard-welcome p { color:#65788c; }
    .admin-module-grid,.admin-dashboard-lower-grid { display:block; }
    .admin-module-card,.admin-dashboard-panel { margin-bottom:12px;break-inside:avoid;box-shadow:none; }
}

.account-filter-form.deleted-data-filter-form { grid-template-columns:minmax(260px,1fr) 44px auto; }

@media (max-width:1000px) {
    .agendaris-filter-form.sdm-list-filter-form,
    .agendaris-filter-form.progress-outgoing-filter-form { grid-template-columns:repeat(2,minmax(0,1fr)); }
}

@media (max-width:600px) {
    .agendaris-filter-form.sdm-list-filter-form,
    .agendaris-filter-form.progress-outgoing-filter-form { grid-template-columns:1fr; }
    .account-filter-form.deleted-data-filter-form { grid-template-columns:44px minmax(0,1fr); }
    .account-filter-form.deleted-data-filter-form > .form-group:first-child { grid-column:1 / -1; }
    .account-filter-form.deleted-data-filter-form > .filter-actions { grid-column:2; }
    .list-order-popover { right:auto;left:0; }
    .list-order-popover::before { right:auto;left:16px; }
}
.sdm-attendance-import-panel{margin-bottom:16px}.sdm-attendance-import-form{display:grid;grid-template-columns:minmax(280px,1fr) auto;align-items:end;gap:14px;padding:17px 20px}.sdm-attendance-import-form input[type=file]{width:100%;min-height:52px;padding:8px 10px;color:#3b4b63;border:1px solid #d5e0e9;border-radius:11px;background:#fff;font:inherit}.sdm-attendance-import-form input[type=file]::file-selector-button{min-height:34px;margin-right:11px;padding:7px 13px;color:#075a8f;border:1px solid #c9dae8;border-radius:8px;background:#edf7fb;font:inherit;font-weight:800;cursor:pointer}.sdm-attendance-import-form>.btn{min-height:52px}.sdm-attendance-alert{margin-bottom:15px}.sdm-attendance-alert p{margin:3px 0 0}.sdm-attendance-filter-panel{padding:14px 16px}.sdm-attendance-period-form{display:grid;grid-template-columns:minmax(280px,520px) auto;align-items:end;gap:11px}.sdm-attendance-summary{display:grid;grid-template-columns:1.25fr repeat(3,minmax(0,1fr));gap:12px;margin-bottom:16px}.sdm-attendance-summary article{min-width:0;padding:15px 17px;border:1px solid #d9e5ec;border-top:3px solid #00a39a;border-radius:13px;background:#fff;box-shadow:0 7px 19px #143b5c0c}.sdm-attendance-summary small,.sdm-attendance-summary strong,.sdm-attendance-summary span{display:block}.sdm-attendance-summary small{color:#8898aa;font-size:9px;font-weight:900;letter-spacing:.7px}.sdm-attendance-summary strong{overflow:hidden;margin-top:4px;color:#173c64;font-size:20px;text-overflow:ellipsis;white-space:nowrap}.sdm-attendance-summary span{overflow:hidden;margin-top:3px;color:#91a0b1;font-size:9px;text-overflow:ellipsis;white-space:nowrap}.sdm-attendance-recap-panel{overflow:hidden;border-top:3px solid #08aaa3}.sdm-attendance-recap-panel>.panel-header{align-items:flex-start}.sdm-attendance-legend{display:flex;max-width:690px;flex-wrap:wrap;justify-content:flex-end;gap:7px 11px}.sdm-attendance-legend>span{display:flex;align-items:center;gap:5px;color:#63758a;font-size:8.5px;font-weight:700}.sdm-attendance-legend .attendance-code{display:grid;min-width:25px;height:25px;padding:0 4px;place-items:center;border-radius:6px}.sdm-attendance-table-scroll{overflow:auto;max-width:100%;max-height:65vh;border-top:1px solid #dfe8ee}.sdm-attendance-table{width:max-content;min-width:100%;border-collapse:separate;border-spacing:0;color:#647187;font-size:10px}.sdm-attendance-table th,.sdm-attendance-table td{height:41px;padding:8px 10px;border-right:1px solid #e1e8ed;border-bottom:1px solid #edf1f4;background:#fff;text-align:center;white-space:nowrap}.sdm-attendance-table thead th{position:sticky;z-index:4;top:0;height:43px;color:#8e9bae;border-color:#dce5ea;background:#edf3f6;font-size:8px;font-weight:900;letter-spacing:.4px;text-transform:uppercase}.sdm-attendance-table thead tr:nth-child(2) th{top:43px;color:#60728a;background:#f7fafb}.sdm-attendance-table th:last-child,.sdm-attendance-table td:last-child{border-right:0}.sdm-attendance-table tbody tr:hover td:not(.attendance-code){background:#fbfdfe}.sdm-attendance-table .attendance-fixed{position:sticky;z-index:2}.sdm-attendance-table thead .attendance-fixed{z-index:6;background:#edf3f6}.sdm-attendance-table .attendance-no{left:0;width:48px;min-width:48px}.sdm-attendance-table .attendance-nik{left:48px;width:102px;min-width:102px}.sdm-attendance-table .attendance-name{left:150px;width:195px;min-width:195px;max-width:195px;color:#354056;font-weight:750;text-align:left;overflow:hidden;text-overflow:ellipsis}.sdm-attendance-table .attendance-unit{left:345px;width:250px;min-width:250px;max-width:250px;text-align:left;overflow:hidden;text-overflow:ellipsis;box-shadow:6px 0 9px #193c5910}.sdm-attendance-table thead .attendance-name,.sdm-attendance-table thead .attendance-unit{text-align:left}.sdm-attendance-table .attendance-day-heading,.sdm-attendance-table td.attendance-code{width:42px;min-width:42px;padding-inline:4px}.sdm-attendance-table td.attendance-code{font-weight:900}.attendance-code-h{color:#08723d!important;background:#d9f8e6!important}.attendance-code-i{color:#855600!important;background:#ffef9d!important}.attendance-code-a{color:#aa1c24!important;background:#ffe0e2!important}.attendance-code-ta{color:#394d68!important;background:#e0e7ee!important}.attendance-code-off{color:#68798e!important;background:#d8dee6!important}.attendance-code-empty{color:#a3aebb!important;background:#f2f5f7!important}.sdm-attendance-table .attendance-total{min-width:48px;color:#173d65;background:#f7fafc;font-weight:900}.sdm-attendance-table .attendance-rate{min-width:72px;color:#007b72;background:#ecfaf7;font-weight:900}.sdm-attendance-table-footer{color:#7f8da0;font-size:9px}.sdm-attendance-table-footer strong{color:#3c526c}.sdm-attendance-note{padding:11px 17px;color:#718196;border-top:1px solid #e2e9ee;background:#fafcfd;font-size:9px;line-height:1.55}.sdm-attendance-note strong{color:#3b526b}.sdm-attendance-empty-panel{margin-top:0}@media(max-width:1000px){.sdm-attendance-summary{grid-template-columns:repeat(2,minmax(0,1fr))}.sdm-attendance-recap-panel>.panel-header{flex-direction:column}.sdm-attendance-legend{justify-content:flex-start}}@media(max-width:600px){.sdm-attendance-import-form,.sdm-attendance-period-form{grid-template-columns:1fr;padding:14px}.sdm-attendance-import-form>.btn{width:100%}.sdm-attendance-summary{grid-template-columns:1fr}.sdm-attendance-table-scroll{max-height:60vh}.sdm-attendance-table .attendance-name{display:none}.sdm-attendance-table .attendance-unit{left:150px;width:185px;min-width:185px;max-width:185px}.sdm-attendance-legend{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));width:100%}}

/* Compact SDM Jatim attendance workspace */
.sdm-attendance-heading{margin-bottom:14px}.sdm-attendance-import-panel{display:grid;grid-template-columns:minmax(210px,.65fr) minmax(480px,1.35fr);align-items:end;margin-bottom:11px}.sdm-attendance-import-panel>.panel-header{align-self:stretch;padding:11px 14px;border-right:1px solid #edf0f4;border-bottom:0}.sdm-attendance-import-form{grid-template-columns:minmax(260px,1fr) auto;gap:9px;padding:10px 13px}.sdm-attendance-import-form input[type=file]{min-height:40px;padding:4px 7px;border-radius:8px;font-size:9px}.sdm-attendance-import-form input[type=file]::file-selector-button{min-height:29px;margin-right:8px;padding:5px 9px;border-radius:6px;font-size:8px}.sdm-attendance-import-form>.btn{min-height:40px;padding-inline:12px}.sdm-attendance-filter-panel{margin-bottom:11px;padding:10px 13px}.sdm-attendance-period-form{grid-template-columns:minmax(240px,430px) auto;gap:8px}.sdm-attendance-period-form select{height:38px}.sdm-attendance-alert{margin-bottom:10px;padding-block:8px}.sdm-attendance-summary{grid-template-columns:1.2fr repeat(3,minmax(0,1fr));gap:8px;margin-bottom:11px}.sdm-attendance-summary article{padding:9px 12px;border-top-width:2px;border-radius:9px}.sdm-attendance-summary small{font-size:7.5px}.sdm-attendance-summary strong{margin-top:2px;font-size:16px}.sdm-attendance-summary span{margin-top:1px;font-size:7.5px}.sdm-attendance-recap-panel{border-top-width:2px}.sdm-attendance-recap-panel>.panel-header{gap:10px;padding:10px 13px}.sdm-attendance-legend{gap:4px 8px}.sdm-attendance-legend>span{gap:4px;font-size:7.5px}.sdm-attendance-legend .attendance-code{min-width:21px;height:21px;border-radius:5px;font-size:7.5px}.sdm-attendance-table-scroll{max-height:68vh}.sdm-attendance-table{font-size:8.5px}.sdm-attendance-table th,.sdm-attendance-table td{height:33px;padding:5px 7px}.sdm-attendance-table thead th{height:34px;font-size:7px}.sdm-attendance-table thead tr:nth-child(2) th{top:34px}.sdm-attendance-table .attendance-no{width:40px;min-width:40px}.sdm-attendance-table .attendance-nik{left:40px;width:88px;min-width:88px}.sdm-attendance-table .attendance-name{left:128px;width:166px;min-width:166px;max-width:166px}.sdm-attendance-table .attendance-unit{left:294px;width:205px;min-width:205px;max-width:205px}.sdm-attendance-table .attendance-day-heading,.sdm-attendance-table td.attendance-code{width:34px;min-width:34px;padding-inline:3px}.sdm-attendance-table .attendance-total{min-width:40px}.sdm-attendance-table .attendance-rate{min-width:62px}.sdm-attendance-table-footer{min-height:43px;padding:0 13px;font-size:8px}.sdm-attendance-note{padding:7px 13px;font-size:7.5px}.sdm-attendance-empty-panel .empty-state{padding-block:34px}@media(max-width:1000px){.sdm-attendance-import-panel{display:block}.sdm-attendance-import-panel>.panel-header{padding:10px 13px;border-right:0;border-bottom:1px solid #edf0f4}.sdm-attendance-import-form{padding:10px 13px}.sdm-attendance-summary{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:600px){.sdm-attendance-import-form,.sdm-attendance-period-form{grid-template-columns:1fr;padding:10px}.sdm-attendance-period-form{padding:0}.sdm-attendance-summary{grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}.sdm-attendance-summary article{padding:8px 10px}.sdm-attendance-summary strong{font-size:14px}.sdm-attendance-table .attendance-unit{left:128px;width:165px;min-width:165px;max-width:165px}.sdm-attendance-table-footer{align-items:flex-start}.sdm-attendance-table-footer span{white-space:normal}}

/* SDM Jatim attendance filters */
.sdm-attendance-period-form{grid-template-columns:minmax(190px,1.2fr) minmax(180px,1fr) repeat(2,minmax(130px,.72fr)) auto;gap:8px}
.sdm-attendance-period-form input,.sdm-attendance-period-form select{height:38px}
.sdm-attendance-filter-empty{padding-block:0!important}
.sdm-attendance-filter-empty .empty-state{padding-block:34px}
@media(max-width:1180px){.sdm-attendance-period-form{grid-template-columns:repeat(2,minmax(0,1fr))}.sdm-attendance-period-form>.filter-actions{grid-column:1/-1}}
@media(max-width:600px){.sdm-attendance-period-form{grid-template-columns:1fr}.sdm-attendance-period-form>.filter-actions{grid-column:auto}}

/* Readable summary and daily attendance views */
.sdm-attendance-view-tools{display:flex;min-width:0;flex-direction:column;align-items:flex-end;gap:8px}
.sdm-attendance-view-switch{display:inline-flex;padding:3px;border:1px solid #d7e3eb;border-radius:9px;background:#f4f8fa}
.sdm-attendance-view-switch a{min-height:30px;padding:7px 12px;color:#63758a;border-radius:6px;font-size:8px;font-weight:850;text-decoration:none;white-space:nowrap}
.sdm-attendance-view-switch a:hover{color:#006d87;background:#fff}
.sdm-attendance-view-switch a.is-active{color:#fff;background:linear-gradient(135deg,#0573b4,#00a59c);box-shadow:0 4px 10px #00799a24}
.sdm-attendance-overview-table{width:100%;min-width:980px;border-collapse:collapse;color:#5e6d83;font-size:9px}
.sdm-attendance-overview-table th,.sdm-attendance-overview-table td{height:40px;padding:8px 10px;border-bottom:1px solid #e7edf1;text-align:center;vertical-align:middle}
.sdm-attendance-overview-table th{color:#8998aa;background:#edf3f6;font-size:7.5px;font-weight:900;letter-spacing:.35px;text-transform:uppercase;white-space:nowrap}
.sdm-attendance-overview-table th:nth-child(3),.sdm-attendance-overview-table th:nth-child(4),.sdm-attendance-overview-table td:nth-child(3),.sdm-attendance-overview-table td:nth-child(4){text-align:left}
.sdm-attendance-overview-table td:nth-child(3){color:#314158}
.sdm-attendance-overview-table tbody tr:hover td{background:#f8fbfc}
.attendance-summary-badge{display:inline-grid;min-width:29px;height:25px;padding-inline:7px;place-items:center;border-radius:7px;font-weight:900}
.attendance-summary-h{color:#08723d;background:#d9f8e6}.attendance-summary-i{color:#855600;background:#ffef9d}.attendance-summary-a{color:#aa1c24;background:#ffe0e2}.attendance-summary-ta{color:#394d68;background:#e0e7ee}.attendance-summary-off{color:#68798e;background:#e8edf1}
.attendance-summary-rate{color:#007b72;font-size:10px}
.sdm-attendance-table .attendance-weekend{border-left-color:#becbd5;border-right-color:#becbd5;box-shadow:inset 2px 0 #d0dae1,inset -2px 0 #d0dae1}
.sdm-attendance-table thead .attendance-weekend{color:#5f7186;background:#dde5ea}
@media(max-width:1000px){.sdm-attendance-view-tools{width:100%;align-items:flex-start}.sdm-attendance-view-switch{align-self:flex-start}}
@media(max-width:600px){.sdm-attendance-view-switch{width:100%}.sdm-attendance-view-switch a{flex:1;text-align:center}.sdm-attendance-overview-table{min-width:860px}}

/* Editable attendance anomalies */
.sdm-attendance-anomaly-alert{display:flex;align-items:center;justify-content:space-between;gap:14px}
.sdm-attendance-anomaly-alert>.btn{flex:0 0 auto}
.sdm-attendance-anomaly-panel{overflow:hidden;margin-bottom:11px;border-top:2px solid #e8b84e}
.sdm-attendance-anomaly-panel>.panel-header{padding:10px 13px}
.sdm-attendance-anomaly-count{display:inline-flex;min-height:26px;align-items:center;padding:5px 10px;color:#805b13;border:1px solid #ecd79c;border-radius:999px;background:#fff8e5;font-size:8px;font-weight:900;white-space:nowrap}
.sdm-attendance-anomaly-scroll{overflow:auto;max-height:48vh;border-block:1px solid #e4ebef}
.sdm-attendance-anomaly-table{width:100%;min-width:1120px;border-collapse:collapse;color:#5f6f84;font-size:8.5px}
.sdm-attendance-anomaly-table th,.sdm-attendance-anomaly-table td{height:40px;padding:6px 8px;border-right:1px solid #e4eaee;border-bottom:1px solid #e9eef1;text-align:center;vertical-align:middle;white-space:nowrap}
.sdm-attendance-anomaly-table th{position:sticky;z-index:2;top:0;color:#8796a8;background:#edf3f6;font-size:7px;font-weight:900;letter-spacing:.3px;text-transform:uppercase}
.sdm-attendance-anomaly-table th:nth-child(4),.sdm-attendance-anomaly-table td:nth-child(4),.sdm-attendance-anomaly-table th:last-child,.sdm-attendance-anomaly-table td:last-child{text-align:left}
.sdm-attendance-anomaly-table input,.sdm-attendance-anomaly-table select{height:32px;min-height:32px;padding:5px 8px;border-radius:7px;font-size:8.5px}
.sdm-attendance-anomaly-table input[type=time]{width:100px}.sdm-attendance-anomaly-table select{width:130px}.sdm-attendance-anomaly-table input[type=text]{width:220px}
.sdm-attendance-anomaly-actions{display:flex;justify-content:flex-end;gap:8px;padding:10px 13px}
@media(max-width:600px){.sdm-attendance-anomaly-alert{align-items:flex-start;flex-direction:column}.sdm-attendance-anomaly-alert>.btn{width:100%}.sdm-attendance-anomaly-actions>.btn{flex:1}}

/* SDM attendance anomaly and deletion popups */
.attendance-anomaly-dialog{width:min(1180px,calc(100vw - 44px));max-height:calc(100vh - 44px)}
.attendance-anomaly-dialog>form{display:flex;min-height:0;flex:1;flex-direction:column}
.attendance-anomaly-body{display:flex;min-height:0;flex:1;flex-direction:column;padding:12px 14px 0;overflow:hidden;background:#f8fafb}
.attendance-anomaly-intro{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:10px;padding:10px 12px;border:1px solid #ead9aa;border-radius:9px;background:#fffaf0}
.attendance-anomaly-intro strong,.attendance-anomaly-intro small{display:block}.attendance-anomaly-intro strong{color:#5c4a20;font-size:9px}.attendance-anomaly-intro small{margin-top:3px;color:#9a875d;font-size:7.5px}
.attendance-anomaly-dialog .sdm-attendance-anomaly-scroll{min-height:0;max-height:none;flex:1;background:#fff;border:1px solid #dfe8ed;border-radius:9px 9px 0 0}
.attendance-anomaly-dialog .modal-footer{flex:0 0 auto}
.attendance-recap-delete-modal .delete-modal-dialog{width:min(430px,100%)}
@media(max-width:600px){.attendance-anomaly-dialog{width:100%;max-height:94vh;border-radius:15px 15px 0 0}.attendance-anomaly-body{padding:10px 10px 0}.attendance-anomaly-intro{align-items:flex-start}.attendance-recap-delete-modal{align-items:end;padding:0}.attendance-recap-delete-modal .delete-modal-dialog{width:100%;max-height:92vh;border-radius:15px 15px 0 0}}

/* Daily attendance cells with status, check-in, and check-out times */
.sdm-attendance-table .attendance-day-heading.attendance-time-heading,.sdm-attendance-table td.attendance-time-cell{width:66px;min-width:66px;padding:6px 5px}
.sdm-attendance-table .attendance-time-heading span,.sdm-attendance-table .attendance-time-heading small{display:inline;color:inherit;font-size:inherit;font-weight:inherit}
.sdm-attendance-table td.attendance-time-cell{height:70px;font-variant-numeric:tabular-nums}
.sdm-attendance-table .attendance-time-cell strong,.sdm-attendance-table .attendance-time-cell span{display:block;white-space:nowrap}
.sdm-attendance-table .attendance-time-cell strong{margin-bottom:5px;color:inherit;font-size:10px;font-weight:900}
.sdm-attendance-table .attendance-time-cell span{color:#64768b;font-size:8px;font-weight:750;line-height:1.45}
.sdm-attendance-table .attendance-time-cell.attendance-code-ta{color:#855600!important;background:#fff0ad!important}
.sdm-attendance-table .attendance-time-cell.attendance-code-a{color:#a51e27!important;background:#ffe0e2!important}
.sdm-attendance-table .attendance-time-cell.attendance-code-off{color:#67798e!important;background:#e3e9ed!important}
.sdm-attendance-table .attendance-time-cell.attendance-code-empty{color:#98a5b2!important;background:#f2f5f7!important}
@media(max-width:600px){.sdm-attendance-table .attendance-day-heading.attendance-time-heading,.sdm-attendance-table td.attendance-time-cell{width:62px;min-width:62px}}

/* Separate incomplete attendance codes */
.attendance-code-tam,.attendance-code-tap{color:#394d68!important;background:#e0e7ee!important}
.attendance-summary-tam,.attendance-summary-tap{color:#394d68;background:#e0e7ee}
.sdm-attendance-table .attendance-time-cell.attendance-code-tam,.sdm-attendance-table .attendance-time-cell.attendance-code-tap{color:#855600!important;background:#fff0ad!important}
.attendance-code-tlbt{color:#9a5600!important;background:#ffe3a3!important}
.attendance-summary-tlbt{color:#9a5600;background:#ffe3a3}
.sdm-attendance-table .attendance-time-cell.attendance-code-tlbt{color:#934d00!important;background:#ffe3a3!important}
.attendance-total-tlbt{color:#934d00!important;background:#fff5dc!important}

/* Clear hierarchy for SDM Jatim saved reports and new imports */
.sdm-attendance-control-grid{display:grid;grid-template-columns:minmax(680px,2fr) minmax(330px,.85fr);align-items:stretch;gap:12px;margin-bottom:12px}
.sdm-attendance-control-grid.is-single{grid-template-columns:minmax(330px,560px)}
.sdm-attendance-control-grid .sdm-attendance-control-card{display:flex;margin:0;flex-direction:column;overflow:hidden;border-top:2px solid #08aaa3}
.sdm-attendance-control-grid .sdm-attendance-import-panel{display:flex;align-items:stretch;border-top-color:#4f8fcb}
.sdm-attendance-control-grid .sdm-attendance-control-header{display:flex;min-height:61px;align-items:center;justify-content:space-between;gap:12px;padding:11px 13px;border-right:0;border-bottom:1px solid #e7eef2;background:#fbfdfe}
.sdm-attendance-control-title{display:flex;min-width:0;align-items:center;gap:10px}
.sdm-attendance-control-title>div{min-width:0}
.sdm-attendance-control-title h2{margin:0;color:#263a55;font-size:11px}
.sdm-attendance-control-title p{margin:3px 0 0;color:#8b9aae;font-size:8px}
.sdm-attendance-control-number{display:grid;width:30px;height:30px;flex:0 0 30px;place-items:center;color:#007b88;border-radius:9px;background:#e4f6f5;font-size:8px;font-weight:900}
.sdm-attendance-import-panel .sdm-attendance-control-number{color:#17679d;background:#e8f2fa}
.sdm-attendance-control-grid .sdm-attendance-period-form{display:grid;grid-template-columns:minmax(160px,1.1fr) minmax(150px,1fr) repeat(2,minmax(135px,.8fr));align-items:end;gap:9px;padding:11px 13px}
.sdm-attendance-control-grid .sdm-attendance-period-form>.filter-actions{display:flex;grid-column:1/-1;justify-content:flex-end;gap:7px;padding-top:1px}
.sdm-attendance-control-grid .sdm-attendance-import-form{display:flex;flex:1;flex-direction:column;align-items:stretch;gap:9px;padding:11px 13px}
.sdm-attendance-control-grid .sdm-attendance-import-form .form-group{flex:1}
.sdm-attendance-control-grid .sdm-attendance-import-form>.btn{width:100%;min-height:38px}
.sdm-attendance-control-grid+.sdm-attendance-summary{margin-top:0}
@media(max-width:1180px){.sdm-attendance-control-grid{grid-template-columns:1fr}.sdm-attendance-control-grid .sdm-attendance-import-form{display:grid;grid-template-columns:minmax(260px,1fr) auto;align-items:end}.sdm-attendance-control-grid .sdm-attendance-import-form>.btn{width:auto}.sdm-attendance-control-grid .sdm-attendance-period-form{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){.sdm-attendance-control-grid,.sdm-attendance-control-grid.is-single{grid-template-columns:1fr}.sdm-attendance-control-grid .sdm-attendance-control-header{align-items:flex-start}.sdm-attendance-control-grid .sdm-attendance-period-form,.sdm-attendance-control-grid .sdm-attendance-import-form{display:grid;grid-template-columns:1fr}.sdm-attendance-control-grid .sdm-attendance-period-form>.filter-actions{grid-column:auto;justify-content:stretch}.sdm-attendance-control-grid .sdm-attendance-period-form>.filter-actions>.btn{flex:1}.sdm-attendance-control-grid .sdm-attendance-import-form>.btn{width:100%}}

/* Monthly discipline recap aligned with the ESS workbook */
.sdm-attendance-summary article{display:grid;grid-template-columns:34px minmax(0,1fr);align-items:center;gap:10px;border-top-color:#1f4e78}
.sdm-attendance-summary .sdm-attendance-summary-icon{display:grid;width:34px;height:34px;margin:0;place-items:center;overflow:visible;color:#1f4e78;border-radius:9px;background:#e8f0f8;font-size:14px;font-weight:900;line-height:1}
.sdm-attendance-summary .sdm-attendance-summary-copy{display:block;min-width:0;margin:0;overflow:hidden}
.sdm-attendance-summary .is-workday{border-top-color:#0c8c64}.sdm-attendance-summary .is-workday .sdm-attendance-summary-icon{color:#08724f;background:#ddf6ea}
.sdm-attendance-summary .is-attendance{border-top-color:#169773}.sdm-attendance-summary .is-attendance .sdm-attendance-summary-icon{color:#08723d;background:#d9f8e6}
.sdm-attendance-summary .is-discipline{border-top-color:#d59b21}.sdm-attendance-summary .is-discipline .sdm-attendance-summary-icon{color:#8a5a00;background:#fff0c4}
.sdm-attendance-summary-table-panel .sdm-attendance-table-scroll{max-height:68vh;background:#fff}
.sdm-attendance-overview-table{width:max-content;min-width:1760px;border-collapse:separate;border-spacing:0;font-size:8.5px;font-variant-numeric:tabular-nums}
.sdm-attendance-overview-table th,.sdm-attendance-overview-table td{height:39px;padding:7px 8px;border-right:1px solid #dce5ed;border-bottom:1px solid #e7edf1}
.sdm-attendance-overview-table th{position:sticky;z-index:4;top:0;color:#fff;background:#1f4e78;font-size:7px;letter-spacing:.3px}
.sdm-attendance-overview-table th:nth-child(3),.sdm-attendance-overview-table th:nth-child(4),.sdm-attendance-overview-table th:nth-child(5),.sdm-attendance-overview-table td:nth-child(3),.sdm-attendance-overview-table td:nth-child(4),.sdm-attendance-overview-table td:nth-child(5){text-align:left}
.sdm-attendance-overview-table th:nth-child(1),.sdm-attendance-overview-table td:nth-child(1){position:sticky;left:0;width:40px;min-width:40px}
.sdm-attendance-overview-table th:nth-child(2),.sdm-attendance-overview-table td:nth-child(2){position:sticky;left:40px;width:82px;min-width:82px}
.sdm-attendance-overview-table th:nth-child(3),.sdm-attendance-overview-table td:nth-child(3){position:sticky;left:122px;width:175px;min-width:175px;max-width:175px;overflow:hidden;text-overflow:ellipsis}
.sdm-attendance-overview-table th:nth-child(-n+3){z-index:7;background:#193f63}
.sdm-attendance-overview-table td:nth-child(-n+3){z-index:2;background:#fff}
.sdm-attendance-overview-table td:nth-child(3){box-shadow:6px 0 10px #153b5912}
.sdm-attendance-overview-table tbody tr:hover td:nth-child(-n+3){background:#f8fbfc}
.sdm-attendance-overview-table th:nth-child(4){min-width:130px}.sdm-attendance-overview-table th:nth-child(5){min-width:180px}
.sdm-attendance-overview-table th:nth-child(6){width:82px;white-space:normal}.sdm-attendance-overview-table th:nth-child(14){width:84px;white-space:normal}
.sdm-attendance-overview-table th:nth-child(15),.sdm-attendance-overview-table th:nth-child(16),.sdm-attendance-overview-table th:nth-child(17){width:86px;white-space:normal}
.sdm-attendance-overview-table th:nth-child(18){min-width:125px}.sdm-attendance-overview-table th:nth-child(19){min-width:84px}
.attendance-summary-badge{min-width:26px;height:23px;padding-inline:6px;border-radius:6px}
.attendance-summary-workdays{color:#1f4e78}.attendance-summary-effective{color:#145b8c}.attendance-summary-punctuality{color:#795600}.attendance-summary-discipline{color:#1f4e78}
.attendance-summary-h{color:#08723d;background:#d9f8e6}.attendance-summary-tlbt{color:#934d00;background:#ffe3a3}.attendance-summary-i{color:#855600;background:#ffef9d}.attendance-summary-a{color:#aa1c24;background:#ffe0e2}
.attendance-summary-ta{color:#795913;background:#f7e8c5}.attendance-summary-tam,.attendance-summary-tap{color:#43566c;background:#e8edf2}
.attendance-evaluation{display:inline-flex;min-height:24px;align-items:center;gap:6px;padding:5px 8px;border:1px solid transparent;border-radius:999px;font-size:7.5px;font-weight:850;white-space:nowrap}
.attendance-evaluation i{width:6px;height:6px;flex:0 0 6px;border-radius:50%;background:currentColor}
.attendance-evaluation-excellent{color:#08723d;border-color:#bfe8cf;background:#e7f8ee}.attendance-evaluation-attention{color:#8b5900;border-color:#f0d28c;background:#fff4d2}.attendance-evaluation-warning{color:#a51e27;border-color:#efbfc2;background:#ffebec}.attendance-evaluation-neutral{color:#68798e;border-color:#d7e0e7;background:#eef2f5}
@media(max-width:600px){.sdm-attendance-summary article{grid-template-columns:29px minmax(0,1fr);gap:7px}.sdm-attendance-summary .sdm-attendance-summary-icon{width:29px;height:29px;border-radius:8px;font-size:12px}.sdm-attendance-overview-table{min-width:1680px}}

/* Attendance palette from the monthly Excel recap */
.attendance-code-h,.sdm-attendance-table .attendance-time-cell.attendance-code-h{color:#375623!important;background:#e2efda!important}
.attendance-code-tlbt,.attendance-code-i,.attendance-code-ta,.attendance-code-tam,.attendance-code-tap,.sdm-attendance-table .attendance-time-cell.attendance-code-tlbt,.sdm-attendance-table .attendance-time-cell.attendance-code-i,.sdm-attendance-table .attendance-time-cell.attendance-code-ta,.sdm-attendance-table .attendance-time-cell.attendance-code-tam,.sdm-attendance-table .attendance-time-cell.attendance-code-tap{color:#b25900!important;background:#fff2cc!important}
.attendance-code-a,.sdm-attendance-table .attendance-time-cell.attendance-code-a{color:#c00000!important;background:#fce4d6!important}
.attendance-code-off,.sdm-attendance-table .attendance-time-cell.attendance-code-off{color:#44546a!important;background:#d9e1f2!important}
.attendance-code-empty,.sdm-attendance-table .attendance-time-cell.attendance-code-empty{color:#7f8c9a!important;background:#f2f2f2!important}
.attendance-summary-h{color:#375623;background:#e2efda}.attendance-summary-tlbt,.attendance-summary-i,.attendance-summary-ta,.attendance-summary-tam,.attendance-summary-tap{color:#b25900;background:#fff2cc}.attendance-summary-a{color:#c00000;background:#fce4d6}.attendance-summary-off{color:#44546a;background:#d9e1f2}
.attendance-total-tlbt{color:#b25900!important;background:#fff8df!important}

/* Compact SDM Jatim index with full recap and daily detail popups */
.sdm-attendance-employee-panel>.panel-header{align-items:center}
.sdm-attendance-report-actions{display:flex;align-items:center;gap:7px;flex-wrap:wrap;justify-content:flex-end}
.sdm-attendance-employee-scroll{overflow:auto;max-height:43vh;border-top:1px solid #e1e9ee}
.sdm-attendance-employee-table{width:100%;min-width:1030px;border-collapse:separate;border-spacing:0;color:#637188;font-size:8.5px}
.sdm-attendance-employee-table th,.sdm-attendance-employee-table td{height:38px;padding:7px 10px;border-right:1px solid #e4ebef;border-bottom:1px solid #e8eef2;text-align:left;vertical-align:middle}
.sdm-attendance-employee-table th{position:sticky;z-index:2;top:0;color:#7b8ca0;background:#edf3f6;font-size:7px;font-weight:900;letter-spacing:.45px;text-transform:uppercase}
.sdm-attendance-employee-table th:first-child,.sdm-attendance-employee-table td:first-child{width:42px;text-align:center}
.sdm-attendance-employee-table th:nth-child(2){width:90px}.sdm-attendance-employee-table th:nth-child(3){width:180px}.sdm-attendance-employee-table th:nth-child(4){width:155px}.sdm-attendance-employee-table th:nth-child(5){width:210px}.sdm-attendance-employee-table th:nth-child(6),.sdm-attendance-employee-table th:nth-child(7){width:92px;text-align:center}.sdm-attendance-employee-table td:nth-child(6),.sdm-attendance-employee-table td:nth-child(7){text-align:center}.sdm-attendance-employee-table th:nth-child(8){width:135px}.sdm-attendance-employee-table th:last-child,.sdm-attendance-employee-table td:last-child{width:115px;border-right:0;text-align:center}
.sdm-attendance-employee-table tbody tr:hover td{background:#f9fcfd}.sdm-attendance-employee-table tbody td:nth-child(3) strong{color:#30415a}
.attendance-report-modal{z-index:160;padding:16px}
.attendance-report-dialog{width:min(1480px,calc(100vw - 32px));height:min(860px,calc(100vh - 32px));max-height:calc(100vh - 32px);border-radius:14px}
.attendance-report-header{flex:0 0 auto;padding:11px 15px}.attendance-report-header .modal-title-icon{display:grid;width:38px;height:38px;flex:0 0 38px;place-items:center;color:#fff;border-radius:9px;background:linear-gradient(145deg,#0879b1,#00a49c);font-size:14px}.attendance-report-header .modal-title-group{display:flex;min-width:0;align-items:center;gap:10px}.attendance-report-header .modal-title-group>div{min-width:0}.attendance-report-header .modal-title-group small{display:block;color:#8797aa;font-size:6.5px;font-weight:900;letter-spacing:.6px}.attendance-report-header .modal-title-group h2{overflow:hidden;margin:2px 0 0;color:#26374f;font-size:13px;text-overflow:ellipsis;white-space:nowrap}.attendance-report-header .modal-title-group p{margin:2px 0 0;color:#8c9aab;font-size:7.5px}
.attendance-report-body{min-height:0;padding:0;overflow:hidden;background:#f7fafb}.attendance-report-body>.sdm-attendance-table-scroll{height:100%;max-height:none;border-top:0}
.attendance-report-modal .sdm-attendance-overview-table{font-size:8px}.attendance-report-modal .sdm-attendance-overview-table th,.attendance-report-modal .sdm-attendance-overview-table td{height:36px;padding:6px 7px}
.attendance-report-footer{min-height:50px;padding:8px 15px;justify-content:space-between;color:#7b899b;font-size:8px}.attendance-report-footer strong{color:#334b65}
.attendance-detail-modal{padding:8px}.attendance-detail-dialog{height:calc(100vh - 16px);max-height:calc(100vh - 16px)}
.attendance-detail-toolbar{display:flex;flex:0 0 auto;align-items:center;gap:12px;padding:7px 15px;border-bottom:1px solid #e1e9ee;background:#fbfdfd;color:#6f8195;font-size:7.5px;font-weight:800}.attendance-detail-toolbar>.sdm-attendance-legend{min-width:0;max-width:none;margin-left:auto;gap:4px 8px}.attendance-detail-toolbar .sdm-attendance-legend>span{font-size:7px}.attendance-detail-toolbar .sdm-attendance-legend .attendance-code{min-width:20px;height:20px;border-radius:5px;font-size:7px}
.attendance-detail-dialog .attendance-report-header{padding:6px 10px}.attendance-detail-dialog .attendance-report-header .modal-title-icon{width:31px;height:31px;flex-basis:31px;border-radius:7px;font-size:11px}.attendance-detail-dialog .attendance-report-header .modal-title-group{gap:8px}.attendance-detail-dialog .attendance-report-header .modal-title-group h2{font-size:11px}.attendance-detail-dialog .attendance-report-header .modal-title-group p{margin-top:1px;font-size:6.5px}
.attendance-detail-toolbar{min-height:32px;padding:4px 10px;gap:8px;overflow-x:auto;white-space:nowrap}.attendance-detail-toolbar>.sdm-attendance-legend{flex-wrap:nowrap;gap:3px 6px}.attendance-detail-toolbar .sdm-attendance-legend>span{font-size:6.2px}.attendance-detail-toolbar .sdm-attendance-legend .attendance-code{min-width:18px;height:18px;padding-inline:3px;font-size:6.3px}
.attendance-detail-body .sdm-attendance-table-scroll{display:block}.attendance-detail-body .sdm-attendance-table tbody tr[hidden]{display:none}.attendance-detail-body .sdm-attendance-table th,.attendance-detail-body .sdm-attendance-table td{height:34px;padding:3px 5px}.attendance-detail-body .sdm-attendance-table thead th{height:29px;font-size:6.3px}.attendance-detail-body .sdm-attendance-table thead tr:nth-child(2) th{top:29px}.attendance-detail-body .sdm-attendance-table tbody td{height:36px}.attendance-detail-body .sdm-attendance-table .attendance-no{width:34px;min-width:34px}.attendance-detail-body .sdm-attendance-table .attendance-nik{left:34px;width:78px;min-width:78px}.attendance-detail-body .sdm-attendance-table .attendance-name{left:112px;width:150px;min-width:150px;max-width:150px}.attendance-detail-body .sdm-attendance-table .attendance-unit{left:262px;width:205px;min-width:205px;max-width:205px}.attendance-detail-body .sdm-attendance-table .attendance-day-heading,.attendance-detail-body .sdm-attendance-table td.attendance-time-cell{width:38px;min-width:38px;padding-inline:2px}.attendance-detail-body .sdm-attendance-table td.attendance-time-cell strong,.attendance-detail-body .sdm-attendance-table td.attendance-time-cell span{display:block;line-height:1.05}.attendance-detail-body .sdm-attendance-table td.attendance-time-cell span{margin-top:1px;font-size:5.8px;font-weight:700}.attendance-detail-dialog .attendance-report-footer{min-height:38px;padding:5px 10px;font-size:7px}.attendance-detail-dialog .attendance-report-footer .btn{min-height:30px;padding:6px 12px}
@media(max-width:900px){.attendance-report-modal{align-items:end;padding:0}.attendance-report-dialog{width:100%;height:94vh;max-height:94vh;border-radius:15px 15px 0 0}.attendance-detail-toolbar{align-items:flex-start;flex-direction:column}.attendance-detail-toolbar>.sdm-attendance-legend{margin-left:0}.sdm-attendance-employee-scroll{max-height:48vh}}
@media(max-width:600px){.sdm-attendance-employee-panel>.panel-header{align-items:stretch;flex-direction:column}.sdm-attendance-report-actions{display:grid;grid-template-columns:1fr 1fr}.sdm-attendance-employee-panel>.panel-header .btn{width:100%}.attendance-report-header .modal-title-group p{display:none}.attendance-report-footer{align-items:stretch;flex-direction:column;gap:7px}.attendance-report-footer .btn{width:100%}}

/* Editable attendance calendar */
.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
.attendance-calendar-heading{align-items:flex-end}
.attendance-calendar-panel{overflow:hidden;border-top:3px solid #08aaa3}
.attendance-calendar-toolbar{align-items:center;gap:14px;padding:14px 16px}
.attendance-calendar-navigation,.attendance-calendar-picker{display:flex;align-items:center;gap:8px}
.attendance-calendar-navigation>a{width:38px;min-width:38px;padding-inline:0}
.attendance-calendar-picker select{width:132px;height:36px}.attendance-calendar-picker input{width:82px;height:36px}
.attendance-calendar-legend{display:flex;align-items:center;flex-wrap:wrap;gap:8px 18px;padding:10px 16px;color:#66788e;border-top:1px solid #edf1f4;background:#fbfdfe;font-size:8px;font-weight:750}
.attendance-calendar-legend span{display:inline-flex;align-items:center;gap:6px}
.calendar-legend-dot{width:9px;height:9px;border-radius:3px;background:#fff;border:1px solid #d8e3ea}.calendar-legend-dot.is-weekend{background:#e8edf1;border-color:#d3dde4}.calendar-legend-dot.is-national{background:#fff0ca;border-color:#efcf7a}.calendar-legend-dot.is-manual{background:#d8f5f2;border-color:#55c9c1}
.attendance-calendar-official-summary{padding:11px 16px;border-top:1px solid #edf1f4;background:#fffdf8}
.attendance-calendar-official-heading{display:flex;align-items:center;justify-content:space-between;gap:10px}.attendance-calendar-official-heading strong{color:#5b4a26;font-size:9px}.attendance-calendar-official-heading span{padding:4px 8px;color:#8a620f;border-radius:999px;background:#fff0c8;font-size:7px;font-weight:900}
.attendance-calendar-official-summary>p{margin:7px 0 0;color:#8c96a4;font-size:8px}
.attendance-calendar-official-list{display:flex;overflow-x:auto;gap:8px;margin-top:9px;padding-bottom:2px}
.attendance-calendar-official-list article{display:flex;min-width:220px;align-items:center;gap:9px;padding:8px 10px;border:1px solid #eed99f;border-radius:9px;background:#fff}
.attendance-calendar-official-list time{display:grid;width:32px;height:32px;flex:0 0 32px;place-items:center;color:#8b5d00;border-radius:8px;background:#fff0c8;font-size:12px;font-weight:900}.attendance-calendar-official-list div{min-width:0}.attendance-calendar-official-list small,.attendance-calendar-official-list strong{display:block}.attendance-calendar-official-list small{color:#b08022;font-size:6.5px;font-weight:900;letter-spacing:.35px}.attendance-calendar-official-list strong{overflow:hidden;margin-top:3px;color:#5c4a27;font-size:8px;text-overflow:ellipsis;white-space:nowrap}
.attendance-calendar-grid{display:grid;grid-template-columns:repeat(7,minmax(112px,1fr));min-width:784px;gap:1px;padding:1px;background:#dfe8ed;border-top:1px solid #dfe8ed;overflow:auto}
.attendance-calendar-weekday{display:grid;height:35px;place-items:center;color:#66788d;background:#edf3f6;font-size:8px;font-weight:900;letter-spacing:.4px;text-transform:uppercase}
.attendance-calendar-blank{min-height:102px;background:#f6f8fa}
.attendance-calendar-day{position:relative;display:flex;min-width:0;min-height:102px;padding:10px;flex-direction:column;align-items:flex-start;color:#3f5067;border:0;background:#fff;font:inherit;text-align:left;cursor:pointer;transition:box-shadow .18s ease,transform .18s ease,background .18s ease}
.attendance-calendar-day:hover,.attendance-calendar-day:focus-visible{z-index:1;outline:0;box-shadow:inset 0 0 0 2px #15aaa3;transform:translateY(-1px)}
.attendance-calendar-day.is-weekend{background:#f0f3f5}.attendance-calendar-day.is-national{background:#fff8e7}.attendance-calendar-day.is-manual{background:#ecfbf9;box-shadow:inset 0 3px 0 #13aaa2}
.attendance-calendar-day-number{color:#173d66;font-size:15px;font-weight:900;line-height:1}
.attendance-calendar-day-status{display:inline-flex;min-height:21px;align-items:center;margin-top:9px;padding:4px 7px;color:#08723d;border-radius:999px;background:#def7e9;font-size:7px;font-weight:900;letter-spacing:.35px}
.attendance-calendar-day.is-weekend .attendance-calendar-day-status{color:#68798e;background:#dfe6eb}.attendance-calendar-day.is-national .attendance-calendar-day-status{color:#8a5b00;background:#ffe7a7}.attendance-calendar-day.is-manual .attendance-calendar-day-status{color:#00766f;background:#d2f2ee}
.attendance-calendar-day small{display:-webkit-box;overflow:hidden;margin-top:7px;color:#77879a;font-size:7.5px;font-weight:650;line-height:1.35;-webkit-box-orient:vertical;-webkit-line-clamp:2}
.attendance-calendar-day em{position:absolute;top:9px;right:9px;color:#008b83;font-size:6.5px;font-style:normal;font-weight:900;letter-spacing:.35px;text-transform:uppercase}
.attendance-calendar-dialog{width:min(520px,100%)}
.attendance-calendar-modal-body{display:grid;gap:13px;padding:16px 18px}
.attendance-calendar-selected-date{padding:12px 13px;border:1px solid #cae4e3;border-radius:10px;background:#f0fbfa}.attendance-calendar-selected-date small,.attendance-calendar-selected-date strong{display:block}.attendance-calendar-selected-date small{color:#789096;font-size:7px;font-weight:900;letter-spacing:.5px}.attendance-calendar-selected-date strong{margin-top:4px;color:#075d73;font-size:14px}
.attendance-calendar-impact-note{padding:10px 12px;color:#6a7789;border:1px solid #dde7ed;border-radius:9px;background:#f8fafb;font-size:8px;line-height:1.5}.attendance-calendar-impact-note strong{color:#075d73}
@media(max-width:900px){.attendance-calendar-heading{align-items:flex-start;flex-direction:column}.attendance-calendar-toolbar{align-items:flex-start;flex-direction:column}.attendance-calendar-navigation{width:100%}.attendance-calendar-picker{flex:1}.attendance-calendar-picker select{flex:1;width:auto}}
@media(max-width:600px){.attendance-calendar-heading>.btn{width:100%}.attendance-calendar-navigation{display:grid;grid-template-columns:36px minmax(0,1fr) 36px}.attendance-calendar-picker{display:grid;grid-template-columns:1fr 76px;gap:6px}.attendance-calendar-picker select,.attendance-calendar-picker input{width:100%}.attendance-calendar-picker .btn{grid-column:1/-1}.attendance-calendar-legend{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.attendance-calendar-dialog{width:100%;border-radius:15px 15px 0 0}.attendance-calendar-modal{align-items:end;padding:0}.attendance-calendar-modal-body{padding:14px}}

/* Attendance calendar popup inside SDM Jatim */
.sdm-attendance-heading{align-items:flex-end}.sdm-attendance-heading>[data-calendar-open]{display:inline-flex;align-items:center;gap:7px;flex:0 0 auto}
.attendance-calendar-popup-dialog{width:min(1320px,calc(100vw - 36px));max-height:calc(100vh - 36px)}
.attendance-calendar-popup-body{display:grid;min-height:0;grid-template-columns:minmax(720px,1fr) 285px;flex:1;overflow:hidden}
.attendance-calendar-main{min-width:0;overflow:auto;background:#fff}
.attendance-calendar-main .attendance-calendar-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:11px 14px;border-bottom:1px solid #e6edf1}.attendance-calendar-main .attendance-calendar-toolbar h3{margin:0;color:#173d66;font-size:14px}.attendance-calendar-main .attendance-calendar-toolbar p{margin:3px 0 0;color:#8998aa;font-size:7.5px}
.attendance-calendar-popup-dialog .attendance-calendar-grid{min-width:700px;grid-template-columns:repeat(7,minmax(98px,1fr))}.attendance-calendar-popup-dialog .attendance-calendar-day,.attendance-calendar-popup-dialog .attendance-calendar-blank{min-height:82px}.attendance-calendar-popup-dialog .attendance-calendar-day.is-selected{z-index:2;box-shadow:inset 0 0 0 2px #008f9c,0 4px 12px #0d62751c}
.attendance-calendar-editor{overflow-y:auto;padding:15px;border-left:1px solid #dfe8ed;background:#f7fafb}.attendance-calendar-editor-heading{margin-bottom:13px;padding-bottom:11px;border-bottom:1px solid #dfe7ec}.attendance-calendar-editor-heading small{color:#008f9c;font-size:7px;font-weight:900;letter-spacing:.5px}.attendance-calendar-editor-heading h3{margin:4px 0 0;color:#233951;font-size:13px}.attendance-calendar-editor-heading p{margin:4px 0 0;color:#8796a8;font-size:7.5px}.attendance-calendar-editor form{display:grid;gap:12px}.attendance-calendar-editor .attendance-calendar-selected-date{margin-bottom:1px}.attendance-calendar-editor [data-calendar-submit]{width:100%;margin-top:2px}.attendance-calendar-editor [data-calendar-submit]:disabled{cursor:not-allowed;opacity:.55}
@media(max-width:1050px){.attendance-calendar-popup-body{grid-template-columns:1fr}.attendance-calendar-editor{border-top:1px solid #dfe8ed;border-left:0}.attendance-calendar-editor form{grid-template-columns:repeat(2,minmax(0,1fr))}.attendance-calendar-editor .attendance-calendar-selected-date,.attendance-calendar-editor .attendance-calendar-impact-note{grid-column:1/-1}.attendance-calendar-editor [data-calendar-submit]{grid-column:2;justify-self:end;width:auto}}
@media(max-width:700px){.sdm-attendance-heading{align-items:flex-start;flex-direction:column}.sdm-attendance-heading>[data-calendar-open]{width:100%;justify-content:center}.attendance-calendar-popup-dialog{width:100%;max-height:94vh;border-radius:15px 15px 0 0}.attendance-calendar-popup-body{display:block;overflow-y:auto}.attendance-calendar-main{overflow:visible}.attendance-calendar-main .attendance-calendar-toolbar{align-items:flex-start;flex-direction:column}.attendance-calendar-main .attendance-calendar-navigation{width:100%}.attendance-calendar-popup-dialog .attendance-calendar-grid{overflow:visible}.attendance-calendar-editor form{grid-template-columns:1fr}.attendance-calendar-editor .attendance-calendar-selected-date,.attendance-calendar-editor .attendance-calendar-impact-note,.attendance-calendar-editor [data-calendar-submit]{grid-column:auto;width:100%}}

/* Compact desktop calendar: a full six-week month fits without vertical scrolling */
@media(min-width:1051px) and (min-height:700px){.attendance-calendar-popup-dialog{width:min(1180px,calc(100vw - 32px));max-height:calc(100vh - 28px)}.attendance-calendar-popup-body{grid-template-columns:minmax(650px,1fr) 255px}.attendance-calendar-main{overflow:hidden}.attendance-calendar-main .attendance-calendar-toolbar{padding:8px 11px}.attendance-calendar-main .attendance-calendar-toolbar h3{font-size:12px}.attendance-calendar-main .attendance-calendar-toolbar p{margin-top:2px;font-size:7px}.attendance-calendar-navigation,.attendance-calendar-picker{gap:5px}.attendance-calendar-navigation>a{width:32px;min-width:32px;min-height:32px}.attendance-calendar-picker select,.attendance-calendar-picker input{height:32px}.attendance-calendar-picker select{width:116px}.attendance-calendar-picker input{width:72px}.attendance-calendar-legend{gap:5px 13px;padding:6px 11px;font-size:7px}.calendar-legend-dot{width:7px;height:7px}.attendance-calendar-official-summary{padding:7px 11px}.attendance-calendar-official-heading strong{font-size:8px}.attendance-calendar-official-heading span{padding:3px 7px;font-size:6.5px}.attendance-calendar-official-summary>p{margin-top:4px;font-size:7px}.attendance-calendar-official-list{flex-wrap:wrap;overflow:visible;gap:5px;margin-top:5px}.attendance-calendar-official-list article{min-width:155px;max-width:210px;flex:1;padding:5px 7px;gap:6px}.attendance-calendar-official-list time{width:25px;height:25px;flex-basis:25px;border-radius:6px;font-size:9px}.attendance-calendar-official-list small{font-size:5.8px}.attendance-calendar-official-list strong{margin-top:1px;font-size:7px}.attendance-calendar-popup-dialog .attendance-calendar-grid{min-width:630px;grid-template-columns:repeat(7,minmax(90px,1fr));overflow:hidden}.attendance-calendar-weekday{height:26px;font-size:7px}.attendance-calendar-popup-dialog .attendance-calendar-day,.attendance-calendar-popup-dialog .attendance-calendar-blank{min-height:58px}.attendance-calendar-day{padding:6px}.attendance-calendar-day-number{font-size:11px}.attendance-calendar-day-status{min-height:16px;margin-top:4px;padding:2px 5px;font-size:6px}.attendance-calendar-day small{display:block;max-width:100%;margin-top:3px;font-size:6.3px;line-height:1.2;text-overflow:ellipsis;white-space:nowrap}.attendance-calendar-day em{top:5px;right:5px;font-size:5.5px}.attendance-calendar-editor{padding:11px}.attendance-calendar-editor-heading{margin-bottom:8px;padding-bottom:8px}.attendance-calendar-editor-heading h3{font-size:11px}.attendance-calendar-editor-heading p{font-size:7px}.attendance-calendar-editor form{gap:8px}.attendance-calendar-selected-date{padding:8px 10px}.attendance-calendar-selected-date strong{font-size:11px}.attendance-calendar-editor input,.attendance-calendar-editor select{min-height:34px;height:34px}.attendance-calendar-impact-note{padding:7px 9px;font-size:7px}}

/* Force compact sizing even when browser zoom reduces the CSS viewport */
.attendance-calendar-popup-dialog{width:min(1120px,calc(100vw - 24px));max-height:calc(100vh - 20px)}
.attendance-calendar-popup-body{grid-template-columns:minmax(560px,1fr) 230px}
.attendance-calendar-main{overflow:hidden}
.attendance-calendar-main .attendance-calendar-toolbar{padding:6px 9px}.attendance-calendar-main .attendance-calendar-toolbar h3{font-size:11px}.attendance-calendar-main .attendance-calendar-toolbar p{font-size:6.5px}
.attendance-calendar-navigation,.attendance-calendar-picker{gap:4px}.attendance-calendar-navigation>a{width:29px;min-width:29px;min-height:29px}.attendance-calendar-picker select,.attendance-calendar-picker input{height:29px;min-height:29px}.attendance-calendar-picker select{width:105px}.attendance-calendar-picker input{width:67px}.attendance-calendar-picker .btn{min-height:29px;padding:5px 9px}
.attendance-calendar-legend{gap:4px 11px;padding:5px 9px;font-size:6.5px}.calendar-legend-dot{width:7px;height:7px}
.attendance-calendar-official-summary{padding:5px 9px}.attendance-calendar-official-heading strong{font-size:7.5px}.attendance-calendar-official-heading span{padding:2px 6px;font-size:6px}.attendance-calendar-official-list{flex-wrap:wrap;overflow:visible;gap:4px;margin-top:4px}.attendance-calendar-official-list article{min-width:145px;max-width:190px;flex:1;padding:4px 6px;gap:5px}.attendance-calendar-official-list time{width:23px;height:23px;flex-basis:23px;font-size:8px}.attendance-calendar-official-list small{font-size:5.3px}.attendance-calendar-official-list strong{margin-top:1px;font-size:6.4px}
.attendance-calendar-popup-dialog .attendance-calendar-grid{min-width:560px;grid-template-columns:repeat(7,minmax(80px,1fr));overflow:hidden}.attendance-calendar-weekday{height:22px;font-size:6.3px}.attendance-calendar-popup-dialog .attendance-calendar-day,.attendance-calendar-popup-dialog .attendance-calendar-blank{min-height:50px}.attendance-calendar-day{padding:5px}.attendance-calendar-day-number{font-size:10px}.attendance-calendar-day-status{min-height:14px;margin-top:3px;padding:1px 4px;font-size:5.5px}.attendance-calendar-day small{display:block;max-width:100%;margin-top:2px;font-size:5.8px;line-height:1.15;text-overflow:ellipsis;white-space:nowrap}.attendance-calendar-day em{top:4px;right:4px;font-size:5px}
.attendance-calendar-editor{padding:9px}.attendance-calendar-editor-heading{margin-bottom:6px;padding-bottom:6px}.attendance-calendar-editor-heading h3{font-size:10px}.attendance-calendar-editor-heading p{font-size:6.5px}.attendance-calendar-editor form{grid-template-columns:1fr;gap:6px}.attendance-calendar-editor .attendance-calendar-selected-date,.attendance-calendar-editor .attendance-calendar-impact-note,.attendance-calendar-editor [data-calendar-submit]{grid-column:auto}.attendance-calendar-selected-date{padding:6px 8px}.attendance-calendar-selected-date strong{font-size:10px}.attendance-calendar-editor input,.attendance-calendar-editor select{height:31px;min-height:31px}.attendance-calendar-impact-note{padding:6px 8px;font-size:6.5px}
@media(max-width:800px){.attendance-calendar-popup-body{grid-template-columns:1fr;overflow-y:auto}.attendance-calendar-main{overflow:visible}.attendance-calendar-popup-dialog .attendance-calendar-grid{overflow:visible}.attendance-calendar-editor{border-top:1px solid #dfe8ed;border-left:0}.attendance-calendar-editor form{grid-template-columns:repeat(2,minmax(0,1fr))}.attendance-calendar-editor .attendance-calendar-selected-date,.attendance-calendar-editor .attendance-calendar-impact-note{grid-column:1/-1}.attendance-calendar-editor [data-calendar-submit]{grid-column:2;width:auto}}
@media(max-width:600px){.attendance-calendar-editor form{grid-template-columns:1fr}.attendance-calendar-editor .attendance-calendar-selected-date,.attendance-calendar-editor .attendance-calendar-impact-note,.attendance-calendar-editor [data-calendar-submit]{grid-column:auto;width:100%}}

/* Denser horizontal calendar: keeps the full month and editor visible in one compact dialog. */
.attendance-calendar-popup-dialog{width:min(900px,calc(100vw - 24px))}
.attendance-calendar-popup-body{grid-template-columns:minmax(490px,1fr) 200px}
.attendance-calendar-main{min-width:0}
.attendance-calendar-navigation>[data-calendar-previous],.attendance-calendar-navigation>[data-calendar-next]{width:27px;min-width:27px;min-height:27px;padding:0}
.attendance-calendar-picker select,.attendance-calendar-picker input{height:27px;min-height:27px}
.attendance-calendar-picker select{width:94px}.attendance-calendar-picker input{width:62px}.attendance-calendar-picker .btn{min-height:27px;padding:4px 7px}
.attendance-calendar-official-list article{min-width:110px;max-width:160px;padding:3px 5px;gap:4px}.attendance-calendar-official-list time{width:21px;height:21px;flex-basis:21px}
.attendance-calendar-popup-dialog .attendance-calendar-grid{min-width:490px;grid-template-columns:repeat(7,minmax(70px,1fr))}
.attendance-calendar-popup-dialog .attendance-calendar-day,.attendance-calendar-popup-dialog .attendance-calendar-blank{min-height:47px}.attendance-calendar-day{padding:4px}.attendance-calendar-day-number{font-size:9px}.attendance-calendar-day-status{margin-top:2px}.attendance-calendar-day small{font-size:5.4px}
.attendance-calendar-editor{padding:8px}.attendance-calendar-editor form{grid-template-columns:1fr;gap:5px}
[data-calendar-month-content]{transition:opacity .15s ease}.attendance-calendar-main [data-calendar-month-content].is-loading{opacity:.45;pointer-events:none}
.attendance-calendar-load-error{margin:6px 8px;padding:6px 8px;border:1px solid #f1b7bb;border-radius:7px;background:#fff0f1;color:#a82d38;font-size:7px;font-weight:700}
@media(max-width:720px){.attendance-calendar-popup-body{grid-template-columns:1fr;overflow-y:auto}.attendance-calendar-main{overflow:visible}.attendance-calendar-popup-dialog .attendance-calendar-grid{overflow:auto}.attendance-calendar-editor{border-top:1px solid #dfe8ed;border-left:0}.attendance-calendar-editor form{grid-template-columns:1fr}.attendance-calendar-editor .attendance-calendar-selected-date,.attendance-calendar-editor .attendance-calendar-impact-note,.attendance-calendar-editor [data-calendar-submit]{grid-column:auto;width:100%}}

/* Keep the calendar inside the viewport and preserve a fixed six-week matrix. */
.attendance-calendar-modal{padding:10px;overflow:hidden}
.attendance-calendar-popup-dialog{width:min(900px,100%);max-width:100%;margin-inline:auto}
.attendance-calendar-popup-body{width:100%;max-width:100%}
.attendance-calendar-main,.attendance-calendar-main .attendance-calendar-toolbar>div{min-width:0}
.attendance-calendar-main .attendance-calendar-toolbar{width:100%;max-width:100%}
.attendance-calendar-navigation{min-width:0;max-width:100%}
.attendance-calendar-blank{background:#edf2f5}
.attendance-calendar-blank.is-trailing{background:#e4ebef}
@media(max-width:720px){.attendance-calendar-modal{padding:6px}.attendance-calendar-popup-dialog{width:100%;max-width:100%}.attendance-calendar-main{overflow-x:hidden}.attendance-calendar-popup-dialog .attendance-calendar-grid{min-width:0;grid-template-columns:repeat(7,minmax(0,1fr));overflow:hidden}.attendance-calendar-navigation{width:100%}.attendance-calendar-picker{min-width:0}.attendance-calendar-picker select{min-width:0}}

/* Native selects need enough content height; vertical padding on a 27px field clipped month names. */
.attendance-calendar-picker select{width:112px;height:32px;min-height:32px;padding:0 28px 0 10px;line-height:1.2}
.attendance-calendar-picker input{height:32px;min-height:32px;padding-block:0;line-height:1.2}
.attendance-calendar-picker .btn,.attendance-calendar-navigation>[data-calendar-previous],.attendance-calendar-navigation>[data-calendar-next]{min-height:32px}
@media(max-width:900px){.attendance-calendar-picker select{width:auto}}

/* SDM Jatim - daily attendance view based on the monthly memo workbook */
body:not(.landing-page):not(.login-page) .page-heading.sdm-daily-heading{align-items:center!important;display:flex!important;gap:16px;justify-content:space-between;margin-bottom:10px;overflow:visible!important}body:not(.landing-page):not(.login-page) .page-heading.sdm-daily-heading>div:first-child{min-width:0;width:auto}.sdm-daily-heading h1{margin-bottom:2px}
.attendance-delete-note{color:#8b99a7;font-size:8px;line-height:1.55}
.attendance-upload-dialog{width:min(620px,calc(100vw - 36px))}.attendance-upload-body{padding:18px}.attendance-upload-body>p{margin:0 0 15px;color:#708298;font-size:9px;line-height:1.6}.attendance-upload-body>p strong{color:#315477}.attendance-upload-body .form-group small{display:block;margin-top:6px;color:#8494a6;font-size:7.5px}.attendance-upload-body input[type=file]{width:100%;min-height:38px;padding:5px 7px;color:#526982;border:1px solid #d7e3eb;border-radius:7px;background:#fbfdfe;font:inherit;font-size:8px}.attendance-upload-body input[type=file]::file-selector-button{min-height:26px;margin-right:8px;padding:4px 8px;color:#17669d;border:1px solid #cddfeb;border-radius:5px;background:#eef7fc;font:inherit;font-size:7.5px;font-weight:800;cursor:pointer}.attendance-upload-meta-grid{display:grid;grid-template-columns:minmax(190px,1.5fr) minmax(110px,.75fr) minmax(90px,.6fr);gap:10px;margin-bottom:13px}.attendance-upload-meta-grid select{width:100%;min-height:38px;padding:5px 8px;color:#385a7a;border:1px solid #d7e3eb;border-radius:7px;background:#fbfdfe;font:inherit;font-size:8px}.attendance-export-note{margin:0!important;padding:9px 10px;color:#58728d!important;border:1px solid #d9e8ef;border-radius:7px;background:#f7fbfc;font-size:7.5px!important;line-height:1.45!important}
.sdm-daily-panel{overflow:hidden;border-top:3px solid #1f4e78}.sdm-daily-panel-header{display:flex;min-height:48px;align-items:center;justify-content:space-between;gap:12px;padding:8px 12px;border-bottom:1px solid #dce5eb;background:#fff}.sdm-daily-panel-header h2{margin:0;color:#1f3f64;font-size:12px}.sdm-daily-panel-header p{margin:2px 0 0;color:#8492a4;font-size:7px}.sdm-daily-time-key{display:flex;align-items:center;gap:10px;color:#61758d;font-size:7px;font-weight:800;white-space:nowrap}
.sdm-daily-panel.is-loading{pointer-events:none;opacity:.55;transition:opacity .16s ease}
.async-table-card.is-loading{pointer-events:none;opacity:.55;transition:opacity .16s ease}
.sdm-daily-legend{display:flex;min-height:36px;align-items:center;gap:5px 10px;padding:5px 12px;overflow-x:auto;color:#62748a;border-bottom:1px solid #dde6ec;background:#f9fbfc;font-size:6.7px;white-space:nowrap}.sdm-daily-legend>strong{color:#344b67}.sdm-daily-legend>span{display:inline-flex;align-items:center;gap:4px}.sdm-daily-legend-label-tltap{white-space:normal;line-height:1.25}.sdm-daily-code{display:grid;min-width:20px;height:19px;padding:0 4px;place-items:center;border-radius:5px;font-style:normal;font-weight:900}
.sdm-daily-table-wrap{max-height:calc(100vh - 276px);min-height:330px;overflow:auto;background:#fff}.sdm-daily-table{width:max-content;min-width:100%;border-collapse:separate;border-spacing:0;color:#5f6f85;background:#fff;font-size:7.5px;font-variant-numeric:tabular-nums}.sdm-daily-table th,.sdm-daily-table td{height:34px;padding:3px 6px;border-right:1px solid #d9e3ea;border-bottom:1px solid #e4ebef;text-align:center;vertical-align:middle;white-space:nowrap}.sdm-daily-table thead th{position:sticky;z-index:5;top:0;height:28px;color:#fff;border-color:#456887;background:#1f4e78;font-size:6.5px;font-weight:900;letter-spacing:.25px;text-transform:uppercase}.sdm-daily-table thead tr:nth-child(2) th{top:28px;height:31px;color:#304c6d;border-color:#d3e0e8;background:#eaf1f6}.sdm-daily-table thead tr:nth-child(2) th.is-off{color:#5b6f88;background:#d9e1f2}.sdm-daily-day-heading strong,.sdm-daily-day-heading small{display:block}.sdm-daily-day-heading strong{font-size:6.8px}.sdm-daily-day-heading small{margin-top:2px;color:#7890a7;font-size:5.5px}.sdm-daily-day-heading.is-off small{color:#647991}
.sdm-daily-table .sdm-daily-fixed{position:sticky;z-index:3;background:#fff}.sdm-daily-table thead .sdm-daily-fixed{z-index:8;color:#fff;background:#1f4e78}.sdm-daily-no{left:0;width:34px;min-width:34px}.sdm-daily-npp{left:34px;width:70px;min-width:70px}.sdm-daily-name{left:104px;width:150px;min-width:150px;max-width:150px;text-align:left!important;overflow:hidden;text-overflow:ellipsis}.sdm-daily-position{left:254px;width:125px;min-width:125px;max-width:125px;text-align:left!important;overflow:hidden;text-overflow:ellipsis}.sdm-daily-unit{left:379px;width:180px;min-width:180px;max-width:180px;text-align:left!important;overflow:hidden;text-overflow:ellipsis;box-shadow:7px 0 10px #173c6414}.sdm-daily-table tbody tr:hover .sdm-daily-fixed{background:#f8fbfc}.sdm-daily-table tbody .sdm-daily-name strong{color:#2e3f57}
.sdm-daily-status{width:49px;min-width:49px;padding-inline:2px!important;font-weight:800}.sdm-daily-status strong,.sdm-daily-status span{display:block}.sdm-daily-status strong{font-size:8px}.sdm-daily-status span{margin-top:1px;color:#60758e;font-size:5.8px;line-height:1.1}.sdm-daily-total-heading,.sdm-daily-total{position:sticky!important;right:0;min-width:66px;z-index:6!important;box-shadow:-7px 0 10px #173c6414}.sdm-daily-total-heading{color:#fff!important;background:#1f4e78!important}.sdm-daily-total{color:#1f4e78;background:#edf4f9!important;font-size:9px}
.sdm-daily-code-h{color:#182b43!important;background:#fff!important}.sdm-daily-code-tlbt{color:#e66f00!important;background:#fff0e3!important}.sdm-daily-code-tltap{color:#fff!important;background:#8d5929!important}.sdm-daily-code-odr{color:#fff!important;background:#0f766e!important}.sdm-daily-code-iz{color:#147f35!important;background:#cff3d3!important}.sdm-daily-code-ct{color:#fff!important;background:#5f7111!important}.sdm-daily-code-s{color:#fff!important;background:#1f4e78!important}.sdm-daily-code-a{color:#d90000!important;background:#ffd9d9!important}.sdm-daily-code-ta{color:#9e3939!important;background:#f7dada!important}.sdm-daily-code-tam{color:#fff!important;background:#9c3d3b!important}.sdm-daily-code-tap{color:#fff!important;background:#295c8d!important}.sdm-daily-code-tpa{color:#a94747!important;background:#f2caca!important}.sdm-daily-code-off{color:#f00000!important;background:#fff0e3!important}.sdm-daily-code-empty{color:#7f8c9a!important;background:#f2f2f2!important}.sdm-daily-table thead tr:nth-child(2) th.is-off{color:#e30000!important;background:#fff0e3!important}.sdm-daily-day-heading.is-off small{color:#e30000!important}

/* Palet ikon legenda Data Kehadiran */
.sdm-daily-legend .sdm-daily-code{color:#fff!important;text-shadow:0 1px 1px rgba(0,0,0,.13);box-shadow:0 4px 9px rgba(24,65,95,.15)}
.sdm-daily-legend .sdm-daily-code-h{background:linear-gradient(135deg,#0066c9,#124aa7)!important}
.sdm-daily-legend .sdm-daily-code-tlbt{background:linear-gradient(135deg,#ff6917,#e94700)!important}
.sdm-daily-legend .sdm-daily-code-tltap{background:linear-gradient(135deg,#f6c21a,#e9a400)!important}
.sdm-daily-legend .sdm-daily-code-odr{background:linear-gradient(135deg,#14b8a6,#0f766e)!important}
.sdm-daily-legend .sdm-daily-code-iz{background:linear-gradient(135deg,#0b9e50,#006a32)!important}
.sdm-daily-legend .sdm-daily-code-ct{background:linear-gradient(135deg,#9aad24,#5f7111)!important}
.sdm-daily-legend .sdm-daily-code-s{color:#fff!important;background:linear-gradient(135deg,#2f638f,#173d64)!important}
.sdm-daily-legend .sdm-daily-code-a{background:linear-gradient(135deg,#ff2b2b,#b90016)!important}
.sdm-daily-legend .sdm-daily-code-ta{background:linear-gradient(135deg,#ec397a,#c8175a)!important}
.sdm-daily-legend .sdm-daily-code-tam{background:linear-gradient(135deg,#5d42b7,#322079)!important}
.sdm-daily-legend .sdm-daily-code-tap{background:linear-gradient(135deg,#14b8e7,#0087cd)!important}
.sdm-daily-legend .sdm-daily-code-tpa{background:linear-gradient(135deg,#955228,#6c300d)!important}
.sdm-daily-legend .sdm-daily-code-off{color:#b42332!important;text-shadow:none;background:linear-gradient(135deg,#ffe4e7,#f7bfc7)!important;box-shadow:0 4px 9px rgba(198,48,66,.14)}
.sdm-daily-footer{display:flex;min-height:34px;align-items:center;justify-content:space-between;gap:10px;padding:6px 12px;color:#7a899b;border-top:1px solid #e0e8ed;background:#fafcfd;font-size:7px}.sdm-daily-footer strong{color:#304966}.sdm-daily-empty{min-height:310px}
@media(max-width:900px){.sdm-daily-heading{align-items:flex-start;flex-direction:column}.sdm-daily-filter-form{grid-template-columns:repeat(2,minmax(0,1fr))}.sdm-daily-table-wrap{max-height:62vh}.sdm-daily-position{display:none}.sdm-daily-unit{left:254px}.sdm-daily-panel-header{align-items:flex-start}}
@media(max-width:600px){.sdm-daily-filter-form{grid-template-columns:minmax(0,1fr)}.sdm-daily-panel-header{flex-direction:column}.sdm-daily-npp{display:none}.sdm-daily-name{left:34px;width:135px;min-width:135px;max-width:135px}.sdm-daily-unit{left:169px;width:145px;min-width:145px;max-width:145px}.sdm-daily-footer{align-items:flex-start;flex-direction:column}.attendance-upload-dialog{width:100%}}

/* Data Kehadiran: rincian per staf dibuka dari nama, bukan sebagai kolom harian di samping. */
.sdm-daily-table-wrap:has(.sdm-staff-attendance-table){min-height:0;max-height:none;overflow-x:hidden;overflow-y:auto}.sdm-staff-attendance-table{table-layout:fixed;width:100%;min-width:900px;max-width:100%}.sdm-staff-attendance-table .sdm-daily-fixed,.sdm-staff-attendance-table .sdm-daily-total,.sdm-staff-attendance-table .sdm-daily-total-heading{position:static!important;box-shadow:none}.sdm-staff-attendance-table .sdm-daily-name{width:200px;min-width:200px;max-width:200px;overflow:visible}.sdm-staff-attendance-table .sdm-daily-position{width:150px;min-width:150px;max-width:150px}.sdm-staff-attendance-table .sdm-daily-unit{width:190px;min-width:190px;max-width:190px}.sdm-staff-attendance-table .sdm-daily-work-unit{width:155px;min-width:155px;max-width:155px;text-align:left!important;overflow:hidden;text-overflow:ellipsis}.sdm-staff-attendance-table .sdm-daily-total{background:#edf4f9!important}.sdm-staff-toggle{display:flex;align-items:center;width:100%;gap:7px;padding:0;color:#2e3f57;border:0;background:transparent;font:inherit;text-align:left;cursor:pointer}.sdm-staff-toggle i{display:grid;place-items:center;flex:0 0 17px;width:17px;height:17px;color:#177cbf;border-radius:5px;background:#e7f4fb;font-size:15px;font-style:normal;line-height:1;transition:transform .16s ease,background .16s ease,color .16s ease}.sdm-staff-toggle:hover i,.sdm-staff-toggle:focus-visible i{color:#fff;background:#1988c9}.sdm-staff-toggle:focus-visible{outline:2px solid #58b9df;outline-offset:3px;border-radius:4px}.sdm-staff-toggle[aria-expanded=true] i{transform:rotate(90deg)}.sdm-staff-toggle strong,.sdm-staff-toggle small{display:block}.sdm-staff-toggle strong{font-size:8px}.sdm-staff-toggle small{margin-top:2px;color:#8293a4;font-size:6.5px;font-weight:700}.sdm-staff-detail>td{width:100%;height:auto!important;max-width:0;padding:0!important;white-space:normal!important;background:#fff!important}.sdm-staff-detail-inner{min-width:0;max-width:100%;overflow:hidden;background:transparent}.sdm-staff-day-table-wrap{max-width:100%;overflow-x:auto;overflow-y:hidden;background:#fff}.sdm-staff-day-table{width:100%;min-width:600px;border-collapse:separate;border-spacing:0;color:#536b82;font-size:7.5px}.sdm-staff-day-table th,.sdm-staff-day-table td{height:28px;padding:5px 8px;border-right:1px solid #e2ebf0;border-bottom:1px solid #e6eef2;text-align:left;vertical-align:middle;white-space:nowrap}.sdm-staff-day-table th{color:#345470;background:#eaf4f8;font-size:6.5px;font-weight:900;letter-spacing:.25px;text-transform:uppercase}.sdm-staff-day-table th:last-child,.sdm-staff-day-table td:last-child{border-right:0}.sdm-staff-day-table tbody tr:last-child td{border-bottom:0}.sdm-staff-day-table tbody tr.is-off td{background:#fff8f7}.sdm-staff-status{display:inline-grid;min-width:28px;min-height:19px;place-items:center;padding:0 5px;border-radius:5px;font-size:7px;font-weight:900}.sdm-staff-horizontal-table{width:max-content;min-width:1250px}.sdm-staff-horizontal-table th,.sdm-staff-horizontal-table td{width:56px;min-width:56px;padding:5px 4px;text-align:center}.sdm-staff-horizontal-table th:first-child{position:sticky;left:0;z-index:2;width:86px;min-width:86px;text-align:left}.sdm-staff-horizontal-table thead th{height:35px;background:#24557f}.sdm-staff-horizontal-table thead th:first-child{z-index:3}.sdm-staff-horizontal-table thead th strong,.sdm-staff-horizontal-table thead th small{display:block}.sdm-staff-horizontal-table thead th strong{color:#fff;font-size:7px}.sdm-staff-horizontal-table thead th small{margin-top:2px;color:#c9e8f6;font-size:6px}.sdm-staff-horizontal-table thead th.is-off{background:#3c637f}.sdm-staff-horizontal-table tbody th{position:sticky;left:0;z-index:1;background:#eaf4f8}.sdm-staff-day-cell{height:45px!important;vertical-align:top!important}.sdm-staff-day-cell small{display:block;margin-top:2px;color:#617990;font-size:6px;line-height:1}.sdm-staff-day-cell.is-off{background:#fff8f7}@media(max-width:700px){.attendance-upload-meta-grid{grid-template-columns:1fr}.sdm-daily-table-wrap:has(.sdm-staff-attendance-table){overflow-x:auto}.sdm-staff-attendance-table{min-width:760px}.sdm-staff-attendance-table .sdm-daily-position{display:none}.sdm-staff-attendance-table .sdm-daily-name{width:180px;min-width:180px}.sdm-staff-horizontal-table{min-width:1250px}}
.sdm-staff-status{color:#fff!important;text-shadow:0 1px 1px rgba(0,0,0,.13);box-shadow:0 3px 7px rgba(24,65,95,.14)}
.sdm-staff-status.sdm-daily-code-h{background:linear-gradient(135deg,#0066c9,#124aa7)!important}
.sdm-staff-status.sdm-daily-code-tlbt{background:linear-gradient(135deg,#ff6917,#e94700)!important}
.sdm-staff-status.sdm-daily-code-tltap{background:linear-gradient(135deg,#f6c21a,#e9a400)!important}
.sdm-staff-status.sdm-daily-code-odr{background:linear-gradient(135deg,#14b8a6,#0f766e)!important}
.sdm-staff-status.sdm-daily-code-iz{background:linear-gradient(135deg,#0b9e50,#006a32)!important}
.sdm-staff-status.sdm-daily-code-ct{background:linear-gradient(135deg,#9aad24,#5f7111)!important}
.sdm-staff-status.sdm-daily-code-s{color:#fff!important;background:linear-gradient(135deg,#2f638f,#173d64)!important}
.sdm-staff-status.sdm-daily-code-a{background:linear-gradient(135deg,#ff2b2b,#b90016)!important}
.sdm-staff-status.sdm-daily-code-ta{background:linear-gradient(135deg,#ec397a,#c8175a)!important}
.sdm-staff-status.sdm-daily-code-tam{background:linear-gradient(135deg,#5d42b7,#322079)!important}
.sdm-staff-status.sdm-daily-code-tap{background:linear-gradient(135deg,#14b8e7,#0087cd)!important}
.sdm-staff-status.sdm-daily-code-tpa{background:linear-gradient(135deg,#955228,#6c300d)!important}
.sdm-staff-status.sdm-daily-code-off{color:#b42332!important;text-shadow:none;background:linear-gradient(135deg,#ffe4e7,#f7bfc7)!important;box-shadow:0 3px 7px rgba(198,48,66,.14)}
.sdm-staff-attendance-table>thead{background:var(--system-table-header-gradient)}.sdm-staff-attendance-table>thead>tr>th{border-color:rgba(255,255,255,.2)!important;background:transparent!important}
.sdm-daily-upload-empty{display:flex;min-height:310px;align-items:center;justify-content:center;flex-direction:column}.sdm-daily-upload-empty>span{display:grid;place-items:center;width:45px;height:45px;margin-bottom:7px;color:#1687c7;border-radius:13px;background:#eaf7ff;font-size:24px}.sdm-daily-upload-empty strong{color:#22476c;font-size:12px}.sdm-daily-upload-empty p{max-width:410px;margin:5px 0 15px;color:#788da2;font-size:8.5px;line-height:1.55}.sdm-daily-upload-empty .btn{min-height:37px;padding-inline:14px;font-size:8px}

/* SDM - Data lembur dari waktu pulang pada laporan ESS. */
.overtime-filter-form .overtime-month-filter{width:190px}.overtime-filter-form .overtime-year-filter{width:116px}
.overtime-heading{margin-bottom:12px}.overtime-filter-panel{margin-bottom:12px;padding:11px 14px}.overtime-filter-form{display:flex;align-items:end;gap:10px}.overtime-filter-form .form-group{width:210px}.overtime-filter-form select{min-height:38px;font-size:9px}.overtime-filter-copy{display:grid;gap:3px;min-width:0;margin-right:auto;padding-bottom:3px}.overtime-filter-copy strong{color:#1d426b;font-size:10px}.overtime-filter-copy span{color:#8092a7;font-size:8px}.overtime-filter-form .btn{min-height:38px}.overtime-action-menu{position:relative;z-index:35}.overtime-action-trigger{display:grid;place-items:center;box-sizing:border-box;width:37px;height:38px;padding:0!important;color:#1768a8;border:1px solid #c5e1f4;border-radius:8px;background:#f7fcff;box-shadow:0 3px 9px rgba(28,98,151,.08);cursor:pointer;list-style:none}.overtime-action-trigger::-webkit-details-marker{display:none}.overtime-action-trigger svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.8}.overtime-action-trigger:hover{color:#fff;background:linear-gradient(135deg,#2788d0,#43c1ba);border-color:transparent}.overtime-action-popover{position:absolute;top:calc(100% + 7px);right:0;z-index:40;min-width:225px;padding:6px;border:1px solid #d7e5ef;border-radius:10px;background:#fff;box-shadow:0 12px 28px rgba(25,69,109,.15)}.overtime-action-popover button{display:block;width:100%;padding:10px 11px;color:#194b7a;border:0;border-radius:7px;background:transparent;font:inherit;font-size:8px;font-weight:850;text-align:left;cursor:pointer}.overtime-action-popover button:hover{color:#047b9a;background:#edf9fa}.overtime-workspace{display:grid;grid-template-columns:minmax(350px,.92fr) minmax(520px,1.35fr);gap:12px;align-items:start}.overtime-calendar-panel,.overtime-detail-panel{overflow:hidden;border-top:3px solid #1d83c9}.overtime-detail-panel{border-top-color:#35baac}.overtime-panel-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding:13px 15px 11px;border-bottom:1px solid #e4edf2;background:#fff}.overtime-panel-heading p{margin:0;color:#1c86c8;font-size:7px;font-weight:900;letter-spacing:.8px}.overtime-panel-heading h2{margin:4px 0 0;color:#203e67;font-size:14px}.overtime-calendar-actions{display:flex;align-items:center;gap:8px}.overtime-calendar-edit{min-height:27px!important;padding:5px 8px!important;font-size:7px!important}.overtime-legend{display:inline-flex;align-items:center;gap:5px;margin-top:6px;color:#698198;font-size:7.5px;font-weight:800;white-space:nowrap}.overtime-legend i{width:7px;height:7px;border-radius:50%;background:#2188d6;box-shadow:0 0 0 4px #e7f4ff}.overtime-weekdays,.overtime-calendar-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:5px;padding-inline:12px}.overtime-weekdays{padding-top:11px;padding-bottom:5px}.overtime-weekdays span{color:#8295a9;font-size:7px;font-weight:850;text-align:center}.overtime-calendar-grid{padding-bottom:12px}.overtime-calendar-blank{min-height:48px}.overtime-calendar-day{position:relative;display:grid;min-height:48px;place-content:center;gap:2px;padding:4px 2px;color:#254262;border:1px solid #e0ebf2;border-radius:8px;background:#fff;cursor:pointer;transition:background .16s ease,border-color .16s ease,box-shadow .16s ease,transform .16s ease}.overtime-calendar-day:hover{border-color:#7cc7e7;background:#f2fbff;transform:translateY(-1px)}.overtime-calendar-day strong{font-size:9px}.overtime-calendar-day small{color:#1778bc;font-size:6px;font-weight:850}.overtime-calendar-day.is-holiday{color:#a64d55;border-color:#f0d4d7;background:#fff8f7}.overtime-calendar-day.is-holiday .overtime-holiday-label{color:#b8505c}.overtime-calendar-day.has-overtime{border-color:#86c9ec;background:#edf8ff}.overtime-calendar-day.has-overtime:after{position:absolute;top:5px;right:5px;width:5px;height:5px;border-radius:50%;background:#1684d1;box-shadow:0 0 0 2px #dff2ff;content:''}.overtime-calendar-day.is-selected{color:#fff!important;border-color:transparent;background:linear-gradient(135deg,#1f80cc,#38bcb0);box-shadow:0 6px 14px rgba(25,126,187,.22)}.overtime-calendar-day.is-selected small{color:#fff!important}.overtime-calendar-day.is-selected:after{background:#fff;box-shadow:none}.overtime-calendar-note{margin:0;padding:10px 14px;color:#788ea4;border-top:1px solid #e6eef3;background:#fbfdfe;font-size:7.5px;line-height:1.45}.overtime-total{display:inline-flex;align-items:center;margin-top:3px;padding:6px 8px;color:#257471;border:1px solid #c4e9e4;border-radius:8px;background:#eefbf8;font-size:7.5px;white-space:nowrap}.overtime-total b{margin-right:3px;color:#0b8479;font-size:10px}.overtime-table-wrap{max-height:365px}.overtime-table{min-width:620px}.overtime-table th{color:#fff;background:linear-gradient(90deg,#1768aa,#1d9aad,#55b49c);font-size:7px}.overtime-table td{font-size:8px}.overtime-table td strong,.overtime-table td small{display:block}.overtime-table td strong{color:#244468;font-size:8.5px}.overtime-table td small{margin-top:3px;color:#8292a4;font-size:7px}.overtime-duration{display:inline-flex;padding:4px 6px;color:#0b887f;border-radius:6px;background:#eaf8f5;font-size:7.5px;font-weight:850;white-space:nowrap}.overtime-empty{min-height:300px}.overtime-disclaimer{margin:0;padding:10px 14px;color:#7e8fa1;border-top:1px solid #e5edf2;background:#fbfdfe;font-size:7px;line-height:1.55}.overtime-calendar-mode{display:grid;gap:9px;padding:11px;border:1px solid #dce8f0;border-radius:9px;background:#fbfdfe}.overtime-calendar-mode label{display:flex;align-items:center;gap:7px;color:#3f5973;font-size:8px;font-weight:700}.overtime-calendar-mode input{width:14px;height:14px;margin:0;accent-color:#1686c7}@media(max-width:1100px){.overtime-workspace{grid-template-columns:1fr}.overtime-table-wrap{max-height:unset}}@media(max-width:650px){.overtime-filter-form{align-items:stretch;flex-direction:column}.overtime-filter-form .form-group{width:100%}.overtime-filter-form .btn{width:100%}.overtime-workspace{gap:10px}.overtime-calendar-panel,.overtime-detail-panel{border-radius:11px}.overtime-calendar-day{min-height:44px}.overtime-calendar-grid,.overtime-weekdays{gap:4px;padding-inline:9px}.overtime-calendar-note,.overtime-disclaimer{padding-inline:11px}.overtime-panel-heading{padding-inline:11px}.overtime-panel-heading h2{font-size:12px}.overtime-calendar-actions{gap:5px}.overtime-calendar-edit{font-size:6.5px!important}}
.overtime-action-popover .overtime-action-divider{display:block;height:1px;margin:4px 3px;background:#e4edf1}.overtime-action-popover button.is-danger{color:#c33e50}.overtime-action-popover button.is-danger:hover{color:#ad3042;background:#fff1f3}.overtime-action-popover button:disabled{color:#a8b4bf;background:transparent;cursor:not-allowed}
/* Akutansi: kerangka laporan Laba & Rugi. */
.accounting-menu-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.accounting-menu-card{--accounting-tone:#087f91;--accounting-tint:#e9f7f8;display:grid;grid-template-columns:48px minmax(0,1fr) auto;align-items:center;gap:13px;min-height:135px;padding:18px;color:inherit;border-top:3px solid var(--accounting-tone);text-decoration:none;transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}.accounting-menu-card.is-rka{--accounting-tone:#1269a0;--accounting-tint:#eaf3fa}.accounting-menu-card.is-export{--accounting-tone:#0a8b70;--accounting-tint:#e8f7f2}.accounting-menu-card.is-source{--accounting-tone:#7455a6;--accounting-tint:#f1ecf8}.accounting-menu-card:hover{box-shadow:0 13px 28px rgba(28,64,85,.11);transform:translateY(-3px)}.accounting-menu-card:focus-visible{outline:2px solid var(--accounting-tone);outline-offset:3px}.accounting-menu-icon{display:grid;place-items:center;width:48px;height:48px;color:var(--accounting-tone);border-radius:13px;background:var(--accounting-tint);font-size:16px;font-weight:900}.accounting-menu-card>span:nth-child(2){min-width:0}.accounting-menu-card small,.accounting-menu-card strong{display:block}.accounting-menu-card small{color:var(--accounting-tone);font-size:7.5px;font-weight:900;letter-spacing:.7px}.accounting-menu-card strong{margin-top:5px;color:var(--navy);font-size:13px}.accounting-menu-card p{margin:5px 0 0;color:#71859a;font-size:8.5px;line-height:1.55}.accounting-menu-card>b{color:var(--accounting-tone);font-size:18px}@media(max-width:900px){.accounting-menu-grid{grid-template-columns:1fr}}@media(max-width:600px){.accounting-menu-card{grid-template-columns:42px minmax(0,1fr) auto;min-height:112px;padding:14px}.accounting-menu-icon{width:42px;height:42px}}
.lr-page-heading{position:relative!important;z-index:20!important;display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:12px;overflow:visible!important}.lr-page-heading h1{font-size:24px}.lr-page-heading p{margin-top:4px;margin-bottom:0}.lr-heading-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.lr-action-menu{position:relative;z-index:30;flex:0 0 auto}.lr-action-menu>summary{display:inline-flex;align-items:center;gap:7px;min-width:86px;justify-content:center;list-style:none}.lr-action-menu>summary::-webkit-details-marker{display:none}.lr-action-menu>summary::marker{content:""}.lr-action-menu[open]>summary{box-shadow:0 5px 15px rgba(14,115,159,.2)}.lr-action-menu>summary svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:2.6;transition:transform .16s ease}.lr-action-menu[open]>summary svg{transform:rotate(180deg)}.lr-action-menu-popover{position:absolute;z-index:31;top:calc(100% + 7px);right:0;display:grid;min-width:205px;padding:6px;border:1px solid #c9e0ec;border-radius:10px;background:#fff;box-shadow:0 12px 28px rgba(28,69,94,.16)}.lr-action-menu-item{display:flex;align-items:center;width:100%;min-height:36px;padding:8px 10px;color:#174467;border:0;border-radius:7px;background:transparent;font:inherit;font-size:9px;font-weight:800;text-align:left;text-decoration:none;white-space:nowrap;cursor:pointer}.lr-action-menu-item:hover,.lr-action-menu-item:focus-visible{color:#076c8c;background:#eaf7fb;outline:none}.lr-action-menu-item.is-danger{color:#c33e50}.lr-action-menu-item.is-danger:hover,.lr-action-menu-item.is-danger:focus-visible{color:#ad3042;background:#fff1f3}.lr-action-menu-divider{height:1px;margin:4px 3px;background:#e4edf1}@media(max-width:600px){.lr-page-heading{align-items:flex-start}.lr-heading-actions{width:100%}.lr-heading-actions .btn{flex:1}.lr-action-menu{margin-top:2px}.lr-action-menu-popover{min-width:190px}}
.lr-report-tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:0 0 12px;padding:7px;border:1px solid #c8dce9;border-radius:15px;background:#edf5f8}.lr-report-tab{display:flex;align-items:center;gap:11px;min-width:0;min-height:68px;padding:10px 14px;color:#607890;border:1px solid transparent;border-radius:12px;background:transparent;font:inherit;text-align:left;text-decoration:none;transition:background .18s ease,border-color .18s ease,box-shadow .18s ease}.lr-report-tab:hover{background:rgba(255,255,255,.6);border-color:#c6dce8}.lr-report-tab.is-active{color:var(--navy);border-color:#8ed5d7;background:#fff;box-shadow:0 5px 14px rgba(31,76,101,.08)}.lr-report-tab.is-pending{cursor:not-allowed;opacity:.7}.lr-report-tab.is-pending .lr-report-tab-badge{color:#6d879b;background:#dfeaf0}.lr-report-tab-badge{display:grid;place-items:center;flex:0 0 48px;height:42px;color:#fff;border-radius:11px;background:linear-gradient(135deg,#0879ad,#05a8a4);font-size:11px;font-weight:900;letter-spacing:.4px;line-height:1.05;text-align:center}.lr-report-tab>span:last-child{display:grid;min-width:0;gap:3px}.lr-report-tab strong{font-size:11px}.lr-report-tab small{color:#8193a7;font-size:8px;font-weight:600}.lr-report-tab:not(.is-active) .lr-report-tab-badge{color:#6d879b;background:#dfeaf0}@media(max-width:1080px){.lr-report-tabs{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:700px){.lr-report-tabs{grid-template-columns:1fr}.lr-report-tab{min-height:62px}}
.lr-report-panel{overflow:hidden;border-top:3px solid var(--cyan)}
.lr-profitloss-report-panel{display:flex;flex-direction:column;height:clamp(560px,calc(100dvh - 100px),900px);overflow:hidden}.lr-profitloss-report-panel .lr-report-header,.lr-profitloss-report-panel .lr-report-footer{position:relative;z-index:10;flex:0 0 auto}.lr-profitloss-report-panel .lr-report-scroll{flex:1 1 0;min-height:0;overflow:auto;overscroll-behavior:contain}.lr-profitloss-report-panel .lr-report-table thead{position:sticky;z-index:8;top:0}.lr-profitloss-report-panel .lr-report-table thead th{position:sticky;z-index:8;top:0}.lr-profitloss-report-panel .lr-report-table thead th:first-child{z-index:9}
.accounting-page .bopo-realization-template{margin-right:8px;vertical-align:middle}.accounting-page .bopo-realization-value{display:inline-block;color:#000;font-weight:700;vertical-align:middle}
.lr-upload-manual-approval{display:flex;align-items:flex-start;gap:9px;margin-top:2px;padding:10px 11px;color:#315176;border:1px solid #c9e2f3;border-radius:10px;background:#f5fbff;font-size:10px;line-height:1.45;cursor:pointer}.lr-upload-manual-approval input{width:16px;height:16px;margin:1px 0 0;accent-color:#187bc2;flex:0 0 auto}.lr-upload-manual-approval strong,.lr-upload-manual-approval small{display:block}.lr-upload-manual-approval strong{color:var(--navy);font-size:10px}.lr-upload-manual-approval small{margin-top:2px;color:#68809c;font-size:9px}
.bopo-page-heading{margin-bottom:12px}.bopo-filter-panel{margin-bottom:14px;padding:14px 18px}.bopo-filter-form{display:flex;align-items:end;gap:10px}.bopo-filter-form label{display:grid;min-width:175px;gap:6px;color:var(--navy);font-size:9px;font-weight:850}.bopo-filter-form label:nth-child(2){min-width:130px}.bopo-filter-form .lr-upload-select{min-height:42px}.bopo-filter-form .btn{min-height:42px}.bopo-report-panel{overflow:hidden;border-top:4px solid transparent;border-image:linear-gradient(90deg,#154584 0%,#1f86aa 39%,#2fa9a6 58%,#98bf81 78%,#ffd05d 100%) 1}.bopo-report-header{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 17px;border-bottom:1px solid #dce9ef;background:linear-gradient(100deg,#f1fbfe 0%,#fff 57%,#effbf8 100%)}.bopo-report-header p{margin:0 0 5px;color:#7891a8;font-size:8px;font-weight:900;letter-spacing:.5px}.bopo-report-header h2{margin:0;color:var(--navy);font-size:15px}.bopo-report-header>span{display:inline-flex;align-items:center;min-height:31px;padding:0 11px;color:#087f79;border:1px solid #bae5df;border-radius:9px;background:#eaf9f6;font-size:9px;font-weight:900;white-space:nowrap}.bopo-table-wrap{overflow:auto;overscroll-behavior-x:contain}.bopo-table{width:100%;min-width:580px;border-collapse:separate;border-spacing:0;color:#46627a;font-size:10px}.bopo-table th,.bopo-table td{height:47px;padding:10px 13px;border-right:1px solid #d9e7ed;border-bottom:1px solid #dce8ed;text-align:center;vertical-align:middle}.bopo-table thead th{height:36px;color:#fff;border-color:rgba(255,255,255,.2);background:linear-gradient(90deg,#154584 0%,#1f86aa 39%,#2fa9a6 58%,#98bf81 78%,#ffd05d 100%);font-size:9px;font-weight:900;letter-spacing:.25px}.bopo-table tbody th{color:#173d70;background:#f5fbfd;text-align:left;font-size:10px;font-weight:900}.bopo-table tbody tr:nth-child(even) td,.bopo-table tbody tr:nth-child(even) th{background:#fbfdfe}.bopo-table tbody tr:hover td,.bopo-table tbody tr:hover th{background:#edf9f8}.bopo-table th:first-child{width:34%;min-width:180px}.bopo-table caption{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}@media(max-width:700px){.bopo-filter-form{display:grid;grid-template-columns:1fr 1fr}.bopo-filter-form label{min-width:0}.bopo-filter-form label:nth-child(2){min-width:0}.bopo-filter-form .btn{width:100%}.bopo-report-header{align-items:flex-start;flex-direction:column}}@media(max-width:440px){.bopo-filter-form{grid-template-columns:1fr}}
.accounting-page .bopo-report-panel{border-top:3px solid #45c5b8!important;border-image:none!important}.accounting-page .bopo-report-header{padding:10px 12px;border-bottom-color:#dce9f3;background:linear-gradient(100deg,#f0f9ff,#fff 56%,#effcf9)!important}.accounting-page .bopo-report-header h2{font-size:13px}.accounting-page .bopo-table{table-layout:fixed;color:#46627a;font-size:10px}.accounting-page .bopo-table .bopo-unit-column{width:34%}.accounting-page .bopo-table .bopo-month-column{width:34%}.accounting-page .bopo-table .bopo-target-column,.accounting-page .bopo-table .bopo-achievement-column{width:16%}.accounting-page .bopo-table th,.accounting-page .bopo-table td{height:44px;padding:6px;border-right-color:#d8e5e9;border-bottom-color:#dce7ec}.accounting-page .bopo-table thead{background:linear-gradient(90deg,#123f7e 0%,#1f6fa7 24%,#209cad 47%,#76af93 72%,#f4ca5b 100%)!important}.accounting-page .bopo-table thead th{height:36px;color:#fff!important;border-color:rgba(255,255,255,.18)!important;background:transparent!important;font-size:8px}.accounting-page .bopo-table td.bopo-realization-cell{text-align:left}.accounting-page .bopo-realization-template{display:inline-flex;align-items:center;justify-content:center;min-width:76px;min-height:25px;padding:0 9px;color:#526ab8;border:1px solid #cad7ff;border-radius:999px;background:#f0f4ff;font-size:8px;font-weight:850;transition:color .16s ease,border-color .16s ease,background .16s ease}.accounting-page .bopo-table tbody tr:hover .bopo-realization-template{color:#2866b8;border-color:#aecaee;background:#e5f2ff}.accounting-page .bopo-table tbody th{color:var(--navy);background:#fff;text-align:left;font-size:10px;font-weight:800}.accounting-page .bopo-table tbody td{background:#fff;text-align:right;color:#000;font-weight:600}.accounting-page .bopo-table tbody tr:nth-child(even) td,.accounting-page .bopo-table tbody tr:nth-child(even) th{background:#fafcfe}.accounting-page .bopo-table tbody tr:hover td,.accounting-page .bopo-table tbody tr:hover th{background:#e6f3ff}
.lr-report-header{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 12px;border-bottom:1px solid #dce7ec;background:#fff}
.lr-report-header p{margin:0 0 5px;color:#8395a8;font-size:9px;font-weight:800;letter-spacing:.5px}
.lr-report-header h2{margin:0;color:var(--navy);font-size:13px}
.lr-report-year{padding:6px 12px;border:1px solid #cde8e7;border-radius:8px;color:#00868d;background:#ecf9f8;font-size:11px;font-weight:800}
.lr-profitloss-report-panel{border:0;border-radius:16px 16px 0 0;background:#fff}.lr-profitloss-report-panel .lr-report-header{min-height:96px;padding:18px 25px}.lr-profitloss-report-panel .lr-report-kicker{margin:0 0 10px;color:#6f89a0;font-size:9px;font-weight:900;letter-spacing:.85px}.lr-profitloss-report-panel .lr-report-header h2{font-size:16px}.lr-report-status{display:inline-flex;align-items:center;min-height:39px;padding:0 14px;border:1px solid #ead2a3;border-radius:999px;color:#996719;background:#fff9ed;font-size:9px;font-weight:900;white-space:nowrap}.lr-report-status.is-unavailable{color:#a2483f;border-color:#efcbc7;background:#fff3f1}

/* Aturan global: judul/informasi yang berada tepat di atas header tabel. */
.table-title-frame,.lr-report-header,.bopo-report-header{position:relative;z-index:4;overflow:visible;border:0!important;border-radius:16px 16px 0 0;background:linear-gradient(100deg,#f4fbfd 0%,#fff 58%,#fffdf4 100%)!important}.table-title-frame::before,.lr-report-header::before,.bopo-report-header::before{position:absolute;z-index:1;inset:0;display:block;padding:2px;content:"";border-radius:inherit;background:linear-gradient(90deg,#174a8b 0%,#2189ad 38%,#36b8aa 66%,#ffd05b 100%);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none}.table-title-frame::after,.lr-report-header::after,.bopo-report-header::after{position:absolute;z-index:3;right:0;bottom:-2px;left:0;height:4px;content:"";background:linear-gradient(90deg,#174a8b 0%,#2189ad 38%,#36b8aa 66%,#ffd05b 100%);pointer-events:none}.table-title-frame>*,.lr-report-header>*,.bopo-report-header>*{position:relative;z-index:2}
.table-title-join{flex:0 0 2px;height:2px;margin:0;background:linear-gradient(90deg,#174a8b 0%,#2189ad 38%,#36b8aa 66%,#ffd05b 100%)}.table-title-join+.lr-report-scroll,.table-title-join+.bopo-table-wrap{position:relative;z-index:3;margin:0;transform:none}
.table-title-panel{position:relative;overflow:hidden;border:0;border-radius:18px 18px 0 0;background:linear-gradient(90deg,#174a8b 0%,#2189ad 38%,#36b8aa 66%,#ffd05b 100%)}.table-title-panel>.lr-report-header{z-index:1;margin:2px 2px 0;overflow:visible;border:0!important;border-radius:16px 16px 0 0;background:linear-gradient(100deg,#f4fbfd 0%,#fff 58%,#fffdf4 100%)!important}.table-title-panel>.lr-report-header::before,.table-title-panel>.lr-report-header::after{display:none}.table-title-panel>.table-title-join{position:relative;z-index:2;flex:0 0 3px;height:3px;background:linear-gradient(90deg,#174a8b 0%,#2189ad 38%,#36b8aa 66%,#ffd05b 100%)}.table-title-panel>.lr-report-scroll{position:relative;z-index:1;margin:0;transform:none}
/* Judul Laba/Rugi dan kepala tabel adalah satu kartu: garis gradasi tidak boleh tertutup oleh gaya panel bawaan. */
.lr-profitloss-report-panel.table-title-panel{padding:0!important;border:2px solid transparent!important;border-bottom:0!important;border-radius:18px 18px 0 0!important;background:linear-gradient(90deg,#174a8b 0%,#2189ad 38%,#36b8aa 66%,#ffd05b 100%) border-box!important;background-clip:border-box!important;box-shadow:0 6px 18px rgba(36,67,86,.105)!important}
.lr-profitloss-report-panel.table-title-panel>.lr-report-header{width:100%;margin:0!important;border-radius:16px 16px 0 0!important}
.lr-profitloss-report-panel.table-title-panel>.table-title-join{display:block!important;width:100%;min-height:4px!important;height:4px!important;flex:0 0 4px!important;margin:0!important;background:linear-gradient(90deg,#174a8b 0%,#2189ad 38%,#36b8aa 66%,#ffd05b 100%)!important}
.lr-profitloss-report-panel.table-title-panel>.lr-report-scroll{width:100%;margin:0!important;border:0!important}
/* Bingkai gradasi khusus berhenti pada judul; tidak boleh turun mengikuti isi tabel. */
.lr-profitloss-report-panel.table-title-panel{border:0!important;border-radius:18px 18px 0 0!important;background:#fff!important}
.lr-profitloss-report-panel.table-title-panel>.lr-report-header{position:relative;z-index:2;width:100%;margin:0!important;border-radius:18px 18px 0 0!important;background:linear-gradient(100deg,#f4fbfd 0%,#fff 58%,#fffdf4 100%)!important}
.lr-profitloss-report-panel.table-title-panel>.lr-report-header::before{position:absolute!important;z-index:3!important;inset:0!important;display:block!important;padding:0!important;content:""!important;border-radius:18px 18px 0 0!important;background:linear-gradient(90deg,#174a8b 0%,#2189ad 38%,#36b8aa 66%,#ffd05b 100%)!important;-webkit-mask:none!important;mask:none!important;clip-path:polygon(0 0,100% 0,100% 100%,calc(100% - 2px) 100%,calc(100% - 2px) 2px,2px 2px,2px 100%,0 100%)!important;pointer-events:none}
.lr-profitloss-report-panel.table-title-panel>.lr-report-header::after{position:absolute!important;z-index:4!important;right:0!important;bottom:0!important;left:0!important;display:block!important;height:4px!important;content:""!important;background:linear-gradient(90deg,#174a8b 0%,#2189ad 38%,#36b8aa 66%,#ffd05b 100%)!important;pointer-events:none}
.lr-profitloss-report-panel.table-title-panel>.table-title-join{display:none!important}
/* Versi akhir kartu judul Laba/Rugi: satu bingkai bersih dan sambungan gradasi yang presisi. */
.lr-profitloss-report-panel.table-title-panel{overflow:hidden!important;border:0!important;border-radius:18px 18px 0 0!important;background:#fff!important;box-shadow:0 6px 18px rgba(36,67,86,.105)!important}
.lr-profitloss-report-panel.table-title-panel>.lr-report-header{box-sizing:border-box!important;position:relative!important;z-index:2!important;width:100%!important;margin:0!important;padding:18px 25px!important;border:2px solid transparent!important;border-bottom:0!important;border-radius:18px 18px 0 0!important;background:linear-gradient(100deg,#f4fbfd 0%,#fff 58%,#fffdf4 100%) padding-box,linear-gradient(90deg,#174a8b 0%,#2189ad 38%,#36b8aa 66%,#ffd05b 100%) border-box!important;background-clip:padding-box,border-box!important}
.lr-profitloss-report-panel.table-title-panel>.lr-report-header::before{display:none!important}
.lr-profitloss-report-panel.table-title-panel>.lr-report-header::after{position:absolute!important;z-index:4!important;right:0!important;bottom:0!important;left:0!important;display:block!important;height:3px!important;content:""!important;background:linear-gradient(90deg,#174a8b 0%,#2189ad 38%,#36b8aa 66%,#ffd05b 100%)!important;pointer-events:none}
.lr-profitloss-report-panel.table-title-panel>.lr-report-scroll{position:relative!important;z-index:1!important;width:100%!important;margin:0!important;border:0!important}
.lr-report-scroll{max-width:100%;overflow:auto;overscroll-behavior-x:contain}
.lr-report-scroll:focus-visible{outline:2px solid var(--cyan);outline-offset:-2px}
.lr-report-table{width:100%;min-width:720px;table-layout:fixed;border-collapse:separate;border-spacing:0;font-size:10px;font-variant-numeric:tabular-nums}
.lr-report-table .lr-description-column{width:28%}.lr-report-table .lr-number-column{width:9.5%}.lr-report-table .lr-percentage-column{width:5.5%}
.lr-report-table th,.lr-report-table td{padding:6px;border-right:1px solid #d8e5e9;border-bottom:1px solid #dce7ec;vertical-align:middle}
.lr-report-table thead th{color:#7b8fa6;border-color:#dce7ec;background:#eef5f8;text-align:center;font-size:8px;font-weight:800;letter-spacing:.15px;white-space:normal;overflow-wrap:anywhere}
.lr-report-table thead th:first-child{background:#eef5f8}
.lr-report-table tbody th{text-align:left;color:var(--navy);font-size:10px;font-weight:800;line-height:1.5}
.lr-report-table tbody td{text-align:right}
.lr-profitloss-table tbody td{font-size:10px;font-weight:600;color:#000}
.lr-profitloss-table tbody td[data-lr-total]{color:var(--navy);font-weight:800}
.lr-profitloss-table .lr-rka-negative-marker{color:#c62828;font-weight:800}
.lr-source-audit{font-size:11px;line-height:1.6;color:#000}.lr-source-audit summary{cursor:pointer;font-weight:600}
.lr-report-table tr>:first-child{position:sticky;left:0;z-index:1;box-shadow:3px 0 5px #183c4c08}
.lr-report-table tr>:last-child{border-right:0}
.lr-report-table .lr-row-major>*{background:#f3f8fc}
.lr-report-table .lr-row-group>*{border-bottom:2px solid #0a65d2;background:#edf6ff;font-weight:800}.lr-report-table .lr-row-subgroup>*{background:#fff}
.lr-report-table .lr-row-subgroup>th,.lr-report-table .lr-row-subtotal>th{padding-left:16px}
.lr-report-table tbody th{white-space:normal;overflow-wrap:break-word}
.lr-report-table .lr-row-subtotal>*{background:#edf6ff;font-weight:900}
.lr-report-table .lr-row-profit>*{border-top:2px solid #0a65d2;background:#e7f2ff;font-weight:900}
.lr-profitloss-table .lr-profitloss-title-row>th{text-align:left;background:#fff;color:var(--navy);font-size:10px;font-weight:800;letter-spacing:.15px}
.lr-empty-value{color:#95a5ac;font-weight:400}
.lr-report-footer{padding:6px 12px;color:#8796a6;background:#fafcfd;font-size:8px;line-height:1.5}
.lr-report-caption{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.lr-rka-heading{display:flex;align-items:center;justify-content:space-between;gap:12px}.lr-rka-heading>.btn{flex:0 0 auto}
.lr-rka-heading-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.lr-rka-delete-button{color:#ba3547;border-color:#efbdc4}.lr-rka-delete-button:hover{background:#fff2f4}
#rkaUploadDialog [hidden]{display:none!important}.lr-upload-step-content{display:grid;gap:10px}
.lr-settings-dialog{width:min(460px,calc(100% - 28px));max-height:calc(100dvh - 28px);padding:0;color:var(--text);border:1px solid #d5e3ec;border-radius:14px;background:#fff;box-shadow:0 24px 70px #073b7333;overflow:auto}
#lrUploadDialog{box-sizing:border-box;overflow-x:hidden}#lrUploadDialog>form,#lrUploadDialog .lr-settings-body{min-width:0}#lrUploadDialog .lr-settings-body{grid-template-columns:minmax(0,1fr)}#lrUploadDialog .lr-upload-label,#lrUploadDialog .lr-upload-select,#lrUploadDialog .lr-upload-input,#lrUploadDialog .lr-upload-note,#lrUploadDialog .lr-upload-manual-approval{min-width:0;max-width:100%;box-sizing:border-box}#lrUploadDialog .lr-upload-note,#lrUploadDialog .lr-upload-manual-approval>span{overflow-wrap:anywhere}#lrUploadDialog .lr-upload-manual-approval>span{min-width:0}
.lr-volume-edit-dialog{width:min(1400px,calc(100% - 32px))}.lr-volume-edit-dialog .lr-volume-edit-body{padding:14px 0 0}.lr-volume-edit-body>p{margin:0 16px 12px}.lr-volume-edit-table{min-width:720px}.lr-volume-edit-table .lr-volume-editable-row>*{background:#eaf6ff}.lr-volume-number-input{width:100%;min-width:82px;padding:8px 9px;color:#17385d;border:1px solid #cbdfea;border-radius:7px;background:#fff;text-align:right;font:inherit;font-weight:700;outline:none}.lr-volume-number-input:focus{border-color:#168dcc;box-shadow:0 0 0 3px #168dcc22}.lr-volume-number-input[readonly]{color:#17385d;border-color:transparent;background:transparent;cursor:default}.lr-volume-edit-dialog .lr-upload-note{margin:10px 16px 14px}.lr-volume-unit-dialog .lr-settings-body{display:grid;gap:10px}
.lr-edit-unit-filter{display:grid;gap:5px;width:min(340px,calc(100% - 32px));margin:0 16px 12px}.lr-edit-unit-filter label{color:#294667;font-size:11px;font-weight:800}
.lr-volume-edit-toolbar{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:12px;margin:0 0 12px}.lr-volume-edit-toolbar>p{margin:0}.lr-volume-edit-toolbar .lr-edit-unit-filter{display:flex;align-items:center;gap:8px;width:auto;margin:0}.lr-volume-edit-toolbar .lr-edit-unit-filter label{white-space:nowrap}.lr-volume-edit-toolbar .lr-edit-unit-filter .lr-upload-select{width:150px;min-height:34px;height:34px;padding:5px 28px 5px 9px;font-size:11px}
.lr-volume-edit-dialog[open]{display:flex;flex-direction:column;overflow:hidden}.lr-volume-edit-dialog>.lr-settings-header{flex-shrink:0}.lr-volume-edit-dialog>form{display:flex;flex:1;flex-direction:column;min-height:0;overflow:hidden}.lr-volume-edit-dialog .lr-volume-edit-body{flex:1;min-height:0;overflow:auto;padding:14px;overscroll-behavior:contain}.lr-volume-edit-dialog .lr-volume-edit-body>p{margin:0 0 12px}.lr-volume-editor-panel{display:flex;flex-direction:column;min-height:0;margin:0;overflow:hidden}.lr-volume-editor-panel .lr-report-header{position:relative;z-index:10;flex-shrink:0}.lr-volume-editor-panel .lr-edit-unit-filter{flex-shrink:0;margin:12px}.lr-volume-editor-panel .lr-report-scroll{flex:0 1 min(56dvh,620px);height:min(56dvh,620px);max-height:min(56dvh,620px);min-height:0;overflow:auto;overscroll-behavior:contain}.lr-volume-editor-panel .lr-report-table thead{position:sticky;z-index:8;top:0}.lr-volume-editor-panel .lr-report-table thead th{position:sticky;z-index:8;top:0}.lr-volume-editor-panel .lr-report-table thead th:first-child{z-index:9}.lr-volume-editor-panel .lr-report-footer{position:relative;z-index:10;flex-shrink:0}.lr-volume-edit-dialog .lr-upload-footer{flex-shrink:0}
.lr-volume-edit-confirmation{flex:0 0 auto;padding:10px 16px;border-top:1px solid #dce7ec;background:#fff}.lr-volume-edit-confirmation .lr-rka-confirm{max-width:100%}
@media(max-width:700px){.lr-volume-edit-dialog{width:calc(100% - 16px)}.lr-volume-edit-dialog .lr-volume-edit-body{padding:8px}.lr-volume-edit-toolbar{grid-template-columns:1fr;gap:8px}.lr-volume-edit-toolbar .lr-edit-unit-filter{width:auto;margin:0}.lr-volume-editor-panel .lr-edit-unit-filter{width:calc(100% - 16px);margin:8px}.lr-volume-editor-panel .lr-report-scroll{height:52dvh;max-height:52dvh}}
.lr-volume-number-input[data-lr-edit-auto]{color:#5f748a;border-color:#d4e0e8;background:#eef5f8;cursor:not-allowed}.lr-volume-number-input[data-lr-edit-auto]:focus{border-color:#d4e0e8;box-shadow:none}
.lr-volume-edit-table .lr-edit-group-blank{display:inline-block;width:100%;color:var(--navy);text-align:center}
.lr-settings-dialog::backdrop{background:#17375199;backdrop-filter:blur(2px)}
.lr-bopo-dialog{width:min(900px,calc(100% - 28px))}.lr-bopo-body{display:grid;gap:12px}.lr-bopo-filter{display:grid;grid-template-columns:minmax(150px,1.4fr) minmax(120px,1fr) minmax(100px,.7fr) auto;align-items:end;gap:8px;padding:10px 12px;border:1px solid #d7e5ee;border-radius:9px;background:#f7fbfd}.lr-bopo-filter label{display:grid;gap:4px;color:#294667;font-size:10px;font-weight:800}.lr-bopo-filter .lr-upload-select{min-height:34px;height:34px;padding:5px 26px 5px 8px;font-size:11px}.lr-bopo-filter .btn{min-height:34px;padding:6px 12px;white-space:nowrap}.lr-bopo-filter [data-lr-bopo-filter-error]{grid-column:1/-1;margin:0;color:#b03948}.lr-bopo-body>.lr-upload-note{margin:0}.lr-bopo-dialog .bopo-report-panel{margin:0}.lr-bopo-dialog .bopo-report-header{padding:11px 13px}.lr-bopo-dialog .bopo-report-header h2{font-size:12px}.lr-bopo-dialog .bopo-table{min-width:620px}.lr-bopo-dialog .bopo-table th,.lr-bopo-dialog .bopo-table td{height:39px;padding:7px 10px}.lr-bopo-dialog .bopo-table .bopo-realization-template{min-width:68px;min-height:23px;font-size:7.5px}.lr-export-dialog{width:min(520px,calc(100% - 28px))}
@media(max-width:700px){.lr-bopo-filter{grid-template-columns:1fr 1fr}.lr-bopo-filter label:first-of-type{grid-column:1/-1}.lr-bopo-filter .btn{width:100%}}
/* Laba/Rugi: two report choices fill the row; dialogs keep their controls visible. */
.accounting-page .lr-report-tabs{grid-template-columns:repeat(2,minmax(0,1fr))!important}
.lr-bopo-dialog[open],.lr-export-dialog[open]{display:flex;flex-direction:column;overflow:hidden!important}
.lr-bopo-dialog{width:min(920px,calc(100% - 28px));max-height:min(760px,calc(100dvh - 28px))}
.lr-export-dialog{width:min(540px,calc(100% - 28px));max-height:min(680px,calc(100dvh - 28px))}
.lr-bopo-dialog>.lr-settings-header,.lr-export-dialog>.lr-settings-header{display:flex!important;flex:0 0 auto;flex-flow:row nowrap!important;align-items:flex-start!important}
.lr-bopo-dialog>.lr-settings-header>div,.lr-export-dialog>.lr-settings-header>div{min-width:0}
.lr-bopo-dialog>.lr-settings-header .icon-btn,.lr-export-dialog>.lr-settings-header .icon-btn{margin-left:auto}
.lr-bopo-dialog>.lr-settings-footer,.lr-export-dialog>.lr-settings-footer{flex:0 0 auto}
.lr-export-dialog>form{display:flex;flex:1 1 auto;min-height:0;flex-direction:column;overflow:auto}.lr-export-dialog>form>.lr-settings-body{flex:1 1 auto}.lr-export-dialog>form>.lr-settings-footer{flex:0 0 auto}
.lr-bopo-body{display:grid;min-height:0;overflow:auto;padding:12px 14px!important;scrollbar-gutter:stable}
.lr-bopo-dialog .bopo-table{width:100%;min-width:0!important;table-layout:fixed;font-size:9px}
.lr-bopo-dialog .bopo-table th:first-child{width:31%;min-width:0}
.lr-bopo-dialog .bopo-table th:nth-child(2){width:31%}.lr-bopo-dialog .bopo-table th:nth-child(3),.lr-bopo-dialog .bopo-table th:nth-child(4){width:19%}
.lr-bopo-dialog .bopo-table th,.lr-bopo-dialog .bopo-table td{height:36px;padding:6px 8px;font-size:9px}
.lr-bopo-dialog .bopo-table thead th{height:33px;font-size:8px}
.lr-bopo-dialog .bopo-realization-template{position:static!important;min-width:62px!important;min-height:22px!important;padding:0 6px!important;font-size:7px!important;transform:none!important}
.lr-bopo-dialog .bopo-realization-cell{display:table-cell!important;text-align:center!important}
.lr-bopo-dialog .bopo-realization-value{margin-left:5px;font-size:9px}
@media(max-width:1120px){.accounting-page .lr-rka-filter{grid-template-columns:repeat(3,minmax(0,1fr))}.accounting-page .lr-rka-filter .lr-filter-lob{grid-column:auto}.accounting-page .lr-rka-filter .btn{width:100%}}
@media(max-width:680px){.accounting-page .lr-report-tabs{grid-template-columns:1fr!important}.accounting-page .lr-rka-filter{grid-template-columns:1fr 1fr}.accounting-page .lr-rka-filter .lr-filter-unit,.accounting-page .lr-rka-filter .lr-filter-lob{grid-column:1/-1}.lr-bopo-dialog{width:calc(100% - 16px)}.lr-bopo-body{padding:10px!important}.lr-bopo-dialog .bopo-table{font-size:8px}.lr-bopo-dialog .bopo-table th,.lr-bopo-dialog .bopo-table td{padding:5px 4px;font-size:8px}.lr-bopo-dialog .bopo-realization-template{min-width:52px!important;font-size:6.5px!important}.lr-bopo-dialog .bopo-realization-value{margin-left:2px;font-size:8px}.lr-export-dialog{width:calc(100% - 20px)}}
.lr-bopo-dialog>.lr-bopo-body{flex:1 1 auto;min-height:0;overflow:auto;align-content:start;overscroll-behavior:contain}
.lr-settings-header{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 16px;border-bottom:1px solid #dce7ec}.lr-settings-header .eyebrow{margin:0 0 4px;font-size:8px}.lr-settings-header h2{margin:0;color:var(--navy);font-size:15px}.lr-settings-header .icon-btn{flex:0 0 29px;font-size:20px}
.lr-settings-body{display:grid;gap:10px;padding:14px 16px}.lr-settings-body>p{margin:0 0 2px;color:#7b8ea4;font-size:10px;line-height:1.6}
.lr-settings-option{display:flex;align-items:center;gap:12px;padding:13px;border:1px solid #d8e6ee;border-radius:10px;background:#fafcfe}.lr-settings-option:hover{border-color:var(--cyan);background:#eef9fa}.lr-settings-option:focus-visible{outline:2px solid var(--cyan);outline-offset:2px}.lr-settings-icon{display:grid;place-items:center;flex:0 0 36px;height:36px;color:#fff;border-radius:9px;background:var(--brand-gradient);font-size:13px;font-weight:800}.lr-settings-option strong,.lr-settings-option small{display:block}.lr-settings-option strong{color:var(--navy);font-size:12px}.lr-settings-option small{margin-top:3px;color:#8092a6;font-size:9px}.lr-settings-arrow{margin-left:auto;color:#007d98;font-size:17px}
.lr-settings-footer{display:flex;justify-content:flex-end;padding:10px 16px;border-top:1px solid #dce7ec;background:#fafcfd}
.lr-settings-option{width:100%;text-align:left}
.lr-upload-label{color:var(--navy);font-size:10px;font-weight:800}
.lr-upload-select{width:100%;min-width:0;min-height:38px;padding:8px 10px;color:var(--navy);border:1px solid #d8e6ee;border-radius:9px;background:#fff;font-size:10px}
.lr-upload-select:focus-visible{outline:2px solid var(--cyan);outline-offset:2px}
.lr-upload-input{width:100%;min-width:0;height:auto;min-height:50px;padding:8px;color:#526b84;border:1px solid #d8e6ee;border-radius:9px;background:#fafcfe;font-size:10px;line-height:1.5}
.lr-upload-input::file-selector-button{height:32px;margin:0 10px 0 0;padding:6px 10px;color:#005a8f;border:1px solid #cde0eb;border-radius:6px;background:#edf7fb;font:inherit;font-weight:800;line-height:1.5;vertical-align:middle;cursor:pointer}
.lr-settings-body>.lr-upload-status{overflow-wrap:anywhere;color:#007d98}
.lr-settings-body>.lr-upload-note{padding:9px 10px;border:1px solid #dce7ec;border-radius:8px;background:#f3f8fc;font-size:9px}
.lr-upload-footer{justify-content:space-between;gap:8px}
.lr-rka-table .lr-rka-number-column{width:12%}.lr-rka-table tbody td{white-space:nowrap;font-size:9px}.lr-rka-table tbody td:not(:last-child){font-size:10px;font-weight:600;color:#000}.lr-rka-table tbody td:last-child{color:var(--navy);font-size:10px;font-weight:800}
.lr-rka-filter-panel{margin-bottom:10px;padding:10px 12px}.lr-rka-filter{display:flex;align-items:flex-end;gap:10px;flex-wrap:wrap}.lr-rka-filter>div{display:grid;gap:4px;min-width:130px}.lr-rka-filter .lr-filter-unit{width:180px;min-width:180px}.lr-rka-filter .lr-filter-month{min-width:140px}.lr-rka-filter .lr-filter-year{width:100px;min-width:100px}.lr-rka-filter .lr-filter-lob{position:relative;width:180px;min-width:180px}.lr-rka-filter .btn{min-height:38px}.lr-rka-filter-note{margin:0 0 7px auto;color:#7b8ea4;font-size:9px}.lr-lob-picker{position:relative}.lr-lob-picker>summary{position:relative;display:flex;align-items:center;min-height:38px;padding:8px 34px 8px 10px;color:var(--navy);border:1px solid #d8e6ee;border-radius:9px;background:#fff;cursor:pointer;font-size:10px;font-weight:700;list-style:none}.lr-lob-picker>summary::-webkit-details-marker{display:none}.lr-lob-picker>summary:after{content:'';position:absolute;right:13px;top:50%;width:7px;height:7px;border-right:2px solid var(--navy);border-bottom:2px solid var(--navy);transform:translateY(-70%) rotate(45deg);transform-origin:center;transition:transform .16s ease}.lr-lob-picker[open]>summary{border-color:#58c9c7;box-shadow:0 0 0 3px rgba(20,174,170,.1)}.lr-lob-picker[open]>summary:after{transform:translateY(-25%) rotate(225deg)}.lr-lob-options{position:absolute;top:calc(100% + 6px);left:0;z-index:30;display:grid;gap:2px;width:max-content;min-width:230px;max-width:300px;padding:8px;border:1px solid #c9dce7;border-radius:11px;background:#fff;box-shadow:0 14px 34px rgba(25,60,84,.18)}.lr-lob-options label{display:flex;align-items:center;gap:8px;padding:7px 8px;border-radius:7px;color:#294c69;font-size:9px;font-weight:700;cursor:pointer}.lr-lob-options label:hover{background:#edf8f8}.lr-lob-options input{width:15px;height:15px;accent-color:#079b9c}.lr-lob-options small{max-width:260px;padding:6px 8px 2px;color:#7b8fa4;font-size:8px;line-height:1.45}@media(max-width:600px){.lr-rka-filter .lr-filter-unit,.lr-rka-filter .lr-filter-lob{width:100%}.lr-lob-options{right:0;width:100%;min-width:0;max-width:none}}
/* Keep the multi-LOB control aligned with the standard filter fields. */
.lr-rka-filter .lr-filter-lob{flex:0 0 180px;width:180px;min-width:180px}.lr-lob-picker{width:100%}.lr-lob-picker>summary{width:100%;box-sizing:border-box}.lr-lob-picker>summary:after{right:15px;width:6px;height:6px;border-width:0 1.5px 1.5px 0;transform:translateY(-62%) rotate(45deg)}.lr-lob-picker[open]>summary:after{transform:translateY(-28%) rotate(225deg)}.lr-lob-options{width:100%;min-width:0;max-width:none}

.lr-rka-editable{min-width:960px}
.lr-rka-table .lr-rka-title-row>th{text-align:center}
.lr-rka-table [data-rka-empty=true]{display:inline-block;width:100%;color:var(--navy);text-align:center}
.lr-rka-table .lr-rka-negative-marker{color:#c62828;font-weight:800}
.lr-rka-editable td[data-rka-calculated=true]{background:#edf2f6}
.lr-rka-input::placeholder{color:var(--navy);opacity:1}
.lr-rka-input:placeholder-shown{text-align:center}
.lr-upload-step-content>[hidden]{display:none!important}
.lr-rka-manual-dialog{width:min(1400px,calc(100% - 32px));max-height:calc(100dvh - 32px);overflow:hidden}
.lr-rka-manual-dialog[open]{display:flex;flex-direction:column}
.lr-rka-manual-dialog[data-rka-stage=selection]{width:min(520px,calc(100% - 32px))}
.lr-rka-manual-dialog[data-rka-stage=selection] .lr-rka-manual-selection{grid-template-columns:1fr}
.lr-rka-manual-dialog [hidden]{display:none!important}
.lr-rka-existing-alert{display:grid;gap:8px;margin:12px 0;padding:12px;border:1px solid #efd297;border-radius:8px;background:#fff8e8;color:#875710;font-size:11px}.lr-rka-existing-alert p{margin:0;line-height:1.6}.lr-rka-existing-alert .btn{justify-self:start}
.lr-rka-manual-dialog>.lr-settings-header{flex-shrink:0}
.lr-rka-manual-dialog [data-rka-manual-form]{display:flex;flex-direction:column;min-height:0;overflow:hidden}
.lr-rka-manual-body{min-height:0;overflow:auto;padding:0 14px 14px;overscroll-behavior:contain}
.lr-rka-manual-selection{display:grid;grid-template-columns:minmax(180px,1fr) minmax(100px,180px) auto;align-items:end;gap:10px;margin:12px 0;padding:12px;border:1px solid #dce7ec;border-radius:8px;background:#fafcfe}.lr-rka-manual-selection>div{display:grid;gap:6px}.lr-rka-manual-selection .lr-upload-label span{color:#d74758}.lr-rka-manual-selection>p{grid-column:1/-1;margin:0;color:#71869c;font-size:10px}.lr-rka-manual-selection .btn{min-height:38px}
@media(max-width:700px){.lr-rka-manual-selection{grid-template-columns:1fr}.lr-rka-manual-selection>p{grid-column:1}.lr-rka-manual-selection .lr-upload-select{width:100%}}
.lr-rka-manual-dialog .lr-rka-save-panel{flex-shrink:0;margin:0;border-radius:0;border-bottom:0;border-left:0;border-right:0;box-shadow:none}
@media(max-width:700px){.lr-rka-manual-dialog{width:calc(100% - 16px);max-height:calc(100dvh - 16px)}.lr-rka-manual-body{padding:0 8px 8px}.lr-rka-manual-dialog .lr-rka-save-panel>div{flex-wrap:wrap}}
.lr-rka-input{width:100%;min-width:0;height:30px;padding:4px 6px;color:var(--navy);border:1px solid #cbdde8;border-radius:5px;background:#fff;text-align:right;font-size:10px;font-weight:600;font-variant-numeric:tabular-nums}.lr-rka-input:focus{outline:2px solid var(--cyan);outline-offset:1px}.lr-rka-input:invalid{border-color:#d95b66;background:#fff7f8}
.lr-rka-help{margin:10px 0;color:#71869c;font-size:10px}.lr-rka-save-panel{display:grid;gap:10px;margin-top:10px;padding:12px}.lr-rka-save-panel>p{margin:0;color:#007d98;font-size:10px}.lr-rka-save-panel>div{display:flex;justify-content:flex-end;gap:8px}.lr-rka-confirm{display:flex;align-items:flex-start;gap:7px;color:#526b84;font-size:9px;line-height:1.6}.lr-rka-confirm input{flex:0 0 14px;width:14px;height:14px;margin:2px 0 0;padding:0;accent-color:var(--blue)}.lr-rka-save-panel>.lr-rka-status-error{color:#b03948}
@media(max-width:700px){.lr-rka-filter>div{flex:1}.lr-rka-filter-note{width:100%;margin:0}.lr-rka-save-panel>div{justify-content:stretch}.lr-rka-save-panel>div>.btn{flex:1}}
@media(max-width:700px){.lr-rka-heading{align-items:flex-start;flex-direction:column}.lr-rka-heading>.btn{width:100%}}
.lr-report-table tr[hidden]{display:none}
.lr-report-table [data-lr-expandable]{cursor:pointer}
.lr-report-table [data-lr-expandable]:hover>*{background:#e5f2ff}
.lr-group-toggle{display:flex;align-items:center;gap:6px;width:100%;padding:0;color:inherit;border:0;background:transparent;text-align:left;font:inherit;font-weight:inherit;letter-spacing:inherit;line-height:inherit}
.lr-group-toggle:focus-visible{outline:2px solid #0a65d2;outline-offset:2px;border-radius:3px}
.lr-group-chevron{display:grid;place-items:center;flex:0 0 14px;width:14px;height:14px;color:#0a65d2;background:#e5f2ff;border-radius:4px;font-size:14px;line-height:1;transition:transform .15s ease}
.lr-group-toggle[aria-expanded=true] .lr-group-chevron{transform:rotate(90deg)}
.lr-rka-table [data-rka-group-output]{display:inline-block;opacity:1;visibility:visible;transform:translateY(0);transition:opacity .2s ease,transform .2s ease,visibility 0s}
.lr-rka-table [data-rka-group-output][data-rka-expanded=true]{opacity:0;visibility:hidden;transform:translateY(6px);transition:opacity .2s ease,transform .2s ease,visibility 0s .2s}
.lr-profitloss-table [data-lr-group-output]{display:inline-block;opacity:1;visibility:visible;transform:translateY(0);transition:opacity .2s ease,transform .2s ease,visibility 0s}
.lr-profitloss-table [data-lr-group-output][data-lr-expanded=true]{opacity:0;visibility:hidden;transform:translateY(6px);transition:opacity .2s ease,transform .2s ease,visibility 0s .2s}
.lr-percent-expand{display:inline-flex;align-items:center;justify-content:flex-end;gap:3px;max-width:100%;padding:1px 2px;color:inherit;background:transparent;border:0;border-radius:4px;font:inherit;font-weight:inherit;cursor:pointer}.lr-percent-expand:hover,.lr-percent-expand:focus-visible{color:#047a91;background:#dff4f4;outline:0}.lr-percent-expand i{display:inline-block;color:#058a9a;font-size:12px;font-style:normal;line-height:1;transition:transform .18s ease}.lr-percent-expand[aria-expanded=true] i{transform:rotate(180deg)}.lr-percentage-detail-row>td{padding:0!important;text-align:left!important}.lr-percentage-detail{display:flex;align-items:center;justify-content:space-between;gap:17px;padding:10px 14px 11px;background:linear-gradient(90deg,#effbfa,#f8fcfe);border-top:1px dashed #a9d8d9;border-bottom:1px solid #cee6e8}.lr-percentage-detail>div{display:grid;gap:3px;min-width:130px}.lr-percentage-detail strong{color:#0a7482;font-size:9px}.lr-percentage-detail>div span{color:#74899b;font-size:8px;font-weight:700}.lr-percentage-detail dl{display:grid;grid-template-columns:repeat(6,minmax(60px,1fr));gap:7px;margin:0}.lr-percentage-detail dl div{display:grid;gap:2px;padding:5px 7px;background:#fff;border:1px solid #cfe7e7;border-radius:6px;text-align:center}.lr-percentage-detail dt{color:#7890a3;font-size:7px;font-weight:800;white-space:nowrap}.lr-percentage-detail dd{margin:0;color:#124c79;font-size:9px;font-weight:900}@media(max-width:900px){.lr-percentage-detail{align-items:flex-start;flex-direction:column}.lr-percentage-detail dl{grid-template-columns:repeat(3,minmax(74px,1fr));width:100%}}@media(prefers-reduced-motion:reduce){.lr-percent-expand i{transition:none}}
.lr-rka-table .lr-row-detail-total:not([hidden]) [data-rka-output]{display:inline-block;animation:rka-total-enter .24s ease both}
@keyframes rka-total-enter{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:translateY(0)}}
@media(prefers-reduced-motion:reduce){.lr-rka-table [data-rka-group-output],.lr-rka-table [data-rka-group-output][data-rka-expanded=true]{transition:none;transform:none}.lr-rka-table .lr-row-detail-total:not([hidden]) [data-rka-output]{animation:none}}
@media(prefers-reduced-motion:reduce){.lr-profitloss-table [data-lr-group-output],.lr-profitloss-table [data-lr-group-output][data-lr-expanded=true]{transition:none;transform:none}}
.lr-report-table .lr-row-detail>*{background:#fafcfe}
.lr-report-table .lr-row-detail>th{padding-left:26px;color:#526b84;font-weight:500;text-transform:none}
.lr-rka-table .lr-row-detail>th{font-weight:600}
.lr-report-table .lr-row-detail-total>*{background:#edf7f8}
.lr-report-table .lr-row-detail-total>th{padding-left:26px;font-weight:800}
@media(max-width:600px){.lr-page-heading h1{font-size:20px}.lr-report-header h2{font-size:12px}.lr-report-table{min-width:720px}}

/* Laba / Rugi import audit */
.lr-audit-table-wrap{max-width:100%;overflow:auto}.lr-audit-table{width:100%;min-width:900px;border-collapse:separate;border-spacing:0;font-size:9px}.lr-audit-table th,.lr-audit-table td{padding:8px;border-right:1px solid #dce7ec;border-bottom:1px solid #e0eaee;text-align:left;vertical-align:middle}.lr-audit-table th{position:sticky;z-index:2;top:0;color:#6e849b;background:#edf4f7;font-size:8px;font-weight:900;text-transform:uppercase}.lr-audit-table td:last-child,.lr-audit-table th:last-child{border-right:0}
.lr-audit-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}.lr-audit-actions .btn{min-height:34px;padding:7px 12px;font-size:9px}
.lr-mapping-detail-dialog{width:min(1120px,calc(100vw - 28px));max-width:1120px}.lr-mapping-detail-body{max-height:72vh;overflow:auto}
.lr-mapping-summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.lr-mapping-summary article{display:grid;gap:3px;padding:11px;border:1px solid #d7e6ec;border-radius:10px;background:#f7fbfc}.lr-mapping-summary span{color:#6e849a;font-size:7px;font-weight:900}.lr-mapping-summary strong{color:var(--navy);font-size:17px}.lr-mapping-summary small{color:#8292a3;font-size:7px}
.lr-unmapped-section{margin-top:16px}.lr-unmapped-section h3{margin:0 0 8px;color:var(--navy);font-size:12px}.lr-unmapped-table{min-width:980px}.lr-unmapped-amount{text-align:right!important;white-space:nowrap;font-variant-numeric:tabular-nums}
@media(max-width:1100px){.formula-overview{grid-template-columns:auto 1fr}.formula-filter-controls{grid-column:1/-1}.formula-card-grid{grid-template-columns:1fr}}
@media(max-width:600px){.formula-term-connector{align-items:flex-start;flex-direction:column;margin-right:8px;margin-left:8px}.formula-term-choices{width:100%}.formula-term-choice{flex:1;justify-content:center;min-width:68px}}

/* Keep the manual label left while the BOPO realization value stays centered. */
.accounting-page .bopo-table td.bopo-realization-cell{position:relative;text-align:center!important}.accounting-page .bopo-table td.bopo-realization-cell .bopo-realization-template{position:absolute;top:50%;left:10px;margin:0!important;transform:translateY(-50%)}

.bopo-report-panel+.bopo-report-panel{margin-top:14px}
.accounting-page .bopo-table tbody td:not(.bopo-realization-cell){text-align:center}

/* Accounting document export */

/* Keterangan hari libur resmi setelah pengguna memilih tanggal di kalender lembur. */
.overtime-calendar-grid a.overtime-calendar-day{text-decoration:none}
.overtime-selected-holiday-note{margin:0;padding:8px 14px;color:#8a5b00;border-top:1px solid #f0dfb2;background:#fff9e9;font-size:8px;line-height:1.45}.overtime-selected-holiday-note strong{color:#6f4700}

/* Oracle-to-workpaper simulation */
.magang-page-heading{margin-bottom:12px}.magang-heading-actions{display:flex;align-items:center;gap:8px}.magang-filter-form{display:grid;grid-template-columns:minmax(220px,1.5fr) repeat(4,minmax(125px,.7fr)) auto;gap:11px;align-items:end}.magang-filter-form .filter-actions{align-self:end;white-space:nowrap}.magang-register-panel{overflow:hidden;border-top:3px solid #079c98}.magang-register-header{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:15px 18px;border-bottom:1px solid #dce7ec;background:linear-gradient(100deg,#effaf9 0%,#fff 58%)}.magang-register-header h2{margin:0;color:var(--navy);font-size:15px}.magang-register-header p{margin:4px 0 0;color:#71869b;font-size:9px}.magang-register-header>span{display:inline-flex;align-items:center;min-height:29px;padding:0 10px;color:#087c77;border:1px solid #bde3df;border-radius:999px;background:#e9f8f6;font-size:8px;font-weight:900;white-space:nowrap}.magang-table{min-width:850px}.magang-table th{height:40px;color:#4d718b;background:#eaf3f6}.magang-table tbody tr:nth-child(even){background:#fbfdfe}.magang-table tbody tr:hover{background:#f0fbfa}.magang-table td{height:53px;vertical-align:middle}.magang-name{display:grid;gap:3px;min-width:150px}.magang-name strong{color:var(--navy);font-size:10px}.magang-name small{color:#75899c;font-size:8px}.magang-contract{display:block;min-width:175px;color:#42617b;font-size:8.5px;font-weight:750}.magang-period{display:grid;gap:2px;min-width:100px}.magang-period strong{color:#405d74;font-size:8.5px}.magang-period span{color:#8696a6;font-size:8px}.magang-status{display:inline-flex;align-items:center;min-height:24px;padding:0 8px;border:1px solid;border-radius:999px;font-size:8px;font-weight:850;white-space:nowrap}.magang-status.active{color:#087d77;border-color:#b7e2dc;background:#ebf9f6}.magang-status.completed{color:#55718a;border-color:#d6e1e9;background:#f3f7fa}.magang-status.pending{color:#a16621;border-color:#efdaa9;background:#fff8e8}.magang-status.incomplete{color:#ae4553;border-color:#f0c7ce;background:#fff4f5}.magang-missing{color:#9a7f6a;font-size:8px;font-weight:750}.magang-form-dialog{display:flex;width:min(760px,calc(100% - 28px));max-height:calc(100dvh - 28px);flex-direction:column}.magang-form-dialog form{display:flex;min-height:0;flex:1;flex-direction:column}.magang-view-dialog{width:min(620px,calc(100% - 28px))}.magang-view-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:0}.magang-view-list>div{min-width:0;padding:10px 12px;border:1px solid #dce7ec;border-radius:9px;background:#f8fbfd}.magang-view-list dt{margin:0 0 4px;color:#788da0;font-size:8px;font-weight:850;text-transform:uppercase}.magang-view-list dd{margin:0;color:#193e68;font-size:10px;font-weight:700;overflow-wrap:anywhere}.magang-form-body{overflow-y:auto;padding:18px 20px}.magang-import-dialog{width:min(520px,calc(100% - 28px))}.magang-import-copy{margin:0 0 14px;color:#6f8498;font-size:9px;line-height:1.65}.magang-contract-hint{display:block;margin-top:5px;color:#72879a;font-size:8px;line-height:1.45}.magang-page-error{max-width:960px;margin:0 0 12px;padding:11px 14px}.magang-page-error ul{margin:6px 0 0;padding-left:17px}.btn-danger{color:#fff;background:#c6505d;border-color:#c6505d}.btn-danger:hover{background:#ad3b4a;border-color:#ad3b4a}@media(max-width:1100px){.magang-filter-form{grid-template-columns:repeat(3,minmax(0,1fr))}.magang-filter-form .search-group{grid-column:span 3}}@media(max-width:650px){.magang-heading-actions{display:grid;grid-template-columns:1fr 1fr;width:100%;margin-top:10px}.magang-heading-actions .btn{width:100%}.magang-filter-form{grid-template-columns:1fr}.magang-filter-form .search-group{grid-column:auto}.magang-filter-form .filter-actions{display:grid;grid-template-columns:1fr 1fr}.magang-register-header{align-items:flex-start;flex-direction:column}.magang-form-dialog,.magang-import-dialog,.magang-view-dialog{width:calc(100% - 16px);max-height:calc(100dvh - 16px)}.magang-view-list{grid-template-columns:1fr}}
.magang-filter-form{grid-template-columns:minmax(220px,320px) repeat(4,minmax(120px,160px)) max-content;justify-content:start}.magang-filter-form .filter-actions{display:flex;align-items:center;gap:8px;white-space:nowrap}.magang-action-menu{position:relative}.magang-action-menu>summary{display:grid;place-items:center;width:44px;height:44px;cursor:pointer;list-style:none;color:#0876ad;border:1px solid #bfddf2;border-radius:9px;background:#f7fcff}.magang-action-menu>summary::-webkit-details-marker{display:none}.magang-action-menu>summary svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8}.magang-action-menu>summary:hover,.magang-action-menu[open]>summary{color:#fff;border-color:transparent;background:linear-gradient(135deg,#087bb7,#47c7bd)}.magang-action-menu-popover{position:absolute;z-index:40;top:calc(100% + 7px);right:0;display:grid;min-width:180px;padding:6px;border:1px solid #cfe2ed;border-radius:10px;background:#fff;box-shadow:0 10px 23px rgba(26,65,91,.16)}.magang-action-menu-popover a,.magang-action-menu-popover button{width:100%;padding:9px 10px;color:#244969;border:0;border-radius:7px;background:transparent;font:inherit;font-size:9px;font-weight:800;text-align:left;text-decoration:none;cursor:pointer}.magang-action-menu-popover a:hover,.magang-action-menu-popover button:hover{color:#047c88;background:#edfafa}.magang-action-menu-popover>span{height:1px;margin:3px 5px;background:#dce8ee}.magang-action-menu-popover .is-danger{color:#b63f4d}.magang-action-menu-popover .is-danger:hover{color:#a5313f;background:#fff2f3}.magang-delete-all-confirm{display:flex;align-items:flex-start;gap:8px;color:#6b4050;font-size:9px;line-height:1.55}.magang-delete-all-confirm input{width:16px;height:16px;margin:0;accent-color:#bd4150;flex:0 0 auto}@media(max-width:1100px){.magang-filter-form{grid-template-columns:repeat(3,minmax(160px,1fr));justify-content:stretch}.magang-filter-form .search-group{grid-column:span 3}.magang-filter-form .filter-actions{justify-content:flex-start}}@media(max-width:650px){.magang-filter-form{grid-template-columns:1fr}.magang-filter-form .search-group{grid-column:auto}.magang-filter-form .filter-actions{display:flex;justify-content:flex-start}}
.magang-filter-form{display:flex!important;flex-wrap:wrap;align-items:flex-end;justify-content:flex-start}.magang-filter-form>.form-group{flex:0 1 160px;min-width:120px}.magang-filter-form>.search-group{flex-basis:320px;min-width:220px}.magang-filter-form>.list-order-filter{flex:0 0 auto;min-width:0}.magang-filter-form>.filter-actions{width:auto!important;flex:0 0 auto;align-self:flex-end}@media(max-width:650px){.magang-filter-form>.search-group{flex:1 0 100%}.magang-filter-form>.form-group:not(.search-group){flex:1 1 140px}.magang-filter-form>.filter-actions{flex:0 0 auto}}
.magang-filter-form{display:grid!important;grid-template-columns:minmax(190px,1.55fr) repeat(3,minmax(115px,.8fr)) 44px max-content;align-items:end;gap:11px}.magang-filter-form>.form-group,.magang-filter-form>.search-group,.magang-filter-form>.list-order-filter{min-width:0}.magang-filter-form>.search-group{grid-column:auto}.magang-filter-form>.filter-actions{display:flex;width:auto!important;grid-column:auto;align-self:end;justify-content:flex-start}@media(max-width:900px){.magang-filter-form{grid-template-columns:repeat(2,minmax(0,1fr))}.magang-filter-form>.search-group{grid-column:1/-1}.magang-filter-form>.filter-actions{grid-column:1/-1}}@media(max-width:560px){.magang-filter-form{grid-template-columns:1fr}.magang-filter-form>.search-group,.magang-filter-form>.filter-actions{grid-column:auto}}
.magang-filter-form{gap:8px}.magang-filter-form .form-group label{margin-bottom:4px;font-size:8px}.magang-filter-form input,.magang-filter-form select,.magang-filter-form .input-with-icon{min-height:38px;height:38px;font-size:9px}.magang-filter-form .input-with-icon input{height:36px;min-height:36px;padding-left:29px;font-size:9px}.magang-filter-form .input-with-icon span{left:9px;font-size:13px}.magang-filter-form .list-order-filter,.magang-filter-form .list-order-menu>summary,.magang-action-menu>summary{width:38px;height:38px}.magang-filter-form .list-order-menu>summary svg,.magang-action-menu>summary svg{width:17px;height:17px}.magang-filter-form .filter-actions{gap:7px}.magang-filter-form .filter-actions .btn{min-height:38px;padding:6px 12px;font-size:8.5px}
.magang-filter-form{grid-template-columns:minmax(190px,1.55fr) repeat(3,minmax(115px,.8fr)) 38px max-content}
.magang-register-panel.is-loading{pointer-events:none;opacity:.62;transition:opacity .14s ease}
.simulation-page-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:16px}.simulation-page-heading>div:first-child{min-width:0}@media(max-width:600px){.simulation-page-heading{align-items:stretch;flex-direction:column;gap:0}}
.simulation-heading-actions{display:flex;align-items:center;gap:8px}.simulation-heading-actions .btn{min-width:132px}.simulation-intro-card{display:flex;align-items:center;gap:14px;padding:18px 20px;border-top:3px solid #099d91;background:linear-gradient(105deg,#f0fbfa 0%,#fff 63%)}.simulation-intro-card .eyebrow{margin:0 0 3px;font-size:7.5px}.simulation-intro-card h2{margin:0;color:var(--navy);font-size:16px}.simulation-intro-card p:not(.eyebrow){margin:4px 0 0;color:#71869b;font-size:9px;line-height:1.55}.simulation-upload-dialog{width:min(900px,calc(100% - 28px))}.simulation-upload-card{margin:0;border-top:0;border-bottom:1px solid #dce7ec}.simulation-upload-description{margin:0;color:#74889d;font-size:9px;line-height:1.6}.simulation-upload-dialog .export-document-actions{justify-content:space-between}.simulation-upload-dialog .export-document-actions .btn{min-width:120px}.simulation-file-label{color:var(--navy);font-size:9px;font-weight:850}.simulation-file-label b{color:#ce3d4e}.simulation-error{margin:16px 19px 0;padding:11px 13px;color:#a53443;border:1px solid #f3bdc5;border-radius:9px;background:#fff5f6;font-size:10px}.simulation-history{max-width:1050px;margin:0 auto;overflow:hidden;border-top:3px solid #0d9f94}.simulation-history-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:17px 19px;border-bottom:1px solid #dce7ec;background:linear-gradient(100deg,#f1fbfa 0%,#fff 54%)}.simulation-history-heading .eyebrow{margin:0 0 3px}.simulation-history-heading h2{margin:0;color:var(--navy);font-size:16px}.simulation-history-count{display:inline-flex;align-items:center;min-height:28px;padding:0 10px;color:#087d77;border:1px solid #bce4df;border-radius:999px;background:#e9f8f6;font-size:8px;font-weight:900}.simulation-empty{margin:0;padding:19px;color:#6b8295;font-size:10px}.simulation-table{min-width:900px}.simulation-table th{height:41px;color:#47708c;background:#eaf3f6}.simulation-table tbody tr{transition:background .16s ease}.simulation-table tbody tr:nth-child(even){background:#fbfdfe}.simulation-table tbody tr:hover{background:#f0fbfa}.simulation-table td{height:54px;vertical-align:middle}.simulation-created{color:#4a637d;font-variant-numeric:tabular-nums;white-space:nowrap}.simulation-period-badge{display:inline-flex;align-items:center;gap:5px;padding:5px 7px;color:#4d6f85;border:1px solid #d4e6ed;border-radius:7px;background:#fff;white-space:nowrap}.simulation-period-badge strong{color:#087d77;font-size:8px}.simulation-period-badge span{font-size:8px}.simulation-source-name{display:block;max-width:250px;overflow:hidden;color:#365b78;font-weight:750;text-overflow:ellipsis;white-space:nowrap}.simulation-stat{display:inline-flex;align-items:center;gap:3px;min-height:26px;padding:0 8px;border:1px solid;border-radius:999px;font-size:8px;font-weight:800;white-space:nowrap}.simulation-stat b{font-size:9px}.simulation-stat-info{color:#416d93;border-color:#c9deed;background:#f0f8fd}.simulation-stat-success{color:#08796f;border-color:#b9e2dd;background:#edf9f7}.simulation-stat-warning{color:#a5651a;border-color:#efd39d;background:#fff8e9}.simulation-actions{display:flex;align-items:center;gap:6px;white-space:nowrap}.simulation-actions form{margin:0}.simulation-table .btn{min-height:31px;padding:6px 10px;white-space:nowrap;font-size:8px}.simulation-actions .btn-danger-outline{color:#b84754;border-color:#efc2c8;background:#fff7f8}.simulation-actions .btn-danger-outline:hover{color:#fff;border-color:#c5535e;background:#c5535e}@media(max-width:600px){.simulation-heading-actions{width:100%;margin-top:10px}.simulation-heading-actions .btn{width:100%}.simulation-intro-card{align-items:flex-start;padding:15px}.simulation-upload-dialog{width:calc(100% - 16px);max-height:calc(100dvh - 16px)}.simulation-upload-dialog .export-document-actions{display:grid;grid-template-columns:1fr 1fr}.simulation-upload-dialog .export-document-actions .btn{width:100%;min-width:0}.simulation-history-heading{align-items:flex-start}.simulation-history-count{margin-top:2px}.simulation-table{min-width:820px}.simulation-source-name{max-width:190px}}
.export-document-heading{margin-bottom:12px}.export-document-panel{max-width:1050px;margin:0 auto;overflow:hidden;border-top:3px solid #099d91}.export-document-intro{display:flex;align-items:center;gap:14px;padding:17px 19px;border-bottom:1px solid #dce7ec;background:#fff}.export-document-icon{display:grid;place-items:center;flex:0 0 44px;height:44px;color:#fff;border-radius:12px;background:linear-gradient(135deg,#0879ad,#05a8a4);font-size:22px;font-weight:900}.export-document-intro .eyebrow{margin:0 0 3px;font-size:7.5px}.export-document-intro h2{margin:0;color:var(--navy);font-size:16px}.export-document-intro p:not(.eyebrow){margin:4px 0 0;color:#73879b;font-size:9px;line-height:1.55}.export-document-form{display:grid;gap:15px;padding:18px 19px}.export-document-filters{display:grid;grid-template-columns:minmax(220px,1.2fr) minmax(160px,.8fr) minmax(130px,.65fr);gap:11px}.export-document-filters label{display:grid;gap:6px;color:var(--navy);font-size:9px;font-weight:850}.export-document-filters label>span b,.export-unit-fieldset legend b{color:#ce3d4e}.export-document-filters .lr-upload-select{min-height:42px;font-size:10px}.export-unit-fieldset{min-width:0;margin:0;padding:0;border:0}.export-unit-fieldset legend{margin:0 0 9px;color:var(--navy);font-size:10px;font-weight:900}.export-unit-toolbar{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:8px;padding:9px 11px;border:1px solid #d8e6ec;border-radius:9px;background:#f7fafc}.export-unit-toolbar p{display:grid;gap:2px;margin:0}.export-unit-toolbar strong{color:var(--navy);font-size:9px}.export-unit-toolbar span{color:#8292a4;font-size:7.5px}.export-unit-toolbar>div{display:flex;gap:6px}.export-unit-toolbar .btn{min-height:31px;padding:5px 9px;font-size:8px}.export-unit-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.export-unit-grid>label{position:relative;min-width:0;cursor:pointer}.export-unit-grid input{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}.export-unit-grid label>span{display:grid;grid-template-columns:28px minmax(0,1fr);grid-template-rows:auto auto;align-items:center;min-height:66px;padding:10px 11px;color:#526b83;border:1px solid #d8e5eb;border-radius:9px;background:#fff;transition:border-color .15s ease,background .15s ease,box-shadow .15s ease}.export-unit-grid i{display:grid;grid-row:1/3;place-items:center;width:23px;height:23px;color:#a7b5c0;border:1px solid #cbd9df;border-radius:7px;background:#f4f7f9;font-style:normal;font-size:11px}.export-unit-grid strong{min-width:0;color:var(--navy);font-size:9px}.export-unit-grid small{margin-top:3px;color:#8797a7;font-size:7px;line-height:1.35}.export-unit-grid input:checked+span{border-color:#85d1cb;background:#f0faf8;box-shadow:0 0 0 2px rgba(9,157,145,.07)}.export-unit-grid input:checked+span i{color:#fff;border-color:#099d91;background:#099d91}.export-unit-grid input:focus-visible+span{outline:2px solid #099d91;outline-offset:2px}.export-unit-error{margin:8px 0 0;color:#b73b4a;font-size:8px;font-weight:800}.export-document-note{display:flex;align-items:flex-start;gap:9px;padding:10px 12px;color:#657b91;border:1px solid #d8e6ec;border-left:3px solid #099d91;border-radius:8px;background:#f6fafb;font-size:8.5px;line-height:1.55}.export-document-note strong{flex:0 0 auto;color:var(--navy)}.export-document-actions{display:flex;justify-content:flex-end;gap:8px;padding-top:2px}.export-document-actions .btn{min-width:115px}@media(max-width:800px){.export-document-filters{grid-template-columns:1fr 1fr}.export-document-filters label:first-child{grid-column:1/-1}.export-unit-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:560px){.export-document-intro{align-items:flex-start}.export-document-form{padding:14px}.export-document-filters{grid-template-columns:1fr}.export-document-filters label:first-child{grid-column:auto}.export-unit-toolbar{align-items:flex-start;flex-direction:column}.export-unit-toolbar>div{width:100%}.export-unit-toolbar .btn{flex:1}.export-unit-grid{grid-template-columns:1fr}.export-document-note{flex-direction:column}.export-document-actions{display:grid;grid-template-columns:1fr 1fr}.export-document-actions .btn{width:100%;min-width:0}}

/* Rekap Laba Rugi: struktur tabel disiapkan sebelum rumus perhitungan diterapkan. */
.lr-rekap-intro{margin:4px 0 0;color:#6f8497;font-size:9px}.lr-rekap-filter{grid-template-columns:minmax(220px,1.3fr) minmax(140px,.75fr) minmax(120px,.6fr) auto auto}.lr-rekap-panel{overflow:hidden;border-top:3px solid #139e98}.lr-rekap-header{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:14px 18px;border-bottom:1px solid #dce7ec;background:linear-gradient(100deg,#f2fbfd 0%,#fff 58%,#f4fbf8 100%)}.lr-rekap-header p{margin:0 0 4px;color:#70879b;font-size:8px;font-weight:900;letter-spacing:.55px}.lr-rekap-header h2{margin:0;color:var(--navy);font-size:14px}.lr-rekap-header>span{display:inline-flex;align-items:center;min-height:27px;padding:0 9px;color:#9b6a16;border:1px solid #eed8a7;border-radius:999px;background:#fff8e9;font-size:8px;font-weight:850;white-space:nowrap}.lr-rekap-table-wrap{overflow:auto;overscroll-behavior-x:contain}.lr-rekap-table{width:100%;min-width:900px;border-collapse:collapse;color:#1c334d;font-size:10px}.lr-rekap-table caption{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}.lr-rekap-table th,.lr-rekap-table td{height:39px;padding:7px 10px;border:1px solid #bfccd8;text-align:center;vertical-align:middle}.lr-rekap-table thead{background:var(--system-table-header-gradient)}.lr-rekap-table thead th{height:38px;padding:5px 8px;color:#fff!important;border-color:transparent!important;background:transparent!important;font-size:8.5px;font-weight:900;line-height:1.28;text-transform:uppercase}.lr-rekap-table tbody tr:nth-child(even){background:#fbfdfe}.lr-rekap-table tbody tr:hover{background:#f1faf9}.lr-rekap-table tbody td:first-child{width:46px;font-weight:800}.lr-rekap-table tbody th{min-width:260px;color:#132d48;background:transparent;text-align:left;font-size:10px;font-weight:850}.lr-rekap-table td{font-variant-numeric:tabular-nums}.lr-rekap-prognosis-heading{width:82px;min-width:82px;padding:5px 8px!important}.lr-rekap-prognosis-heading span{display:inline-block;letter-spacing:.35px;writing-mode:horizontal-tb;transform:none}.lr-rekap-edit-dialog{width:min(1240px,calc(100% - 28px))}.lr-rekap-edit-dialog>form{display:flex;flex-direction:column;min-height:0}.lr-rekap-edit-dialog .lr-rka-help{margin:12px 16px;color:#6f8497;font-size:10px;line-height:1.55}.lr-rekap-edit-table-wrap{max-height:min(62dvh,620px);overflow:auto;overscroll-behavior:contain;border-top:1px solid #dce7ec;border-bottom:1px solid #dce7ec}.lr-rekap-edit-table{min-width:960px}.lr-rekap-edit-table thead th{position:sticky;top:0;z-index:1}.lr-rekap-edit-table input{width:100%;min-width:105px;padding:7px 8px;color:#163c66;border:1px solid #c4dbe8;border-radius:6px;background:#fff;text-align:right;font:inherit;font-weight:750;outline:none}.lr-rekap-edit-table input:focus{border-color:#139e98;box-shadow:0 0 0 3px #139e9822}.lr-rekap-edit-table input[readonly]{color:#61778d;border-color:transparent;background:#eff5f8;cursor:default}.lr-rekap-edit-table input[readonly]:focus{border-color:transparent;box-shadow:none}.lr-rekap-edit-table output{font-weight:800}.lr-rekap-edit-dialog .lr-settings-footer{margin-top:0}@media(max-width:760px){.lr-rekap-filter{grid-template-columns:1fr 1fr}.lr-rekap-filter .lr-filter-unit{grid-column:1/-1}.lr-rekap-filter .btn{width:100%}.lr-rekap-header{align-items:flex-start;flex-direction:column}.lr-rekap-edit-dialog{width:calc(100% - 16px)}}
.lr-rekap-edit-dialog[open]{display:flex;flex-direction:column;max-height:calc(100dvh - 16px);overflow:hidden}.lr-rekap-edit-dialog>form{overflow:hidden}.lr-rekap-edit-toolbar{display:grid;grid-template-columns:minmax(0,1fr) 170px;align-items:end;gap:12px;padding:8px 16px}.lr-rekap-edit-dialog .lr-rekap-edit-toolbar .lr-rka-help{margin:0;font-size:9px;line-height:1.35}.lr-rekap-edit-toolbar .lr-upload-label{display:grid;gap:4px;color:#54708b;font-size:8px;font-weight:850}.lr-rekap-edit-toolbar .lr-upload-select{min-height:30px;height:30px;padding:4px 26px 4px 8px;font-size:9px}.lr-rekap-edit-table-wrap{max-height:none;overflow:visible}.lr-rekap-edit-table th,.lr-rekap-edit-table td{height:31px;padding:3px 6px}.lr-rekap-edit-table thead th{height:31px;padding:3px 6px;font-size:8px}.lr-rekap-edit-table tbody th{font-size:9px}.lr-rekap-edit-table input{min-width:90px;padding:4px 6px;font-size:9px}.lr-rekap-readonly{display:inline-flex;align-items:center;justify-content:flex-end;gap:4px;width:100%;min-height:20px;color:#8495a5;font-size:9px;font-weight:750;white-space:nowrap}.lr-rekap-readonly svg{width:12px;height:12px;fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.9}.lr-rekap-edit-dialog .lr-settings-footer{min-height:44px;padding:8px 16px}.lr-rekap-edit-dialog .lr-settings-footer .btn{min-height:30px;padding:5px 11px;font-size:10px}@media(max-width:680px){.lr-rekap-edit-toolbar{grid-template-columns:1fr}.lr-rekap-edit-toolbar .lr-upload-label{width:100%}}
.sdm-jatim-table-wrap{overflow:auto}.sdm-jatim-table{min-width:1360px;border-collapse:collapse;font-size:10px}.sdm-jatim-table th,.sdm-jatim-table td{padding:6px 8px;border:1px solid #d4e1ea;white-space:nowrap}.sdm-jatim-table thead{background:#12455a}.sdm-jatim-table thead th{color:#fff!important;border-color:#347085;background:transparent!important;font-size:9px;font-weight:850;text-align:center}.sdm-jatim-table tbody tr:hover{background:#f0f9fb}.sdm-jatim-table td:first-child,.sdm-jatim-table td:nth-child(3),.sdm-jatim-table td:nth-child(4),.sdm-jatim-table td:nth-child(7),.sdm-jatim-table td:nth-child(8){text-align:center}.sdm-jatim-table th:nth-child(1){width:45px}.sdm-jatim-table th:nth-child(2){width:245px}.sdm-jatim-table th:nth-child(3){width:80px}.sdm-jatim-table th:nth-child(4){width:62px}.sdm-jatim-table th:nth-child(5),.sdm-jatim-table th:nth-child(6){width:210px}.sdm-jatim-table th:nth-child(7){width:145px}.sdm-jatim-table th:nth-child(8){width:95px}.sdm-jatim-table th:nth-child(9){width:125px}.sdm-jatim-table th:nth-child(10){width:245px}.sdm-jatim-unavailable{color:#91a1b1;font-style:italic}
.sdm-jatim-table{min-width:1315px}.sdm-jatim-table td:first-child{text-align:left}.sdm-jatim-table td:nth-child(2),.sdm-jatim-table td:nth-child(3),.sdm-jatim-table td:nth-child(6),.sdm-jatim-table td:nth-child(7){text-align:center}.sdm-jatim-table th:nth-child(1){width:245px}.sdm-jatim-table th:nth-child(2){width:80px}.sdm-jatim-table th:nth-child(3){width:62px}.sdm-jatim-table th:nth-child(4),.sdm-jatim-table th:nth-child(5){width:210px}.sdm-jatim-table th:nth-child(6){width:145px}.sdm-jatim-table th:nth-child(7){width:95px}.sdm-jatim-table th:nth-child(8){width:125px}.sdm-jatim-table th:nth-child(9){width:245px}
.sdm-jatim-table{min-width:1430px}.sdm-jatim-table th:nth-child(10){width:88px}.sdm-jatim-actions{display:table-cell;white-space:nowrap;text-align:center}.sdm-profile-dialog{width:min(720px,calc(100% - 28px))}.sdm-profile-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;padding:14px 16px}.sdm-profile-grid label{display:grid;gap:5px;color:#587188;font-size:10px;font-weight:800}.sdm-profile-grid input,.sdm-profile-grid select{width:100%;min-height:36px;padding:7px 9px;color:#1d3b5a;border:1px solid #cbdde8;border-radius:7px;background:#fff;font:inherit}.sdm-profile-grid input:focus,.sdm-profile-grid select:focus{outline:none;border-color:#168dcc;box-shadow:0 0 0 3px #168dcc22}.sdm-profile-email{grid-column:1/-1}.btn.btn-danger{color:#fff;background:#c2384a;border-color:#c2384a}.btn.btn-danger:hover{background:#a82c3c}@media(max-width:620px){.sdm-profile-dialog{width:calc(100% - 16px)}.sdm-profile-grid{grid-template-columns:1fr}.sdm-profile-email{grid-column:auto}}
.magang-table{min-width:1000px;table-layout:fixed}
.magang-col-participant{width:165px}.magang-col-contract{width:155px}.magang-col-unit{width:135px}.magang-col-type{width:110px}.magang-col-period{width:140px}.magang-col-status{width:76px}.magang-col-note{width:105px}.magang-col-actions{width:115px}
.magang-table th:nth-child(1),.magang-table td:nth-child(1){width:165px;min-width:165px;max-width:165px}
.magang-table th:nth-child(2),.magang-table td:nth-child(2){width:155px;min-width:155px;max-width:155px}
.magang-table th:nth-child(6),.magang-table td:nth-child(6){width:76px;min-width:76px;max-width:76px;padding-inline:5px}.magang-table th:nth-child(7),.magang-table td:nth-child(7){width:105px;min-width:105px;max-width:105px;padding-inline:5px}.magang-table th:nth-child(8),.magang-table td:nth-child(8){width:115px;min-width:115px;max-width:115px;padding-inline:5px}
.magang-name{min-width:0}.magang-name strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.magang-pkk-link,.magang-pkk-empty{font-weight:850;background:linear-gradient(100deg,#079b83 0%,#0879b6 100%);-webkit-background-clip:text;background-clip:text;color:transparent}.magang-pkk-link{display:inline-flex;align-items:center;text-decoration:none}.magang-pkk-link[hidden]{display:none!important}.magang-pkk-link:hover{text-decoration:underline;filter:brightness(.9)}.magang-pkk-link:focus-visible{outline:2px solid #66b9b2;outline-offset:3px;border-radius:2px}
.magang-contract{min-width:0;max-width:155px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.magang-view-list{gap:0 24px}.magang-view-list>div{padding:12px 0;border:0;border-bottom:1px solid #e2eaf0;border-radius:0;background:transparent}.magang-view-list>div.modal-span-2{grid-column:1/-1}
.magang-table .magang-note-header{width:125px;min-width:125px;text-align:center!important}
.magang-note-cell{width:125px;min-width:125px;max-width:125px;padding-inline:8px!important;color:#62788f;font-size:8.5px;line-height:1.45;text-align:center!important;overflow-wrap:anywhere}
.magang-summary-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin:0 0 14px}
.magang-summary-card{position:relative;display:flex;align-items:center;gap:14px;min-height:78px;overflow:hidden;padding:14px 18px;background:linear-gradient(#fff,#fff) padding-box,var(--brand-gradient) border-box;border:1.5px solid transparent;border-radius:14px;box-shadow:0 7px 17px rgba(0,63,125,.09)}
.magang-summary-card::after{position:absolute;z-index:0;top:50%;right:28%;width:132px;height:132px;content:"";border:24px solid var(--magang-ring);border-radius:50%;transform:translateY(-50%);opacity:.62}
.magang-summary-card>*{position:relative;z-index:1}.magang-summary-card.is-active{--magang-ring:#d9f3ee}.magang-summary-card.is-completed{--magang-ring:#f8e0e4}
.magang-summary-icon{display:grid;place-items:center;flex:0 0 48px;height:48px;color:#fff;border-radius:13px;font-size:23px;font-weight:900;box-shadow:0 7px 15px rgba(0,72,128,.18)}
.magang-summary-card.is-active .magang-summary-icon{background:linear-gradient(145deg,#007f70,#13ad98)}.magang-summary-card.is-completed .magang-summary-icon{background:linear-gradient(145deg,#bd2445,#e34e61)}
.magang-summary-card small,.magang-summary-card strong{display:block}.magang-summary-card small{color:#70849b;font-size:8.5px;font-weight:850;letter-spacing:.45px}.magang-summary-card strong{margin-top:5px;color:#1665ab;font-size:22px;line-height:1}
@media(max-width:650px){.magang-summary-grid{grid-template-columns:1fr;gap:9px}.magang-summary-card{min-height:68px;padding:11px 13px}.magang-summary-icon{flex-basis:40px;width:40px;height:40px;font-size:19px}}
.lr-rekap-panel{border:2px solid transparent;background:linear-gradient(#fff,#fff) padding-box,linear-gradient(90deg,#133f83 0%,#1d9caf 52%,#ffd05d 100%) border-box}

/* Aturan baru: judul tabel tanpa bingkai, langsung menyatu dengan header tabel. */
.table-title-flat,.lr-rekap-panel.table-title-flat,.lr-report-panel.table-title-flat{--table-title-flat-table-head-height:38px;overflow:hidden!important;border:0!important;border-top:0!important;border-radius:18px 18px 0 0!important;background:#fff!important;box-shadow:none!important}
.table-title-flat>.table-title-flat__header{position:relative!important;z-index:2!important;display:flex!important;align-items:center!important;justify-content:space-between!important;gap:10px!important;min-height:96px!important;margin:0!important;padding:18px 25px!important;border:0!important;border-radius:18px 18px 0 0!important;background:linear-gradient(100deg,#f4fbfd 0%,#fff 58%,#fffdf4 100%)!important}
.table-title-flat>.table-title-flat__header::before{display:none!important}
.lr-report-panel.table-title-flat>.table-title-flat__header,.simulation-history.table-title-flat>.table-title-flat__header,.magang-register-panel.table-title-flat>.table-title-flat__header{box-sizing:border-box!important;border:2px solid transparent!important;border-bottom:0!important;border-radius:18px 18px 0 0!important;background:linear-gradient(100deg,#f4fbfd 0%,#fff 58%,#fffdf4 100%) padding-box,linear-gradient(90deg,#133f83 0%,#1d9caf 52%,#ffd05d 100%) border-box!important;background-clip:padding-box,border-box!important}
.sdm-daily-panel.table-title-flat{--table-title-flat-table-head-height:28px}
.sdm-daily-panel.table-title-flat>.sdm-daily-title-area.table-title-flat__header{display:block!important;min-height:0!important;padding:0!important;border:2px solid transparent!important;border-bottom:0!important;border-radius:18px 18px 0 0!important;background:linear-gradient(100deg,#f4fbfd 0%,#fff 58%,#fffdf4 100%) padding-box,linear-gradient(90deg,#133f83 0%,#1d9caf 52%,#ffd05d 100%) border-box!important;background-clip:padding-box,border-box!important}
.sdm-daily-panel.table-title-flat>.sdm-daily-title-area .sdm-daily-panel-header{min-height:66px!important;padding:14px 18px!important;border:0!important;background:transparent!important}
.sdm-daily-panel.table-title-flat>.sdm-daily-title-area .sdm-daily-legend{border-bottom:0!important;background:transparent!important}
.table-title-flat>.table-title-flat__header::after{display:none!important}
.table-title-flat>.table-title-flat__header>*{position:relative!important;z-index:1!important}
.table-title-flat>.table-title-flat__header p{margin:0 0 10px!important;color:#6f89a0!important;font-size:9px!important;font-weight:900!important;letter-spacing:.85px!important}
.table-title-flat>.table-title-flat__header h2{margin:0!important;color:var(--navy)!important;font-size:16px!important}
.table-title-flat>.table-title-flat__header>span{display:inline-flex!important;align-items:center!important;min-height:39px!important;padding:0 14px!important;color:#996719!important;border:1px solid #ead2a3!important;border-radius:999px!important;background:#fff9ed!important;font-size:9px!important;font-weight:900!important;white-space:nowrap!important}
.table-title-flat>.table-title-flat__table{position:relative!important;z-index:1!important;width:100%!important;margin:0!important;border:0!important}
.table-title-flat>.table-title-flat__table::before,.table-title-flat>.table-title-flat__table::after{position:absolute!important;z-index:9!important;top:0!important;display:block!important;width:2px!important;height:var(--table-title-flat-table-head-height)!important;content:""!important;pointer-events:none}
.lr-report-panel.table-title-flat{--table-title-flat-table-head-height:25px}
.lr-profitloss-report-panel.table-title-flat>.table-title-flat__header{min-height:58px!important;padding:9px 18px!important}
.lr-profitloss-report-panel.table-title-flat>.table-title-flat__header>span{min-height:29px!important;padding:0 10px!important;font-size:8px!important}
.simulation-history.table-title-flat{--table-title-flat-table-head-height:34px}
.magang-register-panel.table-title-flat{--table-title-flat-table-head-height:34px}
@media(max-width:760px){.table-title-flat>.table-title-flat__header{align-items:flex-start!important;flex-direction:column!important;padding:15px 16px!important}.table-title-flat>.table-title-flat__header h2{font-size:14px!important}}

/* Bukti Bayar */
.bukti-bayar-heading{align-items:flex-end}
.bukti-bayar-heading .btn{white-space:nowrap}
.bukti-bayar-filter-panel{padding:14px 16px}
.bukti-bayar-filter-form{display:grid;grid-template-columns:repeat(5,minmax(138px,1fr)) auto;gap:10px;align-items:end}
.bukti-bayar-filter-form label,.bukti-bayar-form-grid label{display:grid;gap:5px;font-size:10px;font-weight:850}
.bukti-bayar-filter-form input,.bukti-bayar-form-grid input{box-sizing:border-box;width:100%;min-height:37px;padding:8px 10px;color:#1e4263;border:1px solid #cbdde8;border-radius:8px;background:#fff;font:inherit}
.bukti-bayar-filter-form input:focus,.bukti-bayar-form-grid input:focus{outline:0;border-color:#1e9cad;box-shadow:0 0 0 3px #1e9cad1c}
.bukti-bayar-filter-actions{display:flex;gap:7px;align-items:center}
.bukti-bayar-filter-actions .btn{min-height:37px;padding:0 12px}
.bukti-bayar-panel{--table-title-flat-table-head-height:37px}
.bukti-bayar-panel.table-title-flat>.table-title-flat__header{min-height:68px!important;padding:13px 18px!important}
.bukti-bayar-panel .table-title-flat__header p{margin-bottom:5px!important}
.bukti-bayar-panel .table-title-flat__header h2{font-size:15px!important}
.bukti-bayar-panel .table-title-flat__header>span{min-height:29px!important;padding:0 10px!important;font-size:8px!important}
.bukti-bayar-table{min-width:780px}
.bukti-bayar-table th,.bukti-bayar-table td{padding:10px 12px!important}
.bukti-bayar-table tbody tr:hover td{background:#f7fbfd}
.bukti-bayar-number{width:45px;text-align:center!important;color:#6b8196;font-weight:850}
.bukti-bayar-nominal{color:#173e70;font-weight:900;white-space:nowrap}
.bukti-bayar-actions-heading,.bukti-bayar-actions{text-align:center!important}
.bukti-bayar-actions{min-width:112px;white-space:nowrap}
.bukti-bayar-actions .icon-btn{display:inline-grid;width:29px;height:29px;margin:0 2px;border-color:#c8dbe5}
.bukti-bayar-actions .icon-btn svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.8}
.bukti-bayar-actions .icon-btn.is-danger{color:#bd3345;border-color:#ecc5cb;background:#fff8f9}
.bukti-bayar-actions .icon-btn.is-danger:hover{color:#a42536;border-color:#df9fa8;background:#fff0f2}
.bukti-bayar-empty{padding:33px!important;text-align:center!important;background:#fbfdfe!important}
.bukti-bayar-empty strong,.bukti-bayar-empty span{display:block}
.bukti-bayar-empty strong{color:#234466;font-size:12px}
.bukti-bayar-empty span{margin-top:5px;color:#7890a5;font-size:10px}
.bukti-bayar-pagination{display:flex;justify-content:flex-end;padding:11px 14px;border-top:1px solid #dfebef}
.bukti-bayar-dialog{width:min(570px,calc(100% - 26px))}
.bukti-bayar-form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:11px;padding:16px}
.bukti-bayar-form-grid b{color:#d44b5c}
.bukti-bayar-form-wide{grid-column:1/-1}
.bukti-bayar-view-dialog{width:min(720px,calc(100% - 26px))}
.bukti-bayar-detail-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:36px;margin:0;padding:6px 24px 22px}
.bukti-bayar-detail-list div{min-width:0;padding:18px 0 20px;border:0;border-bottom:1px solid #e5edf3}
.bukti-bayar-detail-list dt{margin-bottom:7px;color:#8aa0b4;font-size:8px;font-weight:900;letter-spacing:.02em;text-transform:uppercase}
.bukti-bayar-detail-list dd{margin:0;color:#365574;font-size:11px;font-weight:800;line-height:1.45}
.bukti-bayar-detail-list dd a{color:#0878c1;font-weight:850;text-decoration:none}.bukti-bayar-detail-list dd a:hover{text-decoration:underline}
.bukti-bayar-delete-note{margin:7px 0 0;color:#7b8fa1;font-size:10px}
@media(max-width:1120px){.bukti-bayar-filter-form{grid-template-columns:repeat(3,minmax(150px,1fr)) auto}
}
@media(max-width:720px){.bukti-bayar-heading{align-items:flex-start}
.bukti-bayar-filter-form{grid-template-columns:1fr}
.bukti-bayar-filter-actions{justify-content:flex-start}
.bukti-bayar-form-grid,.bukti-bayar-detail-list{grid-template-columns:1fr}
.bukti-bayar-form-wide{grid-column:auto}
.bukti-bayar-detail-list{grid-template-columns:1fr;padding:6px 18px 18px}
}


/* Filter Bukti Bayar mengikuti standar filter SDM. */
.bukti-bayar-filter-panel{margin-bottom:16px;padding:15px}.agendaris-filter-form.bukti-bayar-filter-form{grid-template-columns:repeat(6,minmax(138px,1fr)) auto;gap:11px}.bukti-bayar-filter-form .form-group label{display:block;margin-bottom:5px;font-size:9px;font-weight:750}.bukti-bayar-filter-form input{color:#354056;border-color:#e0e5ec;border-radius:7px}.bukti-bayar-filter-form input:focus{border-color:#37bcb5;box-shadow:0 0 0 3px rgba(13,170,162,.1)}.bukti-bayar-filter-actions{gap:4px}.bukti-bayar-filter-actions .btn{min-height:37px;padding:0 12px}@media(max-width:1120px){.agendaris-filter-form.bukti-bayar-filter-form{grid-template-columns:repeat(3,minmax(150px,1fr)) auto}}@media(max-width:720px){.agendaris-filter-form.bukti-bayar-filter-form{grid-template-columns:1fr}}

/* Rentang tanggal Bukti Bayar. */
.agendaris-filter-form.bukti-bayar-filter-form{grid-template-columns:minmax(285px,1.4fr) minmax(145px,.8fr) minmax(145px,.8fr) minmax(145px,.8fr) auto}.bukti-date-range-filter{position:relative}.bukti-date-range{position:relative}.bukti-date-range-toggle{display:flex;align-items:center;box-sizing:border-box;width:100%;height:37px;padding:0 10px;gap:8px;color:#5f7288;border:1px solid #e0e5ec;border-radius:7px;background:#fff;font:inherit;text-align:left;cursor:pointer}.bukti-date-range-toggle:hover,.bukti-date-range-toggle[aria-expanded=true]{border-color:#75c3bd;background:#fbfefe}.bukti-date-range-toggle span{color:#6f7c90;font-size:9px;white-space:nowrap}.bukti-date-range-toggle strong{overflow:hidden;flex:1;color:#1b548f;font-size:10px;font-weight:850;text-overflow:ellipsis;white-space:nowrap}.bukti-date-range-toggle svg{flex:0 0 auto;width:15px;height:15px;fill:none;stroke:#237b9d;stroke-linecap:round;stroke-linejoin:round;stroke-width:2}.bukti-date-range-popover{position:absolute;z-index:90;top:calc(100% + 8px);left:0;width:322px;padding:10px;border:1px solid #cbd7dd;border-radius:10px;background:#fff;box-shadow:0 14px 29px rgba(31,65,85,.22)}.bukti-date-range-popover[hidden]{display:none}.bukti-date-range-popover>header{display:flex;align-items:center;justify-content:space-between;gap:8px;padding-bottom:9px;border-bottom:1px solid #e1e8ec}.bukti-date-range-popover>header>div{display:flex;gap:6px}.bukti-date-range-popover>header select{width:auto;height:30px;padding:4px 25px 4px 8px;border-color:#d6e0e6;border-radius:6px;color:#294c68;font-size:9px;font-weight:800}.bukti-date-range-popover>header button{display:grid;width:28px;height:28px;place-items:center;padding:0;color:#317fc5;border:0;border-radius:6px;background:#eff7ff;font-size:23px;line-height:1;cursor:pointer}.bukti-date-range-popover>header button:hover{color:#fff;background:#287fc4}.bukti-date-range-weekdays,.bukti-date-range-days{display:grid;grid-template-columns:repeat(7,1fr);gap:3px}.bukti-date-range-weekdays{padding:10px 2px 5px;color:#617b91;font-size:8px;font-weight:850;text-align:center}.bukti-date-range-days button{height:31px;padding:0;color:#294b67;border:0;border-radius:6px;background:transparent;font:inherit;font-size:10px;cursor:pointer}.bukti-date-range-days button:hover{background:#e7f4fb}.bukti-date-range-days button.is-outside{color:#a9bac5}.bukti-date-range-days button.is-between{color:#2378c3;background:#e3f0fb}.bukti-date-range-days button.is-start,.bukti-date-range-days button.is-end{color:#fff;background:#3986c8;font-weight:900}.bukti-date-range-days button.is-start{border-radius:6px 2px 2px 6px}.bukti-date-range-days button.is-end{border-radius:2px 6px 6px 2px}.bukti-date-range-popover>footer{display:flex;justify-content:flex-end;gap:6px;margin-top:9px;padding-top:9px;border-top:1px solid #e1e8ec}.bukti-date-range-popover>footer .btn{min-height:29px;padding:0 10px;font-size:8px}@media(max-width:1120px){.agendaris-filter-form.bukti-bayar-filter-form{grid-template-columns:repeat(2,minmax(180px,1fr)) auto}}@media(max-width:720px){.agendaris-filter-form.bukti-bayar-filter-form{grid-template-columns:1fr}.bukti-date-range-popover{width:min(322px,calc(100vw - 54px))}}

/* Filter Bukti Bayar: selaras dengan panel filter transaksi. */
.bukti-bayar-filter-panel{padding:16px 18px;border-color:#e2ebf2;border-radius:12px;background:linear-gradient(105deg,#fff 0%,#fbfdff 100%);box-shadow:0 5px 17px rgba(37,75,105,.06)}
.agendaris-filter-form.bukti-bayar-filter-form{grid-template-columns:minmax(280px,1.45fr) repeat(3,minmax(185px,1.12fr)) auto;gap:20px}
.bukti-bayar-filter-form .form-group label{margin-bottom:7px;font-size:10px;font-weight:900}
.bukti-date-range-toggle,.bukti-bayar-filter-form .bukti-filter-input{height:48px;border:1px solid #d5e1ec;border-radius:10px;background:#fff;box-shadow:inset 0 1px 1px rgba(24,65,99,.025)}
.bukti-date-range-toggle{padding:0 12px;gap:10px}.bukti-date-range-toggle:hover,.bukti-date-range-toggle[aria-expanded=true]{border-color:#80b9df;background:#fcfeff}
.bukti-filter-input{position:relative;display:flex;align-items:center}.bukti-filter-input .bukti-filter-field-icon,.bukti-date-range-toggle .bukti-filter-field-icon{display:grid;flex:0 0 36px;width:36px;height:36px;place-items:center;color:#1464aa;border-radius:7px;background:linear-gradient(135deg,#edf7ff,#f3faff)}
.bukti-filter-field-icon svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.8}.bukti-filter-rupiah{font-size:13px;font-weight:900}
.bukti-bayar-filter-form .bukti-filter-input input{height:46px;min-height:46px;padding:0 11px 0 9px;color:#3d5874;border:0!important;border-radius:0 10px 10px 0!important;background:transparent;font-size:10px;box-shadow:none!important}.bukti-bayar-filter-form .bukti-filter-input input:focus{outline:0}.bukti-bayar-filter-form .bukti-filter-input:focus-within{border-color:#5eabda;box-shadow:0 0 0 3px rgba(59,151,207,.1)}
.bukti-date-range-toggle strong{color:#61758d;font-size:10px;font-weight:700}.bukti-date-range-toggle svg:last-child{width:18px;height:18px;color:#174c81;stroke:currentColor}.bukti-bayar-filter-form input::placeholder{color:#72849a;opacity:1}
.bukti-bayar-filter-actions{position:relative;gap:10px;padding-left:20px}.bukti-bayar-filter-actions::before{position:absolute;top:8px;bottom:8px;left:0;width:1px;background:#e4ebf1;content:""}.bukti-bayar-filter-actions .btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:48px;padding:0 18px;border-radius:10px;font-size:10px;font-weight:900}.bukti-bayar-filter-actions .btn svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:2}.bukti-bayar-filter-actions .btn-secondary{color:#fff;border-color:#0872c3;background:linear-gradient(135deg,#0579c9,#0963b7);box-shadow:0 7px 14px rgba(12,101,182,.22)}.bukti-bayar-filter-actions .btn-secondary:hover{background:linear-gradient(135deg,#086bb4,#0759a5)}.bukti-bayar-filter-actions .btn-ghost{color:#1265aa;border-color:#cedfec;background:#fbfdff}.bukti-bayar-filter-actions .btn-ghost:hover{color:#0b558e;border-color:#9fc7df;background:#f2f9fd}
.bukti-bayar-filter-actions .lr-filter-menu{flex-basis:48px}.bukti-bayar-filter-actions .lr-filter-menu-trigger{width:48px;min-width:48px;height:48px;border-radius:10px!important}.bukti-bayar-filter-actions .lr-filter-menu-trigger svg{width:19px;height:19px}
@media(max-width:1200px){.agendaris-filter-form.bukti-bayar-filter-form{grid-template-columns:repeat(2,minmax(220px,1fr)) auto;gap:13px}.bukti-bayar-filter-actions{grid-column:1/-1;padding-left:0}.bukti-bayar-filter-actions::before{display:none}}@media(max-width:720px){.agendaris-filter-form.bukti-bayar-filter-form{grid-template-columns:1fr}.bukti-bayar-filter-actions{grid-column:auto}.bukti-bayar-filter-actions .btn{flex:1}.bukti-bayar-filter-actions .lr-filter-menu{flex:0 0 48px}}

/* Versi ringkas: panel filter berdiri sendiri di atas kartu data. */
.bukti-bayar-filter-panel{margin-bottom:12px;padding:11px 14px;border-radius:11px;box-shadow:0 3px 12px rgba(37,75,105,.045)}
.agendaris-filter-form.bukti-bayar-filter-form{gap:15px}.bukti-bayar-filter-form .form-group label{margin-bottom:5px;font-size:9px}.bukti-date-range-toggle,.bukti-bayar-filter-form .bukti-filter-input{height:38px;border-radius:8px}.bukti-date-range-toggle{padding:0 9px;gap:7px}.bukti-filter-input .bukti-filter-field-icon,.bukti-date-range-toggle .bukti-filter-field-icon{flex-basis:28px;width:28px;height:28px;border-radius:6px}.bukti-filter-field-icon svg{width:16px;height:16px}.bukti-filter-rupiah{font-size:10px}.bukti-bayar-filter-form .bukti-filter-input input{height:36px;min-height:36px;padding:0 8px 0 7px;border-radius:0 8px 8px 0!important;font-size:9px}.bukti-date-range-toggle strong{font-size:9px}.bukti-date-range-toggle svg:last-child{width:15px;height:15px}.bukti-bayar-filter-actions{gap:7px;padding-left:15px}.bukti-bayar-filter-actions::before{top:5px;bottom:5px}.bukti-bayar-filter-actions .btn{min-height:38px;padding:0 13px;gap:7px;border-radius:8px;font-size:9px}.bukti-bayar-filter-actions .btn svg{width:17px;height:17px}.bukti-bayar-filter-actions .lr-filter-menu{flex-basis:38px}.bukti-bayar-filter-actions .lr-filter-menu-trigger{width:38px;min-width:38px;height:38px;border-radius:8px!important}.bukti-bayar-filter-actions .lr-filter-menu-trigger svg{width:16px;height:16px}@media(max-width:1200px){.agendaris-filter-form.bukti-bayar-filter-form{gap:11px}.bukti-bayar-filter-actions{padding-left:0}}@media(max-width:720px){.bukti-bayar-filter-actions .lr-filter-menu{flex-basis:38px}}

/* Lebar filter mengikuti area konten ketika sidebar berubah. */
.agendaris-filter-form.bukti-bayar-filter-form{display:flex;flex-wrap:wrap;align-items:flex-end;gap:11px}.agendaris-filter-form.bukti-bayar-filter-form>.form-group{flex:1 1 155px;min-width:0}.agendaris-filter-form.bukti-bayar-filter-form>.bukti-date-range-filter{flex:1.45 1 250px}.agendaris-filter-form.bukti-bayar-filter-form>.bukti-bayar-filter-actions{flex:0 0 auto;min-width:max-content}@media(max-width:720px){.agendaris-filter-form.bukti-bayar-filter-form>.form-group,.agendaris-filter-form.bukti-bayar-filter-form>.bukti-date-range-filter{flex-basis:100%}.agendaris-filter-form.bukti-bayar-filter-form>.bukti-bayar-filter-actions{width:100%;min-width:0}}

/* Tetap satu baris saat sidebar dibuka maupun ditutup. */
.bukti-bayar-filter-panel{overflow-x:auto;padding:9px 12px}.agendaris-filter-form.bukti-bayar-filter-form{flex-wrap:nowrap;gap:8px;min-width:770px}.agendaris-filter-form.bukti-bayar-filter-form>.form-group{flex:1 1 0;min-width:105px}.agendaris-filter-form.bukti-bayar-filter-form>.bukti-date-range-filter{flex:1.28 1 0;min-width:185px}.agendaris-filter-form.bukti-bayar-filter-form>.bukti-bayar-filter-actions{flex:0 0 auto;min-width:max-content;padding-left:11px;gap:5px}.bukti-bayar-filter-form .form-group label{margin-bottom:4px;font-size:8px}.bukti-date-range-toggle,.bukti-bayar-filter-form .bukti-filter-input{height:34px;border-radius:7px}.bukti-date-range-toggle{padding:0 7px;gap:6px}.bukti-filter-input .bukti-filter-field-icon,.bukti-date-range-toggle .bukti-filter-field-icon{flex-basis:24px;width:24px;height:24px;border-radius:5px}.bukti-filter-field-icon svg{width:14px;height:14px}.bukti-filter-rupiah{font-size:9px}.bukti-bayar-filter-form .bukti-filter-input input{height:32px;min-height:32px;padding:0 6px 0 6px;border-radius:0 7px 7px 0!important;font-size:8px}.bukti-date-range-toggle strong{font-size:8px}.bukti-date-range-toggle svg:last-child{width:13px;height:13px}.bukti-bayar-filter-actions .btn{min-height:34px;padding:0 10px;gap:5px;border-radius:7px;font-size:8px}.bukti-bayar-filter-actions .btn svg{width:15px;height:15px}.bukti-bayar-filter-actions .lr-filter-menu{flex-basis:34px}.bukti-bayar-filter-actions .lr-filter-menu-trigger{width:34px;min-width:34px;height:34px;border-radius:7px!important}.bukti-bayar-filter-actions .lr-filter-menu-trigger svg{width:14px;height:14px}@media(max-width:720px){.agendaris-filter-form.bukti-bayar-filter-form{min-width:770px}.agendaris-filter-form.bukti-bayar-filter-form>.form-group,.agendaris-filter-form.bukti-bayar-filter-form>.bukti-date-range-filter{flex-basis:0}.agendaris-filter-form.bukti-bayar-filter-form>.bukti-bayar-filter-actions{width:auto;min-width:max-content}}
.bukti-bayar-filter-panel{overflow:visible}

/* Kalender rentang yang lebih padat, dengan gerak yang konsisten. */
.bukti-date-range-popover{width:288px;padding:8px;border-radius:9px}.bukti-date-range-popover>header{gap:6px;padding-bottom:7px}.bukti-date-range-popover>header select{height:27px;padding:3px 22px 3px 7px;border-radius:5px;font-size:8px}.bukti-date-range-popover>header button{width:25px;height:25px;border-radius:5px;font-size:20px}.bukti-date-range-weekdays,.bukti-date-range-days{gap:3px}.bukti-date-range-weekdays{padding:8px 2px 4px;font-size:7px}.bukti-date-range-days button{height:27px;border-radius:5px;font-size:8px}.bukti-date-range-days button.is-start,.bukti-date-range-days button.is-end{border-radius:5px}.bukti-date-range-days.is-month-switching{animation:bukti-calendar-month-in .16s ease-out both}.bukti-date-range-days[data-direction=previous].is-month-switching{animation-name:bukti-calendar-month-in-previous}.bukti-date-range-days button.is-end{animation:bukti-date-confirmed .15s ease-out both}.bukti-date-range-popover>footer{margin-top:7px;padding-top:7px}.bukti-date-range-popover>footer .btn{min-height:27px;padding:0 9px;font-size:7px}@keyframes bukti-calendar-month-in{from{opacity:.2;transform:translateX(9px)}to{opacity:1;transform:translateX(0)}}@keyframes bukti-calendar-month-in-previous{from{opacity:.2;transform:translateX(-9px)}to{opacity:1;transform:translateX(0)}}@keyframes bukti-date-confirmed{from{transform:scale(.82)}to{transform:scale(1)}}
.bukti-date-range-popover{width:252px;padding:7px;border-radius:8px}.bukti-date-range-popover>header{gap:5px;padding-bottom:6px}.bukti-date-range-popover>header>div{gap:4px}.bukti-date-range-popover>header select{height:24px;padding:2px 19px 2px 6px;border-radius:5px;font-size:7px}.bukti-date-range-popover>header button{width:22px;height:22px;border-radius:5px;font-size:17px}.bukti-date-range-weekdays,.bukti-date-range-days{gap:2px}.bukti-date-range-weekdays{padding:6px 1px 3px;font-size:6.5px}.bukti-date-range-days button{height:23px;border-radius:4px;font-size:7px}.bukti-date-range-days button.is-start,.bukti-date-range-days button.is-end{border-radius:4px}.bukti-date-range-popover>footer{gap:5px;margin-top:6px;padding-top:6px}.bukti-date-range-popover>footer .btn{min-height:24px;padding:0 8px;font-size:6.5px}
.bukti-date-range-popover{width:220px;padding:6px;border-radius:7px}.bukti-date-range-popover>header{gap:4px;padding-bottom:5px}.bukti-date-range-popover>header>div{gap:3px}.bukti-date-range-popover>header select{height:22px;padding:2px 16px 2px 5px;border-radius:4px;font-size:6.5px}.bukti-date-range-popover>header button{width:20px;height:20px;border-radius:4px;font-size:15px}.bukti-date-range-weekdays,.bukti-date-range-days{gap:2px}.bukti-date-range-weekdays{padding:5px 1px 2px;font-size:6px}.bukti-date-range-days button{height:20px;border-radius:4px;font-size:6.5px}.bukti-date-range-days button.is-start,.bukti-date-range-days button.is-end{border-radius:4px}.bukti-date-range-popover>footer{gap:4px;margin-top:5px;padding-top:5px}.bukti-date-range-popover>footer .btn{min-height:22px;padding:0 7px;font-size:6px}
.bukti-filter-input .bukti-filter-field-icon,.bukti-date-range-toggle .bukti-filter-field-icon{flex-basis:20px;width:20px;height:20px;color:#1464aa;background:transparent}.bukti-filter-field-icon svg{width:15px;height:15px}.bukti-filter-rupiah{font-size:9px}.bukti-bayar-filter-actions{gap:4px;padding-left:9px}.bukti-bayar-filter-actions .btn{min-height:30px;padding:0 8px;gap:4px;border-radius:6px;font-size:7.5px}.bukti-bayar-filter-actions .btn svg{width:14px;height:14px}.bukti-bayar-filter-actions .lr-filter-menu{flex-basis:30px}.bukti-bayar-filter-actions .lr-filter-menu-trigger{width:30px;min-width:30px;height:30px;border-radius:6px!important}.bukti-bayar-filter-actions .lr-filter-menu-trigger svg{width:13px;height:13px}@media(max-width:720px){.bukti-bayar-filter-actions .lr-filter-menu{flex-basis:30px}}
/* Filter ringkas: tinggi field disejajarkan dengan tombol aksinya. */
.bukti-date-range-toggle,.bukti-bayar-filter-form .bukti-filter-input{height:30px;border-radius:6px}
.bukti-bayar-filter-form .bukti-filter-input input{height:28px;min-height:28px;border-radius:0 6px 6px 0!important}
.bukti-bayar-form-grid .bukti-bayar-field-title{display:inline-flex;align-items:baseline;gap:4px;color:#294b6c;font-size:10px;font-weight:850}.bukti-bayar-form-grid .bukti-bayar-field-title b{color:#d44b5c;font-size:10px;line-height:1}.bukti-bayar-form-grid input::placeholder{color:#71869a;opacity:.4}.bukti-bayar-file-field input[type=file]{padding:6px 9px;font-size:8px;line-height:1.2;cursor:pointer}.bukti-bayar-file-field input[type=file]::file-selector-button{margin-right:8px;padding:5px 8px;color:#357096;border:0;border-radius:5px;background:#edf6fb;font:800 7px inherit;cursor:pointer}.bukti-bayar-file-field small{margin-top:-1px;color:#8091a0;font-size:7px;font-weight:650;line-height:1.35}
.bukti-bayar-form-grid{gap:14px 16px;padding:18px 20px;background:#fbfdff}.bukti-bayar-form-grid label{gap:6px;color:#718197;font-size:8.5px;font-weight:850}.bukti-bayar-form-grid .bukti-bayar-field-title{gap:3px;color:#718197;font-size:8.5px;font-weight:850}.bukti-bayar-form-grid .bukti-bayar-field-title b{font-size:8.5px}.bukti-bayar-form-grid input{min-height:38px;height:38px;padding:7px 10px;color:#4d6680;border-color:#d9e5ed;border-radius:9px;background:#fcfeff;font-size:9px}.bukti-bayar-form-grid input:focus{border-color:#9cc6df;box-shadow:0 0 0 3px rgba(112,169,205,.08)}.bukti-bayar-form-grid input::placeholder{color:#7f91a2;opacity:.56}.bukti-bayar-form-grid input[type=date]::-webkit-calendar-picker-indicator{opacity:.58}.bukti-bayar-file-field input[type=file]{height:38px;padding:5px 8px;color:#60758b;font-size:8px}.bukti-bayar-file-field input[type=file]::file-selector-button{margin-right:7px;padding:5px 8px;color:#4a7699;border:1px solid #d8e8f2;border-radius:5px;background:#f5faff;font:800 7px inherit}.bukti-bayar-file-field small{color:#8a9aaa;font-size:6.8px;font-weight:650}
.bukti-bayar-form-grid label,.bukti-bayar-form-grid .bukti-bayar-field-title{color:#718095;font-size:9px;font-weight:750}.bukti-bayar-form-grid .bukti-bayar-field-title b{font-size:9px;font-weight:800}.bukti-bayar-form-grid input{font-size:10px;font-weight:500;line-height:1.3}.bukti-bayar-form-grid input::placeholder{color:#6f7f91;opacity:.42}.bukti-bayar-form-grid input[type=date]:invalid::-webkit-datetime-edit{color:rgba(77,102,128,.48)}.bukti-bayar-form-grid select:has(option[value=""]:checked){color:rgba(77,102,128,.52)}.bukti-bayar-file-field small{color:#8391a0;font-size:7px;font-weight:600}
.bukti-bayar-form-grid select{box-sizing:border-box;width:100%;min-height:38px;height:38px;padding:7px 30px 7px 10px;color:#4d6680;border:1px solid #d9e5ed;border-radius:9px;background-color:#fcfeff;font-size:10px;font-weight:500;line-height:1.3}.bukti-bayar-form-grid select:focus{outline:0;border-color:#9cc6df;box-shadow:0 0 0 3px rgba(112,169,205,.08)}
.bukti-category-select{position:relative;display:block}.bukti-category-select>select{position:absolute;inline-size:1px!important;block-size:1px!important;min-height:0!important;margin:-1px!important;padding:0!important;overflow:hidden!important;clip:rect(0 0 0 0)!important;white-space:nowrap!important;border:0!important;opacity:0!important;pointer-events:none}.bukti-category-trigger{display:flex;align-items:center;justify-content:space-between;width:100%;min-height:38px;height:38px;padding:7px 10px;color:#4d6680;border:1px solid #d9e5ed;border-radius:9px;background:#fcfeff;font:500 10px/1.3 inherit;cursor:pointer;transition:border-color .16s ease,box-shadow .16s ease,background .16s ease}.bukti-category-trigger.is-placeholder{color:rgba(77,102,128,.52)}.bukti-category-trigger svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:2;transition:transform .16s ease}.bukti-category-trigger[aria-expanded="true"]{border-color:#9cc6df;background:#fff;box-shadow:0 0 0 3px rgba(112,169,205,.08)}.bukti-category-trigger[aria-expanded="true"] svg{transform:rotate(180deg)}.bukti-category-options{position:absolute;z-index:25;top:calc(100% + 5px);right:0;left:0;display:grid;padding:5px;gap:2px;border:1px solid #d9e7ef;border-radius:10px;background:rgba(255,255,255,.98);box-shadow:0 10px 22px rgba(43,82,111,.13);animation:bukti-category-open .16s ease both}.bukti-category-options[hidden]{display:none}.bukti-category-options button{width:100%;padding:8px 9px;color:#4d6680;border:0;border-radius:6px;background:transparent;font:500 9px/1.3 inherit;text-align:left;cursor:pointer;transition:color .14s ease,background .14s ease}.bukti-category-options button:hover,.bukti-category-options button[aria-selected="true"]{color:#176aa7;background:#edf7fc}.bukti-category-options button[aria-selected="true"]{font-weight:700}@keyframes bukti-category-open{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}
.bukti-category-trigger{font-family:inherit;font-size:10px;font-weight:500;line-height:1.3}.bukti-category-options{font-family:inherit;font-size:9px;line-height:1.3}.bukti-category-options button{font-family:inherit;font-size:9px;font-weight:500;line-height:1.3}

/* Komponen global: judul yang langsung tersambung ke header tabel. */
.bukti-date-range-days button{user-select:none;touch-action:none;transition:background .12s ease,color .12s ease,transform .12s ease}.bukti-date-range-days button.is-preview{box-shadow:inset 0 0 0 1px rgba(57,134,200,.3)}.bukti-date-range-days button.is-preview:not(.is-start):not(.is-end){color:#1e74b7;background:#dceefa}.bukti-date-range-days button.is-preview-target{color:#fff;background:#3986c8;animation:bukti-range-target .16s ease-out both}@keyframes bukti-range-target{from{box-shadow:0 0 0 4px rgba(57,134,200,.12);transform:scale(.9)}to{box-shadow:inset 0 0 0 1px rgba(57,134,200,.3);transform:scale(1)}}

.table-title-gradient{--table-title-gradient-table-head-height:39px;overflow:hidden!important;border:0!important;border-radius:18px 18px 0 0!important;background:#fff!important;box-shadow:0 6px 18px rgba(36,67,86,.105)!important}
.table-title-gradient>.table-title-gradient__header{box-sizing:border-box!important;position:relative!important;z-index:2!important;display:flex!important;align-items:center!important;justify-content:space-between!important;gap:10px!important;width:100%!important;min-height:96px!important;margin:0!important;padding:18px 25px!important;border:2px solid transparent!important;border-bottom:0!important;border-radius:18px 18px 0 0!important;background:linear-gradient(100deg,#f4fbfd 0%,#fff 58%,#fffdf4 100%) padding-box,linear-gradient(90deg,#174a8b 0%,#2189ad 38%,#36b8aa 66%,#ffd05b 100%) border-box!important;background-clip:padding-box,border-box!important}
.table-title-gradient>.table-title-gradient__header::before{position:absolute!important;z-index:4!important;inset:0!important;display:block!important;padding:0!important;content:""!important;border-radius:18px 18px 0 0!important;background:linear-gradient(90deg,#174a8b 0%,#2189ad 38%,#36b8aa 66%,#ffd05b 100%)!important;-webkit-mask:none!important;mask:none!important;clip-path:polygon(0 0,100% 0,100% 100%,calc(100% - 3px) 100%,calc(100% - 3px) 3px,3px 3px,3px 100%,0 100%)!important;pointer-events:none}
.lr-rekap-panel.table-title-gradient>.table-title-gradient__header::before{display:none!important}
.lr-rekap-panel.table-title-gradient>.table-title-gradient__header::after{display:none!important}
.lr-rekap-panel.table-title-gradient>.table-title-gradient__table::before,.lr-rekap-panel.table-title-gradient>.table-title-gradient__table::after{display:none!important}
.lr-rekap-panel.table-title-gradient{border:0!important;border-top:0!important;background:#fff!important}
.lr-rekap-panel.table-title-gradient>.table-title-gradient__header{border:1px solid transparent!important;border-bottom:0!important;border-radius:18px 18px 0 0!important;background:linear-gradient(100deg,#f4fbfd 0%,#fff 58%,#fffdf4 100%) padding-box,linear-gradient(90deg,#174a8b 0%,#2189ad 38%,#36b8aa 66%,#ffd05b 100%) border-box!important;background-clip:padding-box,border-box!important}
.table-title-gradient>.table-title-gradient__header::after{position:absolute!important;z-index:4!important;right:0!important;bottom:-3px!important;left:0!important;display:block!important;height:3px!important;content:""!important;background:linear-gradient(90deg,#174a8b 0 2px,transparent 2px calc(100% - 2px),#ffd05b calc(100% - 2px) 100%)!important;pointer-events:none}
.table-title-gradient>.table-title-gradient__header>*{position:relative!important;z-index:5!important}
.table-title-gradient>.table-title-gradient__header p{margin:0 0 10px!important;color:#6f89a0!important;font-size:9px!important;font-weight:900!important;letter-spacing:.85px!important}
.table-title-gradient>.table-title-gradient__header h2{margin:0!important;color:var(--navy)!important;font-size:16px!important}
.table-title-gradient>.table-title-gradient__header>span{display:inline-flex!important;align-items:center!important;min-height:39px!important;padding:0 14px!important;color:#996719!important;border:1px solid #ead2a3!important;border-radius:999px!important;background:#fff9ed!important;font-size:9px!important;font-weight:900!important;white-space:nowrap!important}
.table-title-gradient>.lr-rekap-table-wrap,.table-title-gradient>.lr-report-scroll{position:relative!important;z-index:1!important;width:100%!important;margin:0!important;border:0!important}
.table-title-gradient>.table-title-join{display:block!important;position:relative!important;z-index:8!important;flex:0 0 3px!important;width:100%!important;height:3px!important;margin:0!important;background:linear-gradient(90deg,#174a8b 0%,#2189ad 38%,#36b8aa 66%,#ffd05b 100%)!important}
.table-title-gradient>.table-title-gradient__table::before,.table-title-gradient>.table-title-gradient__table::after{position:absolute!important;z-index:9!important;top:0!important;display:block!important;width:2px!important;height:var(--table-title-gradient-table-head-height)!important;content:""!important;pointer-events:none}
.table-title-gradient>.table-title-gradient__table::before{left:0!important;background:#174a8b!important}
.table-title-gradient>.table-title-gradient__table::after{right:0!important;background:#ffd05b!important}
.lr-report-panel.table-title-gradient{--table-title-gradient-table-head-height:25px}
.lr-profitloss-report-panel.table-title-panel.table-title-gradient>.lr-report-header.table-title-gradient__header{padding:18px 25px!important;border:2px solid transparent!important;border-bottom:0!important;border-radius:18px 18px 0 0!important;background:linear-gradient(100deg,#f4fbfd 0%,#fff 58%,#fffdf4 100%) padding-box,linear-gradient(90deg,#174a8b 0%,#2189ad 38%,#36b8aa 66%,#ffd05b 100%) border-box!important;background-clip:padding-box,border-box!important}
.lr-profitloss-report-panel.table-title-panel.table-title-gradient>.lr-report-header.table-title-gradient__header::before{position:absolute!important;z-index:4!important;inset:0!important;display:block!important;padding:0!important;content:""!important;border-radius:18px 18px 0 0!important;background:linear-gradient(90deg,#174a8b 0%,#2189ad 38%,#36b8aa 66%,#ffd05b 100%)!important;-webkit-mask:none!important;mask:none!important;clip-path:polygon(0 0,100% 0,100% 100%,calc(100% - 3px) 100%,calc(100% - 3px) 3px,3px 3px,3px 100%,0 100%)!important;pointer-events:none}
.lr-profitloss-report-panel.table-title-panel.table-title-gradient>.lr-report-header.table-title-gradient__header::after{position:absolute!important;z-index:4!important;right:0!important;bottom:-3px!important;left:0!important;display:block!important;height:3px!important;content:""!important;background:linear-gradient(90deg,#174a8b 0 2px,transparent 2px calc(100% - 2px),#ffd05b calc(100% - 2px) 100%)!important;pointer-events:none}
@media(max-width:760px){.table-title-gradient>.table-title-gradient__header{align-items:flex-start!important;flex-direction:column!important;padding:15px 16px!important}.table-title-gradient>.table-title-gradient__header h2{font-size:14px!important}}

/* SDM Jatim: ringkas daftar utama, detail tetap tersedia pada dialog Lihat. */
.sdm-jatim-table{min-width:760px}
.sdm-jatim-toolbar{display:flex;justify-content:flex-end;margin:0 0 9px}.sdm-jatim-toolbar .btn{min-height:36px}
.sdm-jatim-table th:nth-child(1){width:34%}.sdm-jatim-table th:nth-child(2){width:15%}.sdm-jatim-table th:nth-child(3){width:30%}.sdm-jatim-table th:nth-child(4){width:15%}.sdm-jatim-table th:nth-child(5){width:116px}
.sdm-jatim-table td:nth-child(1){text-align:left}.sdm-jatim-table td:nth-child(2),.sdm-jatim-table td:nth-child(4){text-align:center}
.sdm-jatim-actions{min-width:116px;white-space:nowrap}
.sdm-profile-view-dialog{width:min(640px,calc(100% - 28px))}
.sdm-profile-detail-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 18px;padding:8px 18px 16px}
.sdm-profile-detail-grid>div{display:grid;gap:4px;padding:11px 0;border-bottom:1px solid #e1ebf0}
.sdm-profile-detail-grid>div:last-child,.sdm-profile-detail-grid>div:nth-last-child(2){border-bottom:0}
.sdm-profile-detail-grid small{color:#7890a5;font-size:8px;font-weight:850;letter-spacing:.25px;text-transform:uppercase}
.sdm-profile-detail-grid strong{min-height:16px;color:var(--navy);font-size:11px;line-height:1.45;overflow-wrap:anywhere}
.sdm-profile-detail-grid .sdm-profile-detail-email{grid-column:1/-1}
@media(max-width:620px){.sdm-jatim-toolbar .btn{width:100%}.sdm-jatim-table{min-width:650px}.sdm-profile-view-dialog{width:calc(100% - 16px)}.sdm-profile-detail-grid{grid-template-columns:1fr}.sdm-profile-detail-grid>div:nth-last-child(2){border-bottom:1px solid #e1ebf0}.sdm-profile-detail-grid .sdm-profile-detail-email{grid-column:auto}}

/* Samakan formulir Tambah/Ubah SDM dengan pola popup formulir sistem. */
.sdm-profile-dialog{display:none;width:min(680px,calc(100% - 28px));max-height:calc(100dvh - 28px);overflow:hidden}
.sdm-profile-dialog[open]{display:flex;flex-direction:column}
.sdm-profile-dialog>.lr-settings-header{flex:0 0 auto;padding:16px 20px;border-bottom:1px solid #edf0f4}
.sdm-profile-dialog>.lr-settings-header .eyebrow{margin:0;color:#a6afbc;font-size:7px;font-weight:800;letter-spacing:.9px}
.sdm-profile-dialog>.lr-settings-header h2{margin:3px 0 0;color:#2c374d;font-size:14px}
.sdm-profile-dialog>.lr-settings-header .icon-btn{width:31px;height:31px;color:#8e99a9;border:0;border-radius:8px;background:#f5f7fa;font-size:18px}
.sdm-profile-dialog>form{display:flex;flex:1;min-height:0;flex-direction:column;overflow:hidden}
.sdm-profile-body{flex:1;min-height:0;padding:18px 20px 22px;overflow-y:auto}
.sdm-profile-body .modal-section-heading{margin-bottom:14px}
.sdm-profile-grid{padding:0;gap:13px 16px}
.sdm-profile-grid .form-group{min-width:0}
.sdm-profile-grid .form-group label{display:block;margin-bottom:5px;color:#6f7c90;font-size:9px;font-weight:750}
.sdm-profile-grid input,.sdm-profile-grid select{box-sizing:border-box;min-height:38px;padding:7px 10px;color:#354056;border:1px solid #d7e3eb;border-radius:8px;background:#fff;font:inherit;font-size:10px;font-weight:400}
.sdm-profile-grid input::placeholder{color:#9daab7;opacity:1}
.sdm-profile-grid input:focus,.sdm-profile-grid select:focus{border-color:#37bcb5;box-shadow:0 0 0 3px rgba(13,170,162,.1)}
.sdm-profile-grid .sdm-lockable{position:relative}
.sdm-profile-grid .sdm-lock-indicator{display:none;position:absolute;right:34px;bottom:10px;place-items:center;width:17px;height:17px;color:#6f8296;font-size:11px;line-height:1;pointer-events:none}
.sdm-profile-grid .sdm-lockable.is-locked .sdm-lock-indicator{display:grid}
.sdm-profile-grid .sdm-lockable.is-locked select{padding-right:36px;color:#8a99aa;background:#f7fafc}
.sdm-profile-dialog .lr-settings-footer{display:flex;flex:0 0 auto;justify-content:flex-end;gap:10px;min-height:61px;padding:11px 20px;border-top:1px solid #edf0f4;background:#fafbfc}
.sdm-profile-dialog .lr-settings-footer .btn{min-height:34px;font-size:9px}
@media(max-width:620px){.sdm-profile-dialog{width:calc(100% - 16px);max-height:calc(100dvh - 16px)}.sdm-profile-body{padding:16px}.sdm-profile-grid{grid-template-columns:1fr}.sdm-profile-grid .modal-span-2{grid-column:auto}}

/* Detail SDM memakai skala huruf dan header yang sama dengan popup formulir sistem. */
.sdm-profile-view-dialog{display:none;width:min(640px,calc(100% - 28px));max-height:calc(100dvh - 28px);overflow:hidden}
.sdm-profile-view-dialog[open]{display:flex;flex-direction:column}
.sdm-profile-view-dialog>.lr-settings-header{flex:0 0 auto;padding:16px 20px;border-bottom:1px solid #edf0f4}
.sdm-profile-view-dialog>.lr-settings-header .eyebrow{margin:0;color:#a6afbc;font-size:7px;font-weight:800;letter-spacing:.9px}
.sdm-profile-view-dialog>.lr-settings-header h2{margin:3px 0 0;color:#2c374d;font-size:14px}
.sdm-profile-view-dialog>.lr-settings-header .icon-btn{width:31px;height:31px;color:#8e99a9;border:0;border-radius:8px;background:#f5f7fa;font-size:18px}
.sdm-profile-detail-grid{flex:1;min-height:0;gap:0 28px;padding:8px 20px 16px;overflow:hidden}
.sdm-profile-detail-grid>div{gap:4px;padding:12px 0;border-bottom:1px solid #f0f2f6}
.sdm-profile-detail-grid small{color:#9aa5b4;font-size:8px;font-weight:750;letter-spacing:.4px}
.sdm-profile-detail-grid strong{min-height:15px;color:#354056;font-size:10px;font-weight:650;line-height:1.45}
.sdm-profile-detail-grid .sdm-profile-detail-email{grid-column:auto}
.sdm-profile-detail-grid>div:nth-last-child(2){border-bottom:1px solid #f0f2f6}
.sdm-profile-detail-grid>div:nth-last-child(-n+2){border-bottom:0}
.sdm-profile-view-dialog>.lr-settings-footer{display:flex;flex:0 0 auto;justify-content:flex-end;gap:10px;min-height:61px;padding:11px 20px;border-top:1px solid #edf0f4;background:#fafbfc}
.sdm-profile-view-dialog>.lr-settings-footer .btn{min-height:34px;font-size:9px}
@media(max-width:620px){.sdm-profile-view-dialog{width:calc(100% - 16px);max-height:calc(100dvh - 16px)}.sdm-profile-detail-grid{grid-template-columns:1fr;padding:8px 16px 14px}.sdm-profile-detail-grid>div:nth-last-child(2){border-bottom:1px solid #f0f2f6}}
body.sdm-profile-modal-open{overflow:hidden;overscroll-behavior:none}

/* Ringkasan pegawai SDM Jatim per cabang. */
.sdm-unit-overview{position:relative;margin:0 0 14px;padding:17px 20px 19px;overflow:hidden;border:1px solid #edf3f8;border-radius:16px;background:radial-gradient(circle at 94% -26%,#e4f3ff 0 17%,transparent 17.2%),linear-gradient(135deg,#fff 0%,#f7fbff 65%,#fcfdff 100%)}
.sdm-unit-overview::before{position:absolute;right:27px;top:25px;width:4px;height:4px;content:"";border-radius:50%;background:#bedcf5;box-shadow:12px 0 #bedcf5,24px 0 #bedcf5,36px 0 #bedcf5,48px 0 #bedcf5,0 12px #bedcf5,12px 12px #bedcf5,24px 12px #bedcf5,36px 12px #bedcf5,48px 12px #bedcf5,0 24px #bedcf5,12px 24px #bedcf5,24px 24px #bedcf5,36px 24px #bedcf5,48px 24px #bedcf5;opacity:.6}
.sdm-unit-overview-heading{position:relative;z-index:1;display:flex;align-items:center;gap:13px;margin:0 0 16px}
.sdm-unit-overview-icon{display:grid;place-items:center;flex:0 0 50px;width:50px;height:50px;border-radius:15px;background:linear-gradient(145deg,#eaf5ff,#ddecfb);box-shadow:0 7px 16px rgba(58,132,189,.1)}
.sdm-unit-overview-icon img{width:29px;height:29px;object-fit:contain}
.sdm-unit-overview-heading h2{margin:0;color:#0a407b;font-size:18px;line-height:1.15}
.sdm-unit-overview-heading p{margin:4px 0 0;color:#718ba5;font-size:10px;line-height:1.45}
.sdm-unit-overview-heading p a{color:#7797b5;text-decoration:none}.sdm-unit-overview-heading p a:hover{text-decoration:underline}
.sdm-unit-overview-heading i{display:block;width:50px;height:4px;margin-top:8px;border-radius:99px;background:linear-gradient(90deg,#1489e3 0 55%,#f6c64e 55% 100%)}
.sdm-unit-summary{position:relative;z-index:1;display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:8px}
.sdm-unit-summary-card{--unit-accent:#118be4;--unit-soft:#e1f2ff;--unit-wave:rgba(89,181,244,.22);--unit-icon-start:#187ed2;--unit-icon-end:#6fc4f2;--unit-icon-soft-start:#e5f4ff;--unit-icon-soft-end:#d5ecff;position:relative;display:block;min-height:86px;padding:8px 10px;overflow:hidden;color:inherit;border:1px solid #edf1f4;border-radius:13px;background:linear-gradient(135deg,#fff,#fbfdff);box-shadow:0 8px 17px rgba(46,91,126,.08);text-decoration:none;transition:transform .16s ease,box-shadow .16s ease,border-color .16s ease}
.sdm-unit-summary-card:nth-child(2){--unit-accent:#0cae9c;--unit-soft:#dbf7f3;--unit-wave:rgba(79,219,200,.24)}.sdm-unit-summary-card:nth-child(3){--unit-accent:#159de6;--unit-soft:#e0f5ff;--unit-wave:rgba(84,187,240,.25)}.sdm-unit-summary-card:nth-child(4){--unit-accent:#efa70c;--unit-soft:#fff2d4;--unit-wave:rgba(251,197,76,.26)}.sdm-unit-summary-card:nth-child(5){--unit-accent:#12aa9b;--unit-soft:#dcf8f4;--unit-wave:rgba(81,218,199,.25)}.sdm-unit-summary-card:nth-child(6){--unit-accent:#307fe0;--unit-soft:#e1efff;--unit-wave:rgba(90,165,245,.25)}
.sdm-unit-summary-card.has-banyuwangi-background{--unit-accent:#4f8df0;--unit-soft:#e5efff;--unit-wave:rgba(79,141,240,.24);--unit-icon-start:#3578e4;--unit-icon-end:#79adff;--unit-icon-soft-start:#e7f0ff;--unit-icon-soft-end:#d5e6ff;background:radial-gradient(circle at 100% 100%,rgba(79,141,240,.2) 0 12%,transparent 12.5%),linear-gradient(135deg,#fff 0%,#f5f8ff 68%,#e2edff 100%)}
.sdm-unit-summary-card.has-kediri-background{--unit-accent:#3ccf97;--unit-soft:#dcf9ec;--unit-wave:rgba(60,207,151,.24);--unit-icon-start:#23bf83;--unit-icon-end:#6ae4b2;--unit-icon-soft-start:#e1faee;--unit-icon-soft-end:#ccf5df;background:radial-gradient(circle at 100% 100%,rgba(60,207,151,.2) 0 12%,transparent 12.5%),linear-gradient(135deg,#fff 0%,#f3fcf8 68%,#e0f9ec 100%)}
.sdm-unit-summary-card.has-malang-background{--unit-accent:#f46676;--unit-soft:#ffe5e9;--unit-wave:rgba(244,102,118,.23);--unit-icon-start:#ef4d61;--unit-icon-end:#ff929d;--unit-icon-soft-start:#ffeaed;--unit-icon-soft-end:#ffd6dc;background:radial-gradient(circle at 100% 100%,rgba(244,102,118,.2) 0 12%,transparent 12.5%),linear-gradient(135deg,#fff 0%,#fff6f7 68%,#ffe5e9 100%)}
.sdm-unit-summary-card.has-madiun-background{--unit-accent:#9a68dd;--unit-soft:#efe5ff;--unit-wave:rgba(154,104,221,.23);--unit-icon-start:#8951d4;--unit-icon-end:#c091f0;--unit-icon-soft-start:#f1e9ff;--unit-icon-soft-end:#e4d4ff;background:radial-gradient(circle at 100% 100%,rgba(154,104,221,.2) 0 12%,transparent 12.5%),linear-gradient(135deg,#fff 0%,#faf7ff 68%,#eee3ff 100%)}
.sdm-unit-summary-card.has-surabaya-background{--unit-accent:#f5a34b;--unit-soft:#fff0dc;--unit-wave:rgba(245,163,75,.24);--unit-icon-start:#f18a2a;--unit-icon-end:#ffc16e;--unit-icon-soft-start:#fff2df;--unit-icon-soft-end:#ffe1b9;background:radial-gradient(circle at 100% 100%,rgba(245,163,75,.2) 0 12%,transparent 12.5%),linear-gradient(135deg,#fff 0%,#fffaf3 68%,#ffefd9 100%)}
.sdm-unit-summary-card.has-kanwil-surabaya-background{--unit-accent:#12a8c2;--unit-soft:#def8fb;--unit-wave:rgba(18,168,194,.23);--unit-icon-start:#079bb8;--unit-icon-end:#4fd3dd;--unit-icon-soft-start:#e2f9fb;--unit-icon-soft-end:#c8f1f5;background:radial-gradient(circle at 100% 100%,rgba(18,168,194,.2) 0 12%,transparent 12.5%),linear-gradient(135deg,#fff 0%,#f2fcfd 68%,#ddf8fa)}
.sdm-unit-summary-card.has-banyuwangi-background::after,.sdm-unit-summary-card.has-kediri-background::after,.sdm-unit-summary-card.has-malang-background::after,.sdm-unit-summary-card.has-madiun-background::after,.sdm-unit-summary-card.has-surabaya-background::after,.sdm-unit-summary-card.has-kanwil-surabaya-background::after{display:block}
.sdm-unit-summary-card::after{position:absolute;right:-49px;bottom:-73px;width:190px;height:142px;content:"";border:16px solid var(--unit-wave);border-radius:58% 44% 0 0;transform:rotate(-20deg)}
.sdm-jatim-summary-card{font:inherit;text-align:left;cursor:pointer;--unit-accent:#4f8df0;--unit-soft:#e5efff;--unit-wave:rgba(79,141,240,.24);--unit-icon-start:#3578e4;--unit-icon-end:#79adff;--unit-icon-soft-start:#e7f0ff;--unit-icon-soft-end:#d5e6ff;background:radial-gradient(circle at 100% 100%,rgba(79,141,240,.2) 0 12%,transparent 12.5%),linear-gradient(135deg,#fff 0%,#f5f8ff 68%,#e2edff 100%)}
.sdm-unit-summary-card:hover,.sdm-unit-summary-card:focus-visible,.sdm-unit-summary-card.is-selected{border-color:color-mix(in srgb,var(--unit-accent) 38%,#fff);box-shadow:0 13px 25px rgba(46,91,126,.14);transform:translateY(-2px)}
.sdm-unit-summary-card:focus-visible{outline:2px solid var(--unit-accent);outline-offset:2px}
.sdm-unit-card-head{position:relative;z-index:1;display:flex;align-items:flex-start;justify-content:space-between;gap:7px}.sdm-unit-card-head strong{max-width:calc(100% - 25px);color:#103e72;font-size:9px;line-height:1.35}.sdm-unit-card-head i{display:grid;place-items:center;flex:0 0 21px;width:21px;height:21px;color:#1b527f;border-radius:50%;background:#f0f6fb;font-size:17px;font-style:normal;line-height:1}
.sdm-unit-card-metric{position:relative;z-index:1;display:flex;align-items:center;gap:6px;margin-top:7px}.sdm-unit-card-icon{display:grid;place-items:center;flex:0 0 31px;width:31px;height:31px;overflow:hidden;border-radius:50%;background:linear-gradient(145deg,var(--unit-icon-soft-start),var(--unit-icon-soft-end))}.sdm-unit-card-icon::after{width:21px;height:21px;content:"";background:linear-gradient(135deg,var(--unit-icon-start),var(--unit-icon-end));-webkit-mask:url('images/sdm-group-icon.webp') center/contain no-repeat;mask:url('images/sdm-group-icon.webp') center/contain no-repeat}.sdm-unit-card-metric>span:last-child{display:grid;gap:1px}.sdm-unit-card-metric b{color:#06477f;font-size:20px;font-variant-numeric:tabular-nums;line-height:.95}.sdm-unit-card-metric small{color:#8295aa;font-size:5.7px;font-weight:900;letter-spacing:1.2px;text-transform:uppercase}
@media(max-width:960px){.sdm-unit-summary{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:620px){.sdm-unit-overview{padding:14px 13px}.sdm-unit-overview-heading{gap:10px;margin-bottom:13px}.sdm-unit-overview-icon{flex-basis:43px;width:43px;height:43px;border-radius:12px}.sdm-unit-overview-icon img{width:25px;height:25px}.sdm-unit-overview-heading h2{font-size:15px}.sdm-unit-overview-heading p{font-size:8px}.sdm-unit-summary{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.sdm-unit-summary-card{min-height:91px;padding:9px}.sdm-unit-card-metric{margin-top:7px}}

/* Rekap komposisi SDM khusus Kantor Wilayah Surabaya; data diisi pada tahap berikutnya. */
.kanwil-sdm-summary-dialog{width:min(1320px,calc(100vw - 32px));height:min(560px,calc(100dvh - 32px));max-height:calc(100dvh - 32px)}.kanwil-sdm-summary-body{display:flex;flex:1;min-height:0;flex-direction:column;gap:10px;padding:14px 17px 16px;overflow:hidden}.kanwil-sdm-summary-note{margin:0;color:#75899d;font-size:8px;line-height:1.45}.kanwil-sdm-summary-table-wrap{flex:1;min-height:0;overflow:auto;border:1px solid #dce6ec;border-radius:8px}.kanwil-sdm-summary-table{width:100%;min-width:1130px;border-collapse:collapse;font-size:9px;text-align:center}.kanwil-sdm-summary-table th,.kanwil-sdm-summary-table td{height:27px;padding:4px 6px;border:1px solid #d9e0e5}.kanwil-sdm-summary-table thead{background:linear-gradient(90deg,#2a4f7f 0 71%,#1296a6 71%,#169ea9 82%,#35c3bb 94%,#ffd365 94% 100%)}.kanwil-sdm-summary-table thead th{color:#fff!important;border:0!important;background:transparent!important;font-size:8px;font-weight:900;white-space:nowrap}.kanwil-sdm-summary-table thead th:first-child{min-width:205px}.kanwil-sdm-summary-table tbody th{color:#24364a;background:#fff;font-weight:700;text-align:center}.kanwil-sdm-summary-table tbody td{background:#fff}.kanwil-sdm-summary-table tfoot th{color:#182d43;background:#ffd565;border-color:#2b2b2b;font-size:9px;font-weight:950;text-transform:uppercase}.kanwil-sdm-summary-table tfoot td{background:#fff}
.kanwil-sdm-summary-table tbody td,.kanwil-sdm-summary-table tfoot td{color:#173b63;font-size:10px;font-weight:500}
.kanwil-sdm-summary-legend{display:flex;align-items:center;flex:0 0 auto;gap:23px;padding:4px 2px;color:#5d7288;font-size:9.5px;font-weight:700}.kanwil-sdm-summary-legend span{display:inline-flex;align-items:center;gap:7px}.kanwil-sdm-summary-legend i{width:14px;height:14px;border-radius:4px}.kanwil-sdm-summary-legend .is-navy{background:linear-gradient(135deg,#2a4f7f,#294e7d)}.kanwil-sdm-summary-legend .is-teal{background:linear-gradient(135deg,#149da9,#27b2b0)}.kanwil-sdm-summary-legend strong{color:#253e59;font-weight:900}@media(max-width:620px){.kanwil-sdm-summary-legend{flex-wrap:wrap;gap:8px 15px;font-size:8.5px}}
.kanwil-sdm-summary-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;flex:0 0 auto}.kanwil-sdm-summary-toolbar .kanwil-sdm-summary-note{flex:1}.kanwil-sdm-kup-select select{box-sizing:border-box;width:180px!important;min-height:26px!important;height:26px!important;padding:3px 28px 3px 9px!important;color:#49627b;border:1px solid #d4e2ea;border-radius:6px;background:#fff;font:inherit;font-size:8px;font-weight:750;line-height:18px}.kanwil-sdm-kup-select select:focus{outline:0;border-color:#36b9b3;box-shadow:0 0 0 3px rgba(54,185,179,.1)}@media(max-width:620px){.kanwil-sdm-summary-toolbar{gap:8px}.kanwil-sdm-kup-select select{width:130px!important;font-size:7.5px}}
@media(max-width:620px){.kanwil-sdm-summary-dialog{width:calc(100% - 16px);height:min(560px,calc(100dvh - 16px));max-height:calc(100dvh - 16px)}.kanwil-sdm-summary-body{padding:13px 12px}}

/* Aturan global popup: halaman belakang terkunci saat dialog aktif. */
html:has(dialog[open]),body:has(dialog[open]),
html:has([aria-hidden="false"] [role="dialog"][aria-modal="true"]),body:has([aria-hidden="false"] [role="dialog"][aria-modal="true"]){overflow:hidden;overscroll-behavior:none}

/* SDM Jatim: enam kolom ringkas, termasuk Unit Kerja. */
.agendaris-filter-form.sdm-list-filter-form{grid-template-columns:minmax(250px,1.5fr) minmax(170px,.7fr) minmax(170px,.7fr) auto}
.agendaris-filter-form.sdm-document-filter-form{grid-template-columns:minmax(250px,1.5fr) minmax(170px,.7fr) 44px auto}
/* Standar global: tombol menu tindakan di samping Reset pada area filter. */
.filter-actions .lr-filter-menu .lr-action-menu-popover{right:0;z-index:45}
.sdm-jatim-table{min-width:920px;table-layout:fixed}
.sdm-jatim-table th:nth-child(1){width:24%}.sdm-jatim-table th:nth-child(2){width:11%}.sdm-jatim-table th:nth-child(3){width:18%}.sdm-jatim-table th:nth-child(4){width:19%}.sdm-jatim-table th:nth-child(5){width:16%}.sdm-jatim-table th:nth-child(6){width:12%}
.sdm-jatim-table td:not(.sdm-jatim-actions){white-space:normal;overflow-wrap:anywhere}
.sdm-jatim-table td:nth-child(2){white-space:nowrap}
.sdm-profile-validation-dialog{display:none;width:min(1240px,calc(100% - 28px));height:min(780px,calc(100dvh - 28px));max-height:calc(100dvh - 28px);overflow:hidden}
.sdm-profile-validation-dialog[open]{display:flex;flex-direction:column}
.sdm-profile-validation-dialog>.lr-settings-header,.sdm-profile-validation-dialog>.lr-settings-footer{flex:0 0 auto}
.sdm-profile-validation-dialog>.lr-settings-body{display:flex;flex:1 1 auto;flex-direction:column;min-height:0;padding:16px;overflow:hidden}
.sdm-profile-validation-dialog>.lr-settings-body>p{flex:0 0 auto}
.sdm-profile-validation-dialog .sdm-jatim-table-wrap{flex:1 1 auto;height:0;min-height:0;overflow:auto;overscroll-behavior:contain}
.sdm-profile-validation-dialog .sdm-jatim-table{min-width:1180px;border-collapse:separate;border-spacing:0}
.sdm-profile-validation-dialog .sdm-jatim-table thead{position:sticky;top:0;z-index:4}
.sdm-profile-validation-dialog .sdm-jatim-table thead th{position:sticky;top:0;z-index:5;background:#12455a!important;box-shadow:0 1px 0 #347085}
.sdm-profile-validation-dialog .sdm-jatim-table th:nth-child(1){width:21%}
.sdm-profile-validation-dialog .sdm-jatim-table th:nth-child(2){width:10%}
.sdm-profile-validation-dialog .sdm-jatim-table th:nth-child(3){width:15%}
.sdm-profile-validation-dialog .sdm-jatim-table th:nth-child(4){width:18%}
.sdm-profile-validation-dialog .sdm-jatim-table th:nth-child(5){width:14%}
.sdm-profile-validation-dialog .sdm-jatim-table th:nth-child(6){width:17%}
.sdm-profile-validation-dialog .sdm-jatim-table th:nth-child(7){width:5%}
.sdm-jatim-actions{min-width:0}
@media(max-width:1000px){.agendaris-filter-form.sdm-list-filter-form{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:620px){.sdm-jatim-table{min-width:820px}.agendaris-filter-form.sdm-list-filter-form{grid-template-columns:1fr}}

/* Dashboard SDM Jatim: ringkasan visual tanpa tabel. */
.sdm-dashboard-overview{margin-top:20px}.sdm-dashboard-panel>header div>span,.sdm-readiness-copy>span{display:block;margin-bottom:4px;color:#008f99;font-size:9px;font-weight:900;letter-spacing:1px}.sdm-dashboard-panel h2,.sdm-readiness-copy h2{margin:0;color:#073e75;font-size:18px}.sdm-dashboard-panel header p,.sdm-readiness-copy p{margin:4px 0 0;color:#8897aa;font-size:10px;line-height:1.45}.sdm-dashboard-panel-total{display:grid;min-width:46px;height:46px;place-items:center;color:#0b709a!important;font-size:18px!important;border-radius:13px;background:#e1f5f8}
.sdm-dashboard-construction{position:relative;display:grid;min-height:520px;overflow:hidden;place-items:center;padding:46px 20px;border:1px solid #d8eaf1;border-radius:22px;background:radial-gradient(circle at 50% 20%,#fff 0 8%,rgba(245,253,254,.96) 35%,#eaf6fa 100%);isolation:isolate}.sdm-dashboard-construction::before,.sdm-dashboard-construction::after{position:absolute;z-index:-1;width:310px;height:310px;border-radius:50%;content:"";filter:blur(4px)}.sdm-dashboard-construction::before{top:-160px;left:-100px;background:radial-gradient(circle,rgba(43,181,193,.2),transparent 68%)}.sdm-dashboard-construction::after{right:-100px;bottom:-170px;background:radial-gradient(circle,rgba(33,124,210,.19),transparent 68%)}.sdm-dashboard-construction-card{position:relative;z-index:2;width:min(100%,530px);padding:39px 34px 32px;text-align:center;border:1px solid rgba(207,230,238,.9);border-radius:22px;background:rgba(255,255,255,.86);box-shadow:0 20px 45px rgba(28,85,109,.12),inset 0 1px 0 #fff;backdrop-filter:blur(10px)}.sdm-dashboard-construction-kicker{display:block;margin-bottom:20px;color:#13899a;font-size:9px;font-weight:900;letter-spacing:1.35px}.sdm-dashboard-construction-icon{position:relative;display:grid;width:82px;height:82px;margin:0 auto 18px;place-items:center;border-radius:26px;background:linear-gradient(145deg,#0d75ae,#31c3b1);box-shadow:0 13px 26px rgba(23,142,167,.24)}.sdm-dashboard-construction-icon::before,.sdm-dashboard-construction-icon::after{position:absolute;content:"";border-radius:50%;border:1px solid rgba(255,255,255,.44)}.sdm-dashboard-construction-icon::before{inset:10px}.sdm-dashboard-construction-icon::after{inset:18px}.sdm-dashboard-construction-icon i,.sdm-dashboard-construction-icon b,.sdm-dashboard-construction-icon em{position:absolute;bottom:22px;display:block;width:9px;border-radius:3px 3px 1px 1px;background:#fff;box-shadow:0 0 0 3px rgba(255,255,255,.11);transform-origin:bottom}.sdm-dashboard-construction-icon i{left:26px;height:21px}.sdm-dashboard-construction-icon b{left:37px;height:32px}.sdm-dashboard-construction-icon em{left:48px;height:15px}.sdm-dashboard-construction-card h1{margin:0;color:#073e75;font-size:25px;line-height:1.15}.sdm-dashboard-construction-card p{max-width:380px;margin:11px auto 22px;color:#718ca1;font-size:12px;line-height:1.65}.sdm-dashboard-construction-loading{display:flex;align-items:center;justify-content:center;gap:5px;color:#618198;font-size:9px;font-weight:800}.sdm-dashboard-construction-loading i{width:7px;height:7px;border-radius:50%;background:#1e9daa;animation:sdm-dashboard-loading 1.1s ease-in-out infinite}.sdm-dashboard-construction-loading i:nth-child(2){animation-delay:.15s}.sdm-dashboard-construction-loading i:nth-child(3){animation-delay:.3s}.sdm-dashboard-construction-loading span{margin-left:5px}@keyframes sdm-dashboard-loading{0%,100%{opacity:.35;transform:translateY(0)}50%{opacity:1;transform:translateY(-5px)}}.sdm-dashboard-construction-orbit{position:absolute;width:310px;height:310px;border:1px dashed rgba(38,161,181,.26);border-radius:50%;animation:sdm-dashboard-orbit 18s linear infinite}.sdm-dashboard-construction-orbit::before,.sdm-dashboard-construction-orbit::after,.sdm-dashboard-construction-orbit i,.sdm-dashboard-construction-orbit b,.sdm-dashboard-construction-orbit em{position:absolute;display:block;width:10px;height:10px;border-radius:50%;content:""}.sdm-dashboard-construction-orbit::before{top:26px;left:72px;background:#30c1b0}.sdm-dashboard-construction-orbit::after{right:25px;bottom:75px;background:#1c82c9}.sdm-dashboard-construction-orbit i{right:57px;top:49px;background:#f0be48}.sdm-dashboard-construction-orbit b{bottom:25px;left:86px;background:#5a69cc}.sdm-dashboard-construction-orbit em{top:146px;left:-5px;background:#e66d78}@keyframes sdm-dashboard-orbit{to{transform:rotate(360deg)}}@media(prefers-reduced-motion:reduce){.sdm-dashboard-construction-orbit,.sdm-dashboard-construction-loading i{animation:none}}
.sdm-dashboard-visual-grid{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(310px,.85fr);gap:14px;margin-bottom:14px}.sdm-dashboard-panel>header{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding:16px 18px;border-bottom:1px solid #e4ebf0}.sdm-unit-bars{display:grid;gap:7px;padding:15px 18px 18px}.sdm-unit-bar{display:grid;grid-template-columns:minmax(105px,.8fr) minmax(90px,1.5fr) 35px;align-items:center;gap:10px;width:100%;padding:5px 7px;color:#425f79;border:0;border-radius:8px;background:transparent;font:inherit;text-align:left;cursor:pointer;transition:background .16s ease,transform .16s ease}.sdm-unit-bar:hover,.sdm-unit-bar.is-active{background:#edf9fb;transform:translateX(2px)}.sdm-unit-bar>span{overflow:hidden;font-size:9px;font-weight:800;text-overflow:ellipsis;white-space:nowrap}.sdm-unit-bar i{display:block;height:8px;overflow:hidden;border-radius:99px;background:#e8eff3}.sdm-unit-bar i b{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#1777b6,#24b4a9)}.sdm-unit-bar strong{color:#104d7e;font-size:10px;text-align:right}
.sdm-dashboard-city{margin-bottom:14px}.sdm-city-panel>header>strong{display:grid;min-width:43px;height:43px;place-items:center;color:#0d698f!important;font-size:13px!important;letter-spacing:1px;border-radius:12px;background:linear-gradient(135deg,#e1f2ff,#dff9f4)!important}.sdm-city-scene{position:relative;display:grid;grid-template-columns:repeat(9,minmax(62px,1fr));gap:6px;align-items:end;min-height:245px;padding:44px 18px 28px;isolation:isolate;background:radial-gradient(ellipse at 50% 104%,#cbeef1 0,rgba(214,242,244,.75) 28%,transparent 61%),linear-gradient(180deg,#fbfeff,#edf7fa);perspective:900px}.sdm-city-scene::before{position:absolute;z-index:-1;right:0;bottom:0;left:0;height:43%;content:"";opacity:.55;background:repeating-linear-gradient(90deg,transparent 0 39px,rgba(57,139,154,.14) 40px 41px),repeating-linear-gradient(0deg,transparent 0 27px,rgba(57,139,154,.12) 28px 29px);transform:rotateX(57deg) scale(1.12);transform-origin:bottom}.sdm-city-building{position:relative;z-index:1;display:grid;min-width:0;height:100%;align-items:end;justify-items:center;padding-top:28px;color:#244b68;text-decoration:none;outline:none;transform-style:preserve-3d}.sdm-city-building:hover,.sdm-city-building:focus-visible{z-index:3}.sdm-city-tower{position:relative;display:block;width:40px;height:var(--sdm-city-height);margin-bottom:21px;border-radius:4px 4px 1px 1px;background:linear-gradient(90deg,color-mix(in srgb,var(--sdm-city-color),#0a324b 30%),var(--sdm-city-color) 56%,color-mix(in srgb,var(--sdm-city-color),#fff 25%));box-shadow:inset 4px 0 0 rgba(255,255,255,.18),inset -4px 0 0 rgba(4,39,60,.22),0 13px 13px rgba(21,83,102,.18);transform:rotateX(4deg) rotateY(-18deg);transition:transform .2s ease,filter .2s ease}.sdm-city-tower::before{position:absolute;top:2px;bottom:0;left:100%;width:14px;content:"";border-radius:0 3px 2px 0;background:color-mix(in srgb,var(--sdm-city-color),#082d4b 45%);transform:skewY(-35deg);transform-origin:left top}.sdm-city-tower::after{position:absolute;bottom:7px;left:8px;width:24px;height:calc(var(--sdm-city-height) - 18px);content:"";opacity:.72;background:repeating-linear-gradient(180deg,rgba(255,255,255,.75) 0 5px,transparent 5px 14px),repeating-linear-gradient(90deg,transparent 0 8px,rgba(7,43,63,.42) 8px 10px)}.sdm-city-tower>i{position:absolute;z-index:1;top:-9px;left:0;width:40px;height:10px;border-radius:4px 4px 1px 1px;background:color-mix(in srgb,var(--sdm-city-color),#fff 32%);transform:skewX(-28deg)}.sdm-city-tower>b{position:absolute;z-index:2;top:8px;left:50%;width:8px;height:8px;border:2px solid #e9faff;border-radius:50%;background:var(--sdm-city-color);box-shadow:0 0 0 4px rgba(255,255,255,.24);transform:translateX(-50%)}.sdm-city-building:hover .sdm-city-tower,.sdm-city-building:focus-visible .sdm-city-tower{filter:saturate(1.18) brightness(1.08);transform:translateY(-8px) rotateX(4deg) rotateY(-18deg)}.sdm-city-label{position:absolute;right:0;bottom:0;left:0;overflow:hidden;color:#486982;font-size:8px;font-weight:900;line-height:1.25;text-align:center;text-overflow:ellipsis;white-space:nowrap}.sdm-city-tooltip{position:absolute;z-index:5;top:0;display:grid;min-width:122px;padding:9px 10px;gap:2px;visibility:hidden;color:#fff;border-radius:9px;background:#092e62;box-shadow:0 9px 18px rgba(7,42,87,.2);opacity:0;pointer-events:none;transform:translateY(8px);transition:opacity .18s ease,transform .18s ease}.sdm-city-tooltip::after{position:absolute;bottom:-5px;left:50%;width:10px;height:10px;content:"";background:#092e62;transform:translateX(-50%) rotate(45deg)}.sdm-city-tooltip strong{font-size:9px}.sdm-city-tooltip b{color:#7be9dd;font-size:13px}.sdm-city-tooltip small{color:#c8dfee;font-size:7px;font-weight:700}.sdm-city-building:hover .sdm-city-tooltip,.sdm-city-building:focus-visible .sdm-city-tooltip{visibility:visible;opacity:1;transform:translateY(0)}
.sdm-isometric-map{overflow-x:auto;overflow-y:hidden;background:#edf4f7}.sdm-isometric-map-inner{position:relative;min-width:820px;height:390px;overflow:hidden}.sdm-isometric-map-base{position:absolute;inset:0;width:100%;height:100%}.sdm-iso-unit{position:absolute;z-index:2;left:var(--sdm-map-x);top:var(--sdm-map-y);display:block;width:100px;height:165px;color:#284d69;text-decoration:none;outline:none;transform:translate(-50%,-100%)}.sdm-iso-unit:hover,.sdm-iso-unit:focus-visible{z-index:5}.sdm-iso-building{display:block;width:100px;height:165px;overflow:visible;filter:drop-shadow(0 8px 5px rgba(27,81,102,.12));transition:transform .2s ease,filter .2s ease}.sdm-iso-left{fill:color-mix(in srgb,var(--sdm-city-color),#082f4f 36%)}.sdm-iso-right{fill:color-mix(in srgb,var(--sdm-city-color),#0a3859 17%)}.sdm-iso-roof{fill:color-mix(in srgb,var(--sdm-city-color),#fff 27%)}.sdm-iso-windows{fill:rgba(237,250,255,.82)}.sdm-iso-marker{fill:var(--sdm-city-color);stroke:#fff;stroke-width:3;filter:drop-shadow(0 2px 2px rgba(7,39,63,.22))}.sdm-iso-unit:hover .sdm-iso-building,.sdm-iso-unit:focus-visible .sdm-iso-building{filter:drop-shadow(0 14px 8px rgba(15,68,89,.24));transform:translateY(-8px) scale(1.04)}.sdm-iso-label{position:absolute;right:-15px;bottom:2px;left:-15px;overflow:hidden;color:#3a5e78;font-size:8px;font-weight:900;line-height:1.15;text-align:center;text-overflow:ellipsis;white-space:nowrap;text-shadow:0 1px 1px #fff}.sdm-iso-tooltip{position:absolute;z-index:4;top:-15px;left:50%;display:grid;min-width:128px;padding:9px 10px;gap:2px;visibility:hidden;color:#fff;border-radius:9px;background:#092e62;box-shadow:0 9px 18px rgba(7,42,87,.23);opacity:0;pointer-events:none;transform:translate(-50%,4px);transition:opacity .18s ease,transform .18s ease}.sdm-iso-tooltip::after{position:absolute;bottom:-5px;left:50%;width:10px;height:10px;content:"";background:#092e62;transform:translateX(-50%) rotate(45deg)}.sdm-iso-tooltip strong,.sdm-iso-tooltip b,.sdm-iso-tooltip small{position:relative;z-index:1;display:block}.sdm-iso-tooltip strong{font-size:9px}.sdm-iso-tooltip b{color:#7be9dd;font-size:13px}.sdm-iso-tooltip small{color:#c8dfee;font-size:7px;font-weight:700}.sdm-iso-unit:hover .sdm-iso-tooltip,.sdm-iso-unit:focus-visible .sdm-iso-tooltip{visibility:visible;opacity:1;transform:translate(-50%,-8px)}
.sdm-city-panel{background:linear-gradient(145deg,#fff 0 23%,#f4fbfc 100%)}.sdm-city-panel>header{padding:18px 22px;border-color:#dcecf1}.sdm-city-panel>header h2{font-size:20px}.sdm-isometric-map{padding:12px 16px 16px;background:radial-gradient(circle at 47% 18%,rgba(207,239,244,.82),transparent 30%),linear-gradient(135deg,#eaf4f7,#dce9ef);scrollbar-color:#94cbd4 transparent;scrollbar-width:thin}.sdm-isometric-map-inner{height:405px;border:1px solid rgba(255,255,255,.88);border-radius:18px;background:#eaf2f5;box-shadow:inset 0 1px 0 #fff,0 9px 24px rgba(32,81,103,.08)}.sdm-isometric-map-base{border-radius:inherit}.sdm-map-grey-blocks{opacity:.9}.sdm-iso-map-hud{position:absolute;z-index:3;top:16px;left:17px;display:flex;align-items:center;gap:13px;padding:8px 10px;color:#44647b;border:1px solid rgba(216,235,240,.92);border-radius:10px;background:rgba(255,255,255,.82);box-shadow:0 6px 16px rgba(54,100,121,.1);backdrop-filter:blur(8px);font-size:8px;font-weight:800}.sdm-iso-map-hud span{display:flex;align-items:center;gap:5px}.sdm-iso-map-hud span i{width:7px;height:7px;border-radius:50%;background:#23b79c;box-shadow:0 0 0 3px rgba(35,183,156,.15)}.sdm-iso-map-hud b{padding-left:10px;color:#0c6f8e;border-left:1px solid #d7e7ed;font-size:8px}.sdm-iso-map-controls{position:absolute;z-index:3;right:17px;bottom:16px;display:grid;overflow:hidden;border:1px solid rgba(216,235,240,.92);border-radius:9px;background:rgba(255,255,255,.86);box-shadow:0 6px 16px rgba(54,100,121,.1);pointer-events:none}.sdm-iso-map-controls i{display:grid;width:24px;height:23px;place-items:center;color:#3e6984;font-style:normal;font-size:15px;font-weight:800}.sdm-iso-map-controls i+ i{border-top:1px solid #dcebf0}.sdm-iso-unit{width:108px;height:169px}.sdm-iso-building{width:108px;height:169px;filter:drop-shadow(0 10px 8px rgba(20,75,99,.17));transition:transform .24s cubic-bezier(.2,.8,.2,1),filter .24s ease}.sdm-iso-plot{fill:rgba(255,255,255,.78);stroke:rgba(112,159,176,.22);stroke-width:1}.sdm-iso-plot-side{fill:rgba(171,205,217,.45)}.sdm-iso-left{fill:color-mix(in srgb,var(--sdm-city-color),#062d4b 38%)}.sdm-iso-right{fill:color-mix(in srgb,var(--sdm-city-color),#103c5b 10%)}.sdm-iso-roof{fill:color-mix(in srgb,var(--sdm-city-color),#fff 35%);stroke:rgba(255,255,255,.35);stroke-width:1}.sdm-iso-windows{fill:rgba(244,253,255,.94);filter:drop-shadow(0 1px 1px rgba(10,50,72,.2))}.sdm-iso-marker-ring{fill:rgba(255,255,255,.72);stroke:var(--sdm-city-color);stroke-width:1;animation:sdm-city-pulse 2.6s ease-out infinite}.sdm-iso-marker{stroke-width:3.5}.sdm-iso-unit:hover .sdm-iso-building,.sdm-iso-unit:focus-visible .sdm-iso-building{filter:drop-shadow(0 17px 12px rgba(12,65,88,.28));transform:translateY(-11px) scale(1.075)}.sdm-iso-label{right:-22px;bottom:-1px;left:-22px;padding:4px 6px;overflow:visible;color:#345974;font-size:8px;line-height:1.1;text-overflow:clip;white-space:normal;text-shadow:none}.sdm-iso-label::before{position:absolute;z-index:-1;inset:0;border:1px solid rgba(215,232,238,.9);border-radius:7px;background:rgba(255,255,255,.78);box-shadow:0 3px 9px rgba(47,99,119,.08);content:""}.sdm-iso-tooltip{top:-19px;min-width:140px;padding:10px 11px;border:1px solid rgba(130,220,220,.32);border-radius:11px;background:linear-gradient(135deg,#083d73,#0d5f87);box-shadow:0 12px 25px rgba(7,48,87,.28)}.sdm-iso-tooltip strong{font-size:9px}.sdm-iso-tooltip b{color:#8df2e1;font-size:14px}.sdm-iso-tooltip small{font-size:7px}.sdm-iso-unit:hover .sdm-iso-tooltip,.sdm-iso-unit:focus-visible .sdm-iso-tooltip{transform:translate(-50%,-12px)}@keyframes sdm-city-pulse{0%,55%{opacity:.8;transform:scale(.8)}80%{opacity:0;transform:scale(1.42)}100%{opacity:0;transform:scale(1.42)}}
.sdm-dashboard-map{margin-bottom:14px}.sdm-jatim-map-panel{background:linear-gradient(145deg,#fff,#f8fcff)}.sdm-jatim-map-panel>header{padding:18px 21px;border-color:#e1eef4}.sdm-jatim-map-panel>header>strong{display:grid;min-width:62px;height:47px;place-content:center;color:#0b6295!important;font-size:17px!important;line-height:1;text-align:center;border-radius:13px;background:linear-gradient(135deg,#e5f4ff,#def7f1)!important}.sdm-jatim-map-panel>header>strong small{margin-top:3px;color:#40829f;font-size:7px;font-weight:900;letter-spacing:.8px}.sdm-jatim-map{position:relative;min-height:360px;overflow:hidden;background:radial-gradient(circle at 50% 42%,rgba(231,248,252,.9),transparent 42%),linear-gradient(180deg,#fff,#f2f9fc)}.sdm-jatim-map-art{position:absolute;inset:0;width:100%;height:100%}.sdm-jatim-map-caption{position:absolute;z-index:1;bottom:15px;left:17px;display:flex;align-items:center;gap:6px;padding:7px 9px;color:#5a7c91;border:1px solid #dbeaf0;border-radius:9px;background:rgba(255,255,255,.86);box-shadow:0 5px 12px rgba(36,87,108,.08);font-size:8px;font-weight:800}.sdm-jatim-map-caption i{width:7px;height:7px;border-radius:50%;background:#24ad96;box-shadow:0 0 0 3px rgba(36,173,150,.15)}.sdm-jatim-map-marker{position:absolute;z-index:2;left:var(--sdm-map-x);top:var(--sdm-map-y);display:block;color:#31566d;text-decoration:none;outline:none;transform:translate(-50%,-50%)}.sdm-jatim-map-marker:hover,.sdm-jatim-map-marker:focus-visible{z-index:5}.sdm-jatim-map-pin{position:relative;display:grid;grid-template-columns:16px auto;align-items:center;gap:3px;min-width:40px;height:27px;padding:0 8px 0 5px;color:#fff;border:2px solid #fff;border-radius:99px;background:var(--sdm-marker-color);box-shadow:0 6px 13px color-mix(in srgb,var(--sdm-marker-color),transparent 68%),0 0 0 4px color-mix(in srgb,var(--sdm-marker-color),transparent 83%);transition:transform .18s ease,box-shadow .18s ease}.sdm-jatim-map-pin::after{position:absolute;top:100%;left:13px;width:8px;height:8px;content:"";background:var(--sdm-marker-color);transform:translateY(-4px) rotate(45deg);z-index:-1}.sdm-jatim-map-pin i{display:grid;width:15px;height:15px;place-items:center;color:#fff;border-radius:50%;background:rgba(255,255,255,.24);font-size:9px;font-style:normal}.sdm-jatim-map-pin b{font-size:9px}.sdm-jatim-map-place{position:absolute;top:36px;left:50%;min-width:max-content;color:#52748a;font-size:7px;font-weight:900;text-align:center;transform:translateX(-50%);white-space:nowrap}.sdm-jatim-map-popover{position:absolute;z-index:2;bottom:42px;left:50%;display:grid;min-width:142px;padding:10px 12px;gap:2px;visibility:hidden;color:#fff;border-radius:11px;background:linear-gradient(135deg,#083f71,#0a6990);box-shadow:0 12px 24px rgba(9,60,95,.26);opacity:0;pointer-events:none;transform:translate(-50%,7px);transition:opacity .18s ease,transform .18s ease}.sdm-jatim-map-popover::after{position:absolute;top:100%;left:50%;width:10px;height:10px;content:"";background:#0a6990;transform:translate(-50%,-5px) rotate(45deg)}.sdm-jatim-map-popover strong,.sdm-jatim-map-popover b,.sdm-jatim-map-popover em{position:relative;z-index:1}.sdm-jatim-map-popover strong{font-size:9px}.sdm-jatim-map-popover b{color:#8ef5e2;font-size:15px}.sdm-jatim-map-popover b small{font-size:8px}.sdm-jatim-map-popover em{margin-top:2px;color:#cbe8f4;font-size:7px;font-style:normal;font-weight:700}.sdm-jatim-map-marker:hover .sdm-jatim-map-pin,.sdm-jatim-map-marker:focus-visible .sdm-jatim-map-pin{box-shadow:0 10px 17px color-mix(in srgb,var(--sdm-marker-color),transparent 56%),0 0 0 7px color-mix(in srgb,var(--sdm-marker-color),transparent 87%);transform:translateY(-5px) scale(1.07)}.sdm-jatim-map-marker:hover .sdm-jatim-map-popover,.sdm-jatim-map-marker:focus-visible .sdm-jatim-map-popover{visibility:visible;opacity:1;transform:translate(-50%,0)}
.sdm-status-content{display:grid;grid-template-columns:130px minmax(0,1fr);align-items:center;gap:18px;padding:19px 18px}.sdm-status-donut{position:relative;display:grid;width:130px;height:130px;place-items:center;border-radius:50%;box-shadow:0 9px 20px rgba(18,76,111,.12)}.sdm-status-donut::after{position:absolute;inset:23px;content:"";border-radius:50%;background:#fff;box-shadow:inset 0 2px 8px rgba(22,75,113,.06)}.sdm-status-donut>div{position:relative;z-index:1;text-align:center}.sdm-status-donut strong,.sdm-status-donut small{display:block}.sdm-status-donut strong{color:#123f6d;font-size:21px}.sdm-status-donut small{margin-top:3px;color:#8f9dad;font-size:7px;font-weight:900;text-transform:uppercase}.sdm-status-legend{display:grid;gap:8px}.sdm-status-legend>div{display:grid;grid-template-columns:9px minmax(0,1fr) auto;align-items:center;gap:7px}.sdm-status-legend i{width:8px;height:8px;border-radius:3px}.sdm-status-legend span{overflow:hidden;color:#4b637a;font-size:9px;font-weight:700;text-overflow:ellipsis;white-space:nowrap}.sdm-status-legend strong{color:#174a70;font-size:10px}
.sdm-readiness-panel{display:grid;grid-template-columns:minmax(200px,.8fr) minmax(190px,1fr) auto;align-items:center;gap:24px;padding:18px 20px}.sdm-readiness-copy p strong{color:#118a97;font-size:16px}.sdm-readiness-progress i{display:block;height:10px;overflow:hidden;border-radius:99px;background:#e8eff3}.sdm-readiness-progress i b{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#0c7cb3,#21b8a9);transition:width .22s ease}.sdm-readiness-progress span{display:block;margin-top:7px;color:#8392a6;font-size:9px;font-weight:700}.sdm-readiness-links{display:flex;gap:8px}.sdm-readiness-links a{padding:9px 11px;color:#0879ad;border:1px solid #cde4ec;border-radius:9px;background:#f7fcfd;font-size:9px;font-weight:900;text-decoration:none;white-space:nowrap}.sdm-readiness-links a:last-child{color:#fff;border-color:#118ba0;background:linear-gradient(135deg,#1688bc,#37bdae)}.sdm-readiness-links a:hover{transform:translateY(-1px)}
@media(max-width:1050px){.sdm-dashboard-visual-grid{grid-template-columns:1fr}.sdm-readiness-panel{grid-template-columns:1fr 1fr}.sdm-readiness-links{grid-column:1/-1}}@media(max-width:680px){.sdm-status-content{grid-template-columns:1fr;justify-items:center}.sdm-status-legend{width:min(100%,290px)}.sdm-readiness-panel{grid-template-columns:1fr;gap:14px}.sdm-readiness-links{grid-column:auto;flex-direction:column}.sdm-readiness-links a{text-align:center}}

/* Grafik interaktif Chart.js pada Dashboard SDM Jatim. */
.sdm-chart-canvas{position:relative;min-width:0}.sdm-chart-canvas canvas{display:block;width:100%!important;height:100%!important}.sdm-unit-chart-canvas{height:294px;padding:16px 18px 12px}.sdm-status-content{grid-template-columns:150px minmax(0,1fr);padding:19px 18px}.sdm-status-chart-canvas{height:150px}.sdm-status-legend{align-self:center}
.sdm-attendance-chart-canvas{height:326px;padding:16px 18px 14px}
.sdm-donut-unit-picker,.sdm-chart-unit-picker{display:grid;flex:0 0 auto;gap:4px;min-width:150px}.sdm-donut-unit-picker>span,.sdm-chart-unit-picker>span{color:#8092a4;font-size:7px;font-weight:900;letter-spacing:.65px;text-transform:uppercase}.sdm-donut-unit-picker select,.sdm-chart-unit-picker select{width:100%;padding:7px 24px 7px 8px;color:#31506e;border:1px solid #cfe0e9;border-radius:8px;background:#fff;font:800 8px inherit;cursor:pointer}
.sdm-status-content{position:relative}.sdm-chart-tooltip{position:absolute;z-index:5;display:grid;grid-template-columns:9px auto;align-items:center;gap:7px;min-width:136px;padding:9px 11px;color:#fff;border-radius:9px;background:#092e62;box-shadow:0 8px 18px rgba(7,42,87,.2);pointer-events:none;transform:translate(-50%,calc(-100% - 10px));white-space:nowrap}.sdm-chart-tooltip::after{position:absolute;bottom:-5px;left:50%;width:10px;height:10px;content:"";background:#092e62;transform:translateX(-50%) rotate(45deg)}.sdm-chart-tooltip>i{position:relative;z-index:1;width:8px;height:8px;border:1px solid rgba(255,255,255,.8);border-radius:50%}.sdm-chart-tooltip strong,.sdm-chart-tooltip span{position:relative;z-index:1;display:block}.sdm-chart-tooltip strong{font-size:11px}.sdm-chart-tooltip span{margin-top:3px;color:#c9e3f3;font-size:8px;font-weight:700}
@media(max-width:680px){.sdm-unit-chart-canvas{height:250px;padding-inline:10px}.sdm-attendance-chart-canvas{height:360px;padding-inline:10px}.sdm-status-panel>header,.sdm-attendance-panel>header{flex-direction:column}.sdm-donut-unit-picker,.sdm-chart-unit-picker{width:100%}.sdm-status-content{grid-template-columns:1fr;justify-items:center}.sdm-status-chart-canvas{width:190px;height:190px}.sdm-status-legend{width:min(100%,290px)}}
@media(max-width:800px){.sdm-city-scene{grid-template-columns:repeat(3,minmax(74px,1fr));gap:14px;min-height:0;padding:44px 18px 30px}.sdm-city-building{height:185px}.sdm-city-label{white-space:normal}.sdm-city-tower{width:48px}.sdm-city-tower>i{width:48px}.sdm-city-tower::after{left:12px;width:27px}.sdm-city-tooltip{top:0}}

/* Palet sidebar diselaraskan dengan biru–toska–emas JAKSA. */
.sidebar{color:#294762;background:linear-gradient(180deg,#fff 0%,#fbfdfe 58%,#f2f9fa 100%);border-right-color:#d8e8ed;box-shadow:8px 0 24px rgba(27,75,102,.08)}
.main-nav>.nav-label{color:#7890a3}
.nav-link{color:#526f87}
.nav-link:hover{color:#075d9e;background:linear-gradient(90deg,#edf8fa 0%,#f6fbfd 100%);box-shadow:inset 3px 0 0 #20aaa1}
.nav-link.active,.nav-parent.active{color:#084f8d;background:linear-gradient(90deg,#e4f5f4 0%,#edf6fc 76%,#fff8e7 100%);box-shadow:inset 3px 0 0 #0ba9a2,inset 0 0 0 1px #c9e8e5}
.nav-link.active::after{background:#f2bd4f;box-shadow:0 0 0 4px rgba(242,189,79,.16)}
.nav-icon,.nav-link:not(.active) .nav-icon,.nav-parent:not(.active) .nav-icon,.nav-link-muted .nav-icon{color:#0875a5;background:linear-gradient(145deg,#f3fbfd,#e6f5f6);border-color:#cbe7eb;box-shadow:0 3px 9px rgba(20,106,140,.08)}
.nav-link:hover .nav-icon{color:#00679d;background:linear-gradient(145deg,#e2f4f8,#d8f3ef);border-color:#99d8d4;box-shadow:0 5px 12px rgba(17,130,150,.13);transform:scale(1.04)}
.nav-link.active .nav-icon,.nav-parent.active .nav-icon{color:#fff;background:linear-gradient(145deg,#086db2 0%,#109da8 62%,#23b7a8 100%);box-shadow:0 5px 12px rgba(10,119,155,.22)}
.nav-sublink{color:#5b778d}.nav-sublink:hover{color:#08689c;background:#ebf7f8;box-shadow:inset 3px 0 0 #20aaa1}.nav-sublink.active{color:#075c99;background:linear-gradient(90deg,#def3f2,#ebf5fb);box-shadow:inset 3px 0 0 #0ba9a2,inset 0 0 0 1px #c4e6e4}.nav-sublink.active>span{color:#d5a43c}

/* Sidebar gelap sesuai referensi navigasi JAKSA. */
@media (min-width:901px){:root{--sidebar:176px}}
.sidebar{color:#fff;background:linear-gradient(160deg,#063563 0%,#075685 48%,#063b70 100%);border-right:1px solid rgba(151,226,242,.18);box-shadow:8px 0 22px rgba(2,32,70,.2)}
.sidebar::after{position:absolute;right:-54px;bottom:-78px;width:190px;height:190px;border:1px solid rgba(108,223,225,.15);border-radius:50%;content:"";pointer-events:none}.sidebar::before{display:block;top:auto;right:-92px;bottom:44px;left:auto;width:172px;height:172px;border:25px solid rgba(66,184,203,.09)}
.brand-jaksa-expansion{color:rgba(235,251,255,.75)}.brand-jaksa-expansion b{background:linear-gradient(135deg,#fff,#9feee1);background-clip:text;-webkit-background-clip:text}.brand-jaksa-wordmark{filter:drop-shadow(0 4px 7px rgba(0,20,60,.3))}
.main-nav>.nav-label{margin:0 8px 7px;color:rgba(229,247,255,.68);font-size:6.5px;font-weight:900;letter-spacing:1px}
.nav-link{min-height:34px;margin-bottom:3px;padding:6px 8px;gap:8px;color:rgba(243,251,255,.88);border-radius:7px;font-size:8px;font-weight:750}
.nav-link:hover{color:#fff;background:rgba(255,255,255,.1);box-shadow:inset 0 0 0 1px rgba(182,245,242,.12);transform:translateX(1px)}
.nav-link.active:not(.nav-parent){color:#fff;background:rgba(17,151,180,.26);box-shadow:inset 0 0 0 1px rgba(165,240,239,.16)}
.nav-parent.active{color:#fff;background:linear-gradient(100deg,#1683b4 0%,#20b8ad 100%);box-shadow:0 7px 16px rgba(0,25,73,.19),inset 0 1px 0 rgba(255,255,255,.15)}
.nav-link.active::after{display:none}.nav-chevron{color:rgba(239,255,255,.88);font-size:13px}.nav-group.open .nav-chevron{color:#fff}
.nav-icon,.nav-link:not(.active) .nav-icon,.nav-parent:not(.active) .nav-icon,.nav-link-muted .nav-icon{flex-basis:23px;width:23px;height:23px;color:#e8fbff;background:rgba(32,132,182,.42);border:1px solid rgba(153,229,244,.15);border-radius:6px;box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 3px 7px rgba(0,24,70,.14)}
.nav-icon>i,.image-nav-icon::before{color:#eefcff!important;background:#eefcff!important;-webkit-text-fill-color:#eefcff}
.nav-link:hover .nav-icon{color:#fff;background:rgba(49,161,194,.6);border-color:rgba(187,248,247,.28);box-shadow:0 4px 9px rgba(0,19,63,.19);transform:scale(1.03)}
.nav-link.active .nav-icon,.nav-parent.active .nav-icon{color:#fff;background:rgba(1,70,122,.37);border-color:rgba(255,255,255,.2);box-shadow:inset 0 1px 0 rgba(255,255,255,.16),0 3px 8px rgba(0,37,78,.2)}
.nav-submenu{margin:1px 0 7px 12px;padding:2px 0 2px 12px;border-left-color:rgba(131,233,240,.42)}
.nav-sublink{min-height:26px;margin:1px 0;padding:4px 7px;gap:7px;color:rgba(246,252,255,.9);border-radius:6px;font-size:7.5px;font-weight:700}.nav-sublink>span{color:#b9f5f1;font-size:4px}
.nav-sublink:hover{color:#fff;background:rgba(255,255,255,.1);box-shadow:none;transform:translateX(1px)}
.nav-sublink.active{color:#075689;background:linear-gradient(100deg,#effcff 0%,#fff0b2 100%);box-shadow:0 4px 10px rgba(0,26,69,.2)}.nav-sublink.active>span{color:#119da3}.nav-link-muted,.nav-link-muted:hover{color:rgba(229,248,255,.75);background:transparent;box-shadow:none;transform:none}.nav-status-dot{background:#91edc0;box-shadow:0 0 0 3px rgba(145,237,192,.16)}
.sidebar-account{color:#fff;background:rgba(0,39,91,.28);border-color:rgba(188,241,244,.14);box-shadow:none}.sidebar-account-avatar{color:#0871a0;background:#e4fbf8}.sidebar-account small{color:rgba(231,250,255,.67)}.sidebar-account button{color:#fff;background:rgba(255,255,255,.12)}
}
.icon-dashboard{font-size:0;transform:none}.icon-dashboard::before{display:none}.icon-dashboard>svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.9}

/* Bentuk menu induk dan submenu mengikuti struktur pada referensi. */
.nav-parent.active{overflow:visible;border-radius:0 9px 9px 0;padding-left:10px;background:linear-gradient(100deg,#2389d8 0%,#2a9fd1 46%,#51c7b2 100%);box-shadow:0 8px 17px rgba(0,26,70,.23),inset 0 1px 0 rgba(255,255,255,.17)}
.nav-parent.active .nav-icon{position:relative;z-index:1;flex-basis:30px;width:30px;height:30px;margin-left:-5px;border-color:rgba(255,255,255,.72);border-radius:8px;background:rgba(3,75,132,.38);box-shadow:0 4px 10px rgba(0,31,83,.24)}
.nav-parent.active .nav-link-text,.nav-parent.active .nav-chevron{position:relative;z-index:1}
.nav-group.open>.nav-submenu{position:relative;margin:4px 0 8px 17px;padding:4px 0 4px 14px;border-left:1px solid rgba(123,233,241,.55)}
.nav-group.open>.nav-submenu::before{position:absolute;top:-5px;left:-3px;width:5px;height:5px;border-radius:50%;background:#b7faf5;box-shadow:0 0 0 3px rgba(25,169,190,.17);content:""}
.nav-sublink{position:relative;min-height:27px;margin:1px 0;padding:4px 7px;color:rgba(247,253,255,.9);border-radius:0 7px 7px 0}
.nav-sublink.active{z-index:1;min-height:30px;margin:1px 0 1px -15px;padding:5px 8px 5px 22px;color:#07517f;border-radius:0 8px 8px 0;background:linear-gradient(100deg,#edfaff 0%,#f8fcf6 55%,#ffec9b 100%);box-shadow:0 5px 12px rgba(0,26,70,.2)}
.nav-sublink.active::before{position:absolute;top:50%;left:-5px;width:10px;height:10px;border-radius:50%;background:#edfaff;box-shadow:-4px 0 0 #edfaff;content:"";transform:translateY(-50%)}
.nav-sublink.active>span{position:relative;z-index:1;color:#30bdb8;opacity:0}.nav-sublink.active:hover{color:#07517f;background:linear-gradient(100deg,#edfaff 0%,#f8fcf6 55%,#ffec9b 100%)}

/* Submenu terpilih: kapsul berada setelah garis indikator, bukan menutupinya. */
.sidebar .nav-group.open>.nav-submenu>.nav-sublink.active{min-height:30px!important;margin:1px 0!important;padding:5px 8px 5px 17px!important;color:#0b458f!important;border-radius:8px!important;background:linear-gradient(100deg,#dff4ff 0%,#b9e3ff 55%,#65b9ec 100%)!important;box-shadow:0 5px 12px rgba(0,26,70,.18)!important}
.sidebar .nav-group.open>.nav-submenu>.nav-sublink.active::before{display:none!important}
.sidebar .nav-group.open>.nav-submenu>.nav-sublink.active>span{color:#0750a8!important;opacity:1!important}
.sidebar .nav-group.open>.nav-submenu>.nav-sublink.active:hover{color:#0b458f!important;background:linear-gradient(100deg,#dff4ff 0%,#b9e3ff 55%,#65b9ec 100%)!important;transform:none!important}

/* Menu induk aktif memakai bayangan halus tanpa penanda sisi. */
.nav-parent.active{box-shadow:0 8px 17px rgba(0,26,70,.23),inset 0 1px 0 rgba(255,255,255,.17)!important}

.lr-profitloss-report-panel .lr-report-status{color:#087d78;border-color:#a9ddd7;background:#edf9f7;transition:color .16s ease,border-color .16s ease,background .16s ease,box-shadow .16s ease}
.lr-profitloss-report-panel .lr-report-status:hover{color:#056e6b;border-color:#76c8c0;background:#dff4f1;box-shadow:0 3px 9px rgba(9,133,126,.12)}

/* Saat rincian tertutup, guliran vertikal mengikuti halaman utama. */
.lr-profitloss-report-panel.table-title-flat:not(.lr-details-expanded){height:auto!important;overflow:hidden!important}
.lr-profitloss-report-panel.table-title-flat:not(.lr-details-expanded) .lr-report-scroll{flex:0 0 auto!important;min-height:0!important;overflow-x:auto!important;overflow-y:hidden!important;overscroll-behavior-x:contain!important;overscroll-behavior-y:auto!important}
/* Ketika rincian dibuka, tabel mempertahankan area gulirnya sendiri. */
.lr-profitloss-report-panel.table-title-flat.lr-details-expanded{height:clamp(560px,calc(100dvh - 100px),900px)!important;overflow:hidden!important}
.lr-profitloss-report-panel.table-title-flat.lr-details-expanded .lr-report-scroll{flex:1 1 0!important;min-height:0!important;overflow:auto!important;overscroll-behavior:contain!important}

/* Standar global header dan kartu daftar: navy, biru, lalu biru langit. */
:root{--system-table-header-gradient:linear-gradient(90deg,#22396f 0%,#22396f 22%,#0a65d2 58%,#39c9f2 100%);--system-table-header-font-size:9px;--system-electric-sky-gradient:linear-gradient(135deg,#0a65d2 0%,#39c9f2 100%)}
body .content-shell .main-content table>thead{color:#fff!important;background:var(--system-table-header-gradient)!important}
/* Ukuran label header dibuat lebih mudah dibaca di seluruh tabel. */
body .content-shell .main-content table>thead>tr>th{color:#fff!important;border-color:rgba(255,255,255,.2)!important;background:transparent!important;font-size:var(--system-table-header-font-size)!important;font-weight:800!important}
/* Kartu pembungkus seragam untuk tabel Dokumen Masuk, Keluar, dan Progres Agendaris. */
body .content-shell .main-content :is(.agenda-document-table-card,.document-register-table-card){margin-top:15px!important;padding:10px!important;overflow:hidden!important;border:1px solid #d6e4ee!important;border-radius:15px!important;background:#fff!important;box-shadow:0 7px 20px rgba(21,78,133,.07)!important}
body .content-shell .main-content :is(.agenda-document-table-card,.document-register-table-card)>.table-wrap{overflow:auto!important;border-radius:10px 10px 0 0!important}
/* Tabel lama pernah memiliki gradasi masing-masing; semuanya kini memakai satu token global. */
body .content-shell .main-content .table-title-flat .bukti-bayar-table>thead,body .content-shell .main-content .table-title-flat .lr-report-table>thead,body .content-shell .main-content .table-title-flat .simulation-table>thead,body .content-shell .main-content .table-title-flat .magang-table>thead,body .content-shell .main-content .table-title-flat .sdm-daily-table>thead,body .content-shell .main-content .table-title-gradient .lr-report-table>thead{background:var(--system-table-header-gradient)!important}
body .content-shell .main-content .table-title-flat>.table-title-flat__table::before,body .content-shell .main-content .table-title-gradient>.table-title-gradient__table::before{background:#0750a8!important}
body .content-shell .main-content .table-title-flat>.table-title-flat__table::after,body .content-shell .main-content .table-title-gradient>.table-title-gradient__table::after{background:#39c9f2!important}

/* Standar kartu daftar mengikuti palet header tabel, tanpa aksen kuning lama. */
body .content-shell .main-content .table-title-flat>.table-title-flat__header,body .content-shell .main-content .table-title-gradient>.table-title-gradient__header{border:2px solid transparent!important;border-bottom:0!important;background:linear-gradient(100deg,#f4fbfd 0%,#fff 58%,#f3fcfb 100%) padding-box,var(--system-table-header-gradient) border-box!important;background-clip:padding-box,border-box!important}
body .content-shell .main-content .table-title-gradient>.table-title-gradient__header::before{background:var(--system-table-header-gradient)!important}
body .content-shell .main-content .table-title-gradient>.table-title-gradient__header::after{background:linear-gradient(90deg,#22396f 0 2px,transparent 2px calc(100% - 2px),#39c9f2 calc(100% - 2px) 100%)!important}
body .content-shell .main-content .table-title-flat>.table-title-flat__header>span,body .content-shell .main-content .table-title-gradient>.table-title-gradient__header>span{color:#087b82!important;border-color:#a7ddd8!important;background:#effbf9!important}

/* Tombol filter selalu setinggi field input, termasuk pemicu menu kotak. */
.agendaris-filter-form.bukti-bayar-filter-form .bukti-bayar-filter-actions{--bukti-filter-action-height:30px}
.agendaris-filter-form.bukti-bayar-filter-form .bukti-bayar-filter-actions .btn{box-sizing:border-box!important;height:var(--bukti-filter-action-height)!important;min-height:var(--bukti-filter-action-height)!important}
.agendaris-filter-form.bukti-bayar-filter-form .bukti-bayar-filter-actions .lr-filter-menu{flex:0 0 34px!important;height:34px!important}
.agendaris-filter-form.bukti-bayar-filter-form .bukti-bayar-filter-actions .lr-filter-menu-trigger{display:grid!important;box-sizing:border-box!important;width:34px!important;min-width:34px!important;height:34px!important;min-height:34px!important;padding:0!important;place-items:center}

/* Standar global filter: kartu lembut, teks ringkas, dan aksi berikon. */
:root{--system-filter-border:#d6e4ee;--system-filter-text:#0878c1;--system-filter-focus:#0878c1;--system-filter-focus-ring:rgba(8,120,193,.12);--system-filter-placeholder:#71869a;--system-filter-height:30px}
body .content-shell .main-content .filter-panel{margin-bottom:12px!important;padding:10px 14px!important;border:1px solid var(--system-filter-border)!important;border-radius:14px!important;background:linear-gradient(105deg,#fff 0%,#fbfdff 100%)!important;box-shadow:0 4px 13px rgba(37,75,105,.055)!important}
body .content-shell .main-content .filter-panel form .form-group>label{margin-bottom:4px!important;color:var(--system-filter-text)!important;font-size:8px!important;font-weight:850!important}
body .content-shell .main-content .filter-panel form .form-group>input:not([type=hidden]),body .content-shell .main-content .filter-panel form .form-group>select,body .content-shell .main-content .filter-panel form .input-with-icon>input{box-sizing:border-box!important;height:var(--system-filter-height)!important;min-height:var(--system-filter-height)!important;color:#39566f!important;border-color:var(--system-filter-border)!important;border-radius:7px!important;background:#fff!important;font-size:8.5px!important;box-shadow:inset 0 1px 1px rgba(24,65,99,.02)!important}
body .content-shell .main-content .filter-panel form .input-with-icon>input{padding-left:31px!important}
body .content-shell .main-content .filter-panel form input::placeholder{color:var(--system-filter-placeholder)!important;opacity:.5!important}
body .content-shell .main-content .filter-panel form .input-with-icon>span{left:9px!important;color:var(--system-field-icon)!important;font-size:14px!important}
body .content-shell .main-content .filter-panel form .form-group>input:not([type=hidden]):focus,body .content-shell .main-content .filter-panel form .form-group>select:focus,body .content-shell .main-content .filter-panel form .input-with-icon>input:focus{border-color:var(--system-filter-focus)!important;box-shadow:0 0 0 3px var(--system-filter-focus-ring)!important}
body .content-shell .main-content .filter-panel form .filter-actions{align-items:center;gap:6px!important}
body .content-shell .main-content .filter-panel form .filter-actions>.btn{display:inline-flex!important;align-items:center!important;justify-content:center!important;gap:6px!important;box-sizing:border-box!important;height:var(--system-filter-height)!important;min-height:var(--system-filter-height)!important;padding:0 11px!important;border-radius:7px!important;font-size:8px!important;font-weight:850!important}
body .content-shell .main-content .filter-panel form .filter-actions>button[type=submit]::before,body .content-shell .main-content .filter-panel form .filter-actions>a.btn-ghost::before{display:block;flex:0 0 14px;width:14px;height:14px;content:"";background:currentColor;-webkit-mask:center/contain no-repeat;mask:center/contain no-repeat}
body .content-shell .main-content .filter-panel form .filter-actions>button[type=submit]::before{-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='11' cy='11' r='7' fill='none' stroke='black' stroke-width='2'/%3E%3Cpath d='m16 16 5 5' fill='none' stroke='black' stroke-width='2'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='11' cy='11' r='7' fill='none' stroke='black' stroke-width='2'/%3E%3Cpath d='m16 16 5 5' fill='none' stroke='black' stroke-width='2'/%3E%3C/svg%3E")}
body .content-shell .main-content .filter-panel form .filter-actions>a.btn-ghost::before{-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M21 12a9 9 0 1 1-2.64-6.36' fill='none' stroke='black' stroke-width='2'/%3E%3Cpath d='M21 3v6h-6' fill='none' stroke='black' stroke-width='2'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M21 12a9 9 0 1 1-2.64-6.36' fill='none' stroke='black' stroke-width='2'/%3E%3Cpath d='M21 3v6h-6' fill='none' stroke='black' stroke-width='2'/%3E%3C/svg%3E")}
body .content-shell .main-content .filter-panel form .filter-actions>button[type=submit]{color:#fff!important;border-color:transparent!important;background:var(--system-filter-primary)!important;box-shadow:0 5px 12px rgba(28,119,184,.18)!important}
body .content-shell .main-content .filter-panel form .filter-actions>a.btn-ghost{color:var(--system-filter-text)!important;border-color:#c5e1f4!important;background:#f7fcff!important}
body .content-shell .main-content .filter-panel form .list-order-filter,body .content-shell .main-content .filter-panel form .list-order-menu>summary{width:var(--system-filter-height)!important;height:var(--system-filter-height)!important}

/* RKA Kanwil mengikuti standar filter sistem, termasuk ikon field dan aksi. */
.accounting-page .lr-rka-filter-panel{margin-bottom:12px!important;padding:10px 14px!important;border:1px solid var(--system-filter-border)!important;border-radius:14px!important;background:linear-gradient(105deg,#fff 0%,#fbfdff 100%)!important;box-shadow:0 4px 13px rgba(37,75,105,.055)!important}
.accounting-page .lr-rka-filter{gap:8px!important;flex-wrap:nowrap!important}
.accounting-page .lr-rka-filter>.lr-filter-unit,.accounting-page .lr-rka-filter>.lr-filter-year,.accounting-page .lr-rka-filter>.lr-filter-lob{display:grid!important;gap:4px!important;min-width:0!important}
.accounting-page .lr-rka-filter>.lr-filter-unit{flex:1.45 1 260px!important;width:auto!important}
.accounting-page .lr-rka-filter>.lr-filter-year{flex:.85 1 155px!important;width:auto!important}
.accounting-page .lr-rka-filter>.lr-filter-lob{flex:.62 1 150px!important;width:auto!important}
.accounting-page .lr-rka-filter .lr-upload-label{margin:0!important;color:var(--system-filter-text)!important;font-size:8px!important;font-weight:850!important}
.accounting-page .lr-rka-filter .lr-upload-label b{color:#d44b5c!important;font-size:8px!important}
.accounting-page .lr-rka-filter-control{position:relative;display:flex;align-items:center;height:var(--system-filter-height);border:1px solid var(--system-filter-border);border-radius:7px;background:#fff;box-shadow:inset 0 1px 1px rgba(24,65,99,.02);transition:border-color .16s ease,box-shadow .16s ease}
.accounting-page .lr-rka-filter-control:focus-within{border-color:var(--system-filter-focus);box-shadow:0 0 0 3px var(--system-filter-focus-ring)}
.accounting-page .lr-rka-filter-control .lr-rka-filter-icon,.accounting-page .lr-rka-filter .lr-lob-picker .lr-rka-filter-icon{display:grid;place-items:center;flex:0 0 26px;width:26px;height:26px;margin-left:4px;color:var(--system-field-icon)}
.accounting-page .lr-rka-filter .lr-rka-filter-icon svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.8}
.accounting-page .lr-rka-filter-control .lr-upload-select{height:calc(var(--system-filter-height) - 2px)!important;min-height:0!important;padding:0 28px 0 4px!important;border:0!important;border-radius:0 7px 7px 0!important;background:transparent!important;font-size:8.5px!important;box-shadow:none!important}
.accounting-page .lr-rka-filter-control .lr-upload-select:focus-visible{outline:0!important}
.accounting-page .lr-rka-filter .lr-lob-picker>summary{display:flex!important;align-items:center!important;gap:4px!important;box-sizing:border-box!important;min-height:var(--system-filter-height)!important;height:var(--system-filter-height)!important;padding:0 29px 0 4px!important;color:#39566f!important;border-color:var(--system-filter-border)!important;border-radius:7px!important;font-size:8.5px!important;font-weight:600!important;box-shadow:inset 0 1px 1px rgba(24,65,99,.02)!important}
.accounting-page .lr-rka-filter .lr-lob-picker>summary .lr-rka-filter-icon{margin-left:0!important}
.accounting-page .lr-rka-filter .lr-lob-picker[open]>summary{border-color:var(--system-filter-focus)!important;box-shadow:0 0 0 3px var(--system-filter-focus-ring)!important}
.accounting-page .lr-rka-filter-actions{display:flex;align-items:flex-end;gap:6px;flex:0 0 auto}
.accounting-page .lr-rka-filter-actions .btn{display:inline-flex!important;align-items:center!important;justify-content:center!important;gap:6px!important;box-sizing:border-box!important;height:var(--system-filter-height)!important;min-height:var(--system-filter-height)!important;padding:0 12px!important;border-radius:7px!important;font-size:8px!important;font-weight:850!important}
.accounting-page .lr-rka-filter-actions .btn svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:2}
.accounting-page .lr-rka-filter-actions .btn-secondary{color:#fff!important;border-color:transparent!important;background:linear-gradient(135deg,#1f81ca,#42c3bb)!important;box-shadow:0 5px 12px rgba(28,119,184,.18)!important}
.accounting-page .lr-rka-filter-actions .btn-ghost{color:#1768a8!important;border-color:#c5e1f4!important;background:#f7fcff!important}
@media(max-width:1120px){.accounting-page .lr-rka-filter{flex-wrap:wrap!important}.accounting-page .lr-rka-filter>.lr-filter-unit{flex-basis:42%!important}.accounting-page .lr-rka-filter>.lr-filter-year{flex-basis:22%!important}.accounting-page .lr-rka-filter>.lr-filter-lob{flex-basis:28%!important}}
@media(max-width:680px){.accounting-page .lr-rka-filter>.lr-filter-unit,.accounting-page .lr-rka-filter>.lr-filter-year,.accounting-page .lr-rka-filter>.lr-filter-lob{flex:1 1 100%!important}.accounting-page .lr-rka-filter-actions{width:100%}.accounting-page .lr-rka-filter-actions .btn{flex:1}}

/* Tombol Filter memakai gradasi biru elektrik ke biru langit di seluruh sistem. */
:root{--system-filter-primary:linear-gradient(135deg,#0a65d2 0%,#39c9f2 100%);--system-filter-primary-hover:linear-gradient(135deg,#0754b7 0%,#1bb8e7 100%)}
body .content-shell .main-content .filter-panel form .filter-actions>button[type=submit],.accounting-page .lr-rka-filter-actions .btn-secondary,.agendaris-filter-form.bukti-bayar-filter-form .bukti-bayar-filter-actions .btn-secondary{background:var(--system-filter-primary)!important}
body .content-shell .main-content .filter-panel form .filter-actions>button[type=submit]:hover,.accounting-page .lr-rka-filter-actions .btn-secondary:hover,.agendaris-filter-form.bukti-bayar-filter-form .bukti-bayar-filter-actions .btn-secondary:hover{background:var(--system-filter-primary-hover)!important}
body .content-shell .main-content .filter-panel form .filter-actions>a.btn-ghost:hover,.accounting-page .lr-rka-filter-actions .btn-ghost:hover,.agendaris-filter-form.bukti-bayar-filter-form .bukti-bayar-filter-actions .btn-ghost:hover{color:#fff!important;border-color:transparent!important;background:var(--system-filter-text)!important}

/* Keterangan periode lembur melengkapi susunan filter global tanpa menggeser aksi. */
body .content-shell .main-content .overtime-filter-form .overtime-filter-copy{flex:1 1 220px!important;margin:0!important;padding-bottom:3px!important}

/* Pemilih rentang tanggal: satu field global, dengan tanggal awal dan akhir di dalam panel. */
body .content-shell .main-content .overtime-filter-form .overtime-date-range-filter{flex:1.35 1 260px!important;width:auto!important;position:relative}
body .content-shell .main-content .overtime-date-range{position:relative;width:100%}
body .content-shell .main-content .overtime-date-range-toggle{display:flex;align-items:center;box-sizing:border-box;width:100%;height:var(--system-filter-height);min-height:var(--system-filter-height);gap:6px;padding:0 8px;color:#39566f;border:1px solid var(--system-filter-border);border-radius:7px;background:#fff;box-shadow:inset 0 1px 1px rgba(24,65,99,.02);cursor:pointer;list-style:none}
body .content-shell .main-content .overtime-date-range-toggle::-webkit-details-marker{display:none}
body .content-shell .main-content .overtime-date-range-toggle::marker{content:""}
body .content-shell .main-content .overtime-date-range-toggle .filter-date-icon{flex:0 0 16px;width:16px;height:16px}
body .content-shell .main-content .overtime-date-range-toggle strong{overflow:hidden;flex:1;color:#39566f;font-size:8.5px;font-weight:650;text-overflow:ellipsis;white-space:nowrap}
body .content-shell .main-content .overtime-date-range-chevron{flex:0 0 14px;width:14px;height:14px;fill:none;stroke:#174c81;stroke-linecap:round;stroke-linejoin:round;stroke-width:2;transition:transform .16s ease}
body .content-shell .main-content .overtime-date-range[open]>.overtime-date-range-toggle{border-color:var(--system-filter-focus);box-shadow:0 0 0 3px var(--system-filter-focus-ring)}
body .content-shell .main-content .overtime-date-range[open] .overtime-date-range-chevron{transform:rotate(180deg)}
body .content-shell .main-content .overtime-date-range-popover{position:absolute;z-index:70;top:calc(100% + 6px);left:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;width:min(330px,calc(100vw - 48px));padding:9px;border:1px solid var(--system-filter-border);border-radius:9px;background:#fff;box-shadow:0 12px 24px rgba(37,75,105,.18)}
body .content-shell .main-content .overtime-date-range-popover>label{display:grid;gap:4px;color:var(--system-filter-text);font-size:8px;font-weight:850}
body .content-shell .main-content .overtime-date-range-popover input[type=date]{box-sizing:border-box;width:100%;height:var(--system-filter-height);min-height:var(--system-filter-height);padding:0 8px;color:#39566f;border:1px solid var(--system-filter-border);border-radius:7px;background:#fff;font:inherit;font-size:8.5px;box-shadow:inset 0 1px 1px rgba(24,65,99,.02)}
body .content-shell .main-content .overtime-date-range-popover input[type=date]:focus{outline:0;border-color:var(--system-filter-focus);box-shadow:0 0 0 3px var(--system-filter-focus-ring)}
@media(max-width:520px){body .content-shell .main-content .overtime-date-range-popover{grid-template-columns:1fr;width:min(280px,calc(100vw - 48px))}}

/* Kelompok aksi filter selalu dipisahkan garis lembut dari field isian. */
body .content-shell .main-content .filter-panel form .filter-actions,.accounting-page .lr-rka-filter-actions{position:relative;padding-left:11px}
body .content-shell .main-content .filter-panel form .filter-actions::before,.accounting-page .lr-rka-filter-actions::before{position:absolute;top:4px;bottom:4px;left:0;width:1px;content:"";background:#dce8ef}
@media(max-width:600px){body .content-shell .main-content .filter-panel form .filter-actions{padding-left:0}body .content-shell .main-content .filter-panel form .filter-actions::before{display:none}}


/* Ikon kalender standar untuk pemilih tanggal dan rentang tanggal. */
.filter-date-icon{display:grid;place-items:center;color:var(--system-field-icon);background:transparent}
.filter-date-icon svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.8}
body .content-shell .main-content .filter-panel input[type=date]::-webkit-calendar-picker-indicator{opacity:.72;filter:invert(32%) sepia(48%) saturate(1240%) hue-rotate(171deg) brightness(91%) contrast(89%);cursor:pointer}

/* RKA: field mengisi ruang tersedia, tiga aksi tetap menempel di kanan. */
@media(min-width:1121px){.accounting-page .lr-rka-filter{display:grid!important;grid-template-columns:minmax(0,1.65fr) minmax(170px,.94fr) minmax(160px,.66fr) auto!important;align-items:end!important;width:100%}.accounting-page .lr-rka-filter>.lr-filter-unit,.accounting-page .lr-rka-filter>.lr-filter-year,.accounting-page .lr-rka-filter>.lr-filter-lob{width:100%!important;min-width:0!important}.accounting-page .lr-rka-filter-actions{justify-self:end!important;white-space:nowrap}.accounting-page .lr-rka-filter-note{grid-column:1/-1!important;width:100%;margin:0!important}}
@media(max-width:1120px){.accounting-page .lr-rka-filter{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr)) auto!important}.accounting-page .lr-rka-filter-actions{justify-self:end!important}.accounting-page .lr-rka-filter-note{grid-column:1/-1!important;width:100%;margin:0!important}}
@media(max-width:680px){.accounting-page .lr-rka-filter{grid-template-columns:1fr!important}.accounting-page .lr-rka-filter-actions{justify-self:stretch!important}.accounting-page .lr-rka-filter-note{grid-column:auto!important}}

/* Aturan global susunan filter: field fleksibel, tiga aksi menetap di kanan. */
@media(min-width:721px){body .content-shell .main-content .filter-panel>form{display:flex!important;flex-wrap:wrap!important;align-items:flex-end!important;gap:8px!important;width:100%}body .content-shell .main-content .filter-panel>form>.form-group{flex:1 1 145px;min-width:0}body .content-shell .main-content .filter-panel>form>.search-group{flex:1.45 1 220px}body .content-shell .main-content .filter-panel>form>.list-order-filter{flex:0 0 var(--system-filter-height)!important;width:var(--system-filter-height)!important;min-width:var(--system-filter-height)!important}body .content-shell .main-content .filter-panel>form>.filter-actions{flex:0 0 auto!important;margin-left:auto!important;white-space:nowrap}}
/* Satu komponen menu aksi untuk seluruh filter, termasuk RKA. */
:is(.filter-actions,.lr-rka-filter-actions) .lr-filter-menu{position:relative!important;z-index:35!important;flex:0 0 var(--system-filter-height)!important;width:var(--system-filter-height)!important;height:var(--system-filter-height)!important;min-width:var(--system-filter-height)!important;align-self:flex-end!important}
:is(.filter-actions,.lr-rka-filter-actions) .lr-filter-menu-trigger{display:grid!important;box-sizing:border-box!important;width:var(--system-filter-height)!important;min-width:var(--system-filter-height)!important;height:var(--system-filter-height)!important;padding:0!important;place-items:center!important;color:var(--system-filter-text)!important;border:1px solid #c5e1f4!important;border-radius:7px!important;background:#f7fcff!important;box-shadow:none!important;cursor:pointer!important;list-style:none!important}
:is(.filter-actions,.lr-rka-filter-actions) .lr-filter-menu-trigger::-webkit-details-marker{display:none}:is(.filter-actions,.lr-rka-filter-actions) .lr-filter-menu-trigger::marker{content:""}:is(.filter-actions,.lr-rka-filter-actions) .lr-filter-menu-trigger svg{width:15px!important;height:15px!important;fill:none!important;stroke:currentColor!important;stroke-linecap:round!important;stroke-linejoin:round!important;stroke-width:1.8!important}:is(.filter-actions,.lr-rka-filter-actions) .lr-filter-menu .lr-action-menu-popover{right:0!important;z-index:45!important;min-width:190px!important}:is(.filter-actions,.lr-rka-filter-actions) .lr-filter-menu-empty{display:block;padding:10px;color:#71869a;font-size:8px;font-weight:700;white-space:nowrap}

/* Seluruh ikon field menggunakan biru sidebar yang sama. */
:root{--system-field-icon:#0878c1}
.bukti-filter-input .bukti-filter-field-icon,.bukti-date-range-toggle .bukti-filter-field-icon,.filter-date-icon,.accounting-page .lr-rka-filter-control .lr-rka-filter-icon,.accounting-page .lr-rka-filter .lr-lob-picker .lr-rka-filter-icon{color:var(--system-field-icon)!important}
body .content-shell .main-content .filter-panel form .input-with-icon>span{color:var(--system-field-icon)!important}
body .content-shell .main-content .filter-panel input[type=date]::-webkit-calendar-picker-indicator{filter:invert(17%) sepia(34%) saturate(1763%) hue-rotate(176deg) brightness(86%) contrast(96%)}

/* Kontrak global ikon field: gunakan variabel navy ini pada komponen baru. */
body .content-shell .main-content .input-with-icon>span,.filter-date-icon,.bukti-filter-field-icon,.lr-rka-filter-icon{color:var(--system-field-icon)!important}

/* Header tabel tampil sebagai satu bidang gradasi tanpa bingkai sisi dan skat kolom. */
body .content-shell .main-content .table-title-flat>.table-title-flat__table::before,body .content-shell .main-content .table-title-flat>.table-title-flat__table::after,body .content-shell .main-content .table-title-gradient>.table-title-gradient__table::before,body .content-shell .main-content .table-title-gradient>.table-title-gradient__table::after{display:none!important}
body .content-shell .main-content table>thead>tr>th{border-right:0!important;border-left:0!important}

/* Aturan global menu aksi: empat kotak berputar saat hover dan menyatu menjadi lingkaran saat dibuka. */
.lr-filter-menu-trigger svg{overflow:hidden;transition:transform .24s ease,background-color .2s ease,border-radius .2s ease!important}
.lr-filter-menu-trigger svg rect{transition:opacity .16s ease!important}
.lr-filter-menu-trigger:hover svg{transform:rotate(90deg)!important}
.lr-filter-menu[open]>.lr-filter-menu-trigger svg{transform:rotate(180deg)!important;border-radius:50%!important;background:currentColor!important}
.lr-filter-menu[open]>.lr-filter-menu-trigger svg rect{opacity:0!important}

/* Warna hover dan status terbuka menu tindakan mengikuti biru elektrik–biru langit. */
:root{--system-filter-menu-hover:var(--system-electric-sky-gradient)}
.lr-filter-menu-trigger:hover,.lr-filter-menu[open]>.lr-filter-menu-trigger{color:#fff!important;border-color:transparent!important;background:var(--system-filter-menu-hover)!important;box-shadow:0 6px 13px rgba(28,119,184,.19)!important}

/* Standar global tombol aksi pada tabel: lihat, ubah, dan hapus memakai satu tampilan navy. */
:root{--system-table-action-size:20px;--system-table-action-color:#1266ab;--system-table-action-border:#c7e1f2}

/* Nama petugas penyerahan menggunakan biru elektrik secara konsisten. */
body .content-shell .main-content .handover-name-chip{
    color:#0878c1!important;
    background:#e7f5ff!important;
    border-color:#b9e1f7!important;
}

/* Navigasi halaman memakai biru elektrik secara konsisten. */
body .content-shell .main-content .pagination li>:is(a,span){
    color:#0878c1!important;
    border-color:#c5e1f4!important;
    background:#fff!important;
}
body .content-shell .main-content .pagination li.active a{
    color:#fff!important;
    border-color:#0878c1!important;
    background:#0878c1!important;
    box-shadow:0 5px 12px rgba(8,120,193,.22)!important;
}
body .content-shell .main-content .pagination li:not(.active) a:hover{
    color:#075f9d!important;
    border-color:#8ec9eb!important;
    background:#e7f5ff!important;
}
body .content-shell .main-content table :is(.table-actions,.action-buttons,.bukti-bayar-actions,.sdm-jatim-actions){gap:6px!important}
body .content-shell .main-content table :is(.table-actions,.action-buttons,.bukti-bayar-actions,.sdm-jatim-actions) .icon-btn{display:inline-grid!important;width:var(--system-table-action-size)!important;min-width:var(--system-table-action-size)!important;height:var(--system-table-action-size)!important;min-height:var(--system-table-action-size)!important;margin:0!important;padding:0!important;place-items:center!important;color:var(--system-table-action-color)!important;border:1px solid var(--system-table-action-border)!important;border-radius:7px!important;background:#fff!important;box-shadow:0 2px 6px rgba(28,98,151,.06)!important;font-size:15px!important;line-height:1!important}
body .content-shell .main-content table :is(.table-actions,.action-buttons,.bukti-bayar-actions,.sdm-jatim-actions) .icon-btn svg{width:15px!important;height:15px!important;fill:none!important;stroke:currentColor!important}
body .content-shell .main-content table .table-action-icon{display:block!important;width:15px!important;height:15px!important;fill:none!important;stroke:currentColor!important;stroke-linecap:round!important;stroke-linejoin:round!important;stroke-width:1.9!important}
body .content-shell .main-content table :is(.table-actions,.action-buttons,.bukti-bayar-actions,.sdm-jatim-actions) .icon-btn.is-danger,body .content-shell .main-content table :is(.table-actions,.action-buttons,.bukti-bayar-actions,.sdm-jatim-actions) .icon-btn.icon-btn-delete{color:var(--system-table-action-color)!important;border-color:var(--system-table-action-border)!important;background:#fff!important}
body .content-shell .main-content table :is(.table-actions,.action-buttons,.bukti-bayar-actions,.sdm-jatim-actions) .icon-btn:hover{color:#075b99!important;border-color:#8fc7e9!important;background:#eef8fd!important;transform:translateY(-1px)}

/* Judul halaman memakai bobot Manrope tegas secara konsisten. */
body .content-shell .main-content .page-heading h1{font-weight:800!important}

/* Bukti Bayar memakai tinggi filter global yang sama dengan RKA dan halaman lainnya. */
body .content-shell .main-content .agendaris-filter-form.bukti-bayar-filter-form{--bukti-filter-action-height:var(--system-filter-height)!important}
body .content-shell .main-content .bukti-date-range-toggle,body .content-shell .main-content .bukti-bayar-filter-form .bukti-filter-input{height:var(--system-filter-height)!important}
body .content-shell .main-content .bukti-bayar-filter-form .bukti-filter-input input{height:calc(var(--system-filter-height) - 2px)!important;min-height:calc(var(--system-filter-height) - 2px)!important}
body .content-shell .main-content .agendaris-filter-form.bukti-bayar-filter-form .bukti-bayar-filter-actions .btn{height:var(--system-filter-height)!important;min-height:var(--system-filter-height)!important}

/* Laba/Rugi memakai susunan filter global: field penuh dan tiga aksi tetap di kanan. */
.accounting-page .lr-report-filter>.lr-filter-month{display:grid!important;gap:4px!important;min-width:0!important}
.accounting-page .lr-report-filter>.form-group{width:auto!important;min-width:0!important}
@media(min-width:1121px){.accounting-page .lr-report-filter{display:grid!important;grid-template-columns:minmax(0,1.55fr) minmax(180px,.92fr) minmax(145px,.58fr) minmax(135px,.48fr) auto!important;align-items:end!important;gap:8px!important;width:100%!important}.accounting-page .lr-report-filter>.lr-rka-filter-actions{justify-self:end!important;white-space:nowrap}.accounting-page .lr-report-filter>.lr-rka-filter-actions .btn{width:auto!important}}

/* Rincian kehadiran: kolom penanda tetap solid saat tabel digeser mendatar. */
body .content-shell .main-content .sdm-staff-horizontal-table>thead>tr>th:first-child{position:sticky!important;left:0!important;z-index:30!important;width:86px!important;min-width:86px!important;max-width:86px!important;color:#fff!important;border-color:rgba(255,255,255,.2)!important;background:#22396F!important;box-shadow:6px 0 10px rgba(34,57,111,.25)!important}
body .content-shell .main-content .sdm-staff-horizontal-table>tbody>tr>th:first-child{position:sticky!important;left:0!important;z-index:29!important;width:86px!important;min-width:86px!important;max-width:86px!important;color:#345470!important;background:#eaf4f8!important;box-shadow:6px 0 10px rgba(20,67,103,.1)!important}
body .content-shell .main-content .sdm-staff-horizontal-table>thead>tr>th:not(:first-child){color:#fff!important;border-color:rgba(255,255,255,.2)!important;background:#22396F!important}
body .content-shell .main-content .sdm-staff-horizontal-table>thead>tr>th.is-off{background:#22396F!important}





.welcome-modal{position:fixed;z-index:10000;inset:0;display:grid;padding:28px;place-items:center;background:rgba(6,27,58,.55);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.welcome-modal-card{display:grid;width:min(100%,760px);min-height:620px;padding:54px 62px 56px;justify-items:center;align-content:center;color:#103d75;background:#edf8ff var(--welcome-modal-background) center/cover no-repeat;border:1px solid rgba(177,222,251,.94);border-radius:25px;box-shadow:0 28px 74px rgba(0,18,53,.42);text-align:center}
.welcome-modal-logo{width:188px;height:auto;margin-bottom:5px;object-fit:contain}.welcome-modal-kicker{margin:0;color:#0879c7;font-size:10px;font-weight:900;letter-spacing:.19em}.welcome-modal-card h2{margin:20px 0 0;color:#153f76;font-size:36px;line-height:1.14;text-shadow:0 1px 0 rgba(255,255,255,.75)}.welcome-modal-card h2 strong{color:#078edc}.welcome-modal-message{max-width:390px;margin:18px 0 23px;color:#52789d;font-size:14px;line-height:1.55;text-shadow:0 1px 0 rgba(255,255,255,.8)}
.welcome-modal-role{display:flex;align-items:center;gap:10px;width:min(100%,280px);margin-bottom:27px;padding:11px 17px 11px 11px;background:rgba(245,251,255,.82);border:1px solid rgba(157,212,247,.9);border-radius:14px;box-shadow:0 7px 18px rgba(31,110,165,.08);backdrop-filter:blur(6px);text-align:left}.welcome-modal-role>span{display:grid;width:36px;height:36px;place-items:center;flex:0 0 36px;color:#fff;background:linear-gradient(135deg,#0754d1,#36c8f3);border-radius:10px;font-size:11px}.welcome-modal-role small,.welcome-modal-role strong{display:block}.welcome-modal-role small{color:#6e86a4;font-size:8px;font-weight:900;letter-spacing:.09em}.welcome-modal-role strong{margin-top:2px;color:#123d72;font-size:14px}
.welcome-modal-start{display:inline-flex;align-items:center;justify-content:center;gap:13px;min-width:252px;min-height:50px;color:#fff;background:linear-gradient(105deg,#0754d1,#0989e4 52%,#36c8f3);border:0;border-radius:999px;box-shadow:0 12px 24px rgba(6,87,158,.24);font-size:15px;font-weight:800;cursor:pointer}.welcome-modal-start:hover{background:linear-gradient(105deg,#043fa9,#076fca 52%,#1ba9d9)}.welcome-modal-start span{font-size:23px;line-height:1}
@media(max-width:900px){.welcome-modal-card{width:min(100%,600px);min-height:550px}}@media(max-width:560px){.welcome-modal{padding:18px}.welcome-modal-card{min-height:0;padding:29px 24px 32px;border-radius:20px}.welcome-modal-logo{width:164px}.welcome-modal-card h2{font-size:28px}}