/* SomaPrint Theme — Teal/Dark */
/* All colors via CSS custom properties. Never use hardcoded Tailwind color classes. */

:root,
[data-theme="dark"] {
    /* Backgrounds */
    --bg-base: #0B1420;
    --bg-nav: #111D2E;
    --bg-surface: #14202F;
    --bg-elevated: #0E1825;

    /* Borders */
    --border: #1E3048;
    --border-hover: #2A4060;

    /* Accent (teal) */
    --accent: #2DD4A8;
    --accent-dim: #0F1F1B;
    --accent-hover: #3EEABC;
    --accent-text: #0B1420;

    /* Semantic */
    --warning: #F0A030;
    --warning-dim: #3D3020;
    --danger: #E8524A;
    --danger-dim: #3D2020;
    --info: #4A9FD8;
    --info-dim: #1E2D3D;

    /* Text */
    --text-primary: #E2E0D8;
    --text-secondary: #8A96A6;
    --text-muted: #5A6A7E;

    /* Layout */
    --sidebar-width: 240px;
    --sidebar-collapsed-width: 64px;
    --topbar-height: 0px;

    /* Misc */
    --color-scheme: dark;
}

[data-theme="light"] {
    --bg-base: #FFFFFF;
    --bg-nav: #F5F5F0;
    --bg-surface: #FFFFFF;
    --bg-elevated: #F0F0EB;

    --border: #E8E6DF;
    --border-hover: #D0CEC8;

    --accent: #1BA882;
    --accent-dim: #E0F5EE;
    --accent-hover: #159A74;
    --accent-text: #FFFFFF;

    --warning: #D08820;
    --warning-dim: #FFF5E0;
    --danger: #D03030;
    --danger-dim: #FFE8E8;
    --info: #3080C0;
    --info-dim: #E0F0FF;

    --text-primary: #2C2C2A;
    --text-secondary: #666660;
    --text-muted: #AAA8A0;

    --color-scheme: light;
}

/* Accent button text — high contrast on teal buttons */
.accent-btn-text {
    color: var(--accent-text) !important;
}

/* Base resets */
*, *::before, *::after {
    box-sizing: border-box;
}

html {
    --font-scale: 1;
    /* Scale the root font-size so all rem-based sizes (Tailwind classes) scale too */
    font-size: calc(16px * var(--font-scale));
}

body {
    margin: 0;
    padding: 0;
    background: var(--bg-base);
    color: var(--text-primary);
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    font-size: 0.8125rem; /* 13px at default scale */
    line-height: 1.5;
    color-scheme: var(--color-scheme);
}

/* Scrollbar styling */
::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}
::-webkit-scrollbar-track {
    background: var(--bg-base);
}
::-webkit-scrollbar-thumb {
    background: var(--border);
    border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover {
    background: var(--border-hover);
}

/* Selection */
::selection {
    background: var(--accent-dim);
    color: var(--text-primary);
}

/* ── Mobile responsive ────────────────────────────────────── */
@media (max-width: 768px) {
    #sidebar {
        transform: translateX(-100%);
        transition: transform 0.2s ease;
    }
    #sidebar.mobile-open {
        transform: translateX(0);
    }
    #sidebar-overlay {
        display: none;
    }
    #sidebar-overlay.mobile-open {
        display: block;
    }
    main {
        margin-left: 0 !important;
    }
    #mobile-hamburger {
        display: flex !important;
    }
}

@media (min-width: 769px) {
    #mobile-hamburger {
        display: none !important;
    }
    #sidebar-overlay {
        display: none !important;
    }
}

/* Mobile table scroll */
@media (max-width: 768px) {
    table {
        display: block;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }
}