/* =========================================================
   Nam Phuong ERP · Stable 1.37.4
   Color Contrast & Visual Hierarchy
   Visual-only release: no database or business-logic changes.
   ========================================================= */

:root{
  --np174-ink:#123247;
  --np174-text:#294b5d;
  --np174-muted:#526a78;
  --np174-line:#c9dce5;
  --np174-line-soft:#dce8ee;
  --np174-page:#f1f7fa;
  --np174-surface:#ffffff;
  --np174-surface-soft:#f6fafc;
  --np174-primary:#006b95;
  --np174-primary-dark:#005e85;
  --np174-primary-soft:#e6f5fa;
  --np174-success:#0b6b47;
  --np174-success-soft:#e8f7ef;
  --np174-warning:#9a4f00;
  --np174-warning-soft:#fff3df;
  --np174-danger:#b42318;
  --np174-danger-soft:#fff0ee;
  --np174-info:#3157a4;
  --np174-info-soft:#edf2ff;
  --np174-purple:#6547a8;
  --np174-purple-soft:#f2effb;
  --np174-shadow:0 5px 18px rgba(16,55,77,.08);
  --np174-shadow-strong:0 10px 28px rgba(10,54,76,.13);

  --np-primary:var(--np174-primary);
  --np-primary-strong:var(--np174-primary-dark);
  --np-primary-soft:var(--np174-primary-soft);
  --np-success:var(--np174-success);
  --np-warning:var(--np174-warning);
  --np-danger:var(--np174-danger);
  --np-ink:var(--np174-ink);
  --np-text:var(--np174-text);
  --np-muted:var(--np174-muted);
  --np-line:var(--np174-line-soft);
  --np-line-strong:var(--np174-line);
}

/* ===== Global readability ===== */
body.np137-modern{
  color:var(--np174-text);
  background:
    radial-gradient(circle at 100% 0,rgba(0,107,149,.07),transparent 29rem),
    linear-gradient(180deg,#f8fbfd 0,var(--np174-page) 28rem,var(--np174-page) 100%);
}
body.np137-modern h1,
body.np137-modern h2,
body.np137-modern h3,
body.np137-modern h4{color:var(--np174-ink)}
body.np137-modern .muted,
body.np137-modern .np-page-description{color:var(--np174-muted)}
body.np137-modern .page-head h2{color:#102f43}
body.np137-modern .np137-page-kicker{color:var(--np174-primary-dark)}
body.np137-modern .np137-page-kicker i{color:var(--np174-primary-dark);background:#e5f5fa;border-color:#b9dce8}

/* ===== Cards and surfaces ===== */
body.np137-modern .card,
body.np137-modern .np33-kpi,
body.np137-modern .np33-handover-card,
body.np137-modern .np33-scope-note{
  border-color:var(--np174-line)!important;
  box-shadow:var(--np174-shadow)!important;
}
body.np137-modern .card{
  color:var(--np174-text);
  background:var(--np174-surface);
}
body.np137-modern .card:hover{border-color:#aacbd8;box-shadow:var(--np174-shadow-strong)}

/* Generic KPI cards: keep values dark and accent only the edge/icon. */
body.np137-modern .metric{
  background:#fff!important;
  border-color:var(--np174-line)!important;
}
body.np137-modern .metric:before{height:4px;background:linear-gradient(90deg,#2bb3d2,var(--np174-primary) 72%,transparent)}
body.np137-modern .metric>span:not(.np137-metric-icon){color:#405e6e;font-weight:800}
body.np137-modern .metric>strong{color:var(--np174-ink)}
body.np137-modern .metric>small{color:var(--np174-muted)}
body.np137-modern .metric[data-np-accent="success"]:before{background:linear-gradient(90deg,#45c486,var(--np174-success) 72%,transparent)}
body.np137-modern .metric[data-np-accent="warning"]:before{background:linear-gradient(90deg,#efad4b,var(--np174-warning) 72%,transparent)}
body.np137-modern .metric[data-np-accent="danger"]:before{background:linear-gradient(90deg,#ec6d63,var(--np174-danger) 72%,transparent)}
body.np137-modern .metric[data-np-accent="purple"]:before{background:linear-gradient(90deg,#997bd6,var(--np174-purple) 72%,transparent)}
body.np137-modern .metric.metric-alert{background:#fff9f8!important;border-color:#efb9b3!important}
body.np137-modern .np137-metric-icon{color:var(--np174-primary-dark);border-color:#badce8;background:#eaf7fb;filter:none}
body.np137-modern .metric[data-np-accent="success"] .np137-metric-icon{color:var(--np174-success);border-color:#b8ddca;background:var(--np174-success-soft)}
body.np137-modern .metric[data-np-accent="warning"] .np137-metric-icon{color:var(--np174-warning);border-color:#ebcd9d;background:var(--np174-warning-soft)}
body.np137-modern .metric[data-np-accent="danger"] .np137-metric-icon{color:var(--np174-danger);border-color:#edbbb6;background:var(--np174-danger-soft)}
body.np137-modern .metric[data-np-accent="purple"] .np137-metric-icon{color:var(--np174-purple);border-color:#d2c7eb;background:var(--np174-purple-soft)}

/* ===== Employee dashboard: solve the dark-blue-card / colored-text conflict ===== */
body.np137-modern .np33-scope-note{
  color:var(--np174-text);
  background:#f2f9fc!important;
  border-color:#bcdce8!important;
}
body.np137-modern .np33-scope-note>span:first-child{color:var(--np174-primary-dark);background:#dff1f7}
body.np137-modern .np33-scope-note b{color:var(--np174-ink)}
body.np137-modern .np33-scope-note small{color:#496675}

body.np137-modern .np33-today-kpis{gap:10px}
body.np137-modern .np33-kpi,
body.np137-modern .np33-kpi.primary,
body.np137-modern .np33-kpi.warning{
  position:relative;
  overflow:hidden;
  color:var(--np174-text)!important;
  background:#fff!important;
  border:1px solid var(--np174-line)!important;
  box-shadow:var(--np174-shadow)!important;
}
body.np137-modern .np33-kpi:before{
  content:"";
  position:absolute;
  left:0;top:0;right:0;
  height:4px;
  background:var(--np174-info);
}
body.np137-modern .np33-kpi:nth-child(1):before{background:var(--np174-primary)}
body.np137-modern .np33-kpi:nth-child(2):before{background:var(--np174-info)}
body.np137-modern .np33-kpi:nth-child(3):before{background:var(--np174-success)}
body.np137-modern .np33-kpi:nth-child(4):before{background:var(--np174-warning)}
body.np137-modern .np33-kpi.primary:hover,
body.np137-modern .np33-kpi.warning:hover{background:#fff!important}
body.np137-modern .np33-kpi>span:first-child{color:#405e6e;font-weight:850}
body.np137-modern .np33-kpi>strong,
body.np137-modern .np33-kpi.primary>strong{color:var(--np174-ink)!important;text-shadow:none}
body.np137-modern .np33-kpi:nth-child(1)>strong{color:var(--np174-primary-dark)!important}
body.np137-modern .np33-kpi:nth-child(3)>strong{color:var(--np174-success)!important}
body.np137-modern .np33-kpi:nth-child(4).warning>strong{color:var(--np174-warning)!important}
body.np137-modern .np33-kpi>small{color:var(--np174-muted)}
body.np137-modern .np33-delta{
  display:inline-flex;
  width:max-content;
  max-width:100%;
  align-items:center;
  padding:3px 7px;
  border-radius:999px;
  line-height:1.25;
}
body.np137-modern .np33-delta.up{color:var(--np174-success);background:var(--np174-success-soft)}
body.np137-modern .np33-delta.down{color:var(--np174-danger);background:var(--np174-danger-soft)}
body.np137-modern .np33-delta.flat{color:#455f6e;background:#edf3f6}

body.np137-modern .np33-handover-card{
  color:var(--np174-text);
  background:#f4fbf7!important;
  border-color:#aad7bf!important;
}
body.np137-modern .np33-handover-head small{color:#527061}
body.np137-modern .np33-handover-head h3{color:#123e2a}
body.np137-modern .np33-handover-total{
  background:#dff4e8;
  border-color:#8fc9a8;
}
body.np137-modern .np33-handover-total span{color:#145d3d}
body.np137-modern .np33-handover-total strong{color:#075f3b}
body.np137-modern .np33-handover-equation>div{border-color:#cfe0d6;background:#fff}
body.np137-modern .np33-handover-equation small{color:#526d5e}
body.np137-modern .np33-handover-equation b{color:#173f2c}
body.np137-modern .np33-handover-mini span{color:#4a6656;border-color:#d0e2d7;background:#fff}
body.np137-modern .np33-handover-mini b{color:#123e2a}

/* ===== Buttons: selectors are limited to interactive elements ===== */
body.np137-modern button.primary,
body.np137-modern a.primary{
  color:#fff!important;
  border-color:#005b80;
  background:linear-gradient(135deg,#0079a8 0,var(--np174-primary) 58%,var(--np174-primary-dark) 100%);
  box-shadow:0 7px 17px rgba(0,94,133,.23);
}
body.np137-modern button.primary:hover,
body.np137-modern a.primary:hover{background:linear-gradient(135deg,#0087b8,#006b95 58%,#005477)}
body.np137-modern button.secondary,
body.np137-modern a.secondary{
  color:#274b5e;
  border-color:#bfd4de;
  background:#fff;
}
body.np137-modern button.secondary:hover,
body.np137-modern a.secondary:hover{color:var(--np174-primary-dark);border-color:#8cbfD2;background:#edf8fb}
body.np137-modern button:focus-visible,
body.np137-modern input:focus-visible,
body.np137-modern select:focus-visible,
body.np137-modern textarea:focus-visible{
  outline:3px solid rgba(0,107,149,.23);
  outline-offset:2px;
}

/* ===== Status colors and finance values ===== */
body.np137-modern .pill.ok,
body.np137-modern .status-pill.approved,
body.np137-modern .approval-state.approved{
  color:#075f3b!important;
  background:#e5f6ed!important;
  border-color:#a9d9bf!important;
}
body.np137-modern .pill.bad,
body.np137-modern .status-pill.rejected,
body.np137-modern .approval-state.rejected{
  color:#9f2017!important;
  background:#fff0ee!important;
  border-color:#ebb5b0!important;
}
body.np137-modern .approval-state.pending,
body.np137-modern .pill.warning,
body.np137-modern .status-pill.pending{
  color:#874500!important;
  background:#fff2dc!important;
  border-color:#e8c58e!important;
}
body.np137-modern .good-text{color:var(--np174-success)!important}
body.np137-modern .bad-text{color:var(--np174-danger)!important}
body.np137-modern .metric-total{color:#075f3b!important}
body.np137-modern .metric-cash{color:#0b6b47!important}
body.np137-modern .metric-bank{color:#254f9c!important}
body.np137-modern .metric-debt{color:#a1261d!important}
body.np137-modern .metric-bottle{color:#8b4800!important}

/* ===== Forms, filters and tables ===== */
body.np137-modern label{color:#294d60}
body.np137-modern input,
body.np137-modern select,
body.np137-modern textarea{color:#183b4e;border-color:#bfd3dd}
body.np137-modern input::placeholder,
body.np137-modern textarea::placeholder{color:#718692;opacity:1}
body.np137-modern .np135-filter-panel{border-color:#bdd5df;background:#fff}
body.np137-modern .np135-filter-panel>summary{color:#274c5f}
body.np137-modern .table-wrap{border-color:var(--np174-line);background:#fff}
body.np137-modern th{color:#425f6f;background:#f2f7f9}
body.np137-modern td{color:#294b5d}
body.np137-modern .np-mobile-card-table td:before{color:#526b79!important;font-weight:850}
body.np137-modern .np-mobile-card-table tr{border-color:#cbdde5!important;background:#fff!important;box-shadow:var(--np174-shadow)!important}
body.np137-modern .np-alert-chip.ok{color:#075f3b!important;border-color:#9ed7b8!important;background:#e8f8ef!important}
body.np137-modern .np-alert-chip.warn,
body.np137-modern .np-alert-chip.bad{color:#8f2500!important;border-color:#e8bd8a!important;background:#fff3e3!important}
body.np137-modern .np-sale-creator-cell{color:#254f9c!important;background:#eef3ff!important}

/* ===== Management dashboard dark hero stays dark, text becomes clearly white ===== */
body.np137-modern .health-hero,
body.np137-modern .health-hero strong,
body.np137-modern .health-hero b,
body.np137-modern .health-hero span{color:#fff}
body.np137-modern .health-hero p{color:#e7f6fa}
body.np137-modern .workflow-strip button{color:var(--np174-text);border-color:var(--np174-line);background:#fff}
body.np137-modern .workflow-strip button b{color:var(--np174-ink)}
body.np137-modern .workflow-strip button small{color:var(--np174-muted)}

/* ===== Mobile bottom navigation ===== */
@media(max-width:900px){
  body.np137-modern .app>main>header{background:rgba(255,255,255,.97);border-bottom-color:#c8dbe4}
  body.np137-modern .header-user b{color:#102f43}
  body.np137-modern .header-user small{color:#516b7a}
  body.np137-modern .online-status{color:#075f3b;border-color:#a7d8bd;background:#eaf8f0}

  body.np137-modern .mobile-bottom-nav{
    border-color:#bfd3dc;
    background:rgba(255,255,255,.98);
    box-shadow:0 12px 30px rgba(8,50,71,.20);
  }
  body.np137-modern .mobile-bottom-nav button{
    color:#526a78!important;
    font-weight:800!important;
  }
  body.np137-modern .mobile-bottom-nav button.active:not(.mnav-sale){
    color:var(--np174-primary-dark)!important;
    background:#e5f5fa!important;
    box-shadow:inset 0 0 0 1px #c5e3ed;
  }
  body.np137-modern .mobile-bottom-nav .mnav-sale,
  body.np137-modern .mobile-bottom-nav .mnav-sale.active{
    color:#fff!important;
    background:linear-gradient(145deg,#007dab,var(--np174-primary-dark))!important;
    border-color:#f5fafc!important;
    box-shadow:0 11px 25px rgba(0,94,133,.36)!important;
  }
  body.np137-modern .mobile-bottom-nav .mnav-sale *,
  body.np137-modern .mobile-bottom-nav .mnav-sale.active *{color:#fff!important;opacity:1!important}

  body.np137-modern .np33-kpi{min-height:124px;padding-top:16px}
  body.np137-modern .np33-kpi>span:first-child{font-size:10px}
  body.np137-modern .np33-kpi>strong{font-size:21px}
  body.np137-modern .np33-kpi>small{font-size:9.5px;line-height:1.35}
  body.np137-modern .np33-delta{font-size:9px;white-space:normal}
}

@media(max-width:460px){
  body.np137-modern .np33-today-kpis{gap:9px}
  body.np137-modern .np33-kpi{min-height:132px;padding:15px 11px 12px}
  body.np137-modern .np33-kpi>strong{font-size:20px}
  body.np137-modern .np33-handover-card{padding:13px}
  body.np137-modern .np33-handover-total{padding:12px}
}

@media(prefers-contrast:more){
  body.np137-modern .card,
  body.np137-modern .np33-kpi,
  body.np137-modern .np-mobile-card-table tr{border-width:2px!important}
}