/* Tahoe Sound Labs — Base Styles */

/* Color palette — neo-classical luxury with marble and gold */
:root {
    /* Marble backgrounds */
    --tsl-bg:           #0a0a0f;
    --tsl-bg-light:     #101018;
    --tsl-bg-card:      #13131c;
    --tsl-border:       #1e1e2a;

    /* Brand logo colors — cool accents */
    --tsl-blue-main:     #6dd5fb;
    --tsl-blue-secondary:#1b5bb5;

    /* Gold luxury palette */
    --tsl-gold:          #d4a853;
    --tsl-gold-light:    #e8c97a;
    --tsl-gold-dark:     #a07830;
    --tsl-gold-subtle:   rgba(212, 168, 83, 0.12);
    --tsl-gold-glow:     rgba(212, 168, 83, 0.08);

    /* Neutrals */
    --tsl-white:         #f4f1eb;
    --tsl-gray:          #7a7570;
    --tsl-gray-light:    #b0aaa2;
}

/* Typography — clean, legible, premium */
html {
    scroll-behavior: smooth;
}

body {
    font-family: 'Segoe UI', system-ui, -apple-system, BlinkMacSystemFont, 'Helvetica Neue', Arial, sans-serif;
    color: var(--tsl-white);
    background-color: var(--tsl-bg);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

h1, h2, h3, h4, h5, h6 {
    font-weight: 500;
    color: var(--tsl-white);
    letter-spacing: -0.01em;
}

a {
    color: var(--tsl-blue-main);
    text-decoration: none;
    transition: color 0.2s ease;
}

a:hover {
    color: var(--tsl-gold-light);
}

/* Subtle utility borders */
hr {
    border-color: var(--tsl-border);
    opacity: 1;
}

/* Minimal focus outline for accessibility */
a:focus-visible,
button:focus-visible {
    outline: 2px solid var(--tsl-gold);
    outline-offset: 2px;
}

/* ═══════════════════════════════════════════════════════
   Light Mode — variable overrides
   ═══════════════════════════════════════════════════════ */

[data-theme="light"] {
    --tsl-bg: #f5f2ec;
    --tsl-bg-light: #ebe7df;
    --tsl-bg-card: #fffdf8;
    --tsl-border: #d4d0c8;
    --tsl-white: #1a1a2e;
    --tsl-gray: #6a6560;
    --tsl-gray-light: #4a4540;
    --tsl-gold-subtle: rgba(212, 168, 83, 0.2);
    --tsl-gold-glow: rgba(212, 168, 83, 0.06);
    --tsl-blue-main:     #1e5faa;
}

/* Swap section backgrounds in light mode so hierarchy stays correct */
[data-theme="light"] .section-dark {
    background: var(--tsl-bg-light);
}
[data-theme="light"] .section-light {
    background: var(--tsl-bg);
}

[data-theme="light"] .contact-section {
    background: linear-gradient(180deg, var(--tsl-bg) 0%, var(--tsl-bg-light) 100%);
}

/* ── Light mode navbar override ── */
[data-theme="light"] .navbar-dark {
    background-color: var(--tsl-bg) !important;
    border-bottom: 1px solid var(--tsl-border);
}

[data-theme="light"] .navbar-dark .navbar-brand,
[data-theme="light"] .navbar-dark .navbar-nav .nav-link {
    color: var(--tsl-white) !important;
}

[data-theme="light"] .navbar-dark .navbar-nav .nav-link:hover {
    color: var(--tsl-gold) !important;
}

[data-theme="light"] .navbar-toggler {
    border-color: var(--tsl-border);
}

[data-theme="light"] .navbar-toggler-icon {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba(26,26,46,0.75)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e") !important;
}

/* ── Mobile floating theme button ── */
.theme-fab {
    position: fixed;
    bottom: 1.5rem;
    right: 1.5rem;
    width: 2.75rem;
    height: 2.75rem;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.3rem;
    background: var(--tsl-bg-card);
    border: 1px solid var(--tsl-border);
    border-radius: 50%;
    box-shadow: 0 2px 12px rgba(0,0,0,0.15);
    z-index: 1000;
    transition: background 0.2s, color 0.2s;
}

.theme-fab:active {
    opacity: 0.8;
}

@media (max-width: 767px) {
    .theme-fab {
        display: flex !important;
    }
}