/**
 * 2026-09-24: rediseño del popup de geolocalización (confirmación de país/
 * moneda/idioma y selector manual de país) acorde al sistema de diseño del
 * tema licencias2026 — ver themes/licencias2026/_dev/css/partials/_variables.scss.
 * Los valores de color/radio/sombra de abajo son los mismos tokens de ese
 * archivo (este CSS de módulo no pasa por el pipeline SCSS del tema, así
 * que se copian como valores literales en vez de variables).
 *
 * Las clases y su comportamiento (.active, .running_ajax, .yes_ok, .no_ok,
 * .ets_geo_close_popup, etc.) se mantienen intactas — las consume
 * views/js/front_geo.js — solo cambia la apariencia.
 */
.ets_geo_popup,.ets_geo_popup_choose{
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    z-index: 9999;
    opacity: 0;
    visibility: hidden;
    transition: opacity .2s ease;
}
.ets_geo_popup.active,
.ets_geo_popup_choose.active{
    opacity: 1;
    visibility: visible;
}
span.ets_geo_line > span {
    background: #fff;
    display: inline-block;
    position: relative;
    z-index: 1;
    padding: 0 8px;
    color: #9CA3AF;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: .04em;
}
a.ets_click_show {
    outline: none;
    text-decoration: none!important;
}
a.ets_click_show .icon{
    line-height: 0;
    display: inline-block;
    position: relative;
    top: 2px;
}
a.ets_click_show svg{
    width: 11px;
    height: 16px;
    float: left;
}
div + a.ets_click_show,
span + a.ets_click_show,
p + a.ets_click_show {
    margin-left: 20px;
}
.ets_geo_wrap_prosess * {
    outline: none!important;
}
.ets_geo_popup.running_ajax:not(.is_notification),
.ets_geo_popup.running_ajax.is_block{
    display: none;
}

/* --- Fondo oscuro semitransparente --- */
.ets_geo_popup:before,
.ets_geo_popup_choose:before{
    content:'';
    position:fixed;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    z-index: 99;
    background-color: rgba(17, 24, 39, .55);
}

.ets_geo_popup_wrapper{
    display: table;
    width: 100%;
    height: 100%;
    vertical-align: middle;
}

.ets_geo_popup_entry{
    display: table-cell;
    vertical-align: middle;
    text-align: center;
    padding: 16px;
}

/* --- Tarjeta principal --- */
.ets_geo_popup_content {
    background-color: #fff;
    display: inline-block;
    text-align: left;
    margin: 0 auto;
    max-width: 420px;
    width: 100%;
    position: relative;
    z-index: 100;
    overflow: hidden;
    border-radius: 16px;
    box-shadow: 0 12px 32px -8px rgba(17, 24, 39, .16), 0 1px 2px rgba(17, 24, 39, .06);
    padding: 28px 28px 24px;
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    transform: translateY(10px) scale(.98);
    opacity: 0;
    transition: transform .25s cubic-bezier(.4,0,.2,1), opacity .25s cubic-bezier(.4,0,.2,1);
}
.ets_geo_popup.active .ets_geo_popup_content,
.ets_geo_popup_choose.active .ets_geo_popup_content{
    transform: translateY(0) scale(1);
    opacity: 1;
}

span.ets_geo_line {
    color: #999;
    font-size: 14px;
    margin: 18px 0 14px;
    text-transform: uppercase;
    position: relative;
    padding: 10px 0;
    display: block;
    /* 2026-09-24: fix — faltaba centrar el texto ("O"/"Or"), quedaba pegado
       a la izquierda en vez de centrado entre las dos líneas divisorias. */
    text-align: center;
}
.select2-container .select2-selection--single .select2-selection__rendered {
    background: #F9FAFB;
}
span.ets_geo_line:before {
    content: "";
    position: absolute;
    right: 0;
    width: calc(50% - 20px);
    height: 1px;
    background-color: #E5E7EB;
    margin-left: 5px;
    top: 50%;
}
span.ets_geo_line:after {
    content: "";
    position: absolute;
    left: 0;
    margin-right: 5px;
    height: 1px;
    background-color: #E5E7EB;
    top: 50%;
    width: calc(50% - 20px);
}
.select2-results__option[aria-selected] {
    cursor: pointer;
    font-size: 14px;
    color: #374151;
}
.select2-dropdown {
    border: 1px solid #E5E7EB!important;
    border-radius: 10px!important;
    overflow: hidden;
}
.select2-container--default .select2-search--dropdown .select2-search__field {
    border: 1px solid #E5E7EB!important;
    border-radius: 6px;
    outline: none!important;
}
.select2-container{
    outline: none!important;
}
.ets_gep_entry_find > .select2-container{
    width: 100% !important;
}

/* --- Botón "Iniciar sesión" del selector de país --- */
a.link_to_signin {
    font-size: 14px;
    font-weight: 600;
    margin-bottom: 5px;
    background: #2563EB;
    display: inline-block;
    width: 100%;
    text-align: center;
    border-radius: 10px;
    color: #fff;
    padding: 12px;
    outline: none!important;
    text-decoration: none!important;
    transition: background-color .15s ease;
}
a.link_to_signin:hover,
.ets_geo_popup_group_button a.yes_ok:hover,
.ets_geo_btn_submit_apply:hover {
    background: #1D4ED8;
}
.running_ajax .ets_geo_popup_content_confirmation{
    display:none;
}
.running_ajax .ets_geo_popup_content_notification{
    display:block;
}
.running_ajax .ets_geo_popup_content{
    max-width: 460px;
}
.running_ajax .ets_geo_popup_header{
    display: none;
}

/* --- Botón de cerrar (X) --- */
.ets_geo_close_popup {
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    opacity: .6;
    position: absolute;
    right: 14px;
    top: 14px;
    width: 32px;
    height: 32px;
    border-radius: 999px;
    z-index: 2;
    transition: background-color .15s ease, opacity .15s ease;
}
.ets_geo_close_popup:hover {
    opacity: 1;
    background-color: #F3F4F6;
}
.ets_icon_close {
    display: inline-block;
    width: 14px;
    height: 14px;
    position: relative;
}
.select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 39px!important;
    width: 26px!important;
}
.select2-container--default .select2-selection--single .select2-selection__rendered {
    color: #374151!important;
    line-height: 38px!important;
    font-size: 14px;
    outline: none!important;
}
.select2-container--default .select2-selection--single .select2-selection__rendered img.img-flag {
    margin-top: -2px;
}
.select2-container--default .select2-selection--single {
    background-color: #fff;
    border: 1px solid #D1D5DB!important;
    border-radius: 10px!important;
    height: 42px!important;
    line-height: 42px!important;
}
.ets_icon_close:before, .ets_icon_close:after {
    content: '';
    width: 1.5px;
    height: 14px;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: -7px;
    background-color: #4B5563;
    border-radius: 1px;
}
.ets_icon_close:before{
    transform: rotate(45deg);
}
.ets_icon_close:after{
    transform: rotate(-45deg);
}

/* --- Encabezado: bandera + "¿Nos visitas desde X?" --- */
.ets_geo_popup_header {
    display: flex;
    align-items: center;
    gap: 12px;
    font-weight: 700;
    font-size: 16px;
    color: #111827;
    line-height: 1.4;
    text-align: left;
    padding-right: 28px;
    margin-bottom: 16px;
}
.ets_geo_flag {
    flex: 0 0 auto;
    display: inline-flex;
    width: 32px;
    height: 32px;
    border-radius: 999px;
    overflow: hidden;
    box-shadow: 0 0 0 1px rgba(17,24,39,.08);
}
.ets_geo_flag img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.ets_geo_popup_header .header_text strong {
    color: #2563EB;
}

.ets_geo_btn_submit_apply {
    cursor: pointer;
    padding: 12px 20px;
    display: block;
    text-align: center;
    margin-top: 20px;
    color: #fff;
    font-weight: 600;
    border-radius: 10px;
    font-size: 14px;
    background: #2563EB;
    position: relative;
    transition: background-color .15s ease;
}
a.yes_ok{
    position:relative;
}
.ets_geo_btn_submit_apply:before,
a.yes_ok:before{
    content: '';
    border-radius: 50%;
    position: absolute;
    margin: -11px -11px;
    animation-name: spinner-rotate;
    animation-duration: 0.6s;
    animation-timing-function: linear;
    animation-iteration-count: infinite;
    border-style: solid;
    width: 20px;
    height: 20px;
    border-width: 2px;
    transform-origin: 50% 50% calc((20px / 2) + 2px);
    border-color: rgba(255, 255, 255, .35);
    border-top-color: #fff;
    left: 50%;
    top: 50%;
    display: none;
}
.ets_geo_btn_submit_apply.active,
a.yes_ok.active{
    font-size: 0;
}
.ets_geo_btn_submit_apply.active:before,
a.yes_ok.active:before{
    display: block;
}
@keyframes spinner-rotate {
    0% { transform: rotate(0) }
    100% { transform: rotate(360deg) }
}

/* --- Cuerpo del mensaje --- */
/* 2026-09-24: fix de code review — el `float:left` no aportaba nada (ya con
   `width:100%` ocupa todo el ancho igual) y sin ningún `clear`/BFC en el resto
   del archivo, rompía el layout de popup_choose.tpl (selector manual de país):
   sus hermanos no flotados dentro de .ets_geo_popup_content_confirmation
   (.ets_btn_signin, span.ets_geo_line, .ets_geo_wrap_prosess, .ets_geo_wrap_zipcode)
   arrancaban su caja en la misma posición vertical que el float, solapándose
   visualmente. Quitar el float resuelve ambos templates sin efectos visuales
   negativos (en popup.tpl este bloque ya era el único hijo de su contenedor). */
.ets_geo_popup_body{
    width: 100%;
    padding: 0;
    font-size: 14px;
    text-align: left;
    line-height: 1.6;
}
.is_notification .ets_geo_popup_body{
    padding-bottom: 0;
}
.ets_geo_msg,
.ets_geo_popup_body p{
    color: #374151;
    line-height: 1.6;
    letter-spacing: 0;
    margin: 0;
}
.ets_geo_popup_body strong,
.ets_geo_msg strong{
    color: #111827;
    font-weight: 700;
}

/* --- Botones de acción (Sí / No) --- */
.ets_geo_popup_group_button{
    float: left;
    width: 100%;
    display: flex;
    gap: 10px;
    padding-top: 22px;
}
.ets_geo_popup_group_button a{
    flex: 1 1 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    line-height: 1.2;
    min-height: 44px;
    border-radius: 10px;
    font-size: 14px;
    font-weight: 600;
    transition: background-color .15s ease, border-color .15s ease, color .15s ease;
}
.ets_geo_popup_group_button a:focus,
.ets_geo_popup_group_button a:active{
    text-decoration: none;
}
.ets_geo_popup_group_button a.yes_ok{
    background-color: #2563EB;
    color: #ffffff;
    order: 2;
}
.ets_geo_popup_group_button a.no_ok{
    background-color: #fff;
    color: #374151;
    border: 1px solid #D1D5DB;
    order: 1;
}
.ets_geo_popup_group_button a.no_ok:hover{
    background-color: #F9FAFB;
    border-color: #9CA3AF;
}

.ets_geo_wrap_prosess .select2-container--default .select2-selection--single .select2-selection__rendered{
    pointer-events: none;
}
.select2-container{
    z-index: 99999;
}
.ets_click_show.is_ver16{
    color: #fff;
    font-weight: bold;
    padding: 9px 10px 11px 10px;
    text-shadow: 1px 1px rgba(0, 0, 0, 0.2);
    cursor: pointer;
    line-height: 1;
    display: inline-block;
    float: left;
    border-left: 1px solid #515151;
}
.ets_click_show i::before{
    font-size: 18px;
}

.geo_location_loading{
    position: relative;
}
.geo_location_loading:before{
    content: '';
    background-color: #ffffff;
    opacity: .7;
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    top: 0;
    width: 100%;
    height: 100%;
    display: block;
    z-index: 99;
}
.geo_location_loading:after{
    content: '';
    position: absolute;
    border-radius: 50%;
    margin: 0 auto;
    animation-name: spinner-rotate;
    animation-duration: 0.6s;
    animation-timing-function: linear;
    animation-iteration-count: infinite;
    border-style: solid;
    display: inline-flex;
    width: 32px;
    height: 32px;
    border-width: 2px;
    transform-origin: 50% 50% calc((16px / 2) + 2px);
    border-color: rgba(37, 99, 235, .2);
    border-top-color: #2563EB;
    left: 50%;
    top: 50%;
    margin-top: -16px;
    margin-left: -16px;
    z-index: 100;
}

@media (max-width:767px){
    #mobile_top_menu_wrapper .ets_click_show{
        margin-left: 0;
        padding: .625rem;
        color: #7a7a7a;
    }
    .ets_geo_popup_content{
        padding: 22px 18px 18px;
        border-radius: 14px;
    }
    .ets_geo_popup_group_button{
        flex-direction: column;
    }
    .ets_geo_popup_group_button a.yes_ok,
    .ets_geo_popup_group_button a.no_ok{
        order: initial;
    }
}