body {background-color:#ffe8d9;}
/* Case à cocher très visible */
.form-check-input {
    width: 1.4em;
    height: 1.4em;
    border: 3px solid #444; /* bordure visible */
    border-radius: 4px;     /* léger arrondi moderne */
    cursor: pointer;
}

/* Quand cochée */
.form-check-input:checked {
    background-color: #28a745; /* corail chaleureux */
    border-color: #ff7f50;
}

/* Focus clavier / accessibilité */
.form-check-input:focus {
    outline: 3px solid #ff7f50;
    outline-offset: 2px;
    box-shadow: none;
}

.form-check-label {
    font-weight: 600;
    font-size: 1.05em;
}

.form-container {
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    padding: 3rem;
    background-color: #ffffff;
    border: 2px solid #000;
    border-radius: 0.5rem;
    box-shadow: 0 0.5rem 1rem rgba(0,0,0,0.15);
}

.password-wrapper {
    position: relative;
}

.password-wrapper .form-control {
    padding-right: 40px;
}

.btn-show-password {
    position: absolute;
    top: 50%;
    right: 12px;
    transform: translateY(-50%);
    background: none;
    border: none;
    padding: 0;
    cursor: pointer;
    color: #666;
    z-index: 10;
}


/* sm : équivalent col-sm-10 par exemple */
@media (min-width: 576px) {
    .form-container {
        max-width: 90%; /* tu peux ajuster */
    }
}

/* md : équivalent col-md-8 */
@media (min-width: 768px) {
    .form-container {
        max-width: calc(100% * 8 / 12); /* 66.666% */
    }
}

/* lg : équivalent col-lg-6 */
@media (min-width: 992px) {
    .form-container0 {
        max-width: calc(100% * 6 / 12); /* 50% */
    }
}

/* xl : équivalent col-xl-5 ou autre */
@media (min-width: 1200px) {
    .form-container0 {
        max-width: 40%; /* à ajuster selon ton goût */
    }
}

/* xxl : écrans très larges */
@media (min-width: 1400px) {
    .form-container0 {
        max-width: 35%; /* ou 30% si tu veux plus compact */
    }
}