/* ============================================================
   Aamartaka Eligibility Checker – Frontend Styles
   All layout & visual properties use !important to override
   any conflicting theme CSS. Scoped under .aace-wrapper for
   safety so only plugin elements are affected.
   ============================================================ */

/* ------ CSS Custom Properties ------ */
.aace-wrapper {
    --aace-blue:        #00AEEF;
    --aace-blue-dark:   #0091C7;
    --aace-blue-light:  #E6F7FD;
    --aace-white:       #FFFFFF;
    --aace-gray-bg:     #F4F7FA;
    --aace-gray-border: #DDE3EC;
    --aace-gray-text:   #6B7A8D;
    --aace-dark:        #2C3E50;
    --aace-green:       #27AE60;
    --aace-red:         #E74C3C;
    --aace-radius:      8px;
    --aace-shadow:      0 2px 12px rgba(0,0,0,.10);
}

/* Box-sizing reset scoped to plugin only */
.aace-wrapper,
.aace-wrapper *,
.aace-wrapper *::before,
.aace-wrapper *::after {
    box-sizing: border-box !important;
}

/* ============================================================
   WRAPPER
   ============================================================ */
.aace-wrapper {
    display:         flex !important;
    flex-direction:  row !important;
    flex-wrap:       nowrap !important;
    gap:             20px !important;
    max-width:       1140px !important;
    width:           100% !important;
    margin:          30px auto !important;
    padding:         0 !important;
    font-family:     'Segoe UI', Arial, sans-serif !important;
    font-size:       14px !important;
    line-height:     1.5 !important;
    color:           var(--aace-dark) !important;
    align-items:     flex-start !important;
}

/* ============================================================
   FORM PANEL
   ============================================================ */
.aace-form-panel {
    flex:          1 1 65% !important;
    min-width:     0 !important;
    background:    var(--aace-white) !important;
    border-radius: var(--aace-radius) !important;
    box-shadow:    var(--aace-shadow) !important;
    overflow:      hidden !important;
}

/* ============================================================
   HEADER
   ============================================================ */
.aace-form-header {
    background:    linear-gradient(135deg, var(--aace-blue) 0%, var(--aace-blue-dark) 100%) !important;
    color:         #fff !important;
    padding:       16px 24px !important;
    display:       flex !important;
    align-items:   center !important;
    position:      relative !important;
    gap:           12px !important;
}
.aace-form-header h2 {
    margin:      0 !important;
    padding:     0 !important;
    font-size:   20px !important;
    font-weight: 700 !important;
    color:       #fff !important;
    line-height: 1.3 !important;
    border:      none !important;
    background:  none !important;
}
.aace-header-icon {
    background:      rgba(255,255,255,.2) !important;
    border-radius:   8px !important;
    width:           44px !important;
    height:          44px !important;
    min-width:       44px !important;
    display:         flex !important;
    align-items:     center !important;
    justify-content: center !important;
    flex-shrink:     0 !important;
}

/* ============================================================
   DARK MODE TOGGLE
   ============================================================ */
.aace-dark-mode-toggle {
    margin-left:  auto !important;
    display:      flex !important;
    align-items:  center !important;
    gap:          8px !important;
    color:        #fff !important;
    opacity:      .8 !important;
}
.aace-dm-switch {
    position: relative !important;
    display:  inline-block !important;
    width:    40px !important;
    height:   22px !important;
}
.aace-dm-switch input { display: none !important; }
.aace-dm-slider {
    position:         absolute !important;
    cursor:           pointer !important;
    top:              0 !important;
    left:             0 !important;
    right:            0 !important;
    bottom:           0 !important;
    background-color: rgba(0,0,0,.2) !important;
    transition:       .4s !important;
    border-radius:    22px !important;
}
.aace-dm-slider:before {
    position:         absolute !important;
    content:          "" !important;
    height:           16px !important;
    width:            16px !important;
    left:             3px !important;
    bottom:           3px !important;
    background-color: white !important;
    transition:       .4s !important;
    border-radius:    50% !important;
}
.aace-dm-switch input:checked + .aace-dm-slider { background-color: var(--aace-blue-dark) !important; }
.aace-dm-switch input:checked + .aace-dm-slider:before { transform: translateX(18px) !important; }

/* ============================================================
   PROGRESS BAR
   ============================================================ */
.aace-progress-bar {
    display:         flex !important;
    align-items:     flex-end !important;
    justify-content: space-between !important;
    padding:         16px 28px 8px !important;
    position:        relative !important;
    background:      var(--aace-white) !important;
}
.aace-progress-track {
    position:   absolute !important;
    left:       60px !important;
    right:      60px !important;
    top:        30px !important;
    height:     3px !important;
    background: var(--aace-gray-border) !important;
    z-index:    0 !important;
}
.aace-progress-fill {
    height:     100% !important;
    background: var(--aace-blue) !important;
    transition: width .4s ease !important;
}
.aace-step-node {
    display:        flex !important;
    flex-direction: column !important;
    align-items:    center !important;
    position:       relative !important;
    z-index:        1 !important;
}
.aace-step-label {
    font-size:      10px !important;
    color:          var(--aace-gray-text) !important;
    margin-bottom:  6px !important;
    font-weight:    600 !important;
    letter-spacing: .5px !important;
}
.aace-step-dot {
    width:           30px !important;
    height:          30px !important;
    border-radius:   50% !important;
    background:      var(--aace-white) !important;
    border:          2px solid var(--aace-gray-border) !important;
    display:         flex !important;
    align-items:     center !important;
    justify-content: center !important;
    font-size:       12px !important;
    font-weight:     700 !important;
    color:           var(--aace-gray-text) !important;
    transition:      all .3s !important;
}
.aace-step-dot.active {
    border-color: var(--aace-blue) !important;
    color:        var(--aace-blue) !important;
    box-shadow:   0 0 0 3px rgba(0,174,239,.15) !important;
}
.aace-step-dot.completed {
    background:   var(--aace-blue) !important;
    border-color: var(--aace-blue) !important;
    color:        #fff !important;
}
.aace-step-dot.completed .step-num  { display: none !important; }
.aace-step-dot .step-check          { display: none !important; }
.aace-step-dot.completed .step-check { display: block !important; }

/* ============================================================
   STEP PANELS
   ============================================================ */
.aace-step   { padding: 20px 28px !important; }
.aace-hidden { display: none !important; }

/* ============================================================
   FIELD ROWS
   ============================================================ */
.aace-field-row {
    display:     flex !important;
    align-items: center !important;
    gap:         16px !important;
    margin:      0 0 16px !important;
    padding:     0 !important;
    flex-wrap:   wrap !important;
    width:       100% !important;
}
.aace-label {
    min-width:   160px !important;
    font-weight: 500 !important;
    color:       var(--aace-dark) !important;
    flex-shrink: 0 !important;
    margin:      0 !important;
    padding:     0 !important;
    font-size:   14px !important;
    line-height: 1.4 !important;
}
.aace-label-full { width: 100% !important; min-width: unset !important; }

/* ============================================================
   SELECTS & INPUTS
   ============================================================ */
.aace-select,
.aace-input {
    flex:               1 !important;
    min-width:          0 !important;
    width:              100% !important;
    padding:            9px 12px !important;
    border:             1px solid var(--aace-gray-border) !important;
    border-radius:      var(--aace-radius) !important;
    font-size:          14px !important;
    font-family:        inherit !important;
    color:              var(--aace-dark) !important;
    background:         var(--aace-white) !important;
    outline:            none !important;
    transition:         border-color .2s !important;
    box-shadow:         none !important;
    appearance:         auto !important;
    -webkit-appearance: auto !important;
    -moz-appearance:    auto !important;
    height:             auto !important;
    line-height:        1.4 !important;
    margin:             0 !important;
    display:            block !important;
}
.aace-select:focus,
.aace-input:focus {
    border-color: var(--aace-blue) !important;
    box-shadow:   0 0 0 3px rgba(0,174,239,.12) !important;
    outline:      none !important;
}
.aace-select.aace-unselected       { color: var(--aace-gray-text) !important; }
.aace-select option[disabled]      { color: var(--aace-gray-text) !important; }
.aace-select option:not([disabled]) { color: var(--aace-dark) !important; }

/* ============================================================
   DOB GROUP — three selects always side-by-side
   ============================================================ */
.aace-dob-group {
    display:   flex !important;
    gap:       8px !important;
    flex:      1 !important;
    min-width: 0 !important;
    width:     100% !important;
    flex-wrap: nowrap !important;
}
.aace-dob-group select {
    flex:               1 1 0 !important;
    min-width:          0 !important;
    width:              0 !important;
    padding:            9px 4px !important;
    border:             1px solid var(--aace-gray-border) !important;
    border-radius:      var(--aace-radius) !important;
    font-size:          13px !important;
    font-family:        inherit !important;
    color:              var(--aace-dark) !important;
    background:         var(--aace-white) !important;
    outline:            none !important;
    appearance:         auto !important;
    -webkit-appearance: auto !important;
    -moz-appearance:    auto !important;
    box-shadow:         none !important;
    height:             auto !important;
    line-height:        1.4 !important;
    margin:             0 !important;
    overflow:           hidden !important;
    text-overflow:      ellipsis !important;
    display:            block !important;
}
.aace-dob-group select:focus {
    border-color: var(--aace-blue) !important;
    box-shadow:   0 0 0 3px rgba(0,174,239,.12) !important;
}
.aace-dob-group select.aace-unselected { color: var(--aace-gray-text) !important; }

/* ============================================================
   EXPERIENCE GROUP
   ============================================================ */
.aace-exp-group {
    display:   flex !important;
    gap:       8px !important;
    flex:      1 !important;
    min-width: 0 !important;
    width:     100% !important;
}
.aace-exp-group select {
    flex:               1 1 0 !important;
    min-width:          0 !important;
    padding:            9px 6px !important;
    border:             1px solid var(--aace-gray-border) !important;
    border-radius:      var(--aace-radius) !important;
    font-size:          13px !important;
    font-family:        inherit !important;
    color:              var(--aace-dark) !important;
    background:         var(--aace-white) !important;
    outline:            none !important;
    appearance:         auto !important;
    -webkit-appearance: auto !important;
    -moz-appearance:    auto !important;
    box-shadow:         none !important;
    height:             auto !important;
    margin:             0 !important;
    display:            block !important;
}
.aace-exp-group select:focus {
    border-color: var(--aace-blue) !important;
    box-shadow:   0 0 0 3px rgba(0,174,239,.12) !important;
}
.aace-exp-group select.aace-unselected { color: var(--aace-gray-text) !important; }

/* ============================================================
   INCOME GROUP
   ============================================================ */
.aace-income-group {
    display:     flex !important;
    flex:        1 !important;
    align-items: stretch !important;
    min-width:   0 !important;
}
.aace-income-group .aace-input {
    border-radius: var(--aace-radius) 0 0 var(--aace-radius) !important;
    border-right:  none !important;
    flex:          1 !important;
}
.aace-currency {
    padding:       9px 12px !important;
    background:    var(--aace-gray-bg) !important;
    border:        1px solid var(--aace-gray-border) !important;
    border-radius: 0 var(--aace-radius) var(--aace-radius) 0 !important;
    font-weight:   600 !important;
    font-size:     14px !important;
    color:         var(--aace-gray-text) !important;
    white-space:   nowrap !important;
    display:       flex !important;
    align-items:   center !important;
}

/* ============================================================
   RADIO BUTTONS
   ============================================================ */
.aace-radio-group {
    display:   flex !important;
    gap:       10px !important;
    flex-wrap: wrap !important;
    flex:      1 !important;
}
.aace-radio-btn {
    display:       flex !important;
    align-items:   center !important;
    gap:           6px !important;
    padding:       8px 16px !important;
    border:        1.5px solid var(--aace-gray-border) !important;
    border-radius: 22px !important;
    cursor:        pointer !important;
    transition:    all .2s !important;
    user-select:   none !important;
    font-size:     14px !important;
    color:         var(--aace-dark) !important;
    background:    var(--aace-white) !important;
    margin:        0 !important;
}
.aace-radio-btn input { display: none !important; }
.aace-radio-btn:has(input:checked),
.aace-radio-btn.selected {
    border-color: var(--aace-blue) !important;
    color:        var(--aace-blue) !important;
    background:   var(--aace-blue-light) !important;
    font-weight:  600 !important;
}
.aace-radio-btn:before {
    content:       '' !important;
    width:         14px !important;
    height:        14px !important;
    border-radius: 50% !important;
    border:        2px solid var(--aace-gray-border) !important;
    display:       inline-block !important;
    transition:    all .2s !important;
    flex-shrink:   0 !important;
}
.aace-radio-btn:has(input:checked):before {
    background:   var(--aace-blue) !important;
    border-color: var(--aace-blue) !important;
    box-shadow:   inset 0 0 0 3px #fff !important;
}

/* ============================================================
   DIVIDER
   ============================================================ */
.aace-divider {
    text-align:     left !important;
    margin:         20px 0 12px !important;
    padding-bottom: 6px !important;
    font-weight:    700 !important;
    color:          var(--aace-gray-text) !important;
    font-size:      12px !important;
    text-transform: uppercase !important;
    letter-spacing: 1px !important;
    border-bottom:  1px solid var(--aace-gray-border) !important;
    width:          100% !important;
}

/* ============================================================
   YES / NO CARDS
   ============================================================ */
.aace-yesno-group {
    display:   flex !important;
    gap:       16px !important;
    flex:      1 !important;
    min-width: 0 !important;
}
.aace-yesno-card {
    flex:          1 !important;
    border:        2px solid var(--aace-gray-border) !important;
    border-radius: var(--aace-radius) !important;
    padding:       22px 16px !important;
    text-align:    center !important;
    cursor:        pointer !important;
    font-size:     16px !important;
    font-weight:   700 !important;
    color:         var(--aace-dark) !important;
    background:    var(--aace-white) !important;
    transition:    all .25s !important;
    user-select:   none !important;
}
.aace-yesno-card:hover {
    border-color: var(--aace-blue) !important;
    background:   var(--aace-blue-light) !important;
}
.aace-yesno-card.aace-selected {
    background:   var(--aace-blue) !important;
    border-color: var(--aace-blue) !important;
    color:        #fff !important;
}
.aace-yesno-icon {
    width:           36px !important;
    height:          36px !important;
    border-radius:   50% !important;
    margin:          10px auto 0 !important;
    display:         flex !important;
    align-items:     center !important;
    justify-content: center !important;
    font-size:       18px !important;
    font-weight:     700 !important;
}
.aace-check-icon { border: 2px solid currentColor !important; }
.aace-cross-icon  { border: 2px solid currentColor !important; }
.aace-yesno-card.aace-selected .aace-yesno-icon {
    border-color: rgba(255,255,255,.7) !important;
    color:        rgba(255,255,255,.9) !important;
}

/* ============================================================
   LOAN ROW
   ============================================================ */
.aace-loan-row {
    background:    var(--aace-gray-bg) !important;
    border:        1px solid var(--aace-gray-border) !important;
    border-radius: var(--aace-radius) !important;
    padding:       14px !important;
    margin-bottom: 12px !important;
}
.aace-loan-row-title {
    font-weight:   600 !important;
    font-size:     13px !important;
    margin-bottom: 10px !important;
    color:         var(--aace-blue) !important;
}
.aace-loan-row-fields {
    display:               grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap:                   8px !important;
}
.aace-loan-row-fields .aace-select,
.aace-loan-row-fields .aace-input {
    width: 100% !important;
    flex:  unset !important;
}
.aace-loan-amount-row {
    display:    flex !important;
    gap:        8px !important;
    margin-top: 8px !important;
}
.aace-loan-amount-row .aace-input { flex: 1 !important; }
.aace-pct {
    padding:       9px 10px !important;
    background:    var(--aace-gray-bg) !important;
    border:        1px solid var(--aace-gray-border) !important;
    border-radius: 0 var(--aace-radius) var(--aace-radius) 0 !important;
    color:         var(--aace-gray-text) !important;
    font-size:     14px !important;
}
.aace-loan-amount-row .aace-input:last-of-type {
    border-radius: var(--aace-radius) 0 0 var(--aace-radius) !important;
}
.aace-conditional { margin-top: 12px !important; }

/* ============================================================
   INPUT WITH ICON
   ============================================================ */
.aace-input-icon-wrap {
    position:  relative !important;
    flex:      1 !important;
    min-width: 0 !important;
}
.aace-input-icon {
    position:       absolute !important;
    left:           10px !important;
    top:            50% !important;
    transform:      translateY(-50%) !important;
    pointer-events: none !important;
    font-size:      16px !important;
    opacity:        .6 !important;
}
.aace-input-icon-field { padding-left: 36px !important; }

/* ============================================================
   LEAD BANNER
   ============================================================ */
.aace-lead-banner {
    display:       flex !important;
    align-items:   center !important;
    gap:           16px !important;
    background:    var(--aace-blue-light) !important;
    border:        1px solid rgba(0,174,239,.2) !important;
    border-radius: var(--aace-radius) !important;
    padding:       16px 20px !important;
    margin:        0 28px 20px !important;
}
.aace-lead-icon {
    width:           50px !important;
    height:          50px !important;
    background:      var(--aace-blue) !important;
    border-radius:   var(--aace-radius) !important;
    color:           #fff !important;
    font-size:       24px !important;
    display:         flex !important;
    align-items:     center !important;
    justify-content: center !important;
    flex-shrink:     0 !important;
}
.aace-lead-banner h3 {
    margin:      0 0 2px !important;
    padding:     0 !important;
    font-size:   17px !important;
    color:       var(--aace-dark) !important;
    font-weight: 700 !important;
    border:      none !important;
    background:  none !important;
}
.aace-lead-banner p {
    margin:    0 !important;
    padding:   0 !important;
    color:     var(--aace-gray-text) !important;
    font-size: 13px !important;
}

/* ============================================================
   TERMS / ERRORS / SUCCESS
   ============================================================ */
.aace-terms {
    font-size: 12px !important;
    color:     var(--aace-gray-text) !important;
    margin:    4px 0 12px !important;
}
.aace-terms a { color: var(--aace-blue) !important; font-weight: 600 !important; }
.aace-error-box {
    background:    #FDECEA !important;
    border:        1px solid #F5C6CB !important;
    border-radius: var(--aace-radius) !important;
    padding:       10px 14px !important;
    color:         var(--aace-red) !important;
    margin-bottom: 12px !important;
    font-size:     13px !important;
}
.aace-success-box {
    background:    #EAF7EF !important;
    border:        1px solid #C3E6CB !important;
    border-radius: var(--aace-radius) !important;
    padding:       10px 14px !important;
    color:         var(--aace-green) !important;
    margin-bottom: 12px !important;
    font-size:     13px !important;
}

/* ============================================================
   NAVIGATION BUTTONS
   ============================================================ */
.aace-nav {
    display:         flex !important;
    justify-content: flex-end !important;
    gap:             12px !important;
    padding:         16px 28px 20px !important;
    border-top:      1px solid var(--aace-gray-border) !important;
    margin-top:      12px !important;
    flex-wrap:       wrap !important;
}
.aace-nav-final { justify-content: space-between !important; }
.aace-btn-next,
.aace-btn-submit {
    background:     var(--aace-blue) !important;
    color:          #fff !important;
    border:         none !important;
    padding:        11px 30px !important;
    border-radius:  24px !important;
    font-size:      14px !important;
    font-family:    inherit !important;
    font-weight:    700 !important;
    cursor:         pointer !important;
    letter-spacing: .5px !important;
    transition:     background .2s, transform .1s !important;
    outline:        none !important;
    box-shadow:     none !important;
    text-transform: none !important;
    line-height:    1.4 !important;
    display:        inline-flex !important;
    align-items:    center !important;
    justify-content:center !important;
    gap:            6px !important;
}
.aace-btn-next:hover,
.aace-btn-submit:hover {
    background: var(--aace-blue-dark) !important;
    transform:  translateY(-1px) !important;
    color:      #fff !important;
}
.aace-btn-back {
    background:     transparent !important;
    color:          var(--aace-gray-text) !important;
    border:         1.5px solid var(--aace-gray-border) !important;
    padding:        11px 28px !important;
    border-radius:  24px !important;
    font-size:      14px !important;
    font-family:    inherit !important;
    font-weight:    600 !important;
    cursor:         pointer !important;
    transition:     all .2s !important;
    outline:        none !important;
    box-shadow:     none !important;
    text-transform: none !important;
    line-height:    1.4 !important;
}
.aace-btn-back:hover {
    border-color: var(--aace-blue) !important;
    color:        var(--aace-blue) !important;
}
.aace-btn-submit { min-width: 160px !important; }

/* ============================================================
   SIDEBAR — DESKTOP
   ============================================================ */
.aace-sidebar {
    flex:          0 0 280px !important;
    width:         280px !important;
    background:    var(--aace-white) !important;
    border-radius: var(--aace-radius) !important;
    box-shadow:    var(--aace-shadow) !important;
    overflow:      hidden !important;
    position:      sticky !important;
    top:           20px !important;
}
.aace-sidebar-profile {
    display:       flex !important;
    align-items:   center !important;
    gap:           12px !important;
    padding:       16px !important;
    border-bottom: 1px solid var(--aace-gray-border) !important;
}
.aace-sidebar-avatar {
    width:           52px !important;
    height:          52px !important;
    border-radius:   50% !important;
    background:      var(--aace-blue-light) !important;
    border:          2px solid var(--aace-blue) !important;
    display:         flex !important;
    align-items:     center !important;
    justify-content: center !important;
    flex-shrink:     0 !important;
    color:           var(--aace-blue) !important;
    font-size:       24px !important;
}
.aace-sidebar-name-block strong {
    font-size:     15px !important;
    color:         var(--aace-dark) !important;
    display:       block !important;
    margin-bottom: 2px !important;
    font-weight:   700 !important;
}
.aace-sidebar-meta {
    font-size:   12px !important;
    color:       var(--aace-gray-text) !important;
    display:     flex !important;
    align-items: center !important;
    gap:         4px !important;
    line-height: 1.6 !important;
}
.aace-sidebar-items { padding: 8px 0 12px !important; }
.aace-sidebar-section-heading {
    font-size:      11px !important;
    font-weight:    700 !important;
    text-transform: uppercase !important;
    letter-spacing: 1px !important;
    color:          var(--aace-gray-text) !important;
    padding:        10px 16px 4px !important;
    background:     var(--aace-gray-bg) !important;
    border-top:     1px solid var(--aace-gray-border) !important;
    border-bottom:  1px solid var(--aace-gray-border) !important;
    margin:         0 !important;
}
.aace-sidebar-item {
    display:       flex !important;
    align-items:   flex-start !important;
    gap:           10px !important;
    padding:       10px 16px !important;
    border-bottom: 1px solid var(--aace-gray-border) !important;
    transition:    background .15s !important;
}
.aace-sidebar-item:last-child { border-bottom: none !important; }
.aace-sidebar-item:hover      { background: var(--aace-gray-bg) !important; }
.aace-sbi-icon {
    width:           32px !important;
    height:          32px !important;
    border-radius:   50% !important;
    background:      var(--aace-blue-light) !important;
    display:         flex !important;
    align-items:     center !important;
    justify-content: center !important;
    flex-shrink:     0 !important;
    color:           var(--aace-blue) !important;
}
.aace-sbi-label {
    font-size:      11px !important;
    color:          var(--aace-blue) !important;
    font-weight:    600 !important;
    text-transform: uppercase !important;
    letter-spacing: .5px !important;
    margin-bottom:  2px !important;
}
.aace-sbi-value {
    font-size:   13px !important;
    color:       var(--aace-dark) !important;
    font-weight: 500 !important;
}

/* ============================================================
   SIDEBAR CLOSE BUTTON (mobile only — shown via media query)
   ============================================================ */
.aace-sidebar-close {
    display:         none !important;
    position:        absolute !important;
    top:             8px !important;
    right:           10px !important;
    width:           28px !important;
    height:          28px !important;
    align-items:     center !important;
    justify-content: center !important;
    background:      rgba(0,174,239,.10) !important;
    border:          1px solid rgba(0,174,239,.25) !important;
    border-radius:   50% !important;
    color:           var(--aace-blue) !important;
    font-size:       18px !important;
    line-height:     1 !important;
    cursor:          pointer !important;
    padding:         0 !important;
    transition:      background .2s, color .2s, transform .15s !important;
    z-index:         5 !important;
}
.aace-sidebar-close:hover {
    background: var(--aace-blue) !important;
    color:      #fff !important;
    transform:  scale(1.1) !important;
}

/* ============================================================
   SIDEBAR RESTORE BUTTON (mobile only — shown via media query)
   ============================================================ */
.aace-sidebar-restore {
    display:         none !important;
    order:           2 !important;
    width:           100% !important;
    align-items:     center !important;
    justify-content: center !important;
    gap:             6px !important;
    padding:         10px 16px !important;
    background:      var(--aace-blue-light) !important;
    border:          1px dashed var(--aace-blue) !important;
    border-radius:   var(--aace-radius) !important;
    color:           var(--aace-blue) !important;
    font-size:       13px !important;
    font-family:     inherit !important;
    font-weight:     600 !important;
    cursor:          pointer !important;
    transition:      background .2s, color .2s !important;
    margin:          0 0 4px !important;
    box-shadow:      none !important;
    text-transform:  none !important;
}
.aace-sidebar-restore:hover {
    background: var(--aace-blue) !important;
    color:      #fff !important;
}
.aace-sidebar-restore .dashicons {
    font-size:   16px !important;
    width:       16px !important;
    height:      16px !important;
    line-height: 1.1 !important;
}

/* ============================================================
   OTP / HONEYPOT / CAPTCHA
   ============================================================ */
#aace-resend-otp.aace-disabled {
    pointer-events: none !important;
    opacity:        0.6 !important;
    cursor:         not-allowed !important;
}
.aace-otp-digit:disabled {
    background: var(--aace-gray-bg) !important;
    opacity:    0.7 !important;
    cursor:     not-allowed !important;
}
.aace-honeypot-field {
    opacity:  0 !important;
    position: absolute !important;
    top:      0 !important;
    left:     0 !important;
    height:   0 !important;
    width:    0 !important;
    z-index:  -1 !important;
}
.aace-math-captcha-field {
    background:    var(--aace-blue-light) !important;
    border:        1px solid var(--aace-gray-border) !important;
    border-radius: var(--aace-radius) !important;
    padding:       10px 12px !important;
    width:         100% !important;
}
.aace-math-captcha-label {
    display:       block !important;
    font-size:     13px !important;
    font-weight:   600 !important;
    color:         var(--aace-dark) !important;
    margin-bottom: 7px !important;
}
.aace-math-captcha-label span {
    color:       var(--aace-blue) !important;
    font-weight: 700 !important;
}
.aace-math-captcha-field input[type="number"] {
    width:         100% !important;
    padding:       8px 12px !important;
    border:        1px solid var(--aace-gray-border) !important;
    border-radius: var(--aace-radius) !important;
    font-size:     14px !important;
    font-family:   inherit !important;
    color:         var(--aace-dark) !important;
    background:    var(--aace-white) !important;
    outline:       none !important;
    box-shadow:    none !important;
    transition:    border-color .2s !important;
    margin:        0 !important;
}
.aace-math-captcha-field input[type="number"]:focus {
    border-color: var(--aace-blue) !important;
    box-shadow:   0 0 0 3px rgba(0,174,239,.12) !important;
}

/* ============================================================
   FLOATING HELP BUTTON
   ============================================================ */
@keyframes aacePulse {
    0%   { transform: scale(1);    box-shadow: 0 4px 12px rgba(0,0,0,.2); }
    50%  { transform: scale(1.08); box-shadow: 0 8px 24px rgba(0,174,239,.3); }
    100% { transform: scale(1);    box-shadow: 0 4px 12px rgba(0,0,0,.2); }
}
.aace-help-btn {
    position:        fixed !important;
    bottom:          30px !important;
    right:           30px !important;
    width:           50px !important;
    height:          50px !important;
    background:      var(--aace-blue) !important;
    color:           #fff !important;
    border-radius:   50% !important;
    display:         flex !important;
    align-items:     center !important;
    justify-content: center !important;
    font-size:       24px !important;
    font-weight:     700 !important;
    cursor:          pointer !important;
    box-shadow:      0 4px 12px rgba(0,0,0,.2) !important;
    z-index:         9990 !important;
    transition:      transform .2s, background .2s !important;
    animation:       aacePulse 2s infinite ease-in-out !important;
    border:          none !important;
}
.aace-help-btn:hover {
    animation:  none !important;
    transform:  scale(1.1) !important;
    background: var(--aace-blue-dark) !important;
}

/* ============================================================
   HELP MODAL
   ============================================================ */
@keyframes aaceFadeIn {
    from { opacity: 0; transform: translateY(20px); }
    to   { opacity: 1; transform: translateY(0); }
}
.aace-help-modal {
    display:          none !important;
    position:         fixed !important;
    z-index:          9999 !important;
    left:             0 !important;
    top:              0 !important;
    width:            100% !important;
    height:           100% !important;
    background-color: rgba(0,0,0,.5) !important;
    align-items:      center !important;
    justify-content:  center !important;
    backdrop-filter:  blur(2px) !important;
}
.aace-help-modal[style*="flex"] { display: flex !important; }
.aace-help-content {
    background:    var(--aace-white) !important;
    color:         var(--aace-dark) !important;
    padding:       30px !important;
    border-radius: var(--aace-radius) !important;
    width:         90% !important;
    max-width:     420px !important;
    position:      relative !important;
    box-shadow:    0 10px 25px rgba(0,0,0,.2) !important;
    animation:     aaceFadeIn .3s !important;
}
.aace-help-close {
    position:    absolute !important;
    top:         10px !important;
    right:       15px !important;
    font-size:   28px !important;
    font-weight: 700 !important;
    color:       var(--aace-gray-text) !important;
    cursor:      pointer !important;
    line-height: 1 !important;
    background:  transparent !important;
    border:      none !important;
    padding:     0 !important;
}
.aace-help-close:hover { color: var(--aace-red) !important; }
.aace-help-content h3 {
    margin:      0 0 8px !important;
    padding:     0 !important;
    color:       var(--aace-blue) !important;
    font-size:   18px !important;
    font-weight: 700 !important;
    border:      none !important;
    background:  none !important;
}
.aace-help-content p {
    margin:    0 0 8px !important;
    padding:   0 !important;
    font-size: 14px !important;
    color:     var(--aace-gray-text) !important;
}
#aace-help-form     { margin-top: 20px !important; }
.aace-help-field    { margin-bottom: 12px !important; }
.aace-help-field input,
.aace-help-field textarea {
    width:         100% !important;
    padding:       9px 12px !important;
    border:        1px solid var(--aace-gray-border) !important;
    border-radius: var(--aace-radius) !important;
    font-size:     14px !important;
    font-family:   inherit !important;
    color:         var(--aace-dark) !important;
    background:    var(--aace-gray-bg) !important;
    outline:       none !important;
    transition:    border-color .2s !important;
    box-shadow:    none !important;
    margin:        0 !important;
    display:       block !important;
}
.aace-help-field input:focus,
.aace-help-field textarea:focus {
    border-color: var(--aace-blue) !important;
    background:   var(--aace-white) !important;
    outline:      none !important;
}
.aace-help-content .aace-btn-submit { width: 100% !important; margin-top: 8px !important; }
#aace-help-messages { margin-bottom: 10px !important; }

/* ============================================================
   RESPONSIVE — TABLET (≤ 860px)
   ============================================================ */
@media (max-width: 860px) {
    .aace-wrapper {
        flex-direction: column !important;
        flex-wrap:      wrap !important;
        margin:         12px !important;
        gap:            14px !important;
    }
    .aace-form-panel {
        width:     100% !important;
        flex:      1 1 100% !important;
        min-width: 0 !important;
        order:     1 !important;
    }
    .aace-sidebar {
        flex:                       1 1 100% !important;
        width:                      100% !important;
        max-width:                  100% !important;
        position:                   relative !important;
        order:                      2 !important;
        max-height:                 320px !important;
        overflow-y:                 scroll !important;
        overflow-x:                 hidden !important;
        border-top:                 3px solid var(--aace-blue) !important;
        scroll-behavior:            smooth !important;
        -webkit-overflow-scrolling: touch !important;
        scrollbar-width:            none !important;
        -ms-overflow-style:         none !important;
        top:                        auto !important;
    }
    .aace-sidebar::-webkit-scrollbar {
        width:      4px !important;
        background: transparent !important;
    }
    .aace-sidebar::-webkit-scrollbar-thumb {
        background:    transparent !important;
        border-radius: 4px !important;
    }
    .aace-sidebar:hover::-webkit-scrollbar-thumb,
    .aace-sidebar:focus-within::-webkit-scrollbar-thumb,
    .aace-sidebar.aace-scrolling::-webkit-scrollbar-thumb {
        background: rgba(0,174,239,.45) !important;
    }
    .aace-sidebar.aace-scrolling {
        scrollbar-width: thin !important;
        scrollbar-color: rgba(0,174,239,.45) transparent !important;
    }
    .aace-sidebar-close   { display: flex !important; }
    .aace-sidebar-restore { display: flex !important; }
    .aace-label           { min-width: 120px !important; }
    .aace-progress-track  { left: 40px !important; right: 40px !important; }
    /* DOB — keep side-by-side on tablet */
    .aace-dob-group {
        flex-wrap: nowrap !important;
        gap:       6px !important;
    }
    .aace-dob-group select {
        flex:      1 1 0 !important;
        min-width: 0 !important;
        width:     0 !important;
        padding:   9px 3px !important;
        font-size: 12px !important;
    }
    .aace-exp-group {
        flex-wrap: nowrap !important;
        gap:       6px !important;
    }
    .aace-exp-group select {
        flex:      1 1 0 !important;
        min-width: 0 !important;
        padding:   9px 4px !important;
        font-size: 12px !important;
    }
}

/* ============================================================
   RESPONSIVE — MOBILE (≤ 480px)
   ============================================================ */
@media (max-width: 480px) {
    .aace-wrapper  { margin: 8px !important; }
    .aace-step     { padding: 14px !important; }
    .aace-nav      { padding: 12px 14px 14px !important; }
    .aace-field-row {
        flex-direction: column !important;
        align-items:    stretch !important;
        gap:            6px !important;
    }
    .aace-label { min-width: unset !important; width: 100% !important; }
    /* DOB — still three columns even on very small phones */
    .aace-dob-group {
        flex-wrap:  nowrap !important;
        gap:        4px !important;
        width:      100% !important;
        flex:       1 1 100% !important;
    }
    .aace-dob-group select {
        flex:      1 1 0 !important;
        min-width: 0 !important;
        width:     0 !important;
        padding:   8px 2px !important;
        font-size: 11px !important;
    }
    /* Exp groups wrap on very small screens */
    .aace-exp-group {
        flex-wrap: wrap !important;
        gap:       6px !important;
    }
    .aace-exp-group select {
        flex:      1 1 calc(50% - 3px) !important;
        min-width: 0 !important;
        padding:   8px 6px !important;
        font-size: 13px !important;
    }
    .aace-loan-row-fields  { grid-template-columns: 1fr !important; }
    .aace-lead-banner {
        flex-direction: column !important;
        text-align:     center !important;
        margin:         0 14px 20px !important;
    }
    .aace-nav {
        flex-direction: column !important;
        align-items:    stretch !important;
    }
    .aace-btn-next,
    .aace-btn-submit,
    .aace-btn-back {
        width:      100% !important;
        text-align: center !important;
        justify-content: center !important;
    }
    .aace-progress-bar   { padding: 14px 16px 6px !important; }
    .aace-progress-track { left: 28px !important; right: 28px !important; }
    .aace-step-label     { font-size: 9px !important; letter-spacing: 0 !important; }
    .aace-step-dot       { width: 26px !important; height: 26px !important; font-size: 11px !important; }
    .aace-help-content   { padding: 20px !important; width: 94% !important; }
    .aace-sidebar        { max-height: 280px !important; }
}

/* ============================================================
   DESKTOP RESTORE (≥ 861px) — undo any mobile overrides
   ============================================================ */
@media (min-width: 861px) {
    .aace-wrapper {
        flex-direction: row !important;
        flex-wrap:      nowrap !important;
        margin:         30px auto !important;
    }
    .aace-form-panel {
        order: unset !important;
        flex:  1 1 65% !important;
    }
    .aace-sidebar {
        flex:       0 0 280px !important;
        width:      280px !important;
        position:   sticky !important;
        top:        20px !important;
        max-height: none !important;
        overflow:   hidden !important;
        order:      unset !important;
        border-top: none !important;
    }
    .aace-sidebar-close,
    .aace-sidebar-restore { display: none !important; }
    .aace-label { min-width: 160px !important; }
    .aace-dob-group select { font-size: 13px !important; padding: 9px 4px !important; }
    .aace-exp-group select  { font-size: 13px !important; }
}

/* ============================================================
   DARK MODE
   ============================================================ */
.aace-wrapper.dark-mode {
    --aace-white:       #2c3e50;
    --aace-gray-bg:     #34495e;
    --aace-gray-border: #4a657e;
    --aace-gray-text:   #bdc3c7;
    --aace-dark:        #ecf0f1;
    --aace-shadow:      0 2px 12px rgba(0,0,0,.3);
}
.aace-wrapper.dark-mode .aace-form-panel,
.aace-wrapper.dark-mode .aace-sidebar,
.aace-wrapper.dark-mode .aace-progress-bar {
    background: var(--aace-white) !important;
    color:      var(--aace-dark) !important;
}
.aace-wrapper.dark-mode .aace-select,
.aace-wrapper.dark-mode .aace-input,
.aace-wrapper.dark-mode .aace-dob-group select,
.aace-wrapper.dark-mode .aace-exp-group select {
    background:   var(--aace-white) !important;
    color:        var(--aace-dark) !important;
    border-color: var(--aace-gray-border) !important;
}
.aace-wrapper.dark-mode .aace-select.aace-unselected,
.aace-wrapper.dark-mode .aace-dob-group select.aace-unselected,
.aace-wrapper.dark-mode .aace-exp-group select.aace-unselected {
    color: var(--aace-gray-text) !important;
}
.aace-wrapper.dark-mode .aace-select:focus,
.aace-wrapper.dark-mode .aace-input:focus,
.aace-wrapper.dark-mode .aace-dob-group select:focus,
.aace-wrapper.dark-mode .aace-exp-group select:focus {
    border-color: var(--aace-blue) !important;
    box-shadow:   0 0 0 3px rgba(0,174,239,.2) !important;
}
.aace-wrapper.dark-mode option {
    background-color: var(--aace-white) !important;
    color:            var(--aace-dark) !important;
}
.aace-wrapper.dark-mode .aace-label { color: var(--aace-dark) !important; }
.aace-wrapper.dark-mode .aace-radio-btn {
    border-color: var(--aace-gray-border) !important;
    color:        var(--aace-dark) !important;
    background:   var(--aace-white) !important;
}
.aace-wrapper.dark-mode .aace-radio-btn:before { border-color: var(--aace-gray-border) !important; }
.aace-wrapper.dark-mode .aace-radio-btn:has(input:checked),
.aace-wrapper.dark-mode .aace-radio-btn.selected {
    background: rgba(0,174,239,.15) !important;
    color:      var(--aace-blue) !important;
}
.aace-wrapper.dark-mode .aace-currency {
    background:   var(--aace-gray-bg) !important;
    border-color: var(--aace-gray-border) !important;
    color:        var(--aace-gray-text) !important;
}
.aace-wrapper.dark-mode .aace-divider,
.aace-wrapper.dark-mode .aace-sidebar-section-heading {
    color:        var(--aace-gray-text) !important;
    border-color: var(--aace-gray-border) !important;
    background:   var(--aace-gray-bg) !important;
}
.aace-wrapper.dark-mode .aace-yesno-card {
    background:   var(--aace-white) !important;
    border-color: var(--aace-gray-border) !important;
    color:        var(--aace-dark) !important;
}
.aace-wrapper.dark-mode .aace-yesno-card:hover    { background: var(--aace-gray-bg) !important; }
.aace-wrapper.dark-mode .aace-yesno-card.aace-selected {
    background:   var(--aace-blue) !important;
    border-color: var(--aace-blue) !important;
    color:        #fff !important;
}
.aace-wrapper.dark-mode .aace-loan-row {
    background:   var(--aace-gray-bg) !important;
    border-color: var(--aace-gray-border) !important;
}
.aace-wrapper.dark-mode .aace-lead-banner {
    background:   var(--aace-gray-bg) !important;
    border-color: var(--aace-gray-border) !important;
}
.aace-wrapper.dark-mode .aace-lead-banner h3  { color: var(--aace-dark) !important; }
.aace-wrapper.dark-mode .aace-sidebar-profile,
.aace-wrapper.dark-mode .aace-sidebar-item    { border-color: var(--aace-gray-border) !important; }
.aace-wrapper.dark-mode .aace-sidebar-item:hover { background: var(--aace-gray-bg) !important; }
.aace-wrapper.dark-mode .aace-sidebar-name-block strong,
.aace-wrapper.dark-mode .aace-sbi-value       { color: var(--aace-dark) !important; }
.aace-wrapper.dark-mode .aace-sidebar-close {
    background:   rgba(0,174,239,.15) !important;
    border-color: rgba(0,174,239,.35) !important;
    color:        var(--aace-blue) !important;
}
.aace-wrapper.dark-mode .aace-sidebar-close:hover {
    background: var(--aace-blue) !important;
    color:      #fff !important;
}
.aace-wrapper.dark-mode .aace-sidebar-restore {
    background:   rgba(0,174,239,.10) !important;
    border-color: var(--aace-blue) !important;
    color:        var(--aace-blue) !important;
}
.aace-wrapper.dark-mode .aace-sidebar-restore:hover {
    background: var(--aace-blue) !important;
    color:      #fff !important;
}
.aace-wrapper.dark-mode .aace-help-content {
    background: var(--aace-white) !important;
    color:      var(--aace-dark) !important;
}
.aace-wrapper.dark-mode .aace-help-field input,
.aace-wrapper.dark-mode .aace-help-field textarea {
    background:   var(--aace-gray-bg) !important;
    color:        var(--aace-dark) !important;
    border-color: var(--aace-gray-border) !important;
}
.aace-wrapper.dark-mode .aace-math-captcha-field {
    background:   rgba(0,174,239,.08) !important;
    border-color: var(--aace-gray-border) !important;
}
.aace-wrapper.dark-mode .aace-math-captcha-field input[type="number"] {
    background:   var(--aace-white) !important;
    color:        var(--aace-dark) !important;
    border-color: var(--aace-gray-border) !important;
}