/* =====================================================================
 * NagaFinance — Noir & Gold Overlay
 * Palette: #0d0d0d / #1a1a1a / gold #c9a84c / soft gold #f0d78c
 * Fonts:   Space Grotesk (display) + DM Sans (body)
 * Overrides tokens from index.html without touching structure.
 * ===================================================================== */

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

:root, .dark {
  /* Palette */
  --primary:#c9a84c;
  --primary-dark:#a88736;
  --primary-light:rgba(201,168,76,.14);
  --success:#5cc99a;
  --danger:#e5687a;
  --warning:#f0d78c;
  --info:#d9b45c;

  /* Noir surfaces */
  --bg:#0d0d0d;
  --bg2:#161616;
  --bg3:#1a1a1a;
  --bg4:#242424;

  /* Ink */
  --text:#f5efe0;
  --text2:#cfc6b0;
  --text3:#8b8471;

  --border:rgba(201,168,76,.18);
  --border2:rgba(201,168,76,.32);

  --radius:10px;
  --radius-lg:14px;

  --shadow:0 1px 2px rgba(0,0,0,.4),0 1px 3px rgba(0,0,0,.35);
  --shadow-md:0 8px 20px -6px rgba(0,0,0,.55),0 2px 6px -2px rgba(0,0,0,.4);
  --shadow-lg:0 24px 60px -20px rgba(0,0,0,.75),0 8px 20px -8px rgba(0,0,0,.5);

  --font-body:'DM Sans','Segoe UI',system-ui,sans-serif;
  --font-display:'Space Grotesk','DM Sans',system-ui,sans-serif;
}

html, body {
  background: var(--bg);
  color: var(--text);
  font-family: var(--font-body);
  font-feature-settings: "ss01","cv11";
  -webkit-font-smoothing: antialiased;
}

/* ================= SIDEBAR ================= */
.sidebar{
  background:linear-gradient(180deg,#0a0a0a 0%,#111 55%,#0a0a0a 100%);
  border-right:1px solid rgba(201,168,76,.12);
  width:240px;
}
.app{ grid-template-columns:240px 1fr; background:var(--bg); }

.logo-area{ padding:20px 18px; border-bottom:1px solid rgba(201,168,76,.10); }
.logo-box{
  background:linear-gradient(135deg,#c9a84c,#f0d78c);
  box-shadow:0 6px 18px -4px rgba(201,168,76,.55);
  color:#111;
}
.logo-name{ font-family:var(--font-display); font-weight:700; letter-spacing:-.01em; color:#f5efe0; }
.logo-sub{
  font-size:10px; letter-spacing:.22em; text-transform:uppercase;
  color:rgba(240,215,140,.55);
}
.logo-sub::after{ content:" · v2.0"; color:#f0d78c; font-weight:700; }

.nav-group{
  padding:14px 18px 6px; font-size:10px; letter-spacing:.22em;
  color:rgba(240,215,140,.42); font-weight:600; text-transform:uppercase;
}
.nav-item{
  padding:9px 18px; font-size:12.5px;
  color:rgba(245,239,224,.62);
  border-left:3px solid transparent;
  border-radius:0 22px 22px 0; margin-right:10px;
  transition:all .18s ease;
}
.nav-item:hover{
  background:linear-gradient(90deg,rgba(201,168,76,.10),transparent 80%);
  color:#f5efe0;
}
.nav-item.active{
  background:linear-gradient(90deg,rgba(201,168,76,.18),rgba(201,168,76,.02));
  border-left-color:#c9a84c;
  color:#f5efe0;
  box-shadow:inset 0 0 0 1px rgba(201,168,76,.16);
}
.nav-item.active i{ color:#f0d78c; }
.nav-item i{ font-size:16px; color:rgba(240,215,140,.65); }

.sidebar-footer{ border-top:1px solid rgba(201,168,76,.10); }
.company-name{ color:#f5efe0; }
.company-info{ color:rgba(240,215,140,.55); }

/* Company switcher */
.v2-cswitch{
  margin:10px 12px 4px; padding:10px 12px;
  background:rgba(255,255,255,.03);
  border:1px solid rgba(201,168,76,.14);
  border-radius:12px; cursor:pointer;
  display:flex; align-items:center; gap:10px;
  transition:all .18s ease;
}
.v2-cswitch:hover{ background:rgba(201,168,76,.10); border-color:rgba(201,168,76,.38); }
.v2-cswitch-avatar{
  background:linear-gradient(135deg,#c9a84c,#f0d78c) !important;
  color:#111 !important;
}
.v2-cswitch-name{ color:#f5efe0; }
.v2-cswitch-sub{ color:rgba(240,215,140,.55); }
.v2-cswitch i.ti-selector{ color:rgba(240,215,140,.6); }

/* Dropdown */
.v2-cmenu{
  background:var(--bg2); color:var(--text);
  border:1px solid var(--border); border-radius:14px;
  box-shadow:var(--shadow-lg);
}
.v2-cmenu-item:hover{ background:var(--bg3); }
.v2-cmenu-item.active{ background:var(--primary-light); color:#f0d78c; font-weight:600; }
.v2-cmenu-sep{ background:var(--border); }
.v2-cmenu-action{ color:#f0d78c; }
.v2-cmenu-action:hover{ background:var(--primary-light); }

/* ================= TOPBAR ================= */
.topbar{
  background:var(--bg2); border-bottom:1px solid var(--border);
  padding:14px 24px; box-shadow:0 1px 0 rgba(0,0,0,.4);
}
.topbar-title{
  font-family:var(--font-display); font-weight:700; font-size:17px;
  letter-spacing:-.01em; color:#f5efe0;
}
.period-select{ background:var(--bg3); border:1px solid var(--border); color:var(--text); }
.topbar-btn{
  border:1px solid var(--border); background:var(--bg2); color:var(--text2);
  border-radius:10px; padding:8px 14px; font-size:12.5px; font-weight:500;
  transition:all .15s ease;
}
.topbar-btn:hover{ border-color:var(--primary); color:#f0d78c; background:var(--primary-light); }
.topbar-btn.primary{
  background:linear-gradient(135deg,#c9a84c,#a88736);
  border-color:#c9a84c; color:#111;
  box-shadow:0 6px 16px -4px rgba(201,168,76,.5);
}
.topbar-btn.primary:hover{ filter:brightness(1.05); color:#111; }

/* Trial badge */
.trial-pill{
  font-family:var(--font-body); font-weight:600; font-size:11px;
  border-radius:999px; padding:5px 11px; letter-spacing:.02em; border:1px solid transparent;
}
.trial-pill.info{ background:var(--primary-light); color:#f0d78c; border-color:rgba(201,168,76,.35); }
.trial-pill.warning{ background:rgba(240,215,140,.14); color:#f0d78c; border-color:rgba(240,215,140,.4); }
.trial-pill.danger{ background:rgba(229,104,122,.14); color:#e5687a; border-color:rgba(229,104,122,.4); }

/* ================= CARDS / KPI ================= */
.card,.kpi-card,.stat-card,.panel{
  background:var(--bg2); border:1px solid var(--border);
  border-radius:var(--radius-lg); box-shadow:var(--shadow);
}
.kpi-card,.stat-card{ padding:18px 20px; transition:all .2s ease; }
.kpi-card:hover,.stat-card:hover{
  box-shadow:var(--shadow-md);
  border-color:rgba(201,168,76,.35);
  transform:translateY(-1px);
}
.stat-icon{
  background:linear-gradient(135deg,rgba(201,168,76,.18),rgba(240,215,140,.06));
  color:#f0d78c;
  border:1px solid rgba(201,168,76,.22);
}
.stat-label{ color:var(--text3); }
.stat-sub{ color:var(--text3); }
.kpi-value,.stat-value{
  font-family:var(--font-display); font-weight:700; letter-spacing:-.02em;
  color:#f5efe0;
}

.panel-title{ color:#f5efe0; font-family:var(--font-display); font-weight:600; }

/* Section titles */
h1,h2,h3,h4,h5,h6,.page-title,.section-title{
  font-family:var(--font-display); font-weight:700; letter-spacing:-.015em; color:#f5efe0;
}
h1{ font-size:26px; }
h2{ font-size:20px; }

/* ================= BUTTONS ================= */
.btn{ border-radius:10px; font-weight:600; font-size:12.5px; transition:all .15s ease; }
.btn-primary{
  background:linear-gradient(135deg,#c9a84c,#a88736); color:#111;
  box-shadow:0 6px 16px -4px rgba(201,168,76,.5);
}
.btn-primary:hover{ filter:brightness(1.08); color:#111; }
.btn-success{ background:#3d8f6a; color:#f5efe0; }
.btn-danger{ background:#b04a5a; color:#f5efe0; }
.btn-warning{ background:#c9a84c; color:#111; }
.btn-outline{ border:1px solid var(--border2); background:transparent; color:var(--text); }
.btn-outline:hover{ border-color:#c9a84c; color:#f0d78c; background:var(--primary-light); }

/* ================= INPUTS ================= */
.form-input,.form-select,.form-textarea,
input[type=text],input[type=number],input[type=date],input[type=email],input[type=password],select,textarea{
  border:1px solid var(--border); background:var(--bg3); color:var(--text);
  border-radius:10px; padding:9px 12px; font-family:var(--font-body); font-size:13px;
  transition:all .15s ease;
}
.form-input:focus,.form-select:focus,input:focus,select:focus,textarea:focus{
  outline:none; border-color:#c9a84c;
  box-shadow:0 0 0 3px rgba(201,168,76,.18);
}
select.form-select option{ background:var(--bg2); color:var(--text); }
.form-label{ color:var(--text2); }
.form-label .req{ color:#e5687a; }
.form-note{ color:var(--text3); }

/* ================= TABLES ================= */
.table-wrap{ border:1px solid var(--border); border-radius:var(--radius); }
table{ border-collapse:separate; border-spacing:0; }
table th{
  background:var(--bg3);
  font-family:var(--font-body); font-weight:600; font-size:11.5px;
  text-transform:uppercase; letter-spacing:.08em; color:var(--text2);
  border-bottom:1px solid var(--border);
}
table td{ border-bottom:1px solid var(--border); color:var(--text); }
table tbody tr:hover td{ background:rgba(201,168,76,.05); }

/* ================= TABS ================= */
.tabs{ background:var(--bg3); border:1px solid var(--border); }
.tab{ color:var(--text2); }
.tab.active{ background:var(--bg2); color:#f0d78c; box-shadow:var(--shadow); }

/* ================= BADGES ================= */
.badge-success{ background:rgba(92,201,154,.16); color:#5cc99a; }
.badge-danger{ background:rgba(229,104,122,.16); color:#e5687a; }
.badge-warning{ background:rgba(240,215,140,.16); color:#f0d78c; }
.badge-info{ background:rgba(201,168,76,.16); color:#f0d78c; }
.badge-gray{ background:rgba(255,255,255,.06); color:var(--text2); }

/* ================= MODAL ================= */
.modal-overlay{ background:rgba(0,0,0,.72); backdrop-filter:blur(4px); }
.modal,.modal-content,.modal-card{
  background:var(--bg2); color:var(--text);
  border-radius:16px; box-shadow:var(--shadow-lg);
  border:1px solid var(--border);
}
.modal-title{ color:#f5efe0; border-bottom:1px solid var(--border); }
.modal-close{ color:var(--text3); }
.modal-footer{ border-top:1px solid var(--border); }

/* ================= UTILITIES ================= */
.text-success{ color:#5cc99a; }
.text-danger{ color:#e5687a; }
.text-warning{ color:#f0d78c; }
.text-primary{ color:#f0d78c; }
.text-muted{ color:var(--text3); }
.chip{ background:var(--bg3); border:1px solid var(--border); color:var(--text2); }
.amount-debit{ color:#5cc99a; font-weight:600; }
.amount-kredit{ color:#e5687a; font-weight:600; }
.separator{ border-top:1px solid var(--border); }
.empty-state{ color:var(--text3); }

/* ================= AUTH SCREEN ================= */
#authScreen{
  background:
    radial-gradient(1200px 800px at 15% -10%,rgba(201,168,76,.22),transparent 60%),
    radial-gradient(900px 600px at 100% 100%,rgba(240,215,140,.14),transparent 60%),
    linear-gradient(135deg,#0a0a0a,#141414) !important;
}
.auth-card,.login-card{
  background:var(--bg2) !important;
  color:var(--text) !important;
  border-radius:20px !important;
  box-shadow:0 40px 80px -30px rgba(0,0,0,.8) !important;
  border:1px solid rgba(201,168,76,.22) !important;
}

/* ================= CONSOLIDATION MODULE ================= */
.v2-conso-header{
  background:linear-gradient(135deg,#c9a84c,#a88736);
  color:#111; padding:20px 22px; border-radius:var(--radius-lg);
  margin-bottom:18px; display:flex; align-items:center; gap:14px;
  box-shadow:0 14px 30px -10px rgba(201,168,76,.5);
}
.v2-conso-header i{ font-size:32px; opacity:.9; }
.v2-conso-header h2{ color:#111; margin:0; font-size:18px; }
.v2-conso-header p{ color:rgba(0,0,0,.75); font-size:12px; margin:2px 0 0; }

.v2-conso-controls{
  background:var(--bg2); border:1px solid var(--border);
  border-radius:var(--radius-lg); padding:16px; margin-bottom:18px;
}
.v2-conso-chip{
  display:inline-flex; align-items:center; gap:8px; padding:8px 12px;
  background:var(--bg3); border:1px solid var(--border); border-radius:999px;
  margin:4px 6px 4px 0; cursor:pointer; font-size:12.5px; font-weight:500;
  color:var(--text2); transition:all .15s ease;
}
.v2-conso-chip.on{
  background:linear-gradient(135deg,#c9a84c,#a88736); color:#111; border-color:#c9a84c;
}
.v2-conso-chip input{ accent-color:#c9a84c; }

/* Company cards */
.v2-comp-list{ display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); gap:14px; }
.v2-comp-card{
  background:var(--bg2); border:1px solid var(--border); border-radius:var(--radius-lg);
  padding:16px; box-shadow:var(--shadow); position:relative; transition:all .2s ease;
}
.v2-comp-card:hover{ box-shadow:var(--shadow-md); transform:translateY(-2px); border-color:rgba(201,168,76,.4); }
.v2-comp-card.active{ border-color:#c9a84c; box-shadow:0 0 0 3px rgba(201,168,76,.18); }
.v2-comp-card-avatar{
  background:linear-gradient(135deg,#c9a84c,#f0d78c) !important;
  color:#111 !important;
  width:44px; height:44px; border-radius:12px;
  display:flex; align-items:center; justify-content:center;
  font-family:var(--font-display); font-weight:700; font-size:18px; margin-bottom:10px;
}
.v2-comp-card-name{ font-family:var(--font-display); font-weight:700; font-size:15px; color:#f5efe0; margin-bottom:2px; }
.v2-comp-card-sub{ font-size:11.5px; color:var(--text3); margin-bottom:12px; }
.v2-badge{
  font-size:10px; font-weight:700; letter-spacing:.05em; padding:3px 8px;
  border-radius:999px; background:var(--primary-light); color:#f0d78c; text-transform:uppercase;
}
.v2-comp-card.active .v2-badge-active{ background:#3d8f6a; color:#f5efe0; }

/* Scrollbars */
.sidebar-scroll::-webkit-scrollbar,.main-scroll::-webkit-scrollbar{ width:8px; height:8px; }
.sidebar-scroll::-webkit-scrollbar-thumb,.main-scroll::-webkit-scrollbar-thumb{
  background:rgba(201,168,76,.25); border-radius:8px;
}
.sidebar-scroll::-webkit-scrollbar-track,.main-scroll::-webkit-scrollbar-track{ background:transparent; }

/* Motion */
.page{ animation:v2-fade .2s ease; }
@keyframes v2-fade{ from{opacity:0; transform:translateY(4px)} to{opacity:1; transform:none} }

/* Print */
@media print{
  .sidebar,.topbar,.v2-cswitch,.v2-cmenu{ display:none !important; }
  .main-scroll{ padding:0 !important; }
  body{ background:#fff; color:#111; }
}

/* ================= HIGHER-SPECIFICITY OVERRIDES ================= */
/* Auth screen (inline classes in index.html use hardcoded blues) */
.auth-screen{
  background:
    radial-gradient(1200px 800px at 15% -10%,rgba(201,168,76,.22),transparent 60%),
    radial-gradient(900px 600px at 100% 100%,rgba(240,215,140,.14),transparent 60%),
    linear-gradient(135deg,#0a0a0a,#141414) !important;
}
.auth-card{
  background:var(--bg2) !important;
  color:var(--text) !important;
  border:1px solid rgba(201,168,76,.22) !important;
  box-shadow:0 40px 80px -30px rgba(0,0,0,.85) !important;
  border-radius:20px !important;
}
.auth-title{
  font-family:var(--font-display) !important;
  background:linear-gradient(135deg,#c9a84c,#f0d78c);
  -webkit-background-clip:text; background-clip:text; color:transparent !important;
  font-weight:700 !important;
}
.auth-sub,.auth-hint,.auth-note{ color:var(--text3) !important; }
.auth-logo-icon{
  background:linear-gradient(135deg,#c9a84c,#f0d78c) !important;
  color:#111 !important;
  box-shadow:0 10px 24px -6px rgba(201,168,76,.5) !important;
}
.auth-tabs{ background:var(--bg3) !important; border:1px solid var(--border) !important; }
.auth-tab{ color:var(--text2) !important; background:transparent !important; }
.auth-tab.active{
  background:var(--bg2) !important;
  color:#f0d78c !important;
  box-shadow:inset 0 0 0 1px rgba(201,168,76,.28) !important;
}
.auth-input,.auth-form input,.auth-form select{
  background:var(--bg3) !important;
  color:var(--text) !important;
  border:1px solid var(--border) !important;
  border-radius:10px !important;
}
.auth-input::placeholder{ color:var(--text3) !important; }
.auth-input:focus{
  border-color:#c9a84c !important;
  box-shadow:0 0 0 3px rgba(201,168,76,.18) !important;
  background:var(--bg3) !important;
}
.auth-btn{
  background:linear-gradient(135deg,#c9a84c,#a88736) !important;
  color:#111 !important;
  box-shadow:0 8px 22px -6px rgba(201,168,76,.55) !important;
  border-radius:10px !important;
  font-family:var(--font-display) !important;
  letter-spacing:.02em !important;
}
.auth-btn:hover{ filter:brightness(1.08); }
.auth-label,label{ color:var(--text2) !important; }

/* Trial pill on auth screen uses .info class already styled above, but reinforce */
.trial-pill.info{ background:rgba(201,168,76,.14) !important; color:#f0d78c !important; border-color:rgba(201,168,76,.35) !important; }

/* Sidebar logo: original inline has hardcoded blue gradient */
.logo-box{
  background:linear-gradient(135deg,#c9a84c,#f0d78c) !important;
  color:#111 !important;
  box-shadow:0 6px 18px -4px rgba(201,168,76,.55) !important;
}

/* Invoice print accents */
.invoice-header{ border-bottom-color:#c9a84c !important; }
.invoice-company{ color:#c9a84c !important; }
.invoice-table th{ background:#c9a84c !important; color:#111 !important; }

/* Any leftover hard blue button in bespoke modals */
[style*="#1a56db"]{ background:linear-gradient(135deg,#c9a84c,#a88736) !important; color:#111 !important; }

/* ===== Premium menu icon chips (Noir & Gold) ===== */
.sidebar .nav-item{
  gap: 10px !important;
  padding: 8px 14px !important;
  border-radius: 8px;
  margin: 2px 8px;
  border-left: 3px solid transparent !important;
  transition: background .18s ease, color .18s ease, transform .18s ease;
}
.sidebar .nav-item i{
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: 26px !important;
  height: 26px;
  font-size: 15px !important;
  border-radius: 7px;
  background: linear-gradient(135deg, rgba(201,168,76,.18), rgba(201,168,76,.05));
  color: #e6c976 !important;
  border: 1px solid rgba(201,168,76,.22);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04);
  transition: all .2s ease;
}
.sidebar .nav-item:hover{
  background: rgba(201,168,76,.07) !important;
  transform: translateX(2px);
}
.sidebar .nav-item:hover i{
  background: linear-gradient(135deg, rgba(201,168,76,.35), rgba(201,168,76,.12));
  color: #ffe9a8 !important;
  border-color: rgba(201,168,76,.45);
  box-shadow: 0 4px 12px -4px rgba(201,168,76,.55);
}
.sidebar .nav-item.active{
  background: linear-gradient(90deg, rgba(201,168,76,.16), rgba(201,168,76,0)) !important;
  border-left-color: #c9a84c !important;
  color: #fff !important;
}
.sidebar .nav-item.active i{
  background: linear-gradient(135deg, #c9a84c, #f0d78c) !important;
  color: #111 !important;
  border-color: transparent;
  box-shadow: 0 6px 16px -4px rgba(201,168,76,.6);
}
.nav-group{
  color: rgba(201,168,76,.7) !important;
  letter-spacing: .12em;
  font-size: 10px !important;
  text-transform: uppercase;
  padding: 14px 16px 6px !important;
}