/* Landing Page Color Scheme Override */
/* Golden Yellow: #e5b60f, Dark Blue: #223b55 */

/* Base Color Variables Override */
:root {
    --base-color: #e5b60f !important;
    --base-color-rgb: 229, 182, 15 !important;
    --secondary-color: #223b55 !important;
    --text-color: #223b55 !important;
    --heading-color: #223b55 !important;
    /* HSL Variables for preloader */
    --base-two: 49 92% 14% !important;
    --base-two-h: 49 !important;
    --base-two-s: 92% !important;
    --base-two-l: 14% !important;
}

/* Buttons - Golden Yellow */
.btn--base,
.btn.btn--base,
button.btn--base {
    background-color: #e5b60f !important;
    border-color: #e5b60f !important;
    color: #ffffff !important;
}

.btn--base:hover,
.btn.btn--base:hover,
button.btn--base:hover {
    background-color: #d4a50d !important;
    border-color: #d4a50d !important;
    color: #ffffff !important;
}

.btn--base:focus,
.btn.btn--base:focus,
button.btn--base:focus {
    background-color: #e5b60f !important;
    border-color: #e5b60f !important;
    color: #ffffff !important;
    box-shadow: 0 0 0 0.2rem rgba(229, 182, 15, 0.25) !important;
}

/* Background Base Color */
.bg--base {
    background-color: #e5b60f !important;
}

/* Text Base Color (Links) */
.text--base,
a.text--base {
    color: #e5b60f !important;
}

.text--base:hover,
a.text--base:hover {
    color: #d4a50d !important;
}

/* Form Elements */
.form-control:focus {
    border-color: #e5b60f !important;
    box-shadow: 0 0 0 0.2rem rgba(229, 182, 15, 0.25) !important;
}

.form-control:focus-visible {
    outline-color: #e5b60f !important;
}

/* Input Labels */
.form-label,
label {
    color: #223b55 !important;
}

/* Custom Cards */
.custom--card {
    border-color: rgba(229, 182, 15, 0.2) !important;
}

.custom--card .card-header {
    background-color: rgba(229, 182, 15, 0.1) !important;
    border-bottom-color: rgba(229, 182, 15, 0.3) !important;
    color: #223b55 !important;
}

/* Account Section (Login/Register) */
/* Account section - allow background images for login/register - DO NOT override background-image */
.account-section.bg_img[style*="background-image"],
section.account-section.bg_img[style*="background-image"] {
    /* Don't set background-image - let inline style work */
    background-size: cover !important;
    background-position: center center !important;
    background-repeat: no-repeat !important;
    background-color: transparent !important;
    min-height: 100vh !important;
    position: relative !important;
}

/* If no background image, use white background */
.account-section:not(.bg_img):not([style*="background-image"]) {
    background-color: #ffffff !important;
}

.account-wrapper {
    background-color: #ffffff !important;
    box-shadow: 0 2px 20px rgba(0, 0, 0, 0.1) !important;
}

.account-wrapper .title {
    color: #223b55 !important;
}

.account-form .form-group label {
    color: #223b55 !important;
}

.account-form .form-control {
    border-color: #e5b60f !important;
    color: #223b55 !important;
}

.account-form .form-control:focus {
    border-color: #e5b60f !important;
    box-shadow: 0 0 0 0.2rem rgba(229, 182, 15, 0.15) !important;
}

/* All form controls - replace blue borders with golden yellow */
.form-control,
input[type="text"],
input[type="email"],
input[type="password"],
input[type="number"],
textarea,
select {
    border-color: #e5b60f !important;
}

.form-control:focus,
input[type="text"]:focus,
input[type="email"]:focus,
input[type="password"]:focus,
input[type="number"]:focus,
textarea:focus,
select:focus {
    border-color: #e5b60f !important;
    box-shadow: 0 0 0 0.2rem rgba(229, 182, 15, 0.25) !important;
}

/* Catch-all: Replace any blue/cyan borders with golden yellow */
[style*="border-color: #37ebec"],
[style*="border-color:#37ebec"],
[style*="border: 1px solid #37ebec"],
[style*="border:1px solid #37ebec"],
[style*="border-color: blue"],
[style*="border-color:blue"],
[style*="border-color: #007bff"],
[style*="border-color:#007bff"],
[style*="border-color: #0d6efd"],
[style*="border-color:#0d6efd"] {
    border-color: #e5b60f !important;
}

/* Replace blue borders in social login buttons specifically */
.social-login a[style*="border"],
.social-login .btn[style*="border"] {
    border-color: #e5b60f !important;
}

/* Account wrapper borders */
.account-wrapper {
    border-color: #e5b60f !important;
}

/* OR separator box */
.account-form .separator,
.separator-box {
    background-color: #223b55 !important;
    border-color: #223b55 !important;
}

/* Links in forms */
.account-form a {
    color: #e5b60f !important;
}

.account-form a:hover {
    color: #d4a50d !important;
}

/* Checkbox and Radio */
.form-check-input:checked {
    background-color: #e5b60f !important;
    border-color: #e5b60f !important;
}

.form-check-input:focus {
    border-color: #e5b60f !important;
    box-shadow: 0 0 0 0.2rem rgba(229, 182, 15, 0.25) !important;
}

/* Select2 Dropdown */
.select2-container--default .select2-results__option--highlighted[aria-selected] {
    background-color: #e5b60f !important;
}

.select2-container--default .select2-selection--single:focus {
    border-color: #e5b60f !important;
}

/* Alerts */
.alert-primary {
    background-color: rgba(229, 182, 15, 0.1) !important;
    border-color: rgba(229, 182, 15, 0.3) !important;
    color: #223b55 !important;
}

.alert-primary .alert-link {
    color: #e5b60f !important;
}

/* Breadcrumb */
.breadcrumb-item.active {
    color: #223b55 !important;
}

.breadcrumb-item a {
    color: #e5b60f !important;
}

.breadcrumb-item a:hover {
    color: #d4a50d !important;
}

/* Tables */
.table thead th {
    background-color: rgba(229, 182, 15, 0.1) !important;
    color: #223b55 !important;
    border-color: rgba(229, 182, 15, 0.2) !important;
}

.table tbody td {
    color: #223b55 !important;
}

/* Pagination */
.page-link {
    color: #e5b60f !important;
    border-color: #e5b60f !important;
}

.page-link:hover {
    background-color: #e5b60f !important;
    border-color: #e5b60f !important;
    color: #ffffff !important;
}

.page-item.active .page-link {
    background-color: #e5b60f !important;
    border-color: #e5b60f !important;
    color: #ffffff !important;
}

/* Badges */
.badge.bg--base {
    background-color: #e5b60f !important;
    color: #ffffff !important;
}

/* Modal */
.modal-header {
    border-bottom-color: rgba(229, 182, 15, 0.2) !important;
}

.modal-footer {
    border-top-color: rgba(229, 182, 15, 0.2) !important;
}

.modal .btn--base {
    background-color: #e5b60f !important;
    border-color: #e5b60f !important;
    color: #ffffff !important;
}

/* Confirmation Modal - White Background Style */
#confirmationModal .confirmation-modal-white {
    background-color: #ffffff !important;
    border: 1px solid #e0e0e0 !important;
}

#confirmationModal .confirmation-modal-white .modal-header {
    background-color: #ffffff !important;
    border-bottom: 1px solid #e0e0e0 !important;
}

#confirmationModal .confirmation-modal-white .modal-header .modal-title {
    color: #223b55 !important;
}

#confirmationModal .confirmation-modal-white .modal-header .close {
    color: #223b55 !important;
}

#confirmationModal .confirmation-modal-white .modal-header .close:hover {
    color: #e5b60f !important;
}

#confirmationModal .confirmation-modal-white .modal-body {
    background-color: #ffffff !important;
    color: #223b55 !important;
}

#confirmationModal .confirmation-modal-white .modal-body .question {
    color: #223b55 !important;
}

#confirmationModal .confirmation-modal-white .modal-footer {
    background-color: #ffffff !important;
    border-top: 1px solid #e0e0e0 !important;
}

/* Remove golden yellow backdrop - make it transparent/white */
#confirmationModal.modal.show ~ .modal-backdrop,
.modal-backdrop.show {
    background-color: rgba(0, 0, 0, 0.3) !important;
}

/* Alternative: If backdrop is set to golden yellow somewhere, override it */
body .modal-backdrop {
    background-color: rgba(0, 0, 0, 0.3) !important;
}

/* Navigation/Auth Header */
.auth-header {
    background-color: #ffffff !important;
}

.auth-header .navbar-nav .nav-link {
    color: #223b55 !important;
}

.auth-header .navbar-nav .nav-link:hover {
    color: #e5b60f !important;
}

/* Dashboard Cards */
.card {
    border-color: rgba(229, 182, 15, 0.2) !important;
}

.card-header {
    background-color: rgba(229, 182, 15, 0.05) !important;
    border-bottom-color: rgba(229, 182, 15, 0.2) !important;
    color: #223b55 !important;
}

.card-title {
    color: #223b55 !important;
}

/* Text Colors */
.text-dark {
    color: #223b55 !important;
}

h1, h2, h3, h4, h5, h6 {
    color: #223b55 !important;
}

/* Forgot Password Link */
.forgot-pass {
    color: #e5b60f !important;
}

.forgot-pass:hover {
    color: #d4a50d !important;
}

/* Social Login Buttons - Override HSL variables */
.social-login .btn,
.social-login a,
.btn-social,
.social-login-btn,
.social-auth a,
.social-auth .social-login-btn,
.continue-google a,
.continue-facebook a,
.linkedin-facebook a {
    border: 1px solid #e5b60f !important;
    border-color: #e5b60f !important;
    color: #223b55 !important;
    background-color: #ffffff !important;
}

.social-login .btn:hover,
.social-login a:hover,
.btn-social:hover,
.social-login-btn:hover,
.social-auth a:hover,
.social-auth .social-login-btn:hover,
.continue-google a:hover,
.continue-facebook a:hover,
.linkedin-facebook a:hover {
    background-color: rgba(229, 182, 15, 0.1) !important;
    color: #223b55 !important;
    border-color: #e5b60f !important;
}

/* OR Separator - Override HSL variables */
.auth-devide {
    color: #223b55 !important;
    position: relative !important;
}

.auth-devide span {
    background-color: #223b55 !important;
    background: #223b55 !important;
    color: #ffffff !important;
    border-color: #223b55 !important;
    padding-inline: 6px !important;
}

.auth-devide::after {
    content: '' !important;
    width: 100% !important;
    height: 1px !important;
    background: #e5b60f !important;
    background-color: #e5b60f !important;
    position: absolute !important;
    top: 50% !important;
    left: 0 !important;
    right: 0 !important;
    z-index: -1 !important;
}

/* Override any existing blue/cyan colors in social buttons */
.social-login-btn[style*="#37ebec"],
.social-login-btn[style*="blue"],
.social-login-btn[style*="cyan"] {
    border-color: #e5b60f !important;
    color: #223b55 !important;
}

/* Force override for all input and button borders - catch all blue colors */
input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]),
textarea,
select {
    border: 1px solid #e5b60f !important;
    border-color: #e5b60f !important;
}

/* Override any HSL-based colors that might resolve to blue */
[style*="hsl(var(--base))"] {
    border-color: #e5b60f !important;
    color: #223b55 !important;
}

/* Additional catch-all for any remaining blue borders */
[style*="border"][style*="#37ebec"],
[style*="border"][style*="blue"],
[style*="border"][style*="#007bff"],
[style*="border"][style*="#0d6efd"],
[style*="border"][style*="cyan"] {
    border-color: #e5b60f !important;
}

/* All buttons with borders - replace blue with golden yellow */
.btn,
button {
    border-color: #e5b60f !important;
}

.btn-outline,
.btn-outline-primary,
.btn-outline-secondary {
    border-color: #e5b60f !important;
    color: #e5b60f !important;
}

.btn-outline:hover,
.btn-outline-primary:hover,
.btn-outline-secondary:hover {
    background-color: #e5b60f !important;
    border-color: #e5b60f !important;
    color: #ffffff !important;
}

/* Scroll to Top */
.scroll-to-top {
    background-color: #e5b60f !important;
}

.scroll-to-top:hover {
    background-color: #d4a50d !important;
}

/* Cookies Card */
.cookies-card {
    background-color: #223b55 !important;
}

.cookies-card__icon.bg--base {
    background-color: #e5b60f !important;
}

/* User Dashboard Specific */
.main-wrapper {
    background-color: #f8f9fa !important;
}

/* Overlay Background - Remove old theme images */
.overlay--one {
    background-color: #ffffff !important;
    background-image: none !important;
}

.overlay--one[style*="background-image"],
.overlay--one.bg_img[style*="background-image"] {
    background-image: none !important;
    background-color: #ffffff !important;
}

/* Dashboard Widgets - Golden Yellow Icons */
.d-widget {
    background-color: #ffffff !important;
    border-color: rgba(229, 182, 15, 0.2) !important;
}

.d-widget__icon {
    background-color: #e5b60f !important;
    color: #ffffff !important;
}

.d-widget__icon i {
    color: #ffffff !important;
}

.d-widget__amount {
    color: #223b55 !important;
}

.d-widget .captoin,
.d-widget p {
    color: #223b55 !important;
}

.d-widget .text-white {
    color: #223b55 !important;
}

/* Phase Cards */
.phase-card {
    background-color: #ffffff !important;
    border-color: rgba(229, 182, 15, 0.2) !important;
}

.phase-card .card-header {
    background-color: rgba(229, 182, 15, 0.1) !important;
    border-color: rgba(229, 182, 15, 0.3) !important;
    color: #223b55 !important;
}

.phase-card h5,
.phase-card h6 {
    color: #223b55 !important;
}

/* Alerts in Dashboard */
.alert.d-widget {
    background-color: #ffffff !important;
    border-color: rgba(229, 182, 15, 0.3) !important;
}

.alert.d-widget .text-white {
    color: #223b55 !important;
}

.alert.d-widget .alert-heading {
    color: #223b55 !important;
}

/* Footer - White like landing page */
.footer {
    background-color: #ffffff !important;
    background: #ffffff !important;
    border-top: 1px solid rgba(229, 182, 15, 0.15) !important;
}

.footer__top {
    background-color: #ffffff !important;
}

.footer__bottom {
    background-color: #ffffff !important;
    border-top: 1px solid rgba(229, 182, 15, 0.15) !important;
}

.footer-logo img {
    filter: none !important;
}

.footer p,
.footer .footer-menu a,
.footer .footer-menu li a {
    color: #223b55 !important;
}

.footer .footer-menu a:hover {
    color: #e5b60f !important;
}

.footer .social-links li a {
    border-color: rgba(229, 182, 15, 0.3) !important;
    color: #223b55 !important;
    background-color: rgba(229, 182, 15, 0.1) !important;
}

.footer .social-links li a:hover {
    background-color: #e5b60f !important;
    border-color: #e5b60f !important;
    color: #ffffff !important;
}

/* Header - Match Landing Page Colors */
.header {
    background-color: #ffffff !important;
}

.header__bottom {
    background-color: #ffffff !important;
}

/* Sticky Header - White background */
.header.menu-fixed .header__bottom,
.header.is-sticky .header__bottom,
.header.menu-fixed,
.header.is-sticky {
    background-color: #ffffff !important;
}

.header.menu-fixed .header__top,
.header.is-sticky .header__top {
    background-color: #ffffff !important;
}

/* Menu Text Colors - Dark on white */
.navbar-nav .nav-link,
.navbar-nav a,
.header .main-menu li a,
.header .navbar-nav .nav-link,
.header .navbar-nav a {
    color: #223b55 !important;
}

.navbar-nav .nav-link:hover,
.navbar-nav a:hover,
.header .main-menu li a:hover,
.header .navbar-nav .nav-link:hover,
.header .navbar-nav a:hover {
    color: #e5b60f !important;
}

.navbar-nav .nav-link.active,
.navbar-nav a.active,
.header .main-menu li a.active,
.header .navbar-nav .nav-link.active {
    color: #e5b60f !important;
}

.header-login-btn {
    background-color: #e5b60f !important;
    color: #ffffff !important;
    border-color: #e5b60f !important;
}

.header-login-btn:hover {
    background-color: #d4a50d !important;
    color: #ffffff !important;
}

/* Top Header - White like landing page */
.header__top,
.top-header {
    background-color: #ffffff !important;
    border-bottom: 1px solid rgba(229, 182, 15, 0.1) !important;
}

.header__top p,
.header__top a,
.top-header p,
.top-header a,
.top-info,
.top-info a,
.top-info span {
    color: #223b55 !important;
}

.header__top a:hover,
.top-header a:hover,
.top-info a:hover {
    color: #e5b60f !important;
}

.header__top .text-white,
.top-header .text-white {
    color: #223b55 !important;
}

/* Breadcrumb */
.breadcrumb-item a {
    color: #e5b60f !important;
}

.breadcrumb-item.active {
    color: #223b55 !important;
}

/* Dashboard Page Headings - Dark text on light background */
h1, h2, h3, h4, h5, h6 {
    color: #223b55 !important;
    font-weight: 600 !important;
}

.page-title {
    color: #223b55 !important;
}

/* Breadcrumb - Like landing page */
.breadcrumb {
    background-color: transparent !important;
}

.breadcrumb-item {
    color: #415076 !important;
}

.breadcrumb-item a {
    color: #415076 !important;
}

.breadcrumb-item a:hover {
    color: #e5b60f !important;
}

.breadcrumb-item.active {
    color: #223b55 !important;
}

/* Cards - Clean white like landing page */
.card {
    background-color: #ffffff !important;
    border: 1px solid rgba(229, 182, 15, 0.15) !important;
    border-radius: 8px !important;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05) !important;
    color: #223b55 !important;
}

.card-header {
    background-color: #ffffff !important;
    border-bottom: 1px solid rgba(229, 182, 15, 0.15) !important;
    color: #223b55 !important;
    font-weight: 600 !important;
}

.card-body {
    color: #223b55 !important;
}

.card-footer {
    background-color: #ffffff !important;
    border-top: 1px solid rgba(229, 182, 15, 0.15) !important;
    color: #223b55 !important;
}

/* Tables - Clean white background */
.table {
    background-color: #ffffff !important;
    border-color: rgba(229, 182, 15, 0.15) !important;
}

.table thead th {
    background-color: rgba(229, 182, 15, 0.05) !important;
    color: #223b55 !important;
    font-weight: 600 !important;
    border-bottom: 2px solid rgba(229, 182, 15, 0.2) !important;
}

.table td,
.table th {
    color: #223b55 !important;
    border-color: rgba(229, 182, 15, 0.1) !important;
}

.table tbody tr:hover {
    background-color: rgba(229, 182, 15, 0.03) !important;
}

.table tbody tr:nth-child(even) {
    background-color: rgba(229, 182, 15, 0.02) !important;
}

/* Referral Section */
.referral-link-input,
.copyInput {
    border-color: #e5b60f !important;
}

/* Remove any old theme background images - BUT allow login/register pages */
[style*="background-image"][style*="1920x1080"]:not(.account-section),
[style*="background-image"][style*="1900x1000"]:not(.account-section),
.bg_img[style*="background-image"]:not(.account-section) {
    background-image: none !important;
    background-color: #ffffff !important;
}

/* Allow background images on login/register pages */
.account-section.bg_img[style*="background-image"] {
    /* background-image from inline style - don't override */
    background-size: cover !important;
    background-position: center center !important;
    background-repeat: no-repeat !important;
    background-color: transparent !important;
}

/* Main Wrapper - Golden Yellow Background */
body {
    background-color: #e5b60f !important;
    color: #223b55 !important;
}

.main-wrapper {
    background-color: #e5b60f !important;
}

/* Dashboard Background - Golden Yellow */
.page-wrapper,
.dashboard-wrapper,
.content-wrapper,
.main-content,
.content-area {
    background-color: #e5b60f !important;
    color: #223b55 !important;
}

/* Container Background */
.container {
    background-color: transparent !important;
}

/* All Text Elements - Ensure Visibility */
body,
p,
span,
div,
label {
    color: inherit;
}

/* Ensure headings are visible */
h1, h2, h3, h4, h5, h6,
.title,
.card-title {
    color: #223b55 !important;
}

/* Links */
a:not(.text--base):not(.btn) {
    color: #223b55 !important;
}

a:hover:not(.text--base):not(.btn) {
    color: #e5b60f !important;
}

/* Custom Cards - White with subtle borders */
.custom--card {
    background-color: #ffffff !important;
    border: 1px solid rgba(229, 182, 15, 0.15) !important;
    border-radius: 8px !important;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05) !important;
    color: #223b55 !important;
}

.custom--card .card-header {
    background-color: #ffffff !important;
    border-bottom: 1px solid rgba(229, 182, 15, 0.15) !important;
    color: #223b55 !important;
    font-weight: 600 !important;
}

.custom--card .card-body {
    color: #223b55 !important;
    background-color: #ffffff !important;
}

.custom--card:hover {
    box-shadow: 0 4px 15px rgba(229, 182, 15, 0.15) !important;
    border-color: rgba(229, 182, 15, 0.3) !important;
}

/* Referral Section */
.referral-link-wrapper,
.referral-section {
    background-color: #ffffff !important;
    border-color: rgba(229, 182, 15, 0.2) !important;
}

.referral-link-input,
.copyInput {
    border-color: #e5b60f !important;
    color: #223b55 !important;
}

/* Transaction Tables */
.transaction-table,
.table-responsive {
    background-color: #ffffff !important;
}

/* Empty State Messages */
.empty-message,
.no-data {
    color: #223b55 !important;
}

/* Navigation Active States */
.navbar-nav .nav-link.active,
.menu-active {
    color: #e5b60f !important;
}

/* Submenu */
.sub-menu {
    background-color: #ffffff !important;
    border-color: rgba(229, 182, 15, 0.2) !important;
}

.sub-menu a {
    color: #223b55 !important;
}

.sub-menu a:hover {
    background-color: rgba(229, 182, 15, 0.1) !important;
    color: #e5b60f !important;
}

/* Status Badges */
.badge-success {
    background-color: #28a745 !important;
}

.badge-danger {
    background-color: #dc3545 !important;
}

.badge-warning {
    background-color: #e5b60f !important;
    color: #ffffff !important;
}

/* Input Groups */
.input-group-text {
    background-color: rgba(229, 182, 15, 0.1) !important;
    border-color: #e5b60f !important;
    color: #223b55 !important;
}

/* Dropdown Menus */
.dropdown-menu {
    border-color: rgba(229, 182, 15, 0.2) !important;
}

.dropdown-item:hover,
.dropdown-item:focus {
    background-color: rgba(229, 182, 15, 0.1) !important;
    color: #223b55 !important;
}

.dropdown-item.active {
    background-color: #e5b60f !important;
    color: #ffffff !important;
}

/* Tabs */
.nav-tabs .nav-link {
    color: #223b55 !important;
}

.nav-tabs .nav-link:hover {
    border-color: #e5b60f !important;
    color: #e5b60f !important;
}

.nav-tabs .nav-link.active {
    background-color: #e5b60f !important;
    border-color: #e5b60f !important;
    color: #ffffff !important;
}

/* Progress Bars */
.progress-bar {
    background-color: #e5b60f !important;
}

/* List Groups */
.list-group-item.active {
    background-color: #e5b60f !important;
    border-color: #e5b60f !important;
    color: #ffffff !important;
}

/* Tooltips */
.tooltip-inner {
    background-color: #223b55 !important;
}

.tooltip.bs-tooltip-top .arrow::before {
    border-top-color: #223b55 !important;
}

/* Loading Spinner */
.spinner-border {
    border-color: #e5b60f !important;
    border-right-color: transparent !important;
}

/* Disabled Buttons */
.btn--base:disabled,
.btn.btn--base:disabled {
    background-color: rgba(229, 182, 15, 0.5) !important;
    border-color: rgba(229, 182, 15, 0.5) !important;
    color: #ffffff !important;
    opacity: 0.6 !important;
}

/* Additional Account Section Styling - Allow background images - DON'T override background-image */
.account-section.bg_img[style*="background-image"] {
    /* Don't set background-image - let inline style work */
    background-size: cover !important;
    background-position: center center !important;
    background-repeat: no-repeat !important;
    background-color: transparent !important;
}

/* Only remove background if no bg_img class */
.account-section:not(.bg_img) {
    background-color: #ffffff !important;
    background-image: none !important;
}

/* Password Reset Pages - Text Visibility */
.account-thumb-area .title,
.account-thumb-area .card-title,
.account-thumb-area h4 {
    color: #223b55 !important;
}

.account-wrapper p,
.account-wrapper .verification-text,
.account-wrapper .mb-4 p,
.card-body p {
    color: #223b55 !important;
}

.account-wrapper .form-label,
.account-wrapper label {
    color: #223b55 !important;
}

.account-wrapper .text-center {
    color: #223b55 !important;
}

/* Ensure all text in account sections is visible */
.account-wrapper,
.account-wrapper * {
    color: inherit;
}

.account-wrapper h1,
.account-wrapper h2,
.account-wrapper h3,
.account-wrapper h4,
.account-wrapper h5,
.account-wrapper h6 {
    color: #223b55 !important;
}

.account-wrapper .form-group p,
.account-wrapper p:not(.text--base) {
    color: #223b55 !important;
}

/* Verification code wrapper */
.verification-code-wrapper,
.verification-area {
    background-color: #ffffff !important;
}

.verification-area p,
.verification-area .verification-text {
    color: #223b55 !important;
}

.account-area {
    background-color: transparent !important;
}

.account-wrapper-logo img {
    filter: none !important;
}

/* Ensure text readability */
.account-form p,
.account-form .text-center {
    color: #223b55 !important;
}

/* Social Login Icons */
.social-login .btn i {
    color: inherit !important;
}

/* Form Validation */
.was-validated .form-control:valid {
    border-color: #28a745 !important;
}

.was-validated .form-control:invalid {
    border-color: #dc3545 !important;
}

/* Required Field Indicator */
.form-label.required::after {
    color: #e5b60f !important;
}

/* Dark Mode Override (if enabled) */
body.dark-mode .account-section {
    background-color: #ffffff !important;
}

body.dark-mode .account-wrapper {
    background-color: #ffffff !important;
}

body.dark-mode .form-control {
    background-color: #ffffff !important;
    color: #223b55 !important;
}

/* Ensure consistent button styling across all pages */
.btn-primary {
    background-color: #e5b60f !important;
    border-color: #e5b60f !important;
    color: #ffffff !important;
}

.btn-primary:hover {
    background-color: #d4a50d !important;
    border-color: #d4a50d !important;
    color: #ffffff !important;
}

/* Outline Button Variant */
.btn-outline-primary {
    border-color: #e5b60f !important;
    color: #e5b60f !important;
}

.btn-outline-primary:hover {
    background-color: #e5b60f !important;
    border-color: #e5b60f !important;
    color: #ffffff !important;
}

/* Cursor - Disable custom cursor to match landing page (uses standard browser cursor) */
.cursor,
.cursor-follower {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
}

/* Allow background images on account sections (login/register) */
section.account-section.bg_img,
.account-section.bg_img[style*="background-image"],
.account-section[style*="background-image"] {
    /* background-image from inline style - don't override */
    background-size: cover !important;
    background-position: center center !important;
    background-repeat: no-repeat !important;
    background-color: transparent !important;
}

/* Only remove background if NOT bg_img class */
section.account-section:not(.bg_img) {
    background-image: none !important;
    background: #ffffff !important;
}

/* Force override inline styles for background */
/* Allow background images - only remove if no background-image in style */
.account-section.bg_img[style]:not([style*="background-image"]) {
    background-image: none !important;
    background: #ffffff !important;
    background-color: #ffffff !important;
}

/* Allow background images on account sections with bg_img class - DON'T override background-image */
.account-section.bg_img[style*="background-image"] {
    /* Don't set background-image - let inline style work */
    background-size: cover !important;
    background-position: center center !important;
    background-repeat: no-repeat !important;
    background-color: transparent !important;
}

/* Only remove background if no bg_img class */
.account-section:not(.bg_img) {
    background-image: none !important;
    background: #ffffff !important;
    background-color: #ffffff !important;
}

/* ============================================
   DASHBOARD STYLING - Match Landing Page Style
   Simple, Clean, White Backgrounds with Golden Accents
   ============================================ */

/* Dashboard Widgets - White cards with golden accents */
.d-widget {
    background-color: #ffffff !important;
    border: 1px solid rgba(229, 182, 15, 0.15) !important;
    border-radius: 8px !important;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05) !important;
    color: #223b55 !important;
}

.d-widget:hover {
    box-shadow: 0 4px 15px rgba(229, 182, 15, 0.15) !important;
    border-color: rgba(229, 182, 15, 0.3) !important;
}

.d-widget__icon {
    background-color: rgba(229, 182, 15, 0.1) !important;
}

.d-widget__icon i {
    color: #e5b60f !important;
}

.d-widget__amount {
    color: #223b55 !important;
}

.d-widget__caption {
    color: #415076 !important;
}

/* Phase Cards */
.phase-card {
    background-color: #ffffff !important;
    border: 1px solid rgba(229, 182, 15, 0.15) !important;
    border-radius: 8px !important;
}

.phase-card .card-header {
    background-color: #ffffff !important;
    border-bottom: 1px solid rgba(229, 182, 15, 0.15) !important;
    color: #223b55 !important;
}

/* Form Controls - Light background */
.form-control {
    background-color: #ffffff !important;
    border: 1px solid rgba(229, 182, 15, 0.2) !important;
    color: #223b55 !important;
}

.form-control:focus {
    background-color: #ffffff !important;
    border-color: #e5b60f !important;
    color: #223b55 !important;
    box-shadow: 0 0 0 0.2rem rgba(229, 182, 15, 0.15) !important;
}

.form-control::placeholder {
    color: #8a9ba8 !important;
}

/* Select Dropdowns - Golden Yellow Background */
.select,
select {
    background-color: #e5b60f !important;
    border: 1px solid #e5b60f !important;
    color: #223b55 !important;
}

.select:focus,
select:focus {
    border-color: #d4a50d !important;
    background-color: #e5b60f !important;
}

.select option,
select option {
    background-color: #e5b60f !important;
    color: #223b55 !important;
}

/* Select2 Dropdowns - Golden Yellow Background */
.select2-selection.select2-selection--single,
.select2-selection.select2-selection--multiple {
    background-color: #e5b60f !important;
    border-color: #e5b60f !important;
    color: #223b55 !important;
}

.select2-container--default .select2-selection--single .select2-selection__rendered,
.select2-container--default .select2-selection--multiple .select2-selection__rendered {
    color: #223b55 !important;
}

.select2-dropdown {
    background-color: #e5b60f !important;
    border-color: rgba(229, 182, 15, 0.3) !important;
}

.select2-results__option {
    color: #223b55 !important;
    background-color: transparent !important;
}

.select2-results__option:hover,
.select2-results__option--highlighted {
    background-color: rgba(34, 59, 85, 0.2) !important;
    color: #223b55 !important;
}

.select2-results__option--selected {
    background-color: rgba(34, 59, 85, 0.3) !important;
    color: #223b55 !important;
}

.select2-container--default .select2-search--dropdown .select2-search__field {
    background-color: #ffffff !important;
    color: #223b55 !important;
    border-color: rgba(229, 182, 15, 0.3) !important;
}

/* Bootstrap Dropdowns */
.dropdown-menu {
    background-color: #e5b60f !important;
    border-color: rgba(229, 182, 15, 0.3) !important;
}

.dropdown-item {
    color: #223b55 !important;
}

.dropdown-item:hover,
.dropdown-item:focus {
    background-color: rgba(34, 59, 85, 0.2) !important;
    color: #223b55 !important;
}

.dropdown-item.active,
.dropdown-item:active {
    background-color: rgba(34, 59, 85, 0.3) !important;
    color: #223b55 !important;
}

/* Navigation Menu - White background */
.navbar-nav .main-menu li a {
    color: #223b55 !important;
}

.navbar-nav .main-menu li a:hover,
.navbar-nav .main-menu li a.active {
    color: #e5b60f !important;
}

.navbar-nav .main-menu li .sub-menu {
    background-color: #ffffff !important;
    border: 1px solid rgba(229, 182, 15, 0.15) !important;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1) !important;
}

.navbar-nav .main-menu li .sub-menu li a {
    color: #223b55 !important;
}

.navbar-nav .main-menu li .sub-menu li a:hover {
    background-color: rgba(229, 182, 15, 0.1) !important;
    color: #e5b60f !important;
}

/* Empty States */
.empty-state,
.no-data,
.no-transaction {
    color: #415076 !important;
}

/* Status Badges */
.badge {
    background-color: rgba(229, 182, 15, 0.1) !important;
    color: #223b55 !important;
    border: 1px solid rgba(229, 182, 15, 0.2) !important;
}

.badge-success {
    background-color: rgba(40, 167, 69, 0.1) !important;
    color: #28a745 !important;
    border-color: rgba(40, 167, 69, 0.2) !important;
}

.badge-danger {
    background-color: rgba(220, 53, 69, 0.1) !important;
    color: #dc3545 !important;
    border-color: rgba(220, 53, 69, 0.2) !important;
}

.badge-warning {
    background-color: rgba(229, 182, 15, 0.2) !important;
    color: #223b55 !important;
    border-color: rgba(229, 182, 15, 0.3) !important;
}

/* Pagination */
.pagination .page-link {
    color: #223b55 !important;
    background-color: #ffffff !important;
    border-color: rgba(229, 182, 15, 0.2) !important;
}

.pagination .page-link:hover {
    color: #e5b60f !important;
    background-color: rgba(229, 182, 15, 0.05) !important;
    border-color: #e5b60f !important;
}

.pagination .page-item.active .page-link {
    background-color: #e5b60f !important;
    border-color: #e5b60f !important;
    color: #ffffff !important;
}

/* Alert Messages */
.alert {
    background-color: #ffffff !important;
    border: 1px solid rgba(229, 182, 15, 0.2) !important;
    color: #223b55 !important;
}

.alert-success {
    border-color: rgba(40, 167, 69, 0.3) !important;
    background-color: rgba(40, 167, 69, 0.05) !important;
}

.alert-danger {
    border-color: rgba(220, 53, 69, 0.3) !important;
    background-color: rgba(220, 53, 69, 0.05) !important;
}

.alert-warning {
    border-color: rgba(229, 182, 15, 0.3) !important;
    background-color: rgba(229, 182, 15, 0.05) !important;
}

/* Override any dark backgrounds in dashboard - Golden Yellow */
[class*="dashboard"],
[class*="user-dashboard"],
.content-area,
.main-content {
    background-color: #e5b60f !important;
    color: #223b55 !important;
}

/* Override all HSL-based dark backgrounds - Golden Yellow */
[style*="background-color: hsl(var(--base-two))"],
[style*="background: hsl(var(--base-two))"] {
    background-color: #e5b60f !important;
    background: #e5b60f !important;
    color: #223b55 !important;
}

/* Force footer to be white */
.footer,
.footer__top,
.footer__bottom,
.footer[style*="background"],
.footer__top[style*="background"],
.footer__bottom[style*="background"] {
    background-color: #ffffff !important;
    background: #ffffff !important;
}

/* Force footer text to be dark */
.footer p,
.footer span,
.footer div,
.footer li,
.footer .text-white,
.footer .text-white * {
    color: #223b55 !important;
}

/* Force header to be white always */
.header,
.header__top,
.header__bottom,
.header.menu-fixed,
.header.is-sticky,
.header.menu-fixed .header__bottom,
.header.is-sticky .header__bottom,
.header[style*="background"],
.header__top[style*="background"],
.header__bottom[style*="background"] {
    background-color: #ffffff !important;
    background: #ffffff !important;
}

/* Force all menu text to be dark */
.header .main-menu li a,
.header .navbar-nav .nav-link,
.header .navbar-nav a,
.header .top-info,
.header .top-info *,
.header__top,
.header__top * {
    color: #223b55 !important;
}

.header .main-menu li a:hover,
.header .navbar-nav .nav-link:hover,
.header .navbar-nav a:hover {
    color: #e5b60f !important;
}

/* Form controls with dark backgrounds */
.form-control[style*="background-color: hsl(var(--base-two))"],
.form-control[style*="background: hsl(var(--base-two))"] {
    background-color: #ffffff !important;
    background: #ffffff !important;
    color: #223b55 !important;
}

/* Accordion and other components */
.custom--accordion .accordion-button,
.custom--accordion .accordion-body {
    background-color: #ffffff !important;
    color: #223b55 !important;
}

.custom--accordion .accordion-item {
    border-color: rgba(229, 182, 15, 0.15) !important;
    background-color: #ffffff !important;
}

/* Ensure all text is readable on golden yellow background */
body,
.main-wrapper,
.page-wrapper,
[class*="dashboard"],
[class*="user-dashboard"],
.content-area,
.main-content {
    color: #223b55 !important;
    background-color: #e5b60f !important;
}

/* All text elements on golden background should be dark */
body *:not(.card):not(.custom--card):not(.d-widget):not(.btn):not(.badge):not(.alert) {
    color: #223b55 !important;
}

/* Ensure headings are dark on golden background */
h1, h2, h3, h4, h5, h6,
.title,
.page-title,
.section-title {
    color: #223b55 !important;
    font-weight: 600 !important;
}

/* Paragraphs and text on golden background */
p, span, div, label, li {
    color: #223b55 !important;
}

/* Links in content - Dark on golden background */
a:not(.btn):not(.text--base) {
    color: #223b55 !important;
}

a:not(.btn):not(.text--base):hover {
    color: #d4a50d !important;
    text-decoration: underline !important;
}

/* Additional overrides for golden yellow background */
section,
.section,
.content-section,
.main-section {
    background-color: #e5b60f !important;
    color: #223b55 !important;
}

/* Ensure breadcrumbs are visible on golden background */
.breadcrumb-item,
.breadcrumb-item a {
    color: #223b55 !important;
}

.breadcrumb-item a:hover {
    color: #d4a50d !important;
}

/* Input fields on golden background - keep white for contrast */
.form-control,
input,
textarea,
select {
    background-color: #ffffff !important;
    color: #223b55 !important;
    border-color: rgba(229, 182, 15, 0.3) !important;
}

.form-control:focus,
input:focus,
textarea:focus,
select:focus {
    background-color: #ffffff !important;
    color: #223b55 !important;
    border-color: #d4a50d !important;
    box-shadow: 0 0 0 0.2rem rgba(212, 165, 13, 0.25) !important;
}

/* Catch-all: Replace any beige/khaki/tan backgrounds with golden yellow */
[style*="background-color: #a19b80"],
[style*="background: #a19b80"],
[style*="background-color: #aba58d"],
[style*="background: #aba58d"],
[style*="background-color: rgb(161, 155, 128)"],
[style*="background: rgb(161, 155, 128)"],
[style*="background-color: rgb(171, 165, 141)"],
[style*="background: rgb(171, 165, 141)"] {
    background-color: #e5b60f !important;
    background: #e5b60f !important;
    color: #223b55 !important;
}

/* Force golden yellow on any light beige backgrounds */
[style*="background-color: #f6fafd"],
[style*="background: #f6fafd"],
[style*="background-color: #f5f5f0"],
[style*="background: #f5f5f0"] {
    background-color: #e5b60f !important;
    background: #e5b60f !important;
    color: #223b55 !important;
}

/* Ensure text visibility on golden yellow - make all text dark */
body *,
.main-wrapper *,
.page-wrapper *,
[class*="dashboard"] *,
[class*="user-dashboard"] * {
    color: #223b55 !important;
}

/* Exception: White text on buttons and badges should stay white */
.btn,
.badge,
.alert,
.card,
.custom--card,
.d-widget,
.white-text,
.text-white {
    color: inherit !important;
}

.btn--base,
.btn.btn--base {
    color: #ffffff !important;
}

/* Cards should remain white for contrast on golden background */
.card,
.custom--card,
.d-widget,
.white-card {
    background-color: #ffffff !important;
    color: #223b55 !important;
}

/* Final override: Any remaining beige/khaki/tan colors become golden yellow */
* {
    background-color: inherit;
}

/* Main page backgrounds - Golden Yellow */
html,
body,
.main-wrapper,
.page-wrapper,
.dashboard-wrapper,
.content-wrapper,
.main-content,
.content-area,
section:not(.account-section),
.section:not(.account-section) {
    background-color: #e5b60f !important;
    background: #e5b60f !important;
}

/* All text on golden background must be dark for visibility */
body,
.main-wrapper,
.page-wrapper,
.dashboard-wrapper,
.content-wrapper,
section,
.section {
    color: #223b55 !important;
}

/* But keep cards white */
.card,
.custom--card,
.d-widget,
.white-card,
.account-wrapper {
    background-color: #ffffff !important;
    color: #223b55 !important;
}

/* Account section - allow background images, but keep wrapper white */
.account-section:not(.bg_img) {
    background-color: #ffffff !important;
    color: #223b55 !important;
}

/* FINAL OVERRIDE: Force golden yellow on all main backgrounds */
html {
    background-color: #e5b60f !important;
}

body,
body * {
    background-color: inherit;
}

/* Force golden yellow on page wrappers */
.main-wrapper,
.page-wrapper,
.dashboard-wrapper,
.content-wrapper,
.main-content,
.content-area,
section:not(.card):not(.custom--card):not(.d-widget):not(.account-section),
.section:not(.card):not(.custom--card):not(.d-widget):not(.account-section) {
    background-color: #e5b60f !important;
}

/* Ensure all text is dark on golden background */
body,
.main-wrapper,
.page-wrapper,
section,
.section,
div:not(.card):not(.custom--card):not(.d-widget):not(.btn):not(.badge) {
    color: #223b55 !important;
}

/* Override any remaining hsl(var(--base-two)) backgrounds */
[style*="hsl(var(--base-two))"],
*[style*="background-color: hsl(var(--base-two))"],
*[style*="background: hsl(var(--base-two))"] {
    background-color: #e5b60f !important;
    background: #e5b60f !important;
    color: #223b55 !important;
}

/* ============================================
   MOBILE MENU - White Background with Golden Yellow Accents
   Remove ALL Blue Colors - User Side Hamburger Menu
   ============================================ */
@media (max-width: 1199px) {
    /* Force white background - override any blue */
    .navbar-collapse,
    .navbar-collapse[style*="background"],
    .navbar-collapse[style*="background-color"],
    #navbarSupportedContent,
    #navbarSupportedContent[style*="background"] {
        background-color: #ffffff !important;
        background: #ffffff !important;
        border-top: 2px solid #e5b60f !important;
        box-shadow: 0 4px 10px rgba(229, 182, 15, 0.1) !important;
    }
    
    /* Remove any blue from menu items */
    .navbar-collapse .main-menu,
    .navbar-collapse .main-menu li {
        background-color: transparent !important;
        border-bottom: 1px solid rgba(229, 182, 15, 0.2) !important;
    }
    
    .navbar-collapse .main-menu li:last-child {
        border-bottom: none !important;
    }
    
    /* Menu links - dark blue text, no blue backgrounds */
    .navbar-collapse .main-menu li a,
    .navbar-collapse .navbar-nav .nav-link,
    .navbar-collapse .navbar-nav a {
        color: #223b55 !important;
        font-weight: 500;
        background-color: transparent !important;
    }
    
    .navbar-collapse .main-menu li a:hover,
    .navbar-collapse .main-menu li a.active,
    .navbar-collapse .main-menu li a:focus,
    .navbar-collapse .navbar-nav .nav-link:hover,
    .navbar-collapse .navbar-nav .nav-link.active {
        color: #e5b60f !important;
        background-color: rgba(229, 182, 15, 0.05) !important;
        padding-left: 0.5rem;
    }
    
    /* Sub-menu - golden yellow accents, no blue */
    .navbar-collapse .sub-menu,
    .navbar-collapse .main-menu li .sub-menu {
        background-color: rgba(229, 182, 15, 0.05) !important;
        border-left: 3px solid #e5b60f !important;
        margin-left: 1rem !important;
        border: none !important;
    }
    
    .navbar-collapse .sub-menu li {
        border-bottom: 1px solid rgba(229, 182, 15, 0.15) !important;
        background-color: transparent !important;
    }
    
    .navbar-collapse .sub-menu li a {
        color: #223b55 !important;
        background-color: transparent !important;
    }
    
    .navbar-collapse .sub-menu li a:hover {
        color: #e5b60f !important;
        background-color: rgba(229, 182, 15, 0.1) !important;
    }
    
    /* Hamburger icon - Golden Yellow lines ONLY, NO background color */
    .navbar-toggler,
    .navbar-toggler[style*="background"],
    .navbar-toggler[style*="background-color"],
    .navbar-toggler button,
    button.navbar-toggler,
    .navbar-toggler[style*="#223b55"],
    .navbar-toggler[style*="223b55"],
    .navbar-toggler[style*="blue"],
    .navbar-toggler[style*="#e5b60f"],
    .navbar-toggler[style*="e5b60f"] {
        background-color: transparent !important;
        background: transparent !important;
        border: none !important;
    }
    
    .menu-toggle,
    .menu-toggle:before,
    .menu-toggle:after,
    span.menu-toggle {
        color: #e5b60f !important;
        border-color: #e5b60f !important;
        background-color: transparent !important;
        background: transparent !important;
    }
    
    .menu-toggle {
        border-top-color: #e5b60f !important;
        border-bottom-color: #e5b60f !important;
        background: transparent !important;
        background-color: transparent !important;
    }
    
    /* Middle line (before/after) - just the line, no background */
    .menu-toggle:before,
    .menu-toggle:after {
        background: #e5b60f !important;
        background-color: #e5b60f !important;
    }
    
    /* Expanded state (X icon) - keep golden yellow lines, no background */
    .navbar-toggler[aria-expanded="true"] .menu-toggle,
    .navbar-toggler[aria-expanded="true"] .menu-toggle:before,
    .navbar-toggler[aria-expanded="true"] .menu-toggle:after {
        color: #e5b60f !important;
        border-color: #e5b60f !important;
        background-color: transparent !important;
        background: transparent !important;
    }
    
    .navbar-toggler[aria-expanded="true"] .menu-toggle:before,
    .navbar-toggler[aria-expanded="true"] .menu-toggle:after {
        background: #e5b60f !important;
        background-color: #e5b60f !important;
    }
    
    /* Hover state - golden yellow lines, no background */
    .navbar-toggler:hover,
    .navbar-toggler:hover .menu-toggle {
        background-color: transparent !important;
        background: transparent !important;
        color: #e5b60f !important;
        border-color: #e5b60f !important;
    }
    
    .navbar-toggler:hover .menu-toggle:before,
    .navbar-toggler:hover .menu-toggle:after {
        background: #e5b60f !important;
        background-color: #e5b60f !important;
    }
    
    /* Ensure all text in mobile menu is visible - remove any blue text */
    .navbar-collapse *,
    .navbar-collapse .text-white,
    .navbar-collapse .text-white * {
        color: #223b55 !important;
    }
    
    /* Buttons in mobile menu - golden yellow */
    .navbar-collapse .header-login-btn,
    .navbar-collapse .header-register-btn,
    .navbar-collapse .nav-right .header-login-btn,
    .navbar-collapse .nav-right .header-register-btn {
        background-color: #e5b60f !important;
        color: #223b55 !important;
        border-color: #e5b60f !important;
    }
    
    .navbar-collapse .header-login-btn:hover,
    .navbar-collapse .header-register-btn:hover {
        background-color: #d4a50d !important;
        color: #223b55 !important;
    }
    
    /* Remove any blue from menu has children indicators */
    .navbar-collapse .main-menu li.menu_has_children > a::before {
        color: #223b55 !important;
    }
    
    .navbar-collapse .main-menu li.menu_has_children:hover > a::before {
        color: #e5b60f !important;
    }
}


/* ============================================
   PRELOADER FIX - Full White Background
   PLACE THIS AT THE VERY END OF THE FILE
   ============================================ */

/* Hide body overflow during preload */
body {
    overflow: hidden;
}

body.page-loaded {
    overflow: visible;
}

/* Full-page white background holder - Mobile & Desktop */
.preloader-holder {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    width: 100vw !important;
    width: 100% !important;
    height: 100vh !important;
    height: 100dvh !important; /* Dynamic viewport height for mobile */
    min-height: 100vh !important;
    min-height: 100dvh !important;
    background-color: #ffffff !important;
    background: #ffffff !important;
    z-index: 99999 !important; /* Highest z-index to cover everything */
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    opacity: 1 !important;
    visibility: visible !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
}

/* Ensure preloader covers body background on mobile */
body:not(.page-loaded) {
    overflow: hidden !important;
    position: relative !important;
}

body:not(.page-loaded) .preloader-holder {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
}

/* Centered spinner container - Use relative for flexbox centering */
.preloader-holder .preloader {
    position: relative !important;
    width: 70px !important;
    height: 70px !important;
    background: transparent !important;
    margin: 0 !important;
    display: block !important;
    /* Remove any absolute positioning that conflicts with flexbox */
    left: auto !important;
    top: auto !important;
    transform: none !important;
    -webkit-transform: none !important;
    -moz-transform: none !important;
    -ms-transform: none !important;
}

/* Spinner span inside preloader */
.preloader-holder .spinner {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    position: relative !important;
}

/* Spinner styling - golden yellow rings */
.spinner-round {
    display: block !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    border-radius: 50% !important;
    border: 2px solid transparent !important;
    border-top-color: #e5b60f !important;
    animation: spin 2s linear infinite !important;
}

.spinner-round:before,
.spinner-round:after {
    content: "" !important;
    position: absolute !important;
    border-radius: 50% !important;
    border: 3px solid transparent !important;
}

.spinner-round:before {
    top: 5px !important;
    left: 5px !important;
    right: 5px !important;
    bottom: 5px !important;
    border-top-color: #e5b60f !important;
    animation: spin 3s linear infinite !important;
}

.spinner-round:after {
    top: 15px !important;
    left: 15px !important;
    right: 15px !important;
    bottom: 15px !important;
    border-top-color: #e5b60f !important;
    animation: spin 1.5s linear infinite !important;
}

/* Spin animation */
@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

@-webkit-keyframes spin {
    0% { -webkit-transform: rotate(0deg); }
    100% { -webkit-transform: rotate(360deg); }
}

/* Mobile-specific preloader fixes */
@media screen and (max-width: 768px) {
    .preloader-holder {
        position: fixed !important;
        top: 0 !important;
        left: 0 !important;
        right: 0 !important;
        bottom: 0 !important;
        width: 100% !important;
        height: 100% !important;
        height: 100vh !important;
        height: 100dvh !important; /* Dynamic viewport height for mobile */
        min-height: 100vh !important;
        min-height: 100dvh !important;
        background-color: #ffffff !important;
        background: #ffffff !important;
        z-index: 99999 !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;
        margin: 0 !important;
        padding: 0 !important;
        overflow: hidden !important;
    }
    
    /* Ensure no golden yellow shows through on mobile */
    body:not(.page-loaded) {
        overflow: hidden !important;
        position: fixed !important;
        width: 100% !important;
        height: 100% !important;
    }
    
    body:not(.page-loaded) * {
        /* Prevent any content from showing during preload */
    }
    
    .preloader-holder .preloader {
        position: relative !important;
        margin: 0 !important;
        display: block !important;
        /* Remove any absolute positioning that conflicts with flexbox */
        left: auto !important;
        top: auto !important;
        right: auto !important;
        bottom: auto !important;
        transform: none !important;
        -webkit-transform: none !important;
        -moz-transform: none !important;
        -ms-transform: none !important;
        /* Ensure it's centered by flexbox */
        align-self: center !important;
    }
    
    .preloader-holder .spinner {
        position: relative !important;
        width: 100% !important;
        height: 100% !important;
    }
    
    .preloader-holder .spinner-round {
        position: absolute !important;
        top: 0 !important;
        left: 0 !important;
        width: 100% !important;
        height: 100% !important;
    }
}

/* Tablet-specific preloader fixes */
@media screen and (min-width: 769px) and (max-width: 1024px) {
    .preloader-holder {
        height: 100vh !important;
        height: 100dvh !important;
        min-height: 100vh !important;
        min-height: 100dvh !important;
    }
}