/* ET Mailjet — styles front minimalistes (les tokens sont surchargés par le widget Elementor) */
.et-mj-form {
    display: flex;
    flex-direction: column;
    gap: 14px;
    max-width: 100%;
}
.et-mj-form.et-mj-layout-grid-2,
.et-mj-form.et-mj-layout-grid-3,
.et-mj-form.et-mj-layout-grid-4,
.et-mj-form.et-mj-layout-grid-5,
.et-mj-form.et-mj-layout-grid-6 {
    display: grid;
    gap: 14px;
    align-items: start;
}
.et-mj-form.et-mj-layout-grid-2 { grid-template-columns: repeat(2, 1fr); }
.et-mj-form.et-mj-layout-grid-3 { grid-template-columns: repeat(3, 1fr); }
.et-mj-form.et-mj-layout-grid-4 { grid-template-columns: repeat(4, 1fr); }
.et-mj-form.et-mj-layout-grid-5 { grid-template-columns: repeat(5, 1fr); }
.et-mj-form.et-mj-layout-grid-6 { grid-template-columns: repeat(6, 1fr); }

/* v1.0.9 — Éléments TOUJOURS pleine largeur (consent + message + honeypot) dans TOUS
   les layouts grid. !important pour battre les thèmes hostiles. */
.et-mj-form[class*="et-mj-layout-grid-"] > .et-mj-consent,
.et-mj-form[class*="et-mj-layout-grid-"] > .et-mj-message,
.et-mj-form[class*="et-mj-layout-grid-"] > .et-mj-field-message,
.et-mj-form[class*="et-mj-layout-grid-"] > .et-mj-hp {
    grid-column: 1 / -1 !important;
    width: 100%;
}

/* v1.0.11 — .et-mj-actions (bouton Envoyer)
   Règle par défaut : pleine largeur (nouvelle ligne, comportement historique)
   Override submit-inline : occupe UNE cellule grid comme un champ normal.
   Spécificité : la règle inline (3 classes) bat la règle défaut (2 classes) sans
   avoir besoin de :not() qui inversait le score.
*/
.et-mj-form[class*="et-mj-layout-grid-"] > .et-mj-actions {
    grid-column: 1 / -1 !important;
    width: 100%;
}
/* v1.0.13 — grid-auto-flow: dense permet au bouton de remonter dans une cellule
   vide de la ligne des champs (ex: grid-4 avec 3 champs → bouton en col 4 ligne 1).
   Sans dense, le bouton se placerait après le consent (ligne 3 col 1). */
.et-mj-form[class*="et-mj-layout-grid-"].et-mj-submit-inline {
    grid-auto-flow: dense;
}
.et-mj-form[class*="et-mj-layout-grid-"].et-mj-submit-inline > .et-mj-actions {
    grid-column: auto !important;
    width: 100%;
    align-self: end; /* aligne le bouton en bas de sa cellule → à hauteur des inputs */
}
.et-mj-form[class*="et-mj-layout-grid-"].et-mj-submit-inline > .et-mj-actions .et-mj-submit {
    width: 100%;
    justify-content: center;
}
/* Responsive : sous 640px (1 col), le bouton inline devient pleine largeur
   naturellement (grid-column: auto = seule cellule dispo). */

.et-mj-field { display: flex; flex-direction: column; }
.et-mj-field > label {
    font-size: 13px; font-weight: 600; margin-bottom: 6px; color: inherit;
}
.et-mj-field input,
.et-mj-field textarea {
    width: 100%; box-sizing: border-box;
    padding: 10px 12px; font-size: 14px; line-height: 1.4;
    border: 1px solid #d1d5db; border-radius: 4px; background: #fff;
    font-family: inherit;
    transition: border-color .15s ease;
}
.et-mj-field input:focus,
.et-mj-field textarea:focus { border-color: #0284c7; outline: 0; }

.et-mj-star { color: #dc2626; margin-left: 2px; }

.et-mj-consent { width: 100%; }
.et-mj-consent label {
    display: flex; align-items: flex-start; gap: 8px;
    font-size: 13px; line-height: 1.5; cursor: pointer; font-weight: normal;
    flex-wrap: nowrap; width: 100%;
}
.et-mj-consent input[type="checkbox"] { margin-top: 3px; flex-shrink: 0; }
.et-mj-consent label > span { flex: 1 1 auto; min-width: 0; }

.et-mj-actions {
    display: flex; align-items: center; gap: 10px;
    justify-content: flex-start;
}
.et-mj-submit {
    cursor: pointer;
    box-sizing: border-box;         /* v1.0.15 — même modèle que .et-mj-field input */
    background: #0284c7; color: #fff;
    padding: 12px 24px; font-size: 14px; font-weight: 600;
    line-height: 1.4;               /* v1.0.15 — même line-height que input → hauteur identique */
    border: 1px solid transparent;  /* v1.0.15 — compense la border 1px des inputs */
    border-radius: 4px; font-family: inherit;
    transition: background .15s ease, transform .05s ease;
}
.et-mj-submit:hover:not(:disabled) { background: #0369a1; }
.et-mj-submit:active:not(:disabled) { transform: translateY(1px); }
.et-mj-submit:disabled { opacity: .6; cursor: wait; }
.et-mj-spinner { font-size: 18px; }

.et-mj-message { padding: 10px 12px; border-radius: 4px; font-size: 14px; }
.et-mj-message.is-ok { background: #f0fdf4; color: #166534; border-left: 4px solid #16a34a; }
.et-mj-message.is-ko { background: #fef2f2; color: #7f1d1d; border-left: 4px solid #dc2626; }

/* ═══ v1.0.5+1.0.12 — Presets de taille (widget Elementor)
   Field size et Button size sont maintenant INDÉPENDANTS.
   Les controls Style Elementor peuvent affiner ensuite.
   ═════════════════════════════════════════════════════════ */

/* ─── Taille des CHAMPS (input / textarea + labels) ─── */
.et-mj-form.et-mj-size-sm .et-mj-field input,
.et-mj-form.et-mj-size-sm .et-mj-field textarea { padding: 6px 10px; font-size: 12px; }
.et-mj-form.et-mj-size-sm .et-mj-field > label { font-size: 12px; }

.et-mj-form.et-mj-size-md .et-mj-field input,
.et-mj-form.et-mj-size-md .et-mj-field textarea { padding: 10px 12px; font-size: 14px; }

.et-mj-form.et-mj-size-lg .et-mj-field input,
.et-mj-form.et-mj-size-lg .et-mj-field textarea { padding: 14px 16px; font-size: 16px; }
.et-mj-form.et-mj-size-lg .et-mj-field > label { font-size: 14px; }

.et-mj-form.et-mj-size-xl .et-mj-field input,
.et-mj-form.et-mj-size-xl .et-mj-field textarea { padding: 18px 22px; font-size: 18px; }
.et-mj-form.et-mj-size-xl .et-mj-field > label { font-size: 15px; }

/* ─── Taille du BOUTON (v1.0.15 — hauteur alignée sur les champs)
   Padding VERTICAL identique à celui de l'input du même size + border 1px
   transparent qui compense la border 1px de l'input → hauteur totale égale.
   Padding HORIZONTAL plus généreux (le bouton a besoin de respiration).
*/
.et-mj-form.et-mj-btn-sm .et-mj-submit { padding: 6px 16px;  font-size: 12px; border: 1px solid transparent; }
.et-mj-form.et-mj-btn-md .et-mj-submit { padding: 10px 24px; font-size: 14px; border: 1px solid transparent; }
.et-mj-form.et-mj-btn-lg .et-mj-submit { padding: 14px 32px; font-size: 16px; border: 1px solid transparent; }
.et-mj-form.et-mj-btn-xl .et-mj-submit { padding: 18px 40px; font-size: 18px; border: 1px solid transparent; }

/* Responsive — dégradation progressive intelligente :
   ≥ 1200px : layout demandé
   < 1200px : grid-5/6 → 4 colonnes (évite les champs trop étroits sur laptop)
   < 900px  : grid-3/4/5/6 → 2 colonnes (tablette)
   < 640px  : tous les grids → 1 colonne (mobile) */
@media (max-width: 1200px) {
    .et-mj-form.et-mj-layout-grid-5,
    .et-mj-form.et-mj-layout-grid-6 { grid-template-columns: repeat(4, 1fr); }
}
@media (max-width: 900px) {
    .et-mj-form.et-mj-layout-grid-3,
    .et-mj-form.et-mj-layout-grid-4,
    .et-mj-form.et-mj-layout-grid-5,
    .et-mj-form.et-mj-layout-grid-6 { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 640px) {
    .et-mj-form.et-mj-layout-grid-2,
    .et-mj-form.et-mj-layout-grid-3,
    .et-mj-form.et-mj-layout-grid-4,
    .et-mj-form.et-mj-layout-grid-5,
    .et-mj-form.et-mj-layout-grid-6 { grid-template-columns: 1fr; }
}