﻿@media print {
    a[href]:after {
        content: none !important;
    }
}

/* ESTILOS GENERALES */

h1,
.h1,
h2,
.h2,
h3,
.h3 {
    margin-top: 10px;
}

label {
    font-weight: normal !important;
}

.radio label.iv::before {
    display: none !important;
}

.seccion-entidad input[type='text'],
.seccion-entidad input[type='password'],
.seccion-entidad input[type='email'],
.seccion-entidad select,
.seccion-entidad textarea,
.modal-entidad input[type='text'],
.modal-entidad input[type='password'],
.modal-entidad input[type='email'],
.modal-entidad select,
.modal-entidad textarea {
    height: auto;
    padding: 7px;
    width: 100%;
    font-size: 14px;
    border-radius: 5px;
}

.seccion-principal.new {
    border: none !important;
}

.div-sin-marco {
    height: 180px !important;
    width: 100%;
    padding-top: 0 !important;
    position: relative;
}

.truncate-multiline {
    min-height: 52px;
}

#lista-idiomas li,
#lista-idiomas-descripcion li {
    border: 1px solid #f2f2f2;
    border-radius: 5px 5px 0px 0px;
}

    #lista-idiomas li.active,
    #lista-idiomas-descripcion li.active {
        border: 2px solid #f2f2f2;
        border-radius: 5px 5px 0px 0px;
        font-weight: bold;
    }

.v-middle {
    vertical-align: middle;
}

.negrita {
    font-weight: bold;
}

.content-img {
    margin: 0px auto;
    text-align: center;
}

    .content-img img {
        vertical-align: middle;
    }

@media (min-width:992px) {
    .col-5-md {
        width: 20% !important;
    }
}

@media (min-width:992px) {
    .col-7-md {
        width: 14.2% !important;
    }
}


.relative {
    position: relative !important;
}

.m-t-0 {
    margin-top: 0 !important;
}

.m-t-1 {
    margin-top: 1px !important;
}

.m-t-5 {
    margin-top: 5px !important;
}

.m-t-6 {
    margin-top: 6px !important;
}

.m-t-5-inverse {
    margin-top: -5px !important;
}

.m-t-10 {
    margin-top: 10px !important;
}

.m-t-10-inverse {
    margin-top: -10px !important;
}

.m-t-15-inverse {
    margin-top: -15px !important;
}

.m-t-20-inverse {
    margin-top: -20px !important;
}

.m-t-30 {
    margin-top: 30px !important;
}

.m-t-30-inverse {
    margin-top: -30px !important;
}

.m-t-34-inverse {
    margin-top: -34px !important;
}

.m-t-40-inverse {
    margin-top: -40px !important;
}

.m-t-70-inverse {
    margin-top: -70px !important;
}

.m-t-15 {
    margin-top: 15px !important;
}

.m-t-20 {
    margin-top: 20px !important;
}

.m-t-25 {
    margin-top: 25px !important;
}

.m-t-30 {
    margin-top: 30px !important;
}

.m-t-40 {
    margin-top: 40px !important;
}

.m-t-50 {
    margin-top: 50px !important;
}

@media (max-width:767px) {
    .m-t-50-xs {
        margin-top: 50px;
    }
}

.m-t-60 {
    margin-top: 60px !important;
}

.m-l-0 {
    margin-left: 0 !important;
}

.m-l-5 {
    margin-left: 5px !important;
}

.m-l-10 {
    margin-left: 10px !important;
}

.m-l-15 {
    margin-left: 15px !important;
}

.m-l-20 {
    margin-left: 20px !important;
}

.m-l-30 {
    margin-left: 30px !important;
}

.m-l-40 {
    margin-left: 40px !important;
}

.m-l-50 {
    margin-left: 50px !important;
}

.m-l-inverse-15 {
    margin-left: -15px !important;
}

.m-b-5 {
    margin-bottom: 5px !important;
}

.m-b-10 {
    margin-bottom: 10px !important;
}

.m-b-15 {
    margin-bottom: 15px !important;
}

.m-b-20 {
    margin-bottom: 20px !important;
}

.m-b-30 {
    margin-bottom: 30px !important;
}

.m-b-40 {
    margin-bottom: 40px !important;
}

.m-b-50 {
    margin-bottom: 50px !important;
}

.m-r-10 {
    margin-right: 10px !important;
}

.m-r-15 {
    margin-right: 15px !important;
}

.m-r-20 {
    margin-right: 20px !important;
}

.m-r-30 {
    margin-right: 30px !important;
}

.m-r-40 {
    margin-right: 40px !important;
}

.m-r-50 {
    margin-right: 50px !important;
}

.p-5 {
    padding: 5px !important;
}

.p-10 {
    padding: 10px !important;
}

.p-0 {
    padding: 0 !important;
}

.p-l-30 {
    padding-left: 30px !important;
}

.p-b-50 {
    padding-bottom: 50px;
}

@media (max-width:767px) {
    .p-b-50-xs {
        padding-bottom: 50px;
    }
}


.p-r-30 {
    padding-right: 30px !important;
}

.p-absolute {
    position: absolute;
}

.p-relative {
    position: relative !important;
}

/* POP-UPS */

.modal-entidad .close,
.seccion-entidad .close {
    float: right;
    font-size: 26px !important;
    font-weight: normal;
    line-height: 1.428571429;
    color: #fff;
    text-shadow: none;
    opacity: 1;
    margin-top: -10px;
}

.modal-entidad .seccion-principal .seccion-titulo {
    border-bottom: none !important;
}

.modal-entidad .seccion-principal h1 {
    text-transform: none !important;
}

.modal-entidad .new-form-control {
    font-size: 14px !important;
    margin: 5px 0 !important;
    padding: 5px 0 2px 0;
    color: #333333;
    font-weight: normal !important;
}

    .modal-entidad .new-form-control.titulo {
        margin-top: 15px;
    }

/* GESTOR */

.bg-color-gris-claro {
    background-color: #F7F7F7;
}

.fondo-gris-medium {
    background-color: #EFEFEF;
}

.btn-close-modal {
    color: black !important;
    font-size: 20px !important;
    border: 1px solid #e7e7e7 !important;
    padding-left: 5px;
    padding-right: 5px;
    cursor: pointer;
}

.separador-papelera {
    padding-top: 11px;
    padding-bottom: 11px;
    margin: 0;
}

.btn-gestor {
    padding: 10px 5px;
    color: #fff !important;
    font-size: 20px !important;
}

/* MAQUETACIÓN SECCIONES */

/*div[class^="col-"]:first-child {
    padding-left: 0;
}

div[class^="col-"]:last-child {
    padding-right: 0;
}*/

.acciones span {
    margin-top: 0 !important;
    opacity: 1 !important;
}

.acciones .comentarios,
.acciones .megusta,
.acciones .miembros,
.acciones .unirme {
    opacity: 1 !important;
}

.megusta:hover {
    opacity: 0.5 !important;
}

.miembros:hover {
    opacity: 0.5 !important;
}

.text-num-comentarios {
    margin-top: 2px !important;
}

.ico-like-megusta {
    margin-top: 2px !important;
}

.texto-megusta {
    margin-top: 2px !important;
}

.seccion-caja-galerias {
    margin: 5px;
}

    .seccion-caja-galerias img {
        max-height: 260px;
        width: auto;
        max-width: 100%;
        /*overflow: hidden;
        z-index: 98;
        object-fit: cover;*/
        position: absolute;
        left: 50%;
        top: 50%;
        -webkit-transform: translate(-50%, -50%);
    }

.seccion-caja {
    margin: 5px;
    border-radius: 5px !important;
}

    .seccion-caja img {
        height: 361px;
        width: 100%;
        overflow: hidden;
        z-index: 98;
        object-fit: cover;
    }

    .seccion-caja.equipos img {
        height: 150px;
        width: 100%;
        overflow: hidden;
        z-index: 98;
        object-fit: contain;
    }

    .seccion-caja iframe,
    .seccion-caja .cajadevideo {
        height: 290px !important;
    }

.seccion-caja-galerias iframe,
.seccion-caja-galerias .cajadevideo {
    height: 361px !important;
}

.seccion-caja.galerias img {
    /*height: 260px !important;*/
}

.seccion-caja.galerias iframe {
    height: 254px !important;
}

.seccion-caja-galerias.galerias iframe {
    height: 254px !important;
}

.seccion-caja.borde {
    border: 1px solid #EEEEEE;
    min-height: 355px !important;
}


.seccion-caja-galerias.borde {
    border: 1px solid #EEEEEE;
}

.seccion-caja .titulo {
    font-size: 21px;
    font-weight: bold;
    margin: 10px 0px;
    height: 60px;
    overflow: hidden;
}

.seccion-caja-galerias .titulo {
    font-size: 21px;
    font-weight: bold;
    margin: 10px 0px;
    height: 60px;
    overflow: hidden;
}

.seccion-caja .titulo.sub {
    font-size: 16px;
}

.seccion-caja-galerias .titulo.sub {
    font-size: 16px;
}

.seccion-caja .descripcion {
    font-size: 16px;
    opacity: 1;
    letter-spacing: 0px;
    margin-bottom: 10px;
    height: 65px;
    overflow: hidden;
}

.seccion-caja-galerias .descripcion {
    font-size: 16px;
    opacity: 1;
    letter-spacing: 0px;
    margin-bottom: 10px;
    height: 100px;
    overflow: hidden;
}

.seccion-caja .descripcion.sub {
    font-size: 12px;
}

.seccion-caja-galerias .descripcion.sub {
    font-size: 12px;
}

.seccion-caja .descripcion.corto {
    height: 50px;
}

.seccion-caja-galerias .descripcion.corto {
    height: 50px;
}

.seccion-caja .descripcion.corto.sub {
    height: 30px;
}

.seccion-caja-galerias .descripcion.corto.sub {
    height: 30px;
}

.seccion-caja .fecha {
    font-size: 14px;
    letter-spacing: 0px;
    opacity: 1;
    font-weight: bold;
}

.seccion-caja-galerias .fecha {
    font-size: 14px;
    letter-spacing: 0px;
    opacity: 1;
    font-weight: bold;
}

.seccion-caja .precio-caja {
    font-size: 15px;
}

.seccion-caja-galerias .precio-caja {
    font-size: 15px;
}

.seccion-caja .tag {
    position: absolute;
    top: 10px;
    right: 0;
}

.seccion-caja-galerias .tag {
    position: absolute;
    top: 10px;
    right: 0;
}

.seccion-caja .tag .option {
    background-color: #fff;
    padding: 5px 15px;
    margin-bottom: 10px;
    opacity: 1;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.5);
    border-radius: 10px 0 0 10px;
    border-right: none;
    font-size: 16px;
}

.seccion-caja-galerias .tag .option {
    background-color: #fff;
    padding: 5px 15px;
    margin-bottom: 10px;
    opacity: 1;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.5);
    border-radius: 10px 0 0 10px;
    border-right: none;
    font-size: 16px;
}

.seccion-caja-grupo img {
    height: 145px !important;
}

.seccion-caja .titulo-grupo {
    font-size: 14px;
    margin-bottom: 0;
}

.seccion-caja .descripcion-grupo {
    font-size: 12px;
}

.seccion-caja .miembros-grupos {
    margin-top: 5px;
    height: 75px;
}

.fecha-info-evento {
    background-color: rgb(255, 255, 255);
    position: absolute;
    top: 7px;
    left: 7px;
    border-radius: 12%;
    padding-left: 0;
    padding-right: 0;
    padding-top: 5px;
    z-index: 0;
}

.fecha-info-evento-completa {
    background-color: rgb(255, 255, 255);
    position: absolute;
    top: 7px;
    left: 7px;
    border-radius: 12%;
    padding-left: 0;
    padding-right: 18px;
    padding-top: 5px;
    padding-bottom: 0;
    height: 52px;
    z-index: 0;
}

.texto-dia-fecha-evento {
    color: #000 !important;
    font-size: 22px !important;
    font-weight: 700 !important;
}

.texto-mes-fecha-evento {
    color: #363636 !important;
    font-weight: 700;
    font-size: 12px !important;
    margin-top: -17px !important;
    margin-left: 1px !important;
}

.separador-fechas {
    font-size: 40px;
    margin-top: -7px;
}

@media (max-width: 992px) {
    .seccion-caja .titulo {
        height: auto;
        overflow: auto;
    }

    .seccion-caja-galerias .titulo {
        height: auto;
        overflow: auto;
    }

    .seccion-caja .descripcion {
        height: auto;
        overflow: auto;
    }

    .seccion-caja-galerias .descripcion {
        height: auto;
        overflow: auto;
    }
}

/* GALERÍAS */
.big .anterior-siguiente .fa-arrow-left {
    left: 2% !important;
    font-size: 16px !important;
    padding: 7px 7px !important;
}

.big .anterior-siguiente .fa-arrow-right {
    right: 2% !important;
    font-size: 16px !important;
    padding: 7px 9px !important;
}

.contenido .slider_galeria .small {
    padding-left: 8px !important;
}

    .contenido .slider_galeria .small ul li {
        height: 85px !important;
    }

    .contenido .slider_galeria .big .big-img-wrapper,
    .contenido .slider_galeria .small .fondo-blanco {
        border-radius: 5px !important;
    }

/* COMENTARIOS */
.hilo-comentarios {
    border: 1px solid #f2f2f2;
    padding: 25px !important;
}

    .hilo-comentarios h1 {
        font-size: 22px !important;
    }

    .hilo-comentarios h2 {
        font-size: 18px !important;
    }

/* LISTAS DRAG AND DROP */

.facet-list {
    list-style-type: none;
    margin: 0;
    padding: 0;
    margin-right: 10px;
    min-height: 1.5em;
    font-size: 10px;
    height: 150px;
    overflow-y: auto;
}

    .facet-list li {
        margin-bottom: 1px;
        padding: 1px 3px;
        font-size: 1.2em;
        border-radius: 2px;
    }

        .facet-list li.placeholder {
            height: 1.2em;
        }

.facet {
    border: 1px solid #bbb;
    background-color: #fafafa;
    cursor: move;
}

    .facet.ui-sortable-helper {
        opacity: 0.5;
    }

.placeholder {
    border: none;
    background-color: #fffffd;
}

/* MENU IB */
#ib-header.mobile-navigation .ib-mobile-nav .ib-navmenu .background .user-menu * {
    background: transparent;
}

/*
    GESTOR
*/

.f-size-12 {
    font-size: 12px !important;
}

.f-size-14 {
    font-size: 14px !important;
}

.f-size-16 {
    font-size: 16px !important;
}

.f-size-17 {
    font-size: 17px !important;
}

.f-size-18 {
    font-size: 18px !important;
}

.f-size-20 {
    font-size: 20px !important;
}

.f-size-22 {
    font-size: 22px !important;
}

@media (max-width:991px) {
    .alpha-sm {
        padding-left: 0 !important;
    }

    .omega-sm {
        padding-right: 0 !important;
    }
}

@media (min-width:768px) {

    .img-slider {
        min-height: 92px;
    }
}

@media (max-width:767px) {
    .alpha-xs {
        padding-left: 0 !important;
    }

    .omega-xs {
        padding-right: 0 !important;
    }

    .box-slider {
        height: auto !important;
    }

    .img-slider {
        min-height: 100px;
    }
}

.border-slider {
    padding-top: 15px;
    padding-bottom: 15px;
    border-right: 3px solid #E8E8EC;
    border-bottom: 3px solid #E8E8EC;
    border-top: 1px solid #E8E8EC;
    border-left: 1px solid #E8E8EC;
    margin: 0;
}

.box-slider {
    overflow: hidden;
    height: 150px;
    margin-top: 10px;
    margin-bottom: 10px;
}

.input-text-slider {
    height: 30px !important;
    border: 2px solid #C1C1C1 !important;
}

.textarea-slider {
    border: 2px solid #C1C1C1 !important;
}

.ico-arrow {
    font-size: 30px;
}

.close-modal-slider {
    color: #9B9B9B !important;
    font-size: 35px !important;
}

.btn-gestor-slider {
    padding-left: 50px !important;
    padding-right: 50px !important;
}

.btn-guardar-cambios-slider {
    border-bottom: 3px solid #E8E8EC;
    padding-bottom: 20px;
}

.mensaje-validacion {
    background-color: #F2DEDE !important;
    color: #a94442 !important;
    margin-top: 20px;
    padding-top: 5px;
    padding-bottom: 5px;
    margin-bottom: 20px;
}

.mensaje-validacion-newslider {
    background-color: #F2DEDE !important;
    color: #a94442 !important;
    margin-top: 20px;
    margin-bottom: 20px;
}

.preloader {
    width: 70px;
    height: 70px;
    border: 10px solid #eee;
    border-top: 10px solid #666;
    border-radius: 50%;
    animation-name: girar;
    animation-duration: 2s;
    animation-iteration-count: infinite;
}

@keyframes girar {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }
}

.element-preloader {
    height: 158px;
    margin-top: 100px;
}

.imgGaleria {
    height: 260px !important;
}

.fieldset-gestor {
    /* padding: 8px; */
    margin: 0 !important;
    /* border: 1px solid; */
    min-width: 0 !important;
    padding-left: 15px !important;
    /* padding-right: 100%; */
    /* width: 100%; */
    border: 1px solid #c0c0c0 !important;
    margin: 0 2px !important;
    padding: 0.35em 0.625em 0.75em !important;
}

.legend-gestor {
    width: auto !important;
    padding: 5px !important;
    border: none !important;
    margin-bottom: 5px !important;
}

.title-entidad {
    font-size: 28px !important;
}

@media(max-width:991px) {
    .alpha-xs {
        padding-left: 15px;
    }

    .omega-xs {
        padding-right: 15px;
    }
}

@media(max-width:991px) {
    .height-xs {
        margin-top: 10px;
    }
}

/* MOBILE */

.slick-track {
    margin-left: 0 !important;
    margin-right: 0 !important;
}

button.navbar-toggle {
    margin-top: -5px !important;
}

.mobile {
    font-size: 14px !important;
}

    .mobile .py-10 {
        padding-top: 10px;
        padding-bottom: 10px;
    }

    .mobile .pt-10 {
        padding-top: 10px;
    }

    .mobile .pb-10 {
        padding-bottom: 10px;
    }

    .mobile select {
        border: none !important;
        border-radius: 0 !important;
    }

    .mobile .seccion-principal {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

        .mobile .seccion-principal h3 {
            display: inline-block;
            font-weight: bold;
        }

    .mobile .btn-default-xl.botonCrear .fa-plus {
        display: block;
    }

    .mobile .line-bottom {
        border-bottom: 1px solid #f4f4f4;
    }

    .mobile .fa-plus,
    .mobile .fa-minus {
        background-color: transparent;
        margin-right: 0 !important;
        padding: 0 5px;
        font-size: 14px;
        font-weight: bold;
    }

    .mobile .fa-plus,
    .mobile .fa-minus,
    .mobile .fa-pencil,
    .mobile .fa-download {
        padding: 0 !important;
        border-radius: 5px;
        margin-right: 0;
    }

    .mobile .titulo {
        font-size: 16px;
        margin-bottom: 5px;
    }

    .mobile .action-user a:hover {
        text-decoration: none !important;
    }

    .mobile .action-user .fa,
    .mobile .action-user .far,
    .mobile .action-user .fas,
    .mobile .action-user .fal {
        font-size: 20px !important;
    }

    .mobile .action-user .text-num {
        font-size: 10px !important;
    }

    .mobile .caja-titulo {
        position: absolute;
        left: 10px;
        background: #fff;
        bottom: 10px;
        border-radius: 5px;
        box-shadow: 2px 2px 5px 0px;
        opacity: 0.9;
        width: 90%;
        margin-left: 10px;
    }

    .mobile .caja-titulo-webinar {
        position: absolute;
        left: 10px;
        background: #fff;
        bottom: -10px;
        border-radius: 5px;
        box-shadow: 2px 2px 5px 0px;
        opacity: 0.9;
        width: 90%;
        margin-left: 10px;
    }

    .mobile .caja-titulo-widget-generico {
        position: absolute;
        left: 25px;
        background: #fff;
        bottom: 10%;
        border-radius: 5px;
        box-shadow: 2px 2px 5px 0px;
        opacity: 0.9;
        width: 90%;
        z-index: 999999999999999999999;
    }

    .mobile .fecha-info-evento {
        height: auto !important;
        padding: 10px !important;
        line-height: 17px;
        box-shadow: 2px 2px 5px 0px;
        top: 15px;
        left: 20px;
    }

        .mobile .fecha-info-evento p {
            margin: 0 !important;
        }

    .mobile .seccion-caja {
        margin: 0 !important;
    }

    .mobile .botonera {
        position: absolute;
        height: auto !important;
        top: 10px;
        right: 20px;
    }

        .mobile .botonera .btn-primary,
        .mobile .botonera .btn-default {
            box-shadow: 2px 2px 5px 0px;
        }

    .mobile .slick-dots {
        margin-left: -15px !important;
    }

    .mobile .descripcion,
    .mobile .descripcion span {
        font-size: 12px !important;
    }

        .mobile .descripcion p {
            margin-top: 5px !important;
        }

        .mobile .descripcion img {
            max-width: 100% !important;
            height: auto !important;
        }

    .mobile .hilo-comentarios {
        padding: 15px !important;
        border: none !important;
        margin-top: 10px;
    }

        .mobile .hilo-comentarios .comentario-padre {
            padding-top: 10px !important;
            font-size: 12px !important;
        }

        .mobile .hilo-comentarios .fa {
            font-size: 14px !important;
        }

        .mobile .hilo-comentarios .bocadillo {
            padding-top: 10px;
            padding-bottom: 10px;
        }

        .mobile .hilo-comentarios .compartir {
            margin-top: -10px;
            margin-bottom: 10px;
        }

    .mobile .creator {
        margin-top: 0px;
    }

    .mobile .ver-mas {
        margin-top: 10px !important;
    }

    .mobile .botonEventos {
        width: auto !important;
    }

        .mobile .botonEventos.publicado {
            color: #ffffff !important;
            background-color: #5cb85c !important;
            border-color: #4cae4c !important;
        }

            .mobile .botonEventos.publicado .fa-check {
                color: #fff !important;
                margin-right: 0 !important;
            }

        .mobile .botonEventos.borrador {
            color: #ffffff !important;
            background-color: #f0ad4e !important;
            border-color: #eea236 !important;
        }

/* corrige error en summernote al seleccionar abrir link en nueva pestaña */

.sn-checkbox-open-in-new-window label::before {
    display: none !important;
}

.sn-checkbox-use-protocol label::before {
    display: none !important;
}

.sn-checkbox-open-in-new-window input {
    opacity: 1 !important;
    margin-top: 4px !important;
}

.sn-checkbox-use-protocol input {
    opacity: 1 !important;
    margin-top: 4px !important;
}

/* end corrección summernote */


/* radio-button conflicto con ib */

.radio input[type="radio"]:checked + label::after {
    /* -webkit-transform: scale(1, 1); */
    transform: none !important;
}

.radio input[type="radio"] {
    opacity: 1 !important;
}

.radio label::after {
    content: none !important;
}

/**/



/* WEBINARS */




@media(min-width:768px) {

    .lockedVideo {
        height: 132px !important;
        object-fit: cover !important;
    }

    .lockedVideoContenidos {
        height: 420px !important;
        object-fit: cover !important;
    }

    .seccion-webinar iframe,
    .seccion-webinar .cajadevideo {
        height: 132px !important;
    }

    .caja-descripcion-webinar {
        height: 125px;
    }

    .ico-editar-webinar {
        right: 22%;
    }

    .ico-participacion-webinar {
        right: 29%;
    }
}

@media(min-width:992px) {

    .lockedVideo {
        height: 173px !important;
        object-fit: cover !important;
    }

    .lockedVideoContenidos {
        height: 223px !important;
        object-fit: cover !important;
    }

    .seccion-webinar iframe,
    .seccion-webinar .cajadevideo {
        height: 173px !important;
    }

    .caja-descripcion-webinar {
        height: 120px;
    }

    .ico-participacion-webinar {
        right: 22%;
    }
}

@media(min-width:1200px) {

    .lockedVideo {
        height: 214px !important;
        object-fit: cover !important;
    }

    .lockedVideoContenidos {
        height: 323px !important;
        object-fit: cover !important;
    }

    .seccion-webinar iframe,
    .seccion-webinar .cajadevideo {
        height: 214px !important;
    }

    .caja-descripcion-webinar {
        height: 100px;
    }

    .ico-participacion-webinar {
        right: 21%;
    }
}

.ico-participacion-webinar {
    position: absolute;
    width: 45px;
    z-index: 99;
    top: 5%;
    box-shadow: 2px 2px 5px 0px;
}

.ico-editar-webinar {
    position: absolute;
    top: 5%;
    right: 5%;
    width: 45px;
    z-index: 99;
    box-shadow: 2px 2px 5px 0px;
}



.seccion-webinar.borde {
    border: 1px solid #EEEEEE;
}

.titulo-visto {
    font-size: 22px;
}



/** END WEBINARS **/


/**ENCUESTAS**/
.rate {
    height: 46px;
    padding: 0 10px;
}

    .rate:not(:checked) > input {
        position: absolute;
        top: -9999px;
    }

    .rate:not(:checked) > label {
        width: 1em;
        overflow: hidden;
        white-space: nowrap;
        cursor: pointer;
        font-size: 30px;
        color: #ccc;
    }

        .rate:not(:checked) > label:before {
            content: '★ ';
        }

    .rate:hover label {
        color: #deb217;
    }

    .rate:not(:checked) > label:hover ~ label {
        color: #ccc;
    }

.depende-de {
    /*display:none;*/
}

/**FIN ENCUESTAS**/

/** SUMMERNOTE FIX **/

.note-editing-area {
    max-height: 400px !important;
    overflow: hidden !important;
    overflow-y: auto !important;
}

.note-statusbar {
    display: none !important;
}

/** FIN SUMMERNOTE FIX **/

@media (min-width: 768px) {
    .box-video-widget {
        padding-bottom: 10px;
        height: 136px;
        margin-top: 96px;
    }
}

@media (min-width: 992px) {
    .box-video-widget {
        padding-bottom: 10px;
        height: 102px;
        margin-top: 54px;
    }
}

@media (min-width: 1200px) {
    .box-video-widget {
        padding-bottom: 10px;
        height: 110px;
        margin-top: 17px;
    }
}


/* QUIZ */
.lista-preguntas-quiz {
    margin-left: 30px;
    margin-top: 5px;
    padding-left: 20px !important;
    padding-right: 45px !important;
}

/* end quiz */


/* sección recetas */
.img-recetas {
    width: 100% !important;
    object-fit: cover !important;
    max-height: 100% !important;
    position: initial !important;
    -webkit-transform: none !important;
}

@media (min-width:768px) {
    .img-recetas {
        height: 350px;
    }
}

@media (max-width:767px) {
    .img-recetas {
        height: 500px;
    }

    .box-recetas {
        height: 380px;
    }

    .box-descripcion-recetas {
        height: 60px !important;
        overflow: hidden !important;
    }
}


@media (min-width:768px) {
    .box-recetas {
        height: 455px;
    }

    .box-descripcion-recetas {
        height: 115px !important;
        overflow: hidden !important;
    }
}

@media (min-width:992px) {
    .box-recetas {
        height: 400px;
    }

    .box-descripcion-recetas {
        height: 80px !important;
        overflow: hidden !important;
    }
}

@media (min-width:1200px) {
    .box-recetas {
        height: 380px;
    }

    .box-descripcion-recetas {
        height: 60px !important;
        overflow: hidden !important;
    }
}

/* end recetas */

.box-aviso-notificacion {
    background-color: #DE3831 !important;
    border: 1px solid #DE3831 !important;
    padding: 10px;
    color: #fff !important;
    cursor: pointer;
}

    /*.box-aviso-notificacion:hover {
        opacity: 0.5;
    }*/

    .box-aviso-notificacion p {
        padding-left: 10px;
        padding-right: 10px;
        margin-top: 10px;
    }

.seccion-caja .titulo {
    width: 97% !important;
}

@media (max-width:767px) {
    .seccion-caja img {
        object-fit: cover !important;
    }
}

.scroll-img {
    width: 25px !important;
    height: 25px !important;
}

.div-scroll {
    position: absolute;
    width: 45px;
    height: 45px;
    top: 106px;
    left: 65px;
    background-color: #fff;
    z-index: 999999999999999999 !important;
    border-radius: 15%;
}

.div-scroll-eventos {
    position: absolute;
    width: 45px;
    height: 45px;
    top: 106px;
    right: 10px;
    background-color: #fff;
    z-index: 999999999999999999 !important;
    border-radius: 15%;
}

.div-scroll-right {
    position: absolute;
    width: 45px;
    height: 45px;
    top: 106px;
    right: 20px;
    background-color: transparent;
    z-index: 999999999999999999 !important;
    border-radius: 15%;
}


.div-scroll-left {
    position: absolute;
    width: 45px;
    height: 45px;
    top: 106px;
    left: 20px;
    background-color: transparent;
    z-index: 999999999999999999 !important;
    border-radius: 15%;
}

.div-scroll-right-noticias {
    position: absolute;
    width: 45px;
    height: 45px;
    top: 106px;
    right: 15px;
    background-color: #fff;
    z-index: 999999999999999999 !important;
    border-radius: 15%;
}

.div-scroll-left-noticias {
    position: absolute;
    width: 45px;
    height: 45px;
    top: 106px;
    left: 20px;
    background-color: #fff;
    z-index: 999999999999999999 !important;
    border-radius: 15%;
}

.div-scroll-eventos-right {
    position: absolute;
    width: 45px;
    height: 45px;
    top: 106px;
    right: 10px;
    background-color: #fff;
    z-index: 999999999999999999 !important;
    border-radius: 15%;
}

.div-scroll-eventos-left {
    position: absolute;
    width: 45px;
    height: 45px;
    top: 106px;
    right: 10px;
    background-color: #fff;
    z-index: 999999999999999999 !important;
    border-radius: 15%;
}

@media (min-width:992px) {
    .alpha-md {
        padding-left: 0 !important;
    }

    .omega-md {
        padding-right: 0 !important;
    }
}

/* ESTILO GENÉRICO DE ENCUESTA */

.obligatorio-check-radio {
    padding: 10px 15px;
    border: 1px solid transparent;
    border-radius: 0px;
    background-color: #f2dede;
    border-color: #ebccd1;
    color: #a94442;
}

.pregunta-obligatoria {
    background-color: #F2DEDE !important;
    opacity: 1 !important;
}

.pregunta-requerida {
    font-weight: 700 !important;
    position: absolute;
}


/* FIN ESTILO GENÉRICO ENCUESTA */

/* ESTILO GENÉRICO PORTADA GALERIAS */


.img-galeria-portada {
    width: 100%;
    /*height: 100%;*/
    object-fit: cover;
}

.img-fotogaleria-portada {
    width: 100%;
    /*height: 100%;*/
    object-fit: cover;
}

.titulo-galeria {
    position: absolute !important;
    top: 1%;
    left: 2%;
    color: #fff !important;
    font-weight: 700 !important;
    width: 355px;
}

.acciones-galeria {
    position: absolute !important;
    left: 28%;
    top: 40%;
    width: 175px !important;
}

.acciones-fotogaleria {
    position: absolute !important;
    left: 20%;
    top: 40%;
    width: 175px !important;
}

.items-galerias {
    color: #fff !important;
    font-size: 22px !important;
}

.texto-items-galerias {
    color: #fff !important;
    font-size: 20px !important;
}

.div-compartir-galerias {
    position: absolute !important;
    bottom: 18%;
    left: 7%;
    cursor: pointer !important;
}

.item-compartir-galerias {
    font-size: 31px !important;
    color: #fff !important;
    margin-right: 5px;
}

.text-compartir-galerias {
    color: #fff !important;
    font-size: 20px !important;
}

@media (min-width:768px) {
    .img-galeria-portada {
        height: 345px;
    }

    .img-fotogaleria-portada {
        height: 265px;
    }
}

@media (min-width:992px) {
    .titulo-galeria {
        font-size: 19px !important;
    }

    .acciones span {
        margin-left: 6px !important;
    }
}

.seccion-galeria-listado .tag {
    position: absolute;
    bottom: 15%;
    right: 15px;
}

    .seccion-galeria-listado .tag .option {
        background-color: #fff;
        padding: 5px 15px;
        margin-bottom: 10px;
        opacity: 1;
        box-shadow: 0 2px 10px rgba(0, 0, 0, 0.5);
        border-radius: 10px 0 0 10px;
        border-right: none;
        font-size: 16px;
    }

    .seccion-galeria-listado .tag .option {
        background-color: #fff;
        padding: 5px 15px;
        margin-bottom: 10px;
        opacity: 1;
        box-shadow: 0 2px 10px rgba(0, 0, 0, 0.5);
        border-radius: 10px 0 0 10px;
        border-right: none;
        font-size: 16px;
    }


.hide {
    display: none;
}

.img-galeria-portada:hover {
    filter: brightness(50%);
}

.seccion-galeria-listado:hover > .hide {
    display: block !important;
}

.seccion-fotogaleria-listado:hover > .hide {
    display: block !important;
}

.foto-detalle-modal {
    padding: 0 !important;
    width: 67% !important;
}

.img-foto-detalle {
    width: 100%;
    object-fit: cover;
    height: 890px !important;
}

.contenedor-imagen-fotogaleria {
    height: 890px !important;
}

.img-background-autor {
    height: 33px !important;
    width: 33px !important;
    border-radius: 50%;
    background-position: center;
    background-size: cover;
    margin-left: 5px;
}

.hilo-comentarios-popup {
    height: 75%;
    border-bottom: 1px solid #EFEFEF;
    overflow: auto;
    padding-bottom: 30px;
}

.comentario-fotografia-popup {
    margin-left: 7px;
}

.info-comentario {
    font-size: 10px;
    margin-left: 7px;
    line-height: 0px;
}

.items-foto-seleccionada {
    height: 5.5%;
    border-bottom: 1px solid #EFEFEF;
}

    .items-foto-seleccionada span {
        font-size: 30px !important;
    }

.numlikes-fotografia {
    font-size: 32px !important;
}

.insert-comment p {
    font-size: 32px !important;
    margin-top: 6px;
    margin-left: 2px;
}

.input-comentario-foto {
    width: 100%;
    border: none;
    padding-top: 11px;
}

    .input-comentario-foto:focus {
        outline: none;
    }

.img-autor {
    max-width: 35px;
}

@media(max-width:1485px) {
    .hilo-comentarios-popup {
        height: 73% !important;
    }

    .foto-detalle-modal {
        width: 88% !important;
    }
}

@media (max-width:1199px) {
    .foto-detalle-modal {
        width: 94% !important;
    }
}

.img-portada-galeria {
    height: 100%;
    object-fit: cover !important;
    width: 100%;
    border-top-left-radius: 1.5%;
    border-bottom-left-radius: 1.5%;
}

.loading-gif {
    position: absolute !important;
    top: 50% !important;
}

.flex {
    display: flex !important;
}

.comentarios-galerias {
    /*height:73%;*/
    height: 84.5%;
    overflow: scroll;
    border-bottom: 1px solid #EFEFEF;
}

.input-comentario-foto-galeria {
    height: 45px !important;
}

.div-item-galerias {
    border: 1px solid #EFEFEF;
    border-radius: 1.5%;
    padding: 0 !important;
    height: 420px;
}

/*::-webkit-scrollbar {
    display: none;
}*/

.bloque-autor-creador {
    border-bottom: 1px solid #EFEFEF;
    padding-bottom: 20px;
    height: 61px;
    overflow: hidden;
}

.format-rbutton {
    margin-top: 3px;
}

.c-pointer {
    cursor: pointer !important;
}

.c-default {
    cursor: default !important;
}

/* FIN PORTADA GALERÍAS */

.disabled-action {
    color: rgba(0, 0, 0, 0.5) !important;
}

.img-ranking-trivial {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    object-fit: cover;
}

/* CLASES DATECPICKER */
.reserva-clase {
    background-color: var(--color-principal) !important;
    color: #fff !important;
}

.reserva-clase,
.ui-widget-content .reserva-clase a.ui-state-default,
.ui-widget-header .reserva-clase a.ui-state-default {
    background-color: var(--color-principal);
    color: #fff !important;
}

    .ui-widget-content .reserva-clase a.ui-state-default.ui-state-hover {
        color: white !important;
    }

    .reserva-clase > .ui-state-default.ui-state-hover {
        background: var(--color-principal) !important;
    }

/* END DATEPICKER */

.anotacion {
    color: darkred;
    font-size: 12px;
}

/* CALENDARIO ADVIENTO */
.listado-casilla {
    width: 100%;
    object-fit: cover;
    border-radius: 5%;
}

@media (min-width: 1200px) {
    .col-lg-2-5 {
        width: 20% !important;
    }
}

@media (min-width:768px) {
    .listado-casilla {
        height: 175px;
    }

    .modal-pregunta-casilla {
        width: 760px !important;
    }
}

.o-f-cover {
    object-fit: cover !important;
}

.d-flex {
    display: flex;
}

@media (min-width: 768px) {
    .flex-sm {
        display: flex;
    }
}

.button-responder-calendario {
    padding: 7px 75px;
    font-size: 16px !important;
}

.fecha-calendario-apertura {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    /*padding: 7px;*/
    color: var(--color-principal);
    font-weight: 900;
    font-size: 21px;
    background-color: #E2E3E3;
}


/* END CALENDARIO */


/* RECORRIDOS */


.info-recorrido {
    background-color: rgb(255, 255, 255);
    position: absolute;
    bottom: 3px;
    left: 7px;
    border-radius: 12%;
    padding-left: 0;
    padding-right: 0;
    padding-top: 5px;
    z-index: 999999999999999999999999;
}

.tachado {
    text-decoration: line-through !important;
}

.borde-notificacion {
    border: 1px solid #C9C9C9;
    border-radius: 5%;
}


/* modal editor popup */

@media (max-width:539px) {
    #editor-popup {
        height: 1080px;
    }
}

@media (min-width:540px) {
    #editor-popup {
        height: 1160px;
    }
}

@media (min-width:768px) {
    #editor-popup {
        height: 960px;
    }

    .imagen-gestor-popup {
        height: 200px;
    }
}

/*@media (min-width:992px) {
    #editor-popup {
        height: 950px;
    }
}*/

.imagen-gestor-popup {
    object-fit: cover;
}

.body-modal-popup {
    position: relative;
    min-height: 100%;
    padding: 0 !important;
}

.close-modal-popup {
    position: absolute;
    right: 2%;
    top: 2%;
    z-index: 9;
    /*  color: white !important;*/
    /*border: 1px solid white !important;*/
    border-radius: 50% !important;
    padding: 5px 9px !important;
    opacity: 1 !important;
}

.modal-content-popup {
    border-radius: 3% !important;
}

.img-popup {
    max-height: 300px;
    width: 100%;
    object-fit: cover;
    border-top-left-radius: 3%;
    border-top-right-radius: 3%;
}

.titulo-modal-popup {
    color: #555555 !important;
    font-weight: 700 !important;
}

.texto-modal-popup {
    color: #555555 !important;
}

.btn-modal-popup {
    color: white;
    font-size: 14px !important;
    margin: 1px !important;
    padding-left: 50px !important;
    padding-right: 50px !important;
    border-radius: 4px;
}

@media (min-width:992px) {
    .modal-content-popup {
        width: 960px;
        right: 28%;
    }
}

/* fin editor popup */

/* postit */

@media(min-width:992px) {
    .modal-postit {
        width: 50% !important;
        left: 25% !important;
    }

    .pull-right-md {
        float: right !important;
    }
}

.textarea-postit {
    border: 2px solid #394f62 !important;
    border-radius: 1% !important;
}

#color-postit option {
    margin: 40px;
    background: rgba(0, 0, 0, 0.3);
    color: #fff;
    text-shadow: 0 1px 0 rgba(0, 0, 0, 0.4);
}

    #color-postit option[value="0"] {
        background: rgba(0, 0, 0, 0.3) !important;
    }

    #color-postit option[value="1"] {
        background: #FDED6A !important;
    }

    #color-postit option[value="2"] {
        background: #A3EA9A !important;
    }

    #color-postit option[value="3"] {
        background: #FEB6B5 !important;
    }

    #color-postit option[value="4"] {
        background: #009BAB !important;
    }

    #color-postit option[value="5"] {
        background: #5EB344 !important;
    }

    #color-postit option[value="6"] {
        background: #FFCA38 !important;
    }

    #color-postit option[value="7"] {
        background: #FE7900 !important;
    }

    #color-postit option[value="8"] {
        background: #B41983 !important;
    }

#color-postit option {
    zoom: 1.5
}


.fondo-corcho {
    min-height: 108vh !important;
    /*background-image: url('/im/fondo-corcho.svg');*/
    width: 100%;
}

.img-postit {
    /*height:290px;*/
    width: 100%;
    /*object-fit: cover;*/
}

.text-postit {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 70%;
}

.color-postit {
    font-weight: 700 !important;
    color: #fff !important;
}

.color-postit-contrast {
    font-weight: 700 !important;
}

.postit-autor {
    position: absolute;
    bottom: -2%;
    left: 6%;
}

.postit-like {
    position: absolute;
    bottom: 1%;
    right: 1%;
}

.postit-like-img {
    position: absolute;
    bottom: 1%;
    right: 1%;
}

.borrar-postit-img {
    position: absolute;
    right: 6%;
    top: 0;
    cursor: pointer;
}

.borrar-postit {
    position: absolute;
    right: 8%;
    top: 12%;
    cursor: pointer;
}

@media(max-width:767px) {
    .img-postit {
        height: auto;
    }

    .btn-download-postit {
        float: left !important;
        margin-top: 5px;
    }
}

@media(min-width:768px) {
    .img-postit {
        height: 382px;
    }

    .btn-download-postit {
        float: right !important;
        margin-top: -5px;
    }
}

@media(min-width:992px) {
    .img-postit {
        height: 323px;
    }
}


@media(min-width:1200px) {
    .img-postit {
        height: 290px;
    }
}


.comunidad-caja {
    border: 1px solid #ccc;
    border-radius: 8px;
    box-shadow: rgb(0 0 0 / 13%) 0px 1.6px 3.6px 0px, rgb(0 0 0 / 11%) 0px 0.3px 0.9px 0px;
}

@media (min-width:768px) {
    .listado-seccion-equipos {
        height: 370px;
    }
}

@media (min-width:992px) {
    .listado-seccion-equipos {
        height: 320px;
    }
}

@media (min-width:1200px) {
    #img-fondo-custom {
        height: 1060px;
    }
}

.container-postit {
    top: 0 !important;
    position: absolute !important;
}

.postit-like-custom {
    right: 3% !important;
}

.color-postit-custom {
    left: 40% !important;
    top: 70px !important;
}

.borrar-postit-img-custom {
    left: 48.5% !important;
    top: 9px;
}

.text-postit-custom {
    left: 51% !important;
    top: 53% !important;
}


/* end postit */

/* icos notificacion */
.ico-sprite.Anadir {
    background-image: url(/im/icoadd.png);
    background-repeat: no-repeat;
    margin-top: -1px;
    margin-left: 0px;
    margin-right: 0px;
}

.ico-sprite.Contenido {
    background-image: url(/im/icocontent.png);
    background-repeat: no-repeat;
    margin-top: -1px;
    margin-left: 0px;
    margin-right: 0px;
}

.ico-sprite.Blog {
    background-image: url(/im/icocontent.png);
    background-repeat: no-repeat;
    margin-top: -1px;
    margin-left: 0px;
    margin-right: 0px;
}

.ico-sprite.Post {
    background-image: url(/im/icocontent.png);
    background-repeat: no-repeat;
    margin-top: -1px;
    margin-left: 0px;
    margin-right: 0px;
}

.ico-sprite.Evento {
    background-image: url('/im/icocalendar.png');
    background-repeat: no-repeat;
    margin-top: -1px;
    margin-left: 0px;
    margin-right: 0px;
}

.ico-sprite.Grupo {
    background-image: url('/im/icogroups.png');
    background-repeat: no-repeat;
    margin-top: -1px;
    margin-left: 0px;
    margin-right: 0px;
}

.ico-sprite.Noticia {
    background-image: url('/im/iconews.png');
    background-repeat: no-repeat;
    margin-top: -1px;
    margin-left: 0px;
    margin-right: 0px;
}

.ico-sprite.Webinar {
    background-image: url('/im/icowebinar.png');
    background-repeat: no-repeat;
    margin-top: -1px;
    margin-left: 0px;
    margin-right: 0px;
}

.ico-sprite.FotoConcurso {
    background-image: url('/im/camera-icon4png.png');
    background-repeat: no-repeat;
    margin-top: -1px;
    margin-left: 0px;
    margin-right: 0px;
}

.ico-sprite.Clases {
    background-image: url(/im/icoclases.png);
    background-repeat: no-repeat;
    margin-top: -1px;
    margin-left: 0px;
    margin-right: 0px;
}

.ico-sprite.Galeria {
    background-image: url(/im/icogallery.png);
    background-repeat: no-repeat;
    margin-top: -1px;
    margin-left: 0px;
    margin-right: 0px;
}

.ico-sprite.UsuarioWeb {
    background-image: url(/im/icouser.png);
    background-repeat: no-repeat;
    margin-top: -1px;
    margin-left: 0px;
    margin-right: 0px;
}

.ico-sprite.Meta {
    background-image: url(/im/icometa.png);
    background-repeat: no-repeat;
    margin-top: -1px;
    margin-left: 0px;
    margin-right: 0px;
}


.ico-sprite.AgregoElemento {
    /*background-image: url(/im/icorun.png);
    background-repeat: no-repeat;
    margin-top: -1px;
    margin-left: 0px;
    margin-right: 0px;*/
}

.ico-sprite.Comentar {
    background-image: url(/im/icocomment.png);
    background-repeat: no-repeat;
    margin-top: -1px;
    margin-left: 0px;
    margin-right: 0px;
}

.ico-sprite.HacerLike {
    background-image: url(/im/icolike.png);
    background-repeat: no-repeat;
    margin-top: -1px;
    margin-left: 0px;
    margin-right: 0px;
}

/*.btn-notificaciones-buzon {
    top: 5%;
    right: 25%;
}

.btn-notificaciones-buzon {*/
/*display: none;*/
/* Hidden by default */
/*position: absolute;
    top: 10px;
    z-index: 99;
    border: none;
    outline: none;
    cursor: pointer;
    padding: 15px;
    border-radius: 10px;
    opacity: 0.8;
    width: 55px;
    cursor: pointer !important;
    z-index: 999999;
}

.btn-notificaciones-buzon-integracion {*/
/*display: none;*/
/* Hidden by default */
/*position: absolute;
    top: 10px;
    z-index: 99;
    border: none;
    outline: none;
    cursor: pointer;
    padding: 15px;
    border-radius: 10px;
    opacity: 0.8;
    width: 55px;
    cursor: pointer !important;
    z-index: 999999;
}*/

/*@media (min-width:991px) {*/
/*.btn-notificaciones-buzon {
        right: -50px;
        top: -12px;
    }

    .btn-notificaciones-buzon-open {
        top: -15px;
    }

    .btn-notificaciones-buzon-integracion {
        right: 4px;
        top: -8px;
    }

    .btn-notificaciones-buzon-open-integracion {
        top: -13px;
    }*/

#notificacion-buzon {
    /*z-index:9999999999999999999999;*/
}

.div-notificacion-buzon {
    position: absolute;
    cursor: pointer;
}

.arrow_box {
    position: absolute;
    top: -21px;
    left: calc(137%);
    background: #ffffff;
    border: 1px solid #797F86;
    transform: rotate(180deg);
    width: 160px;
    cursor: default;
    z-index: 999
}

    .arrow_box:after,
    .arrow_box:before {
        left: 100%;
        top: 50%;
        border: solid transparent;
        content: "";
        height: 0;
        width: 0;
        position: absolute;
        pointer-events: none;
        /*transform: rotate(180deg)*/
    }

    .arrow_box:after {
        border-color: rgba(255, 255, 255, 0);
        border-left-color: #ffffff;
        border-width: 12px;
        margin-top: -12px;
    }

    .arrow_box:before {
        border-color: rgba(121, 127, 134, 0);
        border-left-color: #797F86;
        border-width: 14px;
        margin-top: -14px;
    }

    .arrow_box p {
        padding: 11px;
        margin: 0 0 -2px;
        color: #797F86 !important;
        transform: rotate(180deg);
    }

div .ico-notificacion-remitente {
    margin-top: -7px;
}

/*}*/

.ico-notificacion-remitente {
    width: 35px;
    border-radius: 50%;
    height: 35px;
    object-fit: cover;
}

.content-notificacion {
    border-bottom: 1px solid #EFEFEF;
}

.thrash-notif {
    cursor: pointer;
    font-size: 20px !important;
    margin-top: -2px;
    opacity: 0.6;
}

    .thrash-notif:hover {
        opacity: 0.3;
    }

.ico-flecha-vermas {
    cursor: pointer;
    margin-right: 10px;
    margin-top: -2px;
}

.navbar-right {
    margin-right: 37px !important;
}

.usu-ib {
    margin-right: 37px !important;
}

@media(max-width:767px) {
    .col-img-usuario-notif {
        margin-left: -30px !important;
    }
}

/* fin notificaciones */
.text-enfasis {
    font-weight: bold !important;
}

@media (min-width:1200px) {
    .listado-seccion-equipos {
        height: 300px;
    }
}

#modal-popup .close-modal-popup {
    color: #000 !important;
    border-color: #000 !important;
    background-color: #fff !important;
}

/* Tooltips */



/* End tooltips */

/* MAPA INGTERACTIVO */
/* CSS Document */
/**, *::after, *::before {
    margin: 0rem;
    padding: 0rem;
    box-sizing: inherit;
}

html {
    font-size: 62.5%;
}

body {
    box-sizing: border-box;
    font-family: 'Montserrat', sans-serif;
    font-weight: 100;
    line-height: 1.7rem;
    color: #fff;
    background-color: #c1ade0;
    background-size: cover;
}

a {
    text-decoration: none;
    color: #fff;
    transition: all 0.5s ease-out;
}

ul, ol {
    list-style: none;
    margin: 0;
}

.clear {
    clear: both;
}

.bg {
    width: 90rem;
    height: 67rem;
    background-image: url(../img/bg.svg);
    margin: 2rem auto;*/
/*position: relative;*/
/*box-shadow: 0 1rem 3rem -.4rem rgba(88,67,128,0.6);
    border-radius: 1rem;*/
/*margin-bottom: 5rem;
}

.point {
    position: absolute;
    width: 3rem;
    height: 3rem;
    background-color: #009AD8;
    border-radius: 50%;
    cursor: pointer;
    background-image: url(../img/cross.svg);
    transition: .5s ease-in-out;
}

    .point:hover {
        transform: rotate(90deg);
    }

    .point::after {
        width: 3.9rem;
        height: 3.9rem;
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        background-color: #6b2fdd;
        border-radius: 50%;
        opacity: 0;
        margin: -1.3rem 0 0 -1.3rem;
        animation: waves 20s infinite;
    }

@keyframes waves {
    0% {
        transform: scale(0);
    }

    1% {
        opacity: .7;
    }

    5% {
        opacity: 0;
        transform: scale(1);
    }
}

.info-mapa {
    width: 25rem;
    height: 20rem;
    position: absolute;
    top: 5rem;
    left: -8rem;
    transform: rotate(-90deg);
    display: none;
}

.point:hover .info {
    display: block;
}

.content_container {
    background-color: #dfdce3;
    box-shadow: 0 1rem 3.1rem -.4rem rgba(88,67,128,0.6);
    border-radius: .7rem;
    position: absolute;
    animation: appear 1s;
    transition: 1s;
}

    .content_container:before {
        content: '';
        height: 0;
        width: 0;
        position: absolute;
        top: 5.5rem;
        left: 99%;
        border-style: solid;
        border-width: .75rem 0 .75rem .8rem;
        border-color: transparent transparent transparent #dfdce3;
    }

@keyframes appear {
    0% {
        opacity: 0;
        transform: scale3d(0.3, 0.3, 0.3);
    }

    20% {
        opacity: 0;
        transform: scale3d(1.1, 1.1, 1.1);
    }

    40% {
        transform: scale3d(0.9, 0.9, 0.9);
    }

    60% {
        transform: scale3d(1.03, 1.03, 1.03);
    }

    80% {
        transform: scale3d(0.97, 0.97, 0.97);
    }

    100% {
        opacity: 1;
        transform: scale3d(1, 1, 1);
    }
}

.title {
    width: 25rem;
    height: 4rem;
    background-color: #a58fdb;
    border-radius: .7rem .7rem 0 0;
    font-weight: 700;
    font-size: 1.5rem;
    padding: 1rem;
    text-align: center;
}

.text {
    padding: 2rem;
    font-size: 1.2rem;
    line-height: 1.8rem;
    color: #777;
}

#madrid {
    top: 26rem;
    left: 47.5rem;
}

#andalucia {
    top: 45rem;
    left: 36.5rem;
}

    #andalucia::after {
        animation-delay: 1s;
    }

#asturias {
    top: 4.5rem;
    left: 36.5rem;
}

    #asturias::after {
        animation-delay: 2s;
    }

#aragon {
    top: 18rem;
    left: 61.5rem;
}

    #aragon::after {
        animation-delay: 3s;
    }

#cantabria {
    top: 4.8rem;
    left: 46.3rem;
}

    #cantabria::after {
        animation-delay: 4s;
    }

#catalunia {
    top: 17rem;
    left: 77rem;
}

    #catalunia::after {
        animation-delay: 5s;
    }

#valencia {
    top: 31.5rem;
    left: 64rem;
}

    #valencia::after {
        animation-delay: 6s;
    }

#murcia {
    top: 41rem;
    left: 60rem;
}

    #murcia::after {
        animation-delay: 7s;
    }

#galicia {
    top: 8.5rem;
    left: 22.5rem;
}

    #galicia::after {
        animation-delay: 8s;
    }

#pais_vasco {
    top: 8.5rem;
    left: 52.3rem;
}

    #pais_vasco::after {
        animation-delay: 9s;
    }

#navarra {
    top: 9.5rem;
    left: 57rem;
}

    #navarra::after {
        animation-delay: 10s;
    }

#extremadura {
    top: 36rem;
    left: 33.5rem;
}

    #extremadura::after {
        animation-delay: 11s;
    }

#rioja {
    top: 11.5rem;
    left: 53rem;
}

    #rioja::after {
        animation-delay: 12s;
    }

#ceuta {
    top: 56.5rem;
    left: 38rem;
}

    #ceuta::after {
        animation-delay: 13s;
    }

#melilla {
    top: 60.2rem;
    left: 51.5rem;
}

    #melilla::after {
        animation-delay: 14s;
    }

#canarias {
    top: 59.5rem;
    left: 13rem;
}

    #canarias::after {
        animation-delay: 15s;
    }

#baleares {
    top: 29.5rem;
    left: 81rem;
}

    #baleares::after {
        animation-delay: 16s;
    }

#castilla-la_mancha {
    top: 30.5rem;
    left: 44rem;
}

    #castilla-la_mancha::after {
        animation-delay: 17s;
    }

#castilla_leon {
    top: 16.5rem;
    left: 40.5rem;
}

    #castilla_leon::after {
        animation-delay: 18s;
    }*/


/* MAPA INTERACTIVO */

/* TINDER */



/* END TINDER */


.thumb {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 96px;
    height: 96px;
}

@media (max-width:767px) {
    #ui-datepicker-div {
        width: 75% !important;
    }
}

@media (min-width:991px) {
    .pull-right-sm {
        float: right;
    }
}


/* emojis*/
span.emoji {
    display: -moz-inline-box;
    -moz-box-orient: vertical;
    display: inline-block;
    vertical-align: baseline;
    *vertical-align: auto;
    *zoom: 1;
    *display: inline;
    width: 1em;
    height: 1em;
    background-size: 1em;
    background-repeat: no-repeat;
    text-indent: -9999px;
}

span.emoji-sizer {
    line-height: 0.81em;
    font-size: 1em;
    margin: -2px 0;
}

span.emoji-outer {
    display: -moz-inline-box;
    display: inline-block;
    *display: inline;
    height: 1em;
    width: 1em;
}

span.emoji-inner {
    display: -moz-inline-box;
    display: inline-block;
    text-indent: -9999px;
    width: 100%;
    height: 100%;
    vertical-align: baseline;
    *vertical-align: auto;
    *zoom: 1;
}

img.emoji {
    width: 1em;
    height: 1em;
}

.emoji-wysiwyg-editor:empty:before {
    content: attr(placeholder);
    color: #9aa2ab;
}

.emoji-picker-container {
    position: relative;
}

.emoji-picker-icon {
    cursor: pointer;
    position: absolute;
    right: 10px;
    top: 5px;
    font-size: 20px;
    opacity: 0.7;
    z-index: 100;
    transition: none;
    color: black;
    -moz-user-select: none;
    -khtml-user-select: none;
    -webkit-user-select: none;
    -o-user-select: none;
    user-select: none;
}

    .emoji-picker-icon.parent-has-scroll {
        right: 28px;
    }

    .emoji-picker-icon:hover {
        opacity: 1;
    }

/* Emoji area */
.emoji-wysiwyg-editor:empty:before {
    content: attr(placeholder);
    color: #9aa2ab;
}

.emoji-wysiwyg-editor:active:before,
.emoji-wysiwyg-editor:focus:before {
    content: none;
}

.emoji-wysiwyg-editor {
    padding: 6px;
    padding-right: 35px;
    margin-bottom: 0px;
    min-height: 35px;
    /* 35 */
    height: 30px;
    max-height: 284px;
    overflow: auto;
    line-height: 17px;
    border: 1px solid #d2dbe3;
    border-radius: 2px;
    -webkit-box-shadow: none;
    box-shadow: none;
    -webkit-transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
    transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
    -webkit-user-select: text;
    word-wrap: break-word;
}

    .emoji-wysiwyg-editor.parent-has-scroll {
        padding-right: 40px;
    }

    .emoji-wysiwyg-editor.single-line-editor {
        min-height: 35px;
        height: inherit;
    }

    .emoji-wysiwyg-editor img {
        width: 20px;
        height: 20px;
        vertical-align: middle;
        margin: -3px 0 0 0;
    }

.emoji-menu {
    position: absolute;
    right: 0;
    z-index: 999;
    width: 225px;
    overflow: hidden;
    border: 1px #dfdfdf solid;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    overflow: hidden;
    -webkit-box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.1);
    -moz-box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.1);
    box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.1);
}

.emoji-items-wrap1 {
    background: #ffffff;
    padding: 5px 2px 5px 5px;
}

    .emoji-items-wrap1 .emoji-menu-tabs {
        width: 100%;
        margin-bottom: 8px;
        margin-top: 3px;
    }

        .emoji-items-wrap1 .emoji-menu-tabs td {
            text-align: center;
            color: white;
            line-height: 0;
        }

.emoji-menu-tabs .emoji-menu-tab {
    display: inline-block;
    width: 24px;
    height: 29px;
    background: url('/im/emojis/IconsetSmiles.png') no-repeat;
    background-size: 42px 350px;
    border: 0;
}

.is_1x .emoji-menu-tabs .emoji-menu-tab {
    background-image: url('/im/emojis/IconsetSmiles_1x.png');
}

.emoji-menu-tabs .icon-recent {
    background-position: -9px -306px;
}

.emoji-menu-tabs .icon-recent-selected {
    background-position: -9px -277px;
}

.emoji-menu-tabs .icon-smile {
    background-position: -9px -34px;
}

.emoji-menu-tabs .icon-smile-selected {
    background-position: -9px -5px;
}

.emoji-menu-tabs .icon-flower {
    background-position: -9px -145px;
}

.emoji-menu-tabs .icon-flower-selected {
    background-position: -9px -118px;
}

.emoji-menu-tabs .icon-bell {
    background-position: -9px -89px;
}

.emoji-menu-tabs .icon-bell-selected {
    background-position: -9px -61px;
}

.emoji-menu-tabs .icon-car {
    background-position: -9px -196px;
}

.emoji-menu-tabs .icon-car-selected {
    background-position: -9px -170px;
}

.emoji-menu-tabs .icon-grid {
    background-position: -9px -248px;
}

.emoji-menu-tabs .icon-grid-selected {
    background-position: -9px -222px;
}

.emoji-menu-tabs .icon-smile,
.emoji-menu-tabs .icon-flower,
.emoji-menu-tabs .icon-bell,
.emoji-menu-tabs .icon-car,
.emoji-menu-tabs .icon-grid {
    opacity: 0.7;
}

    .emoji-menu-tabs .icon-smile:hover,
    .emoji-menu-tabs .icon-flower:hover,
    .emoji-menu-tabs .icon-bell:hover,
    .emoji-menu-tabs .icon-car:hover,
    .emoji-menu-tabs .icon-grid:hover {
        opacity: 1;
    }

.emoji-menu .emoji-items-wrap {
    position: relative;
    height: 174px;
    overflow: scroll;
}

.emoji-menu .emoji-items {
    padding-right: 8px;
    outline: 0 !important;
}

.emoji-menu img {
    width: 20px;
    height: 20px;
    vertical-align: middle;
    border: 0 none;
}

.emoji-menu .emoji-items a {
    margin: -1px 0 0 -1px;
    padding: 5px;
    display: block;
    float: left;
    border-radius: 2px;
    border: 0;
}

    .emoji-menu .emoji-items a:hover {
        background-color: #edf2f5;
    }

.emoji-menu:after {
    content: ' ';
    display: block;
    clear: left;
}

.emoji-menu a .label {
    display: none;
}

/* end emojis*/


/* Match */
.close-cerrar-match {
    position: absolute;
    cursor: pointer;
    right: 0;
    right: 22px;
    top: 10px;
    z-index: 999;
}

/*@media(min-width:768px) {
    #modal-match {
        margin-top: 145px;
    }
    #modal-finalizar-encuesta {
        margin-top: 145px;
    }
}*/

/*end match*/


.height-titulo {
    height: 60px !important;
}


@media (max-width:700px) {
    #cconsent-bar .ccb__wrapper {
        width: 90%;
    }

    #cconsent-bar .ccb__right > div {
        display: grid !important;
    }

    .ccb__edit {
        text-align: center;
        margin: 0 !important;
        margin-bottom: 5px !important;
    }

    .ccm__footer__consent-modal-submit {
        margin: 0 !important;
        margin-bottom: 5px !important;
    }
}

.pagina-comic {
    width: 100%;
    object-fit: cover;
}

.info-pagina-comic {
    border: 1px solid #9A9A9A;
    height: 40px;
}

/* ESTILOS COMIC GESTOR */
@media (min-width:768px) {
    .pagina-comic {
        height: 130px;
    }

    .info-pagina-comic {
        border: 1px solid #9A9A9A;
        border-bottom-left-radius: 5%;
        border-bottom-right-radius: 5%;
        height: 40px;
    }
}

/* END COMIC GESTOR */

/* BUSCADOR */

.titulo-buscador {
    font-size: 20px !important;
}

.descripcion-buscador {
    font-size: 14px !important;
}

.sep-busq {
    margin-right: 10px;
}

.siguiente-busq {
    margin-right: 10px;
}

@media (max-width:991px) {
    #buscador-global-mobile input {
        margin-left: 20px;
        width: 101%;
        right: -21px;
    }

    .btn-default.cargar-lupa {
        background-color: transparent;
    }

    .cont-ico {
        position: absolute;
        right: 19px;
        top: 14px;
    }

    .seccion-lupa {
        position: absolute !important;
        right: 45px;
        top: 4px;
    }

    .sep-menu-lat-buscador {
        margin-top: 242px !important;
    }
}

@media (min-width:992px) {
    /*#input-buscar {
        width: 113%;
    }*/

    .input-buscador-ib {
        width: 220px;
        height: 27px;
        color: var(--color-principal) !important;
    }

    .search-ib {
        position: absolute;
        right: 2px;
        background-color: transparent !important;
    }
}

.search-mv-ib {
    width: 28px;
    position: absolute !important;
    top: 9px;
    right: 28px;
}

/* FIN BUSCADOR */

/* ICO BUZON NOTIFICACIONES */
@media (max-width:991px) {
    .div-notificacion-buzon {
        right: calc(14%) !important;
        top: 9px !important;
    }

    .ico-open-notificaciones {
        fill: #fff !important;
    }

    .info-n-notif {
        color: #fff;
    }
}

/* END COMIC */


.box-widget {
    border: 1px solid #eee;
    overflow: hidden;
}

.bloque-titulo-widget {
    margin-top: -15px;
}

.img-widget {
    object-fit: cover;
}

@media (max-width:767px) {
    .bloque-titulo-widget {
        height: 95px;
    }

    .img-widget {
        height: 250px;
    }
}

@media (min-width:768px) {
    .box-widget {
        height: 280px;
    }

    .bloque-titulo-widget {
        height: 110px;
    }

    .img-widget {
        height: 135px;
    }
}

@media (min-width:992px) {
    .box-widget {
        height: 290px;
    }

    .bloque-titulo-widget {
        height: 100px;
    }

    .img-widget {
        height: 165px;
    }
}

@media (min-width:1200px) {
    .box-widget {
        height: 335px;
    }

    .bloque-titulo-widget {
        height: 100px;
    }

    .img-widget {
        height: 223px;
    }
}



/* FIN NOTIF */

/*QUIZ*/
.respuestas-trivial-fail:checked::before {
    content: 'x' !important;
}

.respuestas-trivial-success:checked::before {
    content: '✓' !important;
}

.bloque-categorias:hover {
    cursor: pointer;
    transition: all 0.7s;
    opacity: 0.7;
}

@media (min-width:768px) {
    .modal-categoria-respuesta {
        width: auto !important;
    }
}

@media (min-width:768px) {
    .modal-categoria-respuesta {
        width: 75% !important;
    }
}

@media (min-width:992px) {
    .modal-categoria-respuesta {
        width: 50% !important;
    }
}

@media (min-width:1200px) {
    .modal-categoria-respuesta {
        width: 35% !important;
    }
}

.modal-categoria-respuesta {
}

/* END QUIZ */
@media (min-width:992px) {
    .limite-subidas {
        max-width: 350px;
        height: 35px;
    }
}

@media (max-width:1199px) {
    .btn-concursos {
        padding: 10px 50px !important;
        font-size: medium !important;
    }
}

@media (min-width:1200px) {
    .btn-concursos {
        padding: 10px 75px !important;
        font-size: medium !important;
    }
}

@media (max-width:991px) {
    .btn-concursos {
        padding: 12px !important;
        width: 100%;
        font-size: medium !important;
    }
}

.a-mover-to {
    margin-left: 3px;
    vertical-align: sub;
}

.thumb-uploads {
    margin-left: 75px;
    width: 125px;
    cursor: pointer;
}

#overlay-detail {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.9);
    justify-content: center;
    align-items: center;
    z-index: 1;
}

.row-img-detail {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    text-align: center;
    /* Añade esto para centrar contenido horizontalmente */
    box-sizing: border-box;
}

.img-detail {
    max-width: 100%;
    /* Ajusta el ancho según tus preferencias */
    max-height: 100%;
    /* Ajusta la altura según tus preferencias */
    overflow: auto;
    /* Para permitir desplazamiento si la imagen es más grande */
    padding: 20px;
    /* Ajusta el espaciado interno según tus preferencias */
}

/* Estilos para la imagen en el modal */
#overlay-detail img {
    max-width: 80%;
    max-height: 80%;
}

/* Estilos fotografías */
.grid {
    margin: 0 auto;
}

.grid-item {
    width: 31.33%;
    min-width: 300px;
    min-height: 300px;
    margin: 10px;
    float: left;
    background-color: #ccc;
    border-radius: 5px;
    padding: 7px;
    box-sizing: border-box;
}

@media(max-width:1199px) {
    .grid-item {
        width: 30%;
    }
}

@media(max-width:991px) {
    .grid-item {
        width: 95%;
        min-width: 0;
        float: none;
        margin: 10px auto;
    }
}


.grid-item img {
    width: 100%;
}

.info-grid {
    color: #fff !important;
    z-index: 9;
}

    .info-grid h4 {
        position: absolute;
        top: 10%;
        left: 12%;
        color: #fff;
    }

.title-info-grid {
    position: absolute;
    top: 10.5%;
    left: 23%;
    color: #fff;
    z-index: 99;
}

.info-concurso-completo {
    position: absolute;
    bottom: 3%;
    right: 6%;
    z-index: 99;
    color: #fff;
    cursor: pointer;
}

.edit-foto-concurso {
    position: absolute;
    top: 6%;
    right: 4%;
    z-index: 99;
    color: var(--color-principal) !important;
    cursor: pointer;
    font-size: 19px !important;
}

.camera-info-grid {
    position: absolute;
    top: 14%;
    left: 15%;
    color: #fff;
    z-index: 99;
    font-size: 20px !important;
}

.info-comment {
    position: absolute;
    bottom: 15%;
    right: 10%;
}

    .info-comment img {
        margin-left: 20px;
        width: 30px;
    }

.info-user-grid {
    position: absolute;
    top: 35%;
    left: 12%;
    width: 100%;
}

    .info-user-grid img {
        width: 50px !important;
        height: 50px !important;
        border-radius: 50%;
        display: inline-block !important;
    }

.item-concurso {
    object-fit: cover;
    min-height: 300px;
}

.info-num-votaciones {
    position: absolute;
    top: 16%;
    right: 8%;
    color: #fff;
    cursor: pointer;
}

.info-num-votaciones-10 {
    position: absolute;
    top: 16%;
    right: 6%;
    color: #fff;
    cursor: pointer;
}

.btn-filter {
    border-radius: 5% !important;
    padding: 6px 30px !important;
    border-radius: 5% !important;
    font-size: 16px !important;
    width: 145px !important;
    color: #333333;
    border-color: #CCCCCC !important;
}

    .btn-filter:hover {
        opacity: 0.8 !important;
    }

.cancel-foto {
    text-decoration: underline;
    color: #F74C4C;
}

    .cancel-foto:hover {
        opacity: 0.7;
        color: #F74C4C;
    }

.btn-subir-foto-concurso {
    padding: 8px 25px !important;
    border-radius: 7% !important;
}

.btn-elegir-archivo {
    position: absolute;
    top: calc(69%);
    left: calc(38%);
}

.info-elegir-archivo {
    position: absolute;
    top: calc(55%);
    left: calc(29%);
}

@media (max-width:767px) {
    .info-elegir-archivo {
        position: absolute;
        top: calc(60%);
        left: calc(7%);
    }
}

@media (min-width:992px) {
    .modal-nueva-fotografia .modal-content {
        max-width: 600px !important;
        left: calc(20%);
        /*top: calc(20%);*/
        border-radius: 3%;
    }
}

.titulo-concurso-foto {
    color: #979797 !important;
    font-weight: 700 !important;
    height: 40px;
    font-size: 15px;
    overflow: hidden;
}

.descripcion-concurso-foto {
    color: #979797 !important;
    overflow: hidden;
}

.descripcion-concurso {
    color: #979797 !important;
    max-height: 74px;
    overflow-x: auto;
}

.bloque-izquierdo-comentarios {
    min-height: 838px;
}

@media (max-width:767px) {
    .bloque-izquierdo-comentarios {
        min-height: 720px;
    }
}

.container-detalle {
    border-radius: 5%;
}

/* Rediseño modal detalle foto: layout en columna con imagen completa */
/* IMPORTANTE: aplicar layout flex solo cuando el modal está abierto (Bootstrap: .in) */
#detalle-foto.modal.in {
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding: 4px 8px 8px 8px !important;
}

    #detalle-foto.modal.in .modal-dialog {
        margin: 0 auto !important;
        width: fit-content !important;
        max-width: calc(100vw - 16px) !important;
    }

@media (min-width: 768px) {
    #detalle-foto.modal.in .modal-dialog {
        width: fit-content !important;
        max-width: calc(100vw - 16px) !important;
    }

    #detalle-foto .modal-dialog.modal-dialog-detalle,
    #detalle-foto .modal-dialog.modal-dialog-detalle-sin-comentarios {
        width: fit-content !important;
        max-width: calc(100vw - 16px) !important;
    }
}

#detalle-foto .container-detalle {
    display: inline-flex;
    flex-direction: column;
    align-items: flex-start;
    padding: 0;
    border-radius: 16px;
    overflow: hidden;
    max-height: calc(100vh - 16px);
}

#detalle-foto .detalle-foto-body {
    align-self: stretch;
    box-sizing: border-box;
    width: 100%;
}

#detalle-foto .modal-content {
    min-height: 0;
    border-radius: 16px;
    top: 0;
    border: 0;
    box-shadow: 0 14px 40px rgba(0,0,0,.18);
    width: fit-content !important;
    max-width: calc(100vw - 16px) !important;
    display: inline-block;
}

#detalle-foto .comentarios-detalle,
#detalle-foto .detalle-foto-comments {
    width: 100%;
    box-sizing: border-box;
}

#detalle-foto .modal-dialog-detalle,
#detalle-foto .modal-dialog-detalle-sin-comentarios {
    width: fit-content;
    min-width: 350px;
    max-width: calc(100vw - 16px);
}

#detalle-foto .detalle-foto-image {
    position: relative;
    background: #fff;
    display: block;
}

#detalle-foto .detalle-foto-img {
    width: auto;
    height: auto;
    min-width: 350px;
    max-width: 100%;
    max-height: 70vh;
    object-fit: contain;
    display: block;
    background: transparent;
    position: relative;
    z-index: 1;
}

#detalle-foto .detalle-foto-close {
    position: absolute;
    top: 10px;
    right: 10px;
    z-index: 5;
    border-radius: 999px;
    padding: 6px 10px;
    background: rgba(255,255,255,.9);
    border: 1px solid rgba(0,0,0,.1);
}

    #detalle-foto .detalle-foto-close i {
        color: #333;
    }

    #detalle-foto .detalle-foto-close:hover {
        background: rgba(255,255,255,1);
    }

#detalle-foto .ico-borrar-concurso {
    top: 10px;
    right: 52px;
    color: #666 !important;
    background: rgba(255,255,255,.9);
    border: 1px solid rgba(0,0,0,.1);
    border-radius: 999px;
    padding: 6px 8px;
}

#detalle-foto .detalle-foto-body {
    padding: 12px 0 12px 0;
    background: #fff;
    max-height: 30vh;
    overflow-y: auto;
}

/* Mantener separación lateral del texto sin ensanchar el modal (equivalente al gutter bootstrap) */
#detalle-foto .detalle-foto-author,
#detalle-foto .detalle-foto-title {
    padding-left: 15px;
    padding-right: 15px;
}

#detalle-foto .detalle-foto-author {
    /*display: flex;*/
    align-items: center;
    justify-content: flex-start;
    gap: 10px;
    margin-bottom: 10px;
}

    #detalle-foto .detalle-foto-author .descripcion-concurso-foto {
        display: inline-block;
        flex: 0 1 auto;
        margin-left: 0;
        text-align: left;
    }

#detalle-foto .detalle-foto-title .titulo-concurso-foto {
    margin-top: 0;
    margin-bottom: 6px;
}

#detalle-foto .detalle-foto-title .descripcion-concurso {
    max-height: none;
}

#detalle-foto .bloque-comentar-concursos {
    position: relative;
}

.like-detalle-foto {
    cursor: pointer;
    width: 35px;
    height: 35px;
    position: absolute;
    top: -5px !important;
    right: 15px !important;
}

    .like-detalle-foto:hover {
        opacity: 0.7;
    }

.info-nlikes-detalle {
    position: absolute;
    top: 1px;
    right: 28px;
    color: #fff;
    cursor: pointer;
}

.info-nlikes-detalle-10 {
    position: absolute;
    top: 1px;
    right: 28px;
    color: #fff;
    cursor: pointer;
}

@media (max-width: 767px) {
    #detalle-foto .modal-dialog-detalle,
    #detalle-foto .modal-dialog-detalle-sin-comentarios {
        max-width: calc(100vw - 16px);
    }

    #detalle-foto .detalle-foto-img {
        min-width: 350px;
        width: auto;
        max-height: 60vh;
    }

    #detalle-foto .detalle-foto-body {
        padding: 12px;
        max-height: 100%;
    }
}

@media (min-width:992px) {
    .fondo-detalle {
        min-height: 838px !important;
        border-radius: inherit;
        border-top-right-radius: 0;
        border-bottom-right-radius: 0;
        background-repeat: no-repeat;
        background-size: cover;
        background-color: #eeeeee
    }

    #detalle-foto .modal-dialog-detalle,
    #detalle-foto .modal-dialog-detalle-sin-comentarios {
        min-width: 450px;
    }

    #detalle-foto .detalle-foto-img {
        min-width: 450px;
    }
}

/* Compatibilidad: el layout antiguo usaba min-height fijo y fondo por background; ahora lo neutralizamos */
#detalle-foto .fondo-detalle {
    min-height: 0 !important;
    background-image: none !important;
}

@media (max-width:991px) {
    #detalle-foto .modal-content-sin-comentarios {
        min-height: 0 !important;
    }
}

/*@media (min-width: 768px) and (max-width: 991px) {
    #detalle-foto .modal-content {
        min-height: 1100px;
        border-radius: 5%;
        top: 0;
    }
}

@media (min-width: 565px) and (max-width: 767px) {
    #detalle-foto .modal-content {
        min-height: 1100px;
        border-radius: 5%;
        top: 0;
    }
}*/

.detalle-concurso-foto {
    width: 100%;
    object-fit: cover;
}

.img-detalle-usuario {
    width: 50px !important;
    height: 50px !important;
    border-radius: 50%;
    display: inline;
}

.img-detalle-usuario-comment {
    width: 45px !important;
    height: 45px !important;
    border-radius: 50%;
    margin-top: -3px;
}

.bloque-comentar-concursos {
    border-top: 1px solid #979797;
}

@media (max-width:991px) {
    .bloque-comentarios-concursos {
        height: auto;
        overflow-x: auto;
    }

    .bloque-comentarios-concursos-chritsmas {
        height: auto;
        overflow-x: auto;
    }

    .wrap-text-area {
        padding-left: 15px !important;
    }

    .note-editable {
        height: 180px !important;
        min-height: 180px !important;
    }
}

@media (min-width:992px) {
    .bloque-comentarios-concursos {
        height: 100px;
        overflow-x: auto;
    }

    .bloque-comentarios-concursos-chritsmas {
        height: 350px;
        overflow-x: auto;
    }

    .note-editing-area {
        height: 100px !important;
    }

    /* No forzar anchos fijos: el detalle debe ajustar a la imagen */
    #detalle-foto .modal-dialog-detalle {
        width: fit-content;
        max-width: calc(100vw - 16px);
    }

    /* .note-editor {
        width:96% !important;
    }*/
}

@media (min-width:992px) {

    /* No forzar anchos fijos: el detalle debe ajustar a la imagen */
    #detalle-foto .modal-dialog-detalle-sin-comentarios {
        width: fit-content;
        max-width: calc(100vw - 16px);
    }
}


.comentar-detalle button {
    padding: 2px 5px !important;
    font-size: 12px;
}

.comentar-detalle img {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    object-fit: cover;
}

.comentar-detalle input {
    background-color: #A8A8A8;
    border-radius: 7%;
    height: 27px;
}

.like-detalle-foto {
    cursor: pointer;
    width: 35px;
    height: 35px;
    position: absolute;
    top: -5px !important;
    right: 15px !important;
}

    .like-detalle-foto:hover {
        opacity: 0.7;
    }

.info-nlikes-detalle {
    position: absolute;
    top: 1px;
    right: 28px;
    color: #fff;
    cursor: pointer;
}

.info-nlikes-detalle-10 {
    position: absolute;
    top: 1px;
    right: 28px;
    color: #fff;
    cursor: pointer;
}

.double-arrow {
    font-size: 27px;
    cursor: pointer;
    color: #A8A8A8;
}

.bloque-comentarios-concursos .fa-trash {
    color: #A8A8A8;
    cursor: pointer;
}

.container-detalle textarea {
    color: #A8A8A8;
}

.ico-borrar-concurso {
    position: absolute;
    top: 40px;
    right: 15px;
    color: #A8A8A8 !important;
    cursor: pointer;
}

.swal2-popup {
    position: fixed;
    margin: auto;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.grid {
    grid-template-columns: repeat(4, 1fr);
    /* Muestra 4 elementos por fila */
}

/* Estilo para pantallas más pequeñas, como dispositivos móviles */
@media screen and (max-width: 767px) {
    .grid {
        grid-template-columns: repeat(2, 1fr);
        /* Muestra 2 elementos por fila en dispositivos móviles */
    }
}

/* Estilo específico para navegadores basados en WebKit, como Chrome y Safari */
.bloque-comentarios-concursos::-webkit-scrollbar {
    width: 4px !important;
    /* Ancho de la barra de desplazamiento */
}

.bloque-comentarios-concursos::-webkit-scrollbar-thumb {
    background-color: transparent !important;
    /* Color transparente por defecto */
}

.bloque-comentarios-concursos:hover::-webkit-scrollbar-thumb {
    background-color: #888 !important;
    /* Color del "pulgón" de la barra de desplazamiento al pasar el ratón sobre ella */
}

/* Estilo específico para navegadores Firefox */
.bloque-comentarios-concursos {
    scrollbar-width: thin !important;
    /* Establece el grosor de la barra de desplazamiento en Firefox */
    overflow-y: scroll !important;
    /* Muestra la barra de desplazamiento siempre, pero será invisible por defecto */
    overflow-x: hidden !important;
    /* Oculta la barra de desplazamiento horizontal */
    min-height: 250px;
}

    .bloque-comentarios-concursos::-moz-scrollbar-thumb {
        background-color: transparent !important;
        /* Color transparente por defecto en Firefox */
    }

    .bloque-comentarios-concursos:hover::-moz-scrollbar-thumb {
        background-color: #888 !important;
        /* Color del "pulgón" de la barra de desplazamiento en Firefox al pasar el ratón sobre ella */
    }

/* End fotografias */

/* Otros estilos personalizados grupos */

.multiselect-container.dropdown-menu {
    height: 300px;
    overflow: auto;
}

/* end grupos */


/*  TINDER */
.img-productos-tinder {
    width: 50px !important;
    height: 50px !important;
    border-radius: 50%;
    object-fit: cover;
    margin-top: -10px;
}

.img-listado-complementos {
    width: 30px !important;
    height: 30px !important;
    border-radius: 50%;
    object-fit: cover;
    margin-top: -5px;
}

/* END TINDER */


/* MAQUETACIÓN TINDER */

#ib-header.mobile-navigation.ib-navmenu-oncanvas .mobile-nav .ib-navmenu {
    right: 0px;
    z-index: 999999;
}

.container-carrousel {
    background-color: transparent !important;
}

.fondo-carrousel-complementos {
    background-color: transparent !important;
    /*margin-top:20px;*/
}

.mensaje-final {
    position: absolute !important;
    top: 40%;
    left: 50%;
    transform: translate(-50%, -50%);
    max-width: 90%;
}

@media (max-width:768px) {
    #tiempo_restante {
        font-size: 18px;
    }
}

@media (min-width: 351px) and (max-width: 767px) {
    .fondo-relacionar {
        background-image: url('/im/tinder/fondo-relacionar-movil.png');
        background-size: auto 100%;
        /* Cover horizontalmente, contain verticalmente */
        background-position: center center;
        /* Opcional: centrar la imagen */
        background-repeat: no-repeat;
    }
}

@media (max-width:350px) {
    .fondo-relacionar-mini {
        background-image: url('/im/tinder/fondo-relacionar-movil.png');
        background-size: auto 100%;
        /* Cover horizontalmente, contain verticalmente */
        background-position: center center;
        /* Opcional: centrar la imagen */
        background-repeat: no-repeat;
    }
}

@media (min-width: 768px) {
    .fondo-relacionar-tablet {
        background-image: url('/im/tinder/fondo-relacionar-tablet.png');
        background-size: auto 100%;
        /* Cover horizontalmente, contain verticalmente */
        background-position: center center;
        /* Opcional: centrar la imagen */
        background-repeat: no-repeat;
    }

    .btn-respuesta {
        margin-bottom: 50px;
    }
}

@media (min-width:768px) {
    .slick-carousel-principal {
        margin-left: -22px !important;
    }

    .container-carrousel-complementos {
        margin-left: -13px !important;
    }

    .botonera {
        margin-left: 0 !important;
    }

    .slick-next {
        right: 45px !important;
        z-index: 999;
    }

    .slick-list {
        margin-top: 12px !important;
    }

    .slick-prev {
        left: 67px !important;
    }
}

/*@media(max-width:375px) {*/
.botonera {
    margin-top: -20px !important;
}

/*}*/

.fondo-match-principal {
    background-image: url('/App_Themes/leroy_merlin/im/tinder/fondo-match-center.png');
    background-size: cover;
    background-position: center;
}

.fondo-bottom {
    /*background-image: url('/App_Themes/leroy_merlin/im/tinder/fondo-match-bottom.png');
    height: 70px;
    margin-top: 20px;
    background-size: cover;*/
}

.container-carrousel {
    /*border: 1px solid #cccccc;
            border-radius: 1%;*/
    height: 255px;
}

/*.container-carrousel-complementos {
            border: 1px solid #cccccc;
            border-bottom: none;
            border-radius: 1%;
        }*/

.img-producto {
    height: 200px !important;
    /*max-width: 450px !important;*/
    width: 100%;
    object-fit: contain;
    margin-bottom: 60px;
    padding-bottom: 30px;
    padding-top: 30px;
}

.seccion-slider {
    padding-top: 10px;
    padding-bottom: 10px;
    padding-bottom: 65px;
}

    .seccion-slider img {
        object-fit: contain !important;
        height: 250px !important;
        width: 100%;
    }

@media (max-width:710px) {
    .seccion-slider img {
        height: 125px !important;
    }
}

.producto {
    border: 1px solid #cccccc;
    border-radius: 1%;
}

a:focus-visible {
    border: 2px solid var(--color-principal) !important;
}

.slick-next {
    right: 15px;
    z-index: 999;
}

.slick-prev {
    left: 0;
    z-index: 999;
}

    .slick-prev:before,
    .slick-next:before {
        font-family: 'slick';
        font-size: 34px;
        color: var(--color-principal);
        z-index: 999;
    }

.img:focus-visible {
    border: 3px solid var(--color-principal);
}

.slick-slide:focus-within {
    outline: none !important
}

.slick-slide:focus {
    outline: none !important;
}

.slick-slide:focus {
    outline: none !important;
}

.mobile .titulo {
    padding-top: 10px;
    padding-bottom: 5px;
    font-weight: 500;
    max-width: 80%;
}

.botonera {
    padding-top: 20px;
    padding-bottom: 20px;
    /*border: 1px solid #CCCCCC;
            border-radius: 1%;
            border-top: none;*/
}

.ico-tinder-accion {
    width: 65px;
    cursor: pointer;
}

@media (max-width:767px) {
    .ico-tinder-accion {
        width: 50px;
    }
}

.slick-current.slick-center > a {
    border: 2px solid var(--color-principal);
    border-radius: 3%;
}

.slick-slide:focus {
    outline: none !important;
    box-shadow: none !important;
    border: none !important;
}

.disabled-image {
    opacity: 0.3;
    filter: grayscale(100%);
    pointer-events: none !important;
    cursor: default !important;
    display: none;
}

.cursor-default {
    cursor: default !important;
}

.seccion-mobile {
    padding-left: 15px;
    padding-right: 15px;
}

.modal-content {
    /*top: 100px;*/
}

.modal-match {
    border-radius: 5%;
}

.mobile .titulo {
    max-width: 100% !important;
}

#tiempo_restante {
    font-weight: 700 !important;
}

.fondo-logo {
    width: 267px;
    height: 241px;
    position: absolute;
    z-index: 99999999;
}

.fondo-carrousel-complementos {
    min-height: 400px;
}

@media (max-width:767px) {
    .fondo-carrousel-complementos {
        margin-top: -40px;
    }
}

/*.slick-next {
    display:none !important;
}
.slick-prev {
    display:none !important;
}*/

@media (max-width:767px) {
    .btn-respuesta {
        padding-bottom: 15px !important;
    }

    .fondo-logo {
        width: 174px;
        height: 146px;
        position: absolute;
        z-index: 99999999;
        left: -51px;
        top: -30px;
    }
}

@media (min-width:768px) {
    .fondo-logo {
        top: 170px;
        left: -75px;
    }
}

@media (min-width:992px) {
    .mobile .caja-titulo {
        left: 50% !important;
        transform: translateX(-50%) !important;
        width: 45% !important;
    }

    .botonera {
        margin-left: 55px;
    }

    .slick-carousel-principal {
        margin-left: 75px;
    }

    .container-carrousel-complementos {
        margin-left: 55px;
    }

    .img-producto {
        margin-left: 20px;
    }

    .img-complementos {
        margin-left: 10px;
    }

    .fondo-logo {
        position: absolute;
        bottom: -135px;
        left: -50px;
    }
}

@media (min-width:1200px) {
    .fondo-logo {
        bottom: -135px;
        left: 0px;
    }
}

#tinder {
    margin-top: 30px;
}

/*@media (min-width:992px) {*/
.match-principal {
    bottom: 36px !important;
}

/*}*/

/* END MAQUETACIÓN TINDER */

/* AGENDA*/

.agenda-noticia {
    background-color: red !important;
    color: white !important;
    border: none !important;
}

.agenda-evento {
    background-color: #ffda9e !important;
    color: black !important;
    border: none !important;
}

    .agenda-evento span {
        color: black !important;
    }

.agenda-webinar {
    background-color: #b2e2f2 !important;
    color: black !important;
    border: none !important;
}

    .agenda-webinar span {
        color: black !important;
    }

.agenda-concurso {
    background-color: yellow !important;
    color: white !important;
    border: none !important;
}

    .agenda-concurso span {
        color: black !important;
    }

.agenda-landing {
    background-color: #c7f6d4 !important;
    color: black !important;
    border: none !important;
}

    .agenda-landing span {
        color: black !important;
    }

.agenda-quiz {
    background-color: #fabfb7 !important;
    color: black !important;
    border: none !important;
}

    .agenda-quiz span {
        color: black !important;
    }

.agenda-contenido {
    background-color: #fdf9c4 !important;
    color: black !important;
    border: none !important;
}

    .agenda-contenido span {
        color: black !important;
    }

.agenda-relacionar {
    background-color: #c030f2 !important;
    color: white !important;
    border: none !important;
}

.agenda-wefitter {
    background-color: #48bf09 !important;
    color: white !important;
    border: none !important;
}

.agenda-match {
    background-color: #43a9ed !important;
    color: white !important;
    border: none !important;
}

.agenda-postit {
    background-color: #f2d872 !important;
    color: white !important;
    border: none !important;
}

.agenda-adviento {
    background-color: #F2DEDE !important;
    color: black !important;
    border: none !important;
}

    .agenda-adviento span {
        color: black !important;
    }

.agenda-comic {
    background-color: #faadd0 !important;
    color: white !important;
    border: none !important;
}

.agenda-quiniela {
    background-color: #adf8fa !important;
    color: black !important;
    border: none !important;
}

    .agenda-quiniela span {
        color: black !important;
    }

.agenda-slider {
    background-color: #9bd3ae !important;
    color: black !important;
    border: none !important;
}

    .agenda-slider span {
        color: black !important;
    }

.agenda-manual {
    background-color: #c5c6c8 !important;
    color: black !important;
    border: none !important;
}

    .agenda-manual span {
        color: black !important;
    }

.agenda-popup {
    background-color: #dbc19d !important;
    color: black !important;
    border: none !important;
}

    .agenda-popup span {
        color: black !important;
    }


.agenda-metas {
    background-color: #dfc4f5 !important;
    color: black !important;
    border: none !important;
}

    .agenda-metas span {
        color: black !important;
    }


.fc-content {
    text-overflow: ellipsis !important;
    color: #000 !important;
}

.img-listado-memory-imagenes {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    cursor: pointer;
}

@media (min-width:992px) {
    .cta-memory {
        float: right !important;
    }

    .cta-memory-top {
        margin-top: -10px !important;
    }
}

@media (max-width:991px) {
    .cta-memory {
        float: left !important;
    }

    .cta-memory-top {
        margin-top: 25px !important;
    }
}

.btn-secondary {
    margin-top: 0 !important;
}

@media(min-width:550px) {
    .swal2-popup {
        min-width: 500px;
    }
}

.swal2-container {
    z-index: 10000000 !important;
}


.gestor-cajetin-opcion {
    background-color: var(--color-principal);
    /* padding: 27px 5px; */
    border-radius: 5px !important;
    height: 90px !important;
    padding: 11px 0px !important;
}


/* TOQUE */
.borde-principal {
    border: 4px solid var(--color-principal);
    border-radius: 23px;
    opacity: 1;
}

/* END TOQUE */


/* Comentarios */
.comentario-padre {
    padding-bottom: 10px;
}



/* End comentarios */


.tablinks {
    overflow-x: auto;
}

.caja-height {
    height: 570px;
}

.swal2-html-container {
    height: auto;
}

.hora-alta {
    margin-top: -35px;
}

/* EDITOR GRAPES JS */
.gjs-row {
    display: flex;
    justify-content: flex-start;
    align-items: stretch;
    flex-wrap: nowrap;
    padding: 10px;
}

.gjs-cell {
    min-height: 75px;
    flex-grow: 1;
    flex-basis: 100%;
}

@media (max-width: 768px) {
    .gjs-row {
        flex-wrap: wrap;
    }
}

.gjs-pn-btn {
    font-size: 18px !important;
}

.gjs-pn-commands {
    height: 45px;
}

.cv-canvas-bg {
    display: block !important;
    height: 120vh;
}

.fa-redo {
    font-size: 16px !important;
    margin-top: -3px;
}

.gjs-block-label {
    font-size: 1em !important;
}

.gjs-device-label {
    font-size: 2em;
}

.gjs-title {
    font-size: 2em !important;
}

.gjs-layer-name {
    font-size: 1.5em !important;
}

.gjs-clm-header-label {
    font-size: 2em !important;
}

.gjs-clm-sels-info {
    font-size: 1.7em !important;
}

.gjs-sm-sector-title {
    font-size: 1.6em !important;
}

.gjs-sm-properties {
    font-size: 1.3em !important;
}

.gjs-clm-sel {
    font-size: 1em !important;
}

.gjs-trt-header {
    font-size: 1.6em !important;
}

.gjs-input-holder {
    font-size: 1.3em !important;
}

.gjs-field-color {
    font-size: 1.3em !important;
}

.gjs-radio-items {
    font-size: 1.1em;
}

.gjs-traits-label {
    font-size: 1.6em !important;
}

.gjs-trt-trait--text {
    font-size: 1.4em !important;
}

.m-l-50 {
    margin-left: 50px !important;
}

/* END EDITOR GRAPESJS */


.tag-container {
    border-radius: 5px;
    margin: 5px;
    background-color: #efefef;
    font-size: 14px;
    padding: 5px;
}

/* MANAGER EVENTOS */

.estado-publicado {
    background-color: var(--color-principal);
    color: #fff;
    padding: 5px;
    border-radius: 10px;
    float: right;
}

.estado-borrador {
    background-color: #DE3733;
    padding: 5px;
    border-radius: 10px;
    float: right;
    color: #fff;
}

/* FIN EDITOR EVENTOS */

/* TOQUE */
.btn-toque {
    background-color: var(--color-principal) !important;
    color: #fff;
    border-radius: 5px !important;
    padding: 6px 85px !important;
    font-size: 16px !important;
}

/* END TOQUE */
.note-editable {
    color: inherit !important;
}


/* MANAGER INFORMES */

.fecha-encuestas {
    position: absolute;
    top: -77px;
    right: 10px;
    width: 150px !important;
}

/* FIN EDITOR INFORMES */

.backbutton {
    margin-top: 20px !important;
    min-width: 50px;
}



/* AGENDA USUARIOS (iframe) */

#iframeAgendaUsuarios {
    width: 100%;
}

@media(min-width:768px) {
    #iframeAgendaUsuarios {
        height: 800px;
    }
}

@media(max-width:767px) {
    #iframeAgendaUsuarios {
        height: 680px;
        padding-left: 15px !important;
        padding-right: 15px !important;
    }

    .bloque-principal {
        border: none;
    }
}

/* END AGENDA USUARIOS */

/* VARIOS */

.validate-error {
    background-color: #F7E4E8 !important;
}

@media (min-width:768px) {
    .select-img {
        height: 150px;
        width: 100% !important;
        object-fit: cover !important;
    }
}


/* MODAL TORNEOS */
@media(min-width:992px) {
    .modal-torneos {
        min-width: 800px;
    }
}

/* END MODAL */


div.SelOrigen {
    background-color: #f0fad7;
}

div.SelDestino {
    background-color: antiquewhite;
}

.fc-view-container {
    height: 80vh;
    overflow: auto;
}


.fc-day-header.fc-widget-header.fc-mon.fc-today span {
    background-color: var(--color-principal);
    border-radius: 5%;
    color: #fff;
    padding: 1px 5%;
}

.fc-today {
    background-color: rgba(255, 220, 40, .15);
}

/* EVENTOS SOLIDARIOS */
.clonar-evento {
    position: absolute;
    top: 100px;
    left: 0;
    color: #fff;
    background-color: var(--color-principal) !important;
    padding: 10px 15px;
    opacity: 0.8;
}

/* === MODULE: NEWSLETTER EDITOR === */
#newsletters .nl-edit-zone {
    width: 100%;
    max-height: 200px;
    overflow-y: auto;
    border: 1px solid #ccc;
    padding: 10px;
    border-radius: 4px;
    background-color: #fff;
    font-family: monospace;
    font-size: 13px;
    line-height: 1.5;
    resize: vertical;
}

    #newsletters .nl-edit-zone:focus {
        outline: none;
        border-color: #66afe9;
        box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102,175,233,.6);
    }

#newsletters .nl-container {
    margin-top: 15px;
    margin-bottom: 15px;
}
/* END NEWSLETTER MODULE */

.ql-container {
    min-height: 190px !important;
}

/* FIN EDITOR QUILLJS */

@media (min-width:768px) {
    .dialog-subasta {
        min-width: 750px;
    }
}

@media (min-width:992px) {
    .dialog-subasta {
        min-width: 850px;
    }
}

.dialog-content {
    border-radius: 10px !important;
}

.close-detalle-subasta,
.close-confirmacion {
    position: absolute;
    top: 10px !important;
    right: 15px;
    z-index: 99999999999;
    font-size: 45px !important;
    top: -3px;
    color: var(--color-principal) !important;
    opacity: 1 !important;
    border: none;
}

.btn-comprar {
    padding: 10px 50px !important;
    border-radius: 5px !important;
    font-size: 14px !important;
}

.img-detalle-subasta {
    width: 100%;
    object-fit: contain;
    border-radius: 10px;
}

.img-detalle-subasta {
    border-radius: 5px !important;
}

.dialog-body {
    padding: 0 !important;
}

.dialog-content {
    top: auto !important;
}

.comentarios-subasta {
    border-radius: 10px;
    border: 1px solid #EEDEDD;
}

.avatar-subasta {
    width: 50px;
    height: 50px;
    border-radius: 50%;
}

.input-enviar-mensaje {
    border: 1px solid #EEDEDD;
    border-radius: 10px;
    padding: 10px;
}

    .input-enviar-mensaje:focus {
        border: 1px solid #EEDEDD !important;
        box-shadow: none !important;
    }

.bloque-comentarios-subasta {
    height: 112px;
    overflow: auto;
}

.bloque-comentarios-subasta {
    overflow-y: auto;
    max-height: 300px;
    scrollbar-width: none;
}

.info-detalle {
    overflow-y: auto;
    max-height: 400px;
    scrollbar-width: none;
}

.bloque-comentarios-subasta,
.info-detalle {
    overflow-y: auto;
    scrollbar-width: none;
    /* Firefox: ocultar por defecto */
}

    /* WebKit - Ocultar por defecto */
    .bloque-comentarios-subasta::-webkit-scrollbar,
    .info-detalle::-webkit-scrollbar {
        width: 0;
        transition: width 0.3s ease;
    }

    /* WebKit - Mostrar barra al hacer hover */
    .bloque-comentarios-subasta:hover::-webkit-scrollbar,
    .info-detalle:hover::-webkit-scrollbar {
        width: 6px;
    }

    .bloque-comentarios-subasta::-webkit-scrollbar-track,
    .info-detalle::-webkit-scrollbar-track {
        background: transparent;
    }

    .bloque-comentarios-subasta::-webkit-scrollbar-thumb,
    .info-detalle::-webkit-scrollbar-thumb {
        background-color: var(--color-principal);
        border-radius: 4px;
    }

    /* Firefox - Mostrar barra al hacer hover */
    .bloque-comentarios-subasta:hover,
    .info-detalle:hover {
        scrollbar-width: thin;
        scrollbar-color: var(--color-principal) transparent;
    }


.subasta-envio-mensaje {
    font-size: 25px !important;
    margin-top: 25px !important;
    margin-left: -10px !important;
    cursor: pointer !important;
}

.ui-dialog .ui-dialog-titlebar-close {
    position: absolute;
    right: .3em;
    /* top: 16px !important; */
    top: 34%;
    width: 20px;
    height: 89px;
    margin: -10px 0 0 0;
    padding: 1px;
    height: 24px;
}

.tag-price {
    width: 100px;
    border-radius: 10px;
}

.sin-comentarios-subasta {
    position: absolute !important;
    top: 90px;
    left: 0px;
}

/* Estilos exclusivos del modal de cancelación */

.modal-cancelacion-content {
    border-radius: 10px !important;
    overflow: hidden;
    top: 250px !important;
}

.modal-cancelacion-body {
    padding: 30px 20px !important;
}

.modal-cancelacion-icon {
    font-size: 48px;
    margin-bottom: 10px;
}

.modal-cancelacion-title {
    font-weight: bold;
    margin-bottom: 10px;
}

.modal-cancelacion-text {
    margin-bottom: 20px;
}

.modal-cancelacion-buttons {
    display: flex;
    justify-content: center;
    gap: 10px;
}

    .modal-cancelacion-buttons .btn {
        min-width: 100px;
    }

.btn-confirmar {
    border-radius: 4px !important;
}

.btn-confirmar-cancelacion {
    height: 33px !important;
}

.d-vendido {
    margin-top: -24px;
}

.vendido {
    font-family: 'Roboto', 'RobotoLight', sans-serif;
    font-size: 16px;
    font-weight: 500;
    color: #009AD8;
    padding: 12px 0;
    margin: 10px 0;
    text-align: center;
    text-transform: uppercase;
    letter-spacing: 2px;
    border-top: 3px solid #009AD8;
    border-bottom: 3px solid #009AD8;
    border-left: none;
    border-right: none;
    background-color: rgba(0, 154, 216, 0.08);
    position: relative;
}

    .vendido:before {
        content: "";
        position: absolute;
        top: -1px;
        left: 20%;
        right: 20%;
        height: 1px;
        background-color: #009AD8;
    }

    .vendido:after {
        content: "";
        position: absolute;
        bottom: -1px;
        left: 20%;
        right: 20%;
        height: 1px;
        background-color: #009AD8;
    }

.event-list {
    background: white;
    padding: 20px;
    border-radius: 6px;
    box-shadow: 0 0 8px rgba(0, 0, 0, 0.05);
}

    .event-list li {
        padding: 10px;
        border-bottom: 1px solid #eee;
    }

        .event-list li:last-child {
            border-bottom: none;
        }

.pagination-wrapper {
    margin-top: 20px;
    text-align: center;
}

.btn-cancelar:hover {
    color: var(--color-principal) !important;
    opacity: 0.8 !important;
    text-decoration: underline !important;
}

@media (max-width:767px) {
    .info-paginacion {
        margin-left: 5px;
    }

    .caja-subasta {
        height: 575px;
    }

    .pag-anterior,
    .pag-siguiente {
        font-size: 16px;
    }
}

@media (min-width:768px) {
    .info-paginacion {
        margin-left: -10px;
    }

    .caja-subasta {
        height: 570px !important;
    }

    .pag-anterior,
    .pag-siguiente {
        font-size: 21px;
    }
}

@media (min-width:992px) {
    .info-paginacion {
        margin-left: -10px;
    }

    .caja-subasta {
        height: 600px !important;
    }

    .pag-anterior,
    .pag-siguiente {
        font-size: 21px;
    }
}

@media (min-width:1200px) {
    .info-paginacion {
        margin-left: -10px;
    }

    .caja-subasta {
        height: 570px !important;
    }

    .pag-anterior,
    .pag-siguiente {
        font-size: 21px;
    }
}

.pag-anterior {
    float: left;
}

.pag-siguiente {
    float: right;
}

.img-listado-subasta {
    border-radius: 5px;
}

/* Overlay con fondo oscuro */
.loading-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.7);
    /* Fondo oscuro semitransparente */
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 9999;
    display: none !important;
    /* Oculto por defecto */
}

/* Spinner de carga */
.loading-spinner {
    width: 50px;
    height: 50px;
    border: 5px solid #f3f3f3;
    border-top: 5px solid #3498db;
    border-radius: 50%;
    animation: spin 1s linear infinite;
}

@keyframes spin {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}



/* EDITOR SUBASTA */

/* BUTTONBACK */

#back-left {
    display: none;
    /* Hidden by default */
    position: fixed;
    /* Fixed/sticky position */
    bottom: 20px;
    /* Place the button at the bottom of the page */
    left: 5px;
    /* Place the button 30px from the right */
    z-index: 99;
    /* Make sure it does not overlap */
    border: none;
    /* Remove borders */
    outline: none;
    /* Remove outline */
    cursor: pointer;
    /* Add a mouse pointer on hover */
    padding: 15px;
    /* Some padding */
    border-radius: 10px;
    /* Rounded corners */
    opacity: 0.8;
}

    #back-left:hover {
        opacity: 1;
    }

    #back-left a {
        width: 70px;
        display: block;
        text-align: center;
        font: 11px/100% Arial, Helvetica, sans-serif;
        text-transform: uppercase;
        text-decoration: none;
        color: #bbb;
        -webkit-transition: 1s;
        -moz-transition: 1s;
        transition: 1s;
    }

    #back-left span {
        color: white;
        text-align: center;
        font-size: 50px;
        width: 70px;
        height: 70px;
        display: block;
        margin-bottom: 7px;
        /* background: #ddd url(../im/layout/top4.jpg) no-repeat center center; */
        background: #bbb no-repeat center center;
        -webkit-border-radius: 15px;
        -moz-border-radius: 15px;
        border-radius: 15px;
        -webkit-transition: 1s;
        -moz-transition: 1s;
        transition: 1s;
    }

        #back-left span i {
            top: 7px;
            left: -2px;
        }

.backbutton {
    margin-top: 20px !important;
}

#back-top {
    right: 5px !important;
}

/* END BUTTONBACK */


/* PLAY BUTTON VIMEO */

.play-button-vimeo {
    position: absolute !important;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.pause-icon-vimeo {
    position: absolute !important;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

/* END PLAY BUTTON VIMEO */


.swal2-styled {
    background-color: var(--color-principal) !important;
}

.ui-dialog .ui-dialog-titlebar-close::before {
    content: "\00d7";
}

#cat-widget {
    position: fixed;
    bottom: 10px;
    right: 10px;
    z-index: 9999;
    cursor: pointer;
    transition: opacity 0.5s ease;
}

    #cat-widget img {
        /*width: 150px;
    height: 150px;*/
        max-height: 400px;
        max-width: 400px;
        opacity: 1;
        border-radius: 20px;
    }

    #cat-widget .wally-asset-text {
        margin: 6px 0 0;
        padding: 4px 8px;
        border-radius: 8px;
        background: rgba(255, 255, 255, 0.9);
        color: #1f1f1f;
        font-size: 15px;
        line-height: 1.35;
        text-align: center;
        box-sizing: border-box;
    }

#cat-popup {
    position: fixed;
    z-index: 10000;
    display: none;
    animation: fadeIn 0.4s ease;
    bottom: calc(50vh - 150px);
    right: calc(50vw - 150px);
    background: #fff;
    border-radius: 10px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.4);
}

    #cat-popup img {
        width: 300px;
    }

    #cat-popup span {
        display: block;
        text-align: center;
        font-size: 24px;
        padding: 10px;
        width: 300px;
    }

    #cat-popup .wally-asset-text {
        text-align: center;
        font-size: 16px;
        padding: 5px 10px;
        margin: 0;
        width: 300px;
        box-sizing: border-box;
    }

@keyframes fadeIn {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.mapa-emocional-section {
    padding: 40px 0;
    background: linear-gradient(135deg, #f5f7fa 0%, #c3cfe2 100%);
    min-height: 100vh;
}

.page-title {
    font-family: 'Quicksand', sans-serif;
    font-size: 42px;
    font-weight: 700;
    text-align: center;
    color: var(--color-principal);
    margin-bottom: 10px;
}

.page-subtitle {
    font-size: 18px;
    text-align: center;
    color: #666;
    margin-bottom: 30px;
}

.section-title {
    font-family: 'Quicksand', sans-serif;
    font-size: 32px;
    font-weight: 700;
    text-align: center;
    color: var(--color-principal);
    margin-bottom: 15px;
}

.section-description {
    font-size: 16px;
    text-align: center;
    color: #666;
    margin-bottom: 20px;
}

.cuadrantes-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
    padding: 20px 0;
}

.cuadrante-card {
    background: white;
    border-radius: 15px;
    padding: 30px;
    cursor: pointer;
    transition: all 0.3s ease;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    border: 3px solid transparent;
    min-height: 220px;
    display: flex;
    align-items: center;
}

    .cuadrante-card:hover {
        transform: translateY(-5px);
        box-shadow: 0 8px 15px rgba(0, 0, 0, 0.2);
    }

    .cuadrante-card.selected {
        border-color: var(--color-principal);
        box-shadow: 0 8px 20px rgba(0, 0, 0, 0.3);
        transform: scale(1.05);
    }

.cuadrante-rojo {
    background: linear-gradient(135deg, #ff6b6b 0%, #ee5a6f 100%);
    color: white;
}

.cuadrante-amarillo {
    background: linear-gradient(135deg, #ffd93d 0%, #ffb700 100%);
    color: #333;
}

.cuadrante-azul {
    background: linear-gradient(135deg, #4facfe 0%, #00f2fe 100%);
    color: white;
}

.cuadrante-verde {
    background: linear-gradient(135deg, #43e97b 0%, #38f9d7 100%);
    color: #333;
}

.cuadrante-content {
    width: 100%;
}

.cuadrante-nombre {
    font-family: 'Quicksand', sans-serif;
    font-size: 24px;
    font-weight: 700;
    margin-bottom: 15px;
    text-align: center;
}

.cuadrante-descripcion {
    font-size: 14px;
    line-height: 1.6;
    text-align: center;
    opacity: 0.9;
}

.voto-resumen {
    background: white;
    border-radius: 15px;
    padding: 25px;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    text-align: center;
}

    .voto-resumen h4 {
        font-family: 'Quicksand', sans-serif;
        font-size: 20px;
        font-weight: 700;
        margin-bottom: 20px;
        color: var(--color-principal);
    }

.voto-info {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 15px;
    flex-wrap: wrap;
}

    .voto-info .badge {
        font-size: 18px;
        padding: 10px 20px;
        border-radius: 25px;
        font-weight: 600;
    }

.badge-rojo {
    background: linear-gradient(135deg, #ff6b6b 0%, #ee5a6f 100%);
    color: white;
}

.badge-amarillo {
    background: linear-gradient(135deg, #ffd93d 0%, #ffb700 100%);
    color: #333;
}

.badge-azul {
    background: linear-gradient(135deg, #4facfe 0%, #00f2fe 100%);
    color: white;
}

.badge-verde {
    background: linear-gradient(135deg, #43e97b 0%, #38f9d7 100%);
    color: #333;
}

.voto-info .arrow {
    font-size: 24px;
    color: var(--color-principal);
    font-weight: bold;
}

.recomendaciones-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    gap: 20px;
    margin-top: 20px;
}

.recomendacion-card {
    background: white;
    border-radius: 15px;
    padding: 25px;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    transition: all 0.3s ease;
}

    .recomendacion-card:hover {
        transform: translateY(-3px);
        box-shadow: 0 6px 12px rgba(0, 0, 0, 0.15);
    }

.recomendacion-titulo {
    font-family: 'Quicksand', sans-serif;
    font-size: 20px;
    font-weight: 700;
    color: var(--color-principal);
    margin-bottom: 10px;
}

.recomendacion-descripcion {
    font-size: 14px;
    line-height: 1.6;
    color: #666;
    margin-bottom: 15px;
}

.recomendacion-tipo {
    display: inline-block;
    background: #f0f0f0;
    padding: 5px 15px;
    border-radius: 15px;
    font-size: 12px;
    color: #666;
    text-transform: capitalize;
}

@media (max-width: 992px) {
    .cuadrantes-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 768px) {
    .page-title {
        font-size: 32px;
    }

    .section-title {
        font-size: 24px;
    }

    .cuadrantes-grid {
        grid-template-columns: 1fr;
    }

    .recomendaciones-grid {
        grid-template-columns: 1fr;
    }

    .voto-info {
        flex-direction: column;
    }
}

.mapa-emocional-section {
    padding: 40px 0;
    background: linear-gradient(135deg, #f5f7fa 0%, #c3cfe2 100%);
    min-height: 100vh;
}

.page-title {
    font-family: 'Quicksand', sans-serif;
    font-size: 42px;
    font-weight: 700;
    text-align: center;
    color: var(--color-principal);
    margin-bottom: 10px;
}

.page-subtitle {
    font-size: 18px;
    text-align: center;
    color: #666;
    margin-bottom: 30px;
}

.section-title {
    font-family: 'Quicksand', sans-serif;
    font-size: 32px;
    font-weight: 700;
    text-align: center;
    color: var(--color-principal);
    margin-bottom: 15px;
}

.section-description {
    font-size: 16px;
    text-align: center;
    color: #666;
    margin-bottom: 20px;
}

.cuadrantes-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
    padding: 20px 0;
}

.cuadrante-card {
    background: white;
    border-radius: 15px;
    padding: 30px;
    cursor: pointer;
    transition: all 0.3s ease;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    border: 3px solid transparent;
    min-height: 220px;
    display: flex;
    align-items: center;
}

    .cuadrante-card:hover {
        transform: translateY(-5px);
        box-shadow: 0 8px 15px rgba(0, 0, 0, 0.2);
    }

    .cuadrante-card.selected {
        border-color: var(--color-principal);
        box-shadow: 0 8px 20px rgba(0, 0, 0, 0.3);
        transform: scale(1.05);
    }

.cuadrante-rojo {
    background: linear-gradient(135deg, #ff6b6b 0%, #ee5a6f 100%);
    color: white;
}

.cuadrante-amarillo {
    background: linear-gradient(135deg, #ffd93d 0%, #ffb700 100%);
    color: #333;
}

.cuadrante-azul {
    background: linear-gradient(135deg, #4facfe 0%, #00f2fe 100%);
    color: white;
}

.cuadrante-verde {
    background: linear-gradient(135deg, #43e97b 0%, #38f9d7 100%);
    color: #333;
}

.cuadrante-content {
    width: 100%;
}

.cuadrante-nombre {
    font-family: 'Quicksand', sans-serif;
    font-size: 24px;
    font-weight: 700;
    margin-bottom: 15px;
    text-align: center;
}

.cuadrante-descripcion {
    font-size: 14px;
    line-height: 1.6;
    text-align: center;
    opacity: 0.9;
}

.voto-resumen {
    background: white;
    border-radius: 12px;
    padding: 35px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    text-align: center;
    border: 1px solid #e8e8e8;
}

    .voto-resumen h4 {
        font-family: 'Quicksand', sans-serif;
        font-size: 18px;
        font-weight: 600;
        margin-bottom: 25px;
        color: #333;
        text-transform: none;
        letter-spacing: 0.3px;
    }

.voto-info {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 20px;
    flex-wrap: wrap;
}

    .voto-info .badge {
        font-size: 16px;
        padding: 12px 28px;
        border-radius: 8px;
        font-weight: 600;
        text-transform: none;
        letter-spacing: 0.3px;
        box-shadow: 0 2px 6px rgba(0, 0, 0, 0.12);
        border: none;
    }

.badge-rojo {
    background: linear-gradient(135deg, #ff6b6b 0%, #ee5a6f 100%);
    color: white;
}

.badge-amarillo {
    background: linear-gradient(135deg, #ffd93d 0%, #ffb700 100%);
    color: #333;
}

.badge-azul {
    background: linear-gradient(135deg, #4facfe 0%, #00f2fe 100%);
    color: white;
}

.badge-verde {
    background: linear-gradient(135deg, #43e97b 0%, #38f9d7 100%);
    color: #333;
}

.voto-info .arrow {
    font-size: 28px;
    color: #999;
    font-weight: 300;
    margin: 0 5px;
}

.recomendaciones-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    gap: 24px;
    margin-top: 30px;
}

.recomendacion-card {
    background: white;
    border-radius: 12px;
    padding: 28px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    transition: all 0.3s ease;
    border: 1px solid #e8e8e8;
    display: flex;
    flex-direction: column;
}

    .recomendacion-card:hover {
        transform: translateY(-4px);
        box-shadow: 0 8px 20px rgba(0, 0, 0, 0.12);
        border-color: var(--color-principal);
    }

.recomendacion-titulo {
    font-family: 'Quicksand', sans-serif;
    font-size: 19px;
    font-weight: 600;
    color: #333;
    margin-bottom: 12px;
    line-height: 1.4;
}

.recomendacion-descripcion {
    font-size: 14px;
    line-height: 1.7;
    color: #666;
    margin-bottom: 18px;
    flex-grow: 1;
}

.recomendacion-tipo {
    display: inline-block;
    background: #f5f5f5;
    padding: 6px 16px;
    border-radius: 6px;
    font-size: 12px;
    color: #666;
    text-transform: capitalize;
    font-weight: 500;
    margin-bottom: 12px;
}

/* Estilos profesionales para botones */
.btn-mapa-primary {
    background: linear-gradient(135deg, var(--color-principal) 0%, var(--color-secundario, #667eea) 100%);
    color: white;
    border: none;
    padding: 14px 32px;
    font-size: 16px;
    font-weight: 600;
    border-radius: 8px;
    transition: all 0.3s ease;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
    text-transform: none;
    letter-spacing: 0.3px;
}

    .btn-mapa-primary:hover {
        transform: translateY(-2px);
        box-shadow: 0 6px 20px rgba(0, 0, 0, 0.25);
        color: white;
    }

    .btn-mapa-primary:active {
        transform: translateY(0);
    }

.btn-mapa-secondary {
    background: white;
    color: var(--color-principal);
    border: 2px solid var(--color-principal);
    padding: 12px 30px;
    font-size: 16px;
    font-weight: 600;
    border-radius: 8px;
    transition: all 0.3s ease;
    text-transform: none;
    letter-spacing: 0.3px;
}

    .btn-mapa-secondary:hover {
        background: var(--color-principal);
        color: white;
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
    }

.btn-mapa-link {
    background: transparent;
    color: #666;
    border: none;
    padding: 12px 24px;
    font-size: 14px;
    font-weight: 500;
    text-decoration: none;
    transition: all 0.2s ease;
    text-transform: none;
}

    .btn-mapa-link:hover {
        color: var(--color-principal);
        text-decoration: none;
        background: rgba(0, 0, 0, 0.03);
        border-radius: 6px;
    }

.btn-mapa-small {
    padding: 8px 20px;
    font-size: 14px;
    font-weight: 600;
    border-radius: 6px;
    background: var(--color-principal);
    color: white;
    border: none;
    transition: all 0.3s ease;
    text-transform: none;
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

    .btn-mapa-small:hover {
        background: var(--color-secundario, #667eea);
        color: white;
        transform: translateY(-1px);
        box-shadow: 0 3px 8px rgba(0, 0, 0, 0.15);
    }

    .btn-mapa-small::after {
        content: 'â†’';
        transition: transform 0.2s ease;
    }

    .btn-mapa-small:hover::after {
        transform: translateX(3px);
    }

@media (max-width: 992px) {
    .cuadrantes-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 768px) {
    .page-title {
        font-size: 32px;
    }

    .section-title {
        font-size: 24px;
    }

    .cuadrantes-grid {
        grid-template-columns: 1fr;
    }

    .recomendaciones-grid {
        grid-template-columns: 1fr;
    }

    .voto-info {
        flex-direction: column;
    }
}

/* ============================================
   ESTILOS PARA REDISEÃ‘O
   ============================================ */

/* SECCIÃ“N 1: PRESENTACIÃ“N */
.presentacion-section {
    background: white;
    padding: 40px;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    margin-bottom: 40px;
}

.presentacion-titulo {
    color: var(--color-principal);
    font-size: 32px;
    font-weight: 700;
    text-align: center;
    margin-bottom: 30px;
}

.presentacion-texto {
    padding: 20px 0;
}

.presentacion-subtitulo {
    color: var(--color-principal);
    font-size: 24px;
    font-weight: 600;
    margin-bottom: 20px;
}

.presentacion-descripcion {
    color: #555;
    font-size: 16px;
    line-height: 1.6;
}

.presentacion-imagen {
    width: 100%;
    max-width: 400px;
    height: auto;
    display: block;
    margin: 0 auto;
}

/* SECCIÃ“N 2: CÃ“MO TE SIENTES (4 cÃ­rculos pequeÃ±os con iconos) */
.seccion-como-te-sientes,
.seccion-como-quieres,
.seccion-grafica,
.seccion-recomendaciones {
    background: white;
    padding: 40px;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    margin-bottom: 40px;
}

.seccion-titulo {
    color: var(--color-principal);
    font-size: 28px;
    font-weight: 700;
    text-align: center;
    margin-bottom: 15px;
}

.seccion-descripcion {
    color: #666;
    font-size: 16px;
    text-align: center;
    margin-bottom: 30px;
}

.cuadrantes-emociones {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
    margin: 0 auto;
    max-width: 100%;
    padding: 0 15px;
    box-sizing: border-box;
}

.cuadrante-emocion {
    text-align: center;
    cursor: pointer;
    transition: transform 0.3s ease;
    padding: 20px;
    border-radius: 12px;
    background: white;
}

    .cuadrante-emocion:hover {
        transform: translateY(-5px);
    }

    .cuadrante-emocion.selected {
        background: #E3F2FD;
        box-shadow: 0 4px 12px rgba(0, 188, 212, 0.3);
    }

.emocion-circulo {
    width: 120px;
    height: 120px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 15px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

    .emocion-circulo img {
        width: 100%;
        height: 100%;
        max-width: 100%;
        object-fit: contain;
    }

.emocion-nombre {
    font-size: 16px;
    font-weight: 700;
    color: #333;
    margin-bottom: 8px;
}

.emocion-descripcion {
    font-size: 14px;
    color: #666;
    line-height: 1.4;
}

/* SECCIÃ“N 3: CÃ“MO TE GUSTARÃA SENTIRTE (4 cÃ­rculos grandes con fotos) */
.cuadrantes-emociones-deseado {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 30px;
    margin: 0 auto;
    max-width: 1000px;
}

.cuadrante-emocion-grande {
    text-align: center;
    cursor: pointer;
    transition: transform 0.3s ease;
    padding: 30px 20px;
    border-radius: 16px;
    background: white;
    border: 3px solid transparent;
}

    .cuadrante-emocion-grande:hover {
        transform: translateY(-8px);
        box-shadow: 0 8px 20px rgba(0, 0, 0, 0.12);
    }

    .cuadrante-emocion-grande.selected {
        background: #E3F2FD;
        border-color: #00BCD4;
        box-shadow: 0 8px 24px rgba(0, 188, 212, 0.4);
    }

.emocion-circulo-grande {
    width: 150px;
    height: 150px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 20px;
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.2);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

/* INFO BOX */
.info-box {
    background: #FF4081;
    color: white;
    padding: 20px 30px;
    border-radius: 12px;
    text-align: center;
    font-size: 15px;
    line-height: 1.6;
    margin-top: 30px;
}

    .info-box p {
        margin: 0;
    }

/* SECCIÃ“N 4: GRÃFICA */
.grafica-container {
    background: white;
    padding: 0;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}

#graficaMapaEmocional {
    max-width: 100%;
    height: auto !important;
}

/* SECCIÃ“N 5: RECOMENDACIONES (3 por fila) */
.recomendaciones-grid-rediseno {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 25px;
    margin-top: 30px;
}

.recomendacion-card-rediseno {
    background: white;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.1);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

    .recomendacion-card-rediseno:hover {
        transform: translateY(-5px);
        box-shadow: 0 6px 20px rgba(0, 0, 0, 0.15);
    }

.recomendacion-imagen {
    width: 100%;
    height: 180px;
    overflow: hidden;
    border-radius: 12px;
}

    .recomendacion-imagen img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        border-radius: 12px;
        border: none;
        transition: transform 0.3s ease;
    }

.recomendacion-card-rediseno:hover .recomendacion-imagen img {
    transform: scale(1.05);
}

.recomendacion-contenido {
    padding: 20px;
    text-align: center;
}

.recomendacion-texto {
    font-size: 16px;
    font-weight: 500;
    color: #333;
    margin-bottom: 15px;
    line-height: 1.4;
}

.btn-saber-mas {
    display: inline-block;
    background: var(--color-principal);
    color: white !important;
    padding: 12px 30px;
    border-radius: 25px;
    text-decoration: none !important;
    font-size: 14px;
    font-weight: 600;
    transition: background 0.3s ease, transform 0.2s ease;
}

    .btn-saber-mas:hover {
        background: var(--color-principal);
        filter: brightness(0.9);
        color: white !important;
        text-decoration: none !important;
        transform: scale(1.05);
    }

/* BOTONES REDISEÃ‘O */
.btn-primary-mapa {
    background: var(--color-principal);
    color: white;
    border: none;
    padding: 14px 40px;
    font-size: 16px;
    font-weight: 600;
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.3s ease;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

    .btn-primary-mapa:hover {
        background: var(--color-principal);
        filter: brightness(0.9);
        transform: translateY(-2px);
        box-shadow: 0 6px 16px rgba(0, 0, 0, 0.2);
        color: white;
    }

.btn-secondary-mapa {
    background: #E0E0E0;
    color: #333;
    border: none;
    padding: 14px 40px;
    font-size: 16px;
    font-weight: 600;
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.3s ease;
}

    .btn-secondary-mapa:hover {
        background: #BDBDBD;
    }

.btn-link-mapa {
    background: transparent;
    color: #00BCD4;
    border: none;
    padding: 14px 20px;
    font-size: 16px;
    font-weight: 600;
    cursor: pointer;
    text-decoration: underline;
    transition: color 0.3s ease;
}

    .btn-link-mapa:hover {
        color: #0097A7;
    }

/* UTILIDADES */
.m-t-40 {
    margin-top: 40px;
}

.m-t-60 {
    margin-top: 60px;
}

.m-r-10 {
    margin-right: 10px;
}

.text-center {
    text-align: center;
}

/* RESPONSIVE REDISEÃ‘O */
@media (max-width: 992px) {

    .cuadrantes-emociones,
    .cuadrantes-emociones-deseado {
        grid-template-columns: repeat(2, 1fr);
    }

    .recomendaciones-grid-rediseno {
        grid-template-columns: repeat(2, 1fr);
    }

    .presentacion-titulo {
        font-size: 28px;
    }

    .seccion-titulo {
        font-size: 24px;
    }
}

@media (max-width: 576px) {

    .cuadrantes-emociones,
    .cuadrantes-emociones-deseado {
        grid-template-columns: repeat(2, 1fr);
        gap: 10px;
    }

    .recomendaciones-grid-rediseno {
        grid-template-columns: 1fr;
    }

    .presentacion-section,
    .seccion-como-te-sientes,
    .seccion-como-quieres,
    .seccion-grafica,
    .seccion-recomendaciones {
        padding: 20px;
    }

    .presentacion-titulo {
        font-size: 24px;
    }

    .seccion-titulo {
        font-size: 20px;
    }

    .emocion-circulo {
        width: 100px;
        height: 100px;
    }

        .emocion-circulo img {
            width: 100%;
            height: 100%;
        }

    .emocion-circulo-grande {
        width: 120px;
        height: 120px;
    }

    .btn-primary-mapa,
    .btn-secondary-mapa {
        width: 100%;
        margin-bottom: 10px;
    }
}

/* ============================================
   TOOLTIP BOCADILLO PARA CUADRANTES
   ============================================ */
.cuadrantes-emociones-wrapper {
    position: relative;
}

.tooltip-cuadrante {
    position: relative;
    margin-top: 30px;
    padding: 25px 30px;
    border-radius: 12px;
    color: white;
    font-size: 15px;
    line-height: 1.7;
    text-align: center;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease, visibility 0.3s ease;
    max-width: 900px;
    margin-left: auto;
    margin-right: auto;
}

    .tooltip-cuadrante.visible {
        opacity: 1;
        visibility: visible;
    }

    /* Flecha del tooltip */
    .tooltip-cuadrante::before {
        content: '';
        position: absolute;
        top: -15px;
        width: 0;
        height: 0;
        border-left: 15px solid transparent;
        border-right: 15px solid transparent;
        border-bottom: 15px solid currentColor;
        transition: left 0.3s ease;
    }

    /* Colores del tooltip por cuadrante */
    .tooltip-cuadrante.tooltip-rojo {
        background-color: #D32F2F;
    }

        .tooltip-cuadrante.tooltip-rojo::before {
            border-bottom-color: #D32F2F;
        }

    .tooltip-cuadrante.tooltip-azul {
        background-color: #0097A7;
    }

        .tooltip-cuadrante.tooltip-azul::before {
            border-bottom-color: #0097A7;
        }

    .tooltip-cuadrante.tooltip-amarillo {
        background-color: #F9A825;
        color: #333;
    }

        .tooltip-cuadrante.tooltip-amarillo::before {
            border-bottom-color: #F9A825;
        }

    .tooltip-cuadrante.tooltip-verde {
        background-color: #00897B;
    }

        .tooltip-cuadrante.tooltip-verde::before {
            border-bottom-color: #00897B;
        }

    /* Posición de la flecha según el cuadrante */
    .tooltip-cuadrante[data-position="0"]::before {
        left: 12.5%;
        transform: translateX(-50%);
    }

    .tooltip-cuadrante[data-position="1"]::before {
        left: 37.5%;
        transform: translateX(-50%);
    }

    .tooltip-cuadrante[data-position="2"]::before {
        left: 62.5%;
        transform: translateX(-50%);
    }

    .tooltip-cuadrante[data-position="3"]::before {
        left: 87.5%;
        transform: translateX(-50%);
    }

/* Responsive para tooltip */
@media (max-width: 992px) {
    .tooltip-cuadrante[data-position="0"]::before,
    .tooltip-cuadrante[data-position="2"]::before {
        left: 25%;
    }

    .tooltip-cuadrante[data-position="1"]::before,
    .tooltip-cuadrante[data-position="3"]::before {
        left: 75%;
    }
}

@media (max-width: 576px) {
    .tooltip-cuadrante {
        padding: 20px;
        font-size: 14px;
    }
}

/* Botones bonitos para Volver y Guardar */
.btn-volver-mapa {
    background: transparent;
    color: #666;
    border: 2px solid #ddd;
    padding: 14px 32px;
    font-size: 16px;
    font-weight: 600;
    border-radius: 30px;
    cursor: pointer;
    transition: all 0.3s ease;
    margin-right: 15px;
}

    .btn-volver-mapa:hover {
        background: #f5f5f5;
        border-color: #bbb;
        color: #333;
    }

    .btn-volver-mapa i {
        margin-right: 8px;
    }

.btn-guardar-mapa {
    background: var(--color-principal) !important;
    color: white !important;
    border: none !important;
    padding: 14px 40px !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    border-radius: 30px !important;
    cursor: pointer;
    transition: all 0.3s ease;
    box-shadow: 0 4px 15px rgba(0, 188, 212, 0.4) !important;
}

    .btn-guardar-mapa:hover,
    .btn-guardar-mapa:focus,
    .btn-guardar-mapa:active {
        background: var(--color-principal) !important;
        filter: brightness(0.9);
        transform: translateY(-2px);
        box-shadow: 0 6px 20px rgba(0, 0, 0, 0.2) !important;
        color: white !important;
    }

    .btn-guardar-mapa i {
        margin-right: 8px;
    }

@media (max-width: 576px) {
    .btn-volver-mapa,
    .btn-guardar-mapa {
        display: block;
        width: 100%;
        margin: 10px 0;
    }

    .btn-volver-mapa {
        margin-right: 0;
    }
}

/* Ocultar nombre por defecto en paso 1, mostrar solo al hover/click */
.emocion-nombre-hover {
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease, visibility 0.3s ease;
    height: 0;
    margin: 0;
    overflow: hidden;
}

    .emocion-nombre-hover.visible {
        opacity: 1;
        visibility: visible;
        height: auto;
        margin-top: 15px;
    }

/* ============================================
   MENSAJE SIN CAMPAÑA ACTIVA
   ============================================ */
.sin-campana-container {
    text-align: center;
    padding: 80px 40px;
    background: linear-gradient(135deg, #f5f7fa 0%, #e4e8eb 100%);
    border-radius: 20px;
    margin: 60px 0;
}

.sin-campana-icono {
    font-size: 80px;
    color: var(--color-principal);
    margin-bottom: 30px;
    opacity: 0.7;
}

    .sin-campana-icono i {
        display: inline-block;
        animation: pulse 2s infinite;
    }

@keyframes pulse {
    0% {
        transform: scale(1);
    }

    50% {
        transform: scale(1.1);
    }

    100% {
        transform: scale(1);
    }
}

.sin-campana-titulo {
    font-size: 28px;
    font-weight: 700;
    color: #333;
    margin-bottom: 20px;
}

.sin-campana-descripcion {
    font-size: 18px;
    color: #666;
    max-width: 600px;
    margin: 0 auto;
    line-height: 1.6;
}

@media (max-width: 576px) {
    .sin-campana-container {
        padding: 50px 20px;
        margin: 30px 0;
    }

    .sin-campana-icono {
        font-size: 60px;
    }

    .sin-campana-titulo {
        font-size: 22px;
    }

    .sin-campana-descripcion {
        font-size: 16px;
    }
}

.input-symbol-euro {
    position: relative;
}

    .input-symbol-euro input {
        padding-left: 18px;
    }

    .input-symbol-euro:before {
        position: absolute;
        bottom: 1px;
        content: "€";
        right: 5px;
        float: right;
        font-size: 14px;
        padding: 6px 12px;
        color: #555555;
    }

/* ============================================================
   MODAL WALLY MANAGER — Estilos específicos
   Nombres únicos para evitar conflictos con otros modales
   ============================================================ */

/* --- Contenedor principal --- */
.modal-wally-manager .modal-content {
    border: none !important;
    border-radius: 16px !important;
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.12) !important;
    overflow: hidden !important;
}

.modal-wally-manager .modal-body {
    padding: 24px !important;
}

.modal-wally-manager .modal-header {
    background: #fff !important;
    border-bottom: 1px solid #f0f0f0 !important;
    padding: 24px 24px !important;
    position: relative !important;
}

    .modal-wally-manager .modal-header .close {
        font-size: 28px !important;
        font-weight: 300 !important;
        color: #999 !important;
        opacity: 1 !important;
        text-shadow: none !important;
        position: absolute !important;
        right: 20px !important;
        top: 14px !important;
        transition: color 0.2s !important;
    }

        .modal-wally-manager .modal-header .close:hover {
            color: #333 !important;
        }

/* --- Pestañas de idioma (pills) --- */
.wally-lang-tabs {
    list-style: none;
    padding: 0;
    margin: 0 0 20px 0;
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

    .wally-lang-tabs li {
        margin: 0;
    }

        .wally-lang-tabs li a {
            display: inline-block;
            padding: 7px 18px;
            font-size: 13px;
            font-weight: 600;
            text-transform: uppercase;
            letter-spacing: 0.4px;
            border-radius: 20px;
            border: 1px solid #dee2e6;
            background: #f8f9fa;
            color: #555;
            cursor: pointer;
            text-decoration: none;
            transition: all 0.2s;
        }

            .wally-lang-tabs li a:hover {
                background: #e9ecef;
                color: #333;
            }

        .wally-lang-tabs li.active a {
            background: #4caf50;
            color: #fff;
            border-color: #4caf50;
        }

.wally-lang-info {
    font-size: 13px;
    color: #888;
    margin-left: auto;
    white-space: nowrap;
}

    .wally-lang-info strong {
        color: #333;
    }

/* --- Labels / títulos de campo --- */
.wally-field-label {
    font-size: 13px;
    font-weight: 600;
    color: #555;
    margin-bottom: 6px;
    display: block;
    text-transform: none;
}

/* --- Inputs elegantes --- */
.modal-wally-manager input[type="text"],
.modal-wally-manager input[type="number"],
.modal-wally-manager input[type="date"],
.modal-wally-manager select,
.modal-wally-manager textarea {
    width: 100% !important;
    border: 1px solid #dce1e8 !important;
    border-radius: 8px !important;
    padding: 10px 14px !important;
    font-size: 14px !important;
    color: #333 !important;
    background: #fff !important;
    transition: border-color 0.2s, box-shadow 0.2s !important;
    box-sizing: border-box !important;
    -webkit-appearance: none !important;
    appearance: none !important;
}

    .modal-wally-manager input[type="text"]:focus,
    .modal-wally-manager input[type="number"]:focus,
    .modal-wally-manager input[type="date"]:focus,
    .modal-wally-manager select:focus,
    .modal-wally-manager textarea:focus {
        outline: none !important;
        border-color: #4caf50 !important;
        box-shadow: 0 0 0 3px rgba(76, 175, 80, 0.15) !important;
    }

.modal-wally-manager input[readonly] {
    background: #fafbfc !important;
    cursor: pointer !important;
}

.modal-wally-manager .form-control {
    border-radius: 8px !important;
    height: 45px !important;
    padding: 10px 14px !important;
}

    .modal-wally-manager .form-control:focus {
        border-color: #4caf50 !important;
        box-shadow: 0 0 0 3px rgba(76, 175, 80, 0.15) !important;
    }

/* --- Grid de imágenes (uniform height) --- */
.wally-img-grid {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 16px !important;
    margin-top: 8px !important;
}

.wally-img-cell {
    flex: 0 0 calc(33.333% - 11px) !important;
    max-width: calc(33.333% - 11px) !important;
    text-align: center !important;
}

.wally-img-cell--half {
    flex: 0 0 calc(50% - 8px) !important;
    max-width: calc(50% - 8px) !important;
}

.wally-img-label {
    font-size: 13px !important;
    font-weight: 600 !important;
    color: #555 !important;
    margin-bottom: 8px !important;
    display: block !important;
}

.wally-img-box {
    background: #f7f8fa !important;
    border: 1px solid #e8ecf0 !important;
    border-radius: 12px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    height: 120px !important;
    overflow: hidden !important;
    cursor: pointer !important;
    transition: border-color 0.2s, box-shadow 0.2s !important;
}

    .wally-img-box:hover {
        border-color: #4caf50 !important;
        box-shadow: 0 2px 8px rgba(76, 175, 80, 0.10) !important;
    }

    .wally-img-box img {
        max-width: 100% !important;
        height: 120px !important;
        object-fit: contain !important;
        display: block !important;
    }

/* --- Assets dinámicos (cards) --- */
.wally-asset-card {
    border: 1px solid #e8ecf0;
    border-radius: 12px;
    background: #fafbfc;
    padding: 14px;
    margin-bottom: 12px;
    display: flex;
    align-items: center;
    gap: 14px;
    flex-wrap: wrap;
}

.wally-asset-thumb {
    width: 50px;
    height: 50px;
    border-radius: 8px;
    object-fit: contain;
    border: 1px solid #e0e0e0;
    background: #fff;
    flex-shrink: 0;
}

.wally-ui-modal-icon--warning {
    background: #fff4e6;
    color: #ff8a00;
}

.wally-asset-file {
    font-size: 12px;
    color: #888;
}

    .wally-asset-file input[type="file"] {
        font-size: 12px;
    }

.wally-asset-text {
    flex: 1;
    min-width: 150px;
}

.wally-asset-card .btn-danger {
    flex-shrink: 0;
}

/* Botón circular verde "+" para agregar asset */
.wally-btn-add {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: #4caf50;
    color: #fff;
    border: none;
    font-size: 20px;
    line-height: 1;
    cursor: pointer;
    transition: background 0.2s, transform 0.15s;
    box-shadow: 0 2px 6px rgba(76, 175, 80, 0.25);
    padding: 0;
}

    .wally-btn-add:hover {
        background: #43a047;
        -webkit-transform: scale(1.08);
        transform: scale(1.08);
    }

/* --- Checks de política --- */
.wally-check-label {
    display: flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
    font-weight: 500;
    font-size: 14px;
    color: #333;
    margin-bottom: 4px;
}

    .wally-check-label input[type="checkbox"] {
        width: 16px;
        height: 16px;
        accent-color: #4caf50;
        cursor: pointer;
        flex-shrink: 0;
    }

.wally-check-repeticion {
    padding-top: 6px;
}

.wally-help-text {
    font-size: 12px;
    color: #6c757d;
    margin-top: 4px;
    margin-bottom: 0;
    font-style: italic;
}

/* --- Editor Summernote --- */
.wally-politica-editor {
    margin-top: 10px;
    margin-bottom: 10px;
}

    .wally-politica-editor .note-editor {
        border-radius: 8px;
        border-color: #dce1e8;
    }

        .wally-politica-editor .note-editor.note-frame:focus-within {
            border-color: #4caf50;
            box-shadow: 0 0 0 3px rgba(76, 175, 80, 0.15);
        }

/* --- Botones del footer --- */
.modal-wally-manager .modal-footer {
    border-top: 1px solid #f0f0f0 !important;
    padding: 16px 24px !important;
    text-align: right !important;
    background: #fafbfc !important;
    border-radius: 0 0 16px 16px !important;
}

.wally-btn-save {
    display: inline-block !important;
    padding: 10px 28px !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    color: #fff !important;
    background: #4caf50 !important;
    border: none !important;
    border-radius: 8px !important;
    cursor: pointer !important;
    transition: background 0.2s, box-shadow 0.2s !important;
    text-decoration: none !important;
    margin-left: 8px !important;
}

    .wally-btn-save:hover {
        background: #43a047 !important;
        box-shadow: 0 2px 8px rgba(76, 175, 80, 0.25) !important;
        color: #fff !important;
        text-decoration: none !important;
    }

.wally-btn-delete {
    display: inline-block !important;
    padding: 10px 28px !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    color: #fff !important;
    background: #e53935 !important;
    border: none !important;
    border-radius: 8px !important;
    cursor: pointer !important;
    transition: background 0.2s, box-shadow 0.2s !important;
    text-decoration: none !important;
    margin-left: 8px !important;
}

    .wally-btn-delete:hover {
        background: #c62828 !important;
        box-shadow: 0 2px 8px rgba(229, 57, 53, 0.25) !important;
        color: #fff !important;
        text-decoration: none !important;
    }

/* --- Secciones / spacing interno --- */
.wally-section {
    margin-bottom: 20px;
}

.wally-section-title {
    font-size: 14px;
    font-weight: 600;
    color: #333;
    margin-bottom: 10px;
}

.wally-row {
    display: flex;
    gap: 16px;
    flex-wrap: wrap;
}

.wally-col-half {
    flex: 1;
    min-width: 200px;
}

.wally-col-third {
    flex: 0 0 25%;
    max-width: 25%;
}

.wally-col-two-thirds {
    flex: 0 0 75%;
    max-width: 75%;
}

/* --- Etiquetas (token input) --- */
.modal-wally-manager .token-input-list-fbk {
    border-radius: 8px;
    border: 1px solid #dce1e8;
    padding: 6px 10px;
    min-height: 42px;
}

    .modal-wally-manager .token-input-list-fbk:focus-within {
        border-color: #4caf50;
        box-shadow: 0 0 0 3px rgba(76, 175, 80, 0.15);
    }

.modal-wally-manager .token-input-token-fbk {
    border-radius: 12px;
    background: #e8f5e9;
    border: 1px solid #c8e6c9;
    color: #2e7d32;
}

/* --- Errores validación --- */
.wally-errores {
    display: none;
    font-size: 13px;
    padding: 12px 16px;
    margin: 0 0 12px 0;
    border-radius: 8px;
}

/* --- Responsive --- */
@media (max-width: 991px) {
    .wally-img-cell {
        flex: 0 0 calc(50% - 8px);
        max-width: calc(50% - 8px);
    }

    .modal-wally-manager .modal-footer .btn,
    .wally-btn-save,
    .wally-btn-delete {
        display: block;
        width: 100%;
        margin: 5px 0;
    }
}

@media (max-width: 767px) {
    .modal-wally-manager .modal-body {
        padding: 16px;
    }

    .wally-img-cell,
    .wally-img-cell--half {
        flex: 0 0 100%;
        max-width: 100%;
    }

    .wally-asset-card {
        flex-direction: column;
        align-items: flex-start;
    }

    .wally-lang-tabs {
        flex-direction: column;
        align-items: flex-start;
    }

    .wally-lang-info {
        margin-left: 0;
        margin-top: 8px;
    }

    .wally-col-third,
    .wally-col-two-thirds {
        flex: 0 0 100%;
        max-width: 100%;
    }
}


/* 
   WALLY UI — Página pública (wally.aspx)
   Todas las clases con prefijo .wally-ui-
 */

.wally-ui-page {
    max-width: 1170px;
    margin: 0 auto;
    padding: 30px 16px 60px;
    font-family: 'Montserrat', sans-serif;
}

/* Loader */
.wally-ui-loader {
    text-align: center;
    padding: 80px 0;
    color: #8e99a4;
}

/* Landing */
.wally-ui-landing {
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06);
    padding: 28px 24px;
    margin-bottom: 24px;
    line-height: 1.7;
    color: #333;
    word-break: break-word;
    overflow-wrap: anywhere;
}

.wally-ui-landing__content {
    margin-bottom: 6px;
}

    .wally-ui-landing__content img {
        max-width: 100%;
        height: auto;
        border-radius: 8px;
    }

.wally-ui-landing--empty {
    background: #f9fafb;
    border: 1px dashed #d1d5db;
}

.wally-ui-landing__placeholder {
    text-align: center;
    color: #9ca3af;
    font-size: 15px;
    padding: 32px 0;
}

    .wally-ui-landing__placeholder i {
        margin-right: 6px;
        font-size: 18px;
    }

/* Acciones */
.wally-ui-actions {
    text-align: center;
    padding: 12px 0;
}

.wally-ui-actions--inside {
    /*margin-top: 26px;
    padding-top: 18px;
    border-top: 1px solid #eef1f4;*/
}

.wally-ui-completado {
    margin-top: 10px;
    color: #1f8b4c;
    font-weight: 600;
    text-align: center;
}

    .wally-ui-completado i {
        margin-right: 6px;
    }

/* Botones */
.wally-ui-btn {
    display: inline-block;
    padding: 10px 26px;
    border-radius: 8px;
    border: none;
    font-size: 15px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s ease;
    text-decoration: none;
    line-height: 1.5;
    margin: 4px 6px;
}

    .wally-ui-btn i {
        margin-right: 6px;
    }

.wally-ui-btn-join {
    background: var(--color-principal, #009ad8);
    color: #fff !important;
    box-shadow: 0 2px 8px rgba(0, 154, 216, 0.28);
    padding: 16px 40px;
    border-radius: 20px;
    font-size: 18px;
}

    .wally-ui-btn-join:hover {
        background: var(--color-principal, #009ad8);
        filter: brightness(0.92);
        color: #fff !important;
        text-decoration: none;
    }

.wally-ui-btn-play {
    background: var(--color-principal, #009ad8);
    color: #fff !important;
    box-shadow: 0 2px 8px rgba(0, 154, 216, 0.28);
}

    .wally-ui-btn-play:hover {
        background: var(--color-principal, #009ad8);
        filter: brightness(0.92);
        color: #fff !important;
        text-decoration: none;
    }

.wally-ui-btn-leave {
    background: transparent;
    color: #dc2626;
    border: 1px solid #dc2626;
}

    .wally-ui-btn-leave:hover {
        background: #fef2f2;
    }

.wally-ui-btn-primary {
    background: var(--color-principal, #009ad8);
    color: #fff !important;
}

    .wally-ui-btn-primary:hover {
        background: var(--color-principal, #009ad8);
        filter: brightness(0.92);
        color: #fff !important;
    }

    .wally-ui-btn-primary i,
    .wally-ui-btn-join i,
    .wally-ui-btn-play i {
        color: #fff !important;
    }

    .wally-ui-btn-primary:disabled {
        opacity: 0.5;
        cursor: not-allowed;
    }

.wally-ui-btn-secondary {
    background: #e5e7eb;
    color: #374151;
    border: none;
}

    .wally-ui-btn-secondary:hover {
        background: #d1d5db;
    }

/* Modales */
.wally-ui-modal-container {
    border-radius: 20px;
    border: none;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.12);
    overflow: hidden;
}

.wally-ui-modal-header {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 20px 24px 12px;
    border-bottom: 1px solid #f0f0f0;
}

    .wally-ui-modal-header h3 {
        margin: 0;
        font-size: 18px;
        font-weight: 600;
        color: #111827;
    }

.wally-ui-modal-header--error .wally-ui-modal-icon {
    background: #fef2f2;
    color: #dc2626;
}

.wally-ui-modal-icon {
    width: 42px;
    height: 42px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    background: #fff;
    color: var(--color-principal);
    flex-shrink: 0;
    border-color: var(--color-principal);
    border: 1px solid var(--color-principal);
}

.wally-ui-modal-close {
    margin-left: auto;
    color: #9ca3af;
    font-size: 18px;
    cursor: pointer;
    text-decoration: none;
}

    .wally-ui-modal-close:hover {
        color: #374151;
    }

.wally-ui-modal-body {
    padding: 20px 24px;
    font-size: 14px;
    color: #555;
    line-height: 1.6;
}

.wally-ui-modal-body--scroll {
    max-height: 60vh;
    overflow-y: auto;
    overflow-x: hidden;
    word-break: break-word;
}

.wally-ui-modal-desc {
    margin: 0 0 14px;
}

.wally-ui-modal-footer {
    padding: 12px 24px 20px;
    text-align: right;
    border-top: 1px solid #f0f0f0;
}

    .wally-ui-modal-footer .wally-ui-btn {
        margin-left: 8px;
    }

/* Link política */
.wally-ui-link-politica {
    display: inline-block;
    font-weight: 600;
    text-decoration: underline;
    margin-bottom: 16px;
}

    .wally-ui-link-politica i {
        margin-right: 4px;
    }

/* Checkbox */
.wally-ui-checkbox-group {
    margin-top: 8px;
}

.wally-ui-checkbox-label {
    display: flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
    font-weight: 400;
}

    .wally-ui-checkbox-label input[type="checkbox"] {
        width: 18px;
        height: 18px;
        accent-color: var(--color-principal);
    }

.wally-ui-modal-container.wally-ui-modal-container {
    border-radius: 15px;
}

.wally-ui-btn-leave:hover {
    color: #363636 !important;
}
/* Responsive */
@media (max-width: 640px) {
    .wally-ui-page {
        padding: 16px 10px 40px;
    }

    .wally-ui-landing {
        padding: 18px 14px;
        border-radius: 8px;
    }

    .wally-ui-btn {
        display: block;
        width: 100%;
        text-align: center;
        margin: 6px 0;
    }

    .wally-ui-modal-header {
        padding: 16px 16px 10px;
    }

    .wally-ui-modal-body {
        padding: 16px;
    }
}
