/* يُحمَّل بعد وسوم <style> في الصفحة — توحيد شكل البطاقات في صفحات الدخول والـ «قريباً» */

/* شريط التمرير موحّد على كل الصفحات: أسود + برتقالي (يطغى على تعريفات داخل الصفحات) */
html {
    scrollbar-width: thin;
    scrollbar-color: #ffb347 #000000;
}

body.elf-app::-webkit-scrollbar,
html::-webkit-scrollbar,
body.elf-app *::-webkit-scrollbar {
    width: 9px !important;
    height: 9px !important;
}

body.elf-app::-webkit-scrollbar-track,
html::-webkit-scrollbar-track,
body.elf-app *::-webkit-scrollbar-track {
    background: #000000 !important;
    border-radius: 6px;
}

body.elf-app::-webkit-scrollbar-thumb,
html::-webkit-scrollbar-thumb,
body.elf-app *::-webkit-scrollbar-thumb {
    background: linear-gradient(135deg, #ffb347, #ff9f2a) !important;
    border-radius: 6px;
    border: 2px solid #000000 !important;
}

body.elf-app::-webkit-scrollbar-thumb:hover,
html::-webkit-scrollbar-thumb:hover,
body.elf-app *::-webkit-scrollbar-thumb:hover {
    background: linear-gradient(135deg, #ff9f2a, #ffb347) !important;
    box-shadow: 0 0 10px rgba(255, 180, 71, 0.55);
}

body.elf-app::-webkit-scrollbar-corner,
html::-webkit-scrollbar-corner,
body.elf-app *::-webkit-scrollbar-corner {
    background: #000000 !important;
}

body.elf-app {
    scrollbar-color: #ffb347 #000000 !important;
}


body.elf-app.elf-layout-auth .glass-card {
    border-radius: 28px !important;
    border: 1px solid rgba(255, 180, 71, 0.28) !important;
    box-shadow:
        0 18px 50px rgba(0, 0, 0, 0.45),
        inset 0 1px 0 rgba(255, 255, 255, 0.06) !important;
    backdrop-filter: blur(18px) !important;
    -webkit-backdrop-filter: blur(18px) !important;
    background: rgba(15, 23, 42, 0.82) !important;
}

body.elf-app.elf-layout-auth .login-container,
body.elf-app.elf-layout-auth .signup-container,
body.elf-app.elf-layout-auth .single-column-container,
body.elf-app.elf-layout-auth .success-container,
body.elf-app.elf-layout-auth .error-container,
body.elf-app.elf-layout-auth .verify-container {
    border-radius: 28px !important;
    border: 1px solid rgba(255, 180, 71, 0.28) !important;
    box-shadow:
        0 18px 50px rgba(0, 0, 0, 0.45),
        inset 0 1px 0 rgba(255, 255, 255, 0.06) !important;
    backdrop-filter: blur(18px) !important;
    -webkit-backdrop-filter: blur(18px) !important;
    background: rgba(15, 23, 42, 0.88) !important;
}

/* رؤوس الصفحات الداخلية (لوحة التحكم، الفصول، البطولات، …) */
body.elf-app .dashboard-header,
body.elf-app .classes-container > .page-header,
body.elf-app .class-detail-container > .page-header,
body.elf-app .tournaments-container > .page-header,
body.elf-app .schedule-header,
body.elf-app .container > .page-header {
    background: linear-gradient(135deg, rgba(30, 41, 59, 0.92), rgba(15, 23, 42, 0.95));
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border-radius: 28px;
    padding: 1.25rem 1.65rem !important;
    margin-bottom: 1.5rem !important;
    border: 1px solid rgba(255, 180, 71, 0.28) !important;
    border-bottom: 1px solid rgba(255, 180, 71, 0.28) !important;
    box-shadow:
        0 12px 40px rgba(0, 0, 0, 0.35),
        inset 0 1px 0 rgba(255, 255, 255, 0.05);
}

body.elf-app .dashboard-header {
    padding: 1.5rem 1.85rem !important;
}

body.elf-app .container > .header {
    background: linear-gradient(135deg, rgba(30, 41, 59, 0.92), rgba(15, 23, 42, 0.95));
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border-radius: 28px;
    padding: 1.6rem 1.85rem !important;
    margin-bottom: 1.5rem !important;
    border: 1px solid rgba(255, 180, 71, 0.28) !important;
    box-shadow:
        0 12px 40px rgba(0, 0, 0, 0.35),
        inset 0 1px 0 rgba(255, 255, 255, 0.05);
}

@media (max-width: 700px) {
    body.elf-app .dashboard-header,
    body.elf-app .classes-container > .page-header,
    body.elf-app .class-detail-container > .page-header,
    body.elf-app .tournaments-container > .page-header,
    body.elf-app .schedule-header,
    body.elf-app .container > .page-header {
        padding: 1rem 1.15rem !important;
        border-radius: 22px;
    }

    body.elf-app .container > .header {
        padding: 1.25rem 1.2rem !important;
        border-radius: 22px;
    }
}