/*==================================
  =          SWISSNORTON           =
  ==================================
	
  Créé le : 17.12.2025
  Mis à jour le : 10.02.2026
  Par : Rui Dos Santos

  page : ./assets/css/mpasse-oublie.css
==================================*/

/* =====================================
	FORMULAIRE "MOT DE PASSE OUBLIE"
===================================== */
.mpasse-oublie-form {
	max-width: var(--container-login);
	margin: 0 auto;
    padding: 1.5rem 2rem;
    background-color: var(--bg-form);
    border-radius: 12px;
	box-shadow: var(--shadow-xl);
	flex-direction: column;
}

.mpasse-oublie-form-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--spacing-md) var(--spacing-md);
    margin-bottom: var(--spacing-lg, 1.5rem);
}

.mpasse-oublie-form-field {
    display: flex;
    flex-direction: column;
    text-align: left;
    gap: 0.5rem;
	padding-bottom: 1rem;
}

.mpasse-oublie-form-field input[name="captcha"] {
	max-width: 130px;
}

/* =====================================
	CSS RESPONSIVE
===================================== */
/* Tablettes (max 1024px) */
@media (max-width: 1024px) {
    .mpasse-oublie-form {
        padding: 1.25rem 1.5rem;
    }
}

/* Tablettes portrait (max 768px) */
@media (max-width: 768px) {
    .mpasse-oublie-form {
        padding: 1rem 1.25rem;
        margin: 0 var(--spacing-sm);
    }

    .mpasse-oublie-form-field {
        padding-bottom: 0.75rem;
    }
}

/* Mobiles (max 480px) */
@media (max-width: 480px) {
    .mpasse-oublie-form {
        padding: 0.875rem 1rem;
        margin: 0 var(--spacing-xs);
        border-radius: 8px;
    }

    .mpasse-oublie-form-field {
        gap: 0.375rem;
        padding-bottom: 0.5rem;
    }
}