/* --------------------------------------
 * Microlender by Cladfy - Global and Structural Styles
 * Applied to BOTH Login and Register Blades
 * -------------------------------------- */

html, body {
    min-height: 100vh;
    height: 100%;
    margin: 0;
    padding: 0;
    overflow-x: hidden;
    /* FIX: Changed from 'hidden' to 'auto' to allow scroll on child elements to function */
    overflow-y: auto; 
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    background: #FFFFFF;
}

/* --- OVERRIDE: Container to Microlender Flex Layout --- */
.auth-container, .microlender-container { 
    display: flex !important;
    flex-direction: column; 
    min-height: 100vh;
    height: 100%;
    width: 100%;
    overflow: hidden;
    position: relative;
}
/* New Wrapper for Split Content: Takes remaining vertical space */
.microlender-main-content {
    flex: 1;
    display: flex;
    width: 100%;
    /* Full viewport height minus header height */
    height: calc(100vh - 70px); 
}
/* Left/Right panels - enabled for independent scrolling */
.auth-left, .auth-right, .microlender-left, .microlender-right {
    flex: 1;
    padding: 60px 80px;
    /* CRITICAL FOR SCROLLING: Allows content to scroll vertically if it overflows */
    overflow-y: auto; 
    position: relative;
    box-shadow: none !important; 
}

/* --- Microlender Header (Top Bar) --- */
.microlender-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 20px 40px;
    border-bottom: 1px solid #e5e5e5;
    height: 70px;
    box-sizing: border-box;
    z-index: 10;
    position: relative;
    width: 100%;
    flex-shrink: 0;
}

.cladfy-logo {
    max-width: 120px; 
    height: auto;
    display: block;
}

.microlender-account-links {
    font-size: 14px;
    color: #4b4d53;
}
.have-account-text {
    margin-right: 5px;
}
.sign-in-link, .microlender-login-fallback a {
    color: #000 !important;
    font-weight: 500;
    text-decoration: none;
    padding: 8px 15px;
    transition: background-color 0.2s;
}
.sign-in-link:hover, .microlender-login-fallback a:hover {
    text-decoration: underline;
}

/* --- Left Panel Styling (Microlender Aesthetic) --- */
.auth-left, .microlender-left {
    background: #f7f7f7 !important;
    display: flex;
    justify-content: center;
    align-items: center;
}

.overlay-content { /* Original wrapper in login.blade.php */
    background: none !important;
    padding: 0 !important;
    color: #000 !important;
    max-width: 500px;
    text-align: left;
}

.microlender-left-content { 
    max-width: 500px; 
    text-align: left;
}

/* Titles and Subtitles on the Left */
.overlay-content h3, .microlender-title { 
    font-size: 2.5rem; 
    font-weight: 700; 
    color: #000; 
    margin-bottom: 20px; 
}
.overlay-content p, .microlender-subtitle { 
    font-size: 1.1rem; 
    color: #4b4d53; 
    line-height: 1.5; 
    margin-bottom: 60px; 
}

/* Testimonial Styles */
.microlender-testimonial-box {
    background: #fff; 
    border-radius: 8px; 
    padding: 30px; 
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05); 
    border: 1px solid #eee; 
    margin-top: 50px;
}
.microlender-quote { font-size: 1rem; color: #4b4d53; line-height: 1.6; margin-bottom: 15px; font-weight: 400; }
.microlender-stars { color: #f0a300; font-size: 1.1rem; margin-bottom: 5px; }
.microlender-source-text { font-size: 0.9rem; color: #4b4d53; font-weight: 500; margin-top: 5px; margin-bottom: 15px; }
.cladfy-gray-logo { max-width: 90px; height: auto; filter: grayscale(100%); opacity: 0.7; }
.microlender-dots { display: flex; margin-top: 30px; padding-bottom: 30px; }
.microlender-dots span { width: 8px; height: 8px; background: #ccc; border-radius: 50%; margin-right: 8px; display: none; }
.microlender-dots .active { background: #000; width: 25px; border-radius: 4px; display: block; }


/* --- Right Panel Styling (Form) --- */
.auth-right, .microlender-right {
    background: #ffffff !important;
    display: flex;
    flex-direction: column; 
    justify-content: flex-start;
    align-items: center; /* Center the wrapper */
    padding-top: 60px;
    box-shadow: none !important;
}

.microlender-form-wrapper {
    width: 100%;
    max-width: 450px;
    margin: 0 auto; 
}

/* Card/Logo Cleanup for old elements */
.card-signin, .card-body {
    width: 100%;
    border: none !important;
    box-shadow: none !important;
    background: none !important;
    padding: 0 !important;
}
.logo, .text-center.mb-4 { 
    display: none !important; /* Hide original logo on right */
}

/* Form Titles - Repurposed to Microlender Look */
.section-title, .microlender-form-title {
    font-size: 1.5rem;
    font-weight: 600;
    color: #000;
    margin-bottom: 10px;
    text-align: left !important; /* Override original text-center */
}
.section-subtitle, .microlender-form-subtitle {
    font-size: 1rem;
    color: #4b4d53;
    margin-bottom: 30px;
    text-align: left !important; /* Override original text-center */
}
.text-center {
    text-align: left !important; /* Force align left for form section title/subtitle */
}


/* --- Form Control Styling (Original Classes, New Look) --- */

.form-signup label, .form-signin label {
    display: block;
    font-size: 14px;
    font-weight: 500;
    color: #4b4d53;
    margin-bottom: 8px;
}

.form-signin .form-control, .form-signup .form-control, 
.form-signin select.form-control, .form-signup select.form-control,
.form-signin .parent-box, .form-signup .parent-box {
    padding: 12px 15px !important;
    border: 1px solid #ced4da !important;
    border-radius: 4px;
    height: auto !important;
    font-size: 16px;
    font-weight: 400;
    box-sizing: border-box;
    transition: border-color 0.2s, box-shadow 0.2s;
    background-color: #fff; 
}

/* Input Focus Styling - Black Accent */
.form-signin .form-control:focus, .form-signup .form-control:focus, 
.form-signin select.form-control:focus, .form-signup select.form-control:focus,
.form-signin .parent-box:focus-within, .form-signup .parent-box:focus-within {
    border-color: #000 !important;
    box-shadow: 0 0 0 1px #000 !important;
}

/* Workspace URL specific styles (only on register, but safe here) */
.parent-box { padding: 0 0 0 10px !important; }
.parent-box .form-control { border: none !important; padding: 12px 15px !important; }
.microlender-url-prefix { color: #4b4d53; font-size: 16px; }


/* --- Button Styling (Original Classes, New Look) --- */
.btn-primary, .microlender-btn-continue { 
    color: #fff;
    background-color: #497abc !important; 
    border-color: #000 !important;
    font-weight: 500;
    padding: 12px 25px;
    font-size: 16px;
    border-radius: 4px;
    transition: all 0.2s;
    width: 100%; 
}

.btn-primary:hover, .btn-primary:active, .btn-primary:focus, .microlender-btn-continue:hover {
    background-color: #333 !important;
    border-color: #333 !important;
}

/* Checkbox (Remember Me) Styling */
.custom-control-label {
    font-weight: 400; /* Lighter font weight for label */
    font-size: 14px;
    color: #4b4d53;
    margin-left: 5px; /* Adjust spacing */
}
/* Ensure links within the form look good */
.btn-link, .microlender-form-links a {
    color: #000 !important;
    font-weight: 500;
    text-decoration: none;
    transition: text-decoration 0.2s;
}
.btn-link:hover, .microlender-form-links a:hover {
    text-decoration: underline;
}

/* --- Alerts and Feedback (Retained) --- */
.alert { border-radius: 4px; margin-bottom: 20px; padding: 10px 15px; font-size: 0.9rem; }
.invalid-feedback { display: block; width: 100%; margin-top: 0.25rem; font-size: 80%; color: #dc3545; }


/* --- Mobile Responsiveness --- */
@media (max-width: 992px) {
    .auth-left, .microlender-left {
        display: none !important;
    }
    
    .auth-container, .microlender-container {
        height: auto;
        min-height: 100vh;
        overflow-y: auto;
        align-items: flex-start;
    }
    .microlender-main-content {
        flex-direction: column;
        height: auto;
    }
    .auth-right, .microlender-right {
        flex: 0 0 100%;
        max-width: 100%;
        padding: 20px;
        /* Mobile: Let the entire viewport scroll, not just the panel */
        overflow-y: unset; 
    }
    .microlender-form-wrapper {
        max-width: 100%;
    }
    .form-group.row {
        margin-left: 0;
        margin-right: 0;
    }
    .microlender-submit-row {
        justify-content: center !important;
    }
}
.microlender-form-title span {
    color: #497abc; /* Bootstrap blue or your brand color */
    font-weight: 600;
}