/* Zuha Academy Unified Dynamic Theme & High-Contrast Night Mode Engine */

:root {
    --primary-color: #0d9488;
    --primary-hover: #0f766e;
    --header-bg: #0f766e;
    --header-dark-bg: #115e59;
    --header-text: #ffffff;
    --accent-color: #10b981;
    --accent-hover: #059669;
}

/* Strict Header Logo Sizing Rules (Prevents unstyled raw image expansion) */
#zuha-locked-header img {
    max-width: 40px !important;
    max-height: 40px !important;
    width: 36px !important;
    height: 36px !important;
    object-fit: contain !important;
}

#zuha-locked-header a span:first-child {
    display: inline-flex !important;
    width: 40px !important;
    height: 40px !important;
    max-width: 40px !important;
    max-height: 40px !important;
    min-width: 32px !important;
    min-height: 32px !important;
    overflow: hidden !important;
}

/* Presets Data Theme Fallbacks */
[data-theme="emerald"], :root {
    --primary-color: #0d9488;
    --primary-hover: #0f766e;
    --header-bg: #0f766e;
    --header-dark-bg: #115e59;
    --header-text: #ffffff;
    --accent-color: #10b981;
    --accent-hover: #059669;
}

[data-theme="blue"] {
    --primary-color: #2563eb;
    --primary-hover: #1d4ed8;
    --header-bg: #1d4ed8;
    --header-dark-bg: #1e40af;
    --header-text: #ffffff;
    --accent-color: #3b82f6;
    --accent-hover: #2563eb;
}

[data-theme="purple"] {
    --primary-color: #7c3aed;
    --primary-hover: #6d28d9;
    --header-bg: #6d28d9;
    --header-dark-bg: #5b21b6;
    --header-text: #ffffff;
    --accent-color: #8b5cf6;
    --accent-hover: #7c3aed;
}

[data-theme="rose"] {
    --primary-color: #e11d48;
    --primary-hover: #be123c;
    --header-bg: #be123c;
    --header-dark-bg: #9f1239;
    --header-text: #ffffff;
    --accent-color: #f43f5e;
    --accent-hover: #e11d48;
}

[data-theme="amber"] {
    --primary-color: #d97706;
    --primary-hover: #b45309;
    --header-bg: #b45309;
    --header-dark-bg: #92400e;
    --header-text: #ffffff;
    --accent-color: #f59e0b;
    --accent-hover: #d97706;
}

[data-theme="dark_slate"] {
    --primary-color: #334155;
    --primary-hover: #1e293b;
    --header-bg: #1e293b;
    --header-dark-bg: #0f172a;
    --header-text: #ffffff;
    --accent-color: #475569;
    --accent-hover: #334155;
}

/* Forceful Dynamic Theme Overrides for Navigation, Header, & Buttons */
#zuha-locked-header, 
header.bg-teal-700, 
nav.bg-teal-700,
div.bg-teal-700,
.bg-teal-700 {
    background-color: var(--header-bg) !important;
    border-color: rgba(255, 255, 255, 0.15) !important;
}

#zuha-mobile-header-menu,
header .bg-teal-800,
nav .bg-teal-800,
div.bg-teal-800,
.bg-teal-800 {
    background-color: var(--header-dark-bg) !important;
}

/* Sub-hero Banners (Upcoming Courses, Admission, Contact page headers) */
header.bg-teal-900,
nav.bg-teal-900,
div.bg-teal-900,
.bg-teal-900,
.bg-teal-950 {
    background: linear-gradient(180deg, var(--header-bg) 0%, var(--header-dark-bg) 100%) !important;
    color: #ffffff !important;
}

/* Dynamic Primary Buttons & Badges */
.dynamic-theme-btn,
.bg-teal-600 {
    background-color: var(--primary-color) !important;
    color: var(--header-text) !important;
}
.dynamic-theme-btn:hover,
.hover\:bg-teal-700:hover,
.bg-teal-600:hover,
.bg-teal-700:hover {
    background-color: var(--primary-hover) !important;
}

.text-teal-600,
.text-teal-700 {
    color: var(--primary-color) !important;
}

.text-teal-800,
.text-teal-900,
.text-teal-950 {
    color: #0f172a !important;
}

.border-teal-500,
.border-teal-600,
.border-teal-700 {
    border-color: var(--primary-color) !important;
}

.bg-emerald-500 {
    background-color: var(--accent-color) !important;
}

/* Section Title & Subtitle High Contrast Engine */
.section-title,
h2.text-3xl,
h2.text-4xl,
h3.text-2xl,
h3.text-3xl {
    color: #0f172a !important;
    font-weight: 800 !important;
}

.section-subtitle,
p.text-gray-600,
p.text-slate-600,
p.text-slate-700 {
    color: #1e293b !important;
    font-weight: 600 !important;
}

/* Hero Section Heading & Subtitle High-Contrast Overrides */
.hero-section-box .hero-main-heading,
.hero-section-box h1 {
    color: #ffffff !important;
}

.hero-section-box .section-subtitle,
.hero-section-box p {
    color: #e2e8f0 !important;
    font-weight: 500 !important;
}

body.dark-mode .hero-section-box {
    background: #0b1329 !important;
    border-color: #1e2d4a !important;
}

body.dark-mode .hero-main-heading {
    color: #ffffff !important;
}

/* =========================================================
   UNIVERSAL HIGH-CONTRAST NIGHT / DARK MODE STYLING
   ========================================================= */

html.dark-mode, 
body.dark-mode {
    background-color: #0b1329 !important;
    color: #f8fafc !important;
}

/* High Contrast Text Visibility Overrides */
body.dark-mode h1, 
body.dark-mode h2, 
body.dark-mode h3, 
body.dark-mode h4, 
body.dark-mode h5, 
body.dark-mode h6 {
    color: #ffffff !important;
}

body.dark-mode .text-slate-700,
body.dark-mode .text-slate-800,
body.dark-mode .text-slate-900,
body.dark-mode .text-gray-700,
body.dark-mode .text-gray-800,
body.dark-mode .text-gray-900,
body.dark-mode .text-teal-950,
body.dark-mode .text-teal-900,
body.dark-mode .text-teal-800,
body.dark-mode .text-blue-900,
body.dark-mode .text-indigo-900,
body.dark-mode .text-emerald-950 {
    color: #ffffff !important;
}

body.dark-mode .text-slate-400,
body.dark-mode .text-slate-500,
body.dark-mode .text-slate-600,
body.dark-mode .text-gray-400,
body.dark-mode .text-gray-500,
body.dark-mode .text-gray-600,
body.dark-mode .text-teal-700,
body.dark-mode .section-subtitle {
    color: #f1f5f9 !important;
}

/* Dark Mode Neumorphism & Sidebar Cards */
body.dark-mode .neu-flat,
body.dark-mode .neu-pressed,
body.dark-mode .neu-convex,
body.dark-mode .neu-btn {
    background: #182542 !important;
    box-shadow: 3px 3px 8px #080e1c, -3px -3px 8px #24355a !important;
    border-color: #2b3d63 !important;
    color: #f8fafc !important;
}

body.dark-mode .neu-btn-active {
    background: linear-gradient(135deg, var(--primary-color), var(--primary-hover)) !important;
    box-shadow: inset 2px 2px 5px rgba(0,0,0,0.5), inset -2px -2px 5px rgba(255,255,255,0.2) !important;
    color: #ffffff !important;
}

/* Sidebar Containers & Tabs in Admin/Portals */
body.dark-mode aside,
body.dark-mode .sidebar-container,
body.dark-mode #admin-sidebar-container {
    background-color: #0c1427 !important;
    border-color: #1e2d4a !important;
}

body.dark-mode aside button,
body.dark-mode aside a,
body.dark-mode .tab-btn,
body.dark-mode [onclick*="toggleTab"] {
    color: #e2e8f0 !important;
}

body.dark-mode aside button:hover,
body.dark-mode aside a:hover,
body.dark-mode .tab-btn:hover {
    background-color: #223456 !important;
    color: #ffffff !important;
}

/* Containers & Card Background Overrides in Night Mode */
body.dark-mode .bg-slate-50,
body.dark-mode .bg-gray-50,
body.dark-mode .bg-gray-100,
body.dark-mode .bg-slate-100 {
    background-color: #0b1329 !important;
}

body.dark-mode .bg-white,
body.dark-mode .bg-white\/95,
body.dark-mode .bg-white\/90,
body.dark-mode .bg-white\/80,
body.dark-mode .bg-slate-100\/80,
body.dark-mode .bg-slate-50\/50,
body.dark-mode .bg-teal-50,
body.dark-mode .bg-indigo-50,
body.dark-mode .bg-emerald-50,
body.dark-mode .bg-blue-50 {
    background-color: #182542 !important;
    color: #f8fafc !important;
    border-color: #2b3d63 !important;
}

/* Admission Form & Course Details Form Night Mode Overrides */
body.dark-mode #admission-form-section,
body.dark-mode .backdrop-blur-lg,
body.dark-mode main form {
    background-color: #111c35 !important;
    color: #f8fafc !important;
}

body.dark-mode label.bg-slate-50,
body.dark-mode label.bg-gray-50,
body.dark-mode label.border,
body.dark-mode .select-none {
    background-color: #1e2e4d !important;
    border-color: #384c75 !important;
    color: #f8fafc !important;
}

body.dark-mode label.bg-slate-50:hover,
body.dark-mode label.bg-gray-50:hover {
    background-color: #273b61 !important;
}

body.dark-mode select.bg-teal-50 {
    background-color: #1e2e4d !important;
    color: #5eead4 !important;
    border-color: #384c75 !important;
}

/* Dark Mode Badges */
body.dark-mode .bg-teal-50,
body.dark-mode .bg-blue-50,
body.dark-mode .bg-indigo-50,
body.dark-mode .bg-amber-50,
body.dark-mode .bg-purple-50 {
    background-color: #1e2e4d !important;
}

body.dark-mode .text-teal-700,
body.dark-mode .text-teal-800 {
    color: #5eead4 !important;
}

body.dark-mode .text-blue-700,
body.dark-mode .text-blue-800 {
    color: #93c5fd !important;
}

body.dark-mode .text-amber-800 {
    color: #fde047 !important;
}

body.dark-mode .text-purple-800 {
    color: #e9d5ff !important;
}

/* Borders */
body.dark-mode .border-gray-100,
body.dark-mode .border-gray-200,
body.dark-mode .border-gray-300,
body.dark-mode .border-slate-100,
body.dark-mode .border-slate-200,
body.dark-mode .border-slate-300,
body.dark-mode .border-teal-100,
body.dark-mode .border-teal-200 {
    border-color: #2b3d63 !important;
}

/* Form Controls */
body.dark-mode input[type="text"],
body.dark-mode input[type="email"],
body.dark-mode input[type="password"],
body.dark-mode input[type="number"],
body.dark-mode input[type="tel"],
body.dark-mode input[type="date"],
body.dark-mode input[type="time"],
body.dark-mode select,
body.dark-mode textarea {
    background-color: #1e2e4d !important;
    color: #f8fafc !important;
    border-color: #384c75 !important;
}

body.dark-mode input::placeholder,
body.dark-mode textarea::placeholder {
    color: #94a3b8 !important;
}

/* Tables */
body.dark-mode table thead tr,
body.dark-mode table th {
    background-color: #0c1427 !important;
    color: #f8fafc !important;
    border-color: #2b3d63 !important;
}

body.dark-mode table tbody tr {
    background-color: #182542 !important;
    color: #f1f5f9 !important;
    border-color: #2b3d63 !important;
}

body.dark-mode table tbody tr:hover {
    background-color: #25375c !important;
}

/* Modals */
body.dark-mode .modal-content,
body.dark-mode [id*="modal"] .bg-white {
    background-color: #182542 !important;
    color: #f8fafc !important;
    border: 1px solid #2b3d63 !important;
}

/* Toggle Switch Button Styling */
.night-toggle-btn {
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}
.night-toggle-btn:hover {
    transform: scale(1.08);
}

/* Preserve FontAwesome Icons in Urdu and Arabic Font Overrides */
.font-urdu i,
.font-urdu [class*="fa-"],
.font-urdu .fa,
.font-urdu .fas,
.font-urdu .far,
.font-urdu .fab,
.font-urdu .fa-solid,
.font-urdu .fa-brands,
.font-urdu .fa-regular,
.font-arabic i,
.font-arabic [class*="fa-"],
.font-arabic .fa,
.font-arabic .fas,
.font-arabic .far,
.font-arabic .fab,
.font-arabic .fa-solid,
.font-arabic .fa-brands,
.font-arabic .fa-regular,
i.fa-brands,
i.fa-solid,
i.fa-regular,
.fa-whatsapp {
    font-family: "Font Awesome 6 Free", "Font Awesome 6 Brands", "FontAwesome" !important;
    font-style: normal !important;
}

.fa-brands, .fab, .fa-whatsapp {
    font-family: "Font Awesome 6 Brands" !important;
    font-weight: 400 !important;
}

/* Floating WhatsApp Button styling across all pages */
#floating-whatsapp-btn {
    position: fixed !important;
    bottom: 24px !important;
    right: 24px !important;
    z-index: 9999 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

body.rtl #floating-whatsapp-btn {
    right: auto !important;
    left: 24px !important;
}