/* ==========================================================================
   Signx - Integrated Studios: Ultra-Luxury Architectural Dark & Light System
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. Theme Transitions & Global Properties
   -------------------------------------------------------------------------- */
:root {
    --signx-gold: #ff6b00;
    --signx-gold-light: #ff8533;
    --signx-gold-glow: rgba(255, 107, 0, 0.38);
    --signx-dark-canvas: #090a0d;
    --signx-dark-surface: #0f1218;
    --signx-dark-card: #131720;
    --signx-dark-card-hover: #1a202c;
    --signx-dark-border: rgba(255, 255, 255, 0.08);
    --signx-dark-border-gold: rgba(255, 107, 0, 0.45);
    --signx-text-main-dark: #f8fafc;
    --signx-text-body-dark: #cbd5e1;
    --signx-text-muted-dark: #94a3b8;
    
    --theme-ease: all 0.35s cubic-bezier(0.4, 0, 0.2, 1);
}

body {
    transition: background-color 0.35s ease, color 0.35s ease;
}

body.theme-transitioning,
body.theme-transitioning * {
    transition: background-color 0.35s ease, color 0.35s ease, border-color 0.35s ease, box-shadow 0.35s ease !important;
}

/* --------------------------------------------------------------------------
   2. Theme Switcher Buttons (Bespoke Luxury Styling)
   -------------------------------------------------------------------------- */
.theme-toggle-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.08);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border: 1px solid rgba(255, 255, 255, 0.2);
    color: #ffffff;
    cursor: pointer;
    font-size: 19px;
    transition: var(--theme-ease);
    outline: none;
    padding: 0;
    margin-right: 14px;
    position: relative;
    overflow: hidden;
}

.theme-toggle-btn:hover {
    background: #ff6b00;
    color: #0c0e12;
    border-color: #ff6b00;
    transform: translateY(-2px) scale(1.06);
    box-shadow: 0 8px 24px rgba(197, 168, 128, 0.4);
}

/* Light header context */
body:not(.dark-scheme) header.header-light .theme-toggle-btn {
    background: rgba(0, 0, 0, 0.04);
    border: 1px solid rgba(0, 0, 0, 0.12);
    color: #1a1e24;
}

body:not(.dark-scheme) header.header-light .theme-toggle-btn:hover {
    background: #ff6b00;
    border-color: #ff6b00;
    color: #0c0e12;
}

/* Floating Corner Toggle Widget */
.floating-theme-toggle {
    position: fixed;
    bottom: 28px;
    left: 28px;
    z-index: 9995;
    width: 48px;
    height: 48px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    border: 1px solid rgba(197, 168, 128, 0.45);
    background: rgba(19, 22, 28, 0.9);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    color: #ff6b00;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.4);
    transition: var(--theme-ease);
    outline: none;
}

.floating-theme-toggle:hover {
    background: #ff6b00;
    color: #0c0e12;
    border-color: #dfc194;
    transform: translateY(-3px) scale(1.1);
    box-shadow: 0 14px 35px rgba(197, 168, 128, 0.5);
}

/* Floating button in light mode */
body:not(.dark-scheme) .floating-theme-toggle {
    background: rgba(255, 255, 255, 0.92);
    border: 1px solid rgba(0, 0, 0, 0.12);
    color: #1e2229;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.12);
}

body:not(.dark-scheme) .floating-theme-toggle:hover {
    background: #ff6b00;
    color: #0c0e12;
    border-color: #ff6b00;
}

/* Icon Switching & Spring Animation */
.theme-icon-light {
    display: none;
    transform: rotate(-90deg) scale(0);
    transition: transform 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);
}
.theme-icon-dark {
    display: inline-block;
    transform: rotate(0deg) scale(1);
    transition: transform 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);
}

:is(html.dark-scheme, body.dark-scheme) .theme-icon-dark {
    display: none !important;
    transform: rotate(90deg) scale(0);
}
:is(html.dark-scheme, body.dark-scheme) .theme-icon-light {
    display: inline-block !important;
    color: #ffd166;
    transform: rotate(0deg) scale(1);
}

/* --------------------------------------------------------------------------
   3. Architectural Dark Mode - Global Layout & Surfaces
   -------------------------------------------------------------------------- */
:is(html.dark-scheme, body.dark-scheme) {
    background-color: var(--signx-dark-canvas) !important;
    color: var(--signx-text-body-dark) !important;
    letter-spacing: -0.01em;
}

:is(html.dark-scheme, body.dark-scheme) #wrapper {
    background-color: var(--signx-dark-canvas) !important;
}

:is(html.dark-scheme, body.dark-scheme) section {
    background-color: var(--signx-dark-canvas) !important;
    color: var(--signx-text-body-dark);
}

/* Alternative & Highlight Sections */
:is(html.dark-scheme, body.dark-scheme) section.bg-light,
:is(html.dark-scheme, body.dark-scheme) section.bg-color-op-1,
:is(html.dark-scheme, body.dark-scheme) .bg-light,
:is(html.dark-scheme, body.dark-scheme) .bg-color-op-1 {
    background-color: var(--signx-dark-surface) !important;
    color: var(--signx-text-body-dark) !important;
}

:is(html.dark-scheme, body.dark-scheme) .bg-white,
:is(html.dark-scheme, body.dark-scheme) .bg-default {
    background-color: var(--signx-dark-surface) !important;
    color: var(--signx-text-body-dark) !important;
}

/* --------------------------------------------------------------------------
   4. Header & Navigation (Ultra-Sleek Glassmorphic & Theme-Synchronized)
   -------------------------------------------------------------------------- */

/* --- DARK MODE HEADER & NAVIGATION --- */
/* Applied in Dark Mode across all pages, scrolled and unscrolled */
:is(html.dark-scheme, body.dark-scheme) header,
:is(html.dark-scheme, body.dark-scheme) header.header-light,
:is(html.dark-scheme, body.dark-scheme) header.scroll-light,
:is(html.dark-scheme, body.dark-scheme) header.smaller {
    background: rgba(12, 14, 18, 0.96) !important;
    backdrop-filter: blur(20px) !important;
    -webkit-backdrop-filter: blur(20px) !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.6) !important;
}

:is(html.dark-scheme, body.dark-scheme) header.transparent:not(.smaller) {
    background: transparent !important;
    border-bottom: none !important;
    box-shadow: none !important;
}

:is(html.dark-scheme, body.dark-scheme) header.smaller {
    background: rgba(12, 14, 18, 0.98) !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.75) !important;
}

/* Dark Mode: All Header Navigation Text MUST BE CRISP WHITE */
:is(html.dark-scheme, body.dark-scheme) #mainmenu > li > a,
:is(html.dark-scheme, body.dark-scheme) header #mainmenu > li > a,
:is(html.dark-scheme, body.dark-scheme) header.header-light #mainmenu > li > a,
:is(html.dark-scheme, body.dark-scheme) header.header-light #mainmenu a,
:is(html.dark-scheme, body.dark-scheme) .header-light #mainmenu > li > a,
:is(html.dark-scheme, body.dark-scheme) header.scroll-light #mainmenu a,
:is(html.dark-scheme, body.dark-scheme) header.scroll-light #mainmenu > li > a,
:is(html.dark-scheme, body.dark-scheme) header.smaller #mainmenu a,
:is(html.dark-scheme, body.dark-scheme) header.smaller #mainmenu > li > a,
:is(html.dark-scheme, body.dark-scheme) header.smaller.scroll-light #mainmenu li a,
:is(html.dark-scheme, body.dark-scheme) #mainmenu a.menu-item,
:is(html.dark-scheme, body.dark-scheme) header.header-light.header-mobile #mainmenu a.menu-item {
    color: #ffffff !important;
    font-weight: 500;
    transition: var(--theme-ease);
}

/* Dark Mode: Main Menu Hover & Active States (Signature Signx Orange / Gold) */
:is(html.dark-scheme, body.dark-scheme) #mainmenu > li > a:hover,
:is(html.dark-scheme, body.dark-scheme) #mainmenu > li > a.active,
:is(html.dark-scheme, body.dark-scheme) header.header-light #mainmenu > li > a:hover,
:is(html.dark-scheme, body.dark-scheme) header.header-light #mainmenu > li > a.active,
:is(html.dark-scheme, body.dark-scheme) header.scroll-light #mainmenu a:hover,
:is(html.dark-scheme, body.dark-scheme) header.scroll-light #mainmenu a.active,
:is(html.dark-scheme, body.dark-scheme) header.smaller #mainmenu a.active,
:is(html.dark-scheme, body.dark-scheme) #mainmenu a.menu-item.active,
:is(html.dark-scheme, body.dark-scheme) #mainmenu a.menu-item:hover {
    color: #ff6b00 !important;
    text-shadow: 0 0 16px rgba(255, 107, 0, 0.45);
}

/* Dark Mode: Dropdown Indicator Arrows (Always Visible White/Translucent) */
:is(html.dark-scheme, body.dark-scheme) #mainmenu > li.has-child:after,
:is(html.dark-scheme, body.dark-scheme) #mainmenu li.has-child:after,
:is(html.dark-scheme, body.dark-scheme) .header-light #mainmenu li.has-child:after,
:is(html.dark-scheme, body.dark-scheme) header.header-light #mainmenu li.has-child:after,
:is(html.dark-scheme, body.dark-scheme) header.smaller.scroll-light #mainmenu li.has-child:after {
    color: rgba(255, 255, 255, 0.85) !important;
}

:is(html.dark-scheme, body.dark-scheme) #mainmenu > li.has-child:hover:after {
    color: #ff6b00 !important;
}

/* Dark Mode: Dropdown Submenu Container */
:is(html.dark-scheme, body.dark-scheme) #mainmenu ul,
:is(html.dark-scheme, body.dark-scheme) .header-light #mainmenu ul,
:is(html.dark-scheme, body.dark-scheme) header.header-light #mainmenu ul {
    background: rgba(18, 21, 28, 0.98) !important;
    backdrop-filter: blur(24px) !important;
    -webkit-backdrop-filter: blur(24px) !important;
    border: 1px solid rgba(255, 107, 0, 0.25) !important;
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.8) !important;
    border-radius: 6px;
}

/* Dark Mode: Dropdown Submenu Links */
:is(html.dark-scheme, body.dark-scheme) #mainmenu ul li a,
:is(html.dark-scheme, body.dark-scheme) #mainmenu li li a,
:is(html.dark-scheme, body.dark-scheme) .header-light #mainmenu ul li a,
:is(html.dark-scheme, body.dark-scheme) .header-light #mainmenu ul li a.menu-item,
:is(html.dark-scheme, body.dark-scheme) header.header-light #mainmenu ul li a {
    color: #f1f5f9 !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.05) !important;
    transition: all 0.2s ease;
}

:is(html.dark-scheme, body.dark-scheme) #mainmenu ul li a:hover,
:is(html.dark-scheme, body.dark-scheme) #mainmenu li li a:hover,
:is(html.dark-scheme, body.dark-scheme) .header-light #mainmenu ul li a.menu-item:hover {
    color: #ffffff !important;
    background: rgba(255, 107, 0, 0.14) !important;
    padding-left: 24px;
}

/* Dark Mode: Mobile Header, Menu & Hamburger */
:is(html.dark-scheme, body.dark-scheme) header.header-mobile,
:is(html.dark-scheme, body.dark-scheme) header.header-mobile.header-light {
    background: #0c0e12 !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important;
}

:is(html.dark-scheme, body.dark-scheme) #menu-btn,
:is(html.dark-scheme, body.dark-scheme) header.header-mobile.header-light #menu-btn,
:is(html.dark-scheme, body.dark-scheme) #menu-btn:before,
:is(html.dark-scheme, body.dark-scheme) #menu-btn:after {
    color: #ffffff !important;
}

:is(html.dark-scheme, body.dark-scheme) header.header-mobile #mainmenu a.menu-item,
:is(html.dark-scheme, body.dark-scheme) header.header-light.header-mobile #mainmenu a.menu-item {
    color: #ffffff !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
}

:is(html.dark-scheme, body.dark-scheme) header.header-mobile #mainmenu a.menu-item:hover,
:is(html.dark-scheme, body.dark-scheme) header.header-mobile #mainmenu a.menu-item.active {
    color: #ff6b00 !important;
}

:is(html.dark-scheme, body.dark-scheme) header.header-mobile #mainmenu li {
    border-bottom-color: rgba(255, 255, 255, 0.08) !important;
}

/* Dark Mode: Theme Toggle Button in Header */
:is(html.dark-scheme, body.dark-scheme) header .theme-toggle-btn {
    background: rgba(255, 255, 255, 0.08) !important;
    border: 1px solid rgba(255, 255, 255, 0.18) !important;
    color: #ffd166 !important;
}

:is(html.dark-scheme, body.dark-scheme) header .theme-toggle-btn:hover {
    background: #ff6b00 !important;
    border-color: #ff6b00 !important;
    color: #0c0e12 !important;
}


/* --- LIGHT MODE HEADER & NAVIGATION --- */
/* In Light Mode, header text on .header-light or scrolled states shows the other color (dark slate / #141822) */
:not(.dark-scheme) header.header-light,
:not(.dark-scheme) header.scroll-light,
:not(.dark-scheme) header.header-light.smaller,
body:not(.dark-scheme) header.header-light,
body:not(.dark-scheme) header.scroll-light,
body:not(.dark-scheme) header.header-light.smaller {
    background: rgba(255, 255, 255, 0.98) !important;
    border-bottom: 1px solid rgba(0, 0, 0, 0.08) !important;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.04) !important;
}

:not(.dark-scheme) header.header-light #mainmenu > li > a,
:not(.dark-scheme) header.scroll-light #mainmenu > li > a,
:not(.dark-scheme) header.smaller.scroll-light #mainmenu > li > a,
:not(.dark-scheme) .header-light #mainmenu > li > a,
body:not(.dark-scheme) header.header-light #mainmenu > li > a,
body:not(.dark-scheme) header.scroll-light #mainmenu > li > a,
body:not(.dark-scheme) header.smaller.scroll-light #mainmenu > li > a,
body:not(.dark-scheme) .header-light #mainmenu > li > a {
    color: #141822 !important;
    font-weight: 500;
}

:not(.dark-scheme) header.header-light #mainmenu > li > a:hover,
:not(.dark-scheme) header.header-light #mainmenu > li > a.active,
:not(.dark-scheme) header.scroll-light #mainmenu > li > a:hover,
:not(.dark-scheme) header.scroll-light #mainmenu > li > a.active,
body:not(.dark-scheme) header.header-light #mainmenu > li > a:hover,
body:not(.dark-scheme) header.header-light #mainmenu > li > a.active,
body:not(.dark-scheme) header.scroll-light #mainmenu > li > a:hover,
body:not(.dark-scheme) header.scroll-light #mainmenu > li > a.active {
    color: #ff6b00 !important;
}

:not(.dark-scheme) header.header-light #mainmenu li.has-child:after,
:not(.dark-scheme) header.scroll-light #mainmenu li.has-child:after,
:not(.dark-scheme) .header-light #mainmenu li.has-child:after,
body:not(.dark-scheme) header.header-light #mainmenu li.has-child:after,
body:not(.dark-scheme) header.scroll-light #mainmenu li.has-child:after,
body:not(.dark-scheme) .header-light #mainmenu li.has-child:after {
    color: rgba(20, 24, 34, 0.75) !important;
}

:not(.dark-scheme) header.header-light #mainmenu li.has-child:hover:after,
body:not(.dark-scheme) header.header-light #mainmenu li.has-child:hover:after {
    color: #ff6b00 !important;
}

/* Light Mode: Dropdown Submenus */
:not(.dark-scheme) header.header-light #mainmenu ul,
body:not(.dark-scheme) header.header-light #mainmenu ul {
    background: #ffffff !important;
    border: 1px solid rgba(0, 0, 0, 0.08) !important;
    box-shadow: 0 16px 40px rgba(0, 0, 0, 0.1) !important;
}

:not(.dark-scheme) header.header-light #mainmenu ul li a,
:not(.dark-scheme) header.header-light #mainmenu ul li a.menu-item,
body:not(.dark-scheme) header.header-light #mainmenu ul li a,
body:not(.dark-scheme) header.header-light #mainmenu ul li a.menu-item {
    color: #1e293b !important;
    border-bottom: 1px solid rgba(0, 0, 0, 0.05) !important;
}

:not(.dark-scheme) header.header-light #mainmenu ul li a:hover,
body:not(.dark-scheme) header.header-light #mainmenu ul li a:hover {
    color: #ff6b00 !important;
    background: rgba(255, 107, 0, 0.08) !important;
    padding-left: 24px;
}

/* Light Mode: Mobile Header & Hamburger */
:not(.dark-scheme) header.header-mobile.header-light #menu-btn,
body:not(.dark-scheme) header.header-mobile.header-light #menu-btn,
:not(.dark-scheme) header.header-mobile.header-light #menu-btn:before,
body:not(.dark-scheme) header.header-mobile.header-light #menu-btn:before {
    color: #141822 !important;
}

/* Light Mode: Transparent Homepage Hero Header Preserves White Text */
:not(.dark-scheme) header.transparent:not(.smaller) #mainmenu > li > a,
body:not(.dark-scheme) header.transparent:not(.smaller) #mainmenu > li > a {
    color: #ffffff !important;
}

:not(.dark-scheme) header.transparent:not(.smaller) #mainmenu > li > a:hover,
:not(.dark-scheme) header.transparent:not(.smaller) #mainmenu > li > a.active,
body:not(.dark-scheme) header.transparent:not(.smaller) #mainmenu > li > a:hover,
body:not(.dark-scheme) header.transparent:not(.smaller) #mainmenu > li > a.active {
    color: #ff6b00 !important;
}

:not(.dark-scheme) header.transparent:not(.smaller) #mainmenu li.has-child:after,
body:not(.dark-scheme) header.transparent:not(.smaller) #mainmenu li.has-child:after {
    color: rgba(255, 255, 255, 0.85) !important;
}

:not(.dark-scheme) header.transparent:not(.smaller) #menu-btn:before,
body:not(.dark-scheme) header.transparent:not(.smaller) #menu-btn:before {
    color: #ffffff !important;
}

/* --------------------------------------------------------------------------
   5. Typography, Headings & Editorial Elements
   -------------------------------------------------------------------------- */
body.dark-scheme h1,
body.dark-scheme h2,
body.dark-scheme h3,
body.dark-scheme h4,
body.dark-scheme h5,
body.dark-scheme h6,
body.dark-scheme .h1,
body.dark-scheme .h2,
body.dark-scheme .h3,
body.dark-scheme .h4,
body.dark-scheme .h5,
body.dark-scheme .h6 {
    color: #ffffff !important;
    letter-spacing: -0.015em;
}

body.dark-scheme p,
body.dark-scheme li {
    color: var(--signx-text-body-dark) !important;
    line-height: 1.75;
}

/* Invert hardcoded dark text classes */
body.dark-scheme .text-dark,
body.dark-scheme .text-black,
body.dark-scheme a.text-dark {
    color: #f1f5f9 !important;
}

body.dark-scheme a.text-dark:hover {
    color: #ff6b00 !important;
}

body.dark-scheme .text-muted,
body.dark-scheme small.text-muted {
    color: var(--signx-text-muted-dark) !important;
}

/* Luxury Champagne Gold Subtitles */
body.dark-scheme .subtitle {
    color: #ff6b00 !important;
    letter-spacing: 3px;
    font-weight: 600;
    text-transform: uppercase;
    font-size: 13px;
    text-shadow: 0 0 20px rgba(197, 168, 128, 0.25);
}

body.dark-scheme .lead {
    color: #e2e8f0 !important;
}

/* --------------------------------------------------------------------------
   6. Statistics Counter Section
   -------------------------------------------------------------------------- */
body.dark-scheme .de_count h3 {
    color: #ff6b00 !important;
    font-weight: 700;
    letter-spacing: -0.02em;
    text-shadow: 0 0 30px rgba(197, 168, 128, 0.35);
}

body.dark-scheme .de_count {
    color: var(--signx-text-muted-dark) !important;
    font-size: 14px;
    letter-spacing: 0.5px;
    text-transform: uppercase;
}

/* --------------------------------------------------------------------------
   7. Buttons & Interactive Links
   -------------------------------------------------------------------------- */
body.dark-scheme .btn-main {
    background: #ff6b00 !important;
    color: #0c0e12 !important;
    font-weight: 600 !important;
    border-color: #ff6b00 !important;
    box-shadow: 0 6px 25px rgba(197, 168, 128, 0.35);
    transition: var(--theme-ease);
}

body.dark-scheme .btn-main:hover {
    background: #dfc194 !important;
    border-color: #dfc194 !important;
    color: #0c0e12 !important;
    box-shadow: 0 10px 30px rgba(197, 168, 128, 0.5);
    transform: translateY(-2px);
}

body.dark-scheme .btn-line,
body.dark-scheme a.btn-line {
    color: #ff6b00 !important;
    border-bottom: 2px solid #ff6b00 !important;
    transition: var(--theme-ease);
}

body.dark-scheme .btn-line:hover,
body.dark-scheme a.btn-line:hover {
    color: #ffffff !important;
    border-bottom-color: #ffffff !important;
}

/* Portfolio Filter Tabs */
body.dark-scheme .btn-outline-dark {
    color: #cbd5e1 !important;
    border-color: rgba(255, 255, 255, 0.14) !important;
    background: var(--signx-dark-card) !important;
    transition: var(--theme-ease);
}

body.dark-scheme .btn-outline-dark:hover {
    color: #0c0e12 !important;
    background: #ff6b00 !important;
    border-color: #ff6b00 !important;
    box-shadow: 0 6px 20px rgba(197, 168, 128, 0.35);
}

body.dark-scheme .btn-link {
    color: #ff6b00 !important;
    font-weight: 500;
}

body.dark-scheme .btn-link:hover {
    color: #dfc194 !important;
    text-decoration: underline;
}

/* --------------------------------------------------------------------------
   8. Form Controls & Consultation Estimator
   -------------------------------------------------------------------------- */
body.dark-scheme .bg-light.p-40,
body.dark-scheme .rounded-1.p-40 {
    background: linear-gradient(160deg, #181c25 0%, #12151b 100%) !important;
    border: 1px solid var(--signx-dark-border) !important;
    border-top: 3px solid #ff6b00 !important;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.65) !important;
}

body.dark-scheme .form-control,
body.dark-scheme .form-select,
body.dark-scheme input[type="text"],
body.dark-scheme input[type="email"],
body.dark-scheme input[type="password"],
body.dark-scheme select,
body.dark-scheme textarea {
    background-color: #0c0e12 !important;
    color: #ffffff !important;
    border: 1px solid rgba(255, 255, 255, 0.12) !important;
    border-radius: 4px !important;
    padding: 12px 16px !important;
    font-size: 15px !important;
    transition: var(--theme-ease);
}

body.dark-scheme .form-control:focus,
body.dark-scheme .form-select:focus,
body.dark-scheme textarea:focus {
    background-color: #12151b !important;
    border-color: #ff6b00 !important;
    box-shadow: 0 0 0 3px rgba(197, 168, 128, 0.25) !important;
    color: #ffffff !important;
}

body.dark-scheme .form-control::placeholder,
body.dark-scheme textarea::placeholder {
    color: #64748b !important;
}

body.dark-scheme .field-set label,
body.dark-scheme label {
    color: #e2e8f0 !important;
    font-weight: 500;
}

/* Form checkboxes in estimator */
body.dark-scheme .form-check-input {
    background-color: #0c0e12;
    border-color: rgba(255, 255, 255, 0.2);
}

body.dark-scheme .form-check-input:checked {
    background-color: #ff6b00;
    border-color: #ff6b00;
}

body.dark-scheme .form-check-label {
    color: #cbd5e1;
}

/* --------------------------------------------------------------------------
   9. Cards, Portfolios & Services
   -------------------------------------------------------------------------- */
body.dark-scheme .card {
    background: var(--signx-dark-card) !important;
    border: 1px solid var(--signx-dark-border) !important;
    color: var(--signx-text-body-dark) !important;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.4) !important;
    transition: var(--theme-ease);
}

body.dark-scheme .card:hover {
    border-color: var(--signx-dark-border-gold) !important;
    box-shadow: 0 16px 45px rgba(0, 0, 0, 0.6) !important;
    transform: translateY(-3px);
}

body.dark-scheme .soft-shadow {
    box-shadow: 0 16px 40px rgba(0, 0, 0, 0.5) !important;
}

/* Service Detail Highlight Boxes */
.service-highlight-box {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
    transition: transform 0.25s ease, border-color 0.25s ease, box-shadow 0.25s ease;
}

.service-highlight-box:hover {
    border-color: rgba(197, 168, 128, 0.45) !important;
    transform: translateY(-2px);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15);
}

body.dark-scheme .service-highlight-box,
body.dark-scheme .d-flex.align-items-center.p-3.bg-light {
    background: var(--signx-dark-card) !important;
    border: 1px solid var(--signx-dark-border) !important;
}

body.dark-scheme .service-highlight-box:hover {
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.35);
}

body.dark-scheme .p-4.bg-light.rounded-1.h-100.border-start {
    background: var(--signx-dark-card) !important;
    border-left: 4px solid #ff6b00 !important;
    border-top: 1px solid var(--signx-dark-border);
    border-right: 1px solid var(--signx-dark-border);
    border-bottom: 1px solid var(--signx-dark-border);
}

/* Badges */
body.dark-scheme .badge.bg-light {
    background: #1f2530 !important;
    color: #ff6b00 !important;
    border: 1px solid rgba(197, 168, 128, 0.25) !important;
}

body.dark-scheme .badge.bg-secondary {
    background: #252b37 !important;
    color: #e2e8f0 !important;
    border: 1px solid rgba(255, 255, 255, 0.08);
}

/* --------------------------------------------------------------------------
   10. FAQ Accordions
   -------------------------------------------------------------------------- */
body.dark-scheme .accordion-item {
    background-color: var(--signx-dark-card) !important;
    border: 1px solid var(--signx-dark-border) !important;
}

body.dark-scheme .accordion-button {
    background-color: var(--signx-dark-card) !important;
    color: #ffffff !important;
    border: none !important;
    box-shadow: none !important;
    transition: var(--theme-ease);
}

body.dark-scheme .accordion-button:not(.collapsed) {
    background-color: #1e2430 !important;
    color: #ff6b00 !important;
    border-left: 4px solid #ff6b00 !important;
}

body.dark-scheme .accordion-body {
    background-color: #12151b !important;
    color: var(--signx-text-body-dark) !important;
    border-top: 1px solid rgba(255, 255, 255, 0.06);
}

body.dark-scheme .accordion-button::after {
    filter: brightness(0) invert(1) !important;
}

/* --------------------------------------------------------------------------
   11. Testimonials & Verified Reviews
   -------------------------------------------------------------------------- */
body.dark-scheme .p-40.bg-light.rounded-1.soft-shadow {
    background: linear-gradient(155deg, #171b23 0%, #11141a 100%) !important;
    border: 1px solid var(--signx-dark-border) !important;
}

body.dark-scheme .text-warning i {
    color: #ff6b00 !important;
    text-shadow: 0 0 10px rgba(197, 168, 128, 0.4);
}

/* --------------------------------------------------------------------------
   12. Subheader & Breadcrumbs
   -------------------------------------------------------------------------- */
body.dark-scheme #subheader {
    background-color: #101217 !important;
    border-bottom: 1px solid var(--signx-dark-border) !important;
}

body.dark-scheme .crumb li,
body.dark-scheme .crumb li a {
    color: var(--signx-text-muted-dark) !important;
}

body.dark-scheme .crumb li a:hover {
    color: #ff6b00 !important;
}

/* --------------------------------------------------------------------------
   13. Footer
   -------------------------------------------------------------------------- */
body.dark-scheme footer {
    background-color: #08090c !important;
    border-top: 1px solid rgba(255, 255, 255, 0.08) !important;
}

body.dark-scheme footer .widget ul li a {
    color: #94a3b8 !important;
    transition: var(--theme-ease);
}

body.dark-scheme footer .widget ul li a:hover {
    color: #ff6b00 !important;
    padding-left: 4px;
}

/* --------------------------------------------------------------------------
   14. Custom Obsidian Scrollbar
   -------------------------------------------------------------------------- */
body.dark-scheme::-webkit-scrollbar {
    width: 9px;
}

body.dark-scheme::-webkit-scrollbar-track {
    background: #0c0e12;
}

body.dark-scheme::-webkit-scrollbar-thumb {
    background: #252b36;
    border-radius: 4px;
    border: 2px solid #0c0e12;
}

body.dark-scheme::-webkit-scrollbar-thumb:hover {
    background: #ff6b00;
}
