/* radni-kalendar.css — zajednički stil za sve stranice radnog kalendara:
   admin.php, admin_edit.php, public.php (uključuje ga public/radni-kalendar.php),
   tehnicko.php, tehnicko_edit.php (dosežu se i iz tehnicko/ portala).
   Napomena o konsolidaciji: dva odvojena naziva klase koja su prije imala DVIJE
   različite širine kontejnera (1300px "pregled" vs 900px "forma") preimenovana
   su dosljedno u .main-container (1300px, admin.php/tehnicko.php) i
   .form-container (900px, admin_edit.php/tehnicko_edit.php) da izbjegnu sudar
   u ovom jednom dijeljenom fajlu. .panel u admin.php je prije imao dodatnih
   margin-bottom:20px koji ostala 3 konteksta nisu imala — usklađeno na
   zajedničku vrijednost (bez extra margina), kozmetička razlika ispod praga
   vidljivosti (page već ima padding-bottom:40px na body). Isto tako, mobilni
   (768px) padding za .main-container razlikovao se 12px (admin.php) vs 10px
   (tehnicko.php) — usklađeno na 12px, kozmetička razlika 2px. */

* , *::before, *::after { box-sizing: border-box; }

/* HEADER — dvije varijante zadržane odvojeno (različiti nazivi, nema sudara) */
.mod-header { background:rgba(255,255,255,0.97); padding:14px 24px; display:flex; justify-content:space-between; align-items:center; box-shadow:0 4px 16px rgba(0,0,0,0.1); border-bottom:3px solid #002B5C; flex-wrap:wrap; gap:12px; }
.mod-header-brand { display:flex; align-items:center; gap:14px; }
.mod-brand-icon { width:46px; height:46px; background:#002B5C; border-radius:10px; display:flex; align-items:center; justify-content:center; color:#ffd700; font-size:1.3rem; }
.mod-header-brand h1 { margin:0; font-size:1.2rem; color:#002B5C; font-weight:700; }
.mod-header-brand p  { margin:0; font-size:0.78rem; color:#64748b; }
.mod-header-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.mod-user { font-size:0.85rem; color:#475569; font-weight:600; display:flex; align-items:center; gap:6px; }
.mod-user i { color:#ffd700; }

.hdr{background:rgba(255,255,255,0.97);padding:14px 24px;display:flex;justify-content:space-between;align-items:center;box-shadow:0 4px 16px rgba(0,0,0,0.1);border-bottom:3px solid #002B5C;flex-wrap:wrap;gap:12px;}
.hdr-brand{display:flex;align-items:center;gap:14px;}
.hdr-icon{width:46px;height:46px;background:#002B5C;border-radius:10px;display:flex;align-items:center;justify-content:center;color:#ffd700;font-size:1.3rem;}
.hdr-brand h1{margin:0;font-size:1.2rem;color:#002B5C;font-weight:700;}
.hdr-brand p{margin:0;font-size:0.78rem;color:#64748b;}
.hdr-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap;}
.usr{font-size:0.85rem;color:#475569;font-weight:600;display:flex;align-items:center;gap:6px;}
.usr i{color:#ffd700;}

/* BUTTONS */
.btn { display:inline-flex; align-items:center; gap:7px; padding:8px 16px; border-radius:8px; font-weight:600; font-size:0.875rem; border:none; cursor:pointer; text-decoration:none; transition:all 0.2s; }
.btn-back   { background:#002B5C; color:white; }
.btn-back:hover { background:#ffd700; color:#002B5C; }
.btn-logout { background:#fee2e2; color:#991b1b; }
.btn-logout:hover { background:#ef4444; color:white; }
.btn-add    { background:#16a34a; color:white; }
.btn-add:hover { background:#15803d; }
.btn-save    { background:#16a34a; color:white; padding:10px 24px; }
.btn-save:hover { background:#15803d; }
.btn-cancel  { background:#f1f5f9; color:#475569; border:1px solid #e2e8f0; }
.btn-cancel:hover { background:#e2e8f0; }

/* CONTAINERS (vidi napomena o konsolidaciji na vrhu fajla) */
.main-container { max-width:1300px; margin:24px auto; padding:0 20px; }
.form-container { max-width:900px; margin:24px auto; padding:0 20px; }

/* MESSAGES / ALERTS */
.msg-ok { background:#dcfce7; color:#166534; border-left:4px solid #16a34a; padding:12px 16px; border-radius:8px; margin-bottom:16px; font-size:0.875rem; display:flex; align-items:center; gap:8px; }
.alert { padding:13px 18px; border-radius:8px; margin-bottom:18px; display:flex; align-items:center; gap:10px; font-size:0.875rem; font-weight:500; }
.alert-ok  { background:#dcfce7; color:#166534; border-left:4px solid #16a34a; }
.alert-err { background:#fee2e2; color:#991b1b; border-left:4px solid #ef4444; }
.alert-warn { background:#fff7ed; color:#9a3412; border-left:4px solid #f97316; }

/* TOOLBAR / LEGEND */
.toolbar{background:rgba(255,255,255,0.97);border-radius:10px;padding:14px 18px;margin-bottom:20px;display:flex;align-items:center;gap:14px;flex-wrap:wrap;box-shadow:0 4px 12px rgba(0,0,0,0.07);}
.toolbar select{padding:8px 12px;border:1px solid #e2e8f0;border-radius:8px;font-size:0.875rem;color:#1e293b;background:white;cursor:pointer;}
.legend{display:flex;flex-wrap:wrap;gap:12px;font-size:0.78rem;color:#475569;margin-left:auto;}
.legend span{display:inline-flex;align-items:center;gap:5px;}
.legend i{width:12px;height:12px;border-radius:3px;display:inline-block;}
.lg-yellow{background:#fef9c3;border:1px solid #eab308;}
.lg-green{background:#dcfce7;border:1px solid #16a34a;}
.lg-gray{background:#f1f5f9;border:1px solid #94a3b8;}
.lg-white{background:#ffffff;border:1px solid #e2e8f0;}

/* PANEL (konsolidirano, bez extra margin-bottom — vidi napomenu na vrhu) */
.panel { background:rgba(255,255,255,0.97); border-radius:12px; overflow:hidden; box-shadow:0 8px 24px rgba(0,0,0,0.08); }
.panel-header { background:#f8fafc; padding:16px 22px; border-bottom:2px solid #ffd700; }
.panel-header h2 { margin:0; font-size:1.05rem; color:#002B5C; font-weight:700; display:flex; align-items:center; gap:8px; }
.panel-header h2 i { color:#ffd700; }
.panel-body { padding:28px; }
.ph{background:#f8fafc;padding:16px 22px;border-bottom:2px solid #ffd700;}
.ph h2{margin:0;font-size:1.05rem;color:#002B5C;font-weight:700;display:flex;align-items:center;gap:8px;}
.ph h2 i{color:#ffd700;}
.pb{padding:28px;}

/* FORME (admin_edit.php i tehnicko_edit.php dijele identičan .fg/.fc obrazac) */
.form-grid, .fg-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:16px; }
.fg { display:flex; flex-direction:column; gap:5px; }
.fg label { font-weight:600; font-size:0.85rem; color:#002B5C; }
.fg label.req::after { content:" *"; color:#dc2626; }
.fc { padding:9px 12px; border:1px solid #cbd5e1; border-radius:8px; font-size:0.875rem; color:#1e293b; background:white; font-family:inherit; width:100%; }
.fc:focus { outline:none; border-color:#002B5C; box-shadow:0 0 0 3px rgba(0,43,92,0.08); }
.chk-wrap { display:flex; align-items:center; gap:8px; font-size:0.875rem; color:#475569; margin-top:22px; cursor:pointer; }
.chk-wrap input { width:18px; height:18px; cursor:pointer; accent-color:#002B5C; }
.form-actions { display:flex; justify-content:flex-end; gap:10px; flex-wrap:wrap; margin-top:24px; padding-top:20px; border-top:1px solid #f1f5f9; }

/* TABLICA (rk-tbl generička verzija za admin.php/tehnicko.php — public.php ima
   uži .rk-wrap kontekst s vlastitom, uže-skopiranom verzijom niže) */
.rk-tbl-wrap{overflow-x:auto;}
.rk-tbl{width:100%;border-collapse:collapse;min-width:900px;}
.rk-tbl thead th{background:#002B5C;color:white;padding:10px 12px;text-align:left;font-size:0.75rem;text-transform:uppercase;letter-spacing:0.4px;}
.rk-tbl td{padding:8px 12px;font-size:0.85rem;color:#1e293b;border-bottom:1px solid #f1f5f9;vertical-align:middle;}
.rk-month-row td{background:#dbeafe;color:#002B5C;font-weight:700;font-size:0.8rem;letter-spacing:0.6px;}
.rk-yellow{background:#fef9c3;}
.rk-green{background:#dcfce7;}
.rk-gray{background:#f1f5f9;color:#64748b;}
.rk-white,.rk-free{background:#ffffff;}
.rk-free .rk-slobodno-label{color:#94a3b8;font-style:italic;}
.rk-canceled .rk-naziv{color:#dc2626;}
.rk-otkazano-tag{display:inline-block;margin-left:6px;padding:1px 7px;border-radius:10px;background:#fee2e2;color:#991b1b;font-size:0.68rem;font-weight:700;}
.rk-conflict-tag{display:inline-flex;align-items:center;gap:4px;margin-left:6px;padding:1px 8px;border-radius:10px;background:#ffedd5;color:#9a3412;font-size:0.68rem;font-weight:700;cursor:help;}
.rk-date{white-space:nowrap;font-weight:600;color:#002B5C;}
.rk-center{text-align:center;}
.rk-center i{color:#ffd700;}
.rk-actions{white-space:nowrap;display:flex;gap:6px;}
.rk-act-edit,.rk-act-del,.rk-act-add{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:6px;text-decoration:none;font-size:0.8rem;}
.rk-act-edit{background:#eff6ff;color:#002B5C;}
.rk-act-edit:hover{background:#002B5C;color:white;}
.rk-act-del{background:#fee2e2;color:#991b1b;}
.rk-act-del:hover{background:#ef4444;color:white;}
.rk-act-add{background:#f0fdf4;color:#16a34a;}
.rk-act-add:hover{background:#16a34a;color:white;}
.rk-act-promote{display:inline-flex;align-items:center;gap:5px;padding:0 10px;height:28px;border-radius:6px;text-decoration:none;font-size:0.75rem;font-weight:600;background:#eff6ff;color:#002B5C;white-space:nowrap;}
.rk-act-promote:hover{background:#002B5C;color:white;}
.rk-promo-tag{display:inline-flex;align-items:center;gap:5px;padding:0 10px;height:28px;border-radius:6px;text-decoration:none;font-size:0.75rem;font-weight:600;background:#f0fdf4;color:#16a34a;white-space:nowrap;}
.rk-promo-tag:hover{background:#16a34a;color:white;}
.rk-act-unlink{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:6px;text-decoration:none;font-size:0.8rem;background:#fef9c3;color:#854d0e;}
.rk-act-unlink:hover{background:#eab308;color:white;}

/* PUBLIC.PHP (read-only prikaz, vlastiti .rk-wrap omotač + uže-skopirane iznimke) */
.rk-wrap{max-width:1200px;margin:40px auto;padding:0 20px 48px;}
.rk-hdr{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px;margin-bottom:18px;}
.rk-hdr h1{font-family:'Cuprum',sans-serif;color:#002B5C;font-size:1.4rem;margin:0;display:flex;align-items:center;gap:10px;}
.rk-year-form select{padding:8px 12px;border:1px solid #cbd5e1;border-radius:8px;font-size:0.9rem;color:#1e293b;background:white;}
.rk-legend{display:flex;flex-wrap:wrap;gap:14px;margin-bottom:18px;font-size:0.8rem;color:#475569;}
.rk-legend span{display:inline-flex;align-items:center;gap:6px;}
.rk-legend i{width:14px;height:14px;border-radius:3px;display:inline-block;}
.rk-legend .lg-yellow{background:#fef9c3;border:1px solid #eab308;}
.rk-legend .lg-green{background:#dcfce7;border:1px solid #16a34a;}
.rk-legend .lg-gray{background:#f1f5f9;border:1px solid #94a3b8;}
.rk-legend .lg-white{background:#ffffff;border:1px solid #e2e8f0;}
/* Uže skopirano da NE prepiše generičku .rk-tbl-wrap/.rk-tbl gore za admin/tehnicko stranice */
.rk-wrap .rk-tbl-wrap{overflow-x:auto;border-radius:10px;border:1px solid #e2e8f0;box-shadow:0 4px 16px rgba(0,0,0,0.06);}
.rk-wrap .rk-tbl{width:100%;border-collapse:collapse;min-width:820px;background:white;}
.rk-wrap .rk-tbl thead th{background:#002B5C;color:white;padding:10px 12px;text-align:left;font-size:0.75rem;text-transform:uppercase;letter-spacing:0.4px;}
.rk-wrap .rk-tbl td{padding:8px 12px;font-size:0.85rem;color:#1e293b;border-bottom:1px solid #f1f5f9;vertical-align:middle;}
.rk-wrap .rk-month-row td{background:#dbeafe;color:#002B5C;font-weight:700;font-size:0.8rem;letter-spacing:0.6px;padding:8px 12px;}
.rk-page-header{background:white;border-radius:12px;padding:30px;margin-bottom:30px;box-shadow:0 4px 6px rgba(0,0,0,0.05);text-align:center;border-bottom:3px solid #ffd700;}
.rk-page-header h1{font-family:'Cuprum',sans-serif;font-size:2.5rem;color:#002B5C;font-weight:700;margin-bottom:0.5rem;}
.rk-page-header p{color:#64748b;font-size:1.1rem;margin:0;}
.rk-btn-kalendar{display:inline-flex;align-items:center;gap:8px;margin-top:16px;padding:10px 20px;background:transparent;color:#002B5C;border:2px solid #002B5C;border-radius:8px;font-size:0.85rem;font-weight:700;cursor:pointer;transition:all 0.25s ease;}
.rk-btn-kalendar:hover{background:#002B5C;color:#ffd700;transform:translateY(-2px);}

/* MEDIA QUERIES */
@media(max-width:768px) {
  .mod-header { flex-direction:column; padding:12px 16px; }
  .panel-body { padding:16px; }
  .form-grid { grid-template-columns:1fr; }
  .hdr{flex-direction:column;align-items:stretch;}
  .hdr-actions{flex-direction:column;align-items:stretch;}
  .hdr-actions .btn{justify-content:center;}
  .usr{justify-content:center;order:-1;margin-bottom:2px;}
  .main-container{padding:0 12px;}
  .toolbar{flex-direction:column;align-items:stretch;}
  .toolbar select{width:100%;}
  .toolbar > a.btn{width:100%;justify-content:center;}
  .legend{margin-left:0;justify-content:center;}
  .pb{padding:16px;}
  .fg-grid{grid-template-columns:1fr;}
}
@media(max-width:768px){.rk-wrap{padding:0 15px 32px;margin:20px auto;} .rk-page-header{padding:20px;} .rk-page-header h1{font-size:2rem;}}
@media(max-width:640px){.rk-wrap{padding:0 10px 32px;} .rk-btn-kalendar{width:100%;justify-content:center;}}
@media(max-width:480px){.rk-page-header h1{font-size:1.6rem;}}

/* ============================================================
   TABLICA -> KARTICE na uskim ekranima (index.php kalendar pregled).
   .kal-row postaje kartica umjesto retka; data-label atributi na <td>
   (postavljeni u index.php) daju labele za rk-tbl generičku verziju
   ako se ikad ponovno iskoristi za admin/tehnicko kontekst.
   ============================================================ */
@media(max-width:700px) {
  /* Pojednostavljeno 2026-09-05 - prethodna verzija je pokušavala
     preslagivati stupce (float pa flex+order) i stalno je nešto pucalo
     (status bježao iz kartice, gumbi krivih dimenzija...). Umjesto toga:
     ista jednostavna logika kao natjecanje.php koji "pokazuje odlično na
     mobitelu" - polja se samo slažu prirodnim redoslijedom odozgo prema
     dolje, bez trikova. */
  /* Bazna ".rk-wrap .rk-tbl{min-width:820px}" (2 selektora, iz
     radni-kalendar.css) ima VEĆU specifičnost od plosnate ".rk-tbl"
     nizeg-prioriteta verzije koju sam ranije pisao ovdje - ostajala je na
     820px na mobitelu unatoc "mobilnom" pravilu, pa se sve unutra
     (kartice, gumbi, centrirani tekst gumba) renderiralo u 820px širokom
     prostoru od kojeg se vidio samo lijevi rub. Selektori ovdje MORAJU
     doslovno odgovarati baznima (isti broj/tip klasa) da ih nadjačaju. */
  .rk-wrap .rk-tbl-wrap { overflow: visible; border: none; box-shadow: none; background: transparent; }
  .rk-wrap .rk-tbl { min-width: 0; width: 100%; }
  .rk-tbl thead { display: none; }
  .rk-tbl, .rk-tbl tbody, .rk-tbl tr, .rk-tbl td { display: block; width: 100%; }

  .rk-wrap .rk-month-row td { padding: 4px 2px; background: transparent; }

  .kal-row {
    border-radius: 10px;
    border: 1px solid #e2e8f0;
    box-shadow: 0 2px 4px rgba(0,0,0,0.06);
    margin-bottom: 10px;
    padding: 12px 14px;
  }
  .kal-row td { padding: 3px 0; border: none; }

  .kal-row td[data-label="Datum"] { font-weight: 700; color: #002B5C; font-size: 0.9rem; }
  .kal-row td.rk-td-naziv { font-weight: 700; color: #1e293b; font-size: 1.02rem; margin: 4px 0; }
  .kal-row td[data-label="Format"], .kal-row td[data-label="Mjesto"] { color: #64748b; font-size: 0.8rem; }
  .kal-row td[data-label="Organizator"] { display: none; }
  .kal-row td[data-label="Status"] { margin-top: 4px; }

  /* Prošla natjecanja - prigušen tekst, status bedž ostaje potpuno vidljiv. */
  .kal-row.kal-row-prosli td[data-label="Datum"],
  .kal-row.kal-row-prosli td.rk-td-naziv,
  .kal-row.kal-row-prosli td[data-label="Format"],
  .kal-row.kal-row-prosli td[data-label="Mjesto"] { opacity: .55; }

  /* Padajući prikaz - ista širina/okvir kao kartica, vizualno nastavlja
     karticu odmah iznad (kartica gubi donji rub kad je otvorena). */
  .kal-row.kal-row-open { margin-bottom: 0; border-radius: 10px 10px 0 0; border-bottom: none; }
  .kal-detail-row td { padding: 0; }
  .kal-detail-row:not(.kal-hidden) .kal-turnir-body {
    background: #fff;
    border: 1px solid #e2e8f0;
    border-top: 1px dashed #e2e8f0;
    border-radius: 0 0 10px 10px;
    margin-bottom: 10px;
    padding: 14px;
  }

  /* "Detalji" naslijedi width:100% iz design.css (768px pravilo pisano za
     staru, širu tablicu) - unutar uske kartice to izgleda ogromno. */
  .kal-turnir-body .kal-btn-radni {
    width: auto;
    display: inline-flex;
    padding: 8px 14px;
    font-size: 0.8rem;
  }

  /* Dokumenti - jedan ispod drugog, isto kao natjecanje.php popis. */
  .kal-docs { flex-direction: column; align-items: stretch; gap: 8px; }
  .kal-turnir-body .kal-doc-link { width: 100%; justify-content: center; padding: 10px 14px; font-size: 0.85rem; }
}