/*
Theme Name:  Korak do prava – Kadence Child
Description: Child tema za korakdoprava.com. Teal/amber vizualni identitet, TSF breadcrumbs, centralizirani stilovi članaka.
Template:    kadence
Version:     1.2.0
Text Domain: korak-do-prava-child
Author:      korakdoprava.com
Author URI:  https://korakdoprava.com
*/

/* ================================================================
   1. KADENCE GLOBALNA PALETA (9 slotova)
   Nadjačava vrijednosti postavljene u Customizeru.
   Kadence ih koristi interno za gumbe, linkove, naslove.
   ================================================================ */
:root {
  --global-palette1: #0F6E56; /* Teal primarni  – CTA gumbi, linkovi        */
  --global-palette2: #1D9E75; /* Teal hover     – hover stanje               */
  --global-palette3: #BA7517; /* Amber akcent   – istaknuti elementi         */
  --global-palette4: #04342C; /* Teal tamni     – H1, H2, hero tekst         */
  --global-palette5: #1A1A1A; /* Tekst primarni – tijelo teksta              */
  --global-palette6: #4A5568; /* Tekst sekundarni – meta, datumi, tagovi     */
  --global-palette7: #E1F5EE; /* Teal površina  – hero bg, Ukratko box       */
  --global-palette8: #F7FAFA; /* Pozadina       – bijela s tealovim tonom    */
  --global-palette9: #FFFFFF; /* Čista bijela   – kartice, forme             */
}

/* ================================================================
   2. PROŠIRENI BREND TOKENI
   Koristite ove var() u Kadence blokovima → Custom CSS polju
   i u dodatnim komponentama (kalkulator, predlošci...).
   ================================================================ */
:root {
  /* Teal ramp */
  --kdp-teal-900:    #04342C;
  --kdp-teal-800:    #085041;
  --kdp-teal-700:    #0F6E56;  /* = --global-palette1 */
  --kdp-teal-600:    #1D9E75;  /* = --global-palette2 */
  --kdp-teal-400:    #5DCAA5;
  --kdp-teal-200:    #9FE1CB;
  --kdp-teal-100:    #C8F0E3;
  --kdp-teal-50:     #E1F5EE;  /* = --global-palette7 */

  /* Amber ramp */
  --kdp-amber-800:   #6B350A;
  --kdp-amber-700:   #854F0B;
  --kdp-amber-600:   #BA7517;  /* = --global-palette3 */
  --kdp-amber-400:   #E8954E;
  --kdp-amber-50:    #FAEEDA;

  /* Klaster boje */
  --kdp-legal:       #185FA5;  /* Pravni lijekovi – plava  */
  --kdp-legal-bg:    #E6F1FB;
  --kdp-finance:     #3B6D11;  /* Financije – zelena       */
  --kdp-finance-bg:  #EAF3DE;

  /* Neutralne */
  --kdp-text:        #1A1A1A;
  --kdp-text-muted:  #4A5568;
  --kdp-surface:     #F7FAFA;
  --kdp-white:       #FFFFFF;

  /* Border */
  --kdp-border:      rgba(15, 110, 86, 0.15);
}

/* ================================================================
   3. FONT – Inter (Google Fonts)
   Za produkciju: preuzmite Inter lokalno i hostajte s OMGF pluginom.
   ================================================================ */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap');

/* ================================================================
   4. TIPOGRAFIJA – Kadence body/heading override
   ================================================================ */
body {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}
h1, h2, h3, h4, h5, h6 {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}

/* ================================================================
   5. BREADCRUMBS – The SEO Framework (TSF)
   TSF shortcode: [tsf_breadcrumb]
   Hook u functions.php: kadence_before_main_content
   ================================================================ */
.kdp-breadcrumbs {
  max-width: var(--global-content-width, 1000px);
  margin: 0 auto 1.1rem;
  padding: 0 var(--global-content-edge-padding, 1.5rem);
}
.tsf-breadcrumb ol {
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.35rem;
  margin: 0;
  padding: 0;
  font-size: 0.85rem;
  color: #5C645F;
}
.tsf-breadcrumb a {
  color: #0F6E56;
  text-decoration: none;
}
.tsf-breadcrumb a:hover {
  text-decoration: underline;
  text-underline-offset: 2px;
}

/* ================================================================
   6. KOMPONENTA: Ukratko (GEO summary box)
   Kadence blok → Advanced → CSS Class: kdp-ukratko
   ================================================================ */
.kdp-ukratko {
  background: var(--kdp-teal-50);
  border-left: 4px solid var(--kdp-teal-700);
  border-radius: 0 10px 10px 0;
  padding: 1.25rem 1.5rem;
  margin: 2rem 0;
}
.kdp-ukratko__label {
  display: block;
  font-size: 0.6875rem;
  font-weight: 600;
  color: var(--kdp-teal-700);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  margin-bottom: 0.625rem;
}
.kdp-ukratko ul {
  margin: 0;
  padding-left: 1.25rem;
  color: var(--kdp-teal-900);
}
.kdp-ukratko li {
  margin-bottom: 0.4rem;
  line-height: 1.6;
  font-size: 0.9375rem;
}
.kdp-ukratko li::marker {
  color: var(--kdp-teal-700);
}

/* ================================================================
   7. KOMPONENTA: Disclaimer (nije pravni savjet)
   Kadence blok → Advanced → CSS Class: kdp-disclaimer
   ================================================================ */
.kdp-disclaimer {
  background: var(--kdp-amber-50);
  border: 1px solid var(--kdp-amber-400);
  border-radius: 8px;
  padding: 0.9rem 1.125rem;
  font-size: 0.875rem;
  color: var(--kdp-amber-800);
  line-height: 1.55;
  margin: 2rem 0;
}
.kdp-disclaimer::before {
  content: "ℹ";
  margin-right: 0.5rem;
  font-style: normal;
  font-weight: 600;
}

/* ================================================================
   8. KOMPONENTA: Klaster kartice
   Kadence blok → Advanced → CSS Class: kdp-cluster-{tip}
   ================================================================ */
.kdp-cluster-card {
  border: 1px solid var(--kdp-border);
  border-radius: 10px;
  padding: 1.25rem;
  background: var(--kdp-white);
  transition: box-shadow 0.15s ease;
}
.kdp-cluster-card:hover {
  box-shadow: 0 2px 12px rgba(15, 110, 86, 0.10);
}
.kdp-cluster-prava    { border-left: 3px solid var(--kdp-teal-700); }
.kdp-cluster-postupak { border-left: 3px solid var(--kdp-amber-600); }
.kdp-cluster-pravni   { border-left: 3px solid var(--kdp-legal); }
.kdp-cluster-financije{ border-left: 3px solid var(--kdp-finance); }

/* ================================================================
   9. DATUMI OBJAVE (vidljivi datumi za Google Structured Data)
   Shortcode: [kdp_article_meta] — definiran u functions.php
   Google zahtijeva vidljivi datum koji odgovara datePublished/dateModified.
   ================================================================ */
.kdp-article-meta {
  display: flex;
  align-items: center;
  gap: 1rem;
  font-size: 0.8125rem;
  color: var(--kdp-text-muted);
  margin-bottom: 1.5rem;
  flex-wrap: wrap;
}
.kdp-article-meta time {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
}
.kdp-article-meta .kdp-label {
  font-weight: 500;
  color: var(--kdp-teal-600);
}
.kdp-article-meta .kdp-sep {
  color: var(--kdp-border);
  margin: 0 0.25rem;
}

/* ================================================================
   10. PRINT STILOVI
   ================================================================ */
@media print {
  body { font-size: 12pt; color: #000; background: #fff; }
  a { color: #000; text-decoration: none; }
  a[href]::after { content: " (" attr(href) ")"; font-size: 0.8em; }
  .kdp-disclaimer, .kdp-ukratko { border: 1px solid #999; }
  nav, .site-footer, .sidebar, .wp-block-button { display: none; }
}