/* =========================================================
   Aleppo Health Directorate - Children Hospital Visual Identity
   Palette sampled from the supplied Directorate logo:
   Deep Green #002623 | Gold #BBA97B | Warm Ivory #F7F3E9 | Sage #DCE7DF
   Loaded last so it safely rebrands legacy components without
   changing application logic.
   ========================================================= */

:root {
    --aleppo-emerald: #002623;
    --aleppo-emerald-deep: #001c1a;
    --aleppo-emerald-soft: #eaf2ef;
    --aleppo-ink: #1e312b;
    --aleppo-ink-soft: #40544c;
    --aleppo-gold: #bba97b;
    --aleppo-gold-deep: #927c4f;
    --aleppo-gold-soft: #f6f1e5;
    --aleppo-sage: #dce7df;
    --aleppo-sage-soft: #f1f6f2;
    --aleppo-bg: #f7f8f4;
    --aleppo-card: #ffffff;
    --aleppo-line: #ddd7c7;
    --aleppo-muted: #6e766f;
    --aleppo-success: #3f765f;
    --aleppo-success-soft: #edf6f1;
    --aleppo-danger: #b14a50;
    --aleppo-warning: #aa7b34;
    --aleppo-shadow: 0 18px 48px rgba(0, 38, 35, .09);

    /* Reports theme variables */
    --reports-ink: var(--aleppo-ink);
    --reports-muted: var(--aleppo-muted);
    --reports-primary: var(--aleppo-emerald);
    --reports-primary-dark: var(--aleppo-emerald-deep);
    --reports-accent: var(--aleppo-gold);
    --reports-accent-soft: var(--aleppo-gold-soft);
    --reports-bg: var(--aleppo-bg);
    --reports-card: var(--aleppo-card);
    --reports-line: var(--aleppo-line);
    --reports-success: var(--aleppo-success);
    --reports-warning: var(--aleppo-warning);
    --reports-shadow: var(--aleppo-shadow);

    /* Legacy UI variables */
    --bg: var(--aleppo-bg);
    --card: var(--aleppo-card);
    --text: var(--aleppo-ink);
    --muted: var(--aleppo-muted);
    --primary: var(--aleppo-emerald);
    --primary-dark: var(--aleppo-emerald-deep);
    --primary-soft: var(--aleppo-gold-soft);
    --border: var(--aleppo-line);
    --danger: var(--aleppo-danger);
    --success: var(--aleppo-success);
    --warning: var(--aleppo-warning);

    --navy: var(--aleppo-emerald);
    --blue: var(--aleppo-emerald);
    --sky: var(--aleppo-sage-soft);
    --green: var(--aleppo-success);
    --red: var(--aleppo-danger);
    --line: var(--aleppo-line);
}

html {
    accent-color: var(--aleppo-emerald);
}

body.reports-app,
body.reports-auth-body {
    color: var(--aleppo-ink);
    background:
        radial-gradient(circle at 92% -10%, rgba(53, 130, 169, .08), transparent 27%),
        radial-gradient(circle at 5% 7%, rgba(117, 192, 69, .10), transparent 30%),
        linear-gradient(180deg, #fbfdfe 0%, var(--aleppo-bg) 48%, #f3f5f1 100%);
}

/* ------------------------- Top navigation ------------------------- */
.reports-topbar {
    border-bottom: 1px solid rgba(213, 231, 239, .95);
    background: rgba(255, 255, 255, .965);
    box-shadow: 0 8px 30px rgba(34, 93, 125, .045);
}

.reports-topbar::after {
    content: "";
    position: absolute;
    right: 0;
    bottom: -1px;
    left: 0;
    height: 3px;
    background: linear-gradient(90deg,
        var(--aleppo-gold) 0%,
        var(--aleppo-gold) 42%,
        var(--aleppo-sage) 42%,
        var(--aleppo-sage) 58%,
        var(--aleppo-emerald) 58%,
        var(--aleppo-emerald) 100%);
    opacity: .9;
}

.reports-topbar-inner {
    min-height: 82px;
}

.reports-brand {
    gap: 13px;
}

.reports-brand-mark {
    width: 58px;
    height: 58px;
    border: 1px solid rgba(117, 192, 69, .18);
    border-radius: 18px;
    background: linear-gradient(145deg, #ffffff, var(--aleppo-sage-soft));
    box-shadow: 0 12px 26px rgba(34, 93, 125, .10);
}

/* Show the hospital emblem clearly inside the compact navbar mark. */
.reports-brand-mark img {
    width: 178%;
    height: 178%;
    max-width: none;
    object-fit: cover;
    object-position: 50% 25%;
    transform: translateY(-12%);
}

.reports-brand strong {
    color: var(--aleppo-ink);
    font-size: 17px;
}

.reports-brand small {
    color: var(--aleppo-gold);
    font-weight: 700;
}

.reports-nav-link {
    position: relative;
    color: #4b5b54;
    border: 1px solid transparent;
}

.reports-nav-link:hover {
    color: var(--aleppo-ink);
    border-color: rgba(117, 192, 69, .12);
    background: var(--aleppo-sage-soft);
}

.reports-nav-link.active {
    color: #fff;
    border-color: rgba(53, 130, 169, .25);
    background: linear-gradient(135deg, var(--aleppo-ink), #274d42);
    box-shadow: 0 11px 25px rgba(34, 93, 125, .18);
}

.reports-nav-link.active::after {
    content: "";
    position: absolute;
    right: 15px;
    bottom: 5px;
    left: 15px;
    height: 2px;
    border-radius: 99px;
    background: var(--aleppo-gold);
}

.reports-user-avatar {
    color: var(--aleppo-gold);
    border: 1px solid rgba(117, 192, 69, .13);
    background: var(--aleppo-gold-soft);
}

.reports-logout {
    border-color: var(--aleppo-line);
    color: var(--aleppo-ink);
    background: #fff;
}

.reports-logout:hover {
    border-color: rgba(53, 130, 169, .35);
    color: var(--aleppo-emerald-deep);
    background: var(--aleppo-emerald-soft);
}

.mobile-menu-btn {
    border-color: var(--aleppo-line);
    color: var(--aleppo-ink);
    background: #fff;
}

/* ------------------------- Page headings ------------------------- */
.reports-page-heading {
    position: relative;
    overflow: hidden;
    border-color: var(--aleppo-line);
    background:
        radial-gradient(circle at 5% 0%, rgba(161, 207, 231, .32), transparent 28%),
        rgba(255, 255, 255, .97);
    box-shadow: 0 15px 38px rgba(34, 93, 125, .055);
}

.reports-page-heading::before {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    width: 92px;
    height: 4px;
    border-radius: 0 0 0 8px;
    background: var(--aleppo-emerald);
}

.reports-page-heading h1 {
    color: var(--aleppo-ink);
}

.reports-kicker,
.reports-panel-heading > div > span,
.reports-auth-kicker {
    color: var(--aleppo-emerald) !important;
}

/* ------------------------- Buttons ------------------------- */
.btn-primary,
.primary-button {
    border: 1px solid rgba(34, 93, 125, .78);
    color: #fff !important;
    background: linear-gradient(135deg, var(--aleppo-emerald), var(--aleppo-emerald-deep));
    box-shadow: 0 11px 25px rgba(53, 130, 169, .20);
}

.btn-primary:hover,
.primary-button:hover {
    box-shadow: 0 14px 30px rgba(53, 130, 169, .26);
}

.btn-light,
.ghost-button {
    border-color: var(--aleppo-line);
    color: var(--aleppo-ink) !important;
    background: #fff;
}

.btn-light:hover,
.ghost-button:hover {
    border-color: rgba(117, 192, 69, .22);
    background: var(--aleppo-sage-soft);
}

.tool-button {
    border: 1px solid var(--aleppo-ink) !important;
    color: #fff !important;
    background: var(--aleppo-ink) !important;
    box-shadow: 0 7px 17px rgba(34, 93, 125, .11);
}

.tool-button:hover {
    border-color: var(--aleppo-emerald) !important;
    background: var(--aleppo-emerald) !important;
}

/* ------------------------- Alerts ------------------------- */
.alert-success {
    border-color: #b8d0c3;
    color: #315f4d;
    background: #edf6f1;
}

.alert-danger {
    border-color: #f3b3bd;
    color: #9e1530;
    background: #fff1f4;
}

/* ------------------------- Dashboard hero ------------------------- */
.reports-hero {
    position: relative;
    overflow: hidden;
    border: 1px solid rgba(161, 207, 231, .18);
    background:
        radial-gradient(circle at 8% 12%, rgba(53, 130, 169, .30), transparent 27%),
        radial-gradient(circle at 96% 95%, rgba(117, 192, 69, .72), transparent 30%),
        linear-gradient(135deg, #001c1a 0%, var(--aleppo-ink) 48%, #123a34 100%);
    box-shadow: 0 22px 52px rgba(34, 93, 125, .18);
}

.reports-hero::after {
    content: "";
    position: absolute;
    top: -60px;
    left: -60px;
    width: 210px;
    height: 210px;
    border: 22px solid rgba(53, 130, 169, .16);
    border-radius: 50%;
    pointer-events: none;
}

.reports-hero > * {
    position: relative;
    z-index: 1;
}

.reports-hero-badge {
    border-color: rgba(161, 207, 231, .28);
    color: #fbf7ed;
    background: rgba(117, 192, 69, .28);
}

.reports-hero .btn-primary {
    border-color: rgba(255,255,255,.06);
}

.reports-hero .btn-light {
    border-color: rgba(255,255,255,.18);
    color: #fff !important;
    background: rgba(255,255,255,.09);
}

/* ------------------------- Metrics and cards ------------------------- */
.reports-metric,
.reports-panel,
.reports-filter-card,
.record-form-section,
.patient-header,
.tab-panel,
.note-panel,
.important-links-section,
.chart-card,
.table-panel {
    border-color: var(--aleppo-line) !important;
    background: rgba(255, 255, 255, .975) !important;
    box-shadow: 0 14px 36px rgba(34, 93, 125, .055) !important;
}

.reports-metric {
    position: relative;
    overflow: hidden;
}

.reports-metric::before {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    width: 56px;
    height: 4px;
    border-radius: 0 0 0 8px;
    background: var(--aleppo-ink);
}

.reports-metric-primary {
    border-color: #e3dece !important;
    background: linear-gradient(150deg, #fff, #f4fbfe) !important;
}

.reports-metric-primary::before {
    background: var(--aleppo-emerald);
}

.reports-metric-primary strong {
    color: var(--aleppo-emerald-deep);
}

.reports-metric-success::before {
    background: var(--aleppo-gold);
}

.reports-metric-success strong {
    color: var(--aleppo-gold);
}

.reports-metric-warning::before {
    background: #aa7b34;
}

.reports-panel-heading a,
.table-actions a,
.record-file-field a {
    color: var(--aleppo-emerald-deep);
}

.record-row {
    border: 1px solid #f1eee6;
    background: #f8fbfd;
}

.record-row:hover {
    border-color: rgba(117, 192, 69, .20);
    background: var(--aleppo-sage-soft);
}

.record-number,
.table-serial {
    color: var(--aleppo-gold);
    background: #f4f0e6;
}

.record-completion.completed {
    color: #315f4d;
    background: #f4f0e6;
}

.record-completion.pending {
    color: #6d5d3d;
    background: #eaf2ef;
}

.monthly-bar-track {
    background: #eef3ef;
}

.monthly-bar-track span,
.stats-bar-row i {
    background: linear-gradient(180deg, var(--aleppo-emerald), var(--aleppo-emerald-deep));
}

/* ------------------------- Forms ------------------------- */
input,
select,
textarea {
    border-color: #ddd7c7;
    color: var(--aleppo-ink);
    background: #fff;
}

input:hover,
select:hover,
textarea:hover {
    border-color: #cfc7b5;
}

input:focus,
select:focus,
textarea:focus {
    border-color: var(--aleppo-gold);
    box-shadow: 0 0 0 4px rgba(117, 192, 69, .11);
}

input[type="checkbox"],
input[type="radio"] {
    accent-color: var(--aleppo-emerald);
}

.record-form-intro {
    position: relative;
    overflow: hidden;
    border: 1px solid rgba(161, 207, 231, .16);
    background:
        radial-gradient(circle at 10% 10%, rgba(53, 130, 169, .24), transparent 30%),
        radial-gradient(circle at 90% 90%, rgba(117, 192, 69, .62), transparent 30%),
        linear-gradient(135deg, #001c1a, #123a34);
    box-shadow: 0 18px 42px rgba(34, 93, 125, .15);
}

.record-form-intro span,
.record-form-intro-icon {
    color: #edf9ff;
}

.record-form-intro-icon {
    width: 62px;
    height: 62px;
    display: grid;
    place-items: center;
    border: 1px solid rgba(255,255,255,.14);
    border-radius: 19px;
    background: rgba(255,255,255,.08);
    font-size: 34px;
}

.record-form-section-title > span {
    background: linear-gradient(135deg, var(--aleppo-emerald), var(--aleppo-emerald-deep));
    box-shadow: 0 9px 20px rgba(247,19,53,.18);
}

.record-form-actions {
    border-color: rgba(213, 231, 239, .95);
    background: rgba(255,255,255,.965);
}

/* ------------------------- Tables ------------------------- */
.reports-table th {
    color: #4b5b54;
    border-bottom: 1px solid #ded8c9;
    background: linear-gradient(180deg, #f1f6f2, #f1eee6);
}

.reports-table tbody tr:hover td {
    background: #fbfdfe;
}

/* ------------------------- Patient tabs ------------------------- */
.tabs {
    border-color: var(--aleppo-line) !important;
    background: #fff !important;
    box-shadow: 0 8px 24px rgba(34, 93, 125, .035);
}

.tab {
    color: #4b5b54 !important;
}

.tab:hover {
    color: var(--aleppo-gold) !important;
    background: var(--aleppo-sage-soft) !important;
}

.tab.active {
    position: relative;
    color: #fff !important;
    background: linear-gradient(135deg, var(--aleppo-ink), #274d42) !important;
    box-shadow: 0 8px 18px rgba(34, 93, 125, .13);
}

.tab.active::after {
    content: "";
    position: absolute;
    right: 18px;
    bottom: 4px;
    left: 18px;
    height: 2px;
    border-radius: 99px;
    background: var(--aleppo-emerald);
}

.report-access-open {
    color: #315f4d !important;
    border-color: #b8d0c3 !important;
    background: #edf6f1 !important;
}

.report-access-locked {
    color: #8a2738 !important;
    border-color: #efbdc5 !important;
    background: #fff3f5 !important;
}

.elapsed-time {
    color: var(--aleppo-gold) !important;
    background: var(--aleppo-gold-soft) !important;
}

.monitoring-remove-button {
    border-color: #efb7c0 !important;
    color: var(--aleppo-emerald-deep) !important;
    background: var(--aleppo-emerald-soft) !important;
}

/* Completed surgery toggle */
.surgery-completed-toggle:has(> input[type="checkbox"]:checked) {
    border-color: #b8d0c3 !important;
    background: #edf6f1 !important;
}

.surgery-completed-toggle > input[type="checkbox"]:checked + .surgery-toggle-track {
    background: var(--aleppo-success) !important;
}

/* ------------------------- Important links ------------------------- */
.important-links-count {
    color: var(--aleppo-gold) !important;
    background: var(--aleppo-gold-soft) !important;
}

.important-link-card {
    border-color: var(--aleppo-line) !important;
    background:
        radial-gradient(circle at top left, rgba(161, 207, 231, .30), transparent 40%),
        #fff !important;
}

.important-link-card:hover {
    border-color: rgba(53, 130, 169, .35) !important;
    box-shadow: 0 18px 38px rgba(34, 93, 125, .10) !important;
}

.important-link-icon {
    background: linear-gradient(135deg, var(--aleppo-emerald), var(--aleppo-emerald-deep)) !important;
    box-shadow: 0 9px 20px rgba(247,19,53,.17);
}

.important-link-footer {
    border-color: #ddd7c7 !important;
    color: var(--aleppo-gold) !important;
}

.important-link-arrow {
    color: var(--aleppo-gold) !important;
    background: var(--aleppo-gold-soft) !important;
}

.important-link-card:hover .important-link-arrow {
    color: #fff !important;
    background: var(--aleppo-emerald) !important;
}

/* ------------------------- Pagination ------------------------- */
.pagination-button,
.pagination-number,
.pagination-dots {
    border-color: var(--aleppo-line);
    color: var(--aleppo-ink);
}

.pagination-button:hover,
.pagination-number:hover {
    border-color: rgba(18,86,69,.28);
    color: var(--aleppo-gold);
    background: var(--aleppo-sage-soft);
}

.pagination-current {
    border-color: var(--aleppo-ink) !important;
    color: #fff !important;
    background: var(--aleppo-ink) !important;
    box-shadow: inset 0 -3px 0 var(--aleppo-emerald);
}

/* ------------------------- Loader ------------------------- */
.page-loader {
    background:
        radial-gradient(circle at 50% 35%, rgba(179,224,210,.42), transparent 26%),
        rgba(247, 251, 249, .97);
}

.loader-card {
    border-color: var(--aleppo-line);
    background: #fff;
}

.loader-ring {
    border-color: #ded8c9;
    border-top-color: var(--aleppo-emerald);
    border-right-color: var(--aleppo-gold);
}

.loader-title {
    color: var(--aleppo-ink);
}

/* ------------------------- Login ------------------------- */
.reports-auth-shell {
    gap: clamp(24px, 5vw, 70px);
}

.reports-auth-intro {
    position: relative;
}

.reports-auth-intro::before {
    content: "";
    position: absolute;
    top: 8%;
    right: -8%;
    width: 250px;
    height: 250px;
    border: 34px solid rgba(53, 130, 169, .08);
    border-radius: 50%;
    pointer-events: none;
}

.reports-auth-intro > * {
    position: relative;
    z-index: 1;
}

.reports-auth-emblem {
    width: 142px;
    height: 142px;
    padding: 8px;
    border: 1px solid rgba(117, 192, 69, .16);
    border-radius: 34px;
    background: linear-gradient(145deg, #fff, var(--aleppo-sage-soft));
    box-shadow: 0 20px 45px rgba(34, 93, 125, .12);
}

.reports-auth-emblem img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    border-radius: 25px;
}

.reports-auth-intro h1 {
    color: var(--aleppo-ink);
}

.reports-auth-features span {
    border-color: #ddd7c7;
    color: var(--aleppo-gold);
    background: #fff;
}

.reports-auth-card {
    position: relative;
    overflow: hidden;
    border-color: var(--aleppo-line);
    background: rgba(255,255,255,.975);
    box-shadow: 0 24px 64px rgba(34, 93, 125, .10);
}

.reports-auth-card::before {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    height: 5px;
    background: linear-gradient(90deg, var(--aleppo-gold), var(--aleppo-ink), var(--aleppo-emerald));
}

/* ------------------------- Mobile menu ------------------------- */
@media (max-width: 1120px) {
    .reports-mobile-nav {
        border-color: var(--aleppo-line);
        background: rgba(255,255,255,.985);
    }

    .reports-mobile-nav .mobile-nav-link {
        color: #4b5b54;
        background: #f7f8f4;
    }

    .reports-mobile-nav .mobile-nav-link.active {
        color: #fff;
        background: linear-gradient(135deg, var(--aleppo-ink), #274d42);
        box-shadow: inset 0 -3px 0 var(--aleppo-emerald);
    }
}

@media (max-width: 600px) {
    .reports-brand-mark {
        width: 50px;
        height: 50px;
        border-radius: 15px;
    }

    .reports-auth-emblem {
        width: 112px;
        height: 112px;
        border-radius: 28px;
    }
}

/* ------------------------- Footer ------------------------- */
.reports-footer {
    position: relative;
    border-top-color: var(--aleppo-line);
    color: var(--aleppo-muted);
    background: #fff;
}

.reports-footer::before {
    content: "";
    position: absolute;
    top: 0;
    right: 50%;
    width: 120px;
    height: 3px;
    transform: translateX(50%);
    background: linear-gradient(90deg, var(--aleppo-gold), var(--aleppo-ink), var(--aleppo-emerald));
}

/* ------------------------- Print identity ------------------------- */
.medical-print-header {
    border-bottom-color: var(--aleppo-emerald) !important;
}

.medical-print-header .print-logo {
    width: 74px !important;
    height: 74px !important;
    padding: 4px !important;
    display: grid !important;
    place-items: center !important;
    overflow: hidden !important;
    border: 1px solid #ded8c9 !important;
    border-radius: 16px !important;
    background: #fff !important;
}

.medical-print-header .print-logo img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.report-title {
    color: var(--aleppo-ink) !important;
    border-color: var(--aleppo-line) !important;
}

.print-section h3,
.print-table th,
.print-info-grid span {
    color: var(--aleppo-gold) !important;
}

@media print {
    :root {
        --aleppo-emerald: #002623;
        --aleppo-gold: #bba97b;
        --aleppo-ink: #1e312b;
    }

    body.reports-app {
        background: #fff !important;
    }

    .medical-print-page {
        box-shadow: none !important;
    }
}


/* ------------------------- Aleppo Health Directorate refinements ------------------------- */
.reports-brand-mark {
    border-color: rgba(53, 130, 169, .18);
    background: linear-gradient(145deg, #ffffff, var(--aleppo-sage-soft));
    box-shadow: 0 12px 26px rgba(34, 93, 125, .13);
}

.reports-brand strong {
    color: var(--aleppo-emerald-deep);
}

.reports-brand small {
    color: #927c4f;
}

.reports-nav-link.active {
    background: linear-gradient(135deg, var(--aleppo-emerald-deep), var(--aleppo-emerald));
    box-shadow: 0 11px 25px rgba(53, 130, 169, .20);
}

.reports-nav-link.active::after {
    background: var(--aleppo-gold);
}

.btn-primary,
.primary-button {
    border-color: rgba(34, 93, 125, .72);
    background: linear-gradient(135deg, var(--aleppo-emerald), var(--aleppo-emerald-deep));
    box-shadow: 0 11px 25px rgba(53, 130, 169, .22);
}

.btn-primary:hover,
.primary-button:hover {
    box-shadow: 0 14px 30px rgba(53, 130, 169, .28);
}

.tool-button {
    border-color: var(--aleppo-emerald-deep) !important;
    background: var(--aleppo-emerald-deep) !important;
}

.tool-button:hover {
    border-color: var(--aleppo-gold) !important;
    background: var(--aleppo-gold) !important;
}

.reports-page-heading::before {
    background: linear-gradient(90deg, var(--aleppo-gold), var(--aleppo-emerald));
}

.reports-kicker,
.reports-panel-heading > div > span,
.reports-auth-kicker {
    color: var(--aleppo-emerald) !important;
}

.reports-hero {
    border-color: rgba(161, 207, 231, .25);
    background:
        radial-gradient(circle at 8% 12%, rgba(117, 192, 69, .25), transparent 27%),
        radial-gradient(circle at 96% 95%, rgba(161, 207, 231, .34), transparent 30%),
        linear-gradient(135deg, #003b36 0%, var(--aleppo-emerald-deep) 48%, #315b4d 100%);
    box-shadow: 0 22px 52px rgba(34, 93, 125, .20);
}

.reports-hero::after {
    border-color: rgba(117, 192, 69, .16);
}

.reports-hero-badge {
    color: #fbf7ed;
    border-color: rgba(117, 192, 69, .35);
    background: rgba(117, 192, 69, .18);
}

.reports-metric-primary {
    border-color: #e3dece !important;
    background: linear-gradient(150deg, #fff, #f8f5ed) !important;
}
.reports-metric-primary::before { background: var(--aleppo-emerald); }
.reports-metric-primary strong { color: var(--aleppo-emerald-deep); }
.reports-metric-success::before { background: var(--aleppo-gold); }
.reports-metric-success strong { color: #927c4f; }

.monthly-bar-track span,
.stats-bar-row i {
    background: linear-gradient(180deg, var(--aleppo-gold), var(--aleppo-emerald));
}

.record-form-intro {
    border-color: rgba(161, 207, 231, .22);
    background:
        radial-gradient(circle at 10% 10%, rgba(117, 192, 69, .22), transparent 30%),
        radial-gradient(circle at 90% 90%, rgba(161, 207, 231, .32), transparent 30%),
        linear-gradient(135deg, #003b36, #315b4d);
    box-shadow: 0 18px 42px rgba(34, 93, 125, .18);
}

.record-form-section-title > span,
.important-link-icon {
    background: linear-gradient(135deg, var(--aleppo-emerald), var(--aleppo-emerald-deep)) !important;
    box-shadow: 0 9px 20px rgba(53,130,169,.18);
}

.tab.active {
    background: linear-gradient(135deg, var(--aleppo-emerald-deep), var(--aleppo-emerald)) !important;
    box-shadow: 0 8px 18px rgba(53,130,169,.16);
}
.tab.active::after { background: var(--aleppo-gold); }

.pagination-current {
    border-color: var(--aleppo-emerald) !important;
    background: var(--aleppo-emerald) !important;
    box-shadow: inset 0 -3px 0 var(--aleppo-gold);
}

.loader-ring {
    border-color: #d9edf5;
    border-top-color: var(--aleppo-emerald);
    border-right-color: var(--aleppo-gold);
}

.reports-auth-intro::before {
    border-color: rgba(161, 207, 231, .18);
}

.reports-auth-emblem {
    width: 168px;
    height: 168px;
    padding: 10px;
    border-color: rgba(53, 130, 169, .18);
    background: linear-gradient(145deg, #fff, #f1f6f2);
    box-shadow: 0 20px 45px rgba(34, 93, 125, .14);
}

.reports-auth-card {
    border-color: var(--aleppo-line);
    box-shadow: 0 24px 64px rgba(34, 93, 125, .12);
}

.reports-auth-card::before {
    background: linear-gradient(90deg, var(--aleppo-gold), var(--aleppo-sage), var(--aleppo-emerald));
}

.reports-footer::before {
    background: linear-gradient(90deg, var(--aleppo-gold), var(--aleppo-sage), var(--aleppo-emerald));
}

.medical-print-header {
    border-bottom-color: var(--aleppo-emerald) !important;
}

.print-logo {
    width: 86px !important;
    height: 86px !important;
    padding: 5px !important;
    border: 1px solid #ddd7c7 !important;
    border-radius: 16px !important;
    overflow: hidden;
    background: #fff !important;
}

.print-logo img {
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
}

.report-title {
    color: var(--aleppo-emerald-deep) !important;
}

@media (max-width: 600px) {
    .reports-auth-emblem {
        width: 132px;
        height: 132px;
    }
}

@media print {
    :root {
        --aleppo-emerald: #002623;
        --aleppo-gold: #bba97b;
        --aleppo-ink: #1e312b;
    }
}


/* =========================================================
   Aleppo Health Directorate / Children Hospital refinements
   ========================================================= */
body.reports-app,
body.reports-auth-body {
    background:
        radial-gradient(circle at 92% -10%, rgba(187, 169, 123, .14), transparent 30%),
        radial-gradient(circle at 4% 8%, rgba(0, 38, 35, .07), transparent 32%),
        linear-gradient(180deg, #fbfaf6 0%, var(--aleppo-bg) 52%, #f0f3ee 100%);
}

.reports-topbar {
    background: rgba(255, 255, 252, .975);
    border-bottom-color: rgba(187, 169, 123, .34);
}
.reports-topbar::after {
    height: 3px;
    background: linear-gradient(90deg, var(--aleppo-emerald) 0 65%, var(--aleppo-gold) 65% 100%);
}
.reports-brand-mark {
    overflow: hidden;
    border-color: rgba(187, 169, 123, .42);
    background: var(--aleppo-emerald);
    box-shadow: 0 12px 28px rgba(0,38,35,.15);
}
.reports-brand-mark img {
    width: 166%;
    height: 166%;
    max-width: none;
    object-fit: cover;
    object-position: 50% 22%;
    transform: translateY(-11%);
}
.reports-brand strong { color: var(--aleppo-emerald); }
.reports-brand small { color: var(--aleppo-gold-deep); }

.reports-nav-link.active,
.tab.active {
    background: linear-gradient(135deg, var(--aleppo-emerald), #0d423b) !important;
    box-shadow: 0 10px 24px rgba(0,38,35,.18) !important;
}
.reports-nav-link.active::after,
.tab.active::after { background: var(--aleppo-gold) !important; }
.reports-nav-link:hover,
.tab:hover { color: var(--aleppo-emerald) !important; background: var(--aleppo-gold-soft) !important; }

.btn-primary,
.primary-button {
    border-color: var(--aleppo-emerald) !important;
    background: linear-gradient(135deg, var(--aleppo-emerald), #0b443d) !important;
    box-shadow: 0 11px 25px rgba(0,38,35,.18) !important;
}
.btn-primary:hover,
.primary-button:hover {
    border-color: var(--aleppo-gold-deep) !important;
    background: linear-gradient(135deg, #0b443d, var(--aleppo-emerald)) !important;
    box-shadow: 0 14px 30px rgba(0,38,35,.24) !important;
}
.tool-button {
    border-color: var(--aleppo-emerald) !important;
    background: var(--aleppo-emerald) !important;
}
.tool-button:hover {
    border-color: var(--aleppo-gold-deep) !important;
    color: var(--aleppo-emerald) !important;
    background: var(--aleppo-gold) !important;
}

.reports-page-heading::before {
    width: 120px;
    background: linear-gradient(90deg, var(--aleppo-emerald), var(--aleppo-gold));
}
.reports-kicker,
.reports-panel-heading > div > span,
.reports-auth-kicker { color: var(--aleppo-gold-deep) !important; }

.reports-hero,
.record-form-intro {
    border-color: rgba(187,169,123,.32) !important;
    background:
        radial-gradient(circle at 9% 12%, rgba(187,169,123,.20), transparent 27%),
        radial-gradient(circle at 95% 90%, rgba(220,231,223,.16), transparent 31%),
        linear-gradient(135deg, #001c1a 0%, var(--aleppo-emerald) 52%, #0d423b 100%) !important;
    box-shadow: 0 22px 52px rgba(0,38,35,.20) !important;
}
.reports-hero-badge {
    color: #fffaf0 !important;
    border-color: rgba(187,169,123,.46) !important;
    background: rgba(187,169,123,.17) !important;
}
.reports-hero::after { border-color: rgba(187,169,123,.18) !important; }

.reports-metric-primary::before,
.record-form-section-title > span,
.important-link-icon {
    background: linear-gradient(135deg, var(--aleppo-emerald), #0d423b) !important;
}
.reports-metric-primary strong { color: var(--aleppo-emerald) !important; }
.reports-metric-success::before { background: var(--aleppo-success) !important; }
.reports-metric-success strong { color: var(--aleppo-success) !important; }
.reports-metric-warning::before { background: var(--aleppo-gold) !important; }

input:focus,
select:focus,
textarea:focus {
    border-color: var(--aleppo-gold-deep) !important;
    box-shadow: 0 0 0 4px rgba(187,169,123,.16) !important;
}
input[type="checkbox"], input[type="radio"] { accent-color: var(--aleppo-emerald); }

.reports-table th {
    color: var(--aleppo-emerald) !important;
    border-bottom-color: #ded8c9 !important;
    background: linear-gradient(180deg, #f7f3e9, #f1eee5) !important;
}
.record-row:hover { border-color: rgba(187,169,123,.42) !important; background: #fbf8f0 !important; }
.record-number,
.table-serial { color: var(--aleppo-emerald) !important; background: var(--aleppo-gold-soft) !important; }

.important-link-card {
    background: radial-gradient(circle at top left, rgba(187,169,123,.22), transparent 42%), #fff !important;
}
.important-link-card:hover { border-color: rgba(187,169,123,.60) !important; }
.important-link-footer,
.important-link-arrow,
.important-links-count { color: var(--aleppo-gold-deep) !important; }
.important-link-arrow,
.important-links-count { background: var(--aleppo-gold-soft) !important; }
.important-link-card:hover .important-link-arrow { color:#fff !important; background: var(--aleppo-emerald) !important; }

.pagination-current {
    border-color: var(--aleppo-emerald) !important;
    background: var(--aleppo-emerald) !important;
    box-shadow: inset 0 -3px 0 var(--aleppo-gold) !important;
}
.pagination-button:hover,
.pagination-number:hover {
    border-color: rgba(187,169,123,.62) !important;
    color: var(--aleppo-emerald) !important;
    background: var(--aleppo-gold-soft) !important;
}

.loader-ring {
    border-color: #e7e0d1 !important;
    border-top-color: var(--aleppo-emerald) !important;
    border-right-color: var(--aleppo-gold) !important;
}
.loader-title { color: var(--aleppo-emerald) !important; }

.reports-auth-emblem {
    width: 190px;
    height: 190px;
    padding: 7px;
    border-color: rgba(187,169,123,.50) !important;
    background: var(--aleppo-emerald) !important;
    box-shadow: 0 20px 48px rgba(0,38,35,.18) !important;
}
.reports-auth-emblem img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    border-radius: 25px;
}
.reports-auth-intro::before { border-color: rgba(187,169,123,.10) !important; }
.reports-auth-intro h1 { color: var(--aleppo-emerald) !important; }
.reports-auth-features span {
    border-color: rgba(187,169,123,.34) !important;
    color: var(--aleppo-emerald) !important;
    background: #fffdf8 !important;
}
.reports-auth-card {
    border-color: rgba(187,169,123,.36) !important;
    box-shadow: 0 24px 64px rgba(0,38,35,.11) !important;
}
.reports-auth-card::before {
    background: linear-gradient(90deg, var(--aleppo-emerald), var(--aleppo-gold), var(--aleppo-emerald)) !important;
}

.reports-user-avatar {
    color: var(--aleppo-gold-deep) !important;
    border-color: rgba(187,169,123,.30) !important;
    background: var(--aleppo-gold-soft) !important;
}

.reports-footer::before {
    background: linear-gradient(90deg, var(--aleppo-emerald), var(--aleppo-gold), var(--aleppo-emerald)) !important;
}

.medical-print-header { border-bottom-color: var(--aleppo-gold) !important; }
.medical-print-header .print-logo {
    border-color: #ded8c9 !important;
    background: var(--aleppo-emerald) !important;
}
.report-title { color: var(--aleppo-emerald) !important; }
.print-section h3,
.print-table th,
.print-info-grid span { color: var(--aleppo-gold-deep) !important; }

@media (max-width: 600px) {
    .reports-auth-emblem { width: 142px; height: 142px; }
}

@media print {
    :root {
        --aleppo-emerald: #002623;
        --aleppo-gold: #bba97b;
        --aleppo-ink: #1e312b;
    }
}