/* =========================================================================
   MHP tema — dopune brand kitu v1.1 (datoteke kita u assets/ ostaju nepromijenjene).
   Pravilo kita 2.2: samo var(--mhp-…) / var(--hub-…), nikad izravne boje.
   ========================================================================= */

/* K6 (✅ 29. 9.): početna ima tri brojke kao na živom webu → mreža .mhp-brojke u 3 stupca.
   Kit ima 4 stupca; ovdje modifikator, kit se ne mijenja. */
.mhp-brojke--3 { grid-template-columns: repeat(3, 1fr); }
@media (max-width: 760px) {
  .mhp-brojke--3 { grid-template-columns: 1fr; }
}

/* A3/T4: e-mail zapisan unatrag u HTML-u; bez JS-a prikazuje se ispravno ovim obrtanjem.
   tema.js ga preokreće u pravi redoslijed, dodaje mailto i uklanja klasu .mhp-eml. */
.mhp-eml { unicode-bidi: bidi-override; direction: rtl; cursor: pointer; }

/* F5-1: gumb izbornika = sendvič ikona bez vidljivog teksta (aria-label „Izbornik”); otvoren → ×.
   Prikaz (none / block ≤ 760 px) i obrub ostaju iz kita (.mhp-burger). */
.mhp-burger--ikona { position: relative; width: 44px; height: 44px; padding: 0; }
.mhp-burger__crte { position: absolute; left: 50%; top: 50%; width: 18px; height: 12px; transform: translate(-50%, -50%); }
.mhp-burger__crte span { position: absolute; left: 0; right: 0; height: 2px; background: currentColor; transition: transform var(--mhp-prijelaz), opacity var(--mhp-prijelaz), top var(--mhp-prijelaz); }
.mhp-burger__crte span:nth-child(1) { top: 0; }
.mhp-burger__crte span:nth-child(2) { top: 5px; }
.mhp-burger__crte span:nth-child(3) { top: 10px; }
.mhp-burger[aria-expanded="true"] .mhp-burger__crte span:nth-child(1) { top: 5px; transform: rotate(45deg); }
.mhp-burger[aria-expanded="true"] .mhp-burger__crte span:nth-child(2) { opacity: 0; }
.mhp-burger[aria-expanded="true"] .mhp-burger__crte span:nth-child(3) { top: 5px; transform: rotate(-45deg); }

/* F5-7: „Preskoči na sadržaj” – vidljivo samo na fokus. */
.mhp-preskoci { position: absolute; left: var(--mhp-rub-stranice); top: -200px; z-index: 10; background: var(--mhp-skriljevac); color: var(--mhp-bijela-cista); padding: 12px 20px; border-radius: var(--mhp-r-gumb); font: 700 16px var(--mhp-font-tekst); }
.mhp-preskoci:focus { top: 12px; }

/* F5-7: naslovi stupaca podnožja su h2 (ispravna razina) istog izgleda kao h4 u kitu. */
.mhp-footer h2 { font-family: var(--mhp-font-oznaka); font-size: var(--mhp-kicker); font-weight: 500; letter-spacing: var(--mhp-kicker-razmak); text-transform: uppercase; color: var(--mhp-bijela-cista); margin: 0 0 14px; line-height: var(--mhp-tekst-lh); }

@media (prefers-reduced-motion: reduce) {
  .mhp-burger__crte span { transition: none; }
}

/* Logo u podnožju (kit nema pravilo za logo u .mhp-footer) – visina kao u zaglavlju. */
.mhp-footer__logo { display: block; width: max-content; height: 34px; margin-bottom: 18px; }
.mhp-footer__logo img { height: 100%; width: auto; display: block; }
.mhp-footer p { margin: 0 0 12px; }
.mhp-footer address { font-style: normal; }

/* Traka administratora (samo prijavljeni korisnici): WordPress je drži fiksno na vrhu (32 px; 46 px do 782 px širine,
   ispod 600 px se pomiče sa stranicom), pa ljepljivo zaglavlje mora stati ispod nje – inače ga traka prekriva
   (nalaz u prozoru faze 9, 9. 10.). Posjetitelji trake nemaju, za njih se ništa ne mijenja. */
.admin-bar .mhp-header { top: 32px; }
@media (max-width: 782px) { .admin-bar .mhp-header { top: 46px; } }
@media (max-width: 600px) { .admin-bar .mhp-header { top: 0; } }

/* Banner kolačića (Complianz) – boje i oblik prema brand tokenima (odobrio Marko, 9. 10.). Tekst bannera se ne mijenja;
   Complianz postavlja boje kao CSS varijable na .cmplz-cookiebanner, ovdje se samo nadjačavaju. */
body .cmplz-cookiebanner {
  --cmplz_banner_background_color: var(--mhp-bijela);
  --cmplz_banner_border_color: var(--mhp-rub);
  --cmplz_banner_border_width: 1px;
  --cmplz_banner_border_radius: var(--mhp-r-kartica);
  --cmplz_text_color: var(--mhp-skriljevac);
  --cmplz_hyperlink_color: var(--mhp-crvena-tekst);
  --cmplz_button_border_radius: var(--mhp-r-gumb);
  --cmplz_button_accept_background_color: var(--mhp-crvena);
  --cmplz_button_accept_border_color: var(--mhp-crvena);
  --cmplz_button_accept_text_color: var(--mhp-bijela-cista);
  --cmplz_button_deny_background_color: transparent;
  --cmplz_button_deny_border_color: var(--mhp-skriljevac);
  --cmplz_button_deny_text_color: var(--mhp-skriljevac);
  --cmplz_button_settings_background_color: transparent;
  --cmplz_button_settings_border_color: var(--mhp-skriljevac);
  --cmplz_button_settings_text_color: var(--mhp-skriljevac);
  --cmplz_slider_active_color: var(--mhp-crvena);
  --cmplz_slider_inactive_color: var(--mhp-rub);
  --cmplz_slider_bullet_color: var(--mhp-bijela-cista);
  font-family: var(--mhp-font-tekst);
  box-shadow: 0 12px 40px rgba(48, 53, 66, .18);
}
body .cmplz-cookiebanner .cmplz-title { font-family: var(--mhp-font-naslov); font-weight: 800; }
body .cmplz-cookiebanner .cmplz-btn { font-family: var(--mhp-font-tekst); font-weight: 700; }
