/*
Theme Name: Hello Loans
Theme URI: https://elementor.com/hello-theme/
Description: Hello Loans is a child theme of Hello Elementor.
Author: Hello Loans
Author URI: https://elementor.com/
Template: hello-elementor
Version: 1.0.0
Text Domain: hello-loans
*/

/* Custom scrollbars and transition effects */
::-webkit-scrollbar { 
    width: 8px; 
    height: 8px; 
}
::-webkit-scrollbar-track { 
    background: #e2e8f0; 
}
::-webkit-scrollbar-thumb { 
    background: #94a3b8; 
    border-radius: 4px; 
}
::-webkit-scrollbar-thumb:hover { 
    background: #64748b; 
}

.dark ::-webkit-scrollbar-track { background: #374151; }
.dark ::-webkit-scrollbar-thumb { background: #6b7280; }
.dark ::-webkit-scrollbar-thumb:hover { background: #9ca3af; }

.custom-scrollbar::-webkit-scrollbar { width: 6px; height: 6px; }
.custom-scrollbar::-webkit-scrollbar-track { background: transparent; }
.custom-scrollbar::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 3px; }
.custom-scrollbar::-webkit-scrollbar-thumb:hover { background: #94a3b8; }

.dark .custom-scrollbar::-webkit-scrollbar-thumb { background: #6b7280; }
.dark .custom-scrollbar::-webkit-scrollbar-thumb:hover { background: #9ca3af; }

/* Shine hover effect */
.shine-effect-container { position: relative; overflow: hidden; }
.shine-effect {
    position: absolute; top: -50%; left: -50%;
    width: 200%; height: 200%;
    background-image: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.2) 50%, rgba(255, 255, 255, 0) 100%);
    transform: rotate(45deg); opacity: 0; transition: opacity 0.5s;
}
.shine-effect-container:hover .shine-effect { opacity: 1; animation: shine 1.5s ease-in-out; }

/* Section fade in */
.fade-in-section { opacity: 0; transform: translateY(20px); transition: opacity 0.6s ease-out, transform 0.6s ease-out; }
.fade-in-section.is-visible { opacity: 1; transform: translateY(0); }

/* Floating elements animation */
.floating {
    animation: float 3s ease-in-out infinite;
}
.floating-slow {
    animation: float 6s ease-in-out infinite;
}
.floating-slower {
    animation: float 8s ease-in-out infinite;
}

@keyframes float {
    0%, 100% { transform: translateY(0px); }
    50% { transform: translateY(-10px); }
}

/* Interactive elements */
.input-wrapper {
    position: relative;
    transition: all 0.3s ease;
}

.input-wrapper:focus-within {
    transform: translateY(-2px);
}

.input-icon {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 1rem;
    color: #94a3b8;
    transition: color 0.3s ease;
}

.dark-mode-toggle {
    transition: all 0.3s ease;
}

.dark-mode-toggle:hover {
    transform: scale(1.1);
}

/* Gradient backgrounds fallback */
.gradient-bg {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
}

.gradient-primary {
    background: linear-gradient(135deg, #0ea5e9 0%, #3b82f6 100%);
}

.gradient-secondary {
    background: linear-gradient(135deg, #64748b 0%, #475569 100%);
}

.mobile-fixed-buttons {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    margin: 0 auto;
    z-index: 50;
    display: flex;
}

@media (min-width: 1024px) {
    .mobile-fixed-buttons {
        display: none;
    }
}


/* Reset Elementor button styles within login, register, and dashboard elements */
form button,
form button:hover,
form button:focus,
.relative button,
.relative button:hover,
.relative button:focus,
aside button,
aside button:hover,
aside button:focus,
header button,
header button:hover,
header button:focus,
main button,
main button:hover,
main button:focus {
    background-color: transparent !important;
    background-image: none !important;
    border: none !important;
    box-shadow: none !important;
    outline: none !important;
}

/* Maintain original styling for primary action buttons with Tailwind classes */
form button[type="submit"],
form button.bg-sky-600,
form button.bg-gradient-to-r,
main button.bg-sky-600,
main button.bg-gradient-to-r {
    background-color: #0284c7 !important;
    background-image: linear-gradient(to right, #0284c7, #0ea5e9) !important;
    color: #ffffff !important;
}
form button[type="submit"]:hover,
form button.bg-sky-600:hover,
form button.bg-gradient-to-r:hover,
main button.bg-sky-600:hover,
main button.bg-gradient-to-r:hover {
    background-image: linear-gradient(to right, #0369a1, #0284c7) !important;
    box-shadow: 0 10px 15px -3px rgba(2, 132, 199, 0.3), 0 4px 6px -4px rgba(2, 132, 199, 0.3) !important;
}

/* Admin Action Button & Layout Color Overrides */
.bg-green-600, button.bg-green-600, input.bg-green-600 { background-color: #16a34a !important; background-image: none !important; color: #ffffff !important; }
.bg-green-700, button.bg-green-700, input.bg-green-700 { background-color: #15803d !important; background-image: none !important; color: #ffffff !important; }
.bg-rose-600, button.bg-rose-600, input.bg-rose-600 { background-color: #e11d48 !important; background-image: none !important; color: #ffffff !important; }
.bg-rose-700, button.bg-rose-700, input.bg-rose-700 { background-color: #be123c !important; background-image: none !important; color: #ffffff !important; }
.bg-amber-600, button.bg-amber-600, input.bg-amber-600 { background-color: #d97706 !important; background-image: none !important; color: #ffffff !important; }
.bg-amber-700, button.bg-amber-700, input.bg-amber-700 { background-color: #b45309 !important; background-image: none !important; color: #ffffff !important; }
.bg-emerald-600, button.bg-emerald-600, input.bg-emerald-600 { background-color: #059669 !important; background-image: none !important; color: #ffffff !important; }
.bg-cyan-600, button.bg-cyan-600, input.bg-cyan-600 { background-color: #0891b2 !important; background-image: none !important; color: #ffffff !important; }
.bg-sky-600, button.bg-sky-600, input.bg-sky-600 { background-color: #0284c7 !important; background-image: none !important; color: #ffffff !important; }
.bg-[#071251], aside.bg-[#071251] { background-color: #071251 !important; }

/* Global Button Reset for Elementor Red Borders */
html body button, 
html body .elementor-button,
html body input[type="button"],
html body input[type="submit"] {
    border: none !important;
    box-shadow: none !important;
    outline: none !important;
}

/* Restore slate border specifically for neutral buttons like Back to List */
html body button.bg-slate-150 {
    border: 1px solid #cbd5e1 !important;
    background-color: #f8fafc !important;
    color: #475569 !important;
}
html.dark body button.bg-slate-150 {
    border: 1px solid #334155 !important;
    background-color: #1e293b !important;
    color: #cbd5e1 !important;
}

/* Make block theme mobile menu hamburger stand out */
button.wp-block-navigation__responsive-container-open {
    padding: 10px 14px !important;
    background-color: #0b1f3b !important;
    color: #ffffff !important;
    border-radius: 8px !important;
    margin-right: 5px !important;
    border: none !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    cursor: pointer !important;
    z-index: 9999 !important;
    box-shadow: 0 4px 10px rgba(11, 31, 59, 0.3) !important;
    transition: background 0.3s ease, transform 0.2s ease !important;
}
button.wp-block-navigation__responsive-container-open:hover {
    background-color: #d52b1e !important;
    box-shadow: 0 4px 10px rgba(213, 43, 30, 0.4) !important;
    transform: scale(1.05) !important;
}
button.wp-block-navigation__responsive-container-open svg {
    fill: currentColor !important;
    width: 24px !important;
    height: 24px !important;
}

/* Fix mobile header spacing for block theme */
header.wp-block-template-part .wp-block-group.alignwide {
    width: 100% !important;
    justify-content: space-between !important;
}
.wp-block-navigation {
    margin-left: auto !important;
}
.wp-block-group.ext-nav-extras {
    flex-grow: 1 !important;
    justify-content: flex-end !important;
}