/* ──────────────────────────────────────────────────────────────
   PANA — THEME
   ──────────────────────────────────────────────────────────────
   Edit this file to change the look of the site.
   It is NOT compiled — upload it on its own and the change is live.
   No rebuild, no developer.

   Colours are written as three numbers: RED GREEN BLUE (0-255).
   Spaces between them, no commas. This is what lets the site fade
   a colour (e.g. faint gold borders) without extra work.
   ────────────────────────────────────────────────────────────── */

:root {
  --hero-image: url('background.jpg?v=1793849643401');
  /* ---- COLOURS ------------------------------------------------
     gold  = headings, prices, borders, buttons
     dark  = page background
     cream = occasional light accent
     ------------------------------------------------------------ */
  --pana-gold:  212 175 55;    /* #D4AF37  warm gold   */
  --pana-dark:   26  26 26;    /* #1A1A1A  near-black  */
  --pana-cream: 245 245 220;   /* #F5F5DC  soft cream  */

  /* ---- FONTS --------------------------------------------------
     heading = page titles & section names
     body    = buttons and small print
     display = menu item names and prices
     Keep the fallbacks after the comma.
     ------------------------------------------------------------ */
  --font-heading: 'Baskervville', Georgia, serif;
  --font-body:    'Helvetica Neue', Arial, sans-serif;
  --font-display: 'Libre Baskerville', Georgia, serif;

  /* ---- PAGE BACKGROUND ----------------------------------------
     Either a flat colour or an image.
     For a plain background set --page-image to: none
     ------------------------------------------------------------ */
  --page-image: none;
  --page-image-size: cover;
  --page-image-position: center;
}

/* Applies the background choice above. Leave this alone. */
body {
  background-color: rgb(var(--pana-dark));
  background-image: var(--page-image);
  background-size: var(--page-image-size);
  background-position: var(--page-image-position);
  background-attachment: fixed;
  background-repeat: no-repeat;
  font-family: var(--font-heading);
}

/* ---- THE PICTURE AT THE TOP ---------------------------------
   The big photograph behind the name. Change it from the studio,
   or point this at another file in this folder.
   ------------------------------------------------------------ */
.bg-\[url\(\'\/background\.jpg\'\)\] {
  background-image: var(--hero-image, url('background.jpg')) !important;
}