:root {
    --pay-bg: #f3f6fb;
    --pay-surface: #ffffff;
    --pay-surface-soft: #f8fafc;
    --pay-sidebar: #101b33;
    --pay-sidebar-soft: #172541;
    --pay-text: #182338;
    --pay-muted: #64748b;
    --pay-border: #dde4ee;
    --pay-primary: #2857c5;
    --pay-primary-dark: #1e429f;
    --pay-primary-soft: #eaf0ff;
    --pay-success: #14804a;
    --pay-danger: #c9364f;
    --pay-warning: #9a6700;
    --pay-shadow: 0 10px 30px rgba(23, 37, 61, .08);
    --pay-radius: 12px;
}
.app-sidebar .brand-mark{display:inline-grid;place-items:center;width:34px;height:34px;margin-right:10px;border-radius:9px;background:#2857c5;color:#fff;font-size:12px;font-weight:800}.app-sidebar .brand-link{text-decoration:none}.app-content-header{padding:1.5rem .5rem .75rem}.app-content{padding:.5rem .5rem 2rem}.app-main{background:#f3f6fb}.app-footer{font-size:.82rem}.sidebar-menu>.nav-item{margin-bottom:2px}.sidebar-menu .nav-treeview{padding-left:.45rem}.sidebar-menu .nav-treeview .nav-link{font-size:.9rem}.sidebar-menu .nav-link.disabled{opacity:.48;cursor:not-allowed}.sidebar-menu .nav-badge{font-size:.58rem;font-weight:600}.page-loading .app-main{opacity:.55;pointer-events:none;transition:opacity .15s}.page-content>.toolbar:first-child{margin-top:0}.page-content .table-wrap{box-shadow:var(--pay-shadow)}

html { background: var(--pay-bg); }
body {
    color: var(--pay-text) !important;
    background: var(--pay-bg) !important;
    font-family: Inter, "Segoe UI", Arial, sans-serif !important;
    -webkit-font-smoothing: antialiased;
}

body::before {
    content: "";
    position: fixed;
    inset: 0 0 auto 0;
    height: 260px;
    z-index: -1;
    background: linear-gradient(125deg, #0f1c36 0%, #17366f 55%, #2857c5 100%);
}

.header {
    min-height: 66px;
    padding: 0 28px !important;
    color: #fff !important;
    background: rgba(15, 28, 54, .96) !important;
    border-bottom: 1px solid rgba(255,255,255,.1) !important;
    box-shadow: 0 4px 20px rgba(8, 18, 38, .16);
    align-items: center;
}
.header strong, .header h1 {
    color: #fff !important;
    font-size: 17px !important;
    font-weight: 650 !important;
    letter-spacing: .01em;
    background: none !important;
    -webkit-text-fill-color: currentColor !important;
}
.header a { color: #c9d8ff !important; font-weight: 500; }
.header a:hover { color: #fff !important; }

.main { padding-top: 30px !important; }
.main > h2, .intro h2, .toolbar h2 { letter-spacing: -.025em; }
.main > p, .intro p, .toolbar small { color: #d5def1 !important; }

.card, table, .modal, .login-card {
    background: var(--pay-surface) !important;
    color: var(--pay-text) !important;
    border: 1px solid var(--pay-border) !important;
    box-shadow: var(--pay-shadow) !important;
}
.card { border-radius: var(--pay-radius) !important; }
.card-head, th {
    color: #4d5d75 !important;
    background: var(--pay-surface-soft) !important;
    border-color: var(--pay-border) !important;
}
th { font-size: 11px !important; font-weight: 700; letter-spacing: .055em; }
td { color: #27364d; border-color: #e8edf4 !important; }
tbody tr:hover td { background: #f8faff !important; }
.value { color: var(--pay-primary) !important; }

.module {
    position: relative;
    background: var(--pay-surface) !important;
    color: var(--pay-text) !important;
    border: 1px solid var(--pay-border) !important;
    box-shadow: 0 6px 20px rgba(23,37,61,.06);
    transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}
.module:hover { transform: translateY(-3px); border-color: #9db4ed !important; box-shadow: var(--pay-shadow); }
.module .icon { display:grid; place-items:center; width:52px; height:52px; margin:0 auto; border-radius:14px; color:var(--pay-primary); background:var(--pay-primary-soft); }

.btn { font-weight: 600 !important; transition: all .16s ease; }
.btn:hover { transform: translateY(-1px); filter: brightness(.98); }
.primary, .btn-primary { background: var(--pay-primary) !important; color:#fff !important; box-shadow:0 5px 12px rgba(40,87,197,.2); }
.primary:hover, .btn-primary:hover { background:var(--pay-primary-dark) !important; }
.secondary, .btn-cancel { background:#eef2f7 !important; color:#334155 !important; }
.danger, .btn-delete { background:#fff0f2 !important; color:var(--pay-danger) !important; }
.btn-edit { background:var(--pay-primary-soft) !important; color:var(--pay-primary) !important; }

.modal-bg, .modal-overlay { backdrop-filter: blur(5px); background:rgba(10,20,40,.58) !important; }
.modal { border-radius:16px !important; }
.field label, .form-group label { color:#596980 !important; font-weight:600; }
.field input, .field select, .form-control {
    color:var(--pay-text) !important;
    background:#fff !important;
    border:1px solid #cfd8e6 !important;
}
.field input:focus, .field select:focus, .form-control:focus { border-color:var(--pay-primary) !important; box-shadow:0 0 0 3px rgba(40,87,197,.12) !important; outline:0; }
.status.active, .badge.active, .badge-active { color:var(--pay-success) !important; background:#e8f7ef !important; }
.status.inactive, .badge.inactive, .badge-inactive, .badge.separated { color:var(--pay-danger) !important; background:#fff0f2 !important; }

body.login-page { display:grid !important; place-items:center; min-height:100vh; }
body.login-page::before { height:100%; background:radial-gradient(circle at 78% 18%, rgba(68,111,211,.5), transparent 33%),linear-gradient(135deg,#0b1730,#14294e 58%,#1c4389); }
.login-page .login-card { border-color:rgba(255,255,255,.18) !important; box-shadow:0 28px 80px rgba(5,14,31,.3) !important; }
.login-page .login-logo h1 { color:var(--pay-text) !important; -webkit-text-fill-color:currentColor !important; background:none !important; letter-spacing:-.035em; }
.login-page .login-logo p, .login-page .login-footer { color:var(--pay-muted) !important; }
.login-page .btn-login { background:var(--pay-primary) !important; box-shadow:0 8px 20px rgba(40,87,197,.25); }

.setup-page { min-height:100vh; display:grid; place-items:center; }
.setup-page .card { width:min(440px,92%); padding:32px !important; }
.setup-page input { border:1px solid #cfd8e6; border-radius:7px; color:var(--pay-text); }
.setup-page button { border-radius:7px; background:var(--pay-primary); }

/* Enterprise modal/form standard — use for all current and future modules. */
.enterprise-modal-overlay{display:none;position:fixed;inset:0;z-index:1060;align-items:center;justify-content:center;padding:24px;background:rgba(8,18,38,.62)!important;backdrop-filter:blur(6px)}
.enterprise-modal-overlay.open{display:flex}.enterprise-modal{display:flex;flex-direction:column;width:min(980px,100%);max-height:calc(100vh - 48px);overflow:hidden;border:1px solid rgba(255,255,255,.55);border-radius:18px;background:#fff;color:var(--pay-text);box-shadow:0 30px 90px rgba(5,14,31,.32)}
.enterprise-modal--compact{width:min(620px,100%)}.enterprise-modal__header{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:21px 26px;border-bottom:1px solid #e4e9f1;background:linear-gradient(135deg,#f9fbff,#eef3ff)}
.enterprise-modal__title{display:flex;align-items:center;gap:13px}.enterprise-modal__icon{display:grid;place-items:center;flex:0 0 auto;width:42px;height:42px;border-radius:11px;background:var(--pay-primary);color:#fff;font-size:19px;box-shadow:0 7px 16px rgba(40,87,197,.22)}
.enterprise-modal__header h3{margin:0;color:var(--pay-text);font-size:19px;font-weight:700;letter-spacing:-.02em}.enterprise-modal__header p{margin:3px 0 0;color:#6b7a90;font-size:12px}.enterprise-modal__close{display:grid;place-items:center;flex:0 0 auto;width:36px;height:36px;padding:0;border:0;border-radius:9px;background:#fff;color:#64748b;font-size:19px;box-shadow:0 2px 8px rgba(15,23,42,.08)}
.enterprise-modal__body{overflow-y:auto;padding:24px 26px 8px}.enterprise-modal__footer{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:17px 26px;border-top:1px solid #e4e9f1;background:#f8fafc}.enterprise-modal__actions{display:flex;gap:10px}.enterprise-modal__actions .btn{min-width:112px}.enterprise-form-note{color:#718096;font-size:12px}.enterprise-required{color:var(--pay-danger)}
.enterprise-form-alert{display:none;margin-bottom:18px;padding:11px 14px;border:1px solid #f3c3ca;border-radius:9px;background:#fff3f5;color:#a5263a;font-size:13px}.enterprise-form-alert.show{display:block}.enterprise-form-section{margin-bottom:24px}.enterprise-form-heading{display:flex;align-items:center;gap:9px;margin-bottom:14px;padding-bottom:9px;border-bottom:1px solid #edf0f5;color:#334155;font-size:12px;font-weight:750;letter-spacing:.055em;text-transform:uppercase}.enterprise-form-heading i{color:var(--pay-primary);font-size:15px}
.enterprise-form-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:15px 16px}.enterprise-field{grid-column:span 4}.enterprise-field--half{grid-column:span 6}.enterprise-field--quarter{grid-column:span 3}.enterprise-field--full{grid-column:1/-1}.enterprise-field label{display:block;margin-bottom:6px;color:#526177;font-size:12px;font-weight:650}.enterprise-field input,.enterprise-field select,.enterprise-field textarea{width:100%;min-height:42px;padding:9px 11px;border:1px solid #cfd8e6;border-radius:8px;background:#fff;color:var(--pay-text);font-size:14px}.enterprise-field textarea{min-height:92px;resize:vertical}.enterprise-field input:focus,.enterprise-field select:focus,.enterprise-field textarea:focus{border-color:var(--pay-primary);outline:0;box-shadow:0 0 0 3px rgba(40,87,197,.12)}.enterprise-field__hint{display:block;margin-top:5px;color:#8390a3;font-size:11px}.enterprise-modal .btn[disabled]{opacity:.65;pointer-events:none}

/* Persistent SPA module styling. Page-level head styles are not reloaded by partial navigation. */
.page-content .toolbar{display:flex;align-items:center;justify-content:flex-end;margin-bottom:20px}.page-content .table-wrap{width:100%;overflow:auto;border-radius:12px;background:var(--pay-surface)}.page-content table{width:100%;border-collapse:collapse}.page-content th,.page-content td{padding:12px 14px;text-align:left;white-space:nowrap}
.required{color:var(--pay-danger)}.form-alert{display:none;margin-bottom:18px;padding:11px 14px;border:1px solid #f3c3ca;border-radius:9px;background:#fff3f5;color:#a5263a;font-size:13px}.form-alert.show{display:block}.form-section{margin-bottom:24px}.section-heading{display:flex;align-items:center;gap:9px;margin-bottom:14px;padding-bottom:9px;border-bottom:1px solid #edf0f5;color:#334155;font-size:12px;font-weight:750;letter-spacing:.055em;text-transform:uppercase}.section-heading i{color:var(--pay-primary);font-size:15px}
.employee-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:15px 16px}.employee-grid>.field{grid-column:span 4;margin:0}.employee-grid>.field.half{grid-column:span 6}.employee-grid>.field.quarter{grid-column:span 3}.employee-grid>.field.full{grid-column:1/-1}.employee-grid>.field label{display:block;margin-bottom:6px;color:#526177;font-size:12px;font-weight:650}.employee-grid>.field input,.employee-grid>.field select,.employee-grid>.field textarea{width:100%;min-height:42px;padding:9px 11px;border:1px solid #cfd8e6;border-radius:8px;background:#fff;color:var(--pay-text);font-size:14px}.employee-grid>.field textarea{min-height:92px;resize:vertical}.field-hint{display:block;margin-top:5px;color:#8390a3;font-size:11px}
.organization-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}.organization-grid>.card{min-width:0;border:1px solid #dde4ee!important;border-radius:14px!important;overflow:hidden;box-shadow:0 10px 30px rgba(23,37,61,.08)!important}.organization-grid .card-head{display:flex;align-items:center;justify-content:space-between;padding:18px 20px!important}.organization-grid .card-head strong{display:flex;align-items:center;gap:9px;color:#25334a;font-size:15px}.organization-grid .card-head strong i{color:var(--pay-primary)}.organization-grid th:last-child,.organization-grid td:last-child{text-align:right}
.enterprise-field .enterprise-check{display:flex;align-items:flex-start;gap:11px;margin:2px 0 0;padding:12px 14px;border:1px solid #dbe3ef;border-radius:9px;background:#f8faff;color:#334155;cursor:pointer}.enterprise-field .enterprise-check input[type="checkbox"]{flex:0 0 auto;width:17px!important;height:17px!important;min-height:0;margin:2px 0 0;padding:0;accent-color:var(--pay-primary);box-shadow:none!important}.enterprise-check span{display:flex;min-width:0;flex-direction:column;gap:2px}.enterprise-check strong{font-size:13px;font-weight:650}.enterprise-check small{color:#718096;font-size:11px;line-height:1.4}
.enterprise-field input[type="checkbox"]{display:inline-block;width:17px!important;height:17px!important;min-height:0!important;padding:0!important;vertical-align:middle;accent-color:var(--pay-primary)}.enterprise-field .form-check{display:flex!important;align-items:center;gap:10px;max-width:100%;margin:0;padding:12px 14px!important;border:1px solid #dbe3ef;border-radius:9px;background:#f8faff;white-space:normal}.enterprise-field .form-check-input{position:static;flex:0 0 17px;margin:0!important}

@media (max-width: 700px) {
    .header { padding:14px 18px !important; }
    .main { padding:22px 15px !important; }
    .toolbar { align-items:flex-start !important; gap:14px; flex-direction:column; }
    .toolbar .btn { width:100%; }
    .enterprise-modal-overlay{padding:10px}.enterprise-modal{max-height:calc(100vh - 20px);border-radius:13px}.enterprise-modal__header,.enterprise-modal__body,.enterprise-modal__footer{padding-left:17px;padding-right:17px}.enterprise-field,.enterprise-field--half,.enterprise-field--quarter{grid-column:1/-1}.enterprise-modal__footer{align-items:stretch;flex-direction:column}.enterprise-modal__actions{display:grid;grid-template-columns:1fr 1fr}.enterprise-form-note{text-align:center}
    .employee-grid>.field,.employee-grid>.field.half,.employee-grid>.field.quarter{grid-column:1/-1}.organization-grid{grid-template-columns:1fr}
}
