/* ============================================================
   DADIS — assets/css/style.css
   Theme: navy #16324f / white / green #1b7a4d
   Compact professional type (Akram design standard):
   body ~0.85rem, stat numbers ~1.05rem, labels ~0.72rem,
   badges 0.68rem. Mobile: off-canvas sidebar <=991px,
   inputs 16px on <=640px (iOS auto-zoom fix).
   ============================================================ */

:root {
    --dadis-navy: #16324f;
    --dadis-navy-dark: #0f2438;
    --dadis-navy-light: #1e4266;
    --dadis-green: #1b7a4d;
    --dadis-green-light: #e6f4ec;
    --dadis-bg: #f2f5f7;
    --dadis-border: #dee5e1;
    --dadis-text: #1f2937;
    --dadis-muted: #6b7280;
}

* { box-sizing: border-box; }

html, body { height: 100%; }

body {
    font-family: 'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;
    font-size: .85rem;
    color: var(--dadis-text);
    background: var(--dadis-bg);
    margin: 0;
}

body.rtl, html[dir="rtl"] body {
    font-family: 'Noto Nastaliq Urdu', 'Inter', sans-serif;
    line-height: 1.9;
}
html[dir="rtl"] .btn, html[dir="rtl"] .form-control, html[dir="rtl"] .form-select {
    font-family: 'Noto Nastaliq Urdu', 'Inter', sans-serif;
}

a { color: var(--dadis-navy); text-decoration: none; }
a:hover { color: var(--dadis-green); }

/* ---------- Topbar ---------- */
.topbar {
    position: sticky;
    top: 0;
    z-index: 1030;
    display: flex;
    align-items: center;
    gap: .5rem;
    height: 52px;
    padding: 0 .9rem;
    background: var(--dadis-navy);
    color: #fff;
    box-shadow: 0 1px 4px rgba(0, 0, 0, .25);
}
.topbar-brand { display: flex; align-items: center; gap: .5rem; color: #fff; font-weight: 700; font-size: 1.05rem; }
.topbar-brand:hover { color: #fff; }
.brand-mark { display: inline-flex; align-items: center; justify-content: center; width: 30px; height: 30px; border-radius: 6px; background: var(--dadis-green); color: #fff; font-size: .9rem; }
.brand-text { letter-spacing: .03em; }
.brand-sub { font-size: .72rem; font-weight: 400; opacity: .75; }
.topbar-spacer { flex: 1; }
.topbar-icon-btn { color: #fff; position: relative; border: none; background: transparent; font-size: 1rem; }
.topbar-icon-btn:hover, .topbar-icon-btn:focus { color: #cfe3d8; background: rgba(255, 255, 255, .08); }
.notif-badge { position: absolute; top: -2px; inset-inline-end: -4px; font-size: .6rem; padding: .15em .4em; }
.notif-menu { width: 320px; max-width: 90vw; }
.notif-item { white-space: normal; padding: .5rem .8rem; border-bottom: 1px solid #f0f0f0; }
.notif-item.unread { background: #f2f8f4; }
.tiny { font-size: .68rem; }

/* Language switcher */
.lang-switcher { display: flex; gap: .15rem; align-items: center; }
.lang-link { color: rgba(255, 255, 255, .75); font-size: .75rem; padding: .2rem .45rem; border-radius: 4px; }
.lang-link:hover { color: #fff; background: rgba(255, 255, 255, .12); }
.lang-link.active { color: #fff; background: var(--dadis-green); font-weight: 600; }

/* Avatar (initials circle, links to profile) */
.avatar-circle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    background: var(--dadis-green);
    color: #fff;
    font-weight: 700;
    font-size: .8rem;
    border: 2px solid rgba(255, 255, 255, .6);
    flex-shrink: 0;
}
a.avatar-circle:hover { color: #fff; background: #14663f; }

/* ---------- App shell / sidebar ---------- */
.app-shell { display: flex; align-items: stretch; min-height: calc(100vh - 52px); }
.sidebar {
    width: 232px;
    flex-shrink: 0;
    background: #fff;
    border-inline-end: 1px solid var(--dadis-border);
    display: flex;
    flex-direction: column;
    position: sticky;
    top: 52px;
    height: calc(100vh - 52px);
}
.sidebar-nav { flex: 1; overflow-y: auto; padding: .6rem .55rem; }
.nav-section {
    font-size: .68rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .05em;
    color: var(--dadis-muted);
    padding: .7rem .55rem .25rem;
}
.nav-link-item {
    display: flex;
    align-items: center;
    gap: .55rem;
    padding: .42rem .55rem;
    border-radius: 6px;
    color: var(--dadis-text);
    font-size: .83rem;
    margin-bottom: 1px;
}
.nav-link-item:hover { background: #eef4f1; color: var(--dadis-navy); }
.nav-link-item.active { background: var(--dadis-navy); color: #fff; font-weight: 600; }
.nav-link-item.active:hover { background: var(--dadis-navy-light); color: #fff; }
.nav-link-item.text-danger { color: #b91c1c; }
.nav-ico { width: 18px; text-align: center; font-size: .85rem; opacity: .85; }
.sidebar-foot { font-size: .68rem; color: var(--dadis-muted); text-align: center; padding: .6rem .4rem; border-top: 1px solid var(--dadis-border); }
.sidebar-backdrop { display: none; }

.content { flex: 1; min-width: 0; padding: .9rem 1.1rem 1.5rem; }
.page-head { display: flex; align-items: baseline; gap: .7rem; flex-wrap: wrap; margin: .1rem 0 .8rem; }
.page-title { font-size: 1.15rem; font-weight: 700; margin: 0; color: var(--dadis-navy); }
.page-subtitle { font-size: .78rem; color: var(--dadis-muted); margin: 0; }

/* ---------- Cards / stats ---------- */
.card { border: 1px solid var(--dadis-border); border-radius: 8px; }
.card-header { font-size: .85rem; font-weight: 600; padding: .45rem .8rem; background: #eef4f1; border-bottom: 1px solid var(--dadis-border); }
.stat-card { border-radius: 8px; border: 1px solid var(--dadis-border); background: #fff; }
.stat-card .stat-num { font-size: 1.05rem; font-weight: 700; line-height: 1.2; color: var(--dadis-navy); }
.stat-card .stat-label { font-size: .72rem; color: var(--dadis-muted); text-transform: uppercase; letter-spacing: .03em; }
.stat-card .stat-icon { font-size: 1.25rem; opacity: .75; }

/* ---------- Tables / forms / badges ---------- */
.table { font-size: .78rem; margin-bottom: 0; }
.table th { font-size: .72rem; text-transform: uppercase; letter-spacing: .02em; background: #eef4f1; }
.table td, .table th { padding: .35rem .5rem; vertical-align: middle; }
.table-actions { white-space: nowrap; width: 1%; text-align: center; }
.table-actions .btn { padding: .1rem .35rem; font-size: .75rem; }
.form-label { font-size: .75rem; font-weight: 600; margin-bottom: .2rem; }
.form-control, .form-select { font-size: .82rem; padding: .3rem .5rem; }
.form-control:focus, .form-select:focus { border-color: var(--dadis-green); box-shadow: 0 0 0 .15rem rgba(27, 122, 77, .18); }
.badge { font-size: .68rem; }
.btn-sm { font-size: .75rem; }
.btn-primary { background: var(--dadis-navy); border-color: var(--dadis-navy); }
.btn-primary:hover { background: var(--dadis-navy-light); border-color: var(--dadis-navy-light); }
.btn-success { background: var(--dadis-green); border-color: var(--dadis-green); }
.btn-success:hover { background: #14663f; border-color: #14663f; }

/* Compat with module pages built against style-v1.css */
.bg-dadis { background: var(--dadis-green) !important; }
.navbar.bg-dadis { background: var(--dadis-green) !important; }
.sidebar-menu .list-group-item { font-size: .82rem; padding: .45rem .7rem; border: none; }
.sidebar-menu .list-group-item.active { background: var(--dadis-green); color: #fff; }
.main-col { min-width: 0; }

/* ---------- Footer ---------- */
.dadis-footer {
    display: flex;
    justify-content: space-between;
    gap: .5rem;
    flex-wrap: wrap;
    font-size: .72rem;
    color: var(--dadis-muted);
    padding: .7rem 1.1rem;
    border-top: 1px solid var(--dadis-border);
    background: #fff;
}
.footer-powered { font-weight: 600; color: var(--dadis-navy); }

/* ---------- Public pages (login / install) ---------- */
.public-main {
    min-height: calc(100vh - 52px);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 1.5rem .8rem;
}
.auth-card { width: 100%; max-width: 400px; border-radius: 10px; }
.auth-card .card-header { background: var(--dadis-navy); color: #fff; font-size: .95rem; text-align: center; border-radius: 10px 10px 0 0; padding: .8rem; }
.auth-logo { font-size: 1.6rem; color: var(--dadis-green); }

/* ---------- Responsive ---------- */
@media (max-width: 991px) {
    .sidebar {
        position: fixed;
        top: 52px;
        inset-inline-start: 0;
        z-index: 1040;
        transform: translateX(-105%);
        transition: transform .25s ease;
        box-shadow: 0 0 24px rgba(0, 0, 0, .25);
        height: calc(100dvh - 52px);
    }
    html[dir="rtl"] .sidebar { transform: translateX(105%); }
    body.sidebar-open .sidebar { transform: translateX(0); }
    body.sidebar-open .sidebar-backdrop {
        display: block;
        position: fixed;
        inset: 52px 0 0 0;
        background: rgba(0, 0, 0, .45);
        z-index: 1035;
    }
    .brand-sub { display: none; }
}

@media (max-width: 640px) {
    /* iOS Safari auto-zooms on focus when inputs are < 16px — keep the
       compact desktop sizes, but bump inputs to 16px on phones only. */
    .form-control, .form-select, input, select, textarea { font-size: 16px; }
    .content { padding: .7rem .6rem 1.2rem; }
    .topbar { padding: 0 .5rem; }
    .notif-menu { width: 280px; }
}

/* ---------- Print (A4) ---------- */
@media print {
    .topbar, .sidebar, .sidebar-backdrop, .dadis-footer, .btn, .no-print { display: none !important; }
    body { background: #fff; font-size: 11pt; }
    .app-shell { display: block; }
    .content { padding: 0; }
    .card { border: 1px solid #000; break-inside: avoid; }
    .table { font-size: 9pt; }
    .table th { background: #eee !important; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
    @page { size: A4; margin: 12mm; }
    .print-header { display: block !important; text-align: center; margin-bottom: 10px; border-bottom: 2px solid var(--dadis-navy); padding-bottom: 6px; }
}
.print-header { display: none; }