@media (max-width: 767.98px) {
    /*
     * Les champs servent uniquement à ouvrir le calendrier.
     * Ils ne doivent ni afficher le clavier ni permettre une
     * sélection de texte sur téléphone.
     */
    .tuco-daterange input,
    .tuco-mobile-date-picker input {
        caret-color: transparent !important;
        user-select: none !important;
        -webkit-user-select: none !important;
        touch-action: manipulation;
    }

    /* Date unique de la page Opérations. */
    .prep-date-picker-shell,
    .prep-date-picker-shell .SingleDatePicker,
    .prep-date-picker-shell .SingleDatePickerInput,
    .prep-date-picker-shell .DateInput {
        width: 100% !important;
    }

    .prep-date-picker-shell .SingleDatePickerInput {
        display: flex !important;
        align-items: center;
        min-height: 52px;
        overflow: visible;
        border: 1px solid var(--border) !important;
        border-radius: var(--radius-lg) !important;
        background: var(--surface) !important;
    }

    .prep-date-picker-shell .DateInput {
        flex: 1 1 auto;
        background: transparent !important;
    }

    .prep-date-picker-shell .DateInput_input {
        height: 50px !important;
        padding: 10px 16px !important;
        border: 0 !important;
        background: transparent !important;
        color: var(--text) !important;
        font-family: inherit !important;
        font-size: 1rem !important;
        font-weight: 400 !important;
        line-height: 30px !important;
    }

    .prep-date-picker-shell .DateInput_input__focused {
        border: 0 !important;
    }

    .prep-date-picker-shell .SingleDatePickerInput_calendarIcon {
        flex: 0 0 auto;
        margin: 0 8px 0 0 !important;
        padding: 8px !important;
    }

    .prep-date-picker-shell .SingleDatePicker_picker {
        z-index: 1300 !important;
    }

    /* Calendrier compact : un seul mois, sans débordement horizontal. */
    .tuco-daterange .DayPicker,
    .prep-date-picker-shell .DayPicker {
        max-width: calc(100vw - 30px);
    }
}

@media (max-width: 767.98px) {
    /*
     * Une seule boîte visible : celle de SingleDatePickerInput.
     * Tous les styles génériques du champ interne sont annulés.
     */
    .prep-date-picker-shell .DateInput,
    .prep-date-picker-shell .DateInput_input,
    .prep-date-picker-shell .DateInput_input__focused {
        border: 0 !important;
        border-radius: 0 !important;
        outline: 0 !important;
        box-shadow: none !important;
        background: transparent !important;
    }

    .prep-date-picker-shell .DateInput_input {
        width: 100% !important;
        margin: 0 !important;
    }

    .prep-date-picker-shell .SingleDatePickerInput {
        box-shadow: none !important;
    }
}

@media (max-width: 767.98px) {
    /*
     * Une seule boîte visible : celle de SingleDatePickerInput.
     * Tous les styles génériques du champ interne sont annulés.
     */
    .prep-date-picker-shell .DateInput,
    .prep-date-picker-shell .DateInput_input,
    .prep-date-picker-shell .DateInput_input__focused {
        border: 0 !important;
        border-radius: 0 !important;
        outline: 0 !important;
        box-shadow: none !important;
        background: transparent !important;
    }

    .prep-date-picker-shell .DateInput_input {
        width: 100% !important;
        margin: 0 !important;
    }

    .prep-date-picker-shell .SingleDatePickerInput {
        box-shadow: none !important;
    }
}

/* Correction définitive de la double boîte sur Opérations. */
@media (max-width: 767.98px) {
    .prep-date-picker-shell .SingleDatePickerInput {
        display: flex !important;
        align-items: center !important;
        width: 100% !important;
        min-height: 52px !important;
        overflow: hidden !important;
        box-sizing: border-box !important;
        border: 1px solid var(--border) !important;
        border-radius: var(--radius-lg) !important;
        background: var(--surface) !important;
        box-shadow: none !important;
    }

    #prep-date-picker .DateInput,
    #prep-date-picker .DateInput_input,
    #prep-date-picker .DateInput_input__focused,
    #prep-date-picker input,
    .prep-date-picker-shell .SingleDatePickerInput .DateInput,
    .prep-date-picker-shell .SingleDatePickerInput .DateInput_input {
        flex: 1 1 auto !important;
        width: auto !important;
        min-width: 0 !important;
        margin: 0 !important;
        border: 0 !important;
        border-radius: 0 !important;
        outline: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
    }

    #prep-date-picker .DateInput_input,
    #prep-date-picker input {
        width: 100% !important;
        height: 50px !important;
        padding: 10px 16px !important;
    }

    .prep-date-picker-shell
    .SingleDatePickerInput_calendarIcon {
        flex: 0 0 44px !important;
        width: 44px !important;
        height: 50px !important;
        margin: 0 !important;
        padding: 12px !important;
        border: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
    }

    .prep-date-picker-shell:focus-within
    .SingleDatePickerInput {
        border-color: var(--brand-accent) !important;
        box-shadow:
            0 0 0 3px rgba(21, 154, 140, .11)
            !important;
    }
}
