/* ============================================================
   QOSTUM · Botón de idioma (i18n)  ·  v=20260612a
   Sutil, alineado con el toggle de tema. Claro por defecto;
   variante oscura bajo html[data-theme="dark"].
   ============================================================ */
.qostum-lang { position: relative; display: inline-flex; flex-shrink: 0; }

.qostum-lang-btn {
  display: inline-flex; align-items: center; gap: 5px;
  height: 30px; padding: 0 8px;
  border: none; border-radius: 6px;
  background: transparent; color: #9ca3af; cursor: pointer;
  font: 600 12px/1 inherit; letter-spacing: .02em;
  transition: background .15s, color .15s;
}
.qostum-lang-btn:hover { background: rgba(0,0,0,.06); color: #4b5563; }
.qostum-lang-btn .qlang-globe { width: 16px; height: 16px; }
.qostum-lang-btn .qlang-chev { width: 11px; height: 11px; opacity: .7; }
.qostum-lang-btn .qlang-code { font-weight: 700; }

.qostum-lang-menu {
  position: absolute; top: calc(100% + 6px); right: 0; z-index: 4000;
  min-width: 168px; padding: 5px;
  background: #fff; border: 1px solid #e5e7eb; border-radius: 10px;
  box-shadow: 0 10px 28px rgba(0,0,0,.14);
}
.qostum-lang-menu[hidden] { display: none; }
.qostum-lang-menu [data-lang] {
  display: flex; align-items: center; gap: 10px; width: 100%;
  padding: 8px 10px; border: none; border-radius: 7px;
  background: transparent; color: #374151; cursor: pointer;
  font: 500 13px/1 inherit; text-align: left;
}
.qostum-lang-menu [data-lang]:hover { background: #f3f4f6; }
.qostum-lang-menu [data-lang][aria-current="true"] { color: #D97D55; font-weight: 700; }
.qostum-lang-menu .qlang-flag {
  display: inline-flex; align-items: center; justify-content: center;
  width: 26px; height: 18px; flex-shrink: 0;
  border-radius: 3px; background: #eef0f2; color: #6b7280;
  font: 700 10px/1 inherit; letter-spacing: .03em;
}
.qostum-lang-menu [data-lang][aria-current="true"] .qlang-flag { background: #FEF3EC; color: #D97D55; }

@media (hover: none) and (pointer: coarse) {
  .qostum-lang-btn { height: 40px; padding: 0 10px; }
}

/* ---- Modo oscuro ---- */
html[data-theme="dark"] .qostum-lang-btn:hover { background: rgba(255,255,255,.08); color: var(--qd-text); }
html[data-theme="dark"] .qostum-lang-menu {
  background: var(--qd-elevated); border-color: var(--qd-border);
  box-shadow: 0 12px 30px rgba(0,0,0,.5);
}
html[data-theme="dark"] .qostum-lang-menu [data-lang] { color: var(--qd-text); }
html[data-theme="dark"] .qostum-lang-menu [data-lang]:hover { background: var(--qd-surface-2); }
html[data-theme="dark"] .qostum-lang-menu .qlang-flag { background: var(--qd-surface-2); color: var(--qd-text-muted); }
html[data-theme="dark"] .qostum-lang-menu [data-lang][aria-current="true"] { color: #e6a886; }
html[data-theme="dark"] .qostum-lang-menu [data-lang][aria-current="true"] .qlang-flag { background: #33261d; color: #e6a886; }