/* ═══════════════════════════════════════════════════════════
   Inventa LaGamigo — theme tokens
   Ported from the lagamigo design system (Space Mono + DM Sans,
   dark charcoal / amber accent). See CLAUDE.md "Frontend" section.
═══════════════════════════════════════════════════════════ */

:root {
    --lagamigo-bg:           #0d0f12;
    --lagamigo-surface:      #141720;
    --lagamigo-surface-2:    #1c2030;
    --lagamigo-surface-3:    #242840;
    --lagamigo-border:       #2a2f45;
    --lagamigo-border-light: #343a54;

    --lagamigo-accent:       #f59e0b;
    --lagamigo-accent-dim:   rgba(245,158,11,0.12);
    --lagamigo-accent-glow:  rgba(245,158,11,0.25);

    --lagamigo-success:      #10b981;
    --lagamigo-danger:       #ef4444;
    --lagamigo-warning:      #f59e0b;
    --lagamigo-warning-bg:   #3d2f00;
    --lagamigo-info:         #3b82f6;

    --lagamigo-text:         #e2e8f0;
    --lagamigo-text-muted:   #64748b;
    --lagamigo-text-dim:     #94a3b8;

    --font-mono: 'Space Mono', monospace;
    --font-body: 'DM Sans', sans-serif;

    /* Bootstrap accent override — amber instead of default blue */
    --bs-primary: #f59e0b;
    --bs-primary-rgb: 245, 158, 11;
    --bs-primary-text-emphasis: #7c4a05;
    --bs-primary-bg-subtle: #fdf1d9;
    --bs-primary-border-subtle: #fbdca3;
    --bs-link-color: #b45f06;
    --bs-link-color-rgb: 180, 95, 6;
    --bs-link-hover-color: #8a4805;

    /* Keep Bootstrap's own body/table tokens in sync with our palette, so
       components that read --bs-body-bg/--bs-body-color directly (.table,
       .card, .bg-body utility, etc.) match instead of falling back to
       Bootstrap's defaults. -rgb needs a literal triplet since Bootstrap
       composes it as rgba(var(--bs-body-bg-rgb), opacity). */
    --bs-body-bg: var(--lagamigo-bg);
    --bs-body-bg-rgb: 13, 15, 18;
    --bs-body-color: var(--lagamigo-text);
}

html[data-bs-theme="light"] {
    --lagamigo-bg:           #f0f2f5;
    --lagamigo-surface:      #ffffff;
    --lagamigo-surface-2:    #f8f9fc;
    --lagamigo-surface-3:    #eef0f6;
    --lagamigo-border:       #d1d5e0;
    --lagamigo-border-light: #e2e6f0;

    --lagamigo-text:         #1e2235;
    --lagamigo-text-muted:   #64748b;
    --lagamigo-text-dim:     #6b7280;

    --lagamigo-accent-dim:   rgba(245,158,11,0.10);
    --lagamigo-accent-glow:  rgba(245,158,11,0.20);

    --lagamigo-warning:      #d97706;
    --lagamigo-warning-bg:   #fef3c7;

    --bs-body-bg-rgb: 240, 242, 245;
}

[data-bs-theme="dark"] {
    --bs-primary-text-emphasis: #fbbf24;
    --bs-primary-bg-subtle: #3d2f00;
    --bs-primary-border-subtle: #7c5e00;
    --bs-link-color: #fbbf24;
    --bs-link-color-rgb: 251, 191, 36;
    --bs-link-hover-color: #fcd34d;
}

body {
    background: var(--lagamigo-bg);
    color: var(--lagamigo-text);
    font-family: var(--font-body);
}

/* Bootstrap's .table-light/.table-dark are fixed contextual variants that
   don't respond to data-bs-theme on their own — re-theme them so table
   headers using these classes follow our palette instead of staying a
   hardcoded near-white/near-black. */
.table-light {
    --bs-table-color: var(--lagamigo-text);
    --bs-table-bg: var(--lagamigo-surface-2);
    --bs-table-border-color: var(--lagamigo-border);
    --bs-table-striped-bg: var(--lagamigo-surface-3);
    --bs-table-striped-color: var(--lagamigo-text);
    --bs-table-active-bg: var(--lagamigo-surface-3);
    --bs-table-active-color: var(--lagamigo-text);
    --bs-table-hover-bg: var(--lagamigo-surface-3);
    --bs-table-hover-color: var(--lagamigo-text);
}

/* .btn-primary/.btn-outline-primary hardcode their own --bs-btn-* variables
   with static Bootstrap-blue hex values rather than reading --bs-primary,
   so the --bs-primary override above never reaches them on its own —
   re-theme those variables directly to the amber accent. */
.btn-primary {
    --bs-btn-color: #000;
    --bs-btn-bg: var(--lagamigo-accent);
    --bs-btn-border-color: var(--lagamigo-accent);
    --bs-btn-hover-color: #000;
    --bs-btn-hover-bg: #fbbf24;
    --bs-btn-hover-border-color: #fbbf24;
    --bs-btn-focus-shadow-rgb: 245, 158, 11;
    --bs-btn-active-color: #000;
    --bs-btn-active-bg: #fbbf24;
    --bs-btn-active-border-color: #fbbf24;
    --bs-btn-disabled-color: #000;
    --bs-btn-disabled-bg: var(--lagamigo-accent);
    --bs-btn-disabled-border-color: var(--lagamigo-accent);
}

.btn-outline-primary {
    --bs-btn-color: var(--lagamigo-accent);
    --bs-btn-border-color: var(--lagamigo-accent);
    --bs-btn-hover-color: #000;
    --bs-btn-hover-bg: var(--lagamigo-accent);
    --bs-btn-hover-border-color: var(--lagamigo-accent);
    --bs-btn-focus-shadow-rgb: 245, 158, 11;
    --bs-btn-active-color: #000;
    --bs-btn-active-bg: var(--lagamigo-accent);
    --bs-btn-active-border-color: var(--lagamigo-accent);
    --bs-btn-disabled-color: var(--lagamigo-accent);
    --bs-btn-disabled-border-color: var(--lagamigo-accent);
}

/* Same hardcoded-blue pattern in form focus rings, active dropdown items,
   and active pagination links — these read their own dedicated variables
   (or plain hex), not --bs-primary, so they need the same direct override. */
.form-control:focus,
.form-select:focus {
    border-color: var(--lagamigo-accent);
    box-shadow: 0 0 0 .25rem var(--lagamigo-accent-glow);
}

.dropdown-item.active,
.dropdown-item:active {
    --bs-dropdown-link-active-bg: var(--lagamigo-accent);
    --bs-dropdown-link-active-color: #000;
}

.page-link {
    --bs-pagination-active-bg: var(--lagamigo-accent);
    --bs-pagination-active-border-color: var(--lagamigo-accent);
    --bs-pagination-active-color: #000;
}
