.fondo {
        background-color:rgb(236, 237, 242);
    }
    .form {
        background-color:white;
    }
    .container {
        width: 700px !important;
    }
    .titulo{
        font-size: 1.5rem;
        font-weight: bold;
    }
    .texto{
        color: black;
    }
    input[type="text"] {
    border: 1px solid rgb(193, 228, 254); /* Color del borde */
    border-radius: 4px; /* Bordes redondeados */
    padding: 8px 12px; /* Espaciado interno: 8px arriba/abajo, 12px izquierda/derecha */
    box-shadow: inset 0 1px 3px #e9eff5; /* Sombra ligera interior */
    width: 100%; /* Opcional: para que tome el ancho disponible */
    box-sizing: border-box; /* Para que el padding y border no aumenten el ancho total */
    font-size: 16px; /* Tamaño del texto */
    }

    input[type="text"]:focus {
    border-color: #66afe9; /* Cambiar color del borde al enfocar */
    outline: none; /* Remover el outline por defecto al enfocar */
    }
    .button {
    background-color: rgb(22, 45, 61); /* Color de fondo azul */
    color: white; /* Texto en color blanco */
    padding: 10px 35px; /* Espacio interno alrededor del texto */
    border: none; /* Sin borde */
    border-radius: 20px; /* Bordes redondeados */
    box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.2); /* Sombra ligera */
    cursor: pointer; /* Cursor tipo puntero */
    transition: background-color 0.3s; /* Transición suave del fondo */
    font-size: 16px; /* Tamaño del texto */
    font-weight: bold; /* Texto en negrita */
    }

    .button:hover {
    background-color: rgb(50, 83, 106); /* Color de fondo más oscuro al pasar el mouse */
    }
    .input-group {
    display: flex;
    align-items: center;
    width: 100%;
    margin-bottom: 1rem; /* Añadido para dar espacio debajo del grupo de entrada */
    }

    .input-group-text {
    background-color: #e9eff5; /* Color de fondo para que coincida con la sombra de tu input */
    border: 1px solid #c1e4fe; /* Color del borde como tu input */
    border-right: none; /* Remover el borde derecho para fusionarlo con el input */
    padding: 8px 12px; /* Espaciado interno igual al input */
    border-radius: 4px 0 0 4px; /* Redondear solo los bordes izquierdos */
    margin-bottom: 0;
    box-shadow: inset 0 1px 3px #e9eff5; /* Sombra ligera interior como tu input */
    font-size: 16px; /* Tamaño del texto como tu input */
    box-sizing: border-box; /* Para que el padding y border no aumenten el ancho total */
    display: flex;
    align-items: center;
    white-space: nowrap;
    }

    .form-control {
    border: 1px solid #c1e4fe; /* Color del borde como tu input */
    border-radius: 0 4px 4px 0; /* Redondear solo los bordes derechos */
    padding: 8px 12px; /* Espaciado interno igual al input */
    box-shadow: inset 0 1px 3px #e9eff5; /* Sombra ligera interior como tu input */
    width: 100%; /* Para que tome el ancho disponible */
    font-size: 16px; /* Tamaño del texto como tu input */
    box-sizing: border-box; /* Para que el padding y border no aumenten el ancho total */
    transition: border-color 0.3s; /* Transición suave de color de borde */
    }

    .form-control:focus {
    border-color: #66afe9; /* Cambiar color del borde al enfocar */
    outline: none; /* Remover el outline por defecto al enfocar */
    box-shadow: inset 0 1px 3px #66afe9; /* Opcional: sombra interior con el color de foco */
    }