@charset "UTF-8";
/* CSS Document */

    /* Panel lateral */
    .panel-filtros {
        position: fixed;
        top: 0;
        right: -100%;
        width: 480px;
        max-width: 90%;
        height: 100vh;
        background: #fff;
        box-shadow: -2px 0 10px rgba(0, 0, 0, 0.1);
        z-index: 1000;
        transition: right 0.3s ease-in-out;
        display: flex;
        flex-direction: column;
    }

    .panel-filtros.abierto {
        right: 0;
    }

    /* Overlay */
    .overlay-filtros {
        position: fixed;
        top: 0;
        left: 0;
        width: 100vw;
        height: 100vh;
        background: rgba(0, 0, 0, 0.3);
        opacity: 0;
        visibility: hidden;
        z-index: 999;
        transition: opacity 0.3s ease;
    }

    .overlay-filtros.visible {
        opacity: 1;
        visibility: visible;
    }

    .filtros-container {
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        /* empuja el botón abajo */
        height: 100%;
        /* o un valor fijo si lo necesitas */
    }

    .botones-paneles {
        display: flex;
        justify-content: flex-end;
        align-items: flex-end;
        gap: 1rem;
        height: 100%;
        align-self: flex-end;
    }

    #btn-filtros {
        align-self: flex-end;
    }


    #panel-filtros .panel-contenido .text-title>section+section {
        margin-top: 24px;
        /* ~ mt-6 */
    }

    .select-filtro {
        margin-top: 110px !important;
    }



    @media (min-width: 768px) {
        #panel-filtros .panel-contenido .text-title>section+section {
            margin-top: 40px;
            /* ~ md:space-y-10 */
        }
    }