/* ============================================================
   Society Maintenance ERP – application styles
   ============================================================ */
:root {
    --erp-primary: #1f5f8b;
    --erp-primary-dark: #17496b;
    --erp-accent: #2a9d8f;
    --erp-sidebar-bg: #17324a;
    --erp-sidebar-hover: #1f4460;
    --erp-sidebar-active: #2a9d8f;
    --erp-sidebar-width: 260px;
    --erp-header-h: 60px;
    --erp-body-bg: #f4f6f9;
}
html, body { height: 100%; }
body { background: var(--erp-body-bg); font-family: "Segoe UI", system-ui, -apple-system, Roboto, "Helvetica Neue", Arial, sans-serif; font-size: 0.925rem; color: #2d3748; }
a { color: var(--erp-primary); text-decoration: none; }
a:hover { color: var(--erp-primary-dark); }

.btn-primary { background: var(--erp-primary); border-color: var(--erp-primary); }
.btn-primary:hover, .btn-primary:focus { background: var(--erp-primary-dark); border-color: var(--erp-primary-dark); }
.btn-outline-primary { color: var(--erp-primary); border-color: var(--erp-primary); }
.btn-outline-primary:hover { background: var(--erp-primary); border-color: var(--erp-primary); }
.bg-primary { background-color: var(--erp-primary) !important; }
.text-primary { color: var(--erp-primary) !important; }
.form-control:focus, .form-select:focus { border-color: var(--erp-primary); box-shadow: 0 0 0 .2rem rgba(31,95,139,.15); }

/* Layout */
.erp-wrapper { display: flex; min-height: 100vh; }
.erp-sidebar { width: var(--erp-sidebar-width); background: var(--erp-sidebar-bg); color: #fff; position: fixed; top: 0; bottom: 0; left: 0; z-index: 1040; display: flex; flex-direction: column; transition: transform .25s ease; overflow: hidden; }
.erp-main { flex: 1; margin-left: var(--erp-sidebar-width); min-width: 0; display: flex; flex-direction: column; min-height: 100vh; transition: margin .25s ease; }
.erp-content { flex: 1; padding: 1.25rem 1.5rem; }
.erp-header { height: var(--erp-header-h); padding: 0 1rem; z-index: 1030; }
.erp-footer { padding: .75rem 1.5rem; border-top: 1px solid #e9ecef; background: #fff; }
body.sidebar-collapsed .erp-sidebar { transform: translateX(-100%); }
body.sidebar-collapsed .erp-main { margin-left: 0; }
.sidebar-backdrop { display: none; position: fixed; inset: 0; background: rgba(0,0,0,.45); z-index: 1035; }

.sidebar-brand { height: var(--erp-header-h); display: flex; align-items: center; justify-content: space-between; padding: 0 1rem; background: rgba(0,0,0,.15); flex-shrink: 0; }
.sidebar-brand a { color: #fff; }
.brand-icon { width: 36px; height: 36px; border-radius: 8px; background: var(--erp-accent); display: inline-flex; align-items: center; justify-content: center; margin-right: .6rem; font-size: 1.1rem; }
.brand-logo { height: 36px; width: 36px; object-fit: contain; border-radius: 8px; background: #fff; margin-right: .6rem; padding: 2px; }
.brand-text { font-weight: 600; font-size: .95rem; line-height: 1.1; }
.sidebar-nav { flex: 1; overflow-y: auto; padding: .75rem 0; }
.sidebar-nav::-webkit-scrollbar { width: 6px; } .sidebar-nav::-webkit-scrollbar-thumb { background: rgba(255,255,255,.15); border-radius: 3px; }
.sidebar-nav .nav-link { color: rgba(255,255,255,.85); padding: .6rem 1.1rem; display: flex; align-items: center; border-left: 3px solid transparent; font-size: .9rem; }
.sidebar-nav .nav-link:hover { background: var(--erp-sidebar-hover); color: #fff; }
.sidebar-nav .nav-link.active { background: var(--erp-sidebar-hover); border-left-color: var(--erp-sidebar-active); color: #fff; font-weight: 600; }
.sidebar-nav .nav-icon { width: 22px; margin-right: .6rem; text-align: center; opacity: .9; }
.sidebar-nav .nav-arrow { margin-left: auto; font-size: .7rem; transition: transform .2s; }
.sidebar-nav .nav-link.collapsed .nav-arrow { transform: rotate(-90deg); }
.sidebar-nav .sub-nav { background: rgba(0,0,0,.18); }
.sidebar-nav .sub-nav .nav-link { padding: .45rem 1rem .45rem 3.1rem; font-size: .86rem; }
.sidebar-footer { padding: .75rem 1.1rem; background: rgba(0,0,0,.2); flex-shrink: 0; }

.avatar-circle { width: 32px; height: 32px; border-radius: 50%; background: var(--erp-primary); color: #fff; display: inline-flex; align-items: center; justify-content: center; font-weight: 600; }

/* Page header */
.page-title { font-weight: 600; color: #1a202c; }
.breadcrumb-item + .breadcrumb-item::before { content: "›"; }

/* Cards */
.card { border: 0; box-shadow: 0 1px 3px rgba(0,0,0,.06), 0 1px 2px rgba(0,0,0,.04); border-radius: .6rem; }
.card-header { background: #fff; border-bottom: 1px solid #edf2f7; font-weight: 600; padding: .85rem 1.25rem; }
.stat-card { border-radius: .6rem; color: #fff; position: relative; overflow: hidden; min-height: 108px; }
.stat-card .stat-icon { position: absolute; right: 14px; top: 14px; font-size: 2.4rem; opacity: .22; }
.stat-card .stat-value { font-size: 1.55rem; font-weight: 700; line-height: 1.2; }
.stat-card .stat-label { font-size: .8rem; opacity: .9; text-transform: uppercase; letter-spacing: .03em; }
.stat-card .stat-sub { font-size: .78rem; opacity: .85; }
.stat-card a { color: #fff; }
.bg-grad-blue { background: linear-gradient(135deg, #1f5f8b, #2b7cb3); }
.bg-grad-green { background: linear-gradient(135deg, #2a9d8f, #3cbfae); }
.bg-grad-orange { background: linear-gradient(135deg, #e76f51, #f4a261); }
.bg-grad-red { background: linear-gradient(135deg, #c0392b, #e74c3c); }
.bg-grad-purple { background: linear-gradient(135deg, #5e60ce, #7b7fe0); }
.bg-grad-teal { background: linear-gradient(135deg, #0f766e, #14b8a6); }
.bg-grad-gray { background: linear-gradient(135deg, #4a5568, #718096); }
.bg-grad-gold { background: linear-gradient(135deg, #b7791f, #d69e2e); }
.mini-stat { background: #fff; border-radius: .6rem; padding: .9rem 1rem; box-shadow: 0 1px 3px rgba(0,0,0,.06); }
.mini-stat .value { font-size: 1.25rem; font-weight: 700; }
.mini-stat .label { font-size: .78rem; color: #718096; text-transform: uppercase; }

/* Tables */
.table { font-size: .9rem; }
.table thead th { background: #f7fafc; font-weight: 600; color: #4a5568; border-bottom: 2px solid #e2e8f0; white-space: nowrap; }
.table td { vertical-align: middle; }
.table-sm td, .table-sm th { padding: .4rem .5rem; }
.text-end.num, td.num, th.num { text-align: right !important; font-variant-numeric: tabular-nums; white-space: nowrap; }
.table tfoot th { background: #edf2f7; }
div.dataTables_wrapper div.dataTables_filter input { margin-left: .5rem; }
.badge { font-weight: 500; padding: .38em .6em; }
.actions-col { white-space: nowrap; width: 1%; }
.actions-col .btn { padding: .2rem .45rem; font-size: .8rem; }

/* Filters */
.filter-bar { background: #fff; border-radius: .6rem; padding: .85rem 1rem; margin-bottom: 1rem; box-shadow: 0 1px 3px rgba(0,0,0,.05); }
.filter-bar .form-label { font-size: .78rem; margin-bottom: .2rem; color: #718096; }

/* Forms */
.form-label { font-weight: 500; font-size: .86rem; color: #4a5568; }
.required::after { content: " *"; color: #e53e3e; }
.form-section-title { font-size: .85rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--erp-primary); border-bottom: 1px solid #e2e8f0; padding-bottom: .35rem; margin: 1rem 0 .85rem; }
.select2-container--bootstrap-5 .select2-selection { min-height: calc(1.5em + .75rem + 2px); }

/* Attendance grid */
.att-btn-group .btn { padding: .2rem .45rem; font-size: .78rem; }
.att-btn-group .btn-check:checked + .btn-outline-success { background: #198754; color: #fff; }

/* Misc */
.cursor-pointer { cursor: pointer; }
.fw-600 { font-weight: 600; }
.text-xs { font-size: .75rem; }
.w-1 { width: 1%; }
.ledger-balance-due { color: #c53030; font-weight: 600; }
.ledger-balance-adv { color: #2f855a; font-weight: 600; }
.empty-state { text-align: center; padding: 3rem 1rem; color: #a0aec0; }
.empty-state i { font-size: 2.5rem; margin-bottom: .75rem; display: block; }
.notice-card { border-left: 4px solid var(--erp-primary); }
.notice-card.urgent { border-left-color: #e53e3e; }
.timeline { list-style: none; padding-left: 0; }
.timeline li { padding: .5rem 0 .5rem 1.5rem; border-left: 2px solid #e2e8f0; position: relative; }
.timeline li::before { content: ""; width: 10px; height: 10px; border-radius: 50%; background: var(--erp-primary); position: absolute; left: -6px; top: .9rem; }

/* Auth */
.auth-body { background: linear-gradient(135deg, #17324a 0%, #1f5f8b 60%, #2a9d8f 100%); min-height: 100vh; display: flex; align-items: center; justify-content: center; padding: 1rem; }
.auth-wrapper { width: 100%; max-width: 420px; }
.auth-card { border-radius: 1rem; }
.brand-icon-lg { width: 64px; height: 64px; border-radius: 16px; background: var(--erp-primary); color: #fff; display: inline-flex; align-items: center; justify-content: center; font-size: 1.8rem; }

/* Responsive */
@media (max-width: 991.98px) {
    .erp-sidebar { transform: translateX(-100%); }
    .erp-main { margin-left: 0; }
    body.sidebar-open .erp-sidebar { transform: translateX(0); }
    body.sidebar-open .sidebar-backdrop { display: block; }
    .erp-content { padding: 1rem; }
}
@media (max-width: 575.98px) {
    .erp-content { padding: .75rem; }
    .stat-card .stat-value { font-size: 1.25rem; }
    .page-actions .btn { font-size: .8rem; }
}
@media print {
    .erp-sidebar, .erp-header, .erp-footer, .page-actions, .filter-bar, .no-print, .dataTables_filter, .dataTables_length, .dataTables_paginate, .dataTables_info { display: none !important; }
    .erp-main { margin-left: 0; }
    .erp-content { padding: 0; }
    .card { box-shadow: none; border: 1px solid #ddd; }
}
