/* Estilos para el modal MdlSeguridadPersonalizada */

#MdlSeguridadPersonalizada .modal-body {
    padding: 30px 50px; /* Ya lo tenías inline, pero es bueno tenerlo aquí */
    text-align: center;
}

#MdlSeguridadPersonalizada .modal-body > div:first-child { /* El div con la X */
    background-color: #FF6A00;
    border-radius: 50%;
    width: 60px;
    height: 60px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 20px;
}

#MdlSeguridadPersonalizada .modal-body > div:first-child h1 { /* La X dentro del div */
    color: white;
    font-size: 40px;
    margin: 0;
}

#MdlSeguridadPersonalizada .security-title {
    font-family: 'Urbanist', sans-serif;
    font-weight: 700;
    font-size: 2.2em; /* Ajusta esto si es necesario */
    line-height: 1.1; /* Ajusta esto si es necesario */
    color: #333333;
    margin-bottom: 15px; /* Ajustado para más cercanía al texto superior */
    margin-top: 0; /* Asegura que no haya un margen superior extra si no lo quieres */
}

#MdlSeguridadPersonalizada .modal-body p {
    font-family: 'Urbanist', sans-serif;
    font-size: 15px;
    line-height: 1.4;
    color: #555555;
}

#MdlSeguridadPersonalizada .modal-body p b {
    color: #FF6A00; /* Color naranja para los números de WhatsApp y Si/No */
}

#MdlSeguridadPersonalizada .modal-body p:last-of-type { /* El párrafo de "Si ya confirmo..." */
    font-weight: bold;
    margin-top: 20px;
    margin-bottom: 0; /* Asegura que no haya margen extra abajo */
}

#MdlSeguridadPersonalizada .modal-footer {
    border-top: none;
    padding: 0 50px 30px; /* Ajustado el padding para igualar los lados y el de abajo */
}

/* Estilos para el botón "Intentar de nuevo" */
#MdlSeguridadPersonalizada .custom-security-btn {
    background: #FF6A00;
    color: white;
    width: 100%; /* Probablemente 100% quede mejor dentro del footer del modal */
    max-width: 300px; /* Opcional: Un ancho máximo si el modal es muy ancho */
    padding: 12px 20px;
    font-size: 1.2em;
    border-radius: 25px;
    border: none;
    display: block;
    margin: 0 auto; /* Centra el botón */
    box-sizing: border-box;
    min-height: 50px;
    line-height: 1;
    text-align: center;
    white-space: nowrap;
}

/* Ajuste para los botones principales si quieres que tu naranja sea el por defecto de Bootstrap */
/* Estas reglas SOLO afectarán si usas 'btn-primary' en tus otros botones y quieres que ese sea tu naranja */
.btn-primary {
    background-color: #FF6A00 !important;
    border-color: #FF6A00 !important;
}
.btn-primary:hover {
    background-color: #e05e00 !important; /* Un tono más oscuro para el hover */
    border-color: #e05e00 !important;
}