/*
Theme Name: Modo Default Template
Theme URI: http://seusite.com/modo-default-template
Author: Seu Nome
Author URI: http://seusite.com
Description: Um tema WordPress leve e otimizado para Bootstrap 5, Elementor Pro e WooCommerce.
Version: 1.0
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: modo-default-template
*/
@import url("css/modo-woocommerce.css");
@import url("css/modo-elementor.css");
@import url("css/modo-swal2.css");


:root{
    --modo-color-accent : #BFE73E;
}

/* Estilização do scroll para navegadores baseados em WebKit */
::-webkit-scrollbar {
    width: 5px; /* Largura do scrollbar vertical */
    height: 5px; /* Altura do scrollbar horizontal */
}

/* Fundo do scroll */
::-webkit-scrollbar-track {
    background: #000; /* Cor do fundo do scroll */
}

/* Thumb (a parte que se move) */
::-webkit-scrollbar-thumb {
    background-color: #333  ; /* Cor da parte que se move */
    border-radius: 3px; /* Arredondamento */
}

/* Ao passar o mouse sobre o thumb */
::-webkit-scrollbar-thumb:hover {
    background-color: #888; /* Cor ao passar o mouse */
}

.h1,.h2,.h3,.h4,.h5,.h6,h1,h2,h3,h4,h5,h6
{
    margin-bottom: 0px;
}


/* Scroll no Firefox */
html {
    scrollbar-width: thin; /* Define o scroll como fino */
}


/*ajustando o hr para bater com o layout do boostrap*/
.modo-elementor-page .elementor hr {
    margin: 1rem 0;
}

.modo-elementor-page .elementor p {
    margin-bottom: 0px;
}

.modo-video-header .modo-video-header-label
{
    margin-bottom: 16px;
}

@media (max-width: 575.98px) {
    div.modo-video-grid-item > :not(.modo_video_player_container-fullscreen-support) {
        padding-left:16px !important;
        padding-right:16px !important;
    }

    div.modo-video-grid-container .modo-video-header-label
    {
        padding-left:16px !important;
        padding-right:16px !important;
    }


    div.modo-video-grid-container .modo-video-search
    {
        padding-left:0px !important;
        padding-right:0px !important;
    }

    div.modo-video-grid-container .modo-video-search .modo-video-search-label,
    div.modo-video-grid-container .modo-video-search .modo-video-search-detail
    {
        padding-left:16px !important;
        padding-right:16px !important;
    }


    /*.site-content > div[data-elementor-type="archive"]:first-of-type
    {
        overflow: hidden;
    }*/
}

/*
tamanho do texto de busca   
*/
.ui-autocomplete .ui-menu-item
{
    font-size: small;
    text-transform: lowercase;      
}

.modo-video-header .modo-video-button
{
    @media screen and (max-width:576px) {
        display: none   ;
    }
}

.channel-avatar-container.live .channel-avatar img
{
    border: 2px double #FF5500;
    border-radius: 32px;
    padding: 1px;
}

.channel-avatar-container .live-badge
{
    display: none;
}
.channel-avatar-container.live .live-badge
{
    display: block;
    animation: pulse_size .5s infinite;

}

@keyframes pulse_size {
    0% {
        transform: scale(.95);
    }
    50% {
        transform: scale(1);
    }
    100% {
        transform: scale(.95);
    }
}


.single-modo_video .schedule {
    display: grid;
    gap: 0px;
    margin: 20px 0;
    width:100%;
}

.single-modo_video .schedule-item {
    display: grid;
    grid-template-columns: 60px auto 1fr auto;
    align-items: center;
    gap: 15px;
    background-color: #f5f5f5;
    padding: 8px 16px;
    /*border-radius: 8px;*/
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
    font-size: 16px;
    @media (max-width: 576px) {
        grid-template-columns: 30px auto 1fr auto;
        font-size: 12px;
        gap: 10px;
    }    
}

.single-modo_video .schedule-item img {
    width: 100px;
    height: auto;
    object-fit: cover;
    border-radius: 4px;
    @media (max-width: 576px) {
            max-width: 50px;
    }
    
}

.single-modo_video .schedule-item p {
    color: #333;
    margin: 0;
    padding: 0;
}

.single-modo_video .schedule-item .mini-watch {
    font-size: 12px;
    color: white;
    background-color: #222;
    padding: 2px 5px;
    border-radius: 5px;
}


.user-origin-channel{
    img{
        width:16px;
        aspect-ratio: 1;
    }
}


/* Detecta o modo paisagem apenas em dispositivos móveis */
@media (max-width: 768px) and (orientation: landscape) {
    .modo-video-grid-item[data-play-automatic="yes"] .modo_video_player_container-fullscreen-support {
        position: fixed;
        top: 0;
        left: 0;
        width: 100vw;
        height: 100vh;
        z-index: 9999;
        background-color: #000; /* Ajuste conforme necessário */
    }

    /* Remove o scroll da página para simular tela cheia */
    body.landscape-fullscreen {
        overflow: hidden;
    }
}

div[data-elementor-type="floating-buttons"]
{
    z-index:99999;
}