@use '../abstracts/variables' as *;

.floating-toolbar {
    position: fixed;
    bottom: 2rem;
    left: 50%;
    transform: translate(-50%, calc(100% + 2rem));
    z-index: 100;
    transition: transform 0.3s ease-in-out;

    &.is-visible {
        transform: translate(-50%, 0);
    }

    &__container {
        display: flex;
        align-items: center;
        gap: 0.5rem;
        padding: 0.5rem;
        background-color: var(--color-bg-element);
        border: 1px solid var(--color-border);
        border-radius: 8px;
        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
    }
}

.form__control--highlight-required {
    border-color: $color-danger !important;
    box-shadow: 0 0 0 2px rgba($color-danger, 0.2);
}