/* Extraido de themes/huayra/sections/calendario_v2.php */

    /* ====== HUAYRA: manter visual anterior (cards brancos) com slider novo ====== */

    /* garante que o slide tenha conteúdo centralizado */
    #calSlider .cal-slide{
        display:flex;
        justify-content:center;
    }

    /* container das 2 caixas no slide */
    #calSlider .calendarios-huayra-ano{
        width: 100%;
        max-width: 980px;
        margin: 0 auto;
    }

    /* CARD branco de verdade (na img 1 ele ficou “transparente”) */
    #calSlider .calendario-box{
        background: #ffffff !important;
        border-radius: 12px;
        padding: 22px 18px;
        box-shadow: 0 10px 26px rgba(0,0,0,.18);
    }

    /* títulos dentro do card (como na imagem 2) */
    #calSlider .calendario-titulo{
        color: #111 !important;
        font-weight: 700;
        font-size: 1.3rem;
    }
    #calSlider .calendario-titulo small{
        color: #6c757d !important;
    }

    /* título geral do bloco (em cima do fundo escuro) */
    .section-title-calendario,
    .section-title-calendario *{
        color:#fff !important;
        text-shadow: 0 2px 12px rgba(0,0,0,.45);
    }

    /* “Ano 2025” no meio do slide (se você estiver mostrando) */
    #calSlider .cal-ano-title,
    #calSlider .cal-ano-title *{
        color:#fff !important;
        text-shadow: 0 2px 12px rgba(0,0,0,.45);
    }

    /* grid dos quadradinhos (fica certinho e alinhado) */
    #calSlider .dias-container{
        display:grid !important;
        grid-template-columns: repeat(6, 64px);
        grid-auto-rows: 64px;
        gap: 10px;
        justify-content:center;
    }

    /* quadradinhos */
    #calSlider .etapa-dia{
        width:64px !important;
        height:64px !important;
        border-radius:10px;
        display:flex;
        flex-direction:column;
        align-items:center;
        justify-content:center;
        padding:0 !important;
        line-height:1;
    }

    /* número + mês bem “colados” */
    #calSlider .etapa-dia strong{
        font-size: 18px !important;
        line-height: 18px;
        margin: 0;
    }
    #calSlider .etapa-dia span{
        font-size: 11px !important;
        margin-top: 3px;
        letter-spacing: .2px;
    }

    /* responsivo: 4 colunas no mobile */
    @media (max-width: 575.98px){
        #calSlider .dias-container{
            grid-template-columns: repeat(4, 64px);
        }
    }

    .cal-slider{
        touch-action: pan-y; /* deixa rolar a página verticalmente sem treta */
    }
    .cal-slider.is-dragging{
        cursor: grabbing;
    }