/**
 * Ezy Loan Manager - Multi-Step Form CSS
 * Version: 3.1.0
 * Basic functional styling (will be beautified later)
 */

/* Container */
.ezy-multistep-container {
    max-width: 800px;
    margin: 40px auto;
    padding: 20px;
    overflow-x: hidden;
}

/* PSA Notice */
.ezy-psa-notice {
    background: #fef3c7;
    border: 2px solid #fbbf24;
    border-radius: 8px;
    padding: 20px;
    margin-bottom: 30px;
    display: flex;
    gap: 15px;
}

.ezy-psa-icon {
    font-size: 24px;
    flex-shrink: 0;
}

.ezy-psa-content h3 {
    margin: 0 0 10px 0;
    color: #92400e;
}

.ezy-psa-content p {
    margin: 0 0 10px 0;
    color: #78350f;
}

.ezy-psa-details {
    margin-top: 10px;
}

.ezy-psa-details summary {
    cursor: pointer;
    font-weight: bold;
    color: #92400e;
    padding: 5px 0;
}

.ezy-psa-details ul {
    margin: 10px 0 0 20px;
    color: #78350f;
}

.ezy-psa-details li {
    margin: 5px 0;
}

/* Progress Bar */
.ezy-progress-bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 40px;
    padding: 0 20px;
}

.ezy-progress-step {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    cursor: pointer;
    flex-shrink: 0;
}

.ezy-step-number {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: #e5e7eb;
    color: #6b7280;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: bold;
    transition: all 0.3s;
}

.ezy-progress-step.active .ezy-step-number {
    background: #1e40af;
    color: white;
}

.ezy-progress-step.completed .ezy-step-number {
    background: #10b981;
    color: white;
}

.ezy-step-label {
    font-size: 12px;
    color: #6b7280;
    text-align: center;
}

.ezy-progress-step.active .ezy-step-label {
    color: #1e40af;
    font-weight: bold;
}

.ezy-progress-line {
    flex: 1;
    height: 2px;
    background: #e5e7eb;
    margin: 0 10px;
}

/* Form Steps */
.ezy-multistep-form {
    background: white;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    padding: 30px;
}

.ezy-form-step {
    display: none;
}

.ezy-form-step.active {
    display: block;
}

.ezy-form-step h2 {
    margin: 0 0 20px 0;
    color: #1e40af;
}

.ezy-form-step h3 {
    margin: 20px 0 15px 0;
    color: #1f2937;
}

.ezy-step-description {
    color: #6b7280;
    margin-bottom: 20px;
}

/* Form Fields */
.ezy-form-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
    margin-bottom: 20px;
}

.ezy-form-group {
    margin-bottom: 20px;
}

.ezy-form-group label {
    display: block;
    margin-bottom: 8px;
    font-weight: 600;
    color: #374151;
}

.required {
    color: #ef4444;
}

.ezy-form-group input[type="text"],
.ezy-form-group input[type="email"],
.ezy-form-group input[type="tel"],
.ezy-form-group input[type="number"],
.ezy-form-group select,
.ezy-form-group textarea {
    width: 100%;
    padding: 10px 12px;
    border: 1px solid #d1d5db;
    border-radius: 6px;
    font-size: 14px;
}

.ezy-form-group input:focus,
.ezy-form-group select:focus,
.ezy-form-group textarea:focus {
    outline: none;
    border-color: #1e40af;
    box-shadow: 0 0 0 3px rgba(30, 64, 175, 0.1);
}

.ezy-form-group input[readonly] {
    background: #f3f4f6;
    cursor: not-allowed;
}

.ezy-form-group small {
    display: block;
    margin-top: 5px;
    font-size: 12px;
    color: #6b7280;
}

.error {
    border-color: #ef4444 !important;
}

.ezy-error-message {
    color: #ef4444;
    font-size: 12px;
    margin-top: 5px;
}

/* Photo Upload */
.ezy-photo-preview {
    margin-top: 15px;
    text-align: center;
}

.ezy-photo-preview img {
    max-width: 200px;
    max-height: 200px;
    border-radius: 8px;
    border: 2px solid #d1d5db;
}

.ezy-remove-photo {
    display: block;
    margin: 10px auto 0;
    padding: 5px 15px;
    background: #ef4444;
    color: white;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    font-size: 12px;
}

.ezy-remove-photo:hover {
    background: #dc2626;
}

/* Loan Summary */
.ezy-loan-summary {
    background: #f0f9ff;
    border: 1px solid #0ea5e9;
    border-radius: 8px;
    padding: 20px;
    margin-top: 20px;
}

.ezy-loan-summary h3 {
    margin: 0 0 15px 0;
    color: #0369a1;
}

.ezy-summary-row {
    display: flex;
    justify-content: space-between;
    padding: 10px 0;
    border-bottom: 1px solid #bae6fd;
}

.ezy-summary-row:last-child {
    border-bottom: none;
}

.ezy-summary-highlight {
    background: #0369a1;
    color: white;
    padding: 15px 20px !important;
    margin: 10px -20px 0;
    border-radius: 8px;
    font-size: 18px;
    font-weight: bold;
}

/* Navigation Buttons */
.ezy-form-navigation {
    display: flex;
    justify-content: space-between;
    gap: 15px;
    margin-top: 30px;
    padding-top: 20px;
    border-top: 1px solid #e5e7eb;
}

.ezy-btn {
    padding: 12px 30px;
    border: none;
    border-radius: 6px;
    font-size: 16px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s;
}

.ezy-btn-primary {
    background: #1e40af;
    color: white;
}

.ezy-btn-primary:hover {
    background: #1e3a8a;
}

.ezy-btn-secondary {
    background: #6b7280;
    color: white;
}

.ezy-btn-secondary:hover {
    background: #4b5563;
}

.ezy-btn-success {
    background: #10b981;
    color: white;
}

.ezy-btn-success:hover {
    background: #059669;
}

/* Loading Overlay */
.ezy-loading-overlay {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.7);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    z-index: 9999;
}

.ezy-spinner {
    width: 50px;
    height: 50px;
    border: 4px solid rgba(255, 255, 255, 0.3);
    border-top-color: white;
    border-radius: 50%;
    animation: spin 0.8s linear infinite;
}

@keyframes spin {
    to { transform: rotate(360deg); }
}

.ezy-loading-overlay p {
    color: white;
    margin-top: 20px;
    font-size: 16px;
}

/* Success Message */
.ezy-success-message {
    text-align: center;
    padding: 40px 20px;
}

.ezy-success-icon {
    width: 80px;
    height: 80px;
    background: #10b981;
    color: white;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 40px;
    margin: 0 auto 20px;
}

.ezy-success-message h2 {
    color: #10b981;
    margin-bottom: 15px;
}

.ezy-success-message p {
    color: #6b7280;
    margin-bottom: 10px;
}

.ezy-redirect-message {
    font-weight: bold;
    color: #1e40af;
    margin: 20px 0;
}

/* Mobile Responsive */
@media (max-width: 768px) {
    .ezy-multistep-container {
        padding: 15px;
        margin: 20px auto;
    }
    
    .ezy-multistep-form {
        padding: 20px;
    }
    
    .ezy-form-row {
        grid-template-columns: 1fr;
        gap: 0;
    }
    
    .ezy-progress-bar {
        padding: 0 5px;
        gap: 5px;
        overflow-x: auto;
        overflow-y: hidden;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none; /* Firefox */
        -ms-overflow-style: none; /* IE/Edge */
    }
    
    .ezy-progress-bar::-webkit-scrollbar {
        display: none; /* Chrome/Safari */
    }
    
    .ezy-progress-step {
        min-width: 60px;
        flex-shrink: 0;
    }
    
    .ezy-step-label {
        font-size: 9px;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        max-width: 60px;
    }
    
    .ezy-step-number {
        width: 30px;
        height: 30px;
        font-size: 12px;
    }
    
    .ezy-progress-line {
        margin: 0 3px;
        min-width: 10px;
    }
    
    .ezy-form-navigation {
        flex-direction: column;
    }
    
    .ezy-btn {
        width: 100%;
    }
    
    .ezy-psa-notice {
        flex-direction: column;
    }
}

/* Contract Box */
.ezy-contract-box {
    background: #ffffff;
    border: 2px solid #cbd5e1;
    border-radius: 8px;
    padding: 30px;
    max-height: 500px;
    overflow-y: auto;
    margin-bottom: 25px;
    font-size: 14px;
    line-height: 1.8;
}

.ezy-contract-box h3 {
    color: #1e40af;
    font-size: 20px;
    margin-bottom: 20px;
}

.ezy-contract-box h4 {
    color: #1e3a8a;
    font-size: 16px;
    margin-top: 25px;
    margin-bottom: 12px;
}

.ezy-contract-box ul {
    margin-left: 20px;
    margin-bottom: 15px;
}

.ezy-contract-box li {
    margin-bottom: 8px;
}

.ezy-agreement-checkbox {
    background: #f0f9ff;
    border: 2px solid #3b82f6;
    border-radius: 8px;
    padding: 20px;
    margin-bottom: 20px;
}

.ezy-checkbox-label {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    cursor: pointer;
    font-size: 15px;
    line-height: 1.6;
}

.ezy-checkbox-label input[type="checkbox"] {
    margin-top: 4px;
    width: 20px;
    height: 20px;
    cursor: pointer;
    flex-shrink: 0;
}

.ezy-agreement-note {
    background: #fef3c7;
    border-left: 4px solid #f59e0b;
    padding: 15px 20px;
    border-radius: 4px;
    font-size: 13px;
    color: #92400e;
}

.ezy-agreement-note strong {
    color: #78350f;
}

/* Due Date Highlight */
.ezy-summary-due {
    background: #fef3c7;
    padding: 15px 20px !important;
    margin: 10px -20px 0;
    border-radius: 8px;
    border-left: 4px solid #f59e0b;
    font-size: 16px;
    font-weight: bold;
}

.ezy-summary-due strong {
    color: #92400e;
}

/* Document Preview Styles */
.ezy-doc-preview {
    margin-top: 10px;
    padding: 10px;
    border: 1px solid #e2e8f0;
    border-radius: 4px;
    background: #f8fafc;
}

.ezy-doc-preview img {
    max-width: 200px;
    max-height: 200px;
    border-radius: 4px;
}

.ezy-file-list {
    margin-top: 10px;
    padding: 10px;
    background: #f8fafc;
    border-radius: 4px;
}

.ezy-file-item {
    display: flex;
    align-items: center;
    padding: 8px;
    margin-bottom: 5px;
    background: white;
    border: 1px solid #e2e8f0;
    border-radius: 4px;
}

.ezy-file-item span {
    flex: 1;
    font-size: 14px;
}

.ezy-file-item small {
    color: #64748b;
    margin-left: 10px;
}

/* Contract Header */
.ezy-contract-header {
    text-align: center;
    margin-bottom: 30px;
    padding-bottom: 20px;
    border-bottom: 2px solid #1e40af;
}

.ezy-contract-logo {
    max-width: 200px;
    height: auto;
    margin-bottom: 10px;
}

/* Contract Content */
.ezy-contract-content {
    line-height: 1.8;
}

.ezy-contract-content p {
    margin-bottom: 15px;
}

.ezy-contract-content ol {
    margin-left: 20px;
    margin-top: 10px;
}

.ezy-contract-content ol li {
    margin-bottom: 8px;
}

/* Signature Section */
.ezy-signature-section {
    margin-top: 30px;
    padding: 20px;
    background: #f8fafc;
    border-radius: 8px;
}

.ezy-signature-display {
    margin: 20px 0;
    padding: 20px;
    background: white;
    border: 2px solid #1e40af;
    border-radius: 8px;
}

.ezy-signature-cursive {
    font-family: 'Dancing Script', 'Brush Script MT', cursive;
    font-size: 36px;
    color: #1e40af;
    text-align: center;
    padding: 20px;
    min-height: 60px;
    font-weight: bold;
}

.ezy-contract-footer-info {
    margin-top: 20px;
    padding-top: 20px;
    border-top: 1px solid #e2e8f0;
}

.ezy-contract-footer-info p {
    margin-bottom: 10px;
    font-size: 14px;
}

.ezy-contract-footer-info span {
    font-weight: bold;
    color: #1e40af;
}

/* Import cursive font */
@import url('https://fonts.googleapis.com/css2?family=Dancing+Script:wght@700&display=swap');

/* ============================================================================
   v4.59.0 — Modern form refresh (brand-driven via --primary-blue / --dark-blue)
   CSS only; no markup changes. Rounded fields, brand focus ring, type-based
   field icons, refreshed stepper, brand-recoloured banners, app-style buttons.
   ============================================================================ */
.ezy-multistep-form .ezy-form-step.active{
  background:#fff;border:1px solid #eef1f6;border-radius:16px;padding:24px;
  box-shadow:0 1px 2px rgba(16,24,40,.04),0 10px 28px rgba(16,24,40,.05);
}
.ezy-multistep-form .ezy-form-step h2{font-size:19px;font-weight:800;letter-spacing:-.01em;color:#0f172a;}
.ezy-multistep-form .ezy-step-description{color:#8a96a8;font-size:14px;}
.ezy-multistep-form .ezy-form-group{margin-bottom:18px;}
.ezy-multistep-form .ezy-form-group label{font-size:13px;font-weight:700;color:#41506a;margin-bottom:6px;}
.ezy-multistep-form .ezy-form-group input[type="text"],
.ezy-multistep-form .ezy-form-group input[type="email"],
.ezy-multistep-form .ezy-form-group input[type="tel"],
.ezy-multistep-form .ezy-form-group input[type="number"],
.ezy-multistep-form .ezy-form-group input[type="date"],
.ezy-multistep-form .ezy-form-group input[type="password"],
.ezy-multistep-form .ezy-form-group select,
.ezy-multistep-form .ezy-form-group textarea{
  width:100%;box-sizing:border-box;padding:13px 14px;border:1.5px solid #e2e7f0;border-radius:11px;
  font-size:15px;color:#0f172a;background:#fcfdff;transition:border-color .15s,box-shadow .15s;
}
.ezy-multistep-form .ezy-form-group input::placeholder,
.ezy-multistep-form .ezy-form-group textarea::placeholder{color:#aeb7c6;}
.ezy-multistep-form .ezy-form-group input:focus,
.ezy-multistep-form .ezy-form-group select:focus,
.ezy-multistep-form .ezy-form-group textarea:focus{
  outline:none;border-color:var(--primary-blue,#1f4fd8);background:#fff;
  box-shadow:0 0 0 4px color-mix(in srgb, var(--primary-blue,#1f4fd8) 16%, transparent);
}
/* type-based field icons (no markup needed) */
.ezy-multistep-form .ezy-form-group input[type="email"],
.ezy-multistep-form .ezy-form-group input[type="tel"],
.ezy-multistep-form .ezy-form-group input[type="date"],
.ezy-multistep-form .ezy-form-group input[type="number"]{
  padding-left:42px;background-repeat:no-repeat;background-position:13px center;background-size:18px 18px;
}
.ezy-multistep-form .ezy-form-group input[type="email"]{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%2394a3b8' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='14' rx='2'/%3E%3Cpath d='m3 7 9 6 9-6'/%3E%3C/svg%3E");}
.ezy-multistep-form .ezy-form-group input[type="tel"]{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%2394a3b8' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 4h4l2 5-3 2a14 14 0 0 0 6 6l2-3 5 2v4a2 2 0 0 1-2 2A17 17 0 0 1 3 6a2 2 0 0 1 2-2z'/%3E%3C/svg%3E");}
.ezy-multistep-form .ezy-form-group input[type="date"]{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%2394a3b8' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='16' rx='2'/%3E%3Cpath d='M3 9h18M8 3v4M16 3v4'/%3E%3C/svg%3E");}
.ezy-multistep-form .ezy-form-group input[type="number"]{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%2394a3b8' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='12' y1='2' x2='12' y2='22'/%3E%3Cpath d='M17 5H9.5a3.5 3.5 0 0 0 0 7h5a3.5 3.5 0 0 1 0 7H6'/%3E%3C/svg%3E");}
.ezy-multistep-form .ezy-form-group small{font-size:12px;color:#8a96a8;}
/* stepper */
.ezy-progress-step .ezy-step-number{width:34px;height:34px;border-radius:50%;font-weight:800;font-size:14px;background:#e6eaf2;color:#97a2b5;display:flex;align-items:center;justify-content:center;}
.ezy-progress-step.active .ezy-step-number,
.ezy-progress-step.completed .ezy-step-number{background:var(--primary-blue,#1f4fd8);color:#fff;}
.ezy-progress-step.active .ezy-step-label{color:var(--primary-blue,#1f4fd8);font-weight:700;}
.ezy-progress-step .ezy-step-label{font-size:11px;font-weight:600;color:#97a2b5;}
.ezy-progress-line{background:#e6eaf2;}
/* banners: recolour the purple officer box + PSA notice to the brand */
.ezy-multistep-container .loan-officer-selection{background:linear-gradient(135deg,var(--primary-blue,#1f4fd8),var(--dark-blue,#163ba6)) !important;border-radius:14px !important;}
.ezy-psa-notice{background:color-mix(in srgb, var(--primary-blue,#1f4fd8) 8%, #fff) !important;border:1px solid color-mix(in srgb, var(--primary-blue,#1f4fd8) 28%, #e2e7f0) !important;border-radius:12px !important;}
/* buttons */
.ezy-multistep-form .ezy-btn{border-radius:11px;padding:14px 22px;font-weight:700;font-size:15px;}
.ezy-multistep-form .ezy-btn-primary{background:var(--primary-blue,#1f4fd8) !important;border:0 !important;}
.ezy-multistep-form .ezy-btn-primary:hover{background:var(--dark-blue,#163ba6) !important;}

/* ============================================================================
   v4.61.0 — Demo skin ("Aurora") — scoped to .ezy-skin-demo only.
   A richer, more premium look for the LMS demo subdomain. Markup-free and
   fully brand-driven (var(--primary-blue)/--dark-blue). Live client sites do
   NOT get this class, so their forms are untouched. Promotable later by
   applying the skin class site-wide.
   ============================================================================ */
.ezy-skin-demo{
  --ac: var(--primary-blue,#1e40af);
  --ac2: var(--dark-blue,#1e3a8a);
  --ink:#0f172a; --muted:#64748b; --line:#e8edf5; --field:#f7f9fc;
  --soft: color-mix(in srgb, var(--primary-blue,#1e40af) 7%, #fff);
  --soft2: color-mix(in srgb, var(--primary-blue,#1e40af) 20%, #fff);
}
/* one elevated card; the step panels inside become borderless */
.ezy-skin-demo.ezy-multistep-container{
  max-width:780px; margin:0 auto;
  background:#fff; border:1px solid var(--line); border-radius:24px;
  padding:clamp(18px,4vw,38px);
  box-shadow:0 24px 64px -28px rgba(15,23,42,.22), 0 6px 18px -12px rgba(15,23,42,.12);
}
.ezy-skin-demo .ezy-form-step.active{
  background:transparent !important; border:0 !important; box-shadow:none !important;
  padding:0 !important; animation:ezyAuroraIn .36s cubic-bezier(.22,.61,.36,1) both;
}
@keyframes ezyAuroraIn{ from{opacity:0; transform:translateY(10px);} to{opacity:1; transform:none;} }

/* step heading with accent underline */
.ezy-skin-demo .ezy-form-step > h2{
  position:relative; font-size:clamp(19px,3.2vw,23px); font-weight:800; color:var(--ink);
  margin:0 0 22px; padding-bottom:14px; border-bottom:1px solid var(--line);
}
.ezy-skin-demo .ezy-form-step > h2::after{
  content:""; position:absolute; left:0; bottom:-1px; width:48px; height:3px; border-radius:3px;
  background:linear-gradient(90deg,var(--ac),var(--ac2));
}

/* PSA notice */
.ezy-skin-demo .ezy-psa-notice{
  background:linear-gradient(180deg,var(--soft),#fff) !important;
  border:1px solid var(--soft2) !important; border-left:4px solid var(--ac) !important;
  border-radius:16px !important; padding:18px 20px !important;
}
.ezy-skin-demo .ezy-psa-content h3{ color:var(--ink); }
.ezy-skin-demo .ezy-psa-details summary{ color:var(--ac); font-weight:700; }

/* progress stepper */
.ezy-skin-demo .ezy-progress-step .ezy-step-number{
  width:42px; height:42px; font-size:15px; background:#eef2f8; color:#94a3b8;
  border:2px solid #fff; box-shadow:0 0 0 1px var(--line); transition:all .25s ease;
}
.ezy-skin-demo .ezy-progress-step.active .ezy-step-number,
.ezy-skin-demo .ezy-progress-step.completed .ezy-step-number{
  background:linear-gradient(135deg,var(--ac),var(--ac2)) !important; color:#fff !important;
  box-shadow:0 8px 18px -8px color-mix(in srgb,var(--ac) 70%, transparent) !important;
}
.ezy-skin-demo .ezy-progress-step.active .ezy-step-label{ color:var(--ac2) !important; font-weight:800; }
.ezy-skin-demo .ezy-progress-line{ background:var(--line); }
@media(max-width:640px){
  .ezy-skin-demo .ezy-progress-bar{ overflow-x:auto; overflow-y:hidden; -webkit-overflow-scrolling:touch; padding-bottom:4px; }
  .ezy-skin-demo .ezy-progress-step{ flex:0 0 auto; }
}

/* fields — note background-COLOR (not shorthand) so type icons survive */
.ezy-skin-demo .ezy-form-group{ margin-bottom:18px; }
.ezy-skin-demo .ezy-form-group > label{ font-size:13px; font-weight:600; color:#334155; }
/* explicit type list (same specificity as the icon rule below) so the icon
   padding-left is NOT overridden — otherwise placeholders sit under the icon */
.ezy-skin-demo .ezy-form-group input[type="text"],
.ezy-skin-demo .ezy-form-group input[type="email"],
.ezy-skin-demo .ezy-form-group input[type="tel"],
.ezy-skin-demo .ezy-form-group input[type="number"],
.ezy-skin-demo .ezy-form-group input[type="date"],
.ezy-skin-demo .ezy-form-group input[type="password"],
.ezy-skin-demo .ezy-form-group select,
.ezy-skin-demo .ezy-form-group textarea{
  width:100%; box-sizing:border-box; padding:14px 15px; font-size:15px; color:var(--ink);
  background-color:var(--field); border:1.5px solid var(--line); border-radius:13px;
  transition:border-color .18s, box-shadow .18s, background-color .18s;
}
.ezy-skin-demo .ezy-form-group input:focus,
.ezy-skin-demo .ezy-form-group select:focus,
.ezy-skin-demo .ezy-form-group textarea:focus{
  outline:none; background-color:#fff; border-color:var(--ac);
  box-shadow:0 0 0 4px color-mix(in srgb,var(--ac) 16%, transparent);
}
/* keep the type icons (background-image comes from the base refresh) */
.ezy-skin-demo .ezy-form-group input[type="email"],
.ezy-skin-demo .ezy-form-group input[type="tel"],
.ezy-skin-demo .ezy-form-group input[type="date"],
.ezy-skin-demo .ezy-form-group input[type="number"]{
  padding-left:44px; background-repeat:no-repeat; background-position:15px center; background-size:18px 18px;
}

/* file inputs → soft dropzone */
.ezy-skin-demo .ezy-form-group input[type=file]{
  width:100%; box-sizing:border-box; padding:14px; border:1.5px dashed #cbd5e1; border-radius:13px;
  background-color:var(--field); font-size:13.5px; color:#64748b; cursor:pointer; transition:border-color .18s, background-color .18s;
}
.ezy-skin-demo .ezy-form-group input[type=file]:hover{ border-color:var(--ac); background-color:color-mix(in srgb,var(--ac) 5%, #fff); }
.ezy-skin-demo .ezy-form-group input[type=file]::file-selector-button{
  margin-right:12px; padding:9px 15px; border:0; border-radius:10px; cursor:pointer;
  background:linear-gradient(135deg,var(--ac),var(--ac2)); color:#fff; font-weight:700;
}

/* loan-officer cards (override inline styles) */
.ezy-skin-demo .officer-option{ border-radius:14px !important; border:2px solid var(--line) !important; background:#fff !important; transition:all .18s ease !important; }
.ezy-skin-demo .officer-option:hover{ border-color:var(--ac) !important; transform:translateY(-1px); box-shadow:0 10px 22px -14px rgba(15,23,42,.3); }
.ezy-skin-demo .officer-option:has(input:checked){ border-color:var(--ac) !important; background:var(--soft) !important; }

/* buttons */
.ezy-skin-demo .ezy-form-navigation{ display:flex; gap:12px; align-items:center; margin-top:28px; }
.ezy-skin-demo .ezy-btn{ border-radius:13px; padding:14px 26px; font-weight:800; font-size:15px; transition:transform .15s, box-shadow .15s, background .15s, border-color .15s; }
.ezy-skin-demo .ezy-btn-primary,
.ezy-skin-demo .ezy-btn-success{
  background:linear-gradient(135deg,var(--ac),var(--ac2)) !important; color:#fff !important; border:0 !important;
  box-shadow:0 12px 26px -12px color-mix(in srgb,var(--ac) 72%, transparent);
}
.ezy-skin-demo .ezy-btn-primary:hover,
.ezy-skin-demo .ezy-btn-success:hover{ transform:translateY(-1px); box-shadow:0 16px 32px -12px color-mix(in srgb,var(--ac) 78%, transparent); }
.ezy-skin-demo .ezy-btn-secondary{ background:#fff !important; color:#475569 !important; border:1.5px solid var(--line) !important; }
.ezy-skin-demo .ezy-btn-secondary:hover{ background:#f8fafc !important; border-color:#cbd5e1 !important; }
.ezy-skin-demo .ezy-btn-next, .ezy-skin-demo .ezy-btn-submit{ margin-left:auto; }
@media(max-width:560px){
  .ezy-skin-demo .ezy-form-navigation{ flex-direction:column-reverse; }
  .ezy-skin-demo .ezy-btn{ width:100%; margin-left:0 !important; }
}

/* summary / contract / agreement */
.ezy-skin-demo .ezy-summary-row{ display:flex; justify-content:space-between; gap:16px; padding:12px 2px; border-bottom:1px solid var(--line); font-size:14.5px; color:#334155; }
.ezy-skin-demo .ezy-summary-highlight{ background:var(--soft) !important; border:0 !important; border-radius:12px; margin-top:8px; padding:14px 14px; font-weight:800; color:var(--ink); }
.ezy-skin-demo .ezy-contract-box{ border:1px solid var(--line); border-radius:14px; background:#fcfdff; padding:18px; max-height:340px; overflow:auto; }
.ezy-skin-demo .ezy-contract-header h3{ color:var(--ac2) !important; letter-spacing:.06em; }
.ezy-skin-demo .ezy-agreement-checkbox{ background:var(--soft); border:1px solid var(--soft2); border-radius:13px; padding:14px 16px; margin-top:16px; }
.ezy-skin-demo .ezy-checkbox-label{ display:flex; gap:10px; align-items:flex-start; font-size:13.5px; color:#334155; }
.ezy-skin-demo .ezy-checkbox-label input[type=checkbox]{ margin-top:3px; width:18px; height:18px; accent-color:var(--ac); }

/* ============================================================================
   v4.63.0 — Amount-first intro (demo only; shown when .ezy-has-intro present).
   Additive layer: hides the stepper/form until the applicant picks an amount.
   ============================================================================ */
.ezy-amount-intro{ display:none; }
.ezy-has-intro:not(.ezy-intro-done) .ezy-amount-intro{ display:block; }
.ezy-has-intro:not(.ezy-intro-done) .ezy-psa-notice,
.ezy-has-intro:not(.ezy-intro-done) .ezy-progress-bar,
.ezy-has-intro:not(.ezy-intro-done) .ezy-multistep-form{ display:none !important; }

.ezy-amount-intro{ text-align:center; max-width:560px; margin:0 auto; padding:6px 4px 4px;
  animation:ezyAuroraIn .4s cubic-bezier(.22,.61,.36,1) both; }
.ezy-amount-intro .eai-eyebrow{ color:var(--primary-blue,#1e40af); font-weight:800; text-transform:uppercase; letter-spacing:.12em; font-size:12px; margin-bottom:8px; }
.ezy-amount-intro .eai-title{ font-size:clamp(24px,5vw,32px); font-weight:800; color:#0f172a; margin:0 0 8px; letter-spacing:-.01em; }
.ezy-amount-intro .eai-sub{ color:#64748b; font-size:15px; max-width:46ch; margin:0 auto 18px; line-height:1.5; }
.ezy-amount-intro .eai-amount{ font-size:clamp(40px,11vw,56px); font-weight:800; color:var(--primary-blue,#1e40af); letter-spacing:-.02em; line-height:1; margin:8px 0 12px; }
.ezy-amount-intro #eai-slider{ -webkit-appearance:none; appearance:none; width:100%; height:8px; border-radius:999px;
  background:color-mix(in srgb, var(--primary-blue,#1e40af) 18%, #e8edf5); outline:none; margin:4px 0 6px; }
.ezy-amount-intro #eai-slider::-webkit-slider-thumb{ -webkit-appearance:none; appearance:none; width:26px; height:26px; border-radius:50%;
  background:var(--primary-blue,#1e40af); border:3px solid #fff; box-shadow:0 2px 8px rgba(15,23,42,.25); cursor:pointer; }
.ezy-amount-intro #eai-slider::-moz-range-thumb{ width:24px; height:24px; border-radius:50%; background:var(--primary-blue,#1e40af); border:3px solid #fff; box-shadow:0 2px 8px rgba(15,23,42,.25); cursor:pointer; }
.ezy-amount-intro .eai-range-ends{ display:flex; justify-content:space-between; color:#94a3b8; font-size:12px; margin-bottom:16px; }
.ezy-amount-intro .eai-label{ display:block; text-align:left; font-size:13px; font-weight:600; color:#334155; margin:4px 0 6px; }
.ezy-amount-intro .eai-plan{ width:100%; box-sizing:border-box; padding:13px 15px; border:1.5px solid var(--line,#e8edf5); border-radius:13px; background-color:#f7f9fc; font-size:15px; color:#0f172a; }
.ezy-amount-intro .eai-preview{ background:color-mix(in srgb, var(--primary-blue,#1e40af) 6%, #fff); border:1px solid color-mix(in srgb, var(--primary-blue,#1e40af) 18%, #fff); border-radius:16px; padding:14px 18px; margin:20px 0; text-align:left; }
.ezy-amount-intro .eai-pv-row{ display:flex; justify-content:space-between; align-items:baseline; padding:10px 0; border-bottom:1px solid rgba(15,23,42,.06); font-size:14.5px; color:#475569; }
.ezy-amount-intro .eai-pv-row:last-child{ border-bottom:0; }
.ezy-amount-intro .eai-pv-row strong{ color:#0f172a; font-weight:800; }
.ezy-amount-intro .eai-pv-row:first-child strong{ font-size:22px; color:var(--primary-blue,#1e40af); }
.ezy-amount-intro .eai-pv-total strong{ color:#0f172a; font-size:17px; }
.ezy-amount-intro .eai-continue{ width:100%; justify-content:center; margin-top:4px; }
.ezy-amount-intro .eai-fineprint{ color:#94a3b8; font-size:12px; margin:12px 0 0; }
/* "Change amount" back link injected at top of step 1 */
.ezy-skin-demo .ezy-form-step .eai-back{ background:none; border:0; color:var(--primary-blue,#1e40af); font-weight:700; font-size:14px; cursor:pointer; padding:0; margin:0 0 14px; }
.ezy-skin-demo .ezy-form-step .eai-back:hover{ text-decoration:underline; }

/* v4.63.1 — on phones, trim the demo card so fields fill the width (less "boxed") */
@media (max-width:600px){
  .ezy-skin-demo.ezy-multistep-container{ padding:16px 12px; border-radius:16px; }
  .ezy-skin-demo .ezy-amount-intro{ padding-left:2px; padding-right:2px; }
}

/* v4.65.0 — file upload preview (all sites) */
.ezy-file-list{ margin-top:10px; display:flex; flex-direction:column; gap:8px; }
.ezy-file-item{ display:flex; align-items:center; gap:12px; padding:8px; background:#f7f9fc; border:1px solid #e8edf5; border-radius:12px; }
.ezy-file-thumb{ width:52px; height:52px; border-radius:10px; object-fit:cover; flex:0 0 auto; background:#eef2f8; border:1px solid #e2e7f0; }
.ezy-file-thumb-doc{ display:flex; align-items:center; justify-content:center; font-size:24px; }
.ezy-file-meta{ display:flex; flex-direction:column; min-width:0; }
.ezy-file-name{ font-size:13.5px; font-weight:600; color:#0f172a; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; max-width:60vw; }
.ezy-file-size{ font-size:12px; color:#64748b; }

/* v4.65.0 — custom styled dropdown (demo skin only) */
.ezy-skin-demo .ezy-sel{ position:relative; }
.ezy-skin-demo select.ezy-sel-native{ position:absolute !important; width:1px; height:1px; opacity:0; pointer-events:none; overflow:hidden; }
.ezy-skin-demo .ezy-sel-btn{ width:100%; box-sizing:border-box; display:flex; align-items:center; justify-content:space-between; gap:10px;
  padding:14px 15px; font-size:15px; text-align:left; color:#0f172a; background:#f7f9fc; border:1.5px solid var(--line,#e8edf5); border-radius:13px; cursor:pointer;
  transition:border-color .18s, box-shadow .18s, background-color .18s; }
.ezy-skin-demo .ezy-sel-btn:hover{ border-color:#cbd5e1; }
.ezy-skin-demo .ezy-sel-btn[aria-expanded="true"]{ background:#fff; border-color:var(--primary-blue,#1e40af); box-shadow:0 0 0 4px color-mix(in srgb, var(--primary-blue,#1e40af) 16%, transparent); }
.ezy-skin-demo .ezy-sel-lbl{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ezy-skin-demo .ezy-sel-ph{ color:#94a3b8; }
.ezy-skin-demo .ezy-sel-chev{ flex:0 0 auto; color:#64748b; display:flex; transition:transform .2s; }
.ezy-skin-demo .ezy-sel-btn[aria-expanded="true"] .ezy-sel-chev{ transform:rotate(180deg); }
.ezy-skin-demo .ezy-sel-panel{ position:absolute; left:0; right:0; top:calc(100% + 6px); z-index:60; display:none;
  background:#fff; border:1px solid var(--line,#e8edf5); border-radius:14px; box-shadow:0 20px 48px -18px rgba(15,23,42,.35); padding:6px; max-height:300px; overflow:auto; }
.ezy-skin-demo .ezy-sel.open .ezy-sel-panel{ display:block; }
.ezy-skin-demo .ezy-sel-group{ font-size:11px; font-weight:800; text-transform:uppercase; letter-spacing:.08em; color:#94a3b8; padding:10px 12px 4px; }
.ezy-skin-demo .ezy-sel-opt{ display:flex; align-items:center; justify-content:space-between; gap:10px; padding:11px 12px; border-radius:10px; font-size:14.5px; color:#0f172a; cursor:pointer; }
.ezy-skin-demo .ezy-sel-opt:hover{ background:color-mix(in srgb, var(--primary-blue,#1e40af) 8%, #fff); }
.ezy-skin-demo .ezy-sel-opt[aria-selected="true"]{ background:color-mix(in srgb, var(--primary-blue,#1e40af) 12%, #fff); color:var(--primary-blue,#1e40af); font-weight:700; }
.ezy-skin-demo .ezy-sel-opt[aria-selected="true"]::after{ content:"\2713"; font-weight:800; }