/* =========================================================================
   FINS — Selector de idioma do TranslatePress com o desenho do tema
   =========================================================================
   Este ficheiro formata o selector de idioma do plugin TranslatePress
   (shortcode, menu e botão flutuante) para ficar igual ao selector PT/EN
   do tema FINS: pastilha azul com o idioma activo, restantes idiomas em
   texto simples e lista suspensa em cartão branco.

   COMO USAR
   1. Cole todo o conteúdo em Aparência → Personalizar → CSS adicional
      (ou no ficheiro de CSS do tema-filho).
   2. No TranslatePress, em Definições → Language Switcher, no separador
      "Shortcode", escolha:
        - Language names: Short names   → mostra PT / EN
        - Flag icon position: Hide      → sem bandeiras (o CSS também as
          esconde, para o caso de preferir manter a opção ligada)
   3. Coloque o selector no cabeçalho em Aparência → Personalizar →
      Header Options → Idioma → Origem: "Plugin de tradução" ou "Automático".

   Compatível com:
   - TranslatePress 2.x (marcação nova: .trp-shortcode-switcher__wrapper)
   - TranslatePress 1.x (marcação antiga: .trp-ls-shortcode-current-language)
   - Botão flutuante (#trp-floater-ls)
   ========================================================================= */

/* -------------------------------------------------------------------------
   1. Variáveis — herdam o desenho do tema FINS (com valores de recurso)
   ------------------------------------------------------------------------- */
:root {
	--fins-trp-primary: var(--fins-primary, #1e75ba);
	--fins-trp-primary-deep: var(--fins-primary-deep, #0b2c45);
	--fins-trp-primary-light: var(--fins-primary-light, #e8f2fb);
	--fins-trp-dark: var(--fins-dark, #0e1a26);
	--fins-trp-white: #fff;
	--fins-trp-border: var(--fins-border, #e2eaf2);
	--fins-trp-radius: var(--fins-radius-sm, 12px);
	--fins-trp-pill: var(--fins-radius-pill, 999px);
	--fins-trp-font: var(--fins-font-heading, "Montserrat", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif);
	--fins-trp-shadow: var(--fins-shadow-sm, 0 4px 16px rgba(11, 44, 69, .06));
	--fins-trp-pad: 7px 12px;
	--fins-trp-size: .78rem;
}

/* -------------------------------------------------------------------------
   2. Base — limpa o desenho do plugin e alinha com o cabeçalho do tema
   ------------------------------------------------------------------------- */
/* As variáveis são definidas em estilo inline pelo plugin, daí o !important. */
.trp-shortcode-switcher__wrapper {
	--bg: transparent !important;
	--bg-hover: transparent !important;
	--text: currentColor !important;
	--text-hover: currentColor !important;
	--border: 0 !important;
	--border-width: 0 !important;
	--border-color: transparent !important;
	--border-radius: var(--fins-trp-pill) !important;
	--font-size: var(--fins-trp-size) !important;
	--transition-duration: .18s !important;
	display: inline-flex;
	align-items: center;
	vertical-align: middle;
	font-family: var(--fins-trp-font);
}

.trp-shortcode-switcher,
.trp-language-switcher-container .trp-language-switcher {
	background: none !important;
	border: 0 !important;
	border-radius: 0 !important;
	box-shadow: none !important;
	padding: 0 !important;
	/* A lista abre por baixo da pastilha: o plugin fecha-a com max-height,
	   por isso o transbordo pode ficar visível. */
	overflow: visible !important;
}

/* O plugin reserva espaço com a camada "anchor" e coloca por cima a camada
   interactiva. Ambas têm de ter exactamente as mesmas medidas. */
.trp-shortcode-anchor,
.trp-shortcode-overlay {
	border-radius: var(--fins-trp-pill);
}

.trp-current-language-item__wrapper {
	display: flex;
	align-items: center;
	gap: 2px;
	padding-right: 0 !important;
	min-width: 0;
}

/* -------------------------------------------------------------------------
   3. Cada idioma — texto maiúsculo, tipo do tema
   ------------------------------------------------------------------------- */
.trp-shortcode-switcher .trp-language-item,
.trp-language-switcher-container .trp-language-item,
.trp-language-switcher-container .trp-ls-shortcode-current-language > a,
.trp-language-switcher-container .trp-ls-shortcode-language > a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	min-height: 0 !important;
	padding: var(--fins-trp-pad);
	border: 1px solid transparent;
	border-radius: var(--fins-trp-pill);
	color: var(--fins-trp-dark);
	font-family: var(--fins-trp-font);
	font-size: var(--fins-trp-size);
	font-weight: 700;
	letter-spacing: .06em;
	line-height: 1;
	text-transform: uppercase;
	text-decoration: none;
	box-shadow: none;
	transition: background .18s ease, color .18s ease, border-color .18s ease;
}

.trp-language-item-name,
.trp-ls-language-name {
	display: inline-block;
	color: inherit !important;
	font-family: inherit;
	font-size: inherit !important;
	font-weight: inherit;
	letter-spacing: inherit;
	text-transform: inherit;
	line-height: 1;
}

/* Bandeiras escondidas por omissão (o tema usa apenas as siglas PT/EN).
   Para as mostrar, apague ou comente esta regra. */
.trp-shortcode-switcher .trp-flag-image,
.trp-language-switcher-container img.trp-flag-image {
	display: none !important;
}

/* Idioma activo — pastilha preenchida, como no tema */
.trp-shortcode-switcher .trp-language-item__current,
.trp-shortcode-switcher .trp-language-item.trp-language-item__default,
.trp-language-switcher-container .trp-ls-shortcode-current-language,
.trp-language-switcher-container .trp-ls-shortcode-current-language > a {
	background: var(--fins-trp-primary);
	border-color: transparent;
	color: var(--fins-trp-white);
	box-shadow: 0 1px 2px rgba(11, 44, 69, .06);
}

/* Restantes idiomas — texto simples dentro da lista */
.trp-switcher-dropdown-list .trp-language-item,
.trp-language-switcher-container .trp-ls-shortcode-language > a {
	background: transparent !important;
	border-color: transparent;
	color: var(--fins-trp-dark) !important;
	width: 100%;
	justify-content: flex-start;
	border-radius: var(--fins-trp-radius);
}

.trp-switcher-dropdown-list .trp-language-item:hover,
.trp-switcher-dropdown-list .trp-language-item:focus-visible,
.trp-language-switcher-container .trp-ls-shortcode-language > a:hover {
	background: var(--fins-trp-primary-light) !important;
	color: var(--fins-trp-primary) !important;
}

/* Seta do menu suspenso */
.trp-shortcode-arrow {
	width: 16px;
	height: 16px;
	margin-right: 4px;
	opacity: .9;
	transition: transform .2s ease;
}

.trp-shortcode-switcher.is-open .trp-shortcode-arrow,
.trp-shortcode-switcher[aria-expanded="true"] .trp-shortcode-arrow {
	transform: rotate(180deg);
}

/* -------------------------------------------------------------------------
   4. Lista suspensa — cartão branco com a sombra do tema
   ------------------------------------------------------------------------- */
.trp-switcher-dropdown-list,
.trp-language-switcher-container .trp-ls-shortcode-language {
	background: var(--fins-trp-white);
	border: 1px solid var(--fins-trp-border);
	border-radius: var(--fins-trp-radius);
	box-shadow: var(--fins-trp-shadow);
	padding: 6px;
	margin-top: 8px;
	min-width: 96px;
	overflow: hidden;
}

.trp-shortcode-switcher .trp-switcher-dropdown-list {
	flex-direction: column;
}

/* Lista fechada: o plugin fecha-a com max-height: 0, mas o preenchimento e o
   contorno continuavam visíveis (faixa branca por baixo da pastilha). */
.trp-shortcode-switcher .trp-switcher-dropdown-list[hidden],
.trp-floating-switcher .trp-switcher-dropdown-list[hidden],
.trp-switcher-dropdown-list[hidden] {
	padding: 0 !important;
	border-width: 0 !important;
	box-shadow: none !important;
	background: transparent !important;
	min-height: 0 !important;
}

/* A lista sai do fluxo: assim a camada interactiva tem exactamente o
   tamanho da pastilha e a lista abre por baixo dela. */
.trp-shortcode-overlay .trp-switcher-dropdown-list {
	position: absolute;
	left: 0;
	top: 100%;
	width: max-content;
	min-width: 100%;
}

.trp-ls-dropdown.is-open .trp-switcher-dropdown-list,
.trp-ls-dropdown[aria-expanded="true"] .trp-switcher-dropdown-list,
.trp-shortcode-switcher.trp-open-on-hover.is-open .trp-switcher-dropdown-list,
.trp-shortcode-switcher[aria-expanded="true"] .trp-switcher-dropdown-list {
	padding: 6px;
}

.trp-switcher-dropdown-list::-webkit-scrollbar { width: 6px; }
.trp-switcher-dropdown-list::-webkit-scrollbar-thumb {
	background: var(--fins-trp-border);
	border-radius: 99px;
}

/* Marcação antiga (TranslatePress 1.x): lista sempre no fluxo */
.trp-language-switcher-container .trp-ls-shortcode-language {
	position: absolute;
	z-index: 9999;
	display: none;
	flex-direction: column;
}

.trp-language-switcher-container:hover .trp-ls-shortcode-language,
.trp-language-switcher-container:focus-within .trp-ls-shortcode-language {
	display: flex;
}

/* -------------------------------------------------------------------------
   5. Cabeçalho normal do tema — texto escuro
   ------------------------------------------------------------------------- */
.fins-lang--plugin .trp-shortcode-switcher .trp-language-item,
.fins-lang--plugin .trp-current-language-item__wrapper {
	color: var(--fins-trp-dark);
}

/* -------------------------------------------------------------------------
   6. Cabeçalho sobreposto (imagem de destaque) — pastilha clara
   -------------------------------------------------------------------------
   Só se aplica às zonas do cabeçalho; o menu móvel tem regras próprias
   na secção 7.
   ------------------------------------------------------------------------- */
body.fins-header-overlay:not(.fins-header-scrolled) :is(.fins-header-actions, .fins-nav-wrap, .fins-topbar) .fins-lang--plugin .trp-shortcode-switcher .trp-language-item,
body.fins-header-overlay:not(.fins-header-scrolled) :is(.fins-header-actions, .fins-nav-wrap, .fins-topbar) .fins-lang--plugin .trp-shortcode-switcher .trp-language-item__current {
	background: rgba(255, 255, 255, .92);
	border-color: transparent;
	color: var(--fins-trp-primary-deep);
}

body.fins-header-overlay:not(.fins-header-scrolled) :is(.fins-header-actions, .fins-nav-wrap, .fins-topbar) .fins-lang--plugin .trp-shortcode-arrow path {
	stroke: var(--fins-trp-primary-deep);
}

/* A seta fica sobre a fotografia: realça-se com uma sombra clara */
body.fins-header-overlay:not(.fins-header-scrolled) :is(.fins-header-actions, .fins-nav-wrap, .fins-topbar) .fins-lang--plugin .trp-shortcode-arrow {
	filter: drop-shadow(0 1px 2px rgba(255, 255, 255, .55));
	opacity: 1;
}

body.fins-header-overlay:not(.fins-header-scrolled) :is(.fins-header-actions, .fins-nav-wrap, .fins-topbar) .fins-lang--plugin .trp-language-item-name {
	color: inherit;
}

/* Cabeçalho fixo depois de deslizar — volta ao desenho sólido */
body.fins-header-scrolled :is(.fins-header-actions, .fins-nav-wrap) .fins-lang--plugin .trp-shortcode-switcher .trp-language-item__current {
	background: var(--fins-trp-primary);
	color: var(--fins-trp-white);
}

/* -------------------------------------------------------------------------
   7. Menu móvel (painel claro) — texto escuro e pastilha da marca
   ------------------------------------------------------------------------- */
/* O painel do tema é claro: texto escuro e pastilha da marca, mesmo quando
   o cabeçalho está sobreposto à imagem de destaque. */
.fins-mobile-panel .fins-lang--plugin .trp-shortcode-switcher .trp-language-item,
.fins-lang--mobile.fins-lang--plugin .trp-shortcode-switcher .trp-language-item,
body.fins-header-overlay .fins-mobile-panel .fins-lang--plugin .trp-shortcode-switcher .trp-language-item,
body.fins-header-overlay:not(.fins-header-scrolled) .fins-mobile-panel .fins-lang--plugin .trp-shortcode-switcher .trp-language-item {
	color: var(--fins-trp-dark);
}

.fins-mobile-panel .fins-lang--plugin .trp-shortcode-switcher .trp-language-item__current,
.fins-lang--mobile.fins-lang--plugin .trp-shortcode-switcher .trp-language-item__current,
body.fins-header-overlay .fins-mobile-panel .fins-lang--plugin .trp-shortcode-switcher .trp-language-item__current,
body.fins-header-overlay:not(.fins-header-scrolled) .fins-mobile-panel .fins-lang--plugin .trp-shortcode-switcher .trp-language-item__current {
	background: var(--fins-trp-primary);
	color: var(--fins-trp-white);
}

.fins-mobile-panel .fins-lang--plugin .trp-ls-language-name,
.fins-mobile-panel .fins-lang--plugin .trp-language-item-name {
	color: inherit;
}

.fins-mobile-panel .fins-lang--plugin .trp-shortcode-arrow path {
	stroke: var(--fins-trp-dark);
}

.fins-mobile-panel .fins-lang--plugin .trp-switcher-dropdown-list {
	background: var(--fins-trp-white);
	border-color: var(--fins-trp-border);
}

/* -------------------------------------------------------------------------
   8. Barra superior (topbar) — texto claro sobre fundo escuro
   ------------------------------------------------------------------------- */
.fins-topbar .fins-lang--plugin .trp-shortcode-switcher .trp-language-item,
.fins-topbar .fins-lang--plugin .trp-shortcode-arrow path {
	color: rgba(255, 255, 255, .9);
	stroke: rgba(255, 255, 255, .9);
}

.fins-topbar .fins-lang--plugin .trp-shortcode-switcher .trp-language-item__current {
	background: rgba(255, 255, 255, .16);
	color: var(--fins-trp-white);
}

/* -------------------------------------------------------------------------
   9. Botão flutuante do TranslatePress — no desenho do tema
   -------------------------------------------------------------------------
   Marcação nova: .trp-floating-switcher
   Marcação antiga: #trp-floater-ls
   ------------------------------------------------------------------------- */
.trp-floating-switcher {
	/* As variáveis são definidas em estilo inline pelo plugin. */
	--bg: var(--fins-trp-white) !important;
	--bg-hover: var(--fins-trp-primary-light) !important;
	--text: var(--fins-trp-dark) !important;
	--text-hover: var(--fins-trp-primary) !important;
	--border: 1px solid var(--fins-trp-border) !important;
	--border-radius: var(--fins-trp-pill) !important;
	--font-size: var(--fins-trp-size) !important;
	border-radius: var(--fins-trp-pill) !important;
	box-shadow: 0 10px 30px -12px rgba(11, 44, 69, .28) !important;
	overflow: hidden;
	font-family: var(--fins-trp-font);
	z-index: 900;
}

.trp-floating-switcher .trp-language-item {
	background: transparent;
	color: var(--fins-trp-dark);
	font-family: var(--fins-trp-font);
	font-size: var(--fins-trp-size);
	font-weight: 700;
	letter-spacing: .06em;
	line-height: 1;
	text-transform: uppercase;
	padding: var(--fins-trp-pad);
	min-height: 0;
}

.trp-floating-switcher .trp-language-item:hover,
.trp-floating-switcher .trp-language-item:focus-visible {
	background: var(--fins-trp-primary-light);
	color: var(--fins-trp-primary);
}

.trp-floating-switcher img.trp-flag-image {
	display: none !important;
}

.trp-floating-switcher .trp-switcher-dropdown-list {
	background: var(--fins-trp-white);
	border-top: 1px solid var(--fins-trp-border);
	padding: 6px;
}

/* Marcação antiga */
#trp-floater-ls {
	background: var(--fins-trp-white) !important;
	border: 1px solid var(--fins-trp-border) !important;
	border-radius: var(--fins-trp-pill) !important;
	box-shadow: 0 10px 30px -12px rgba(11, 44, 69, .28) !important;
	overflow: hidden;
	font-family: var(--fins-trp-font);
}

#trp-floater-ls-current-language a,
#trp-floater-ls-language-list a,
#trp-floater-ls-current-language .trp-language-wrap,
.trp-floater-switcher a {
	font-family: var(--fins-trp-font) !important;
	font-size: .76rem !important;
	font-weight: 700 !important;
	letter-spacing: .06em !important;
	text-transform: uppercase;
	color: var(--fins-trp-dark) !important;
}

#trp-floater-ls-language-list a:hover,
#trp-floater-ls-current-language a:hover {
	background: var(--fins-trp-primary-light) !important;
	color: var(--fins-trp-primary) !important;
}

#trp-floater-ls img.trp-flag-image,
.trp-floater-switcher img.trp-flag-image {
	display: none !important;
}

.trp-floater-ls-powered-by,
#trp-floater-ls-powered-by {
	display: none !important;
}

/* Não deixa o botão flutuante colidir com o botão "voltar ao topo" */
.fins-to-top ~ .trp-floating-switcher,
body .trp-switcher-position-bottom.trp-floating-switcher {
	margin-bottom: 6px;
}

/* -------------------------------------------------------------------------
   10. Ajustes finos
   ------------------------------------------------------------------------- */
/* Alinhamento da pastilha com a altura do cabeçalho */
.fins-header-actions .fins-lang--plugin,
.fins-lang--plugin {
	line-height: 1;
}

/* Evita que a lista suspensa fique cortada pelo cabeçalho */
.fins-header-inner,
.fins-header-actions,
.fins-nav-wrap {
	overflow: visible;
}

/* Em ecrãs muito estreitos a lista ocupa a largura disponível */
@media (max-width: 480px) {
	.trp-switcher-dropdown-list,
	.trp-language-switcher-container .trp-ls-shortcode-language {
		min-width: 120px;
	}
}
/* -------------------------------------------------------------------------
   11. GTranslate — mesmo desenho (opcional)
   ------------------------------------------------------------------------- */
.gtranslate_wrapper,
.gt_container,
.gt_switcher_wrapper {
display: inline-flex;
align-items: center;
gap: 6px;
font-family: var(--fins-trp-font);
}

.gt_switcher a.glink,
.gt_switcher a.glink span {
color: var(--fins-trp-dark);
font-family: var(--fins-trp-font);
font-size: var(--fins-trp-size);
font-weight: 700;
letter-spacing: .06em;
line-height: 1;
text-transform: uppercase;
text-decoration: none;
}

.gt_switcher a.glink {
padding: var(--fins-trp-pad);
border-radius: var(--fins-trp-pill);
border: 1px solid transparent;
}

.gt_switcher a.glink:hover {
color: var(--fins-trp-primary);
}

.gt_switcher a.glink.gt-current-lang {
background: var(--fins-trp-primary);
color: var(--fins-trp-white);
}

body.fins-header-overlay:not(.fins-header-scrolled) .gt_switcher a.glink {
color: rgba(255, 255, 255, .88);
}

body.fins-header-overlay:not(.fins-header-scrolled) .gt_switcher a.glink.gt-current-lang {
background: rgba(255, 255, 255, .92);
color: var(--fins-trp-primary-deep);
}

.fins-mobile-panel .gt_switcher a.glink {
color: var(--fins-trp-white);
}

/* -------------------------------------------------------------------------
   12. Com o menu móvel aberto, o botão flutuante esconde-se para não tapar
   o menu.
   ------------------------------------------------------------------------- */
body.fins-menu-open .trp-floating-switcher,
body.fins-nav-open .trp-floating-switcher,
body.fins-menu-open #trp-floater-ls,
body.fins-nav-open #trp-floater-ls {
display: none !important;
}

/* -------------------------------------------------------------------------
   13. O botão flutuante esconde-se quando o cabeçalho já tem o selector
   (Aparência → Personalizar → Header Options → Idioma → Esconder o botão
   flutuante do plugin).
   ------------------------------------------------------------------------- */
body.fins-hide-lang-floater .trp-floating-switcher,
body.fins-hide-lang-floater #trp-floater-ls,
body.fins-hide-lang-floater .trp-floater-ls,
body.fins-hide-lang-floater .gt_float_switcher {
display: none !important;
}
