/* TEMELJ — jedino mjesto na kojem piše koja je boja koja.
   ================================================================
   Pravilo: heksadekadska boja (#0a1628) smije stajati SAMO ovdje. Svaka
   druga datoteka uzima je preko `var(--m-...)`. Tako se ton mijenja na
   jednom mjestu i nigdje ne može odlutati. Provjera u testovi/provjeri.py
   pada ako se heks pojavi u definiciji varijable izvan ove datoteke.

   Dvije razine:
     1. `--m-*`  sirove boje marke. Ne koriste se izravno u stilovima
                 stranica — samo ih druge varijable preuzimaju.
     2. `--*`    uloge (podloga, tekst, rub…). Ovdje su zadane za TAMNE
                 stranice aplikacije; svijetle javne stranice ih
                 preslaguju u svom stilu, ali opet iz `--m-*`.

   Učitava se PRIJE stila stranice — inače varijable još ne postoje. */

/* MORA biti prvo i MORA biti ovdje.
   `[hidden] { display: none }` dolazi iz preglednikova zadanog stila, a on
   gubi od SVAKOG pravila iz nase datoteke — dovoljno je da element ima
   `display:grid` ili `display:flex` i `hidden` prestane djelovati, bez ikakve
   poruke o gresci. Tako je skener stajao otvoren preko cijele stranice, a na
   obrascu ture se cijena cijelog broda vidjela i kad tura nije privatna
   (`.form-row{display:grid}`). Temelj ucitava svaka stranica, pa ovo rjesava
   cijelu aplikaciju odjednom — ne dodavati isto pravilo po pojedinim
   stilovima. */
[hidden] { display: none !important; }

:root {
  /* ── 1. Boje marke ─────────────────────────────────────────────── */
  --m-navy:      #0a1628;   /* najtamnija, podloga aplikacije */
  --m-navy-2:    #0a2545;   /* navy, stupanj svjetlije */
  --m-ocean:     #0e3460;   /* drugi kraj prijelaza na podlozi */
  --m-sea:       #1a5f8a;
  --m-aqua:      #2a9d8f;   /* naglasak aplikacije (gumbi, poveznice) */
  --m-gold:      #e8c86d;   /* naglasak: brojke, oznake, istaknuto */
  --m-gold-t:    #c9a227;   /* tamniji kraj zlatnog prijelaza */
  --m-bijela:    #ffffff;
  --m-zelena:    #5ab5a0;   /* potvrđeno, gotovo */
  --m-crvena:    #d65b5b;   /* otkazano, greška */

  /* Svijetle plohe — javne stranice i ispis */
  --m-tinta:     #0b2a4a;   /* tekst na svijetlome */
  --m-tinta-2:   #5b7794;
  --m-tinta-3:   #51718e;
  --m-tinta-4:   #13202e;
  --m-tinta-5:   #46586a;
  --m-tinta-6:   #3d5876;
  --m-teal:      #127a8c;   /* naglasak javnih stranica */
  --m-teal-d:    #0f6577;
  --m-teal-d2:   #0d6373;
  --m-teal-l:    #e8f6f8;
  --m-teal-2:    #1d7268;   /* tamni teal pravnih stranica */
  --m-zlato-t:   #c98a1c;   /* zlatna na svijetloj podlozi */
  --m-zlato-p:   #c8a44d;   /* zlatna pravnih stranica */
  --m-zelena-t:  #15996b;   /* zelena na svijetloj podlozi */
  --m-plocha:    #f5f9fc;   /* svijetle podloge */
  --m-plocha-2:  #f6f8fa;
  --m-plocha-3:  #eaf4f9;
  --m-pijesak:   #f5f0e8;
  --m-crta:      #e4ecf3;   /* rubovi na svijetlome */
  --m-crta-2:    #e2e8ee;
  --m-crta-3:    #e3edf4;
  --m-crta-4:    #d6e3ed;

  /* Kalendar (zajednički svim trima kalendarima) */
  --m-kal-ploha:   #15233d;
  --m-kal-ploha-2: #1d3052;
  --m-kal-na-nagl: #0b1f33;

  /* Bijela s prozirnošću — stupnjevi koji se stalno ponavljaju */
  --m-b-04:  rgba(255,255,255,0.04);
  --m-b-08:  rgba(255,255,255,0.08);
  --m-b-10:  rgba(255,255,255,0.1);
  --m-b-12:  rgba(255,255,255,0.12);
  --m-b-40:  rgba(255,255,255,0.4);
  --m-b-85:  rgba(255,255,255,0.85);
  --m-b-88:  rgba(255,255,255,0.88);
  --m-staklo: rgba(10,22,40,0.85);   /* navy kroz koji se nazire karta */

  /* ── 2. Uloge na TAMNIM stranicama aplikacije ──────────────────── */
  --navy:   var(--m-navy);
  --ocean:  var(--m-ocean);
  --sea:    var(--m-sea);
  --aqua:   var(--m-aqua);
  --gold:   var(--m-gold);
  --white:  var(--m-bijela);
  --zelena: var(--m-zelena);
  --crvena: var(--m-crvena);

  --bg:     var(--m-navy);    /* podloga stranice */
  --card:   var(--m-b-04);    /* ploha kartice */
  --border: var(--m-b-08);    /* rub */
  --line:   var(--m-b-10);    /* tanja crta */
  --text:   var(--m-b-85);    /* tekst */
  --ink:    var(--m-b-85);    /* tekst u poljima i gumbima (isto što i --text) */
  --muted:  var(--m-b-40);    /* prigušen tekst */

  --radius: 12px;             /* zaobljenje; admin panel koristi --radius-s */
  --radius-s: 10px;
}