﻿:root {
    --primary-orange: #FF7800;
    --primary-white: #FFFFFF;
    --light-gray: #F5F5F5;
    --dark-gray: #333333;
    --medium-gray: #666666;
    --border-color: #E0E0E0;
    --shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
    --shadow-hover: 0 5px 20px rgba(0, 0, 0, 0.15);
    --transition: all 0.3s ease;
}

.bg-dark-gray {
    background-color: var(--dark-gray) !important;
}

/* Barra de Pesquisa */
.search-bar {
    flex: 1;
    max-width: 500px;
    position: relative;
    margin: 0 20px;
}

.search-input {
    width: 100%;
    padding: 12px 50px 12px 16px;
    border: 2px solid var(--border-color);
    border-radius: 25px;
    font-size: 16px;
    transition: var(--transition);
}

    .search-input:focus {
        outline: none;
        border-color: var(--primary-orange);
        box-shadow: 0 0 0 3px rgba(255, 107, 53, 0.1);
    }

.search-btn {
    position: absolute;
    right: 5px;
    top: 50%;
    transform: translateY(-50%);
    background-color: var(--primary-orange);
    color: var(--primary-white);
    border: none;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    cursor: pointer;
    transition: var(--transition);
}

    .search-btn:hover {
        background-color: #e55a2b;
    }

.text-size-menu{
    font-size: 0.6em !important;
}

.myIframe {
    position: relative;
    padding-bottom: 65.25%;
    padding-top: 30px;
    height: 0;
    overflow: auto;
    -webkit-overflow-scrolling: touch; /*<<--- THIS IS THE KEY*/
    border: solid black 1px;
}

    .myIframe iframe {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
    }

.bg-img-bottom {
    background-image: url('../imagens/newsletter-bg.png');
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

.bg-blue-dark {
    background-color: var(--primary-orange) !important;
}

.bg-blue {
    background-color: var(--primary-orange) !important;
}

.text-blue-dark {
    color: #091f44 !important;
}

.img-titulo-categoria {
    max-width: 40px;
    max-height: 40px;
    cursor:pointer;
}

.list-filtro:hover {
    font-weight: bolder !important;
}

.border-shadow {
    box-shadow: 5px 10px 5px #888888;
}

input[type=text]:focus {
    box-shadow: 0 0 10px #0066b3;
}

.img_zoom {
    font-size: .9em;
    /*color: silver;*/
}

.img_ilustrativa{
    font-size: .8em;
    /*color: silver;*/
}
.nameUser {
    cursor: pointer;
}

.radius-5 {
    border-radius: 5px !important;
}

.radius-10 {
    border-radius: 10px !important;
}

.radius-20 {
    border-radius: 20px !important;
}

.radius-60 {
    border-radius: 60px !important;
}

.border-blue {
    border-color: #0066b3 !important;
}

.border-red-bottom {
    border-bottom-color: #EE1B24 !important;
    border-bottom-width: 20px !important;
}

.text-blue {
    color: #027db5 !important;
}

.text-silver {
    color: #4d4d4d !important;
}

.text-silver-light {
    color: #666666 !important;
}

.border-list-itens {
    border-bottom-width: 3px !important;
    border-bottom-color: #EE1B24 !important;
    border-right-width: 0px !important;
    border-right-color: #F0F0F0 !important;
}

.text-quemsomos{
    font-size: 1.3em;
}

a {
    font-family: 'Roboto', sans-serif !important;
    cursor: pointer;
}

body {
    font-family: 'Roboto', sans-serif !important;
}

/*MENU CATEGORIAS*/
.categorias {
    /*font-weight: bolder !important;*/
    font-size: 1.2em !important;
    color: #FFFFFF !important;
}

.categorias:hover {
    /*font-size: 1.3em !important;*/
    color: #FCC902 !important;
}

.titleCatalogos {
    /*text-shadow: 0px 0px 10px #FCC902;*/
    text-decoration: solid !important;
    text-decoration-color: #FCC902 !important;
}

.text-laranja {
    color: #25BCC7 !important;
}

.border-laranja {
    border-color: var(--dark-gray) !important;
}

.btn-laranja {
    background: var(--primary-orange) !important;
    color: #FFFFFF
}

.container__content {
    background: #fff;
    left: 50%;
    position: absolute;
    transform: translate(-50%, -50%);
    font-weight: bolder;
}

.container__separator {
    border-bottom: 1px solid rgba(0, 0, 0, 0.3);
    height: 1px;
    width: 100%;
}

.titlePage {
    font-size: 1.5em;
}