/* ==========================================================================
   ManaCon — úpravy pre WordPress
   main.css je kópia návrhu. Tu je len to, čo WordPress potrebuje navyše:
   kostra stránky (natívny layout), markup core blokov, štýly blokov
   (.is-style-*) a vnútro vlastných blokov.
   Rozloženie obsahu (šírka, mriežky, stĺpce, medzery medzi blokmi) rieši
   Gutenberg cez theme.json — tu sa nerieši.
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. KOSTRA STRÁNKY
   -------------------------------------------------------------------------- */
/* Obal template partu hlavičky nesmie obmedziť sticky .header na vlastnú výšku. */
.wp-site-blocks > header.wp-block-template-part { display: contents; }
/* Hlavička, obsah a pätička na seba nadväzujú bez medzery. */
.wp-site-blocks > * { margin-block: 0; }

.wp-block-image { margin: 0; }

/* Obsah stránky: zvislý odstup od hlavičky stránky a pätičky. */
.page-content { padding-block: var(--section-y); }
.page-content--front,
.page-content:has(> .alignfull:first-child) { padding-top: 0; }
.page-content:has(> .alignfull:last-child) { padding-bottom: 0; }

/* Nadpisy v obsahu majú nad sebou viac miesta než odseky. */
.page-content > h2:not(:first-child) { margin-block-start: 3rem; }
.page-content > h3:not(:first-child) { margin-block-start: 2rem; }

/* Celošírkové sekcie (Detail testu) na seba nadväzujú bez bielej medzery. */
.page-content > .alignfull + .alignfull { margin-block-start: 0; }

/* Úvodný pás s kartami má pod sebou väčší odstup. */
.page-content > .wp-block-manacon-hero + * { margin-block-start: var(--section-y); }

/* --------------------------------------------------------------------------
   3. HLAVIČKA — logo, core/navigation, tlačidlá
   -------------------------------------------------------------------------- */
.header .logo img { height: 38px; width: auto; }
.footer .footer__logo img { height: 32px; width: auto; }

.header .site-nav { margin-left: auto; flex-wrap: nowrap; }
.header .site-nav .wp-block-navigation__container { gap: 18px; flex-wrap: nowrap; }
.header .site-nav .wp-block-navigation-item__content {
  text-decoration: none; color: var(--blue-dark); font-size: .9375rem; font-weight: 600;
  white-space: nowrap; padding: 10px 0; border-bottom: 2px solid transparent;
  transition: color .15s, border-color .15s;
}
.header .site-nav .wp-block-navigation-item__content:hover { color: var(--blue); }
.header .site-nav .current-menu-item > .wp-block-navigation-item__content,
.header .site-nav [aria-current="page"] { color: var(--blue); border-bottom-color: var(--blue); }
.header .site-nav .wp-block-navigation__responsive-container-open,
.header .site-nav .wp-block-navigation__responsive-container-close { color: var(--blue-dark); }

.header__actions { flex-wrap: nowrap; }

/* WordPress prepína menu na hamburger pri 600 px — návrh už pri 1150 px. */
@media (max-width: 1150px) {
  .header .site-nav .wp-block-navigation__responsive-container-open:not(.always-shown) { display: flex; }
  .header .site-nav .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) { display: none; }
  .header__actions { order: 2; width: 100%; }
  .header__actions .wp-block-button { flex: 1; }
  .header__actions .wp-block-button__link { width: 100%; }
}
/* Otvorené mobilné menu — veľké riadky ako v návrhu. */
.header .site-nav .is-menu-open .wp-block-navigation__container { gap: 0; width: 100%; }
.header .site-nav .is-menu-open .wp-block-navigation-item { width: 100%; }
.header .site-nav .is-menu-open .wp-block-navigation-item__content {
  display: flex; align-items: center; min-height: 56px; width: 100%;
  font-size: 1.125rem; border-bottom: 1px solid var(--card-border);
}

/* --------------------------------------------------------------------------
   4. TLAČIDLÁ — core/button = .btn z návrhu
   Dvojitá trieda kvôli prednosti pred globálnymi štýlmi WordPressu.
   -------------------------------------------------------------------------- */
.wp-block-button .wp-block-button__link {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  padding: 16px 28px; border-radius: var(--radius-btn); min-height: 52px;
  font-family: inherit; font-size: 1.0625rem; font-weight: 600; line-height: 1.3;
  text-decoration: none; cursor: pointer; border: 1px solid transparent;
  background: var(--blue); color: #fff;
  transition: background-color .15s, border-color .15s, color .15s;
}
.wp-block-button .wp-block-button__link:hover { background: var(--blue-hover); color: #fff; }
.wp-block-button .wp-block-button__link:active { background: var(--blue-active); }
.wp-block-button.is-style-pink .wp-block-button__link { background: var(--brand-pink); }
.wp-block-button.is-style-pink .wp-block-button__link:hover { background: var(--pink-dark); }
.wp-block-button.is-style-secondary .wp-block-button__link { background: #fff; color: var(--blue-dark); border-color: var(--line); }
.wp-block-button.is-style-secondary .wp-block-button__link:hover { border-color: var(--blue); color: var(--blue-dark); }
.wp-block-button.is-style-on-dark .wp-block-button__link { background: #fff; color: var(--blue-dark); }
.wp-block-button.is-style-on-dark .wp-block-button__link:hover { background: var(--tint); color: var(--blue-dark); }
.wp-block-button.btn--lg .wp-block-button__link { padding: 20px 34px; min-height: 62px; font-size: 1.1875rem; }
.header__actions .wp-block-button .wp-block-button__link { padding: 13px 20px; font-size: 1rem; min-height: 48px; }
.wp-block-buttons { gap: 12px; }

/* --------------------------------------------------------------------------
   5. ŠTÝLY BLOKOV (.is-style-*)
   Dvojitá trieda (.wp-block-list.is-style-…) kvôli prednosti pred
   všeobecnými pravidlami z main.css (napr. .panel ul).
   -------------------------------------------------------------------------- */
/* Zoznam: dokumenty — typ sa určí z adresy odkazu (PDF / YouTube / Web). */
.wp-block-list.is-style-doc-list { list-style: none; padding-left: 0; display: grid; gap: 4px; }
.is-style-doc-list li { border-bottom: 1px solid var(--card-border); }
.is-style-doc-list li:last-child { border-bottom: 0; }
.is-style-doc-list a {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  min-height: 52px; padding: 12px 4px; text-decoration: none; font-weight: 600;
}
.is-style-doc-list a:hover { text-decoration: underline; }
.is-style-doc-list a[href^="http"]::after,
.is-style-doc-list a[href*=".pdf" i]::after {
  flex-shrink: 0; font-size: .875rem; font-weight: 700; letter-spacing: .04em;
  color: var(--text-muted); background: var(--tint); border-radius: 4px; padding: 3px 8px;
}
.is-style-doc-list a[href^="http"]::after { content: "Web"; }
.is-style-doc-list a[href*="youtube.com" i]::after,
.is-style-doc-list a[href*="youtu.be" i]::after { content: "YouTube"; }
.is-style-doc-list a[href*=".pdf" i]::after { content: "PDF"; }

/* Zoznam: prístroje (LOT / exspirace) — pilulky vedľa seba, zalamujú sa do riadkov */
.wp-block-list.is-style-device-links { list-style: none; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.is-style-device-links li { margin: 0; }
.is-style-device-links a {
  display: inline-flex; align-items: center; gap: 6px; text-decoration: none;
  background: var(--tint); color: var(--blue-dark); font-size: .8125rem; font-weight: 600; line-height: 1.3;
  padding: 7px 12px; border-radius: var(--radius-pill);
}
.is-style-device-links a:hover { background: var(--line); }
.is-style-device-links a::before {
  content: ""; width: 13px; height: 13px; flex-shrink: 0; background: var(--brand-pink);
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'%3E%3Cpath d='M12 2 2 9l10 7 10-7z'/%3E%3Cpath d='M2 9v6l10 7 10-7V9'/%3E%3C/svg%3E") center / contain no-repeat;
          mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'%3E%3Cpath d='M12 2 2 9l10 7 10-7z'/%3E%3Cpath d='M2 9v6l10 7 10-7V9'/%3E%3C/svg%3E") center / contain no-repeat;
}

/* Zoznam: kotvy (pilulky) — skok na časť stránky */
.wp-block-list.is-style-pills { list-style: none; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.is-style-pills a {
  display: inline-block; background: #fff; color: var(--text-muted); padding: 10px 18px; border-radius: var(--radius-btn);
  font-size: .9375rem; font-weight: 600; text-decoration: none; box-shadow: var(--shadow-card);
}
.is-style-pills a:hover { color: var(--blue-dark); }

/* Zoznam: číslované kroky — čísla striedajú modrú a ružovú */
.wp-block-list.is-style-steps { list-style: none; padding: 0; display: grid; gap: 18px; counter-reset: step; text-align: left; }
.is-style-steps li { position: relative; padding-left: 42px; min-height: 28px; counter-increment: step; }
.is-style-steps li::before {
  content: counter(step); position: absolute; left: 0; top: 0; width: 28px; height: 28px; border-radius: 50%;
  background: var(--blue-dark); color: #fff; font-size: .8125rem; font-weight: 800;
  display: grid; place-items: center;
}
.is-style-steps li:nth-child(even)::before { background: var(--brand-pink); }

/* Odsek */
.is-style-lead { font-size: var(--fs-lead); line-height: 1.6; }
.is-style-perex { font-family: var(--font-serif); font-weight: 500; font-size: 1.375rem; line-height: 1.5; color: var(--blue-dark); }
.is-style-eyebrow {
  font-size: var(--fs-eyebrow); font-weight: 600; letter-spacing: .08em;
  text-transform: uppercase; color: var(--brand-pink);
}
.is-style-eyebrow + * { margin-block-start: .75rem !important; }
.is-style-link-arrow a { font-weight: 600; text-decoration: none; display: inline-flex; gap: 6px; }
.is-style-link-arrow a:hover { text-decoration: underline; }
.is-style-link-arrow a::after { content: "→"; transition: transform .15s; }
.is-style-link-arrow a:hover::after { transform: translateX(3px); }

/* Oddeľovač */
.wp-block-separator { border: 0; border-top: 1px solid var(--card-border); opacity: 1; }

/* --------------------------------------------------------------------------
   6. TABUĽKY — core/table = .table-wrap + table z návrhu
   -------------------------------------------------------------------------- */
.wp-block-table {
  margin: 0; overflow-x: auto;
  border: 1px solid var(--card-border); border-radius: var(--radius-card);
}
.wp-block-table table.has-fixed-layout { table-layout: auto; }
.wp-block-table thead { border-bottom: 0; }
.wp-block-table th, .wp-block-table td {
  border: 0; border-bottom: 1px solid var(--line); padding: 16px 18px; text-align: left;
}
.wp-block-table tr:last-child td { border-bottom: 0; }
.wp-block-table td .has-small-font-size { display: inline-block; }

/* --------------------------------------------------------------------------
   7. VLASTNÉ BLOKY — vnútro (vzhľad kariet je v main.css)
   -------------------------------------------------------------------------- */
/* Karta (manacon/panel) — voľný obsah pod sebou */
.wp-block-manacon-panel > * + * { margin-top: 16px; }
.wp-block-manacon-panel > .icon-box + * { margin-top: 0; }
.wp-block-manacon-panel > * + h2,
.wp-block-manacon-panel > * + h3 { margin-top: 28px; }
.wp-block-manacon-panel > h3 + * { margin-top: 12px; }
.wp-block-manacon-panel.panel h3 { margin-bottom: 0; }
.wp-block-manacon-panel.is-centered { text-align: center; }
.wp-block-manacon-panel.is-centered > .icon-box { margin-inline: auto; }
.wp-block-manacon-panel.is-centered :is(ol, ul, form) { text-align: left; }
.wp-block-manacon-panel.panel--warn :is(h3, p, li) { color: #5C4E13; }
.wp-block-manacon-panel.note > * + * { margin-top: 10px; }

/* Hero */
.hero__inner { max-width: 720px; }
.quick-cards__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 24px; }

/* Čísla */
.stats-tiles .grid--2 { gap: 16px; }
.stats-tiles__wide { grid-column: 1 / -1; }
.stats-tiles .tile strong.is-compact { font-size: 1.25rem; }

/* Upútavka */
.teaser h2 + p { margin-top: 16px; }
.teaser__link { margin-top: 28px; }

/* Info karta — rozloženia */
.info-card--dark h3 { color: #fff; }
.info-card--dark p { color: #c7cbe8; }
.info-card--dark .link-arrow { color: #fff; }
.info-card--row { flex-direction: row; gap: 14px; align-items: flex-start; }
.info-card--row .icon-box { flex-shrink: 0; margin-bottom: 0; }
.info-card__body { display: flex; flex-direction: column; gap: 4px; }
.info-card--row h3 { font-size: var(--fs-h4); }
.info-card--legend { gap: 8px; padding: 20px; }
.info-card__head { display: flex; align-items: center; gap: 8px; }
.info-card--legend .icon-box { width: auto; height: auto; margin: 0; background: none; color: var(--brand-pink); }
.info-card--legend .icon-box svg { width: 16px; height: 16px; }
.info-card--legend h3 { font-size: .9375rem; }

/* Detail testu */
.test-block__sub { font-family: var(--font-serif); }
.test-block__body > .wp-block-manacon-panel { margin: 0; }

/* Kontakt */
.contact-panel__note { margin-top: -8px; }
.contact-panel__org p + p { margin-top: 8px; }

/* --------------------------------------------------------------------------
   8. ZÁLOŽKY ROČNÍKOV
   -------------------------------------------------------------------------- */
/* Záložky ročníkov — N-tý input otvára N-tý panel (do 4 ročníkov). */
.yeartabs { position: relative; }
.yeartabs__labels label:focus-visible { outline: 2px solid var(--blue); }
.yeartabs > input:nth-of-type(1):checked ~ .yeartabs__labels label:nth-child(1),
.yeartabs > input:nth-of-type(2):checked ~ .yeartabs__labels label:nth-child(2),
.yeartabs > input:nth-of-type(3):checked ~ .yeartabs__labels label:nth-child(3),
.yeartabs > input:nth-of-type(4):checked ~ .yeartabs__labels label:nth-child(4) {
  background: #fff; color: var(--blue-dark); box-shadow: var(--shadow-card);
}
.yeartabs > input:nth-of-type(1):focus-visible ~ .yeartabs__labels label:nth-child(1),
.yeartabs > input:nth-of-type(2):focus-visible ~ .yeartabs__labels label:nth-child(2),
.yeartabs > input:nth-of-type(3):focus-visible ~ .yeartabs__labels label:nth-child(3),
.yeartabs > input:nth-of-type(4):focus-visible ~ .yeartabs__labels label:nth-child(4) {
  outline: 2px solid var(--blue); outline-offset: 2px;
}
.yearpanels { margin-top: 28px; }
.yeartabs > input:nth-of-type(1):checked ~ .yearpanels > .yearpanel:nth-child(1),
.yeartabs > input:nth-of-type(2):checked ~ .yearpanels > .yearpanel:nth-child(2),
.yeartabs > input:nth-of-type(3):checked ~ .yearpanels > .yearpanel:nth-child(3),
.yeartabs > input:nth-of-type(4):checked ~ .yearpanels > .yearpanel:nth-child(4) { display: block; }
.yeartabs--single .yearpanels { margin-top: 0; }
.yeartabs--single .yearpanel { display: block; }

/* Obsah ročníka pod sebou */
.yearpanel > * + * { margin-top: 24px; }
.yearpanel > * + h2 { margin-top: 56px; }
.yearpanel > h2 + * { margin-top: 16px; }

/* --------------------------------------------------------------------------
   9. PÄTIČKA — core/social-links
   -------------------------------------------------------------------------- */
.footer .footer__logo { display: inline-block; }
.footer .wp-block-social-links { display: flex; gap: 12px; margin-top: 20px; padding: 0; }
.footer .wp-block-social-links .wp-social-link {
  width: 36px; height: 36px; border-radius: 8px; margin: 0;
  background: rgba(255,255,255,.1); color: #fff;
}
.footer .wp-block-social-links .wp-social-link:hover { background: rgba(255,255,255,.2); transform: none; }
.footer .wp-block-social-links .wp-block-social-link-anchor { width: 100%; height: 100%; display: grid; place-items: center; padding: 0; }
.footer .wp-block-social-links svg { width: 18px; height: 18px; fill: currentColor; }
.footer__bottom p { margin: 0; }


/* Nadpis v karte je menší ako nadpis sekcie. */
.wp-block-manacon-panel h2 { font-size: 1.375rem; }
/* Kontakt v mriežke vyplní bunku. */
.is-layout-grid > .contact-panel { max-width: none; }

/* --------------------------------------------------------------------------
   10. PRIHLÁSENIE — blok manacon/login z pluginu manacon-app
   -------------------------------------------------------------------------- */
.wp-block-manacon-login.login-card > * + * { margin-top: 16px; }
.wp-block-manacon-login.login-card > .icon-box + * { margin-top: 0; }
.wp-block-manacon-login.is-centered { text-align: center; }
.wp-block-manacon-login.is-centered :is(ol, ul, form, .login-message) { text-align: left; }
.login-divider { height: 1px; background: var(--card-border); }
.wp-block-manacon-login > .login-divider { margin-block: 24px; }
.login-form { max-width: none; }
.login-form .btn { width: 100%; }
.login-message { padding: 14px 18px; border-radius: 8px; }
.login-message--ok { background: var(--ok-bg); color: var(--ok-fg); }
.login-message--error { background: var(--sold-bg); color: var(--sold-fg); }
.login-status {
  display: flex; flex-wrap: wrap; gap: 8px 16px; justify-content: space-between; align-items: center;
  background: var(--tint); border-radius: var(--radius-card); padding: 14px 20px; color: var(--text-muted-tint);
}
.login-status strong { color: var(--blue-dark); }
.login-status a { font-weight: 600; }
.login-status__text p { margin: 0; }
.login-status__text p + p { margin-top: 4px; }
/* reCAPTCHA odznak — upozornenie je pod formulárom. */
.grecaptcha-badge { visibility: hidden; }
.wp-block-manacon-login.is-centered > .icon-box { margin-inline: auto; }
/* main.css má .login-card { margin: 0 auto } — vráti odstup od bloku nad kartou. */
.is-layout-constrained > .login-card:not(:first-child) { margin-top: 1.5rem; }
.icon-box--center { margin-inline: auto; }
