/* Permutalia Asistencia — parte pública. Mobile first. */
.pmta-pagina { display: block; padding: 32px 0 40px; }
@media (max-width: 782px) { .pmta-pagina { padding-bottom: 160px; } } /* Deja sitio a la barra inferior móvil y al botón «+», que si no tapan el último botón. */
.pmta {
	/* Colores de la web (variables del CSS unificado); el segundo valor es el respaldo. */
	--pmta-granate: var(--pm-coral-btn, #f8585e);      /* fondo del botón principal */
	--pmta-granate-osc: var(--pm-coral-d, #c8383f);    /* hover, enlaces y texto de acento */
	--pmta-navy: var(--pm-tinta, #1f2a33);
	--pmta-crema: var(--pm-fondo, #f7f5f2);
	--pmta-oro: var(--pm-rosa-b, #fbc9cb);
	--pmta-gris: var(--pm-gris, #5e6770);
	--pmta-linea: var(--pm-borde, #e6e1dc);
	--pmta-ok: var(--pm-ok, #276b4e);
	max-width: 640px;
	margin: 0 auto;
	padding: 8px 16px 40px;
	color: var(--pmta-navy);
	font-size: 16px;
	line-height: 1.55;
	box-sizing: border-box;
}
.pmta *, .pmta *::before, .pmta *::after { box-sizing: border-box; }
/* La web fuerza su letra general con !important; aquí se usa su misma variable de títulos. */
html body #pmta h2, html body #pmta h3, html body #pmta .pmta-titulo { font-family: var(--pm-font-titulos, Merriweather, Georgia, "Times New Roman", serif) !important; }
.pmta h2 { font-size: 1.3rem; line-height: 1.25; margin: 0 0 10px; color: var(--pmta-navy); text-wrap: balance; }
.pmta p { margin: 0 0 12px; }
.pmta-titulo { font-size: 1.05rem; margin: 28px 0 10px; color: var(--pmta-navy); }
.pmta-sobre { font-size: .8rem; letter-spacing: .06em; text-transform: uppercase; color: var(--pmta-granate-osc); font-weight: 700; margin: 0 0 8px; }
.pmta-nota { font-size: .875rem; color: var(--pmta-gris); margin-top: 12px; }

.pmta-card { background: #fff; border: 1px solid var(--pmta-linea); border-radius: 12px; padding: 18px; margin: 0 0 14px; }
.pmta-card--accion { background: var(--pmta-crema); border-color: var(--pmta-oro); border-top: 4px solid var(--pmta-granate); }

.pmta-boton {
	display: block; width: 100%; text-align: center; cursor: pointer;
	background: var(--pmta-granate); color: #fff !important; border: 2px solid var(--pmta-granate);
	border-radius: 10px; padding: 14px 18px; font-size: 1rem; font-weight: 700; text-decoration: none; margin: 10px 0 0; font-family: inherit;
}
.pmta-boton:hover, .pmta-boton:focus-visible { background: var(--pmta-granate-osc); border-color: var(--pmta-granate-osc); }
.pmta-boton:focus-visible, .pmta input:focus-visible, .pmta select:focus-visible { outline: 3px solid var(--pmta-navy); outline-offset: 2px; }
.pmta-boton--sec { background: #fff; color: var(--pmta-granate-osc) !important; }
.pmta-boton--sec:hover, .pmta-boton--sec:focus-visible { background: var(--pmta-crema); border-color: var(--pmta-granate); }
.pmta-botones { display: grid; gap: 0; }
.pmta-enlace { color: var(--pmta-granate-osc); font-weight: 700; }

.pmta-aviso { border-radius: 10px; padding: 12px 14px; margin: 0 0 14px; border: 1px solid; }
.pmta-aviso p { margin: 0 0 4px; }
.pmta-aviso--ok { background: #eef7f1; border-color: #b9dcc8; color: #14532d; }
.pmta-aviso--error { background: #fdf1f1; border-color: #eab8bd; color: var(--pm-coral-d, #c8383f); }

.pmta-fases { list-style: none; display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); gap: 4px; margin: 0 0 16px; padding: 0; font-size: .62rem; letter-spacing: -.01em; text-align: center; color: var(--pmta-gris); }
.pmta-fases li { min-width: 0; }
.pmta-fases span { display: grid; place-items: center; width: 26px; height: 26px; margin: 0 auto 4px; border-radius: 50%; border: 2px solid var(--pmta-linea); background: #fff; font-weight: 700; font-variant-numeric: tabular-nums; }
.pmta-fases .hecha span { background: var(--pmta-navy); border-color: var(--pmta-navy); color: #fff; }
.pmta-fases .actual { color: var(--pmta-granate-osc); font-weight: 700; }
.pmta-fases .actual span { border-color: var(--pmta-granate); color: var(--pmta-granate-osc); }

.pmta-tablero { display: grid; gap: 12px; }
.pmta-parte { margin: 0; }
.pmta-parte--yo { border-color: var(--pmta-navy); }
.pmta-parte__quien { font-weight: 700; margin: 0 0 2px; }
.pmta-parte__plaza { margin: 0; overflow-wrap: anywhere; }
.pmta-parte__destino { font-size: .875rem; color: var(--pmta-gris); margin: 2px 0 10px; overflow-wrap: anywhere; }
.pmta-checks { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; font-size: .9rem; }
.pmta-checks li { padding-left: 28px; position: relative; color: var(--pmta-gris); }
.pmta-checks li::before { content: ""; position: absolute; left: 0; top: 2px; width: 18px; height: 18px; border-radius: 50%; border: 2px solid var(--pmta-linea); background: #fff; }
.pmta-checks li.ok { color: var(--pmta-navy); }
.pmta-checks li.ok::before { background: var(--pmta-ok); border-color: var(--pmta-ok); }
.pmta-checks li.ok::after { content: ""; position: absolute; left: 6px; top: 5px; width: 5px; height: 9px; border: solid #fff; border-width: 0 2px 2px 0; transform: rotate(45deg); }

.pmta-pill { display: inline-block; font-size: .78rem; font-weight: 700; padding: 4px 10px; border-radius: 999px; background: var(--pmta-crema); border: 1px solid var(--pmta-linea); color: var(--pmta-navy); white-space: nowrap; }
.pmta-pill--concedida { background: #eef7f1; border-color: #b9dcc8; color: #14532d; }
.pmta-pill--denegada, .pmta-pill--cancelado, .pmta-pill--no_viable { background: #fdf1f1; border-color: #eab8bd; color: var(--pm-coral-d, #c8383f); }
.pmta-fila { display: flex; justify-content: space-between; align-items: center; gap: 12px; text-decoration: none; color: inherit; }
.pmta-fila small { color: var(--pmta-gris); }

.pmta-plazas, .pmta-pasos-txt { margin: 0 0 14px; padding-left: 20px; }
.pmta-plazas li, .pmta-pasos-txt li { margin-bottom: 4px; overflow-wrap: anywhere; }
.pmta-fecha { font-size: 1.05rem; }

.pmta-campo { display: block; margin: 0 0 14px; }
.pmta-campo > span { display: block; font-weight: 700; font-size: .92rem; margin-bottom: 5px; }
.pmta-campo small { display: block; color: var(--pmta-gris); font-size: .82rem; margin-top: 4px; }
.pmta-campo input, .pmta-campo select {
	width: 100%; min-height: 48px; padding: 10px 12px; font-size: 16px; font-family: inherit;
	color: var(--pmta-navy); background: #fff; border: 1px solid #c9c0b0; border-radius: 8px;
}
.pmta-campo input[type="file"] { padding: 10px; }
.pmta-check { display: flex; gap: 10px; align-items: flex-start; font-size: .9rem; margin: 6px 0 8px; }
.pmta-check input { width: 20px; height: 20px; margin-top: 2px; flex: none; accent-color: var(--pmta-granate); }

@media (min-width: 600px) {
	.pmta-fases { font-size: .8rem; }
	.pmta-botones { grid-template-columns: repeat(3, 1fr); gap: 10px; }
	.pmta-tablero { grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); }
}

/* Caja del servicio en la ficha del anuncio: usa las clases de la ficha y solo añade separación. */
.pmta-ficha .pmta-ficha__plan { margin-top: 10px; }
.pmta-ficha .pmt-f-btn { margin-top: 12px; }

.pmta-campo > span .pmta-opc { display: inline; font-weight: 400; color: var(--pmta-gris); font-size: .82rem; margin: 0; }

/* Formulario en dos pantallas (solo con JavaScript; sin él se ven seguidas). */
.pmta-paso__t { font-size: .95rem; margin: 6px 0 14px; color: var(--pmta-granate-osc); font-family: inherit !important; }
.pmta-form-pasos .pmta-sig, .pmta-form-pasos .pmta-atras { display: none; }
.pmta-form-pasos.pmta-js .pmta-sig { display: block; }
.pmta-form-pasos.pmta-js .pmta-atras { display: block; width: 100%; background: none; border: 0; padding: 14px 0 0; cursor: pointer; font-size: .95rem; font-family: inherit; }
.pmta-form-pasos.pmta-js[data-en="1"] .pmta-paso[data-paso="2"], .pmta-form-pasos.pmta-js[data-en="2"] .pmta-paso[data-paso="1"] { display: none; }
.pmta-instr { margin: 0 0 14px; }
.pmta-instr summary { cursor: pointer; font-weight: 700; margin-bottom: 8px; }
.pmta-instr ol { margin: 0; padding-left: 20px; }
.pmta-instr li { margin-bottom: 6px; }
.pmta-pill--descartado { background: #fdf1f1; border-color: #eab8bd; color: var(--pm-coral-d, #c8383f); }

/* 1.4.3 · El CSS general de la web encogía el texto de los botones (11 px). Se fija aquí. */
html body #pmta .pmta-boton { font-size: 1rem !important; font-weight: 700 !important; line-height: 1.35 !important; letter-spacing: 0 !important; text-transform: none !important; }
