/* ===========================================================
   منصة منارتي — الهوية البصرية
   يُحمَّل بعد كل ملفات التنسيق فيتجاوزها.
   لوحة كريمية/نيلية/ذهبية مستخرجة من الشعار.
   =========================================================== */

:root {
    /* اللوحة */
    --mn-cream:       #FAF7F1;   /* خلفية الصفحة */
    --mn-cream-2:     #F3EFE6;   /* خلفية الأقسام المتناوبة */
    --mn-navy:        #14303F;   /* النص والأزرار الداكنة */
    --mn-navy-2:      #1E4459;
    --mn-blue:        #1565A8;   /* أزرق المنارة */
    --mn-blue-dark:   #0D4A80;
    --mn-gold:        #E8A62C;   /* ذهبي شعاع المنارة */
    --mn-gold-dark:   #C98A17;
    --mn-muted:       #6E7F8A;
    --mn-line:        #E4DDD0;

    --mn-radius:      16px;
    --mn-radius-sm:   10px;
    --mn-shadow:      0 1px 2px rgba(20, 48, 63, .04), 0 8px 28px rgba(20, 48, 63, .07);
    --mn-shadow-lg:   0 2px 6px rgba(20, 48, 63, .06), 0 20px 56px rgba(20, 48, 63, .12);

    /* استبدال متغيّرات القالب الأصلي — كان الأساسي #ff685c مرجانياً */
    --thm-primary:        #14303F;
    --thm-primary-rgb:    20, 48, 63;
    --thm-hover:          #1565A8;
    --thm-footer-text:    #E8A62C;
    --thm-text:           #14303F;
    --thm-secondary-text: #6E7F8A;
    --thm-black:          #14303F;
    --thm-radius:         16px;
}

/* ---------- الأساسيات ---------- */
body {
    background: var(--mn-cream);
    color: var(--mn-navy);
    text-rendering: optimizeLegibility;
}

a { transition: color .18s ease, background-color .18s ease, border-color .18s ease; }
a:hover { color: var(--mn-blue); }

img { max-width: 100%; height: auto; }
::selection { background: var(--mn-gold); color: var(--mn-navy); }

h1, h2, h3, h4, h5, h6 { color: var(--mn-navy); font-weight: 800; line-height: 1.45; }
p { color: var(--mn-muted); }

/* ---------- صورة مفقودة لا تترك أيقونة مكسورة ---------- */
img[src=""], img:not([src]) { visibility: hidden; }

/* ---------- الأزرار ---------- */
.btn, .theme-btn, input[type="submit"], button.btn {
    border-radius: var(--mn-radius-sm);
    font-weight: 700;
    padding: .7rem 1.6rem;
    border: 2px solid transparent;
    transition: transform .18s ease, box-shadow .18s ease, background-color .18s ease, color .18s ease;
}

.btn-primary, .theme-btn, input[type="submit"], .link-btn .btn {
    background: var(--mn-navy);
    border-color: var(--mn-navy);
    color: #fff;
    box-shadow: 0 2px 10px rgba(20, 48, 63, .18);
}

.btn-primary:hover, .theme-btn:hover, input[type="submit"]:hover, .link-btn .btn:hover {
    background: var(--mn-blue);
    border-color: var(--mn-blue);
    color: #fff;
    transform: translateY(-2px);
    box-shadow: 0 8px 22px rgba(21, 101, 168, .28);
}

/* الزر الثانوي: محدَّد لا مملوء — كما في التصميم */
.link-btn .btn1, .btn-transparent, .btn-outline {
    background: transparent;
    border-color: var(--mn-navy);
    color: var(--mn-navy);
    box-shadow: none;
}
.link-btn .btn1:hover, .btn-transparent:hover, .btn-outline:hover {
    background: var(--mn-navy);
    color: #fff;
}

.btn-gold { background: var(--mn-gold); border-color: var(--mn-gold); color: var(--mn-navy); }
.btn-gold:hover { background: var(--mn-gold-dark); border-color: var(--mn-gold-dark); color: var(--mn-navy); }

/* ---------- شريط التنقل ---------- */
#strickyMenu, .navbar { background: var(--mn-cream) !important; }

#strickyMenu {
    box-shadow: 0 1px 0 var(--mn-line);
}

.navbar-brand img {
    height: 88px;
    width: auto;
    max-width: 280px;
    object-fit: contain;
    padding-block: 6px;
}

.navbar-nav .nav-link {
    font-weight: 700;
    color: var(--mn-navy);
    padding-inline: 1.05rem;
    border-radius: var(--mn-radius-sm);
    white-space: nowrap;
}
.navbar-nav .nav-link:hover, .navbar-nav .nav-link.active {
    color: var(--mn-blue);
    background: rgba(21, 101, 168, .07);
}

/* ---------- ترتيب الشريط: شعار يميناً · قوائم وسطاً · بوابات يساراً ---------- */
@media (min-width: 992px) {
    #mainNav { display: flex !important; align-items: center; width: 100%; }
    #mainNav > .navbar-nav { margin-inline: auto; }   /* يتوسّط ما بين الشعار والبوابات */
}

.mn-nav-portals {
    display: flex;
    align-items: center;
    gap: .55rem;
    flex-shrink: 0;
}

.mn-portal {
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    min-height: 42px;
    padding: .5rem 1.15rem;
    border-radius: 999px;
    font-weight: 700;
    font-size: .92rem;
    white-space: nowrap;
    text-decoration: none;
    border: 2px solid transparent;
    transition: background-color .18s ease, color .18s ease, border-color .18s ease, transform .18s ease;
}
.mn-portal i { font-size: .88em; opacity: .85; }

.mn-portal-solid {
    background: var(--mn-navy);
    border-color: var(--mn-navy);
    color: #fff;
}
.mn-portal-solid:hover {
    background: var(--mn-blue);
    border-color: var(--mn-blue);
    color: #fff;
    transform: translateY(-1px);
}

.mn-portal-ghost {
    background: transparent;
    border-color: rgba(20, 48, 63, .22);
    color: var(--mn-navy);
}
.mn-portal-ghost:hover {
    border-color: var(--mn-navy);
    background: rgba(20, 48, 63, .05);
    color: var(--mn-navy);
}

/* سهم القوائم المنسدلة */
.navbar-nav .nav-item.dropdown > .nav-link .arrow::after {
    content: "";
    display: inline-block;
    width: .42em; height: .42em;
    margin-inline-start: .45em;
    border-inline-end: 2px solid currentColor;
    border-block-end: 2px solid currentColor;
    transform: rotate(45deg) translateY(-2px);
    opacity: .6;
}

@media (max-width: 991px) {
    /* على الجوال تنزل البوابات أسفل القوائم بعرض كامل */
    .mn-nav-portals {
        flex-direction: column;
        align-items: stretch;
        gap: .5rem;
        margin-top: .75rem;
        padding-top: .75rem;
        border-top: 1px solid var(--mn-line);
    }
    .mn-portal { justify-content: center; min-height: 46px; }
}

/* شعار صفحات الدخول — الوسم يحمل height="60" كخاصية HTML،
   وقاعدة CSS تتجاوز خاصية الوسم دائماً. */
.img-hol-p img, .sign-hader img, .login-logo img, .logo-area img {
    height: 104px !important;
    width: auto !important;
    max-width: 90%;
    object-fit: contain;
}

/* ---------- البطاقات ----------
   لا نفرض background ولا color: بعضها يجلس على خلفية ملوّنة
   بنصٍّ أبيض، وفرض خلفية بيضاء يجعله أبيض على أبيض فيختفي. */
.card, .notification-boxes .box, .featured-doctors .item,
.testimonial-wrapper .item, .welcome-area .item {
    border-radius: var(--mn-radius);
    box-shadow: var(--mn-shadow);
    border-color: var(--mn-line);
    transition: transform .22s ease, box-shadow .22s ease;
}

.card:hover, .notification-boxes .box:hover,
.featured-doctors .item:hover, .welcome-area .item:hover {
    transform: translateY(-4px);
    box-shadow: var(--mn-shadow-lg);
}

.notification-boxes .box .icon {
    border-color: var(--mn-gold) !important;
    background: var(--mn-cream) !important;
}
.notification-boxes .box i { color: var(--mn-gold); }

section { padding-block: clamp(2.5rem, 6vw, 5rem); }

/* ---------- العدّادات ----------
   محتوى هذا القسم يحمل color:#fff داخل قاعدة البيانات لأنه
   صُمّم فوق صورة داكنة مفقودة. نضع خلفية داكنة تحتها ليبقى
   مقروءاً، ولا نلمس `color` إطلاقاً. */
.counters-wrapper {
    background-color: var(--mn-navy);
    background-image: linear-gradient(135deg, rgba(20, 48, 63, .95), rgba(21, 101, 168, .9));
    background-blend-mode: multiply;
    background-size: cover;
    background-position: center;
}
.counters-wrapper .counter,
.counters-wrapper .counter-number { color: var(--mn-gold); font-weight: 800; }
.counters-item i { color: var(--mn-gold); }

/* ---------- التذييل ---------- */
.footer-area { background: var(--mn-navy); color: #C9D6DE; }
.footer-area a { color: #C9D6DE; }
.footer-area a:hover { color: var(--mn-gold); }
.footer-area h4, .footer-area h3 { color: #fff; }
.footer-logo img { height: 72px; width: auto; }

/* ---------- الحقول ---------- */
.form-control, .form-select,
input[type="text"], input[type="email"], input[type="password"],
input[type="number"], select, textarea {
    background: #fff;
    border: 1px solid var(--mn-line);
    border-radius: var(--mn-radius-sm);
    padding: .7rem .95rem;
    color: var(--mn-navy);
    transition: border-color .18s ease, box-shadow .18s ease;
}
.form-control:focus, .form-select:focus,
input:focus, select:focus, textarea:focus {
    border-color: var(--mn-blue);
    box-shadow: 0 0 0 4px rgba(21, 101, 168, .12);
    outline: none;
}

/* ---------- الفواصل الزخرفية ---------- */
.sec-title span.inner { background: var(--mn-gold) !important; }
.sec-title .decor { opacity: .9; }

/* ---------- الشاشات الصغيرة ---------- */
@media (max-width: 991px) {
    .navbar-brand img { height: 64px; }
    .img-hol-p img, .sign-hader img, .login-logo img, .logo-area img { height: 84px !important; }

    /* مساحة لمس 44 بكسل — الحد الموصى به */
    .navbar-nav .nav-link, .btn, .theme-btn {
        min-height: 44px; display: inline-flex; align-items: center;
    }

    .navbar-collapse {
        background: #fff;
        border-radius: var(--mn-radius);
        box-shadow: var(--mn-shadow-lg);
        padding: .75rem;
        margin-top: .75rem;
    }

    section { padding-block: 2.5rem; }
}

@media (max-width: 767px) {
    body { font-size: 15px; }
    h1, .h1 { font-size: 1.8rem; }
    h2, .h2 { font-size: 1.45rem; }
    h3, .h3 { font-size: 1.25rem; }
    .main-slider .slider-caption h1 { font-size: 1.85rem; }

    /* الجداول تُمرَّر أفقياً بدل أن تكسر الصفحة */
    .table-responsive, .table {
        display: block; width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch;
    }
    html, body { overflow-x: hidden; }

    .footer-area { text-align: center; }
    .footer-logo img { height: 60px; }
}

@media (max-width: 575px) {
    .btn, .theme-btn { width: 100%; justify-content: center; }
    .btn + .btn { margin-top: .6rem; }
}

/* ---------- تصحيحات RTL لا يغطيها Bootstrap ---------- */
[dir="rtl"] .navbar-nav { padding-right: 0; }
[dir="rtl"] ul { padding-right: 0; }
[dir="rtl"] .owl-carousel { direction: ltr; }   /* الكاروسيل يحسب مواضعه بـ LTR */
[dir="rtl"] .owl-carousel .item,
[dir="rtl"] .owl-carousel .slider-wrapper { direction: rtl; }
[dir="rtl"] .breadcrumb-item + .breadcrumb-item::before { transform: scaleX(-1); display: inline-block; }

/* الأرقام والتواريخ تبقى بالاتجاه الصحيح داخل الجملة العربية */
[dir="rtl"] .counter, [dir="rtl"] .counter-number,
[dir="rtl"] time, [dir="rtl"] .price {
    direction: ltr; unicode-bidi: embed; display: inline-block;
}

/* ---------- إتاحة ---------- */
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: .01ms !important;
        transition-duration: .01ms !important;
    }
}

:focus-visible { outline: 3px solid var(--mn-gold); outline-offset: 2px; }
