/* GajaWallet Merchant Gold */

:root{
    --gw-gold:#c9a227;
    --gw-gold-bright:#f0cf58;
    --gw-gold-soft:#e3c45b;
    --gw-ink:#17140d;
    --gw-sidebar:#17130b;
    --gw-sidebar2:#0f0d08;
    --gw-border:#e7dfc8;
    --gw-bg:#f7f5ef;
    --gw-sidebar-w:282px;
}

html,body{
    min-height:100%;
}

body{
    margin:0;
    background:var(--gw-bg);
}

.page{
    min-height:100vh;
}

/* =========================
   MERCHANT SIDEBAR
   ========================= */

.navbar-vertical[data-bs-theme="dark"]{
    width:var(--gw-sidebar-w);
    min-height:100vh;
    padding:0;
    border:0;
    position:relative;
    overflow:hidden;

    background:
        radial-gradient(circle at 15% 0%,rgba(201,162,39,.22),transparent 32%),
        linear-gradient(180deg,#201a0c 0%,#17130b 48%,#0f0d08 100%);

    box-shadow:8px 0 28px rgba(30,24,10,.10);
}

.navbar-vertical[data-bs-theme="dark"]::before{
    content:"";
    position:absolute;
    inset:0;
    pointer-events:none;

    background:
        linear-gradient(
            145deg,
            transparent 0 58%,
            rgba(227,196,91,.08) 58.4%,
            transparent 59.2%
        ),
        linear-gradient(
            145deg,
            transparent 0 73%,
            rgba(227,196,91,.055) 73.3%,
            transparent 74%
        );
}

.navbar-vertical[data-bs-theme="dark"] .container-fluid{
    position:relative;
    z-index:1;
    min-height:100vh;
    width:100%;
    display:flex;
    flex-direction:column;
    padding:24px 18px 18px;
}

/* Logo */

.navbar-vertical .navbar-brand{
    width:100%;
    min-height:auto;
    margin:12px 0 18px;
    padding:0;
    justify-content:center;
    text-align:center;
}

.navbar-vertical .navbar-brand img{
    max-width:180px !important;
    width:auto;
    height:auto;
    background:transparent !important;
    box-shadow:none !important;
}

/* Merchant badge placeholder styling */

.gw-merchant-role-wrap{
    width:100%;
    text-align:center;
    padding-bottom:20px;
    margin-bottom:20px;
    border-bottom:1px solid rgba(255,255,255,.10);
    position:relative;
}

.gw-merchant-role-wrap::after{
    content:"";
    position:absolute;
    bottom:-1px;
    left:32%;
    width:36%;
    height:1px;

    background:linear-gradient(
        90deg,
        transparent,
        rgba(240,207,88,.95),
        transparent
    );

    box-shadow:0 0 9px rgba(240,207,88,.45);
}

.gw-merchant-badge{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:7px;

    max-width:220px;
    padding:8px 17px;

    border-radius:999px;
    border:1px solid rgba(240,207,88,.78);

    color:#ffe690;
    background:rgba(15,12,5,.30);

    font-size:11px;
    font-weight:800;
    letter-spacing:.08em;
    text-transform:uppercase;

    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;

    box-shadow:
        inset 0 0 0 1px rgba(255,255,255,.03),
        0 0 16px rgba(240,207,88,.08);
}

/* Navigation */

.navbar-vertical .navbar-nav{
    width:100%;
    gap:8px;
}

.navbar-vertical .nav-item{
    width:100%;
}

.navbar-vertical .nav-link{
    width:100%;
    min-height:52px;

    display:flex;
    align-items:center;
    gap:12px;

    margin:0;
    padding:12px 13px;

    border-radius:12px;
    border:1px solid transparent;

    color:rgba(255,255,255,.66);

    font-size:14px;
    font-weight:650;

    transition:.18s ease;
}

.navbar-vertical .nav-link:hover{
    color:#fff;
    background:rgba(227,196,91,.07);
    transform:translateX(2px);
}

.navbar-vertical .nav-link.active{
    color:#fff;

    background:
        linear-gradient(
            90deg,
            rgba(160,121,18,.75),
            rgba(106,78,10,.32)
        );

    border-color:rgba(240,207,88,.18);

    box-shadow:
        inset 4px 0 0 var(--gw-gold-bright),
        0 8px 22px rgba(0,0,0,.14);
}

.navbar-vertical .nav-link.disabled{
    color:rgba(255,255,255,.28);
    opacity:1;
}

.gw-merchant-nav-icon{
    width:21px;
    height:21px;
    flex:0 0 21px;
    color:#d9b94d;
    opacity:.92;
}

.navbar-vertical .nav-link.active .gw-merchant-nav-icon{
    color:#ffe690;
}

.gw-merchant-nav-title{
    flex:1 1 auto;
    text-align:left;
}

.gw-merchant-nav-chevron{
    width:15px;
    height:15px;
    flex:0 0 15px;
    opacity:.55;
}

/* =========================
   MAIN AREA
   ========================= */

.page-wrapper{
    background:
        radial-gradient(
            circle at 90% 0%,
            rgba(201,162,39,.07),
            transparent 28rem
        ),
        var(--gw-bg);
}

.page-header{
    background:rgba(255,255,255,.52);
    border-bottom:1px solid rgba(201,162,39,.13);
}

.page-pretitle{
    color:#9b7b18;
    font-weight:700;
    letter-spacing:.08em;
}

.page-title{
    color:var(--gw-ink);
}

/* =========================
   CARDS
   ========================= */

.card{
    border-color:var(--gw-border);
    box-shadow:0 8px 24px rgba(46,37,15,.045);
}

.card-header{
    border-bottom-color:var(--gw-border);
}

.card-title{
    color:var(--gw-ink);
    font-weight:700;
}

.card.border-primary{
    border-color:rgba(201,162,39,.58)!important;
    box-shadow:0 8px 28px rgba(201,162,39,.09);
}

/* Main merchant balance card */

.page-body .row-deck.row-cards>.col-lg-6:first-child>.card{
    background:
        radial-gradient(
            circle at 90% 20%,
            rgba(255,255,255,.17),
            transparent 12rem
        ),
        linear-gradient(
            135deg,
            #a77d13,
            #c9a227 48%,
            #e0bd4d
        );

    border-color:#b78e1b;
    color:#17140d;
}

.page-body .row-deck.row-cards>.col-lg-6:first-child>.card .text-secondary{
    color:rgba(23,20,13,.68)!important;
}

.page-body .row-deck.row-cards>.col-lg-6:first-child>.card .btn-primary:disabled{
    background:rgba(23,20,13,.82);
    border-color:rgba(23,20,13,.82);
    color:#fff;
    opacity:.72;
}

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

.btn-primary{
    --tblr-btn-bg:#b78e1b;
    --tblr-btn-border-color:#b78e1b;
    --tblr-btn-hover-bg:#9f7812;
    --tblr-btn-hover-border-color:#9f7812;
    --tblr-btn-active-bg:#8d6a10;
    --tblr-btn-active-border-color:#8d6a10;
}

.btn-outline-primary{
    --tblr-btn-color:#9b7616;
    --tblr-btn-border-color:#c7a137;
    --tblr-btn-hover-bg:#b78e1b;
    --tblr-btn-hover-border-color:#b78e1b;
}

.btn-ghost-primary{
    color:#9b7616;
}

.btn-ghost-primary:hover{
    color:#7f5f10;
    background:rgba(201,162,39,.10);
}

.form-control:focus,
.form-select:focus{
    border-color:#c9a227;
    box-shadow:0 0 0 .25rem rgba(201,162,39,.14);
}

.form-select{
    border-color:#ddd4bb;
}

/* =========================
   TABLE
   ========================= */

.table thead th{
    color:#78652f;
    background:rgba(201,162,39,.055);
    border-bottom-color:var(--gw-border);
}

.table>:not(caption)>*>*{
    border-bottom-color:#eee8d8;
}

.table tbody tr:hover>*{
    background:rgba(201,162,39,.035);
}

/* =========================
   PAGINATION
   ========================= */

.page-link{
    color:#8f6d16;
}

.active>.page-link,
.page-link.active{
    background:#b78e1b;
    border-color:#b78e1b;
}

/* =========================
   LOGIN
   ========================= */

body.d-flex.flex-column.bg-light{
    background:
        radial-gradient(
            circle at 50% 15%,
            rgba(227,196,91,.18),
            transparent 25rem
        ),
        linear-gradient(145deg,#15120c,#241d10)!important;
}

body.d-flex.flex-column.bg-light .container-tight>.text-center .h1{
    color:var(--gw-gold-bright);
    font-weight:800;
    letter-spacing:-.7px;
}

body.d-flex.flex-column.bg-light .container-tight>.text-center .text-secondary,
body.d-flex.flex-column.bg-light .container-tight>.d-flex .text-secondary{
    color:rgba(255,255,255,.55)!important;
}

body.d-flex.flex-column.bg-light .card{
    border:1px solid rgba(227,196,91,.32);
    box-shadow:0 24px 70px rgba(0,0,0,.28);
}

body.d-flex.flex-column.bg-light .card .h2{
    color:var(--gw-ink);
}

/* =========================
   RESPONSIVE
   ========================= */

@media(max-width:991.98px){
    .navbar-vertical[data-bs-theme="dark"]{
        width:100%;
        min-height:auto;
    }

    .navbar-vertical[data-bs-theme="dark"] .container-fluid{
        min-height:auto;
    }

    .navbar-vertical .nav-link{
        margin-left:0;
        margin-right:0;
    }

    .navbar-vertical .navbar-brand{
        margin-top:8px;
    }
}

/* FIX: keep desktop merchant sidebar and page content side-by-side */
@media (min-width: 992px) {
    .page {
        display: flex;
        flex-direction: row;
        align-items: stretch;
    }

    .navbar-vertical[data-bs-theme="dark"] {
        flex: 0 0 var(--gw-sidebar-w);
        width: var(--gw-sidebar-w);
        max-width: var(--gw-sidebar-w);
        min-height: 100vh;
    }

    .navbar-vertical[data-bs-theme="dark"] .container-fluid {
        width: 100%;
        min-height: 100vh;
    }

    .page > .page-wrapper {
        flex: 1 1 auto;
        width: calc(100% - var(--gw-sidebar-w));
        min-width: 0;
        margin: 0;
    }
}

/* =========================================================
   Merchant Header - KST Clock
   ========================================================= */
.gw-kst-clock {
    text-align: right;
    line-height: 1.2;
    margin-right: 6px;
}

.gw-kst-clock .gw-kst-date {
    font-size: 13px;
    font-weight: 700;
    color: #1f2937;
}

.gw-kst-clock .gw-kst-time {
    margin-top: 2px;
    font-size: 11px;
    color: #6b7280;
    white-space: nowrap;
}
