

body {
    font-size: unset;
}

#df-custom-cursor::after {
    border: 4px solid #a3ff12;
    opacity: 1;
}

.pagina {
    display: none;
    user-select: none;
}

.visor-panorama {
    width: 100vw;
    height: calc(100vh - 72px);
    user-select: none;
}


.login-form {
    max-width: none;
}

.bg--texture-game {
    background-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url("/gamedata/demo/media/start.jpg");
}

.df-custom-cursor-wrap {
    z-index: 19;
}

/* inventario */


.inventario-menu {
    position: absolute;
    /*top: 200px;*/
    z-index: 1000;
}

.modal-backdrop {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 100;
    width: 100vw;
    height: 100vh;
    background-color: #000;
}

.modal.modal-inventario {
    position: fixed;
    z-index: 1500;
    width: auto;
    left: 100px;
}



.modal-inventario .modal-dialog {
    color: #fff;
    border-radius: 0px 0px;
}

.modal-inventario .modal-header {
    border-bottom: 0px;
    background-color: #151720;
}

.modal-inventario .modal-body {
    background-color: #151720;
}

    .modal-inventario .modal-body > table > tr {
        border: 1px solid #fff;
    }

.color-icono-inventario {
    color: #a3ff12;
}





.match-stats-links--main {
    left: 30px;
    position: fixed;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
}

@media (max-width: 992px) {
    .match-stats-links--main li {
        display: inline;
    }

        .match-stats-links--main li + li {
            margin-top: 38px;
        }

            .match-stats-links--main li + li:before {
                border: none;
            }
}


.inventario-en-uso {
    position: absolute;
    z-index: 1000;
    left: 20px;
    top: 50px;
    display: none;
}

    .inventario-en-uso .card {
        background-color: #a3ff12;
    }

        .inventario-en-uso .card .card-body {
            padding: 1px;
        }

    .inventario-en-uso img {
        max-width: 100px;
        max-height: 100px;
    }


/* modal para preguntas  */

.modal.modal-preguntas {
    border-radius: 0px;
    overflow: hidden;
    background-color: transparent;
}

    .modal.modal-preguntas a {
        color: #fff;
    }

    .modal.modal-preguntas .logo a img {
        width: 30px;
    }

    .modal.modal-preguntas .modal-content {
        background-color: transparent;
        border: none;
        border-radius: 7px;
    }

        .modal.modal-preguntas .modal-content .modal-body {
            border-radius: 7px;
            overflow: hidden;
            color: #fff;
            padding-left: 0px;
            padding-right: 0px;
            -webkit-box-shadow: 0 10px 50px -10px rgba(0, 0, 0, 0.9);
            box-shadow: 0 10px 50px -10px rgba(0, 0, 0, 0.9);
        }

            .modal.modal-preguntas .modal-content .modal-body.overlay {
                position: relative;
            }

                .modal.modal-preguntas .modal-content .modal-body.overlay:before {
                    content: "";
                    position: absolute;
                    top: 0;
                    bottom: 0;
                    left: 0;
                    right: 0;
                    width: 100%;
                    background-color: rgba(0, 0, 0, 0.5);
                }

                .modal.modal-preguntas .modal-content .modal-body.overlay .to-front {
                    z-index: 2;
                    position: relative;
                }

            .modal.modal-preguntas .modal-content .modal-body h2 {
                font-size: 22px;
                color: #fff;
            }

            .modal.modal-preguntas .modal-content .modal-body p {
                color: #fff;
            }

            .modal.modal-preguntas .modal-content .modal-body h3 {
                color: #fff;
                font-size: 22px;
            }

            .modal.modal-preguntas .modal-content .modal-body .close-btn {
                color: #fff;
            }

            .modal.modal-preguntas .modal-content .modal-body .line {
                border-bottom: 1px solid rgba(255, 255, 255, 0.3);
                padding-bottom: 10px;
            }

    .modal.modal-preguntas .cancel a {
        color: rgba(255, 255, 255, 0.5);
        font-size: 13px;
        font-weight: bold;
    }

        .modal.modal-preguntas .cancel a:hover {
            color: #fff;
        }


.modal-preguntas .modal-body.bg-image {
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}


/*  QUESTIONS RADIO BUTTONS */
.question-item {
    background-color: #fff;
    display: block;
    margin: 10px 0;
    position: relative;
}

    .question-item label {
        padding: 10px 62px 10px 20px;
        width: 100%;
        display: block;
        text-align: left;
        color: #3c454c;
        cursor: pointer;
        position: relative;
        z-index: 2;
        transition: color 200ms ease-in;
        overflow: hidden;
    }

        .question-item label:before {
            width: 10px;
            height: 10px;
            border-radius: 50%;
            content: "";
            background-color: #5562eb;
            position: absolute;
            left: 50%;
            top: 50%;
            transform: translate(-50%, -50%) scale3d(1, 1, 1);
            transition: all 300ms cubic-bezier(0.4, 0, 0.2, 1);
            opacity: 0;
            z-index: -1;
        }

        .question-item label:after {
            width: 32px;
            height: 32px;
            content: "";
            border: 2px solid #d1d7dc;
            background-color: #fff;
            background-image: url("data:image/svg+xml,%3Csvg width='32' height='32' viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5.414 11L4 12.414l5.414 5.414L20.828 6.414 19.414 5l-10 10z' fill='%23fff' fill-rule='nonzero'/%3E%3C/svg%3E ");
            background-repeat: no-repeat;
            background-position: 2px 3px;
            border-radius: 50%;
            z-index: 2;
            position: absolute;
            right: 30px;
            top: 50%;
            transform: translateY(-50%);
            cursor: pointer;
            transition: all 200ms ease-in;
        }

    .question-item input:checked ~ label {
        color: #fff;
    }

        .question-item input:checked ~ label:before {
            transform: translate(-50%, -50%) scale3d(56, 56, 1);
            opacity: 1;
        }

        .question-item input:checked ~ label:after {
            background-color: #54e0c7;
            border-color: #54e0c7;
        }

    .question-item input {
        width: 32px;
        height: 32px;
        order: 1;
        z-index: 2;
        position: absolute;
        right: 30px;
        top: 50%;
        transform: translateY(-50%);
        cursor: pointer;
        visibility: hidden;
    }

textarea.question-item {
    padding: 3px;
    font-size: large;
    width: 100%;
}

input.question-item {
    padding: 3px;
    font-size: large;
    width: 100%;
    font-weight: bold;
}

    input.question-item:focus {
        background-color: #a3ff12;
    }

.slider.slider-horizontal {
    margin-left: 20px;
    width: 70%;
}


/* chat */

.chat-textarea, .chat-textarea:focus {
    padding: 3px;
    font-size: large;
    width: 100%;
    background-color: white;
}


.chat-panel {
    position: fixed;
    overflow-y: scroll;
    z-index: 1101;
    left: 100%;
    height: calc(100% - 72px);
    width: 100%;
    padding: 30px 15px;
    text-align: left;
    -webkit-transition: -webkit-transform ease 440ms 0ms;
    transition: -webkit-transform ease 440ms 0ms;
    transition: transform ease 440ms 0ms;
    transition: transform ease 440ms 0ms, -webkit-transform ease 440ms 0ms;
    -webkit-transition-delay: 0;
    transition-delay: 0;
    color: #fff;
    background-color: #222430;
}

@media (min-width: 768px) {
    .chat-panel {
        width: 80%;
        padding: 48px 40px 50px;
    }
}

@media (min-width: 992px) {
    .chat-panel {
        width: 700px;
    }
}

@media (min-width: 1920px) {
    .chat-panel {
        height: calc(100% - 100px);
        width: 960px;
        padding: 58px 60px 60px;
    }
}

.site-header--top ~ .chat-panel {
    bottom: 0;
}

.site-header--bottom ~ .chat-panel {
    top: 0;
}

@media (max-width: 991.98px) {
    html.touch .site-header--bottom ~ .chat-panel {
        top: 72px;
        bottom: 0;
    }
}

.cart-panel {
    background-color: #ffc107;
}
.cart-panel.toggled {
    -webkit-transform: translateX(-100%) !important;
    transform: translateX(-100%);
    -webkit-transition-delay: 100ms !important;
    transition-delay: 100ms;
}

.chat-panel.toggled {
    -webkit-transform: translateX(-100%) !important;
    transform: translateX(-100%) !important;
    -webkit-transition-delay: 100ms !important;
    transition-delay: 100ms !important;
}

.chat-panel__title {
    margin-bottom: 31px;
}

@media (min-width: 1920px) {
    .chat-panel__title {
        margin-bottom: 47px;
        font-size: 2.125rem;
    }
}

.chat-panel__items-count {
    color: #a3ff12;
}

.chat-panel__content .table {
    margin-bottom: 22px;
}

@media (min-width: 1920px) {
    .chat-panel__content .table {
        margin-bottom: 33px;
    }
}

.chat-panel__content .table thead th {
    padding: 0 0 12px;
    font-size: 0.625rem;
    letter-spacing: -0.03em;
    text-transform: uppercase;
    border: none;
}

@media (min-width: 1920px) {
    .chat-panel__content .table thead th {
        padding-bottom: 18px;
        font-size: 0.875rem;
    }
}

.chat-panel__content .table thead,
.chat-panel__content .table tbody td {
    border-top: none;
    border-bottom: 1px solid rgba(94, 98, 126, 0.2);
}

.chat-panel .product__info {
    min-width: 258px;
    padding: 18px 15px 18px 0;
}

@media (min-width: 576px) {
    .chat-panel .product__info {
        min-width: 260px;
    }
}

@media (min-width: 1920px) {
    .chat-panel .product__info {
        padding-top: 26px;
        padding-bottom: 26px;
    }
}

.chat-panel .product__info-content {
    overflow: hidden;
    padding-left: 15px;
}

@media (min-width: 1920px) {
    .chat-panel .product__info-content {
        padding-left: 22px;
    }
}

.chat-panel .product__total, .chat-panel .product__quantity {
    display: none;
}

@media (min-width: 576px) {
    .chat-panel .product__total, .chat-panel .product__quantity {
        display: table-cell;
    }
}

.chat-panel .product__thumb {
    float: left;
    width: 44px;
    margin-bottom: 0;
}

    .chat-panel .product__thumb img {
        width: 100%;
    }

@media (min-width: 1920px) {
    .chat-panel .product__thumb {
        width: 60px;
    }
}

.chat-panel .product__name {
    margin-top: 2px;
    margin-bottom: 1px;
    font-size: 0.875rem;
    line-height: 1;
    letter-spacing: -0.03em;
    text-transform: uppercase;
}

@media (min-width: 1920px) {
    .chat-panel .product__name {
        font-size: 1.25rem;
    }
}

.chat-panel .product__name a {
    color: #fff;
    -webkit-transition: color 300ms ease;
    transition: color 300ms ease;
}

    .chat-panel .product__name a:hover {
        color: #a3ff12;
    }

.chat-panel .product__cat, .chat-panel .product__info-details {
    display: block;
    font-size: 0.625rem;
    font-weight: 700;
    line-height: 1;
    letter-spacing: -0.03em;
    text-transform: uppercase;
}

@media (min-width: 1920px) {
    .chat-panel .product__cat, .chat-panel .product__info-details {
        font-size: 0.875rem;
    }
}

.chat-panel .product__cat {
    color: #c6cbea;
}

@media (min-width: 1920px) {
    .chat-panel .product__cat {
        margin-top: 2px;
    }
}

.chat-panel .product__info-details {
    margin-top: 1px;
    color: #5e627e;
}

@media (min-width: 1920px) {
    .chat-panel .product__info-details {
        margin-top: 3px;
    }
}

.chat-panel .product__total:not(th), .chat-panel .product__quantity input {
    font-size: 0.875rem;
    font-weight: 700;
    line-height: 1;
    letter-spacing: -0.03em;
}

@media (min-width: 1920px) {
    .chat-panel .product__total:not(th), .chat-panel .product__quantity input {
        font-size: 1.125rem;
    }
}

.chat-panel .product__quantity {
    min-width: 56px;
    width: 56px;
    padding: 23px 0 0;
}

@media (min-width: 1920px) {
    .chat-panel .product__quantity {
        width: 68px;
    }
}

.chat-panel .product__quantity input,
.chat-panel .product__quantity button {
    border: none;
    background-color: transparent;
    vertical-align: bottom;
}

    .chat-panel .product__quantity input:focus,
    .chat-panel .product__quantity button:focus {
        outline: none;
    }

.chat-panel .product__quantity button {
    position: relative;
    display: inline-block;
    padding: 0;
    width: 6px;
    height: 20px;
    color: #a3ff12;
}

body:not(.cursor-is--active) .chat-panel .product__quantity button {
    cursor: pointer;
}

.chat-panel .product__quantity button:after, .chat-panel .product__quantity button:before {
    position: absolute;
    content: "";
    background-color: #a3ff12;
    -webkit-transition: opacity 300ms ease;
    transition: opacity 300ms ease;
}

.chat-panel .product__quantity .quantity-control__minus:before {
    top: 8px;
    left: 0;
    width: 6px;
    height: 2px;
}

.chat-panel .product__quantity .quantity-control__plus:before {
    top: 8px;
    left: 0;
    width: 6px;
    height: 2px;
}

.chat-panel .product__quantity .quantity-control__plus:after {
    top: 6px;
    left: 2px;
    width: 2px;
    height: 6px;
}

.chat-panel .product__quantity input {
    display: inline-block;
    width: 36px;
    height: 20px;
    padding: 0;
    text-align: center;
    color: #fff;
}

    .chat-panel .product__quantity input[type=number]::-webkit-inner-spin-button {
        -webkit-appearance: none;
    }

    .chat-panel .product__quantity input[type=number] {
        -moz-appearance: textfield;
    }

.chat-panel .product__total:not(th) {
    color: #a3ff12;
}

.chat-panel .product__total {
    min-width: 96px;
    width: 146px;
    padding: 30px 0 0;
    text-align: center;
}

@media (min-width: 1920px) {
    .chat-panel .product__total {
        padding-top: 39px;
    }
}

.chat-panel .product__total-currency {
    color: #fff;
}

.chat-panel .product__remove {
    width: 55px;
    padding: 0 0 0 7px;
    vertical-align: middle;
}

@media (min-width: 576px) {
    .chat-panel .product__remove {
        vertical-align: top;
        padding-top: 24px;
    }
}

@media (min-width: 1920px) {
    .chat-panel .product__remove {
        padding-top: 31px;
    }
}

.chat-panel .product__remove-icon {
    position: relative;
    display: block;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    border: 2px solid #5e627e;
    -webkit-transition: border-color 300ms ease;
    transition: border-color 300ms ease;
}

@media (min-width: 1920px) {
    .chat-panel .product__remove-icon {
        width: 30px;
        height: 30px;
    }
}

.chat-panel .product__remove-icon:after, .chat-panel .product__remove-icon:before {
    position: absolute;
    top: 9px;
    left: 6px;
    width: 8px;
    height: 2px;
    content: "";
    background-color: #5e627e;
    -webkit-transition: background-color 300ms ease;
    transition: background-color 300ms ease;
}

@media (min-width: 1920px) {
    .chat-panel .product__remove-icon:after, .chat-panel .product__remove-icon:before {
        top: 12px;
        left: 8px;
        width: 10px;
    }
}

.chat-panel .product__remove-icon:after {
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}

.chat-panel .product__remove-icon:before {
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
}

.chat-panel .product__remove-icon:hover {
    border-color: #fff;
}

    .chat-panel .product__remove-icon:hover:after, .chat-panel .product__remove-icon:hover:before {
        background-color: #fff;
    }

.chat-panel__totals {
    text-align: right;
}

    .chat-panel__totals .table {
        margin-bottom: 32px;
    }

@media (min-width: 1920px) {
    .chat-panel__totals .table {
        margin-bottom: 50px;
    }
}

.chat-panel__totals th, .chat-panel__totals td {
    padding: 0;
    border: none;
}

.chat-panel__subtotal, .chat-panel__shipping, .chat-panel__order-total {
    font-weight: 700;
    text-transform: uppercase;
}

.chat-panel__subtotal, .chat-panel__shipping {
    font-size: 0.625rem;
    color: #5e627e;
}

@media (min-width: 1920px) {
    .chat-panel__subtotal, .chat-panel__shipping {
        font-size: 0.875rem;
    }
}

.chat-panel__shipping th, .chat-panel__shipping td {
    padding-top: 8px;
}

@media (min-width: 1920px) {
    .chat-panel__shipping th, .chat-panel__shipping td {
        padding-top: 11px;
    }
}

.chat-panel__order-total {
    font-size: 0.875rem;
}

@media (min-width: 1920px) {
    .chat-panel__order-total {
        font-size: 1.125rem;
    }
}

.chat-panel__order-total th, .chat-panel__order-total td {
    padding-top: 5px;
}

@media (min-width: 1920px) {
    .chat-panel__order-total th, .chat-panel__order-total td {
        padding-top: 10px;
    }
}

.chat-panel__order-total .amount {
    color: #a3ff12;
}

    .chat-panel__order-total .amount span {
        color: #fff;
    }



.header-chat-toggle {
    -webkit-transition: display 200ms ease 300ms, opacity 300ms ease, -webkit-transform 300ms ease;
    transition: display 200ms ease 300ms, opacity 300ms ease, -webkit-transform 300ms ease;
    transition: display 200ms ease 300ms, opacity 300ms ease, transform 300ms ease;
    transition: display 200ms ease 300ms, opacity 300ms ease, transform 300ms ease, -webkit-transform 300ms ease;
}


.header-chat.hide {
    visibility: hidden;
    opacity: 0;
    -webkit-transform: translateY(-20%);
    transform: translateY(-20%);
}

.header-chat-toggle .df-icon {
    fill: #fff;
    -webkit-transition: all 300ms ease;
    transition: all 300ms ease;
}

.header-chat-toggle:hover .df-icon {
    fill: #a3ff12;
}

.header-chat-toggle .df-icon {
    width: 24px;
    height: 24px;
}

@media (min-width: 1920px) {    
    .header-chat-toggle .df-icon {
        width: 30px;
        height: 30px;
    }
}


.header-chat-toggle {
    margin-left: 34px;
}


body:not(.cursor-is--active) .header-chat-toggle {
    cursor: pointer;
}

@media (min-width: 1920px) {
    
    .header-chat-toggle {
        margin-left: 55px;
    }
}


.header-chat-toggle {
    padding-top: 24px;
    padding-bottom: 24px;
}

@media (min-width: 1920px) {
    
    .header-chat-toggle {
        padding-top: 34px;
        padding-bottom: 36px;
    }
}


.header-chat-toggle {
    position: relative;
}

    
    .header-chat-toggle .df-icon--close,
    .header-chat-toggle .df-icon--search-close {
        position: absolute;
        top: 25px;
        left: 0;
        opacity: 0;
        -webkit-transform: scale(0.3);
        transform: scale(0.3);
        -webkit-transform-origin: center;
        transform-origin: center;
    }

@media (min-width: 1920px) {    
    .header-chat-toggle .df-icon--close,
    .header-chat-toggle .df-icon--search-close {
        top: 35px;
        left: 0;
    }
}

.header-chat-toggle.toggled .df-icon--bag {
    opacity: 0;
    -webkit-transform: scale(0.3);
    transform: scale(0.3);
}



.header-chat-toggle.toggled .df-icon--close,
.header-chat-toggle.toggled .df-icon--search-close {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1);
}


.menu-panel__content {    
    padding: 18px 12px;
}


.cart-panel .product__info {    
    padding: 10px 15px 10px 0;
}



    /*  cuenta atrás */

    .cuenta-atras {
    display: none;
    position: absolute;
    z-index: 3;
    right: 5px;
    top: 5px;
    /*margin: auto;*/
    width: 90px;
    height: 90px;
    /*margin-top: 100px;
    position: absolute;*/
    border-radius: 50px;
    background-color: #fff;
    box-shadow: 0 0 15px rgba(0,0,0,.15);
}

    .cuenta-atras.clock:before,
    .cuenta-atras.count:after {
        content: '';
        position: absolute;
    }


    .cuenta-atras.clock {
        width: 90px;
        height: 90px;
        border-radius: 50%;
        position: absolute;
        background-color: #feeff4;
    }

        .cuenta-atras.clock:before {
            top: 50%;
            left: 50%;
            width: 60px;
            height: 60px;
            margin-top: -30px;
            margin-left: -30px;
            border-radius: inherit;
            background-color: #ec366b;
            box-shadow: 0 0 15px rgba(0,0,0,.15), 0 0 3px rgba(255,255,255,.75) inset;
            /*border:1px solid rgba(255,255,255,.1);*/
        }

    .cuenta-atras > .count {
        width: 100%;
        color: #fff;
        height: 100%;
        padding-top: 30px;
        font-size: 24px;
        font-weight: 500;
        line-height: 60px;
        position: relative;
        text-align: center;
    }

        .cuenta-atras > .count:after {
            width: 100%;
            display: block;
            font-size: 18px;
            font-weight: 300;
            line-height: 1px;
            text-align: center;
            position: relative;
        }

        .cuenta-atras > .count.sec:after {
            content: 'seg'
        }

        .cuenta-atras > .count.min:after {
            content: 'min'
        }


@media (max-width: 991.98px) {
    .cuenta-atras {
        top: 75px;
    }
}



/* FANCYBOX */

.fancybox__content {
    padding: 1px;
}

.has-iframe .fancybox__content {
    height: 83% !important;
}

.fancybox__container.fb-highz {
    z-index: 2000 !important;
}


/* PATCH ClinicalEscape: capas del juego sobre el visor 360 */
body.layout-game #wrapper,
body.layout-game #view,
body.layout-game #page,
body.layout-game .page-wrapper,
body.layout-game #viewer,
body.layout-game .visor-panorama,
body.layout-game .psv-container {
    position: relative;
    z-index: 1 !important;
}

body.layout-game #botoneraJuego.site-header,
#botoneraJuego.clinicalescape-botonera-visible.site-header {
    position: fixed !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    top: auto !important;
    z-index: 5000 !important;
    pointer-events: auto !important;
}

body.layout-game #panel-chat,
body.layout-game #panel-objetivos,
body.layout-game #menu-grande,
body.layout-game #enviar-mensaje-sin-gamemaster {
    position: relative;
    z-index: 4900 !important;
}

body.layout-game .cart-panel,
body.layout-game .chat-panel {
    position: fixed !important;
    top: 0 !important;
    bottom: 72px !important;
    height: auto !important;
    z-index: 4900 !important;
}

body.layout-game .menu-panel,
body.layout-game .search-panel {
    z-index: 4900 !important;
}

body.layout-game .site-overlay {
    z-index: 4800 !important;
}

body.layout-game .fancybox__container,
body.layout-game .modal,
body.layout-game .modal-backdrop {
    z-index: 6000 !important;
}

@media (min-width: 1920px) {
    body.layout-game .cart-panel,
    body.layout-game .chat-panel {
        bottom: 100px !important;
    }
}


/* PATCH ClinicalEscape v9: capas reales de header, paneles, modales y alertas */
#botoneraJuego.clinicalescape-botonera-visible.site-header {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    height: 72px !important;
    min-height: 72px !important;
    max-height: 72px !important;
    width: 100vw !important;
    visibility: visible !important;
    opacity: 1 !important;
    transform: none !important;
    background: #151720 !important;
    z-index: 30000 !important;
    pointer-events: auto !important;
}

#botoneraJuego.clinicalescape-botonera-visible .header-logo,
#botoneraJuego.clinicalescape-botonera-visible .header-logo--img,
#botoneraJuego.clinicalescape-botonera-visible #pNavMenu,
#botoneraJuego.clinicalescape-botonera-visible .header-actions {
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
}

#botoneraJuego.clinicalescape-botonera-visible .header-actions {
    position: relative !important;
    align-items: center !important;
    justify-content: flex-end !important;
    width: 100% !important;
    height: 72px !important;
    padding-right: 24px !important;
    z-index: 30010 !important;
}

#botoneraJuego.clinicalescape-botonera-visible #bAbrirObjetivos,
#botoneraJuego.clinicalescape-botonera-visible #bAbrirChat,
#botoneraJuego.clinicalescape-botonera-visible .header-menu-toggle,
#botoneraJuego.clinicalescape-botonera-visible .header-search-toggle {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    visibility: visible !important;
    opacity: 1 !important;
    position: relative !important;
    min-width: 36px !important;
    min-height: 72px !important;
    z-index: 30020 !important;
    pointer-events: auto !important;
}

#botoneraJuego.clinicalescape-botonera-visible .header-menu-toggle__inner span {
    display: block !important;
    background: #fff !important;
}

#botoneraJuego.clinicalescape-botonera-visible .df-icon {
    fill: #fff !important;
    pointer-events: none !important;
}

#botoneraJuego.clinicalescape-botonera-visible #bAbrirObjetivos:hover .df-icon,
#botoneraJuego.clinicalescape-botonera-visible #bAbrirChat:hover .df-icon,
#botoneraJuego.clinicalescape-botonera-visible .header-menu-toggle:hover .header-menu-toggle__inner span,
#botoneraJuego.clinicalescape-botonera-visible .header-search-toggle:hover .df-icon {
    fill: #a3ff12 !important;
    background: #a3ff12 !important;
}

/* Los paneles están dentro de secciones (#menu-grande, #panel-chat...), no como hermanos directos del header. */
#panel-objetivos,
#panel-chat,
#menu-grande,
#enviar-mensaje-sin-gamemaster {
    position: relative !important;
    z-index: 25000 !important;
    pointer-events: none;
}

#panel-objetivos .cart-panel,
#panel-chat .chat-panel,
#menu-grande .menu-panel,
#enviar-mensaje-sin-gamemaster .search-panel {
    position: fixed !important;
    top: 0 !important;
    bottom: 72px !important;
    height: calc(100vh - 72px) !important;
    z-index: 25010 !important;
    pointer-events: auto !important;
}

#menu-grande .menu-panel,
#enviar-mensaje-sin-gamemaster .search-panel {
    left: 0 !important;
    right: 0 !important;
    width: 100vw !important;
}

.site-wrapper--has-menu-overlay #menu-grande .menu-panel,
#menu-grande .menu-panel.clinicalescape-panel-open,
.site-wrapper--has-search-overlay #enviar-mensaje-sin-gamemaster .search-panel,
#enviar-mensaje-sin-gamemaster .search-panel.clinicalescape-panel-open {
    visibility: visible !important;
    opacity: 1 !important;
}

.site-wrapper--has-menu-overlay #menu-grande .menu-panel__content,
#menu-grande .menu-panel.clinicalescape-panel-open .menu-panel__content,
.site-wrapper--has-search-overlay #enviar-mensaje-sin-gamemaster .search-panel__content,
#enviar-mensaje-sin-gamemaster .search-panel.clinicalescape-panel-open .search-panel__content {
    visibility: visible !important;
    opacity: 1 !important;
    transform: translateY(0) !important;
}

#panel-objetivos .cart-panel.toggled,
#panel-chat .chat-panel.toggled,
#panel-objetivos .cart-panel.clinicalescape-panel-open,
#panel-chat .chat-panel.clinicalescape-panel-open {
    transform: translateX(-100%) !important;
}

.site-overlay {
    z-index: 24000 !important;
}

.site-wrapper--has-overlay .site-overlay,
.site-wrapper--has-menu-overlay .site-overlay,
.site-wrapper--has-search-overlay .site-overlay {
    visibility: visible !important;
    opacity: 1 !important;
}

/* Bootstrap: el backdrop debe quedar por debajo del modal, nunca al mismo nivel. */
.modal-backdrop,
body.layout-game .modal-backdrop {
    z-index: 40000 !important;
}

.modal,
body.layout-game .modal {
    z-index: 40010 !important;
}

#inventarioContenedor.modal,
body.layout-game #inventarioContenedor.modal {
    z-index: 40020 !important;
}

#popQuestion.modal,
body.layout-game #popQuestion.modal {
    z-index: 40030 !important;
}

.fancybox__container,
body.layout-game .fancybox__container {
    z-index: 45000 !important;
}

.swal2-container,
body.layout-game .swal2-container {
    z-index: 50000 !important;
}

/* PATCH ClinicalEscape v10: paneles independientes, modales fuera de stacking-context y visor al salir */
#panel-objetivos,
#panel-chat,
#menu-grande,
#enviar-mensaje-sin-gamemaster {
    position: static !important;
    pointer-events: none !important;
}

#panel-objetivos > .cart-panel,
#panel-chat > .chat-panel {
    position: fixed !important;
    top: 0 !important;
    bottom: 72px !important;
    left: 100% !important;
    right: auto !important;
    width: min(700px, 86vw) !important;
    height: calc(100vh - 72px) !important;
    overflow-y: auto !important;
    visibility: hidden !important;
    opacity: 0 !important;
    transform: translateX(0) !important;
    transition: transform 320ms ease, opacity 180ms ease, visibility 180ms ease !important;
    z-index: 35020 !important;
    pointer-events: none !important;
    color: #fff !important;
    background: #080a10 !important;
}

#panel-objetivos > .cart-panel.toggled,
#panel-objetivos > .cart-panel.clinicalescape-panel-open,
#panel-chat > .chat-panel.toggled,
#panel-chat > .chat-panel.clinicalescape-panel-open {
    visibility: visible !important;
    opacity: 1 !important;
    transform: translateX(-100%) !important;
    pointer-events: auto !important;
}

#panel-objetivos > .cart-panel:not(.toggled):not(.clinicalescape-panel-open),
#panel-chat > .chat-panel:not(.toggled):not(.clinicalescape-panel-open) {
    transform: translateX(0) !important;
}

#menu-grande .menu-panel,
#enviar-mensaje-sin-gamemaster .search-panel {
    z-index: 35020 !important;
}

.site-overlay {
    z-index: 35000 !important;
}

#botoneraJuego.clinicalescape-botonera-visible.site-header {
    z-index: 36000 !important;
}

body > .modal-backdrop,
body.layout-game > .modal-backdrop {
    z-index: 60000 !important;
}

body > .modal,
body.layout-game > .modal {
    position: fixed !important;
    z-index: 60020 !important;
}

body > #inventarioContenedor.modal,
body.layout-game > #inventarioContenedor.modal {
    z-index: 60030 !important;
}

body > #popQuestion.modal,
body.layout-game > #popQuestion.modal {
    z-index: 60040 !important;
}

body > .fancybox__container,
body.layout-game > .fancybox__container {
    z-index: 70000 !important;
}

body > .swal2-container,
body.layout-game > .swal2-container {
    z-index: 80000 !important;
}

body:not(.layout-game) #viewer,
body:not(.layout-game) .visor-panorama,
body:not(.layout-game) .psv-container,
body:not(.layout-game) #cuentaAtras,
body:not(.layout-game) .cuenta-atras {
    display: none !important;
}

/* PATCH ClinicalEscape v11: inventario sin backdrop y restauración visual de paneles */
body.layout-game #inventarioMenu.inventario-menu,
#inventarioMenu.inventario-menu {
    position: fixed !important;
    z-index: 62000 !important;
    pointer-events: none !important;
}

body.layout-game #inventarioMenu .match-stats-links,
body.layout-game #inventarioMenu .match-stats-links--main,
#inventarioMenu .match-stats-links,
#inventarioMenu .match-stats-links--main {
    z-index: 62030 !important;
    pointer-events: auto !important;
}

body.layout-game #inventarioMenu .js-show-inventory-items,
#inventarioMenu .js-show-inventory-items {
    pointer-events: auto !important;
}

body.layout-game #inventarioContenedor.modal.modal-inventario,
#inventarioContenedor.modal.modal-inventario {
    z-index: 62010 !important;
    pointer-events: none !important;
    background: transparent !important;
}

body.layout-game #inventarioContenedor.modal.modal-inventario .modal-dialog,
body.layout-game #inventarioContenedor.modal.modal-inventario .modal-content,
#inventarioContenedor.modal.modal-inventario .modal-dialog,
#inventarioContenedor.modal.modal-inventario .modal-content {
    pointer-events: auto !important;
}

/* Si quedase un backdrop residual de Bootstrap al abrir inventario, no debe bloquear la botonera. */
body.layout-game:has(#inventarioContenedor.show) > .modal-backdrop,
body:has(#inventarioContenedor.show) > .modal-backdrop {
    display: none !important;
    pointer-events: none !important;
}

/* Se quita el negro forzado del parche anterior y se recuperan colores del juego. */
body.layout-game #panel-objetivos > .cart-panel,
#panel-objetivos > .cart-panel {
    background-color: #ffc107 !important;
    color: #222430 !important;
}

body.layout-game #panel-objetivos > .cart-panel .cart-panel__title,
body.layout-game #panel-objetivos > .cart-panel .text-white,
#panel-objetivos > .cart-panel .cart-panel__title,
#panel-objetivos > .cart-panel .text-white {
    color: #222430 !important;
}

body.layout-game #panel-objetivos > .cart-panel table,
body.layout-game #panel-objetivos > .cart-panel td,
body.layout-game #panel-objetivos > .cart-panel th,
#panel-objetivos > .cart-panel table,
#panel-objetivos > .cart-panel td,
#panel-objetivos > .cart-panel th {
    color: #222430 !important;
}

body.layout-game #panel-chat > .chat-panel,
#panel-chat > .chat-panel {
    background-color: #222430 !important;
    color: #fff !important;
}

body.layout-game #panel-chat > .chat-panel .chat-panel__title,
body.layout-game #panel-chat > .chat-panel .text-white,
#panel-chat > .chat-panel .chat-panel__title,
#panel-chat > .chat-panel .text-white {
    color: #fff !important;
}

/* PATCH ClinicalEscape v14: navegación Start, botonera, preguntas y chat */
body.ce-page-start #bAbrirObjetivos,
body.ce-page-start #bAbrirChat,
body.ce-page-start .header-search-toggle,
body.ce-page-login #bAbrirObjetivos,
body.ce-page-login #bAbrirChat,
body.ce-page-login .header-search-toggle,
body.ce-page-not-found #bAbrirObjetivos,
body.ce-page-not-found #bAbrirChat,
body.ce-page-not-found .header-search-toggle,
body.ce-page-notFound #bAbrirObjetivos,
body.ce-page-notFound #bAbrirChat,
body.ce-page-notFound .header-search-toggle {
    display: none !important;
    visibility: hidden !important;
    pointer-events: none !important;
}

#botoneraJuego .header-logo,
#botoneraJuego .header-logo--img {
    position: relative !important;
    z-index: 37050 !important;
    pointer-events: auto !important;
}

#botoneraJuego #bLogoHeader {
    display: block !important;
    position: relative !important;
    z-index: 37060 !important;
    pointer-events: auto !important;
}

#botoneraJuego #pNavMenu {
    pointer-events: none !important;
}

#botoneraJuego #pNavMenu > * {
    pointer-events: auto !important;
}

.header-chat-toggle {
    position: relative;
    margin-left: 34px;
    padding-top: 24px;
    padding-bottom: 24px;
    line-height: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

.header-chat-toggle .df-icon {
    fill: #fff;
    width: 24px;
    height: 24px;
    transition: all 300ms ease;
}

.header-chat-toggle:hover .df-icon,
.header-chat-toggle.toggled .df-icon {
    fill: #a3ff12;
}

.header-chat-toggle .df-icon--close {
    position: absolute;
    top: 25px;
    left: 0;
    opacity: 0;
    transform: scale(.3);
    transform-origin: center;
}

.header-chat-toggle.toggled .df-icon--bag {
    opacity: 0;
    transform: scale(.3);
}

.header-chat-toggle.toggled .df-icon--close {
    opacity: 1;
    transform: scale(1);
}

#page {
    transition: opacity 280ms ease;
}

body.ce-fade-to-start #page {
    opacity: 0;
}

.modal-preguntas .question-item {
    overflow: hidden !important;
}

.modal-preguntas .question-item label {
    min-height: 47px !important;
    display: flex !important;
    align-items: center !important;
    margin: 0 !important;
    background-color: #fff !important;
    transition: background-color 160ms ease, color 160ms ease !important;
}

.modal-preguntas .question-item label:before {
    display: none !important;
}

.modal-preguntas .question-item input:checked ~ label {
    background-color: #5562eb !important;
    color: #fff !important;
}

.modal-preguntas .question-item input:checked ~ label:after {
    background-color: #54e0c7 !important;
    border-color: #54e0c7 !important;
}

#panel-chat > .chat-panel {
    background: #222430 !important;
    color: #fff !important;
}

#panel-chat .chat-textarea,
#panel-chat #chatMensaje {
    background: #fff !important;
    color: #222430 !important;
    border: 0 !important;
}

#panel-chat #chatSendMessage,
#panel-chat .chat-panel__send-btn,
#panel-chat .btn-primary,
#panel-chat .btn-success {
    background: #a3ff12 !important;
    color: #111 !important;
    border: 0 !important;
    font-weight: 700 !important;
}

#panel-chat .shop-table,
#panel-chat .shop-table tbody,
#panel-chat .shop-table tr,
#panel-chat .shop-table td,
#panel-chat .table,
#panel-chat .table tbody,
#panel-chat .table tr,
#panel-chat .table td {
    background: transparent !important;
    color: #fff !important;
    border-color: rgba(255,255,255,.14) !important;
}

#panel-chat .shop-table tr,
#panel-chat .table tr {
    background: rgba(255,255,255,.06) !important;
}

#panel-chat .product__name,
#panel-chat .product__name a,
#panel-chat .chat-message,
#panel-chat .chat-message-text {
    color: #fff !important;
}

#panel-chat .product__cat,
#panel-chat .chat-message-user {
    color: #a3ff12 !important;
}

#panel-chat .product__total,
#panel-chat .product__total-currency,
#panel-chat .chat-message-date {
    color: #ced0da !important;
}

/* Refuerzo de ocultación: supera reglas antiguas con dos IDs. */
body.ce-page-start #botoneraJuego.clinicalescape-botonera-visible #bAbrirObjetivos,
body.ce-page-start #botoneraJuego.clinicalescape-botonera-visible #bAbrirChat,
body.ce-page-start #botoneraJuego.clinicalescape-botonera-visible .header-search-toggle,
body.ce-page-login #botoneraJuego.clinicalescape-botonera-visible #bAbrirObjetivos,
body.ce-page-login #botoneraJuego.clinicalescape-botonera-visible #bAbrirChat,
body.ce-page-login #botoneraJuego.clinicalescape-botonera-visible .header-search-toggle,
body.ce-page-not-found #botoneraJuego.clinicalescape-botonera-visible #bAbrirObjetivos,
body.ce-page-not-found #botoneraJuego.clinicalescape-botonera-visible #bAbrirChat,
body.ce-page-not-found #botoneraJuego.clinicalescape-botonera-visible .header-search-toggle,
body.ce-page-notFound #botoneraJuego.clinicalescape-botonera-visible #bAbrirObjetivos,
body.ce-page-notFound #botoneraJuego.clinicalescape-botonera-visible #bAbrirChat,
body.ce-page-notFound #botoneraJuego.clinicalescape-botonera-visible .header-search-toggle {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
}


/* PATCH ClinicalEscape v16: logo inferior ligeramente más alto */
#botoneraJuego.clinicalescape-botonera-visible .header-logo--img {
    bottom: 42px !important;
}

#botoneraJuego.clinicalescape-botonera-visible #bLogoHeader img {
    display: block !important;
}

/* PATCH ClinicalEscape v17: corrige círculo blanco de la animación success de SweetAlert2 sobre fondos oscuros */
.swal2-popup .swal2-icon.swal2-success .swal2-success-circular-line-left,
.swal2-popup .swal2-icon.swal2-success .swal2-success-circular-line-right,
.swal2-popup .swal2-icon.swal2-success .swal2-success-fix {
    background-color: transparent !important;
}

.swal2-popup .swal2-icon.swal2-success {
    background-color: transparent !important;
}

.swal2-popup .swal2-icon.swal2-success .swal2-success-ring {
    border-color: rgba(165, 220, 134, .55) !important;
}

/* PATCH ClinicalEscape v18: cursor circular heredado.
   El tema antiguo movía #df-custom-cursor desde tema-init.js. Al quitarlo,
   el cursor quedaba visible en (0,0). Ahora lo mueve clinicalescape.runtime.js. */
@media (hover: hover) and (pointer: fine) {
    .df-custom-cursor-wrap {
        position: fixed !important;
        inset: 0 !important;
        overflow: hidden !important;
        pointer-events: none !important;
        z-index: 2147483000 !important;
    }

    #df-custom-cursor {
        position: absolute !important;
        left: 0 !important;
        top: 0 !important;
        width: 30px !important;
        height: 30px !important;
        margin-left: -15px !important;
        margin-top: -15px !important;
        opacity: 0 !important;
        will-change: transform, opacity;
        transition: opacity 120ms ease, width 120ms ease, height 120ms ease, margin 120ms ease;
    }

    body.cursor-is--active #df-custom-cursor {
        opacity: 1 !important;
    }

    body.cursor-is--hovering #df-custom-cursor {
        width: 40px !important;
        height: 40px !important;
        margin-left: -20px !important;
        margin-top: -20px !important;
    }

    #df-custom-cursor::after {
        border-width: 4px !important;
        border-color: #a3ff12 !important;
        opacity: .95 !important;
        box-shadow: 0 0 14px rgba(163, 255, 18, .28);
    }
}

@media (hover: none), (pointer: coarse) {
    .df-custom-cursor-wrap {
        display: none !important;
    }
}

/* PATCH ClinicalEscape v22: altura de la figura del logotipo en pantallas
   estrechas. En el tema, .page-thumbnail--default se apoyaba en un
   "padding-bottom: 100%" que está comentado, así que por debajo de 992px la
   figura queda con altura 0. El logotipo se centra con top:50% sobre esa altura
   y acaba medio fuera de la pantalla, empujando el formulario hacia arriba.
   A partir de 992px no hace falta: ahí la figura es fixed y ocupa el alto del
   viewport. */
@media (max-width: 991.98px) {
    .page-thumbnail--default {
        height: 46vw;
        min-height: 180px;
        max-height: 280px;
    }

    /* El logotipo se dimensiona por ancho (60% del contenedor), que en esta
       franja da una imagen más alta que la propia banda. Aquí manda el alto. */
    .page-thumbnail--default .page-bg-logo {
        width: auto;
        max-width: 60%;
        max-height: 78%;
    }
}

/* PATCH ClinicalEscape v21: el círculo sustituye al puntero, no lo acompaña.
   Al retirar tema-init.js se perdió el "cursor: none" del tema, así que se
   dibujaban los dos a la vez: como el círculo se centra en el punto del ratón
   y la flecha lo marca con su punta, la flecha quedaba pegada al borde
   superior izquierdo del círculo y parecía descentrado. */
@media (hover: hover) and (pointer: fine) {
    body.cursor-is--active,
    body.cursor-is--active * {
        cursor: none !important;
    }

    /* Escribir sin ver dónde cae el punto de inserción es peor que ver dos
       punteros: en los campos de texto manda el cursor del sistema. */
    body.cursor-is--active input,
    body.cursor-is--active textarea,
    body.cursor-is--active select,
    body.cursor-is--active [contenteditable="true"],
    body.cursor-is--active .swal2-input,
    body.cursor-is--active .swal2-textarea {
        cursor: auto !important;
    }

    /* Y ahí se retira el círculo, para no volver a tener dos a la vez. */
    body.cursor-is--typing #df-custom-cursor {
        opacity: 0 !important;
    }
}

/* PATCH ClinicalEscape v20: animación gradual real del logo/decoración del login.
   La versión v19 usaba body:not(.preloader-is--active), que hacía que el logo
   apareciera directamente al retirar el preloader. Ahora solo entra cuando
   clinicalescape.runtime.js añade scroll-is--active después de dos frames. */
.scroll-is--active .page-thumbnail--default .ncr-page-decor__layer-1,
.scroll-is--active .page-thumbnail--default .ncr-page-decor__layer-2,
.scroll-is--active .page-thumbnail--default .ncr-page-decor__layer-3,
.scroll-is--active .page-thumbnail--default .ncr-page-decor__layer-4,
.scroll-is--active .page-thumbnail--default .ncr-page-decor__layer-5,
.scroll-is--active .page-thumbnail--default .ncr-page-decor__layer-6 {
    opacity: 1;
}

.scroll-is--active .page-thumbnail--default .page-bg-logo {
    opacity: 1;
    -webkit-transform: scale(1) translate3d(-50%, -50%, 0);
            transform: scale(1) translate3d(-50%, -50%, 0);
}

.scroll-is--active .ncr-page-decor__layer-6 {
    -webkit-clip-path: polygon(0% 0%, 100% 0, 100% 100%, 0 100%);
            clip-path: polygon(0% 0%, 100% 0, 100% 100%, 0 100%);
}

/* Botonera del juego en móvil y tableta.
   Objetivos, chat y ayuda se quedaban en 36px de ancho, por debajo del mínimo
   táctil recomendado (44px): en un teléfono se fallaba el botón. El de menú ya
   medía 72px. Solo se amplía el área que se toca; el icono no cambia de tamaño
   y en escritorio todo sigue igual. */
@media (max-width: 991px) {
    #botoneraJuego.clinicalescape-botonera-visible #bAbrirObjetivos,
    #botoneraJuego.clinicalescape-botonera-visible #bAbrirChat,
    #botoneraJuego.clinicalescape-botonera-visible .header-search-toggle {
        min-width: 48px !important;
        padding-left: 6px !important;
        padding-right: 6px !important;
    }
}

/* Logotipo de la botonera en móvil.
   La barra es un flex alineado a la derecha y #pNavMenu ocupa el 100% del
   ancho, así que la suma de los hijos superaba la pantalla y el logo, que va
   primero, se salía por la izquierda: en 375px se veía cortado por la mitad.
   Se reparte el espacio en lugar de empujar. */
@media (max-width: 991px) {
    #botoneraJuego.clinicalescape-botonera-visible {
        justify-content: space-between !important;
    }

    #botoneraJuego.clinicalescape-botonera-visible .header-logo--img {
        left: 0 !important;
        margin-left: 12px !important;
        flex: 0 0 auto !important;
    }

    #botoneraJuego.clinicalescape-botonera-visible #pNavMenu {
        width: auto !important;
        min-width: 0 !important;
        flex: 1 1 auto !important;
    }
}

/* El logotipo tiene que caber en la barra (72px de alto) o se monta encima del
   botón de objetivos. Se limita el alto y el ancho se ajusta solo. */
@media (max-width: 991px) {
    #botoneraJuego.clinicalescape-botonera-visible .header-logo--img img {
        max-height: 52px !important;
        width: auto !important;
        height: auto !important;
    }
}

/* Separación de la botonera en móvil.
   Los márgenes del tema (pensados para escritorio) dejaban el conjunto en
   300px dentro de un hueco de 291, así que el primer botón se salía por la
   izquierda y pisaba el logotipo. Se sustituyen por un gap uniforme. */
@media (max-width: 991px) {
    #botoneraJuego.clinicalescape-botonera-visible .header-actions {
        padding-right: 12px !important;
        gap: 10px !important;
    }

    #botoneraJuego.clinicalescape-botonera-visible .header-actions > * {
        margin-left: 0 !important;
        margin-right: 0 !important;
    }
}
