/* ==========================================================================
   Approx Theme CSS - Consolidated Static Styles
   ========================================================================== 
   All static CSS rules previously inline in blade templates are now here.
   Dynamic CSS (containing Blade {{ }} variables) remains inline.
   
   Sections:
   1. Global Color Rules (from __global_colors.blade.php)
   2. Header Language Button (from __header.blade.php)
   3. Footer Links (from __footer.blade.php)
   4. Home Section List Styles (from 7 home partials)
   5. Custom Section Cards (from __custom.blade.php)
   6. User Dashboard (from dashboard.blade.php)
   7. Virtual Card Details (from virtual_card/card/details.blade.php)
   ========================================================================== */


/* ==========================================================================
   1. Global Color Rules (from __global_colors.blade.php)
   These use CSS custom properties set dynamically in :root by Blade.
   ========================================================================== */

/* Primary color overrides */
.primary-color {
    color: var(--site-primary-color) !important;
}

.primary-bg {
    background: var(--site-primary-color) !important;
}

/* Button styles */
.primary-btn {
    color: #ffffff !important;
    background: var(--site-button-color) !important;
}

.primary-btn:hover {
    background: var(--site-button-hover) !important;
    color: #ffffff !important;
}

.site-btn-round {
    color: #ffffff;
    background: var(--site-button-color);
}

.site-btn-round:hover {
    background: var(--site-button-hover);
    color: #ffffff;
}

/* Card header links */
.site-card .site-card-header .card-header-links .card-header-link {
    background: var(--site-button-color);
}

.site-card .site-card-header .card-header-links .card-header-link:hover {
    background: var(--site-button-hover);
}

/* Badges */
.site-badge.badge-primary {
    background: color-mix(in srgb, var(--site-primary-color) 20%, transparent);
    color: var(--site-primary-color);
}

/* Checkbox styling */
.checkbox-wrapper-15 .cbx span a {
    color: var(--site-primary-color);
}

.checkbox-wrapper-15 .cbx span:first-child:before {
    background: var(--site-primary-color);
}

.checkbox-wrapper-15 .cbx:hover span:first-child {
    border-color: var(--site-primary-color);
}

.checkbox-wrapper-15 .inp-cbx:checked + .cbx span:first-child {
    border-color: var(--site-primary-color);
    background: var(--site-primary-color);
}

/* Select2 */
.select2-container--default .select2-results__option--highlighted.select2-results__option--selectable {
    background-color: var(--site-primary-color);
}

.select2-container--default .select2-results__option--selected {
    background-color: color-mix(in srgb, var(--site-primary-color) 20%, transparent);
}

/* Button link */
.btn-link::after {
    background: var(--site-primary-color);
}

.btn-link:hover {
    color: var(--site-primary-color);
}

/* ScrollUp Button */
#scrollUp {
    background: var(--site-button-color);
}

#scrollUp:hover {
    background: var(--site-button-hover);
}

/* Gradient buttons */
.gradient-btn {
    background: linear-gradient(135deg, var(--site-primary-color) 0%, var(--site-primary-dark) 100%) !important;
    color: #ffffff !important;
}

.gradient-btn:hover {
    background: linear-gradient(135deg, var(--site-primary-dark) 0%, var(--site-primary-color) 100%) !important;
}

/* Dashboard cards */
.dashboard-card {
    border-left: 4px solid var(--site-primary-color);
}

/* Navigation active states */
.nav-link.active,
.nav-link:hover {
    color: var(--site-primary-color) !important;
}

/* Form focus states */
input:focus,
textarea:focus,
select:focus {
    border-color: var(--site-primary-color) !important;
    box-shadow: 0 0 0 0.2rem color-mix(in srgb, var(--site-primary-color) 25%, transparent) !important;
}

/* Links */
a:hover {
    color: var(--site-link-color);
}

/* Table styling */
.table thead th {
    background: var(--site-header-bg);
    color: #ffffff;
}

/* Sidebar active */
.sidebar-menu .active {
    background: color-mix(in srgb, var(--site-primary-color) 10%, transparent);
    border-left: 3px solid var(--site-primary-color);
}

.sidebar-menu .active a {
    color: var(--site-primary-color);
}

/* Progress bars */
.progress-bar {
    background: var(--site-primary-color);
}

/* Alerts */
.alert-primary {
    background: color-mix(in srgb, var(--site-primary-color) 10%, transparent);
    border-color: var(--site-primary-color);
    color: var(--site-primary-color);
}

/* Pagination */
.pagination .page-item.active .page-link {
    background: var(--site-primary-color);
    border-color: var(--site-primary-color);
}

.pagination .page-link:hover {
    background: color-mix(in srgb, var(--site-primary-color) 10%, transparent);
    color: var(--site-primary-color);
}

/* Header styling */
.header-area {
    background: var(--site-header-bg);
}

/* Westpac/Digi Vault 3 Header styling */
.westpac-header {
    background: var(--site-header-bg) !important;
}

.westpac-main-header {
    background: var(--site-header-bg) !important;
}

.westpac-top-bar {
    background: var(--site-top-header-bg) !important;
}

.westpac-nav ul li a {
    color: var(--site-text-color);
}

.westpac-nav ul li a:hover,
.westpac-nav ul li.active a {
    color: var(--site-primary-color);
}

.westpac-signin-btn {
    background: var(--site-button-color) !important;
    color: #ffffff !important;
}

.westpac-signin-btn:hover {
    background: var(--site-button-hover) !important;
}

/* User dashboard header */
.user-header {
    background: linear-gradient(135deg, var(--site-primary-color) 0%, var(--site-primary-dark) 100%);
}

/* Card icons */
.card-icon {
    background: color-mix(in srgb, var(--site-primary-color) 10%, transparent);
    color: var(--site-primary-color);
}

/* Tabs */
.nav-tabs .nav-link.active {
    border-bottom: 2px solid var(--site-primary-color);
    color: var(--site-primary-color);
}

/* Switch/Toggle */
.custom-switch .custom-control-input:checked ~ .custom-control-label::before {
    background: var(--site-primary-color);
    border-color: var(--site-primary-color);
}

/* Dropdown */
.dropdown-item:hover,
.dropdown-item:focus {
    background: color-mix(in srgb, var(--site-primary-color) 10%, transparent);
    color: var(--site-primary-color);
}

/* Loading spinner */
.spinner-border {
    color: var(--site-primary-color);
}

/* Back to top */
.backtotop-wrap {
    background: var(--site-button-color);
}

.backtotop-wrap:hover {
    background: var(--site-button-hover);
}

/* User sidebar */
.user-sidebar .menu-item.active {
    background: color-mix(in srgb, var(--site-primary-color) 10%, transparent);
}

.user-sidebar .menu-item.active a {
    color: var(--site-primary-color);
}

.user-sidebar .menu-item:hover {
    background: color-mix(in srgb, var(--site-primary-color) 5%, transparent);
}

/* Footer */
.footer-area {
    background: var(--site-footer-bg);
}

.footer-area a:hover {
    color: var(--site-primary-color);
}

/* Preloader */
.preloader .circle {
    background: var(--site-primary-color);
}

/* Shape shifter button */
.shape-shifter-btn {
    background: var(--site-button-color) !important;
    color: #ffffff !important;
}

.shape-shifter-btn:hover {
    background: var(--site-button-hover) !important;
}

/* TD Primary button */
.td-primary-btn {
    background: var(--site-button-color) !important;
    color: #ffffff !important;
    border-color: var(--site-button-color) !important;
}

.td-primary-btn:hover {
    background: var(--site-button-hover) !important;
    border-color: var(--site-button-hover) !important;
}

/* Text color */
body {
    color: var(--site-text-color);
}

/* Text button (Open an account) */
.text-btn {
    color: var(--site-primary-color) !important;
}

.text-btn:hover {
    color: var(--site-primary-dark) !important;
}

.text-btn::after {
    background: var(--site-primary-color) !important;
}

/* Language dropdown styling */
.language-select select,
.language-switcher select,
.langu-swit,
select.langu-swit {
    border-color: var(--site-primary-color) !important;
    color: var(--site-primary-color) !important;
}

.language-select select:hover,
.language-switcher select:hover,
.langu-swit:hover,
select.langu-swit:hover {
    background-color: var(--site-primary-color) !important;
    color: #ffffff !important;
}

.language-select select:focus,
.language-switcher select:focus,
.langu-swit:focus,
select.langu-swit:focus {
    box-shadow: 0 0 0 2px color-mix(in srgb, var(--site-primary-color) 25%, transparent) !important;
}

/* Hero banner title span (colored text) */
.banner-content .title span {
    color: var(--site-primary-color) !important;
}

/* Banner area decorative shapes */
.banner-area::before {
    background: var(--site-primary-color) !important;
}

.banner-shapes .shape-round {
    background: var(--site-primary-color) !important;
}

/* Main menu hover and active states */
.main-menu ul li:hover > a,
.main-menu ul li.active > a {
    color: var(--site-primary-color) !important;
}

.main-menu ul li:hover > a::after,
.main-menu ul li.active > a::after {
    color: var(--site-primary-color) !important;
}

.main-menu ul li .submenu {
    border-color: var(--site-primary-color) !important;
}

.main-menu ul li .submenu li:hover > a {
    color: var(--site-primary-color) !important;
}

.main-menu ul li .submenu li:hover > a::before {
    background-color: var(--site-primary-color) !important;
}

.main-menu ul li .submenu li:hover > a::after {
    color: var(--site-primary-color) !important;
}

/* Language nav hover */
.language-nav .more_lang .lang:hover {
    background: var(--site-primary-color) !important;
}

/* Transfer buttons */
.transfer-top-btns a {
    background: color-mix(in srgb, var(--site-primary-color) 20%, transparent) !important;
    color: var(--site-primary-color) !important;
}

.transfer-top-btns a:hover,
.transfer-top-btns a.active {
    background: var(--site-primary-color) !important;
    color: #ffffff !important;
}

/* Features items */
.features-item.is-purplish .icon span {
    background-color: var(--site-primary-color) !important;
}

/* Solutions hover */
.our-solutions-item .content .title a:hover {
    color: var(--site-primary-color) !important;
}

/* Price items */
.price-item.is-active .info-list ul li span {
    background: var(--site-primary-color) !important;
}

.price-item .info-list ul li i {
    color: var(--site-primary-color) !important;
}

.price-top > p {
    border-bottom-color: var(--site-primary-color) !important;
}

/* Pricing tabs */
.pricing-tab.customize-tab .nav-tabs .nav-link {
    color: var(--site-primary-color) !important;
}

.pricing-tab.customize-tab .nav-tabs .nav-link.active {
    background-color: var(--site-primary-color) !important;
    color: #ffffff !important;
}

/* Testimonial navigation */
.testimonial-navigation button:hover {
    background-color: var(--site-primary-color) !important;
}

/* FAQ accordion */
.td-faq .accordion-button:not(.collapsed)::after {
    background: var(--site-primary-color) !important;
}

/* Blog links */
.blog-title a:hover {
    color: var(--site-primary-color) !important;
}

.blog-link:hover {
    background-color: var(--site-primary-color) !important;
}

/* Newsletter */
.newsletter-wrapper {
    background-color: var(--site-primary-color) !important;
}

/* Footer links */
.footer-link ul li a:hover {
    color: var(--site-primary-color) !important;
}

.footer-info-icon span {
    color: var(--site-primary-color) !important;
}

.footer-info-text span a:hover,
.footer-info-text p a:hover {
    color: var(--site-primary-color) !important;
}

.footer-conditions ul li::after {
    background: var(--site-primary-color) !important;
}

.footer-conditions ul li a:hover {
    color: var(--site-primary-color) !important;
}

.footer-social a:hover {
    background-color: var(--site-primary-color) !important;
}

.footer-short-info .info-content p a:hover {
    color: var(--site-primary-color) !important;
}

.footer-short-info .info-icon span i {
    color: var(--site-primary-color) !important;
}

.footer-copyright p a,
.footer-copyright p a:hover {
    color: var(--site-primary-color) !important;
}

/* Breadcrumb */
.breadcrumb-area.style-one {
    padding-top: 20px !important;
    padding-bottom: 20px !important;
}

.breadcrumb-area.style-one .container > .row {
    justify-content: flex-start !important;
}

.breadcrumb-area.style-one .container > .row > div[class*="col-"] {
    flex: 0 0 100% !important;
    max-width: 100% !important;
}

.breadcrumb-area.style-one .breadcrumb-content {
    text-align: left !important;
}

.breadcrumb-area.style-one .breadcrumb-content .title {
    text-align: left !important;
}

.breadcrumb-area.style-one .breadcrumb-content-wrapper {
    text-align: left !important;
}

.breadcrumb-area.style-one::before {
    background: var(--site-primary-color) !important;
}

.breadcrumb-menu ul li:last-child span,
.breadcrumb-menu ul li.active span {
    color: var(--site-primary-color) !important;
}

.breadcrumb-menu ul li span a:hover {
    color: var(--site-primary-color) !important;
}

/* Blog quote */
.blog-grid-quote-icon span {
    color: var(--site-primary-color) !important;
}

.blog-grid-quote-content cite {
    color: var(--site-primary-color) !important;
}

/* Video play button */
/* Fix yellow background on landing pages */
.body-landing-bg { background-color: #ffffff !important; }

.video-play-btn {
    color: var(--site-primary-color) !important;
}

/* Page Contents / Frontend Editor Data Styling */
.frontend-editor-data {
    background: #ffffff !important;
    padding: 30px !important;
    border-radius: 12px !important;
    box-shadow: 0 2px 20px rgba(0, 0, 0, 0.08) !important;
}

.frontend-editor-data p {
    background: transparent !important;
    padding: 0 0 15px 0 !important;
    font-size: 16px !important;
    line-height: 1.7 !important;
    color: #555 !important;
    border-radius: 0 !important;
}

.frontend-editor-data h1,
.frontend-editor-data h2,
.frontend-editor-data h3,
.frontend-editor-data h4,
.frontend-editor-data h5,
.frontend-editor-data h6 {
    color: #1a1a1a !important;
    margin-bottom: 15px !important;
    font-weight: 600 !important;
}

.frontend-editor-data ul,
.frontend-editor-data ol {
    padding-left: 20px !important;
    margin-bottom: 20px !important;
}

.frontend-editor-data ul li,
.frontend-editor-data ol li {
    padding: 8px 0 !important;
    font-size: 15px !important;
    color: #555 !important;
    line-height: 1.6 !important;
}

.frontend-editor-data ul li::marker {
    color: var(--site-primary-color) !important;
}

.frontend-editor-data img {
    max-width: 100% !important;
    height: auto !important;
    border-radius: 8px !important;
    margin: 15px 0 !important;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1) !important;
}

.frontend-editor-data a {
    color: var(--site-primary-color) !important;
    text-decoration: none !important;
}

.frontend-editor-data a:hover {
    text-decoration: underline !important;
}

.frontend-editor-data table {
    width: 100% !important;
    border-collapse: collapse !important;
    margin: 20px 0 !important;
}

.frontend-editor-data table th,
.frontend-editor-data table td {
    padding: 12px !important;
    border: 1px solid #e0e0e0 !important;
    text-align: left !important;
}

.frontend-editor-data table th {
    background: #f5f5f5 !important;
    font-weight: 600 !important;
}

.frontend-editor-data blockquote {
    border-left: 4px solid var(--site-primary-color) !important;
    padding-left: 20px !important;
    margin: 20px 0 !important;
    font-style: italic !important;
    color: #666 !important;
}
/* Fix yellow background on frontend editor data */
.frontend-editor-data p { background: transparent !important; }
/* Breadcrumb styling - reduced height and left-aligned title */
.breadcrumb-area.style-one { padding-top: 20px !important; padding-bottom: 20px !important; }
.breadcrumb-area.style-one .container > .row { justify-content: flex-start !important; }
.breadcrumb-area.style-one .container > .row > div[class*="col-"] { flex: 0 0 100% !important; max-width: 100% !important; }
.breadcrumb-area.style-one .breadcrumb-content { text-align: left !important; }
.breadcrumb-area.style-one .breadcrumb-content .title { text-align: left !important; }
.breadcrumb-area.style-one .breadcrumb-content-wrapper { text-align: left !important; }
.breadcrumb-area.style-one::before { background: var(--site-primary-color) !important; }
.breadcrumb-menu ul li:last-child span, .breadcrumb-menu ul li.active span { color: var(--site-primary-color) !important; }
.breadcrumb-menu ul li span a:hover { color: var(--site-primary-color) !important; }

/* Mobile menu text color fix - override meanmenu white text */
.westpac-mobile-menu ul li a {
    color: var(--westpac-black, #1F1F1F) !important;
}

.westpac-mobile-menu ul li a:hover {
    color: var(--site-primary-color) !important;
}

.mean-container .mean-nav ul li a,
.mean-container .mean-nav ul li span {
    color: var(--site-text-color, #030306) !important;
    border-color: rgba(0, 0, 0, 0.1) !important;
}

.mean-container .mean-nav ul li a:hover,
.mean-container .mean-nav ul li span:hover {
    color: var(--site-primary-color) !important;
}

.mean-container .mean-nav ul li.dropdown-opened > a,
.mean-container .mean-nav ul li.dropdown-opened > span {
    color: var(--site-primary-color) !important;
}

.mean-container .mean-nav {
    background: var(--site-header-bg, #ffffff) !important;
}

/* ==========================================================================
   2. Header Language Button (from __header.blade.php)
   ========================================================================== */

                    .westpac-header-right .lang-flag-btn {
                        background: var(--site-primary-color, #7c3aed) !important;
                        border: 1px solid var(--site-primary-color, #7c3aed) !important;
                        padding: 6px 12px !important;
                        gap: 8px !important;
                        color: #fff !important;
                        font-size: 13px !important;
                        font-weight: 600 !important;
                        white-space: nowrap !important;
                        border-radius: 4px !important;
                        width: auto !important;
                        height: 32px !important;
                        box-sizing: border-box !important;
                    }
                    .westpac-header-right .lang-flag-btn:hover { opacity: 0.9; background: var(--site-primary-color, #7c3aed) !important; }
                    .westpac-header-right .lang-flag-btn img {
                        flex-shrink: 0;
                        width: 22px !important;
                        height: 15px !important;
                        border-radius: 2px !important;
                        object-fit: cover !important;
                        box-shadow: none !important;
                        border: none !important;
                    }
                    .westpac-header-right .lang-flag-btn .lang-current-name { display: inline !important; line-height: 1; }
                    .westpac-header-right .lang-flag-btn .lang-chevron { display: inline !important; flex-shrink: 0; opacity: 0.8; }
                    /* Mobile: show round flag only, hide name + chevron */
                    @media (max-width: 991px) {
                        .westpac-header-right .lang-flag-btn {
                            background: none !important;
                            border: none !important;
                            padding: 4px !important;
                            border-radius: 50% !important;
                            width: 36px !important;
                            height: 36px !important;
                            justify-content: center !important;
                            gap: 0 !important;
                        }
                        .westpac-header-right .lang-flag-btn:hover {
                            background: rgba(0,0,0,0.05) !important;
                        }
                        .westpac-header-right .lang-flag-btn img {
                            width: 28px !important;
                            height: 28px !important;
                            border-radius: 50% !important;
                            object-fit: cover !important;
                        }
                        .westpac-header-right .lang-flag-btn .lang-current-name { display: none !important; }
                        .westpac-header-right .lang-flag-btn .lang-chevron { display: none !important; }
                    }

/* ==========================================================================
   3. Footer Links (from __footer.blade.php)
   ========================================================================== */

/* Ensure footer links are visible */
.footer-link ul li a {
    color: #ffffff !important;
    font-size: 14px;
    font-weight: 500;
    display: block;
    padding: 5px 0;
}
.footer-link ul li a:hover {
    color: #6c3beb !important;
}
.footer-link ul {
    list-style: none;
    padding: 0;
    margin: 0;
}
.footer-link ul li {
    margin-bottom: 2px;
}
.footer-widget-title h5 {
    color: #ffffff !important;
    font-size: 18px;
    font-weight: 600;
    margin-bottom: 20px;
}
.footer-info .single-item .title {
    color: rgba(255,255,255,0.7) !important;
}
.footer-info-text span a {
    color: #ffffff !important;
}

/* ==========================================================================
   4. Home Section List Styles (deduplicated from 7 home partials:
   bankingsolution, powerfulsection, faq, workstepsection,
   experiencesection, testimonialsection, whychooseus)
   ========================================================================== */

/* Shared list styling (was duplicated in 7 files) */
.description ul, .description ol, .card-text ul, .card-text ol {
    list-style-position: inside !important;
    padding-left: 1.5em !important;
    margin-bottom: 0.5em;
    text-align: left !important;
}
.description ul { list-style-type: disc !important; }
.description ol { list-style-type: decimal !important; }
.description li, .card-text li {
    margin-bottom: 0.25em !important;
    display: list-item !important;
    list-style-type: inherit !important;
}

/* Banking solution feature thumbnails */
.features-item .thumb { height: 200px; overflow: hidden; border-radius: 8px; margin-top: 15px; }
.features-item .thumb img { width: 100%; height: 100%; object-fit: cover; }

/* Experience section button */
.exp-button-link {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 24px;
    font-size: 14px;
    font-weight: 600;
    color: #fff;
    background: var(--primary-color, #6366f1);
    border: 2px solid var(--primary-color, #6366f1);
    border-radius: 6px;
    text-decoration: none;
    transition: all 0.3s ease;
}
.exp-button-link:hover { opacity: 0.9; transform: translateY(-1px); color: #fff; }
.exp-button-link i { width: 18px; height: 18px; }
.exp-item-button { list-style: none !important; margin-top: 8px; }
.exp-item-button::before { display: none !important; }

/* ==========================================================================
   5. Custom Section Cards (from __custom.blade.php)
   ========================================================================== */

    @media(max-width:767px){
        .bendigo-hero .bendigo-curve-overlay { clip-path:none !important; -webkit-clip-path:none !important; }
    }
    @media(max-width:767px){
        .nab-hero .nab-card-box { margin:20px 0; padding:28px 20px !important; }
    }
    @media(max-width:767px){
        .westpac-block-overlay { width:100% !important; }
    }
.custom-section .section-subtitle{font-size:14px;font-weight:600;text-transform:uppercase;letter-spacing:1px}
.custom-section .section-title{font-size:36px;font-weight:700;line-height:1.3}
.custom-section .section-description{font-size:16px;color:#666;max-width:600px;margin:0 auto}
.custom-card{background:#fff;border-radius:12px;overflow:hidden;box-shadow:0 4px 15px rgba(0,0,0,0.08);transition:all 0.3s ease;height:100%}
.custom-card:hover{transform:translateY(-5px);box-shadow:0 8px 25px rgba(0,0,0,0.12)}

/* Image with Read More Button */
.image-readmore-card .card-image{height:220px;overflow:hidden;position:relative}
.image-readmore-card .card-image img{width:100%;height:100%;object-fit:cover;transition:transform 0.3s ease}
.image-readmore-card:hover .card-image img{transform:scale(1.05)}
.image-readmore-card .card-image .placeholder-image{width:100%;height:100%;background:#f0f4f8;display:flex;align-items:center;justify-content:center;color:#94a3b8}
.image-readmore-card .card-body{padding:24px}
.image-readmore-card .card-title{font-size:20px;font-weight:600;margin-bottom:12px;color:#1e293b}
.image-readmore-card .card-text{font-size:14px;color:#64748b;line-height:1.6;margin-bottom:16px}
.image-readmore-card .btn-readmore{display:inline-flex;align-items:center;gap:6px;color:#6366f1 !important;background:transparent !important;font-weight:600;font-size:14px;text-decoration:none !important;transition:all 0.3s ease;padding:8px 0 !important}
.image-readmore-card .btn-readmore:hover{color:#4f46e5 !important;gap:10px}
.image-readmore-card .btn-readmore svg{transition:transform 0.3s ease}
.image-readmore-card:hover .btn-readmore svg{transform:translateX(4px)}

/* Horizontal Card with Learn More */
.horizontal-learnmore-card{display:flex;flex-direction:row;min-height:180px}
.horizontal-learnmore-card .card-image{width:40%;min-width:160px;position:relative;overflow:hidden}
.horizontal-learnmore-card .card-image img{width:100%;height:100%;object-fit:cover;transition:transform 0.3s ease}
.horizontal-learnmore-card:hover .card-image img{transform:scale(1.05)}
.horizontal-learnmore-card .card-image .placeholder-image{width:100%;height:100%;background:#f0f4f8;display:flex;align-items:center;justify-content:center;color:#94a3b8}
.horizontal-learnmore-card .card-content{flex:1;padding:20px;display:flex;flex-direction:column;justify-content:center}
.horizontal-learnmore-card .card-title{font-size:18px;font-weight:600;margin-bottom:10px;color:#1e293b}
.horizontal-learnmore-card .card-text{font-size:14px;color:#64748b;line-height:1.6;margin-bottom:14px;flex-grow:1}
.horizontal-learnmore-card .btn-learnmore{display:inline-flex;align-items:center;gap:6px;background:var(--primary-color,#6366f1);color:#fff;padding:8px 16px;border-radius:6px;font-weight:500;font-size:13px;text-decoration:none;transition:all 0.3s ease;width:fit-content}
.horizontal-learnmore-card .btn-learnmore:hover{background:var(--secondary-color,#4f46e5);color:#fff}

.text-with-image .card-image{height:200px;overflow:hidden}
.text-with-image .card-image img{width:100%;height:100%;object-fit:cover}
.text-with-image .card-body{padding:20px}
.text-with-image .card-title{font-size:18px;font-weight:600;margin-bottom:10px}
.text-with-image .card-text{font-size:14px;color:#666;margin-bottom:15px}
.text-with-icon{padding:25px;display:flex;flex-direction:row;align-items:flex-start;gap:20px}
.text-with-icon .card-icon{flex-shrink:0;width:60px;height:60px;background:linear-gradient(135deg,var(--primary-color,#6366f1) 0%,var(--secondary-color,#4f46e5) 100%);border-radius:12px;display:flex;align-items:center;justify-content:center}
.text-with-icon .card-icon .icon-img{height:40px;width:auto;max-width:50px;object-fit:contain}
.text-with-icon .card-icon .lucide-icon{width:32px;height:32px;color:#fff}
.text-with-icon .card-content{flex:1}
.text-with-icon .card-title{font-size:18px;font-weight:600;margin-bottom:8px}
.text-with-icon .card-text{font-size:14px;color:#666;line-height:1.6;margin:0}
.featured-card .card-image-overlay{height:200px;background-size:cover;background-position:center;position:relative;display:flex;align-items:flex-end;background-color:#f0f0f0}
.featured-card .card-image-overlay::before{content:'';position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(to top,rgba(0,0,0,0.7) 0%,transparent 100%)}
.featured-card .overlay-content{position:relative;padding:20px;width:100%}
.featured-card .card-body{padding:20px}
.featured-card .card-text{font-size:14px;color:#666}
.text-only-card{background:linear-gradient(135deg,#4a5568 0%,#2d3748 100%);color:#fff;padding:30px;text-align:center}
.text-only-card .card-title{font-size:20px;font-weight:600;margin-bottom:15px;color:#fff}
.text-only-card .card-text{font-size:14px;color:rgba(255,255,255,0.85);line-height:1.6}
.card-with-icon{padding:30px;text-align:center}
.card-with-icon .card-icon-wrapper{width:80px;height:80px;margin:0 auto 20px;background:linear-gradient(135deg,var(--primary-color,#6366f1) 0%,var(--secondary-color,#4f46e5) 100%);border-radius:50%;display:flex;align-items:center;justify-content:center;overflow:hidden}
.card-with-icon .card-icon-wrapper.has-image{background:#f8f9fa;padding:10px}
.card-with-icon .card-icon-wrapper .icon-img{height:50px;width:auto;max-width:60px;object-fit:contain}
.card-with-icon .card-icon-wrapper .lucide-icon{width:36px;height:36px;color:#fff}
.card-with-icon .card-title{font-size:18px;font-weight:600;margin-bottom:10px}
.card-with-icon .card-text{font-size:14px;color:#666}
.custom-section .site-btn{display:inline-block;padding:12px 30px;border-radius:5px;font-weight:600;text-decoration:none;transition:all 0.3s ease}
.custom-section .primary-btn{background:var(--primary-color,#6366f1);color:#fff}
.custom-section .primary-btn:hover{background:var(--secondary-color,#4f46e5);color:#fff}
@media(max-width:991px){
.horizontal-learnmore-card{flex-direction:column}
.horizontal-learnmore-card .card-image{width:100%;height:180px}
}
@media(max-width:991px){
.image-text-split{flex-direction:column !important}
.image-text-split .col-lg-6{width:100%}
.image-text-split-img img{min-height:300px !important}
.image-text-split-content{padding:40px 30px !important}
.hero-scene-section{min-height:350px !important}
.hero-scene-section .hero-scene-bg div{background:linear-gradient(135deg, var(--hero-start) 0%, var(--hero-end) 60%, transparent 60%) !important}
}
@media(max-width:767px){
.custom-section .section-title{font-size:28px}
.text-with-icon{flex-direction:column;text-align:center}
.text-with-icon .card-icon{margin:0 auto}
.horizontal-learnmore-card .card-content{text-align:center}
.horizontal-learnmore-card .btn-learnmore{margin:0 auto}
.image-text-split-content{padding:30px 20px !important}
.image-text-split-img img{min-height:250px !important}
.hero-scene-section{min-height:300px !important}
.hero-scene-section h2{font-size:28px !important}
}
/* Image Left/Right CTA Button */
.image-text-cta-btn {
    display: inline-block !important;
    padding: 12px 28px !important;
    border: 2px solid #e63946 !important;
    color: #e63946 !important;
    border-radius: 30px !important;
    text-decoration: none !important;
    font-weight: 600 !important;
    font-size: 14px !important;
    transition: all 0.3s ease !important;
    width: fit-content !important;
    background: transparent !important;
}
.image-text-cta-btn:hover {
    background: #e63946 !important;
    color: #fff !important;
}
/* Image Left/Right text alignment */
.image-text-split-content {
    text-align: left !important;
}
.image-text-split-content h2,
.image-text-split-content .section-description {
    text-align: left !important;
}
.section-description ul, .section-description ol, .description ul, .description ol, .card-text ul, .card-text ol { list-style-position: inside !important; padding-left: 1.5em !important; margin-bottom: 0.5em !important; text-align: left !important; }
.section-description ul, .description ul, .card-text ul { list-style-type: disc !important; }
.section-description ol, .description ol, .card-text ol { list-style-type: decimal !important; }
.section-description li, .description li, .card-text li { margin-bottom: 0.25em !important; display: list-item !important; list-style-type: inherit !important; }
/* Featured Cards Read More Button */
.featured-card .card-body .btn-readmore-featured {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    color: #6366f1 !important;
    font-weight: 600 !important;
    font-size: 14px !important;
    text-decoration: none !important;
    transition: all 0.3s ease !important;
    margin-top: 10px !important;
    padding: 6px 0 !important;
    background: transparent !important;
}
.featured-card .card-body .btn-readmore-featured:hover {
    color: #4f46e5 !important;
    gap: 10px !important;
}
.featured-card .card-body .btn-readmore-featured svg {
    transition: transform 0.3s ease !important;
    width: 16px !important;
    height: 16px !important;
}
.featured-card:hover .card-body .btn-readmore-featured svg {
    transform: translateX(4px) !important;
}

/* ==========================================================================
   6. User Dashboard (from dashboard.blade.php)
   ========================================================================== */

    .bg-globe-img {
        background-image: url('/images/extra/globe.png');
        background-position: right bottom;
        background-repeat: no-repeat;
        background-size: 50%;
        background-color: #fff;
    }
    .bg-corner-img {
        background-image: url('/images/extra/corner.png');
        background-position: right bottom;
        background-repeat: no-repeat;
        background-size: contain;
    }
    .border-dashed {
        border: 1px dashed var(--bs-border-color) !important;
    }
    .border-theme-color {
        border-color: var(--bs-border-color) !important;
    }
    .thumb-md {
        height: 40px;
        width: 40px;
    }
    .thumb-lg {
        height: 64px;
        width: 64px;
    }
    .bg-soft-danger {
        background-color: rgba(239, 52, 99, 0.15) !important;
    }
    .stat-icon {
        display: flex;
        justify-content: center;
        align-items: center;
        height: 40px;
        width: 40px;
        border-radius: 4px;
        background-color: rgba(239, 52, 99, 0.15);
    }
    .btn-soft-primary {
        background-color: rgba(49, 103, 243, 0.1);
        color: #3167f3;
        border: none;
    }
    .btn-soft-primary:hover {
        background-color: #3167f3;
        color: #fff;
    }
    .btn-soft-danger {
        background-color: rgba(239, 52, 99, 0.1);
        color: #ef3463;
        border: none;
    }
    .btn-soft-danger:hover {
        background-color: #ef3463;
        color: #fff;
    }
    .btn-soft-success {
        background-color: rgba(13, 166, 132, 0.1);
        color: #0da684;
        border: none;
    }
    .btn-soft-success:hover {
        background-color: #0da684;
        color: #fff;
    }
    .btn-soft-warning {
        background-color: rgba(245, 184, 73, 0.1);
        color: #f5b849;
        border: none;
    }
    .btn-soft-warning:hover {
        background-color: #f5b849;
        color: #fff;
    }
    .bg-soft-success {
        background-color: rgba(13, 166, 132, 0.1) !important;
        color: #0da684 !important;
    }
    .dynamic-select {
        display: flex;
        box-sizing: border-box;
        flex-direction: column;
        position: relative;
        width: auto;
        -webkit-user-select: none;
        user-select: none;
    }
    .dynamic-select .dynamic-select-header {
        border: 1px solid #dee2e6;
        padding: 7px 30px 7px 12px;
        border-radius: 5px;
        cursor: pointer;
        display: flex;
        align-items: center;
        font-size: 14px;
        background: #fff;
    }
    .dynamic-select .dynamic-select-header:after {
        content: "";
        display: block;
        position: absolute;
        top: 50%;
        right: 10px;
        transform: translateY(-50%);
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23949ba3' viewBox='0 0 16 16'%3E%3Cpath d='M8 13.1l-8-8 2.1-2.2 5.9 5.9 5.9-5.9 2.1 2.2z'/%3E%3C/svg%3E");
        height: 10px;
        width: 10px;
    }
    .dynamic-select .dynamic-select-options {
        display: none;
        position: absolute;
        top: 100%;
        left: 0;
        right: 0;
        z-index: 999;
        margin-top: 5px;
        padding: 5px;
        background-color: #fff;
        border-radius: 5px;
        box-shadow: 0 0 10px rgba(0,0,0,0.1);
        max-height: 200px;
        overflow-y: auto;
    }
    .dynamic-select.active .dynamic-select-options {
        display: block;
    }
    .dynamic-select .dynamic-select-option {
        padding: 7px 12px;
        cursor: pointer;
        display: flex;
        align-items: center;
        border-radius: 5px;
    }
    .dynamic-select .dynamic-select-option:hover {
        background-color: #f3f4f7;
    }
    .dynamic-select img {
        width: 30px;
        height: 20px;
        object-fit: contain;
        margin-right: 8px;
    }
    .mini-stat-card {
        border: none;
        box-shadow: 0 0 10px rgba(0,0,0,0.05);
    }
    .mini-stat-card .card-body {
        padding: 1rem;
    }
    .mini-stat-icon {
        width: 32px;
        height: 32px;
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .mini-stat-icon i {
        font-size: 14px;
    }
    .avatar-sm {
        width: 36px;
        height: 36px;
    }
    .fs-11 {
        font-size: 11px !important;
    }
    .fs-12 {
        font-size: 12px !important;
    }
    /* Pink stat cards styling */
    .pink-stat-card {
        border: none;
        box-shadow: 0 0 10px rgba(0,0,0,0.05);
        background: linear-gradient(135deg, #fff 0%, #fff 60%, rgba(255, 182, 193, 0.3) 100%);
        background-image: url('/images/extra/corner.png');
        background-position: right bottom;
        background-repeat: no-repeat;
        background-size: 120px;
        position: relative;
        overflow: hidden;
    }
    .pink-stat-card .card-body {
        padding: 1.25rem;
    }
    .pink-stat-icon {
        width: 40px;
        height: 40px;
        border-radius: 50%;
        background-color: rgba(239, 83, 80, 0.1);
        display: flex;
        align-items: center;
        justify-content: center;
        border: 1px solid rgba(239, 83, 80, 0.2);
    }
    .pink-stat-icon i {
        font-size: 16px;
        color: #ef5350;
    }
    /* Type badge styling */
    .type-badge {
        padding: 4px 12px;
        border-radius: 4px;
        font-size: 12px;
        font-weight: 500;
        display: inline-block;
    }
    .type-badge-deposit {
        background-color: rgba(16, 185, 129, 0.1);
        color: #10b981;
    }
    .type-badge-withdraw {
        background-color: rgba(239, 68, 68, 0.1);
        color: #ef4444;
    }
    .type-badge-transfer {
        background-color: rgba(59, 130, 246, 0.1);
        color: #3b82f6;
    }
    .type-badge-dps {
        background-color: rgba(168, 85, 247, 0.1);
        color: #a855f7;
    }
    .type-badge-fdr {
        background-color: rgba(34, 197, 94, 0.1);
        color: #22c55e;
    }
    .type-badge-loan {
        background-color: rgba(249, 115, 22, 0.1);
        color: #f97316;
    }
    .type-badge-card {
        background-color: rgba(236, 72, 153, 0.1);
        color: #ec4899;
    }
    .type-badge-other {
        background-color: rgba(107, 114, 128, 0.1);
        color: #6b7280;
    }
    /* Stat card grid styling */
    .stat-card-grid {
        border: none;
        box-shadow: 0 0 10px rgba(0,0,0,0.05);
        background: linear-gradient(135deg, #fff 0%, #fff 60%, rgba(255, 182, 193, 0.3) 100%);
        background-image: url('/images/extra/corner.png');
        background-position: right bottom;
        background-repeat: no-repeat;
        background-size: 80px;
        position: relative;
        overflow: hidden;
    }
    .stat-card-grid .card-body {
        padding: 1rem;
    }
    .stat-icon-circle {
        width: 36px;
        height: 36px;
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .stat-icon-circle i {
        font-size: 14px;
    }
    /* Center donut chart on mobile */
    @media (max-width: 767.98px) {
        #balance-details-chart {
            display: flex !important;
            justify-content: center !important;
            width: 100%;
        }
        #balance-details-chart .apexcharts-canvas {
            margin: 0 auto;
        }
    }

/* ==========================================================================
   7. Virtual Card Details (from virtual_card/card/details.blade.php)
   ========================================================================== */

        .card-visual {
            background: linear-gradient(135deg, #1a1a2e 0%, #16213e 50%, #0f3460 100%);
            border-radius: 16px;
            padding: 24px;
            color: #fff;
            position: relative;
            overflow: hidden;
            aspect-ratio: 1.586 / 1;
            max-width: 400px;
            display: flex;
            flex-direction: column;
            justify-content: space-between;
        }
        .card-visual::before {
            content: '';
            position: absolute;
            top: 0;
            right: 0;
            width: 200px;
            height: 200px;
            background: radial-gradient(circle, rgba(255,255,255,0.1) 0%, transparent 70%);
            border-radius: 50%;
            transform: translate(30%, -30%);
        }
        .card-visual .card-header-row {
            display: flex;
            justify-content: space-between;
            align-items: center;
        }
        .card-visual .contactless-icon {
            width: 30px;
            height: 30px;
        }
        .card-visual .card-brand-logo {
            height: 25px;
        }
        .card-visual .card-number-row {
            margin: 0;
        }
        .card-visual .card-number-text {
            font-size: 22px;
            font-weight: 600;
            letter-spacing: 3px;
            color: #fff !important;
            font-family: 'Courier New', monospace;
        }
        .card-visual .card-info-row {
            display: flex;
            justify-content: space-between;
            align-items: flex-end;
            flex-wrap: wrap;
            gap: 15px;
        }
        .card-visual .card-info-item label {
            font-size: 10px;
            text-transform: uppercase;
            color: rgba(255,255,255,0.7);
            display: block;
            margin-bottom: 4px;
        }
        .card-visual .card-info-item .value {
            font-size: 14px;
            font-weight: 600;
            color: #fff !important;
        }
        .card-visual .chip-icon {
            width: 45px;
            height: 35px;
        }
        .eye-toggle {
            background: rgba(255,255,255,0.2);
            border: none;
            border-radius: 50%;
            width: 36px;
            height: 36px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            cursor: pointer;
            margin-left: 10px;
            vertical-align: middle;
        }
        .eye-toggle svg {
            width: 18px;
            height: 18px;
            stroke: #fff;
        }
        .hidden-data { display: inline !important; }
        .revealed-data { display: none !important; }
        .card-revealed .hidden-data { display: none !important; }
        .card-revealed .revealed-data { display: inline !important; }
        
        .info-card {
            background: #fff;
            border-radius: 12px;
            padding: 20px;
            box-shadow: 0 2px 10px rgba(0,0,0,0.05);
            height: 100%;
        }
        .info-card .info-label {
            font-size: 12px;
            color: #6b7280;
            margin-bottom: 5px;
        }
        .info-card .info-value {
            font-size: 18px;
            font-weight: 600;
            color: #1f2937;
        }
        .status-badge {
            display: inline-block;
            padding: 4px 12px;
            border-radius: 20px;
            font-size: 12px;
            font-weight: 500;
        }
        .status-active {
            background: rgba(34, 197, 94, 0.1);
            color: #22c55e;
        }
        .status-inactive {
            background: rgba(239, 68, 68, 0.1);
            color: #ef4444;
        }

/* ==========================================================================
   Approx_2 Theme: Restored styles from blade .bak files
   ========================================================================== */


/* --- __bankingsolution.blade.php.bak --- */

.features-item .thumb { height: 200px; overflow: hidden; border-radius: 8px; margin-top: 15px; }
.features-item .thumb img { width: 100%; height: 100%; object-fit: cover; }


.description ul, .description ol, .card-text ul, .card-text ol { list-style-position: inside !important; padding-left: 1.5em !important; margin-bottom: 0.5em; text-align: left !important; }
.description ul { list-style-type: disc !important; }
.description ol { list-style-type: decimal !important; }
.description li, .card-text li { margin-bottom: 0.25em !important; display: list-item !important; list-style-type: inherit !important; }



/* --- __custom.blade.php.bak --- */

@media(max-width:767px){
        .bendigo-hero .bendigo-curve-overlay { clip-path:none !important; -webkit-clip-path:none !important; }
    }


@media(max-width:767px){
        .nab-hero .nab-card-box { margin:20px 0; padding:28px 20px !important; }
    }


@media(max-width:767px){
        .westpac-block-overlay { width:100% !important; }
    }


.custom-section .section-subtitle{font-size:14px;font-weight:600;text-transform:uppercase;letter-spacing:1px}
.custom-section .section-title{font-size:36px;font-weight:700;line-height:1.3}
.custom-section .section-description{font-size:16px;color:#666;max-width:600px;margin:0 auto}
.custom-card{background:#fff;border-radius:12px;overflow:hidden;box-shadow:0 4px 15px rgba(0,0,0,0.08);transition:all 0.3s ease;height:100%}
.custom-card:hover{transform:translateY(-5px);box-shadow:0 8px 25px rgba(0,0,0,0.12)}

/* Image with Read More Button */
.image-readmore-card .card-image{height:220px;overflow:hidden;position:relative}
.image-readmore-card .card-image img{width:100%;height:100%;object-fit:cover;transition:transform 0.3s ease}
.image-readmore-card:hover .card-image img{transform:scale(1.05)}
.image-readmore-card .card-image .placeholder-image{width:100%;height:100%;background:#f0f4f8;display:flex;align-items:center;justify-content:center;color:#94a3b8}
.image-readmore-card .card-body{padding:24px}
.image-readmore-card .card-title{font-size:20px;font-weight:600;margin-bottom:12px;color:#1e293b}
.image-readmore-card .card-text{font-size:14px;color:#64748b;line-height:1.6;margin-bottom:16px}
.image-readmore-card .btn-readmore{display:inline-flex;align-items:center;gap:6px;color:#6366f1 !important;background:transparent !important;font-weight:600;font-size:14px;text-decoration:none !important;transition:all 0.3s ease;padding:8px 0 !important}
.image-readmore-card .btn-readmore:hover{color:#4f46e5 !important;gap:10px}
.image-readmore-card .btn-readmore svg{transition:transform 0.3s ease}
.image-readmore-card:hover .btn-readmore svg{transform:translateX(4px)}

/* Horizontal Card with Learn More */
.horizontal-learnmore-card{display:flex;flex-direction:row;min-height:180px}
.horizontal-learnmore-card .card-image{width:40%;min-width:160px;position:relative;overflow:hidden}
.horizontal-learnmore-card .card-image img{width:100%;height:100%;object-fit:cover;transition:transform 0.3s ease}
.horizontal-learnmore-card:hover .card-image img{transform:scale(1.05)}
.horizontal-learnmore-card .card-image .placeholder-image{width:100%;height:100%;background:#f0f4f8;display:flex;align-items:center;justify-content:center;color:#94a3b8}
.horizontal-learnmore-card .card-content{flex:1;padding:20px;display:flex;flex-direction:column;justify-content:center}
.horizontal-learnmore-card .card-title{font-size:18px;font-weight:600;margin-bottom:10px;color:#1e293b}
.horizontal-learnmore-card .card-text{font-size:14px;color:#64748b;line-height:1.6;margin-bottom:14px;flex-grow:1}
.horizontal-learnmore-card .btn-learnmore{display:inline-flex;align-items:center;gap:6px;background:var(--primary-color,#6366f1);color:#fff;padding:8px 16px;border-radius:6px;font-weight:500;font-size:13px;text-decoration:none;transition:all 0.3s ease;width:fit-content}
.horizontal-learnmore-card .btn-learnmore:hover{background:var(--secondary-color,#4f46e5);color:#fff}

.text-with-image .card-image{height:200px;overflow:hidden}
.text-with-image .card-image img{width:100%;height:100%;object-fit:cover}
.text-with-image .card-body{padding:20px}
.text-with-image .card-title{font-size:18px;font-weight:600;margin-bottom:10px}
.text-with-image .card-text{font-size:14px;color:#666;margin-bottom:15px}
.text-with-icon{padding:25px;display:flex;flex-direction:row;align-items:flex-start;gap:20px}
.text-with-icon .card-icon{flex-shrink:0;width:60px;height:60px;background:linear-gradient(135deg,var(--primary-color,#6366f1) 0%,var(--secondary-color,#4f46e5) 100%);border-radius:12px;display:flex;align-items:center;justify-content:center}
.text-with-icon .card-icon .icon-img{height:40px;width:auto;max-width:50px;object-fit:contain}
.text-with-icon .card-icon .lucide-icon{width:32px;height:32px;color:#fff}
.text-with-icon .card-content{flex:1}
.text-with-icon .card-title{font-size:18px;font-weight:600;margin-bottom:8px}
.text-with-icon .card-text{font-size:14px;color:#666;line-height:1.6;margin:0}
.featured-card .card-image-overlay{height:200px;background-size:cover;background-position:center;position:relative;display:flex;align-items:flex-end;background-color:#f0f0f0}
.featured-card .card-image-overlay::before{content:'';position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(to top,rgba(0,0,0,0.7) 0%,transparent 100%)}
.featured-card .overlay-content{position:relative;padding:20px;width:100%}
.featured-card .card-body{padding:20px}
.featured-card .card-text{font-size:14px;color:#666}
.text-only-card{background:linear-gradient(135deg,#4a5568 0%,#2d3748 100%);color:#fff;padding:30px;text-align:center}
.text-only-card .card-title{font-size:20px;font-weight:600;margin-bottom:15px;color:#fff}
.text-only-card .card-text{font-size:14px;color:rgba(255,255,255,0.85);line-height:1.6}
.card-with-icon{padding:30px;text-align:center}
.card-with-icon .card-icon-wrapper{width:80px;height:80px;margin:0 auto 20px;background:linear-gradient(135deg,var(--primary-color,#6366f1) 0%,var(--secondary-color,#4f46e5) 100%);border-radius:50%;display:flex;align-items:center;justify-content:center;overflow:hidden}
.card-with-icon .card-icon-wrapper.has-image{background:#f8f9fa;padding:10px}
.card-with-icon .card-icon-wrapper .icon-img{height:50px;width:auto;max-width:60px;object-fit:contain}
.card-with-icon .card-icon-wrapper .lucide-icon{width:36px;height:36px;color:#fff}
.card-with-icon .card-title{font-size:18px;font-weight:600;margin-bottom:10px}
.card-with-icon .card-text{font-size:14px;color:#666}
.custom-section .site-btn{display:inline-block;padding:12px 30px;border-radius:5px;font-weight:600;text-decoration:none;transition:all 0.3s ease}
.custom-section .primary-btn{background:var(--primary-color,#6366f1);color:#fff}
.custom-section .primary-btn:hover{background:var(--secondary-color,#4f46e5);color:#fff}
@media(max-width:991px){
.horizontal-learnmore-card{flex-direction:column}
.horizontal-learnmore-card .card-image{width:100%;height:180px}
}
@media(max-width:991px){
.image-text-split{flex-direction:column !important}
.image-text-split .col-lg-6{width:100%}
.image-text-split-img img{min-height:300px !important}
.image-text-split-content{padding:40px 30px !important}
.hero-scene-section{min-height:350px !important}
.hero-scene-section .hero-scene-bg div{background:linear-gradient(135deg, var(--hero-start) 0%, var(--hero-end) 60%, transparent 60%) !important}
}
@media(max-width:767px){
.custom-section .section-title{font-size:28px}
.text-with-icon{flex-direction:column;text-align:center}
.text-with-icon .card-icon{margin:0 auto}
.horizontal-learnmore-card .card-content{text-align:center}
.horizontal-learnmore-card .btn-learnmore{margin:0 auto}
.image-text-split-content{padding:30px 20px !important}
.image-text-split-img img{min-height:250px !important}
.hero-scene-section{min-height:300px !important}
.hero-scene-section h2{font-size:28px !important}
}
/* Image Left/Right CTA Button */
.image-text-cta-btn {
    display: inline-block !important;
    padding: 12px 28px !important;
    border: 2px solid #e63946 !important;
    color: #e63946 !important;
    border-radius: 30px !important;
    text-decoration: none !important;
    font-weight: 600 !important;
    font-size: 14px !important;
    transition: all 0.3s ease !important;
    width: fit-content !important;
    background: transparent !important;
}
.image-text-cta-btn:hover {
    background: #e63946 !important;
    color: #fff !important;
}
/* Image Left/Right text alignment */
.image-text-split-content {
    text-align: left !important;
}
.image-text-split-content h2,
.image-text-split-content .section-description {
    text-align: left !important;
}


.section-description ul, .section-description ol, .description ul, .description ol, .card-text ul, .card-text ol { list-style-position: inside !important; padding-left: 1.5em !important; margin-bottom: 0.5em !important; text-align: left !important; }
.section-description ul, .description ul, .card-text ul { list-style-type: disc !important; }
.section-description ol, .description ol, .card-text ol { list-style-type: decimal !important; }
.section-description li, .description li, .card-text li { margin-bottom: 0.25em !important; display: list-item !important; list-style-type: inherit !important; }


/* Featured Cards Read More Button */
.featured-card .card-body .btn-readmore-featured {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    color: #6366f1 !important;
    font-weight: 600 !important;
    font-size: 14px !important;
    text-decoration: none !important;
    transition: all 0.3s ease !important;
    margin-top: 10px !important;
    padding: 6px 0 !important;
    background: transparent !important;
}
.featured-card .card-body .btn-readmore-featured:hover {
    color: #4f46e5 !important;
    gap: 10px !important;
}
.featured-card .card-body .btn-readmore-featured svg {
    transition: transform 0.3s ease !important;
    width: 16px !important;
    height: 16px !important;
}
.featured-card:hover .card-body .btn-readmore-featured svg {
    transform: translateX(4px) !important;
}



/* --- __experiencesection.blade.php.bak --- */

.description ul, .description ol, .card-text ul, .card-text ol { list-style-position: inside !important; padding-left: 1.5em !important; margin-bottom: 0.5em; text-align: left !important; }
.description ul { list-style-type: disc !important; }
.description ol { list-style-type: decimal !important; }
.description li, .card-text li { margin-bottom: 0.25em !important; display: list-item !important; list-style-type: inherit !important; }

.exp-button-link { display: inline-flex; align-items: center; gap: 8px; padding: 10px 24px; font-size: 14px; font-weight: 600; color: #fff; background: var(--primary-color, #6366f1); border: 2px solid var(--primary-color, #6366f1); border-radius: 6px; text-decoration: none; transition: all 0.3s ease; }
.exp-button-link:hover { opacity: 0.9; transform: translateY(-1px); color: #fff; }
.exp-button-link i { width: 18px; height: 18px; }
.exp-item-button { list-style: none !important; margin-top: 8px; }
.exp-item-button::before { display: none !important; }



/* --- __faq.blade.php.bak --- */

.description ul, .description ol, .card-text ul, .card-text ol { list-style-position: inside !important; padding-left: 1.5em !important; margin-bottom: 0.5em; text-align: left !important; }
.description ul { list-style-type: disc !important; }
.description ol { list-style-type: decimal !important; }
.description li, .card-text li { margin-bottom: 0.25em !important; display: list-item !important; list-style-type: inherit !important; }



/* --- __footer.blade.php.bak --- */

/* Footer styles for Approx 2 theme */
.approx2-footer {
    background-color: #07041B;
    padding: 60px 0 30px;
    position: relative;
}
.approx2-footer .footer-logo {
    margin-bottom: 20px;
}
.approx2-footer .footer-logo img {
    max-height: 60px;
}
.approx2-footer .description {
    color: #fff;
    margin-bottom: 10px;
}
.approx2-footer .footer-newsletter {
    margin-bottom: 40px;
}
.approx2-footer .footer-newsletter input {
    background: #fff;
    border: none;
    padding: 12px 20px;
    border-radius: 5px;
    width: 100%;
    max-width: 300px;
    margin-bottom: 15px;
}
.approx2-footer .footer-newsletter .td-btn {
    background: linear-gradient(90deg, #7B2CBF 0%, #9D4EDD 100%);
    border: none;
    padding: 12px 25px;
    border-radius: 5px;
    color: #fff;
    display: inline-flex;
    align-items: center;
    gap: 8px;
}
.approx2-footer .footer-wg-head .title {
    color: #fff !important;
    font-size: 18px;
    font-weight: 600;
    margin-bottom: 20px;
}
.approx2-footer .footer-links ul {
    list-style: none;
    padding: 0;
    margin: 0;
}
.approx2-footer .footer-links ul li {
    margin-bottom: 12px;
}
.approx2-footer .footer-links ul li a {
    color: #fff !important;
    text-decoration: none;
    transition: opacity 0.3s;
}
.approx2-footer .footer-links ul li a:hover {
    opacity: 0.8;
}
.approx2-footer .footer-info .info-item {
    margin-bottom: 15px;
}
.approx2-footer .footer-info .info-item .title {
    color: rgba(255,255,255,0.7) !important;
    font-size: 14px;
    margin-bottom: 5px;
}
.approx2-footer .footer-info .info-item .link a {
    color: #fff !important;
    text-decoration: none;
}
.approx2-footer .footer-socials {
    display: flex;
    gap: 15px;
}
.approx2-footer .footer-socials a {
    color: #9D4EDD;
    font-size: 20px;
}
.approx2-footer .footer-copyright {
    margin-top: 40px;
    padding-top: 20px;
    border-top: 1px solid rgba(255,255,255,0.1);
}
.approx2-footer .footer-copyright .description {
    color: rgba(255,255,255,0.8);
        font-size: 14px;
        
}
.approx2-footer .footer-glows {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    pointer-events: none;
}
.approx2-footer .footer-glows .glow-one {
    position: absolute;
    bottom: 0;
    left: 0;
}



/* --- __header.blade.php.bak --- */

.westpac-header-right .lang-flag-btn {
                        background: transparent !important;
                        border: 1px solid var(--site-primary-color, #7c3aed) !important;
                        padding: 6px 12px !important;
                        gap: 8px !important;
                        color: var(--site-primary-color, #7c3aed) !important;
                        font-size: 13px !important;
                        font-weight: 600 !important;
                        white-space: nowrap !important;
                        border-radius: 4px !important;
                        width: auto !important;
                        height: 32px !important;
                        box-sizing: border-box !important;
                        transition: background 0.2s, color 0.2s !important;
                    }
                    .westpac-header-right .lang-flag-btn:hover { opacity: 1; background: var(--site-primary-color, #7c3aed) !important; color: #fff !important; }
                    .westpac-header-right .lang-flag-btn img {
                        flex-shrink: 0;
                        width: 22px !important;
                        height: 15px !important;
                        border-radius: 2px !important;
                        object-fit: cover !important;
                        box-shadow: none !important;
                        border: none !important;
                    }
                    .westpac-header-right .lang-flag-btn .lang-current-name { display: inline !important; line-height: 1; }
                    .westpac-header-right .lang-flag-btn .lang-chevron { display: inline !important; flex-shrink: 0; opacity: 0.7; }
                    /* Mobile: show round flag only, hide name + chevron */
                    @media (max-width: 991px) {
                        .westpac-header-right .lang-flag-btn {
                            background: none !important;
                            border: none !important;
                            padding: 4px !important;
                            border-radius: 50% !important;
                            width: 36px !important;
                            height: 36px !important;
                            justify-content: center !important;
                            gap: 0 !important;
                        }
                        .westpac-header-right .lang-flag-btn:hover {
                            background: rgba(0,0,0,0.05) !important;
                        }
                        .westpac-header-right .lang-flag-btn img {
                            width: 28px !important;
                            height: 28px !important;
                            border-radius: 50% !important;
                            object-fit: cover !important;
                        }
                        .westpac-header-right .lang-flag-btn .lang-current-name { display: none !important; }
                        .westpac-header-right .lang-flag-btn .lang-chevron { display: none !important; }
                    }



/* --- __powerfulsection.blade.php.bak --- */

.description ul, .description ol, .card-text ul, .card-text ol { list-style-position: inside !important; padding-left: 1.5em !important; margin-bottom: 0.5em; text-align: left !important; }
.description ul { list-style-type: disc !important; }
.description ol { list-style-type: decimal !important; }
.description li, .card-text li { margin-bottom: 0.25em !important; display: list-item !important; list-style-type: inherit !important; }



/* --- __testimonialsection.blade.php.bak --- */

.description ul, .description ol, .card-text ul, .card-text ol { list-style-position: inside !important; padding-left: 1.5em !important; margin-bottom: 0.5em; text-align: left !important; }
.description ul { list-style-type: disc !important; }
.description ol { list-style-type: decimal !important; }
.description li, .card-text li { margin-bottom: 0.25em !important; display: list-item !important; list-style-type: inherit !important; }



/* --- __whychooseus.blade.php.bak --- */

.description ul, .description ol, .card-text ul, .card-text ol { list-style-position: inside !important; padding-left: 1.5em !important; margin-bottom: 0.5em; text-align: left !important; }
.description ul { list-style-type: disc !important; }
.description ol { list-style-type: decimal !important; }
.description li, .card-text li { margin-bottom: 0.25em !important; display: list-item !important; list-style-type: inherit !important; }



/* --- __workstepsection.blade.php.bak --- */

.description ul, .description ol, .card-text ul, .card-text ol { list-style-position: inside; padding-left: 1em; margin-bottom: 0.5em; text-align: left; }
.description ul { list-style-type: disc; }
.description ol { list-style-type: decimal; }
.description li, .card-text li { margin-bottom: 0.25em; }



/* --- dashboard.blade.php.bak --- */

.bg-globe-img {
        background-image: url('/images/extra/globe.png');
        background-position: right bottom;
        background-repeat: no-repeat;
        background-size: 50%;
        background-color: #fff;
    }
    .bg-corner-img {
        background-image: url('/images/extra/corner.png');
        background-position: right bottom;
        background-repeat: no-repeat;
        background-size: contain;
    }
    .border-dashed {
        border: 1px dashed var(--bs-border-color) !important;
    }
    .border-theme-color {
        border-color: var(--bs-border-color) !important;
    }
    .thumb-md {
        height: 40px;
        width: 40px;
    }
    .thumb-lg {
        height: 64px;
        width: 64px;
    }
    .bg-soft-danger {
        background-color: rgba(239, 52, 99, 0.15) !important;
    }
    .stat-icon {
        display: flex;
        justify-content: center;
        align-items: center;
        height: 40px;
        width: 40px;
        border-radius: 4px;
        background-color: rgba(239, 52, 99, 0.15);
    }
    .btn-soft-primary {
        background-color: rgba(49, 103, 243, 0.1);
        color: #3167f3;
        border: none;
    }
    .btn-soft-primary:hover {
        background-color: #3167f3;
        color: #fff;
    }
    .btn-soft-danger {
        background-color: rgba(239, 52, 99, 0.1);
        color: #ef3463;
        border: none;
    }
    .btn-soft-danger:hover {
        background-color: #ef3463;
        color: #fff;
    }
    .btn-soft-success {
        background-color: rgba(13, 166, 132, 0.1);
        color: #0da684;
        border: none;
    }
    .btn-soft-success:hover {
        background-color: #0da684;
        color: #fff;
    }
    .btn-soft-warning {
        background-color: rgba(245, 184, 73, 0.1);
        color: #f5b849;
        border: none;
    }
    .btn-soft-warning:hover {
        background-color: #f5b849;
        color: #fff;
    }
    .bg-soft-success {
        background-color: rgba(13, 166, 132, 0.1) !important;
        color: #0da684 !important;
    }
    .dynamic-select {
        display: flex;
        box-sizing: border-box;
        flex-direction: column;
        position: relative;
        width: auto;
        -webkit-user-select: none;
        user-select: none;
    }
    .dynamic-select .dynamic-select-header {
        border: 1px solid #dee2e6;
        padding: 7px 30px 7px 12px;
        border-radius: 5px;
        cursor: pointer;
        display: flex;
        align-items: center;
        font-size: 14px;
        background: #fff;
    }
    .dynamic-select .dynamic-select-header:after {
        content: "";
        display: block;
        position: absolute;
        top: 50%;
        right: 10px;
        transform: translateY(-50%);
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23949ba3' viewBox='0 0 16 16'%3E%3Cpath d='M8 13.1l-8-8 2.1-2.2 5.9 5.9 5.9-5.9 2.1 2.2z'/%3E%3C/svg%3E");
        height: 10px;
        width: 10px;
    }
    .dynamic-select .dynamic-select-options {
        display: none;
        position: absolute;
        top: 100%;
        left: 0;
        right: 0;
        z-index: 999;
        margin-top: 5px;
        padding: 5px;
        background-color: #fff;
        border-radius: 5px;
        box-shadow: 0 0 10px rgba(0,0,0,0.1);
        max-height: 200px;
        overflow-y: auto;
    }
    .dynamic-select.active .dynamic-select-options {
        display: block;
    }
    .dynamic-select .dynamic-select-option {
        padding: 7px 12px;
        cursor: pointer;
        display: flex;
        align-items: center;
        border-radius: 5px;
    }
    .dynamic-select .dynamic-select-option:hover {
        background-color: #f3f4f7;
    }
    .dynamic-select img {
        width: 30px;
        height: 20px;
        object-fit: contain;
        margin-right: 8px;
    }
    .mini-stat-card {
        border: none;
        box-shadow: 0 0 10px rgba(0,0,0,0.05);
    }
    .mini-stat-card .card-body {
        padding: 1rem;
    }
    .mini-stat-icon {
        width: 32px;
        height: 32px;
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .mini-stat-icon i {
        font-size: 14px;
    }
    .avatar-sm {
        width: 36px;
        height: 36px;
    }
    .fs-11 {
        font-size: 11px !important;
    }
    .fs-12 {
        font-size: 12px !important;
    }
    /* Pink stat cards styling */
    .pink-stat-card {
        border: none;
        box-shadow: 0 0 10px rgba(0,0,0,0.05);
        background: linear-gradient(135deg, #fff 0%, #fff 60%, rgba(255, 182, 193, 0.3) 100%);
        background-image: url('/images/extra/corner.png');
        background-position: right bottom;
        background-repeat: no-repeat;
        background-size: 120px;
        position: relative;
        overflow: hidden;
    }
    .pink-stat-card .card-body {
        padding: 1.25rem;
    }
    .pink-stat-icon {
        width: 40px;
        height: 40px;
        border-radius: 50%;
        background-color: rgba(239, 83, 80, 0.1);
        display: flex;
        align-items: center;
        justify-content: center;
        border: 1px solid rgba(239, 83, 80, 0.2);
    }
    .pink-stat-icon i {
        font-size: 16px;
        color: #ef5350;
    }
    /* Type badge styling */
    .type-badge {
        padding: 4px 12px;
        border-radius: 4px;
        font-size: 12px;
        font-weight: 500;
        display: inline-block;
    }
    .type-badge-deposit {
        background-color: rgba(16, 185, 129, 0.1);
        color: #10b981;
    }
    .type-badge-withdraw {
        background-color: rgba(239, 68, 68, 0.1);
        color: #ef4444;
    }
    .type-badge-transfer {
        background-color: rgba(59, 130, 246, 0.1);
        color: #3b82f6;
    }
    .type-badge-dps {
        background-color: rgba(168, 85, 247, 0.1);
        color: #a855f7;
    }
    .type-badge-fdr {
        background-color: rgba(34, 197, 94, 0.1);
        color: #22c55e;
    }
    .type-badge-loan {
        background-color: rgba(249, 115, 22, 0.1);
        color: #f97316;
    }
    .type-badge-card {
        background-color: rgba(236, 72, 153, 0.1);
        color: #ec4899;
    }
    .type-badge-other {
        background-color: rgba(107, 114, 128, 0.1);
        color: #6b7280;
    }
    /* Stat card grid styling */
    .stat-card-grid {
        border: none;
        box-shadow: 0 0 10px rgba(0,0,0,0.05);
        background: linear-gradient(135deg, #fff 0%, #fff 60%, rgba(255, 182, 193, 0.3) 100%);
        background-image: url('/images/extra/corner.png');
        background-position: right bottom;
        background-repeat: no-repeat;
        background-size: 80px;
        position: relative;
        overflow: hidden;
    }
    .stat-card-grid .card-body {
        padding: 1rem;
    }
    .stat-icon-circle {
        width: 36px;
        height: 36px;
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .stat-icon-circle i {
        font-size: 14px;
    }



/* --- details.blade.php.bak --- */

.card-visual {
            background: linear-gradient(135deg, #1a1a2e 0%, #16213e 50%, #0f3460 100%);
            border-radius: 16px;
            padding: 24px;
            color: #fff;
            position: relative;
            overflow: hidden;
            aspect-ratio: 1.586 / 1;
            max-width: 400px;
            display: flex;
            flex-direction: column;
            justify-content: space-between;
        }
        .card-visual::before {
            content: '';
            position: absolute;
            top: 0;
            right: 0;
            width: 200px;
            height: 200px;
            background: radial-gradient(circle, rgba(255,255,255,0.1) 0%, transparent 70%);
            border-radius: 50%;
            transform: translate(30%, -30%);
        }
        .card-visual .card-header-row {
            display: flex;
            justify-content: space-between;
            align-items: center;
        }
        .card-visual .contactless-icon {
            width: 30px;
            height: 30px;
        }
        .card-visual .card-brand-logo {
            height: 25px;
        }
        .card-visual .card-number-row {
            margin: 0;
        }
        .card-visual .card-number-text {
            font-size: 22px;
            font-weight: 600;
            letter-spacing: 3px;
            color: #fff !important;
            font-family: 'Courier New', monospace;
        }
        .card-visual .card-info-row {
            display: flex;
            justify-content: space-between;
            align-items: flex-end;
            flex-wrap: wrap;
            gap: 15px;
        }
        .card-visual .card-info-item label {
            font-size: 10px;
            text-transform: uppercase;
            color: rgba(255,255,255,0.7);
            display: block;
            margin-bottom: 4px;
        }
        .card-visual .card-info-item .value {
            font-size: 14px;
            font-weight: 600;
            color: #fff !important;
        }
        .card-visual .chip-icon {
            width: 45px;
            height: 35px;
        }
        .eye-toggle {
            background: rgba(255,255,255,0.2);
            border: none;
            border-radius: 50%;
            width: 36px;
            height: 36px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            cursor: pointer;
            margin-left: 10px;
            vertical-align: middle;
        }
        .eye-toggle svg {
            width: 18px;
            height: 18px;
            stroke: #fff;
        }
        .hidden-data { display: inline !important; }
        .revealed-data { display: none !important; }
        .card-revealed .hidden-data { display: none !important; }
        .card-revealed .revealed-data { display: inline !important; }
        
        .info-card {
            background: #fff;
            border-radius: 12px;
            padding: 20px;
            box-shadow: 0 2px 10px rgba(0,0,0,0.05);
            height: 100%;
        }
        .info-card .info-label {
            font-size: 12px;
            color: #6b7280;
            margin-bottom: 5px;
        }
        .info-card .info-value {
            font-size: 18px;
            font-weight: 600;
            color: #1f2937;
        }
        .status-badge {
            display: inline-block;
            padding: 4px 12px;
            border-radius: 20px;
            font-size: 12px;
            font-weight: 500;
        }
        .status-active {
            background: rgba(34, 197, 94, 0.1);
            color: #22c55e;
        }
        .status-inactive {
            background: rgba(239, 68, 68, 0.1);
            color: #ef4444;
        }


/* ==========================================================================
   Wallet card: improve contrast for icon circle and outline-light buttons
   ========================================================================== */
.card.bg-primary .rounded-circle.bg-white.bg-opacity-25,
.card.bg-success .rounded-circle.bg-white.bg-opacity-25 {
    border: 1px solid rgba(255, 255, 255, 0.55);
    backdrop-filter: blur(2px);
}
.card.bg-primary .rounded-circle.bg-white.bg-opacity-25 i,
.card.bg-success .rounded-circle.bg-white.bg-opacity-25 i {
}
.card.bg-primary .btn-outline-light,
.card.bg-success .btn-outline-light {
    background-color: rgba(255, 255, 255, 0.08);
    font-weight: 500;
}
.card.bg-primary .btn-outline-light:hover,
.card.bg-success .btn-outline-light:hover,
.card.bg-primary .btn-outline-light:focus,
.card.bg-success .btn-outline-light:focus {
}


/* ==========================================================================
   Wallet card: improve contrast for icon circle and outline-light buttons
   ========================================================================== */
.card.bg-primary .rounded-circle.bg-white.bg-opacity-25,
.card.bg-success .rounded-circle.bg-white.bg-opacity-25 {
    background-color: rgba(255, 255, 255, 0.22) !important;
    border: 1px solid rgba(255, 255, 255, 0.6);
    backdrop-filter: blur(2px);
}
.card.bg-primary .rounded-circle.bg-white.bg-opacity-25 i,
.card.bg-success .rounded-circle.bg-white.bg-opacity-25 i {
    color: #ffffff !important;
}
.card.bg-primary a.btn-outline-light,
.card.bg-success a.btn-outline-light,
.card.bg-primary button.btn-outline-light,
.card.bg-success button.btn-outline-light {
    color: #ffffff !important;
    border-color: rgba(255, 255, 255, 0.85) !important;
    background-color: rgba(255, 255, 255, 0.12) !important;
    font-weight: 500 !important;
}
.card.bg-primary a.btn-outline-light:hover,
.card.bg-success a.btn-outline-light:hover,
.card.bg-primary a.btn-outline-light:focus,
.card.bg-success a.btn-outline-light:focus,
.card.bg-primary button.btn-outline-light:hover,
.card.bg-success button.btn-outline-light:hover {
    background-color: #ffffff !important;
    color: #212529 !important;
    border-color: #ffffff !important;
}