@font-face {
    font-family: 'Cairo';
    src: url('/fonts/Cairo-Regular.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Cairo';
    src: url('/fonts/Cairo-Light.ttf') format('truetype');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Cairo';
    src: url('/fonts/Cairo-Medium.ttf') format('truetype');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Cairo';
    src: url('/fonts/Cairo-SemiBold.ttf') format('truetype');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Cairo';
    src: url('/fonts/Cairo-Bold.ttf') format('truetype');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Cairo';
    src: url('/fonts/Cairo-ExtraBold.ttf') format('truetype');
    font-weight: 800;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Cairo';
    src: url('/fonts/Cairo-Black.ttf') format('truetype');
    font-weight: 900;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Cairo';
    src: url('/fonts/Cairo-ExtraLight.ttf') format('truetype');
    font-weight: 200;
    font-style: normal;
    font-display: swap;
}

/* ═══════════════════════════════════════════════
   الثيم الطبي الموحد — أزرق طبي وأبيض
   ═══════════════════════════════════════════════ */

:root {
    /* ══════ لوحة الأزرق الطبي المعتمد (Medical Blue System) ══════ */
    --dc-primary:          #0284c7;
    --dc-primary-dark:     #0369a1;
    --dc-primary-darker:   #075985;
    --dc-primary-light:    #e0f2fe;
    --dc-primary-subtle:   #f0f9ff;
    --dc-primary-glow:     rgba(2, 132, 199, 0.25);
    --dc-primary-rgb:      2, 132, 199;

    /* تدرجات السماء الطبية (Sky Scale) */
    --dc-sky-50:           #f0f9ff;
    --dc-sky-100:          #e0f2fe;
    --dc-sky-200:          #bae6fd;
    --dc-sky-500:          #0284c7;
    --dc-sky-600:          #0284c7;
    --dc-sky-700:          #0369a1;
    --dc-sky-900:          #075985;

    /* ══════ النصوص ودرجات التباين (Typography & Ink) ══════ */
    --dc-text-primary:     #0f172a;
    --dc-text-secondary:   #334155;
    --dc-text-muted:       #64748b;
    --dc-text-faint:       #94a3b8;
    --dc-ink:              #0f172a;
    --dc-ink-soft:         #334155;
    --dc-muted:            #64748b;
    --dc-faint:            #94a3b8;

    /* ══════ الأسطح والخلفيات (Surfaces & Canvas) ══════ */
    --dc-white:            #ffffff;
    --dc-surface:          #ffffff;
    --dc-surface-subtle:   #fafafa;
    --dc-surface-card:     #ffffff;
    --dc-surface-hover:    #f1f5f9;
    --dc-canvas:           #f8fafc;
    --dc-app-bg:           #f8fafc;

    /* درجات الرمادي المحايدة (Neutral Grays) */
    --dc-gray-50:          #fafafa;
    --dc-gray-100:         #f5f5f5;
    --dc-gray-200:         #e5e5e5;
    --dc-gray-300:         #d4d4d4;
    --dc-gray-400:         #a3a3a3;
    --dc-gray-500:         #737373;
    --dc-gray-600:         #525252;
    --dc-gray-700:         #404040;
    --dc-gray-800:         #262626;
    --dc-gray-900:         #171717;

    /* ══════ الحدود والفواصل (Lines & Borders) ══════ */
    --dc-line:             #e2e8f0;
    --dc-line-subtle:      #e5e5e5;
    --dc-line-strong:      #cbd5e1;
    --dc-border:           #e2e8f0;
    --dc-border-subtle:    #e5e5e5;
    --dc-border-strong:    #cbd5e1;

    /* ══════ الحالات والإشعارات (Semantic Statuses) ══════ */
    /* حالة النجاح (Success / Green) */
    --dc-success:          #16a34a;
    --dc-success-dark:     #166534;
    --dc-success-light:    #f0fdf4;
    --dc-success-border:   #bbf7d0;

    /* حالة الخطر / الحذف (Danger / Red) */
    --dc-danger:           #dc2626;
    --dc-danger-dark:      #991b1b;
    --dc-danger-light:     #fef2f2;
    --dc-danger-border:    #fecaca;

    /* حالة التحذير (Warning / Amber) */
    --dc-warning:          #d97706;
    --dc-warning-dark:     #92400e;
    --dc-warning-light:    #fffbeb;
    --dc-warning-border:   #fde68a;

    /* حالة المعلومات (Info / Medical Cyan) */
    --dc-info:             #0284c7;
    --dc-info-light:       #e0f2fe;
    --dc-info-border:      #bae6fd;

    /* ══════ القائمة الجانبية (Sidebar) ══════ */
    --dc-sidebar-bg:       #0f172a;
    --dc-sidebar-text:     #f8fafc;
    --dc-sidebar-border:   #1e293b;
    --dc-sidebar-hover:    #1e293b;

    /* ══════ أدوار دلالية وتركيز (Semantic & Focus) ══════ */
    --dc-accent:           var(--dc-primary);
    --dc-accent-soft:      var(--dc-primary-light);
    --dc-focus:            rgba(2, 132, 199, 0.28);

    /* ══════ الظلال والانحناءات (Shadows & Radii) ══════ */
    --dc-radius-xs:        4px;
    --dc-radius-sm:        6px;
    --dc-radius-md:        10px;
    --dc-radius-lg:        14px;
    --dc-radius-xl:        20px;
    --dc-radius-full:      9999px;

    --dc-shadow-sm:        0 1px 3px rgba(0, 0, 0, 0.05);
    --dc-shadow-md:        0 4px 12px rgba(15, 23, 42, 0.07);
    --dc-shadow-lg:        0 10px 25px -5px rgba(15, 23, 42, 0.1);

    /* ══════ ألوان Bootstrap التوافقية ══════ */
    --bs-blue: #0284c7;
    --bs-primary: #0284c7;
    --bs-primary-rgb: 2, 132, 199;
    --bs-secondary: #475569;
    --bs-secondary-rgb: 71, 85, 105;
    --bs-link-color: #0284c7;
    --bs-link-color-rgb: 2, 132, 199;
    --bs-link-hover-color: #0369a1;
    --bs-link-hover-color-rgb: 3, 105, 161;
    --bs-focus-ring-color: rgba(2, 132, 199, 0.28);
    --bs-focus-ring-width: 0.25rem;
    --bs-border-color: #e2e8f0;
    --bs-body-color: #0f172a;
    --bs-body-bg: #f8fafc;
    --bs-emphasis-color: #0f172a;
}

html, body {
    font-family: 'Cairo', 'Helvetica Neue', Helvetica, Arial, sans-serif;
    color: var(--dc-ink);
    background: var(--dc-canvas);
}

/* ═══ الروابط ═══ */
a, .btn-link {
    color: var(--dc-sky-600);
    text-decoration: none;
    transition: color 0.15s;
}

a:hover, .btn-link:hover {
    color: var(--dc-sky-700);
    text-decoration: underline;
}

a:focus, .btn-link:focus {
    color: var(--dc-sky-700);
    outline: 2px solid var(--dc-sky-500);
    outline-offset: 2px;
    text-decoration: none;
}

/* ═══ التناسب مع مقاسات الشاشات ═══
   من لابتوب 14 بوصة (1366×768) حتى شاشة 24 بوصة (1920×1080) وما بعدها.
   قواعد عامة حتى تسري على الصفحات التي تعرّف تنسيقاتها داخل مكوّناتها. */

@media (min-width: 1600px) {
    .container, .container-fluid, .container-lg, .container-xl {
        max-width: 1560px;
        margin-inline: auto;
    }
}

@media (max-width: 1366px) {
    html { font-size: 15px; }
}

@media (max-width: 1100px) {
    html { font-size: 14.5px; }
}

@media (max-width: 900px) {
    html { font-size: 14px; }
}

@media (max-width: 768px) {
    .table-responsive, .clinical-table-wrap, .plan-table-wrap, .lines-table-wrap {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    table { font-size: 0.92rem; }

    .row > [class*='col-'] { margin-bottom: 0.75rem; }
}

@media (max-width: 576px) {
    html { font-size: 13.5px; }

    h1, .h1 { font-size: 1.45rem; }
    h2, .h2 { font-size: 1.25rem; }
    h3, .h3 { font-size: 1.1rem; }

    .card, .clinical-card { border-radius: 10px; }
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: 0.01ms !important;
        transition-duration: 0.01ms !important;
    }
}

a:active, .btn-link:active {
    color: #000000;
}

a.active, .nav-link.active {
    color: var(--dc-text-primary) !important;
    font-weight: 700;
}

/* ═══ Buttons — Primary ═══ */
.btn-primary {
    color: var(--dc-white, #ffffff);
    background-color: var(--dc-primary, var(--dc-primary));
    border-color: var(--dc-primary, var(--dc-primary));
    transition: all 0.15s;
}

.btn-primary:hover {
    color: var(--dc-white, #ffffff);
    background-color: var(--dc-primary-dark, var(--dc-primary-dark));
    border-color: var(--dc-primary-dark, var(--dc-primary-dark));
}

.btn-primary:focus,
.btn-primary.focus {
    color: var(--dc-white, #ffffff);
    background-color: var(--dc-primary-dark, var(--dc-primary-dark));
    border-color: var(--dc-primary-dark, var(--dc-primary-dark));
    box-shadow: 0 0 0 0.25rem rgba(115, 115, 115, 0.25);
}

.btn-primary:active,
.btn-primary.active,
.btn-primary:first-child:active,
.show > .btn-primary.dropdown-toggle {
    color: var(--dc-white, #ffffff) !important;
    background-color: #000000 !important;
    border-color: #000000 !important;
}

.btn-primary:disabled,
.btn-primary.disabled {
    color: var(--dc-white, #ffffff);
    background-color: var(--dc-text-faint);
    border-color: var(--dc-text-faint);
}

/* ═══ Buttons — Outline Primary ═══ */
.btn-outline-primary {
    color: var(--dc-primary, var(--dc-primary));
    border-color: var(--dc-primary, var(--dc-primary));
    background-color: transparent;
}

.btn-outline-primary:hover,
.btn-outline-primary:focus,
.btn-outline-primary:active,
.btn-outline-primary.active {
    color: var(--dc-white, #ffffff) !important;
    background-color: var(--dc-primary, var(--dc-primary)) !important;
    border-color: var(--dc-primary, var(--dc-primary)) !important;
    box-shadow: 0 0 0 0.25rem rgba(115, 115, 115, 0.25);
}

/* ═══ Buttons — Secondary ═══ */
.btn-secondary {
    color: var(--dc-text-primary);
    background-color: var(--dc-gray-100);
    border-color: var(--dc-line-strong);
}

.btn-secondary:hover,
.btn-secondary:focus,
.btn-secondary:active {
    color: var(--dc-text-primary) !important;
    background-color: var(--dc-line-subtle) !important;
    border-color: var(--dc-line-strong) !important;
    box-shadow: 0 0 0 0.25rem rgba(115, 115, 115, 0.15);
}

/* ═══ All buttons focus ring — gray ═══ */
.btn:focus,
.btn:active:focus,
.btn-link.nav-link:focus,
.form-control:focus,
.form-select:focus,
.form-check-input:focus {
    box-shadow: 0 0 0 0.1rem #ffffff, 0 0 0 0.25rem var(--dc-text-faint);
    outline: none;
}

/* ═══ Inputs / Textareas / Selects ═══ */
.form-control,
.form-select,
input[type="text"],
input[type="email"],
input[type="number"],
input[type="password"],
input[type="date"],
input[type="time"],
input[type="datetime-local"],
input[type="search"],
textarea,
select {
    color: var(--dc-text-primary);
    background-color: var(--dc-surface);
    border-color: var(--dc-line-strong);
}

.form-control:focus,
.form-select:focus,
input:focus,
textarea:focus,
select:focus {
    color: var(--dc-text-primary);
    background-color: var(--dc-surface);
    border-color: var(--dc-primary, var(--dc-primary));
    box-shadow: 0 0 0 0.25rem rgba(115, 115, 115, 0.12);
    outline: none;
}

.form-control::placeholder,
input::placeholder,
textarea::placeholder {
    color: var(--dc-text-faint);
}

/* ═══ Checkboxes & Radios ═══ */
.form-check-input:checked {
    background-color: var(--dc-primary, var(--dc-primary));
    border-color: var(--dc-primary, var(--dc-primary));
}

.form-check-input:focus {
    border-color: var(--dc-primary, var(--dc-primary));
    box-shadow: 0 0 0 0.25rem rgba(115, 115, 115, 0.15);
}

.form-check-input:active {
    filter: brightness(90%);
}

/* ═══ Selects ═══ */
select,
select option {
    color: var(--dc-text-primary) !important;
    background-color: var(--dc-surface) !important;
}

select option {
    padding: 8px 12px;
}

select option:checked {
    background: var(--dc-primary, var(--dc-primary)) linear-gradient(0deg, var(--dc-text-secondary) 0%, var(--dc-text-secondary) 100%) !important;
    color: var(--dc-white, #ffffff) !important;
}

@-moz-document url-prefix() {
    select,
    select option {
        color: var(--dc-text-primary) !important;
        background-color: var(--dc-surface) !important;
    }
}

/* ═══ Global focus outline — kill blue everywhere ═══ */
*:focus {
    outline-color: var(--dc-primary, var(--dc-primary));
}

*:focus-visible {
    outline-color: var(--dc-primary, var(--dc-primary));
}

/* ═══ Selection highlight ═══ */
::selection {
    background: var(--dc-line-strong);
    color: var(--dc-text-primary);
}

::-moz-selection {
    background: var(--dc-line-strong);
    color: var(--dc-text-primary);
}

/* ═══ Validation ═══ */
.valid.modified:not([type=checkbox]) {
    outline: 1px solid var(--dc-text-primary);
}

.invalid {
    outline: 1px solid var(--dc-text-secondary);
}

.validation-message {
    color: var(--dc-text-primary);
    font-weight: 600;
}

/* ═══ Content / Headings ═══ */
.content {
    padding-top: 1.1rem;
}

h1:focus {
    outline: none;
}

/* ═══ Error boundary ═══ */
.blazor-error-boundary {
    background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTYiIGhlaWdodD0iNDkiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIG92ZXJmbG93PSJoaWRkZW4iPjxkZWZzPjxjbGlwUGF0aCBpZD0iY2xpcDAiPjxyZWN0IHg9IjIzNSIgeT0iNTEiIHdpZHRoPSI1NiIgaGVpZ2h0PSI0OSIvPjwvY2xpcFBhdGg+PC9kZWZzPjxnIGNsaXAtcGF0aD0idXJsKCNjbGlwMCkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0yMzUgLTUxKSI+PHBhdGggZD0iTTI2My41MDYgNTFDMjY0LjcxNyA1MSAyNjUuODEzIDUxLjQ4MzcgMjY2LjYwNiA1Mi4yNjU4TDI2Ny4wNTIgNTIuNzk4NyAyNjcuNTM5IDUzLjYyODMgMjkwLjE4NSA5Mi4xODMxIDI5MC41NDUgOTIuNzk1IDI5MC42NTYgOTIuOTk2QzI5MC44NzcgOTMuNTEzIDI5MSA5NC4wODE1IDI5MSA5NC42NzgyIDI5MSA5Ny4wNjUxIDI4OS4wMzggOTkgMjg2LjYxNyA5OUwyNDAuMzgzIDk5QzIzNy45NjMgOTkgMjM2IDk3LjA2NTEgMjM2IDk0LjY3ODIgMjM2IDk0LjM3OTkgMjM2LjAzMSA5NC4wODg2IDIzNi4wODkgOTMuODA3MkwyMzYuMzM4IDkzLjAxNjIgMjM2Ljg1OCA5Mi4xMzE0IDI1OS40NzMgNTMuNjI5NCAyNTkuOTYxIDUyLjc5ODUgMjYwLjQwNyA1Mi4yNjU4QzI2MS4yIDUxLjQ4MzcgMjYyLjI5NiA1MSAyNjMuNTA2IDUxWk0yNjMuNTg2IDY2LjAxODNDMjYwLjczNyA2Ni4wMTgzIDI1OS4zMTMgNjcuMTI0NSAyNTkuMzEzIDY5LjMzNyAyNTkuMzEzIDY5LjYxMDIgMjU5LjMzMiA2OS44NjA4IDI1OS4zNzEgNzAuMDg4N0wyNjEuNzk1IDg0LjAxNjEgMjY1LjM4IDg0LjAxNjEgMjY3LjgyMSA2OS43NDc1QzI2Ny44NiA2OS43MzA5IDI2Ny44NzkgNjkuNTg3NyAyNjcuODc5IDY5LjMxNzkgMjY3Ljg3OSA2Ny4xMTgyIDI2Ni40NDggNjYuMDE4MyAyNjMuNTg2IDY2LjAxODNaTTI2My41NzYgODYuMDU0N0MyNjEuMDQ5IDg2LjA1NDcgMjU5Ljc4NiA4Ny4zMDA1IDI1OS43ODYgODkuNzkyMSAyNTkuNzg2IDkyLjI4MzcgMjYxLjA0OSA5My41Mjk1IDI2My41NzYgOTMuNTI5NSAyNjYuMTE2IDkzLjUyOTUgMjY3LjM4NyA5Mi4yODM3IDI2Ny4zODcgODkuNzkyMSAyNjcuMzg3IDg3LjMwMDUgMjY2LjExNiA4Ni4wNTQ3IDI2My41NzYgODYuMDU0N1oiIGZpbGw9IiNGRkU1MDAiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPjwvZz48L3N2Zz4=) no-repeat 1rem/1.8rem, var(--dc-text-secondary);
    padding: 1rem 1rem 1rem 3.7rem;
    color: var(--dc-white, #ffffff);
}

.blazor-error-boundary::after {
    content: "An error has occurred."
}

/* ═══ Misc ═══ */
.darker-border-checkbox.form-check-input {
    border-color: var(--dc-text-faint);
}

/* ═══ Kill any remaining default blue link states ═══ */
*:any-link:active,
*:any-link:focus,
a:-webkit-any-link {
    color: var(--dc-text-primary);
}

/* ═══ Alert classes (Bootstrap) — gray shades ═══ */
.alert-primary {
    color: var(--dc-text-primary);
    background-color: var(--dc-gray-100);
    border-color: var(--dc-line-strong);
}

.alert-info {
    color: var(--dc-text-primary);
    background-color: var(--dc-gray-50);
    border-color: var(--dc-line-strong);
}

/* ═══ Badge ═══ */
.badge.bg-primary {
    background-color: var(--dc-primary, var(--dc-primary)) !important;
}

.badge.bg-secondary {
    background-color: var(--dc-text-primary) !important;
}

/* ═══ Progress bar ═══ */
.progress-bar {
    background-color: var(--dc-primary, var(--dc-primary));
}

/* ═══ Pagination ═══ */
.page-link {
    color: var(--dc-text-primary);
}

.page-link:hover {
    color: var(--dc-text-primary);
    background-color: var(--dc-gray-100);
}

.page-item.active .page-link {
    background-color: var(--dc-primary, var(--dc-primary));
    border-color: var(--dc-primary, var(--dc-primary));
    color: var(--dc-white, #ffffff);
}

.page-link:focus {
    box-shadow: 0 0 0 0.25rem rgba(115, 115, 115, 0.25);
}

.icon {
    display: inline-block;
    vertical-align: -0.125em;
    flex-shrink: 0;
}

.nav-icon .icon {
    width: 19px;
    height: 19px;
}

:root { --ui-scale: 1; }

.content-area {
    zoom: var(--ui-scale, 1);
}

@media print {
    .content-area { zoom: 1; }
}


.table-wrap,
.table-container,
.table-responsive {
    max-width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

@media (max-width: 1024px) {
    .range-tabs,
    .filter-tabs,
    .tabs,
    .settings-tabs {
        display: flex !important;
        flex-wrap: nowrap !important;
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch !important;
        scrollbar-width: none !important;
        -ms-overflow-style: none !important;
        padding-bottom: 4px !important;
        max-width: 100% !important;
    }

    .range-tabs::-webkit-scrollbar,
    .filter-tabs::-webkit-scrollbar,
    .tabs::-webkit-scrollbar,
    .settings-tabs::-webkit-scrollbar {
        display: none !important;
    }

    .range-btn,
    .filter-btn,
    .tab,
    .settings-tab {
        flex-shrink: 0 !important;
        white-space: nowrap !important;
    }
}

@media (min-width: 641px) and (max-width: 1024px) {
    .content-area {
        padding: 16px 20px !important;
    }

    .cards-grid {
        grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)) !important;
        gap: 14px !important;
    }

    .stats-grid {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 12px !important;
    }

    .form-grid {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 14px !important;
    }

    .modal-box,
    .modal-content,
    .action-modal-box {
        width: 85vw !important;
        max-width: 600px !important;
    }
}

@media (max-width: 640px) {
    .page-header {
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 12px !important;
    }

    .header-actions {
        width: 100% !important;
        display: flex !important;
        flex-wrap: wrap !important;
        gap: 8px !important;
    }

    .header-actions > * {
        flex: 1 !important;
        text-align: center !important;
        justify-content: center !important;
    }

    .toolbar {
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 10px !important;
    }

    .search-box {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
    }

    .form-grid {
        grid-template-columns: 1fr !important;
        gap: 12px !important;
    }

    .form-actions {
        flex-direction: column !important;
        padding: 14px 16px !important;
    }

    .form-actions button,
    .form-actions a {
        width: 100% !important;
        justify-content: center !important;
        text-align: center !important;
    }

    .modal-overlay {
        padding: 8px !important;
    }

    .modal-box,
    .modal-content,
    .action-modal-box {
        width: 95vw !important;
        max-width: 95vw !important;
        margin: 8px auto !important;
    }

    .cards-grid {
        grid-template-columns: 1fr !important;
    }

    .stats-grid {
        grid-template-columns: 1fr !important;
    }
}


/* ══════════════════════════════════════════════════════════════════
   الثيم الطبي الموحد — الأزرق الطبي الحديث (Clinical Medical Blue)
   ══════════════════════════════════════════════════════════════════ */

:root {
    /* لوحة الأزرق الطبي المعتمد */
    --dc-primary: var(--dc-primary);
    --dc-primary-dark: var(--dc-primary-dark);
    --dc-primary-light: var(--dc-primary-light);
    --dc-primary-glow: rgba(2, 132, 199, 0.25);
    
    /* الأسطح والخلفيات */
    --dc-app-bg: var(--dc-app-bg);
    --dc-canvas: var(--dc-app-bg);
    --dc-surface: #ffffff;
    --dc-line: var(--dc-line);
    --dc-line-strong: var(--dc-line-strong);

    /* القائمة الجانبية (Sidebar) */
    --dc-sidebar-bg: var(--dc-ink);
    --dc-sidebar-text: var(--dc-app-bg);
    --dc-sidebar-border: #1e293b;
    --dc-sidebar-hover: #1e293b;

    /* النصوص */
    --dc-text-primary: var(--dc-ink);
    --dc-text-secondary: var(--dc-ink-soft);
    --dc-text-muted: var(--dc-muted);
    --dc-ink: var(--dc-ink);
    --dc-muted: var(--dc-muted);

    /* ألوان Bootstrap التوافقية */
    --bs-primary: var(--dc-primary);
    --bs-primary-rgb: 2, 132, 199;
    --bs-link-color: var(--dc-primary);
    --bs-link-hover-color: var(--dc-primary-dark);
    --dc-accent: var(--dc-primary);
}

/* ══════════════════════════════════════════════════════════════════
   تطبيق الثيم الطبي الموحد على كامل واجهات النظام
   ══════════════════════════════════════════════════════════════════ */

/* الخلفيات والحاويات */
body, .app-container, .main-content, .content-area {
    background: var(--dc-app-bg) !important;
}

/* القائمة الجانبية (Sidebar) */
.sidebar {
    background: var(--dc-sidebar-bg) !important;
    border-left-color: var(--dc-sidebar-border) !important;
    color: var(--dc-sidebar-text) !important;
}
.brand-name {
    color: var(--dc-sidebar-text) !important;
}
.brand-sub {
    color: var(--dc-sidebar-text) !important;
    opacity: 0.75;
}
.nav-item {
    color: var(--dc-sidebar-text) !important;
    opacity: 0.9;
}
.nav-item:hover {
    background: var(--dc-sidebar-hover) !important;
    color: var(--dc-white, #ffffff) !important;
    opacity: 1;
}
.nav-item.active {
    background: var(--dc-primary) !important;
    border-color: var(--dc-primary) !important;
    color: var(--dc-white, #ffffff) !important;
    box-shadow: 0 4px 14px var(--dc-primary-glow) !important;
    opacity: 1;
}
.nav-item.active svg {
    color: var(--dc-white, #ffffff) !important;
}

/* الأزرار الرئيسية في كامل البرنامج */
.btn-primary, button.btn-primary, a.btn-primary,
.btn-save, .btn-submit, .btn-add, .btn-new, .settings-btn-add,
.btn-login, .chart-link, .topbar-btn-save,
.btn-presc-save, .btn-apply,
button[type="submit"]:not(.btn-danger):not(.btn-secondary) {
    background: var(--dc-primary) !important;
    border-color: var(--dc-primary) !important;
    color: var(--dc-white, #ffffff) !important;
    box-shadow: 0 2px 8px var(--dc-primary-glow) !important;
}

.btn-primary:hover, button.btn-primary:hover, a.btn-primary:hover,
.btn-save:hover, .btn-submit:hover, .btn-add:hover, .btn-new:hover, .settings-btn-add:hover,
.btn-login:hover, .chart-link:hover, .topbar-btn-save:hover,
.btn-presc-save:hover, .btn-apply:hover,
button[type="submit"]:not(.btn-danger):not(.btn-secondary):hover {
    background: var(--dc-primary-dark) !important;
    border-color: var(--dc-primary-dark) !important;
}

/* أزرار الإجراءات في الهيدر */
.settings-header a, .page-header a.btn-action, .header-action-btn {
    background: var(--dc-primary) !important;
    color: var(--dc-white, #ffffff) !important;
    box-shadow: 0 2px 8px var(--dc-primary-glow) !important;
}

/* التبويبات النشطة (Tabs) */
.stmt-tab-btn.active,
.nav-tabs .nav-link.active,
.tab-btn.active,
.about-btn.active {
    color: var(--dc-primary) !important;
    border-bottom: 3px solid var(--dc-primary) !important;
    font-weight: 800 !important;
}

/* العناوين والأيقونات */
h1, h2, h3, h4, h5,
.page-header h1, .settings-header h1 {
    color: var(--dc-text-primary, var(--dc-ink));
}
h1 svg, h2 svg, h3 svg,
.settings-header h1 svg,
.page-header h1 svg,
.head-icon svg,
.brand-icon svg,
.card-icon svg {
    color: var(--dc-primary);
}

/* الجداول */
table thead th, .table thead th, .table th, th {
    background: var(--dc-primary-light, var(--dc-primary-light)) !important;
    color: var(--dc-primary-dark, var(--dc-primary-dark)) !important;
    border-bottom: 2px solid var(--dc-primary) !important;
}

/* حقول الإدخال والتركيز */
input:focus, select:focus, textarea:focus, .form-control:focus, .presc-input:focus, .settings-input:focus {
    border-color: var(--dc-primary) !important;
    box-shadow: 0 0 0 3px var(--dc-primary-glow) !important;
    outline: none !important;
}
input[type="checkbox"], input[type="radio"], input[type="range"] {
    accent-color: var(--dc-primary) !important;
}

/* الشارات والأوسمة التفاعلية */
.pick-chip.selected, .chip.active, .badge-primary, .tag-primary {
    background: var(--dc-primary) !important;
    color: var(--dc-white, #ffffff) !important;
    border-color: var(--dc-primary) !important;
}

/* الكروت والقوائم */
.card, .settings-card, .statement-card, .kpi-card {
    background: var(--dc-surface, #ffffff);
    border-color: var(--dc-line, var(--dc-line));
}

/* ══════════════════════════════════════════════════════════════════
   التطبيق الشامل والملزم للثيم الطبي على كافة أزرار وعناصر الشاشات
   ══════════════════════════════════════════════════════════════════ */

/* كافة الأزرار الأساسية في كل صفحات النظام */
.btn-primary, .btn-add, .btn-save, .btn-submit, .btn-open, .btn-new,
.btn-action, .btn-create, .btn-pay, .topbar-btn-save, .btn-presc-save, .btn-apply,
.btn-save-invoice, .btn-mini, .btn-primary-sm, .settings-btn-add, .btn-prescription {
    background: var(--dc-primary) !important;
    background-color: var(--dc-primary) !important;
    border-color: var(--dc-primary) !important;
    color: var(--dc-white, #ffffff) !important;
    box-shadow: 0 2px 8px var(--dc-primary-glow) !important;
}

.btn-primary:hover, .btn-add:hover, .btn-save:hover, .btn-submit:hover,
.btn-open:hover, .btn-new:hover, .btn-action:hover, .btn-create:hover, .btn-pay:hover,
.topbar-btn-save:hover, .btn-presc-save:hover, .btn-apply:hover,
.btn-save-invoice:hover, .btn-mini:hover, .btn-primary-sm:hover, .settings-btn-add:hover, .btn-prescription:hover,
.btn-primary:hover:not(:disabled), .btn-add:hover:not(:disabled) {
    background: var(--dc-primary-dark) !important;
    background-color: var(--dc-primary-dark) !important;
    border-color: var(--dc-primary-dark) !important;
    color: var(--dc-white, #ffffff) !important;
    transform: translateY(-1px);
}

/* أزرار الإطار الخارجي (Outline) */
.btn-outline, .btn-outline-primary, .btn-change {
    color: var(--dc-primary) !important;
    border: 2px solid var(--dc-primary) !important;
    background: transparent !important;
}
.btn-outline:hover, .btn-outline-primary:hover, .btn-change:hover {
    background: var(--dc-primary) !important;
    color: var(--dc-white, #ffffff) !important;
}

/* التبويبات والفلاتر النشطة في كافة الشاشات */
.filter-btn.active, .period-btn.active, .tab.active, .range-btn.active,
.settings-tab.active, .settings-subtab.active, .stmt-tab-btn.active, .nav-tabs .nav-link.active,
.tab-btn.active, .status-tab.active {
    background: var(--dc-primary) !important;
    background-color: var(--dc-primary) !important;
    border-color: var(--dc-primary) !important;
    color: var(--dc-white, #ffffff) !important;
}

/* حقول البحث والإدخال عند التركيز */
.search-box:focus-within, .input:focus, .form-control:focus, select:focus, textarea:focus, .filter-select:focus {
    border-color: var(--dc-primary) !important;
    box-shadow: 0 0 0 3px var(--dc-focus) !important;
    outline: none !important;
}

/* حدود البطاقات والبارات الإحصائية الزرقاء */
.stat-blue, .status-border-booked, .status-bar.status-nurse {
    border-right-color: var(--dc-primary) !important;
}

/* ترويسة الجداول */
table thead th, .table thead th, .clinical-table th, .plan-table th, .charges-table th, .lines-table th, th {
    background: var(--dc-sky-50) !important;
    color: var(--dc-primary-dark) !important;
    border-bottom: 2px solid var(--dc-primary) !important;
}

/* ══════════════════════════════════════════════════════════════════
   منظومة التنسيقات العشرة المعتمدة مع الحماية الصارمة للتباين
   ══════════════════════════════════════════════════════════════════ */

/* القواعد المشتركة الثابتة لكافة التنسيقات الفاتحة (تمنع تشوه النصوص والمدخلات) */
:root,
[data-theme="theme-medical-blue"],
[data-theme="theme-emerald"],
[data-theme="theme-royal-navy"],
[data-theme="theme-teal"],
[data-theme="theme-amethyst"],
[data-theme="theme-crimson"],
[data-theme="theme-slate"],
[data-theme="theme-amber"],
[data-theme="theme-cyan"] {
    --dc-white:            #ffffff;
    --dc-surface:          #ffffff;
    --dc-surface-subtle:   #fafafa;
    --dc-surface-card:     #ffffff;
    --dc-surface-hover:    #f1f5f9;
    --dc-canvas:           #f8fafc;
    --dc-app-bg:           #f8fafc;

    /* نصوص داكنة نقية فائقة الوضوح والتباين دائماً */
    --dc-text-primary:     #0f172a;
    --dc-text-secondary:   #334155;
    --dc-text-muted:       #64748b;
    --dc-text-faint:       #94a3b8;
    --dc-ink:              #0f172a;
    --dc-ink-soft:         #334155;
    --dc-muted:            #64748b;
    --dc-faint:            #94a3b8;

    /* حدود رمادية محايدة واضحة لا تأخذ لون التنسيق الباهت */
    --dc-line:             #e2e8f0;
    --dc-line-subtle:      #f1f5f9;
    --dc-line-strong:      #cbd5e1;
    --dc-border:           #e2e8f0;
    --dc-border-subtle:    #f1f5f9;
    --dc-border-strong:    #cbd5e1;
}

/* 1. الأزرق الطبي المعتمد (الافتراضي) */
:root, [data-theme="theme-medical-blue"] {
    --dc-primary:          #0284c7;
    --dc-primary-dark:     #0369a1;
    --dc-primary-darker:   #075985;
    --dc-primary-light:    #e0f2fe;
    --dc-primary-subtle:   #f0f9ff;
    --dc-primary-glow:     rgba(2, 132, 199, 0.25);
    --dc-sidebar-bg:       #0f172a;
    --dc-sidebar-text:     #f8fafc;
    --dc-sidebar-border:   #1e293b;
    --dc-sidebar-hover:    #1e293b;
}

/* 2. الأخضر الزمردي الطبي */
[data-theme="theme-emerald"] {
    --dc-primary:          #047857;
    --dc-primary-dark:     #065f46;
    --dc-primary-darker:   #064e3b;
    --dc-primary-light:    #d1fae5;
    --dc-primary-subtle:   #ecfdf5;
    --dc-primary-glow:     rgba(4, 120, 87, 0.25);
    --dc-sidebar-bg:       #064e3b;
    --dc-sidebar-text:     #f0fdf4;
    --dc-sidebar-border:   #047857;
    --dc-sidebar-hover:    #065f46;
}

/* 3. الكحلي الملكي الفاخر */
[data-theme="theme-royal-navy"] {
    --dc-primary:          #1d4ed8;
    --dc-primary-dark:     #1e40af;
    --dc-primary-darker:   #1e3a8a;
    --dc-primary-light:    #dbeafe;
    --dc-primary-subtle:   #eff6ff;
    --dc-primary-glow:     rgba(29, 78, 216, 0.25);
    --dc-sidebar-bg:       #0f172a;
    --dc-sidebar-text:     #f8fafc;
    --dc-sidebar-border:   #1e293b;
    --dc-sidebar-hover:    #1e293b;
}

/* 4. الفيروزي الطبي المنعش */
[data-theme="theme-teal"] {
    --dc-primary:          #0f766e;
    --dc-primary-dark:     #115e59;
    --dc-primary-darker:   #134e4a;
    --dc-primary-light:    #ccfbf1;
    --dc-primary-subtle:   #f0fdfa;
    --dc-primary-glow:     rgba(15, 118, 110, 0.25);
    --dc-sidebar-bg:       #134e4a;
    --dc-sidebar-text:     #f0fdfa;
    --dc-sidebar-border:   #0f766e;
    --dc-sidebar-hover:    #115e59;
}

/* 5. البنفسجي الهادئ */
[data-theme="theme-amethyst"] {
    --dc-primary:          #7c3aed;
    --dc-primary-dark:     #6d28d9;
    --dc-primary-darker:   #5b21b6;
    --dc-primary-light:    #ede9fe;
    --dc-primary-subtle:   #faf5ff;
    --dc-primary-glow:     rgba(124, 58, 237, 0.25);
    --dc-sidebar-bg:       #2e1065;
    --dc-sidebar-text:     #faf5ff;
    --dc-sidebar-border:   #4c1d95;
    --dc-sidebar-hover:    #3b0764;
}

/* 6. العنابي الياقوتي الأنيق */
[data-theme="theme-crimson"] {
    --dc-primary:          #be123c;
    --dc-primary-dark:     #9f1239;
    --dc-primary-darker:   #881337;
    --dc-primary-light:    #ffe4e6;
    --dc-primary-subtle:   #fff1f2;
    --dc-primary-glow:     rgba(190, 18, 60, 0.25);
    --dc-sidebar-bg:       #4c0519;
    --dc-sidebar-text:     #fff1f2;
    --dc-sidebar-border:   #881337;
    --dc-sidebar-hover:    #500724;
}

/* 7. الرمادي العصري الحديث */
[data-theme="theme-slate"] {
    --dc-primary:          #475569;
    --dc-primary-dark:     #334155;
    --dc-primary-darker:   #1e293b;
    --dc-primary-light:    #f1f5f9;
    --dc-primary-subtle:   #f8fafc;
    --dc-primary-glow:     rgba(71, 85, 105, 0.25);
    --dc-sidebar-bg:       #1e293b;
    --dc-sidebar-text:     #f8fafc;
    --dc-sidebar-border:   #334155;
    --dc-sidebar-hover:    #0f172a;
}

/* 8. العنبري الدافئ */
[data-theme="theme-amber"] {
    --dc-primary:          #b45309;
    --dc-primary-dark:     #92400e;
    --dc-primary-darker:   #78350f;
    --dc-primary-light:    #fef3c7;
    --dc-primary-subtle:   #fffbeb;
    --dc-primary-glow:     rgba(180, 83, 9, 0.25);
    --dc-sidebar-bg:       #451a03;
    --dc-sidebar-text:     #fffbeb;
    --dc-sidebar-border:   #78350f;
    --dc-sidebar-hover:    #592507;
}

/* 9. السماوي المريح */
[data-theme="theme-cyan"] {
    --dc-primary:          #0e7490;
    --dc-primary-dark:     #155e75;
    --dc-primary-darker:   #164e63;
    --dc-primary-light:    #cffafe;
    --dc-primary-subtle:   #ecfeff;
    --dc-primary-glow:     rgba(14, 116, 144, 0.25);
    --dc-sidebar-bg:       #164e63;
    --dc-sidebar-text:     #ecfeff;
    --dc-sidebar-border:   #155e75;
    --dc-sidebar-hover:    #0e7490;
}

/* 10. الداكن الطبي الفاخر (الوضع الليلي) */
[data-theme="theme-dark"] {
    --dc-primary:          #0284c7;
    --dc-primary-dark:     #0369a1;
    --dc-primary-darker:   #075985;
    --dc-primary-light:    #0f2744;
    --dc-primary-subtle:   #0b1d33;
    --dc-primary-glow:     rgba(2, 132, 199, 0.35);

    --dc-surface:          #1e293b;
    --dc-surface-subtle:   #172033;
    --dc-surface-card:     #1e293b;
    --dc-surface-hover:    #334155;
    --dc-canvas:           #0f172a;
    --dc-app-bg:           #0f172a;

    --dc-text-primary:     #f8fafc;
    --dc-text-secondary:   #cbd5e1;
    --dc-text-muted:       #94a3b8;
    --dc-text-faint:       #64748b;
    --dc-ink:              #f8fafc;
    --dc-ink-soft:         #cbd5e1;
    --dc-muted:            #94a3b8;
    --dc-faint:            #64748b;

    --dc-line:             #334155;
    --dc-line-subtle:      #243247;
    --dc-line-strong:      #475569;
    --dc-border:           #334155;
    --dc-border-subtle:    #243247;
    --dc-border-strong:    #475569;

    --dc-sidebar-bg:       #0a0f1d;
    --dc-sidebar-text:     #f8fafc;
    --dc-sidebar-border:   #1e293b;
    --dc-sidebar-hover:    #1e293b;
}

/* ══════════════════════════════════════════════════════════════════
   قواعد شمولية صارمة لتباين ووضوح حقول الإدخال والمدخلات التفاعلية
   ══════════════════════════════════════════════════════════════════ */

/* كافة حقول الإدخال والاختيار في جميع صفحات النظام */
input, select, textarea,
.form-control, .settings-input, .presc-input {
    color: var(--dc-text-primary, #0f172a) !important;
    background-color: var(--dc-surface, #ffffff) !important;
    border: 1px solid var(--dc-line-strong, #cbd5e1) !important;
    font-size: 14px !important;
    font-family: inherit !important;
}

/* النصوص التوضيحية (Placeholder) - رمادي داكن فائق الوضوح وليس بلون التنسيق */
input::placeholder,
textarea::placeholder,
.form-control::placeholder,
.settings-input::placeholder,
.presc-input::placeholder {
    color: #64748b !important;
    opacity: 1 !important;
}

/* عند التركيز على حقل الإدخال */
input:focus, select:focus, textarea:focus,
.form-control:focus, .settings-input:focus, .presc-input:focus {
    border-color: var(--dc-primary) !important;
    box-shadow: 0 0 0 3px var(--dc-primary-glow) !important;
    outline: none !important;
}

/* عناوين الحقول (Labels) - داكنة وواضحة وبارزة دائماً */
label, .settings-form-group label, .form-label {
    color: var(--dc-text-primary, #0f172a) !important;
    font-weight: 700 !important;
}

/* الحقول المعطلة */
input:disabled, select:disabled, textarea:disabled,
.settings-input:disabled {
    background-color: var(--dc-surface-subtle, #f8fafc) !important;
    color: #94a3b8 !important;
    border-color: #e2e8f0 !important;
    cursor: not-allowed !important;
}

/* توافق الوضع الداكن لحقول الإدخال */
[data-theme="theme-dark"] input,
[data-theme="theme-dark"] select,
[data-theme="theme-dark"] textarea,
[data-theme="theme-dark"] .form-control,
[data-theme="theme-dark"] .settings-input,
[data-theme="theme-dark"] .presc-input {
    color: #f8fafc !important;
    background-color: #1e293b !important;
    border-color: #475569 !important;
}

[data-theme="theme-dark"] input::placeholder,
[data-theme="theme-dark"] textarea::placeholder,
[data-theme="theme-dark"] .form-control::placeholder,
[data-theme="theme-dark"] .settings-input::placeholder {
    color: #94a3b8 !important;
}

[data-theme="theme-dark"] label,
[data-theme="theme-dark"] .settings-form-group label {
    color: #f8fafc !important;
}
