/* ================================================================
   portal-site.css — بوابة المستأجر
   توحيد الهوية البصرية مع الموقع الإلكتروني «سكن»
   (لوحة cyan #0E7490، خط Tajawal، زوايا ناعمة rounded، ظلال هادئة)
   يُحمَّل بجانب style.css في صفحات البوابة وتسجيل الدخول فقط،
   فلا يؤثر على لوحة الإدارة الداخلية.
   ================================================================ */

:root {
    /* ===== لوحة ألوان سكن (cyan) فوق توكينات النظام ===== */
    --c-primary: #0E7490;
    --c-primary-light: #0891B2;
    --c-primary-dark: #155E75;
    --c-primary-50: #ECFEFF;
    --c-primary-100: #CFFAFE;
    --c-primary-200: #A5F3FC;
    --c-secondary: #06B6D4;
    --c-accent: #F59E0B;
    --c-accent-light: #FBBF24;

    --c-success: #16A34A;
    --c-success-light: #DCFCE7;
    --c-success-bg: #F0FDF4;
    --c-info: #0284C7;
    --c-info-light: #E0F2FE;
    --c-info-bg: #F0F9FF;

    --c-bg: #F8FAFB;
    --c-foreground: #0F172A;
    --c-foreground-secondary: #475569;
    --c-foreground-muted: #94A3B8;
    --c-border: #E2E8F0;
    --c-border-light: #F1F5F9;

    /* ===== الخط ===== */
    --font-body: 'Tajawal', 'Noto Sans Arabic', 'Segoe UI', Tahoma, Arial, sans-serif;

    /* ===== الزوايا والظلال ===== */
    --radius-lg: 14px;
    --radius-xl: 18px;
    --radius-full: 9999px;
    --shadow-sm: 0 1px 2px rgba(15,23,42,.05);
    --shadow: 0 1px 3px rgba(15,23,42,.06), 0 1px 2px rgba(15,23,42,.04);
    --shadow-md: 0 6px 16px rgba(15,23,42,.07), 0 2px 6px rgba(15,23,42,.04);
    --shadow-lg: 0 18px 44px rgba(15,23,42,.10), 0 4px 12px rgba(15,23,42,.06);
    --shadow-focus: 0 0 0 3px rgba(14,116,144,.22);
}

body {
    font-family: var(--font-body) !important;
    background: var(--c-bg);
}

::selection { background-color: rgba(14,116,144,.15); }

/* ===== الشريط العلوي — زجاجي بظل ناعم ===== */
.portal-nav {
    background: linear-gradient(180deg, #0E7490 0%, #0C6680 100%) !important;
    box-shadow: 0 2px 12px rgba(14,116,144,.18);
    border-bottom: 1px solid rgba(255,255,255,.08);
}
.portal-nav-logo { border-radius: 12px; background: rgba(255,255,255,.16); }
.portal-nav-logout { border-radius: var(--radius-full) !important; }

/* ===== شرائح التنقل ===== */
.portal-tab { border-radius: var(--radius-full); }
.portal-tab.active {
    background: #fff;
    color: #0E7490;
    box-shadow: 0 2px 8px rgba(14,116,144,.25);
}

/* ===== ترحيب الرئيسية ===== */
.portal-hero {
    background: linear-gradient(135deg, #155E75 0%, #0E7490 55%, #0891B2 100%);
    border-radius: 18px;
    box-shadow: 0 14px 34px rgba(14,116,144,.22);
}

/* ===== البطاقات (ملخص + وحدات) ===== */
.portal-stat,
.portal-module-card {
    border-radius: 16px;
    border-color: #E2E8F0;
    box-shadow: 0 4px 14px rgba(15,23,42,.05);
    transition: transform .2s cubic-bezier(.4,0,.2,1),
                box-shadow .2s cubic-bezier(.4,0,.2,1),
                border-color .2s cubic-bezier(.4,0,.2,1);
}
.portal-stat:hover,
.portal-module-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 12px 26px rgba(15,23,42,.10);
}
.portal-module-card:hover { border-color: #A5F3FC; }
.portal-module-card:hover .portal-module-icon { background: var(--c-primary-100); }

/* ===== بطاقات الأرقام المهمة ===== */
.portal-contact-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(min(100%, 240px), 1fr));
    gap: var(--sp-4);
}
.portal-contact-card {
    background: var(--c-surface);
    border: 1px solid var(--c-border);
    border-radius: 16px;
    padding: var(--sp-5);
    display: flex;
    flex-direction: column;
    gap: var(--sp-3);
    box-shadow: 0 4px 14px rgba(15,23,42,.05);
    transition: transform .2s cubic-bezier(.4,0,.2,1),
                box-shadow .2s cubic-bezier(.4,0,.2,1),
                border-color .2s;
}
.portal-contact-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 12px 26px rgba(15,23,42,.10);
    border-color: #A5F3FC;
}
.portal-contact-top { display: flex; align-items: center; gap: var(--sp-3); }
.portal-contact-icon {
    width: 46px; height: 46px; flex-shrink: 0;
    border-radius: 14px;
    background: var(--c-primary-50);
    color: var(--c-primary);
    display: flex; align-items: center; justify-content: center;
    font-size: 1.25rem;
}
.portal-contact-name { font-weight: 700; font-size: var(--text-base); color: var(--c-foreground); }
.portal-contact-note { font-size: var(--text-xs); color: var(--c-foreground-muted); line-height: var(--leading-normal); }
.portal-contact-actions { display: flex; gap: var(--sp-2); margin-top: auto; }
.portal-contact-actions .btn {
    flex: 1;
    border-radius: var(--radius-full);
    font-size: var(--text-xs);
    min-height: 38px;
}
.portal-contact-actions .btn:hover { transform: none; }

/* ===== التنبيهات / الفلاش ===== */
.portal-flash {
    border-radius: 14px;
    box-shadow: var(--shadow-sm);
    font-weight: 500;
    animation: portalFlashIn .35s cubic-bezier(.4,0,.2,1);
}
@keyframes portalFlashIn {
    from { opacity: 0; transform: translateY(-8px); }
    to { opacity: 1; transform: translateY(0); }
}
.flash-container .toast-message { border-radius: 12px; }

/* ===== تسجيل الدخول ===== */
.auth-brand {
    background: linear-gradient(150deg, #0C6680 0%, #0E7490 42%, #164E63 130%) !important;
}
.auth-card {
    border-radius: 20px;
    box-shadow: 0 18px 44px rgba(15,23,42,.10), 0 4px 12px rgba(15,23,42,.06);
}
.auth-mobile-logo { background: var(--c-primary-50); color: var(--c-primary); }
.auth-submit {
    border-radius: var(--radius-full);
    font-weight: 700;
}

/* ===== ضبط عناصر Bootstrap ليتطابق مع سكن ===== */
.btn-primary {
    --bs-btn-bg: #0E7490;
    --bs-btn-border-color: #0E7490;
    --bs-btn-hover-bg: #0C6680;
    --bs-btn-hover-border-color: #0C6680;
    --bs-btn-active-bg: #0C6680;
    --bs-btn-active-border-color: #0C6680;
    --bs-btn-disabled-bg: #0E7490;
    --bs-btn-disabled-border-color: #0E7490;
    border-radius: 10px;
}
.btn-outline-primary {
    --bs-btn-color: #0E7490;
    --bs-btn-border-color: #0E7490;
    --bs-btn-hover-bg: #0E7490;
    --bs-btn-hover-border-color: #0E7490;
    --bs-btn-active-bg: #0E7490;
    --bs-btn-active-border-color: #0E7490;
}
.btn-outline-secondary,
.btn-outline-danger {
    border-radius: 10px;
}
.form-control:focus,
.form-select:focus {
    border-color: #A5F3FC;
    box-shadow: 0 0 0 3px rgba(14,116,144,.15);
}

/* ===== تحسينات عامة ===== */
a { text-decoration: none; }
.card { border-radius: 14px; }