/* ==========================================================================
   LANGUAGE SWITCHER
   Self-contained: nothing here touches style.css, so it cannot disturb the
   existing design. Delete this file and the two lines in header.php to remove.
   ========================================================================== */

/* --- hide Google's own toolbar, which otherwise pushes the whole page down - */
.goog-te-banner-frame,
.skiptranslate iframe,
#goog-gt-tt,
.goog-te-balloon-frame { display: none !important; }
body { top: 0 !important; position: static !important; }
.goog-text-highlight { background: none !important; box-shadow: none !important; }
#google_translate_element { display: none; }

/* --- the panel itself ----------------------------------------------------- */
.langbar{
  position:fixed; left:0; top:50%; transform:translateY(-50%);
  z-index:70; display:flex; align-items:flex-start;
  font-family:'Poppins', system-ui, sans-serif;
}

.langbar__tab{
  display:flex; flex-direction:column; align-items:center; gap:7px;
  padding:16px 9px; border:0; cursor:pointer;
  background:#9B0000; color:#fff;
  border-radius:0 8px 8px 0;
  box-shadow:2px 0 14px -4px rgba(90,0,0,.5);
  transition:background .2s ease;
}
.langbar__tab:hover{ background:#7A0000; }
.langbar__tab span{
  writing-mode:vertical-rl; text-orientation:mixed;
  font-size:11px; letter-spacing:.14em; text-transform:uppercase;
}
.langbar__tab svg{ width:17px; height:17px; fill:#FFD35A; flex-shrink:0; }

.langbar__panel{
  width:0; overflow:hidden; opacity:0; visibility:hidden;
  background:#fff; border:1px solid #E2D6D6; border-left:0;
  border-radius:0 8px 8px 0;
  box-shadow:4px 0 22px -8px rgba(90,0,0,.45);
  transition:width .28s cubic-bezier(.4,0,.2,1), opacity .2s ease, visibility .28s;
}
.langbar.is-open .langbar__panel{ width:206px; opacity:1; visibility:visible; }
.langbar.is-open .langbar__tab{ border-radius:0; }

.langbar__head{
  padding:11px 14px; background:#FBF6F6; border-bottom:1px solid #E2D6D6;
  font-size:11px; letter-spacing:.13em; text-transform:uppercase; color:#8A7A7A;
  white-space:nowrap;
}
.langbar__list{ list-style:none; margin:0; padding:6px; max-height:52vh; overflow-y:auto; }
.langbar__opt{
  display:flex; align-items:center; gap:10px; width:100%;
  padding:9px 11px; border:0; background:none; cursor:pointer;
  border-radius:4px; font-size:14.5px; color:#2B2B2B; text-align:left;
  white-space:nowrap;
}
.langbar__opt:hover{ background:#F7E9E9; }
.langbar__opt.is-current{ background:#9B0000; color:#fff; font-weight:600; }
.langbar__opt small{ font-size:11px; opacity:.65; margin-left:auto; }
.langbar__note{
  padding:9px 13px; border-top:1px solid #E2D6D6; background:#FBF6F6;
  font-size:11.5px; color:#8A7A7A; line-height:1.45; white-space:normal;
}

/* --- phones: move it to the bottom so it never covers the content --------- */
@media (max-width:760px){
  .langbar{ top:auto; bottom:0; left:0; right:0; transform:none;
            flex-direction:column-reverse; align-items:stretch; }
  .langbar__tab{ flex-direction:row; justify-content:center; gap:9px;
                 border-radius:0; padding:12px; box-shadow:0 -2px 14px -4px rgba(90,0,0,.5); }
  .langbar__tab span{ writing-mode:horizontal-tb; }
  .langbar__panel{ width:auto; max-height:0; border:0; border-radius:0;
                   transition:max-height .28s ease, opacity .2s ease, visibility .28s; }
  .langbar.is-open .langbar__panel{ width:auto; max-height:60vh; border-top:1px solid #E2D6D6; }
  .langbar__list{ max-height:42vh; }
}

@media print{ .langbar{ display:none; } }