/*
Theme Name: VelhoBit / PortilloDesign
Theme URI: https://velhobit.com.br/
Author: the Rodrigo Portillo
Author URI: https://velhobit.com.br
Description: Suas variações são criadas exclusivamente para os blogs de Rodrigo Portillo.
Version: 3.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: VelhoBit
*/
/**colors**/
.cinza {
    background-color: #687576;
    color: white;
}
.azul {
    background-color: #255FC4;
    color: white;
}
.verde {
    background-color: #34c38f;
    color: white;
}
.rosa {
    background-color: #D5306D;
    color: white;
}
.roxo {
    background-color: #9C00BF;
    color: white;
}
.esmeralda {
    background-color: #cb60b3;
    color: black;
}
.text-roxo {
    color: #9049a0;
}
.text-esmeralda {
    color: #00DBA8;
}
::-webkit-scrollbar-track {
    background-color: #E0E0E0;
}
::-webkit-scrollbar {
    width: 10px;
    background-color: #F5F5F5;
}
::-webkit-scrollbar-thumb {
    background-color: #17D7CE;
}
a {
    text-decoration: none;
    color: #0C6A87;
}

/**fab-site**/
.area_menu{
	position: fixed;
    left: 0;
    right: 5px;
	bottom: 0;
	overflow: visible;
	height: 2px;
	z-index: 1000;
}

.area_menu .wrap{
	position: relative;
}
body.home .area_menu .wrap{
	max-width: 500px;
}
.fab-site {
    position: absolute;
	bottom: 10px;
	right: 0;
}
.fab-site:hover,
.fab-site:active{
	box-shadow:  0 24px 38px 3px rgba(0,0,0,0.14), 0 9px 46px 8px rgba(0,0,0,0.12), 0 11px 15px -7px rgba(0,0,0,0.2);
}
.fab-site a {
    cursor: pointer;
    width: 48px;
    height: 48px;
    border-radius: 30px;
    border: none;
    box-shadow: 0 1px 5px rgba(0, 0, 0, .4);
    font-size: 24px;
    color: white;
    text-align: center;
    line-height: 2.1em;
    -webkit-transition: .2s ease-out;
    -moz-transition: .2s ease-out;
    transition: .2s ease-out;
}
.fab-site a:focus {
    outline: none;
}
.fab-site a.main {
    position: absolute;
    width: 60px;
    height: 60px;
    border-radius: 30px;
    right: 0;
    bottom: 0;
    margin: 10px 15px;
    z-index: 20;
    line-height: 2.6em;
    text-align: center;
}
.fab-site ul {
    position: absolute;
    bottom: 0;
    right: 0;
    padding: 0;
    padding-right: 16px;
    margin: 5px;
    list-style: none;
    z-index: 10;
    -webkit-transition: .2s ease-out;
    -moz-transition: .2s ease-out;
    transition: .2s ease-out;
}
.fab-site ul li {
    display: flex;
    justify-content: flex-end;
    position: relative;
    margin-bottom: -15%;
    opacity: 0;
    -webkit-transition: .3s ease-out;
    -moz-transition: .3s ease-out;
    transition: .3s ease-out;
}
.fab-site ul li label {
    margin-right: 10px;
    white-space: nowrap;
    display: block;
    margin-top: 14px;
    padding: 3px 8px;
    background-color: #2a3042;
    box-shadow: 0 1px 3px rgba(0, 0, 0, .2);
    border-radius: 3px;
    height: 24px;
    font-family: "jaf-facitweb", sans-serif;
    font-size: 12px;
    pointer-events: none;
    opacity: 1;
    -webkit-transition: .2s ease-out;
    -moz-transition: .2s ease-out;
    transition: .2s ease-out;
    color: white;
}
.fab-site.show a.main, .fab-site.show a.main {
    outline: none;
    box-shadow: 0 3px 8px rgba(0, 0, 0, .5);
    color: white;
}
.fab-site.show a.main + ul, .fab-site.show a.main + ul {
    bottom: 70px;
}

.fab-site button.main:active:before,
.fab-site button.main:focus:before{
    content: '↑';
}

.fab-site.show a.main + ul li,
.fab-site.show a.main + ul li {
    margin-bottom: 10px;
    opacity: 1;
    display: flex;
    justify-content: flex-end;
}
.fab-site.show a.main + ul li:hover label, .fab-site.show a.main + ul li:hover label {
    opacity: 1;
}


/* ==========================================================================
   DIDATA_DROPDOWN_TABELA_20260903
   Menu dentro de tabela sendo cortado — 30 telas da raiz
   --------------------------------------------------------------------------
   `.table-responsive` tem `overflow-x: auto` para a tabela larga rolar de lado.
   Só que overflow em UM eixo faz o navegador recortar nos DOIS: qualquer
   `.dropdown-menu` aberto numa linha da tabela é cortado na borda de baixo.
   `data-bs-display="static"` conserta o POSICIONAMENTO, não o recorte.

   A regra libera o recorte SÓ enquanto existe um menu aberto ali dentro
   (o Bootstrap põe `.show` no menu ao abrir) e o devolve ao fechar. Deixar
   `overflow: visible` fixo mataria a rolagem horizontal — e há telas com 12+
   colunas que dependem dela.

   Navegador sem suporte a `:has()` simplesmente ignora o bloco e fica como
   está hoje: sem regressão, nenhuma tela muda de comportamento.

   Vale para toda tela que carregue este arquivo — não precisa de JS nem de
   alteração tela a tela. Fora do alcance: `app.arquivos.php` e `social.php`,
   que não carregam style.css.
   ========================================================================== */

.table-responsive:has(.dropdown-menu.show) {
    overflow: visible;
}

.card:has(.table-responsive .dropdown-menu.show) {
    overflow: visible;
}
