/*
Theme Name: RENT2U
Theme URI: https://xaviernunes.pt/wpxnunes
Author: Xavier Nunes
Author URI: https://xaviernunes.pt
Description: Tema Personalizado
Version: 3.0
Text Domain: wpxnunes
*/
img {
	max-width: 100%;
}
.logged-in #wp-admin-bar-wp-logo { 
    display: none; 
    visibility: hidden; 
}
h1, h2, h3, h4, h5, h6 { 
	margin-top: 0;
	font-weight: 700;
}
body {
	font-size: 16px;
	line-height: 30px;
	font-family: 'Lora', serif;
}
a.btn-secondary, a.btn-secondary:active, a.btn-secondary:focus, a.btn-secondary:visited, a.btn-secondary:hover {
	color: #222;
	text-decoration: none !important;
	transition: opacity 0.3s;
}
a.btn-secondary:hover {
	opacity: .8;
}
#scrollUp {
    background-color: #fff;
	color: #000;
    bottom: 5px;
    cursor: pointer;
    display: none;
    height: 34px;
    position: fixed;
    right: 12px;
    text-align: center;
    width: 40px;
    z-index: 9999;
    transition: all 0.3s ease 0s;
}
.wp-block-button__link {
	color: #222 !important;
	padding: 0.5rem 1rem !important;
    font-size: 1.25rem !important;
    border-radius: 0.3rem !important;
	border-color: #fff!important;
	font-weight: 700!important;
	background-color: #fff !important;
	text-decoration: none !important;
}
.bg {
	width: 100%;
	height: 100vh;
	position: fixed;
	top: 0;
	left: 0;
	background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
	z-index: 1;
	pointer-events: none;
    /* Força aceleração de hardware para um scroll suave */
    transform: translateZ(0);
    backface-visibility: hidden;	
}
body.home .bg {
	background-image: url('img/bg1.jpg') !important;
}
body.home #sidebar { margin-top: 50vh; }
body.page-template-template-alojamentos .bg {
	background-image: url('img/bg2.jpg') !important;
}
body.error404 .bg {
	background-image: url('img/bg3.jpg') !important;
}
.overlay {
	width: 100%;
	height: 100%;
	position: fixed;
	top: 0;
	left: 0;	
	background-color: rgba(0, 0, 0, 0.5);
	z-index: 10;
}
body.page-template-template-alojamentos .overlay, body.single-alojamento .overlay { background-color: rgba(0, 0, 0, 0.7); }
/* Garante que os cards do slider tenham a mesma altura */
#owl-reviews .item {
    display: flex;
}
#owl-reviews .card {
    width: 100%;
    transition: transform 0.3s ease;
}
#owl-reviews .card:hover {
    transform: translateY(-5px);
}
/* Estiliza os pontos (dots) para combinarem com o Bootstrap */
.owl-theme .owl-dots .owl-dot.active span, 
.owl-theme .owl-dots .owl-dot:hover span {
    background: #0d6efd !important; /* Cor primary do Bootstrap */
}
#content-wrapper {
	position: relative;	
	z-index: 100;
	color: #fff;
}
#content-wrapper .btn-secondary {
	color: #222 !important;
	text-decoration: none;
}
#content {
	margin-top: 18em;
	margin-bottom: 5em;
}
#content a, #content a:visited, #content a:focus, #content a:active, #content a:hover {
	color: #fff;
	text-decoration: underline;
}	
body.home #content {
	margin-top: 25em;
}
#sidebar {
	background: rgba(0,0,0,0.6);
	padding: 2em 0;
	margin-top: 5em;
}
.homepage-header { margin-top: 5vh; }
.logo {
	width: 540px;
	position: absolute;
	top: 8em;
	left: 50%;
	margin-left: -270px;
	padding: 2em;
	z-index: 1000;
	text-align: center;	
}
body.home .logo {
	top: 15em;
}
.wpml-ls li { display: inline; }
.wpml-ls li a { 
	display: inline-block;
	padding: 0 5px;
}
.wpml-ls-current-language { opacity: .5; }
#main-nav {
	position: absolute;
	top: 0;
	right: 0;
	z-index: 1001;
	padding: 10px;
	text-align: right;
}
.admin-bar #main-nav { top: 32px !important; }
#main-nav ul {
	margin: 0;
	padding: 0;
	list-style: none;
}
#main-nav ul li { display: inline; }
#main-nav ul li a {
	display: inline-block;
	margin-left: 0.5em;
	color: #222;
    text-decoration: none;
	background-color: #fff!important;
	padding: .5rem 1rem;
    font-size: 1em;
    border-radius: .3rem;
	font-weight: bold;
	transition: opacity 0.3s;
}
#main-nav ul li a:hover {
	opacity: .7;
}
/* 1. Esconder o submenu por padrão e preparar a transição */
#main-nav ul li {
    position: relative; /* Necessário para posicionar o submenu */
}

#main-nav ul .sub-menu {
    display: block;
    position: absolute;
    top: 40px;
    left: 8px;
    z-index: 1000;
    min-width: 150px;
    padding: 10px 0;
    margin: 0;
    list-style: none;
    background-color: #fff;
    box-shadow: 0 4px 10px rgba(0,0,0,0.1);
    border-radius: 4px;
	text-align: left;
    
    /* Efeito de visibilidade */
    opacity: 0;
    visibility: hidden;
    transform: translateY(10px);
    transition: all 0.3s ease;
}

/* 2. Mostrar o submenu ao passar o rato */
#main-nav ul li:hover > .sub-menu {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

/* 3. Estilo dos itens dentro do submenu */
#main-nav ul .sub-menu li {
    width: 100%;
}

#main-nav ul .sub-menu li a {
    display: block;
    padding: 8px 20px;
    color: #333;
    text-decoration: none;
    font-size: 14px;
    transition: background 0.2s;
}

#main-nav ul .sub-menu li a:hover {
    background-color: #f8f9fa; /* Cor de destaque ao passar o rato */
    color: #0d6efd; /* Azul do Bootstrap */
}

/* 4. Ajuste para ícones das redes sociais não criarem submenus estranhos */
#main-nav .fab {
    font-size: 1.2rem;
}
.alojamento {
	padding-top: 5vh;
	padding-bottom: 5vh;
}
.modal-backdrop {
    /* bug fix - no overlay */    
    display: none;    
}
.modal {
	top: 10vh;
	color: #222;
}
.wp-block-gallery { margin: 1em 0; }
/* gallery fix */
.is-layout-flex {
  display: flex;
  gap: 0.5em;
  flex-wrap: wrap; 
}
#map {
	margin: 0;
	padding: 0;
	height: 400px;
}
#nav-mobile {
	width: 80%;
    height: 100vh;
    background: rgba(0,0,0,.8);
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1001;	
	color: #fff;
	z-index: 1001;
}
#nav-mobile a, #nav-mobile a:visited, #nav-mobile a:active, #nav-mobile a:focus, #nav-mobile a:hover {
	color: #fff;
	text-decoration: none;
	font-size: 1.2em;
}
#main-nav-mobile ul {
	list-style: none;
	padding: 1em 2em;
}
#main-nav-mobile ul li {
	margin-bottom: 0.5em;
}
.admin-bar #nav-mobile {
	top: 32px;
}
#nav-mobile .main-nav-mobile-trigger {
	margin-left: 2em;
    margin-top: 2em;
}
.booking-btns a {
	text-decoration: none !important;
}
.booking-btns img {
	height: 28px;
}
/* Layout Geral */
.alojamento-row {
    transition: transform 0.3s ease;
}
.alojamento-row:hover {
    transform: translateY(-5px);
}

/* Owl Carousel Custom */
.alojamento-slider .owl-nav {
    position: absolute;
    top: 50%;
    width: 100%;
    transform: translateY(-50%);
    display: flex;
    justify-content: space-between;
    pointer-events: none;
    z-index: 10;
}
.alojamento-slider .owl-nav button {
    pointer-events: all;
    background: rgba(255, 255, 255, 0.8) !important;
    color: #000 !important;
    width: 35px;
    height: 35px;
    border-radius: 50% !important;
    margin: 0 10px !important;
    box-shadow: 0 2px 5px rgba(0,0,0,0.2);
}
.alojamento-slider .owl-dots {
    position: absolute;
    bottom: 15px;
    width: 100%;
    text-align: center;
}
.alojamento-slider .owl-dot span {
    background: rgba(255, 255, 255, 0.5) !important;
}
.alojamento-slider .owl-dot.active span {
    background: #fff !important;
    width: 20px !important;
}
.object-fit-cover {
    object-fit: cover;
}
@media (max-width: 1600px) { 
}
@media (max-width: 1400px) { 
}
@media (max-width: 1200px) { 
}
@media (max-width: 991px) {
}
@media (max-width: 767px) {
}
@media (max-width: 520px) {
	#content {
		margin-top: 22em;
	}
	.logo {
	    width: 100%;
		left: 0;
		top: 4em;
		margin-left: 0;
	}
	body.home .logo {
		top: 8em;
	}
	#main-nav {
		display: none;
	}
	.logo a.main-nav-mobile-trigger {
		display: block !important;
	}
	.logo a.main-nav-mobile-trigger, .logo a.main-nav-mobile-trigger:focus, .logo a.main-nav-mobile-trigger:active, .logo a.main-nav-mobile-trigger:hover {
		color: #fff;
		text-decoration: none;
	}
	.wp-block-column {
		margin-bottom: 2em;
	}
}