/* ==========================================================================
   GRUPO ARMA FORMACIÓN — Estilos de marca
   Paleta tomada de la web original (academiaarma.com)
   ========================================================================== */

:root {
	--arma-primary: #6366F1;
	--arma-primary-dark: #4F46E5;
	--arma-dark: #0F172A;
	--arma-text: #334155;
	--arma-muted: #64748B;
	--arma-border: #E2E8F0;
	--arma-light: #F8FAFC;
	--arma-indigo-bg: #EEF2FF;
	--arma-red: #DC2626;
	--arma-radius: 14px;
	--arma-shadow: 0 6px 24px rgba(15, 23, 42, 0.06);
	--arma-shadow-hover: 0 10px 30px rgba(99, 102, 241, 0.15);
}

/* ==========================================================================
   1. CABECERA: logo a tamaño normal y menú limpio
   ========================================================================== */

.site-header,
header.site-header,
header#site-header {
	background-color: #ffffff !important;
	border-bottom: 1px solid var(--arma-border);
}

/* Logo: nunca más grande de 150px de ancho */
.site-header .site-branding img,
.site-header .custom-logo,
.site-header .custom-logo-link img,
.site-branding img,
img.custom-logo {
	max-width: 150px !important;
	width: auto;
	height: auto !important;
}

/* Enlaces del menú principal */
.site-header nav a,
.site-navigation a,
.site-navigation ul li a,
nav.site-navigation ul.menu > li > a {
	color: var(--arma-dark) !important;
	font-weight: 600;
	font-size: 15px;
	text-transform: none;
	text-decoration: none;
	transition: color 0.2s ease;
}

.site-header nav a:hover,
.site-navigation a:hover,
.site-navigation ul li a:hover,
.site-navigation ul li.current-menu-item > a,
.site-navigation ul li.current_page_item > a {
	color: var(--arma-primary) !important;
}

/* ==========================================================================
   2. TIENDA (listado de productos): tarjetas como la web antigua
   ========================================================================== */

.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product {
	background: #ffffff;
	border: 1px solid var(--arma-border);
	border-radius: var(--arma-radius);
	box-shadow: var(--arma-shadow);
	padding: 14px 14px 18px;
	transition: transform 0.2s ease, box-shadow 0.2s ease;
	overflow: hidden;
}

.woocommerce ul.products li.product:hover {
	transform: translateY(-3px);
	box-shadow: var(--arma-shadow-hover);
}

.woocommerce ul.products li.product a img {
	border-radius: 10px;
	margin-bottom: 12px;
}

/* Título del curso */
.woocommerce ul.products li.product .woocommerce-loop-product__title,
.woocommerce ul.products li.product h2 {
	color: var(--arma-dark) !important;
	font-size: 1.02rem;
	font-weight: 700;
	line-height: 1.35;
	padding-top: 0;
}

/* Precio en índigo, bien visible */
.woocommerce ul.products li.product .price,
.woocommerce div.product p.price,
.woocommerce div.product span.price {
	color: var(--arma-primary-dark) !important;
	font-weight: 800;
	font-size: 1.2rem;
}

.woocommerce ul.products li.product .price del,
.woocommerce div.product p.price del {
	color: var(--arma-muted) !important;
	font-weight: 500;
	opacity: 0.8;
}

/* Insignia de oferta */
.woocommerce span.onsale {
	background: var(--arma-red) !important;
	color: #fff !important;
	border-radius: 999px;
	font-weight: 700;
	font-size: 0.78rem;
	padding: 4px 12px;
	line-height: 1.6;
	min-height: 0;
	min-width: 0;
}

/* ==========================================================================
   3. BOTONES (añadir al carrito, ver producto, checkout...)
   ========================================================================== */

.woocommerce #respond input#submit,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce button.button.alt,
.woocommerce a.button.alt,
.woocommerce input.button.alt,
.woocommerce #payment #place_order,
.woocommerce-page #payment #place_order,
.woocommerce button[name="add-to-cart"],
.woocommerce .single_add_to_cart_button {
	background-color: var(--arma-primary) !important;
	color: #ffffff !important;
	border: none;
	border-radius: 10px;
	font-weight: 600;
	padding: 10px 20px;
	transition: background-color 0.2s ease;
	text-transform: none;
}

.woocommerce #respond input#submit:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce button.button.alt:hover,
.woocommerce a.button.alt:hover,
.woocommerce #payment #place_order:hover,
.woocommerce .single_add_to_cart_button:hover {
	background-color: var(--arma-primary-dark) !important;
	color: #ffffff !important;
}

/* Botones deshabilitados */
.woocommerce a.button.disabled,
.woocommerce button.button.disabled,
.woocommerce input.button.disabled {
	background-color: var(--arma-muted) !important;
}

/* ==========================================================================
   4. FICHA DE PRODUCTO (página del curso)
   ========================================================================== */

.woocommerce div.product .product_title {
	color: var(--arma-dark);
	font-weight: 800;
}

/* Pestañas: Descripción / Información adicional / Valoraciones */
.woocommerce div.product .woocommerce-tabs ul.tabs {
	padding-left: 0;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li {
	background: var(--arma-light);
	border: 1px solid var(--arma-border);
	border-radius: 10px 10px 0 0;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li.active {
	background: #ffffff;
	border-bottom-color: #ffffff;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li a {
	color: var(--arma-muted);
	font-weight: 600;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li.active a {
	color: var(--arma-primary-dark);
}

/* Imagen principal del producto */
.woocommerce div.product div.images img {
	border-radius: var(--arma-radius);
}

/* ==========================================================================
   5. CARRITO Y FINALIZAR COMPRA
   ========================================================================== */

.woocommerce table.shop_table {
	border: 1px solid var(--arma-border);
	border-radius: var(--arma-radius);
	overflow: hidden;
}

.woocommerce table.shop_table th {
	background: var(--arma-light);
	color: var(--arma-dark);
}

.woocommerce-checkout #payment {
	background: var(--arma-light);
	border-radius: var(--arma-radius);
}

/* Avisos y mensajes */
.woocommerce-message,
.woocommerce-info {
	border-top-color: var(--arma-primary) !important;
}

.woocommerce-message::before,
.woocommerce-info::before {
	color: var(--arma-primary) !important;
}

.woocommerce-error {
	border-top-color: var(--arma-red) !important;
}

/* ==========================================================================
   6. DETALLES GENERALES
   ========================================================================== */

/* Migas de pan (Inicio / Tienda) */
.woocommerce .woocommerce-breadcrumb {
	color: var(--arma-muted);
	font-size: 0.88rem;
}

.woocommerce .woocommerce-breadcrumb a {
	color: var(--arma-muted);
}

.woocommerce .woocommerce-breadcrumb a:hover {
	color: var(--arma-primary);
}

/* Selector de orden y contador de resultados */
.woocommerce .woocommerce-ordering select {
	border: 1px solid var(--arma-border);
	border-radius: 10px;
	padding: 8px 12px;
	color: var(--arma-text);
	background-color: #ffffff;
}

.woocommerce .woocommerce-result-count {
	color: var(--arma-muted);
}

/* Paginación */
.woocommerce nav.woocommerce-pagination ul {
	border: none;
}

.woocommerce nav.woocommerce-pagination ul li {
	border: none;
	margin: 0 3px;
}

.woocommerce nav.woocommerce-pagination ul li a,
.woocommerce nav.woocommerce-pagination ul li span {
	border-radius: 10px;
	border: 1px solid var(--arma-border);
	color: var(--arma-text);
	padding: 8px 14px;
}

.woocommerce nav.woocommerce-pagination ul li span.current,
.woocommerce nav.woocommerce-pagination ul li a:hover {
	background: var(--arma-primary);
	color: #ffffff;
	border-color: var(--arma-primary);
}

/* Enlaces generales del contenido */
.woocommerce a:not(.button) {
	color: var(--arma-primary-dark);
}

/* Campos de formulario (checkout, cuenta) */
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select {
	border: 1px solid var(--arma-border);
	border-radius: 10px;
	padding: 10px 12px;
}

.woocommerce form .form-row input.input-text:focus,
.woocommerce form .form-row textarea:focus {
	border-color: var(--arma-primary);
	outline: none;
	box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.15);
}

/* ==========================================================================
   7. FICHA DE CURSO — bloques para la descripción del producto
   (usar dentro de <div class="arma-curso"> ... </div>)
   ========================================================================== */

.arma-curso {
	color: var(--arma-text);
	font-size: 15px;
	line-height: 1.65;
}

.arma-curso h3 {
	color: var(--arma-dark);
	font-weight: 800;
	font-size: 1.25rem;
	margin: 34px 0 14px;
}

/* Rejilla de datos: modalidad, duración, horas, plazas */
.arma-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
	gap: 12px;
	margin: 6px 0 10px;
}

.arma-info {
	background: var(--arma-light);
	border: 1px solid var(--arma-border);
	border-radius: 12px;
	padding: 13px 16px;
}

.arma-info small {
	display: block;
	color: var(--arma-muted);
	font-size: 12px;
	margin-bottom: 2px;
}

.arma-info strong {
	color: var(--arma-dark);
	font-size: 15px;
}

/* Caja destacada (metodología, avisos) */
.arma-box {
	background: var(--arma-light);
	border: 1px solid var(--arma-border);
	border-radius: 14px;
	padding: 18px 22px;
	margin: 10px 0;
}

/* Lista con checks verdes (programa formativo) */
ul.arma-checks {
	list-style: none !important;
	padding-left: 0 !important;
	margin: 10px 0;
}

ul.arma-checks li {
	position: relative;
	padding-left: 28px;
	margin-bottom: 9px;
	list-style: none;
}

ul.arma-checks li::before {
	content: "✓";
	position: absolute;
	left: 0;
	top: 0;
	color: #16A34A;
	font-weight: 800;
}

/* Lista simple con puntos índigo (requisitos) */
ul.arma-dots {
	list-style: none !important;
	padding-left: 0 !important;
	margin: 10px 0;
}

ul.arma-dots li {
	position: relative;
	padding-left: 20px;
	margin-bottom: 8px;
	list-style: none;
}

ul.arma-dots li::before {
	content: "•";
	position: absolute;
	left: 4px;
	color: var(--arma-primary);
	font-weight: 800;
}

/* Pastillas (salidas profesionales) */
.arma-pills span {
	display: inline-block;
	background: #ffffff;
	border: 1px solid var(--arma-border);
	border-radius: 999px;
	padding: 7px 15px;
	margin: 4px 8px 4px 0;
	font-size: 13.5px;
	font-weight: 600;
	color: var(--arma-text);
}

/* Opiniones de alumnos */
.arma-opiniones {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
	gap: 14px;
	margin: 10px 0;
}

.arma-op {
	background: #ffffff;
	border: 1px solid var(--arma-border);
	border-radius: 14px;
	padding: 16px 18px;
	box-shadow: var(--arma-shadow);
}

.arma-op .arma-stars {
	color: #F59E0B;
	font-size: 15px;
	letter-spacing: 2px;
	margin-bottom: 6px;
}

.arma-op em {
	display: block;
	color: var(--arma-text);
	font-size: 14px;
	margin-bottom: 10px;
}

.arma-op strong {
	color: var(--arma-dark);
	display: block;
	font-size: 14px;
}

.arma-op small {
	color: var(--arma-muted);
	font-size: 12.5px;
}

/* Botones de contacto al pie de la ficha */
.arma-cta {
	margin-top: 22px;
}

.arma-cta a {
	display: inline-block;
	border-radius: 10px;
	padding: 11px 20px;
	font-weight: 700;
	font-size: 14.5px;
	text-decoration: none !important;
	margin: 4px 10px 4px 0;
}

a.arma-btn-whatsapp {
	background: #DCFCE7;
	color: #15803D !important;
	border: 1px solid #BBF7D0;
}

a.arma-btn-whatsapp:hover {
	background: #BBF7D0;
}

a.arma-btn-tel {
	background: #ffffff;
	color: var(--arma-dark) !important;
	border: 1px solid var(--arma-border);
}

a.arma-btn-tel:hover {
	background: var(--arma-light);
}


/* ==========================================================================
   8. BOTÓN FLOTANTE DE WHATSAPP — "¿Te ayudamos?"
   ========================================================================== */

a.arma-wa-float {
	position: fixed;
	right: 18px;
	bottom: 18px;
	z-index: 99999;
	display: flex;
	align-items: center;
	gap: 8px;
	background: #25D366;
	color: #ffffff !important;
	font-weight: 700;
	font-size: 15px;
	padding: 12px 20px;
	border-radius: 999px;
	box-shadow: 0 8px 24px rgba(37, 211, 102, 0.4);
	text-decoration: none !important;
	transition: transform 0.15s ease, box-shadow 0.15s ease;
}

a.arma-wa-float:hover {
	transform: translateY(-2px);
	box-shadow: 0 12px 28px rgba(37, 211, 102, 0.5);
	color: #ffffff !important;
}

@media (max-width: 600px) {
	a.arma-wa-float span { display: none; }
	a.arma-wa-float { padding: 14px; }
}