@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;700&display=swap');

/* LOI25 Privacy Modal Styles - Versión Elegante */
.loi25-privacy-modal {
    position: fixed !important;
    bottom: -35px !important;
    left: 0 !important;
    width: 100% !important;
    z-index: 2000 !important;
    font-size: 16px !important;
}

.loi25-privacy-modal.with-transition,
.loi25-privacy-modal.with-transition .open-loi25-privacy-modal {
    transition: all .3s linear !important;
}

.loi25-privacy-modal * {
    box-sizing: border-box !important;
    color: #000 !important;
    font-family: 'Segoe UI', 'Roboto', sans-serif !important;
    font-size: 1em !important;
    font-weight: 400 !important;
    letter-spacing: 0 !important;
    line-height: 1.45em !important;
    text-transform: none !important;
}

.loi25-privacy-modal strong,
.loi25-privacy-modal b {
    font-weight: 700 !important;
}

.loi25-privacy-modal.loi25Hide {
    transform: translateY(100%) !important;
    display: block !important;
}

/* ICONO DE CONFIGURACIÓN - FUERA DEL MODAL */
.open-loi25-privacy-modal {
    width: 100px !important;
    height: 100px !important;
    background: url('../images/logo_loi25.png') !important;
    color: #fff !important;
    border-radius: 50% !important;
    position: fixed !important;
    bottom: 20px !important;
    left: 20px !important;
    cursor: pointer !important;
    transition: all 0.3s ease !important;
    z-index: 2001 !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3) !important;
}

.open-loi25-privacy-modal:hover {
    transform: scale(1.05) !important;
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.4) !important;
}

.open-loi25-privacy-modal.loi25Hide {
    display: none !important;
}

/* BOTÓN DE CERRAR */
.close-modal {
    position: absolute !important;
    top: 10px !important;
    right: 10px !important;
    cursor: pointer !important;
    font-size: 15px !important;
    color: #333 !important;
    transition: all 0.3s ease !important;
    text-align: center !important;
    width: 22.5px !important;
    height: 22.5px !important;
    background: #fff !important;
    border-radius: 50% !important;
    z-index: 20 !important;
    line-height: 22.5px !important;
    border: none !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2) !important;
}

.close-modal:hover {
    background: #f0f0f0 !important;
    transform: scale(1.1) !important;
}

.close-modal.loi25Hide {
    display: none !important;
}

/* CONTENIDO DEL MODAL */
.loi25-privacy-modal-content {
    background-color: #ffffff !important;
    border-radius: 8px !important;
    box-shadow: 0 32px 68px rgba(0, 0, 0, .3) !important;
    box-sizing: border-box !important;
    color: #141414 !important;
    font-family: sans-serif !important;
    font-size: 15px !important;
    height: auto !important;
    left: 50% !important;
    letter-spacing: .1px !important;
    line-height: 24px !important;
    max-height: calc(100% - 16px) !important;
    overflow: hidden !important;
    position: fixed !important;
    text-align: initial !important;
    top: 50% !important;
    transform: translate(-50%, -50%) !important;
    transition: all .5s ease !important;
    transition-property: width, max-width, top, bottom, left, opacity !important;
    width: calc(100% - 16px) !important;
    z-index: 2147483631 !important;
    max-width: 700px !important;
    padding: 30px !important;
}

/* HEADER DEL MODAL */
.loi25-privacy-modal-header {
    flex: 0 0 auto !important;
    max-width: 830px !important;
    align-self: stretch !important;
}

.loi25-privacy-modal-header .titre {
    font-size: 21px !important;
    font-weight: 700 !important;
    margin: 0 0 10px !important;
    border-bottom: 1px solid #000 !important;
}

.loi25-privacy-modal-header .customizingDesc {
    display: none !important;
}

.loi25-privacy-modal-header .customizingDesc.loi25Show {
    display: block !important;
}

.loi25-privacy-modal-header .acceptingDesc.loi25Hide {
    display: none !important;
}

.loi25-privacy-modal-header p {
    font-size: 16px !important;
}

.loi25-privacy-modal-header p a {
    text-decoration: underline !important;
}

.loi25-privacy-modal-header *:last-child {
    margin: 0 !important;
}

/* INFORMACIÓN DEL USUARIO */
.modifiedDate, .browserID {
    display: flex !important;
    font-size: 12px !important;
    color: #888 !important;
    margin-top: 10px !important;
    padding: 5px !important;
    background: #f0f0f0 !important;
    border-radius: 3px !important;
}

.modifiedDate.loi25Hide, .browserID.loi25Hide {
    display: none !important;
}

.modifiedDate strong, .browserID strong {
    margin-right: 0.65ch !important;
}

/* PERMISOS */
.loi25-privacy-permissions {
    display: none !important;
}

.loi25-privacy-permissions.loi25Show {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: flex-start !important;
    flex: 1 1 !important;
    margin: 0 -15px !important;
}

.loi25-privacy-permission {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 10px !important;
    margin: 0 0 10px !important;
    flex: 0 0 calc(50% - 30px) !important;
    padding: 0 60px !important;
    align-self: flex-start !important;
}

/* INDICADOR DE EXPANSIÓN */
.open-desc {
    flex: 0 0 auto !important;
    width: 20px !important;
    cursor: pointer !important;
    position: relative !important;
}

.open-desc.loi25Hide {
    opacity: 0 !important;
    pointer-events: none !important;
    visibility: hidden !important;
}

.open-desc::before {
    content: '' !important;
    width: 50% !important;
    height: 2px !important;
    background-color: #000 !important;
    position: absolute !important;
    top: 50% !important;
    left: 2px !important;
    transform: translateY(-50%) rotate(45deg) !important;
    transition: all 0.3s ease !important;
}

.open-desc::after {
    content: '' !important;
    width: 50% !important;
    height: 2px !important;
    background-color: #000 !important;
    position: absolute !important;
    top: 50% !important;
    right: 2px !important;
    transform: translateY(-50%) rotate(-45deg) !important;
    transition: all 0.3s ease !important;
}

.open-desc.loi25Opened {
    transform: rotate(180deg) !important;
}

/* LABELS Y CHECKBOXES */
.loi25-privacy-permission label {
    flex: 1 1 !important;
    font-size: 18px !important;
    display: flex !important;
    margin: 0 !important;
    align-items: center !important;
}

.loi25-privacy-permission label input[type="checkbox"] {
    display: none !important;
}

.loi25-privacy-permission label input[type="checkbox"]:disabled + span,
.loi25-privacy-permission label input[type="checkbox"]:disabled + span + span.custom-check::before {
    cursor: not-allowed !important;
}

.loi25-privacy-permission label input[type="checkbox"] + span,
.loi25-privacy-permission label input[type="checkbox"] + span + span.custom-check::before {
    cursor: pointer !important;
}

.loi25-privacy-permission label input[type="checkbox"]:checked + span + span.custom-check::before {
    transform: translateX(20px) !important;
}

.loi25-privacy-permission label input[type="checkbox"]:checked + span + span.custom-check {
    background: rgba(0,0,0,0.7) !important;
}

.loi25-privacy-permission label span:not(.custom-check) {
    flex: 1 1 !important;
}

/* TOGGLE SWITCH PERSONALIZADO */
.loi25-privacy-permission label span.custom-check {
    width: 44px !important;
    height: 24px !important;
    border-radius: 12px !important;
    background-color: rgba(131,131,131,0.8) !important;
    position: relative !important;
    transition: all 0.3s ease !important;
    margin-left: 10px !important;
}

.loi25-privacy-permission label span.custom-check::before {
    content: '' !important;
    position: absolute !important;
    top: 2px !important;
    left: 2px !important;
    width: 20px !important;
    height: 20px !important;
    border-radius: 10px !important;
    background-color: #fff !important;
    transition: all 0.3s ease !important;
}

/* DESCRIPCIONES */
.loi25-privacy-permission .description {
    flex: 0 0 100% !important;
    display: none !important;
    margin-top: 10px !important;
    font-size: 14px !important;
    color: #666 !important;
    line-height: 1.4 !important;
}

.loi25-privacy-permission .description ul {
    margin: 0 !important;
    padding-left: 20px !important;
}

.loi25-privacy-permission .description.loi25Show {
    display: block !important;
}

/* FOOTER Y BOTONES */
.loi25-privacy-modal-footer {
    flex: 0 0 auto !important;
    display: flex !important;
    gap: 10px !important;
    margin-left: auto !important;
    margin-top: 20px !important;
}

.btn {
    background: #fff !important;
    color: #333 !important;
    cursor: pointer !important;
    font-size: 15px !important;
    padding: 10px 20px !important;
    border-radius: 0 !important;
    box-shadow: 0 0 10px rgba(0,0,0,0.5) !important;
    border: 0 !important;
    transition: all 0.3s ease !important;
    font-weight: 500 !important;
    min-width: 120px !important;
	height:40px!important;
}

.btn:hover {
    background: #f0f0f0 !important;
    transform: translateY(-1px) !important;
	
    box-shadow: 0 2px 15px rgba(0,0,0,0.6) !important;
}

.accepting-cookies {
    background: #7a7c7a !important;
    color: white !important;
}

.accepting-cookies:hover {
    background: #4d4d4d !important;
}

.rejecting-cookies {
    background: #dc3545 !important;
    color: white !important;
}

.rejecting-cookies:hover {
    background: #c82333 !important;
}

.custom-settings {
    background: #17a2b8 !important;
    color: white !important;
}

.custom-settings:hover {
    background: #138496 !important;
}

.saving-settings {
    background: #ffc107 !important;
    color: #212529 !important;
    display: none !important;
}

.saving-settings:hover {
    background: #e0a800 !important;
}

.saving-settings.loi25Show {
    display: inline-block !important;
}

.rejecting-cookies.loi25Hide,
.custom-settings.loi25Hide {
    display: none !important;
}

/* RESPONSIVE */
@media screen and (max-width: 1600px) {
    .loi25-privacy-modal .loi25-privacy-modal-content .loi25-privacy-permission {
        flex: 0 0 calc(100% - 30px) !important;
    }
}

@media screen and (max-width: 1199.98px) {
    .loi25-privacy-modal .loi25-privacy-modal-content {
        padding: 15px !important;
    }
    
    .loi25-privacy-modal .loi25-privacy-modal-content .loi25-privacy-permission {
        flex: 0 0 50% !important;
        padding: 0 15px !important;
    }

    .loi25-privacy-modal-footer {
        flex: 0 0 100% !important;
        justify-content: flex-end !important;
        margin: 30px 0 0 !important;
    }
}

@media screen and (max-width: 991.98px) {
    .loi25-privacy-modal .loi25-privacy-modal-content .loi25-privacy-modal-header {
        flex: 0 0 100% !important;
        padding-right: 0 !important;
    }

    .loi25-privacy-modal .loi25-privacy-modal-content .loi25-privacy-permissions.loi25Show {
        flex: 0 0 calc(100% + 30px) !important;
        margin: 15px -15px 0 !important;
    }

    .loi25-privacy-modal .loi25-privacy-modal-content .loi25-privacy-permission {
        flex: 0 0 50% !important;
    }
}

@media screen and (max-width: 576.98px) {
    .loi25-privacy-modal .loi25-privacy-modal-content .loi25-privacy-permission {
        flex: 0 0 100% !important;
    }
    
    .btn {
        min-width: 100px !important;
        padding: 8px 15px !important;
        font-size: 14px !important;
    }
}

@media (max-width: 449.98px) {
    .loi25-privacy-modal .loi25-privacy-modal-content .loi25-privacy-modal-header .modifiedDate,
    .loi25-privacy-modal .loi25-privacy-modal-content .loi25-privacy-modal-header .browserID {
        flex-direction: column !important;
    }
}

@media screen and (max-width: 430px) {
    .loi25-privacy-modal-footer {
        flex-direction: column !important;
        margin: 15px 0 0 !important;
    }
    
    .btn {
        width: 100% !important;
        margin: 5px 0 !important;
    }
}

/* UTILIDADES */
.loi25Hide {
    display: none !important;
}

.loi25Show {
    display: block !important;
}

/* ANIMACIONES */
.loi25-privacy-modal-content {
    animation: modalSlideIn 0.3s ease-out !important;
}

@keyframes modalSlideIn {
    from {
        opacity: 0;
        transform: translate(-50%, -60%);
    }
    to {
        opacity: 1;
        transform: translate(-50%, -50%);
    }
}

/* ESTADOS DEL MODAL */
.loi25-privacy-modal.customizing .acceptingDesc {
    display: none !important;
}

.loi25-privacy-modal.customizing .customizingDesc {
    display: block !important;
}

.loi25-privacy-modal.customizing .loi25-privacy-permissions {
    display: flex !important;
}

/* PLACEHOLDER DE VIDEO */
.no-video-icon {
    max-width: 100% !important;
    aspect-ratio: 16/9 !important;
    padding: 10% 10% 0 !important;
    text-align: center !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
}

.no-video-icon img {
    max-width: 100% !important;
    max-height: calc(100% - 50px) !important;
    display: block !important;
    margin: 0 auto 10px !important;
    object-fit: contain !important;
}

.no-video-icon span {
    font-size: 13px !important;
    font-weight: 700 !important;
    line-height: 1.45em !important;
    color: #9b9b9b !important;
}