/* =====================================================================
   AdyCore Hospital ERP – theme
   Colours taken from the ADYCORE logo (navy → royal blue → cyan).
   Light / dark mode via Bootstrap 5.3 [data-bs-theme].
   Compact ("small") sizing across all pages.
   ===================================================================== */
:root, [data-bs-theme=light] {
    --brand: #0d5fd9;            /* logo royal blue */
    --brand-rgb: 13, 95, 217;
    --brand-dark: #0a47a8;
    --brand-navy: #0b1f45;       /* logo "ADY" navy */
    --brand-cyan: #1fb6f0;       /* logo highlight cyan */
    --brand-grad: linear-gradient(135deg, #0b1f45 0%, #0d5fd9 55%, #1fb6f0 100%);
    --brand-soft: #e8f0fd;

    --bg: #f3f6fb;
    --surface: #ffffff;
    --surface-2: #f7f9fc;
    --line: #e2e8f0;
    --text: #0f172a;
    --muted: #64748b;
    --label: #334155;

    --sidebar-w: 232px;
    --sidebar-bg: #ffffff;
    --sidebar-fg: #334155;
    --sidebar-muted: #94a3b8;
    --sidebar-hover: #f1f5fb;
    --sidebar-line: #e7ecf3;

    --bs-primary: var(--brand);
    --bs-primary-rgb: var(--brand-rgb);
    --bs-link-color: var(--brand);
    --bs-link-color-rgb: var(--brand-rgb);
    --bs-link-hover-color: var(--brand-dark);
    --bs-link-hover-color-rgb: 10, 71, 168;
    --bs-body-font-size: .8125rem;
    --bs-body-bg: var(--bg);
    --bs-border-radius: .45rem;
    --bs-border-radius-sm: .35rem;
    --bs-border-radius-lg: .6rem;
    --bs-focus-ring-color: rgba(var(--brand-rgb), .25);
}

[data-bs-theme=dark] {
    --brand: #3b82f6;
    --brand-rgb: 59, 130, 246;
    --brand-dark: #2563eb;
    --brand-soft: rgba(59, 130, 246, .14);

    --bg: #0b1220;
    --surface: #111a2c;
    --surface-2: #0f1727;
    --line: #1f2b40;
    --text: #e2e8f0;
    --muted: #8b9ab1;
    --label: #cbd5e1;

    --sidebar-bg: #0e1626;
    --sidebar-fg: #cbd5e1;
    --sidebar-muted: #6b7a90;
    --sidebar-hover: #16223a;
    --sidebar-line: #1c2840;

    --bs-body-bg: var(--bg);
    --bs-body-color: var(--text);
    --bs-secondary-color: var(--muted);
    --bs-border-color: var(--line);
    --bs-tertiary-bg: #16213a;
    --bs-secondary-bg: #182338;
}

html { font-size: 15px; }
body { background: var(--bg); color: var(--text); font-size: var(--bs-body-font-size); font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; -webkit-font-smoothing: antialiased; }
h1, .h1 { font-size: 1.35rem; } h2, .h2 { font-size: 1.2rem; } h3, .h3 { font-size: 1.08rem; }
h4, .h4 { font-size: 1rem; }   h5, .h5 { font-size: .92rem; } h6, .h6 { font-size: .85rem; }
.small, small { font-size: .78em; }

/* ---------- App shell ---------- */
.app { display: flex; min-height: 100vh; }
.sidebar { width: var(--sidebar-w); background: var(--sidebar-bg); color: var(--sidebar-fg); border-right: 1px solid var(--sidebar-line); position: fixed; top: 0; bottom: 0; left: 0; overflow-y: auto; z-index: 1030; transition: transform .2s; scrollbar-width: thin; }
.sidebar .brand { display: flex; gap: .55rem; align-items: center; padding: .7rem .85rem; border-bottom: 1px solid var(--sidebar-line); text-decoration: none; }
.brand-logo { width: 36px; height: 36px; border-radius: .55rem; background: #fff; border: 1px solid var(--sidebar-line); display: grid; place-items: center; flex: none; box-shadow: 0 1px 3px rgba(11,31,69,.08); }
.brand-logo img { width: 28px; height: 28px; object-fit: contain; }
.brand-title { color: var(--brand-navy); font-weight: 700; line-height: 1.1; font-size: .9rem; }
.brand-title span { color: var(--brand); }
[data-bs-theme=dark] .brand-title { color: #fff; }
[data-bs-theme=dark] .brand-title span { color: var(--brand-cyan); }
.brand-sub { font-size: .66rem; color: var(--sidebar-muted); text-transform: uppercase; letter-spacing: .08em; font-weight: 600; margin-top: 2px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 160px; }
.menu-search { margin: .55rem .7rem; width: calc(100% - 1.4rem); background: var(--surface-2); border: 1px solid var(--sidebar-line); color: var(--sidebar-fg); font-size: .78rem; }
.menu-search:focus { background: var(--surface); }
.menu-search::placeholder { color: var(--sidebar-muted); }
.menu { padding: 0 .45rem 2rem; }
.menu-head, .menu-link { display: flex; align-items: center; gap: .5rem; color: var(--sidebar-fg); text-decoration: none; padding: .34rem .6rem; border-radius: .4rem; }
.menu-head { font-weight: 600; font-size: .68rem; text-transform: uppercase; letter-spacing: .06em; color: var(--sidebar-muted); margin-top: .35rem; }
.menu-head i:first-child { font-size: .85rem; }
.menu-head .caret { margin-left: auto; font-size: .62rem; transition: transform .2s; }
.menu-head.collapsed .caret { transform: rotate(-90deg); }
.menu-link { padding-left: 1.55rem; font-size: .79rem; margin: 1px 0; }
.menu-link i { font-size: .85rem; color: var(--sidebar-muted); }
.menu-link.top { padding-left: .6rem; font-weight: 600; }
.menu-link:hover, .menu-head:hover { background: var(--sidebar-hover); color: var(--brand); }
.menu-link:hover i { color: var(--brand); }
.menu-link.active { background: var(--brand-soft); color: var(--brand); font-weight: 600; box-shadow: inset 3px 0 0 var(--brand); }
.menu-link.active i { color: var(--brand); }

.main { margin-left: var(--sidebar-w); flex: 1; min-width: 0; }
.topbar { position: sticky; top: 0; z-index: 1020; background: var(--surface); border-bottom: 1px solid var(--line); padding: .4rem .9rem; display: flex; align-items: center; gap: .6rem; min-height: 48px; }
.quick-search { position: relative; width: 340px; }
.quick-search i { position: absolute; left: .6rem; top: 50%; transform: translateY(-50%); color: var(--muted); font-size: .8rem; }
.quick-search input { padding-left: 1.9rem; background: var(--surface-2); }
.theme-toggle { width: 32px; height: 32px; border-radius: 50%; display: inline-grid; place-items: center; border: 1px solid var(--line); background: var(--surface); color: var(--muted); padding: 0; cursor: pointer; transition: color .15s, border-color .15s; }
.theme-toggle:hover { color: var(--brand); border-color: var(--brand); }
.theme-toggle .bi-sun { display: none; }
[data-bs-theme=dark] .theme-toggle .bi-sun { display: inline; }
[data-bs-theme=dark] .theme-toggle .bi-moon-stars { display: none; }
.content { padding: .9rem 1rem 2.5rem; }
.sidebar-backdrop { display: none; }
@media (max-width: 991px) {
    .sidebar { transform: translateX(-100%); box-shadow: 0 0 30px rgba(0,0,0,.15); }
    .sidebar.open { transform: none; }
    .main { margin-left: 0; }
}

/* ---------- Compact Bootstrap components ---------- */
.form-control, .form-select { font-size: .8125rem; padding: .32rem .6rem; min-height: calc(1.5em + .64rem + 2px); }
.form-select { padding-right: 2rem; background-position: right .55rem center; }
.form-control-sm, .form-select-sm { font-size: .76rem; padding: .22rem .5rem; min-height: calc(1.5em + .44rem + 2px); }
.form-control:focus, .form-select:focus, .form-check-input:focus { border-color: rgba(var(--brand-rgb), .6); box-shadow: 0 0 0 .18rem rgba(var(--brand-rgb), .18); }
.form-check-input:checked { background-color: var(--brand); border-color: var(--brand); }
.input-group-text { font-size: .8125rem; padding: .32rem .6rem; }
.form-label { font-weight: 500; font-size: .76rem; color: var(--label); margin-bottom: .18rem; }
.form-text { font-size: .72rem; }
.required::after { content: " *"; color: #dc2626; }
.btn { font-size: .8125rem; padding: .32rem .75rem; font-weight: 500; }
.btn-sm { font-size: .74rem; padding: .2rem .5rem; }
.btn-lg { font-size: .9rem; padding: .45rem 1rem; }
.btn-primary { --bs-btn-bg: var(--brand); --bs-btn-border-color: var(--brand); --bs-btn-hover-bg: var(--brand-dark); --bs-btn-hover-border-color: var(--brand-dark); --bs-btn-active-bg: var(--brand-dark); --bs-btn-active-border-color: var(--brand-dark); --bs-btn-disabled-bg: var(--brand); --bs-btn-disabled-border-color: var(--brand); }
.btn-outline-primary { --bs-btn-color: var(--brand); --bs-btn-border-color: var(--brand); --bs-btn-hover-bg: var(--brand); --bs-btn-hover-border-color: var(--brand); --bs-btn-active-bg: var(--brand); --bs-btn-active-border-color: var(--brand); }
.text-primary { color: var(--brand) !important; }
.bg-primary, .text-bg-primary { background-color: var(--brand) !important; }
.border-primary { border-color: var(--brand) !important; }
.nav-pills .nav-link.active { background: var(--brand); }
.nav-tabs .nav-link { font-size: .79rem; padding: .38rem .8rem; }
.nav-tabs .nav-link.active { color: var(--brand); font-weight: 600; }
.page-link { font-size: .76rem; padding: .22rem .55rem; color: var(--brand); }
.active > .page-link, .page-link.active { background: var(--brand); border-color: var(--brand); }
.dropdown-menu { font-size: .8rem; }
.dropdown-item { padding: .3rem .85rem; }
.alert { font-size: .8rem; padding: .55rem .85rem; }
.alert-dismissible .btn-close { padding: .7rem .85rem; }
.badge { font-weight: 600; font-size: .68rem; }
.modal-header, .modal-footer { padding: .6rem .9rem; }
.modal-body { padding: .9rem; }
.modal-title { font-size: .95rem; }

.page-head { display: flex; align-items: center; gap: .6rem; margin-bottom: .8rem; flex-wrap: wrap; }
.page-head h1 { font-size: 1.1rem; margin: 0; font-weight: 700; color: var(--text); }
.page-head .sub { color: var(--muted); font-size: .78rem; }

.card { background: var(--surface); border: 1px solid var(--line); box-shadow: 0 1px 2px rgba(15,23,42,.04); --bs-card-spacer-y: .8rem; --bs-card-spacer-x: .9rem; --bs-card-cap-padding-y: .5rem; --bs-card-cap-padding-x: .9rem; --bs-card-bg: var(--surface); }
.card-header { background: var(--surface); font-weight: 600; font-size: .82rem; border-bottom-color: var(--line); }
.card-footer { background: var(--surface); border-top-color: var(--line); }

.table { font-size: .78rem; --bs-table-bg: var(--surface); --bs-table-border-color: var(--line); margin-bottom: .5rem; }
.table > :not(caption) > * > * { padding: .38rem .55rem; vertical-align: middle; }
.table-sm > :not(caption) > * > * { padding: .22rem .4rem; }
.table thead th { background: var(--surface-2); white-space: nowrap; font-weight: 600; color: var(--label); font-size: .72rem; text-transform: uppercase; letter-spacing: .03em; }
.table thead th a { color: inherit; text-decoration: none; }
.table-hover > tbody > tr:hover > * { --bs-table-bg-state: var(--brand-soft); }
.grid-filters .form-control, .grid-filters .form-select { max-width: 210px; }

.stat { border-radius: .6rem; padding: .7rem .85rem; background: var(--surface); border: 1px solid var(--line); height: 100%; }
.stat .v { font-size: 1.2rem; font-weight: 700; line-height: 1.1; }
.stat .l { color: var(--muted); font-size: .72rem; }
.stat i { font-size: 1.3rem; opacity: .85; }

.patient-banner { background: var(--surface); border: 1px solid var(--line); border-left: 4px solid var(--brand); border-radius: .5rem; padding: .5rem .85rem; margin-bottom: .8rem; display: flex; gap: 1.2rem; flex-wrap: wrap; align-items: center; }
.patient-banner .name { font-weight: 700; font-size: .95rem; }
.patient-banner .k { color: var(--muted); font-size: .7rem; display: block; }

.bed { border-radius: .5rem; padding: .45rem; min-height: 84px; font-size: .74rem; border: 1px solid var(--line); background: var(--surface); }
.bed .no { font-weight: 700; font-size: .85rem; }
.bed-Available { border-left: 5px solid #16a34a; }
.bed-Occupied { border-left: 5px solid #dc2626; background: #fff7f7; }
.bed-Cleaning { border-left: 5px solid #f59e0b; background: #fffbeb; }
.bed-Reserved { border-left: 5px solid #6366f1; background: #eef2ff; }
.bed-Maintenance, .bed-Blocked { border-left: 5px solid #64748b; background: #f1f5f9; }
[data-bs-theme=dark] .bed-Occupied { background: rgba(220,38,38,.10); }
[data-bs-theme=dark] .bed-Cleaning { background: rgba(245,158,11,.10); }
[data-bs-theme=dark] .bed-Reserved { background: rgba(99,102,241,.12); }
[data-bs-theme=dark] .bed-Maintenance, [data-bs-theme=dark] .bed-Blocked { background: rgba(100,116,139,.12); }
.triage-Red { background: #dc2626; color: #fff; } .triage-Orange { background: #f97316; color: #fff; }
.triage-Yellow { background: #facc15; color: #111; } .triage-Green { background: #16a34a; color: #fff; } .triage-Black { background: #111; color: #fff; }
.flag-High, .flag-Low { color: #b45309; font-weight: 700; }
.flag-CriticalHigh, .flag-CriticalLow { color: #dc2626; font-weight: 800; }
.lines td { vertical-align: middle; }
.lines .ts-wrapper { min-width: 220px; }
.token { font-size: 1.25rem; font-weight: 800; color: var(--brand); }
.brand-accent { color: var(--brand) !important; }

/* ---------- Dark mode fixes for hard-coded light utilities ---------- */
[data-bs-theme=dark] .bg-white { background-color: var(--surface) !important; }
[data-bs-theme=dark] .bg-light { background-color: var(--surface-2) !important; }
[data-bs-theme=dark] .text-dark { color: var(--text) !important; }
[data-bs-theme=dark] .text-bg-light { background-color: #1e2a42 !important; color: var(--text) !important; }
[data-bs-theme=dark] .btn-light { --bs-btn-bg: #18233a; --bs-btn-border-color: var(--line); --bs-btn-color: var(--text); --bs-btn-hover-bg: #1f2c47; --bs-btn-hover-border-color: #2a3a5a; --bs-btn-hover-color: #fff; --bs-btn-active-bg: #1f2c47; --bs-btn-active-color: #fff; }
[data-bs-theme=dark] .table-light { --bs-table-bg: var(--surface-2); --bs-table-color: var(--text); }
[data-bs-theme=dark] .ts-control, [data-bs-theme=dark] .ts-dropdown, [data-bs-theme=dark] .ts-control input { background: var(--bs-body-bg) !important; color: var(--text) !important; border-color: var(--line) !important; }
[data-bs-theme=dark] .ts-dropdown .active { background: var(--brand-soft) !important; color: #fff !important; }
[data-bs-theme=dark] .brand-logo { background: #fff; border-color: transparent; }
.ts-control { font-size: .8125rem; padding: .28rem .55rem; min-height: calc(1.5em + .64rem + 2px); }
.ts-dropdown { font-size: .8rem; }

/* ---------- Login (staff) ---------- */
.auth-page { min-height: 100vh; display: flex; align-items: center; justify-content: center; padding: 1.25rem; position: relative;
    background: radial-gradient(1100px 600px at 12% 8%, rgba(31,182,240,.10), transparent 60%), radial-gradient(900px 600px at 95% 95%, rgba(13,95,217,.10), transparent 60%), var(--bg); }
.auth-theme { position: absolute; top: 1rem; right: 1rem; }
.auth-card { width: 100%; max-width: 820px; display: grid; grid-template-columns: 1fr 1fr; background: var(--surface); border-radius: 1rem; overflow: hidden; box-shadow: 0 20px 50px -18px rgba(11,31,69,.30), 0 2px 6px rgba(11,31,69,.05); border: 1px solid var(--line); }
.auth-hero { position: relative; color: #fff; padding: 1.6rem 1.6rem 1.2rem; display: flex; flex-direction: column; overflow: hidden;
    background: linear-gradient(160deg, #e8b865 0%, #6d86a6 26%, #1f55a8 55%, #0d5fd9 80%, #2a6ff0 100%); }
.auth-hero::before, .auth-hero::after { content: ""; position: absolute; border-radius: 50%; background: rgba(255,255,255,.07); pointer-events: none; }
.auth-hero::before { width: 260px; height: 260px; top: -110px; right: -90px; }
.auth-hero::after { width: 200px; height: 200px; bottom: -110px; left: -70px; }
.auth-hero > * { position: relative; z-index: 1; }
.auth-brand { display: flex; align-items: center; gap: .6rem; }
.auth-brand .logo-tile { width: 42px; height: 42px; border-radius: .6rem; background: #fff; display: grid; place-items: center; box-shadow: 0 4px 12px rgba(0,0,0,.15); }
.auth-brand .logo-tile img { width: 34px; height: 34px; object-fit: contain; }
.auth-brand .t1 { font-weight: 800; font-size: 1.05rem; line-height: 1.1; }
.auth-brand .t2 { font-size: .6rem; letter-spacing: .18em; font-weight: 700; opacity: .8; text-transform: uppercase; }
.auth-pill { display: inline-flex; align-items: center; gap: .35rem; margin-top: .7rem; align-self: flex-start; font-size: .68rem; font-weight: 600; padding: .25rem .6rem; border-radius: 999px; background: rgba(255,255,255,.16); border: 1px solid rgba(255,255,255,.25); backdrop-filter: blur(4px); }
.auth-hero h2 { font-size: 1.55rem; font-weight: 800; line-height: 1.15; margin: 1.3rem 0 .6rem; letter-spacing: -.01em; }
.auth-hero p { font-size: .8rem; opacity: .9; line-height: 1.55; margin: 0 0 1rem; max-width: 330px; }
.auth-chips { display: flex; gap: .4rem; flex-wrap: wrap; }
.auth-chips span { display: inline-flex; align-items: center; gap: .35rem; font-size: .72rem; font-weight: 500; padding: .35rem .6rem; border-radius: .45rem; background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.18); }
.auth-copy { margin-top: auto; padding-top: 1.4rem; font-size: .66rem; opacity: .75; }
.auth-form { padding: 2rem 2rem 1.4rem; display: flex; flex-direction: column; justify-content: center; }
.auth-form h1 { font-size: 1.35rem; font-weight: 800; margin: 0 0 .2rem; color: var(--text); }
.auth-form .lead-sub { color: var(--muted); font-size: .8rem; margin-bottom: 1.2rem; }
.auth-form .form-label { font-weight: 600; font-size: .74rem; color: var(--text); }
.auth-input { position: relative; }
.auth-input > i.lead { position: absolute; left: .7rem; top: 50%; transform: translateY(-50%); color: var(--muted); font-size: .85rem; pointer-events: none; }
.auth-input .form-control { padding: .5rem .75rem .5rem 2.1rem; background: var(--brand-soft); border-color: transparent; font-size: .82rem; }
.auth-input .form-control:focus { background: var(--surface); border-color: var(--brand-navy); box-shadow: 0 0 0 .15rem rgba(var(--brand-rgb), .15); }
[data-bs-theme=dark] .auth-input .form-control:focus { border-color: var(--brand); }
.auth-input .eye { position: absolute; right: .45rem; top: 50%; transform: translateY(-50%); border: 0; background: none; color: var(--muted); padding: .2rem .35rem; }
.auth-input .eye:hover { color: var(--brand); }
.auth-input.has-eye .form-control { padding-right: 2.2rem; }
.auth-submit { width: 100%; padding: .55rem; font-weight: 600; font-size: .85rem; border-radius: .5rem; box-shadow: 0 8px 18px -8px rgba(var(--brand-rgb), .7); }
.auth-submit i { transition: transform .15s; }
.auth-submit:hover i { transform: translateX(3px); }
.auth-secure { text-align: center; font-size: .7rem; color: var(--muted); margin-top: .8rem; }
.auth-secure i { color: #16a34a; }
.auth-alt { text-align: center; font-size: .74rem; margin-top: .6rem; }
@media (max-width: 767px) {
    .auth-card { grid-template-columns: 1fr; max-width: 400px; }
    .auth-hero { padding: 1.1rem 1.2rem; }
    .auth-hero h2 { font-size: 1.2rem; margin-top: .9rem; }
    .auth-hero p, .auth-chips, .auth-copy { display: none; }
    .auth-form { padding: 1.4rem 1.3rem 1.1rem; }
}

/* ---------- Patient portal ---------- */
.portal-nav { background: #fff; border-bottom: 1px solid var(--line); padding-top: .3rem; padding-bottom: .3rem; }
[data-bs-theme=dark] .portal-nav { background: var(--sidebar-bg); }
.portal-nav .navbar-brand { display: flex; align-items: center; gap: .5rem; font-size: .92rem; font-weight: 700; color: var(--brand-navy); }
[data-bs-theme=dark] .portal-nav .navbar-brand { color: #fff; }
.portal-nav .nav-link { color: var(--sidebar-fg); font-size: .8rem; padding: .4rem .65rem !important; border-radius: .4rem; }
.portal-nav .nav-link:hover { color: var(--brand); background: var(--sidebar-hover); }
.portal-nav .nav-link.active { color: var(--brand); background: var(--brand-soft); font-weight: 600; }
.portal-main { max-width: 1140px; margin: 0 auto; padding: 14px; }

@media print {
    .sidebar, .topbar, .no-print, .btn, .alert, .theme-toggle { display: none !important; }
    .main { margin: 0; }
    .content { padding: 0; }
    body { background: #fff; color: #000; }
    .card { border: 0; box-shadow: none; }
}

/* ---------- AdyCore page loader (GIF) ---------- */
.ady-loader { position: fixed; inset: 0; z-index: 2000; display: grid; place-items: center; background: rgba(243,246,251,.72); backdrop-filter: blur(3px); -webkit-backdrop-filter: blur(3px); opacity: 0; visibility: hidden; transition: opacity .2s ease, visibility .2s ease; }
.ady-loader.show { opacity: 1; visibility: visible; }
[data-bs-theme=dark] .ady-loader { background: rgba(11,18,32,.72); }
.ady-loader-box { background: #fff; border-radius: 1rem; padding: .9rem 1.1rem .7rem; text-align: center; box-shadow: 0 18px 40px -14px rgba(11,31,69,.35); transform: scale(.94); transition: transform .2s ease; }
.ady-loader.show .ady-loader-box { transform: scale(1); }
.ady-loader-box img { display: block; width: 80px; height: 80px; margin: 0 auto; }
.ady-loader-text { margin-top: .35rem; font-size: .72rem; font-weight: 600; letter-spacing: .06em; color: #0b1f45; }
.ady-loader-text span { animation: adyDot 1.2s infinite; opacity: .2; }
.ady-loader-text span:nth-child(2) { animation-delay: .2s; }
.ady-loader-text span:nth-child(3) { animation-delay: .4s; }
@keyframes adyDot { 0%, 60%, 100% { opacity: .2; } 30% { opacity: 1; } }
@media print { .ady-loader { display: none !important; } }
