.event-form {
    min-width: min(90%, 1000px);
    margin: var(--pill-gap);
}

.form-details {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
}

.form-details > div{
    width: max(50%, 500px);
    min-width:50%;
}

.form-btns {
    display: flex;
    flex-direction: row-reverse;
    flex-wrap: wrap;
    gap: var(--pill-gap);
    margin-top: calc(var(--pill-gap) * 2);
    margin-bottom: calc(var(--pill-gap) * 2);
}

fieldset.form-section {
    border: none;
    padding: 0;
    margin-top: var(--large-gap);
}

    fieldset.form-section > legend {
        padding: 0;
        float: none;
        width: auto;
        font-size: 1.8rem;
        font-weight: 700;
    }

.form-row{
    display: flex;
    flex-wrap: wrap;
}

.form-section {
    margin-top: var(--large-gap);
}

.form-step {
    transition: transform 420ms cubic-bezier(.16, 1, .3, 1), opacity 220ms ease, filter 420ms ease;
    will-change: transform, opacity, filter; /*Performance*/
}

.form-step-active {
    opacity: 1;
    height: auto;
    transform: translateX(0);
    filter: blur(0);
    overflow: visible;
}

.form-step-hidden {
    height: 0;
    overflow: hidden;
    opacity: 0;
    transform: translateX(32px);
    filter: blur(6px);
}

.form-step-title {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
}

.btns-step-hidden{
    display:none;
}

/* -------- Toggle Group (Radio Pill Buttons) -------- */

.form-toggle-group-container{
    display: flex;
    flex-direction: column;
    align-items: start;
}

.toggle-group {
    display: inline-flex;
    gap: 0;
    border-radius: calc(var(--input-h) / 2);
    /*overflow: hidden;*/
    box-shadow: 0 3px 10px rgb(0 0 0 / 0.2);
    margin: var(--pill-gap) 0;
}

    .toggle-group input[type="radio"] {
        position: absolute;
        opacity: 0;
        width: 0;
        height: 0;
        margin: 0;
        box-shadow: none;
    }

    .toggle-group label {
        display: flex;
        align-items: center;
        justify-content: center;
        height: var(--input-h);
        padding: 0 calc(var(--btn-h) / 2);
        margin: 0;
        cursor: pointer;
        background: #ffffff;
        color: var(--text-color);
        transition: background 0.2s ease, border-color 0.2s ease;
        user-select: none;
    }

        .toggle-group label:nth-child(2) {
            border-start-start-radius: calc(var(--input-h) / 2);
            border-end-start-radius: calc(var(--input-h) / 2);
        }

        .toggle-group label:nth-child(4) {
            border-start-end-radius: calc(var(--input-h) / 2);
            border-end-end-radius: calc(var(--input-h) / 2);
        }

        .toggle-group label:hover {
            background: var(--gray-bg);
        }

    .toggle-group input[type="radio"]:checked + label.fnc-enabled {
        background-color: var(--success-color);
    }

    .toggle-group input[type="radio"]:checked + label.fnc-disabled {
        background-color: var(--danger-color);
    }

    .toggle-group input[type="radio"]:checked + label.fnc-private {
        background-color: var(--success-color);
    }

    .toggle-group input[type="radio"]:checked + label.fnc-public {
        background-color: var(--warning-color);
    }

    .toggle-group input[type="radio"]:disabled + label {
        background-color: var(--dark-gray-bg);
        cursor: default;
    }

    /* Focus visible for accessibility */
    .toggle-group input[type="radio"]:focus-visible + label {
        outline: 2px solid var(--primary-color-1);
        outline-offset: 3px;
    }