/* ==========================================================================
   Oller del Mas — Contenido de experiencia
   · "Descripción" (título bajo el nombre del producto)
   · Incluye + Ficha técnica  → columna derecha (bajo el formulario)
   · Condiciones y canje | Política de cancelación → 2 columnas, ancho completo
   Editorial premium. Hereda del tema; cae a marca si no existe.
   ========================================================================== */
.odm-xpc {
	--xpc-dark: var(--color-dark, #242322);
	--xpc-muted: #8C8477;
	--xpc-accent: #B07D4B;
	--xpc-line: #E7DECF;
	--xpc-soft: #FBF6EC;
	font-family: var(--font-body, 'Source Sans 3', sans-serif);
	color: var(--xpc-dark);
}

/* --- Ajustes acotados SOLO a la ficha de experiencia (clase odm-experience) --- */
.woocommerce div.product.odm-experience .summary p.price { margin-top: 10px; }
.woocommerce div.product.odm-experience h1.product-title { padding-bottom: 0; }

/* --- Título "Descripción" bajo el nombre del producto --- */
.odm-xpc__desc-title {
	font-family: var(--font-serif, 'Playfair Display', Georgia, serif);
	font-size: 17px;
	font-weight: 500;
	letter-spacing: .01em;
	margin: 18px 0 6px;
	color: var(--color-dark, #242322);
}

/* --- Títulos de sección --- */
.odm-xpc__title {
	font-family: var(--font-serif, 'Playfair Display', Georgia, serif);
	font-size: 19px;
	font-weight: 500;
	margin: 0 0 14px;
	line-height: 1.2;
}

/* --- Bloques Incluye + Ficha técnica (columna derecha) --- */
.odm-xpc--summary { margin-top: 22px; }
.odm-xpc--summary .odm-xpc__block {
	border-top: 1px solid var(--xpc-line);
	padding-top: 20px;
	margin-top: 22px;
}
.odm-xpc--summary .odm-xpc__block:first-child {
	border-top: 0;
	padding-top: 0;
	margin-top: 0;
}

/* --- Incluye: lista con viñetas --- */
.odm-xpc__list { list-style: none; margin: 0; padding: 0; display: grid; gap: 9px; }
.odm-xpc__list li {
	position: relative; padding-left: 22px;
	font-size: 15px; line-height: 1.5;
}
.odm-xpc__list li::before {
	content: ''; position: absolute; left: 2px; top: 9px;
	width: 6px; height: 6px; border-radius: 50%; background: var(--xpc-accent);
}

/* --- Ficha técnica: rejilla --- */
.odm-xpc__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px 24px; }
.odm-xpc__item { display: flex; gap: 11px; align-items: flex-start; }
.odm-xpc__ic {
	width: 34px; height: 34px; flex: 0 0 auto; border-radius: 50%;
	background: #F1E6D4; color: var(--xpc-accent);
	display: flex; align-items: center; justify-content: center;
}
.odm-xpc__pair { display: flex; flex-direction: column; min-width: 0; }
.odm-xpc__label { font-size: 11px; letter-spacing: .09em; text-transform: uppercase; color: var(--xpc-muted); }
.odm-xpc__value { font-size: 15px; margin-top: 2px; }

/* --- Columna izquierda: Condiciones + Política, apiladas bajo la galería ---
   Se alinea bajo la galería (float:left). El ancho lo iguala el JS al de la
   galería (layout del tema con floats). */
.odm-xpc--left {
	clear: both;               /* por defecto se apila debajo de todo (móvil) */
	display: grid;
	gap: 14px;
	margin: 26px 0 30px;
}
/* Solo flota bajo la galería en el layout de 2 columnas (lo activa el JS). */
.odm-xpc--left.odm-xpc--aligned {
	clear: left;
	float: left;
}
@media (max-width: 782px) {
	.odm-xpc--left.odm-xpc--aligned { float: none; clear: both; width: auto !important; }
}
.odm-xpc__panel {
	background: var(--xpc-soft);
	border: 1px solid #EDE1CC;
	border-radius: 14px;
	padding: 18px 22px;
}
.odm-xpc__panel .odm-xpc__title { margin-bottom: 12px; }

.odm-xpc__cond { font-size: 14.5px; line-height: 1.6; color: #4A443C; }
.odm-xpc__cond > :first-child { margin-top: 0; }
.odm-xpc__cond > :last-child { margin-bottom: 0; }
.odm-xpc__cond p { margin: 0 0 8px; }
.odm-xpc__cond a { color: var(--xpc-accent); }

@media (max-width: 782px) {
	.odm-xpc__grid { grid-template-columns: 1fr; gap: 14px; }
}

/* --- Ajustes SOLO en la vista móvil de experiencia — no afectan a escritorio.
   El tema aplica `h2 { font-size:50px !important }` desde ≤1024px (agranda mis
   titulares de sección) y conmuta el layout por wp_is_mobile(): cubrimos ambos
   (clase odm-mobile + media query a 1024px) con !important para ganar. --- */
.woocommerce div.product.odm-experience.odm-mobile .product-title { font-size: 19px !important; margin-bottom: 15px !important; }
.odm-experience.odm-mobile .odm-xpc__desc-title { font-size: 17px !important; }
.odm-experience.odm-mobile .odm-xpc__title { font-size: 19px !important; }
.odm-experience.odm-mobile .odm-xpc--left { margin-left: 10px; margin-right: 10px; }
@media (max-width: 1024px) {
	.woocommerce div.product.odm-experience .product-title { font-size: 19px !important; margin-bottom: 15px !important; }
	.odm-experience .odm-xpc__desc-title { font-size: 17px !important; }
	.odm-experience .odm-xpc__title { font-size: 19px !important; }
	.odm-experience .odm-xpc--left { margin-left: 10px; margin-right: 10px; }
}