/* Los estilos generales están directamente aplicados desde Bootstrap
por lo que solo se retocan algunos estilos a forzar.
 */
 /* :root {
    --bs-body-bg:#f9f9f9 !important;
 } */

 /*Suavizamos el pulsado de los botones de copia*/
 .btn-copy {
    transition: all 0.3s ease;
}

/* Evitar que el texto de los inputs se vea cortado si es largo */
input[readonly] {
    background-color: #f8f9fa !important;
    cursor: default;
}

/* Forzamos una tipografía que gestione bien los caracteres combinados */
#texto-base, 
input[readonly] {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    font-variant-ligatures: contextual;
    font-feature-settings: "kern" 1;
    font-size: 1.1rem;
    text-rendering: optimizeLegibility;
    line-height: 1.6;
    padding-bottom: 5px; /* Damos espacio para que el subrayado respire */
}

input, textarea {
    border-color: #5697d9 !important;
}

.illustrations {
    border: solid 1px #0d6efd;
    border-radius: var(--bs-border-radius);
    width: 100%;
    margin-bottom: 0%;
}

/*MODO NOCHE-DIA*/
[data-bs-theme="light"] body {
    /* background-color: var(--bs-body-bg); */
    background-color: #f9f9f9 !important;
 }

/* Estilos específicos para cuando el tema es oscuro */
[data-bs-theme="dark"] .input-group-text {
    background-color: #2b3035;
    color: #0077b5 !important; /* El azul de tu marca resalta más aquí */
    border-color: #0d6efd !important;
}

[data-bs-theme="dark"] input[readonly] {
    background-color: #212529 !important;
    color: #494949 !important;
    border-color: #0d6efd !important;
}

/* Efecto suave de transición */
body {
    transition: background-color 0.3s ease, color 0.3s ease;
}