/* Phase 9C.5A2 – Dreisprachen-Prototyp DE/ES/EN */
/* Vier kontrollierte Desktop-Spalten: Marke, Navigation, Sprache, Mini-Logo. */
.topbar{grid-template-columns:minmax(300px,1fr) auto auto 48px;gap:12px}
.language-switcher{
  display:flex;align-items:center;gap:4px;margin-left:auto;padding:4px;
  border:1px solid rgba(138,87,5,.68);border-radius:12px;background:rgba(255,245,218,.72);
}
.language-switcher a{
  display:inline-flex;align-items:center;justify-content:center;min-width:38px;min-height:34px;
  padding:4px 8px;border-radius:8px;color:#2b1908;text-decoration:none;font-weight:400;
  font-family:var(--font-ui,system-ui,-apple-system,"Segoe UI",Arial,Helvetica,sans-serif);
  font-style:normal;
  line-height:1.2;
  letter-spacing:0;
}
.language-switcher a:hover,.language-switcher a:focus-visible{background:#f4cd64;outline:2px solid #2b1908;outline-offset:2px}
.language-switcher a.active{background:linear-gradient(180deg,#f4cd64 0%,#d9a52c 54%,#b9780c 100%);box-shadow:inset 0 0 0 1px #fff2b9;color:#160d05;font-weight:400}
.prototype-notice{margin:18px auto 0;max-width:980px;padding:12px 16px;border:1px solid #a56b0a;border-radius:14px;background:#fff5da;color:#2b1908;box-shadow:0 6px 18px rgba(43,25,8,.08)}
.prototype-notice strong{color:#8a5705}
.prototype-original-link{position:relative}
.prototype-badge{display:inline-block;margin-top:6px;padding:2px 7px;border-radius:999px;background:#f8ebcb;border:1px solid #c79b3b;color:#5a3b0d;font-size:.75rem;font-weight:700}
.prototype-search-results{max-width:760px;margin:10px auto 0;text-align:left}
.prototype-search-results[hidden]{display:none}
.prototype-search-results h2{font-size:1rem;margin:.5rem 0}
.prototype-search-results ul{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.prototype-search-results a{display:block;padding:9px 11px;border-radius:10px;border:1px solid rgba(165,107,10,.5);background:#fff5da;color:#2b1908;text-decoration:none}
.prototype-search-results a:hover,.prototype-search-results a:focus-visible{background:#f8ebcb;outline:2px solid #8a5705;outline-offset:2px}
.prototype-card-section{margin-top:22px}
.prototype-card-section .cards-grid{margin-top:14px}
.prototype-glossary-grid{display:grid;gap:16px}
.prototype-glossary-entry[hidden]{display:none}
.prototype-glossary-entry .source-links{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.prototype-glossary-entry .source-links a{font-size:.9rem}
.prototype-glossary-status{margin:.5rem 0 1rem;font-weight:700;color:#6c4307}
.prototype-qr-status{font-family:var(--font-ui);font-size:.92rem}
.topbar .mini-logo{margin-left:0}
@media (max-width:1120px){
  .topbar{grid-template-columns:1fr auto}
  .language-switcher{order:4;width:100%;justify-content:center;margin:8px 0 0}
}
@media (max-width:760px){
  .language-switcher{gap:6px}
  .language-switcher a{min-width:44px;min-height:44px}
  .prototype-notice{margin:12px 14px 0}
}

/* Phase 9C.5A3O – Sprachschalter mit Länderflaggen und ausgeschriebenen Sprachnamen */
.language-switcher a{
  gap:6px;min-width:auto;white-space:nowrap;padding:4px 7px;font-size:.8rem;
}
.language-switcher .language-flag{
  display:block;width:24px;height:16px;object-fit:cover;flex:0 0 auto;
  border:1px solid rgba(43,25,8,.42);border-radius:3px;
  box-shadow:0 1px 2px rgba(43,25,8,.16);
}
.language-switcher .language-name{display:inline-block;font-family:var(--font-ui,system-ui,-apple-system,"Segoe UI",Arial,Helvetica,sans-serif);font-size:inherit;font-weight:400;font-style:normal;line-height:inherit;letter-spacing:0}
@media (max-width:760px){
  .language-switcher a{padding:5px 8px;font-size:.78rem}
  .language-switcher .language-flag{width:25px;height:17px}
}



/* Phase 9C.5A3S KORRIGIERT – Root und Sprachseiten ohne rechtes Mini-Logo */
.topbar.header-without-mini-logo{grid-template-columns:minmax(300px,1fr) auto auto;}
@media (max-width:1120px){
  .topbar.header-without-mini-logo{grid-template-columns:1fr auto;}
  .topbar.header-without-mini-logo .language-switcher{grid-column:1 / -1;}
}

/* Phase 9C.5A3X – Glossar-Suchbereich DE/ES/EN visuell optimiert */
.intro-card label[for^="glossary-search-"]{
  display:block;
  width:auto;
  margin:18px 0 7px;
  box-sizing:border-box;
  color:#4f3210;
  font-weight:800;
  line-height:1.35;
}
.intro-card input[data-i18n-glossary-search]{
  display:block;
  width:100%;
  max-width:none;
  min-height:46px;
  box-sizing:border-box;
  margin:0;
  padding:11px 14px;
  border:1px solid rgba(166,104,10,.72);
  border-radius:10px;
  background:rgba(255,252,241,.96);
  color:#2b1908;
  font:inherit;
  line-height:1.35;
  box-shadow:inset 0 1px 2px rgba(72,39,0,.08);
}
.intro-card input[data-i18n-glossary-search]::placeholder{
  color:#776b5c;
  opacity:1;
}
.intro-card input[data-i18n-glossary-search]:hover{
  border-color:#9f6209;
}
.intro-card input[data-i18n-glossary-search]:focus-visible{
  border-color:#7c4c08;
  outline:3px solid rgba(151,82,168,.46);
  outline-offset:2px;
  background:#fffdf6;
}
@media(max-width:760px){
  .intro-card label[for^="glossary-search-"]{
    margin:16px 0 6px;
  }
  .intro-card input[data-i18n-glossary-search]{
    min-height:48px;
    padding:12px 13px;
    font-size:16px;
  }
}

/* Phase 9C.5A3V – alphabetischer Glossarfilter */
.glossary-alphabet{
  display:flex;
  flex-wrap:wrap;
  gap:7px;
  margin:16px 0 10px;
}
.glossary-alphabet button{
  display:inline-grid;
  place-items:center;
  box-sizing:border-box;
  min-width:36px;
  height:36px;
  padding:0 8px;
  border:1px solid #bd7d18;
  border-radius:999px;
  background:#fff7df;
  color:#6d3c00;
  font:800 .9rem/1 var(--font-ui);
  cursor:pointer;
}
.glossary-alphabet button:hover:not(:disabled),
.glossary-alphabet button:focus-visible{
  background:#f1d18b;
  outline:3px solid rgba(151,82,168,.46);
  outline-offset:2px;
}
.glossary-alphabet button.active{
  border-color:#7c4c08;
  background:linear-gradient(180deg,#f4cd64 0%,#d9a52c 54%,#b9780c 100%);
  box-shadow:inset 0 0 0 1px #fff2b9;
  color:#160d05;
}
/* Phase 9C.5A3Y – inaktive Alphabetbuchstaben visuell beruhigt */
.glossary-alphabet button:disabled{
  opacity:.58;
  border-color:rgba(166,104,10,.34);
  border-style:solid;
  background:rgba(255,247,223,.58);
  color:rgba(109,60,0,.66);
  box-shadow:none;
  cursor:default;
  text-decoration:none;
}
@media(max-width:760px){
  .glossary-alphabet{gap:7px}
  .glossary-alphabet button{min-width:44px;height:44px;padding:0 10px}
}

/* PHASE 9C.5A4D3O4B1C – global header parity and safe language-switcher geometry */
@media (min-width:1241px) and (max-width:1320px){
  .topbar.header-without-mini-logo{gap:8px;}
  .topbar.header-without-mini-logo .nav{gap:24px;font-size:14px;}
  .topbar.header-without-mini-logo .language-switcher a{gap:4px;padding-inline:5px;font-size:.76rem;}
}
@media (min-width:1121px) and (max-width:1240px){
  .topbar.header-without-mini-logo{grid-template-columns:1fr auto;}
  .topbar.header-without-mini-logo .nav-toggle{display:block;}
  .topbar.header-without-mini-logo .nav{
    display:none;position:absolute;right:18px;top:100%;flex-direction:column;align-items:stretch;gap:0;
    min-width:230px;padding:8px;background:#fff1cf;border:1px solid #b8790b;box-shadow:var(--shadow);
  }
  .topbar.header-without-mini-logo .nav.open{display:flex;}
  .topbar.header-without-mini-logo .nav a{padding:9px 13px;}
  .topbar.header-without-mini-logo .language-switcher{grid-column:1 / -1;order:4;width:100%;justify-content:center;margin:8px 0 0;}
}



/* PHASE 9C.5A4D3O4B1P – kompakter, sprachparitätischer Global-Header */
@media (min-width:1241px){
  .topbar.header-without-mini-logo{
    min-height:78px;
    padding:6px 26px 6px 30px;
    grid-template-columns:minmax(270px,1fr) auto auto;
    gap:14px;
  }
  .topbar.header-without-mini-logo .brand{gap:11px;}
  .topbar.header-without-mini-logo .brand img{width:56px;height:56px;}
  .topbar.header-without-mini-logo .brand-word{font-size:25px;}
  .topbar.header-without-mini-logo .brand-tag{margin-top:5px;font-size:10.5px;}
  .topbar.header-without-mini-logo .nav{gap:22px;font-size:14px;}
  .topbar.header-without-mini-logo .nav a{padding:10px 0 7px;}
  .topbar.header-without-mini-logo .language-switcher{
    gap:3px;
    margin:0;
    padding:3px;
    border-color:rgba(138,87,5,.40);
    border-radius:10px;
    background:rgba(255,245,218,.58);
  }
  .topbar.header-without-mini-logo .language-switcher a{
    min-height:30px;
    gap:4px;
    padding:3px 6px;
    font-size:.76rem;
  }
  .topbar.header-without-mini-logo .language-switcher .language-flag{width:22px;height:15px;}
}
@media (min-width:1241px) and (max-width:1400px){
  .topbar.header-without-mini-logo{gap:10px;padding-inline:22px;}
  .topbar.header-without-mini-logo .brand{gap:10px;}
  .topbar.header-without-mini-logo .brand-word{font-size:22px;letter-spacing:.035em;}
  .topbar.header-without-mini-logo .brand-tag{font-size:9.25px;letter-spacing:.055em;}
  .topbar.header-without-mini-logo .nav{gap:16px;font-size:13.5px;}
  .topbar.header-without-mini-logo .language-switcher a{gap:3px;padding-inline:5px;font-size:.73rem;}
}
@media (min-width:761px) and (max-width:1240px){
  .topbar.header-without-mini-logo{
    min-height:74px;
    padding:6px 18px 6px 22px;
    grid-template-columns:minmax(230px,1fr) auto auto;
    gap:10px;
  }
  .topbar.header-without-mini-logo .brand{gap:10px;}
  .topbar.header-without-mini-logo .brand img{width:54px;height:54px;}
  .topbar.header-without-mini-logo .brand-word{font-size:23px;}
  .topbar.header-without-mini-logo .brand-tag{margin-top:4px;font-size:10px;}
  .topbar.header-without-mini-logo .nav-toggle{display:block;min-width:60px;padding:7px 10px;}
  .topbar.header-without-mini-logo .language-switcher{
    grid-column:auto;
    order:initial;
    width:auto;
    justify-content:flex-end;
    gap:3px;
    margin:0;
    padding:3px;
    border-radius:10px;
  }
  .topbar.header-without-mini-logo .language-switcher a{min-height:32px;gap:4px;padding:3px 6px;font-size:.75rem;}
  .topbar.header-without-mini-logo .language-switcher .language-flag{width:22px;height:15px;}
}
@media (max-width:760px){
  .topbar.header-without-mini-logo{
    min-height:0;
    padding:6px 10px 7px;
    grid-template-columns:1fr auto;
    gap:5px 8px;
  }
  .topbar.header-without-mini-logo .brand{gap:9px;}
  .topbar.header-without-mini-logo .brand img{width:50px;height:50px;}
  .topbar.header-without-mini-logo .brand-word{font-size:19px;}
  .topbar.header-without-mini-logo .brand-tag{margin-top:3px;font-size:8.5px;}
  .topbar.header-without-mini-logo .language-switcher{
    grid-column:1 / -1;
    order:4;
    width:100%;
    justify-content:center;
    gap:4px;
    margin:1px 0 0;
    padding:2px;
    border-radius:9px;
  }
  .topbar.header-without-mini-logo .language-switcher a{min-height:42px;gap:4px;padding:4px 7px;font-size:.75rem;}
  .topbar.header-without-mini-logo .language-switcher .language-flag{width:24px;height:16px;}
}
@media (max-width:420px){
  .topbar.header-without-mini-logo .brand-tag{display:none;}
  .topbar.header-without-mini-logo .language-switcher a{padding-inline:5px;}
}

/* PHASE 9C.5A4D3O4B1X – geräteübergreifender Schutz vor Bildverzerrung
   Logos und Wissensmarken verwenden immer ihr intrinsisches Seitenverhältnis.
   Dadurch können mobile Browser keine quadratischen Markenbilder durch feste
   Breiten-/Höhenkombinationen stauchen oder strecken. */
.theme-symbol-img,
img[src="/assets/bitcoinlumbus-logo.png"]{
  height:auto !important;
  aspect-ratio:auto !important;
  object-fit:contain !important;
  object-position:center !important;
}

/* Sprachflaggen besitzen nicht alle dasselbe natürliche Seitenverhältnis
   (insbesondere EN/UK). Deshalb wird nur die Höhe festgelegt. */
.language-switcher .language-flag{
  width:auto !important;
  height:15px !important;
  max-width:none !important;
  aspect-ratio:auto !important;
  object-fit:contain !important;
  object-position:center !important;
}
@media(max-width:760px){
  .language-switcher .language-flag{
    width:auto !important;
    height:16px !important;
  }
}

/* B1X mobile flex/grid safeguard: Bildmarken dürfen in engen Flexzeilen
   nicht ausschließlich in der Breite zusammengeschoben werden. */
.theme-symbol-img,
img[src="/assets/bitcoinlumbus-logo.png"],
.language-switcher .language-flag{
  flex-shrink:0 !important;
}

/* B1X – sehr schmale Smartphones: Markenwort und Menü dürfen sich nicht überlagern. */
@media(max-width:330px){
  .topbar.header-without-mini-logo .brand{gap:7px;}
  .topbar.header-without-mini-logo .brand img{
    width:42px !important;
    height:auto !important;
  }
  .topbar.header-without-mini-logo .brand-word{font-size:16px;letter-spacing:.035em;}
  .topbar.header-without-mini-logo .nav-toggle{padding:7px 9px;font-size:15px;}
}

/* SCHRITT 21 – einheitliche Sprachbutton-Schriftgröße auf allen Viewports */
.language-switcher a,
.topbar.header-without-mini-logo .language-switcher a{
  font-size:13px;
}