/* v0.12 · 81-estados — Manual de estados de interacción (dueño, 9 nov 2026). El negro solo va en DEALS Black y en el texto.
   Al pasar el mouse: Celeste claro #A8D5ED con letra o ícono Erie. Elegido o marcado: Celestial #2695D1 con letra blanca.
   Foco con teclado: anillo de 3px Celestial. Compra: Esmeralda #1DD390, al pasar #57E0B1 y al presionar #91EDD3. */
:root{--emx-hover:var(--sky-light,#A8D5ED);--emx-on:var(--sky,#2695D1);--emx-buy:var(--buy,#1DD390);--emx-buy-h:#57E0B1;--emx-buy-a:#91EDD3}

/* Foco con teclado (antes en el azul oscuro #006A9A, descartado) */
:focus-visible{outline:3px solid var(--emx-on);outline-offset:2px}

/* Botones de compra (Comprar, Agregar, Finalizar compra, Realizar pedido) y "Agregar" del carrito lateral, que se pone verde al interactuar */
.btn-tx:hover,.btn-tx:focus-visible,.pc-buy:hover,.pc-buy:focus-visible,.single_add_to_cart_button:hover,.single_add_to_cart_button:focus-visible,
.wc-proceed-to-checkout .checkout-button:hover,.emx-cdw-go:hover,.emx-cdw-go:focus-visible,#place_order:hover,#place_order:focus-visible,.emx-cxs-add:hover,.emx-cxs-add:focus-visible{background:var(--emx-buy-h);border-color:var(--emx-buy-h);color:var(--ink);filter:none}
.btn-tx:active,.pc-buy:active,.single_add_to_cart_button:active,.wc-proceed-to-checkout .checkout-button:active,.emx-cdw-go:active,#place_order:active,.emx-cxs-add:active{background:var(--emx-buy-a);border-color:var(--emx-buy-a);color:var(--ink)}

/* Botones de contorno y neutros (Pedir video, Ver carrito, buscar…): Celeste claro con letra Erie, no negro */
.btn-line:hover,.btn-line:focus-visible,.emx-sbtn:hover,.emx-sbtn:focus-visible,.emx-filter-open:hover,.emx-filter-open:focus-visible{background:var(--emx-hover);border-color:var(--emx-hover);color:var(--ink)}
.btn-line:active,.emx-sbtn:active,.emx-filter-open:active{background:var(--emx-on);border-color:var(--emx-on);color:#fff}
/* Botón principal y el del banner: Celeste claro con texto Erie */
.btn-main:hover,.btn-main:focus-visible,.emx-slide-text .wp-block-button__link:hover,.emx-slide-text .wp-block-button__link:focus-visible{background:var(--emx-hover);border-color:var(--emx-hover);color:var(--ink)}
/* En DEALS Black se mantiene su guía (negro y blanco) */
.emx-black .btn-line:hover,.emx-black .btn-line:focus-visible,.pcard.black .btn-line:hover{background:#fff;border-color:#fff;color:var(--ink)}

/* X de cerrar, todas iguales (carrito, paneles, filtros, comparar, menú, buscador, videos): sin borde en reposo, círculo Celeste claro de
   44px al pasar el mouse y Celestial con X blanca al presionar */
.emx-circ[data-emx-close],.emx-circ[data-dw-close],.emx-filters-x,.pd-lb-x,.emx-dr-close,.emx-cmp-close,.emx-srch-x,.emx-vm-x,.emx-yt-x{min-width:44px;min-height:44px;border-color:transparent;background:transparent;border-radius:50%}
.emx-circ[data-emx-close]:hover,.emx-circ[data-dw-close]:hover,.emx-filters-x:hover,.pd-lb-x:hover,.emx-dr-close:hover,.emx-cmp-close:hover,.emx-srch-x:hover,.emx-vm-x:hover,.emx-yt-x:hover,
.emx-circ[data-emx-close]:focus-visible,.emx-circ[data-dw-close]:focus-visible,.emx-filters-x:focus-visible,.pd-lb-x:focus-visible,.emx-dr-close:focus-visible,.emx-cmp-close:focus-visible,.emx-srch-x:focus-visible,.emx-vm-x:focus-visible,.emx-yt-x:focus-visible{background:var(--emx-hover);border-color:var(--emx-hover);color:var(--ink)}
.emx-circ[data-emx-close]:active,.emx-circ[data-dw-close]:active,.emx-filters-x:active,.pd-lb-x:active,.emx-dr-close:active,.emx-cmp-close:active,.emx-srch-x:active,.emx-vm-x:active,.emx-yt-x:active{background:var(--emx-on);border-color:var(--emx-on);color:#fff}

/* Flechas de carrusel: Celeste claro al pasar el mouse y Celestial al presionar */
.emx-circ:not([data-emx-close]):not([data-dw-close]):not(.emx-filters-x):not(.pd-lb-x):hover,.emx-circ:not([data-emx-close]):not([data-dw-close]):not(.emx-filters-x):not(.pd-lb-x):focus-visible{background:var(--emx-hover);border-color:var(--emx-hover);color:var(--ink)}
.emx-circ:not([data-emx-close]):not([data-dw-close]):not(.emx-filters-x):not(.pd-lb-x):active{background:var(--emx-on);border-color:var(--emx-on);color:#fff}

/* Opciones de los filtros (casillas): fila en Celeste claro al pasar el mouse; la casilla marcada en Celestial */
#emx-filters .emx-fopts.is-list a.emx-chip{border-radius:8px}
#emx-filters .emx-fopts.is-list a.emx-chip:hover,#emx-filters .emx-fopts.is-list a.emx-chip:focus-visible{background:var(--emx-hover);color:var(--ink)}
input[type="checkbox"],input[type="radio"]{accent-color:var(--emx-on)}

/* Buscador: "Lo más buscado" en píldoras redondas con borde gris claro y Celeste claro al pasar el mouse; los botones del buscador sin negro */
.emx-spop .pop-chips a{border:1px solid var(--line);border-radius:999px}
.emx-spop a:hover,.emx-spop a:focus-visible{background:var(--emx-hover);border-color:var(--emx-hover);color:var(--ink)}
.emx-srch-f button:hover,.emx-srch-f button:focus-visible{background:var(--emx-hover);border-color:var(--emx-hover);color:var(--ink)}
.emx-srch-f button[aria-pressed="true"]{background:var(--emx-on);border-color:var(--emx-on);color:#fff}

/* Megamenú: el modelo se marca en Celeste claro al pasar el mouse */
.emx-mchips a:hover,.emx-mchips a:focus-visible,.emx-dd-panel a:hover,.emx-dd-panel a:focus-visible{background:var(--emx-hover);color:var(--ink)}

/* Reproducir video ("Aprende a elegir tu Mac"): círculo blanco con borde #C9CDD1 e ícono Erie; Celeste claro al pasar y Celestial al presionar */
.emx-reel-play{background:#fff;border:1px solid var(--line);color:var(--ink)}
.emx-reel-play svg{fill:currentColor}
.emx-reel-a:hover .emx-reel-play,.emx-reel-a:focus-visible .emx-reel-play{background:var(--emx-hover);border-color:var(--emx-hover);color:var(--ink)}
.emx-reel-a:active .emx-reel-play{background:var(--emx-on);border-color:var(--emx-on);color:#fff}

/* "En comparación" en la tarjeta: gris #F6F7F8 con borde #7A8085 y letra Erie; botón de la barra de comparar en 14 Bold y 44px */
.pc-cmp.is-on,.pc-cmp[aria-pressed="true"]{background:#F6F7F8;border-color:#7A8085;color:var(--ink)}
.emx-cmp-go{min-height:44px;font-size:14px;font-weight:700}

/* Preguntas frecuentes: pregunta en 18 / 16 Regular (Bold abierta), chevron Erie sin círculo y sombreado blanco al pasar el mouse.
   El logotipo DEALS Black de una pregunta va del color del texto */
.wp-block-details.is-style-emx-faq summary{font-size:18px;font-weight:400}
.wp-block-details.is-style-emx-faq[open] > summary{font-weight:700}
.wp-block-details.is-style-emx-faq summary::after{border-color:var(--ink);color:var(--ink);background:var(--ink)}
.wp-block-details.is-style-emx-faq summary .emx-lt-black{color:inherit;fill:currentColor}

/* WhatsApp flotante: Esmeralda con ícono Erie y sombra suave, sin anillo blanco; al pasar el mouse #57E0B1 */
.emx-fab{background:var(--emx-buy);color:var(--ink);border:0;outline-color:var(--emx-on);box-shadow:0 6px 16px rgba(33,36,39,.18)}
.emx-fab svg{fill:currentColor;color:var(--ink)}
.emx-fab:hover,.emx-fab:focus-visible{background:var(--emx-buy-h);color:var(--ink)}
.emx-fab:active{background:var(--emx-buy-a)}

/* Enlaces de texto pequeños: Erie subrayado (el Celestial como texto no pasa AA) */
.emx-ck-help a,.emx-wa-link,.emx-os-help{color:var(--ink);text-decoration:underline;text-underline-offset:3px}

/* Puntos de carrusel: el actual en Celestial */
.emx-dots button[aria-current="true"] i{background:var(--emx-on)}

@media (max-width:781px){
	.wp-block-details.is-style-emx-faq summary{font-size:16px}
}
