/********** Template CSS - Adaptado para Churrasqueira PAMIJU **********/
:root {
    --primary: #FEA116;       /* Laranja/Amarelo Dourado (logo) */
    --secondary: #D32A1E;     /* Vermelho Forte (logo) */
    --light: #FFF8E1;         /* Bege muito claro (fundo principal) */
    
    /* ************************************************** */
    /* *** COR REVERTIDA PARA O CASTANHO ORIGINAL *** */
    --dark: #4A2F20;      /* Marrom Escuro (original) */
    /* --dark: #F4792E; */ /* Novo Laranja "Carnaval" (COMENTADO) */
    /* ************************************************** */

    --green-accent: #7EC242; /* Verde Lima (logo) */
    --blue-accent: #00A4E4;  /* Azul Claro (logo) */
    --text-light: #FFFFFF;    /* Branco */
    --text-dark: #333333;     /* Cinza Escuro */
}

/*** Fontes ***/
body {
    font-family: 'Times New Roman', Times, serif;
    font-size: 16px;
    background-color: var(--light);
    color: var(--text-dark);
}

h1, h2, h3, h4, h5, h6 {
    font-family: 'Heebo', sans-serif;
    font-weight: 700;
    color: var(--dark); /* Títulos em castanho escuro */
}

.hero-header h1.display-3 {
     font-family: 'Times New Roman', Times, serif;
     font-weight: bold;
     color: var(--text-light); /* Título Hero em branco */
}


/*** Reset Básico ***/
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

/*** Botões ***/
.btn {
    font-family: 'Heebo', sans-serif;
    font-weight: 500;
    transition: .5s;
    border-radius: 2px; /* Cantos ligeiramente arredondados */
}

.btn.btn-primary,
.btn.btn-secondary {
    color: var(--text-light); /* Texto branco nos botões principais por padrão */
}

.btn-primary {
    background-color: var(--primary); /* Botão principal Laranja */
    border-color: var(--primary);
    color: var(--dark); /* Texto castanho escuro no botão laranja */
}

.btn-primary:hover {
    background-color: var(--secondary); /* Hover Vermelho */
    border-color: var(--secondary);
    color: var(--text-light); /* Texto branco no hover vermelho */
}

.btn-square { width: 38px; height: 38px; }
.btn-sm-square { width: 32px; height: 32px; }
.btn-lg-square { width: 48px; height: 48px; }

.btn-square,
.btn-sm-square,
.btn-lg-square {
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: normal;
    border-radius: 50%; /* Botões de ícone redondos */
}


/*** Navbar ***/
.navbar {
    padding: 15px 0; /* Diminuído ligeiramente o padding */
    transition: .5s;
}

/* Cor e Estilo da Navbar */
.navbar.navbar-dark {
    /* Usar cor sólida escura em vez de textura para melhor consistência visual */
    background: var(--dark); /* Fundo castanho escuro */
    border-bottom: 3px solid var(--primary); /* Linha Laranja */
}

.navbar .navbar-brand h1 {
    color: var(--text-light); /* MODIFICADO PARA BRANCO (para teste de logo) */
    font-family: 'Heebo', sans-serif; /* Mantém a fonte original para o logo */
    font-weight: bold;
    font-size: 1.8rem; /* Ajustar tamanho se necessário */
}
.navbar .navbar-brand h1 i {
     color: var(--secondary); /* Ícone talheres em Vermelho */
}
/* Estilo para a imagem do logo 'Y1' na navbar */
.navbar .navbar-brand h1 img {
    height: 32px; 
    width: auto; 
    margin-right: 10px; 
    margin-bottom: 5px;
}


.navbar .navbar-nav .nav-link {
    margin-right: 25px; /* Diminuído espaço entre links */
    padding: 20px 0; /* Ajustado padding vertical */
    color: var(--text-light); /* Links em branco */
    font-family: 'Times New Roman', Times, serif;
    font-size: 1.1rem;
    font-weight: bold;
    outline: none;
    transition: color 0.3s;
}

.navbar .navbar-nav .nav-link:hover,
.navbar .navbar-nav .nav-link.active {
    color: var(--primary); /* Cor Laranja no hover/ativo */
}

/* ***********************************************************
    *** MODIFICAÇÃO CSS: BOTÃO COM MAIS CONTRASTE (PRETO) ***
   ***********************************************************
*/
.navbar-toggler {
    border: 2px solid var(--primary) !important; /* Borda Laranja Sólida para contraste */
    background-color: rgba(0, 0, 0, 0.4); /* Fundo PRETO transparente (NOVO) */
    padding: .25rem .5rem; 
}
.navbar-toggler:focus {
    box-shadow: 0 0 0 0.2rem rgba(254, 161, 22, 0.5); /* Sombra de foco Laranja */
}
.navbar-toggler-icon {
     /* Ícone das três barras em Laranja (cor --primary) */
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba(254, 161, 22, 1)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
    width: 1.2em; /* Tamanho do ícone */
    height: 1.2em;
}
/* --- FIM ÍCONE --- */

/* --- MENU MOBILE (QUANDO ABERTO) --- */
@media (max-width: 991.98px) {
    .navbar-collapse {
        /* Fundo sólido (agora castanho) para garantir visibilidade */
        background-color: var(--dark) !important;
        border-radius: 0 0 5px 5px;
        margin-top: 3px; /* Espaço abaixo da linha laranja da navbar */
        padding: 10px 0; /* Padding vertical */
        box-shadow: 0 4px 8px rgba(0,0,0,0.3); /* Sombra para destacar */
        border: 1px solid rgba(254, 161, 22, 0.2); /* Borda laranja sutil */
        border-top: none; /* Sem borda no topo */
    }
    /* Estilo dos links dentro do menu mobile aberto */
    .navbar-collapse .navbar-nav .nav-link {
        color: var(--text-light) !important; /* Texto branco */
        padding: 10px 20px; /* Padding interno */
        margin: 2px 10px; /* Margem entre links */
        border-radius: 3px;
        text-align: left; /* Alinhar à esquerda */
    }
    .navbar-collapse .navbar-nav .nav-link:hover,
    .navbar-collapse .navbar-nav .nav-link.active {
        background-color: var(--primary); /* Fundo laranja no hover/ativo */
        color: var(--dark) !important; /* Texto (agora castanho) */
    }
     .navbar .navbar-nav {
         border-top: none; /* Remover linha que poderia aparecer */
     }
     /* Ajustar botão "Reservar Mesa" no mobile */
     .navbar-collapse .btn-primary {
         margin: 15px 20px 5px 20px; /* Margem ajustada */
         width: calc(100% - 40px); /* Ocupar largura com margens */
         text-align: center;
     }
}
/* --- FIM MENU MOBILE --- */


.navbar.sticky-top { /* Estilo quando faz scroll */
    padding: 10px 0;
    box-shadow: 0 2px 5px rgba(0,0,0,0.1);
    background: var(--dark) !important; /* Mantém fundo (agora castanho) */
}


@media (min-width: 992px) {
    .navbar.navbar-dark { /* Estilo inicial em telas grandes */
        position: absolute;
        width: 100%;
        top: 0;
        left: 0;
        z-index: 999;
        background: transparent !important; /* Começa transparente */
        border-bottom: none;
    }

    .navbar.navbar-dark.sticky-top { /* Estilo em telas grandes após scroll */
        position: fixed;
        background: var(--dark) !important; /* Fica (agora castanho) */
         border-bottom: 3px solid var(--primary); /* Adiciona linha laranja */
    }
     /* Esconder .navbar-collapse em telas grandes para evitar fundo extra indesejado */
    .navbar-collapse.collapse.show:not(.collapsing) {
        background-color: transparent !important;
        box-shadow: none;
        border: none;
    }
}

/*** Hero Header ***/
.hero-header {
    /* ************************************************** */
    /* *** MODIFICAÇÃO DE COR (CASTANHO - CORRIGIDO) *** */
    background: linear-gradient(rgba(74, 47, 32, .85), rgba(74, 47, 32, .85)), /* Overlay Castanho (REVERTIDO) */
    /* ************************************************** */
                url('../img/hero-bg.jpg') center center/cover no-repeat;
    padding: 10rem 0;
}
.hero-header p.text-white {
    color: rgba(255, 255, 255, 0.9) !important; /* Texto ligeiramente menos branco */
    font-size: 1.1rem;
}
.hero-header .btn-primary { /* Botão específico do Hero */
    background-color: var(--primary); /* Laranja */
    border-color: var(--primary);
    color: var(--dark); /* Texto (agora castanho) */
    font-weight: bold; /* Texto a negrito */
    padding: .8rem 1.8rem; /* Padding ligeiramente maior */
    font-size: 1rem;
}
.hero-header .btn-primary:hover {
    background-color: var(--secondary); /* Vermelho */
    border-color: var(--secondary);
    color: var(--text-light); /* Texto branco */
}


/*** Section Title ***/
.section-title {
    position: relative;
    display: inline-block; /* Ajustado para centralizar com text-center */
    font-family: 'Heebo', sans-serif;
    font-weight: 600;
    color: var(--secondary); /* Títulos secundários em Vermelho */
    padding-bottom: 8px;
    margin-bottom: 30px;
    font-size: 1rem; /* Tamanho ajustado */
    text-transform: uppercase; /* Maiúsculas */
    letter-spacing: 1px;
}

/* Linhas decorativas abaixo do título */
.section-title::before {
    position: absolute;
    content: "";
    width: 60px;
    height: 3px;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    background: var(--dark); /* Linha (agora castanho) */
    border-radius: 2px;
}

.section-title::after {
    position: absolute;
    content: "";
    width: 30px;
    height: 3px;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    background: var(--primary); /* Linha Laranja por cima */
    border-radius: 2px;
}
/* Remover linhas se o título estiver alinhado à esquerda/direita */
.section-title.text-start::before, .section-title.text-start::after {
    left: 0;
    transform: translateX(0);
}
.section-title.text-end::before, .section-title.text-end::after {
    left: auto;
    right: 0;
    transform: translateX(0);
}


/*** Service ***/
.service-item {
    background-color: var(--text-light);
    /* ************************************************** */
    /* *** MODIFICAÇÃO DE COR (CASTANHO - CORRIGIDO) *** */
    border: 1px solid rgba(74, 47, 32, 0.1); /* Borda castanha clara (REVERTIDO) */
    box-shadow: 0 0 30px rgba(74, 47, 32, .08); /* Sombra castanha suave (REVERTIDO) */
    /* ************************************************** */
    transition: .5s;
    border-radius: 4px;
    height: 100%;
    padding: 30px; /* Padding interno */
}

.service-item:hover {
    background: var(--primary); /* Fundo Laranja no hover */
    border-color: var(--primary);
}

.service-item * {
    transition: .5s;
}

.service-item:hover * {
    color: var(--dark) !important; /* Texto (agora castanho) no hover */
}
.service-item i {
    font-size: 3rem; /* Ícone maior */
    color: var(--primary); /* Ícone Laranja por padrão */
    margin-bottom: 20px; /* Espaço abaixo do ícone */
}
.service-item:hover i {
     color: var(--dark) !important; /* Ícone (agora castanho) no hover */
}
.service-item h5 {
    font-weight: 600;
    margin-bottom: 10px;
}


/*** Food Menu ***/
.nav-pills .nav-link {
    background-color: transparent;
    border-radius: 4px;
    margin: 0 5px 10px 5px; /* Margem inferior adicionada */
    color: var(--dark); /* (agora castanho) */
    font-weight: 500;
    /* ************************************************** */
    /* *** MODIFICAÇÃO DE COR (CASTANHO - CORRIGIDO) *** */
    border: 1px solid rgba(74, 47, 32, 0.2); /* Borda castanha clara (REVERTIDO) */
    /* ************************************************** */
    transition: .3s;
    padding: 10px 15px; /* Padding interno */
}
.nav-pills .nav-link i { /* Ícones dentro das tabs */
     margin-right: 8px;
     color: var(--primary);
}

.nav-pills .nav-link.active,
.nav-pills .nav-link:hover {
    background-color: var(--primary); /* Fundo Laranja */
    color: var(--dark); /* Texto (agora castanho) */
    border-color: var(--primary);
}
.nav-pills .nav-link.active i,
.nav-pills .nav-link:hover i {
     color: var(--dark); /* Ícone (agora castanho) */
}
.tab-content .border-bottom {
    /* ************************************************** */
    /* *** MODIFICAÇÃO DE COR (CASTANHO - CORRIGIDO) *** */
    border-color: rgba(74, 47, 32, 0.2) !important; /* Linha castanha clara (REVERTIDO) */
    /* ************************************************** */
}
.tab-content h5 {
     font-size: 1.1rem; /* Tamanho do nome do prato */
}
.tab-content h5 span:last-child {
    color: var(--secondary); /* Preço em Vermelho */
    font-weight: bold;
    white-space: nowrap; /* Evitar que o preço quebre linha */
    padding-left: 15px; /* Espaço antes do preço */
}
.menu-item img {
    border-radius: 4px; /* Cantos arredondados nas imagens do menu */
    width: 80px;
    height: 80px;
    object-fit: cover; /* Garante que a imagem cobre o espaço */
    border: 2px solid var(--light); /* Borda bege clara */
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}
.menu-item .d-flex { /* Espaçamento entre itens */
     margin-bottom: 15px;
}


/*** Reservation ***/
.bg-dark {
    background-color: var(--dark) !important; /* (agora castanho) */
}
.form-control, .form-select { /* Estilo dos campos do formulário */
     border: 1px solid #ced4da;
     border-radius: 2px;
}
.form-control:focus, .form-select:focus {
     border-color: var(--primary);
     box-shadow: 0 0 0 0.2rem rgba(254, 161, 22, 0.25);
}


/*** Team ***/
.team-item {
    /* ************************************************** */
    /* *** MODIFICAÇÃO DE COR (CASTANHO - CORRIGIDO) *** */
    box-shadow: 0 0 30px rgba(74, 47, 32, .08); /* (REVERTIDO) */
    /* ************************************************** */
    transition: .5s;
    border-radius: 4px;
    overflow: hidden; /* Garante que a borda arredondada funcione */
}
.team-item:hover {
     /* ************************************************** */
    /* *** MODIFICAÇÃO DE COR (CASTANHO - CORRIGIDO) *** */
     box-shadow: 0 0 45px rgba(74, 47, 32, .15); /* (REVERTIDO) */
    /* ************************************************** */
}
.team-item .btn-square { /* Botões sociais da equipa */
     background: var(--text-light);
     color: var(--primary);
     border: 1px solid var(--primary);
}
.team-item .btn-square:hover {
     background: var(--primary);
     color: var(--dark); /* (agora castanho) */
}


/*** Testimonial ***/
.testimonial-item {
     /* ************************************************** */
    /* *** MODIFICAÇÃO DE COR (CASTANHO - CORRIGIDO) *** */
     border: 1px solid rgba(74, 47, 32, 0.1); /* (REVERTIDO) */
    /* ************************************************** */
     border-radius: 4px;
}
.testimonial-carousel .owl-item img {
    width: 60px; /* Foto do cliente um pouco maior */
    height: 60px;
}
.testimonial-carousel .owl-dots {
    margin-top: 25px;
}
.testimonial-carousel .owl-dots .owl-dot {
    background: rgba(254, 161, 22, 0.4); /* Bolinhas Laranja transparente */
    width: 12px;
    height: 12px;
    border-radius: 50%;
    margin: 0 4px;
    transition: .5s;
}
.testimonial-carousel .owl-dots .owl-dot.active {
    background: var(--primary); /* Bolinha ativa Laranja sólido */
    width: 15px; /* Ligeiramente maior quando ativa */
    height: 15px;
}


/*** Footer ***/
.footer {
    background: var(--dark); /* Fundo (agora castanho) */
    color: rgba(255, 255, 255, 0.8); /* Texto um pouco mais visível */
    padding-top: 4rem;
    padding-bottom: 1rem;
    border-top: 5px solid var(--primary); /* Borda Laranja grossa no topo */
}

/* Títulos no Footer */
.footer .section-title {
    font-size: 1.1rem; /* Tamanho ajustado */
    color: var(--primary); /* Títulos (Contacto, Horário) em Laranja */
    margin-bottom: 1.5rem;
    padding-bottom: 0; /* Remover linhas decorativas no footer */
    text-transform: uppercase; /* Maiúsculas */
}
.footer .section-title::before,
.footer .section-title::after {
    display: none;
}
.footer h4.text-primary { /* Garante que qualquer h4 com text-primary fique laranja */
     color: var(--primary) !important;
}
/* Corrigir nome da classe para título do footer se necessário */
.footer h4.ff-secondary { /* Aplica estilo aos títulos específicos do template */
     font-size: 1.1rem;
     color: var(--primary);
     margin-bottom: 1.5rem;
     padding-bottom: 0;
     text-transform: uppercase;
}


.footer .btn.btn-social { /* Botões sociais */
    margin-right: 8px; /* Mais espaço */
    width: 40px; /* Maiores */
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--text-light); /* Ícone branco */
    border: 1px solid rgba(254, 161, 22, 0.5); /* Borda laranja semi-transparente */
    border-radius: 50%;
    transition: .3s;
}

.footer .btn.btn-social:hover {
    color: var(--dark); /* Ícone (agora castanho) */
    background: var(--primary); /* Fundo laranja */
    border-color: var(--primary);
}

.footer .btn.btn-link { /* Links rápidos (se houver) */
    display: block;
    margin-bottom: 8px;
    padding: 0;
    text-align: left;
    color: rgba(255, 255, 255, 0.8); /* Texto mais visível */
    font-size: 1rem; /* Tamanho maior */
    font-weight: normal;
    text-transform: capitalize;
    transition: .3s;
}

.footer .btn.btn-link::before {
    position: relative;
    content: "\f105"; /* Ícone de seta */
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    margin-right: 10px;
    color: var(--primary); /* Seta Laranja */
}

.footer .btn.btn-link:hover {
    letter-spacing: 1px;
    box-shadow: none;
    color: var(--primary); /* Cor Laranja no hover */
}
.footer p i { /* Ícones de contacto (mapa, telefone, email) */
    color: var(--primary); /* Laranja */
    margin-right: 10px; /* Espaço à direita */
    width: 20px; /* Alinha os ícones */
    text-align: center;
}

.footer .copyright { /* Linha de Copyright */
    margin-top: 2rem;
    padding-top: 1.5rem; /* Mais espaço acima */
    font-size: 0.9rem; /* Texto ligeiramente menor */
    border-top: 1px solid rgba(255, 255, 255, .15); /* Linha divisória mais visível */
    text-align: center;
}

.footer .copyright a {
    color: var(--primary); /* Link em Laranja */
}

.footer .copyright a:hover {
     color: var(--secondary); /* Hover Vermelho */
}


/*** Spinner ***/
#spinner {
    opacity: 0;
    visibility: hidden;
    transition: opacity .5s ease-out, visibility 0s linear .5s;
    z-index: 99999;
}

#spinner.show {
    transition: opacity .5s ease-out, visibility 0s linear 0s;
    visibility: visible;
    opacity: 1;
}

/*** Back to Top ***/
.back-to-top {
    position: fixed;
    display: none;
    right: 30px;
    bottom: 30px;
    z-index: 99;
    background: var(--primary); /* Fundo Laranja */
    border-color: var(--primary);
    width: 48px; /* Tamanho consistente com btn-lg-square */
    height: 48px;
    border-radius: 50%; /* Redondo */
}
.back-to-top i {
     color: var(--dark); /* Ícone (agora castanho) */
}

.back-to-top:hover {
     background: var(--secondary); /* Hover Vermelho */
     border-color: var(--secondary);
}
.back-to-top:hover i {
     color: var(--text-light); /* Ícone branco no hover */
}


/* --- Ajustes Responsivos Adicionais --- */
@media (max-width: 768px) {
    .hero-header {
        padding: 6rem 0; /* Menos padding no mobile */
    }
    .hero-header h1 {
        font-size: 2.2rem; /* Título menor no mobile */
    }
    .navbar .navbar-brand h1 {
        font-size: 1.6rem; /* Logo menor no mobile */
    }
    .footer {
         padding-top: 2rem; /* Menos padding no topo */
    }
    .footer .row > div { /* Espaçamento entre colunas do footer */
        margin-bottom: 2rem;
    }
     .footer .col-lg-4, .footer .col-md-6 { /* Centralizar colunas do footer no mobile */
          text-align: center !important;
     }
      .footer .btn.btn-link {
        text-align: center;
    }
     .footer .btn.btn-link::before {
        display: none; /* Esconde a seta nos links do footer */
    }
     .footer .d-flex { /* Centralizar botões sociais */
          justify-content: center;
     }
     .footer p { /* Garantir centralização dos parágrafos no mobile */
         text-align: center !important;
     }
     .footer p i { /* Centralizar ícones de contacto */
          margin-right: 5px;
     }
}

/*** Animação de Rotação para Imagem Hero ***/
.hero-image-rotate {
    animation: rotate 10s linear infinite; /* Nome da animação, duração, tipo, repetição */
}

@keyframes rotate {
    from {
        transform: rotate(0deg); /* Começa sem rotação */
    }
    to {
        transform: rotate(360deg); /* Termina com uma volta completa */
    }
}


/* ***********************************************************
    *** ESTILOS PARA O FORMULÁRIO DE REVIEW (ADICIONADO) ***
   *********************************************************** */

/* Wrapper do formulário (MODIFICADO) */
.review-form-wrapper {
    background: var(--light); /* MODIFICADO: De #fff para a cor de fundo do site */
    border-radius: 4px;
    /* Usar a sombra suave que já existe no tema */
    /* ************************************************** */
    /* *** MODIFICAÇÃO DE COR (CASTANHO - CORRIGIDO) *** */
    box-shadow: 0 0 30px rgba(74, 47, 32, .08); /* Sombra CASTANHA */
    border: 1px solid rgba(74, 47, 32, 0.1); /* Borda CASTANHA */
    /* ************************************************** */
}

/* Grupo de estrelas (Label + estrelas) */
.star-rating-group {
    margin-bottom: 1rem;
}
/* Adicionado 'text-center' que faltava no HTML */
.star-rating-group.text-center {
    text-align: center;
}
.star-rating-group label {
    font-family: 'Heebo', sans-serif;
    font-weight: 500;
    color: var(--dark);
    margin-bottom: 0.5rem;
    display: block;
}

/* --- O truque das Estrelas/Chamas (Puro CSS) --- */
.star-rating {
    display: inline-block; /* Corrigido de 'block' para 'inline-block' */
    direction: rtl; /* Magia! Inverte a ordem */
    font-size: 1.75rem; /* Tamanho das chamas */
}

/* Esconde os botões de rádio reais */
.star-rating input[type=radio] {
    display: none;
}

/* Estilo da chama (label) */
.star-rating label {
	color: #e0e0e0; /* MODIFICADO: Cor da chama "apagada" (cinza-claro) */
	cursor: pointer;
	transition: all 0.2s ease-in-out; /* MODIFICADO: Transição mais suave para tudo */
	padding: 0 0.1em;
	text-shadow: none; /* ADICIONADO: Garantir que não há brilho quando apagado */
}

/* Quando passa o rato por cima de uma chama, ela E as seguintes (devido ao RTL e ~) mudam de cor */
.star-rating label:hover,
.star-rating label:hover ~ label {
	color: var(--primary); /* Cor Laranja (hover) */
	transform: scale(1.1); /* ADICIONADO: Efeito de "crescer" ao passar o rato */
}

/* A chama selecionada E as seguintes ficam Laranja */
.star-rating input[type=radio]:checked ~ label {
	color: var(--primary); /* Cor Laranja (selecionada) */
	transform: scale(1.1); /* ADICIONADO: Mantém o tamanho grande */
	
	/* ADICIONADO: O EFEITO "CARREGADO" (GLOW) */
	text-shadow: 
		0 0 5px var(--primary),
		0 0 10px var(--primary),
		0 0 15px var(--secondary); /* Brilho vermelho/laranja */
}