/*
 * TE v4 – keret: topbar, fejléc, főmenü, mobilmenü, keresőpanel, oldalszerkezet, lábléc
 * author: Laszlo BLAHO – www.blaho.hu
 *
 * Natív CSS nesting. Töréspontok: 576px (sm) · 768px (md) · 1040px (lg) · 1344px (xl)
 * A mobilmenü váltási pontja 1040px, mint a v3-ban (1039px).
 */

/* ==========================================================================
   Topbar
   ========================================================================== */

.te-topbar {
   background-color: hsl(var(--blue));
   color: hsl(var(--white));
   font-size: 13px;
   font-weight: 500;

   a {
      color: inherit;
      text-decoration: none;
      opacity: .92;
      transition: opacity var(--transition-time);

      &:hover,
      &:focus-visible {
         opacity: 1;
         text-decoration: underline;
         text-underline-offset: 3px;
      }
   }
}

.te-topbar__inner {
   display: flex;
   align-items: center;
   justify-content: space-between;
   gap: var(--space-5);
   min-height: var(--topbar-h);
}

.te-quicklinks {
   display: flex;
   flex-wrap: wrap;
   gap: var(--space-1) var(--space-5);
}

.te-topbar__tools {
   display: flex;
   align-items: center;
   gap: var(--space-5);
}

.te-social {
   display: flex;
   gap: var(--space-2);
}

/* Közösségi gombok: fehér négyzet, kék ikon (a v3 grafikája) */
.te-social__btn {
   display: flex;
   align-items: center;
   justify-content: center;
   width: 28px;
   height: 28px;
   border-radius: var(--radius);
   background-color: hsl(var(--white));
   transition: background-color var(--transition-time), transform var(--transition-time);

   /* a .te-topbar a szabály (opacity-átmenet) ne írja felül a színváltás késleltetését */
   .te-topbar & {
      opacity: 1;
      transition: background-color var(--transition-time), transform var(--transition-time);
   }

   .te-topbar &:hover,
   .te-topbar &:focus-visible {
      text-decoration: none;
   }

   img {
      display: block;
      width: 14px;
      height: 14px;
   }

   &:hover,
   &:focus-visible {
      background-color: hsl(var(--lightBlue));
   }
}

.te-search-toggle {
   display: inline-flex;
   align-items: center;
   gap: 6px;
   padding: 0;
   border: 0;
   background: none;
   color: inherit;
   font-weight: 700;
   cursor: pointer;

   &:hover span {
      text-decoration: underline;
      text-underline-offset: 3px;
   }
}

.te-langswitch__link {
   display: inline-block;
   min-width: 32px;
   padding: 1px 8px;
   border: 1px solid hsla(var(--white), .7);
   border-radius: var(--radius-sm);
   font-weight: 700;
   text-align: center;
   line-height: 1.4;

   .te-topbar &:hover {
      background: hsl(var(--white));
      color: hsl(var(--blue));
      text-decoration: none;
      opacity: 1;
   }
}

/* ==========================================================================
   Fejléc (logó, főmenü, CTA)
   ========================================================================== */

.te-masthead {
   background-color: hsl(var(--white));
   border-bottom: 1px solid hsla(var(--black), .06);
}

.te-masthead__inner {
   display: flex;
   align-items: center;
   gap: var(--space-5);
   min-height: var(--masthead-h);
}

.te-logo {
   flex: 0 0 auto;
   display: block;
   margin-right: auto;

   img {
      display: block;
      width: auto;
      height: 62px;
   }
}

.te-masthead__cta {
   flex: 0 0 auto;

   a,
   .te-btn {
      display: inline-block;
      padding: 10px 22px;
      border-radius: var(--radius);
      background-color: hsl(var(--gold));
      color: hsl(var(--white));
      font-weight: 700;
      font-size: 16px;
      text-decoration: none;
      transition: background-color var(--transition-time);

      &:hover,
      &:focus-visible {
         background-color: hsl(var(--darkBlue));
      }
   }

   p {
      margin: 0;
   }
}

.te-search-toggle--icon,
.te-burger {
   display: none;
}

/* --- Főmenü: asztali -------------------------------------------------------- */

@media (width >= 1040px) {

   .te-nav__tools,
   .te-nav__links {
      display: none;
   }

   .te-menu {
      display: flex;
      align-items: center;
      gap: var(--space-2) clamp(12px, 1.8vw, 28px);

      > .te-menu__item {
         position: relative;

         > a,
         > span {
            display: block;
            padding: 12px 0 9px;
            border-bottom: 3px solid transparent;
            color: hsl(var(--blue));
            font-size: 16px;
            font-weight: 500;
            text-decoration: none;
            transition: border-color var(--transition-time);
         }

         &:hover > a,
         &:hover > span,
         &:focus-within > a,
         &:focus-within > span,
         &.active > a,
         &.active > span {
            border-bottom-color: hsl(var(--gold));
         }
      }

      .te-menu__toggle {
         display: none;
      }

      /* kiemelt menüpont (Link Class: te-highlight) – a minta szerinti arany "címke" */
      > .te-menu__item.is-highlighted {

         > a,
         > span {
            padding: 6px 12px;
            border: 2px solid hsl(var(--gold));
            border-radius: var(--radius-sm);
            background-color: hsl(var(--gold));
            color: hsl(var(--white));
            font-weight: 700;
            line-height: 1.2;
            transition: background-color var(--transition-time), border-color var(--transition-time), color var(--transition-time);
         }

         &:hover > a,
         &:focus-within > a,
         &.active > a {
            border-color: hsl(var(--darkBlue));
            background-color: hsl(var(--darkBlue));
            color: hsl(var(--white));
         }

         &.is-highlighted--outline > a {
            background-color: transparent;
            color: hsl(var(--blue));
         }

         &.is-highlighted--outline:hover > a,
         &.is-highlighted--outline:focus-within > a {
            border-color: hsl(var(--gold));
            background-color: hsl(var(--gold));
            color: hsl(var(--white));
         }
      }

      /* lenyíló almenü (2. szint) */
      .te-menu__sub {
         position: absolute;
         top: 100%;
         left: -20px;
         z-index: 50;
         min-width: 280px;
         padding: var(--space-2) 0;
         background: hsl(var(--white));
         border-top: 3px solid hsl(var(--gold));
         border-radius: 0 0 var(--radius) var(--radius);
         box-shadow: var(--shadow-card);
         opacity: 0;
         visibility: hidden;
         transform: translateY(6px);
         transition: opacity .2s, transform .2s, visibility .2s;

         a,
         span {
            display: block;
            padding: 4px 20px;
            color: hsl(var(--blue));
            font-size: 15px;
            text-decoration: none;
            line-height: 1.4;
            transition: background-color .15s, color .15s;
         }

         a:hover,
         a:focus-visible {
            background: hsla(var(--lightBlue), .35);
            color: hsl(var(--darkBlue));
         }

         .current > a {
            font-weight: 700;
         }

         /* 3. szint és mélyebb: asztali nézetben alapból nem jelenik meg */
         .te-menu__sub {
            display: none;
         }
      }

      > .te-menu__item:hover > .te-menu__sub,
      > .te-menu__item:focus-within > .te-menu__sub {
         opacity: 1;
         visibility: visible;
         transform: none;
      }

      /* a jobb szélső pontok lenyílója ne lógjon ki */
      > .te-menu__item:nth-last-child(-n+2) > .te-menu__sub {
         left: auto;
         right: -20px;
      }
   }

   /* --- Teszt: oldalra nyíló 3. szint (sablonstílus › "Asztali almenük" = oldalra nyíló) --- */
   .te--menu-flyout .te-menu .te-menu__sub {

      .te-menu__item {
         position: relative;
      }

      .te-menu__item.parent > a,
      .te-menu__item.parent > span {
         padding-right: 36px;
         background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='12' viewBox='0 0 8 12'%3E%3Cpath d='M1.5 1.5 6 6l-4.5 4.5' fill='none' stroke='%23163f93' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
         background-size: 8px 12px;
         background-position: right 18px center;
         background-repeat: no-repeat;
      }

      .te-menu__item.parent > a:hover {
         background-color: hsla(var(--lightBlue), .35);
      }

      .te-menu__sub {
         display: block;
         top: calc(var(--space-2) * -1 - 3px);
         left: 100%;
         right: auto;
         border-top: 0;
         border-left: 3px solid hsl(var(--gold));
         border-radius: 0 var(--radius) var(--radius) 0;
         transform: translateX(6px);
      }

      .te-menu__item:hover > .te-menu__sub,
      .te-menu__item:focus-within > .te-menu__sub {
         opacity: 1;
         visibility: visible;
         transform: none;
      }
   }

   /* a jobb szélső pontoknál balra nyílik */
   .te--menu-flyout .te-menu > .te-menu__item:nth-last-child(-n+2) .te-menu__sub .te-menu__sub {
      left: auto;
      right: 100%;
      border-left: 0;
      border-right: 3px solid hsl(var(--gold));
      border-radius: var(--radius) 0 0 var(--radius);
      transform: translateX(-6px);
   }
}

/* --- Mobil: teljes képernyős takaró menü (a v3 viselkedése szerint) --------- */

@media (width < 1040px) {

   :root {
      --masthead-h: 84px;
   }

   .te-topbar {
      display: none;
   }

   .te-header {
      position: sticky;
      top: 0;
      z-index: 100;
   }

   .te-logo img {
      height: 52px;
   }

   .te-search-toggle--icon,
   .te-burger {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      width: 44px;
      height: 44px;
      padding: 0;
      border: 0;
      background: none;
      color: hsl(var(--blue));
      cursor: pointer;
   }

   /* Hamburger: abszolút pozícionált, egész pixelre igazított vonalak; a középső
      vonal scaleX-szel tűnik el (az átlátszóság-animáció a Chrome-ban foltokat hagyott) */
   .te-burger {
      position: relative;

      .te-burger__bar {
         position: absolute;
         left: 9px;
         top: 12px;
         width: 26px;
         height: 3px;
         border-radius: 2px;
         background: currentColor;
         transform-origin: 50% 50%;
         transition: transform 250ms ease;
      }

      .te-burger__bar:nth-child(2) { top: 20px; }
      .te-burger__bar:nth-child(3) { top: 28px; }

      &[aria-expanded="true"] {
         .te-burger__bar:nth-child(1) { transform: translateY(8px) rotate(45deg); }
         .te-burger__bar:nth-child(2) { transform: scaleX(0); }
         .te-burger__bar:nth-child(3) { transform: translateY(-8px) rotate(-45deg); }
      }
   }

   .te-nav {
      position: fixed;
      inset: var(--masthead-h) 0 0 0;
      z-index: 90;
      visibility: hidden;
      opacity: .2;
      transform: translateX(-100%);
      transition: transform var(--transition-time) ease, opacity var(--transition-time) ease, visibility 0s linear var(--transition-time);
      background-color: hsl(var(--blue));
      color: hsl(var(--white));

      &.is-open {
         visibility: visible;
         opacity: 1;
         transform: none;
         transition: transform var(--transition-time) ease, opacity var(--transition-time) ease;
      }
   }

   /* Ablakméretezés / töréspontváltás közben nincs animáció (a JS teszi ki az osztályt),
      különben a panel a töréspontnál "átúszik" a képernyőn */
   html.te-resizing .te-nav,
   html.te-resizing .te-burger__bar {
      transition: none !important;
   }

   /* A panel magassága a látható nézetablakhoz igazodik (dvh): mobilböngészőben a
      címsor/eszköztár nem takarja ki az alját; alul biztonsági térköz is van. */
   .te-nav {
      bottom: auto;
      height: calc(100vh - var(--masthead-h));
      height: calc(100dvh - var(--masthead-h));
   }

   .te-nav__panel {
      display: flex;
      flex-direction: column;
      height: 100%;
      overflow-y: auto;
      overscroll-behavior: contain;
      padding: var(--space-5) var(--space-5) 0;
   }

   /* felső sor: közösségi linkek + nyelvváltó (a topbarból ide mozgatva) */
   .te-nav__tools .te-topbar__tools {
      display: flex;
      flex-direction: row-reverse;
      justify-content: space-between;
      align-items: center;
      gap: var(--space-4);
      font-weight: 500;

      .te-search-toggle {
         display: none;
      }

      a {
         color: hsl(var(--white));
         text-decoration: none;
      }
   }

   .te-nav__tools .te-langswitch__link {
      padding: 6px 14px;
      border-color: hsl(var(--white));
   }

   .te-nav__tools .te-social__btn {
      width: 36px;
      height: 36px;
   }

   .te-menu {
      margin: var(--space-5) 0 var(--space-4);

      > .te-menu__item {
         border-bottom: 1px solid hsla(var(--lightBlue), .3);

         &:last-child {
            border-bottom: 0;
         }
      }

      .te-menu__item {
         display: grid;
         grid-template-columns: 1fr auto;
         align-items: center;

         > a,
         > span {
            display: inline-block;
            padding: 18px 0;
            color: hsl(var(--white));
            text-decoration: none;
            font-size: 18px;
         }

         &.current > a {
            color: hsl(var(--gold));
         }
      }

      /* kiemelt menüpont mobilon: arany gomb a listában */
      > .te-menu__item.is-highlighted {
         border-bottom: 0;
         padding-block: var(--space-4);

         > a,
         > span {
            justify-self: start;
            padding: 10px 18px;
            border: 2px solid hsl(var(--gold));
            border-radius: var(--radius);
            background-color: hsl(var(--gold));
            color: hsl(var(--white));
            font-weight: 700;
         }

         &.is-highlighted--outline > a {
            background-color: transparent;
            color: hsl(var(--gold));
         }
      }

      .te-menu__toggle {
         width: 44px;
         height: 44px;
         border: 0;
         border-radius: var(--radius);
         /* aranysárga nyíl (a v3 mobilmenüjéhez hasonlóan) */
         background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='9' viewBox='0 0 14 9'%3E%3Cpath d='M1.5 1.5 7 7l5.5-5.5' fill='none' stroke='%23d6a200' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 14px 9px no-repeat;
         cursor: pointer;
         transition: transform var(--transition-time);

         &[aria-expanded="true"] {
            transform: rotate(180deg);
         }
      }

      /* almenü: arany bal oldali vonal jelzi a szintet; a 3. szint halványabb vonallal */
      .te-menu__sub {
         grid-column: 1 / -1;
         display: none;
         margin: 0 0 var(--space-4) 2px;
         padding: 2px 0 2px var(--space-4);
         border-left: 2px solid hsl(var(--gold));

         &.is-open {
            display: block;
         }

         .te-menu__item > a,
         .te-menu__item > span {
            padding: 9px 0;
            font-size: 16px;
            opacity: .9;
         }

         .te-menu__toggle {
            width: 40px;
            height: 40px;
         }

         .te-menu__sub {
            margin-bottom: var(--space-2);
            border-left-color: hsla(var(--white), .35);

            .te-menu__item > a,
            .te-menu__item > span {
               padding: 7px 0;
               font-size: 15px;
               opacity: .8;
            }
         }
      }
   }

   /* alsó blokk: a topbar gyorslinkjei */
   /* A felső sáv gyorslinkjei mindig látszanak: a panel aljára tapadnak (sticky),
      a hosszabb menü ezek alá görög be. Rövid menünél is a panel alján vannak. */
   .te-nav__links {
      position: sticky;
      bottom: 0;
      z-index: 2;
      margin: auto calc(var(--space-5) * -1) 0;
      padding: 0 var(--space-5) calc(var(--space-4) + env(safe-area-inset-bottom, 0px));
      background-color: hsl(var(--blue));
      box-shadow: 0 -10px 18px -8px hsla(var(--darkBlue), .55);
   }

   .te-nav__links:empty {
      display: none;
   }

   .te-nav__links .te-quicklinks {
      display: flex;
      flex-wrap: wrap;
      gap: var(--space-1) var(--space-4);
      padding-top: var(--space-4);
      border-top: 1px solid hsla(var(--lightBlue), .3);

      a {
         display: inline-block;
         padding: 6px 0;
         color: hsl(var(--gold));
         font-size: 14px;
         font-weight: 500;
         letter-spacing: .04em;
         text-transform: uppercase;
         text-decoration: none;
      }
   }

   /* Görgetés tiltása nyitott menünél. CSAK a <html>-re: ha a <body> is overflow:hidden
      lenne, a body görgetési konténerré válna, és a sticky fejléc az oldal tetejére
      "ugrana" vissza (oldal közepén nyitva eltűnt a fejléc és a menü). */
   html.te-nav-open {
      overflow: hidden;
   }
}

@media (width < 576px) {

   .te-masthead__inner {
      gap: var(--space-2);
   }

   .te-logo img {
      height: 44px;
   }

   .te-masthead__cta a,
   .te-masthead__cta .te-btn {
      padding: 8px 12px;
      font-size: 14px;
   }
}

@media (width < 400px) {
   .te-masthead__cta {
      display: none;
   }
}

/* ==========================================================================
   Keresőpanel (a kereső modul a v4-search pozícióban – most mod_finder,
   később mod_tfsearch). A modul markupjától függetlenül: a mező kitölti a sort.
   ========================================================================== */

.te-search {
   border-bottom: 1px solid hsla(var(--blue), .12);
   background: hsla(var(--lightBlue), .14);
   box-shadow: inset 0 8px 14px -12px hsla(var(--darkBlue), .35);

   /* a tfsearch saját változói a sablon színeire kötve */
   --tfs-accent: hsl(var(--gold));
   --tfs-text: hsl(var(--darkBlue));
   --tfs-muted: hsl(var(--midGray));
   --tfs-border: hsla(var(--blue), .25);
   --tfs-mark: hsla(var(--gold), .35);

   &[hidden] {
      display: none;
   }
}

.te-search__inner {
   display: flex;
   align-items: center;
   gap: var(--space-3);
   max-width: 980px;
   padding-block: var(--space-5);

   > :first-child {
      flex: 1;
      min-width: 0;
   }

   /* minden szint, ami a mezőt körbeveszi (form, input-group, awesomplete), nyúljon ki */
   form,
   .input-group,
   .mod-finder__search,
   .awesomplete {
      display: flex;
      flex: 1;
      align-items: stretch;
      gap: var(--space-2);
      min-width: 0;
      width: 100%;
   }

   .awesomplete {
      position: relative;
      display: block;
   }

   label:not(.visually-hidden) {
      position: absolute;
      width: 1px;
      height: 1px;
      overflow: hidden;
      clip: rect(0, 0, 0, 0);
      white-space: nowrap;
   }

   input[type="search"],
   input[type="text"] {
      flex: 1;
      width: 100%;
      min-width: 0;
      height: 52px;
      padding: 0 var(--space-4) 0 48px;
      border: 1px solid hsla(var(--blue), .25);
      border-radius: var(--radius-lg);
      background: hsl(var(--white)) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24'%3E%3Ccircle cx='10.5' cy='10.5' r='6.5' fill='none' stroke='%23163f93' stroke-width='2.2'/%3E%3Cpath d='M15.5 15.5 21 21' stroke='%23163f93' stroke-width='2.2' stroke-linecap='round'/%3E%3C/svg%3E") 16px center / 20px 20px no-repeat;
      box-shadow: 0 1px 2px hsla(var(--darkBlue), .06);
      font: inherit;
      font-size: 17px;
      color: hsl(var(--darkBlue));
      outline: none;
      transition: border-color .2s, box-shadow .2s;

      &::placeholder {
         color: hsla(var(--midGray), .7);
      }

      &:focus {
         border-color: hsl(var(--gold));
         box-shadow: 0 0 0 3px hsla(var(--gold), .25);
      }
   }

   button[type="submit"],
   .btn {
      flex: 0 0 auto;
      height: 52px;
      padding: 0 var(--space-5);
      border: 0;
      border-radius: var(--radius-lg);
      background: hsl(var(--blue));
      color: hsl(var(--white));
      font: inherit;
      font-weight: 700;
      cursor: pointer;
      transition: background-color var(--transition-time);

      &:hover,
      &:focus-visible {
         background: hsl(var(--darkBlue));
      }

      [class^="icon-"],
      [class*=" icon-"] {
         display: none;
      }
   }

   /* a mod_finder automatikus javaslatai (awesomplete) */
   .awesomplete > ul {
      position: absolute;
      top: calc(100% + 6px);
      left: 0;
      right: 0;
      z-index: 60;
      margin: 0;
      padding: var(--space-2) 0;
      border: 1px solid hsla(var(--blue), .15);
      border-radius: var(--radius-lg);
      background: hsl(var(--white));
      box-shadow: var(--shadow-card);
      list-style: none;

      &:empty,
      &[hidden] {
         display: none;
      }

      li {
         padding: 8px var(--space-4);
         color: hsl(var(--darkBlue));
         cursor: pointer;

         &:hover,
         &[aria-selected="true"] {
            background: hsla(var(--lightBlue), .35);
         }
      }

      mark {
         background: hsla(var(--gold), .35);
         color: inherit;
      }
   }
}

.te-search__close {
   flex: 0 0 auto;
   display: inline-flex;
   align-items: center;
   justify-content: center;
   width: 44px;
   height: 44px;
   border: 0;
   border-radius: 50%;
   background: transparent;
   color: hsl(var(--blue));
   font-size: 28px;
   line-height: 1;
   cursor: pointer;
   transition: background-color var(--transition-time);

   &:hover,
   &:focus-visible {
      background: hsla(var(--blue), .1);
   }
}

@media (width < 576px) {

   .te-search__inner {
      padding-block: var(--space-4);

      button[type="submit"],
      .btn {
         padding: 0 var(--space-4);
      }
   }
}

/* ==========================================================================
   Oldalszerkezet
   ========================================================================== */

.te-main {
   display: block;

   &:focus {
      outline: none;
   }
}

.te-breadcrumbs {
   border-bottom: 1px solid hsla(var(--black), .08);
   font-size: 13px;
   font-weight: 500;

   .container {
      padding-block: var(--space-4);
   }
}

/* Morzsamenü:  ⌂ / Szülő / Aktuális oldal */
.te-crumbs__list {
   display: flex;
   flex-wrap: wrap;
   align-items: center;
   gap: 4px 0;
   margin: 0;
   padding: 0;
   list-style: none;
   line-height: 1.4;
}

.te-crumbs__item {
   display: inline-flex;
   align-items: center;
   color: hsla(var(--midGray), .85);

   & + &::before {
      content: '/';
      margin-inline: 10px;
      color: hsla(var(--black), .25);
      font-weight: 400;
   }

   a {
      color: hsla(var(--midGray), .85);
      text-decoration: none;
      transition: color var(--transition-time);

      &:hover,
      &:focus-visible {
         color: hsl(var(--blue));
         text-decoration: underline;
         text-underline-offset: 3px;
      }
   }

   &.is-current {
      color: hsl(var(--blue));
      font-weight: 700;
   }
}

.te-crumbs__home {
   display: inline-flex;
   align-items: center;
   padding: 2px;

   /* a megadott home.svg kék ikon – a .te-crumbs__item a szürke linkszínt írná rá */
   .te-crumbs__item & {
      color: hsl(var(--blue));
   }

   svg {
      display: block;
   }
}

@media (width < 576px) {
   .te-crumbs__item + .te-crumbs__item::before {
      margin-inline: 7px;
   }
}

.te-page {
   display: grid;
   grid-template-columns: minmax(0, 1fr);
   gap: var(--space-7) var(--space-8);
   padding-block: var(--space-7);

   .te--has-sidebar & {
      grid-template-columns: minmax(0, 1fr) minmax(280px, 340px);
   }
}

.te-page__sidebar {
   display: flex;
   flex-direction: column;
   gap: var(--space-5);
}

@media (width < 1040px) {
   .te--has-sidebar .te-page {
      grid-template-columns: minmax(0, 1fr);
   }
}

.te-article__title {
   margin-bottom: var(--space-5);
   color: hsl(var(--blue));
   font-weight: 700;
   font-size: var(--fs-2xl);
   line-height: 1.1;
}

/* Beágyazott tartalom (YouTube, Vimeo, térkép, űrlap…) ne nyomja szét a keskeny nézetet.
   A videók a szélességhez igazodva 16:9 arányban skálázódnak; a többi iframe csak
   legfeljebb 100% széles lehet (a megadott magassága marad). */
#content :is(article, .te-page__main) :is(iframe, embed, object, video) {
   max-width: 100% !important;
}

#content :is(article, .te-page__main) video {
   height: auto;
}

#content :is(article, .te-page__main) :is(
   iframe[src*="youtube.com"],
   iframe[src*="youtube-nocookie.com"],
   iframe[src*="youtu.be"],
   iframe[src*="player.vimeo.com"],
   iframe[src*="facebook.com/plugins/video"],
   iframe[src*="indavideo.hu"]
) {
   width: 100%;
   height: auto !important; /* a szerkesztő gyakran inline magasságot is ír */
   aspect-ratio: 16 / 9;
}

/* rendszerüzenetek */
#system-message-container {
   max-width: var(--container-max);
   margin-inline: auto;
   padding-inline: var(--container-pad);

   joomla-alert,
   .alert {
      display: block;
      margin-top: var(--space-5);
      padding: var(--space-3) var(--space-4);
      border-left: 4px solid hsl(var(--gold));
      border-radius: var(--radius);
      background-color: hsla(var(--gold), .12);
      color: hsl(var(--darkBlue));
   }
}

/* ==========================================================================
   Lábléc
   ========================================================================== */

.te-footer {
   position: relative;
   overflow: hidden;
   border-top: 8px solid hsl(var(--gold));
   background-color: hsl(var(--blue));
   color: hsla(var(--white), .85);
   font-size: 14px;

   a {
      color: hsla(var(--white), .9);
      text-decoration: none;

      &:hover,
      &:focus-visible {
         color: hsl(var(--white));
         text-decoration: underline;
         text-underline-offset: 3px;
      }
   }
}

/* "tf" vízjel a jobb alsó sarokban (media/images/watermark.svg, CSS maszkként: a színét
   a háttérszín adja) – nagyjából a menüoszlopok feléig ér fel, alul kilóg a láblécből. */
.te-footer {
   --te-mark-h: clamp(240px, 38vw, 540px);
}

.te-footer > .container {
   position: relative;
   z-index: 1;
}

.te-footer__mark {
   position: absolute;
   right: clamp(-40px, -2vw, 0px);
   bottom: calc(var(--te-mark-h) * -.16);
   z-index: 0;
   display: block;
   height: var(--te-mark-h);
   aspect-ratio: 1483 / 1644;
   background-color: hsla(var(--white), .07);
   -webkit-mask: url('../images/watermark.svg') center / contain no-repeat;
   mask: url('../images/watermark.svg') center / contain no-repeat;
   pointer-events: none;
}

@media (width < 768px) {
   .te-footer {
      --te-mark-h: 200px;
   }
}

.te-footer__menus {
   display: grid;
   grid-template-columns: repeat(6, minmax(0, 1fr));
   gap: var(--space-6) var(--space-5);
   padding-block: var(--space-7);
   border-bottom: 1px solid hsla(var(--white), .15);

   @media (width < 1040px) {
      grid-template-columns: repeat(3, minmax(0, 1fr));
   }

   @media (width < 768px) {
      grid-template-columns: repeat(2, minmax(0, 1fr));
   }

   @media (width < 576px) {
      grid-template-columns: minmax(0, 1fr);
      gap: 0;
      padding-block: var(--space-5) 0;
      border-bottom: 0;
   }
}

.te-footmenu__title {
   margin-bottom: var(--space-4);
   font-size: 14px;
   line-height: 1.2;
}

.te-footmenu__toggle {
   padding: 0;
   border: 0;
   background: none;
   color: hsl(var(--gold));
   font-weight: 700;
   letter-spacing: var(--tracking-caps);
   text-transform: uppercase;
   text-align: left;
   pointer-events: none;
}

.te-footmenu__list {
   display: flex;
   flex-direction: column;
   gap: 9px;

   /* címsor/elválasztó típusú pont (pl. csoportcím a menüben) */
   .is-heading > span {
      color: hsla(var(--white), .6);
      font-size: 12px;
      letter-spacing: var(--tracking-caps);
      text-transform: uppercase;
   }

   .te-footmenu__sub {
      display: flex;
      flex-direction: column;
      gap: 7px;
      margin-top: 7px;
      padding-left: var(--space-3);
      border-left: 1px solid hsla(var(--white), .2);
   }

   .active > a {
      color: hsl(var(--white));
      font-weight: 700;
   }
}

@media (width < 576px) {

   .te-footer__col {
      border-bottom: 1px solid hsla(var(--white), .15);
   }

   .te-footmenu__title {
      margin: 0;
   }

   .te-footmenu__toggle {
      position: relative;
      width: 100%;
      padding: 16px 32px 16px 0;
      pointer-events: auto;
      cursor: pointer;

      &::after {
         content: '';
         position: absolute;
         right: 4px;
         top: 50%;
         width: 9px;
         height: 9px;
         border-right: 2px solid currentColor;
         border-bottom: 2px solid currentColor;
         transform: translateY(-70%) rotate(45deg);
         transition: transform var(--transition-time);
      }

      &[aria-expanded="true"]::after {
         transform: translateY(-30%) rotate(-135deg);
      }
   }

   .te-footmenu__list {
      padding-bottom: var(--space-4);

      &[hidden] {
         display: none;
      }
   }
}

.te-footer__info {
   display: grid;
   grid-template-columns: 1fr 1fr 1fr;
   align-items: center;
   gap: var(--space-5);
   padding-block: var(--space-6);
   border-bottom: 1px solid hsla(var(--white), .15);

   @media (width < 768px) {
      grid-template-columns: minmax(0, 1fr);
   }
}

.te-footer__logo img {
   display: block;
   width: auto;
   height: 64px;
}

.te-footer__address {
   font-style: normal;
   line-height: 1.6;
}

.te-footer__note {
   display: flex;
   align-items: center;
   gap: var(--space-4);
   color: hsla(var(--white), .75);
   line-height: 1.6;

   img {
      flex: 0 0 auto;
      width: 44px;
      height: auto;
   }

   p {
      max-width: 360px;
   }
}

.te-footer__bottom {
   display: flex;
   flex-wrap: wrap;
   align-items: center;
   justify-content: space-between;
   gap: var(--space-3) var(--space-5);
   padding-block: var(--space-5);
   color: hsla(var(--white), .6);
   font-size: 13px;
}

.te-legal {
   display: flex;
   flex-wrap: wrap;

   li + li::before {
      content: '·';
      margin-inline: 10px;
      color: hsla(var(--white), .4);
   }

   a {
      color: hsla(var(--white), .7);
      letter-spacing: .04em;
   }
}

/* ==========================================================================
   Nyomtatás
   ========================================================================== */

@media print {
   .te-topbar,
   .te-nav,
   .te-burger,
   .te-search,
   .te-search-toggle,
   .te-masthead__cta,
   .te-footer__menus,
   .te-skip-link {
      display: none !important;
   }
}