/* =============================================================================
   theme-outtakes.css -- Outtakes Bar & Grill.
   Selected in App.razor for every URL under /outtakes/.

   Outtakes and Cinema Grill are one business at one address, and the site now says
   so: same dark auditorium, same type, same components. The brands are siblings,
   not opposites. Only the color of the light changes.

   Outtakes' light is the cyan of the clapperboard in its own logo. The previous
   theme dressed this side in warm browns, which matched neither logo and made two
   halves of one restaurant look like two unrelated businesses -- and it forced
   forty duplicated variables to be kept in sync by hand. Both problems went away
   with the same edit.

   Every variable below also exists in theme-cinema.css. If you add one here, add
   it there, or that half of the site resolves it to nothing.
   ============================================================================= */

:root {
    /* --- the light ---
       --accent is a BACKGROUND color and pairs with --accent-text.
       --accent-ink is the same hue adjusted to be legible as TEXT on the dark page.
       Cyan is a light color, so --accent-text has to be near-black: white on this
       accent fails contrast badly, which is the same trap the old amber had. */
    --accent: #29b6e8;
    --accent-hover: #55c9f2;
    --accent-text: #04141d;
    --accent-ink: #5ccdf5;
    --accent-glow: rgba(41, 182, 232, 0.22);

    --link: #5ccdf5;
    --link-hover: #97e0fb;

    --focus: #29b6e8;

    /* The marquee line under the header and at the foot of the hero: brightest in
       the middle, gone at both ends, so it reads as thrown light rather than as a
       border somebody forgot to remove. */
    --marquee-line: linear-gradient(90deg,
        transparent 0%,
        rgba(41, 182, 232, 0.06) 12%,
        rgba(41, 182, 232, 0.55) 50%,
        rgba(41, 182, 232, 0.06) 88%,
        transparent 100%);

    /* --- hero ---
       The same deep blue base as Cinema Grill, washed in cyan instead of gold. */
    --hero-bg: #090e1d;
    --hero-wash: radial-gradient(120% 130% at 8% -10%,
        rgba(41, 182, 232, 0.16) 0%,
        rgba(63, 111, 181, 0.12) 40%,
        rgba(7, 11, 22, 0) 72%);
    /* Hero images are chosen by staff and we cannot know what is in them, so the
       scrim has to hold text on a bright frame as well as a dark one. */
    --hero-scrim: linear-gradient(100deg,
        rgba(7, 11, 22, 0.94) 0%,
        rgba(7, 11, 22, 0.78) 42%,
        rgba(7, 11, 22, 0.42) 100%);
    --hero-sub-text: var(--text-soft);

    --shadow-btn: 0 2px 12px rgba(41, 182, 232, 0.25);
    --shadow-btn-hover: 0 6px 22px rgba(41, 182, 232, 0.4);
}