/*
Theme Name: Tienda Tema
Theme URI: https://example.com
Description: Tema hijo de GeneratePress para la tienda de computadoras. Todo el HTML/CSS de la tienda vive aca.
Author:
Template: generatepress
Version: 1.0.0
Text Domain: tienda-tema
*/

/* ==========================================================================
   Estilos base del sitio. Ir agregando por seccion a medida que se construye.
   ========================================================================== */

:root {
	--color-primario: #6d5efc;
	--color-primario-hover: #8577ff;
	--color-fondo: #0d0b1a;
	--color-superficie: #171428;
	--color-superficie-2: #1f1b38;
	--color-texto: #f5f5f5;
	--color-texto-secundario: #a1a1c2;
	--color-borde: #2c2748;
	--color-exito: #22c55e;
	--color-error: #f87171;
	--color-advertencia: #fbbf24;
}

html,
body {
	background: var(--color-fondo);
	color: var(--color-texto);
}

a {
	color: var(--color-primario);
}

a:hover {
	color: var(--color-primario-hover);
}

/* GeneratePress boxes each content area on a white surface by default --
   flatten those back onto the page background so the dark theme is
   consistent instead of white cards floating on a dark page. */
.separate-containers .inside-article,
.separate-containers .comments-area,
.separate-containers .page-header,
.separate-containers .paging-navigation,
#content,
#primary,
#main,
.site-content,
.site {
	background: transparent;
}

/* Header / navegacion */
.site-header {
	background: var(--color-superficie);
	border-bottom: 1px solid var(--color-borde);
}

.site-branding a,
.site-title a {
	color: var(--color-texto) !important;
	font-weight: 800;
	letter-spacing: -0.02em;
}

.main-navigation,
.main-navigation ul {
	background: transparent !important;
}

.main-navigation a {
	color: var(--color-texto-secundario) !important;
}

.main-navigation a:hover {
	color: var(--color-primario) !important;
}

/* Footer */
.site-info {
	background: var(--color-superficie);
	color: var(--color-texto-secundario);
	border-top: 1px solid var(--color-borde);
}

.site-info a {
	color: var(--color-primario);
}

/* Botones y campos de WooCommerce en todo el sitio */
.button,
.add_to_cart_button,
.single_add_to_cart_button,
input[type='submit'] {
	background: var(--color-primario) !important;
	color: #ffffff !important;
	border: none !important;
	border-radius: 6px;
	height: 44px;
	padding: 0 1.1rem;
	box-sizing: border-box;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}

.button:hover,
.add_to_cart_button:hover,
.single_add_to_cart_button:hover,
input[type='submit']:hover {
	background: var(--color-primario-hover) !important;
}

input[type='text'],
input[type='email'],
input[type='tel'],
input[type='number'],
input[type='password'],
input[type='search'],
textarea,
select {
	background: var(--color-superficie-2);
	color: var(--color-texto);
	border: 1px solid var(--color-borde);
}

/* The qty field next to "Add to cart" (single product page and cart page)
   was taller than the button next to it -- same padding, but the input
   inherits a bigger line-height than the button does. Match both
   explicitly instead of relying on GeneratePress's own sizing for each. */
.quantity .qty {
	height: 44px;
	padding: 0 0.75rem;
	box-sizing: border-box;
	border-radius: 6px;
}

.price {
	color: var(--color-primario) !important;
	font-weight: 700;
}

/* Grilla de productos (shop, archivo de categoria, destacados de home) */
ul.products.tienda-productos-grid,
ul.products {
	display: grid !important;
	grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
	gap: 1.5rem;
	list-style: none;
	margin: 0 0 2rem;
	padding: 0;
}

/* Card layout is controlled explicitly here rather than relying on
   WooCommerce's own default CSS, which only loads on pages WooCommerce
   recognizes as its own (shop/category/product) -- the home page's
   featured-products section uses this exact same markup but isn't one of
   those, so WooCommerce's stylesheet doesn't load there and .price/.button
   fall back to plain inline elements sitting side by side instead of
   stacking. Flex column + margin-top:auto on the button keeps the button
   pinned to the same bottom edge across every card in a row regardless of
   how many lines the title/specs wrap to, in every context. */
ul.products li.product {
	float: none;
	width: auto !important;
	margin: 0 !important;
	padding: 1rem;
	background: var(--color-superficie);
	border: 1px solid var(--color-borde);
	border-radius: 8px;
	text-align: left;
	display: flex;
	flex-direction: column;
}

ul.products li.product a {
	color: var(--color-texto);
	text-decoration: none;
}

ul.products li.product .woocommerce-loop-product__title {
	font-weight: 600;
}

ul.products li.product a:hover {
	color: var(--color-primario);
}

ul.products li.product .price {
	display: block;
	margin: 0.25rem 0 0.75rem;
}

ul.products li.product .add_to_cart_button {
	/* WooCommerce's own CSS has "ul.products li.product .button { margin-top:
	   1em }" -- identical specificity to this rule, and it loads after this
	   stylesheet, so it wins the tie and overrides margin-top:auto without
	   !important here. */
	margin-top: auto !important;
	align-self: flex-start;
}

.producto-specs-resumen {
	margin: 0.25rem 0 0.75rem;
	font-size: 0.85rem;
	color: var(--color-texto-secundario);
}

/* Hero de la home */
.tienda-hero {
	background: radial-gradient(circle at top, #211a4a, var(--color-fondo) 65%);
	color: #ffffff;
	padding: 4rem 1.5rem;
	text-align: center;
}

.tienda-hero-inner {
	max-width: 640px;
	margin: 0 auto;
}

.tienda-hero h1 {
	color: #ffffff;
	font-size: 2.5rem;
	font-weight: 800;
	letter-spacing: -0.02em;
	margin-bottom: 0.75rem;
}

.tienda-hero p {
	font-size: 1.1rem;
	color: var(--color-texto-secundario);
	margin-bottom: 2rem;
}

.tienda-hero-cta {
	display: flex;
	justify-content: center;
	gap: 1rem;
	flex-wrap: wrap;
}

.tienda-boton {
	display: inline-block;
	padding: 0.85rem 1.75rem;
	border-radius: 6px;
	font-weight: 700;
	text-decoration: none;
}

.tienda-boton-primario {
	background: var(--color-primario);
	color: #ffffff;
}

.tienda-boton-primario:hover {
	background: var(--color-primario-hover);
	color: #ffffff;
}

.tienda-boton-secundario {
	background: transparent;
	color: #ffffff;
	border: 2px solid #ffffff;
}

.tienda-boton-secundario:hover {
	border-color: var(--color-primario);
	color: var(--color-primario);
}

/* Tarjetas de categoria en la home */
.tienda-categorias {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
	gap: 1.5rem;
	max-width: 1100px;
	margin: 3rem auto;
	padding: 0 1.5rem;
}

.tienda-categoria-card {
	display: block;
	padding: 2rem;
	background: var(--color-superficie);
	border: 1px solid var(--color-borde);
	border-radius: 10px;
	text-decoration: none;
	color: var(--color-texto);
	transition: border-color 0.15s ease;
}

.tienda-categoria-card:hover {
	border-color: var(--color-primario);
}

.tienda-categoria-card h2 {
	margin-bottom: 0.5rem;
}

.tienda-categoria-card p {
	color: var(--color-texto-secundario);
}

.tienda-categoria-link {
	display: inline-block;
	margin-top: 1rem;
	font-weight: 600;
	color: var(--color-primario);
}

.tienda-destacados {
	max-width: 1100px;
	margin: 3rem auto;
	padding: 0 1.5rem;
}

.tienda-destacados h2 {
	margin-bottom: 1.5rem;
}

/* Ficha de producto individual */
.producto-specs {
	list-style: none;
	margin: 1rem 0;
	padding: 0;
	font-size: 0.9rem;
}

.producto-specs li {
	display: flex;
	justify-content: space-between;
	padding: 0.35rem 0;
	border-bottom: 1px solid var(--color-borde);
}

.producto-specs li span {
	color: var(--color-texto-secundario);
}

.producto-specs li strong {
	color: var(--color-texto);
}

/* Build-your-PC configurator */
.configurador-pc {
	max-width: 480px;
	margin: 1.5rem 0;
	padding: 1.25rem;
	border: 1px solid var(--color-borde);
	border-radius: 8px;
	background: var(--color-superficie);
}

.configurador-fila {
	display: flex;
	flex-direction: column;
	gap: 0.25rem;
	margin-bottom: 1rem;
}

.configurador-fila label {
	font-weight: 600;
	font-size: 0.85rem;
	color: var(--color-texto);
}

.configurador-select {
	padding: 0.5rem;
	background: var(--color-superficie-2);
	color: var(--color-texto);
	border: 1px solid var(--color-borde);
	border-radius: 4px;
	font-size: 0.9rem;
}

/* Fixed, always-visible hints next to a select (e.g. Windows/Linux under
   the OS picker) -- not a native title="" tooltip, which most browsers
   don't actually show on hover for <optgroup>. */
.configurador-ayuda {
	margin: 0.15rem 0 0;
	font-size: 0.78rem;
	line-height: 1.4;
	color: var(--color-texto-secundario);
}

.configurador-ayuda strong {
	color: var(--color-texto);
}

.configurador-total {
	display: flex;
	justify-content: space-between;
	font-size: 1.1rem;
	font-weight: 700;
	padding-top: 0.75rem;
	border-top: 2px solid var(--color-primario);
}

/* Live compatibility checklist -- updates as parts are picked. */
.configurador-compat {
	margin: 0 0 1.25rem;
	padding: 0.9rem 1rem;
	background: var(--color-superficie-2);
	border: 1px solid var(--color-borde);
	border-radius: 6px;
}

.configurador-compat-titulo {
	margin: 0 0 0.5rem;
	font-weight: 700;
	font-size: 0.85rem;
	color: var(--color-texto-secundario);
	text-transform: uppercase;
	letter-spacing: 0.04em;
}

.configurador-compat-lista {
	list-style: none;
	margin: 0;
	padding: 0;
	font-size: 0.9rem;
}

.configurador-compat-item {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	padding: 0.2rem 0;
}

.configurador-compat-item span {
	font-weight: 700;
	width: 1.1em;
	text-align: center;
}

.configurador-compat-item.ok {
	color: var(--color-exito);
}

.configurador-compat-item.mal {
	color: var(--color-error);
}

.configurador-compat-item.pendiente {
	color: var(--color-texto-secundario);
}

.configurador-compat-item.ajustado {
	color: var(--color-advertencia);
}

.configurador-select option:disabled {
	color: #6b6b8a;
}

/* Advisory note about the selected motherboard (e.g. PCIe/M.2 quirks) --
   informational only, never blocks the purchase. */
.configurador-nota {
	margin: 0 0 1.25rem;
	padding: 0.9rem 1rem;
	background: rgba(248, 113, 113, 0.08);
	border: 1px solid rgba(248, 113, 113, 0.35);
	border-radius: 6px;
	font-size: 0.85rem;
	line-height: 1.5;
	color: var(--color-texto-secundario);
}

.configurador-nota strong {
	color: var(--color-texto);
}

/* Motherboard compatibility table ([tabla_compatibilidad] shortcode). */
.compat-tabla-intro {
	max-width: 720px;
	margin: 0 auto 2rem;
	padding: 0 1.5rem;
	text-align: center;
	color: var(--color-texto-secundario);
}

.compat-tabla-seccion {
	max-width: 1100px;
	margin: 0 auto 3rem;
	padding: 0 1.5rem;
}

.compat-filtros {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.75rem 1.25rem;
	margin-bottom: 1.25rem;
}

.compat-filtros label {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	font-size: 0.85rem;
	color: var(--color-texto-secundario);
}

.compat-filtros select {
	padding: 0.4rem 0.6rem;
}

.compat-filtros-contador {
	margin-left: auto;
	font-size: 0.85rem;
	color: var(--color-texto-secundario);
}

.compat-tabla-wrap {
	overflow-x: auto;
	border: 1px solid var(--color-borde);
	border-radius: 8px;
}

table.compat-tabla {
	width: 100%;
	border-collapse: collapse;
	background: var(--color-superficie);
	font-size: 0.88rem;
	white-space: nowrap;
}

table.compat-tabla caption {
	caption-side: bottom;
	padding: 0.6rem 1rem;
	text-align: left;
	font-size: 0.8rem;
	color: var(--color-texto-secundario);
	white-space: normal;
}

.compat-tabla th,
.compat-tabla td {
	padding: 0.7rem 0.9rem;
	text-align: left;
	border-bottom: 1px solid var(--color-borde);
}

.compat-tabla thead th {
	background: var(--color-superficie-2);
	color: var(--color-texto-secundario);
	font-size: 0.75rem;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	position: sticky;
	top: 0;
}

.compat-tabla tbody tr:last-child td {
	border-bottom: none;
}

.compat-tabla tbody tr:hover {
	background: var(--color-superficie-2);
}

.compat-tabla .compat-modelo {
	font-weight: 700;
	color: var(--color-texto);
	white-space: normal;
	min-width: 200px;
}

.compat-tabla .compat-precio {
	color: var(--color-primario);
	font-weight: 700;
}

.compat-nota {
	white-space: normal;
}

.compat-nota summary {
	cursor: pointer;
	color: var(--color-primario);
	font-weight: 700;
	list-style: none;
}

.compat-nota summary::-webkit-details-marker {
	display: none;
}

.compat-nota[open] summary {
	color: var(--color-primario-hover);
}

.compat-nota p {
	max-width: 320px;
	margin: 0.5rem 0 0;
	color: var(--color-texto-secundario);
	line-height: 1.5;
}

.compat-vacio {
	padding: 2rem 1rem;
	text-align: center;
	color: var(--color-texto-secundario);
}

/* Save & share a build (configurator.js). */
.configurador-guardar {
	margin-bottom: 1rem;
}

.configurador-guardar-btn {
	width: 100%;
	padding: 0.7rem;
	background: transparent;
	color: var(--color-primario);
	border: 1px solid var(--color-primario);
	border-radius: 6px;
	font-weight: 700;
	font-size: 0.9rem;
	cursor: pointer;
}

.configurador-guardar-btn:hover {
	background: rgba(109, 94, 252, 0.1);
}

.configurador-guardar-btn:disabled {
	opacity: 0.6;
	cursor: default;
}

.configurador-guardar-resultado {
	display: flex;
	gap: 0.5rem;
	margin-top: 0.75rem;
}

.configurador-guardar-resultado[hidden] {
	display: none;
}

.configurador-guardar-resultado input {
	flex: 1;
	min-width: 0;
	padding: 0.5rem;
	background: var(--color-superficie-2);
	color: var(--color-texto);
	border: 1px solid var(--color-borde);
	border-radius: 4px;
	font-size: 0.85rem;
}

.configurador-guardar-resultado button {
	flex: 0 0 auto;
	padding: 0.5rem 0.9rem;
	background: var(--color-primario);
	color: #ffffff;
	border: none;
	border-radius: 4px;
	font-weight: 600;
	font-size: 0.85rem;
	cursor: pointer;
}

.configurador-guardar-error {
	margin: 0.75rem 0 0;
	font-size: 0.85rem;
	color: var(--color-error);
}

/* Side-by-side motherboard comparison ([tabla_compatibilidad] shortcode). */
.compat-th-check {
	width: 2.5rem;
	text-align: center !important;
}

.compat-comparar-btn {
	padding: 0.5rem 1rem;
	background: var(--color-primario);
	color: #ffffff;
	border: none;
	border-radius: 6px;
	font-weight: 600;
	font-size: 0.85rem;
	cursor: pointer;
}

.compat-comparar-btn:hover {
	background: var(--color-primario-hover);
}

.compat-comparar-ayuda {
	margin: -0.5rem 0 1rem;
	font-size: 0.8rem;
	color: var(--color-texto-secundario);
}

.compat-comparar-ayuda-limite {
	color: var(--color-advertencia);
	font-weight: 600;
}

.compat-comparacion {
	max-width: 1100px;
	margin: 0 auto 1.5rem;
	padding: 1.25rem;
	background: var(--color-superficie);
	border: 1px solid var(--color-primario);
	border-radius: 8px;
}

.compat-comparacion h3 {
	margin-top: 0;
}

.compat-comparacion table th:first-child {
	color: var(--color-texto-secundario);
	font-weight: 600;
	white-space: nowrap;
}

.compat-comparar-cerrar {
	margin-top: 1rem;
	padding: 0.5rem 1rem;
	background: transparent;
	color: var(--color-texto-secundario);
	border: 1px solid var(--color-borde);
	border-radius: 6px;
	font-size: 0.85rem;
	cursor: pointer;
}

.compat-comparar-cerrar:hover {
	color: var(--color-texto);
	border-color: var(--color-texto-secundario);
}

/* "Build Advisor" chat widget (chat-asesor.js), site-wide via wp_footer. */
.asesor-burbuja {
	position: fixed;
	right: 1.5rem;
	bottom: 1.5rem;
	z-index: 9999;
	padding: 0.8rem 1.2rem;
	background: var(--color-primario);
	color: #ffffff;
	border-radius: 999px;
	font-weight: 700;
	font-size: 0.9rem;
	cursor: pointer;
	box-shadow: 0 4px 16px rgba(0, 0, 0, 0.35);
}

.asesor-burbuja:hover {
	background: var(--color-primario-hover);
}

.asesor-panel {
	position: fixed;
	right: 1.5rem;
	bottom: 5.5rem;
	z-index: 9999;
	width: 320px;
	max-width: calc(100vw - 3rem);
	max-height: 70vh;
	display: flex;
	flex-direction: column;
	background: var(--color-superficie);
	border: 1px solid var(--color-borde);
	border-radius: 10px;
	box-shadow: 0 8px 30px rgba(0, 0, 0, 0.45);
	overflow: hidden;
}

.asesor-panel[hidden] {
	display: none;
}

.asesor-panel-header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 0.75rem 1rem;
	background: var(--color-superficie-2);
	color: var(--color-texto);
	font-weight: 700;
	border-bottom: 1px solid var(--color-borde);
}

.asesor-panel-header button {
	background: none;
	border: none;
	color: var(--color-texto-secundario);
	font-size: 1.2rem;
	line-height: 1;
	cursor: pointer;
}

.asesor-hilo {
	flex: 1;
	overflow-y: auto;
	padding: 0.75rem 1rem;
	display: flex;
	flex-direction: column;
	gap: 0.6rem;
}

.asesor-mensaje {
	padding: 0.55rem 0.75rem;
	border-radius: 8px;
	font-size: 0.85rem;
	line-height: 1.4;
	max-width: 88%;
}

.asesor-mensaje-usuario {
	align-self: flex-end;
	background: var(--color-primario);
	color: #ffffff;
}

.asesor-mensaje-bot {
	align-self: flex-start;
	background: var(--color-superficie-2);
	color: var(--color-texto);
}

.asesor-pensando {
	opacity: 0.6;
	font-style: italic;
}

.asesor-link-build {
	display: block;
	margin-top: 0.5rem;
	color: var(--color-primario);
	font-weight: 700;
	text-decoration: underline;
}

#asesor-form {
	display: flex;
	gap: 0.5rem;
	padding: 0.75rem;
	border-top: 1px solid var(--color-borde);
}

#asesor-input {
	flex: 1;
	resize: none;
	padding: 0.5rem;
	background: var(--color-superficie-2);
	color: var(--color-texto);
	border: 1px solid var(--color-borde);
	border-radius: 6px;
	font-size: 0.85rem;
}

#asesor-enviar {
	padding: 0 1rem;
	background: var(--color-primario);
	color: #ffffff;
	border: none;
	border-radius: 6px;
	font-weight: 700;
	cursor: pointer;
}

#asesor-enviar:disabled {
	opacity: 0.6;
	cursor: default;
}

.tienda-sticky-carrito {
	position: fixed;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 9998;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	padding: 0.75rem 1.25rem;
	background: var(--color-superficie);
	border-top: 1px solid var(--color-borde);
	box-shadow: 0 -4px 16px rgba(0, 0, 0, 0.35);
}

.tienda-sticky-carrito[hidden] {
	display: none;
}

/* Keep the chat bubble/panel clear of the sticky add-to-cart bar. */
body.tienda-barra-fija-visible .asesor-burbuja {
	bottom: calc(1.5rem + 64px);
}

body.tienda-barra-fija-visible .asesor-panel {
	bottom: calc(5.5rem + 64px);
}

.tienda-sticky-carrito-info {
	display: flex;
	flex-direction: column;
	min-width: 0;
}

.tienda-sticky-carrito-nombre {
	font-weight: 700;
	color: var(--color-texto);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.tienda-sticky-carrito-precio {
	color: var(--color-texto-secundario);
	font-size: 0.85rem;
}

#tienda-sticky-carrito-boton {
	flex-shrink: 0;
	height: 44px;
	padding: 0 1.5rem;
	background: var(--color-primario);
	color: #ffffff;
	border: none;
	border-radius: 6px;
	font-weight: 700;
	cursor: pointer;
}

#tienda-sticky-carrito-boton:hover {
	background: var(--color-primario-hover);
}

#tienda-sticky-carrito-boton:disabled {
	opacity: 0.6;
	cursor: default;
}

.faq-lista {
	display: flex;
	flex-direction: column;
	gap: 0.6rem;
	max-width: 760px;
}

.faq-item {
	background: var(--color-superficie);
	border: 1px solid var(--color-borde);
	border-radius: 8px;
	padding: 0.9rem 1.1rem;
}

.faq-pregunta {
	cursor: pointer;
	font-weight: 700;
	color: var(--color-texto);
	list-style: none;
}

.faq-pregunta::-webkit-details-marker {
	display: none;
}

.faq-pregunta::before {
	content: '+';
	display: inline-block;
	width: 1.2em;
	color: var(--color-primario);
	font-weight: 700;
}

.faq-item[open] .faq-pregunta::before {
	content: '\2212';
}

.faq-respuesta {
	margin: 0.75rem 0 0 1.2em;
	color: var(--color-texto-secundario);
	line-height: 1.5;
}

.tienda-pie-extra {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 1.25rem;
	padding-bottom: 1rem;
	margin-bottom: 1rem;
	border-bottom: 1px solid var(--color-borde);
	color: var(--color-texto-secundario);
}

.tienda-pie-social a {
	color: var(--color-texto-secundario);
	display: inline-flex;
}

.tienda-pie-social a:hover {
	color: var(--color-primario);
}

.tienda-pie-pagos {
	display: flex;
	gap: 0.75rem;
	list-style: none;
	margin: 0;
	padding: 0;
}

.tienda-pie-pago-insignia {
	display: flex;
	align-items: center;
	line-height: 0;
}

.tienda-pie-pago-insignia svg {
	border-radius: 3px;
	box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.08);
}

.tienda-banner-promo {
	background: var(--color-primario);
	color: #ffffff;
	text-align: center;
	font-size: 0.85rem;
	font-weight: 600;
	padding: 0.6rem 2.5rem 0.6rem 1rem;
	position: relative;
}

.tienda-banner-promo a {
	color: #ffffff;
	text-decoration: none;
}

.tienda-banner-promo-inner {
	max-width: 1200px;
	margin: 0 auto;
	position: relative;
}

.tienda-banner-promo-contador {
	font-variant-numeric: tabular-nums;
	opacity: 0.9;
	margin-left: 0.4rem;
}

.tienda-banner-promo-cerrar {
	position: absolute;
	right: 0.5rem;
	top: 50%;
	transform: translateY(-50%);
	background: none;
	border: none;
	color: #ffffff;
	font-size: 1.1rem;
	line-height: 1;
	cursor: pointer;
	opacity: 0.85;
}

.tienda-banner-promo-cerrar:hover {
	opacity: 1;
}

.tienda-selector-idioma {
	display: flex;
	justify-content: flex-end;
	gap: 0.75rem;
	list-style: none;
	margin: 0;
	padding: 0.4rem 1.5rem;
	font-size: 0.78rem;
	background: var(--color-superficie-2);
	border-bottom: 1px solid var(--color-borde);
}

.tienda-selector-idioma a {
	color: var(--color-texto-secundario);
	text-decoration: none;
}

.tienda-selector-idioma .current-lang a {
	color: var(--color-primario);
	font-weight: 700;
}

.asesor-tabs {
	display: flex;
	border-bottom: 1px solid var(--color-borde);
}

.asesor-tab {
	flex: 1;
	padding: 0.6rem 0.5rem;
	background: var(--color-superficie);
	color: var(--color-texto-secundario);
	border: none;
	font-size: 0.78rem;
	font-weight: 700;
	cursor: pointer;
}

.asesor-tab.activo {
	color: var(--color-texto);
	background: var(--color-superficie-2);
	box-shadow: inset 0 -2px 0 var(--color-primario);
}

.asesor-vista {
	display: flex;
	flex-direction: column;
	flex: 1;
	min-height: 0;
}

.asesor-vista[hidden] {
	display: none;
}

.asesor-orden-ayuda {
	padding: 0.75rem 1rem 0;
	margin: 0;
	font-size: 0.8rem;
	color: var(--color-texto-secundario);
}

#asesor-orden-form {
	display: flex;
	flex-direction: column;
	gap: 0.5rem;
	padding: 0.75rem 1rem;
}

#asesor-orden-numero,
#asesor-orden-email {
	padding: 0.5rem;
	background: var(--color-superficie-2);
	color: var(--color-texto);
	border: 1px solid var(--color-borde);
	border-radius: 6px;
	font-size: 0.85rem;
}

#asesor-orden-enviar {
	padding: 0.5rem 1rem;
	background: var(--color-primario);
	color: #ffffff;
	border: none;
	border-radius: 6px;
	font-weight: 700;
	cursor: pointer;
}

#asesor-orden-enviar:disabled {
	opacity: 0.6;
	cursor: default;
}

#asesor-orden-resultado {
	padding: 0 1rem 0.75rem;
	font-size: 0.82rem;
	color: var(--color-texto);
}

#asesor-orden-resultado p {
	margin: 0.15rem 0;
}
