@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap');

body { 
    font-family: 'Inter', sans-serif; 
    background-color: #f5f5f7;
    color: #1d1d1f;
    margin: 0;
    padding: 0;
}

.card {
    background: #ffffff;
    border-radius: 24px;
    padding: 35px 25px;
    border: none;
    box-shadow: 0 10px 40px -10px rgba(0, 0, 0, 0.08);
    transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
    cursor: pointer;
}
.card:hover {
    transform: scale(0.97);
    box-shadow: 0 5px 20px -5px rgba(0, 0, 0, 0.05);
}
.card h3 { font-weight: 700; color: #1d1d1f; margin-bottom: 8px; }
.card p { color: #86868b; font-size: 14px; margin: 0; }

.global-header {
    background-color: rgba(255, 255, 255, 0.8) !important;
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border-bottom: 1px solid rgba(0, 0, 0, 0.05);
    box-shadow: none !important;
}
.header-brand, .header-brand .track-text { color: #1d1d1f !important; }
.btn-nav { background: rgba(0, 0, 0, 0.04) !important; color: #1d1d1f !important; border: none !important; box-shadow: none !important; }
.btn-nav:hover { background: rgba(0, 0, 0, 0.08) !important; }
.btn-nav.active { background: #1d1d1f !important; color: #ffffff !important; }

@media (max-width: 768px) {
    .main-content { padding: 10px !important; }
    .global-header { padding: 15px !important; }
    .top-action-bar { gap: 8px; justify-content: flex-start; }
    .btn-action-top { font-size: 11px; padding: 10px 12px; flex: 1 1 auto; justify-content: center; }
    .top-stats-grid, .stats-grid, .stats-grid-4, .stats-grid-6, .stats-grid-3 { grid-template-columns: repeat(2, 1fr) !important; gap: 10px; }
    .stat-card { padding: 12px !important; }
    .stat-val, .stat-value { font-size: 18px !important; } 
    .stat-title { font-size: 10px !important; }
    .stat-icon { width: 35px; height: 35px; font-size: 16px; }
    @media (max-width: 400px) { .top-stats-grid, .stats-grid, .stats-grid-4, .stats-grid-6, .stats-grid-3 { grid-template-columns: 1fr !important; } }
    .menu-grid, .dashboard-grid, .grid-2, .bw-grid, .progress-grid, .grid-2-chart-table { grid-template-columns: 1fr !important; gap: 15px !important; }
    .risk-widget { flex-direction: column; padding: 15px; gap: 10px; }
    .rw-percents { flex-wrap: wrap; justify-content: center; gap: 5px; }
    .rw-pct-item { border: none !important; padding: 5px 10px !important; }
    .widget-card { padding: 15px 10px !important; }
    .cal-header-days { gap: 2px !important; }
    .cal-grid { gap: 2px !important; }
    .cal-cell { padding: 4px 2px !important; border-radius: 6px !important; }
    .cal-day-name { font-size: 8px !important; }
    .cal-date { font-size: 10px !important; }
    .cal-pnl { font-size: 8px !important; margin-top: 3px !important; letter-spacing: -0.5px; }
    .cal-trades { display: none !important; }
    .summary-item { padding: 10px 15px !important; }
    .sum-label { font-size: 11px !important; }
    .sum-val { font-size: 15px !important; }
    .table-container, .table-wrapper { width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
    table { min-width: 600px; }
    th, td { padding: 10px !important; font-size: 12px !important; }
    .table-header-box { flex-direction: column !important; align-items: stretch !important; gap: 12px; }
    .table-controls { flex-direction: column !important; width: 100%; gap: 10px; }
    .table-controls select, .table-controls input { width: 100% !important; box-sizing: border-box !important; }
    .table-container, .table-wrapper { width: 100% !important; max-width: 100vw !important; overflow-x: auto !important; -webkit-overflow-scrolling: touch !important; padding: 10px 15px 20px 15px !important; box-sizing: border-box !important; }
    table { min-width: 800px !important; }
    th, td { padding: 12px 10px !important; font-size: 12px !important; display: table-cell !important; }
    .badge-type { padding: 6px 12px !important; font-size: 11px !important; min-width: 50px !important; }
    .chart-container, .chart-wrapper, .canvas-container { position: relative !important; height: 220px !important; width: 100% !important; }
    canvas { width: 100% !important; height: 100% !important; max-height: 220px !important; object-fit: contain; }
    .chart-card, .stat-card { padding: 12px 8px !important; }
}


/* ===== Global UI normalization ===== */
html, body, button, input, select, textarea, table, th, td {
    font-family: "Inter", sans-serif !important;
}
*, *::before, *::after { box-sizing: border-box; }
.main-content {
    width: min(1200px, calc(100% - 48px)) !important;
    max-width: 1200px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-top: 24px !important;
    padding-bottom: 28px !important;
}
.main-content > * { max-width: 100%; }
.grid > *, .grid-2 > *, .grid-3 > *, .grid-4 > *,
.form-grid > *, .stats-grid > *, .stats-grid-3 > *, .stats-grid-4 > *, .stats-grid-6 > * {
    min-width: 0;
}
.page-head h1, .head h1, .page-box h1, .page-header-box h1,
.section-title, .section-header, .widget-title, .history-title {
    letter-spacing: -0.2px;
}
.btn, button, input, select, textarea { font-family: "Inter", sans-serif !important; }
@media (max-width: 768px) {
    .main-content { width: calc(100% - 30px) !important; padding-top: 15px !important; padding-bottom: 20px !important; }
}


/* ===== PTrack Professional / Soft Slate UI ===== */
:root{
    --ui-bg:#e9edf2;
    --ui-surface:#f8fafc;
    --ui-surface-2:#f1f4f8;
    --ui-border:#d8dee7;
    --ui-text:#18212f;
    --ui-muted:#64748b;
    --ui-shadow:0 12px 32px rgba(15,23,42,.07);
}
html{font-size:16px;}
body{
    background:var(--ui-bg) !important;
    color:var(--ui-text) !important;
    font-size:14px;
    line-height:1.5;
    text-rendering:optimizeLegibility;
}
body,button,input,select,textarea,table,th,td{
    font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Helvetica,Arial,sans-serif !important;
}
.card,.stat-card,.section-box,.widget-card,.form-card,.page-header-box,.plan-table-card,.table-container,.progress-box,.info-card,.alert-card,.empty-state-card,.futures-panel{
    box-shadow:var(--ui-shadow) !important;
}
.card{
    background:var(--ui-surface) !important;
    border:1px solid rgba(148,163,184,.18) !important;
    cursor:default;
    transform:none !important;
}
.card:hover{
    transform:none !important;
    box-shadow:var(--ui-shadow) !important;
}
.menu-card,.btn,.btn-nav,.btn-action-top,.action-btn,.btn-primary,.btn-secondary,.btn-outline,.btn-success{
    cursor:pointer;
}
.global-header{
    background:rgba(239,243,247,.92) !important;
    border-bottom:1px solid rgba(15,23,42,.08) !important;
}
.header-brand .track-text{color:#18212f !important;}
.btn-nav{
    font-size:13px !important;
    padding:9px 15px !important;
}
.main-content{padding-top:28px !important;padding-bottom:34px !important;}
.page-head h1,.head h1,.page-box h1,.page-header-box h1{font-size:26px !important;}
.section-title,.section-header,.widget-title,.history-title{font-size:19px !important;}
.stat-title{font-size:12px !important;}
.stat-val,.stat-value{font-size:30px !important;}
.stat-footer,.card p{font-size:13px !important;}
th{font-size:12px !important;}
td{font-size:13.5px !important;}
input,select,textarea,button{font-size:14px;}
input,select,textarea{border-color:var(--ui-border) !important;}

/* Softer focus and no hover zoom on generic cards */
.input:focus,.select:focus,.textarea:focus,.input-field:focus{
    background:#fbfcfe !important;
    border-color:#94a3b8 !important;
    box-shadow:0 0 0 3px rgba(59,130,246,.08) !important;
}

@media(max-width:768px){
    html{font-size:15px;}
    body{font-size:13px;}
    .btn-nav{font-size:12px !important;padding:8px 11px !important;}
    .page-head h1,.head h1,.page-box h1,.page-header-box h1{font-size:22px !important;}
    .section-title,.section-header,.widget-title,.history-title{font-size:17px !important;}
    .stat-val,.stat-value{font-size:24px !important;}
    th{font-size:11px !important;}
    td{font-size:12.5px !important;}
    input,select,textarea,button{font-size:13px;}
}

/* ===== Global surface/interaction polish ===== */
.stat-card,.section-box,.widget-card,.form-card,.page-header-box,.plan-table-card,.table-container,.progress-box,.info-card,.alert-card,.empty-state-card{
    background:var(--ui-surface) !important;
    border-color:rgba(148,163,184,.16) !important;
}
.stat-card:hover,.section-box:hover,.widget-card:hover,.form-card:hover,.page-header-box:hover,.plan-table-card:hover,.table-container:hover,.progress-box:hover,.info-card:hover,.alert-card:hover,.empty-state-card:hover{
    transform:none !important;
}
.input-field,.input,.select,.textarea,.money-input{
    background:var(--ui-surface-2) !important;
    color:var(--ui-text) !important;
}
::placeholder{color:#8a96a6 !important;opacity:1;}


/* ===== PTrack Professional UI V16 ===== */
:root{
    --ui-bg:#e6ebf1;
    --ui-surface:#f9fbfd;
    --ui-surface-2:#eef3f7;
    --ui-surface-3:#e7edf3;
    --ui-border:#cfd8e3;
    --ui-text:#16202d;
    --ui-muted:#66758a;
    --ui-accent:#2563eb;
    --ui-success:#0f9f6e;
    --ui-danger:#dc3c4b;
    --ui-shadow:0 10px 28px rgba(15,23,42,.055);
}
html,body{background:var(--ui-bg)!important;color:var(--ui-text)!important;}
body{font-size:15px;line-height:1.55;}
body,button,input,select,textarea,table,th,td{font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Helvetica,Arial,sans-serif!important;}
.global-header{background:rgba(238,243,248,.92)!important;border-bottom:1px solid rgba(15,23,42,.08)!important;box-shadow:0 1px 0 rgba(15,23,42,.03)!important;}
.btn-nav{font-size:13.5px!important;padding:9px 14px!important;color:#263447!important;background:rgba(255,255,255,.34)!important;}
.btn-nav:hover{background:rgba(255,255,255,.62)!important;}
.btn-nav.active{background:#1f2937!important;color:#fff!important;}
.card,.stat-card,.section-box,.widget-card,.form-card,.page-header-box,.plan-table-card,.table-container,.progress-box,.info-card,.alert-card,.empty-state-card,.futures-panel{
    background:var(--ui-surface)!important;
    border:1px solid rgba(148,163,184,.14)!important;
    box-shadow:var(--ui-shadow)!important;
}
.card:hover,.stat-card:hover,.section-box:hover,.widget-card:hover,.form-card:hover,.page-header-box:hover,.plan-table-card:hover,.table-container:hover,.progress-box:hover,.info-card:hover,.alert-card:hover,.empty-state-card:hover{
    transform:none!important;
    box-shadow:var(--ui-shadow)!important;
}
.main-content{padding-top:24px!important;padding-bottom:32px!important;}
.page-head h1,.head h1,.page-box h1,.page-header-box h1{font-size:27px!important;letter-spacing:-.45px!important;}
.section-title,.section-header,.widget-title,.history-title{font-size:18px!important;letter-spacing:-.2px!important;}
.stat-title{font-size:12.5px!important;}
.stat-val,.stat-value{font-size:31px!important;}
.stat-footer,.card p{font-size:13.5px!important;}
th{font-size:12px!important;letter-spacing:.25px;}
td{font-size:14px!important;}
input,select,textarea,button{font-size:14.5px;}
input,select,textarea{border-color:var(--ui-border)!important;}
::placeholder{color:#8996a6!important;opacity:1;}
@media(max-width:768px){
    body{font-size:14px;}
    .main-content{padding-top:16px!important;padding-bottom:22px!important;}
    .page-head h1,.head h1,.page-box h1,.page-header-box h1{font-size:23px!important;}
    .section-title,.section-header,.widget-title,.history-title{font-size:17px!important;}
    .stat-val,.stat-value{font-size:25px!important;}
    input,select,textarea,button{font-size:14px;}
}

/* ===== V1 Mobile Responsive Fix ===== */
@media (max-width: 768px) {
    html, body { width: 100%; max-width: 100%; overflow-x: hidden !important; }

    /* Header: two clean rows instead of wrapped/overlapping navigation */
    .global-header {
        position: sticky !important;
        top: 0 !important;
        z-index: 1000 !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 9px !important;
        padding: 10px 12px !important;
    }
    .header-brand {
        font-size: 18px !important;
        line-height: 1 !important;
        min-height: 28px;
        gap: 8px !important;
    }
    .logo-icon { font-size: 20px !important; }
    .header-nav {
        width: 100% !important;
        display: flex !important;
        flex-wrap: nowrap !important;
        align-items: center !important;
        gap: 6px !important;
        overflow-x: auto !important;
        overflow-y: hidden !important;
        padding: 1px 1px 3px !important;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
    }
    .header-nav::-webkit-scrollbar { display: none; }
    .btn-nav {
        flex: 0 0 auto !important;
        min-height: 36px !important;
        white-space: nowrap !important;
        padding: 8px 11px !important;
        border-radius: 10px !important;
        font-size: 12px !important;
    }

    /* Global page frame */
    .main-content {
        width: 100% !important;
        max-width: none !important;
        margin: 0 !important;
        padding: 14px 12px 22px !important;
    }
    .main-content > * { max-width: 100% !important; min-width: 0 !important; }
    .wrap, .trade-wrap {
        width: 100% !important;
        max-width: none !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    /* Page headers and action groups */
    .page-header-box {
        padding: 16px !important;
        margin-bottom: 14px !important;
        border-radius: 16px !important;
        align-items: stretch !important;
    }
    .page-header-box .title-wrapper { align-items: flex-start !important; flex-wrap: wrap !important; gap: 8px !important; }
    .page-header-box h1, .page-head h1, .head h1, .page-box h1 { font-size: 21px !important; line-height: 1.25 !important; }
    .page-header-box p, .page-head p, .head p { font-size: 12.5px !important; line-height: 1.5 !important; }
    .top-action-bar, .actions, .actions-top {
        width: 100% !important;
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 8px !important;
        margin-bottom: 14px !important;
    }
    .top-action-bar .btn-action-top,
    .actions .btn,
    .actions-top .btn,
    .btn-primary, .btn-outline-gray {
        width: 100% !important;
        min-width: 0 !important;
        min-height: 40px !important;
        justify-content: center !important;
        padding: 9px 10px !important;
        font-size: 12px !important;
        border-radius: 11px !important;
        box-sizing: border-box !important;
    }

    /* Grids: remove cramped 2/3/4-column layouts on small screens */
    .dashboard-grid,
    .grid-2,
    .grid-2-chart-table,
    .bw-grid,
    .progress-grid,
    .two-col,
    .info-grid,
    .form-grid,
    .grid-4,
    .grid-3 {
        grid-template-columns: 1fr !important;
        gap: 12px !important;
    }
    .top-stats-grid,
    .stats-grid,
    .stats-grid-4,
    .stats-grid-6,
    .stats-grid-3 {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 9px !important;
    }

    /* Cards */
    .card,
    .stat-card,
    .widget-card,
    .history-card,
    .section-box,
    .form-card,
    .plan-table-card,
    .progress-box,
    .info-card,
    .alert-card,
    .empty-state-card,
    .table-box,
    .card-box,
    .futures-panel {
        border-radius: 15px !important;
        padding: 14px !important;
    }
    .stat-card { min-width: 0 !important; gap: 9px !important; }
    .stat-icon { width: 36px !important; height: 36px !important; border-radius: 10px !important; }
    .stat-title { font-size: 10px !important; line-height: 1.35 !important; }
    .stat-val, .stat-value { font-size: 21px !important; letter-spacing: -0.3px !important; }
    .stat-footer { font-size: 11px !important; }

    /* Dashboard menu cards */
    .menu-grid { grid-template-columns: 1fr !important; gap: 9px !important; margin-bottom: 14px !important; }
    .menu-card { min-width: 0 !important; padding: 12px 13px !important; border-radius: 14px !important; }
    .menu-left { gap: 10px !important; min-width: 0 !important; }
    .menu-icon { width: 36px !important; height: 36px !important; border-radius: 10px !important; }
    .menu-title { font-size: 13px !important; }

    /* Dashboard summary / risk widgets */
    .summary-grid, .guard-grid { grid-template-columns: 1fr !important; gap: 8px !important; }
    .summary-item, .guard-item { padding: 11px !important; }
    .sum-label, .guard-item small { font-size: 9px !important; }
    .sum-val, .guard-item strong { font-size: 14px !important; }
    .guard-card { padding: 15px !important; border-radius: 15px !important; }

    /* Calendar: readable without squeezing the whole page */
    .cal-header-days, .cal-grid { gap: 3px !important; }
    .cal-cell { min-width: 0 !important; min-height: 44px !important; aspect-ratio: auto !important; padding: 5px 3px !important; border-radius: 7px !important; }
    .cal-day-name { font-size: 8px !important; }
    .cal-date { font-size: 10px !important; }
    .cal-pnl { font-size: 8px !important; line-height: 1.15 !important; margin-top: 2px !important; }
    .cal-trades { display: none !important; }

    /* Forms */
    .field { min-width: 0 !important; }
    .field label { font-size: 12px !important; }
    .input, .select, .textarea, .money-input, input, select, textarea {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        box-sizing: border-box !important;
        font-size: 14px !important;
    }
    .input, .select, .money-input { min-height: 42px !important; }
    .textarea { min-height: 82px !important; }
    .money-row, .currency-row { grid-template-columns: minmax(0,1fr) 82px !important; }
    .seg, .market-tabs { width: 100% !important; }
    .market-tabs { overflow-x: auto !important; }
    .market-tabs button { flex: 1 0 auto !important; white-space: nowrap !important; }
    .calc-grid { grid-template-columns: repeat(2, minmax(0,1fr)) !important; gap: 8px !important; }
    .calc { min-width: 0 !important; padding: 9px !important; }

    /* Tables: intentionally scroll inside their card, never across the page */
    .table-card,
    .table-container,
    .table-wrapper,
    .table-wrap,
    .history-table-wrap,
    .plan-table-card,
    .section-box {
        max-width: 100% !important;
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch;
        overscroll-behavior-x: contain;
    }
    .table-card table,
    .history-table,
    .plan-table,
    .table {
        min-width: 680px !important;
    }
    th, td { white-space: nowrap !important; }

    /* Charts */
    .chart-container, .chart-wrapper, .canvas-container {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        height: 210px !important;
    }
    canvas { max-width: 100% !important; }

    /* Empty states / modals */
    .empty-state-card { max-width: 100% !important; padding: 28px 16px !important; }
    .empty-state-card h2 { font-size: 20px !important; }
    .empty-state-card p { margin-bottom: 22px !important; font-size: 13px !important; }
    .modal-card {
        width: calc(100% - 24px) !important;
        max-width: 440px !important;
        max-height: calc(100vh - 24px) !important;
        overflow-y: auto !important;
        padding: 18px !important;
        border-radius: 16px !important;
    }
}

@media (max-width: 400px) {
    .main-content { padding-left: 10px !important; padding-right: 10px !important; }
    .top-stats-grid, .stats-grid, .stats-grid-4, .stats-grid-6, .stats-grid-3 { grid-template-columns: 1fr !important; }
    .top-action-bar, .actions, .actions-top { grid-template-columns: 1fr !important; }
    .card, .stat-card, .widget-card, .history-card, .section-box, .form-card, .plan-table-card, .progress-box, .info-card, .alert-card, .empty-state-card, .table-box, .card-box { padding: 13px !important; }
    .head h1, .page-head h1, .page-header-box h1 { font-size: 20px !important; }
    .calc-grid { grid-template-columns: 1fr !important; }
    .money-row, .currency-row { grid-template-columns: minmax(0,1fr) 76px !important; }
}


/* PTrack mobile polish: compact currency selectors */
.money-row > select,
.currency-row > select {
    min-width: 92px !important;
    width: 92px !important;
    font-size: 12px !important;
    line-height: 1.15 !important;
    padding: 9px 8px !important;
    letter-spacing: 0 !important;
}
.money-row, .currency-row { min-width: 0; }
.money-row > input, .currency-row > input { min-width: 0 !important; }
@media (max-width: 450px) {
    .money-row > select,
    .currency-row > select {
        min-width: 88px !important;
        width: 88px !important;
        font-size: 11px !important;
        padding-left: 7px !important;
        padding-right: 6px !important;
    }
}

/* ===== V1 Money Field Box Polish ===== */
.money-row,
.currency-row {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 82px !important;
    gap: 0 !important;
    align-items: stretch !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    min-height: 46px !important;
    border: 1px solid var(--ui-border) !important;
    border-radius: 12px !important;
    overflow: hidden !important;
    background: var(--ui-surface-2) !important;
    box-sizing: border-box !important;
}
.money-row > .money-input,
.money-row > input,
.currency-row > input {
    width: 100% !important;
    min-width: 0 !important;
    min-height: 44px !important;
    height: 44px !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    background: transparent !important;
    padding: 10px 12px !important;
}
.money-row > select,
.currency-row > select {
    width: 82px !important;
    min-width: 82px !important;
    max-width: 82px !important;
    min-height: 44px !important;
    height: 44px !important;
    border: 0 !important;
    border-left: 1px solid var(--ui-border) !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    background: var(--ui-surface-3) !important;
    color: var(--ui-text) !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    line-height: 1 !important;
    padding: 8px 22px 8px 9px !important;
    letter-spacing: 0 !important;
}
.money-row:focus-within,
.currency-row:focus-within {
    border-color: rgba(37,99,235,.55) !important;
    box-shadow: 0 0 0 3px rgba(37,99,235,.08) !important;
}
.money-preview {
    min-height: 18px;
    margin-top: 6px;
    font-size: 11px !important;
    line-height: 1.35 !important;
}
#netPreview {
    width: 100% !important;
    min-height: 46px !important;
    height: 46px !important;
    display: flex !important;
    align-items: center !important;
    box-sizing: border-box !important;
    padding: 10px 12px !important;
    border-radius: 12px !important;
}
@media (max-width: 450px) {
    .money-row,
    .currency-row {
        grid-template-columns: minmax(0, 1fr) 76px !important;
        min-height: 44px !important;
        border-radius: 11px !important;
    }
    .money-row > select,
    .currency-row > select {
        width: 76px !important;
        min-width: 76px !important;
        max-width: 76px !important;
        font-size: 11.5px !important;
        padding-left: 7px !important;
        padding-right: 20px !important;
    }
    .money-row > .money-input,
    .money-row > input,
    .currency-row > input {
        min-height: 42px !important;
        height: 42px !important;
        padding: 9px 10px !important;
    }
    #netPreview { min-height: 44px !important; height: 44px !important; }
}
@media (max-width: 340px) {
    .money-row,
    .currency-row {
        grid-template-columns: minmax(0, 1fr) 70px !important;
    }
    .money-row > select,
    .currency-row > select {
        width: 70px !important;
        min-width: 70px !important;
        max-width: 70px !important;
        font-size: 11px !important;
        padding-left: 5px !important;
        padding-right: 18px !important;
    }
}
/* --- FIX UI MATA UANG (INPUT GROUP) --- */
div.money-row, div.currency-row {
    display: flex !important;
    align-items: stretch !important;
    gap: 0 !important;
    padding: 0 !important;
    border: 1px solid #ced8e3 !important;
    border-radius: 11px !important;
    background: #eef3f7 !important;
    overflow: hidden !important;
    min-height: 44px !important;
}

/* Efek glow saat kotak diklik */
div.money-row:focus-within, div.currency-row:focus-within {
    border-color: #7f9abb !important;
    box-shadow: 0 0 0 3px rgba(37,99,235,.08) !important;
}

/* Reset input nominal */
div.money-row > input, div.currency-row > input {
    flex: 1 1 auto !important;
    border: none !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    min-height: 100% !important;
    padding: 10px 12px !important;
    margin: 0 !important;
    font-size: 15px !important;
    color: #172233 !important;
}

/* Reset dropdown kurs */
div.money-row > select, div.currency-row > select {
    flex: 0 0 85px !important;
    width: 85px !important;
    border: none !important;
    border-left: 1px solid #ced8e3 !important;
    border-radius: 0 !important;
    background: #dfe6ee !important; /* Sengaja digelapin dikit biar kontras */
    box-shadow: none !important;
    min-height: 100% !important;
    padding: 8px 10px !important;
    margin: 0 !important;
    font-weight: 700 !important;
    color: #3d4b5f !important;
    cursor: pointer !important;
}

/* Matiin border outline bawaan browser saat di-klik */
div.money-row > select:focus, div.currency-row > select:focus,
div.money-row > input:focus, div.currency-row > input:focus {
    box-shadow: none !important;
    border: none !important;
    outline: none !important;
}
/* Header action buttons: keep Password + Logout grouped and close together */
.header-actions{display:flex;align-items:center;gap:8px;flex:0 0 auto;}
.header-actions .btn-nav{margin:0!important;}
@media(max-width:768px){
    .header-actions{justify-content:flex-end;gap:6px;width:100%;}
}