/* ==========================================================
   GLOBAL VAULT PLATFORM
   THEME.CSS
   PART 1
========================================================== */

/* ==========================================================
   ROOT VARIABLES
========================================================== */

:root{

    --primary:#0B1F3A;
    --secondary:#D4AF37;

    --bg:#F8F9FA;
    --section:#FFFFFF;
    --card:#FFFFFF;

    --text:#343A40;
    --text-light:#666666;

    --border:#e6e6e6;

    --shadow:0 10px 30px rgba(0,0,0,.08);

    --radius:14px;

    --transition:.35s;

}

/* ==========================================================
   DARK MODE VARIABLES
========================================================== */

body.dark-mode{

    --bg:#0B0F19;

    --section:#121923;

    --card:#1B2330;

    --text:#FFFFFF;

    --text-light:#C9D1D9;

    --border:rgba(255,255,255,.12);

    --shadow:0 20px 40px rgba(0,0,0,.45);

}

/* ==========================================================
   GLOBAL
========================================================== */

html{

    scroll-behavior:smooth;

}

body{

    background:var(--bg);

    color:var(--text);

    font-family:Inter,Arial,sans-serif;

    transition:background .35s,color .35s;

}

/* ==========================================================
   SECTIONS
========================================================== */

.hero-section,
.statistics-section,
.plans-section,
.margin-section,
.why-section,
.testimonials-section,
.news-section,
.market-center{

    background:var(--section);

    transition:.35s;

}

/* ==========================================================
   TYPOGRAPHY
========================================================== */

h1,h2,h3,h4,h5,h6{

    color:var(--text);

    font-weight:700;

}

p,
span,
small,
li{

    color:var(--text-light);

}

/* ==========================================================
   NAVBAR
========================================================== */

.gv-navbar{

    background:var(--section);

    transition:.35s;

    border-bottom:1px solid var(--border);

}

.gv-navbar .nav-link{

    color:var(--text);

    font-weight:600;

}

.gv-navbar .nav-link:hover{

    color:var(--secondary);

}

.navbar-brand{

    color:var(--text)!important;

}

/* ==========================================================
   MOBILE MENU BUTTON
========================================================== */

.navbar-toggler{

    border:1px solid var(--border);

    background:var(--card);

    border-radius:10px;

    padding:8px 10px;

    transition:.3s;

}

.navbar-toggler:hover{

    border-color:#ffffff;

}

body.dark-mode .navbar-toggler{

    background:#2B313A;

    border:1px solid rgba(255,255,255,.35);

}

body.dark-mode .navbar-toggler-icon{

    filter:invert(1);

}

/* ==========================================================
   MOBILE DROPDOWN
========================================================== */

.navbar-collapse{

    transition:.35s;

}

body.dark-mode .navbar-collapse{

    background:#121923;

    border-radius:12px;

    padding:15px;

}

/* ==========================================================
   BUTTONS
========================================================== */

.btn-primary{

    background:var(--primary);

    border:none;

}

.btn-primary:hover{

    background:var(--secondary);

}

.btn-outline-primary{

    border:1px solid var(--primary);

    color:var(--primary);

}

body.dark-mode .btn-outline-primary{

    color:#ffffff;

    border-color:#ffffff;

}

body.dark-mode .btn-outline-primary:hover{

    background:#ffffff;

    color:#121923;

}

/* ==========================================================
   THEME SWITCH
========================================================== */

.gv-theme-slider{

    transition:.35s;

}
/* ==========================================================
   GLOBAL VAULT PLATFORM
   THEME.CSS
   PART 2
   CARDS • ICONS • SHADOWS
========================================================== */

/* ==========================================================
   GLOBAL CARD SYSTEM
========================================================== */

.card,
.stat-card,
.plan-card,
.feature-card,
.testimonial-card,
.news-card{

    background:var(--card);

    border:1px solid var(--border);

    border-radius:18px;

    box-shadow:var(--shadow);

    transition:all .35s ease;

    overflow:hidden;

}

.card:hover,
.stat-card:hover,
.plan-card:hover,
.feature-card:hover,
.testimonial-card:hover,
.news-card:hover{

    transform:translateY(-8px);

    box-shadow:
        0 18px 45px rgba(0,0,0,.18);

}

/* ==========================================================
   DARK MODE CARDS
========================================================== */

body.dark-mode .card,
body.dark-mode .stat-card,
body.dark-mode .plan-card,
body.dark-mode .feature-card,
body.dark-mode .testimonial-card,
body.dark-mode .news-card{

    background:#1B2330;

    border:1px solid rgba(255,255,255,.10);

    box-shadow:
        0 18px 40px rgba(0,0,0,.55);

}

body.dark-mode .card:hover,
body.dark-mode .stat-card:hover,
body.dark-mode .plan-card:hover,
body.dark-mode .feature-card:hover,
body.dark-mode .testimonial-card:hover,
body.dark-mode .news-card:hover{

    border-color:rgba(255,255,255,.20);

}

/* ==========================================================
   CARD TITLES
========================================================== */

.card h1,
.card h2,
.card h3,
.card h4,
.card h5,
.card h6,

.stat-card h1,
.stat-card h2,
.stat-card h3,

.plan-card h1,
.plan-card h2,
.plan-card h3,
.plan-card h4,

.feature-card h5,

.news-card h4{

    color:var(--text);

}

body.dark-mode .card h1,
body.dark-mode .card h2,
body.dark-mode .card h3,
body.dark-mode .card h4,
body.dark-mode .card h5,
body.dark-mode .card h6,

body.dark-mode .stat-card h1,
body.dark-mode .stat-card h2,
body.dark-mode .stat-card h3,

body.dark-mode .plan-card h1,
body.dark-mode .plan-card h2,
body.dark-mode .plan-card h3,
body.dark-mode .plan-card h4,

body.dark-mode .feature-card h5,

body.dark-mode .news-card h4{

    color:#FFFFFF;

}

/* ==========================================================
   CARD TEXT
========================================================== */

.card p,
.card span,
.card li,

.stat-card p,

.plan-card p,

.feature-card p,

.news-card p,

.testimonial-message{

    color:var(--text-light);

}

body.dark-mode .card p,
body.dark-mode .card span,
body.dark-mode .card li,

body.dark-mode .stat-card p,

body.dark-mode .plan-card p,

body.dark-mode .feature-card p,

body.dark-mode .news-card p,

body.dark-mode .testimonial-message{

    color:#D8DEE9;

}

/* ==========================================================
   ICONS
========================================================== */

.stat-icon,
.feature-icon{

    width:78px;

    height:78px;

    display:flex;

    align-items:center;

    justify-content:center;

    border-radius:50%;

    background:rgba(11,31,58,.08);

    transition:.35s;

}

.stat-icon i,
.feature-icon i{

    font-size:34px;

    color:var(--primary);

}

/* ==========================================================
   DARK MODE ICONS
========================================================== */

body.dark-mode .stat-icon,
body.dark-mode .feature-icon{

    background:#2B3445;

    border:1px solid rgba(255,255,255,.08);

}

body.dark-mode .stat-icon i,
body.dark-mode .feature-icon i{

    color:#FFFFFF;

    text-shadow:0 0 10px rgba(255,255,255,.25);

}

/* ==========================================================
   PLAN RETURN
========================================================== */

.plan-return{

    color:var(--secondary);

    font-size:3rem;

    font-weight:700;

}

body.dark-mode .plan-return{

    color:#FFD95A;

}

/* ==========================================================
   NEWS IMAGE
========================================================== */

.news-image{

    transition:.4s;

}

.news-card:hover .news-image{

    transform:scale(1.04);

}

/* ==========================================================
   TESTIMONIAL IMAGE
========================================================== */

.testimonial-image{

    border:4px solid rgba(255,255,255,.15);

}

body.dark-mode .testimonial-image{

    border:4px solid rgba(255,255,255,.08);

}
/* ==========================================================
   GLOBAL VAULT PLATFORM
   THEME.CSS
   PART 3
   MARKET CENTER • FOOTER • LIVE NEWS
========================================================== */


/* ==========================================================
   MARKET CENTER
========================================================== */

.market-center{

    background:var(--section);

    transition:.35s;

}

body.dark-mode .market-center{

    background:#121923;

}


/* ==========================================================
   TRADINGVIEW
========================================================== */

#tradingview_chart{

    border-radius:18px;

    overflow:hidden;

}


/* ==========================================================
   MARKET WATCH
========================================================== */

.market-watch-card{

    background:var(--card);

}

body.dark-mode .market-watch-card{

    background:#1B2330;

}

.market-row{

    transition:.25s;

}

.market-row:hover{

    background:rgba(255,255,255,.04);

}

.market-symbol{

    font-weight:700;

    color:var(--text);

}

.market-price{

    color:var(--text-light);

}

body.dark-mode .market-symbol{

    color:#ffffff;

}

body.dark-mode .market-price{

    color:#cfd8e3;

}


/* ==========================================================
   SEARCH BOX
========================================================== */

#marketSearch{

    border-radius:12px;

}

body.dark-mode #marketSearch{

    background:#111827;

    border:1px solid rgba(255,255,255,.12);

    color:#ffffff;

}

body.dark-mode #marketSearch::placeholder{

    color:#8b95a7;

}


/* ==========================================================
   LIVE MARKET NEWS
========================================================== */

.market-news-box{

    background:var(--card);

}

body.dark-mode .market-news-box{

    background:#1B2330;

}

.market-news-item{

    transition:.25s;

}

.market-news-item:hover{

    background:rgba(255,255,255,.05);

}

.news-title{

    color:var(--text);

    font-weight:600;

}

.news-meta{

    color:#00BFFF;

}

body.dark-mode .news-title{

    color:#ffffff;

}

body.dark-mode .news-meta{

    color:#6EC6FF;

}


/* ==========================================================
   MARKET TICKER
========================================================== */

.gv-market-ticker{

    background:#08131f;

}

body.dark-mode .gv-market-ticker{

    background:#121923;

}

.market-item{

    color:#ffffff;

}

.market-symbol{

    color:#ffffff;

}


/* ==========================================================
   LIVE BADGE
========================================================== */

.gv-live{

    background:#d90429;

    color:#ffffff;

}

.gv-live-dot{

    background:#ffffff;

}


/* ==========================================================
   FOOTER
========================================================== */

.footer-section{

    background:#08172B;

}

body.dark-mode .footer-section{

    background:#121923;

}

.footer-section h4,
.footer-section h5{

    color:#ffffff;

}

.footer-section p,
.footer-links a{

    color:#cfd8e3;

}

.footer-links a:hover{

    color:#ffffff;

}


/* ==========================================================
   CTA
========================================================== */

.cta-section{

    background:linear-gradient(
        135deg,
        var(--primary),
        #15375f
    );

}

body.dark-mode .cta-section{

    background:linear-gradient(
        135deg,
        #1B2330,
        #121923
    );

}


/* ==========================================================
   SCROLLBAR
========================================================== */

::-webkit-scrollbar{

    width:8px;

}

::-webkit-scrollbar-thumb{

    background:#5b6575;

    border-radius:20px;

}

body.dark-mode ::-webkit-scrollbar-thumb{

    background:#4b5563;

}


/* ==========================================================
   LINKS
========================================================== */

a{

    transition:.25s;

}

body.dark-mode a{

    color:#ffffff;

}

body.dark-mode a:hover{

    color:#D4AF37;

}


/* ==========================================================
   GLOBAL TRANSITION
========================================================== */

body,
section,
div,
.card,
button,
input,
.navbar,
.footer-section{

    transition:
        background .35s,
        color .35s,
        border-color .35s,
        box-shadow .35s;

}
/* ==========================================================
   GLOBAL VAULT PLATFORM
   THEME.CSS
   PART 4
   PREMIUM UI SYSTEM
========================================================== */


/* ==========================================================
   BUTTONS
========================================================== */

.btn{

    border-radius:12px;

    transition:all .3s ease;

    font-weight:600;

}

.btn:hover{

    transform:translateY(-2px);

}

body.dark-mode .btn-outline-primary{

    color:#ffffff;

    border:1px solid #ffffff;

}

body.dark-mode .btn-outline-primary:hover{

    background:#ffffff;

    color:#121923;

}


/* ==========================================================
   INPUTS
========================================================== */

.form-control,
.form-select{

    border-radius:12px;

    border:1px solid rgba(0,0,0,.08);

    box-shadow:none;

}

.form-control:focus,
.form-select:focus{

    border-color:#D4AF37;

    box-shadow:0 0 0 .15rem rgba(212,175,55,.20);

}

body.dark-mode .form-control,
body.dark-mode .form-select{

    background:#1B2330;

    border:1px solid rgba(255,255,255,.10);

    color:#ffffff;

}

body.dark-mode .form-control::placeholder{

    color:#9CA3AF;

}


/* ==========================================================
   TABLES
========================================================== */

.table{

    border-radius:16px;

    overflow:hidden;

}

body.dark-mode .table{

    color:#ffffff;

}

body.dark-mode .table td,
body.dark-mode .table th{

    border-color:rgba(255,255,255,.08);

}

body.dark-mode .table-striped>tbody>tr:nth-child(odd){

    background:#1E293B;

}


/* ==========================================================
   DROPDOWNS
========================================================== */

.dropdown-menu{

    border:none;

    border-radius:14px;

    box-shadow:0 20px 40px rgba(0,0,0,.15);

}

body.dark-mode .dropdown-menu{

    background:#1B2330;

    border:1px solid rgba(255,255,255,.08);

}

body.dark-mode .dropdown-item{

    color:#ffffff;

}

body.dark-mode .dropdown-item:hover{

    background:#2B3445;

}


/* ==========================================================
   MODALS
========================================================== */

body.dark-mode .modal-content{

    background:#1B2330;

    color:#ffffff;

}

body.dark-mode .modal-header{

    border-bottom:1px solid rgba(255,255,255,.08);

}

body.dark-mode .modal-footer{

    border-top:1px solid rgba(255,255,255,.08);

}


/* ==========================================================
   BADGES
========================================================== */

.badge{

    border-radius:30px;

}


/* ==========================================================
   ALERTS
========================================================== */

body.dark-mode .alert{

    border:none;

}


/* ==========================================================
   SECTION SPACING
========================================================== */

section{

    position:relative;

}

section:not(:first-child){

    padding-top:90px;

    padding-bottom:90px;

}


/* ==========================================================
   IMAGE EFFECTS
========================================================== */

img{

    transition:.35s;

}

.card:hover img{

    transform:scale(1.03);

}


/* ==========================================================
   GLOBAL SHADOWS
========================================================== */

.shadow-sm{

    box-shadow:0 8px 18px rgba(0,0,0,.08)!important;

}

.shadow{

    box-shadow:0 18px 40px rgba(0,0,0,.12)!important;

}

.shadow-lg{

    box-shadow:0 28px 60px rgba(0,0,0,.18)!important;

}

body.dark-mode .shadow-sm{

    box-shadow:0 10px 20px rgba(0,0,0,.45)!important;

}

body.dark-mode .shadow{

    box-shadow:0 20px 45px rgba(0,0,0,.55)!important;

}

body.dark-mode .shadow-lg{

    box-shadow:0 30px 70px rgba(0,0,0,.65)!important;

}


/* ==========================================================
   TEXT SELECTION
========================================================== */

::selection{

    background:#D4AF37;

    color:#ffffff;

}


/* ==========================================================
   FOCUS ACCESSIBILITY
========================================================== */

button:focus,
a:focus,
input:focus{

    outline:none;

}


/* ==========================================================
   FUTURE EXCHANGE READY
========================================================== */

.exchange-widget,

.order-book,

.trade-panel,

.chart-panel,

.wallet-card,

.p2p-card,

.giftcard-card{

    border-radius:18px;

    background:var(--card);

    border:1px solid var(--border);

    box-shadow:var(--shadow);

}

body.dark-mode .exchange-widget,
body.dark-mode .order-book,
body.dark-mode .trade-panel,
body.dark-mode .chart-panel,
body.dark-mode .wallet-card,
body.dark-mode .p2p-card,
body.dark-mode .giftcard-card{

    background:#1B2330;

    border:1px solid rgba(255,255,255,.10);

}
/* ==========================================================
   CTA BUTTON FIX
========================================================== */

.cta-section a.btn-primary,
.cta-section .btn-primary{

    background:#1B2330 !important;

    border:1px solid #ffffff !important;

    color:#ffffff !important;

}

.cta-section a.btn-primary:hover,
.cta-section .btn-primary:hover{

    background:#2B3445 !important;

    border:1px solid #ffffff !important;

    color:#ffffff !important;

}
/* ==========================================================
   CTA BUTTON SIZE
========================================================== */

.gv-cta-btn{

    min-width:220px;

    margin:10px;

    text-align:center;

}
/* ==========================================================
   CTA BUTTON FINAL FIX
========================================================== */

.cta-section .gv-cta-btn{

    width:220px;

    margin:10px;

    padding:12px 20px;

    text-align:center;

    border-radius:12px;

}


/* Open Account */

.cta-section .btn-light.gv-cta-btn{

    background:#1B2330 !important;

    border:1px solid #ffffff !important;

    color:#ffffff !important;

}


.cta-section .btn-light.gv-cta-btn:hover{

    background:#2B3445 !important;

    color:#ffffff !important;

}


/* Contact Us */

.cta-section .btn-outline-light.gv-cta-btn{

    color:#ffffff !important;

    border:1px solid #ffffff !important;

}


.cta-section .btn-outline-light.gv-cta-btn:hover{

    background:#ffffff !important;

    color:#1B2330 !important;

}
/* ==========================================================
   FOOTER LINKS
========================================================== */

.footer-section a{

    color:#ffffff;

    text-decoration:none;

}

.footer-section a:hover{

    color:#d6d6d6;

}
/* ==========================================================
   GLOBAL DARK MODE
========================================================== */

body.dark-mode{
    background:#121212;
    color:#ffffff;
}

/* All sections */

body.dark-mode section{
    background:#121212 !important;
    color:#ffffff;
}

/* Bootstrap backgrounds */

body.dark-mode .bg-white,
body.dark-mode .bg-light{
    background:#1b1f24 !important;
}

/* Cards */

body.dark-mode .card,
body.dark-mode .feature-card,
body.dark-mode .plan-card,
body.dark-mode .testimonial-card,
body.dark-mode .news-card,
body.dark-mode .statistics-card,
body.dark-mode .team-card{
    background:#1b1f24 !important;
    border-color:#2b3138 !important;
    color:#ffffff !important;
}

/* Text */

body.dark-mode h1,
body.dark-mode h2,
body.dark-mode h3,
body.dark-mode h4,
body.dark-mode h5,
body.dark-mode h6,
body.dark-mode p,
body.dark-mode span,
body.dark-mode li,
body.dark-mode label{
    color:#ffffff !important;
}

body.dark-mode .text-muted{
    color:#b5bcc5 !important;
}

/* Inputs */

body.dark-mode input,
body.dark-mode textarea,
body.dark-mode select{
    background:#20262d;
    color:#ffffff;
    border-color:#3b434d;
}

/* Tables */

body.dark-mode table,
body.dark-mode tr,
body.dark-mode td,
body.dark-mode th{
    background:#1b1f24;
    color:#ffffff;
}
/* ==========================================
   LEADERSHIP - FORCE DARK MODE
========================================== */

body.dark-mode .leadership-section{
    background:#121212 !important;
}

body.dark-mode .leadership-section .feature-card{
    background:#1b1f24 !important;
    border:1px solid #2d333b !important;
    color:#ffffff !important;
}

body.dark-mode .leadership-section h2,
body.dark-mode .leadership-section h5,
body.dark-mode .leadership-section p{
    color:#ffffff !important;
}

body.dark-mode .leadership-section .text-muted{
    color:#b7bec7 !important;
}
/* ==========================================
   DARK MODE HERO BANNER IMAGE FIX
========================================== */

body.dark-mode .hero-section.with-background{
    background-color:#1b2330 !important;
    background-blend-mode:overlay;
}

body.dark-mode .hero-section.with-background::before{
    background:rgba(11,15,25,0.45) !important;
}
/* ==========================================
   HERO IMAGE - KEEP BRIGHT IN DARK MODE
========================================== */

body.dark-mode .hero-image{
    filter: brightness(1) !important;
    opacity: 1 !important;
    mix-blend-mode: normal !important;
    transform: none;
}
/* ==========================================================
   GLOBAL VAULT DARK MODE FIXES
========================================================== */


/* FAQ DARK MODE */

[data-theme="dark"] .accordion-item{

    background:#111111;

    border-color:#252525;

}


[data-theme="dark"] .accordion-button{

    background:#111111;

    color:#ffffff;

}


[data-theme="dark"] .accordion-button:not(.collapsed){

    background:#0B1F3A;

    color:#D4AF37;

}


[data-theme="dark"] .accordion-body{

    background:#111111;

    color:#cccccc;

}


[data-theme="dark"] .accordion-button::after{

    filter:invert(1);

}



/* ==========================================================
   MARGIN LENDING CTA BUTTONS
========================================================== */


.cta-section .btn{

    min-width:230px;

    height:55px;

    display:inline-flex;

    align-items:center;

    justify-content:center;

    border-radius:12px;

    font-weight:600;

}



/* Replace light button */

.cta-section .btn-light{

    background:#0B1F3A;

    color:#ffffff;

    border:1px solid rgba(255,255,255,.4);

}



.cta-section .btn-light:hover{

    background:#D4AF37;

    color:#0B1F3A;

}



/* Outline button */

.cta-section .btn-outline-light{

    background:#0B1F3A;

    color:#ffffff;

    border:1px solid rgba(255,255,255,.4);

}



.cta-section .btn-outline-light:hover{

    background:#D4AF37;

    color:#0B1F3A;

}



/* Mobile */

@media(max-width:768px){


    .cta-section .btn{

        width:100%;

        margin-bottom:15px;

    }


}
/* ==========================================================
   GLOBAL VAULT FAQ DARK MODE OVERRIDE
========================================================== */


/* FAQ container */

[data-theme="dark"] .accordion{

    --bs-accordion-bg:#111111;
    --bs-accordion-color:#ffffff;
    --bs-accordion-border-color:#252525;

}



/* FAQ boxes */

[data-theme="dark"] .accordion-item{

    background:#111111 !important;

    border:1px solid #252525 !important;

}



/* Question */

[data-theme="dark"] .accordion-button{

    background:#111111 !important;

    color:#ffffff !important;

    box-shadow:none !important;

}



/* Open question */

[data-theme="dark"] .accordion-button:not(.collapsed){

    background:#0B1F3A !important;

    color:#D4AF37 !important;

}



/* Answer area */

[data-theme="dark"] .accordion-collapse{

    background:#111111 !important;

}



[data-theme="dark"] .accordion-body{

    background:#111111 !important;

    color:#d1d5db !important;

}



/* Bootstrap arrow */

[data-theme="dark"] .accordion-button::after{

    filter:brightness(0) invert(1);

}