/* assets/css/dark-mode.css
   GSMSea Comprehensive Enterprise Dark / Night Mode Theme System
   Guarantees 100% complete dark background coverage, crystal-clear text readability,
   and flawless styling across all sidebar widgets, body components, and device pages.
*/

/* ==========================================================================
   1. Root Tokens & Global Body Background
   ========================================================================== */
html[data-theme="dark"] {
    --bg-color: #0b0f19;
    --card-bg: #141c2e;
    --card-border: #223049;
    --text-color: #e2e8f0;
    --text-muted: #94a3b8;
    --header-bg: #0d1424;
    --sidebar-bg: #141c2e;
    --navbar-bg: #3d0000;
    --footer-bg: #070a11;
    --table-header: #1b263d;
    --table-stripe: #0f1624;
    --input-bg: #172136;
    --input-border: #283854;
    --focus-ring: rgba(225, 29, 72, 0.4);
    color-scheme: dark;
}

html[data-theme="dark"],
html[data-theme="dark"] body {
    background-color: #0b0f19 !important;
    color: #cbd5e1 !important;
}

/* Ensure all parent containers inherit transparent/dark backgrounds */
html[data-theme="dark"] .container,
html[data-theme="dark"] .main-body,
html[data-theme="dark"] .content-area,
html[data-theme="dark"] .content-area.full-width,
html[data-theme="dark"] .sidebar-left,
html[data-theme="dark"] .sidebar-right,
html[data-theme="dark"] .site-wrapper {
    background-color: transparent !important;
    color: #cbd5e1 !important;
}

/* Base typography colors */
html[data-theme="dark"] h1,
html[data-theme="dark"] h2,
html[data-theme="dark"] h3,
html[data-theme="dark"] h4,
html[data-theme="dark"] h5,
html[data-theme="dark"] h6,
html[data-theme="dark"] .section-header-modern h2,
html[data-theme="dark"] .section h2,
html[data-theme="dark"] .section-header h2 {
    color: #f8fafc !important;
}

html[data-theme="dark"] p {
    color: #cbd5e1 !important;
}

html[data-theme="dark"] a {
    color: #93c5fd;
}

html[data-theme="dark"] a:hover {
    color: #ff6b81;
}

/* ==========================================================================
   2. Inline Styles Fail-Safe Overrides
   ========================================================================== */
/* Force all hardcoded light backgrounds from legacy templates to dark cards */
html[data-theme="dark"] [style*="background: #fff"],
html[data-theme="dark"] [style*="background:#fff"],
html[data-theme="dark"] [style*="background: #ffffff"],
html[data-theme="dark"] [style*="background:#ffffff"],
html[data-theme="dark"] [style*="background-color: #fff"],
html[data-theme="dark"] [style*="background-color:#ffffff"],
html[data-theme="dark"] [style*="background: white"],
html[data-theme="dark"] [style*="background:#f8f9fa"],
html[data-theme="dark"] [style*="background: #f8f9fa"],
html[data-theme="dark"] [style*="background: #ededed"],
html[data-theme="dark"] [style*="background:#ededed"],
html[data-theme="dark"] [style*="background: #f1f2f6"],
html[data-theme="dark"] [style*="background:#f1f2f6"] {
    background: #141c2e !important;
    background-color: #141c2e !important;
}

/* Force all hardcoded dark text to clear, legible light text */
html[data-theme="dark"] [style*="color: #333"],
html[data-theme="dark"] [style*="color:#333"],
html[data-theme="dark"] [style*="color: #222"],
html[data-theme="dark"] [style*="color:#222"],
html[data-theme="dark"] [style*="color: #555"],
html[data-theme="dark"] [style*="color:#555"],
html[data-theme="dark"] [style*="color: #444"],
html[data-theme="dark"] [style*="color:#444"],
html[data-theme="dark"] [style*="color: #666"],
html[data-theme="dark"] [style*="color:#666"],
html[data-theme="dark"] [style*="color: #111"],
html[data-theme="dark"] [style*="color:#111"],
html[data-theme="dark"] [style*="color: #000"],
html[data-theme="dark"] [style*="color:#000"],
html[data-theme="dark"] [style*="color: #4b5563"],
html[data-theme="dark"] [style*="color:#4b5563"],
html[data-theme="dark"] [style*="color: #0e0e0e"],
html[data-theme="dark"] [style*="color: #0f0f0f"] {
    color: #cbd5e1 !important;
}

html[data-theme="dark"] h1[style],
html[data-theme="dark"] h2[style],
html[data-theme="dark"] h3[style],
html[data-theme="dark"] h4[style],
html[data-theme="dark"] strong[style] {
    color: #f8fafc !important;
}

html[data-theme="dark"] [style*="border: 1px solid #eaeaea"],
html[data-theme="dark"] [style*="border: 1px solid #ddd"],
html[data-theme="dark"] [style*="border: 1px solid #eee"],
html[data-theme="dark"] [style*="border-color: #eaeaea"],
html[data-theme="dark"] [style*="border-color: #ddd"],
html[data-theme="dark"] [style*="border-color: #eee"] {
    border-color: #223049 !important;
}

/* ==========================================================================
   3. Complete Sidebar Widgets System
   ========================================================================== */

/* A. All Brands Finder Widget */
html[data-theme="dark"] .phone-finder-widget {
    background: #141c2e !important;
    border: 1px solid #223049 !important;
    box-shadow: 0 4px 18px rgba(0, 0, 0, 0.35) !important;
}

html[data-theme="dark"] .finder-grid {
    background: #0f1624 !important;
    border: 1px solid #223049 !important;
    gap: 1px !important;
}

html[data-theme="dark"] .finder-item,
html[data-theme="dark"] a.finder-item {
    background: #141c2e !important;
    border: 1px solid #223049 !important;
    color: #e2e8f0 !important;
}

html[data-theme="dark"] .finder-item:hover,
html[data-theme="dark"] a.finder-item:hover {
    background: #1e293b !important;
}

html[data-theme="dark"] .finder-item a {
    color: #e2e8f0 !important;
    font-weight: 700 !important;
    display: block;
    padding: 3px 2px;
}

html[data-theme="dark"] .finder-item a:hover {
    color: #ff6b81 !important;
    background: rgba(225, 29, 72, 0.15) !important;
    border-radius: 4px;
}

html[data-theme="dark"] .finder-item i {
    color: #94a3b8 !important;
}

html[data-theme="dark"] .finder-item:hover i {
    color: #ff6b81 !important;
}

html[data-theme="dark"] .finder-item span {
    color: #cbd5e1 !important;
}

html[data-theme="dark"] .finder-item:hover span {
    color: #ffffff !important;
}

html[data-theme="dark"] .finder-header {
    background: var(--navbar-bg, #3d0000) !important;
    border-bottom: 1px solid #223049 !important;
}

html[data-theme="dark"] .finder-header a,
html[data-theme="dark"] .finder-header i {
    color: #ffffff !important;
}

html[data-theme="dark"] .finder-footer {
    background: var(--navbar-bg, #3d0000) !important;
    border-top: 1px solid #223049 !important;
}

html[data-theme="dark"] .footer-btn,
html[data-theme="dark"] .finder-footer a {
    color: #ffffff !important;
    border-right: 1px solid #223049 !important;
}

html[data-theme="dark"] .footer-btn:hover,
html[data-theme="dark"] .finder-footer a:hover {
    background: rgba(255, 255, 255, 0.15) !important;
    color: #ffffff !important;
}

/* B. General Widget Boxes & Headers */
html[data-theme="dark"] .sidebar-widget,
html[data-theme="dark"] .widget {
    background: #141c2e !important;
    border: 1px solid #223049 !important;
    color: #cbd5e1 !important;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.3) !important;
    border-radius: 10px;
}

html[data-theme="dark"] .sidebar-widget .widget-title,
html[data-theme="dark"] .widget .widget-title,
html[data-theme="dark"] .widget-title-premium {
    background: linear-gradient(to bottom, #1b263d 0%, #151f33 100%) !important;
    color: #f8fafc !important;
    border-bottom: 2px solid var(--primary-color, #ab0000) !important;
}

html[data-theme="dark"] .widget-title i,
html[data-theme="dark"] .widget-title-premium i {
    color: #ff6b81 !important;
}

/* C. Search Widget in Sidebar */
html[data-theme="dark"] .widget-search .form-control,
html[data-theme="dark"] #sidebarSearchInput,
html[data-theme="dark"] #sidebarSearchType {
    background: #172136 !important;
    border: 1px solid #283854 !important;
    color: #f8fafc !important;
}

html[data-theme="dark"] .widget-search input::placeholder {
    color: #64748b !important;
}

/* D. Quick Links Widget */
html[data-theme="dark"] .quick-links-list li a {
    background: #182236 !important;
    color: #e2e8f0 !important;
    border: 1px solid #223049 !important;
}

html[data-theme="dark"] .quick-links-list li a i {
    color: #ff6b81 !important;
}

html[data-theme="dark"] .quick-links-list li a:hover {
    background: var(--primary-color, #ab0000) !important;
    color: #ffffff !important;
    border-color: var(--primary-color, #ab0000) !important;
}

/* E. Social Media Premium Widget */
html[data-theme="dark"] .widget-social-premium {
    background: #141c2e !important;
    border: 1px solid #223049 !important;
}

html[data-theme="dark"] .social-subtitle {
    color: #94a3b8 !important;
}

html[data-theme="dark"] .social-card {
    background: #182236 !important;
    border: 1px solid #223049 !important;
    color: #e2e8f0 !important;
}

html[data-theme="dark"] .social-card:hover {
    background: #1f2d47 !important;
    border-color: #3b5078 !important;
}

html[data-theme="dark"] .p-count {
    color: #f8fafc !important;
}

html[data-theme="dark"] .p-label {
    color: #94a3b8 !important;
}

/* F. Fan Favorites, Best Phones & Best Watches */
html[data-theme="dark"] .sidebar-grid-item {
    background: #182236 !important;
    border: 1px solid #223049 !important;
}

html[data-theme="dark"] .sidebar-grid-item:hover {
    background: #1f2d47 !important;
    border-color: #3b5078 !important;
}

html[data-theme="dark"] .sidebar-grid-name {
    color: #f1f5f9 !important;
}

html[data-theme="dark"] .sidebar-grid-item img {
    background: #0f1624 !important;
}

/* G. New Posts & Device List */
html[data-theme="dark"] .device-list .device-item {
    border-bottom: 1px solid #1f2d45 !important;
}

html[data-theme="dark"] .device-link:hover {
    background: #1b263d !important;
}

html[data-theme="dark"] .device-name {
    color: #f1f5f9 !important;
}

html[data-theme="dark"] .device-meta,
html[data-theme="dark"] .device-meta i {
    color: #94a3b8 !important;
}

/* H. Category List */
html[data-theme="dark"] .category-list li a {
    background: #182236 !important;
    color: #e2e8f0 !important;
}

html[data-theme="dark"] .category-list li a:hover {
    background: #1f2d47 !important;
    color: #ffffff !important;
}

html[data-theme="dark"] .category-list .count {
    background: #283854 !important;
    color: #94a3b8 !important;
}

/* I. Mobile Sidebar Drawer */
html[data-theme="dark"] .mobile-sidebar-header {
    background: #141c2e !important;
    border-bottom: 1px solid #223049 !important;
}

html[data-theme="dark"] .mobile-sidebar-header .sidebar-title,
html[data-theme="dark"] .mobile-sidebar-close {
    color: #f8fafc !important;
}

html[data-theme="dark"] .mobile-sidebar-nav {
    background: #141c2e !important;
    border: 1px solid #223049 !important;
}

html[data-theme="dark"] .mobile-sidebar-nav li {
    border-color: #223049 !important;
}

html[data-theme="dark"] .mobile-sidebar-nav a {
    color: #e2e8f0 !important;
}

html[data-theme="dark"] .mobile-sidebar-nav a:hover {
    background: #1b263d !important;
}

/* ==========================================================================
   4. Homepage & Main Body Components
   ========================================================================= */

/* Hero Featured Device Section */
html[data-theme="dark"] .brand-hero-section {
    background: #141c2e !important;
    border: 1px solid #223049 !important;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.45) !important;
    color: #f8fafc !important;
}

html[data-theme="dark"] .hero-text-container {
    color: #f8fafc !important;
}

html[data-theme="dark"] .hero-title {
    background: none !important;
    -webkit-background-clip: initial !important;
    background-clip: initial !important;
    -webkit-text-fill-color: #ffffff !important;
    color: #ffffff !important;
}

html[data-theme="dark"] .hero-desc {
    color: #94a3b8 !important;
}

html[data-theme="dark"] .hero-price {
    color: #4ade80 !important;
}

html[data-theme="dark"] .hero-price span {
    color: #94a3b8 !important;
}

html[data-theme="dark"] .hero-img-bg {
    background: rgba(67, 97, 238, 0.12) !important;
}

/* Phone Cards & Grids */
html[data-theme="dark"] .phone-card {
    background: #141c2e !important;
    border: 1px solid #223049 !important;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.25) !important;
}

html[data-theme="dark"] .phone-card:hover {
    border-color: #3b5078 !important;
    box-shadow: 0 10px 28px rgba(0, 0, 0, 0.45) !important;
}

html[data-theme="dark"] .phone-card .img-container {
    background: #0f1624 !important;
    border-bottom: 1px solid #1f2d45 !important;
}

html[data-theme="dark"] .phone-card h3,
html[data-theme="dark"] .phone-card h3 a,
html[data-theme="dark"] .phone-card a,
html[data-theme="dark"] .phone-card .phone-title {
    color: #f8fafc !important;
}

/* Review Cards & News Cards */
html[data-theme="dark"] .review-card,
html[data-theme="dark"] .news-card {
    background: #141c2e !important;
    border: 1px solid #223049 !important;
    color: #cbd5e1 !important;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.25) !important;
}

html[data-theme="dark"] .review-body,
html[data-theme="dark"] .review-title,
html[data-theme="dark"] .review-title a,
html[data-theme="dark"] .news-title a {
    color: #f8fafc !important;
}

html[data-theme="dark"] .review-excerpt {
    color: #94a3b8 !important;
}

html[data-theme="dark"] .review-meta,
html[data-theme="dark"] .review-meta span,
html[data-theme="dark"] .review-meta i {
    color: #64748b !important;
}

/* Trending Cards (Horizontal Post Items) */
html[data-theme="dark"] .trending-card {
    background: #141c2e !important;
    border: 1px solid #223049 !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2) !important;
}

html[data-theme="dark"] .trending-card h3 a,
html[data-theme="dark"] .trending-card a {
    color: #f8fafc !important;
}

html[data-theme="dark"] .trending-card .review-meta {
    color: #94a3b8 !important;
}

/* Generic Cards, Badges, & Headers */
html[data-theme="dark"] .card {
    background: #141c2e !important;
    border: 1px solid #223049 !important;
    color: #cbd5e1 !important;
}

html[data-theme="dark"] .section-header-modern,
html[data-theme="dark"] .section-header {
    border-bottom-color: #223049 !important;
}

/* ==========================================================================
   5. Phone Detail Page (/phone/...) Specifications & Tables
   ========================================================================== */
html[data-theme="dark"] .product-header,
html[data-theme="dark"] .product-main-grid,
html[data-theme="dark"] .product-info-col,
html[data-theme="dark"] .product-specs-row,
html[data-theme="dark"] .phone-specs-box {
    background: #141c2e !important;
    border-color: #223049 !important;
    color: #cbd5e1 !important;
}

html[data-theme="dark"] .product-name {
    color: #f8fafc !important;
}

html[data-theme="dark"] .product-actions a,
html[data-theme="dark"] .product-actions .btn {
    background: #182236 !important;
    border: 1px solid #283854 !important;
    color: #e2e8f0 !important;
}

html[data-theme="dark"] .product-actions a:hover {
    background: var(--primary-color, #ab0000) !important;
    color: #ffffff !important;
}

html[data-theme="dark"] .meta-item,
html[data-theme="dark"] .spec-block,
html[data-theme="dark"] .spec-val,
html[data-theme="dark"] .spec-sub {
    color: #e2e8f0 !important;
}

html[data-theme="dark"] .product-popularity-box {
    background: #0f1624 !important;
    border: 1px solid #1f2d45 !important;
}

html[data-theme="dark"] .pop-pct,
html[data-theme="dark"] .pop-count,
html[data-theme="dark"] .fan-count,
html[data-theme="dark"] .fan-label,
html[data-theme="dark"] .price-val,
html[data-theme="dark"] .price-label {
    color: #f8fafc !important;
}

/* Specs Tables */
html[data-theme="dark"] .specs-table,
html[data-theme="dark"] .table,
html[data-theme="dark"] table {
    background: #141c2e !important;
    border: 1px solid #223049 !important;
    color: #cbd5e1 !important;
}

html[data-theme="dark"] table th,
html[data-theme="dark"] .specs-table th,
html[data-theme="dark"] .specs-group,
html[data-theme="dark"] .spec-cat-title,
html[data-theme="dark"] .category-header {
    background: #1b263d !important;
    color: #f8fafc !important;
    border-color: #283854 !important;
}

html[data-theme="dark"] table td,
html[data-theme="dark"] .specs-table td {
    background: #141c2e !important;
    border-color: #1f2d45 !important;
    color: #cbd5e1 !important;
}

html[data-theme="dark"] table tr:hover td {
    background: #1a253b !important;
}

html[data-theme="dark"] .spec-name {
    color: #cbd5e1 !important;
    font-weight: 700 !important;
}

html[data-theme="dark"] .spec-value {
    color: #f8fafc !important;
}

/* Breadcrumbs */
html[data-theme="dark"] .breadcrumb-nav {
    background: transparent !important;
}

html[data-theme="dark"] .breadcrumb-nav a {
    color: #94a3b8 !important;
}

html[data-theme="dark"] .breadcrumb-nav span {
    color: #cbd5e1 !important;
}

/* ==========================================================================
   6. Navigation, Header & Mobile Elements
   ========================================================================== */
html[data-theme="dark"] .top-search-bar input,
html[data-theme="dark"] .search-form-header {
    background: #1b263d !important;
    border: 1px solid #283854 !important;
    color: #f8fafc !important;
}

html[data-theme="dark"] .search-select {
    background: #141c2e !important;
    color: #cbd5e1 !important;
    border-right: 1px solid #283854 !important;
}

html[data-theme="dark"] .search-dropdown {
    background: #141c2e !important;
    border: 1px solid #283854 !important;
    box-shadow: 0 15px 35px rgba(0, 0, 0, 0.6) !important;
}

html[data-theme="dark"] .search-dropdown-item {
    color: #cbd5e1 !important;
    border-bottom: 1px solid #1f2d45 !important;
}

html[data-theme="dark"] .search-dropdown-item:hover {
    background: #1f2d47 !important;
    color: #ffffff !important;
}

/* Mobile chips and price range slide */
html[data-theme="dark"] .mobile-chip-row {
    background: #0d1424 !important;
    border-bottom: 1px solid #223049 !important;
}

html[data-theme="dark"] .mobile-chip {
    background: #172136 !important;
    border: 1px solid #283854 !important;
    color: #cbd5e1 !important;
}

html[data-theme="dark"] .mobile-chip:hover {
    background: #223049 !important;
    color: #ffffff !important;
}

html[data-theme="dark"] .mobile-chip select {
    color: #cbd5e1 !important;
}

html[data-theme="dark"] .price-range-slide {
    background: #141c2e !important;
    border-bottom: 1px solid #223049 !important;
}

html[data-theme="dark"] .price-btn {
    background: #172136 !important;
    border: 1px solid #283854 !important;
    color: #cbd5e1 !important;
}

html[data-theme="dark"] .price-btn:hover {
    background: var(--primary-color, #ab0000) !important;
    color: #ffffff !important;
}

/* ==========================================================================
   7. Size Compare & Battery Calculator Tools
   ========================================================================== */
html[data-theme="dark"] .size-stage-card,
html[data-theme="dark"] .size-comparison-workspace,
html[data-theme="dark"] .calc-card,
html[data-theme="dark"] .view-controls-bar,
html[data-theme="dark"] #sc-stage {
    background: #141c2e !important;
    border-color: #223049 !important;
}

html[data-theme="dark"] #sc-stage {
    box-shadow: 0 4px 25px rgba(0, 0, 0, 0.4) !important;
}

html[data-theme="dark"] .result-metric-card,
html[data-theme="dark"] .breakdown-row,
html[data-theme="dark"] .tip-box,
html[data-theme="dark"] .metric-tile,
html[data-theme="dark"] #card-calibrator-box {
    background: #0f1624 !important;
    border-color: #223049 !important;
    color: #cbd5e1 !important;
}

html[data-theme="dark"] .sc-mode-btn,
html[data-theme="dark"] .sc-aux-btn,
html[data-theme="dark"] #btn-toggle-rotate,
html[data-theme="dark"] #btn-toggle-card-calib {
    background: #172136 !important;
    border-color: #283854 !important;
    color: #cbd5e1 !important;
}

html[data-theme="dark"] .sc-mode-btn.active {
    background: #4361ee !important;
    color: #ffffff !important;
}

html[data-theme="dark"] .bc-preset-btn {
    background: #172136 !important;
    border-color: #283854 !important;
    color: #cbd5e1 !important;
}

html[data-theme="dark"] .bc-preset-btn.active {
    background: #059669 !important;
    border-color: #059669 !important;
    color: #ffffff !important;
}

/* ==========================================================================
   8. Footer & Copyright
   ========================================================================== */
html[data-theme="dark"] .main-footer,
html[data-theme="dark"] footer {
    background: #070a11 !important;
    border-top: 1px solid #1a253b !important;
    color: #94a3b8 !important;
}

html[data-theme="dark"] .footer-label {
    color: #ffffff !important;
}

html[data-theme="dark"] .footer-section a {
    color: #cbd5e1 !important;
}

html[data-theme="dark"] .footer-section a:hover {
    color: #ff6b81 !important;
}

html[data-theme="dark"] .footer-social-top-premium .social-item {
    background: #141c2e !important;
    border: 1px solid #223049 !important;
    color: #cbd5e1 !important;
}

html[data-theme="dark"] .footer-social-top-premium .social-item .social-text span {
    color: #94a3b8 !important;
}

html[data-theme="dark"] .footer-social-top-premium .social-item .social-text strong {
    color: #ffffff !important;
}

html[data-theme="dark"] .footer-social-top-premium .social-item:hover {
    border-color: #ff4d4d !important;
    transform: translateY(-2px);
}

html[data-theme="dark"] .footer-newsletter-fullwidth {
    border-bottom-color: #223049 !important;
}

html[data-theme="dark"] .footer-newsletter-fullwidth input[type="email"] {
    background: #141c2e !important;
    border: 1px solid #223049 !important;
    color: #ffffff !important;
}

html[data-theme="dark"] .footer-bottom,
html[data-theme="dark"] .footer-bottom p,
html[data-theme="dark"] .footer-bottom a {
    color: #64748b !important;
}

/* ==========================================================================
   8.1 Brands Page: Top Manufacturers & Brand Directory
   ========================================================================== */
html[data-theme="dark"] .brand-card-featured {
    background: #141c2e !important;
    border: 1px solid #223049 !important;
    border-bottom: 3px solid #ffb142 !important;
    box-shadow: 0 4px 18px rgba(0, 0, 0, 0.3) !important;
}

html[data-theme="dark"] .brand-featured-title,
html[data-theme="dark"] .brand-card-featured h4 {
    color: #f8fafc !important;
}

html[data-theme="dark"] .brand-featured-count,
html[data-theme="dark"] .brand-card-featured div:not(.brand-featured-rank) {
    color: #94a3b8 !important;
    background: rgba(255, 255, 255, 0.08) !important;
}

html[data-theme="dark"] .brand-item {
    background: #141c2e !important;
    border: 1px solid #223049 !important;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2) !important;
}

html[data-theme="dark"] .brand-item a {
    color: #cbd5e1 !important;
}

html[data-theme="dark"] .brand-item-title,
html[data-theme="dark"] .brand-item h4 {
    color: #f8fafc !important;
}

html[data-theme="dark"] .brand-item-count {
    color: #60a5fa !important;
    background: rgba(96, 165, 250, 0.12) !important;
}

html[data-theme="dark"] .brand-hero-wrapper {
    background: #141c2e !important;
    border: 1px solid #223049 !important;
    color: #f8fafc !important;
}

html[data-theme="dark"] .brand-hero-title {
    color: #f8fafc !important;
}

html[data-theme="dark"] .brand-hero-desc {
    color: #94a3b8 !important;
}

html[data-theme="dark"] .brand-filter-btn {
    background: #141c2e !important;
    border: 1px solid #223049 !important;
    color: #cbd5e1 !important;
}

html[data-theme="dark"] .brand-filter-btn:hover {
    background: #1e293b !important;
    color: #ffffff !important;
}

html[data-theme="dark"] .brand-filter-btn.active {
    background: #cc0000 !important;
    border-color: #cc0000 !important;
    color: #ffffff !important;
}

html[data-theme="dark"] .brand-filter-badge {
    background: rgba(255, 255, 255, 0.1) !important;
    color: #cbd5e1 !important;
}

html[data-theme="dark"] .brand-filter-btn.active .brand-filter-badge {
    background: rgba(255, 255, 255, 0.25) !important;
    color: #ffffff !important;
}

html[data-theme="dark"] .no-devices-found {
    background: #141c2e !important;
    border: 1px solid #223049 !important;
    color: #cbd5e1 !important;
}

html[data-theme="dark"] .no-devices-found h3 {
    color: #f8fafc !important;
}

html[data-theme="dark"] .no-devices-found p {
    color: #94a3b8 !important;
}

html[data-theme="dark"] .phone-card-footer {
    background: #141c2e !important;
    border-top: 1px solid #223049 !important;
}

html[data-theme="dark"] .phone-card-title {
    color: #f8fafc !important;
}

html[data-theme="dark"] .pagination-modern .page-link {
    background: #141c2e !important;
    border: 1px solid #223049 !important;
    color: #cbd5e1 !important;
}

html[data-theme="dark"] .pagination-modern .page-link:hover {
    background: #1e293b !important;
    color: #ffffff !important;
}

html[data-theme="dark"] .pagination-modern .page-link.active {
    background: linear-gradient(135deg, var(--primary-color) 0%, #ff4d4d 100%) !important;
    border-color: transparent !important;
    color: #ffffff !important;
}

/* ==========================================================================
   8.2 Legal & Licensing Static Pages
   (Terms, Privacy, Web Notifications, Ad Consent, Cookies, Reprint, DB Licensing, Advertise)
   ========================================================================== */
html[data-theme="dark"] .legal-content-box {
    background: #141c2e !important;
    border: 1px solid #223049 !important;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3) !important;
    color: #cbd5e1 !important;
}

html[data-theme="dark"] .legal-content-box h1,
html[data-theme="dark"] .legal-content-box h2,
html[data-theme="dark"] .legal-content-box h3,
html[data-theme="dark"] .legal-content-box h4 {
    color: #f8fafc !important;
    border-top-color: #223049 !important;
}

html[data-theme="dark"] .legal-content-box p,
html[data-theme="dark"] .legal-content-box li,
html[data-theme="dark"] .legal-content-box span {
    color: #cbd5e1 !important;
}

html[data-theme="dark"] .highlight-box {
    background: #1e1b4b !important;
    border-left: 4px solid #818cf8 !important;
    color: #e0e7ff !important;
}

html[data-theme="dark"] .legal-hero h1 {
    color: #ffffff !important;
}

html[data-theme="dark"] .legal-hero p {
    color: #e2e8f0 !important;
}

/* ==========================================================================
   8.3 Company Pages (About Us, Team, Contact Us, Careers, Ethics, How We Rate)
   ========================================================================== */
/* About Us */
html[data-theme="dark"] .about-card {
    background: #141c2e !important;
    border: 1px solid #223049 !important;
    color: #cbd5e1 !important;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3) !important;
}

html[data-theme="dark"] .about-card h3 {
    color: #f8fafc !important;
}

html[data-theme="dark"] .about-card p {
    color: #cbd5e1 !important;
}

html[data-theme="dark"] .timeline-content {
    background: #141c2e !important;
    border: 1px solid #223049 !important;
    color: #cbd5e1 !important;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.3) !important;
}

html[data-theme="dark"] .timeline-content p {
    color: #cbd5e1 !important;
}

html[data-theme="dark"] .timeline::after {
    background-color: #223049 !important;
}

html[data-theme="dark"] .timeline-item::after {
    background-color: #141c2e !important;
    border-color: var(--primary-color) !important;
}

html[data-theme="dark"] .stat-label {
    color: #94a3b8 !important;
}

html[data-theme="dark"] .manifesto-box {
    background: #0f172a !important;
    border: 1px solid #223049 !important;
    color: #f8fafc !important;
}

html[data-theme="dark"] .team-preview {
    background: #141c2e !important;
    border: 1px solid #223049 !important;
    color: #cbd5e1 !important;
}

html[data-theme="dark"] .team-preview h2 {
    color: #f8fafc !important;
}

html[data-theme="dark"] .team-preview p {
    color: #94a3b8 !important;
}

/* Team Page */
html[data-theme="dark"] .team-page-aggressive {
    background: transparent !important;
    color: #cbd5e1 !important;
}

html[data-theme="dark"] .team-hero-ultra {
    background: #0b0f19 !important;
    border-bottom: 1px solid #223049 !important;
}

html[data-theme="dark"] .aggressive-title {
    -webkit-text-stroke: 1px rgba(255, 255, 255, 0.1) !important;
}

html[data-theme="dark"] .aggressive-title::after {
    background: linear-gradient(to bottom, #ffffff, #94a3b8) !important;
    -webkit-background-clip: text !important;
    background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
}

html[data-theme="dark"] .aggressive-subtitle {
    color: #cbd5e1 !important;
}

html[data-theme="dark"] .glass-panel-ultra,
html[data-theme="dark"] .intro-glass {
    background: #141c2e !important;
    border: 1px solid #223049 !important;
    border-left: 5px solid var(--primary-color) !important;
    box-shadow: 0 40px 100px rgba(0, 0, 0, 0.3) !important;
}

html[data-theme="dark"] .intro-glass p {
    color: #f8fafc !important;
}

html[data-theme="dark"] .intro-glass .secondary-text {
    color: #cbd5e1 !important;
}

html[data-theme="dark"] .radical-card {
    background: #141c2e !important;
    border: 1px solid #223049 !important;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3) !important;
}

html[data-theme="dark"] .radical-card h3 {
    color: #f8fafc !important;
}

html[data-theme="dark"] .role-radical {
    color: #94a3b8 !important;
}

html[data-theme="dark"] .bio-radical {
    color: #cbd5e1 !important;
}

html[data-theme="dark"] .skill-cloud span {
    background: #1e293b !important;
    color: #e2e8f0 !important;
    border: 1px solid #334155 !important;
}

html[data-theme="dark"] .philosophy-text-radical h2 {
    color: #f8fafc !important;
}

html[data-theme="dark"] .philosophy-text-radical p {
    color: #cbd5e1 !important;
}

/* Contact Us Page */
html[data-theme="dark"] .wow-contact-page {
    background: transparent !important;
    color: #cbd5e1 !important;
}

html[data-theme="dark"] .wow-card {
    background: #141c2e !important;
    border: 1px solid #223049 !important;
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.3) !important;
}

html[data-theme="dark"] .wow-card h3 {
    color: #f8fafc !important;
}

html[data-theme="dark"] .wow-card p {
    color: #cbd5e1 !important;
}

html[data-theme="dark"] .glass-panel {
    background: #141c2e !important;
    border: 1px solid #223049 !important;
    box-shadow: 0 40px 100px rgba(0, 0, 0, 0.3) !important;
    color: #cbd5e1 !important;
}

html[data-theme="dark"] .section-title-wow {
    color: #f8fafc !important;
}

html[data-theme="dark"] .wow-input-group label {
    color: #e2e8f0 !important;
}

html[data-theme="dark"] .input-wrapper-wow {
    background: #0f1624 !important;
    border: 2px solid #223049 !important;
}

html[data-theme="dark"] .input-wrapper-wow input,
html[data-theme="dark"] .text-area-wrapper-wow textarea {
    color: #f8fafc !important;
    background: transparent !important;
}

html[data-theme="dark"] .input-wrapper-wow input::placeholder,
html[data-theme="dark"] .text-area-wrapper-wow textarea::placeholder {
    color: #64748b !important;
}

html[data-theme="dark"] .input-wrapper-wow:focus-within {
    background: #172136 !important;
    border-color: #ab0000 !important;
}

html[data-theme="dark"] .wow-captcha-box {
    background: #0f1624 !important;
    border: 1px solid #223049 !important;
    color: #e2e8f0 !important;
}

html[data-theme="dark"] .wow-captcha-box input {
    background: #172136 !important;
    border: 2px solid #223049 !important;
    color: #ffffff !important;
}

html[data-theme="dark"] .sidebar-widget-wow h3 {
    color: #f8fafc !important;
}

html[data-theme="dark"] .wow-checklist li {
    color: #cbd5e1 !important;
}

html[data-theme="dark"] .gradient-widget {
    background: #141c2e !important;
    border: 1px solid #223049 !important;
}

html[data-theme="dark"] .faq-card-wow {
    background: #141c2e !important;
    border: 1px solid #223049 !important;
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.3) !important;
}

html[data-theme="dark"] .faq-q {
    color: #ff4d4d !important;
}

html[data-theme="dark"] .faq-a {
    color: #cbd5e1 !important;
}

html[data-theme="dark"] .social-glass {
    background: #141c2e !important;
    border: 1px solid #223049 !important;
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.3) !important;
}

/* Careers Page */
html[data-theme="dark"] .section-title h2 {
    color: #f8fafc !important;
}

html[data-theme="dark"] .section-title p {
    color: #94a3b8 !important;
}

html[data-theme="dark"] .benefit-card {
    background: #141c2e !important;
    border: 1px solid #223049 !important;
    color: #cbd5e1 !important;
}

html[data-theme="dark"] .benefit-card h3 {
    color: #f8fafc !important;
}

html[data-theme="dark"] .benefit-card p {
    color: #cbd5e1 !important;
}

html[data-theme="dark"] .job-card {
    background: #141c2e !important;
    border: 1px solid #223049 !important;
}

html[data-theme="dark"] .job-card:hover {
    background: #172136 !important;
    border-color: var(--primary-color) !important;
}

html[data-theme="dark"] .job-info h3 {
    color: #f8fafc !important;
}

html[data-theme="dark"] .job-meta,
html[data-theme="dark"] .job-meta span {
    color: #94a3b8 !important;
}

html[data-theme="dark"] .values-box {
    background: #141c2e !important;
    border: 1px solid #223049 !important;
}

html[data-theme="dark"] .value-item h4 {
    color: #ff4d4d !important;
}

html[data-theme="dark"] .value-item p {
    color: #cbd5e1 !important;
}

html[data-theme="dark"] .culture-content h2 {
    color: #f8fafc !important;
}

html[data-theme="dark"] .culture-content p {
    color: #cbd5e1 !important;
}

/* Ethics Page */
html[data-theme="dark"] .ethics-card {
    background: #141c2e !important;
    border: 1px solid #223049 !important;
}

html[data-theme="dark"] .ethics-card h3 {
    color: #f8fafc !important;
}

html[data-theme="dark"] .ethics-card p {
    color: #cbd5e1 !important;
}

html[data-theme="dark"] .policy-box {
    background: #141c2e !important;
    border: 1px solid #223049 !important;
}

html[data-theme="dark"] .policy-title h3 {
    color: #f8fafc !important;
}

html[data-theme="dark"] .policy-title p {
    color: #94a3b8 !important;
}

html[data-theme="dark"] .policy-content p {
    color: #cbd5e1 !important;
}

html[data-theme="dark"] .policy-content strong {
    color: #f8fafc !important;
}

html[data-theme="dark"] .guidance-list {
    background: #141c2e !important;
    border: 1px solid #223049 !important;
}

html[data-theme="dark"] .guidance-item {
    border-bottom-color: #223049 !important;
}

html[data-theme="dark"] .guidance-header h4 {
    color: #f8fafc !important;
}

html[data-theme="dark"] .guidance-body {
    color: #cbd5e1 !important;
}

/* How We Rate Page */
html[data-theme="dark"] .metric-card {
    background: #141c2e !important;
    border: 1px solid #223049 !important;
}

html[data-theme="dark"] .metric-card:hover {
    background: #172136 !important;
}

html[data-theme="dark"] .metric-card h3 {
    color: #f8fafc !important;
}

html[data-theme="dark"] .metric-card ul li {
    color: #cbd5e1 !important;
}

html[data-theme="dark"] .metric-card p {
    color: #94a3b8 !important;
    border-top-color: #223049 !important;
}

html[data-theme="dark"] .scoring-breakdown {
    background: #141c2e !important;
    border: 1px solid #223049 !important;
}

html[data-theme="dark"] .score-circle::after {
    background: #141c2e !important;
}

html[data-theme="dark"] .score-value span:first-child {
    color: #f8fafc !important;
}

html[data-theme="dark"] .score-value span:last-child {
    color: #94a3b8 !important;
}

html[data-theme="dark"] .score-content h3 {
    color: #f8fafc !important;
}

html[data-theme="dark"] .score-content p {
    color: #cbd5e1 !important;
}

/* ==========================================================================
   8.4 Phone Finder, Network Coverage & Official Merchandise
   ========================================================================== */
/* Advanced Phone Finder Page */
html[data-theme="dark"] .finder-sidebar {
    background: #141c2e !important;
    border: 1px solid #223049 !important;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.3) !important;
}

html[data-theme="dark"] .filter-group label {
    color: #cbd5e1 !important;
}

html[data-theme="dark"] .filter-group .form-control,
html[data-theme="dark"] .filter-group select,
html[data-theme="dark"] .filter-group input {
    background: #0f1624 !important;
    border: 1px solid #223049 !important;
    color: #f8fafc !important;
}

html[data-theme="dark"] .results-meta {
    color: #94a3b8 !important;
}

html[data-theme="dark"] .no-results {
    background: #141c2e !important;
    border: 1px solid #223049 !important;
    color: #94a3b8 !important;
}

/* Network Coverage / Carriers */
html[data-theme="dark"] .coverage-card {
    background: #141c2e !important;
    border: 1px solid #223049 !important;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2) !important;
}

html[data-theme="dark"] .coverage-card h2,
html[data-theme="dark"] .coverage-card h3 {
    color: #f8fafc !important;
}

html[data-theme="dark"] .coverage-card-body,
html[data-theme="dark"] .coverage-card p {
    color: #cbd5e1 !important;
}

/* Merchandise */
html[data-theme="dark"] .merch-card {
    background: #141c2e !important;
    border: 1px solid #223049 !important;
}

html[data-theme="dark"] .merch-preview-box {
    background: #0f1624 !important;
}

html[data-theme="dark"] .merch-preview-box i {
    color: #94a3b8 !important;
}

html[data-theme="dark"] .merch-card h4 {
    color: #f8fafc !important;
}

html[data-theme="dark"] .merch-card p {
    color: #cbd5e1 !important;
}

html[data-theme="dark"] .merch-custom-sec {
    background: #141c2e !important;
    border: 1px solid #223049 !important;
    color: #cbd5e1 !important;
}

html[data-theme="dark"] .merch-custom-sec h2 {
    color: #f8fafc !important;
}

html[data-theme="dark"] .merch-custom-sec-body {
    color: #cbd5e1 !important;
}

/* Fallback catch-all for remaining hardcoded light containers in any static page */
html[data-theme="dark"] .content-wrapper [style*="background: #fff"],
html[data-theme="dark"] .content-wrapper [style*="background:#fff"],
html[data-theme="dark"] .content-wrapper [style*="background: #ffffff"],
html[data-theme="dark"] .content-wrapper [style*="background:#ffffff"],
html[data-theme="dark"] .content-wrapper [style*="background: rgb(255, 255, 255)"] {
    background: #141c2e !important;
    border-color: #223049 !important;
    color: #cbd5e1 !important;
}

/* ==========================================================================
   9. Pure AMOLED Black Mode (True #000000)
   ========================================================================== */
html[data-theme="dark"][data-oled="true"],
html[data-theme="dark"][data-oled="true"] body,
html[data-theme="dark"].oled-mode,
html[data-theme="dark"].oled-mode body {
    background-color: #000000 !important;
}

html[data-theme="dark"][data-oled="true"] .sidebar-widget,
html[data-theme="dark"][data-oled="true"] .widget,
html[data-theme="dark"][data-oled="true"] .widget-social-premium,
html[data-theme="dark"][data-oled="true"] .phone-finder-widget,
html[data-theme="dark"][data-oled="true"] .finder-grid,
html[data-theme="dark"][data-oled="true"] .finder-item,
html[data-theme="dark"][data-oled="true"] a.finder-item,
html[data-theme="dark"][data-oled="true"] .brand-card-featured,
html[data-theme="dark"][data-oled="true"] .brand-item,
html[data-theme="dark"][data-oled="true"] .brand-hero-wrapper,
html[data-theme="dark"][data-oled="true"] .brand-filter-btn,
html[data-theme="dark"][data-oled="true"] .no-devices-found,
html[data-theme="dark"][data-oled="true"] .phone-card-footer,
html[data-theme="dark"][data-oled="true"] .pagination-modern .page-link,
html[data-theme="dark"][data-oled="true"] .card,
html[data-theme="dark"][data-oled="true"] .phone-card,
html[data-theme="dark"][data-oled="true"] .news-card,
html[data-theme="dark"][data-oled="true"] .review-card,
html[data-theme="dark"][data-oled="true"] .trending-card,
html[data-theme="dark"][data-oled="true"] .brand-hero-section,
html[data-theme="dark"][data-oled="true"] .calc-card,
html[data-theme="dark"][data-oled="true"] .size-stage-card,
html[data-theme="dark"][data-oled="true"] #sc-stage,
html[data-theme="dark"][data-oled="true"] .legal-content-box,
html[data-theme="dark"][data-oled="true"] .about-card,
html[data-theme="dark"][data-oled="true"] .timeline-content,
html[data-theme="dark"][data-oled="true"] .team-preview,
html[data-theme="dark"][data-oled="true"] .glass-panel-ultra,
html[data-theme="dark"][data-oled="true"] .intro-glass,
html[data-theme="dark"][data-oled="true"] .radical-card,
html[data-theme="dark"][data-oled="true"] .wow-card,
html[data-theme="dark"][data-oled="true"] .glass-panel,
html[data-theme="dark"][data-oled="true"] .faq-card-wow,
html[data-theme="dark"][data-oled="true"] .social-glass,
html[data-theme="dark"][data-oled="true"] .benefit-card,
html[data-theme="dark"][data-oled="true"] .job-card,
html[data-theme="dark"][data-oled="true"] .values-box,
html[data-theme="dark"][data-oled="true"] .ethics-card,
html[data-theme="dark"][data-oled="true"] .policy-box,
html[data-theme="dark"][data-oled="true"] .guidance-list,
html[data-theme="dark"][data-oled="true"] .metric-card,
html[data-theme="dark"][data-oled="true"] .scoring-breakdown,
html[data-theme="dark"][data-oled="true"] .score-circle::after,
html[data-theme="dark"][data-oled="true"] .finder-sidebar,
html[data-theme="dark"][data-oled="true"] .no-results,
html[data-theme="dark"][data-oled="true"] .coverage-card,
html[data-theme="dark"][data-oled="true"] .merch-card,
html[data-theme="dark"][data-oled="true"] .merch-preview-box,
html[data-theme="dark"][data-oled="true"] .merch-custom-sec,
html[data-theme="dark"][data-oled="true"] .footer-social-top-premium .social-item,
html[data-theme="dark"].oled-mode .sidebar-widget,
html[data-theme="dark"].oled-mode .widget,
html[data-theme="dark"].oled-mode .widget-social-premium,
html[data-theme="dark"].oled-mode .phone-finder-widget,
html[data-theme="dark"].oled-mode .finder-grid,
html[data-theme="dark"].oled-mode .finder-item,
html[data-theme="dark"].oled-mode a.finder-item,
html[data-theme="dark"].oled-mode .brand-card-featured,
html[data-theme="dark"].oled-mode .brand-item,
html[data-theme="dark"].oled-mode .brand-hero-wrapper,
html[data-theme="dark"].oled-mode .brand-filter-btn,
html[data-theme="dark"].oled-mode .no-devices-found,
html[data-theme="dark"].oled-mode .phone-card-footer,
html[data-theme="dark"].oled-mode .pagination-modern .page-link,
html[data-theme="dark"].oled-mode .card,
html[data-theme="dark"].oled-mode .phone-card,
html[data-theme="dark"].oled-mode .news-card,
html[data-theme="dark"].oled-mode .review-card,
html[data-theme="dark"].oled-mode .trending-card,
html[data-theme="dark"].oled-mode .brand-hero-section,
html[data-theme="dark"].oled-mode .calc-card,
html[data-theme="dark"].oled-mode .size-stage-card,
html[data-theme="dark"].oled-mode #sc-stage,
html[data-theme="dark"].oled-mode .legal-content-box,
html[data-theme="dark"].oled-mode .about-card,
html[data-theme="dark"].oled-mode .timeline-content,
html[data-theme="dark"].oled-mode .team-preview,
html[data-theme="dark"].oled-mode .glass-panel-ultra,
html[data-theme="dark"].oled-mode .intro-glass,
html[data-theme="dark"].oled-mode .radical-card,
html[data-theme="dark"].oled-mode .wow-card,
html[data-theme="dark"].oled-mode .glass-panel,
html[data-theme="dark"].oled-mode .faq-card-wow,
html[data-theme="dark"].oled-mode .social-glass,
html[data-theme="dark"].oled-mode .benefit-card,
html[data-theme="dark"].oled-mode .job-card,
html[data-theme="dark"].oled-mode .values-box,
html[data-theme="dark"].oled-mode .ethics-card,
html[data-theme="dark"].oled-mode .policy-box,
html[data-theme="dark"].oled-mode .guidance-list,
html[data-theme="dark"].oled-mode .metric-card,
html[data-theme="dark"].oled-mode .scoring-breakdown,
html[data-theme="dark"].oled-mode .score-circle::after,
html[data-theme="dark"].oled-mode .finder-sidebar,
html[data-theme="dark"].oled-mode .no-results,
html[data-theme="dark"].oled-mode .coverage-card,
html[data-theme="dark"].oled-mode .merch-card,
html[data-theme="dark"].oled-mode .merch-preview-box,
html[data-theme="dark"].oled-mode .merch-custom-sec,
html[data-theme="dark"].oled-mode .footer-social-top-premium .social-item {
    background: #000000 !important;
    border-color: #1a1a1a !important;
}

html[data-theme="dark"][data-oled="true"] .main-footer,
html[data-theme="dark"].oled-mode .main-footer {
    background: #000000 !important;
    border-top: 1px solid #1a1a1a !important;
}

html[data-theme="dark"][data-oled="true"] [style*="background: #fff"],
html[data-theme="dark"][data-oled="true"] [style*="background:#fff"],
html[data-theme="dark"][data-oled="true"] [style*="background: #ffffff"],
html[data-theme="dark"][data-oled="true"] [style*="background:#ffffff"] {
    background: #000000 !important;
    border-color: #1a1a1a !important;
}

/* ==========================================================================
   10. Custom Sleek Dark Scrollbar & Aesthetics
   ========================================================================== */
html[data-theme="dark"] ::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

html[data-theme="dark"] ::-webkit-scrollbar-track {
    background: #0b0f19;
}

html[data-theme="dark"] ::-webkit-scrollbar-thumb {
    background: #223049;
    border-radius: 4px;
    border: 2px solid #0b0f19;
}

html[data-theme="dark"] ::-webkit-scrollbar-thumb:hover {
    background: #3b5078;
}

html[data-theme="dark"] ::selection {
    background: #e11d48;
    color: #ffffff;
}

/* Eye-comfort image dimming */
html[data-theme="dark"] img:not(.logo-img):not(.no-dark-filter) {
    filter: brightness(0.92) contrast(1.04);
    transition: filter 0.3s ease;
}

html[data-theme="dark"] img:not(.logo-img):not(.no-dark-filter):hover {
    filter: brightness(1) contrast(1);
}

/* Theme toggle button styling */
.theme-toggle-wrapper {
    display: flex;
    align-items: center;
}

.theme-toggle-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: rgba(255, 255, 255, 0.12);
    border: 1px solid rgba(255, 255, 255, 0.18);
    color: #ffffff;
    padding: 5px 11px;
    border-radius: 20px;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    outline: none;
    transition: all 0.2s ease;
    user-select: none;
}

.theme-toggle-btn:hover {
    background: rgba(255, 255, 255, 0.22);
    transform: translateY(-1px);
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2);
}

.currency-selector {
    transition: all 0.2s ease;
    user-select: none;
}

.currency-selector:hover {
    background: rgba(255, 255, 255, 0.22) !important;
    transform: translateY(-1px);
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2);
}

html[data-theme="dark"] .currency-selector select option {
    background: #1e293b !important;
    color: #ffffff !important;
}

html[data-oled="true"] .currency-selector select option {
    background: #000000 !important;
    color: #ffffff !important;
}

.theme-toggle-chip {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    cursor: pointer;
}

/* Icons visibility */
html:not([data-theme="dark"]) .theme-icon-sun { display: none !important; }
html:not([data-theme="dark"]) .theme-icon-moon { display: inline-block !important; }
html[data-theme="dark"] .theme-icon-moon { display: none !important; }
html[data-theme="dark"] .theme-icon-sun { display: inline-block !important; color: #fbbf24 !important; }