/** * Classic theme — unified dark shell, red accents. * Active when . Loaded after theme-emirates.css. */ html[data-theme="classic"] .phase-one-admin, html[data-theme="classic"] .phase-ui { --phase-shell-chrome: #121826; --phase-shell-chrome-deep: #0b0f19; --phase-accent-red: #e11d34; --phase-primary: #e11d34; } /* ── Unified dark chrome (logo + top bar + sidebar — same tone) ── */ html[data-theme="classic"] .phase-one-admin #page-topbar, html[data-theme="classic"] .phase-ui #page-topbar { box-shadow: none !important; } html[data-theme="classic"] .phase-one-admin .navbar-brand-box, html[data-theme="classic"] .phase-ui .navbar-brand-box, html[data-theme="classic"] .phase-one-admin #page-topbar .navbar-header, html[data-theme="classic"] .phase-ui #page-topbar .navbar-header, html[data-theme="classic"] .phase-one-admin .vertical-menu, html[data-theme="classic"] .phase-ui .vertical-menu { background: var(--phase-shell-chrome) !important; background-size: auto !important; animation: none !important; border: none !important; box-shadow: none !important; } html[data-theme="classic"] .phase-one-admin .vertical-menu, html[data-theme="classic"] .phase-ui .vertical-menu { box-shadow: 1px 0 0 rgba(255, 255, 255, 0.04), 8px 0 32px rgba(0, 0, 0, 0.22) !important; z-index: 1092 !important; } html[data-theme="classic"] .phase-one-admin .navbar-brand-box, html[data-theme="classic"] .phase-ui .navbar-brand-box { border-right: none !important; min-height: 70px; height: 100%; padding: 0 1.5rem !important; width: var(--phase-sidebar-lg, 250px) !important; flex-shrink: 0; display: flex !important; align-items: center !important; justify-content: center !important; } html[data-theme="classic"] .phase-one-admin #page-topbar .navbar-header, html[data-theme="classic"] .phase-ui #page-topbar .navbar-header { min-height: 70px; height: 70px; align-items: center !important; border-bottom: none !important; box-shadow: none !important; position: relative; } html[data-theme="classic"] .phase-one-admin #page-topbar .navbar-header::after, html[data-theme="classic"] .phase-ui #page-topbar .navbar-header::after { content: ""; position: absolute; left: var(--phase-sidebar-lg, 250px); right: 0; bottom: 0; height: 0; pointer-events: none; box-shadow: 0 4px 18px rgba(0, 0, 0, 0.28), 0 1px 0 rgba(255, 255, 255, 0.04); } html[data-theme="classic"] body[data-sidebar-size="md"] .phase-one-admin #page-topbar .navbar-header::after, html[data-theme="classic"] body[data-sidebar-size="md"] .phase-ui #page-topbar .navbar-header::after { left: var(--phase-sidebar-md, 160px); } html[data-theme="classic"] body[data-sidebar-size="sm"] .phase-one-admin #page-topbar .navbar-header::after, html[data-theme="classic"] body[data-sidebar-size="sm"] .phase-ui #page-topbar .navbar-header::after { left: var(--phase-sidebar-sm, 70px); } @media (max-width: 991.98px) { html[data-theme="classic"] .phase-one-admin #page-topbar .navbar-header::after, html[data-theme="classic"] .phase-ui #page-topbar .navbar-header::after { left: 0; } } html[data-theme="classic"] .phase-one-admin .navbar-brand-box .phase-brand-logo, html[data-theme="classic"] .phase-ui .navbar-brand-box .phase-brand-logo { background: rgba(255, 255, 255, 0.97); padding: 6px 10px; border-radius: 10px; box-shadow: 0 2px 12px rgba(0, 0, 0, 0.22); } html[data-theme="classic"] .phase-one-admin .navbar-brand-box .logo.logo-light, html[data-theme="classic"] .phase-ui .navbar-brand-box .logo.logo-light { display: none !important; } html[data-theme="classic"] .phase-one-admin .navbar-brand-box .logo.logo-dark, html[data-theme="classic"] .phase-ui .navbar-brand-box .logo.logo-dark { display: flex !important; align-items: center !important; justify-content: center !important; width: 100% !important; line-height: normal !important; } html[data-theme="classic"] .phase-one-admin .navbar-brand-box .logo.logo-dark .logo-lg, html[data-theme="classic"] .phase-ui .navbar-brand-box .logo.logo-dark .logo-lg { display: inline-flex !important; align-items: center !important; justify-content: center !important; width: 100% !important; } /* ── Top bar icons ── */ html[data-theme="classic"] .phase-one-admin #page-topbar .header-item, html[data-theme="classic"] .phase-ui #page-topbar .header-item { color: #cbd5e1 !important; } html[data-theme="classic"] .phase-one-admin #page-topbar .header-item:hover, html[data-theme="classic"] .phase-ui #page-topbar .header-item:hover { color: #ffffff !important; } html[data-theme="classic"] .phase-one-admin #page-topbar #page-header-user-dropdown, html[data-theme="classic"] .phase-ui #page-topbar #page-header-user-dropdown { background: transparent !important; border-left: 1px solid rgba(255, 255, 255, 0.06) !important; border-right: none !important; } html[data-theme="classic"] .phase-one-admin #page-topbar #page-header-user-dropdown .fw-medium, html[data-theme="classic"] .phase-one-admin #page-topbar #page-header-user-dropdown i, html[data-theme="classic"] .phase-ui #page-topbar #page-header-user-dropdown .fw-medium, html[data-theme="classic"] .phase-ui #page-topbar #page-header-user-dropdown i { color: #e5e7eb !important; } html[data-theme="classic"] .phase-one-admin #page-topbar .header-profile-user, html[data-theme="classic"] .phase-ui #page-topbar .header-profile-user { border: 1px solid rgba(255, 255, 255, 0.18); } /* ── Sidebar navigation (pill style, readable hover) ── */ html[data-theme="classic"] .phase-one-admin #sidebar-menu ul li a, html[data-theme="classic"] .phase-ui #sidebar-menu ul li a { color: #c7cfdf !important; border-left: none !important; border-radius: 12px !important; margin: 3px 12px !important; padding: 0.62rem 0.85rem !important; transform: none !important; transition: background-color 0.18s ease, color 0.18s ease, box-shadow 0.18s ease !important; } html[data-theme="classic"] .phase-one-admin #sidebar-menu ul li a i, html[data-theme="classic"] .phase-ui #sidebar-menu ul li a i, html[data-theme="classic"] .phase-one-admin #sidebar-menu ul li a svg, html[data-theme="classic"] .phase-ui #sidebar-menu ul li a svg { color: #9ba8c0 !important; stroke: #9ba8c0 !important; } html[data-theme="classic"] .phase-one-admin #sidebar-menu ul li a:not(.active):hover, html[data-theme="classic"] .phase-ui #sidebar-menu ul li a:not(.active):hover, html[data-theme="classic"] .phase-one-admin #sidebar-menu ul li a:not(.active):focus, html[data-theme="classic"] .phase-ui #sidebar-menu ul li a:not(.active):focus { color: #ffffff !important; font-weight: 600 !important; background: rgba(225, 29, 52, 0.16) !important; background-image: none !important; border-left: none !important; box-shadow: inset 0 0 0 1px rgba(225, 29, 52, 0.32) !important; transform: none !important; } html[data-theme="classic"] .phase-one-admin #sidebar-menu ul li a:not(.active):hover span, html[data-theme="classic"] .phase-ui #sidebar-menu ul li a:not(.active):hover span, html[data-theme="classic"] .phase-one-admin #sidebar-menu ul li a:not(.active):hover i, html[data-theme="classic"] .phase-ui #sidebar-menu ul li a:not(.active):hover i, html[data-theme="classic"] .phase-one-admin #sidebar-menu ul li a:not(.active):hover svg, html[data-theme="classic"] .phase-ui #sidebar-menu ul li a:not(.active):hover svg, html[data-theme="classic"] .phase-one-admin #sidebar-menu ul li a:not(.active):focus span, html[data-theme="classic"] .phase-ui #sidebar-menu ul li a:not(.active):focus span, html[data-theme="classic"] .phase-one-admin #sidebar-menu ul li a:not(.active):focus i, html[data-theme="classic"] .phase-ui #sidebar-menu ul li a:not(.active):focus i { color: #ffffff !important; stroke: #ffffff !important; } html[data-theme="classic"] .phase-one-admin #sidebar-menu ul li a.active, html[data-theme="classic"] .phase-ui #sidebar-menu ul li a.active, html[data-theme="classic"] .phase-one-admin #sidebar-menu ul li a.active:hover, html[data-theme="classic"] .phase-ui #sidebar-menu ul li a.active:hover { color: #ffffff !important; background: linear-gradient(135deg, #991224 0%, #e11d34 55%, #c41e32 100%) !important; background-image: linear-gradient(135deg, #991224 0%, #e11d34 55%, #c41e32 100%) !important; border-left: none !important; box-shadow: 0 8px 18px rgba(225, 29, 52, 0.32) !important; animation: none !important; transform: none !important; } html[data-theme="classic"] .phase-one-admin #sidebar-menu ul li a.active i, html[data-theme="classic"] .phase-ui #sidebar-menu ul li a.active i, html[data-theme="classic"] .phase-one-admin #sidebar-menu ul li a.active span, html[data-theme="classic"] .phase-ui #sidebar-menu ul li a.active span, html[data-theme="classic"] .phase-one-admin #sidebar-menu ul li a.active:hover i, html[data-theme="classic"] .phase-ui #sidebar-menu ul li a.active:hover i, html[data-theme="classic"] .phase-one-admin #sidebar-menu ul li a.active:hover span, html[data-theme="classic"] .phase-ui #sidebar-menu ul li a.active:hover span { color: #ffffff !important; stroke: #ffffff !important; } html[data-theme="classic"] .phase-one-admin #sidebar-menu ul li a .badge, html[data-theme="classic"] .phase-ui #sidebar-menu ul li a .badge { background: rgba(225, 29, 52, 0.22); color: #fff; } /* ── Sidebar sub-menus (Settings → Positions, etc.) ── */ html[data-theme="classic"] .phase-one-admin #sidebar-menu .sub-menu.mm-collapse.mm-show, html[data-theme="classic"] .phase-ui #sidebar-menu .sub-menu.mm-collapse.mm-show, html[data-theme="classic"] .phase-one-admin #sidebar-menu .sub-menu.mm-show, html[data-theme="classic"] .phase-ui #sidebar-menu .sub-menu.mm-show { display: block !important; } html[data-theme="classic"] .phase-one-admin #sidebar-menu ul.sub-menu, html[data-theme="classic"] .phase-ui #sidebar-menu ul.sub-menu { padding: 0.1rem 0 0.4rem !important; margin: 0 12px 0.35rem 1.35rem !important; border-left: none !important; } html[data-theme="classic"] .phase-one-admin #sidebar-menu ul.sub-menu li a, html[data-theme="classic"] .phase-ui #sidebar-menu ul.sub-menu li a { padding: 0.48rem 0.75rem 0.48rem 0.85rem !important; margin: 2px 0 !important; font-size: 0.8125rem !important; border-radius: 10px !important; } html[data-theme="classic"] .phase-one-admin #sidebar-menu li.mm-active > a.has-arrow, html[data-theme="classic"] .phase-ui #sidebar-menu li.mm-active > a.has-arrow { color: #ffffff !important; background: rgba(225, 29, 52, 0.18) !important; box-shadow: inset 0 0 0 1px rgba(225, 29, 52, 0.28) !important; } html[data-theme="classic"] .phase-one-admin #sidebar-menu li.mm-active > a.has-arrow i, html[data-theme="classic"] .phase-ui #sidebar-menu li.mm-active > a.has-arrow i, html[data-theme="classic"] .phase-one-admin #sidebar-menu li.mm-active > a.has-arrow svg, html[data-theme="classic"] .phase-ui #sidebar-menu li.mm-active > a.has-arrow svg { color: #ffffff !important; stroke: #ffffff !important; } /* ── Sidebar user footer ── */ html[data-theme="classic"] .phase-one-admin .phase-sidebar-user, html[data-theme="classic"] .phase-ui .phase-sidebar-user { margin: 0 10px 12px; padding: 0.85rem; border-radius: 14px; background: rgba(255, 255, 255, 0.04); border: 1px solid rgba(255, 255, 255, 0.08); box-shadow: 0 4px 14px rgba(0, 0, 0, 0.18); } html[data-theme="classic"] .phase-one-admin .phase-sidebar-user-avatar, html[data-theme="classic"] .phase-ui .phase-sidebar-user-avatar { background: linear-gradient(135deg, #991224 0%, #e11d34 100%); color: #fff; } html[data-theme="classic"] .phase-one-admin .phase-sidebar-user-info strong, html[data-theme="classic"] .phase-ui .phase-sidebar-user-info strong { color: #fff; } html[data-theme="classic"] .phase-one-admin .phase-sidebar-user-info span, html[data-theme="classic"] .phase-ui .phase-sidebar-user-info span { color: #a8b2ca; } html[data-theme="classic"] .phase-one-admin .phase-sidebar-user-actions a, html[data-theme="classic"] .phase-one-admin .phase-sidebar-user-actions button, html[data-theme="classic"] .phase-ui .phase-sidebar-user-actions a, html[data-theme="classic"] .phase-ui .phase-sidebar-user-actions button { border: 1px solid rgba(255, 255, 255, 0.12); background: rgba(255, 255, 255, 0.04); color: #d1d5db; } html[data-theme="classic"] .phase-one-admin .phase-sidebar-user-actions a:hover, html[data-theme="classic"] .phase-one-admin .phase-sidebar-user-actions button:hover, html[data-theme="classic"] .phase-ui .phase-sidebar-user-actions a:hover, html[data-theme="classic"] .phase-ui .phase-sidebar-user-actions button:hover { color: #fff; border-color: rgba(225, 29, 52, 0.45); background: rgba(225, 29, 52, 0.15); } /* ── Buttons ── */ html[data-theme="classic"] .phase-one-admin .btn-primary, html[data-theme="classic"] .phase-ui .btn-primary, html[data-theme="classic"] .phase-one-admin .phase-button.dark, html[data-theme="classic"] .phase-ui .phase-button.dark { background: linear-gradient(120deg, #991224 0%, #e11d34 55%, #ff4d63 100%) !important; border-color: #b20d1f !important; } html[data-theme="classic"] .phase-one-admin .btn-primary:hover, html[data-theme="classic"] .phase-ui .btn-primary:hover, html[data-theme="classic"] .phase-one-admin .phase-button.dark:hover, html[data-theme="classic"] .phase-ui .phase-button.dark:hover { box-shadow: 0 10px 20px rgba(225, 29, 52, 0.28) !important; } /* ── Dashboard tabs ── */ html[data-theme="classic"] .phase-one-admin .phase-tab-strip, html[data-theme="classic"] .phase-ui .phase-tab-strip { background: rgba(15, 23, 42, 0.06); border: 1px solid rgba(15, 23, 42, 0.08); box-shadow: 0 8px 24px rgba(15, 23, 42, 0.06); } html[data-theme="classic"] .phase-one-admin .phase-tab-strip .phase-tab, html[data-theme="classic"] .phase-ui .phase-tab-strip .phase-tab { color: #475569; } html[data-theme="classic"] .phase-one-admin .phase-tab-strip .phase-tab:hover, html[data-theme="classic"] .phase-ui .phase-tab-strip .phase-tab:hover { color: #991224; background: rgba(225, 29, 52, 0.08); } html[data-theme="classic"] .phase-one-admin .phase-tab-strip .phase-tab.active, html[data-theme="classic"] .phase-ui .phase-tab-strip .phase-tab.active { background: linear-gradient(135deg, #14080b 0%, #2a1016 50%, #991224 100%) !important; color: #ffffff !important; border: 1px solid rgba(225, 29, 52, 0.35) !important; box-shadow: 0 8px 18px rgba(225, 29, 52, 0.28) !important; } html[data-theme="classic"] .phase-one-admin .phase-tab-strip .phase-tab.active i, html[data-theme="classic"] .phase-ui .phase-tab-strip .phase-tab.active i { color: #ffffff !important; } html[data-theme="classic"] .phase-one-admin .phase-page-pill.active, html[data-theme="classic"] .phase-ui .phase-page-pill.active { background: #0f172a !important; border-color: #0f172a !important; } /* Dashboard main tabs — sliding indicator only (no double active background) */ html[data-theme="classic"] .phase-one-admin .dashboard-main-tab-strip .phase-tab.active, html[data-theme="classic"] .phase-ui .dashboard-main-tab-strip .phase-tab.active { background: transparent !important; border: none !important; box-shadow: none !important; } html[data-theme="classic"] body[data-sidebar-size="md"] .phase-one-admin .navbar-brand-box, html[data-theme="classic"] body[data-sidebar-size="md"] .phase-ui .navbar-brand-box { width: var(--phase-sidebar-md, 160px) !important; } html[data-theme="classic"] body[data-sidebar-size="sm"] .phase-one-admin .navbar-brand-box, html[data-theme="classic"] body[data-sidebar-size="sm"] .phase-ui .navbar-brand-box { width: var(--phase-sidebar-sm, 70px) !important; padding: 8px 6px !important; } @media (max-width: 991.98px) { html[data-theme="classic"] .phase-one-admin .navbar-brand-box, html[data-theme="classic"] .phase-ui .navbar-brand-box { background: var(--phase-shell-chrome) !important; border-right: none !important; } }