/*!
 * Tudetic — Language switcher (Hummingbird child theme).
 * Professional dropdown with SVG country flags (desktop top-bar), shared flag
 * sprite reused by the mobile menu and the browser-language modal.
 * Created 2026-06-19. Loaded via explicit <link> in header.tpl (CCC-bypass).
 *
 * Every ACTIVE language of ttic_lang is exposed: the .tpl no longer filters
 * (the 2026-06-19 ES/EN/DE allowlist died on 2026-07-19). Sprite ampliado el
 * 2026-07-28 con PL/SV/EL/CS/RO y el 2026-08-05 con CA/DA/FI/HU/SK/SL — al dar
 * de alta un idioma nuevo hay que anadir su .tdc-flag--{iso} AQUI, si no el
 * desplegable lo pinta sin banderita.
 * Flags are data-URI SVGs so there are zero extra requests and they render on
 * Windows (emoji flags do not).
 */

/* ---------- Shared flag sprite (define once, reuse everywhere) ---------- */
.tdc-flag {
  display: inline-block;
  width: 22px;
  height: 16px;
  border-radius: 3px;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  box-shadow: 0 0 0 1px rgba(0, 0, 0, .12) inset;
  flex: 0 0 auto;
  vertical-align: middle;
}
.tdc-flag--es { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 3 2'%3E%3Crect width='3' height='2' fill='%23c60b1e'/%3E%3Crect width='3' height='1' y='.5' fill='%23ffc400'/%3E%3C/svg%3E"); }
.tdc-flag--de { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 5 3'%3E%3Crect width='5' height='3' fill='%23ffce00'/%3E%3Crect width='5' height='2' fill='%23000'/%3E%3Crect width='5' height='1' y='1' fill='%23D00'/%3E%3C/svg%3E"); }
.tdc-flag--en { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 60 30'%3E%3CclipPath id='s'%3E%3Cpath d='M0 0v30h60V0z'/%3E%3C/clipPath%3E%3CclipPath id='t'%3E%3Cpath d='M30 15h30v15zv15H0zH0V0zV0h30z'/%3E%3C/clipPath%3E%3Cg clip-path='url(%23s)'%3E%3Cpath d='M0 0v30h60V0z' fill='%23012169'/%3E%3Cpath d='M0 0l60 30m0-30L0 30' stroke='%23fff' stroke-width='6'/%3E%3Cpath d='M0 0l60 30m0-30L0 30' clip-path='url(%23t)' stroke='%23C8102E' stroke-width='4'/%3E%3Cpath d='M30 0v30M0 15h60' stroke='%23fff' stroke-width='10'/%3E%3Cpath d='M30 0v30M0 15h60' stroke='%23C8102E' stroke-width='6'/%3E%3C/g%3E%3C/svg%3E"); }
.tdc-flag--fr { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 3 2'%3E%3Crect width='3' height='2' fill='%23ED2939'/%3E%3Crect width='2' height='2' fill='%23fff'/%3E%3Crect width='1' height='2' fill='%23002395'/%3E%3C/svg%3E"); }
.tdc-flag--it { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 3 2'%3E%3Crect width='3' height='2' fill='%23CE2B37'/%3E%3Crect width='2' height='2' fill='%23fff'/%3E%3Crect width='1' height='2' fill='%23009246'/%3E%3C/svg%3E"); }
.tdc-flag--pt { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 3 2'%3E%3Crect width='3' height='2' fill='%23DA291C'/%3E%3Crect width='1.2' height='2' fill='%23046A38'/%3E%3Ccircle cx='1.2' cy='1' r='.35' fill='%23FFE900'/%3E%3C/svg%3E"); }
.tdc-flag--nl { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 3 2'%3E%3Crect width='3' height='2' fill='%2321468B'/%3E%3Crect width='3' height='1.33' fill='%23fff'/%3E%3Crect width='3' height='.67' fill='%23AE1C28'/%3E%3C/svg%3E"); }
.tdc-flag--pl { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 5'%3E%3Crect width='8' height='5' fill='%23fff'/%3E%3Crect y='2.5' width='8' height='2.5' fill='%23DC143C'/%3E%3C/svg%3E"); }
.tdc-flag--sv { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 10'%3E%3Crect width='16' height='10' fill='%23006AA7'/%3E%3Crect x='5' width='2' height='10' fill='%23FECC00'/%3E%3Crect y='4' width='16' height='2' fill='%23FECC00'/%3E%3C/svg%3E"); }
.tdc-flag--el { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 27 18'%3E%3Crect width='27' height='18' fill='%230D5EAF'/%3E%3Crect y='2' width='27' height='2' fill='%23fff'/%3E%3Crect y='6' width='27' height='2' fill='%23fff'/%3E%3Crect y='10' width='27' height='2' fill='%23fff'/%3E%3Crect y='14' width='27' height='2' fill='%23fff'/%3E%3Crect width='10' height='10' fill='%230D5EAF'/%3E%3Crect x='4' width='2' height='10' fill='%23fff'/%3E%3Crect y='4' width='10' height='2' fill='%23fff'/%3E%3C/svg%3E"); }
.tdc-flag--cs { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 6 4'%3E%3Crect width='6' height='4' fill='%23fff'/%3E%3Crect y='2' width='6' height='2' fill='%23D7141A'/%3E%3Cpath d='M0 0l3 2-3 2z' fill='%2311457E'/%3E%3C/svg%3E"); }
.tdc-flag--ro { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 3 2'%3E%3Crect width='3' height='2' fill='%23CE1126'/%3E%3Crect width='2' height='2' fill='%23FCD116'/%3E%3Crect width='1' height='2' fill='%23002B7F'/%3E%3C/svg%3E"); }
.tdc-flag--ca { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 27 18'%3E%3Crect width='27' height='18' fill='%23FCDD09'/%3E%3Crect y='2' width='27' height='2' fill='%23DA121A'/%3E%3Crect y='6' width='27' height='2' fill='%23DA121A'/%3E%3Crect y='10' width='27' height='2' fill='%23DA121A'/%3E%3Crect y='14' width='27' height='2' fill='%23DA121A'/%3E%3C/svg%3E"); }
.tdc-flag--da { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 37 28'%3E%3Crect width='37' height='28' fill='%23C8102E'/%3E%3Crect x='12' width='4' height='28' fill='%23fff'/%3E%3Crect y='12' width='37' height='4' fill='%23fff'/%3E%3C/svg%3E"); }
.tdc-flag--fi { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 11'%3E%3Crect width='18' height='11' fill='%23fff'/%3E%3Crect x='5' width='3' height='11' fill='%23002F6C'/%3E%3Crect y='4' width='18' height='3' fill='%23002F6C'/%3E%3C/svg%3E"); }
.tdc-flag--hu { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 6 3'%3E%3Crect width='6' height='3' fill='%23477050'/%3E%3Crect width='6' height='2' fill='%23fff'/%3E%3Crect width='6' height='1' fill='%23CE2939'/%3E%3C/svg%3E"); }
.tdc-flag--sk { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 9 6'%3E%3Crect width='9' height='6' fill='%23EE1C25'/%3E%3Crect width='9' height='4' fill='%230B4EA2'/%3E%3Crect width='9' height='2' fill='%23fff'/%3E%3Cpath d='M1.6 1.8h1.8v1.6c0 1-.9 1.5-.9 1.5s-.9-.5-.9-1.5z' fill='%23EE1C25'/%3E%3Cpath d='M2.4 2.05h.2v1.65h-.2z M2 2.35h1v.2h-1z M1.9 2.85h1.2v.2h-1.2z' fill='%23fff'/%3E%3Cpath d='M1.95 4.3v-.3a.28.28 0 0 1 .3-.05.26.26 0 0 1 .25-.12.26.26 0 0 1 .25.12.28.28 0 0 1 .3.05v.3z' fill='%230B4EA2'/%3E%3C/svg%3E"); }
.tdc-flag--sl { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 9 6'%3E%3Crect width='9' height='6' fill='%23ED1C24'/%3E%3Crect width='9' height='4' fill='%23005DA4'/%3E%3Crect width='9' height='2' fill='%23fff'/%3E%3Cpath d='M1.4.9h1.2v1.15c0 .6-.6.85-.6.85s-.6-.25-.6-.85z' fill='%23ED1C24'/%3E%3Cpath d='M1.5 1h1v1.05c0 .55-.5.72-.5.72s-.5-.17-.5-.72z' fill='%23005DA4'/%3E%3Cpath d='M1.56 2.1l.18-.35.1.14.16-.34.16.34.1-.14.18.35z' fill='%23fff'/%3E%3C/svg%3E"); }

/* ---------- Desktop top-bar dropdown ---------- */
.tdc-lang { position: relative; display: inline-flex; font-size: 13px; }
/* hide the native <select> fallback once JS has enhanced (keeps it for no-JS) */
.tdc-lang__native {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}

.tdc-lang__btn {
  display: inline-flex; align-items: center; gap: 7px;
  background: transparent; border: 1px solid transparent; border-radius: 8px;
  padding: 4px 8px; cursor: pointer; color: inherit; font: inherit;
  line-height: 1; transition: background-color .15s ease, border-color .15s ease;
}
.tdc-lang__btn:hover,
.tdc-lang.is-open .tdc-lang__btn { background: rgba(0, 0, 0, .05); border-color: rgba(0, 0, 0, .08); }
.tdc-lang__name { font-weight: 600; letter-spacing: .2px; }
.tdc-lang__caret { width: 14px; height: 14px; opacity: .6; transition: transform .18s ease; }
.tdc-lang.is-open .tdc-lang__caret { transform: rotate(180deg); }

.tdc-lang__panel {
  position: absolute; top: calc(100% + 8px); right: 0; z-index: 1200;
  min-width: 190px; padding: 6px;
  background: #fff; border: 1px solid rgba(0, 0, 0, .08); border-radius: 12px;
  box-shadow: 0 12px 34px rgba(0, 0, 0, .16), 0 2px 8px rgba(0, 0, 0, .08);
  opacity: 0; visibility: hidden; transform: translateY(-6px);
  transition: opacity .16s ease, transform .16s ease, visibility .16s;
}
/* open on hover (no-JS friendly) and on JS class */
.tdc-lang:hover .tdc-lang__panel,
.tdc-lang.is-open .tdc-lang__panel { opacity: 1; visibility: visible; transform: translateY(0); }
.tdc-lang__panel::before { /* hover bridge so it doesn't close in the 8px gap */
  content: ""; position: absolute; top: -8px; left: 0; right: 0; height: 8px;
}

.tdc-lang__opt {
  display: flex; align-items: center; gap: 10px;
  padding: 9px 10px; border-radius: 8px; text-decoration: none;
  color: #1a1a2e; font-weight: 500; white-space: nowrap;
  transition: background-color .12s ease;
}
.tdc-lang__opt:hover { background: #f3f4f8; color: #1a1a2e; }
.tdc-lang__opt.is-current { background: #eef1ff; color: #2540d8; font-weight: 700; }
.tdc-lang__opt .tdc-lang__check { margin-left: auto; width: 16px; height: 16px; opacity: 0; color: #2540d8; }
.tdc-lang__opt.is-current .tdc-lang__check { opacity: 1; }

/* ---------- Loading overlay (perceived speed while the new lang renders) ---------- */
.tdc-lang-loading {
  position: fixed; inset: 0; z-index: 4000;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 16px;
  background: rgba(255, 255, 255, .78); backdrop-filter: blur(2px);
  opacity: 0; visibility: hidden; transition: opacity .18s ease, visibility .18s;
}
.tdc-lang-loading.is-on { opacity: 1; visibility: visible; }
.tdc-lang-loading__spin {
  width: 44px; height: 44px; border-radius: 50%;
  border: 4px solid rgba(37, 64, 216, .18); border-top-color: #2540d8;
  animation: tdcLangSpin .8s linear infinite;
}
.tdc-lang-loading__txt { font-size: 14px; font-weight: 600; color: #1a1a2e; }
@keyframes tdcLangSpin { to { transform: rotate(360deg); } }

/* ---------- Browser-language modal ---------- */
.tdc-langmodal {
  position: fixed; inset: 0; z-index: 4100;
  display: flex; align-items: center; justify-content: center; padding: 20px;
  background: rgba(15, 17, 33, .55);
  opacity: 0; visibility: hidden; transition: opacity .2s ease, visibility .2s;
}
.tdc-langmodal.is-on { opacity: 1; visibility: visible; }
.tdc-langmodal__card {
  width: 100%; max-width: 380px; background: #fff; border-radius: 18px;
  padding: 26px 24px 22px; text-align: center;
  box-shadow: 0 24px 64px rgba(0, 0, 0, .32);
  transform: translateY(10px) scale(.98); transition: transform .22s cubic-bezier(.2,.8,.3,1);
}
.tdc-langmodal.is-on .tdc-langmodal__card { transform: translateY(0) scale(1); }
.tdc-langmodal__flag { width: 56px; height: 40px; margin: 0 auto 14px; border-radius: 7px; }
.tdc-langmodal__title { margin: 0 0 6px; font-size: 20px; font-weight: 800; color: #14142b; }
.tdc-langmodal__body { margin: 0 0 20px; font-size: 14px; line-height: 1.5; color: #4a4a63; }
.tdc-langmodal__actions { display: flex; flex-direction: column; gap: 10px; }
.tdc-langmodal__yes {
  display: inline-flex; align-items: center; justify-content: center; gap: 9px;
  padding: 12px 16px; border: 0; border-radius: 10px; cursor: pointer;
  background: #2540d8; color: #fff; font-size: 15px; font-weight: 700;
  text-decoration: none; transition: background-color .15s ease;
}
.tdc-langmodal__yes:hover { background: #1b32b0; color: #fff; }
.tdc-langmodal__no {
  padding: 10px 16px; border: 0; background: transparent; cursor: pointer;
  color: #6b6b85; font-size: 13px; font-weight: 600;
}
.tdc-langmodal__no:hover { color: #14142b; text-decoration: underline; }

/* ---------- Mobile menu: swap emoji for the SVG sprite ---------- */
.tdc-mm-opt-flag .tdc-flag { width: 24px; height: 17px; }
/* Language flags are SVG (always render). The .tdc-no-flags hack that hides
   the unsupported emoji country flags on Windows must NOT hide these. */
#mobileMenu.tdc-no-flags .tdc-mm-opt-flag--svg {
  display: inline-flex !important; align-items: center; font-size: 0;
}
