/* ===================================================
   AGENT REGISTRATION FORM
   =================================================== */

.agent-registration-form.form {
    margin-top: -1.25rem;
     gap: var(--space-2, 1.25rem);
}

/* Cancel the extra margin-block-start from .flow — flex gap handles it */
.agent-registration-form.form > * {
    margin-block-start: 0 !important;
}

/* Direct .flex layout rows only — align tops, 1rem side gap */
.agent-registration-form > .flex {
    --flex-align-vertical: flex-start;
    gap: 1rem;
}

/* Every direct form-field child of a layout row stretches equally */
.agent-registration-form > .flex > .form-field {
    flex: 1;
    min-width: 0;
}

/* Membership type + membership number section spacing */
.agent-registration-form .form-group-margin {
    margin-top: 1.25rem;
    margin-bottom: 0;
}

/* Membership number / trade body row */
.agent-registration-form .form-row {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    margin-bottom: 0;
}

.agent-registration-form .col-md-6 {
    flex: 0 0 calc(50% - 0.5rem);
    max-width: calc(50% - 0.5rem);
}

.agent-registration-form .col-md-12 {
    flex: 0 0 100%;
    max-width: 100%;
}

/* Membership textbox styling — matches form-control inputs */
.agent-registration-form .membership-textbox {
    width: 100%;
    padding: var(--space-1-3, 0.625rem) var(--space-2, 1rem);
    border: none;
    border-bottom: 1px solid var(--c-border, #ccc);
    background-color: var(--c-input-bg, #f5f5f5);
    font-size: inherit;
    color: inherit;
    border-radius: 0;
    outline: none;
    box-sizing: border-box;
}

.agent-registration-form .membership-textbox:disabled {
    background-color: #ddd;
    color: #9ca3af;
    cursor: not-allowed;
    border-color: #e5e7eb;
}

/* Terms row spacing */
.agent-registration-form .form-group.mbe-3 {
    margin-block-end: 1rem;
}

/* Terms & Conditions / Privacy Policy links */
.agent-registration-form .agentLoginTerm a {
    color: var(--c-burnt-orange);
    text-decoration: underline;
}


.agent-registration-form .agentLoginTerm input[type="checkbox"] {
    appearance: none;
    -webkit-appearance: none;
    width: 1.125rem;
    height: 1.125rem;
    flex-shrink: 0;
    margin: 0;
    border: 1px solid var(--c-grey-3, #ccc);
    border-radius: 2px;
    background-color: var(--c-grey-5, #f9f9f9);
    cursor: pointer;
    position: relative;
}

.agent-registration-form .agentLoginTerm input[type="checkbox"]:checked {
    background-color: var(--c-burnt-orange);
    border-color: var(--c-burnt-orange);
}
                                                                                                                                                         

.agent-registration-form .agentLoginTerm input[type="checkbox"]:checked::after {
    content: '';
    position: absolute;
    left: 0.34rem;
    top: 0.13rem;
    width: 0.3rem;
    height: 0.55rem;
    border: solid #fff;
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
}

.agent-registration-form .agentLoginTerm input[type="checkbox"]:focus-visible {
    outline: 2px solid var(--c-grey-1, #666);
    outline-offset: 1px;
}


.agent-registration-form [data-error="reg-terms"] {
    margin-top: var(--space-1, 0.625rem);
}



.agent-registration-form .form-field__error > i {
    display: none;
}

.agent-registration-form .form-field__error::before {
    content: "";
    width: 1em;
    height: 1em;
    flex-shrink: 0;
    background-color: currentColor;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M256 32a224 224 0 1 1 0 448 224 224 0 1 1 0-448zm0 480A256 256 0 1 0 256 0a256 256 0 1 0 0 512zm0-384c-8.8 0-16 7.2-16 16V272c0 8.8 7.2 16 16 16s16-7.2 16-16V144c0-8.8-7.2-16-16-16zm24 224a24 24 0 1 0 -48 0 24 24 0 1 0 48 0z'/%3E%3C/svg%3E") center / contain no-repeat;
            mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M256 32a224 224 0 1 1 0 448 224 224 0 1 1 0-448zm0 480A256 256 0 1 0 256 0a256 256 0 1 0 0 512zm0-384c-8.8 0-16 7.2-16 16V272c0 8.8 7.2 16 16 16s16-7.2 16-16V144c0-8.8-7.2-16-16-16zm24 224a24 24 0 1 0 -48 0 24 24 0 1 0 48 0z'/%3E%3C/svg%3E") center / contain no-repeat;
}

.agent-registration-form .form-group-margin:has(.tab-radio-group) {
    margin-block-start: 0.5625rem !important;
}

.agent-registration-form .agentLoginTerm {
    display: flex;
    align-items: flex-start;
    gap: var(--space-1, 0.625rem);
    margin-top: 0 !important;
}

/* Submit button row */
.agent-registration-form .flex.mbs-3 {
    margin-block-start: 1.5rem;
}

.agent-registration-form .agentRegistrationButton {
    width: 100%;
}

/* ===================================================
   AGENT MENU DROPDOWN (replaces Nuxt VDropdown)
   =================================================== */

.agent-menu-dropdown {
    background-color: #fff;
    border-radius: 4px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15);
    left: var(--am-left, 0);
    max-width: 22.5rem;
    min-width: 0;
    position: fixed;
    right: auto;
    top: var(--am-top, 0);
    width: var(--am-width, 22.5rem);
    z-index: 200;
}

.agent-menu-dropdown::before {
    content: '';
    border-left: 14px solid transparent;
    border-right: 14px solid transparent;
    border-bottom: 14px solid #fff;
    position: absolute;
    left: var(--arrow-left, 50%);
    top: -14px;
}

/* Keep trigger circle gold when menu is open — overrides site-header__sub li button[aria-expanded=true] { background:#fff } */
.site-header__sub li button.agent-menu__initials[aria-expanded="true"] {
    background-color: var(--c-warm-gold);
    color: var(--c-navy-blue);
}

/* Nuxt utility classes: ta-c, mbe-2, text-navy-blue — don't exist in Classic styles.css */
.agent-menu-dropdown .agent-menu__content {
    color: var(--c-navy-blue);
    text-align: center;
    margin-block-end: var(--space-2);
}

.agent-menu-dropdown .agent-menu__content p,
.agent-menu-dropdown .agent-menu__content h2 {
    color: var(--c-navy-blue);
}

.agent-menu-dropdown .agent-menu__actions .cta {
    width: 100%;
}

/* Ensure sign-out secondary border is always burnt orange regardless of theme-dark context */
.agent-menu-dropdown .cta[data-variant="secondary"] {
    border: 1px solid var(--c-burnt-orange);
    background-color: #fff;
    color: var(--c-burnt-orange);
}

/* ===================================================
   LOGIN BUTTON LOADING STATE
   =================================================== */

.agent-login .cta[data-loading="true"] {
    pointer-events: none;
    opacity: 0.85;
}

/* ===================================================
   RESPONSIVE
   =================================================== */

@media (max-width: 768px) {
    .agent-registration-form .col-md-6,
    .agent-registration-form .col-md-12 {
        flex: 0 0 100%;
        max-width: 100%;
    }

    .agent-registration-form .flex > .form-field {
        flex: 0 0 100%;
    }
}