/* Definición de la variable de color principal */
:root {
	--custom-purple: #8d268c;
	--custom-purple-rgb: 141, 38, 140; /* RGB para Bootstrap utilities */

    /* Variables de Bootstrap sobreescritas para usar el color morado */
    --bs-primary: var(--custom-purple);
    --bs-primary-rgb: var(--custom-purple-rgb);

    /* NUEVO: Definición del gris para botones secundarios/Volver */
    --bs-secondary: #6c757d; /* Gris oscuro estándar de Bootstrap */
    --bs-secondary-rgb: 108, 117, 125;
}

/* ======================================================= */
/* ESTILOS DE COMPONENTES COMUNES (Encabezados, Pestañas, Botones) */
/* ======================================================= */

/* Clase unificada para títulos de sección (usada en .card-header o div de título) */
.q-section-title, .card-header {
    background-color: var(--custom-purple) !important;
    color: white !important;
    padding: 0.5rem 1rem;
    margin-bottom: 1rem;
    border-radius: 0.3rem 0.3rem 0 0; /* Solo esquinas superiores para card-header */
    font-weight: bold;
}
/* Ajuste para la clase específica si no es un card-header, asegurando radio completo */
.q-section-title:not(.card-header) {
    border-radius: 0.3rem;
}


/* Estilos de las Pestañas (Nav-Tabs) */
.nav-tabs .nav-link.active {
	color: white !important;
	background-color: var(--custom-purple) !important;
	border-color: var(--custom-purple);
}
.nav-tabs .nav-link {
	color: var(--custom-purple);
}

/* Estilo para el total a pagar (color morado) */
.card-body .fs-5 {
	color: var(--custom-purple);
}

/* MODIFICADO: Botón principal de Acción (Morado: Pagar, Consultar, Siguiente) */
.btn-primary {
	--bs-btn-color: #fff;
	--bs-btn-bg: var(--custom-purple);
	--bs-btn-border-color: var(--custom-purple);
	--bs-btn-hover-color: #fff;
	--bs-btn-hover-bg: #9E379D; /* Un poco más claro al pasar el ratón */
	--bs-btn-hover-border-color: #9E379D;
	--bs-btn-focus-shadow-rgb: var(--custom-purple-rgb);
	--bs-btn-active-color: #fff;
	--bs-btn-active-bg: #7C217B; /* Más oscuro al presionar */
	--bs-btn-active-border-color: #7C217B;
}

/* AÑADIDO: Botón Secundario (Gris: Volver, Cancelar) */
.btn-secondary {
    --bs-btn-color: #fff;
    --bs-btn-bg: var(--bs-secondary);
    --bs-btn-border-color: var(--bs-secondary);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #5c636a; 
    --bs-btn-hover-border-color: #565e64;
    --bs-btn-focus-shadow-rgb: var(--bs-secondary-rgb);
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #565e64; 
    --bs-btn-active-border-color: #51585e;
}


/* Estilo para el prefijo "04" en el campo Siniestro */
.input-group-text.bg-custom-purple {
    background-color: var(--custom-purple) !important;
    color: white; 
    font-weight: bold;
}

/* ======================================================= */
/* ESTILOS DE AJUSTES Y RESPONSIVIDAD */
/* ======================================================= */

/* Sombra ligera y bordes redondeados para la tarjeta */
.card {
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    border-radius: 0.5rem;
}

/* Pequeños ajustes para la responsividad de etiquetas y campos en móviles */
@media (max-width: 576px) {
	.form-label {
		margin-bottom: 0.2rem;
		font-size: 0.9rem;
	}
	.form-control, .form-select {
		font-size: 0.9rem;
	}
}

/* Estilos de íconos */
[class*='fa-']:before {
	padding-right: 15px;
	padding-left: 15px;
	font-size: 2.5rem;
}

/* Estilos de AUI remanentes */
.aui button { 
	margin: 5px;
}

/* Asegura que el texto en el card-footer con información de contacto sea legible */
.card-footer p {
	font-size: 0.9rem;
}