/* Presupuestador Protecnia. Toma los colores del tema si los define (theme.json), si no usa los suyos. */
.pp, .pp-kits, .pp-doc {
	--pp-primario: var(--wp--preset--color--primario, #1d7a3e);
	--pp-primario-osc: var(--wp--preset--color--primario-oscuro, #145c2d);
	--pp-acento: var(--wp--preset--color--acento, #1f4e9c);
	--pp-texto: var(--wp--preset--color--texto, #18212b);
	--pp-suave: var(--wp--preset--color--texto-suave, #5b6876);
	--pp-fondo: var(--wp--preset--color--fondo, #ffffff);
	--pp-fondo-alt: var(--wp--preset--color--fondo-alt, #f3f6f4);
	--pp-borde: var(--wp--preset--color--borde, #dfe5e1);
	--pp-radio: 14px;
	color: var(--pp-texto);
}

.pp *, .pp-kits * { box-sizing: border-box; }

/* Botones */
.pp-boton {
	display: inline-flex; align-items: center; justify-content: center; gap: .5em;
	padding: .75em 1.4em; border: 0; border-radius: 999px;
	background: var(--pp-primario); color: #fff !important; font: inherit; font-weight: 600;
	text-decoration: none !important; cursor: pointer; transition: background .15s, transform .15s;
}
.pp-boton:hover { background: var(--pp-primario-osc); }
.pp-boton:active { transform: translateY(1px); }
.pp-boton:disabled { opacity: .6; cursor: progress; }
.pp-boton--grande { font-size: 1.1em; padding: .9em 2em; }

/* Avisos */
.pp-aviso { padding: 1em 1.25em; border-radius: var(--pp-radio); margin: 0 0 1.5em; }
.pp-aviso:focus { outline: 2px solid currentColor; outline-offset: 2px; }
.pp-aviso ul { margin: .4em 0 0; padding-left: 1.2em; }
.pp-aviso--error { background: #fdecec; color: #8a1c1c; border: 1px solid #f3c2c2; }
.pp-aviso--ok { background: #e8f5ec; color: #145c2d; border: 1px solid #bfe3cb; }

/* Tarjetas de kits */
.pp-kits { display: grid; grid-template-columns: repeat(var(--pp-columnas, 3), minmax(0, 1fr)); gap: 1.5rem; }
@media (max-width: 960px) { .pp-kits { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 600px) { .pp-kits { grid-template-columns: 1fr; } }
.pp-kit {
	display: flex; flex-direction: column; background: var(--pp-fondo); border: 1px solid var(--pp-borde);
	border-radius: var(--pp-radio); overflow: hidden; transition: box-shadow .2s, transform .2s;
}
.pp-kit:hover { box-shadow: 0 12px 30px rgba(16, 40, 24, .12); transform: translateY(-2px); }
.pp-kit-img { display: block; aspect-ratio: 4 / 3; background: var(--pp-fondo-alt); }
.pp-kits .pp-kit-img img { width: 100%; height: 100%; object-fit: contain; padding: 1rem; display: block; }
.pp-kit-txt { display: flex; flex-direction: column; flex: 1; padding: 1.25rem 1.4rem 1.4rem; }
.pp-kit-txt h3 { margin: 0 0 .5rem; font-size: 1.25rem; }
.pp-kit-txt h3 a { color: inherit; text-decoration: none; }
.pp-kit-txt p { margin: 0 0 1rem; color: var(--pp-suave); font-size: .95rem; }
.pp-kit-pie { margin-top: auto; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .75rem; }
.pp-kit-desde { color: var(--pp-suave); font-size: .9rem; }
.pp-kit-desde strong { color: var(--pp-texto); font-size: 1.15rem; }

/* Configurador */
.pp { margin-top: 2rem; }
.pp-cuerpo { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 2rem; align-items: start; }
@media (max-width: 960px) { .pp-cuerpo { grid-template-columns: 1fr; } }

.pp-seccion { margin-bottom: 2rem; }
.pp-seccion-cab { display: flex; gap: 1rem; align-items: center; margin-bottom: 1rem; }
.pp-seccion-cab h3 { margin: 0; font-size: 1.3rem; }
.pp-seccion-img { width: 72px; height: 72px; object-fit: contain; border-radius: 10px; background: var(--pp-fondo-alt); }
.pp-seccion-desc { color: var(--pp-suave); font-size: .95rem; }
.pp-seccion-desc p { margin: .25em 0 0; }
.pp-ayuda { color: var(--pp-suave); font-size: .9rem; margin: -.25rem 0 .75rem; }

.pp-lineas { list-style: none; margin: 0; padding: 0; display: grid; gap: .75rem; }
.pp-linea {
	display: grid; grid-template-columns: 84px minmax(0, 1fr) auto 128px 96px; gap: 1rem; align-items: center;
	padding: .85rem 1rem; background: var(--pp-fondo); border: 1px solid var(--pp-borde); border-radius: var(--pp-radio);
	transition: border-color .15s, box-shadow .15s, background .15s;
}
.pp-linea.is-activa { border-color: var(--pp-primario); box-shadow: 0 0 0 1px var(--pp-primario) inset; background: color-mix(in srgb, var(--pp-primario) 4%, var(--pp-fondo)); }
.pp-linea-img { width: 84px; height: 72px; display: flex; align-items: center; justify-content: center; background: #fff; border-radius: 10px; overflow: hidden; }
.pp-linea-img img { max-width: 100%; max-height: 100%; width: auto; height: auto; object-fit: contain; }
.pp-linea-nombre { display: block; font-weight: 600; line-height: 1.3; cursor: pointer; }
.pp-etiqueta { display: inline-block; margin-top: .3rem; padding: .1rem .55rem; border-radius: 999px; background: var(--pp-primario); color: #fff; font-size: .75rem; font-weight: 600; }
.pp-linea-mas { margin-top: .3rem; font-size: .9rem; color: var(--pp-suave); }
.pp-linea-mas summary { cursor: pointer; color: var(--pp-acento); width: max-content; }
.pp-linea-mas div { margin-top: .4rem; }
.pp-linea-mas p { margin: 0 0 .4em; }
.pp-linea-precio { font-weight: 600; white-space: nowrap; text-align: right; }
.pp-linea-precio small { font-weight: 400; color: var(--pp-suave); margin-left: .2em; }
.pp-linea-control { display: flex; justify-content: center; }
.pp-linea-importe { text-align: right; font-weight: 700; color: var(--pp-primario-osc); white-space: nowrap; }

.pp-paso { display: inline-flex; align-items: stretch; border: 1px solid var(--pp-borde); border-radius: 999px; overflow: hidden; background: #fff; }
.pp-paso-btn { width: 2.25rem; border: 0; background: transparent; font-size: 1.15rem; line-height: 1; cursor: pointer; color: var(--pp-texto); }
.pp-paso-btn:hover { background: var(--pp-fondo-alt); }
.pp-cantidad { width: 3rem; border: 0; text-align: center; font: inherit; font-weight: 600; padding: .45rem 0; background: transparent; -moz-appearance: textfield; appearance: textfield; }
.pp-cantidad::-webkit-outer-spin-button, .pp-cantidad::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.pp-linea--fija .pp-cantidad { border: 1px solid var(--pp-borde); border-radius: 999px; color: var(--pp-suave); }
.pp-opcion { width: 1.4rem; height: 1.4rem; accent-color: var(--pp-primario); cursor: pointer; }
.pp-interruptor { appearance: none; width: 2.8rem; height: 1.6rem; border-radius: 999px; background: var(--pp-borde); position: relative; transition: background .15s; }
.pp-interruptor::after { content: ""; position: absolute; top: .2rem; left: .2rem; width: 1.2rem; height: 1.2rem; border-radius: 50%; background: #fff; box-shadow: 0 1px 3px rgba(0,0,0,.25); transition: transform .15s; }
.pp-interruptor:checked { background: var(--pp-primario); }
.pp-interruptor:checked::after { transform: translateX(1.2rem); }
.pp-interruptor:focus-visible, .pp-opcion:focus-visible { outline: 2px solid var(--pp-acento); outline-offset: 2px; }

@media (max-width: 700px) {
	.pp-linea { grid-template-columns: 64px minmax(0, 1fr) auto; grid-template-areas: "img info info" "img precio control" ". importe importe"; row-gap: .5rem; }
	.pp-linea-img { grid-area: img; width: 64px; height: 56px; align-self: start; }
	.pp-linea-info { grid-area: info; }
	.pp-linea-precio { grid-area: precio; text-align: left; }
	.pp-linea-control { grid-area: control; justify-content: flex-end; }
	.pp-linea-importe { grid-area: importe; }
	.pp-linea-importe:empty { display: none; }
}

/* Resumen */
.pp-resumen { position: sticky; top: calc(var(--wp-admin--admin-bar--height, 0px) + 96px); }
.pp-resumen-caja { background: var(--pp-fondo-alt); border-radius: calc(var(--pp-radio) + 4px); padding: 1.5rem; }
.pp-resumen h3 { margin: 0 0 1rem; font-size: 1.2rem; }
.pp-resumen-lineas { list-style: none; margin: 0 0 1rem; padding: 0 0 1rem; border-bottom: 1px solid var(--pp-borde); font-size: .92rem; max-height: 40vh; overflow: auto; }
.pp-resumen-lineas li { display: flex; justify-content: space-between; gap: 1rem; padding: .3rem 0; }
.pp-resumen-lineas li span:last-child { white-space: nowrap; font-weight: 600; }
.pp-resumen-vacio { color: var(--pp-suave); }
.pp-totales { margin: 0 0 1.25rem; }
.pp-totales > div { display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding: .3rem 0; }
.pp-totales dt { color: var(--pp-suave); }
.pp-totales dd { margin: 0; font-weight: 600; white-space: nowrap; }
.pp-total { margin-top: .4rem; padding-top: .7rem !important; border-top: 2px solid var(--pp-texto); }
.pp-total dt { color: var(--pp-texto); font-weight: 700; }
.pp-total dd { font-size: 1.6rem; font-weight: 800; color: var(--pp-primario-osc); }
.pp-importe { width: 7.5rem; text-align: right; padding: .35rem .6rem; border: 1px solid var(--pp-borde); border-radius: 8px; font: inherit; }
.pp-interno dt::before { content: "Interno · "; color: var(--pp-acento); font-size: .8em; font-weight: 600; }
.pp-resumen .pp-boton { width: 100%; }
.pp-llamar { margin: 1rem 0 0; text-align: center; font-size: .9rem; color: var(--pp-suave); }
.pp-llamar a { font-weight: 700; color: var(--pp-primario-osc); white-space: nowrap; }
@media (max-width: 960px) { .pp-resumen { position: static; } }

/* Datos del cliente */
.pp-datos { margin-top: 2.5rem; padding: 2rem; border: 1px solid var(--pp-borde); border-radius: calc(var(--pp-radio) + 4px); scroll-margin-top: 100px; }
.pp-datos h3 { margin: 0 0 .5rem; font-size: 1.3rem; }
.pp-datos-aviso { color: var(--pp-suave); margin: 0 0 1.5rem; }
.pp-campos { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem 1.5rem; }
@media (max-width: 700px) { .pp-campos { grid-template-columns: 1fr; } .pp-datos { padding: 1.25rem; } }
.pp-campo { margin: 0; display: flex; flex-direction: column; gap: .35rem; }
.pp-campo--ancho { grid-column: 1 / -1; }
.pp-campo label { font-weight: 600; font-size: .92rem; }
.pp-campo input:not([type="checkbox"]), .pp-campo textarea {
	width: 100%; padding: .7rem .85rem; border: 1px solid var(--pp-borde); border-radius: 10px; font: inherit; background: #fff; color: var(--pp-texto);
}
.pp-campo input:focus, .pp-campo textarea:focus, .pp-importe:focus { outline: 2px solid var(--pp-primario); outline-offset: 1px; border-color: transparent; }
.pp-campo small { color: var(--pp-suave); }
.pp-campo.is-error input, .pp-campo.is-error textarea { border-color: #c62828; background: #fff6f6; }
.pp-acepto { flex-direction: row; align-items: flex-start; gap: .6rem; }
.pp-acepto input { width: 1.2rem; height: 1.2rem; margin-top: .15rem; accent-color: var(--pp-primario); flex: none; }
.pp-acepto label { font-weight: 400; }
.pp-acepto.is-error label { color: #c62828; }
.pp-trampa { position: absolute !important; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.pp-enviar { margin: 1.75rem 0 0; display: flex; flex-wrap: wrap; align-items: center; gap: 1rem; }
.pp-enviar span { color: var(--pp-suave); font-size: .9rem; }

.pp-pie { margin-top: 2.5rem; padding: 1.5rem 2rem; background: var(--pp-fondo-alt); border-radius: calc(var(--pp-radio) + 4px); font-size: .95rem; }
.pp-pie > :first-child { margin-top: 0; }
.pp-pie > :last-child { margin-bottom: 0; }

/* Página del presupuesto guardado */
.pp-doc-acciones { display: flex; flex-wrap: wrap; gap: .75rem; align-items: center; margin: 0 0 1.5rem; }
.pp-boton--claro { background: var(--pp-fondo-alt); color: var(--pp-texto) !important; }
.pp-boton--claro:hover { background: var(--pp-borde); }
.pp-doc-marco { background: #fff; border: 1px solid var(--pp-borde); border-radius: var(--pp-radio); padding: clamp(1rem, 4vw, 2.5rem); overflow-x: auto; }

@media print {
	body * { visibility: hidden; }
	.pp-doc-marco, .pp-doc-marco * { visibility: visible; }
	.pp-doc-marco { position: absolute; inset: 0 auto auto 0; width: 100%; border: 0; padding: 0; }
}
.pp-kit-info { margin-top: 3.5rem; padding-top: 2.5rem; border-top: 1px solid var(--wp--preset--color--borde, #dfe5e1); }
.pp-kit-info > h2 { margin-top: 0; }
