/*****************************************************************/
/*
/*** Custom fonts override — ReservationWide (body/texto) + Gilroy (titulos)
/*
/*** Carregado apos o CSS do tema e do Elementor; usa !important para
/*** garantir as fonts em todo o conteudo sem alterar os ficheiros do Elementor.
/*****************************************************************/

@font-face {
	font-family: 'Gilroy';
	src: url('../inc/fonts/custom/Gilroy-Regular.otf') format('opentype');
	font-weight: 400;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: 'ReservationWide';
	src: url('../inc/fonts/custom/ReservationWide-Bd.otf') format('opentype');
	font-weight: 700;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: 'ReservationWide-Black';
	src: url('../inc/fonts/custom/ReservationWide-Black.ttf') format('truetype');
	font-weight: 900;
	font-style: normal;
	font-display: swap;
}

body {
	font-family: 'ReservationWide', 'Montserrat', sans-serif !important;
}

/* Todo o texto do site -> ReservationWide.
   Exclui elementos de iconografia: .lorada, font-awesome (fa-*), elementor-icon, dashicons. */
body :not(.lorada):not([class^='lorada-']):not([class^='fa-']):not(.fa):not(.fas):not(.far):not(.fab):not(.fal):not(.elementor-icon):not(.dashicons) {
	font-family: 'ReservationWide', 'Montserrat', sans-serif !important;
}

/* Titulos -> Gilroy */
h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6,
.elementor-heading-title,
.elementor-widget-heading .elementor-heading-title,
.entry-title, .page-title, .section-title, .widget-title,
.widget .widget-title, .footer-widget .widget-title,
.product_title, .woocommerce-products-header__title,
.elementor-divider__text,
.elementor-widget-icon-box .elementor-icon-box-title {
	font-family: 'Gilroy', 'ReservationWide', sans-serif !important;
}

/* Top header (topbar): idioma + Instagram a preto.
   Gera override aos estilos injetados pelo custom_js (docs.injected <style> usa cores brancas). */
#header-topbar .lang-switcher,
#header-topbar .lang-current,
#header-topbar .lang-switcher a,
#header-topbar .topbar-instagram {
	color: #000000 !important;
}

/* Dropdown de idioma: fundo #d9ecff, fonts pretas */
#header-topbar .lang-switcher .lang-menu {
	background-color: #d9ecff !important;
	border-color: #c2dbf5 !important;
}

#header-topbar .lang-switcher .lang-menu li a {
	color: #000000 !important;
}

#header-topbar .lang-switcher .lang-menu li a:hover {
	background-color: #c2dbf5 !important;
	color: #000000 !important;
}

/* Tabela de detalhes do produto: labels (lado esquerdo) a preto em vez de azul (#d9ecff) */
.product-tabs-wrapper .shop_attributes th {
	color: #000000;
}

/* Menu principal: item da pagina atual a azul-escuro da marca (#94A6B6) */
.lorada-navigation .menu-main-navigation li.current-menu-item > a,
.lorada-navigation .menu-main-navigation li.current-menu-ancestor > a,
.lorada-navigation .menu-main-navigation li.current-menu-item > a:after,
.lorada-navigation .menu-main-navigation li.current-menu-ancestor > a:after {
	color: #94A6B6 !important;
}

/* Menu principal: hover mantem-se preto e passa a peso 900 (fonte Black), SEM trocar
   a fonte em fluxo (trocar a fonte muda metricas = o texto desce/sobe no item).
   Tecnica:
     1) o texto original (.menu-title) fica sempre em ReservationWide; no hover fica
        transparente e o clone em ReservationWide-Black (.menu-title::before, colocado
        no inicio da MESMA linha = mesma baseline) fica visivel por cima;
     2) .menu-title::after reserva a largura da fonte Black no estado base (clone
        invisivel, height:0), para os vizinhos nao se moverem no hover.
   O atributo data-hover e setado por JS (mu-plugin musa-menu-hover-stable.php). */
#menu-main-menu li.item-level-0 > a,
#menu-main-menu li.item-level-0 > a:after {
	transition: color .25s ease-in-out;
}
#menu-main-menu li.item-level-0 > a:hover,
#menu-main-menu li.item-level-0 > a:hover:after {
	color: #222222 !important;
}

/* Os <li> do menu sao inline-block num <ul> block. Alinha os li ao topo para a
   baseline do texto nunca mexer no line-box do <ul>. */
#menu-main-menu > li {
	vertical-align: top;
}

/* Avisos fixos WooCommerce (fundo): texto e icones a preto */
.woocommerce-message,
.woocommerce-error,
.woocommerce-info {
	color: #000000 !important;
}

.woocommerce-message:before,
.woocommerce-error:before,
.woocommerce-info:before {
	color: #000000 !important;
}

/* Texto do item: inline-block centrado verticalmente. A referencia de alinhamento
   (baseline/x-height do <a>) nunca muda, porque o <a> mantem SEMPRE a fonte de
   repouso (ReservationWide) - em nenhuma circunstancia em fluxo troca para Black. */
#menu-main-menu li.item-level-0 > a .menu-title {
	position: relative;
	display: inline-block;
	vertical-align: middle;
}

/* Clone Black sobreposto ao texto base: inline-block com width:0 no inicio da linha,
   partilha por isso a baseline com o texto original -> sobrepoe-se-lhe exactamente
   (mesma posicao horizontal e vertical), sem mexer no layout. */
#menu-main-menu li.item-level-0 > a .menu-title::before {
	content: attr(data-hover);
	display: inline-block;
	width: 0;
	overflow: visible;
	white-space: nowrap;
	visibility: hidden;
	opacity: 0;
	pointer-events: none;
	font-family: 'ReservationWide-Black', 'ReservationWide', 'Montserrat', sans-serif;
	font-weight: 900;
	color: #222222;
}

/* no hover: esconde o texto base (muda de cor, sem animacao de layout) e mostra o clone Black */
#menu-main-menu li.item-level-0 > a:hover .menu-title {
	color: transparent;
}
#menu-main-menu li.item-level-0 > a:hover .menu-title::before {
	visibility: visible;
	opacity: 1;
}

/* Reserva de largura da fonte Black no estado base (nao empurra os vizinhos no hover) */
#menu-main-menu li.item-level-0 > a .menu-title::after {
	content: attr(data-hover);
	display: block;
	height: 0;
	overflow: hidden;
	visibility: hidden;
	white-space: nowrap;
	font-family: 'ReservationWide-Black', 'ReservationWide', 'Montserrat', sans-serif;
	font-weight: 900;
}

/* Checkout: precos e links a #94A6B6 em vez de #d9ecff */
.woocommerce-checkout .price,
.woocommerce-checkout form.woocommerce-checkout #order_review .woocommerce-checkout-review-order-table tr.order-total td .amount,
.woocommerce-checkout #order_review .woocommerce-terms-and-conditions-wrapper p.validate-required label a,
.woocommerce-checkout #order_review .woocommerce-checkout-payment .wc_payment_method label a:hover {
	color: #94A6B6 !important;
}
.woocommerce-checkout #order_review .woocommerce-checkout-payment .place-order #place_order:hover {
	background-color: #94A6B6 !important;
}