/* ==========================================================
   Styly pro bylinkyprovsechny.cz - nové
   ========================================================== */
/* opravy HP */
.mod-encycategories {
    padding-top: 1rem !important;
}
#kunena.layout h3 {
    font-size: 24px !important;
}
.kfrontend tbody.topic-list tr.category>td>div>a {
    font-size: 20px !important;
}


/* Tablet — méně */
@media (max-width: 991.98px) {
    #kunena .topic-item-messages .row.message + .row.message {
        margin-left: 24px !important;
        max-width: calc(100% - 24px);
    }
}

/* Mobil — ještě méně */
@media (max-width: 575.98px) {
    #kunena .topic-item-messages .row.message + .row.message {
        margin-left: 12px !important;
        max-width: calc(100% - 12px);
    }
}
/* ============================================================ */
/* Kunena: SKRÝT sekci "Přídat přílohy" v formuláři              */
/* ============================================================ */
#kunena #postform > h2:has(+ #kattachments-message-container),
#kunena #postform > #kattachments-message-container,
#kunena #postform > .shadow-lg:has(#kpost-attachments),
#kunena #postform > #kattach-list {
    /*display: none !important; */
}

/* ============================================================ */
/* Kunena: TinyMCE editor — plná šířka (TinyMCE 5/6 + Joomla)    */
/* ============================================================ */

/* Joomla 5 wrapper (KRITICKÉ - to jsme dosud neměli) */
#kunena #postform .js-editor-tinymce {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
}

/* TinyMCE 5/6 hlavní wrapper */
#kunena #postform .tox-tinymce,
#kunena #postform .tox.tox-tinymce {
    width: 100% !important;
    max-width: 100% !important;
}

/* Bootstrap tab obal */
#kunena #postform .tab-content,
#kunena #postform .tab-pane.active {
    width: 100% !important;
}

/* iframe (kde se píše text) */
#kunena #postform .tox-edit-area iframe,
#kunena #postform iframe.tox-edit-area__iframe {
    width: 100% !important;
}

/* Textarea fallback */
#kunena #postform textarea#message {
    width: 100% !important;
    max-width: 100% !important;
}
/* ==========================================================
   CUSTOM.CSS  –  Bylinky pro všechny
   Univerzální komponentní třídy.
   Používá tokeny z typography.css, doplňuje BS5.
   ========================================================== */
/*barvy pozadí*/

.grid-child.container-top-b.full-width {
    background-color: white;
}

/* směrování loga a menu */


/* ── Overlay na pozadí (hero, page-hero, ...) ───────────── */

.bg-overlay {
  position: relative;
  overflow: hidden;
}
.bg-overlay > img,
.bg-overlay > picture > img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 0;
}
.bg-overlay::after {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(
    135deg,
    rgba(26, 43, 28, .88) 0%,
    rgba(44, 62, 45, .72) 50%,
    rgba(92, 107, 82, .55) 100%
  );
}
.bg-overlay > *:not(img):not(picture) {
  position: relative;
  z-index: 2;
}

/* varianta: světlejší overlay pro subpage hero */
.bg-overlay--light::after {
  background: linear-gradient(
    135deg,
    rgba(26, 43, 28, .75) 0%,
    rgba(92, 107, 82, .6) 100%
  );
}

/* varianta: bottom gradient (pro karty s obrázkem) */
.bg-overlay--bottom::after {
  background: linear-gradient(
    0deg,
    rgba(26, 43, 28, .85) 0%,
    rgba(26, 43, 28, .25) 55%,
    transparent 100%
  );
}


/* ── Glass card (průhledná karta na tmavém pozadí) ──────── */

.glass-card {
  background: rgba(255, 255, 255, .07);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border: 1px solid rgba(255, 255, 255, .1);
  border-radius: var(--radius-card, 16px);
  padding: 1.25rem;
  color: #fff;
  transition: all .3s ease;
}
.glass-card:hover {
  transform: translateY(-4px);
  background: rgba(255, 255, 255, .12);
  border-color: rgba(255, 255, 255, .2);
}
.glass-card__img {
  width: 100%;
  height: 80px;
  object-fit: cover;
  border-radius: var(--radius-sm, 8px);
  margin-bottom: .75rem;
  opacity: .85;
}


/* ── Overlay card (obrázek + text přes gradient) ────────── */

.overlay-card {
  display: block;
  position: relative;
  overflow: hidden;
  border-radius: var(--radius-card, 16px);
  text-decoration: none !important;
}
.overlay-card img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .5s ease;
}
.overlay-card:hover img {
  transform: scale(1.06);
}
.overlay-card__content {
  position: absolute;
  inset: 0;
  background: linear-gradient(
    0deg,
    rgba(26, 43, 28, .85) 0%,
    rgba(26, 43, 28, .25) 55%,
    transparent 100%
  );
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: 1.25rem;
}
.overlay-card--ar43 { aspect-ratio: 4 / 3; }
.overlay-card--ar32 { aspect-ratio: 3 / 2; }


/* ── Stat bar (čísla v řadě) ────────────────────────────── */

.stat-bar__item + .stat-bar__item {
  border-left: 1px solid var(--color-border-light, #F0EBE5);
}
@media (max-width: 767.98px) {
  .stat-bar__item:nth-child(odd) { border-left: none; }
}


/* ── Section header (nadpis + label + popis) ────────────── */

.section-label {
  font-size: var(--typo-c2-fs, 12px);
  line-height: var(--typo-c2-lh, 20px);
  text-transform: uppercase;
  letter-spacing: .15em;
  font-weight: 600;
  color: var(--c-forest-300, #7A8B6F);
}


/* ── Tag link (ikona + text, klikací) ───────────────────── */

.tag-link {
  display: flex;
  align-items: center;
  gap: .875rem;
  padding: 1rem 1.25rem;
  background: var(--c-surface, #FAF6F0);
  border: 1.5px solid var(--color-border, #E2DCD4);
  border-radius: var(--radius-card, 12px);
  transition: all .25s ease;
  text-decoration: none !important;
  color: inherit;
}
.tag-link:hover {
  border-color: var(--c-forest-300, #7A8B6F);
  box-shadow: var(--shadow-sm);
  transform: translateX(4px);
}
.tag-link__icon {
  font-size: 1.5rem;
  flex-shrink: 0;
}


/* ── Featured grid (1 velký + N malých) ─────────────────── */

.featured-grid {
  display: grid;
  grid-template-columns: 1.3fr 1fr;
  gap: 1.25rem;
}
@media (max-width: 991.98px) {
  .featured-grid { grid-template-columns: 1fr; }
}

.featured-main {
  position: relative;
  overflow: hidden;
  border-radius: var(--radius-lg, 18px);
  min-height: 400px;
  display: block;
  text-decoration: none !important;
}
.featured-main > img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .5s ease;
}
.featured-main:hover > img {
  transform: scale(1.04);
}
.featured-main__overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(
    0deg,
    rgba(26, 43, 28, .92) 0%,
    rgba(26, 43, 28, .3) 55%,
    transparent 100%
  );
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: 2rem;
  color: #fff;
}

.featured-sm {
  display: flex;
  gap: 1rem;
  padding: .875rem;
  border: 1px solid var(--color-border, #E2DCD4);
  border-radius: var(--radius-card, 12px);
  background: #fff;
  transition: all .25s ease;
  text-decoration: none !important;
  color: inherit;
  align-items: center;
}
.featured-sm:hover {
  border-color: var(--c-forest-300, #7A8B6F);
  box-shadow: var(--shadow-sm);
  transform: translateX(4px);
}
.featured-sm__img {
  width: 90px;
  height: 72px;
  object-fit: cover;
  border-radius: var(--radius-sm, 8px);
  flex-shrink: 0;
}


/* ── Hover card (obecná karta s hover efektem) ──────────── */

.hover-card {
  display: block;
  border: 1px solid var(--color-border, #E2DCD4);
  border-radius: var(--radius-card, 16px);
  background: #fff;
  transition: all .3s ease;
  text-decoration: none !important;
  color: inherit;
  height: 100%;
  overflow: hidden;
}
.hover-card:hover {
  transform: translateY(-4px);
  box-shadow: var(--shadow-lg);
  border-color: var(--c-forest-100, #D4DDCD);
}
.hover-card__img {
  height: 170px;
  overflow: hidden;
}
.hover-card__img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .5s ease;
}
.hover-card:hover .hover-card__img img {
  transform: scale(1.06);
}


/* ── Author bar ─────────────────────────────────────────── */

.author-bar {
  background: linear-gradient(135deg,
    var(--c-forest-deep, #1A2B1C),
    var(--c-forest-400, #2C3E2D),
    var(--c-forest-sage, #5C6B52));
  color: #fff;
}
.author-bar__avatar {
  width: 120px;
  height: 120px;
  border-radius: 50%;
  border: 3px solid var(--c-gold-200, #C8A96E);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 3rem;
  flex-shrink: 0;
  background: var(--c-forest-sage, #5C6B52);
  box-shadow: 0 8px 24px rgba(0,0,0,.25);
}
.author-bar__badge {
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.1);
  padding: .5rem 1rem;
  border-radius: var(--radius-sm, 8px);
  font-size: var(--typo-c2-fs, 12px);
  color: var(--c-forest-100, #D4DDCD);
}


/* ── CTA block (tmavý blok s textem a tlačítkem) ────────── */

.cta-block {
  background: var(--c-forest-400, #2C3E2D);
  position: relative;
  overflow: hidden;
}
.cta-block__decor {
  position: absolute;
  right: -1rem;
  bottom: -1rem;
  opacity: .06;
  font-size: 14rem;
  line-height: 1;
  pointer-events: none;
}
@media (max-width: 767.98px) {
  .cta-block__decor { display: none; }
}


/* ── Topbar ─────────────────────────────────────────────── */

.topbar {
  background: var(--c-forest-deep, #1A2B1C);
  color: var(--c-forest-100, #D4DDCD);
}
.topbar a {
  color: var(--c-gold-100, #E8D5A8) !important;
  font-weight: 600;
  text-underline-offset: .15em;
}
.topbar a:hover {
  color: #fff;
}
/*----------------- karty ----------*/
.mod-cards-label {
  display: flex;
  align-items: center;
  gap: 12px;
  width: fit-content;
  margin: 0 auto;

  font-size: var(--typo-label-fs, 12px);
  line-height: var(--typo-label-lh, 20px);
  font-weight: 600;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--c-forest-300, #7A8B6F);
}

.mod-cards-label::before,
.mod-cards-label::after {
  content: '';
  width: 40px;
  height: 1px;
  background: var(--c-forest-300, #7A8B6F);
  opacity: 0.4;
}
/* ── Author bar – malý avatar (v CTA bloku) ────────────── */

.author-bar__avatar--sm {
  width: 40px;
  height: 40px;
  font-size: 1.1rem;
}


/* ── Footer ─────────────────────────────────────────────── */
/* Pozadí řeší template. Zde jen link reset (přebíjí globální
   zelené underline linky z typography.css) a heading spacing. */

.site-footer a {
  color: rgba(255,255,255,.5) !important;
  text-decoration: none !important;
  transition: color .2s ease, transform .2s ease;
}
.site-footer a:hover {
  color: var(--c-gold-100, #E8D5A8) !important;
  transform: translateX(3px);
  text-decoration: none !important;
}

.footer-heading {
  letter-spacing: 2px;
}
/* ==========================================================
   KLASIC MENU – Dropdown styling
   Bylinky pro všechny – Design System
   ==========================================================
   Module Class Suffix v adminu:
     " menu--hover"  … submenu na hover
     " menu--click"  … submenu na klik (výchozí)
   (nezapomeň na mezeru na začátku!)
   ========================================================== */
.container-header .mod-menu>li+li {
    margin-left: 0.1em !important;
}

/* ----------------------------------------------------------
   1) DROPDOWN PANEL – vzhled
   ---------------------------------------------------------- */

.klasic .dropdown-menu {
  position: absolute;
  /*top: 100%;*/
  left: 0;
  z-index: 1000;
  overflow:hidden;
  min-width: 220px;
  max-height: 80vh;
  overflow-y: auto;
  padding: 6px 0;
  margin: 2px 0 0;
  list-style: none;

  background: var(--c-surface, #FAF6F0);
  border: 1px solid var(--color-border-light, #F0EBE5);
  border-radius: var(--radius-card, 12px);
  box-shadow: var(--shadow-lg, 0 16px 48px rgba(44, 62, 45, .12));
}

/* --- Auto multi-column: pokud je submenu delší --- */
.klasic .dropdown-menu:has(> :nth-child(15)) {
  columns: 2;
  column-gap: 0;
  min-width: 440px;
}
.klasic .dropdown-menu:has(> :nth-child(25)) {
  columns: 3;
  min-width: 640px;
}

/* Položky se nesmí rozdělit mezi sloupce */
.klasic .dropdown-menu > li {
  break-inside: avoid;
}


/* ----------------------------------------------------------
   2) VNOŘENÁ SUBMENU (level 3+) – vždy ZAVŘENÁ
   ---------------------------------------------------------- */

.klasic .dropdown-menu .dropdown-menu {
  top: -6px;
  left: 100%;
  margin: 0;
}


/* ----------------------------------------------------------
   3) NAV-LINK (top-level)
   ---------------------------------------------------------- */

.klasic .nav-link {
  font-family: var(--font-body, 'Source Sans 3', sans-serif);
  font-size: .85rem;
  font-weight: 500;
  color: var(--color-text, #3B3129)!important;
  padding: 8px 14px;
  border-radius: var(--radius-sm, 8px);
  transition: background .2s ease, color .2s ease;
  text-decoration: none;
  white-space: nowrap;
}

.klasic .nav-link:hover,
.klasic .nav-link:focus-visible {
  background: var(--c-forest-50, #EFF3EC);
  color: var(--c-forest-sage, #5C6B52);
}

.klasic .nav-item.active > .nav-link,
.klasic .nav-item.current > .nav-link {
  background: var(--c-forest-100, #2C3E2D);
  color: var(--c-surface, #FAF6F0);
}


/* ----------------------------------------------------------
   4) DROPDOWN-TOGGLE Å¡ipka
   ---------------------------------------------------------- */

.klasic .dropdown-toggle::after {
  display: inline-block;
  margin-left: .35em;
  vertical-align: .12em;
  content: '';
  border-top: .28em solid;
  border-right: .22em solid transparent;
  border-left: .22em solid transparent;
  transition: transform .2s ease;
}

.klasic .dropdown.show > .dropdown-toggle::after {
  transform: rotate(180deg);
}

/* Šipka vnořených: doprava */
.klasic .dropdown-menu .dropdown-toggle::after {
  border-top: .22em solid transparent;
  border-bottom: .22em solid transparent;
  border-left: .28em solid;
  border-right: 0;
  margin-left: auto;
}


/* ----------------------------------------------------------
   5) DROPDOWN-ITEM – kompaktní
   ---------------------------------------------------------- */

.klasic .dropdown-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 6px;
  padding: 4px 16px;
  font-size: .84rem;
  font-weight: 400;
  line-height: 1.4;
  color: var(--color-text, #3B3129);
  text-decoration: none;
  white-space: nowrap;
  transition: background .12s ease, color .12s ease;
}

.klasic .dropdown-item:hover,
.klasic .dropdown-item:focus-visible {
  background: var(--c-forest-50, #EFF3EC);
  color: var(--c-forest-sage, #5C6B52);
}

.klasic .dropdown-item.active,
.klasic .nav-item.active > .dropdown-item,
.klasic .nav-item.current > .dropdown-item {
  background: color-mix(in srgb, var(--c-forest-400, #2C3E2D) 12%, transparent);
  color: var(--c-forest-400, #2C3E2D);
  font-weight: 600;
}

/* Toggle uvnitř submenu */
.klasic .dropdown-menu .dropdown-toggle {
  padding: 4px 16px;
}


/* ----------------------------------------------------------
   6) SEPARATOR
   ---------------------------------------------------------- */

.klasic .dropdown-menu .nav-item.divider {
  height: 0;
  margin: 4px 16px;
  overflow: hidden;
  border-top: 1px solid var(--color-border-light, #F0EBE5);
}
.klasic .dropdown-menu .nav-item.divider > .separator {
  display: none;
}


/* ----------------------------------------------------------
   7) HEADING uvnitř submenu
   ---------------------------------------------------------- */

.klasic .dropdown-menu span.nav-link,
.klasic .dropdown-menu span.dropdown-item {
  font-size: .72rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 1.5px;
  color: var(--color-text-muted, #A69E94);
  padding: 10px 16px 2px;
  pointer-events: none;
  cursor: default;
}


/* ----------------------------------------------------------
   8) FOCUS ring
   ---------------------------------------------------------- */

.klasic .nav-link:focus-visible,
.klasic .dropdown-item:focus-visible,
.klasic .dropdown-menu .dropdown-toggle:focus-visible {
  outline: none;
  box-shadow: var(--focus-ring, 0 0 0 3px rgba(44, 62, 45, .2));
}


/* ==========================================================
   9) CLICK REŽIM (menu--click)
   Bootstrap data-bs-toggle → .show třída
   ========================================================== */

.klasic.menu--click .dropdown-menu {
  display: none;
}
.klasic.menu--click .dropdown-menu.show {
  display: block;
}


/* ==========================================================
   10) HOVER REŽIM (menu--hover)
   Čistě CSS. Žádný Bootstrap JS. Žádný data-bs-toggle.
   Skrytí: visibility + opacity + pointer-events.
   display MUSÍ být block (jinak nelze animovat).
   ========================================================== */

.klasic.menu--hover .dropdown-menu {
  display: block !important;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translateY(6px);
  transition:
    opacity .18s ease,
    transform .18s ease,
    visibility 0s linear .18s;
}

.klasic.menu--hover .dropdown-menu .dropdown-menu {
  transform: translateX(-6px) translateY(0);
}

/* 1. úroveň */
.klasic.menu--hover > li.dropdown:hover > .dropdown-menu,
.klasic.menu--hover > li.dropdown:focus-within > .dropdown-menu {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translateY(0);
  transition:
    opacity .18s ease,
    transform .18s ease,
    visibility 0s linear 0s;
}

/* 2.+ úroveň */
.klasic.menu--hover .dropdown-menu > li.dropdown:hover > .dropdown-menu,
.klasic.menu--hover .dropdown-menu > li.dropdown:focus-within > .dropdown-menu {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translateX(0) translateY(0);
  transition:
    opacity .18s ease,
    transform .18s ease,
    visibility 0s linear 0s;
}

/* Å ipky v hover stavu */
.klasic.menu--hover > li.dropdown:hover > .dropdown-toggle::after {
  transform: rotate(180deg);
}
.klasic.menu--hover .dropdown-menu > li.dropdown:hover > .dropdown-toggle::after {
  transform: translateX(3px);
}


/* ==========================================================
   BEZ SUFFIXU – fallback = click chování
   ========================================================== */

.klasic:not(.menu--hover):not(.menu--click) .dropdown-menu {
  display: none;
}
.klasic:not(.menu--hover):not(.menu--click) .dropdown-menu.show {
  display: block;
}


/* ==========================================================
   11) MOBILE – pod 992px
   ========================================================== */

@media (max-width: 991.98px) {
  .klasic {
    flex-direction: column;
    gap: 0;
  }

  .klasic .dropdown-menu,
  .klasic.menu--hover .dropdown-menu {
    position: static !important;
    display: none !important;
    box-shadow: none;
    border: none;
    border-radius: 0;
    padding-left: 1rem;
    background: transparent;
    min-width: 0;
    max-height: none;
    columns: 1 !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    transform: none !important;
    transition: none !important;
  }

  .klasic .dropdown-menu.show,
  .klasic.menu--hover .dropdown-menu.show {
    display: block !important;
  }

  .klasic .dropdown-menu .dropdown-menu {
    left: 0;
    top: 0;
    padding-left: 1rem;
  }

  .klasic .dropdown-toggle::after {
    margin-left: auto;
  }
}


/* ----------------------------------------------------------
   12) SCROLLBAR
   ---------------------------------------------------------- */

.klasic .dropdown-menu::-webkit-scrollbar {
  width: 4px;
}
.klasic .dropdown-menu::-webkit-scrollbar-track {
  background: transparent;
}
.klasic .dropdown-menu::-webkit-scrollbar-thumb {
  background: var(--color-border, #E2DCD4);
  border-radius: 4px;
}
.klasic .dropdown-menu::-webkit-scrollbar-thumb:hover {
  background: var(--color-text-muted, #A69E94);
}
/* ==========================================================
   ARTICLE INFO BLOCK – inline řada s čárkami
   Napsal ... , Kategorie: ... , 📅 Zveřejněno: ... ,
   📅 Aktualizováno: ... , 👁 Zobrazení: ... .
   Vkládej na konec user.css.
   ========================================================== */

/* Kontejner – inline, bez boxu, decentní meta text */
.article-info {
  display: block;
  margin: .35rem 0 1.25rem 0;
  padding: 0;
  background: none;
  border: none;
  border-radius: 0;
  font-size: .82rem;
  line-height: 1.5;
  color: var(--color-text-muted, #A69E94);
  font-family: var(--font-body, 'Source Sans 3', sans-serif);
}

/* Schová defaultní Joomla nadpis "Podrobnosti" / "Details" */
.article-info-term {
  display: none !important;
}

/* Položky do řady */
.article-info dd {
  display: inline;
  margin: 0;
  padding: 0;
  color: inherit;
}

/* Čárka jako oddělovač mezi položkami */
.article-info dd + dd::before {
  content: " , ";
  color: var(--color-text-muted, #A69E94);
  margin: 0 .15rem 0 0;
}

/* Ikony – decentní, v barvě textu */
.article-info dd .icon-user,
.article-info dd .icon-folder,
.article-info dd .icon-folder-open,
.article-info dd .icon-calendar,
.article-info dd .icon-calendar-alt,
.article-info dd .icon-eye,
.article-info dd .fa,
.article-info dd .fas,
.article-info dd .far {
  color: var(--color-text-muted, #A69E94);
  margin-right: .25rem;
  font-size: .9em;
}

/* Odkaz kategorie – ve firemní zelené */
.article-info dd a {
  color: var(--c-forest-sage, #5C6B52);
  text-decoration: none;
  transition: color .15s ease;
}
.article-info dd a:hover {
  color: var(--c-forest-400, #2C3E2D);
  text-decoration: underline;
  text-underline-offset: .2em;
}

/* Mobilní úprava – menší text */
@media (max-width: 575.98px) {
  .article-info {
    font-size: .78rem;
    line-height: 1.6;
  }
}
/* ============================================
   Navigace Předchozí / Další článek
   - zobrazit titulek článku místo "Předchozí/Následující"
   - zkrátit dlouhé titulky s "…"
   ============================================ */

/* 1) Zviditelnit titulek článku (je ve .visually-hidden spanu) */
.btn.previous .visually-hidden,
.btn.next .visually-hidden {
    position: static !important;
    width: auto !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    clip: auto !important;
    clip-path: none !important;
    white-space: nowrap !important;

    text-overflow: ellipsis;
    display: inline-block;
    max-width: 260px;
    vertical-align: middle;
}

/* 2) Skrýt původní text "Předchozí" / "Následující"
      (span s aria-hidden, který není ikonka) */
.btn.previous > span[aria-hidden="true"]:not([class*="icon-"]),
.btn.next > span[aria-hidden="true"]:not([class*="icon-"]) {
    display: none;
}

/* 3) Responzivní zkrácení na menších zařízeních */
@media (max-width: 991px) {
    .btn.previous .visually-hidden,
    .btn.next .visually-hidden {
        max-width: 180px;
    }
}

@media (max-width: 576px) {
    .btn.previous .visually-hidden,
    .btn.next .visually-hidden {
        max-width: 120px;
    }
}
/* ========================================================================
   Box "Účinky na zdraví" — plovoucí sidebar box v článku
   Styl: Varianta 1 (Botanická elegance)
   ======================================================================== */

/* Předpokládané CSS proměnné (pokud nejsou globálně, raději je tu vypsat):
   --sage-bg: #EFF3EC;
   --sage: #8B9D83;
   --sage-dark: #5C6B52;
   --sage-deeper: #3E5035;
   --forest: #2C3E2D;
   --forest-deep: #1A2B1C;
   --gold: #C8A96E;
   --bark: #4A3728;
   --border: #E2DCD4;
   --radius: 12px;
*/

.ucinky-box {
    float: right;
    width: 350px;
    margin: 8px 0 24px 28px;
    padding: 24px 26px;
    background: var(--sage-bg, #EFF3EC);
    border: 1px solid var(--border, #E2DCD4);
    border-left: 4px solid var(--sage-dark, #5C6B52);
    border-radius: 0 var(--radius, 12px) var(--radius, 12px) 0;
    box-shadow: 0 2px 12px rgba(60, 70, 50, 0.06);
    font-size: 0.95rem;
    line-height: 1.65;
    color: var(--bark, #4A3728);
}

.ucinky-box__title {
    margin: 0 0 14px 0;
    padding: 0 0 10px 0;
    font-family: 'Playfair Display', Georgia, serif;
    font-size: 1.25rem;
    font-weight: 700;
    color: var(--forest, #2C3E2D);
    letter-spacing: 0.2px;
    border-bottom: 1px solid var(--border, #E2DCD4);
}

.ucinky-box ul,
.ucinky-box ol {
    margin: 0;
    padding: 0;
    list-style: none;
}

.ucinky-box li {
    position: relative;
    padding: 4px 0 4px 18px;
    line-height: 1.55;
}

/* Dekorativní odrážka ve stylu nového webu */
.ucinky-box li::before {
    content: "›";
    position: absolute;
    left: 0;
    top: 3px;
    color: var(--gold, #C8A96E);
    font-weight: 700;
    font-size: 1.05rem;
}

.ucinky-box p {
    margin: 0 0 10px 0;
}

.ucinky-box p:last-child {
    margin-bottom: 0;
}

.ucinky-box strong,
.ucinky-box b {
    color: var(--forest, #2C3E2D);
    font-weight: 600;
}

.ucinky-box a {
    color: var(--sage-deeper, #3E5035);
    text-decoration: underline;
    text-decoration-color: var(--gold, #C8A96E);
    text-underline-offset: 2px;
    transition: color 0.2s;
}

.ucinky-box a:hover {
    color: var(--forest, #2C3E2D);
}

/* Mobil: box zabere celou šířku, žádný float */
@media (max-width: 767px) {
    .ucinky-box {
        float: none;
        width: 100%;
        margin: 16px 0 20px 0;
    }
}

/* Clearfix za článkem — aby patička nevlézala kolem plovoucího boxu */
.articleBody::after,
.com-content-article__body::after {
    content: "";
    display: table;
    clear: both;
}

/* Skryje původní .doplnektext zdroje kromě našeho boxu */
div.doplnektext:not(.ucinky-box) {
    display: none;
}
/* ==========================================================================
   MOBILE HAMBURGER MENU — Bylinky pro všechny (Varianta 1)
   ==========================================================================
   Používá tokeny z typography.css:
   --c-forest-400, --c-forest-deep, --c-forest-sage, --c-gold-200,
   --c-gold-100, --c-surface, --c-canvas, --c-cream-100, --c-forest-50,
   --c-cream-300, --color-text, --color-text-light,
   --radius-card, --shadow-lg

   HTML modul: mod_mobile_hamburger.php (bhg-mobile-hamburger)
   Aktivní breakpoint: < 992px (skryto na lg+)
   ========================================================================== */

/* ---------- KONTEJNER (fixed top) ---------- */
.bhg-mobile-hamburger {
    display: none; /* default: skryto, zobrazí se pouze na mobilu */
    font-family: var(--cassiopeia-font-family-body, 'Source Sans 3', sans-serif);
}

@media (max-width: 991.98px) {
    .bhg-mobile-hamburger {
        display: flex;
        align-items: center;
        justify-content: space-between;
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        padding: .75rem 1rem;
        background: color-mix(in srgb, var(--c-surface) 97%, transparent);
        backdrop-filter: blur(14px);
        -webkit-backdrop-filter: blur(14px);
        border-bottom: 1px solid var(--c-cream-300);
        z-index: 1000;
        min-height: 64px;
    }

    body.site { padding-top: 64px; }

    .bg-white .container.d-flex.align-items-center.text-forest-200 .navbar-brand.me-3 {
        display: none !important;
    }
    .bg-white .container.d-flex.align-items-center.text-forest-200 {
        height: 0;
    }

    /* Zobrazit vnitřní obal Joomla modulu uvnitř draweru */
    .bhg-drawer-nav .pos-menu {
        display: block !important;
    }
}

/* ---------- LOGO (mobilní header) ---------- */
.bhg-logo-mobile a {
    display: flex;
    align-items: center;
    gap: 10px;
    text-decoration: none;
    color: var(--c-forest-400);
}

.bhg-logo-img {
    width: 44px;
    height: 44px;
    flex: 0 0 44px;
    border-radius: 50%;
    object-fit: cover;
    object-position: left center;
    border: 2px solid var(--c-forest-200);
    background: var(--c-surface);
    display: block;
}

.bhg-logo-img--drawer {
    width: 52px;
    height: 52px;
    flex-basis: 52px;
    object-position: left center;
    border-color: color-mix(in srgb, var(--c-gold-100) 60%, transparent);
    background: color-mix(in srgb, var(--c-surface) 90%, transparent);
    box-shadow: 0 4px 16px color-mix(in srgb, var(--c-forest-deep) 25%, transparent);
}

.bhg-logo-text {
    font-family: var(--cassiopeia-font-family-headings, 'Playfair Display', Georgia, serif);
    font-size: 1.1rem;
    line-height: 1.1;
    font-weight: 700;
    color: var(--c-forest-400);
}
.bhg-logo-text em {
    font-style: italic;
    color: var(--c-forest-sage);
    font-weight: 400;
}
.bhg-logo-text small {
    display: block;
    font-family: var(--cassiopeia-font-family-body, 'Source Sans 3', sans-serif);
    font-size: .62rem;
    font-weight: 500;
    color: var(--color-text-light);
    letter-spacing: 1.6px;
    text-transform: uppercase;
    margin-top: 3px;
}

/* ---------- CHECKBOX (skrytý) ---------- */
.bhg-mobile-menu-checkbox {
    position: absolute;
    opacity: 0;
    pointer-events: none;
    width: 0;
    height: 0;
}

/* ---------- HAMBURGER TLAČÍTKO ---------- */
.bhg-mobile-menu-btn {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1.5px solid var(--c-cream-300);
    border-radius: 50%;
    background: var(--c-surface);
    cursor: pointer;
    transition: background .25s ease, border-color .25s ease, transform .25s ease;
    color: var(--c-forest-400);
    flex-shrink: 0;
}
.bhg-mobile-menu-btn:hover {
    background: var(--c-forest-50);
    border-color: var(--c-forest-300);
    transform: scale(1.05);
}

.bhg-burger {
    width: 18px;
    height: 14px;
    position: relative;
    display: block;
}
.bhg-burger span {
    position: absolute;
    left: 0;
    width: 100%;
    height: 2px;
    background: currentColor;
    border-radius: 2px;
    transition: transform .3s ease, opacity .3s ease, top .3s ease, bottom .3s ease;
}
.bhg-burger span:nth-child(1) { top: 0; }
.bhg-burger span:nth-child(2) { top: 50%; transform: translateY(-50%); }
.bhg-burger span:nth-child(3) { bottom: 0; }

.bhg-mobile-menu-checkbox:checked ~ .bhg-mobile-menu-btn .bhg-burger span:nth-child(1) {
    top: 50%;
    transform: translateY(-50%) rotate(45deg);
}
.bhg-mobile-menu-checkbox:checked ~ .bhg-mobile-menu-btn .bhg-burger span:nth-child(2) {
    opacity: 0;
}
.bhg-mobile-menu-checkbox:checked ~ .bhg-mobile-menu-btn .bhg-burger span:nth-child(3) {
    bottom: 50%;
    transform: translateY(50%) rotate(-45deg);
}

/* ---------- BACKDROP ---------- */
.bhg-mobile-menu-backdrop {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    background: color-mix(in srgb, var(--c-forest-deep) 55%, transparent);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    opacity: 0;
    visibility: hidden;
    transition: opacity .3s ease, visibility .3s ease;
    z-index: 1500;
    cursor: pointer;
}
.bhg-mobile-menu-checkbox:checked ~ .bhg-mobile-menu-backdrop {
    opacity: 1;
    visibility: visible;
}

/* ---------- DRAWER (obsah menu) ---------- */
.bhg-mobile-menu-content {
    position: fixed !important;
    top: 0 !important;
    right: 0 !important;
    left: auto !important;
    bottom: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    width: min(88vw, 380px);
    height: 100vh;
    height: 100dvh;
    background: var(--c-surface);
    box-shadow: var(--shadow-lg, 0 16px 48px rgba(44, 62, 45, .12));
    transform: translateX(100%);
    transition: transform .35s cubic-bezier(.4, 0, .2, 1);
    z-index: 1600;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}
.bhg-mobile-menu-checkbox:checked ~ .bhg-mobile-menu-content {
    transform: translateX(0);
}

/* ---------- DRAWER HEADER ---------- */
.bhg-mobile-menu-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1.125rem 1.25rem;
    background: linear-gradient(
        135deg,
        var(--c-forest-deep),
        var(--c-forest-400) 60%,
        var(--c-forest-sage)
    );
    color: var(--c-surface);
    flex-shrink: 0;
    position: relative;
    overflow: hidden;
}
.bhg-mobile-menu-header::before {
    content: '';
    position: absolute;
    inset: 0;
    background: radial-gradient(
        circle at 85% 20%,
        color-mix(in srgb, var(--c-gold-200) 15%, transparent),
        transparent 55%
    );
    pointer-events: none;
}

.bhg-drawer-brand {
    display: flex;
    align-items: center;
    gap: 12px;
    position: relative;
}

.bhg-drawer-title {
    font-family: var(--cassiopeia-font-family-headings, 'Playfair Display', Georgia, serif);
    font-size: 1.1rem;
    line-height: 1.15;
    font-weight: 700;
    color: var(--c-surface);
}
.bhg-drawer-title em {
    font-style: italic;
    color: var(--c-gold-100);
    font-weight: 400;
}
.bhg-drawer-title small {
    display: block;
    font-family: var(--cassiopeia-font-family-body, 'Source Sans 3', sans-serif);
    font-size: .6rem;
    font-weight: 500;
    color: color-mix(in srgb, var(--c-surface) 70%, transparent);
    letter-spacing: 1.8px;
    text-transform: uppercase;
    margin-top: 4px;
}

.bhg-mobile-hamburger .bhg-mobile-menu-close {
    width: 38px;
    height: 38px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: color-mix(in srgb, var(--c-surface) 10%, transparent);
    border: 1px solid color-mix(in srgb, var(--c-surface) 18%, transparent);
    color: var(--c-surface);
    cursor: pointer;
    transition: background .2s ease, transform .2s ease;
    position: relative;
    flex-shrink: 0;
}
.bhg-mobile-hamburger .bhg-mobile-menu-close:hover {
    background: color-mix(in srgb, var(--c-surface) 20%, transparent);
    transform: rotate(90deg);
}

/* ---------- SEARCH BAR ---------- */
.bhg-drawer-search {
    padding: 1rem 1.25rem;
    background: var(--c-cream-100);
    border-bottom: 1px solid var(--c-cream-300);
    flex-shrink: 0;
}
.bhg-drawer-search form {
    display: flex;
    align-items: center;
    gap: 10px;
    background: var(--c-surface);
    border: 1px solid var(--c-cream-300);
    border-radius: var(--radius-card, 12px);
    padding: 10px 14px;
    transition: border-color .2s ease, box-shadow .2s ease;
}
.bhg-drawer-search form:focus-within {
    border-color: var(--c-forest-300);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--c-forest-300) 15%, transparent);
}
.bhg-drawer-search svg {
    color: var(--color-text-light);
    flex-shrink: 0;
}
.bhg-drawer-search input {
    border: none;
    outline: none;
    background: transparent;
    font-family: inherit;
    font-size: .9rem;
    color: var(--color-text);
    width: 100%;
}
.bhg-drawer-search input::placeholder {
    color: var(--color-text-light);
}

/* ---------- DRAWER NAV (Joomla menu wrapper) ---------- */
.bhg-drawer-nav {
    flex: 1;
    overflow-y: auto;
    overflow-x: hidden;
    padding: .5rem 0 1rem;
    -webkit-overflow-scrolling: touch;
}

.bhg-drawer-nav::-webkit-scrollbar {
    width: 6px;
}
.bhg-drawer-nav::-webkit-scrollbar-track {
    background: transparent;
}
.bhg-drawer-nav::-webkit-scrollbar-thumb {
    background: var(--c-forest-200);
    border-radius: 3px;
}

/* ==========================================================================
   OVERRIDE KONFLIKTNÍCH .klasic / .dropdown-menu STYLŮ UVNITŘ DRAWERU
   -------------------------------------------------------------------------
   Globální user.css má pro desktop .klasic .dropdown-menu pravidla jako:
       position: absolute; left: -222px; opacity: 0; visibility: hidden;
       display: block; transform: translateY(8px);
   Uvnitř draweru to musíme resetovat, jinak submenu nikdy nerozbalíme.
   ========================================================================== */

.bhg-drawer-nav .klasic,
.bhg-drawer-nav .mod-menu,
.bhg-drawer-nav .nav,
.bhg-drawer-nav ul,
.bhg-drawer-nav li,
.bhg-drawer-nav .dropdown,
.bhg-drawer-nav .dropdown-menu {
    position: static !important;
    left: auto !important;
    right: auto !important;
    top: auto !important;
    transform: none !important;
    float: none !important;
    min-width: 0 !important;
}

/* .dropdown-menu musí být viditelný (display/opacity/visibility),
   schovávat ho budeme přes max-height */
.bhg-drawer-nav .dropdown-menu,
.bhg-drawer-nav .klasic .dropdown-menu,
.bhg-drawer-nav .klasic.menu--hover .dropdown-menu,
.bhg-drawer-nav .klasic.menu--click .dropdown-menu,
.bhg-drawer-nav .klasic .dropdown-menu .dropdown-menu {
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    display: block !important;
    border: none !important;
    box-shadow: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

/* Schovat desktop tečku (.::after) uvnitř draweru */
.bhg-drawer-nav ul.mod-menu.magazin > li.active > a::after,
.bhg-drawer-nav .topbar.topmenu .nav-item.active::after,
.bhg-drawer-nav .dropdown-toggle::after {
    display: none !important;
}

/* ---------- JOOMLA MENU UVNITŘ DRAWERU ---------- */
.bhg-drawer-nav ul,
.bhg-drawer-nav .mod-menu,
.bhg-drawer-nav .nav {
    list-style: none;
    padding: 0;
    margin: 0;
}

.bhg-drawer-nav li {
    position: relative !important;
    border-bottom: 1px solid color-mix(in srgb, var(--c-cream-300) 50%, transparent);
    padding: 0;
    display: block;
}
.bhg-drawer-nav > div > ul > li:last-child,
.bhg-drawer-nav > ul > li:last-child,
.bhg-drawer-nav .mod-menu > li:last-child,
.bhg-drawer-nav .nav > li:last-child {
    border-bottom: none;
}

/* Úroveň 1 — hlavní položky (a + span .nav-link) */
.bhg-drawer-nav a,
.bhg-drawer-nav span.nav-link,
.bhg-drawer-nav .nav-header,
.bhg-drawer-nav .separator {
    display: flex !important;
    align-items: center;
    padding: 14px 1.25rem;
    font-family: var(--cassiopeia-font-family-headings, 'Playfair Display', Georgia, serif);
    font-size: 1.02rem;
    font-weight: 600;
    color: var(--c-forest-400) !important;
    text-decoration: none;
    transition: background .2s ease, color .2s ease, padding-left .2s ease;
    line-height: 1.3;
    background: transparent;
    cursor: pointer;
    text-transform: none !important;
}
.bhg-drawer-nav a:hover,
.bhg-drawer-nav a:focus,
.bhg-drawer-nav span.nav-link:hover {
    background: var(--c-forest-50);
    color: var(--c-forest-sage) !important;
    padding-left: 1.5rem;
    text-decoration: none;
}

/* Aktivní položka — zlatý levý proužek */
.bhg-drawer-nav li.current > a,
.bhg-drawer-nav li.active > a,
.bhg-drawer-nav li.current-item > a {
    background: var(--c-forest-50);
    color: var(--c-forest-deep) !important;
    font-weight: 700;
    border-left: 3px solid var(--c-gold-200);
    padding-left: calc(1.25rem - 3px);
}

/* ---------- Rodičovská položka + chevron ---------- */
.bhg-drawer-nav li.bhg-has-sub {
    display: block;
    position: relative !important;
}
.bhg-drawer-nav li.bhg-has-sub > a,
.bhg-drawer-nav li.bhg-has-sub > span.nav-link {
    padding-right: 52px !important;
}

.bhg-submenu-toggle {
    position: absolute !important;
    top: 50% !important;
    right: 10px !important;
    transform: translateY(-50%) !important;
    width: 32px;
    height: 32px;
    display: flex !important;
    align-items: center;
    justify-content: center;
    background: transparent;
    border: 1px solid color-mix(in srgb, var(--c-cream-300) 80%, transparent);
    border-radius: 50%;
    color: var(--c-forest-sage);
    cursor: pointer;
    transition: background .2s ease, color .2s ease, border-color .2s ease;
    padding: 0;
    z-index: 2;
}
.bhg-submenu-toggle:hover,
.bhg-submenu-toggle:focus {
    background: var(--c-surface);
    color: var(--c-forest-400);
    border-color: var(--c-forest-300);
    outline: none;
}
.bhg-submenu-toggle svg {
    width: 14px;
    height: 14px;
    transition: transform .3s ease;
}
.bhg-has-sub.bhg-open > .bhg-submenu-toggle svg {
    transform: rotate(180deg);
}
.bhg-has-sub.bhg-open > .bhg-submenu-toggle {
    background: var(--c-surface);
    color: var(--c-forest-400);
    border-color: var(--c-forest-300);
}

/* Chevron pro podúrovně (ještě menší) */
.bhg-drawer-nav ul ul .bhg-submenu-toggle {
    width: 28px;
    height: 28px;
    right: 8px !important;
}
.bhg-drawer-nav ul ul .bhg-submenu-toggle svg {
    width: 12px;
    height: 12px;
}

/* ---------- Úroveň 2 — podmenu (collapsible přes max-height) ---------- */
.bhg-drawer-nav ul ul,
.bhg-drawer-nav .dropdown-menu {
    background: var(--c-cream-100) !important;
    border-top: 1px solid var(--c-cream-300);
    max-height: 0;
    overflow: hidden;
    transition: max-height .4s ease;
}

/* ROZBALENÉ */
.bhg-drawer-nav li.bhg-open > ul,
.bhg-drawer-nav li.bhg-open > .dropdown-menu {
    max-height: 3000px;
}

.bhg-drawer-nav ul ul li {
    border-bottom: 1px solid color-mix(in srgb, var(--c-cream-300) 40%, transparent);
}
.bhg-drawer-nav ul ul li:last-child {
    border-bottom: none;
}

.bhg-drawer-nav ul ul a,
.bhg-drawer-nav ul ul .dropdown-item {
    padding: 11px 1.25rem 11px 2.5rem !important;
    font-family: var(--cassiopeia-font-family-body, 'Source Sans 3', sans-serif);
    font-size: .92rem;
    font-weight: 500;
    color: var(--color-text) !important;
    position: relative;
    white-space: normal;
    text-transform: none !important;
}
.bhg-drawer-nav ul ul a::before {
    content: '';
    position: absolute;
    left: 1.75rem;
    top: 50%;
    transform: translateY(-50%);
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: var(--c-forest-200);
    transition: background .2s ease;
}
.bhg-drawer-nav ul ul a:hover {
    background: var(--c-forest-50);
    color: var(--c-forest-400) !important;
    padding-left: 2.75rem !important;
}
.bhg-drawer-nav ul ul a:hover::before {
    background: var(--c-gold-200);
}

.bhg-drawer-nav ul ul li.bhg-has-sub > a {
    padding-right: 44px !important;
}

/* ---------- Úroveň 3 ---------- */
.bhg-drawer-nav ul ul ul {
    background: color-mix(in srgb, var(--c-forest-50) 70%, transparent) !important;
}
.bhg-drawer-nav ul ul ul a {
    padding: 9px 1.25rem 9px 3.5rem !important;
    font-size: .87rem;
    font-weight: 400;
    color: var(--color-text-light) !important;
}
.bhg-drawer-nav ul ul ul a::before {
    left: 2.75rem;
    width: 3px;
    height: 3px;
}

/* ---------- DRAWER FOOTER ---------- */
.bhg-drawer-footer {
    padding: 1.25rem;
    border-top: 1px solid var(--c-cream-300);
    background: var(--c-cream-100);
    flex-shrink: 0;
}
.bhg-drawer-note {
    text-align: center;
    font-size: .78rem;
    color: var(--color-text-light);
    margin: 0;
    letter-spacing: .3px;
    line-height: 1.5;
}
.bhg-drawer-note strong {
    color: var(--c-forest-400);
    font-weight: 600;
    font-family: var(--cassiopeia-font-family-headings, 'Playfair Display', Georgia, serif);
}

/* ---------- BLOKACE SCROLL PŘI OTEVŘENÉM MENU ---------- */
html:has(.bhg-mobile-menu-checkbox:checked) {
    overflow: hidden;
}

/* ---------- STAGGER ANIMACE POLOŽEK ---------- */
@keyframes bhgSlideIn {
    from { opacity: 0; transform: translateX(30px); }
    to   { opacity: 1; transform: translateX(0); }
}

.bhg-mobile-menu-checkbox:checked ~ .bhg-mobile-menu-content .bhg-drawer-nav .mod-menu > li {
    animation: bhgSlideIn .4s ease both;
}
.bhg-mobile-menu-checkbox:checked ~ .bhg-mobile-menu-content .bhg-drawer-nav .mod-menu > li:nth-child(1) { animation-delay: .05s; }
.bhg-mobile-menu-checkbox:checked ~ .bhg-mobile-menu-content .bhg-drawer-nav .mod-menu > li:nth-child(2) { animation-delay: .1s; }
.bhg-mobile-menu-checkbox:checked ~ .bhg-mobile-menu-content .bhg-drawer-nav .mod-menu > li:nth-child(3) { animation-delay: .15s; }
.bhg-mobile-menu-checkbox:checked ~ .bhg-mobile-menu-content .bhg-drawer-nav .mod-menu > li:nth-child(4) { animation-delay: .2s; }
.bhg-mobile-menu-checkbox:checked ~ .bhg-mobile-menu-content .bhg-drawer-nav .mod-menu > li:nth-child(5) { animation-delay: .25s; }
.bhg-mobile-menu-checkbox:checked ~ .bhg-mobile-menu-content .bhg-drawer-nav .mod-menu > li:nth-child(n+6) { animation-delay: .3s; }

/* ========================================================================
   KONEC MOBILE HAMBURGER
   ======================================================================== */
   /* =============================================================================
   bylinkyprovsechny.cz | Å¡ablona n_bln
   Doplnit do: templates/n_bln/css/user.css (na konec souboru)

   ŘEŠÍ:
   Hero kategorie — split layout (banner vlevo + nadpis/popis vpravo)

   POZNÁMKA: Modul mod_encycategories už má responzivní CSS přímo v sobě
   (od verze 1.7.6) — není třeba ho zde duplikovat.
   ============================================================================= */


/* =============================================================================
   HERO KATEGORIE — SPLIT LAYOUT

   Levá strana (50%): banner kategorie 1200×800 (s textem - vidíme ho celý
   v poměru 3:2). Pravá strana (50%): nadpis kategorie, popis, meta data.

   Mobil: stack pod sebou.

   Třída .bylinky-page-hero--split je modifikátor, takže nepřepisuje původní
   .bylinky-page-hero a starý layout zůstává funkční pro jiná místa.
   ============================================================================= */

.bylinky-page-hero--split {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 32px;
  align-items: center;
  margin: 0 0 48px;
  padding: 32px 0;
  /* zruší fullwidth overlay efekt z původního stylu */
  background: transparent;
  position: relative;
  min-height: auto;
}

/* Reset všech overlay/absolute pozicování ze starého .bylinky-page-hero */
.bylinky-page-hero--split::before,
.bylinky-page-hero--split::after {
  display: none;
}

.bylinky-page-hero--split > .bylinky-page-hero__banner {
  position: relative;
  aspect-ratio: 3 / 2;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 8px 24px rgba(44, 62, 45, 0.08);
  margin: 0;
}

.bylinky-page-hero--split .bylinky-page-hero__banner img {
  position: static;
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  /* zrušení starých filtrů z bg-overlay */
  filter: none;
  opacity: 1;
}

.bylinky-page-hero--split .bylinky-page-hero__inner {
  position: static;
  display: flex;
  flex-direction: column;
  gap: 16px;
  padding: 0;
  text-align: left;
  color: #2d2a23;
  max-width: none;
  background: transparent;
}

.bylinky-page-hero--split .bylinky-page-hero__eyebrow {
  font-size: 0.8rem;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: #c4a04a;
  font-weight: 500;
}

.bylinky-page-hero--split .bylinky-page-hero__title {
  font-family: 'Playfair Display', Georgia, serif;
  font-size: clamp(1.8rem, 3.5vw, 2.8rem);
  color: #3d4f2c;
  line-height: 1.15;
  margin: 0;
  /* zrušení textových efektů (text-shadow apod.) z původního stylu */
  text-shadow: none;
}

.bylinky-page-hero--split .bylinky-page-hero__lead {
  font-size: 1.05rem;
  color: #2d2a23;
  line-height: 1.6;
  max-width: 540px;
  margin: 0;
}

.bylinky-page-hero--split .bylinky-page-hero__lead p {
  margin: 0 0 8px;
}

.bylinky-page-hero--split .bylinky-page-hero__lead p:last-child {
  margin-bottom: 0;
}

.bylinky-page-hero--split .bylinky-page-hero__meta {
  display: flex;
  gap: 24px;
  margin-top: 8px;
  padding-top: 16px;
  border-top: 1px solid #d8d0bd;
  font-size: 0.9rem;
  color: #6b6657;
  flex-wrap: wrap;
}

.bylinky-page-hero--split .bylinky-page-hero__meta-item {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.bylinky-page-hero--split .bylinky-page-hero__meta-item strong {
  color: #3d4f2c;
  font-weight: 600;
  font-size: 1.4rem;
  font-family: 'Playfair Display', Georgia, serif;
  line-height: 1;
}

.bylinky-page-hero--split .bylinky-page-hero__meta-item span {
  font-size: 0.85rem;
}

/* === Tablet: 60/40 ve prospěch obsahu === */
@media (max-width: 1024px) {
  .bylinky-page-hero--split {
    grid-template-columns: 5fr 6fr;
    gap: 24px;
  }
}

/* === Mobil: stack pod sebou === */
@media (max-width: 768px) {
  .bylinky-page-hero--split {
    grid-template-columns: 1fr;
    gap: 20px;
    padding: 16px 0;
    margin-bottom: 32px;
  }
  .bylinky-page-hero--split > .bylinky-page-hero__banner {
    max-height: 320px;
  }
  .bylinky-page-hero--split .bylinky-page-hero__title {
    font-size: 1.7rem;
  }
  .bylinky-page-hero--split .bylinky-page-hero__meta {
    gap: 16px;
  }
}
/* ============================================================
   COM_WEBLINKS — minimální CSS (zbytek řeší BS5 utility + typo-*)
   Doplnit do: templates/site/cassiopeia_bln/css/user.css
   ============================================================ */

/* Clearfix pro karty s plovoucími obrázky v popisu */
.com-weblinks-category .list-title::after {
    content: "";
    display: block;
    clear: both;
}

/* Hover na nadpis odkazu – decentní zlaté podtržení */
.com-weblinks-category a.category:hover,
.com-weblinks-category a.category:focus {
    color: var(--c-forest-sage) !important;
    text-decoration: underline;
    text-decoration-color: var(--c-gold-200);
    text-underline-offset: 3px;
}

/* Hover na celou kartu – jemný stín */
.com-weblinks-category .list-title {
    transition: box-shadow 0.2s ease, border-color 0.2s ease;
}

.com-weblinks-category .list-title:hover {
    border-color: var(--c-forest-300) !important;
    box-shadow: 0 4px 16px rgba(44, 62, 45, 0.06);
}
 /* =========================================================================
   JEvents — vizuální skin pro template cassiopeia_bln (Botanická elegance)
   v4 — přidána sekce pro detail události
   =========================================================================
   Vlož na konec souboru:
   /media/templates/site/cassiopeia_bln/css/user.css
   ========================================================================= */

/* ── Lokální tokeny pro JEvents ───────────────────────────────────────── */
#jevents {
    --jev-accent:        var(--template-special-color, #2C3E2D);
    --jev-accent-hover:  #3d5440;
    --jev-bg:            var(--template-bg-light, #FAF6F0);
    --jev-bg-soft:       #F1ECE3;
    --jev-text:          var(--template-text-dark, #3B3129);
    --jev-text-muted:    #7a6f64;
    --jev-border:        #ece6d8;
    --jev-gold:          #B89968;
    --jev-radius:        8px;
    --jev-radius-sm:     4px;

    font-family: var(--font-body);
    color: var(--jev-text);
}

/* ══════════════════════════════════════════════════════════════════════
   PŘEBITÍ ČERVENÉ "#ff3b30" Z PŮVODNÍHO events_css.css
   ══════════════════════════════════════════════════════════════════════ */

#jevents_body .nav-items > div:first-child,
#jevents_body .nav-items > div:last-child,
#jevents_body .nav-items > div,
#jevents_body .nav-items > div a,
body #jevents_body .nav-items > div a:hover,
body #jevents_body .nav-items div.active a,
body #jevents_body .nav-items div.active a:hover {
    border-color: var(--jev-border);
}

body #jevents_body .nav-items div.active a,
body .jev_header2 .active a {
    background-color: var(--jev-accent);
    color: #fff;
}
body #jevents_body .nav-items div.active a:hover,
body .jev_header2 .active a:hover {
    background-color: var(--jev-accent-hover);
    color: #fff;
}

#jevents_body .nav-items > div {
    border: 0;
    border-radius: 0;
}
#jevents_body .nav-items > div:first-child {
    border-radius: var(--jev-radius-sm) 0 0 var(--jev-radius-sm);
}
#jevents_body .nav-items > div:last-child {
    border-radius: 0 var(--jev-radius-sm) var(--jev-radius-sm) 0;
}
#jevents_body .nav-items > div a {
    color: var(--jev-text);
    transition: background .15s, color .15s;
}
#jevents_body .nav-items > div a:hover {
    background-color: var(--jev-bg-soft);
    border-left-color: transparent;
    color: var(--jev-accent);
}

.jev_toprow div.previousmonth,
.jev_toprow div.nextmonth {
    background-color: transparent;
    border-color: var(--jev-border);
}
.jev_toprow div.currentmonth {
    border-top-color: var(--jev-border);
    border-bottom-color: var(--jev-border);
}
#jevents_body .jev_toprow div.previousmonth a,
#jevents_body .jev_toprow div.nextmonth a {
    color: var(--jev-text);
}
#jevents_body .jev_toprow div.previousmonth a:hover,
#jevents_body .jev_toprow div.nextmonth a:hover {
    color: var(--jev-accent);
}

#jevents_body .jev_toprow,
#jevents .jev_toprow {
    background: var(--jev-bg-soft);
    border-radius: var(--jev-radius);
    overflow: hidden;
    margin: 1rem 0;
}

#jevents_body .cal_daysoutofmonth {
    background-color: var(--jev-bg);
    color: var(--jev-text-muted);
}
#jevents_body .cal_today {
    background: linear-gradient(135deg, #fff 0%, #fff 70%, #fdf6e8 100%);
}
#jevents #nav-search img {
    filter: invert(35%) sepia(8%) saturate(800%) hue-rotate(70deg) brightness(85%);
    height: 14px;
}

/* ══════════════════════════════════════════════════════════════════════
   HEADER kalendáře (#jevents_header)
   ══════════════════════════════════════════════════════════════════════ */

#jevents .contentheading {
    font-family: var(--font-head);
    font-weight: 500;
    color: var(--jev-text);
    margin: 0 0 1.5rem;
    font-size: 2rem;
}
#jevents .actions {
    list-style: none;
    padding: 0;
    margin: 0 0 1rem;
    display: flex;
    gap: .5rem;
    justify-content: flex-end;
}
#jevents .actions a {
    color: var(--jev-text-muted);
    text-decoration: none;
}
#jevents .actions a:hover { color: var(--jev-accent); }

#jevents .month_date {
    display: flex;
    align-items: baseline;
    gap: .35rem;
    font-family: var(--font-head);
    font-size: 24px;
    font-weight: 500;
    color: var(--jev-text);
    margin-bottom: 0rem;
    margin-top:1rem;
    padding: 0 .25rem;
}
#jevents .month_date .month_title_year {
    color: var(--jev-text-muted);
    font-weight: 300;
    font-size: 1.5rem;
}

/* ══════════════════════════════════════════════════════════════════════
   NOVÉ TŘÍDY z PHP overridu (jev-*) — KALENDÁŘ
   ══════════════════════════════════════════════════════════════════════ */

#jevents .jev-monthnav {
    background: var(--jev-bg-soft);
    border: 1px solid var(--jev-border);
}
#jevents .jev-monthnav__current {
    font-family: var(--font-head);
    font-weight: 500;
    font-size: 1.1rem;
}
#jevents .jev-monthnav__link {
    color: var(--jev-text);
    text-decoration: none;
    font-weight: 500;
    padding: .25rem .5rem;
    border-radius: var(--jev-radius-sm);
    transition: background .15s, color .15s;
    display: inline-flex;
    align-items: center;
    gap: .35rem;
}
#jevents .jev-monthnav__link:hover {
    background: #fff;
    color: var(--jev-accent);
}

#jevents .jev-calendar {
    table-layout: fixed;
    border: 1px solid var(--jev-border);
    border-radius: var(--jev-radius);
    overflow: hidden;
    background: #fff;
    margin: 0;
}
#jevents .jev-calendar thead th {
    background: var(--jev-bg-soft);
    font-size: .75rem;
    font-weight: 600;
    letter-spacing: .05em;
    color: var(--jev-text-muted);
    border-bottom: 1px solid var(--jev-border);
    padding: .5rem;
}
#jevents .jev-day {
    vertical-align: top;
    padding: .35rem;
    border: 1px solid var(--jev-border);
    background: #fff;
    height: 110px;
    width: calc(100% / 7);
}
#jevents .jev-day--out {
    background: var(--jev-bg);
    color: var(--jev-text-muted);
}
#jevents .jev-day--out .jev-day__num {
    color: #b8aea0;
    font-size: .8rem;
}
#jevents .jev-day__link {
    display: inline-block;
    color: var(--jev-text);
    text-decoration: none;
    font-weight: 500;
    font-size: .9rem;
    border-radius: 50%;
    min-width: 1.65rem;
    height: 1.65rem;
    line-height: 1.65rem;
    text-align: center;
    transition: background .15s, color .15s;
}
#jevents .jev-day__link:hover {
    background: var(--jev-bg-soft);
    color: var(--jev-accent);
}
#jevents .jev-day--today {
    background: linear-gradient(135deg, #fff 0%, #fff 70%, #fdf6e8 100%);
}
#jevents .jev-day--today .jev-day__link {
    background: var(--jev-gold);
    color: #fff;
    font-weight: 600;
}

#jevents .jev-day__events {
    margin-top: .35rem;
    display: flex;
    flex-direction: column;
    gap: .2rem;
}
#jevents .jev-event__inner {
    background: #fff;
    border-left: 3px solid var(--jev-cat, var(--jev-accent));
    border-bottom: 1px solid var(--jev-border);
    padding: .25rem .4rem;
    border-radius: 0 var(--jev-radius-sm) var(--jev-radius-sm) 0;
    font-size: .78rem;
    line-height: 1.3;
    transition: background .15s, transform .15s;
}
#jevents .jev-event__inner:hover {
    background: var(--jev-bg-soft);
    transform: translateX(2px);
}
#jevents .jev-event__link {
    color: var(--jev-text);
    text-decoration: none;
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
#jevents .jev-event__link:hover {
    color: var(--jev-accent);
}
#jevents .jev-event__time {
    font-weight: 600;
    color: var(--jev-accent);
    font-size: .72rem;
    margin-right: .25rem;
}
#jevents .jev-event__dot {
    display: inline-block;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--jev-cat, var(--jev-accent));
}

#jevents .jev-legend {
    padding-top: 1rem;
    border-top: 1px solid var(--jev-border);
    margin-top: 1rem;
}
#jevents .jev-legend__chip {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    padding: .35rem .85rem;
    background: #fff;
    border: 1px solid var(--jev-border);
    border-radius: 999px;
    font-size: .8rem;
    color: var(--jev-text);
    text-decoration: none;
    transition: background .15s, border-color .15s, transform .15s;
}
#jevents .jev-legend__chip:hover {
    background: var(--jev-bg-soft);
    border-color: var(--jev-cat, var(--jev-accent));
    transform: translateY(-1px);
}
#jevents .jev-legend__chip--active {
    background: var(--jev-bg-soft);
    border-color: var(--jev-cat, var(--jev-accent));
}
#jevents .jev-legend__chip--all {
    color: var(--jev-text-muted);
}
#jevents .jev-legend__chip--all .jev-legend__dot {
    background: linear-gradient(45deg, #c8c8c8, #909090);
}
#jevents .jev-legend__dot {
    display: inline-block;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: var(--jev-cat, var(--jev-accent));
    flex-shrink: 0;
}

/* ══════════════════════════════════════════════════════════════════════
   DETAIL UDÁLOSTI (icalevent.detail_body)
   ══════════════════════════════════════════════════════════════════════ */

/* Hlavní kontejner detailu */
#jevents_body .jev_evdt {
    padding: 0;
}

/* Hlavička s repeat navigací + datum + hits */
.jev_evdt .jev_evdt_header {
    background: var(--jev-bg-soft);
    border: 1px solid var(--jev-border);
    border-radius: var(--jev-radius);
    padding: .75rem 1rem;
    margin-bottom: 1.25rem;
    width: 100%;
    max-width: 100%;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 1rem;
}

/* Název události — h2 nadpis */
.jev_evdt .jev_evdt_title,
#jevents_body .jev_evdt h2,
#jevents_body .jev_evdt .jev_evdt_title {
    font-family: var(--font-head);
    font-size: 1.85rem;
    font-weight: 500;
    color: var(--jev-text);
    line-height: 1.25;
    padding-bottom: 0;
    margin: 0 0 1rem 0;
}

/* Předchozí/následující opakování */
.jev_evdt .jev_evdt_summary .ev_prevrepeat,
.jev_evdt .jev_evdt_summary .ev_nextrepeat,
.jev_evdt .ev_prevrepeat,
.jev_evdt .ev_nextrepeat {
    display: inline-flex;
    align-items: center;
    margin-right: .5rem;
}
.jev_evdt .ev_prevrepeat a,
.jev_evdt .ev_nextrepeat a {
    color: var(--jev-text-muted);
    text-decoration: none;
    font-size: .85rem;
    padding: .25rem .65rem;
    border-radius: var(--jev-radius-sm);
    transition: background .15s, color .15s;
    display: inline-flex;
    align-items: center;
    gap: .25rem;
}
.jev_evdt .ev_prevrepeat a:hover,
.jev_evdt .ev_nextrepeat a:hover {
    background: #fff;
    color: var(--jev-accent);
}
.jev_evdt .ev_prevrepeat a::before {
    content: "← ";
    color: var(--jev-text-muted);
}
.jev_evdt .ev_nextrepeat a::after {
    content: " →";
    color: var(--jev-text-muted);
}

/* Datum události uprostřed hlavičky */
.jev_evdt .jev_evdt_summary {
    width: auto;
    display: inline-flex;
    flex: 1;
    align-items: center;
    flex-wrap: wrap;
    gap: .35rem;
}
.jev_evdt_summary > span,
.jev_evdt_summary > div:not(.ev_prevrepeat):not(.ev_nextrepeat) {
    font-weight: 500;
    color: var(--jev-text);
}

/* Počet zobrazení (Shlédnutí : 96990) */
.jev_evdt .jev_evdt_hits {
    width: auto;
    display: inline-block;
    text-align: right;
    font-size: .85rem;
    color: var(--jev-text-muted);
    margin-left: auto;
}
.jev_evdt .jev_evdt_hits .hitslabel,
.jev_evdt span.hitslabel {
    font-weight: 600;
    color: var(--jev-text-muted);
}

/* Autor / Kontakt ("od MUDr. Zbyněk Mlčoch") */
.jev_evdt .jev_evdt_creator,
.jev_evdt .jev_evdt_contact {
    display: inline-flex;
    align-items: center;
    margin-right: 1.5rem;
    font-size: .9rem;
    color: var(--jev-text-muted);
}
.jev_evdt span.creator,
.jev_evdt span.contact {
    font-weight: 600;
    color: var(--jev-text-muted);
    margin-right: .35rem;
    text-transform: lowercase;
}
.jev_evdt .jev_evdt_creator a,
.jev_evdt .jev_evdt_contact a {
    color: var(--jev-accent);
    text-decoration: none;
    font-weight: 500;
}
.jev_evdt .jev_evdt_creator a:hover,
.jev_evdt .jev_evdt_contact a:hover {
    color: var(--jev-accent-hover);
    text-decoration: underline;
}

/* Sekce autora — oddělit jemnou linkou pod */
.jev_evdt .jev_evdt_creator {
    margin-bottom: 1rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid var(--jev-border);
    width: 100%;
}

/* Tělo detailu */
.jev_evdt .jev_eventdetails_body > div {
    padding-bottom: 1rem;
    vertical-align: top;
}
.jev_evdt .jev_eventdetails_body p {
    line-height: 1.65;
    margin-bottom: .85rem;
}

/* Custom fields - oddělovače */
.jev_evdt .jev_eventdetails_body > div:not(:last-child) {
    border-bottom: 1px dashed var(--jev-border);
    padding-bottom: .85rem;
}

/* Ikony sdílení (export do Google, Outlook) */
.jev_evdt .jev_evdt_icons {
    float: right;
    height: auto;
    margin-top: 0;
}
.jev_evdt .jev_evdt_icons a {
    display: inline-block;
    margin-left: .35rem;
}
.jev_evdt .jev_evdt_icons img {
    height: 22px;
    vertical-align: top;
    opacity: .65;
    transition: opacity .15s;
}
.jev_evdt .jev_evdt_icons a:hover img {
    opacity: 1;
}

/* Dlouhé URL — zalamovat ať nepřetékají */
.jev_evdt a {
    word-break: break-word;
    overflow-wrap: break-word;
}

/* Tabulky uvnitř detailu */
.jev_evdt table {
    width: 100%;
    margin: .5rem 0;
}
.jev_evdt table td {
    padding: .35rem .5rem;
    vertical-align: top;
}
.jev_evdt table td:first-child {
    color: var(--jev-text-muted);
    font-weight: 600;
    width: auto;
    white-space: nowrap;
    padding-right: 1rem;
}

/* Místo / lokace */
.jev_evdt_location {
    display: flex;
    align-items: flex-start;
    gap: .5rem;
    padding: .65rem .85rem;
    background: var(--jev-bg);
    border-left: 3px solid var(--jev-gold);
    border-radius: 0 var(--jev-radius-sm) var(--jev-radius-sm) 0;
    margin: .5rem 0;
}

/* ══════════════════════════════════════════════════════════════════════
   RESPONSIVE
   ══════════════════════════════════════════════════════════════════════ */

@media (max-width: 767.98px) {
    #jevents .jev-day { height: 80px; padding: .2rem; }
    #jevents .jev-event__inner { font-size: .7rem; padding: .15rem .3rem; }
    #jevents .jev-day__link { font-size: .8rem; min-width: 1.4rem; height: 1.4rem; line-height: 1.4rem; }
    #jevents .month_date { font-size: 1.5rem; }
    #jevents .month_date .month_title_year { font-size: 1.05rem; }
    #jevents .contentheading { font-size: 1.5rem; }

    .jev_evdt .jev_evdt_header {
        flex-direction: column;
        align-items: flex-start;
        gap: .5rem;
    }
    .jev_evdt .jev_evdt_hits {
        margin-left: 0;
    }
    .jev_evdt .jev_evdt_title,
    #jevents_body .jev_evdt .jev_evdt_title {
        font-size: 1.5rem;
    }
}

/* ══════════════════════════════════════════════════════════════════════
   POPOVER tooltip
   ══════════════════════════════════════════════════════════════════════ */

#jevents .jevtt_title {
    font-family: var(--font-head);
    font-weight: 500;
    padding: .35rem .6rem;
    border-radius: var(--jev-radius-sm) var(--jev-radius-sm) 0 0;
}
#jevents .jevtt_text {
    padding: .35rem 0;
    font-size: .85rem;
}
#jevents .jevtt_text .fwb {
    color: var(--jev-accent);
    font-weight: 600;
}
/* ==========================================================
   ERROR 404 — minimalistický doplněk
   Pouze efekty, které BS5/typography neumí:
   - gradientní animované číslo "404"
   - kývající listy (sway)
   - pulse dot v badge
   - hover lift na cat-card a Å¡ipce
   ----------------------------------------------------------
   Přidat na konec: templates/n_bln/css/user.css
   ========================================================== */


/* ── 404 číslo: zlatý gradient přes písmo ─────────────────── */

.e404-num {
  font-family: var(--font-head, 'Playfair Display', serif);
  font-size: clamp(7rem, 18vw, 12rem);
  font-weight: 700;
  line-height: 1;
  letter-spacing: -.04em;
  background: linear-gradient(180deg,
    var(--c-gold-100, #E8D5A8) 0%,
    var(--c-gold-200, #C8A96E) 70%,
    var(--c-gold-300, #B8944A) 100%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  text-shadow: 0 8px 32px rgba(200, 169, 110, .3);
}


/* ── Kývající listy vedle čísla ───────────────────────────── */

.e404-leaf {
  font-size: clamp(2.5rem, 6vw, 4rem);
  filter: drop-shadow(0 4px 12px rgba(0, 0, 0, .3));
  animation: e404-sway-l 4s ease-in-out infinite;
}
.e404-leaf--right {
  animation-name: e404-sway-r;
  animation-delay: -2s;
  transform: scaleX(-1);
}

@keyframes e404-sway-l {
  0%, 100% { transform: rotate(-6deg) translateY(0); }
  50%      { transform: rotate(6deg) translateY(-8px); }
}
@keyframes e404-sway-r {
  0%, 100% { transform: scaleX(-1) rotate(-6deg) translateY(0); }
  50%      { transform: scaleX(-1) rotate(6deg) translateY(-8px); }
}


/* ── Pulsující tečka v badge ──────────────────────────────── */

.e404-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--c-gold-200, #C8A96E);
  box-shadow: 0 0 0 4px rgba(200, 169, 110, .25);
  animation: e404-pulse 2s ease-in-out infinite;
}
@keyframes e404-pulse {
  0%, 100% { box-shadow: 0 0 0 4px rgba(200, 169, 110, .25); }
  50%      { box-shadow: 0 0 0 8px rgba(200, 169, 110, .12); }
}


/* ── Hover na kategorie kartu (lift + akcent linka + arrow) ─ */

.e404-cat-card {
  position: relative;
  overflow: hidden;
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
  color: inherit;
}
.e404-cat-card::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 3px;
  background: linear-gradient(90deg,
    var(--c-forest-300, #7A8B6F),
    var(--c-gold-200, #C8A96E));
  transform: scaleX(0);
  transform-origin: left;
  transition: transform .3s ease;
}
.e404-cat-card:hover {
  transform: translateY(-4px);
  box-shadow: var(--shadow-lg, 0 16px 48px rgba(44, 62, 45, .12));
  border-color: var(--c-forest-200, #B8C5AE) !important;
}
.e404-cat-card:hover::before { transform: scaleX(1); }

.e404-cat-card .e404-arrow {
  transition: background .25s ease, color .25s ease, transform .25s ease;
}
.e404-cat-card:hover .e404-arrow {
  background: var(--c-forest-400, #2C3E2D) !important;
  color: #fff !important;
  transform: translateX(4px);
}
/* ==========================================================
   ERROR 404 — minimalistický doplněk
   Pouze efekty, které BS5/typography neumí.
   Používá výhradně tokeny z typography.css (žádné hardcoded barvy).
   ----------------------------------------------------------
   Přidat na konec: media/templates/site/cassiopeia_bln/css/user.css
   ========================================================== */


/* ── 404 číslo: zlatý gradient přes písmo ─────────────────── */

.e404-num {
  font-family: var(--font-head);
  font-size: clamp(7rem, 18vw, 12rem);
  font-weight: 700;
  line-height: 1;
  letter-spacing: -.04em;
  background: linear-gradient(180deg,
    var(--c-gold-100) 0%,
    var(--c-gold-200) 70%,
    var(--c-gold-300) 100%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  text-shadow: 0 8px 32px color-mix(in srgb, var(--c-gold-200) 30%, transparent);
}


/* ── Kývající listy vedle čísla ───────────────────────────── */

.e404-leaf {
  font-size: clamp(2.5rem, 6vw, 4rem);
  filter: drop-shadow(0 4px 12px rgba(0, 0, 0, .3));
  animation: e404-sway-l 4s ease-in-out infinite;
}
.e404-leaf--right {
  animation-name: e404-sway-r;
  animation-delay: -2s;
  transform: scaleX(-1);
}

@keyframes e404-sway-l {
  0%, 100% { transform: rotate(-6deg) translateY(0); }
  50%      { transform: rotate(6deg) translateY(-8px); }
}
@keyframes e404-sway-r {
  0%, 100% { transform: scaleX(-1) rotate(-6deg) translateY(0); }
  50%      { transform: scaleX(-1) rotate(6deg) translateY(-8px); }
}


/* ── Pulsující tečka v badge ──────────────────────────────── */

.e404-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--c-gold-200);
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--c-gold-200) 25%, transparent);
  animation: e404-pulse 2s ease-in-out infinite;
}
@keyframes e404-pulse {
  0%, 100% { box-shadow: 0 0 0 4px color-mix(in srgb, var(--c-gold-200) 25%, transparent); }
  50%      { box-shadow: 0 0 0 8px color-mix(in srgb, var(--c-gold-200) 12%, transparent); }
}


/* ── Hover na kategorie kartu ─────────────────────────────── */

.e404-cat-card {
  position: relative;
  overflow: hidden;
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
  color: inherit;
}
.e404-cat-card::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 3px;
  background: linear-gradient(90deg, var(--c-forest-300), var(--c-gold-200));
  transform: scaleX(0);
  transform-origin: left;
  transition: transform .3s ease;
}
.e404-cat-card:hover {
  transform: translateY(-4px);
  box-shadow: var(--shadow-lg);
  border-color: var(--c-forest-200) !important;
}
.e404-cat-card:hover::before { transform: scaleX(1); }

.e404-cat-card .e404-arrow {
  transition: background .25s ease, color .25s ease, transform .25s ease;
}
.e404-cat-card:hover .e404-arrow {
  background: var(--c-forest-400) !important;
  color: #fff !important;
  transform: translateX(4px);
}


/* ── Smart Search slot (mod_finder uvnitř 404 karty) ──────── */
/* Modul vypadá v defaultu jako labeled inline form. Tady ho
   přestylujeme na velký pill input s tlačítkem vedle, aby seděl
   do designu 404 stránky. */

.error-404__search-slot {
  /* Reset module wrapper */
}
.error-404__search-slot .moduletable {
  margin: 0;
  padding: 0;
}

.error-404__search-slot .mod-finder {
  display: flex;
  gap: .5rem;
  align-items: stretch;
  margin: 0;
  width: 100%;
}

/* Schováme nativní label "Hledat" – heading nad kartou ho už nahrazuje */
.error-404__search-slot .mod-finder > label.finder {
  position: absolute !important;
  width: 1px; height: 1px;
  padding: 0; margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/* Awesomplete wrapper musí být flex-grow, aby input zabral celou šíři */
.error-404__search-slot .awesomplete {
  flex: 1 1 auto;
  position: relative;
  display: block;
}

/* Vlastní input – pill, velký, sjednocený s designem */
.error-404__search-slot .mod-finder input[type="text"],
.error-404__search-slot .js-finder-search-query {
  width: 100%;
  height: auto;
  border: 2px solid var(--color-border-light, #F0EBE5);
  border-radius: 999px;
  padding: .85rem 1.5rem;
  font-size: 1rem;
  font-family: inherit;
  background: var(--c-surface, #FAF6F0);
  color: var(--color-text, #3B3129);
  transition: border-color .2s ease, background .2s ease, box-shadow .2s ease;
  box-shadow: none;
}
.error-404__search-slot .mod-finder input[type="text"]:focus,
.error-404__search-slot .js-finder-search-query:focus {
  outline: none;
  border-color: var(--c-forest-300);
  background: #fff;
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--c-forest-300) 12%, transparent);
}

/* Submit tlačítko mod_finder defaultně nemá – přidáme ho přes ::after
   na formuláři, ale lépe je nechat search-on-enter (modul to umí)
   a vizuálně přidat ikonu lupy uvnitř inputu. */
.error-404__search-slot .awesomplete::after {
  content: '⏎';
  position: absolute;
  right: 1.25rem;
  top: 50%;
  transform: translateY(-50%);
  pointer-events: none;
  font-size: .9rem;
  color: var(--c-forest-300);
  opacity: .6;
}

/* Awesomplete dropdown (nápověda při psaní) */
.error-404__search-slot .awesomplete > ul {
  background: #fff;
  border: 1px solid var(--color-border-light, #F0EBE5);
  border-radius: var(--radius-card, 12px);
  box-shadow: var(--shadow-lg);
  margin-top: .35rem;
  padding: .35rem;
  list-style: none;
  z-index: 50;
}
.error-404__search-slot .awesomplete > ul > li {
  padding: .55rem .85rem;
  border-radius: 8px;
  cursor: pointer;
  font-size: .92rem;
  color: var(--color-text);
  transition: background .15s ease;
}
.error-404__search-slot .awesomplete > ul > li:hover,
.error-404__search-slot .awesomplete > ul > li[aria-selected="true"] {
  background: var(--c-forest-50, #EFF3EC);
  color: var(--c-forest-400);
}
.error-404__search-slot .awesomplete > ul > li mark {
  background: transparent;
  color: var(--c-forest-400);
  font-weight: 700;
}

/* Mobil – tlačítko šipky odstraň, place je málo */
@media (max-width: 575.98px) {
  .error-404__search-slot .awesomplete::after { display: none; }
  .error-404__search-slot .mod-finder input[type="text"] { padding-right: 1.25rem; }
}
/* ==========================================================
   MOD FINDER (smart search) – vysouvací vyhledávání v headeru
   Override: templates/n_bln/html/mod_finder/default.php

   Chování:
   - Lupa zůstává vpravo v řádku menu.
   - Po kliknutí se panel rozbalí DOLEVA od lupy (animace scaleX).
   - V panelu už není druhá lupa — odeslání Enterem.
   ========================================================== */

.mod-finder-toggle {
  position: relative;             /* KLÍČOVÉ pro absolutní pozici panelu */
  display: inline-flex;
  align-items: center;
  line-height: 1;
}

/* ── Hlavní lupa (otevírač) ─────────────────────────────── */
.mod-finder-toggle__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.4rem;
  height: 2.4rem;
  padding: 0;                          /* přepsat BS .btn padding */
  flex: 0 0 2.4rem;                    /* zafixovat šířku ve flex kontejneru */
  font-size: 1.35rem;
  color: var(--c-forest-400, #2C3E2D);
  background: transparent;
  border: 0;
  border-radius: 50%;                  /* kruh, ne pill */
  text-decoration: none;
  transition: color .2s ease, background-color .2s ease;
}

.mod-finder-toggle__btn:hover,
.mod-finder-toggle__btn:focus-visible {
  color: var(--c-forest-sage, #5C6B52);
  background: var(--c-forest-50, #EFF3EC);
  text-decoration: none;
}

.mod-finder-toggle__btn:focus-visible {
  outline: none;
  box-shadow: var(--focus-ring, 0 0 0 3px rgba(44, 62, 45, .25));
}

.mod-finder-toggle.is-open .mod-finder-toggle__btn {
  color: var(--c-gold-300, #B8944A);
  background: var(--c-forest-50, #EFF3EC);
  min-width:48px;
}

/* Varianta na tmavém pozadí */
.on-dark .mod-finder-toggle__btn {
  color: var(--c-cream-50, #FAF6F0);
}
.on-dark .mod-finder-toggle__btn:hover,
.on-dark .mod-finder-toggle__btn:focus-visible {
  color: var(--c-gold-100, #E8D5A8);
  background: rgba(255, 255, 255, .1);
}

/* ── Vysouvací panel — vyjede DOLEVA od lupy ────────────── */
.mod-finder-toggle__panel {
  position: absolute;
  top: 50%;
  right: calc(100% + .35rem);
  left: auto;
  transform: translateY(-50%) scaleX(0);
  transform-origin: right center;
  opacity: 0;
  pointer-events: none;
  white-space: nowrap;
  z-index: 1030;
  transition: transform .25s ease, opacity .25s ease;
}

.mod-finder-toggle.is-open .mod-finder-toggle__panel {
  transform: translateY(-50%) scaleX(1);
  opacity: 1;
  pointer-events: auto;
}

/* Žádná šipka — panel vyjíždí ze strany */
.mod-finder-toggle__panel::before {
  display: none !important;
}

/* ── Search input ───────────────────────────────────────── */
.mod-finder-toggle .mod-finder__search {
  width: clamp(240px, 30vw, 340px);
  background: var(--c-surface, #FAF6F0);
  border: 1px solid var(--color-border, #E2DCD4);
  border-radius: var(--radius-pill, 40px);
  box-shadow: var(--shadow-md, 0 8px 24px rgba(44, 62, 45, .08));
  overflow: hidden;
}

.mod-finder-toggle .mod-finder__search .form-control {
  width: 100%;
  border: 0;
  background: transparent;
  font-family: var(--font-body, 'Source Sans 3', sans-serif);
  font-size: .95rem;
  color: var(--color-text, #3B3129);
  padding: .55rem 1.15rem;
}

.mod-finder-toggle .mod-finder__search .form-control::placeholder {
  color: var(--color-text-muted, #A69E94);
}

.mod-finder-toggle .mod-finder__search .form-control:focus {
  outline: none;
  box-shadow: none;
  background: transparent;
}

.mod-finder-toggle .mod-finder__search:focus-within {
  border-color: var(--c-forest-300, #7A8B6F);
  box-shadow: var(--focus-ring, 0 0 0 3px rgba(44, 62, 45, .25));
}

/* Awesomplete wrapper musí být blokový a zabrat celou šíři */
.mod-finder-toggle .mod-finder__search .awesomplete {
  display: block;
  width: 100%;
}

/* ── Label (skrytý vizuálně, jen pro a11y) ──────────────── */
.mod-finder-toggle .mod-finder__label {
  position: absolute !important;
  width: 1px; height: 1px;
  padding: 0; margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/* ── Pokročilé vyhledávání (volitelné) ──────────────────── */
.mod-finder-toggle .mod-finder__advanced-link {
  color: var(--c-forest-sage, #5C6B52);
  text-decoration: none;
}
.mod-finder-toggle .mod-finder__advanced-link:hover {
  color: var(--c-forest-400, #2C3E2D);
  text-decoration: underline;
  text-underline-offset: .2em;
}

/* ── Mobile (≤575.98px) — panel přes plnou šířku pod headerem ── */
@media (max-width: 575.98px) {
  .mod-finder-toggle__panel {
    position: fixed;
    top: auto;
    left: .75rem;
    right: .75rem;
    transform: translateY(-8px);
    transform-origin: top right;
  }
  .mod-finder-toggle.is-open .mod-finder-toggle__panel {
    transform: translateY(0);
  }
  .mod-finder-toggle .mod-finder__search {
    width: 100%;
  }
}
/* ==========================================================
   HEADER NAV LAYOUT — desktop menu vlevo, finder vpravo
   Container .container-nav obsahuje sourozence:
   - #mod-1   (desktop menu, .pos-menu d-none d-lg-block)
   - #mod-460 (mobilní hamburger, .bhg-mobile-hamburger d-lg-none)
   - #mod-476 (finder, .mod-finder-toggle uvnitř)
   Cíl: na desktopu menu vyplní šířku, lupa je úplně vpravo.
   ========================================================== */

@media (min-width: 992px) {
  nav.container-nav {
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
    gap: .75rem;
    width: 100%;
  }

  /* Desktop menu wrapper roste — vytlačí finder doprava */
  nav.container-nav > .pos-menu#mod-1 {
    flex: 1 1 auto;
    min-width: 0;          /* aby dlouhé menu mohlo wrapovat/scrollovat */
  }

  /* Finder wrapper přilepený vpravo */
  nav.container-nav > .pos-menu#mod-476 {
    flex: 0 0 auto;
    margin-left: auto;     /* fallback, kdyby flex-grow nestačil */
    display: flex;
    align-items: center;
  }

  /* Mobilní hamburger na desktopu nezasahuje (má d-lg-none) */
  nav.container-nav > #mod-460 {
    flex: 0 0 auto;
  }
}

/* Mobile (<992px): menu má vlastní fixed drawer (hamburger),
   finder zůstane v toku — pokud ho chceš schovat, odkomentuj: */
/*
@media (max-width: 991.98px) {
  nav.container-nav > .pos-menu#mod-476 {
    display: none;
  }
}
*/
/*opravy*/
@media (max-width: 1199.98px) {
  .brand-logo img {
    width: 65px;
    height: 55px;
    object-fit: cover;
    object-position: left center;
  }
  .klasic .nav-link {
    padding: 8px 10px;
    }
}

/* ==========================================================
   PORADNA — Hlavní strana (layout=list): přesun statistik
   nad kategorie
   ==========================================================
   Zachovává Kunena DOM strukturu (důležité pro přístupnost
   a SEO), pomocí flexbox order pouze přepořádá vizuální
   pořadí bloků na hlavní stránce poradny.

   DOM struktura #kunena.layout:
     1. nav.navbar             (Kunena menu)
     2. nav (breadcrumbs)      (Poradna › Hlavní strana)
     3. form#jumpto            (selector kategorie)
     4. div.kfrontend.section  (KATEGORIE — Bylinková poradna)
     5. div.kfrontend          (Členové online — h2 "členů")
     6. div.kfrontend          (STATISTIKY — má #kstats uvnitř)
     7. nav (breadcrumbs spodní)
     8. div.pull-right         (RSS ikona)

   Cíl: posunout #6 (statistiky) nad #4 (kategorie).

   Scope: pouze pro com_kunena view=category layout=list
   (= hlavní strana poradny s výpisem kategorií).
   Kunena přidává na <body> třídy:
     com_kunena view-category layout-list
   ========================================================== */

/* Aktivace flex orderingu jen na výpisu kategorií (layout=list) */
body.com_kunena.view-category.layout-list #kunena.layout {
  display: flex;
  flex-direction: column;
}

/* Statistiky — blok obsahující #kstats */
body.com_kunena.view-category.layout-list #kunena.layout .kfrontend:has(#kstats) {
  order: 35;
  margin-top: 3rem !important;
  margin-bottom: 0;
}

/* Kategorie — blok s class "section" */
body.com_kunena.view-category.layout-list #kunena.layout .kfrontend.section {
  order: 40;
}

/* Členové online — necháme až za kategoriemi */
body.com_kunena.view-category.layout-list #kunena.layout .kfrontend:not(.section):not(:has(#kstats)) {
  order: 50;
}

/* Ostatní elementy (nav, form, breadcrumbs) si zachovávají
   svoji přirozenou pozici pomocí explicitního order */
body.com_kunena.view-category.layout-list #kunena.layout > nav.navbar { order: 10; }
body.com_kunena.view-category.layout-list #kunena.layout > nav[aria-label="breadcrumbs"]:first-of-type { order: 20; }
body.com_kunena.view-category.layout-list #kunena.layout > #jumpto { order: 30; }
body.com_kunena.view-category.layout-list #kunena.layout > nav[aria-label="breadcrumbs"]:last-of-type { order: 60; }
body.com_kunena.view-category.layout-list #kunena.layout > .pull-right { order: 70; }
body.com_kunena.view-category.layout-list #kunena.layout > .clearfix { order: 71; }
body.com_kunena.view-category.layout-list #kunena.layout > .d-flex.justify-content-center { order: 80; }

/* ==========================================================
   FALLBACK pro starší prohlížeče bez :has() podpory
   (Safari < 15.4, starší Firefox).
   :has() je podporován v Chrome/Edge 105+, Safari 15.4+,
   Firefox 121+ — pokrývá ~95 % uživatelů ke 04/2026.
   ========================================================== */
@supports not selector(:has(*)) {
  /* Bez :has() použijeme nth-of-type podle pozice v DOM */
  body.com_kunena.view-category.layout-list #kunena.layout .kfrontend:nth-of-type(3) {
    order: 35;
    margin-top: 0;
  }
  body.com_kunena.view-category.layout-list #kunena.layout .kfrontend:nth-of-type(1) {
    order: 40;
  }
  body.com_kunena.view-category.layout-list #kunena.layout .kfrontend:nth-of-type(2) {
    order: 50;
  }
}
/* Kunena poradna — výrazné CTA "Zadat dotaz" */
.offcanvas-body .navbar-nav .item-1195 > .nav-link {
    background: linear-gradient(135deg, #f59e0b 0%, #ea580c 100%);
    color: #fff !important;
    padding: 0.55rem 1.4rem;
    border-radius: 999px;
    font-weight: 700;
    letter-spacing: 0.02em;
    margin-right: 0.5rem;
    transition: all 0.25s ease;
    box-shadow: 0 4px 14px rgba(234, 88, 12, 0.4),
                0 0 0 0 rgba(234, 88, 12, 0.5);
    position: relative;
    animation: bln-cta-pulse 2.5s ease-in-out infinite;
}

.offcanvas-body .navbar-nav .item-1195 > .nav-link:hover,
.offcanvas-body .navbar-nav .item-1195 > .nav-link:focus {
    background: linear-gradient(135deg, #ea580c 0%, #c2410c 100%);
    color: #fff !important;
    transform: translateY(-2px) scale(1.03);
    box-shadow: 0 6px 20px rgba(234, 88, 12, 0.55);
    animation: none;
}

/* Ikona "+" před textem */
.offcanvas-body .navbar-nav .item-1195 > .nav-link::before {
    content: "✏";
    display: inline-block;
    margin-right: 0.45rem;
    font-size: 1em;
    line-height: 1;
}

/* Jemný pulse efekt pro upoutání pozornosti */
@keyframes bln-cta-pulse {
    0%, 100% {
        box-shadow: 0 4px 14px rgba(234, 88, 12, 0.4),
                    0 0 0 0 rgba(234, 88, 12, 0.5);
    }
    50% {
        box-shadow: 0 4px 14px rgba(234, 88, 12, 0.4),
                    0 0 0 8px rgba(234, 88, 12, 0);
    }
}

/* Respekt k uživatelům s prefers-reduced-motion */
@media (prefers-reduced-motion: reduce) {
    .offcanvas-body .navbar-nav .item-1195 > .nav-link {
        animation: none;
    }
}
/* ID článku v info_block lince */
.article-info dd.article-id .bln-id-icon {
  color: var(--color-text-muted, #A69E94);
  margin-right: .25rem;
  vertical-align: -2px;
}
/* ============================================================ */
/* Kunena: odsazení odpovědí v detailu vlákna                    */
/* ============================================================ */
#kunena .topic-item-messages .row.message + .row.message {
    margin-left: 40px !important;
    max-width: calc(100% - 40px);
}

/* Tablet — méně */
@media (max-width: 991.98px) {
    #kunena .topic-item-messages .row.message + .row.message {
        margin-left: 24px !important;
        max-width: calc(100% - 24px);
    }
}

/* Mobil — ještě méně */
@media (max-width: 575.98px) {
    #kunena .topic-item-messages .row.message + .row.message {
        margin-left: 12px !important;
        max-width: calc(100% - 12px);
    }
}


/* ============================================================ */
/* Kunena: tlačítka v formuláři nového příspěvku / odpovědi      */
/* Botanická elegance — forest green primární, gold sekundární   */
/* ============================================================ */

/* --- Tlačítko ODESLAT (form_submit_button) --- */
#kunena #form_submit_button.btn.btn-outline-success {
    background-color: #2C3E2D !important;     /* forest green */
    border: 2px solid #2C3E2D !important;
    color: #FFFFFF !important;
    font-weight: 600;
    padding: 10px 28px;
    border-radius: 4px;
    text-transform: none;
    letter-spacing: 0.3px;
    transition: all 0.2s ease;
    box-shadow: 0 2px 6px rgba(44, 62, 45, 0.15);
}

#kunena #form_submit_button.btn.btn-outline-success:hover:not(:disabled),
#kunena #form_submit_button.btn.btn-outline-success:focus:not(:disabled) {
    background-color: #1F2D20 !important;     /* tmavší forest green */
    border-color: #1F2D20 !important;
    color: #FFFFFF !important;
    box-shadow: 0 4px 12px rgba(44, 62, 45, 0.25);
    transform: translateY(-1px);
}

#kunena #form_submit_button.btn.btn-outline-success:disabled,
#kunena #form_submit_button.btn.btn-outline-success.disabled {
    background-color: #A8B5A4 !important;     /* světlejší sage */
    border-color: #A8B5A4 !important;
    color: #FFFFFF !important;
    opacity: 0.7;
    cursor: not-allowed;
    box-shadow: none;
    transform: none;
}

#kunena #form_submit_button.btn.btn-outline-success svg {
    margin-right: 6px;
}

/* --- Tlačítko ZRUŠIT (reset) --- */
/* Cílíme jen na tlačítka 'reset' uvnitř Kuneny, aby se to nedotklo */
/* jiných btn-outline-primary v Kuneně.                              */
#kunena button[type="reset"].btn.btn-outline-primary.btn-md {
    background-color: transparent !important;
    border: 2px solid #C8A96E !important;     /* gold border */
    color: #8B7A4D !important;                /* tmavší gold pro text */
    font-weight: 600;
    padding: 10px 28px;
    border-radius: 4px;
    text-transform: none;
    letter-spacing: 0.3px;
    transition: all 0.2s ease;
    margin-left: 12px;
}

#kunena button[type="reset"].btn.btn-outline-primary.btn-md:hover,
#kunena button[type="reset"].btn.btn-outline-primary.btn-md:focus {
    background-color: #C8A96E !important;     /* gold fill */
    border-color: #C8A96E !important;
    color: #FFFFFF !important;
    box-shadow: 0 4px 12px rgba(200, 169, 110, 0.25);
    transform: translateY(-1px);
}

#kunena button[type="reset"].btn.btn-outline-primary.btn-md svg {
    margin-right: 6px;
}

/* --- Mobile: tlačítka pod sebe, plnou šířku --- */
@media (max-width: 575.98px) {
    #kunena #form_submit_button.btn.btn-outline-success,
    #kunena button[type="reset"].btn.btn-outline-primary.btn-md {
        display: block;
        width: 100%;
        margin-left: 0;
        margin-bottom: 8px;
    }
}
/* ==========================================================
   DAR BANNER – výzva k podpoře (poradna / Kunena)
   mod_custom na pozici main-top
   ========================================================== */

.dar-banner {
  /* barvy pouze zde – snadná záměna */
  --dar-bg-a:      #FFFCA8;   /* světle žlutá */
  --dar-bg-b:      #FBF14F;   /* sytější žlutá */
  --dar-text:      #1A2B1C;
  --dar-link:      #0A7BD6;
  --dar-link-hover:#05528F;

  background-color: var(--dar-bg-a);
  color: var(--dar-text);
  border-radius: .5rem;
  border: 1px solid rgba(0, 0, 0, .07);
  /* 10s cyklus = 5s světlá, 5s sytá, plynulý přechod */
  animation: dar-pulse 10s ease-in-out infinite;
}

@keyframes dar-pulse {
  0%,  45%  { background-color: var(--dar-bg-a); }
  50%, 95%  { background-color: var(--dar-bg-b); }
  100%      { background-color: var(--dar-bg-a); }
}

.dar-banner__text {
  font-size: clamp(15px, .55vw + 13px, 19px);
  line-height: 1.4;
}

.dar-banner .dar-banner__link {
  color: var(--dar-link);
  text-decoration: underline;
  text-underline-offset: .18em;
  text-decoration-thickness: 2px;
}

.dar-banner .dar-banner__link:hover,
.dar-banner .dar-banner__link:focus-visible {
  color: var(--dar-link-hover);
}

/* Varianta v duchu webu (Botanická elegance) – stačí přidat
   třídu dar-banner--gold do divu v modulu */
.dar-banner--gold {
  --dar-bg-a:      var(--c-gold-50);
  --dar-bg-b:      var(--c-gold-100);
  --dar-text:      var(--c-forest-400);
  --dar-link:      var(--c-forest-400);
  --dar-link-hover:var(--c-gold-400);
  border-color: var(--c-gold-200);
}

/* Respekt k nastavení systému – bez blikání */
@media (prefers-reduced-motion: reduce) {
  .dar-banner {
    animation: none;
    background-color: var(--dar-bg-b);
  }
}