:root { --sirs-teal: #5f9ea0; --sirs-teal-dark: #4b8587; --sirs-nav: rgb(225, 230, 234); }
.demo-banner { background: #fff3cd; color: #664d03; font-size: 12px; text-align: center; padding: 3px 8px; border-bottom: 1px solid #ffe69c; }
.sirs-body { padding-top: 56px; padding-bottom: 48px; background: #fff; }
.sirs-navbar { background-color: var(--sirs-nav); }
.sirs-navbar .dropdown-menu { max-height: 75vh; overflow-y: auto; }
.sirs-navbar .dropdown-menu.show { display: block; }
.sirs-main { padding: 20px 24px; }
.sirs-footer { position: fixed; bottom: 0; left: 0; right: 0; background: var(--sirs-nav); font-size: 12px; color: #6c757d; padding: 8px 0; z-index: 1020; }
.btn-sirs { background: var(--sirs-teal); border-color: var(--sirs-teal); color: #fff; }
.btn-sirs:hover, .btn-sirs:focus { background: var(--sirs-teal-dark); border-color: var(--sirs-teal-dark); color: #fff; }
.sirs-card { border: 1px solid #dee2e6; border-radius: 4px; padding: 16px 20px; height: 100%; }
.sirs-card h5 { font-weight: 600; margin-bottom: 12px; }
.table-sirs { font-size: 13px; }
.table-sirs th { text-align: center; vertical-align: middle; background: #f8f9fa; white-space: normal; min-width: 70px; }
.table-sirs td { vertical-align: middle; }
.table-sirs td.num { text-align: center; }
.table-sirs .baris-grup td, .table-sirs .baris-total td { font-weight: 600; background: #f3f5f7; }
.table-sirs input.form-control { width: 76px; text-align: center; padding: 3px 4px; font-size: 13px; margin: 0 auto; }
.table-sirs input.form-control:disabled { background: #e9ecef; }
.table-sirs .col-label { min-width: 220px; text-align: left; }
.table-wrap { overflow-x: auto; border: 1px solid #dee2e6; border-radius: 4px; }
.sirs-modal-backdrop { position: fixed; inset: 0; background: rgba(0,0,0,.5); z-index: 1040; }
.modal { z-index: 1045; }
.modal.show { display: block; }
.modal-header { border-bottom: 1px solid #dee2e6; }
.modal-footer { border-top: 1px solid #dee2e6; }
.icd-hasil { position: absolute; z-index: 1050; background: #fff; border: 1px solid #ced4da; max-height: 260px; overflow-y: auto; width: 100%; }
.icd-hasil button { display: block; width: 100%; text-align: left; border: 0; background: none; padding: 6px 10px; font-size: 13px; }
.icd-hasil button:hover { background: #f3f4f6; }
.absen-ok { color: #198754; font-weight: 700; } .absen-no { color: #dc3545; }
.table-absensi thead th { background: var(--sirs-teal); color: #fff; }
.tab-data { display: inline-block; border: 1px solid #dee2e6; border-bottom: 0; border-radius: 4px 4px 0 0; padding: 6px 18px; background: #fff; font-size: 14px; font-weight: 500; }
.tab-data + .table-wrap { border-top-left-radius: 0; }
.login-body { background: #fff; }
.login-wrap { max-width: 900px; min-height: calc(100vh - 28px); display: flex; align-items: center; padding-top: 40px; padding-bottom: 40px; }
.login-logo { display: block; margin-bottom: 32px; }
.login-ilustrasi { max-width: 320px; }
.login-form { padding-left: 24px; }
.login-form .form-control { height: 58px; font-size: 15px; }
.login-form .form-floating > label, .login-form input::placeholder { font-size: 13px; color: #9ca3af; opacity: 1; }
@media (max-width: 767.98px) { .login-form { padding-left: 0; margin-top: 32px; } }