.wrapper-account {
        display: flex;
    }

    .application-form {
        display: block;
    }

    .group-schedule {
        display: flex;
        flex-direction: column;
        gap: 10px 0;
        width: 100%;
        max-width: 600px;
        margin-top: 20px;
        padding: 20px;
        border: 1px solid var(--light-stroke-color);
        border-radius: 16px;

    }

    .group-schedule__groups-container {
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        gap: 10px;
    }

    .group-schedule__group {
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        border-radius: 16px;
        min-width: 220px;
    }

    .group-schedule__group-header {
        display: flex;
    }

    .group-schedule__group-type {
        color: var(--dark-color);
    }

    /*.group-schedule__group-name {
        color: #777;
        margin-top: 5px;
    }*/
    .group-schedule__group-name {
        margin-left: 5px;
        color: #333;
    }

    .group-schedule__group-datetime {
        font-size: 1.2em;
        margin-top: 5px;
        color: var(--blue-color);
    }

    /* --- Animated reveal/collapse for group schedule --- */
    /* Default: collapsed/hidden state; управляется классом .is-visible */
    .group-schedule {
        max-height: 0;
        opacity: 0;
        transform: translateY(-8px);
        overflow: hidden;
        margin-top: 0;
        /* collapse gap */
        padding: 0;
        /* collapse inner space */
        /* hide border when collapsed to avoid stray lines */
        border-color: transparent;
        border-width: 0;
        transition:
            max-height 0.35s ease,
            opacity 0.25s ease,
            transform 0.25s ease,
            border-color 0.2s ease,
            border-width 0.2s ease,
            margin-top 0.25s ease,
            padding 0.25s ease;
    }

    /* Visible/expanded when JS добавляет .is-visible */
    .group-schedule.is-visible {
        max-height: 1000px; /* sufficiently large to fit content */
        opacity: 1;
        transform: translateY(0);
        border-color: var(--light-stroke-color);
        border-width: 1px;
        margin-top: 20px; /* restore intended spacing when expanded */
        padding: 20px;    /* restore original padding */
    }

    .input,
    .selectForm {
        margin-top: 24px;
        margin-bottom: 0;
    }

    @media (max-width: 424px) {
        .group-schedule {
            padding: 10px;
        }

        .group-schedule__groups-container {
            gap: 5px;
            flex-direction: column;
        }

        .group-schedule__group {
            padding: 8px;
        }

        .group-schedule__group-datetime {
            font-size: 1em;
        }
    }