/* .form-input + floating labels — extracted from style.css (move-only) */

/* Стили форм */
.form-input,
.seller-booking-input {
    box-sizing: border-box;
    width: 100%;
    max-width: 100%;
    padding: 16px 10px 4px 10px;
    border: none;
    border-bottom: 1px solid var(--input-border-color, #696b6e);
    border-radius: 0;
    font-size: 1rem;
    line-height: 1;
    font-family: inherit;
    transition: border-color 0.3s ease;
    background-color: transparent;
    color: var(--text-color);
}

.form-input:focus,
.seller-booking-input:focus {
    outline: none;
}

:is(.form-label, .seller-booking-label) {
    position: absolute;
    left: 10px;
    top: 18px;
    color: var(--text-color);
    font-size: 16px;
    line-height: 1;
    font-style: normal;
    font-weight: 500;
    /* Слой композитинга: меньше визуальных «скачков» при анимации позиции/кегля */
    backface-visibility: hidden;
    transform: translate3d(0, 0, 0);
    transform-origin: left top;
    transition:
        transform 0.32s cubic-bezier(0.33, 1, 0.68, 1),
        top 0.32s cubic-bezier(0.33, 1, 0.68, 1),
        left 0.32s cubic-bezier(0.33, 1, 0.68, 1),
        font-size 0.26s cubic-bezier(0.33, 1, 0.68, 1),
        color 0.28s cubic-bezier(0.33, 1, 0.68, 1);
    pointer-events: none;
    user-select: none;
}

/* WebKit autofill: триггер для label-manager (animationstart) */
@keyframes vivaInputAutofillStart {
    from {
        opacity: 1;
    }
    to {
        opacity: 1;
    }
}

:is(input.form-input, textarea.form-input, input.seller-booking-input):-webkit-autofill {
    animation-name: vivaInputAutofillStart;
    animation-duration: 0.01s;
}

/* Поднятый лейбл: вручную (.label-raised) или при фокусе / заполнении поля */
.form-label.label-raised,
.seller-booking-label.label-raised,
input.form-input:not([readonly]):focus + .form-label,
input.form-input:not([readonly]):not(:placeholder-shown) + .form-label,
input.form-input:not([readonly]).has-value + .form-label,
input.form-input:not([readonly]):required:valid + .form-label,
input.form-input:not([readonly]):-webkit-autofill + .form-label,
input.seller-booking-input:not([readonly]):focus + .seller-booking-label,
input.seller-booking-input[data-viva-pax-panel-open] + .seller-booking-label,
input.seller-booking-input:not([readonly]):not(:placeholder-shown) + .seller-booking-label,
input.seller-booking-input:not([readonly]).has-value + .seller-booking-label,
input.seller-booking-input:not([readonly]):required:valid + .seller-booking-label,
input.seller-booking-input:not([readonly]):-webkit-autofill + .seller-booking-label,
.password-wrapper > input.form-input:not([readonly]):focus + .form-label,
.password-wrapper > input.form-input:not([readonly]):not(:placeholder-shown) + .form-label,
.password-wrapper > input.form-input:not([readonly]).has-value + .form-label,
.password-wrapper > input.form-input:not([readonly]):required:valid + .form-label,
.password-wrapper > input.form-input:not([readonly]):-webkit-autofill + .form-label,
textarea.form-input:not([readonly]):focus + .form-label,
textarea.form-input:not([readonly]):not(:placeholder-shown) + .form-label,
textarea.form-input:not([readonly]).has-value + .form-label,
textarea.form-input:not([readonly]):required:valid + .form-label,
textarea.form-input:not([readonly]):-webkit-autofill + .form-label {
    left: 0;
    font-size: 0.75rem;
    color: var(--form-label-floating-color);
    transform: translate3d(0, var(--form-label-floating-shift), 0);
}

/* Поднятое состояние по классу — единый источник (JS + autofill) */
:is(.form-label, .seller-booking-label).label-raised {
    left: 0 !important;
    top: 18px !important;
    font-size: 0.75rem !important;
    color: var(--form-label-floating-color) !important;
    transform: translate3d(0, var(--form-label-floating-shift), 0) !important;
    transform-origin: left top !important;
}

@media (prefers-reduced-motion: reduce) {
    :is(.form-label, .seller-booking-label):not(.label-raised) {
        transition-duration: 0s !important;
        transition-delay: 0s !important;
        transform: none !important;
        backface-visibility: visible;
    }

    :is(.form-label, .seller-booking-label).label-raised {
        transition-duration: 0s !important;
        transform: translate3d(0, var(--form-label-floating-shift), 0) !important;
    }
}

/* Для readonly полей (dropdown) - управляется ТОЛЬКО JavaScript через .label-raised */
/* НЕ реагируем на :focus и :not(:placeholder-shown) */

/* Автозаполнение: прозрачный фон (формы, pagination, seller booking) */
:is(.form-input, .pagination-select, .seller-booking-input):-webkit-autofill,
:is(.form-input, .pagination-select, .seller-booking-input):-webkit-autofill:hover,
:is(.form-input, .pagination-select, .seller-booking-input):-webkit-autofill:focus,
:is(.form-input, .pagination-select, .seller-booking-input):-webkit-autofill:active {
    background-color: transparent !important;
    -webkit-box-shadow: 0 0 0 1000px transparent inset !important;
    box-shadow: 0 0 0 1000px transparent inset !important;
    -webkit-text-fill-color: var(--text-color) !important;
    caret-color: var(--text-color) !important;
    transition: background-color 99999s ease-out 0s !important;
}

.pagination-select:-webkit-autofill,
.pagination-select:-webkit-autofill:hover,
.pagination-select:-webkit-autofill:focus {
    -webkit-box-shadow: 0 0 0 30px var(--dropdown-bg) inset !important;
}

:is(.form-input, .seller-booking-input):-moz-autofill,
:is(.form-input, .seller-booking-input):-moz-autofill-preview {
    filter: none;
    background-color: transparent !important;
    color: var(--text-color);
}
