/* ============================================================
   نظام الجامعة - لوحة الطالب
   الهوية اللونية: أزرق #1B52A7 | ذهبي #D4AF37 | أبيض #FFFFFF
   ثانوية #F5F7FA | نصوص #1F2937 | حدود #E5E7EB
   مبني على Bootstrap 5
============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Tajawal:wght@400;500;700;800;900&display=swap');

:root {
    /* ---------- الهوية اللونية ---------- */
    --uni-primary: #1B52A7;
    --uni-primary-dark: #143C7F;
    --uni-gold: #D4AF37;
    --uni-gold-dark: #B8952E;
    --uni-bg: #FFFFFF;
    --uni-bg-secondary: #F5F7FA;
    --uni-text: #1F2937;
    --uni-border: #E5E7EB;
    --uni-grad: linear-gradient(135deg, #1B52A7 0%, #143C7F 100%);
    --uni-grad-bg: linear-gradient(135deg, #163A7A 0%, #1B52A7 55%, #2E6BC4 100%);
    --uni-grad-soft: linear-gradient(135deg, rgba(27, 82, 167, .08) 0%, rgba(212, 175, 55, .10) 100%);

    /* ---------- تجاوز ألوان Bootstrap ---------- */
    --bs-primary: #1B52A7;
    --bs-primary-rgb: 27, 82, 167;
    --bs-body-bg: #FFFFFF;
    --bs-body-color: #1F2937;
    --bs-border-color: #E5E7EB;
    --bs-link-color: #1B52A7;
    --bs-link-color-rgb: 27, 82, 167;
    --bs-link-hover-color: #143C7F;
    --bs-link-hover-color-rgb: 20, 60, 127;
}

html {
    -webkit-text-size-adjust: 100%;
}

body {
    font-family: 'Tajawal', system-ui, -apple-system, 'Segoe UI', sans-serif;
    background-color: var(--uni-bg);
    color: var(--uni-text);
    letter-spacing: 0;
}

/* ---------- تركيز الحقول بلون الهوية ---------- */
.form-control:focus,
.form-select:focus {
    border-color: var(--uni-primary);
    box-shadow: 0 0 0 .25rem rgba(27, 82, 167, .14);
}

/* ---------- خلفية متدرجة كاملة ---------- */
.bg-uni-gradient {
    background: var(--uni-grad-bg);
    background-attachment: fixed;
}

/* ---------- دوائر زخرفية موهوبة ---------- */
.blob {
    position: fixed;
    border-radius: 50%;
    filter: blur(70px);
    opacity: .45;
    pointer-events: none;
    z-index: 0;
}
.blob-1 {
    width: 320px;
    height: 320px;
    background: #2E6BC4;
    top: -90px;
    inset-inline-start: -90px;
}
.blob-2 {
    width: 400px;
    height: 400px;
    background: var(--uni-gold);
    bottom: -130px;
    inset-inline-end: -110px;
}

/* ---------- بطاقة زجاجية ---------- */
.glass-card {
    background: rgba(255, 255, 255, .96);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
}

/* ---------- شريط التنقل ---------- */
.navbar-uni {
    background: var(--uni-grad) !important;
    box-shadow: 0 4px 20px rgba(27, 82, 167, .28) !important;
}
.navbar-uni .navbar-brand {
    font-weight: 800;
}
.navbar-uni .nav-link {
    border-radius: .65rem;
    padding-inline: .85rem !important;
    transition: background .2s ease;
}
.navbar-uni .nav-link:hover {
    background: rgba(255, 255, 255, .16);
}

/* ---------- زر متدرج ---------- */
.btn-uni {
    background: var(--uni-grad);
    color: #fff;
    border: 0;
    box-shadow: 0 6px 18px rgba(27, 82, 167, .35);
    transition: transform .2s ease, box-shadow .2s ease, filter .2s ease;
}
.btn-uni:hover,
.btn-uni:focus {
    color: #fff;
    transform: translateY(-2px);
    box-shadow: 0 10px 24px rgba(27, 82, 167, .45);
    filter: brightness(1.08);
}
.btn-uni:active {
    transform: translateY(0);
}

/* ---------- بطاقات حديثة ---------- */
.card-modern {
    background: var(--uni-bg);
    border: 1px solid var(--uni-border);
    border-radius: 1.1rem;
    box-shadow: 0 6px 24px rgba(31, 41, 55, .06);
}
.card-header-uni {
    background: var(--uni-grad);
    color: #fff;
    border: 0;
    border-radius: 1.1rem 1.1rem 0 0 !important;
}
.card-header-uni h5,
.card-header-uni h3,
.card-header-uni h2 {
    color: #fff;
}

/* ---------- رأس الصفحة ---------- */
.page-head {
    display: flex;
    align-items: center;
    gap: .8rem;
    margin-bottom: 1.5rem;
    flex-wrap: wrap;
}
.page-head h1 {
    font-weight: 800;
    margin-bottom: 0;
    color: var(--uni-text);
}

/* ---------- فقاعة أيقونة ---------- */
.icon-bubble {
    width: 46px;
    height: 46px;
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    border-radius: 14px;
    background: var(--uni-grad);
    color: #fff;
    font-size: 1.3rem;
    box-shadow: 0 6px 16px rgba(27, 82, 167, .3);
}

/* ---------- بطاقة خدمة ---------- */
.service-card {
    display: flex;
    flex-direction: column;
    text-decoration: none;
    color: inherit;
    height: 100%;
    background: var(--uni-bg);
    border: 1px solid var(--uni-border);
    border-radius: 1.25rem;
    padding: 1.4rem;
    box-shadow: 0 6px 24px rgba(31, 41, 55, .06);
    transition: transform .25s ease, box-shadow .25s ease;
    position: relative;
}
.service-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 16px 36px rgba(27, 82, 167, .18);
    border-color: rgba(27, 82, 167, .35);
    color: inherit;
}
.service-card .icon-bubble {
    width: 58px;
    height: 58px;
    border-radius: 18px;
    font-size: 1.6rem;
    margin-bottom: 1rem;
    transition: background .25s ease, color .25s ease;
}
.service-card:hover .icon-bubble {
    background: var(--uni-grad);
    color: #fff;
}
.service-card .chevron {
    transition: transform .2s ease;
}
.service-card:hover .chevron {
    transform: translateX(-5px);
}
.service-card.locked {
    opacity: .6;
    cursor: not-allowed;
}
.service-card.locked:hover {
    transform: none;
    box-shadow: 0 6px 24px rgba(31, 41, 55, .06);
    border-color: var(--uni-border);
}
.service-card.locked:hover .icon-bubble {
    background: var(--uni-grad-soft);
}

/* ألوان أيقونات الخدمات */
.icon-blue { background: rgba(27, 82, 167, .1); color: #1B52A7; }
.icon-gold { background: rgba(212, 175, 55, .16); color: #B8952E; }
.icon-green { background: rgba(16, 185, 129, .12); color: #059669; }
.icon-amber { background: rgba(212, 175, 55, .16); color: #B8952E; }
.icon-cyan { background: rgba(6, 182, 212, .12); color: #0891b2; }
.icon-rose { background: rgba(244, 63, 94, .1); color: #e11d48; }

/* ---------- بطاقة إحصائية ---------- */
.stat-card {
    background: var(--uni-bg);
    border: 1px solid var(--uni-border);
    border-radius: 1.1rem;
    box-shadow: 0 6px 24px rgba(31, 41, 55, .06);
    transition: transform .25s ease, box-shadow .25s ease;
    height: 100%;
}
.stat-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 12px 30px rgba(31, 41, 55, .12);
}
.stat-card .icon-bubble {
    width: 48px;
    height: 48px;
    border-radius: 14px;
    font-size: 1.35rem;
}

/* ---------- حقول الإدخال ---------- */
.input-group-modern .form-control {
    padding: .65rem .9rem;
}
.input-group-modern .input-group-text {
    background: #fff;
    color: #64748b;
    border-inline-end: 0;
    padding-inline: .95rem;
}
.input-group-modern .form-control {
    border-inline-start: 0;
}
.input-group-modern .form-control:focus {
    box-shadow: none;
}
.input-group-modern:focus-within .input-group-text,
.input-group-modern:focus-within .form-control,
.input-group-modern:focus-within .toggle-pass {
    border-color: var(--uni-primary);
}
.input-group-modern:focus-within {
    box-shadow: 0 0 0 .25rem rgba(27, 82, 167, .14);
}
.toggle-pass {
    border-inline-start: 0;
    background: #fff;
    color: #64748b;
}
.toggle-pass:hover {
    background: #f8fafc;
    color: #334155;
}

/* ---------- شعار الدخول (دائري) ---------- */
.login-logo {
    width: 140px;
    height: 140px;
    object-fit: contain;
    background: #fff;
    border: 3px solid #fff;
    border-radius: 50%;
    box-shadow: 0 10px 26px rgba(27, 82, 167, .25);
}

/* ---------- شعار شريط التنقل (دائري) ---------- */
.navbar-uni .navbar-brand img.logo-nav {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    object-fit: cover;
    background: #fff;
    border: 2px solid #fff;
    box-shadow: 0 2px 8px rgba(0, 0, 0, .18);
}

/* ---------- بديل الشعار محلي (بدون CDN) ---------- */
.logo-fallback {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: linear-gradient(135deg, #1b52a7, #2f7fd6);
    color: #fff;
    font-weight: 700;
    font-size: 10px;
    text-align: center;
    line-height: 1.05;
    padding: 6px;
    border: 2px solid #fff;
    box-shadow: 0 2px 8px rgba(0, 0, 0, .18);
}

.logo-fallback.login-logo {
    width: 140px;
    height: 140px;
    font-size: 22px;
    border: 3px solid #fff;
    box-shadow: 0 10px 26px rgba(27, 82, 167, .25);
}

/* ---------- نجوم التقييم ---------- */
.rating-input .text-warning {
    color: var(--uni-gold) !important;
}

/* ---------- جداول ---------- */
.table-modern thead th {
    background: var(--uni-bg-secondary);
    color: var(--uni-text);
    font-weight: 700;
    border-bottom: 0;
    white-space: nowrap;
}

/* ---------- وسوم معلومات الطالب ---------- */
.chip-info {
    display: flex;
    align-items: center;
    gap: .45rem;
    background: rgba(255, 255, 255, .14);
    border: 1px solid rgba(255, 255, 255, .25);
    color: #fff;
    border-radius: .8rem;
    padding: .5rem .85rem;
    font-size: .875rem;
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
}
.chip-info i {
    font-size: 1.05rem;
}

/* ---------- روابط الفوتر ---------- */
.footer-uni {
    color: rgba(255, 255, 255, .75);
    font-size: .85rem;
}

/* ---------- تحسينات الشاشات الصغيرة ---------- */
@media (max-width: 575.98px) {
    .page-head {
        flex-wrap: wrap;
    }
    .service-card {
        padding: 1.1rem;
    }
    .service-card .icon-bubble {
        width: 50px;
        height: 50px;
        font-size: 1.35rem;
    }
    .blob-1 { width: 220px; height: 220px; }
    .blob-2 { width: 260px; height: 260px; }
    .navbar-uni .navbar-brand {
        font-size: 1rem;
    }
    .table-modern td:first-child {
        white-space: normal;
    }
}

@media (prefers-reduced-motion: reduce) {
    .service-card,
    .stat-card,
    .btn-uni {
        transition: none;
    }
}