/*
  Theme Name: Cassio
  Theme URI: https://artemsemkin.com/cassio/wp/
  Description: AJAX Portfolio WordPress Theme
  Author: Artem Semkin
  Author URI: https://artemsemkin.com
  Version: 3.5.2
  Requires at least: 6.4
  Requires PHP: 7.4
  License: GNU General Public License v2 or later
  License URI: http://www.gnu.org/licenses/gpl-2.0.html
  Text Domain: cassio
  Tested up to: 6
  Tags: grid-layout, right-sidebar, left-sidebar, footer-widgets, custom-colors, custom-menu, custom-logo, translation-ready, portfolio
*/

 
button {
    background-color: #F8F8F8;  /* Cor de fundo, similar à imagem */
    color: #2B2D2E !important;  /* Força a cor do texto a ser branco */
    font-weight: bold !important;         /* Texto em negrito */
    padding: 12px 30px;         /* Ajuste o preenchimento para maior altura e largura */
    border: 2px solid #F8F8F8;  /* Borda fina que combina com a cor de fundo */
    border-radius: 0px;        /* Bordas arredondadas */
    cursor: pointer;           /* Cursor como ponteiro ao passar por cima */
    font-size: 16px;            /* Tamanho da fonte */
    text-transform: uppercase;  /* Texto em maiúsculas, como na imagem */
    transition: background-color 0.3s ease, border-color 0.3s ease;  /* Transição suave */
	margin: 0 10px;             /* Espaço entre os botões */
}

/* Efeito ao passar o mouse por cima */
button:hover {
    background-color: #152330;  /* Cor de fundo mais escura ao passar o mouse */
    border-color: #152330;      /* Alinha a cor da borda com a cor de fundo */
	color: #FFFFFF !important;  /* Força a cor do texto a ser branco */
	
}

/* Efeito quando o botão é pressionado (selecionado) */
button:active, button:focus {
    background-color: #152330;  /* Mantém a cor de fundo do hover */
    border-color: #152330;      /* Mantém a cor da borda do hover */
    outline: none;              /* Remove o contorno padrão de foco */
	color: #FFFFFF !important;  /* Força a cor do texto a ser branco */
}

button.active {
    background-color: #152330;  /* Cor de fundo mais escura */
    border-color: #152330;      /* Alinha a cor da borda com a cor de fundo */
	color: #FFFFFF !important;  /* Força a cor do texto a ser branco */
}

/* Para os botões ficarem em linha */
center {
    display: flex;
    justify-content: center;  /* Centraliza os botões na linha */
    gap: 0px;                /* Espaçamento entre os botões */
}

/* Responsividade para ajustar os botões em telas pequenas */
@media (max-width: 600px) {
    center {
        gap: 5px;               /* Reduz o espaço entre os botões em telas pequenas */
    }

    button {
        font-size: 12px;        /* Reduz o tamanho da fonte ainda mais */
        padding: 8px 15px;      /* Ajuste o padding para botões menores */
        flex: 1 1 80px;          /* Permite que os botões ocupem mais espaço e se ajustem na tela */
    }
}





/* Garante visibilidade no desktop */
@media (min-width: 1024px) {
    .social-links .social_item {
        display: flex !important;
    }
}

/* Estilo para telas pequenas */
@media (max-width: 768px) {
    .social-links {
        top: 10px;
        right: 10px;
    }

    .social-links .social_item a[href*="agendar"] {
        font-size: 14px;
        padding: 8px 15px;
        height: 35px;
    }
}

/* Certifica-se que o conteúdo do slider não é ocultado pelo z-index */
.slider-container {
    position: relative;
    z-index: 1;
}

@media (max-width: 768px) {
    .seletor-do-mapa {
        max-width: 100% !important;
        overflow: hidden !important;
    }
}

.button.wpcf7-submit {
    background-color: #c69f73 !important; /* Define a cor do botão */
    border-color: #c69f73 !important; /* Caso o botão tenha borda */
}

.button.wpcf7-submit span {
    color: white !important; /* Define a cor do texto */
}


.button.wpcf7-submit:hover {
    background-color: #b38b61 !important; /* Um tom mais escuro para o hover */
    border-color: #b38b61 !important;
}


@media (max-width: 768px) {
    .js-spinner {
        display: none !important;
        visibility: hidden !important;
        opacity: 0 !important;
    }
}

@media (max-width: 768px) {
    svg.spinner {
        display: none !important;
        visibility: hidden !important;
        opacity: 0 !important;
    }
}