/* ═══════════════════════════════════════════════════════════
   منصة امتحان الإجازة — الهوية البصرية
   الألوان مأخوذة بالعيّنة من منشورات الإجازة للوزارة (بترولي وذهبي
   على ورق رمادي). المرجع والتفصيل في docs/DESIGN.md.

   §1 الرموز            §5 صفحات الدخول
   §2 مكوّنات Bootstrap   §6 مكوّنات المنصة
   §3 هيكل الإدارة       §7 الجوال
   §4 هيكل البوابة       §8 الطباعة
   ═══════════════════════════════════════════════════════════ */


/* ══════════════════════════════════════════════════════════════
   §1 الرموز — لا لون مكتوب خارج هذا القسم
   ══════════════════════════════════════════════════════════════ */

:root {
    /* البترولي — الهيكل والأفعال الأساسية */
    --ijz-teal: #2f5a64;
    --ijz-teal-deep: #20464e;
    --ijz-teal-night: #173840;
    --ijz-teal-soft: #436d77;
    --ijz-teal-mist: #98c3cd;
    --ijz-teal-tint: #e7eff1;
    --ijz-teal-wash: #f2f6f7;

    /* الذهبي — للتمييز فقط، لا للنص الطويل */
    --ijz-gold: #978c68;
    --ijz-gold-deep: #796e4d;
    --ijz-gold-pale: #c3bba8;
    --ijz-gold-tint: #f4f1e9;

    /* الورق والسطوح */
    --ijz-paper: #eceeee;
    --ijz-surface: #ffffff;
    --ijz-border: #dfe4e5;
    --ijz-border-strong: #c9d2d4;
    --ijz-text: #1d2b2f;
    --ijz-muted: #66777c;

    /* الحالات — مخفّفة لتنسجم مع البترولي */
    --ijz-success: #2e7458;
    --ijz-success-tint: #e3f0ea;
    --ijz-warning: #a86b12;
    --ijz-warning-tint: #fbf0dc;
    --ijz-danger: #a93a3a;
    --ijz-danger-tint: #f8e4e3;
    --ijz-info: #2f6f86;
    --ijz-info-tint: #e2eff4;
    --ijz-neutral: #5d6b70;
    --ijz-neutral-tint: #eceff0;

    /* الأسماء القديمة — تبقى لأن بعض الصفحات تستعملها مباشرة */
    --ijz-primary: var(--ijz-teal);
    --ijz-primary-dark: var(--ijz-teal-deep);
    --ijz-primary-light: var(--ijz-teal-tint);
    --ijz-accent: var(--ijz-gold);
    --ijz-bg: var(--ijz-paper);

    /* الأبعاد */
    --ijz-radius-sm: 8px;
    --ijz-radius: 12px;
    --ijz-radius-lg: 18px;
    --ijz-sidebar-w: 272px;
    --ijz-shadow: 0 1px 2px rgba(23, 56, 64, .05), 0 2px 8px rgba(23, 56, 64, .05);
    --ijz-shadow-lg: 0 12px 32px rgba(23, 56, 64, .14);
    --ijz-ease: cubic-bezier(.4, 0, .2, 1);

    /* الزخرفة: شبكة معيّنات خفيفة مستوحاة من خلفية المنشورات */
    --ijz-lattice: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='56' height='56' viewBox='0 0 56 56'%3E%3Cg fill='none' stroke='%23ffffff' stroke-opacity='.07' stroke-width='1.2'%3E%3Cpath d='M28 4 52 28 28 52 4 28Z'/%3E%3Cpath d='M28 16 40 28 28 40 16 28Z'/%3E%3C/g%3E%3C/svg%3E");

    /* ربط Bootstrap بالهوية */
    --bs-body-font-family: 'Cairo', 'Segoe UI', Tahoma, sans-serif;
    --bs-body-color: var(--ijz-text);
    --bs-body-bg: var(--ijz-paper);
    --bs-border-color: var(--ijz-border);
    --bs-primary: #2f5a64;
    --bs-primary-rgb: 47, 90, 100;
    --bs-secondary-color: var(--ijz-muted);
    --bs-link-color: #2f5a64;
    --bs-link-color-rgb: 47, 90, 100;
    --bs-link-hover-color: #20464e;
    --bs-link-hover-color-rgb: 32, 70, 78;
    --bs-success-rgb: 46, 116, 88;
    --bs-info-rgb: 47, 111, 134;
    --bs-warning-rgb: 199, 138, 40;
    --bs-danger-rgb: 169, 58, 58;
    --bs-border-radius: var(--ijz-radius-sm);
    --bs-focus-ring-color: rgba(47, 90, 100, .22);
}


/* ══════════════════════════════════════════════════════════════
   §2 مكوّنات Bootstrap — تُعاد صياغتها هنا فتتبعها الصفحات كلها
   ══════════════════════════════════════════════════════════════ */

body {
    font-family: var(--bs-body-font-family);
    background-color: var(--ijz-paper);
    color: var(--ijz-text);
    font-size: .95rem;
    line-height: 1.75;
    -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, h5, h6 {
    font-weight: 700;
    color: var(--ijz-teal-night);
}

a {
    color: var(--ijz-teal);
    text-decoration: none;
}

a:hover {
    color: var(--ijz-teal-deep);
    text-decoration: underline;
    text-underline-offset: 3px;
}

::selection {
    background: var(--ijz-teal-mist);
    color: var(--ijz-teal-night);
}

:focus-visible {
    outline: 2px solid var(--ijz-teal-soft);
    outline-offset: 2px;
}

/* الأرقام تبقى لاتينية ومقروءة داخل النص العربي */
.num {
    font-variant-numeric: tabular-nums;
    direction: ltr;
    display: inline-block;
    unicode-bidi: embed;
}

/* على خلية الجدول لا تُغيَّر طريقة العرض، وإلا خرجت الخلية من
   بنية الجدول فانزاحت أعمدته وتكسّر صفّه */
td.num,
th.num {
    display: table-cell;
    direction: rtl;
}

/* وكذلك عمود الشبكة (dd.col-8 مثلًا): يبقى عمودًا يمينيًّا في صفه */
.num[class*="col-"] {
    display: block;
    direction: rtl;
}

.text-primary {
    color: var(--ijz-teal) !important;
}

.text-muted,
.text-body-secondary {
    color: var(--ijz-muted) !important;
}

/* ─── البطاقات ─────────────────────────────────────────── */

.card {
    border: 1px solid var(--ijz-border);
    border-radius: var(--ijz-radius);
    box-shadow: var(--ijz-shadow);
    background-color: var(--ijz-surface);
}

.card-header {
    background-color: var(--ijz-surface);
    border-bottom: 1px solid var(--ijz-border);
    font-weight: 700;
    color: var(--ijz-teal-night);
    padding: .85rem 1.1rem;
}

.card-header:first-child {
    border-radius: calc(var(--ijz-radius) - 1px) calc(var(--ijz-radius) - 1px) 0 0;
}

.card-header > .bi:first-child,
.card-header > i:first-child {
    color: var(--ijz-gold);
}

/* الرأس الملوّن صراحةً (bg-success وأخواتها) يبقى أيقونته بيضاء */
.card-header[class*="bg-"] > .bi:first-child {
    color: inherit;
}

.card-footer {
    background-color: var(--ijz-teal-wash);
    border-top: 1px solid var(--ijz-border);
}

.bg-light {
    background-color: var(--ijz-teal-wash) !important;
}

/* ─── الجداول ──────────────────────────────────────────── */

.table {
    --bs-table-hover-bg: var(--ijz-teal-wash);
    --bs-table-striped-bg: var(--ijz-teal-wash);
    margin-bottom: 0;
}

.table > :not(caption) > * > * {
    padding: .7rem .8rem;
    border-bottom-color: var(--ijz-border);
}

.table thead th,
.table .table-light th {
    background-color: var(--ijz-teal-tint);
    color: var(--ijz-teal-deep);
    font-weight: 700;
    font-size: .82rem;
    border-bottom: 2px solid var(--ijz-teal-mist);
    white-space: nowrap;
}

.table tbody tr {
    transition: background-color .15s var(--ijz-ease);
}

.table tbody tr:hover > * {
    background-color: var(--ijz-teal-wash);
}

.card > .table-wrap:last-child .table tr:last-child > *,
.card-body.p-0 .table tr:last-child > * {
    border-bottom: 0;
}

/* الجداول العريضة تنزلق أفقيًا بدل أن تدفع الصفحة */
.table-wrap {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

/* ─── الأزرار ──────────────────────────────────────────── */

.btn {
    border-radius: var(--ijz-radius-sm);
    font-weight: 600;
    padding: .45rem 1rem;
    transition: background-color .15s var(--ijz-ease), border-color .15s var(--ijz-ease),
                color .15s var(--ijz-ease), box-shadow .15s var(--ijz-ease);
}

.btn-sm {
    padding: .28rem .7rem;
    font-size: .82rem;
}

.btn-lg {
    padding: .7rem 1.4rem;
}

.btn-primary {
    --bs-btn-bg: var(--ijz-teal);
    --bs-btn-border-color: var(--ijz-teal);
    --bs-btn-hover-bg: var(--ijz-teal-deep);
    --bs-btn-hover-border-color: var(--ijz-teal-deep);
    --bs-btn-active-bg: var(--ijz-teal-night);
    --bs-btn-active-border-color: var(--ijz-teal-night);
    --bs-btn-disabled-bg: var(--ijz-teal-soft);
    --bs-btn-disabled-border-color: var(--ijz-teal-soft);
    --bs-btn-focus-shadow-rgb: 47, 90, 100;
    box-shadow: 0 2px 6px rgba(32, 70, 78, .22);
}

.btn-outline-primary {
    --bs-btn-color: var(--ijz-teal);
    --bs-btn-border-color: var(--ijz-teal-mist);
    --bs-btn-hover-bg: var(--ijz-teal);
    --bs-btn-hover-border-color: var(--ijz-teal);
    --bs-btn-active-bg: var(--ijz-teal-deep);
    --bs-btn-active-border-color: var(--ijz-teal-deep);
    --bs-btn-focus-shadow-rgb: 47, 90, 100;
}

.btn-outline-secondary {
    --bs-btn-color: var(--ijz-neutral);
    --bs-btn-border-color: var(--ijz-border-strong);
    --bs-btn-hover-color: var(--ijz-teal-deep);
    --bs-btn-hover-bg: var(--ijz-teal-wash);
    --bs-btn-hover-border-color: var(--ijz-teal-mist);
    --bs-btn-active-color: var(--ijz-teal-deep);
    --bs-btn-active-bg: var(--ijz-teal-tint);
    --bs-btn-active-border-color: var(--ijz-teal-mist);
    background-color: var(--ijz-surface);
}

.btn-success {
    --bs-btn-bg: var(--ijz-success);
    --bs-btn-border-color: var(--ijz-success);
    --bs-btn-hover-bg: #235c45;
    --bs-btn-hover-border-color: #235c45;
}

.btn-danger {
    --bs-btn-bg: var(--ijz-danger);
    --bs-btn-border-color: var(--ijz-danger);
    --bs-btn-hover-bg: #8c2f2f;
    --bs-btn-hover-border-color: #8c2f2f;
}

.btn-outline-danger {
    --bs-btn-color: var(--ijz-danger);
    --bs-btn-border-color: #e2b6b4;
    --bs-btn-hover-bg: var(--ijz-danger);
    --bs-btn-hover-border-color: var(--ijz-danger);
}

.btn-outline-success {
    --bs-btn-color: var(--ijz-success);
    --bs-btn-border-color: #b1d3c4;
    --bs-btn-hover-bg: var(--ijz-success);
    --bs-btn-hover-border-color: var(--ijz-success);
}

/* الزر الذهبي — لفعل واحد مميّز في الصفحة (طباعة البطاقة مثلًا) */
.btn-gold {
    --bs-btn-color: #fff;
    --bs-btn-bg: var(--ijz-gold-deep);
    --bs-btn-border-color: var(--ijz-gold-deep);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #62593e;
    --bs-btn-hover-border-color: #62593e;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #544c35;
    --bs-btn-active-border-color: #544c35;
}

/* ─── الحقول ───────────────────────────────────────────── */

.form-control,
.form-select {
    border-radius: var(--ijz-radius-sm);
    border: 1.5px solid var(--ijz-border);
    background-color: var(--ijz-surface);
    padding: .5rem .8rem;
    transition: border-color .15s var(--ijz-ease), box-shadow .15s var(--ijz-ease);
}

.form-control:hover,
.form-select:hover {
    border-color: var(--ijz-border-strong);
}

.form-control:focus,
.form-select:focus {
    border-color: var(--ijz-teal-soft);
    box-shadow: 0 0 0 .22rem rgba(47, 90, 100, .13);
}

.form-control-sm,
.form-select-sm {
    padding: .3rem .6rem;
}

.form-label {
    font-weight: 700;
    font-size: .85rem;
    color: var(--ijz-teal-night);
    margin-bottom: .35rem;
}

.form-text {
    color: var(--ijz-muted);
    font-size: .8rem;
}

.form-check-input:checked {
    background-color: var(--ijz-teal);
    border-color: var(--ijz-teal);
}

.form-check-input:focus {
    border-color: var(--ijz-teal-soft);
    box-shadow: 0 0 0 .22rem rgba(47, 90, 100, .13);
}

.form-switch .form-check-input {
    width: 2.4em;
    cursor: pointer;
}

.input-group-text {
    background-color: var(--ijz-teal-wash);
    border: 1.5px solid var(--ijz-border);
    color: var(--ijz-teal-deep);
}

/* ─── الشارات: خلفية مخفّفة ولون صريح، فتُقرأ ولا تصرخ ───── */

.badge {
    font-weight: 700;
    border-radius: 999px;
    padding: .38em .75em;
    font-size: .74em;
    letter-spacing: 0;
}

.badge.bg-secondary,
.badge.bg-light,
.badge.bg-light.text-dark {
    background-color: var(--ijz-neutral-tint) !important;
    color: var(--ijz-neutral) !important;
}

.badge.bg-primary {
    background-color: var(--ijz-teal-tint) !important;
    color: var(--ijz-teal-deep) !important;
}

.badge.bg-success {
    background-color: var(--ijz-success-tint) !important;
    color: var(--ijz-success) !important;
}

.badge.bg-info,
.badge.bg-info.text-dark {
    background-color: var(--ijz-info-tint) !important;
    color: var(--ijz-info) !important;
}

.badge.bg-warning,
.badge.bg-warning.text-dark {
    background-color: var(--ijz-warning-tint) !important;
    color: var(--ijz-warning) !important;
}

.badge.bg-danger {
    background-color: var(--ijz-danger-tint) !important;
    color: var(--ijz-danger) !important;
}

.badge.bg-dark {
    background-color: var(--ijz-teal-night) !important;
    color: #fff !important;
}

/* ─── التنبيهات ────────────────────────────────────────── */

.alert {
    border: 0;
    border-right: 4px solid currentColor;
    border-radius: var(--ijz-radius-sm);
    box-shadow: var(--ijz-shadow);
}

.alert-success {
    background-color: var(--ijz-success-tint);
    color: #1f5741;
}

.alert-danger {
    background-color: var(--ijz-danger-tint);
    color: #822b2b;
}

.alert-warning {
    background-color: var(--ijz-warning-tint);
    color: #7d500c;
}

.alert-info {
    background-color: var(--ijz-info-tint);
    color: #245669;
}

.alert-light,
.alert-secondary {
    background-color: var(--ijz-surface);
    color: var(--ijz-text);
    border-right-color: var(--ijz-gold-pale);
}

.alert .btn-close {
    padding: 1.1rem;
}

/* ─── عناصر متفرقة ─────────────────────────────────────── */

.progress {
    background-color: var(--ijz-teal-tint);
    border-radius: 999px;
}

/* الشريط لا يُدوَّر بنفسه: الإطار يقصّه، فتبقى الأشرطة المتجاورة متّصلة */
.progress-bar {
    background-color: var(--ijz-teal);
}

.dropdown-menu {
    border: 1px solid var(--ijz-border);
    border-radius: var(--ijz-radius-sm);
    box-shadow: var(--ijz-shadow-lg);
    padding: .4rem;
}

.dropdown-item {
    border-radius: 6px;
    padding: .45rem .8rem;
}

.dropdown-item:active,
.dropdown-item.active {
    background-color: var(--ijz-teal);
}

.nav-tabs {
    border-bottom-color: var(--ijz-border);
}

.nav-tabs .nav-link {
    color: var(--ijz-muted);
    font-weight: 600;
    border: 0;
    border-bottom: 3px solid transparent;
}

.nav-tabs .nav-link.active {
    color: var(--ijz-teal-deep);
    background: transparent;
    border-bottom-color: var(--ijz-gold);
}

.list-group-item.active {
    background-color: var(--ijz-teal);
    border-color: var(--ijz-teal);
}

.pagination {
    --bs-pagination-color: var(--ijz-teal);
    --bs-pagination-hover-color: var(--ijz-teal-deep);
    --bs-pagination-hover-bg: var(--ijz-teal-wash);
    --bs-pagination-active-bg: var(--ijz-teal);
    --bs-pagination-active-border-color: var(--ijz-teal);
    --bs-pagination-focus-box-shadow: 0 0 0 .22rem rgba(47, 90, 100, .13);
}

hr {
    border-color: var(--ijz-border);
    opacity: 1;
}

dt {
    color: var(--ijz-muted);
    font-weight: 600;
}

code {
    color: var(--ijz-gold-deep);
}


/* ══════════════════════════════════════════════════════════════
   §3 هيكل الإدارة — قائمة جانبية ثابتة يمين الشاشة
   تُفتح على الجوال بمربّع اختيار مخفي، فتعمل بلا JavaScript.
   ══════════════════════════════════════════════════════════════ */

.ijz-nav-toggle {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.ijz-sidebar {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    width: var(--ijz-sidebar-w);
    z-index: 1040;
    display: flex;
    flex-direction: column;
    color: #fff;
    background:
        var(--ijz-lattice),
        linear-gradient(185deg, var(--ijz-teal) 0%, var(--ijz-teal-deep) 55%, var(--ijz-teal-night) 100%);
    box-shadow: -2px 0 18px rgba(23, 56, 64, .18);
}

.ijz-sidebar-brand {
    display: flex;
    align-items: center;
    gap: .75rem;
    padding: 1.15rem 1.1rem 1rem;
    border-bottom: 1px solid rgba(255, 255, 255, .09);
    color: #fff;
}

.ijz-sidebar-brand:hover {
    color: #fff;
    text-decoration: none;
}

.ijz-sidebar-brand img {
    width: 42px;
    height: 64px;
    object-fit: contain;
    flex-shrink: 0;
    filter: drop-shadow(0 2px 4px rgba(0, 0, 0, .25));
}

.ijz-sidebar-brand .title {
    display: block;
    font-family: 'Amiri', serif;
    font-size: 1.3rem;
    font-weight: 700;
    line-height: 1.3;
}

.ijz-sidebar-brand .sub {
    display: block;
    font-size: .7rem;
    color: var(--ijz-gold-pale);
    line-height: 1.5;
}

.ijz-sidebar-nav {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    padding: .6rem .7rem 1rem;
    scrollbar-width: thin;
    scrollbar-color: rgba(255, 255, 255, .18) transparent;
}

.ijz-sidebar-heading {
    font-size: .68rem;
    font-weight: 700;
    color: rgba(255, 255, 255, .42);
    padding: .9rem .75rem .3rem;
    letter-spacing: .02em;
}

.ijz-sidebar-link {
    position: relative;
    display: flex;
    align-items: center;
    gap: .7rem;
    padding: .52rem .8rem;
    margin: 1px 0;
    border-radius: var(--ijz-radius-sm);
    color: rgba(255, 255, 255, .8);
    font-size: .87rem;
    font-weight: 600;
    transition: background-color .15s var(--ijz-ease), color .15s var(--ijz-ease);
}

.ijz-sidebar-link .bi {
    font-size: 1.05rem;
    width: 1.2rem;
    text-align: center;
    opacity: .85;
}

.ijz-sidebar-link:hover {
    background-color: rgba(255, 255, 255, .08);
    color: #fff;
    text-decoration: none;
}

.ijz-sidebar-link.active {
    background-color: rgba(255, 255, 255, .13);
    color: #fff;
}

/* شريط ذهبي على حافة الرابط النشط — كالشريط في المنشورات */
.ijz-sidebar-link.active::before {
    content: "";
    position: absolute;
    right: -.7rem;
    top: 20%;
    bottom: 20%;
    width: 4px;
    border-radius: 4px 0 0 4px;
    background: var(--ijz-gold-pale);
}

.ijz-sidebar-link.active .bi {
    color: var(--ijz-gold-pale);
    opacity: 1;
}

.ijz-sidebar-foot {
    flex-shrink: 0;
    padding: .9rem 1rem 1rem;
    border-top: 1px solid rgba(255, 255, 255, .09);
    background: rgba(0, 0, 0, .12);
}

.ijz-sidebar-user {
    display: flex;
    align-items: center;
    gap: .6rem;
    margin-bottom: .75rem;
}

.ijz-avatar {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    flex-shrink: 0;
    background: var(--ijz-gold);
    color: #fff;
    font-weight: 700;
    font-size: .95rem;
}

.ijz-sidebar-user .name {
    display: block;
    font-weight: 700;
    font-size: .85rem;
    line-height: 1.4;
}

.ijz-sidebar-user .role {
    display: block;
    font-size: .7rem;
    color: rgba(255, 255, 255, .55);
}

.ijz-sidebar-logout {
    width: 100%;
    border: 1px solid rgba(255, 255, 255, .16);
    background: rgba(255, 255, 255, .06);
    color: rgba(255, 255, 255, .88);
    border-radius: var(--ijz-radius-sm);
    padding: .45rem;
    font-size: .82rem;
    font-weight: 600;
    transition: background-color .15s var(--ijz-ease);
}

.ijz-sidebar-logout:hover {
    background: rgba(255, 255, 255, .14);
    color: #fff;
}

.ijz-sidebar-org {
    display: flex;
    align-items: center;
    gap: .55rem;
    margin-top: .85rem;
    font-size: .66rem;
    line-height: 1.5;
    color: rgba(255, 255, 255, .5);
}

.ijz-sidebar-org img {
    width: 30px;
    opacity: .75;
}

/* ─── منطقة المحتوى ────────────────────────────────────── */

.ijz-main {
    margin-right: var(--ijz-sidebar-w);
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}

.ijz-topbar {
    position: sticky;
    top: 0;
    z-index: 1020;
    display: flex;
    align-items: center;
    gap: .75rem;
    padding: .6rem 1.75rem;
    background: rgba(255, 255, 255, .88);
    backdrop-filter: saturate(1.4) blur(8px);
    border-bottom: 1px solid var(--ijz-border);
    min-height: 56px;
}

.ijz-topbar .context {
    display: flex;
    align-items: center;
    gap: .5rem;
    font-size: .82rem;
    color: var(--ijz-muted);
    min-width: 0;
}

.ijz-topbar .context strong {
    color: var(--ijz-teal-deep);
    white-space: nowrap;
}

.ijz-topbar .context .sep {
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: var(--ijz-gold-pale);
    flex-shrink: 0;
}

.ijz-menu-btn {
    display: none;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: var(--ijz-radius-sm);
    background: var(--ijz-teal);
    color: #fff;
    font-size: 1.35rem;
    cursor: pointer;
    margin: 0;
    flex-shrink: 0;
}

.ijz-content {
    flex: 1 1 auto;
    width: 100%;
    max-width: 1440px;
    margin: 0 auto;
    padding: 1.75rem;
}

.ijz-overlay {
    display: none;
}

.ijz-admin-footer {
    padding: 1rem 1.75rem;
    font-size: .75rem;
    color: var(--ijz-muted);
    text-align: center;
    border-top: 1px solid var(--ijz-border);
}


/* ══════════════════════════════════════════════════════════════
   §4 هيكل البوابة والصفحات العامة — ترويسة رسمية كالمنشورات
   ══════════════════════════════════════════════════════════════ */

.ijz-public-header {
    position: relative;
    color: #fff;
    background:
        var(--ijz-lattice),
        linear-gradient(100deg, var(--ijz-teal-soft) 0%, var(--ijz-teal) 45%, var(--ijz-teal-deep) 100%);
    box-shadow: 0 2px 12px rgba(23, 56, 64, .16);
}

/* الخط الذهبي تحت الترويسة */
.ijz-public-header::after {
    content: "";
    position: absolute;
    inset: auto 0 0 0;
    height: 3px;
    background: linear-gradient(90deg, transparent, var(--ijz-gold-pale) 20%, var(--ijz-gold) 50%, var(--ijz-gold-pale) 80%, transparent);
}

.ijz-public-header .inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: .85rem 0 1rem;
}

.ijz-org {
    display: flex;
    align-items: center;
    gap: .8rem;
    color: #fff;
    min-width: 0;
}

.ijz-org:hover {
    color: #fff;
    text-decoration: none;
}

.ijz-org .ministry-logo {
    width: 54px;
    flex-shrink: 0;
}

.ijz-org .lines {
    display: flex;
    flex-direction: column;
    border-right: 1px solid rgba(255, 255, 255, .25);
    padding-right: .8rem;
    min-width: 0;
}

.ijz-org .l1 {
    font-family: 'Amiri', serif;
    font-weight: 700;
    font-size: 1.08rem;
    line-height: 1.45;
}

.ijz-org .l2 {
    font-size: .76rem;
    color: rgba(255, 255, 255, .78);
    line-height: 1.5;
}

.ijz-exam-mark {
    display: flex;
    align-items: center;
    gap: .7rem;
    color: #fff;
}

.ijz-exam-mark .text {
    text-align: left;
    line-height: 1.35;
}

.ijz-exam-mark .t1 {
    display: block;
    font-family: 'Amiri', serif;
    font-weight: 700;
    font-size: 1.02rem;
}

.ijz-exam-mark .t2 {
    display: block;
    font-size: .75rem;
    color: var(--ijz-gold-pale);
}

.ijz-exam-mark img {
    height: 58px;
    filter: drop-shadow(0 2px 4px rgba(0, 0, 0, .25));
}

.ijz-public-user {
    display: flex;
    align-items: center;
    gap: .6rem;
}

.ijz-public-user .btn-light {
    --bs-btn-bg: rgba(255, 255, 255, .12);
    --bs-btn-border-color: rgba(255, 255, 255, .28);
    --bs-btn-color: #fff;
    --bs-btn-hover-bg: rgba(255, 255, 255, .22);
    --bs-btn-hover-border-color: rgba(255, 255, 255, .4);
    --bs-btn-hover-color: #fff;
    --bs-btn-active-bg: rgba(255, 255, 255, .28);
    --bs-btn-active-color: #fff;
}

.ijz-public-main {
    flex: 1 1 auto;
}

.ijz-public-footer {
    margin-top: 3rem;
    padding: 1.4rem 0;
    background: var(--ijz-teal-night);
    color: rgba(255, 255, 255, .65);
    font-size: .8rem;
    text-align: center;
}

.ijz-public-footer strong {
    color: #fff;
    font-weight: 600;
}

.ijz-public-footer .gold {
    color: var(--ijz-gold-pale);
}


/* ══════════════════════════════════════════════════════════════
   §5 صفحات الدخول
   ══════════════════════════════════════════════════════════════ */

.ijz-auth-body {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 2rem 1rem;
    background:
        var(--ijz-lattice),
        radial-gradient(ellipse at 80% 0%, rgba(152, 195, 205, .28) 0%, transparent 55%),
        linear-gradient(160deg, var(--ijz-teal) 0%, var(--ijz-teal-deep) 50%, var(--ijz-teal-night) 100%);
    background-attachment: fixed;
}

.ijz-auth {
    width: 100%;
    max-width: 440px;
}

.ijz-auth-card {
    background: var(--ijz-surface);
    border-radius: var(--ijz-radius-lg);
    box-shadow: 0 24px 60px rgba(10, 30, 35, .38);
    overflow: hidden;
}

.ijz-auth-head {
    text-align: center;
    padding: 1.8rem 1.75rem 1.2rem;
    background: linear-gradient(180deg, var(--ijz-gold-tint) 0%, var(--ijz-surface) 100%);
    border-bottom: 1px solid var(--ijz-border);
}

.ijz-auth-logos {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1.1rem;
    margin-bottom: .9rem;
}

.ijz-auth-logos .ijaza {
    height: 84px;
}

.ijz-auth-logos .ministry {
    width: 64px;
}

.ijz-auth-logos .divider {
    width: 1px;
    height: 56px;
    background: var(--ijz-gold-pale);
}

.ijz-auth-head h1 {
    font-size: 1.25rem;
    margin: 0 0 .2rem;
}

.ijz-auth-head p {
    font-size: .82rem;
    color: var(--ijz-muted);
    margin: 0;
}

.ijz-auth-body-inner {
    padding: 1.5rem 1.75rem 1.75rem;
}

.ijz-auth-body-inner .form-control {
    padding: .65rem .9rem;
    font-size: 1rem;
    background-color: var(--ijz-teal-wash);
}

.ijz-auth-body-inner .form-control:focus {
    background-color: var(--ijz-surface);
}

.ijz-auth-body-inner .btn-primary {
    padding: .7rem;
    font-size: 1rem;
}

.ijz-auth-alt {
    text-align: center;
    padding: .9rem;
    font-size: .85rem;
    background: var(--ijz-teal-wash);
    border-top: 1px solid var(--ijz-border);
}

.ijz-auth-foot {
    margin-top: 1.4rem;
    text-align: center;
    font-size: .76rem;
    line-height: 1.8;
    color: rgba(255, 255, 255, .6);
}

.ijz-auth-foot a {
    color: var(--ijz-gold-pale);
}

.ijz-auth-note {
    margin-top: 1rem;
    padding: .85rem 1rem;
    border-radius: var(--ijz-radius);
    background: rgba(255, 255, 255, .08);
    border: 1px solid rgba(255, 255, 255, .14);
    color: rgba(255, 255, 255, .82);
    font-size: .8rem;
    line-height: 1.8;
}

.ijz-auth-note strong {
    color: #fff;
}


/* ══════════════════════════════════════════════════════════════
   §6 مكوّنات المنصة
   ══════════════════════════════════════════════════════════════ */

/* ─── رأس الصفحة: العنوان وأفعاله في شريط واحد ──────────── */

.ijz-page-head {
    position: relative;
    padding: .9rem 1.2rem;
    background: var(--ijz-surface);
    border: 1px solid var(--ijz-border);
    border-radius: var(--ijz-radius);
    box-shadow: var(--ijz-shadow);
    overflow: hidden;
}

.ijz-page-head::before {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    width: 4px;
    background: linear-gradient(180deg, var(--ijz-gold-pale), var(--ijz-gold));
}

.ijz-page-head h1 {
    font-size: 1.2rem;
    color: var(--ijz-teal-night);
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: .45rem;
    line-height: 1.6;
}

.ijz-page-head h1 > .bi:first-child {
    display: inline-grid;
    place-items: center;
    width: 36px;
    height: 36px;
    border-radius: 10px;
    background: var(--ijz-teal-tint);
    color: var(--ijz-teal);
    font-size: 1.05rem;
    margin-left: .2rem !important;
}

.ijz-page-head h1 > .bi.text-danger:first-child {
    background: var(--ijz-danger-tint);
    color: var(--ijz-danger);
}

/* ─── بطاقة الإحصاء ────────────────────────────────────── */

.ijz-stat {
    position: relative;
    background: var(--ijz-surface);
    border: 1px solid var(--ijz-border);
    border-radius: var(--ijz-radius);
    padding: 1rem 1.1rem;
    box-shadow: var(--ijz-shadow);
    overflow: hidden;
    transition: box-shadow .2s var(--ijz-ease), border-color .2s var(--ijz-ease);
}

.ijz-stat:hover {
    border-color: var(--ijz-teal-mist);
    box-shadow: var(--ijz-shadow-lg);
}

.ijz-stat-icon {
    display: grid;
    place-items: center;
    width: 40px;
    height: 40px;
    border-radius: 11px;
    margin: 0 auto .55rem;
    font-size: 1.15rem;
    background: var(--ijz-teal-tint);
    color: var(--ijz-teal);
}

.ijz-stat-value {
    font-size: 1.75rem;
    font-weight: 800;
    color: var(--ijz-teal-deep);
    line-height: 1.2;
}

.ijz-stat-label {
    font-size: .8rem;
    font-weight: 600;
    color: var(--ijz-muted);
}

.ijz-stat.tone-success .ijz-stat-icon { background: var(--ijz-success-tint); color: var(--ijz-success); }
.ijz-stat.tone-success .ijz-stat-value { color: var(--ijz-success); }
.ijz-stat.tone-info .ijz-stat-icon { background: var(--ijz-info-tint); color: var(--ijz-info); }
.ijz-stat.tone-info .ijz-stat-value { color: var(--ijz-info); }
.ijz-stat.tone-warning .ijz-stat-icon { background: var(--ijz-warning-tint); color: var(--ijz-warning); }
.ijz-stat.tone-warning .ijz-stat-value { color: var(--ijz-warning); }
.ijz-stat.tone-danger .ijz-stat-icon { background: var(--ijz-danger-tint); color: var(--ijz-danger); }
.ijz-stat.tone-danger .ijz-stat-value { color: var(--ijz-danger); }
.ijz-stat.tone-neutral .ijz-stat-icon { background: var(--ijz-neutral-tint); color: var(--ijz-neutral); }
.ijz-stat.tone-neutral .ijz-stat-value { color: var(--ijz-neutral); }

/* ─── بطاقة الترحيب في لوحة التحكم ─────────────────────── */

.ijz-welcome {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 1rem;
    padding: 1.4rem 1.6rem;
    border-radius: var(--ijz-radius-lg);
    color: #fff;
    overflow: hidden;
    background:
        var(--ijz-lattice),
        linear-gradient(115deg, var(--ijz-teal-soft) 0%, var(--ijz-teal) 40%, var(--ijz-teal-deep) 100%);
    box-shadow: var(--ijz-shadow-lg);
}

.ijz-welcome .watermark {
    position: absolute;
    left: 1.5rem;
    top: 50%;
    height: 150%;
    transform: translateY(-50%) rotate(-8deg);
    opacity: .12;
    pointer-events: none;
}

.ijz-welcome h1 {
    color: #fff;
    font-size: 1.35rem;
    margin: 0 0 .25rem;
}

.ijz-welcome p {
    margin: 0;
    color: rgba(255, 255, 255, .8);
    font-size: .86rem;
}

.ijz-welcome .chip {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    padding: .25rem .75rem;
    border-radius: 999px;
    background: rgba(255, 255, 255, .12);
    border: 1px solid rgba(255, 255, 255, .2);
    font-size: .78rem;
    font-weight: 600;
    color: var(--ijz-gold-pale);
    margin-bottom: .55rem;
}

.ijz-welcome .year {
    position: relative;
    text-align: center;
    padding: .55rem 1.1rem;
    border-radius: var(--ijz-radius);
    background: rgba(255, 255, 255, .1);
    border: 1px solid rgba(195, 187, 168, .45);
}

.ijz-welcome .year .h {
    display: block;
    font-size: 1.1rem;
    font-weight: 800;
    line-height: 1.2;
}

.ijz-welcome .year .g {
    display: block;
    font-size: .8rem;
    color: var(--ijz-gold-pale);
}

/* ─── عنوان قسم بخط ذهبي ───────────────────────────────── */

.ijz-section-title {
    display: flex;
    align-items: center;
    gap: .6rem;
    font-size: .95rem;
    font-weight: 700;
    color: var(--ijz-teal-deep);
    margin: 0 0 .9rem;
}

.ijz-section-title::after {
    content: "";
    flex: 1;
    height: 1px;
    background: linear-gradient(90deg, transparent, var(--ijz-gold-pale));
}

/* ─── الواجهة الرئيسية العامة ──────────────────────────── */

.ijz-hero {
    position: relative;
    text-align: center;
    padding: 2.5rem 1rem 2rem;
}

.ijz-hero .logo {
    height: 150px;
    filter: drop-shadow(0 8px 18px rgba(23, 56, 64, .22));
}

.ijz-hero .kicker {
    display: block;
    margin-top: 1.1rem;
    font-size: 1rem;
    font-weight: 600;
    color: var(--ijz-teal-soft);
}

.ijz-hero h1 {
    font-family: 'Amiri', serif;
    font-size: clamp(1.8rem, 5vw, 2.9rem);
    font-weight: 700;
    line-height: 1.5;
    margin: .1rem 0 .4rem;
    background: linear-gradient(90deg, var(--ijz-gold-deep), var(--ijz-teal) 45%, var(--ijz-teal-deep));
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}

.ijz-year-tiles {
    display: inline-flex;
    gap: .6rem;
    margin-top: .6rem;
}

.ijz-year-tiles span {
    display: inline-block;
    padding: .35rem 1rem;
    border-radius: var(--ijz-radius-sm);
    background: var(--ijz-surface);
    box-shadow: var(--ijz-shadow);
    font-size: 1.15rem;
    font-weight: 800;
    color: var(--ijz-teal);
}

.ijz-year-tiles span small {
    font-size: .7rem;
    font-weight: 600;
    color: var(--ijz-gold-deep);
    margin-right: .25rem;
}

.ijz-ribbon {
    display: inline-block;
    margin-top: 1.4rem;
    padding: .6rem 2rem;
    border-radius: var(--ijz-radius-sm);
    color: #fff;
    font-weight: 700;
    background: linear-gradient(100deg, var(--ijz-teal-soft), var(--ijz-teal) 50%, var(--ijz-teal-deep));
    box-shadow: 0 6px 16px rgba(32, 70, 78, .25);
}

.ijz-door {
    display: flex;
    flex-direction: column;
    height: 100%;
    padding: 1.6rem;
    border-radius: var(--ijz-radius-lg);
    background: var(--ijz-surface);
    border: 1px solid var(--ijz-border);
    box-shadow: var(--ijz-shadow);
    transition: box-shadow .2s var(--ijz-ease), border-color .2s var(--ijz-ease);
}

.ijz-door:hover {
    border-color: var(--ijz-teal-mist);
    box-shadow: var(--ijz-shadow-lg);
}

.ijz-door .icon {
    display: grid;
    place-items: center;
    width: 56px;
    height: 56px;
    border-radius: 16px;
    font-size: 1.6rem;
    margin-bottom: 1rem;
    background: var(--ijz-teal-tint);
    color: var(--ijz-teal);
}

.ijz-door.featured {
    color: #fff;
    border: 0;
    background:
        var(--ijz-lattice),
        linear-gradient(140deg, var(--ijz-teal) 0%, var(--ijz-teal-deep) 100%);
}

.ijz-door.featured h2 {
    color: #fff;
}

.ijz-door.featured p {
    color: rgba(255, 255, 255, .8);
}

.ijz-door.featured .icon {
    background: rgba(255, 255, 255, .12);
    color: var(--ijz-gold-pale);
}

.ijz-door.featured .btn-light {
    color: var(--ijz-teal-deep);
    font-weight: 700;
}

.ijz-door h2 {
    font-size: 1.15rem;
    margin-bottom: .4rem;
}

.ijz-door p {
    flex-grow: 1;
    font-size: .88rem;
    color: var(--ijz-muted);
}

.ijz-steps {
    counter-reset: step;
    list-style: none;
    padding: 0;
    margin: 0;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
    gap: .75rem;
}

.ijz-steps li {
    counter-increment: step;
    position: relative;
    padding: .9rem 1rem .9rem 1rem;
    padding-right: 3.1rem;
    border-radius: var(--ijz-radius);
    background: var(--ijz-surface);
    border: 1px solid var(--ijz-border);
    font-size: .84rem;
    line-height: 1.7;
}

.ijz-steps li::before {
    content: counter(step);
    position: absolute;
    right: .9rem;
    top: .9rem;
    display: grid;
    place-items: center;
    width: 26px;
    height: 26px;
    border-radius: 50%;
    background: var(--ijz-gold);
    color: #fff;
    font-weight: 800;
    font-size: .8rem;
}

.ijz-steps li strong {
    display: block;
    color: var(--ijz-teal-deep);
}

/* ─── ترويسة المستند المطبوع (الكشوف) ──────────────────── */

.ijz-doc-head {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    gap: 1rem;
    padding-bottom: .8rem;
    margin-bottom: .5rem;
    border-bottom: 2px solid var(--ijz-teal);
    box-shadow: 0 3px 0 -1px var(--ijz-gold-pale);
}

.ijz-doc-head .org {
    display: flex;
    align-items: center;
    gap: .6rem;
    font-size: .75rem;
    line-height: 1.6;
    color: var(--ijz-teal-deep);
}

.ijz-doc-head .org img {
    width: 52px;
}

.ijz-doc-head .org strong {
    display: block;
    font-family: 'Amiri', serif;
    font-size: .95rem;
}

.ijz-doc-head .center {
    text-align: center;
}

.ijz-doc-head .title {
    font-family: 'Amiri', serif;
    font-weight: 700;
    font-size: 1.2rem;
    color: var(--ijz-teal-deep);
}

.ijz-doc-head .sub {
    font-size: .78rem;
    color: var(--ijz-gold-deep);
}

.ijz-doc-head .ijaza {
    height: 64px;
    justify-self: end;
}

/* ─── حالة فارغة ───────────────────────────────────────── */

.ijz-empty {
    text-align: center;
    padding: 2.5rem 1rem;
    color: var(--ijz-muted);
}

.ijz-empty .bi {
    display: block;
    font-size: 2.6rem;
    color: var(--ijz-teal-mist);
    margin-bottom: .6rem;
}


/* ══════════════════════════════════════════════════════════════
   §7 الجوال والأجهزة اللوحية
   ══════════════════════════════════════════════════════════════ */

@media (max-width: 991.98px) {
    .ijz-sidebar {
        transform: translateX(100%);
        transition: transform .28s var(--ijz-ease);
        box-shadow: none;
    }

    .ijz-nav-toggle:checked ~ .ijz-sidebar {
        transform: translateX(0);
        box-shadow: -8px 0 30px rgba(0, 0, 0, .3);
    }

    .ijz-nav-toggle:checked ~ .ijz-overlay {
        display: block;
        position: fixed;
        inset: 0;
        z-index: 1035;
        background: rgba(10, 30, 35, .45);
        cursor: pointer;
    }

    .ijz-main {
        margin-right: 0;
    }

    .ijz-menu-btn {
        display: inline-flex;
    }

    .ijz-topbar {
        padding: .55rem 1rem;
    }

    .ijz-content {
        padding: 1.1rem 1rem;
    }
}

@media (max-width: 767.98px) {
    .ijz-exam-mark .text {
        display: none;
    }

    .ijz-org .ministry-logo {
        width: 44px;
    }

    .ijz-org .l1 {
        font-size: .95rem;
    }

    .ijz-org .l2 {
        font-size: .68rem;
    }

    .ijz-exam-mark img {
        height: 48px;
    }
}

@media (max-width: 575.98px) {
    body {
        font-size: .9rem;
    }

    .ijz-stat-value {
        font-size: 1.4rem;
    }

    .card-body {
        padding: 1rem;
    }

    .ijz-page-head {
        padding: .8rem 1rem;
    }

    .ijz-page-head h1 {
        font-size: 1.05rem;
    }

    .ijz-topbar .context .detail {
        display: none;
    }

    .ijz-welcome {
        padding: 1.1rem 1.2rem;
    }

    .ijz-welcome .year {
        display: none;
    }

    .ijz-hero .logo {
        height: 112px;
    }

    .ijz-org .l2 {
        display: none;
    }

    .ijz-auth-head {
        padding: 1.4rem 1.2rem 1rem;
    }

    .ijz-auth-body-inner {
        padding: 1.2rem;
    }
}


/* ══════════════════════════════════════════════════════════════
   §8 الطباعة
   ══════════════════════════════════════════════════════════════ */

@media print {
    .no-print,
    .ijz-sidebar,
    .ijz-topbar,
    .ijz-overlay,
    .ijz-admin-footer,
    .ijz-public-header,
    .ijz-public-footer {
        display: none !important;
    }

    body {
        background: #fff;
    }

    .ijz-main {
        margin: 0;
    }

    .ijz-content {
        padding: 0;
        max-width: none;
    }

    /* الشعار والشارات تحتفظ بألوانها على الورق */
    * {
        -webkit-print-color-adjust: exact;
        print-color-adjust: exact;
    }
}