/* Fonts are self-hosted in fonts.css, imported before this file: no third-party CDN (GDPR). */

/* Light theme, the fallback a tenant with no stored theme renders with: the
   ThemeCompiler overrides every token per tenant, and ThemeTokenContractTest fails
   the build if the two sets drift. Hover always steps away from the surface (ADR-0005). */
:root,
[data-bs-theme='light'] {
    --ap-bg: #f7f5f0;
    --ap-bg-rgb: 247, 245, 240;
    --ap-panel: #ffffff;
    --ap-border: #e2ddd0;
    --ap-text: #201e1d;
    --ap-muted: #4a463c;
    --ap-faint: #6b6659;
    --ap-accent: #c8a24a;
    --ap-accent-rgb: 200, 162, 74;
    --ap-accent-strong: #e3c87c;
    --ap-accent-text: #7c6425;
    --ap-accent-text-hover: #523e00;
    --ap-accent-contrast: #0a0a0b;
}

[data-bs-theme='dark'] {
    --ap-bg: #17171b;
    --ap-bg-rgb: 23, 23, 27;
    --ap-panel: #1f1f24;
    --ap-border: #313139;
    --ap-text: #edeae3;
    --ap-muted: #b6b2a9;
    --ap-faint: #8a8781;
    --ap-accent: #c8a24a;
    --ap-accent-rgb: 200, 162, 74;
    --ap-accent-strong: #e3c87c;
    --ap-accent-text: #c8a24a;
    --ap-accent-text-hover: #e3c87c;
    --ap-accent-contrast: #0a0a0b;
}

/* Map the shared tokens onto Bootstrap for both themes. */
:root {
    /* Typography, spacing and shape defaults; the ThemeCompiler overrides them per tenant. */
    --ap-font-display: 'Archivo', system-ui, sans-serif;
    --ap-font-body: 'Archivo', system-ui, sans-serif;
    --ap-font-mono: 'IBM Plex Mono', ui-monospace, monospace;
    --ap-radius: 0;
    --ap-radius-button: 0;
    --ap-layout-max: none;
    --ap-space-section: 6.5rem;
    --ap-space-block: calc(var(--ap-space-section) / 2);
    --ap-space-tight: 1.25rem;

    --bs-primary: var(--ap-accent);
    --bs-primary-rgb: var(--ap-accent-rgb);
    --bs-body-font-family: var(--ap-font-body);
    --bs-font-monospace: var(--ap-font-mono);
}

/* Every public wrapper is a .container-fluid, so the theme's layout width caps
   them all at once while section backgrounds, hero media and the chrome bars
   stay edge to edge (ADR-0005). Bootstrap already centers the class. */
.container-fluid {
    max-width: var(--ap-layout-max);
}

[data-bs-theme='light'],
[data-bs-theme='dark'] {
    --bs-body-bg: var(--ap-bg);
    --bs-body-bg-rgb: var(--ap-bg-rgb);
    --bs-body-color: var(--ap-text);
    --bs-border-color: var(--ap-border);
    --bs-emphasis-color: var(--ap-text);
    --bs-secondary-color: var(--ap-muted);
}

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

.font-mono {
    font-family: var(--ap-font-mono);
}

a {
    color: var(--ap-accent-text);
    text-decoration: none;
}

a:hover {
    color: var(--ap-accent-text-hover);
}

.text-muted-ap {
    color: var(--ap-muted);
}

.text-faint {
    color: var(--ap-faint);
}

.text-accent {
    color: var(--ap-accent-text);
}

.eyebrow {
    font-family: var(--ap-font-mono);
    font-size: 0.625rem;
    font-weight: 500;
    letter-spacing: 0.24em;
    text-transform: uppercase;
    color: var(--ap-accent-text);
}

/* One voice for both fills: a small mono label inside generous padding. The
   compound .btn-sm rule exists because these single-class vars out-cascade
   Bootstrap's .btn-sm, which is declared earlier at the same specificity. */
.btn-accent,
.btn-outline-accent {
    --bs-btn-padding-x: 1.625rem;
    --bs-btn-padding-y: 1rem;
    --bs-btn-font-size: 0.72rem;
    --bs-btn-line-height: 1.25;
    font-family: var(--ap-font-mono);
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    border-radius: var(--ap-radius-button);
}

.btn-accent.btn-sm,
.btn-outline-accent.btn-sm {
    --bs-btn-padding-x: 1rem;
    --bs-btn-padding-y: 0.6rem;
    --bs-btn-font-size: 0.64rem;
}

.btn-accent {
    --bs-btn-bg: var(--ap-accent);
    --bs-btn-border-color: var(--ap-accent);
    --bs-btn-color: var(--ap-accent-contrast);
    --bs-btn-hover-bg: var(--ap-accent-strong);
    --bs-btn-hover-border-color: var(--ap-accent-strong);
    --bs-btn-hover-color: var(--ap-accent-contrast);
    --bs-btn-active-bg: var(--ap-accent-strong);
    --bs-btn-active-border-color: var(--ap-accent-strong);
}

.btn-outline-accent {
    --bs-btn-color: var(--ap-text);
    --bs-btn-border-color: var(--ap-border);
    --bs-btn-hover-bg: transparent;
    --bs-btn-hover-color: var(--ap-accent-text);
    --bs-btn-hover-border-color: var(--ap-accent);
    --bs-btn-active-bg: var(--ap-accent);
    --bs-btn-active-color: var(--ap-accent-contrast);
    --bs-btn-active-border-color: var(--ap-accent);
}

.pagination {
    --bs-pagination-color: var(--ap-text);
    --bs-pagination-bg: transparent;
    --bs-pagination-border-color: var(--ap-border);
    --bs-pagination-hover-color: var(--ap-accent-text);
    --bs-pagination-hover-bg: transparent;
    --bs-pagination-hover-border-color: var(--ap-accent);
    --bs-pagination-focus-color: var(--ap-accent-text);
    --bs-pagination-focus-bg: transparent;
    --bs-pagination-active-bg: var(--ap-accent);
    --bs-pagination-active-color: var(--ap-accent-contrast);
    --bs-pagination-active-border-color: var(--ap-accent);
    --bs-pagination-disabled-color: var(--ap-muted);
    --bs-pagination-disabled-bg: transparent;
    --bs-pagination-disabled-border-color: var(--ap-border);
    font-family: var(--ap-font-mono);
}

.pagination .page-link {
    border-radius: var(--ap-radius);
}