/* =====================================================
   Agent Self Billing Form
   Matches Nuxt AgentLoginSelfBilling.vue scoped styles
   ===================================================== */

/* Matches Nuxt LoginStepWrapper.vue exactly */

/* Outer centering wrapper — mirrors Nuxt .agent-login-step__wrapper */
.agent-login-step__wrapper {
    max-width: 50rem;
    margin: 0 auto;
    padding: 0 var(--space-2);
}

/* Inner card — mirrors Nuxt .agent-login-step__container */
.agent-login-step__container {
    background-color: #fff;
    padding: var(--space-3);
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
    border-radius: var(--radius-default);
}

/* Form field alignment in side-by-side rows */
.agent-login-step__container .side-by-side {
    align-items: flex-start;
}

.radio-group {
    align-self: flex-start;
}

@media screen and (min-width: 45rem) {
    .radio-group--vat {
        margin-top: calc(5% + (var(--space-1) * 1.2));
    }
}

.scroll-box {
    padding: var(--space-1-3);
    overflow-y: auto;
    height: 350px;
    background-color: var(--c-grey-5);
}