/* Koala Ketab (koalaketab.ir) — the shop's colours taken off its own wordmark.
 *
 * Loaded LAST, after gooki-alive.css, and only for a site whose
 * config/sites.json overlay declares `brand_theme: "koala"`. It re-points the
 * `--gk2-*` palette and NOTHING ELSE: gooki-alive.css's own header says every
 * colour lives in its :root block and nowhere else, which is exactly what makes
 * a theme one short file rather than a second stylesheet to keep in step. No
 * geometry, no type, no selector of its own — so a layout fix lands on both
 * shops and cannot be undone here by accident.
 *
 * REMOVING `brand_theme` FROM THE SITE RESTORES THE SHARED LOOK, byte for
 * byte: the file simply stops being linked, and gooki-alive.css's tokens are
 * the ones that apply. That is the whole of the way back, and it is why the
 * palette is a separate file rather than an edit to gooki-alive.css.
 *
 *
 * WHERE THE COLOURS COME FROM
 *
 * `images/logo-koala-wordmark.png` — the long mark, «کوالا» lettered with the
 * koala's own face as the bowl of the «و». Measured off
 * `assets/koala-wordmark.png`, which is the drawing at full size:
 *
 *     #8eb8e2   the ground, 90% of the coloured pixels
 *     #f8f4f0   the lettering
 *     #3c4864   the eyes, the nose, the closed lids
 *     #f2d2d6   the blush and the inner ear
 *
 * Four colours, and the mark is a picture of what this palette is: CREAM
 * SHAPES ON A BLUE FIELD, drawn in navy, with one warm note.
 *
 *
 * 2026-09-23: THE AREAS ARE INVERTED, BECAUSE THE SHOP WAS ALL ONE COLOUR
 *
 * The first cut of this file read the mark the obvious way round and made the
 * BLUE the page: paper #eaf2fb, bands #d9e8f8, tiles, buttons and four of the
 * five category tones all blue as well. Every surface then agreed with the
 * logo and with each other, and a page with nothing to contrast against its
 * own brand colour reads as one flat wash — which is what it was: «یکم زیادی
 * آبی».
 *
 * The mark is not one colour, and neither is the shop now. The same four
 * colours are kept and the AREAS are swapped: the page is the colour of the
 * mark's own LETTERING, the cards are white, the blue is what the bands, the
 * buttons and the mark itself are made of, and the blush is the warm note that
 * stops a page of blue and cream from reading as two. Nothing was added to the
 * palette that is not in the drawing.
 *
 *     the page      the lettering's cream   #f8f4f0
 *     the cards     white                   #ffffff
 *     the bands     the field's blue, washed back
 *     the type      the eyes and the nose   #3c4864
 *     the accent    the field's blue
 *     the warm note the blush               #f2d2d6
 *
 * Three surfaces, not one, is also why the cards are pure WHITE here where
 * gooki.de's are white on cream: the page is a shade deeper than the shared
 * one, so a card has to be the brightest thing on it or it does not lift.
 *
 *
 * WHY THE ACCENT IS NOT THE LOGO'S BLUE EXACTLY
 *
 * `--gk2-sun` is the ACCENT: gooki-alive.css paints the primary button, the nav
 * CTA, the focus ring and the link underline with it and sets the text on top
 * to `--gk2-ink`. So the accent has to be a colour navy can be READ on, and the
 * logo's own #8eb8e2 carries navy at 4.39:1 — over WCAG's 3.0 floor for the
 * bold button type it actually holds, under the 4.5 an ordinary word wants. The
 * accent is therefore that blue LIFTED (5.39:1) and the logo's exact blue is
 * the hover, so pressing a button moves toward the mark rather than away from
 * it. Same reasoning, and the same direction of travel, as
 * scripts/make_koala_logo.py deepening the supplied #b8cde4 so the tile could
 * be seen at 44px.
 *
 * Measured against `--gk2-ink`, on this palette / on the one it replaces:
 *
 *     paper  8.33 / 8.07      accent  5.39 / 5.39     berry  5.31 / 4.13
 *     card   9.12 / 8.76      hover   4.39 / 4.39     coral  6.50 / 6.50
 *     band   7.76 / 7.32      sky     4.39 / 4.39     mint   7.44 / 7.44
 *
 * Every one clears its own floor and the page and the card gained a little.
 * `--gk2-paper` is also used as TEXT on the dark bands: it carries 11.13:1 on
 * `--gk2-night`. Re-measure if a value moves: nothing in the repo checks a
 * stylesheet, only the printed page.
 */

:root {
  /* The page: the colour the mark's own letters are drawn in, to the byte.
     `--gk2-paper` is also used as a TEXT colour on the dark bands, so it has
     to stay light in both directions — it carries 11.13:1 on `--gk2-night`. */
  --gk2-paper: #f8f4f0;
  /* The bands and tiles that sit one step off the page: the footer, the step
     panels, the category rules. This is where the blue lives now — a wash of
     the mark's own field, so the shop is unmistakably blue in the places a
     band is drawn and nowhere else. */
  --gk2-paper-2: #e3eefa;

  /* The type: the koala's own eyes and nose, to the byte. */
  --gk2-ink: #3c4864;
  --gk2-ink-soft: #5d6b88;
  /* The hairline, in the PAPER's own family rather than the blue's: a cool
     rule round a white card on cream paper reads as a second colour on a page
     that already has three. */
  --gk2-line: #e7dfd7;

  /* The accent and its hover — see WHY THE ACCENT IS NOT THE LOGO'S BLUE
     EXACTLY above. `--gk2-sun` keeps its name: it is the accent SLOT, named
     for the colour the first shop put in it, and renaming it here would mean
     editing every rule in gooki-alive.css that reads it. */
  --gk2-sun: #a7cbee;
  --gk2-sun-deep: #8eb8e2;

  /* The category tones. `sky` and `mint` are the mark's blue and a wash of it;
     `berry` and `coral` are the blush, which is the only warmth in the drawing
     and therefore the only thing that keeps a page of blue and cream from
     reading as two colours. `berry` carries a step number in large type, so it
     is the blush deepened until navy is comfortably readable on it (5.31:1,
     against 4.13 for the blue it replaces) while `coral` stays the blush the
     picture actually paints. */
  --gk2-sky: #8eb8e2;
  --gk2-leaf: #a8cfc6;
  --gk2-berry: #f2b6c0;
  --gk2-mint: #dceaf6;
  --gk2-coral: #f2d2d6;

  --gk2-night: #2a3550;
  /* The cards. Pure white, and one of the three colours the mark is drawn
     with: on a page that is itself the lettering's cream, a card tinted the
     way gooki.de's is would not lift off it at all. */
  --gk2-white: #ffffff;

  /* The alpha triplets. `--gk2-ledge` and `--gk2-float` read these through
     var() and are resolved where they are USED, so both shadows re-tint from
     here and neither has to be repeated. */
  --gk2-ink-rgb: 60 72 100;
  --gk2-sun-rgb: 167 203 238;
  /* The masthead is translucent over whatever scrolls under it, so its colour
     can only be written as an rgb triplet — that is why the paper needs one. */
  --gk2-paper-rgb: 248 244 240;

  /* The price lines' secondary ink. It is a WARM grey on the cream shop, where
     it measures 3.92:1 on that shop's own paper; here it is the page type
     lightened only as far as 4.52:1, so a price's second line is quiet without
     being under the floor an ordinary word has to clear. */
  --atelier-ink-soft: #66708a;
}