/* Vatrogasna natjecanja — boje i mjere, jedno mjesto za cijelu aplikaciju.
 *
 * Učitava se prvi, na svakoj stranici: unutarnjoj, javnoj, terenskoj i na
 * dokumentima. Nijedan drugi stil ne smije definirati boju heksadecimalno
 * — uzima je odavde, pa su gornja traka, gumbi, kartice i značke isti
 * gdje god se pojave.
 *
 * Paleta: vatrogasna crvena kao boja sučelja, topli neutralni tonovi za
 * podlogu i tekst (nema čisto crne), zelena/jantarna/plava samo za značenje
 * (uspjeh, upozorenje, obavijest i poveznice), a dvije boje kategorija da
 * se pomladak i mladež razlikuju na prvi pogled. */

:root {
  /* ---- vatrogasna crvena, od najtamnije do najsvjetlije ---- */
  --crvena-900: #5a0c11;
  --crvena-800: #7d1017;
  --crvena-700: #9e151c;
  --crvena-600: #c1181f;          /* glavna: gumbi, aktivno, naglasci */
  --crvena-500: #d92a30;
  --crvena-300: #ee8f92;
  --crvena-100: #fbe3e3;
  --crvena-50:  #fdf3f2;

  /* zatečena imena, i dalje u uporabi po stilovima */
  --crvena:       var(--crvena-600);
  --crvena-tamna: var(--crvena-700);
  --crvena-blaga: var(--crvena-50);

  /* ---- gornja traka: tamnocrveni gradijent, nikad crno ---- */
  --traka-pocetak:       #7f1016;
  --traka-kraj:          #b5171e;
  --traka-tekst:         #ffffff;
  --traka-tekst-blijed:  rgba(255, 255, 255, .74);
  --traka-staklo:        rgba(255, 255, 255, .13);
  --traka-staklo-jace:   rgba(255, 255, 255, .22);

  /* ---- topli neutralni tonovi (tekst, podloga, rubovi) ---- */
  --n-0:   #ffffff;
  --n-25:  #fcfbfa;
  --n-50:  #f7f4f2;
  --n-100: #f0ebe8;
  --n-200: #e5dedb;
  --n-300: #d1c7c2;
  --n-500: #7f726e;
  --n-600: #675b57;
  --n-900: #2b2321;

  --tinta:         var(--n-900);
  --tinta-blijeda: #6d605b;
  --pozadina:      #f6f2f0;
  --ploha:         var(--n-0);
  --rub:           #e7e0dc;
  --rub-jaci:      #d4cac5;

  /* ---- boje značenja ---- */
  --zelena:       #157a4c;
  --zelena-blaga: #e8f6ee;
  --zelena-rub:   #bfe3ce;
  --zuta:         #8a5a00;
  --zuta-blaga:   #fdf4e3;
  --zuta-rub:     #ecd7a0;
  --plava:        #1f4f8f;          /* poveznice i obavijesti */
  --plava-blaga:  #eaf1fa;
  --plava-rub:    #c4d6ec;
  --jantar:       #a5650a;          /* „kasni", „čeka" */

  /* ---- kategorije: da se pomladak i mladež razlikuju na prvi pogled ---- */
  --pomladak:       #0f6f66;
  --pomladak-blaga: #e9f5f3;
  --pomladak-rub:   #b8dcd7;
  --mladez:         #3b4ea8;
  --mladez-blaga:   #eef0fb;
  --mladez-rub:     #c7cdee;

  /* ---- mjere: zaobljenja, sjene, brzina ---- */
  --r-s:    10px;
  --r-m:    14px;
  --r-l:    18px;
  --r-pill: 999px;
  --radijus: var(--r-m);

  --sjena-1: 0 1px 2px rgba(60, 30, 25, .06);
  --sjena-2: 0 1px 3px rgba(60, 30, 25, .08), 0 8px 20px -8px rgba(60, 30, 25, .14);
  --sjena-3: 0 2px 6px rgba(60, 30, 25, .10), 0 16px 36px -12px rgba(60, 30, 25, .22);
  --sjena-crvena: 0 6px 18px -6px rgba(193, 24, 31, .55);

  --prsten: 0 0 0 3px rgba(193, 24, 31, .18);
  --brzina: 140ms;
}