/* The console's Tamil mode (js/i18n). A separate file, so the compiled app.css does not change. */

/*
 * The Tamil letters of the console's font: only the Tamil range, so the English keeps its own letters and this file is fetched only
 * when Tamil is on screen. Mukta Malar (SIL Open Font License), scaled so that every size in the console reads alike in both
 * languages; its tall line metrics are brought down so a line holding Tamil is no taller than one in English.
 */
@font-face { font-family: "Public Sans"; src: url("../lib/fonts/mukta-malar/MuktaMalar-400.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; size-adjust: 95%; ascent-override: 90%; descent-override: 40%; unicode-range: U+964-965, U+B82-BFA, U+200C-200D, U+25CC; }
@font-face { font-family: "Public Sans"; src: url("../lib/fonts/mukta-malar/MuktaMalar-500.woff2") format("woff2"); font-weight: 500; font-style: normal; font-display: swap; size-adjust: 95%; ascent-override: 90%; descent-override: 40%; unicode-range: U+964-965, U+B82-BFA, U+200C-200D, U+25CC; }
@font-face { font-family: "Public Sans"; src: url("../lib/fonts/mukta-malar/MuktaMalar-600.woff2") format("woff2"); font-weight: 600; font-style: normal; font-display: swap; size-adjust: 95%; ascent-override: 90%; descent-override: 40%; unicode-range: U+964-965, U+B82-BFA, U+200C-200D, U+25CC; }
@font-face { font-family: "Public Sans"; src: url("../lib/fonts/mukta-malar/MuktaMalar-700.woff2") format("woff2"); font-weight: 700; font-style: normal; font-display: swap; size-adjust: 95%; ascent-override: 90%; descent-override: 40%; unicode-range: U+964-965, U+B82-BFA, U+200C-200D, U+25CC; }

/* A visitor who chose Tamil does not see the English page first. */
html[data-translating] body { visibility: hidden; }

/* Tamil letters carry marks above and below the line, and spaced letters break apart. */
html[lang="ta"] body * { letter-spacing: normal !important; }

/* Tamil labels run wider: a list's toolbar wraps rather than pushing its Add button off a phone's screen. */
html[lang="ta"] main .flex:has(> a.btn-primary) { flex-wrap: wrap; }

/* The language button. */
.lang-switch {
  display: inline-flex;
  flex: none;
  align-items: center;
  height: 2.25rem;
  padding: 0.125rem;
  border: 1px solid #efe4ec;
  border-radius: 9999px;
  background: #fff;
}
.lang-switch button {
  height: 100%;
  padding: 0 0.625rem;
  border: 0;
  border-radius: 9999px;
  background: transparent;
  color: #1c1022;
  font-family: "Public Sans", system-ui, sans-serif;
  font-size: 0.75rem;
  font-weight: 700;
  line-height: 1;
  white-space: nowrap;
  cursor: pointer;
  transition: background-color 0.15s, color 0.15s;
}
.lang-switch button[lang="ta"] { font-size: 0.875rem; }
.lang-switch button:hover { background: #f9ecf5; }
.lang-switch button.is-active { background: #9e1a83; color: #fff; }
.lang-switch-corner { position: fixed; top: 1rem; right: 1rem; z-index: 50; }

@media print {
  .lang-switch { display: none !important; }
}