/* =========================================================
   THEME BASE — QBEM / EBS
   Base comum para todos os clientes
   ========================================================= */

/* =========================================================
   1) TOKENS (fallback técnico)
   ========================================================= */
:root {
    /* Cores principais (sobrescritas no custom.css do cliente) */
    --primary: rgb(31, 69, 83); /* nova cor solicitada */
    --primary-50: rgba(31, 69, 83,0.08);
    --primary-hover: rgb(34, 78, 94);
    --primary-contrast: #ffffff;
    --secondary: #F3F4F6;

    /* Superfícies */
    --surface-default: #efefef;

    /* Logos */
    --logo-header-url: url("../../Content/img/logo_ebs_3.png");
    --logo-white-url: url("../../Content/img/logo/logo_qbem.png");

    /* Logo layout */
    --logo-white-width: 100%;
    --logo-white-height: 90%;
    --logo-white-margin: 3px 0px 0px 16px;
    --logo-white-bg-size: auto 100%;
}

/* =========================================================
   2) HEADER / LOGO
   ========================================================= */

/* <a href="~/" alt="EBS - Consultoria | Tecnologia | Outsourcing">
     <div class="logo-white"></div>
   </a>
*/

#header #logo-group #logo a {
    background: var(--logo-header-url);
    background-repeat: no-repeat;
    width: auto;
    height: auto;
    margin: 0;
    padding: 0;
}

.logo-white {
    background-image: var(--logo-white-url);
    background-repeat: no-repeat;
    display: inline-block;
    color: transparent !important;
    width: var(--logo-white-width) !important;
    height: var(--logo-white-height) !important;
    background-size: var(--logo-white-bg-size);
    margin: var(--logo-white-margin);
}

/* =========================================================
   3) PAINÉIS / ACCORDION
   ========================================================= */
.panel-primary > .panel-heading {
    background-color: var(--primary) !important;
    border-color: var(--primary) !important;
}

.panel-primary {
    border-color: var(--primary) !important;
}

/* =========================================================
   4) MENU
   ========================================================= */
.smart-style-2.menu-on-top aside#left-panel nav > ul > li:hover > a {
    color: var(--primary) !important;
}

.smart-style-2.menu-on-top nav ul ul li a,
.smart-style-2.menu-on-top nav ul ul ul li a {
    color: var(--secondary) !important;
}

.smart-style-2.menu-on-top nav ul ul li a:hover,
.smart-style-2.menu-on-top nav ul ul ul li a:hover {
    color: var(--primary) !important;
    background-color: var(--surface-default) !important;
}

.smart-style-2.menu-on-top nav ul ul .active > a {
    color: var(--secondary) !important;
}

.smart-style-2.menu-on-top nav ul ul .active > a:hover,
.smart-style-2.menu-on-top nav ul ul li.active:hover > a {
    color: var(--primary) !important;
}

/* =========================================================
   5) HEADER / FOOTER / WIDGETS
   ========================================================= */
.smart-style-2 #header,
.smart-style-2 .superbox-show {
    background-color: var(--surface-default) !important;
}

.smart-style-2 .page-footer {
    background: var(--primary) !important;
}

.smart-style-2 .jarviswidget-color-blueDark > header {
    border-color: var(--primary) !important;
    background: var(--primary) !important;
    color: var(--primary-contrast) !important;
}

.jarviswidget-color-blue > header {
    border-color: var(--primary) !important;
    background: var(--primary) !important;
}

.smart-style-2.menu-on-top aside#left-panel nav > ul > li > ul {
    background-color: var(--surface-default) !important;
}

.smart-style-2.menu-on-top aside#left-panel nav > ul > li:hover {
    background-color: var(--surface-default) !important;
}

.smart-style-2 nav ul .active > a {
    color: var(--secondary) !important;
}

.smart-style-2 nav ul li > a {
    color: var(--secondary) !important;
}

#comunicadosDiv .fa-bell {
    color: var(--secondary) !important;
}

.menu-on-top .menu-item-parent {
    max-width: none;
}

/* =========================================================
   6) MENU HEADER PERSONALIZADO
   ========================================================= */
.menu-on-top.smart-style-2 #left-panel {
    padding-top: 0px !important;
}

#left-panel {
    padding-top: 0px;
    z-index: initial;
}

.smart-style-2.menu-on-top aside#left-panel nav > ul > li > a {
    padding: 2px 9px !important;
}

.menu-on-top aside#left-panel nav > ul > li > a {
    height: 48px !important;
}

.menu-on-top nav > ul > li > a:after {
    content: none !important;
}

.menu-on-top #main,
.fixed-header #main {
    margin-top: 0px !important;
}

/* =========================================================
   7) RESPONSIVO MENU
   ========================================================= */
@media (min-width: 979px) {
    #left-panel {
        left: 180px !important;
    }

    .smart-style-2 nav > ul > li > a > i {
        font-size: 20px !important;
    }

    .smart-style-2.menu-on-top .menu-item-parent {
        font-size: 10px;
    }
}

/* =========================================================
   8) NAVEGAÇÃO (FuelUX)
   ========================================================= */
.fuelux .wizard ul {
    width: 100%;
}

.fuelux .wizard ul li {
    font-size: 13px;
}

.fuelux .wizard ul li a {
    color: #999;
}

.fuelux .wizard ul li.active a {
    color: #3276b1;
}

.fuelux .wizard ul li.anterior a {
    color: #739e73;
}

.fuelux .wizard ul li .badge {
    font-size: 11px;
    padding: 3px 6px;
}

.fuelux .wizard ul li.active .badge {
    background-color: #4387bf !important;
}

.fuelux .wizard ul li.anterior .badge {
    background-color: #739e73 !important;
}

.fuelux .wizard ul li.anterior {
    background-color: #cde0c4 !important;
}

.fuelux .wizard ul li.anterior .chevron:before {
    border-left: 14px solid #cde0c4;
}

.fuelux .wizard ul li .chevron {
    border-left: 14px solid #bbb;
}

/* =========================================================
   9) GERAL / FORMS / TABLES
   ========================================================= */
table .acoes { width: 125px; }

table ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

.center { text-align: center; }
.italic { font-style: italic; }
.clear { clear: both; }
.pointer { cursor: pointer; }

.form-excluir { display: inline-block; }

.margin-sides-15 {
    margin-left: 15px;
    margin-right: 15px;
}

.wellForm { margin-bottom: 15px !important; }
.wellForm h3 { margin-bottom: 15px; }

/* =========================================================
   10) FORMS
   ========================================================= */
.smart-form .col-7 { width: 58.33%; }
.smart-form .col-8 { width: 66.66%; }
.smart-form .col-9 { width: 75%; }
.smart-form .col-10 { width: 83.33%; }
.smart-form .col-11 { width: 91.66%; }
.smart-form .col-12 { width: 100%; }

.smart-form .form-group .col-1.radio { width: 30px; }

.smart-form .well { padding: 19px; }
.smart-form .well .row { padding-bottom: 5px; }

.smart-form .radio-group label.radio {
    margin: 0 5px 25px 0;
}

/* =========================================================
   11) VALIDAÇÃO / INPUTS
   ========================================================= */
.input-validation-error {
    background: #fff0f0 !important;
    border-color: #A90329 !important;
}

.field-validation-error,
.error {
    font-size: 12px;
    color: #b94a48;
}

.messageBlock {
    clear: both;
    display: block;
}

input:read-only,
select[readonly],
.select2-container--disabled .select2-selection {
    background-color: #eee !important;
    opacity: 1 !important;
}

select[readonly] {
    pointer-events: none;
    touch-action: none;
}

/* =========================================================
   12) PERFIL / LISTAS
   ========================================================= */
#mobile-profile-img a.userdropdown img { height: 30px; }

#extr-page #header #logo { margin-top: 15px; }
#logo { margin-top: 8px; }

.profile-filter { position: absolute; top: 0px; }

.jcrop-thumb {
    top: 15px;
    margin-left: 15px;
    border-radius: 50%;
}

.profile-img { border-radius: 50%; }

.oneLine { margin-top: 24px; }

.listOverflowMax {
    max-height: 200px;
    overflow: auto;
}

.listOverflowMaxRegistros {
    max-height: 330px;
    overflow: auto;
}

.smart-form .well.details section { margin-bottom: 5px; }

.smart-form .well.details .label,
.smart-form .table .label {
    display: inline;
    font-weight: 700;
    font-size: 75%;
    color: #FFF;
    padding: .2em .6em .3em;
    line-height: 1;
    text-align: center;
}

.table-inside thead tr {
    background-color: #FFF;
    background-image: none;
}

.smart-form span.badge { padding: 3px 8px; }

.table .secondLevel { padding-left: 35px; }

.textoFeedback {
    color: #b94a48;
    font-size: 14px;
}

/* =========================================================
   13) SELECT2
   ========================================================= */
.select2-selection__choice__remove {
    padding: 3px 0 3px 6px !important;
    cursor: pointer;
}

.select2-selection__choice {
    padding: 1px 28px 1px 8px !important;
    margin: 4px 0 3px 5px !important;
}

.select2-results li:hover { cursor: pointer; }
.select2-results__option[aria-selected=true] { display: none; }

/* =========================================================
   14) RESPONSIVE GERAL
   ========================================================= */
@media only screen and (max-width: 479px) and (min-width: 320px) {
    .page-title { display: block !important; }
    table .acoes { width: 45px; }
}

@media (max-width: 979px) {
    .menu-on-top #mobile-profile-img a.userdropdown img {
        height: 39px;
    }
}