/* ==========================================================================
   SKS aréna — doplňkový stylopis statické verze.
   Původní šablona zůstává, tohle jen (1) sjednocuje písmo, které se nikde
   nenačítalo, a (2) obléká nové prvky: rozvrh jako tabulku, mřížku
   sponzorů a mapu.
   ========================================================================== */

/* --- písmo -----------------------------------------------------------------
   Šablona deklarovala Open Sans a Dosis, ale ani jedno se nenačítalo — žádný
   odkaz na Google Fonts, žádný vlastní soubor. Prohlížeč padal na Arial, a ne
   všude stejně, protože každé pravidlo mělo jinou zálohu. Odtud to přeskakování.
   Teď se Open Sans načítá doopravdy a platí na celý web. Ikonové sady
   (FontAwesome, et-line) zůstávají, ty jsou v pořádku.                       */
body, p, li, td, th, input, textarea, select, button,
.font-alt, h1, h2, h3, h4, h5, h6 {
  font-family: "Open Sans", Arial, Helvetica, sans-serif;
}
.fa, [class^="fa-"], [class*=" fa-"] { font-family: FontAwesome !important; }
[class^="icon-"], [class*=" icon-"] { font-family: 'et-line' !important; }

/* --- rozvrh ---------------------------------------------------------------- */
.sks-rozvrh { margin: 0 0 56px; }
.sks-nadpis {
  text-align: center; text-transform: uppercase; letter-spacing: .04em;
  font-weight: 700; margin: 0 0 22px; color: #1c1c1c;
}
.sks-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.sks-rozvrh table {
  width: 100%; border-collapse: separate; border-spacing: 4px;
  min-width: 720px; table-layout: fixed;
}
.sks-rozvrh thead th {
  background: none; color: #1c1c1c; font-weight: 700; font-size: 15px;
  text-transform: uppercase; letter-spacing: .06em; padding: 6px 4px; text-align: center;
  border: 0;
}
.sks-rozvrh th.sks-cas {
  width: 92px; color: #1c1c1c; font-weight: 700; font-size: 15px;
  text-align: right; padding-right: 12px; background: none; border: 0;
  white-space: nowrap; vertical-align: middle;
}
.sks-rozvrh td {
  background: #232323; color: #fff; text-align: center; vertical-align: middle;
  padding: 12px 8px; border: 0; line-height: 1.25; min-height: 62px;
}
.sks-rozvrh td strong { display: block; font-weight: 600; font-size: 14.5px; }
.sks-rozvrh td span { display: block; font-size: 12.5px; opacity: .78; margin-top: 2px; }
.sks-rozvrh td.sks-volno { background: #efefef; }

/* --- sponzoři -------------------------------------------------------------- */
.sks-sponzori {
  display: grid; grid-template-columns: repeat(2, 1fr); gap: 18px;
  align-items: center; justify-items: center; margin: 10px auto 0; max-width: 1100px;
}
.sks-spon {
  display: flex; align-items: center; justify-content: center;
  width: 100%; height: 108px; padding: 10px;
  filter: grayscale(100%); opacity: .72; transition: filter .2s, opacity .2s;
}
.sks-spon:hover { filter: none; opacity: 1; }
.sks-spon img { max-width: 100%; max-height: 88px; width: auto; height: auto; }

/* --- mapa ------------------------------------------------------------------ */
.sks-mapa iframe {
  width: 100%; height: 410px; border: 0; display: block; background: #e9e9e9;
}
.sks-mapa-adresa {
  text-align: center; margin: 14px 0 0; font-size: 15px;
}
.sks-mapa-adresa a { text-decoration: underline; }

/* --- novinky --------------------------------------------------------------- */
.sks-novinka { margin: 0 0 40px; }
.sks-novinka h2 { margin: 0 0 6px; }
.sks-datum { font-size: 13px; text-transform: uppercase; letter-spacing: .08em; opacity: .65; margin: 0 0 14px; }

@media (min-width: 600px) { .sks-sponzori { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 900px) { .sks-sponzori { grid-template-columns: repeat(4, 1fr); } }

/* --- kontakt místo formuláře ------------------------------------------------ */
.sks-kontakt { text-align: center; padding: 10px 0 30px; }
.sks-kontakt h3 { margin: 0 0 14px; text-transform: uppercase; letter-spacing: .05em; }
.sks-mail { margin: 0 0 12px; }
.sks-mail a {
  display: inline-block; font-size: 22px; font-weight: 600; letter-spacing: -.01em;
  border-bottom: 2px solid currentColor; padding-bottom: 3px; text-decoration: none;
}
.sks-kontakt-text { max-width: 54ch; margin: 0 auto; opacity: .8; }

/* --- výpis novinek ---------------------------------------------------------- */
.sks-novinky { display: grid; grid-template-columns: 1fr; gap: 34px; margin: 20px 0 10px; }
.sks-novinka { margin: 0; }
.sks-n-obr { display: block; margin-bottom: 14px; }
.sks-n-obr img { width: 100%; height: auto; display: block; }
.sks-novinka h2 { font-size: 20px; margin: 0 0 6px; line-height: 1.25; }
.sks-novinka h2 a { color: inherit; text-decoration: none; }
.sks-novinka p { margin: 0 0 8px; }
.sks-vice { font-weight: 600; text-transform: uppercase; font-size: 12.5px; letter-spacing: .08em; }
@media (min-width: 700px) { .sks-novinky { grid-template-columns: repeat(2, 1fr); gap: 40px 30px; } }
@media (min-width: 1000px) { .sks-novinky { grid-template-columns: repeat(4, 1fr); } }

/* ==========================================================================
   FACELIFT — jen mezery a drobnosti, vzhled zůstává
   Měřeno v prohlížeči: obalový blok měl 140 px odsazení nahoře i dole na
   každé stránce, takže nad obsahem podstránky zbývalo přes 400 px prázdna.
   ========================================================================== */
/* Šablona balí do .nd-region KAŽDOU oblast — hlavičku, obsah i patičku.
   Plošné odsazení proto odstrčilo i hlavičku: menu je nahoře průhledné a
   počítá s tím, že pod ním leží tmavý úvodní obrázek, takže se ocitlo nad
   bílou. Odsazení tedy platí jen pro obsahovou oblast, a ani tam pro tu,
   která nese celoobrazovkový úvodní obrázek — ten zůstává přesně jak byl. */
.nd-region:has(#Content) { padding-top: 56px !important; padding-bottom: 56px !important; }
.nd-region:has(#Header),
.nd-region:has(.js-height-full) { padding-top: 0 !important; padding-bottom: 0 !important; }
@media (max-width: 767px) {
  .nd-region:has(#Content) { padding-top: 34px !important; padding-bottom: 34px !important; }
  .nd-region:has(#Header),
  .nd-region:has(.js-height-full) { padding-top: 0 !important; padding-bottom: 0 !important; }
}

/* prázdné mezery, které šablona sype mezi bloky */
.pt-100 { padding-top: 56px !important; }
.pb-100 { padding-bottom: 56px !important; }
.mt-100 { margin-top: 56px !important; }
.mb-100 { margin-bottom: 56px !important; }
.pt-140, .pb-140 { padding-top: 60px !important; padding-bottom: 60px !important; }

/* Úvodní pás na domovské zůstává přes celou výšku okna, jak byl na původním
   webu. Zkracoval jsem ho na 62vh a obrázek je na výplň, takže se ořízl přes
   hlavy — na tenhle blok se nesahá. */

/* nadpis rozvrhu měl v šabloně napevno 100 px nad sebou */
.sks-nadpis { padding-top: 0 !important; margin-top: 0; }
.sks-rozvrh + .sks-rozvrh { margin-top: 48px; }

/* karty novinek: stejně vysoké obrázky, ať mřížka nedrncá */
.sks-n-obr img { aspect-ratio: 16 / 9; object-fit: cover; }
.sks-novinka h2 { letter-spacing: -.01em; }
.sks-vice { border-bottom: 2px solid currentColor; padding-bottom: 2px; text-decoration: none; }

/* seznam instruktorů: řádky k sobě blíž */
.instruktori-row, .row.mt-100 { margin-top: 48px !important; }

/* ==========================================================================
   ROZVRH — černé buňky, barva jen jako drobný proužek
   Klubová zelená #58C224 je z loga a patří náborům: to je jediné, co na
   rozvrhu hledá nový zájemce. Ale jen proužkem, ne výplní — barevné pole
   v tabulce přebíjí text.
   ========================================================================== */
.sks-rozvrh { --km:#E2711D; --kick:#D93025; --mma:#A855F7; --judo:#3B82F6;
              --spc:#14B8A6; --grap:#9CA3AF; --nabor:#58C224; }
.sks-rozvrh table { border-spacing: 5px; }
.sks-rozvrh thead th { padding-bottom: 10px; font-size: 13.5px; color: #6b6b6b; }
.sks-rozvrh th.sks-cas { font-size: 14px; color: #6b6b6b; font-weight: 600; }
.sks-rozvrh td {
  background: #232323; color: #fff; border-radius: 4px;
  padding: 14px 10px 16px; position: relative; overflow: hidden;
  transition: filter .12s ease;
}
.sks-rozvrh td strong { font-size: 14px; letter-spacing: -.01em; }
.sks-rozvrh td span { font-size: 12px; opacity: .7; }
.sks-rozvrh td:hover { filter: brightness(1.22); }

/* ten drobný proužek: tenká linka podél spodní hrany buňky */
.sks-rozvrh td[data-d]::after {
  content: ""; position: absolute; left: 10px; right: 10px; bottom: 6px;
  height: 3px; border-radius: 2px; background: var(--c, transparent);
}
.sks-rozvrh td[data-d="km"]      { --c: var(--km); }
.sks-rozvrh td[data-d="kickbox"] { --c: var(--kick); }
.sks-rozvrh td[data-d="mma"]     { --c: var(--mma); }
.sks-rozvrh td[data-d="judo"]    { --c: var(--judo); }
.sks-rozvrh td[data-d="spc"]     { --c: var(--spc); }
.sks-rozvrh td[data-d="grap"]    { --c: var(--grap); }
.sks-rozvrh td[data-d="nabor"]   { --c: var(--nabor); }
.sks-rozvrh td[data-d="jine"]    { --c: #6B7280; }

.sks-rozvrh td.sks-volno { background: #f4f4f4; }
.sks-rozvrh td.sks-volno:hover { filter: none; }
.sks-rozvrh thead th:nth-child(7), .sks-rozvrh thead th:nth-child(8) { opacity: .5; }

.sks-legenda { display: flex; flex-wrap: wrap; gap: 8px 18px; justify-content: center;
  margin-top: 18px; font-size: 12.5px; color: #6b6b6b; }
.sks-legenda span { display: inline-flex; align-items: center; gap: 7px; }
.sks-legenda i { width: 16px; height: 3px; border-radius: 2px; display: inline-block; }

/* ==========================================================================
   POPISKY TRENÉRŮ A DISCIPLÍN — sjednocení písma
   Texty se do Drupalu vkládaly z různých míst: sedm trenérů a čtyři
   disciplíny mají popisek nalepený z iPhonu (font-family UICTFontTextStyleBody,
   velikost 19,1 px, vlastní barva), zbytek jede na 14 px ze šablony. Odtud to
   přeskakování mezi stránkami. Text zůstává přesně tak, jak je — bere se mu
   jen vlastní velikost, písmo a barva, aby všude platila jedna ze šablony.
   ========================================================================== */
#content p[style], #content span[style], #content li[style], #content div[style*="font"],
#content p[style] *, #content span[style] *, #content li[style] * {
  font-size: 16px !important;
  line-height: 1.65 !important;
  font-family: "Open Sans", Arial, Helvetica, sans-serif !important;
  font-stretch: normal !important;
  color: inherit !important;
}
/* nadpisy a ikony si svoje velikosti ponechávají */
#content h1[style], #content h2[style], #content h3[style], #content h4[style], #content h5[style],
#content .fa[style], #content [class^="icon-"][style], #content .sks-legenda * {
  font-size: revert !important; line-height: revert !important; font-family: revert !important;
}

/* --- mobilní drobnosti ------------------------------------------------------
   1) Fotky trenérů, které jsou užší než sloupec (Tomáš Lébr, Marek Ziaja a
      další portréty 330 px), seděly zarovnané vlevo, zbytek na střed. Teď
      jsou na střed všechny.
   2) Na stránce ke stažení byl Bootstrapový .row vložený rovnou do bloku bez
      obalu, takže jeho záporné okraje přetékaly stránku o 15 px doprava. */
#content img { display: block; margin-left: auto; margin-right: auto; }
#content .sks-sponzori img, #content .fa img { display: inline-block; }
#content .node__content .row { margin-left: 0 !important; margin-right: 0 !important; }

/* --- velikost základního textu ----------------------------------------------
   Šablona sázela běžný text na 14 px, což je na mobilu drobné. Zvednuto na
   16 px pro celý obsah, ne jen pro popisky trenérů — jinak by se velikost
   lišila stránku od stránky. Nadpisy, menu, patička a rozvrh si své
   velikosti ponechávají, ty jsou navržené zvlášť.                          */
#content .node__content p,
#content .node__content ul:not([class]) li,
#content .node__content ol:not([class]) li,
#content .team-item-detail p {
  font-size: 16px; line-height: 1.65;
}
/* Dlaždice disciplín jsou <li class="work-item">, ne text — po zvětšení
   písma se jim rozjely popisky. Ty si drží velikost ze šablony. */
#content .works-grid li, #content .works-grid h3, #content .works-filter a,
#content .work-title, #content .work-descr, #content .views-field li {
  font-size: revert; line-height: revert;
}
.sks-rozvrh p, .sks-rozvrh li, .sks-rozvrh span, .sks-legenda,
.sks-datum, .sks-vice, .sks-spon, .team-item-descr, .field-content .discipliny {
  font-size: revert; line-height: revert;
}
#content .sks-rozvrh td strong { font-size: 14px; }
#content .sks-rozvrh td span { font-size: 12px; line-height: 1.25; }
#content .sks-legenda, #content .sks-legenda span { font-size: 12.5px; line-height: 1.4; }
#content .sks-datum { font-size: 13px; }
#content .sks-vice { font-size: 12.5px; }

/* --- odsazení sekcí na hlavní straně ----------------------------------------
   Šablona má odsazení zapsané přímo u prvků (padding-top: 140px), takže se na
   ně třídní pravidla výš nechytnou. Stahuji je na polovinu; na mobilu ještě
   níž, tam 140 px prázdna znamená celou obrazovku bez obsahu.              */
[style*="padding-top: 140px"] { padding-top: 70px !important; }
[style*="padding-bottom: 140px"] { padding-bottom: 70px !important; }
[style*="margin-bottom: 100px"] { margin-bottom: 56px !important; }
[style*="margin-top: 100px"] { margin-top: 56px !important; }
@media (max-width: 767px) {
  [style*="padding-top: 140px"] { padding-top: 40px !important; }
  [style*="padding-bottom: 140px"] { padding-bottom: 40px !important; }
  [style*="margin-bottom: 100px"] { margin-bottom: 34px !important; }
  [style*="margin-top: 100px"] { margin-top: 34px !important; }
  [style*="padding-top: 50px"], [style*="margin-top: 40px"] { padding-top: 24px !important; }
}


/* --- rozvrh na mobilu: seznam po dnech --------------------------------------
   Tabulka o sedmi sloupcích se na telefon nevejde a musela se posouvat do
   strany — to se špatně čte a člověk snadno přehlédne půlku týdne. Na úzké
   obrazovce se proto tabulka schová a ukáže se týž rozvrh po dnech pod sebou.
   Barevný proužek disciplíny zůstává, jen z dolní hrany přeskočí k levé.   */
.sks-dny { display: none; }
@media (max-width: 767px) {
  .sks-rozvrh .sks-tabulka { display: none; }
  .sks-dny { display: block; }

  .sks-den { margin: 0 0 18px; }
  .sks-den h3 {
    margin: 0 0 8px; font-size: 13px; font-weight: 700; letter-spacing: .12em;
    text-transform: uppercase; color: #6b6b6b;
    border-bottom: 1px solid #e3e3e3; padding-bottom: 6px;
  }
  .sks-den ul { list-style: none; margin: 0; padding: 0; }
  .sks-den li {
    display: flex; align-items: center; gap: 12px;
    background: #232323; color: #fff; border-radius: 4px;
    padding: 11px 12px; margin-bottom: 6px;
    border-left: 3px solid var(--c, transparent);
  }
  .sks-den li[data-d="km"]      { --c: var(--km); }
  .sks-den li[data-d="kickbox"] { --c: var(--kick); }
  .sks-den li[data-d="mma"]     { --c: var(--mma); }
  .sks-den li[data-d="judo"]    { --c: var(--judo); }
  .sks-den li[data-d="spc"]     { --c: var(--spc); }
  .sks-den li[data-d="grap"]    { --c: var(--grap); }
  .sks-den li[data-d="nabor"]   { --c: var(--nabor); }
  .sks-den li[data-d="jine"]    { --c: #6B7280; }

  .sks-cas-m {
    flex: 0 0 66px; font-size: 13px; font-weight: 600; color: #cfcfcf;
    font-variant-numeric: tabular-nums; letter-spacing: -.01em;
  }
  .sks-co strong { display: block; font-size: 14.5px; font-weight: 600; line-height: 1.25; }
  .sks-co span { display: block; font-size: 12px; opacity: .7; line-height: 1.3; }

  .sks-den-volno h3 { opacity: .55; }
  .sks-den-volno p {
    margin: 0; font-size: 13px; color: #9a9a9a; padding: 6px 0 2px;
  }
  .sks-rozvrh { margin-bottom: 40px; }
  .sks-legenda { justify-content: flex-start; text-align: left; }
}

/* --- filtry nad výpisem disciplín -------------------------------------------
   Řádek „Všechny disciplíny / Bojové sporty / Sebeobrana / Pro děti /
   Kondiční tréninky" byl na střed a na užším okně se zalamoval tak, že
   poslední položka zůstala osamocená uprostřed. Zarovnaný doleva drží
   jednu osu s dlaždicemi pod sebou. Popisky pod obrázky se nemění.      */
#content .works-filter,
#content .works-filter.align-center { text-align: left !important; }
#content .works-filter a { margin: 0 26px 8px 0; display: inline-block; }

/* ==========================================================================
   NOVINKY — nejnovější přes celou šířku, zbytek v kartách
   Mřížka čtyř úzkých sloupců vypadala zmačkaně: drobné obrázky, texty různě
   dlouhé, perex uťatý uprostřed věty.
   ========================================================================== */
.sks-hlavni {
  display: grid; grid-template-columns: 1fr; gap: 26px;
  margin: 0 0 54px; padding-bottom: 46px; border-bottom: 1px solid #e6e6e6;
}
.sks-hlavni .sks-h-obr { display: block; overflow: hidden; border-radius: 3px; }
.sks-hlavni .sks-h-obr img {
  width: 100%; height: auto; display: block; aspect-ratio: 16 / 9;
  object-fit: cover; transition: transform .35s ease;
}
.sks-hlavni .sks-h-obr:hover img { transform: scale(1.03); }
.sks-stitek {
  display: inline-block; font-size: 11px; letter-spacing: .14em;
  text-transform: uppercase; font-weight: 700; color: #1c1c1c;
  border-bottom: 2px solid #58C224; padding-bottom: 3px; margin: 0 0 14px;
}
.sks-hlavni h2 { font-size: 27px; line-height: 1.22; margin: 0 0 8px; letter-spacing: -.015em; }
.sks-hlavni h2 a { color: inherit; text-decoration: none; }
.sks-hlavni h2 a:hover { color: #58C224; }
.sks-hlavni p { margin: 0 0 12px; }
@media (min-width: 900px) {
  .sks-hlavni { grid-template-columns: 1.15fr 1fr; gap: 40px; align-items: center; }
}

.sks-novinky { display: grid; grid-template-columns: 1fr; gap: 34px; margin: 0; }
@media (min-width: 640px) { .sks-novinky { grid-template-columns: repeat(2, 1fr); gap: 36px 28px; } }
@media (min-width: 1000px) { .sks-novinky { grid-template-columns: repeat(3, 1fr); } }
.sks-novinka h3 { font-size: 18px; line-height: 1.3; margin: 0 0 6px; letter-spacing: -.01em; }
.sks-novinka h3 a { color: inherit; text-decoration: none; }
.sks-novinka h3 a:hover { color: #58C224; }
.sks-n-obr { display: block; overflow: hidden; border-radius: 3px; margin-bottom: 14px; }
.sks-n-obr img { transition: transform .35s ease; }
.sks-n-obr:hover img { transform: scale(1.03); }

/* ==========================================================================
   SOUBORY KE STAŽENÍ
   Původně ikonka v jednosloupcové mřížce vlevo a název až někde vpravo —
   mezi nimi půl obrazovky prázdna. Teď řádky: ikona, název, typ a velikost.
   ========================================================================== */
.sks-nadpis-sekce {
  font-size: 13px; letter-spacing: .14em; text-transform: uppercase;
  font-weight: 700; color: #6b6b6b; margin: 0 0 6px;
  padding-bottom: 10px; border-bottom: 1px solid #e6e6e6;
}
.sks-soubory { margin: 0 0 46px; }
.sks-soubory ul { list-style: none; margin: 0; padding: 0; }
.sks-soubory li + li { border-top: 1px solid #efefef; }
.sks-soubory a {
  display: flex; align-items: center; gap: 16px;
  padding: 16px 12px 16px 4px; text-decoration: none; color: #1c1c1c;
  transition: background .15s ease, padding-left .15s ease;
}
.sks-soubory a:hover { background: #f6f6f6; padding-left: 12px; color: #1c1c1c; }
.sks-ikona {
  flex: 0 0 38px; height: 38px; border-radius: 3px; background: #232323;
  position: relative;
}
.sks-ikona::before {
  content: "\f019"; font-family: FontAwesome; color: #58C224; font-size: 15px;
  position: absolute; inset: 0; display: flex; align-items: center; justify-content: center;
}
.sks-soubory .sks-nazev { flex: 1 1 auto; font-size: 15.5px; line-height: 1.4; }
.sks-soubory a:hover .sks-nazev { text-decoration: underline; }
.sks-soubory .sks-meta {
  flex: 0 0 auto; font-size: 12px; letter-spacing: .06em; color: #8a8a8a;
  text-transform: uppercase; font-variant-numeric: tabular-nums; white-space: nowrap;
}
@media (max-width: 520px) {
  .sks-soubory a { flex-wrap: wrap; gap: 4px 14px; }
  .sks-soubory .sks-nazev { flex: 1 1 calc(100% - 54px); }
  .sks-soubory .sks-meta { margin-left: 54px; }
}

/* --- video na stránce disciplíny --------------------------------------------
   Původně tu byl rám z veed.io. Ten službu nezrušil, ale nově posílá
   X-Frame-Options: sameorigin, takže odmítá běžet na cizím webu a
   návštěvníkovi zůstalo prázdné místo. Video je teď naše, přehrává ho
   prohlížeč sám a nezávisí to na ničem cizím.                             */
.sks-video { margin: 0 0 34px; }
.sks-video video {
  width: 100%; height: auto; display: block; background: #000;
  border-radius: 3px; aspect-ratio: 16 / 9;
}