/* ═══════════════════════════════════════════════════════════════════
   Financial Summary Dashboard — frontend styles (scoped to .fsd-wrap)
   ═══════════════════════════════════════════════════════════════════ */

.fsd-wrap, .fsd-wrap *, .fsd-wrap *::before, .fsd-wrap *::after { box-sizing: border-box; margin: 0; padding: 0; }

.fsd-wrap {
  /* Base */
  --bg:          #F8F6F1;
  --surface:     #FFFFFF;
  --border:      rgba(0,0,0,0.09);
  --border-med:  rgba(0,0,0,0.16);
  --text:        #18180E;
  --text2:       #5C5C4E;
  --text3:       #9A9A8E;
  --radius:      10px;
  --radius-lg:   14px;

  /* Section accent palettes */
  --sales-bg:    #EAF3FF; --sales-acc: #1A56A8; --sales-mid: #3B7DE8;
  --cogs-bg:     #FFF4E6; --cogs-acc:  #A84B00; --cogs-mid:  #E07030;
  --opex-bg:     #F4EDFF; --opex-acc:  #6B22B8; --opex-mid:  #9B5DE5;
  --profit-bg:   #E6FAF1; --profit-acc:#107040; --profit-mid:#1DBE72;
  --cash-bg:     #FFF9E6; --cash-acc:  #8C6200; --cash-mid:  #E8A800;
  --bs-bg:       #EDF6FF; --bs-acc:    #195FA0; --bs-mid:    #4894E0;
  --neg-bg:      #FFF0EE; --neg-acc:   #C0321A; --neg-mid:   #E85535;

  /* Input highlight */
  --input-ring:  #3B7DE8;
  --input-bg:    #FFFEF8;
  --input-hl:    #FFF7D4;

  font-family: 'DM Sans', sans-serif;
  background: var(--bg);
  color: var(--text);
  min-height: 100vh;
  font-size: 14px;
  line-height: 1.5;
}

.fsd-wrap .serif { font-family: 'DM Serif Display', Georgia, serif; }
.fsd-wrap .mono  { font-family: 'DM Mono', monospace; }
.fsd-wrap .full-w { width: 100%; }

.fsd-wrap input[type=number]::-webkit-outer-spin-button,
.fsd-wrap input[type=number]::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.fsd-wrap input[type=number] { -moz-appearance: textfield; appearance: textfield; }

/* ══ HEADER ══ */
.fsd-wrap .site-header {
  background: #101820;
  color: #fff;
  padding: 0 32px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  height: 60px;
  box-shadow: 0 2px 12px rgba(0,0,0,0.3);
}
.fsd-wrap .header-brand { display: flex; align-items: center; gap: 12px; }
.fsd-wrap .header-brand .icon {
  width: 34px; height: 34px;
  background: linear-gradient(135deg, #3B7DE8, #1DBE72);
  border-radius: 8px;
  display: flex; align-items: center; justify-content: center;
  font-size: 17px;
}
.fsd-wrap .header-brand h1 {
  font-family: 'DM Serif Display', serif;
  font-size: 18px;
  font-weight: 400;
  letter-spacing: -0.2px;
  color: #fff;
  margin: 0;
}
.fsd-wrap .header-brand p { font-size: 11px; color: rgba(255,255,255,0.5); margin-top: 1px; }
.fsd-wrap .header-right { display: flex; align-items: center; gap: 10px; }

/* User bar */
.fsd-wrap #user-bar {
  background: #1A2530;
  color: #fff;
  padding: 7px 32px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  font-size: 12px;
  border-bottom: 1px solid rgba(255,255,255,0.06);
  flex-wrap: wrap;
}
.fsd-wrap #user-bar .ub-name { color: rgba(255,255,255,0.85); }
.fsd-wrap .ub-actions { display: flex; gap: 8px; align-items: center; }
.fsd-wrap #save-status { font-size: 11px; color: rgba(255,255,255,0.6); }

/* ── BUSINESS SELECTOR BAR ── */
.fsd-wrap .biz-bar {
  background: var(--surface);
  border-bottom: 2px solid var(--border);
  padding: 0 32px;
  display: flex;
  align-items: stretch;
  gap: 0;
  min-height: 50px;
  overflow-x: auto;
}
.fsd-wrap .biz-tab-wrap { display: flex; align-items: stretch; gap: 0; flex: 1; }
.fsd-wrap .biz-tab {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 0 20px;
  cursor: pointer;
  border-bottom: 3px solid transparent;
  transition: all 0.15s;
  white-space: nowrap;
  position: relative;
}
.fsd-wrap .biz-tab:hover { background: var(--bg); }
.fsd-wrap .biz-tab.active { border-bottom-color: var(--sales-acc); background: var(--sales-bg); }
.fsd-wrap .biz-tab-name {
  font-size: 13px;
  font-weight: 500;
  color: var(--text2);
  cursor: text;
  min-width: 80px;
  max-width: 160px;
  padding: 2px 4px;
  border-radius: 4px;
  border: 1px solid transparent;
  background: transparent;
  outline: none;
  transition: all 0.15s;
  box-shadow: none;
}
.fsd-wrap .biz-tab.active .biz-tab-name { color: var(--sales-acc); }
.fsd-wrap .biz-tab-name:hover { border-color: var(--border-med); background: var(--surface); }
.fsd-wrap .biz-tab-name:focus { border-color: var(--input-ring); background: var(--surface); box-shadow: 0 0 0 3px rgba(59,125,232,0.15); }
.fsd-wrap .biz-tab-num {
  width: 20px; height: 20px;
  background: var(--border);
  border-radius: 50%;
  font-size: 10px;
  font-weight: 700;
  display: flex; align-items: center; justify-content: center;
  color: var(--text3);
}
.fsd-wrap .biz-tab.active .biz-tab-num { background: var(--sales-acc); color: #fff; }
.fsd-wrap .add-biz-btn {
  padding: 0 16px;
  font-size: 12px;
  color: var(--text3);
  cursor: pointer;
  border: none;
  background: none;
  display: flex;
  align-items: center;
  gap: 5px;
  transition: color 0.15s;
  white-space: nowrap;
  box-shadow: none;
}
.fsd-wrap .add-biz-btn:hover { color: var(--sales-acc); background: none; }

/* ── FY BAR ── */
.fsd-wrap .fy-bar {
  background: var(--surface);
  border-bottom: 1px solid var(--border);
  padding: 10px 32px;
  display: flex;
  align-items: center;
  gap: 16px;
  flex-wrap: wrap;
}
.fsd-wrap .fy-label {
  font-size: 10px;
  font-weight: 700;
  color: var(--text3);
  text-transform: uppercase;
  letter-spacing: .1em;
}
.fsd-wrap .fy-tabs { display: flex; gap: 5px; flex-wrap: wrap; }
.fsd-wrap .fy-tab {
  padding: 5px 14px;
  font-size: 12px;
  font-weight: 500;
  border: 1px solid var(--border-med);
  border-radius: 20px;
  cursor: pointer;
  background: var(--bg);
  color: var(--text2);
  transition: all 0.15s;
  font-family: 'DM Sans', sans-serif;
  box-shadow: none;
}
.fsd-wrap .fy-tab.active { background: #101820; color: #fff; border-color: #101820; }
.fsd-wrap .fy-tab:hover:not(.active) { border-color: var(--sales-acc); color: var(--sales-acc); background: var(--bg); }

/* ══ VIEWS ══ */
.fsd-wrap #view-overview { display: block; }
.fsd-wrap #view-entry    { display: none; }

/* ══ OVERVIEW PAGE ══ */
.fsd-wrap .overview-wrap {
  display: grid;
  grid-template-columns: 1fr;
  max-width: 1200px;
  margin: 0 auto;
  padding: 28px 24px 80px;
  gap: 20px;
}

.fsd-wrap .fy-kpi-strip { display: grid; grid-template-columns: repeat(4,1fr); gap: 12px; }
@media(max-width:768px){ .fsd-wrap .fy-kpi-strip { grid-template-columns: repeat(2,1fr); } }

.fsd-wrap .fy-kpi-card {
  border-radius: var(--radius-lg);
  padding: 18px 20px;
  border: 1px solid transparent;
  position: relative;
  overflow: hidden;
}
.fsd-wrap .fy-kpi-card::before {
  content: '';
  position: absolute;
  right: -10px; top: -10px;
  width: 70px; height: 70px;
  border-radius: 50%;
  opacity: 0.08;
}
.fsd-wrap .fy-kpi-card.sales  { background: var(--sales-bg);  border-color: rgba(26,86,168,0.15); }
.fsd-wrap .fy-kpi-card.sales::before  { background: var(--sales-acc); }
.fsd-wrap .fy-kpi-card.gp     { background: var(--profit-bg); border-color: rgba(16,112,64,0.15); }
.fsd-wrap .fy-kpi-card.gp::before     { background: var(--profit-acc); }
.fsd-wrap .fy-kpi-card.ebitda { background: var(--opex-bg);   border-color: rgba(107,34,184,0.15); }
.fsd-wrap .fy-kpi-card.ebitda::before { background: var(--opex-acc); }
.fsd-wrap .fy-kpi-card.pat    { background: var(--profit-bg); border-color: rgba(16,112,64,0.15); }
.fsd-wrap .fy-kpi-card.pat::before    { background: var(--profit-acc); }
.fsd-wrap .fy-kpi-card .kl { font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; margin-bottom: 8px; opacity: 0.7; }
.fsd-wrap .fy-kpi-card.sales  .kl { color: var(--sales-acc); }
.fsd-wrap .fy-kpi-card.gp     .kl { color: var(--profit-acc); }
.fsd-wrap .fy-kpi-card.ebitda .kl { color: var(--opex-acc); }
.fsd-wrap .fy-kpi-card.pat    .kl { color: var(--profit-acc); }
.fsd-wrap .fy-kpi-card .kv {
  font-family: 'DM Serif Display', serif;
  font-size: 26px;
  line-height: 1;
  margin-bottom: 4px;
}
.fsd-wrap .fy-kpi-card.sales  .kv { color: var(--sales-acc); }
.fsd-wrap .fy-kpi-card.gp     .kv { color: var(--profit-acc); }
.fsd-wrap .fy-kpi-card.ebitda .kv { color: var(--opex-acc); }
.fsd-wrap .fy-kpi-card.pat    .kv { color: var(--profit-acc); }
.fsd-wrap .fy-kpi-card .ks { font-size: 11px; opacity: 0.65; }

.fsd-wrap .ov-section-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 12px;
}
.fsd-wrap .ov-section-title { font-family: 'DM Serif Display', serif; font-size: 20px; color: var(--text); }
.fsd-wrap .ov-section-sub { font-size: 12px; color: var(--text3); margin-top: 2px; }
.fsd-wrap .ov-legend { display: flex; gap: 14px; flex-wrap: wrap; }
.fsd-wrap .ov-legend span { font-size: 11px; color: var(--text2); display: flex; align-items: center; gap: 5px; }
.fsd-wrap .ov-dot { width: 8px; height: 8px; border-radius: 50%; flex-shrink: 0; }

.fsd-wrap .ov-card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  overflow: hidden;
  box-shadow: 0 1px 4px rgba(0,0,0,0.05);
}

.fsd-wrap .ov-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.fsd-wrap .ov-table thead th {
  background: #F2F2EE;
  padding: 11px 16px;
  text-align: left;
  font-size: 10px;
  font-weight: 700;
  color: var(--text3);
  text-transform: uppercase;
  letter-spacing: .08em;
  border-bottom: 1px solid var(--border);
  white-space: nowrap;
}
.fsd-wrap .ov-table thead th:not(:first-child) { text-align: right; }
.fsd-wrap .ov-table tbody tr { border-bottom: 1px solid var(--border); cursor: pointer; transition: background 0.12s; }
.fsd-wrap .ov-table tbody tr:last-child { border-bottom: none; }
.fsd-wrap .ov-table tbody tr:hover { background: #F5F9FF; }
.fsd-wrap .ov-table tbody tr.current-month { background: #EDF4FF; }
.fsd-wrap .ov-table tbody tr.future-month { opacity: 0.45; }
.fsd-wrap .ov-table tbody td { padding: 12px 16px; vertical-align: middle; border: none; }
.fsd-wrap .ov-table tbody td:not(:first-child) { text-align: right; font-family: 'DM Mono', monospace; font-size: 12px; }

.fsd-wrap .month-cell { display: flex; align-items: center; gap: 10px; }
.fsd-wrap .month-dot  { width: 9px; height: 9px; border-radius: 50%; flex-shrink: 0; }
.fsd-wrap .month-name { font-weight: 600; font-size: 13px; color: var(--text); }
.fsd-wrap .month-badge {
  font-size: 9px;
  font-weight: 700;
  padding: 2px 7px;
  border-radius: 10px;
  letter-spacing: .04em;
  text-transform: uppercase;
}
.fsd-wrap .badge-current { background: #DBEAFE; color: #1E40AF; }
.fsd-wrap .badge-entry   { background: #D1FAE5; color: #065F46; }
.fsd-wrap .badge-future  { background: #F3F4F6; color: #9CA3AF; }
.fsd-wrap .badge-empty   { background: #FEF3C7; color: #92400E; }

.fsd-wrap .val-pos { color: var(--profit-acc); font-weight: 600; }
.fsd-wrap .val-neg { color: var(--neg-acc);    font-weight: 600; }
.fsd-wrap .val-neu { color: var(--sales-acc);  font-weight: 600; }
.fsd-wrap .val-emp { color: var(--text3); font-size: 12px; }

.fsd-wrap .enter-btn {
  font-size: 11px;
  font-weight: 600;
  padding: 5px 13px;
  border: 1.5px solid var(--sales-acc);
  border-radius: 6px;
  background: var(--sales-bg);
  color: var(--sales-acc);
  cursor: pointer;
  transition: all 0.15s;
  white-space: nowrap;
  font-family: 'DM Sans', sans-serif;
  box-shadow: none;
}
.fsd-wrap .enter-btn:hover { background: var(--sales-acc); color: #fff; }

.fsd-wrap .ov-charts { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
@media(max-width:640px){ .fsd-wrap .ov-charts { grid-template-columns: 1fr; } }
.fsd-wrap .ov-chart-card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 16px 18px;
  box-shadow: 0 1px 4px rgba(0,0,0,0.04);
}
.fsd-wrap .ov-chart-title {
  font-size: 11px;
  font-weight: 700;
  color: var(--text2);
  margin-bottom: 12px;
  text-transform: uppercase;
  letter-spacing: .07em;
}
.fsd-wrap .ov-chart-box { position: relative; height: 140px; }

/* ══ ENTRY BREADCRUMB ══ */
.fsd-wrap .entry-crumb {
  background: var(--surface);
  border-bottom: 1px solid var(--border);
  padding: 12px 32px;
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  color: var(--text2);
  flex-wrap: wrap;
}
.fsd-wrap .crumb-link { color: var(--sales-acc); cursor: pointer; font-weight: 600; text-decoration: none; }
.fsd-wrap .crumb-link:hover { text-decoration: underline; }
.fsd-wrap .crumb-sep  { color: var(--text3); }
.fsd-wrap .crumb-cur  { color: var(--text); font-weight: 600; }
.fsd-wrap .entry-month-badge {
  margin-left: auto;
  font-size: 11px;
  font-weight: 700;
  padding: 4px 12px;
  border-radius: 20px;
  background: #EBF4FF;
  color: var(--sales-acc);
  border: 1px solid rgba(26,86,168,0.2);
  text-transform: uppercase;
  letter-spacing: .05em;
}

/* ══ STEP BAR ══ */
.fsd-wrap .step-bar { display: flex; background: var(--surface); border-bottom: 2px solid var(--border); overflow-x: auto; }
.fsd-wrap .st {
  flex: 1;
  min-width: 130px;
  padding: 14px 12px;
  font-size: 12px;
  font-weight: 500;
  text-align: center;
  cursor: pointer;
  color: var(--text3);
  border-right: 1px solid var(--border);
  border-bottom: 3px solid transparent;
  margin-bottom: -2px;
  transition: all 0.15s;
  white-space: nowrap;
}
.fsd-wrap .st:last-child { border-right: none; }
.fsd-wrap .st small { display: block; font-size: 9px; font-weight: 700; text-transform: uppercase; letter-spacing: .07em; margin-bottom: 4px; opacity: 0.6; }
.fsd-wrap .st.active { background: #EDF4FF; color: var(--sales-acc); border-bottom-color: var(--sales-acc); }
.fsd-wrap .st.done   { color: var(--profit-acc); }
.fsd-wrap .st.done::before { content: '✓ '; }

/* ══ ENTRY MAIN ══ */
.fsd-wrap .entry-main { max-width: 900px; margin: 0 auto; padding: 24px 24px 80px; }
.fsd-wrap .pg { display: none; }
.fsd-wrap .pg.show { display: block; }

/* ══ CARDS ══ */
.fsd-wrap .card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  overflow: hidden;
  margin-bottom: 16px;
  box-shadow: 0 1px 4px rgba(0,0,0,0.04);
}
.fsd-wrap .card-header {
  padding: 16px 20px 12px;
  border-bottom: 1px solid var(--border);
  display: flex;
  align-items: flex-start;
  gap: 12px;
}
.fsd-wrap .card-icon {
  width: 36px; height: 36px;
  border-radius: 9px;
  display: flex; align-items: center; justify-content: center;
  font-size: 16px;
  flex-shrink: 0;
}
.fsd-wrap .card-header-text .card-title {
  font-family: 'DM Serif Display', serif;
  font-size: 16px;
  font-weight: 400;
  color: var(--text);
  margin-bottom: 2px;
}
.fsd-wrap .card-header-text .card-desc { font-size: 12px; color: var(--text2); line-height: 1.5; }
.fsd-wrap .card-body { padding: 16px 20px; }

.fsd-wrap .card.sec-sales .card-header { background: var(--sales-bg); border-bottom-color: rgba(26,86,168,0.12); }
.fsd-wrap .card.sec-sales .card-icon   { background: var(--sales-acc); color: #fff; }
.fsd-wrap .card.sec-cogs  .card-header { background: var(--cogs-bg);  border-bottom-color: rgba(168,75,0,0.12); }
.fsd-wrap .card.sec-cogs  .card-icon   { background: var(--cogs-acc);  color: #fff; }
.fsd-wrap .card.sec-opex  .card-header { background: var(--opex-bg);  border-bottom-color: rgba(107,34,184,0.12); }
.fsd-wrap .card.sec-opex  .card-icon   { background: var(--opex-acc);  color: #fff; }
.fsd-wrap .card.sec-profit .card-header{ background: var(--profit-bg); border-bottom-color: rgba(16,112,64,0.12); }
.fsd-wrap .card.sec-profit .card-icon  { background: var(--profit-acc); color: #fff; }
.fsd-wrap .card.sec-cash  .card-header { background: var(--cash-bg);  border-bottom-color: rgba(140,98,0,0.12); }
.fsd-wrap .card.sec-cash  .card-icon   { background: var(--cash-acc);  color: #fff; }
.fsd-wrap .card.sec-bs    .card-header { background: var(--bs-bg);    border-bottom-color: rgba(25,95,160,0.12); }
.fsd-wrap .card.sec-bs    .card-icon   { background: var(--bs-acc);    color: #fff; }

.fsd-wrap .hint {
  font-size: 12px;
  color: #1a4080;
  padding: 9px 13px;
  background: #EDF4FF;
  border-radius: 8px;
  border-left: 3px solid var(--sales-acc);
  margin-bottom: 14px;
  line-height: 1.5;
}

/* ═══ INPUT FIELDS ═══ */
.fsd-wrap .field {
  display: grid;
  grid-template-columns: 1fr 180px;
  gap: 12px;
  align-items: center;
  padding: 12px 0;
  border-top: 1px solid var(--border);
}
.fsd-wrap .field:first-of-type { border-top: none; padding-top: 0; }
.fsd-wrap .field label { font-size: 13px; color: var(--text); font-weight: 500; line-height: 1.4; }
.fsd-wrap .field label small {
  display: block;
  font-size: 11px;
  color: var(--text3);
  font-weight: 400;
  margin-top: 3px;
  line-height: 1.4;
}
.fsd-wrap .field .input-wrap { position: relative; }
.fsd-wrap .field .input-wrap::before {
  content: '₹';
  position: absolute;
  left: 11px; top: 50%;
  transform: translateY(-50%);
  font-size: 13px;
  color: var(--text3);
  font-family: 'DM Mono', monospace;
  pointer-events: none;
  z-index: 1;
}
.fsd-wrap .field input {
  width: 100%;
  font-size: 14px;
  font-family: 'DM Mono', monospace;
  padding: 10px 12px 10px 26px;
  border: 2px solid rgba(59,125,232,0.35);
  border-radius: 8px;
  background: var(--input-hl);
  color: var(--text);
  text-align: right;
  transition: all 0.18s;
  outline: none;
  height: auto;
  box-shadow: none;
}
.fsd-wrap .field input:hover { border-color: rgba(59,125,232,0.6); background: #FFFCEE; }
.fsd-wrap .field input:focus {
  border-color: var(--input-ring);
  background: #FFFFFF;
  box-shadow: 0 0 0 4px rgba(59,125,232,0.12);
}
.fsd-wrap .field input::placeholder { color: var(--text3); font-size: 13px; }
@media(max-width:640px){
  .fsd-wrap .field { grid-template-columns: 1fr; }
  .fsd-wrap .field input { text-align: left; }
}

/* ═══ CALC BOX ═══ */
.fsd-wrap .cbox {
  background: #F6F5F0;
  border-radius: 10px;
  padding: 14px 16px;
  margin-top: 12px;
  border: 1px solid var(--border);
}
.fsd-wrap .crow { display: flex; justify-content: space-between; align-items: center; padding: 6px 0; font-size: 13px; }
.fsd-wrap .crow+.crow { border-top: 1px solid var(--border); }
.fsd-wrap .crow .cl { color: var(--text2); }
.fsd-wrap .crow .cv { font-weight: 600; font-family: 'DM Mono', monospace; font-size: 13px; }

.fsd-wrap .resline {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  margin-top: 12px;
  padding-top: 12px;
  border-top: 2px solid var(--border-med);
}
.fsd-wrap .res-lbl { font-size: 10px; color: var(--text3); text-transform: uppercase; letter-spacing: .06em; font-weight: 700; margin-bottom: 4px; }
.fsd-wrap .res-val { font-family: 'DM Serif Display', serif; font-size: 24px; line-height: 1; }

.fsd-wrap .g { color: var(--profit-acc); }
.fsd-wrap .r { color: var(--neg-acc); }
.fsd-wrap .b { color: var(--sales-acc); }
.fsd-wrap .a { color: var(--cogs-acc); }
.fsd-wrap .p { color: var(--opex-acc); }

/* Tabs (cash flow source) */
.fsd-wrap .tabs { display: flex; gap: 5px; flex-wrap: wrap; margin-bottom: 12px; }
.fsd-wrap .tab {
  padding: 6px 13px;
  font-size: 11px;
  font-weight: 600;
  border: 1.5px solid var(--border-med);
  border-radius: 20px;
  cursor: pointer;
  background: var(--bg);
  color: var(--text2);
  transition: all 0.15s;
  text-transform: uppercase;
  letter-spacing: .04em;
}
.fsd-wrap .tab.in-on  { background: var(--profit-bg); color: var(--profit-acc); border-color: var(--profit-mid); }
.fsd-wrap .tab.out-on { background: var(--neg-bg);    color: var(--neg-acc);    border-color: var(--neg-mid); }
.fsd-wrap .sp { display: none; }
.fsd-wrap .sp.show { display: block; }

/* Meter */
.fsd-wrap .meter { height: 6px; border-radius: 4px; background: var(--bg); margin-top: 8px; overflow: hidden; }
.fsd-wrap .mfill { height: 100%; border-radius: 4px; transition: width 0.4s; }

/* Nav */
.fsd-wrap .navrow { display: flex; justify-content: space-between; margin-top: 16px; gap: 10px; flex-wrap: wrap; }
.fsd-wrap .btn {
  padding: 10px 22px;
  font-size: 13px;
  font-weight: 600;
  border: 1.5px solid var(--border-med);
  border-radius: 8px;
  background: var(--surface);
  color: var(--text);
  cursor: pointer;
  transition: all 0.15s;
  font-family: 'DM Sans', sans-serif;
  text-decoration: none;
  box-shadow: none;
  line-height: 1.4;
}
.fsd-wrap .btn:hover { background: var(--bg); border-color: var(--text2); color: var(--text); }
.fsd-wrap .btn.pri { background: var(--sales-acc); color: #fff; border-color: var(--sales-acc); }
.fsd-wrap .btn.pri:hover { background: #2463C0; color: #fff; }
.fsd-wrap .btn.save-btn { background: var(--profit-acc); color: #fff; border-color: var(--profit-acc); }
.fsd-wrap .btn-sm {
  padding: 6px 14px;
  font-size: 11px;
  font-weight: 600;
  border: 1px solid rgba(255,255,255,0.25);
  border-radius: 6px;
  background: rgba(255,255,255,0.12);
  color: #fff;
  cursor: pointer;
  transition: all 0.15s;
  font-family: 'DM Sans', sans-serif;
  text-decoration: none;
  display: inline-block;
  line-height: 1.4;
  box-shadow: none;
}
.fsd-wrap .btn-sm:hover { background: rgba(255,255,255,0.22); color: #fff; }
.fsd-wrap .btn-sm.btn-danger { background: rgba(232,85,53,0.22); border-color: rgba(232,85,53,0.5); }
.fsd-wrap .btn-sm.btn-danger:hover { background: rgba(232,85,53,0.42); }

/* ── PASSWORD SHOW/HIDE TOGGLE ── */
.fsd-wrap .fsd-pass-wrap { position: relative; }
.fsd-wrap .fsd-pass-wrap input { padding-right: 46px; }
.fsd-wrap .fsd-pass-toggle {
  position: absolute;
  right: 6px;
  top: 23px;
  transform: translateY(-50%);
  background: none;
  border: none;
  cursor: pointer;
  font-size: 17px;
  line-height: 1;
  padding: 4px 6px;
  color: var(--text3);
  box-shadow: none;
  border-radius: 6px;
}
.fsd-wrap .fsd-pass-toggle:hover { background: rgba(0,0,0,0.05); }

/* Section labels */
.fsd-wrap .sec-label {
  font-size: 10px;
  font-weight: 700;
  color: var(--text3);
  text-transform: uppercase;
  letter-spacing: .08em;
  margin: 18px 0 10px;
}

/* KPI bands */
.fsd-wrap .kpi-band { display: grid; grid-template-columns: repeat(4,1fr); gap: 10px; margin-bottom: 12px; }
.fsd-wrap .kpi-band.three { grid-template-columns: repeat(3,1fr); }
.fsd-wrap .kpi-band.five  { grid-template-columns: repeat(5,1fr); }
@media(max-width:640px){ .fsd-wrap .kpi-band, .fsd-wrap .kpi-band.five, .fsd-wrap .kpi-band.three { grid-template-columns: repeat(2,1fr); } }

.fsd-wrap .kpi { border-radius: 10px; padding: 13px 15px; border: 1px solid transparent; }
.fsd-wrap .kpi .kl { font-size: 9px; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; margin-bottom: 6px; opacity: 0.8; }
.fsd-wrap .kpi .kv { font-family: 'DM Serif Display', serif; font-size: 20px; line-height: 1; }
.fsd-wrap .kpi .ks { font-size: 10px; margin-top: 4px; opacity: 0.72; }

.fsd-wrap .kpi.sales  { background:var(--sales-bg);  color:var(--sales-acc);  border-color:rgba(26,86,168,0.12); }
.fsd-wrap .kpi.gp     { background:var(--profit-bg); color:var(--profit-acc); border-color:rgba(16,112,64,0.12); }
.fsd-wrap .kpi.ebitda { background:var(--opex-bg);   color:var(--opex-acc);   border-color:rgba(107,34,184,0.12); }
.fsd-wrap .kpi.pat    { background:var(--profit-bg); color:var(--profit-acc); border-color:rgba(16,112,64,0.12); }
.fsd-wrap .kpi.cogs   { background:var(--cogs-bg);   color:var(--cogs-acc);   border-color:rgba(168,75,0,0.12); }
.fsd-wrap .kpi.opex   { background:var(--opex-bg);   color:var(--opex-acc);   border-color:rgba(107,34,184,0.12); }
.fsd-wrap .kpi.inv    { background:var(--cogs-bg);   color:var(--cogs-acc);   border-color:rgba(168,75,0,0.12); }
.fsd-wrap .kpi.dep    { background:#F1EFE8; color:#5F5E5A; }
.fsd-wrap .kpi.int    { background:var(--neg-bg);    color:var(--neg-acc);    border-color:rgba(192,50,26,0.12); }
.fsd-wrap .kpi.tax    { background:#FBEAF0; color:#72243E; }
.fsd-wrap .kpi.ar     { background:var(--bs-bg);     color:var(--bs-acc);     border-color:rgba(25,95,160,0.12); }
.fsd-wrap .kpi.ap     { background:var(--neg-bg);    color:var(--neg-acc);    border-color:rgba(192,50,26,0.12); }
.fsd-wrap .kpi.wc     { background:var(--sales-bg);  color:var(--sales-acc);  border-color:rgba(26,86,168,0.12); }
.fsd-wrap .kpi.close  { background:var(--cash-bg);   color:var(--cash-acc);   border-color:rgba(140,98,0,0.12); }
.fsd-wrap .kpi.neg    { background:var(--neg-bg);    color:var(--neg-acc);    border-color:rgba(192,50,26,0.12); }

/* P&L Table */
.fsd-wrap .pl-table { width:100%; border-collapse:collapse; font-size:13px; }
.fsd-wrap .pl-table td { padding:9px 14px; border:none; border-top:1px solid var(--border); color:var(--text); }
.fsd-wrap .pl-table tr:first-child td { border-top:none; }
.fsd-wrap .pl-table td:last-child { text-align:right; font-weight:600; font-family:'DM Mono',monospace; }
.fsd-wrap .pl-table tr.subtotal td { background:var(--bg); font-weight:600; }
.fsd-wrap .pl-table tr.total     td { background:var(--sales-bg); color:var(--sales-acc); font-weight:700; font-size:14px; }
.fsd-wrap .pl-table tr.neg-total td { background:var(--neg-bg);   color:var(--neg-acc);   font-weight:700; font-size:14px; }
.fsd-wrap .pl-table tr.pct-row   td { font-size:11px; color:var(--text3); font-family:'DM Mono',monospace; }

/* ══ AUTH SCREEN ══ */
.fsd-wrap .fsd-auth-screen {
  min-height: 70vh;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 40px 16px;
  background: var(--bg);
}
.fsd-wrap .auth-box {
  background: var(--surface);
  border-radius: 16px;
  padding: 36px 32px;
  width: 100%;
  max-width: 420px;
  box-shadow: 0 24px 80px rgba(0,0,0,0.12);
  border: 1px solid var(--border);
}
.fsd-wrap .auth-logo { text-align: center; margin-bottom: 8px; }
.fsd-wrap .auth-logo-icon {
  width: 52px; height: 52px;
  background: linear-gradient(135deg, var(--sales-acc), var(--profit-acc));
  border-radius: 14px;
  display: inline-flex; align-items: center; justify-content: center;
  font-size: 24px;
  margin-bottom: 4px;
}
.fsd-wrap .auth-title { font-family: 'DM Serif Display', serif; font-size: 24px; text-align: center; color: var(--text); margin-bottom: 4px; }
.fsd-wrap .auth-sub { font-size: 13px; color: var(--text2); text-align: center; margin-bottom: 24px; }
.fsd-wrap .auth-tabs {
  display: flex;
  margin-bottom: 20px;
  border-radius: 8px;
  overflow: hidden;
  border: 1.5px solid var(--border-med);
  gap: 0;
}
.fsd-wrap .auth-tab {
  flex: 1; padding: 9px;
  font-size: 13px; font-weight: 600;
  border: none;
  background: var(--bg);
  color: var(--text2);
  cursor: pointer;
  transition: all 0.15s;
  font-family: 'DM Sans', sans-serif;
  border-radius: 0;
  box-shadow: none;
}
.fsd-wrap .auth-tab.auth-tab-active { background: var(--sales-acc); color: #fff; }
.fsd-wrap .auth-input {
  display: block; width: 100%;
  margin-bottom: 10px;
  padding: 11px 14px;
  border: 2px solid var(--border-med);
  border-radius: 8px;
  font-size: 14px;
  outline: none;
  font-family: 'DM Sans', sans-serif;
  transition: all 0.15s;
  background: var(--input-hl);
  color: var(--text);
  height: auto;
  box-shadow: none;
}
.fsd-wrap .auth-input:focus { border-color: var(--input-ring); background: #fff; box-shadow: 0 0 0 4px rgba(59,125,232,0.12); }
.fsd-wrap .auth-btn {
  display: block; width: 100%;
  padding: 12px;
  background: var(--sales-acc);
  color: #fff;
  border: none;
  border-radius: 8px;
  font-size: 14px;
  font-weight: 700;
  cursor: pointer;
  margin-top: 4px;
  font-family: 'DM Sans', sans-serif;
  transition: background 0.15s;
  box-shadow: none;
}
.fsd-wrap .auth-btn:hover { background: #2463C0; color: #fff; }
.fsd-wrap .auth-btn:disabled { opacity: 0.6; cursor: wait; }
.fsd-wrap .auth-or { font-size: 12px; color: var(--text3); text-align: center; margin-top: 12px; line-height: 1.7; }
.fsd-wrap .auth-or a { color: var(--sales-acc); text-decoration: none; font-weight: 600; }
.fsd-wrap #auth-status { min-height: 18px; font-size: 12px; text-align: center; margin-top: 10px; }

/* TOAST */
.fsd-wrap .fd-toast {
  position: fixed; bottom: 28px;
  left: 50%; transform: translateX(-50%) translateY(80px);
  background: #1a1a1a;
  color: #fff;
  padding: 11px 22px;
  border-radius: 30px;
  font-size: 13px;
  font-weight: 500;
  white-space: nowrap;
  z-index: 99999;
  opacity: 0;
  transition: all 0.3s;
  pointer-events: none;
  box-shadow: 0 4px 20px rgba(0,0,0,0.25);
}
.fsd-wrap .fd-toast-show { opacity: 1; transform: translateX(-50%) translateY(0); }
.fsd-wrap .fd-toast-error { background: var(--neg-acc); }
.fsd-wrap .fd-toast-success { background: var(--profit-acc); }

/* ── EMPTY STATE ── */
.fsd-wrap .empty-state { text-align: center; padding: 60px 20px; color: var(--text3); }
.fsd-wrap .empty-state .es-icon { font-size: 48px; margin-bottom: 12px; opacity: 0.5; }
.fsd-wrap .empty-state h3 { font-family: 'DM Serif Display', serif; font-size: 20px; color: var(--text2); margin-bottom: 6px; }
.fsd-wrap .empty-state p { font-size: 13px; line-height: 1.6; max-width: 320px; margin: 0 auto; }

/* ── FOOTER ── */
.fsd-wrap .footer { text-align: center; font-size: 11px; color: var(--text3); padding: 24px; border-top: 1px solid var(--border); }
