/* Brand fonts, self-hosted (SIL Open Font License; see assets/fonts/). No third-party font requests. */
@font-face {
    font-family: 'Unbounded';
    font-style: normal;
    font-weight: 600;
    font-display: swap;
    src: url('../fonts/unbounded-latin-600-normal.woff2') format('woff2');
}
@font-face {
    font-family: 'Unbounded';
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: url('../fonts/unbounded-latin-700-normal.woff2') format('woff2');
}
@font-face {
    font-family: 'Plus Jakarta Sans';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url('../fonts/plus-jakarta-sans-latin-400-normal.woff2') format('woff2');
}
@font-face {
    font-family: 'Plus Jakarta Sans';
    font-style: normal;
    font-weight: 600;
    font-display: swap;
    src: url('../fonts/plus-jakarta-sans-latin-600-normal.woff2') format('woff2');
}
@font-face {
    font-family: 'Plus Jakarta Sans';
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: url('../fonts/plus-jakarta-sans-latin-700-normal.woff2') format('woff2');
}

/*
 * Base tokens, shared by the public site and the admin/owner/manager areas.
 *
 * The colour tokens below are defaults. Each deployment's real values come
 * from Site Settings and are injected as a <style> block after this file
 * (see theme_css_vars() in app/Helpers/functions.php), including the
 * --on-* tokens, which are computed so text stays readable on whatever
 * brand colour a city chooses.
 */
:root {
    --color-primary: #ff6b6b;          /* coral: the action colour */
    --on-primary: #2b2233;             /* text that sits on --color-primary */
    --color-secondary: #8b5cf6;        /* violet: tints and accents */
    --color-secondary-deep: #764ed1;   /* violet dark enough to carry white text */
    --on-secondary-deep: #ffffff;
    --color-base: #2b2233;             /* plum: ink, borders, dark surfaces */

    --cream: #fff6ef;                  /* page ground */
    --gold: #f0a830;                   /* ratings, featured marker */
    --ink-soft: #5e5468;               /* secondary text; 6.6:1 on cream */
    --line: rgba(43, 34, 51, 0.16);    /* hairline borders */

    --font-heading: 'Unbounded', 'Segoe UI', system-ui, sans-serif;
    --font-body: 'Plus Jakarta Sans', 'Segoe UI', system-ui, sans-serif;
}

* { box-sizing: border-box; }

body {
    margin: 0;
    font-family: var(--font-body);
    font-size: 1rem;
    line-height: 1.6;
    color: var(--color-base);
    background: #fff;
}

h1, h2, h3 {
    font-family: var(--font-heading);
    line-height: 1.2;
}

img { max-width: 100%; }

/* Keyboard users must always be able to see where they are */
:focus-visible {
    outline: 3px solid var(--color-secondary-deep);
    outline-offset: 2px;
}

/* 44px minimum tap targets for mobile accessibility */
button, a.button, input[type="submit"] {
    min-height: 44px;
    min-width: 44px;
}

@media (prefers-reduced-motion: reduce) {
    * {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
}
