/*
Theme Name: BosniaOnline.eu Portal
Theme URI: https://bosniaonline.eu/
Author: BosniaOnline.eu
Author URI: https://bosniaonline.eu/
Description: Rychlá a lehká zpravodajská WordPress šablona ve stylu “portálu” (Seznam-like). Připraveno pro sekce, slider, trending, video, reklamy a vícejazyčnost přes plugin (Polylang/WPML).
Version: 0.34.2
Requires at least: 6.2
Tested up to: 6.6
Requires PHP: 7.4
License: GPL-2.0-or-later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: bosniaonline-portal
Tags: news, one-column, two-columns, three-columns, custom-logo, custom-menu, featured-images, sticky-post, translation-ready
*/

:root {
  --bg: #0b0f17;
  --surface: #111827;
  --surface2: #0f172a;
  --text: #e5e7eb;
  --muted: #9ca3af;
  --border: rgba(255,255,255,.08);
  --accent: #22c55e;
  --accent2: #38bdf8;
  --radius: 18px;
  --shadow: 0 10px 35px rgba(0,0,0,.35);
  --maxw: 1220px;
  --gap: 18px;
}

*{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{
  margin:0;
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, Noto Sans, Arial, "Apple Color Emoji","Segoe UI Emoji";
  background: radial-gradient(1200px 800px at 10% -10%, rgba(56,189,248,.15), transparent 60%),
              radial-gradient(1200px 800px at 80% 0%, rgba(34,197,94,.12), transparent 60%),
              var(--bg);
  color:var(--text);
  line-height:1.55;
  font-size: clamp(15px, 0.25vw + 14px, 18px);
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

a{ color:inherit; text-decoration:none; }
a:hover{ text-decoration:underline; }

/* Responsive polish */
:focus-visible{ outline: 2px solid rgba(56,189,248,.95); outline-offset: 2px; border-radius: 10px; }
button, input, select, textarea{ font: inherit; }
img{ max-width: 100%; height: auto; }

.container{ width: min(var(--maxw), calc(100% - clamp(20px, 4vw, 56px))); }
.grid{ gap: clamp(14px, 1.2vw, var(--gap)); }

@media (prefers-reduced-motion: reduce){
  *{ scroll-behavior: auto !important; transition: none !important; animation: none !important; }
}

/* Display modes (Customizer) */
body.bo-mode-tv{
  --maxw: 1680px;
  --gap: 22px;
  --radius: 22px;
  font-size: clamp(18px, 0.45vw + 16px, 22px);
}
body.bo-mode-tv .header-inner{ padding: 14px 0; }
body.bo-mode-tv .brand-badge{ width: 42px; height: 42px; border-radius: 14px; }
body.bo-mode-tv .brand-name{ font-size: 18px; }
body.bo-mode-tv .primary-menu a{ padding: 12px 14px; }
body.bo-mode-tv .search input[type="search"]{ padding: 12px 14px; }
body.bo-mode-tv .card-body{ padding: 18px 20px; }
body.bo-mode-tv .subchip{ padding: 10px 14px; }
body.bo-mode-tv .wxchip{ padding: 10px 14px; }

body.bo-mode-compact{
  --maxw: 1180px;
  --gap: 14px;
  --radius: 16px;
  font-size: 14px;
}

/* Ultra-wide screens: more room (TV / 4K) */
@media (min-width: 1600px){
  :root{ --maxw: 1480px; --gap: 20px; }
  .tiles-grid{ grid-template-columns: repeat(4, 1fr); }
  .itv-grid{ grid-template-columns: repeat(4, 1fr); }
  .market-grid{ grid-template-columns: repeat(5, 1fr); }
}

@media (min-width: 2200px){
  :root{ --maxw: 1760px; }
}

/* Tablet refinement */
@media (max-width: 1100px){
  .hero-grid{ grid-template-columns: 1fr; }
}


.container{ width:min(var(--maxw), calc(100% - 28px)); margin-inline:auto; }
.grid{ display:grid; gap:var(--gap); }

.card{
  background: linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.02));
  border:1px solid var(--border);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  overflow:hidden;
}
.card-body{ padding: 14px 16px; }
.kicker{ color: var(--muted); font-size: 12px; letter-spacing: .08em; text-transform: uppercase; }
.h1{ font-size: clamp(26px, 3vw, 38px); line-height:1.1; margin: 6px 0 0; }
.h2{ font-size: 18px; line-height:1.25; margin: 8px 0 0; }
.meta{ color: var(--muted); font-size: 12px; margin-top: 8px; }

.site-header{
  position: sticky;
  top: 0;
  z-index: 50;
  backdrop-filter: blur(10px);
  background: rgba(11,15,23,.72);
  border-bottom: 1px solid var(--border);
}
.header-inner{ display:flex; align-items:center; gap:12px; padding: 10px 0; }
.brand{ display:flex; align-items:center; gap:10px; font-weight: 800; letter-spacing: .02em; }
.brand-badge{ width: 34px; height:34px; border-radius: 12px; background: linear-gradient(135deg, var(--accent), var(--accent2)); box-shadow: var(--shadow); }
.brand-name{ font-size: 15px; }
.nav{ margin-left:auto; display:flex; align-items:center; gap:12px; }
.menu-toggle{ display:none; border:1px solid var(--border); background: rgba(255,255,255,.04); color:var(--text); padding: 8px 10px; border-radius: 12px; }
.primary-menu ul{ list-style:none; display:flex; gap: 10px; padding:0; margin:0; }
.primary-menu a{ display:inline-flex; padding: 8px 10px; border-radius: 12px; }
.primary-menu a:hover{ background: rgba(255,255,255,.06); text-decoration:none; }

.search{ position:relative; }
.search input[type="search"]{
  width: min(420px, 48vw);
  background: rgba(255,255,255,.04);
  border:1px solid var(--border);
  border-radius: 999px;
  padding: 10px 12px 10px 38px;
  color: var(--text);
  outline:none;
}
.search .icon{ position:absolute; left: 12px; top: 50%; transform: translateY(-50%); opacity:.8; }

.breaking{
  border-top: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
  background: linear-gradient(90deg, rgba(34,197,94,.12), rgba(56,189,248,.08));
}
.breaking-inner{ display:flex; gap:10px; align-items:center; padding: 10px 0; }
.pill{ display:inline-flex; align-items:center; gap:8px; padding: 6px 10px; border-radius: 999px; font-size: 12px; border:1px solid var(--border); background: rgba(0,0,0,.18); }
.pill-dot{ width:8px; height:8px; border-radius: 99px; background: var(--accent); box-shadow: 0 0 0 4px rgba(34,197,94,.18); }
.breaking a:hover{ text-decoration:none; }
.breaking-title{ font-weight: 700; }
.breaking-text{ color: var(--text); opacity:.95; }

.hero{ padding: 18px 0 10px; }
.hero-grid{ grid-template-columns: 1.6fr 1fr; align-items: start; }

.topbar-fx{ display:inline-flex; align-items:center; gap:10px; font-weight:900; opacity:.92; flex-wrap:wrap; }
.topbar-fx .fx{ display:inline-flex; align-items:baseline; gap:6px; }
.topbar-fx .fx small{ opacity:.72; font-weight:800; }
.topbar-fx .dot{ width:6px; height:6px; border-radius:999px; background: var(--accent2); display:inline-block; opacity:.9; }

.topbar-weatherlist{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.wxchip{
  display:inline-flex; align-items:center; gap:8px;
  padding: 6px 10px;
  border-radius: 999px;
  border:1px solid rgba(255,255,255,.14);
  background: rgba(255,255,255,.04);
  font-weight: 900;
  cursor: pointer;
}
.wxchip:hover{ background: rgba(255,255,255,.08); }
.wxchip.is-current{ border-color: rgba(56,189,248,.38); background: rgba(56,189,248,.10); }
.wxchip small{ opacity:.7; font-weight: 800; }

@media (max-width: 980px){
  .hero-grid{ grid-template-columns: 1fr; }
  .search input[type="search"]{ width: 42vw; }
}

.slider{ position:relative; }
.slider-item{ display:none; }
.slider-item.is-active{ display:block; }
.slider-media{ position:relative; aspect-ratio: 16/9; background: rgba(255,255,255,.04); }
.slider-media img{ width:100%; height:100%; object-fit:cover; display:block; }
.slider-overlay{ position:absolute; inset:0; display:flex; flex-direction:column; justify-content:flex-end; padding: 16px; background: linear-gradient(180deg, transparent 35%, rgba(0,0,0,.75)); }
.slider-overlay .h2{ font-size: clamp(18px, 2.4vw, 28px); }
.slider-controls{ display:flex; gap:10px; padding: 10px 12px; border-top:1px solid var(--border); }
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  padding: 10px 12px; border-radius: 14px;
  border:1px solid var(--border);
  background: rgba(255,255,255,.04);
  color: var(--text);
  cursor:pointer;
}
.btn:hover{ background: rgba(255,255,255,.07); }
.btn-primary{ border-color: rgba(34,197,94,.45); background: rgba(34,197,94,.10); }

.main{ padding: 10px 0 30px; }
.layout{ grid-template-columns: 2fr 1fr; align-items:start; }
@media (max-width: 980px){ .layout{ grid-template-columns: 1fr; } }

.list{ display:grid; gap: 10px; }
.news-item{ display:grid; grid-template-columns: 140px 1fr; gap: 12px; align-items:stretch; }
.news-item .thumb{ aspect-ratio: 16/10; border-radius: 14px; overflow:hidden; border:1px solid var(--border); background: rgba(255,255,255,.04); }
.news-item .thumb img{ width:100%; height:100%; object-fit:cover; display:block; }
@media (max-width: 560px){
  .news-item{ grid-template-columns: 1fr; }
}

.section-title{ display:flex; align-items:center; justify-content:space-between; gap:10px; margin: 0 0 10px; }
.section-title h3{ margin:0; font-size: 16px; }
.section-title a{ color: var(--muted); font-size: 13px; }

.chips{ display:flex; flex-wrap:wrap; gap:8px; }
.chip{ display:inline-flex; align-items:center; padding: 7px 10px; border-radius:999px; border:1px solid var(--border); background: rgba(255,255,255,.04); font-size: 13px; cursor:pointer; }
.chip{ color: inherit; }
button.chip{ appearance:none; -webkit-appearance:none; }
.chip:hover{ text-decoration:none; background: rgba(255,255,255,.07); }

.video-frame{ position:relative; aspect-ratio:16/9; border-radius: var(--radius); overflow:hidden; border:1px solid var(--border); background: rgba(255,255,255,.04); }
.video-frame iframe{ width:100%; height:100%; border:0; }

.site-footer{ border-top:1px solid var(--border); padding: 22px 0; color: var(--muted); }
.site-footer a{ color: var(--text); }
.footer-grid{ display:flex; flex-wrap:wrap; gap: 14px; align-items:center; justify-content:space-between; }
.small{ font-size: 13px; }

/* WP defaults */
.wp-block-image img{ max-width: 100%; height: auto; }
.alignwide{ width: min(1100px, 100%); margin-inline:auto; }
.alignfull{ width: 100%; }
.screen-reader-text{ position:absolute; left:-9999px; }

/* Mobile nav */
@media (max-width: 860px){
  .menu-toggle{ display:inline-flex; }
  .primary-menu{ display:none; position:absolute; left:0; right:0; top: 62px; background: rgba(11,15,23,.94); border-bottom:1px solid var(--border); }
  .primary-menu.is-open{ display:block; }
  .primary-menu ul{ flex-direction:column; padding: 10px 14px; }
  .primary-menu a{ padding: 10px 12px; }
  .nav{ position:relative; }
}


/* Logo (WP custom logo) */
.custom-logo-link{ display:flex; align-items:center; }
.custom-logo{ max-height:34px; width:auto; height:auto; }
.chip--current{ background: rgba(34,197,94,.12); border-color: rgba(34,197,94,.45); }


/* Mega menu */
.primary-menu ul.menu{ position:relative; }
.primary-menu li.menu-item-top{ position:relative; }
.primary-menu li.menu-item-top > a{ font-weight:700; }
.mega{
  display:none;
  position:absolute;
  left:0;
  right:0;
  top: 44px;
  padding: 12px 0;
  z-index: 60;
}
.primary-menu li.menu-item-top:hover .mega,
.primary-menu li.menu-item-top:focus-within .mega{
  display:block;
}
.mega-inner{
  width:min(var(--maxw), calc(100% - 28px));
  margin: 0 auto;
  background: rgba(15,23,42,.92);
  border:1px solid var(--border);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  overflow:hidden;
  display:grid;
  grid-template-columns: 1fr 1.4fr;
}
.mega-col{ padding: 14px 16px; }
.mega-post-list{ display:grid; gap:10px; }
.mega-post{
  display:flex;
  flex-direction:column;
  padding: 10px 12px;
  border-radius: 14px;
  border:1px solid var(--border);
  background: rgba(255,255,255,.03);
  text-decoration:none;
}
.mega-post:hover{ background: rgba(255,255,255,.06); }
.mega-post-title{ font-weight:700; line-height:1.2; }
.mega-post-meta{ margin-top:6px; font-size:12px; color: var(--muted); }

@media (max-width: 860px){
  .mega{ display:none !important; }
}

/* Homepage section blocks */
.section-grid{ display:grid; gap: 12px; }
.block-2col{ display:grid; gap:12px; grid-template-columns: 1.2fr 1fr; }
@media (max-width: 720px){ .block-2col{ grid-template-columns: 1fr; } }
.featured-card{ border-radius: var(--radius); overflow:hidden; border:1px solid var(--border); background: rgba(255,255,255,.03); }
.featured-card .media{ aspect-ratio: 16/9; background: rgba(255,255,255,.04); }
.featured-card .media img{ width:100%; height:100%; object-fit:cover; display:block; }
.featured-card .body{ padding: 12px 14px; }
.small-list{ display:grid; gap:10px; }
.small-link{ display:flex; gap:10px; align-items:flex-start; padding: 10px 12px; border-radius: 14px; border:1px solid var(--border); background: rgba(255,255,255,.03); }
.small-link:hover{ background: rgba(255,255,255,.06); text-decoration:none; }
.small-link .t{ font-weight:700; line-height:1.2; }
.small-link .m{ margin-top:4px; font-size:12px; color: var(--muted); }
.dot{ width:8px; height:8px; border-radius:99px; background: var(--accent2); box-shadow: 0 0 0 4px rgba(56,189,248,.15); margin-top:4px; flex:0 0 auto; }

/* Video grid */
.video-grid{ display:grid; gap:12px; grid-template-columns: repeat(2, 1fr); }
@media (max-width: 980px){ .video-grid{ grid-template-columns: 1fr; } }
.video-card{ border-radius: var(--radius); overflow:hidden; border:1px solid var(--border); background: rgba(255,255,255,.03); }
.video-card .head{ padding: 10px 12px; border-bottom:1px solid var(--border); display:flex; align-items:center; justify-content:space-between; gap:10px; }
.video-card .head .k{ font-size:12px; color:var(--muted); text-transform:uppercase; letter-spacing:.08em; }
.video-card .frame{ aspect-ratio:16/9; background: rgba(255,255,255,.04); }
.video-card .frame iframe{ width:100%; height:100%; border:0; }


/* Top stories strip */
.topstrip{ padding: 14px 0 2px; }
.topstrip-head{ display:flex; align-items:center; gap:12px; padding: 0 0 10px; }
.topstrip-row{
  display:flex;
  gap: 12px;
  overflow:auto;
  padding-bottom: 8px;
  scroll-snap-type: x mandatory;
}
.topstrip-card{
  min-width: 280px;
  max-width: 320px;
  display:flex;
  flex-direction:column;
  border-radius: var(--radius);
  border:1px solid var(--border);
  background: rgba(255,255,255,.03);
  overflow:hidden;
  box-shadow: var(--shadow);
  scroll-snap-align: start;
  text-decoration:none;
}
.topstrip-media{
  position:relative;
  display:block;
  aspect-ratio: 16/9;
  background: rgba(255,255,255,.04);
}
.topstrip-media img{ width:100%; height:100%; object-fit:cover; display:block; }
.topstrip-ph{ display:flex; align-items:center; justify-content:center; width:100%; height:100%; color:rgba(255,255,255,.6); }
.topstrip-body{ padding: 10px 12px 12px; display:block; }
.topstrip-title{ display:block; font-weight:800; margin-top:6px; line-height:1.2; }
.play{
  position:absolute;
  inset:auto 10px 10px auto;
  width: 36px;
  height: 36px;
  border-radius: 999px;
  display:flex;
  align-items:center;
  justify-content:center;
  border:1px solid var(--border);
  background: rgba(0,0,0,.35);
  backdrop-filter: blur(6px);
}
.news-item .thumb{ position:relative; }
.news-item .thumb .play{ inset:auto 10px 10px auto; }

/* Preconnect hint (visual no-op) */


/* iTV feed cards */
.itv-grid{ display:grid; gap:12px; grid-template-columns: repeat(3, 1fr); }
@media (max-width: 980px){ .itv-grid{ grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px){ .itv-grid{ grid-template-columns: 1fr; } }
.itv-card{
  display:block;
  border-radius: var(--radius);
  border:1px solid var(--border);
  background: rgba(255,255,255,.03);
  overflow:hidden;
  text-decoration:none;
  box-shadow: var(--shadow);
}
.itv-card:hover{ background: rgba(255,255,255,.06); }
.itv-thumb{ position:relative; display:block; aspect-ratio: 16/9; background: rgba(255,255,255,.04); }
.itv-thumb img{ width:100%; height:100%; object-fit:cover; display:block; }
.itv-ph{ display:flex; align-items:center; justify-content:center; width:100%; height:100%; color:rgba(255,255,255,.6); font-weight:700; letter-spacing:.04em; }
.itv-badge{
  position:absolute;
  left: 10px;
  bottom: 10px;
  font-size: 12px;
  padding: 5px 10px;
  border-radius: 999px;
  border:1px solid var(--border);
  background: rgba(0,0,0,.35);
  backdrop-filter: blur(6px);
}
.itv-body{ display:block; padding: 10px 12px 12px; }
.itv-title{ display:block; font-weight:800; line-height:1.2; }


/* Sticky sidebar (desktop) */
@media (min-width: 981px){
  .layout aside{ position: sticky; top: 90px; align-self: start; }
}


/* Editorial A1/A2/A3 */
.home-editorial{ padding: 14px 0; }
.ed-grid{ display:grid; gap:12px; grid-template-columns: 1.4fr 1fr; }
@media (max-width: 980px){ .ed-grid{ grid-template-columns: 1fr; } }
.ed-card{ border-radius: var(--radius); overflow:hidden; border:1px solid var(--border); background: rgba(255,255,255,.03); box-shadow: var(--shadow); }
.ed-media{ position:relative; display:block; aspect-ratio: 16/9; background: rgba(255,255,255,.04); }
.ed-media img{ width:100%; height:100%; object-fit:cover; display:block; }
.ed-ph{ display:flex; align-items:center; justify-content:center; width:100%; height:100%; color:rgba(255,255,255,.6); }
.ed-body{ padding: 12px 14px; }
.ed-title{ display:block; font-size: 20px; font-weight: 900; line-height:1.15; text-decoration:none; }
.ed-small .ed-title{ font-size: 16px; font-weight: 800; }
.ed-col{ display:grid; gap:12px; }
.btn{
  padding: 12px 16px;
  border-radius: 999px;
  border:1px solid var(--border);
  background: rgba(255,255,255,.06);
  color: var(--text);
  font-weight: 800;
  cursor: pointer;
}
.btn:hover{ background: rgba(255,255,255,.10); }
.btn:disabled{ opacity:.6; cursor:not-allowed; }


/* Tiles A4–A12 */
.home-tiles{ padding: 4px 0 14px; }
.tiles-grid{ display:grid; gap:12px; grid-template-columns: repeat(3, 1fr); }
@media (max-width: 980px){ .tiles-grid{ grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px){ .tiles-grid{ grid-template-columns: 1fr; } }

.tile{ border-radius: var(--radius); overflow:hidden; border:1px solid var(--border); background: rgba(255,255,255,.03); box-shadow: var(--shadow); }
.tile-media{ position:relative; display:block; aspect-ratio: 16/9; background: rgba(255,255,255,.04); }
.tile-media img{ width:100%; height:100%; object-fit:cover; display:block; }
.tile-ph{ display:flex; align-items:center; justify-content:center; width:100%; height:100%; color:rgba(255,255,255,.6); }
.tile-body{ padding: 10px 12px 12px; }
.tile-title{ display:block; font-weight: 900; line-height:1.2; text-decoration:none; margin-top:6px; }

/* LIVE badge */
.live-badge{
  position:absolute;
  left: 10px;
  top: 10px;
  font-size: 12px;
  padding: 5px 10px;
  border-radius: 999px;
  border:1px solid var(--border);
  background: rgba(239,68,68,.25);
  backdrop-filter: blur(6px);
  font-weight: 900;
  letter-spacing:.08em;
}


/* Search modal */
.iconbtn{
  width: 38px; height: 38px;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: rgba(255,255,255,.06);
  color: var(--text);
  display:flex; align-items:center; justify-content:center;
  cursor:pointer;
}
.iconbtn:hover{ background: rgba(255,255,255,.10); }

.search-modal{ position: fixed; inset:0; z-index: 200; display:none; }
.search-modal[aria-hidden="false"]{ display:block; }
.search-backdrop{ position:absolute; inset:0; background: rgba(0,0,0,.55); backdrop-filter: blur(3px); }
.search-panel{
  position: relative;
  width: min(720px, calc(100% - 24px));
  margin: 6vh auto 0;
  border-radius: 22px;
  border:1px solid var(--border);
  background: rgba(15,23,42,.94);
  box-shadow: var(--shadow);
  overflow:hidden;
}
.search-head{ display:flex; align-items:center; justify-content:space-between; padding: 12px 14px; border-bottom:1px solid var(--border); }
.search-box{ padding: 12px 14px; border-bottom:1px solid var(--border); }
.search-box input{
  width:100%;
  padding: 12px 14px;
  border-radius: 14px;
  border:1px solid var(--border);
  background: rgba(255,255,255,.03);
  color: var(--text);
  outline: none;
}
.search-results{ padding: 10px 10px 14px; display:grid; gap:8px; max-height: 55vh; overflow:auto; }
.sres{
  display:flex; gap:10px; align-items:flex-start;
  padding: 10px 12px;
  border-radius: 14px;
  border:1px solid var(--border);
  background: rgba(255,255,255,.03);
  text-decoration:none;
}
.sres:hover{ background: rgba(255,255,255,.06); }
.sres-type{ font-size:12px; color: var(--muted); text-transform:uppercase; letter-spacing:.08em; min-width: 62px; }
.sres-title{ font-weight:800; line-height:1.2; }
.search-foot{ padding: 10px 14px 14px; border-top:1px solid var(--border); }
.modal-open{ overflow:hidden; }

/* Reading progress bar */
.reading-progress{
  position: fixed;
  left:0; right:0; top:0;
  height: 3px;
  z-index: 220;
  background: rgba(255,255,255,.06);
}
.reading-progress span{
  display:block;
  height:100%;
  width:100%;
  transform-origin: left;
  transform: scaleX(0);
  background: var(--accent2);
}

/* Related posts */
.related-grid{ display:grid; gap:12px; grid-template-columns: repeat(2, 1fr); }
@media (max-width: 680px){ .related-grid{ grid-template-columns: 1fr; } }
.related-card{
  display:block;
  border-radius: var(--radius);
  border:1px solid var(--border);
  background: rgba(255,255,255,.03);
  overflow:hidden;
  text-decoration:none;
  box-shadow: var(--shadow);
}
.related-card:hover{ background: rgba(255,255,255,.06); }
.related-media{ position:relative; display:block; aspect-ratio: 16/9; background: rgba(255,255,255,.04); }
.related-media img{ width:100%; height:100%; object-fit:cover; display:block; }
.related-ph{ display:flex; align-items:center; justify-content:center; width:100%; height:100%; color:rgba(255,255,255,.6); }
.related-body{ display:block; padding: 10px 12px 12px; }
.related-title{ display:block; font-weight:900; line-height:1.2; margin-top:6px; }


/* Section streams */
.section-stream{ margin-top: var(--gap); }
.ad-slot{ width:100%; }


/* Topbar (date/time + weather) */
.topbar{ border-bottom:1px solid var(--border); background: rgba(255,255,255,.02); }
.topbar-inner{ display:flex; align-items:center; justify-content:space-between; gap:12px; padding: 8px 0; }
.topbar-left{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.topbar-right{ display:flex; align-items:center; gap:10px; }
.topbar-dt{ font-weight:800; opacity:.9; }
.topbar-weather{ display:flex; align-items:center; gap:8px; opacity:.95; }
.topbar-weather .wx{ display:inline-flex; align-items:center; gap:8px; }
.topbar-weather .wx small{ opacity:.75; font-weight:700; }
.topbar-weather .wx strong{ font-weight:900; }
.topbar-weather .wx .dot{ width:6px; height:6px; border-radius:999px; background: var(--accent2); display:inline-block; opacity:.9; }
@media (max-width: 980px){
  .topbar-inner{ flex-direction:column; align-items:flex-start; }
  .topbar-right{ width:100%; justify-content:flex-start; }
}


/* Topbar */
.topbar{ border-bottom:1px solid var(--border); background: rgba(255,255,255,.02); }
.topbar-inner{ display:flex; align-items:center; justify-content:space-between; gap:12px; padding: 8px 0; }
.topbar-left{ display:flex; align-items:center; gap:12px; flex-wrap:wrap; }
.topbar-dt{ font-weight:800; font-size: 13px; opacity:.95; }
.topbar-weather .wx{ font-size: 13px; opacity:.95; }
.topbar-cities{ display:flex; gap:8px; justify-content:flex-end; }
@media (max-width: 680px){
  .topbar-inner{ flex-direction:column; align-items:flex-start; }
  .topbar-right{ width:100%; }
}



/* Services shortcuts (profi responsive grid) */
.services{ padding: 14px 0 2px; }
.services-grid{
  display:grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 10px;
}
.service-tile{
  display:flex;
  align-items:center;
  gap:10px;
  padding: 12px 14px;
  min-height: 58px;
  border-radius: 20px;
  border:1px solid var(--border);
  background: rgba(255,255,255,.03);
  text-decoration:none;
  box-shadow: var(--shadow);
  transition: transform .12s ease, background .12s ease, border-color .12s ease;
}
.service-tile:hover{
  background: rgba(255,255,255,.06);
  border-color: rgba(56,189,248,.22);
  transform: translateY(-1px);
}
.service-ic{
  width: 36px; height: 36px;
  display:flex; align-items:center; justify-content:center;
  border-radius: 14px;
  background: rgba(56,189,248,.10);
  border:1px solid rgba(56,189,248,.22);
  font-size: 18px;
  flex: 0 0 auto;
}
.service-label{ font-weight: 900; letter-spacing: .01em; line-height: 1.1; }
@media (max-width: 520px){
  .service-tile{
    padding: 12px 12px;
    border-radius: 18px;
  }
}

/* Notice */
.notice{
  margin-top: 12px;
  padding: 10px 12px;
  border-radius: 14px;
  border:1px solid rgba(56,189,248,.18);
  background: rgba(56,189,248,.06);
  color: rgba(229,231,235,.95);
}


/* Homepage main search */
.home-search{ padding: 14px 0 8px; }
.home-search-card{
  border-radius: 26px;
  border: 1px solid var(--border);
  background: linear-gradient(135deg, rgba(56,189,248,.10), rgba(255,255,255,.03));
  box-shadow: var(--shadow);
  padding: 16px 16px 14px;
}
.hs-head{ display:flex; flex-direction:column; gap:6px; }
.hs-title{ font-size: 20px; font-weight: 1000; letter-spacing: .01em; }
.hs-sub{ opacity: .85; max-width: 86ch; }
.hs-form{ margin-top: 12px; }
.hs-tabs{ display:flex; gap:8px; flex-wrap:wrap; }
.hs-tab{
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.14);
  background: rgba(255,255,255,.03);
  padding: 8px 12px;
  font-weight: 900;
  cursor: pointer;
}
.hs-tab.is-active{ background: rgba(56,189,248,.16); border-color: rgba(56,189,248,.30); }
.hs-row{ display:flex; gap:10px; margin-top: 10px; }
.hs-row input[type="search"]{
  width:100%;
  padding: 12px 14px;
  border-radius: 18px;
  border:1px solid rgba(255,255,255,.16);
  background: rgba(15,23,42,.55);
  color: var(--text);
  outline:none;
}
.hs-btn{
  padding: 12px 16px;
  border-radius: 999px;
  border:1px solid rgba(255,255,255,.16);
  background: rgba(255,255,255,.06);
  font-weight: 1000;
  cursor:pointer;
  white-space:nowrap;
}
.hs-btn:hover{ background: rgba(255,255,255,.10); }
.hs-hint{ margin-top: 10px; opacity:.8; }
@media (max-width: 680px){ .hs-row{ flex-direction:column; } }

/* Home search suggest panel */
.hs-suggest{
  display:none;
  margin-top: 10px;
  border-radius: 18px;
  border:1px solid rgba(255,255,255,.12);
  background: rgba(15,23,42,.70);
  overflow:hidden;
}
.hs-suggest.is-open{ display:block; }
.hs-item{
  display:grid;
  grid-template-columns: auto 1fr;
  gap: 10px;
  padding: 10px 12px;
  text-decoration:none;
  border-top:1px solid rgba(255,255,255,.08);
}
.hs-item:first-child{ border-top:0; }
.hs-item:hover{ background: rgba(255,255,255,.05); }
.hs-pill{
  display:inline-flex; align-items:center; justify-content:center;
  padding: 4px 10px;
  border-radius: 999px;
  border:1px solid rgba(56,189,248,.22);
  background: rgba(56,189,248,.12);
  font-weight: 900;
  font-size: 12px;
  height: 24px;
}
.hs-t{ font-weight: 900; line-height: 1.15; }
.hs-m{ grid-column: 2; opacity:.75; font-size: 12px; }

/* Directory cards */
.dir-grid{
  display:grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 12px;
  margin-top: 12px;
}
.dir-card{
  border-radius: 22px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.03);
  box-shadow: var(--shadow);
}
.dir-media{ position:relative; display:block; aspect-ratio: 16/9; background: rgba(255,255,255,.05); }
.dir-media img{ width:100%; height:100%; object-fit:cover; display:block; }
.dir-ph{ display:flex; align-items:center; justify-content:center; width:100%; height:100%; opacity:.7; }
.dir-badge{
  position:absolute; top:10px; left:10px;
  padding: 6px 10px;
  border-radius: 999px;
  background: rgba(56,189,248,.18);
  border:1px solid rgba(56,189,248,.28);
  font-weight: 1000;
  letter-spacing:.05em;
  font-size: 12px;
}
.dir-body{ padding: 12px 14px 14px; }
.dir-title a{ text-decoration:none; font-weight: 1000; font-size: 16px; line-height:1.15; }
.dir-links{ margin-top:10px; display:flex; gap:10px; }
.dir-links a{
  width: 36px; height: 36px;
  display:flex; align-items:center; justify-content:center;
  border-radius: 14px;
  border:1px solid rgba(255,255,255,.14);
  background: rgba(255,255,255,.04);
  text-decoration:none;
}
.dir-links a:hover{ background: rgba(255,255,255,.08); }

/* Search modal results meta */
.sres{ display:grid; grid-template-columns: auto 1fr; column-gap: 10px; row-gap: 2px; align-items:center; }
.sres-meta{ grid-column: 2; opacity:.7; font-size: 12px; }

.badge{display:inline-flex;align-items:center;gap:6px;margin-left:8px;padding:4px 10px;border-radius:999px;border:1px solid rgba(56,189,248,.22);background:rgba(56,189,248,.10);font-weight:1000;font-size:12px;}


/* Topbar */
.bo-topbar{ padding: 10px 0; border-bottom: 1px solid rgba(255,255,255,.10); background: rgba(2,6,23,.45); backdrop-filter: blur(10px); }
.bo-topbar-inner{ display:flex; align-items:center; justify-content:space-between; gap: 12px; flex-wrap:wrap; }
.bo-topbar-left{ display:flex; gap:10px; flex-wrap:wrap; }
.bo-pill{
  display:inline-flex; align-items:center; gap:10px;
  padding: 8px 12px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.03);
  font-weight: 900;
}
.bo-pill .bo-time{ opacity:.92; }
.bo-pill .bo-w{ opacity:.92; }
.bo-topbar-right{ display:flex; gap:10px; flex-wrap:wrap; }
.bo-toplink{
  display:inline-flex; align-items:center; justify-content:center;
  padding: 8px 12px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.03);
  text-decoration:none;
  font-weight: 1000;
}
.bo-toplink:hover{ background: rgba(255,255,255,.07); }

/* Video block */
.home-video .video-feature{
  display:grid;
  grid-template-columns: 1.2fr .8fr;
  gap: 14px;
  margin-top: 12px;
}
.video-thumb{
  position:relative; display:block;
  border-radius: 22px; overflow:hidden;
  border:1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.03);
  aspect-ratio: 16/9;
}
.video-thumb img{ width:100%; height:100%; object-fit:cover; display:block; }
.video-play{
  position:absolute; inset:auto 12px 12px auto;
  width: 46px; height: 46px;
  display:flex; align-items:center; justify-content:center;
  border-radius: 18px;
  border: 1px solid rgba(255,255,255,.16);
  background: rgba(2,6,23,.55);
  font-weight: 1200;
  font-size: 18px;
}
.video-meta{ padding: 6px 2px; }
.video-kicker{ opacity:.8; font-weight: 1000; }
.video-title a{ text-decoration:none; font-weight: 1100; font-size: 20px; line-height:1.12; display:inline-block; margin-top:6px; }

.video-grid{
  display:grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 12px;
  margin-top: 14px;
}
.video-card{
  border-radius: 22px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.03);
  box-shadow: var(--shadow);
}
.video-card-thumb{ position:relative; display:block; aspect-ratio: 16/9; background: rgba(255,255,255,.05); }
.video-card-thumb img{ width:100%; height:100%; object-fit:cover; display:block; }
.video-play-sm{
  position:absolute; bottom:10px; right:10px;
  width: 36px; height: 36px;
  display:flex; align-items:center; justify-content:center;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.16);
  background: rgba(2,6,23,.55);
  font-weight: 1200;
}
.video-card-body{ padding: 12px 14px 14px; }
.video-card-title a{ text-decoration:none; font-weight: 1000; line-height:1.15; }

@media (max-width: 860px){
  .home-video .video-feature{ grid-template-columns: 1fr; }
}

/* Most read */
.mostread-list{ list-style:none; padding:0; margin: 12px 0 0; display:flex; flex-direction:column; gap: 10px; }
.mostread-item{ display:flex; gap: 12px; align-items:flex-start; padding: 10px 12px; border-radius: 18px; border:1px solid rgba(255,255,255,.10); background: rgba(255,255,255,.02); }
.mostread-rank{ width: 30px; height: 30px; border-radius: 12px; display:flex; align-items:center; justify-content:center; font-weight: 1200; border:1px solid rgba(56,189,248,.22); background: rgba(56,189,248,.10); flex: 0 0 auto; }
.mostread-title{ text-decoration:none; font-weight: 1000; line-height:1.15; }


/* Homepage – Market */
.home-market .market-grid{
  display:grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
  margin-top: 12px;
}
.home-market .market-col{
  border-radius: 22px;
  border:1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.02);
  padding: 12px 12px 10px;
}
.home-market .market-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 10px;
  margin-bottom: 10px;
}
.home-market .market-name{ font-weight: 1100; letter-spacing:.01em; }
.home-market .market-more{ text-decoration:none; opacity:.9; font-weight: 900; }
.home-market .market-list{ list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap: 10px; }
.home-market .market-item{ padding-top: 8px; border-top:1px solid rgba(255,255,255,.08); }
.home-market .market-item:first-child{ border-top:0; padding-top:0; }
.home-market .market-title{ text-decoration:none; font-weight: 1000; line-height:1.15; display:inline-block; }
.home-market .market-meta{ display:flex; gap:8px; flex-wrap:wrap; opacity:.82; font-size: 12px; margin-top: 6px; }

@media (max-width: 980px){
  .home-market .market-grid{ grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 560px){
  .home-market .market-grid{ grid-template-columns: 1fr; }
}


/* Market CTA */
.bo-market-actions{ display:flex; gap:10px; align-items:center; flex-wrap:wrap; }
.bo-market-link{ text-decoration:none; opacity:.92; font-weight: 900; }
.bo-market-cta{
  display:inline-flex; align-items:center; justify-content:center;
  padding: 8px 12px;
  border-radius: 999px;
  border: 1px solid rgba(56,189,248,.28);
  background: rgba(56,189,248,.12);
  text-decoration:none;
  font-weight: 1100;
}
.bo-market-cta:hover{ background: rgba(56,189,248,.18); }


/* Homepage – Market TOP strip */
.home-market-topstrip{ margin-top: 12px; padding-top: 12px; border-top: 1px solid rgba(255,255,255,.08); }
.home-market-top-head{ display:flex; align-items:baseline; justify-content:space-between; gap:10px; flex-wrap:wrap; }
.home-market-top-title{ font-weight: 1100; letter-spacing:.01em; }
.home-market-top-row{
  display:flex;
  gap: 12px;
  overflow:auto;
  padding: 10px 2px 6px;
  scroll-snap-type: x mandatory;
}
.hm-top-card{
  min-width: 240px;
  max-width: 280px;
  border-radius: 22px;
  overflow:hidden;
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.03);
  scroll-snap-align: start;
}
.hm-top-thumb{ position:relative; display:block; aspect-ratio: 16/9; background: rgba(255,255,255,.05); }
.hm-top-thumb img{ width:100%; height:100%; object-fit:cover; display:block; }
.hm-top-badge{
  position:absolute; top:10px; left:10px;
  padding: 6px 10px;
  border-radius: 999px;
  background: rgba(56,189,248,.18);
  border: 1px solid rgba(56,189,248,.28);
  font-weight: 1000;
  letter-spacing: .06em;
  font-size: 12px;
}
.hm-top-body{ padding: 10px 12px 12px; }
.hm-top-name a{ text-decoration:none; font-weight: 1000; line-height:1.15; }
.hm-top-meta{ display:flex; gap:8px; flex-wrap:wrap; opacity:.82; font-size: 12px; margin-top: 6px; }


/* Homepage – Deals & Auctions cards */
.home-deals .bo-deals-wrap, .home-auctions .bo-au-wrap { margin-top: 0; }
.home-deals .bo-deals-head, .home-auctions .bo-au-head { display:none; } /* headline handled by theme section-title */
.home-deals .bo-deals-grid { margin-top: 10px; }
.home-auctions .bo-au-grid { margin-top: 10px; }


/* Search modal scopes */
.search-scopes{ display:flex; flex-wrap:wrap; gap:8px; margin-top:10px; }
.search-scope{
  padding: 8px 10px;
  border-radius: 999px;
  border:1px solid rgba(255,255,255,.14);
  background: rgba(255,255,255,.04);
  cursor:pointer;
  font-weight: 1000;
  font-size: 12px;
}
.search-scope.is-active{ border-color: rgba(56,189,248,.45); background: rgba(56,189,248,.12); }

/* Search page layout helpers */
.search-side{ display:grid; gap: var(--gap); }


/* Homepage – Seznam-style services tiles */
.home-services .section-title { margin-bottom: 12px; }
.home-services-tiles{
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
}
.hs-tile{
  display:block;
  text-decoration:none;
  border-radius: 26px;
  overflow:hidden;
  border: 1px solid rgba(255,255,255,.14);
  background: rgba(255,255,255,.04);
  padding: 14px;
  transition: transform .12s ease, background .12s ease;
}
.hs-tile:hover{
  transform: translateY(-1px);
  background: rgba(255,255,255,.06);
}
.hs-tile-top{ display:flex; align-items:center; gap: 10px; }
.hs-tile-icon{ font-size: 22px; width: 36px; height: 36px; display:flex; align-items:center; justify-content:center; border-radius: 14px; background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.10); }
.hs-tile-title{ font-weight: 1200; font-size: 18px; }
.hs-tile-desc{ margin-top: 8px; opacity: .82; font-size: 13px; line-height: 1.25; }

.hs-quick{ margin-top: 12px; padding-top: 12px; border-top: 1px solid rgba(255,255,255,.08); }
.hs-quick-head{ display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom: 10px; }
.hs-quick-title{ font-weight: 1100; opacity:.92; }
.hs-quick-grid{
  display:flex;
  gap: 10px;
  flex-wrap:wrap;
}
.hs-quick-item{
  display:inline-flex; align-items:center; gap:10px;
  padding: 10px 12px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.14);
  background: rgba(255,255,255,.04);
  text-decoration:none;
  font-weight: 1000;
}
.hs-quick-item:hover{ background: rgba(255,255,255,.08); }
.hs-quick-ico{ width: 24px; text-align:center; }

@media (max-width: 980px){
  .home-services-tiles{ grid-template-columns: 1fr; }
  .hs-tile-title{ font-size: 17px; }
}


/* Topbar sub row (Seznam-style: svátek / TV / sport / kalendář) */
.topbar-sub{
  margin-top: 10px;
  padding-top: 10px;
  border-top: 1px solid rgba(255,255,255,.08);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 12px;
  flex-wrap:wrap;
}
.topbar-sub-left{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.topbar-sub-right{ display:flex; align-items:center; gap:12px; flex-wrap:wrap; }
.subchip{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding: 8px 12px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.14);
  background: rgba(255,255,255,.04);
  text-decoration:none;
  font-weight: 1000;
}
.subchip:hover{ background: rgba(255,255,255,.08); }
.subchip small{ opacity:.7; font-weight: 850; }
.sublink{
  text-decoration:none;
  font-weight: 950;
  opacity: .90;
  padding: 6px 8px;
  border-radius: 12px;
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.02);
}
.sublink:hover{ background: rgba(255,255,255,.06); }

@media (max-width: 980px){
  .topbar-sub{ gap:10px; }
  .topbar-sub-right{ width:100%; justify-content:flex-start; }
}


/* Topbar dropdown panels (TV / Sport) */
.subdrop{ position: relative; display:inline-flex; align-items:center; }
.subchip-btn{ cursor:pointer; }
.subpanel{
  position: absolute;
  left: 0;
  top: calc(100% + 10px);
  min-width: min(360px, 92vw);
  max-width: min(420px, 92vw);
  border-radius: 18px;
  border: 1px solid rgba(255,255,255,.14);
  background: rgba(15,23,42,.98);
  box-shadow: 0 18px 45px rgba(0,0,0,.55);
  padding: 12px;
  z-index: 70;
  display: none;
}
.subdrop.is-open .subpanel{ display:block; }
.subpanel-head{
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap: 12px;
  margin-bottom: 10px;
}
.subpanel-head strong{ font-weight: 1200; }
.subpanel-more{
  text-decoration:none;
  font-weight: 950;
  opacity:.9;
  padding: 6px 10px;
  border-radius: 12px;
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.04);
}
.subpanel-more:hover{ background: rgba(255,255,255,.08); }

.subpanel-list{ display:flex; flex-direction:column; gap:10px; }
.subitem{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding: 10px 12px;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.04);
  text-decoration:none;
}
.subitem:hover{ background: rgba(255,255,255,.08); }
.subitem strong{ font-weight: 1200; }
.subitem small{ opacity:.72; font-weight: 850; white-space:nowrap; }

@media (max-width: 980px){
  .subpanel{ position: static; display:none; min-width: auto; max-width: none; margin-top: 8px; }
  .subdrop.is-open .subpanel{ display:block; }
}


/* Prevent dropdown overflow on right edge */
.subdrop[data-subdrop="sport"] .subpanel{ left:auto; right: 0; }


/* Market grid responsive */
@media (max-width: 1200px){
  .market-grid{ grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 720px){
  .market-grid{ grid-template-columns: 1fr; }
}


/* Mobile topbar scroll (pills) */
@media (max-width: 720px){
  .topbar-weatherlist{
    flex-wrap: nowrap;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    width: 100%;
    padding-bottom: 6px;
  }
  .topbar-weatherlist::-webkit-scrollbar{ height: 8px; }
  .topbar-weatherlist::-webkit-scrollbar-thumb{ background: rgba(255,255,255,.12); border-radius: 999px; }
  .topbar-sub-left{
    flex-wrap: nowrap;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    width: 100%;
    padding-bottom: 6px;
  }
  .topbar-sub-left::-webkit-scrollbar{ height: 8px; }
  .topbar-sub-left::-webkit-scrollbar-thumb{ background: rgba(255,255,255,.12); border-radius: 999px; }
}


/* Touch targets */
button, .menu-toggle, .primary-menu a, .subchip, .wxchip, .sublink{
  min-height: 40px;
}
@media (max-width: 560px){
  .primary-menu a{ padding: 12px 14px; }
  .menu-toggle{ padding: 10px 12px; }
  .search input[type="search"]{ width: 100%; }
}


/* =========================================================
   0.26.0 – Responsive hotfix (PC / Tablet / TV / Mobil)
   - Topbar už není součást sticky headeru (scrolluje pryč)
   - Topbar je kompaktnější + nepřerůstá do výšky
   - Texty v kartách/clanky nelezou přes ohraničení (clamp + wrap)
   ========================================================= */

.topbar-inner{
  flex-wrap: wrap;
  align-items: flex-start;
  padding: 6px 0;
}
.topbar-left{ flex: 1 1 720px; min-width: 0; }
.topbar-right{ flex: 0 1 auto; min-width: 0; align-items: flex-start; }

/* sub-lišta musí být vždy celý řádek */
.topbar-sub{
  flex: 0 0 100%;
  width: 100%;
  margin-top: 8px;
  padding-top: 8px;
}

/* Počasí chips – raději 1 řádek + scroll (i na PC), aby topbar nebyl vysoký */
.topbar-weatherlist{
  display:flex;
  gap: 8px;
  flex-wrap: nowrap;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  max-width: 100%;
  padding-bottom: 6px;
}
.topbar-weatherlist > *{ flex: 0 0 auto; }

/* Města – 1 řádek + scroll (nevytváří sloupec) */
.topbar-cities{
  flex-wrap: nowrap !important;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  max-width: min(420px, 40vw);
  justify-content: flex-end;
  padding-bottom: 6px;
}
.topbar-cities > *{ flex: 0 0 auto; }

/* Zmenšení pillů */
.subchip, .wxchip, .chip{
  padding: 6px 10px;
  min-height: 36px;
}
.topbar-dt{ font-size: 12px; }
.topbar-weather .wx, .topbar-weatherlist .wxchip{ font-size: 12px; }

/* Na menších šířkách schovej redundantní odkazy vpravo (šetří výšku) */
@media (max-width: 820px){
  .topbar-sub-right{ display:none; }
  .topbar-cities{ max-width: 100%; justify-content:flex-start; }
}

/* Extra malé mobily: schovej kurzy (stejně jsou v 2. řadě) */
@media (max-width: 520px){
  .topbar-fx{ display:none; }
}

/* Lepší sticky header (už jen hlavní header) – kompaktnější na mobilech */
@media (max-width: 560px){
  .header-inner{ padding: 8px 0; gap: 10px; }
  .brand-name{ font-size: 14px; }
}

/* Text safety: nikdy nepřeteče přes kartu */
.card, .tile, .topstrip-card, .video-card, .market-item, .mostread, .ed-card{
  overflow: hidden;
}

/* Clamp titles in cards/lists */
.news-item .h2,
.tile-title,
.topstrip-title,
.mostread-title,
.video-card-title,
.video-title,
.ed-title,
.mega-post-title,
.dir-title{
  overflow: hidden;
  text-overflow: ellipsis;
  overflow-wrap: anywhere;
  word-break: break-word;
  display: -webkit-box;
  -webkit-box-orient: vertical;
}

/* Per-component line limits */
.news-item .h2{ -webkit-line-clamp: 2; }
.topstrip-title{ -webkit-line-clamp: 2; }
.video-card-title, .video-title{ -webkit-line-clamp: 2; }
.tile-title, .ed-title, .mostread-title{ -webkit-line-clamp: 3; }
.mega-post-title{ -webkit-line-clamp: 3; }
.dir-title{ -webkit-line-clamp: 2; }

/* Meta text wrap */
.meta{ overflow-wrap:anywhere; }

/* Prevent flex children from forcing overflow */
.tile-body, .card-body, .news-item > div{ min-width: 0; }



/* =========================================================
   0.27.0 – Mobilní layout (iOS/Android) – kompaktní topbar
   Cíl: žádný „panel na půl obrazovky“, žádné duplikace, 1 řádek chips + scroll
   ========================================================= */

@media (max-width: 720px){
  /* Stabilní stacking místo chaotického wrapu */
  .topbar-inner{
    flex-direction: column;
    align-items: stretch;
    gap: 8px;
    padding: 6px 0;
  }
  .topbar-left, .topbar-right{
    width: 100%;
    min-width: 0;
  }

  /* Skryj duplicity a věci co žerou výšku (kurzy + extra city buttons) */
  .topbar-fx{ display: none !important; }
  .topbar-cities{ display: none !important; }

  /* Počasí: 1 řádek + scroll (klik na pill stále funguje) */
  .topbar-weatherlist{
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    gap: 8px;
    padding-bottom: 6px;
  }
  .topbar-weatherlist > *{ flex: 0 0 auto; }
  .wxchip{
    padding: 6px 10px;
    min-height: 34px;
    font-size: 12px;
    white-space: nowrap;
  }

  /* Subbar kompaktně */
  .topbar-sub{
    margin-top: 6px;
    padding-top: 6px;
    gap: 10px;
  }
  .topbar-sub-right{ display:none !important; } /* odkazy jsou i v menu + šetří výšku */

  /* Nameday / TV / Sport chips: vždy 1 řádek, žádné obří „bubliny“ */
  .topbar-sub-left{
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    width: 100%;
    padding-bottom: 6px;
    gap: 10px;
  }
  .subchip{
    padding: 6px 10px;
    min-height: 34px;
    max-width: 86vw;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .subchip small{ display:none !important; } /* na mobilu zkrátíme info */
  .subchip strong{
    display:inline;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  /* Dropdown panely: na mobilu pod chipem, žádné absolutní přetékání */
  .subpanel{
    position: static !important;
    min-width: auto !important;
    max-width: none !important;
    margin-top: 8px;
  }

  /* Header (logo/search/menu) – méně výšky */
  .header-inner{
    padding: 8px 0;
    gap: 10px;
  }
  .search{ flex: 1 1 auto; }
  .search input[type="search"]{
    height: 44px;
    padding: 12px 14px;
  }
  .menu-toggle{
    min-height: 44px;
    padding: 10px 12px;
  }
}

/* Super malé displeje: ještě víc kompaktní */
@media (max-width: 380px){
  .wxchip, .subchip{ max-width: 82vw; }
  .topbar-dt{ font-size: 11px; }
}


/* =========================================================
   0.28.0 – Mobile topbar spacing FIX
   Problém: topbar-inner na mobilu měl flex-direction:column, ale justify-content:space-between
   => obří mezery (roztažení přes výšku obrazovky)
   Řešení: justify-content:flex-start + skrytí prázdného right sloupce
   ========================================================= */

@media (max-width: 720px){
  .topbar-inner{ justify-content: flex-start !important; }
  .topbar-right{ display:none !important; } /* FX + cities jsou na mobilu skryté => celý blok pryč */
  .topbar-left{
    display:flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
    flex-wrap: nowrap;
  }
  .topbar-dt, .topbar-weather{ width: 100%; }
  .topbar-weather{ opacity: .95; }
}


/* =========================================================
   0.29.0 – Mobil: odstranění posledního „prázdného prostoru“ v topbaru
   Příčina: kombinace více topbar pravidel + flex-grow na .topbar-left při column layoutu
   Fix: na mobilu vynutit auto-height, nowrap, žádný flex-grow
   ========================================================= */

@media (max-width: 720px){
  .topbar, .topbar-inner{ height: auto !important; min-height: 0 !important; }
  .topbar-inner{
    display:flex !important;
    flex-direction: column !important;
    flex-wrap: nowrap !important;
    align-content: flex-start !important;
    justify-content: flex-start !important;
  }
  .topbar-left, .topbar-sub{
    flex: 0 0 auto !important;
    width: 100% !important;
  }
  .topbar-left{ flex-wrap: nowrap !important; }
}


/* =========================================================
   0.30.0 – Seznam-level UX finishe
   1) Sticky už jen BREAKING bar (header scrolluje pryč)
   2) Mobil: rychlé akce jako swipe row (Vyhledávání / Katalog / Slevy / Inzeráty)
   3) Desktop: mega-menu styling + Mobil: spodní tab bar (Home / News / Video / Katalog)
   ========================================================= */

/* 1) Header už není sticky */
.site-header{ position: relative; top:auto; z-index: 40; }

/* 1) BREAKING sticky (global) */
.breaking{
  position: sticky;
  top: 0;
  z-index: 60;
  backdrop-filter: blur(10px);
}
body.admin-bar .breaking{ top: 32px; }
@media (max-width: 782px){
  body.admin-bar .breaking{ top: 46px; }
}

/* 2) Home quick actions row (mobile) */
.bo-quickactions{
  display:none;
  gap: 10px;
  padding: 10px 0 0;
}
.bo-q{
  display:inline-flex;
  align-items:center;
  gap: 8px;
  padding: 10px 12px;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: rgba(0,0,0,.18);
  white-space: nowrap;
}
.bo-q span{ font-weight: 700; }

@media (max-width: 720px){
  /* Na mobilu schovej desktopové top linky a ukaž swipe row */
  .bo-topbar-right{ display:none; }
  .bo-quickactions{
    display:flex;
    flex-wrap: nowrap;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    padding-bottom: 6px;
  }
  .bo-quickactions > *{ flex: 0 0 auto; }
  .bo-quickactions::-webkit-scrollbar{ height: 8px; }
  .bo-quickactions::-webkit-scrollbar-thumb{ background: rgba(255,255,255,.12); border-radius: 999px; }
}

/* 3) Mega menu (desktop) – čisté, široké dropdowny */
.primary-menu .menu-item-has-children{ position: relative; }
.primary-menu .sub-menu{
  display:none;
  position:absolute;
  left:0;
  top: calc(100% + 10px);
  min-width: 280px;
  width: min(860px, 92vw);
  padding: 14px;
  border-radius: 18px;
  border: 1px solid var(--border);
  background: rgba(11,15,23,.96);
  backdrop-filter: blur(12px);
  box-shadow: 0 12px 50px rgba(0,0,0,.55);
}
.primary-menu .menu-item-has-children:hover > .sub-menu,
.primary-menu .menu-item-has-children:focus-within > .sub-menu{ display:block; }
.primary-menu .sub-menu li{ margin: 0; }
.primary-menu .sub-menu a{
  display:flex;
  padding: 10px 12px;
  border-radius: 14px;
  border:1px solid rgba(255,255,255,.06);
  background: rgba(255,255,255,.02);
}
.primary-menu .sub-menu a:hover{ background: rgba(56,189,248,.08); border-color: rgba(56,189,248,.18); }

/* když je submenu hodně položek -> 2 sloupce */
@media (min-width: 900px){
  .primary-menu .sub-menu{
    display:none;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
  }
  .primary-menu .menu-item-has-children:hover > .sub-menu,
  .primary-menu .menu-item-has-children:focus-within > .sub-menu{ display:grid; }
}

/* 3) Mobilní spodní tabbar */
.bo-tabbar{ display:none; }
@media (max-width: 720px){
  .bo-tabbar{
    display:block;
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 80;
    border-top: 1px solid var(--border);
    background: rgba(11,15,23,.86);
    backdrop-filter: blur(12px);
  }
  .bo-tabbar-inner{
    display:grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 6px;
    padding: 10px 12px calc(10px + env(safe-area-inset-bottom));
  }
  .bo-tab{
    display:flex;
    flex-direction: column;
    align-items:center;
    justify-content:center;
    gap: 6px;
    padding: 10px 8px;
    border-radius: 16px;
    border: 1px solid rgba(255,255,255,.06);
    background: rgba(255,255,255,.02);
    font-weight: 800;
    font-size: 12px;
    text-decoration: none;
  }
  .bo-tab-ic{ font-size: 18px; line-height: 1; }
  .bo-tab.is-active{
    border-color: rgba(56,189,248,.35);
    background: rgba(56,189,248,.10);
  }
  /* aby tabbar neprekryval obsah */
  body{ padding-bottom: 86px; }
}



/* =========================================================
   0.30.1 – Mobil: kompaktní bo-topbar (home mini bar)
   - Dva city-pillky do 1 řádku + swipe (už ne 2 řádky)
   ========================================================= */
@media (max-width: 720px){
  .bo-topbar .bo-topbar-left{
    flex-direction: row !important;
    align-items: center !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
    gap: 10px !important;
    width: 100%;
    padding-bottom: 6px;
  }
  .bo-topbar .bo-topbar-left > *{ flex: 0 0 auto; }
  .bo-topbar .bo-pill{
    padding: 10px 12px;
    min-height: 40px;
    font-size: 13px;
    white-space: nowrap;
  }
  .bo-topbar .bo-time{ font-variant-numeric: tabular-nums; }
}


/* =========================================================
   Home: Music Trending (0.31.0)
   ========================================================= */
.home-music .music-feature{ display:grid; gap: 10px; margin-bottom: 14px; }
.home-music .music-title{ font-weight: 700; font-size: 14px; color: var(--text); opacity: .9; }
.home-music .music-grid .video-card-title a{ display:block; }
@media (min-width: 900px){
  .home-music .music-feature{ grid-template-columns: 1fr; }
}


/* BS fixes: custom file input on Dodaj oglas */
.bo-file-wrap{display:flex;align-items:center;gap:10px;}
.bo-file-name{font-size:14px;opacity:.85;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:60vw;}
.bo-file-name.is-empty{opacity:.65;}