/* Turnir Liga – javni prikaz. Mobilni prvi: telefon < 600px, tablet 600–1023px, PC ≥ 1024px */
.tl-box,.tl-home{--tl-accent:#1f3864;--tl-gold:#d4a73a;--tl-line:rgba(127,127,127,.25);--tl-muted:rgba(127,127,127,.95);box-sizing:border-box}
.tl-box *,.tl-home *{box-sizing:border-box}
.tl-box{max-width:900px;margin:0 auto 24px;font-size:15px;line-height:1.4}
.tl-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch}

/* ---------- Tabele ---------- */
.tl-box table,.tl-panel table{width:100%;border-collapse:collapse;margin:0}
.tl-box th,.tl-box td,.tl-panel th,.tl-panel td{padding:8px 6px;border-bottom:1px solid var(--tl-line);text-align:center;vertical-align:middle}
.tl-box th,.tl-panel th{font-size:11px;text-transform:uppercase;letter-spacing:.03em;color:var(--tl-muted);font-weight:600;white-space:nowrap}
.tl-l{text-align:left!important}.tl-r{text-align:right!important}
.tl-c{white-space:nowrap;width:78px}
.tl-table td.tl-l{min-width:120px}
.tl-table tr.tl-po td:first-child{box-shadow:inset 3px 0 0 var(--tl-accent)}
.tl-box a,.tl-panel a{text-decoration:none}
.tl-box a:hover,.tl-panel a:hover{text-decoration:underline}
.tl-f{display:inline-block;width:18px;height:18px;line-height:18px;border-radius:3px;font-size:11px;font-weight:700;color:#fff;margin-right:2px;text-align:center}
.tl-f-w{background:#1e9e4a}.tl-f-l{background:#d33c3c}
.tl-win,.tl-win a{font-weight:700}
.tl-note{color:var(--tl-muted);font-size:13px;margin:8px 0}
.tl-off{font-size:11px;color:var(--tl-muted)}
.tl-pending{color:var(--tl-muted)}
.tl-early{color:var(--tl-muted);font-weight:600}

/* ---------- Kolo / raspored ---------- */
.tl-round-nav{display:flex;justify-content:space-between;align-items:center;text-align:center;margin-bottom:8px}
.tl-round-nav a{display:inline-flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;font-size:28px;line-height:1;text-decoration:none!important}
.tl-rd{border-bottom:1px solid var(--tl-line);padding:4px 0}
.tl-rd summary{cursor:pointer;padding:10px 0;list-style-position:inside}
.tl-filter{margin-bottom:10px}
.tl-filter select{padding:8px;max-width:100%;min-height:40px}
.tl-kn{width:36px;color:var(--tl-muted)}
.tl-date{width:72px;color:var(--tl-muted);font-size:13px}
.tl-team-title{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap;margin:6px 0 12px}
.tl-team-title .tl-all{font-size:13px;font-weight:400}

/* ---------- Ekipa ---------- */
.tl-stats{display:flex;gap:10px;flex-wrap:wrap;margin:8px 0 12px}
.tl-stats div{border:1px solid var(--tl-line);border-radius:8px;padding:8px 14px;text-align:center;min-width:72px;flex:1 1 0}
.tl-stats b{display:block;font-size:20px}.tl-stats small{color:var(--tl-muted)}
.tl-contact{margin:6px 0 14px}
.tl-contact a,.tl-table a[href^="tel:"]{white-space:nowrap}

/* ---------- Play-off ---------- */
.tl-bracket{display:flex;gap:14px;overflow-x:auto;align-items:flex-start;max-width:none;-webkit-overflow-scrolling:touch;padding-bottom:4px}
.tl-col{min-width:210px;flex:1}
.tl-col h4{margin:0 0 8px;font-size:13px;text-transform:uppercase;color:var(--tl-muted)}
.tl-pair{border:1px solid var(--tl-line);border-radius:8px;margin-bottom:10px;overflow:hidden}
.tl-pair div{display:flex;justify-content:space-between;padding:7px 9px;gap:8px}
.tl-pair div+div{border-top:1px solid var(--tl-line)}
.tl-pair .tl-win{font-weight:700}

/* ---------- Zaglavlje (hero) ---------- */
.tl-home{font-size:15px;line-height:1.4}
.tl-home .tl-box{max-width:none;margin:0}
.tl-hero{background:linear-gradient(135deg,#0f1f3d 0%,#1f3864 55%,#1d5c73 100%);color:#fff;border-radius:14px;padding:36px 32px;margin-bottom:28px;position:relative;overflow:hidden}
.tl-hero:after{content:"♠ ♥ ♦ ♣";position:absolute;right:24px;bottom:-18px;font-size:96px;letter-spacing:8px;opacity:.07;white-space:nowrap;pointer-events:none}
.tl-hero-in{max-width:1100px;margin:0 auto;position:relative;z-index:1}
.tl-kicker{text-transform:uppercase;letter-spacing:.12em;font-size:12px;color:var(--tl-gold);margin:0 0 6px;font-weight:700}
.tl-hero h1{color:#fff;font-size:clamp(26px,4.6vw,48px);line-height:1.08;margin:0 0 4px}
.tl-sub{font-size:17px;opacity:.85;margin:0 0 20px}
.tl-chips{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-bottom:20px}
.tl-chips div{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.15);border-radius:10px;padding:10px 12px;min-width:0}
.tl-chips b{display:block;font-size:21px;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tl-chips span{display:block;font-size:12px;opacity:.8}
/* dugmad: uvijek jedan red */
.tl-cta{display:flex;flex-wrap:nowrap;gap:8px;max-width:100%}
.tl-btn{flex:0 1 auto;min-width:0;display:inline-flex;align-items:center;justify-content:center;padding:8px 16px;min-height:38px;border-radius:8px;border:1px solid rgba(255,255,255,.45);color:#fff!important;text-decoration:none!important;font-weight:600;font-size:14px;line-height:1.1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transition:background .15s}
.tl-btn:hover{background:rgba(255,255,255,.12)}
.tl-btn-main{background:var(--tl-gold);border-color:var(--tl-gold);color:#10203f!important}
.tl-btn-main:hover{background:#e2b84c}
.tl-hero-wrap{padding:16px 16px 0}
.tl-hero-only{max-width:1100px;margin:0 auto 24px}
.tl-hero-only .tl-hero{margin-bottom:0}

/* ---------- Naslovna ---------- */
.tl-sec{max-width:1100px;margin:0 auto 32px}
.tl-sec h2{font-size:22px;margin:0 0 12px}
.tl-grid2{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.tl-panel{border:1px solid var(--tl-line);border-radius:12px;padding:18px;min-width:0}
.tl-panel h2{margin-top:0}
.tl-panel h3{font-size:16px;margin:14px 0 6px}.tl-panel h3 small{font-weight:400;color:var(--tl-muted);font-size:13px}
.tl-panel .tl-form,.tl-panel .tl-form-h{display:none}
.tl-more{font-weight:600}
.tl-cards4{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.tl-cards4 div{border:1px solid var(--tl-line);border-top:3px solid var(--tl-gold);border-radius:10px;padding:14px 16px;min-width:0}
.tl-cards4 h4{margin:0 0 6px;font-size:15px}.tl-cards4 p{margin:0;font-size:14px;line-height:1.5}
.tl-home .tl-note{color:var(--tl-muted);font-size:13px}

/* ---------- Footer ---------- */
.tl-footer{display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:6px 16px;max-width:1100px;margin:0 auto;padding:12px 16px;font-size:13px;line-height:1.4;color:#f6ecd2;background:#0b1830;border-top:3px solid #d4a73a}
.tl-footer b{color:#d4a73a}
.tl-footer-ver{opacity:.75;font-size:12px;white-space:nowrap}
body > .tl-footer{max-width:none}

/* ================= TABLET 600–1023px ================= */
@media (max-width:1023px){
  .tl-hero{padding:28px 24px;border-radius:12px}
  .tl-hero:after{font-size:72px}
  .tl-grid2{grid-template-columns:1fr;gap:20px}
  .tl-cards4{grid-template-columns:repeat(2,1fr)}
  .tl-btn{padding:8px 12px;font-size:13.5px}
}

/* ================= TELEFON < 600px ================= */
@media (max-width:599px){
  .tl-box,.tl-home{font-size:14px}
  .tl-hero-wrap{padding:10px 10px 0}
  .tl-hero{padding:20px 12px 14px;border-radius:10px;margin-bottom:18px}
  .tl-hero:after{display:none}
  .tl-kicker{font-size:10.5px;margin-bottom:4px}
  .tl-hero h1{font-size:26px}
  .tl-sub{font-size:14px;margin-bottom:14px}
  .tl-chips{grid-template-columns:repeat(2,1fr);gap:8px;margin-bottom:14px}
  .tl-chips div{padding:8px 10px}
  .tl-chips b{font-size:17px}
  .tl-chips span{font-size:11px}
  .tl-cta{gap:5px}
  .tl-btn{flex:1 1 auto;padding:7px 4px;min-height:36px;font-size:12px;letter-spacing:-.1px;border-radius:7px;text-overflow:clip}
  .tl-sec{margin-bottom:22px}
  .tl-sec h2{font-size:19px}
  .tl-panel{padding:12px 10px;border-radius:10px}
  .tl-cards4{grid-template-columns:1fr;gap:10px}
  .tl-box th,.tl-box td,.tl-panel th,.tl-panel td{padding:7px 3px}
  .tl-c{width:58px}
  .tl-table td.tl-l{min-width:0}
  .tl-hp,.tl-form,.tl-form-h,.tl-date{display:none}
  .tl-stats div{padding:6px 8px;min-width:0}
  .tl-stats b{font-size:17px}
  .tl-col{min-width:180px}
  .tl-round-nav a{font-size:26px}
}
@media (max-width:380px){
  .tl-cta{gap:4px}
  .tl-btn{font-size:11px;padding:6px 3px;letter-spacing:-.2px}
}
@media (max-width:360px){
  .tl-hs{display:none}
}

/* ================= Prema širini sadržaja (uske kolone teme / Elementor sekcije) ================= */
.tl-home,.tl-box,.tl-panel{container-type:inline-size}
@container (max-width:760px){
  .tl-grid2{grid-template-columns:1fr;gap:20px}
  .tl-cards4{grid-template-columns:repeat(2,1fr)}
  .tl-hero{padding:26px 20px}
  .tl-btn{padding:8px 11px;font-size:13.5px}
}
@container (max-width:560px){
  .tl-hp,.tl-form,.tl-form-h,.tl-date{display:none}
  .tl-c{width:58px}
  .tl-table td.tl-l{min-width:0}
  .tl-chips{grid-template-columns:repeat(2,1fr);gap:8px}
  .tl-chips b{font-size:17px}
  .tl-cards4{grid-template-columns:1fr}
  .tl-hero{padding:20px 12px 14px}
  .tl-hero:after{display:none}
  .tl-cta{gap:5px}
  .tl-btn{flex:1 1 auto;padding:7px 4px;min-height:36px;font-size:12px;letter-spacing:-.1px;text-overflow:clip}
}
@container (max-width:340px){
  .tl-hs{display:none}
  .tl-btn{font-size:11px;padding:6px 3px}
}

/* =====================================================================
   v1.13.0 (v1.13.1: rezultat velikim brojem ispod karte) – Tamna tema (Predlog 2) + tršćanske karte + donja navigacija
   Aktivno kad je Sezona i postavke → Izgled → Tema = Tamna (body.tl-theme-dark)
   ===================================================================== */
body.tl-theme-dark{--tl-bg:#0e141c;--tl-panel:#16202d;--tl-panel2:#1b2635;--tl-line2:#222d3c;--tl-text:#e9e6e0;--tl-mut:#a3adba;--tl-blue:#3f5f86;--tl-blue-l:#8fa6c0;--tl-red:#9b3f3a;--tl-red-l:#d8948c;--tl-fd:'Bricolage Grotesque',system-ui,sans-serif;--tl-fb:'Figtree',system-ui,sans-serif}
.tl-theme-dark .tl-box,.tl-theme-dark .tl-home{--tl-accent:var(--tl-blue);--tl-gold:var(--tl-red);--tl-line:var(--tl-line2);--tl-muted:var(--tl-mut);color:var(--tl-text);font-family:var(--tl-fb)}
.tl-theme-dark .tl-home{background:var(--tl-bg);border-radius:22px;padding:16px}
.tl-theme-dark .tl-home.tl-hero-only{background:none;padding:0}
.tl-theme-dark .tl-box{background:var(--tl-panel);border:1px solid var(--tl-line2);border-radius:18px;padding:18px}
.tl-theme-dark .tl-home .tl-box{background:none;border:0;padding:0;border-radius:0}
.tl-theme-dark .tl-box h2,.tl-theme-dark .tl-box h3,.tl-theme-dark .tl-home h1,.tl-theme-dark .tl-home h2,.tl-theme-dark .tl-home h3,.tl-theme-dark .tl-home h4{font-family:var(--tl-fd);color:var(--tl-text);letter-spacing:-.01em}
.tl-theme-dark .tl-box a,.tl-theme-dark .tl-panel a{color:var(--tl-text)}
.tl-theme-dark .tl-box a:hover,.tl-theme-dark .tl-panel a:hover{color:#fff}
.tl-theme-dark .tl-more,.tl-theme-dark .tl-all,.tl-theme-dark .tl-contact a{color:var(--tl-blue-l)!important;font-weight:600}
.tl-theme-dark .tl-box td,.tl-theme-dark .tl-panel td{border-bottom-color:var(--tl-line2)}
.tl-theme-dark .tl-table tbody tr:nth-child(odd) td{background:rgba(255,255,255,.025)}
.tl-theme-dark .tl-table td:first-child{color:var(--tl-blue-l);font-weight:600}
.tl-theme-dark .tl-table tr.tl-po td:first-child{box-shadow:none}
.tl-theme-dark .tl-table tr.tl-po-last td{border-bottom:2px dashed var(--tl-red)}
.tl-theme-dark .tl-lose,.tl-theme-dark .tl-lose a{color:var(--tl-mut)}
.tl-theme-dark .tl-f-w{background:var(--tl-blue)}.tl-theme-dark .tl-f-l{background:var(--tl-red)}
.tl-theme-dark .tl-filter select{background:var(--tl-panel2);color:var(--tl-text);border:1px solid var(--tl-line2);border-radius:10px}
.tl-theme-dark .tl-rd summary{color:var(--tl-text)}
.tl-theme-dark .tl-stats div,.tl-theme-dark .tl-pair{background:var(--tl-panel2);border-color:var(--tl-line2)}
.tl-theme-dark .tl-round-nav a{color:var(--tl-text)}
/* zaglavlje */
.tl-theme-dark .tl-hero{background:var(--tl-panel);border:1px solid var(--tl-line2);border-radius:20px;color:var(--tl-text)}
.tl-theme-dark .tl-hero:after{display:none}
.tl-theme-dark .tl-hero-in{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:32px;align-items:center}
.tl-theme-dark .tl-kicker{color:var(--tl-blue-l);letter-spacing:.06em}
.tl-theme-dark .tl-hero h1{color:var(--tl-text);font-family:var(--tl-fd);font-weight:700;letter-spacing:-.02em}
.tl-theme-dark .tl-sub{color:var(--tl-mut);opacity:1}
.tl-theme-dark .tl-chips div{background:var(--tl-panel2);border-color:var(--tl-line2);border-radius:14px}
.tl-theme-dark .tl-chips b{font-family:var(--tl-fd)}
.tl-theme-dark .tl-chips span{color:var(--tl-mut);opacity:1}
.tl-theme-dark .tl-btn{border-color:#34425a;color:var(--tl-text)!important;border-radius:10px}
.tl-theme-dark .tl-btn:hover{background:rgba(255,255,255,.06)}
.tl-theme-dark .tl-btn-main{background:var(--tl-blue);border-color:var(--tl-blue);color:#fff!important}
.tl-theme-dark .tl-btn-main:hover{background:var(--tl-blue);filter:brightness(1.12)}
/* naslovna */
.tl-theme-dark .tl-panel{background:var(--tl-panel);border-color:var(--tl-line2);border-radius:18px}
.tl-theme-dark .tl-panel h3 small{color:var(--tl-mut)}
.tl-theme-dark .tl-cards4 div{background:var(--tl-panel);border-color:var(--tl-line2);border-top-color:var(--tl-red);border-radius:14px}
.tl-theme-dark .tl-cards4 p{color:var(--tl-mut)}
.tl-theme-dark .tl-footer{background:#121a25;color:var(--tl-mut);border-top:1px solid var(--tl-line2);font-family:var(--tl-fb)}
.tl-theme-dark .tl-footer b{color:var(--tl-blue-l)}

/* ---------- Tršćanske karte ---------- */
.tl-sprite{position:absolute;width:0;height:0;overflow:hidden}
.tl-resw{display:inline-flex;flex-direction:column;align-items:center;gap:3px;vertical-align:middle}
.tl-res{font-family:var(--tl-fd,inherit);font-size:21px;font-weight:700;line-height:1;color:var(--tl-text,inherit);white-space:nowrap}
.tl-res-wait{font-size:13px;font-weight:400;line-height:1.6;color:var(--tl-mut,#8a94a2)}
.tl-card{display:block;position:relative;width:32px;height:50px;perspective:600px}
.tl-card .tl-fl,.tl-dk .tl-fl{position:relative;display:block;width:100%;height:100%;transform-style:preserve-3d;transform:rotateY(180deg)}
.tl-face{position:absolute;left:0;top:0;width:100%;height:100%;display:block;backface-visibility:hidden;-webkit-backface-visibility:hidden;border-radius:5px}
.tl-front{transform:rotateY(180deg);box-shadow:0 6px 14px rgba(0,0,0,.4)}
.tl-front svg{display:block;width:100%;height:100%}
.tl-back{box-sizing:border-box;border:2px solid #fbf9f3;background-color:#1d2a52;background-image:repeating-linear-gradient(0deg,rgba(251,249,243,.5) 0 1px,transparent 1px 4px),repeating-linear-gradient(90deg,rgba(251,249,243,.5) 0 1px,transparent 1px 4px);display:flex;align-items:center;justify-content:center}
.tl-med{width:34%;height:auto}
.tl-card-wait .tl-back{opacity:.45;border-color:#5b6676;background-image:none}
.tl-c-card{width:64px!important;padding-top:6px!important;padding-bottom:6px!important}
.tl-c-card .tl-off{display:block;margin-top:0}
.tl-js .tl-card .tl-fl{transform:rotateY(0deg)}
.tl-js .tl-card .tl-fl.tl-go{animation:tl-flip .7s cubic-bezier(.3,.7,.2,1) both}
@keyframes tl-flip{from{transform:rotateY(0deg)}to{transform:rotateY(180deg)}}
/* dijeljenje u zaglavlju */
.tl-deal{position:relative;width:500px;height:190px;border-radius:16px;background:#101923;border:1px solid var(--tl-line2,#222d3c);overflow:hidden}
.tl-deal-in{position:absolute;left:0;top:0;width:500px;height:190px;transform-origin:0 0}
.tl-deck,.tl-dk{position:absolute;width:80px;height:124px}
.tl-deck{left:16px;top:33px;box-sizing:border-box;border-radius:6px;border:4px solid #fbf9f3;background:#1d2a52}
.tl-deck-1{top:37px;transform:rotate(-4deg)}.tl-deck-2{top:35px;transform:rotate(-2deg)}
.tl-deck-3{border:0;background:none;box-shadow:0 8px 18px rgba(0,0,0,.45)}
.tl-deck-3 .tl-back,.tl-dk .tl-back{border-width:4px;background-image:repeating-linear-gradient(0deg,rgba(251,249,243,.5) 0 1px,transparent 1px 6px),repeating-linear-gradient(90deg,rgba(251,249,243,.5) 0 1px,transparent 1px 6px)}
.tl-dk{perspective:700px;transform-origin:50% 100%}
.tl-dk1{left:130px;top:40px;transform:rotate(-8deg)}
.tl-dk2{left:222px;top:30px;transform:rotate(-3deg)}
.tl-dk3{left:314px;top:30px;transform:rotate(3deg)}
.tl-dk4{left:406px;top:40px;transform:rotate(8deg)}
.tl-js .tl-deal .tl-dk .tl-fl{transform:rotateY(0deg)}
.tl-js .tl-deal:not(.tl-go) .tl-dk{opacity:0}
.tl-js .tl-deal.tl-go .tl-dk1{animation:tl-k1 .6s cubic-bezier(.2,.8,.2,1) .3s both}
.tl-js .tl-deal.tl-go .tl-dk2{animation:tl-k2 .6s cubic-bezier(.2,.8,.2,1) .5s both}
.tl-js .tl-deal.tl-go .tl-dk3{animation:tl-k3 .6s cubic-bezier(.2,.8,.2,1) .7s both}
.tl-js .tl-deal.tl-go .tl-dk4{animation:tl-k4 .6s cubic-bezier(.2,.8,.2,1) .9s both}
.tl-js .tl-deal.tl-go .tl-dk .tl-fl{animation:tl-flip .7s cubic-bezier(.3,.7,.2,1) both}
@keyframes tl-k1{from{opacity:1;transform:translate(-114px,-7px) rotate(0)}to{opacity:1;transform:translate(0,0) rotate(-8deg)}}
@keyframes tl-k2{from{opacity:1;transform:translate(-206px,3px) rotate(0)}to{opacity:1;transform:translate(0,0) rotate(-3deg)}}
@keyframes tl-k3{from{opacity:1;transform:translate(-298px,3px) rotate(0)}to{opacity:1;transform:translate(0,0) rotate(3deg)}}
@keyframes tl-k4{from{opacity:1;transform:translate(-390px,-7px) rotate(0)}to{opacity:1;transform:translate(0,0) rotate(8deg)}}
@media (prefers-reduced-motion:reduce){.tl-card .tl-fl,.tl-dk .tl-fl{animation:none!important;transform:rotateY(180deg)!important}.tl-dk{animation:none!important;opacity:1!important}}

/* ---------- Donja navigacija (telefon) ---------- */
.tl-mnav{display:none}
@media (max-width:599px){
  .tl-mnav{display:grid;grid-template-columns:repeat(var(--tl-n,5),minmax(0,1fr));gap:4px;position:fixed;left:8px;right:8px;bottom:calc(8px + env(safe-area-inset-bottom,0px));z-index:9990;padding:6px;border-radius:20px;background:#16202d;border:1px solid #222d3c;box-shadow:0 10px 28px rgba(0,0,0,.45);font-family:'Figtree',system-ui,sans-serif}
  .tl-mnav a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;min-height:54px;border-radius:14px;color:#a3adba!important;text-decoration:none!important;font-size:11px;font-weight:500;line-height:1.1}
  .tl-mnav a.tl-on{background:var(--tl-blue,#3f5f86);color:#fff!important;font-weight:600}
  body.tl-has-nav{padding-bottom:calc(84px + env(safe-area-inset-bottom,0px))}
  body.tl-has-nav .tl-cta{display:none}
  .tl-theme-dark .tl-home{padding:10px;border-radius:16px}
  .tl-theme-dark .tl-box{padding:12px 10px;border-radius:14px}
  .tl-theme-dark .tl-hero{padding:18px 14px}
  .tl-c-card{width:56px!important}
  .tl-res{font-size:20px}
}

/* zaglavlje sa kartama: uži prostor → karte iznad teksta, umanjene */
@container (max-width:900px){
  .tl-theme-dark .tl-hero-in{grid-template-columns:1fr;gap:18px}
  .tl-theme-dark .tl-deal{order:-1}
}
@container (max-width:540px){
  .tl-deal{width:100%;max-width:330px;height:124px}
  .tl-deal-in{transform:scale(.64)}
}
@container (max-width:380px){
  .tl-deal{height:104px}
  .tl-deal-in{transform:scale(.54)}
}
