/* ============================================================
   THEME — Lashed by Evelyn (FWTX)
   ------------------------------------------------------------
   Colours are SAMPLED, not guessed. Her price list, policy cards
   and logo all sit on the same stock: paper #ece1d9, ink #090503.
   Every value below is built from those two so the site and her
   graphics can sit side by side without clashing.

   Artwork is hers too — bow.png is the bow lifted straight out of
   her logo, and the app icon is her real logo.

   This is one of only two files you edit for a new client.
   The other is brand.js (names, prices, keys).
   ============================================================ */

/* ---- 1. FONTS -------------------------------------------------
   Her own fonts are paid display faces (the condensed didone caps
   and the roundhand script), so they can't be served on the web
   without the licensed files. These are the closest free matches:

     Great Vibes      -> the roundhand "Evelyn" / "Policy" / "List"
     Playfair Display -> the high-contrast "LASHED BY" caps
     Jost             -> body copy; stays out of the way in forms

   If she can send the actual font files (whatever she designed the
   logo in will have them), drop them in and swap the @font-face —
   everything else here stays as is.
--------------------------------------------------------------- */
@import url('https://fonts.googleapis.com/css2?family=Great+Vibes&family=Playfair+Display:ital,wght@0,400;0,500;0,600;0,700;1,400;1,500&family=Jost:ital,wght@0,300;0,400;0,500;0,600;1,400&display=swap');

:root{
  /* the three faces, referenced everywhere by these names */
  --font-script:  'Great Vibes', cursive;          /* her name, deal titles */
  --font-display: 'Playfair Display', serif;       /* headings, prices, buttons */
  --font-body:    'Jost', sans-serif;              /* everything else */

  /* ---- 2. COLOURS --------------------------------------------
     --cream and --plum/--ribbon are her exact sampled values.
     The rest are steps between the two.
     ---------------------------------------------------------- */
  --cream:     #ece1d9;   /* page background — HER PAPER, sampled */
  --blush:     #e4d7cc;   /* calendar day cells, hover fills */
  --blush-2:   #d6c6b8;   /* hairlines, borders */
  --pink:      #c6b4a4;   /* dotted leaders, light borders */
  --pink-deep: #8a7867;   /* announcement bar, bowed button border */
  --ribbon:    #090503;   /* selected day/slot, admin buttons — HER INK */
  --pink-dark: #574940;   /* prices, category headings, button text */
  --plum:      #090503;   /* HER NAME + section headings — HER INK */

  --ink:       #2e2620;   /* body text — lifted just enough to read long */
  --ink-soft:  #877a6d;   /* captions, taglines, hints */
  --white:     #f6efe8;   /* cards — a lighter mix of her paper */

  /* tints derived from --ribbon; update together if you change it */
  --glow:      9,5,3;     /* rgb() for shadows */
  --glow-deep: 9,5,3;     /* rgb() for the ink-tinted ones */

  /* ---- 3. BACKGROUND ARTWORK ---------------------------------
     bg-paper.svg — her paper colour plus the speckle of the same
                    recycled stock, tiling seamlessly
     bow.png      — the bow from her logo, extracted with the paper
                    knocked out so it drops onto any background
     Larger --bg-size = fewer, more spaced-out motifs.
     ---------------------------------------------------------- */
  --bg-tile:        url(bg-paper.svg);
  --bg-size:        460px;
  --bg-size-mobile: 320px;
  --bg-opacity:     1;
  --bg-opacity-admin: .6;

  --motif: url(bow.png);   /* header, dividers, bullets, button sticker */
}