/* IOMI r18 — ícones "Selo" (desenhados a partir do logótipo), atalhos azul-marinho e seletor de língua. */

/* ---------- Ícones: traço azul-marinho, corpo suave e um elemento dourado maciço ---------- */
.i .d { fill: currentColor; fill-opacity: 0.13; }
.i .df { fill: currentColor; fill-opacity: 0.13; stroke: none; }
.i .g, .i .af { fill: var(--icon-accent, var(--seal)); stroke: none; }
.i .gs, .i .a { stroke: var(--icon-accent, var(--seal)); }
.i .gs { stroke-width: 2; }
:root[data-theme="planta"] .i .d, :root[data-theme="planta"] .i .df { fill-opacity: 0.16; }
:root[data-theme="planta"] .i { --icon-accent: #E3C47E; }

/* Botões principais (fundo azul-marinho): ícone claro e dourado claro. */
.btn-primary .i { --icon-accent: #E3C47E; }
.btn-primary .i .d, .btn-primary .i .df { fill-opacity: 0.18; }
:root[data-theme="planta"] .btn-primary .i { --icon-accent: #7E5D1D; }

/* Menu: o item atual ganha o corpo um pouco mais marcado. */
.nav a[aria-current="page"] .i .d, .nav a[aria-current="page"] .i .df { fill-opacity: 0.2; }

/* ---------- Atalhos do início: quadrados azul-marinho, como o selo IOMI ---------- */
.tile-icon {
  width: 3.1rem; height: 3.1rem; border-radius: 15px; color: #F7F2E6; --icon-accent: #E3C47E;
  background: radial-gradient(120% 120% at 28% 0%, #0B4A8A 0%, #012B57 46%, #001A36 100%);
  box-shadow: inset 0 0 0 1px rgba(227, 196, 126, 0.5), 0 12px 24px -14px rgba(1, 26, 54, 0.75);
}
.tile-icon .i { width: 1.6rem; height: 1.6rem; stroke-width: 1.7; }
.tile-icon .i .d, .tile-icon .i .df { fill-opacity: 0.15; }
.tile:hover .tile-icon { box-shadow: inset 0 0 0 1px #E3C47E, 0 14px 26px -14px rgba(1, 26, 54, 0.85); }
.tile.is-alert .tile-icon {
  background: radial-gradient(120% 120% at 28% 0%, #0B4A8A 0%, #012B57 46%, #001A36 100%);
  box-shadow: inset 0 0 0 2px #C49841, 0 12px 24px -14px rgba(126, 93, 29, 0.6);
}
.tile-count { background: var(--seal); color: #011F40; box-shadow: 0 0 0 2px var(--surface); }
:root[data-theme="planta"] .tile-icon,
:root[data-theme="planta"] .tile.is-alert .tile-icon {
  background: radial-gradient(120% 120% at 28% 0%, #1A4E86 0%, #0E3361 50%, #082447 100%);
  color: #F7F2E6; box-shadow: inset 0 0 0 1px rgba(227, 196, 126, 0.55);
}
:root[data-theme="planta"] .tile.is-alert .tile-icon { box-shadow: inset 0 0 0 2px #D9B25E; }
:root[data-theme="planta"] .tile-count { background: #D9B25E; color: #061A33; }

/* ---------- Língua: Português / English ---------- */
.lang-switch { display: inline-flex; padding: 3px; gap: 2px; border: 1px solid var(--line-strong); border-radius: 999px; background: var(--surface); }
.lang-switch a, .lang-switch span {
  display: inline-flex; align-items: center; min-height: 1.9rem; padding: 0 0.75rem; border-radius: 999px;
  font-size: 0.8rem; font-weight: 600; letter-spacing: 0.02em; color: var(--ink-soft); text-decoration: none;
}
.lang-switch a:hover { color: var(--brand); background: var(--brand-tint); }
.lang-switch [aria-current="true"] { background: var(--brand); color: var(--on-brand, #fff); }
.user-box .lang-switch { margin: 0.25rem 0 0.6rem; width: 100%; }
.user-box .lang-switch a, .user-box .lang-switch span { flex: 1; justify-content: center; }
.guest-lang { position: absolute; top: 1rem; right: 1rem; z-index: 5; }
@media (max-width: 520px) { .guest-lang { top: 0.6rem; right: 0.6rem; } }

/* r18: o botão "Ajuda IOMI" não tapa o texto legal no telemóvel. */
@media (max-width: 520px) { .auth-main { padding-bottom: 5.5rem; } }
