/*
 * Amelia Booking — CSS Overrides
 *
 * Fichier dédié aux surcharges visuelles d'Amelia Lite.
 * Chargé uniquement sur /reservation/ (ou toute page contenant un shortcode Amelia).
 * Enqueue conditionnel dans functions.php > cap_ramonage_enqueue_styles().
 *
 * Organisation :
 *   1. Champ "Last Name" élargi (détourné pour l'adresse d'intervention)
 *   2. Typographie globale — aligne sur Inter / Poppins du thème
 *   3. Boutons — couleur brand-orange (#F26419)
 *   4. Champs input — bordure et focus cohérents
 *   5. En-tête de l'application Amelia
 */

/* ================================================================
 * 1. CHAMP "NOM & ADRESSE D'INTERVENTION" (Last Name détourné)
 * ================================================================ */

/* Élargir le bloc entier à 100 % de la grille Amelia */
.am-info-last-name {
    width: 100% !important;
    max-width: 100% !important;
    flex: 0 0 100% !important;
}

/* Input : pleine largeur + taille de police lisible */
.am-info-last-name input[name="lastName"] {
    width: 100% !important;
    max-width: 100% !important;
    font-size: 0.9rem !important;
    letter-spacing: 0 !important;
}

/* Wrapper input : pleine largeur */
.am-info-last-name .am-input-wrapper,
.am-info-last-name .el-input,
.am-info-last-name .el-input__wrapper {
    width: 100% !important;
    max-width: 100% !important;
}

/* ================================================================
 * 2. TYPOGRAPHIE — aligner sur le thème
 * ================================================================ */

#amelia-app,
.amelia-booking-wrapper {
    font-family: 'Inter', ui-sans-serif, system-ui, sans-serif !important;
    font-size: 0.9375rem;
    color: #1A1A1A;
}

#amelia-app h1,
#amelia-app h2,
#amelia-app h3,
.amelia-booking-wrapper h1,
.amelia-booking-wrapper h2,
.amelia-booking-wrapper h3 {
    font-family: 'Poppins', ui-sans-serif, system-ui, sans-serif !important;
}

/* Labels */
#amelia-app .am-fs__info-form__label,
.amelia-booking-wrapper .am-fs__info-form__label {
    font-size: 0.8125rem;
    font-weight: 600;
    color: #1F3A5F;
    letter-spacing: 0.01em;
}

/* ================================================================
 * 3. BOUTONS — brand-orange #F26419
 * ================================================================ */

#amelia-app .am-button.am-button--primary,
.amelia-booking-wrapper .am-button.am-button--primary {
    background-color: #F26419 !important;
    border-color: #F26419 !important;
    color: #ffffff !important;
    font-family: 'Poppins', sans-serif !important;
    font-weight: 700 !important;
    border-radius: 0.5rem !important;
    transition: background-color 0.2s ease !important;
}

#amelia-app .am-button.am-button--primary:hover,
.amelia-booking-wrapper .am-button.am-button--primary:hover {
    background-color: #F68B4E !important;
    border-color: #F68B4E !important;
}

/* ================================================================
 * 4. CHAMPS INPUT — bordure et focus
 * ================================================================ */

#amelia-app .el-input__inner,
#amelia-app .el-textarea__inner,
.amelia-booking-wrapper .el-input__inner,
.amelia-booking-wrapper .el-textarea__inner {
    border-color: #E8F0F4 !important;
    border-radius: 0.5rem !important;
    font-family: 'Inter', sans-serif !important;
    font-size: 0.9rem !important;
    color: #1A1A1A !important;
}

#amelia-app .el-input__inner:focus,
#amelia-app .el-textarea__inner:focus,
.amelia-booking-wrapper .el-input__inner:focus,
.amelia-booking-wrapper .el-textarea__inner:focus {
    border-color: #F26419 !important;
    outline: none !important;
    box-shadow: 0 0 0 3px rgba(242, 100, 25, 0.15) !important;
}

/* ================================================================
 * 5. EN-TÊTE AMELIA — couleur de progression
 * ================================================================ */

#amelia-app .am-fs__step-header,
.amelia-booking-wrapper .am-fs__step-header {
    background: linear-gradient(135deg, #1F3A5F 0%, #0F2438 100%) !important;
}