/* Partner cabinet: content-specific styles only. The page shell (header, tabs,
   page title, grid, cards, buttons) comes from app.css — see
   docs/superpowers/specs/2026-07-23-cabinet-unified-shell-design.md */

.cabinet {
  min-height: 100vh;
  background: var(--bg, #f7f7f5);
  color: var(--fg, #1a1a1a);
}

/* Heading scale for bare h2/h3 inside the four converted pages that link this
   sheet (dashboard, deal, documents, account — news deliberately does not).
   `.page` is also used by the public catalog, but those pages never load
   cabinet.css, so this never leaks there. Does not touch .page__title (h1).
   Sizes chosen to match documents' `.doc-group h2` (15px) and account's
   `.form h2` (16px) — both keep their own more-specific rules and win. */
.page h2 { font-size: 16px; }
.page h3 { font-size: 13px; color: var(--muted, #777); }

/* ===== Auth pages — landing (Jost) design language ===================== *
 * Square corners (no radius), heavy uppercase display, hairline borders,
 * large fields, black button that turns red on hover, red square accent.   */
.cabinet-auth {
  font-family: 'Jost', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 40px 20px;
  background: #fbfbfb;
  color: #0a0a0a;
}

/* Embedded inside the landing modal iframe: no page chrome, transparent,
   snug so the iframe hugs the card. */
.cabinet-auth.embed {
  min-height: 0;
  padding: 0;
  background: transparent;
  display: block;
}

.auth-card {
  width: 100%;
  max-width: 440px;
  background: #fff;
  border: 1px solid #e4e4e4;
  padding: 44px 44px 40px;
}

.cabinet-auth.embed .auth-card {
  max-width: none;
  border: 0;
}

.auth-eyebrow {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: #939393;
  margin: 0 0 18px;
}

.auth-eyebrow::before {
  content: "";
  width: 9px;
  height: 9px;
  background: #e10000;
  flex: none;
}

.auth-card h1 {
  font-size: 30px;
  font-weight: 800;
  line-height: 1.02;
  letter-spacing: -0.01em;
  text-transform: uppercase;
  margin: 0 0 26px;
}

.auth-card form {
  display: flex;
  flex-direction: column;
  gap: 18px;
}

.auth-field {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.auth-field > span {
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: #6a6a6a;
}

.auth-card input[type="text"],
.auth-card input[type="email"],
.auth-card input[type="password"] {
  width: 100%;
  padding: 15px 16px;
  border: 1px solid #d8d8d8;
  border-radius: 0;
  background: #fff;
  font-family: inherit;
  font-size: 16px;
  color: #0a0a0a;
  transition: border-color 0.15s;
}

.auth-card input:focus {
  outline: none;
  border-color: #0a0a0a;
}

.auth-card button[type="submit"] {
  margin-top: 8px;
  width: 100%;
  padding: 16px;
  border: 0;
  border-radius: 0;
  background: #000;
  color: #fff;
  font-family: inherit;
  font-size: 14px;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  cursor: pointer;
  transition: background 0.2s;
}

.auth-card button[type="submit"]:hover {
  background: #e10000;
}

/* Secondary CTA — same footprint as the submit button, muted (grey → black). */
.auth-btn2 {
  display: block;
  width: 100%;
  margin-top: 12px;
  padding: 16px;
  border: 0;
  border-radius: 0;
  background: #ececec;
  color: #0a0a0a;
  font-family: inherit;
  font-size: 14px;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  text-align: center;
  cursor: pointer;
  transition: background 0.2s, color 0.2s;
}

.auth-btn2:hover {
  background: #0a0a0a;
  color: #fff;
}

.auth-links {
  margin: 22px 0 0;
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.02em;
  color: #6a6a6a;
}

.auth-links a {
  color: #0a0a0a;
  border-bottom: 1px solid transparent;
  transition: border-color 0.15s, color 0.15s;
}

.auth-links a:hover {
  color: #e10000;
  border-color: #e10000;
}

/* Body copy for the pending / forgot-sent states. */
.auth-note {
  font-size: 15px;
  line-height: 1.55;
  color: #444;
  margin: 0 0 4px;
}

.form-error {
  border-left: 3px solid #e10000;
  background: #fbeceb;
  color: #b40000;
  border-radius: 0;
  padding: 11px 14px;
  font-size: 13px;
  line-height: 1.4;
  margin: 0 0 22px;
}

/* Back to the public site — standalone pages only (hidden when embedded). */
.auth-back {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin: 0 0 24px;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: #939393;
}

.auth-back:hover {
  color: #e10000;
}

/* Honeypot field: present in the DOM for bots, invisible to humans. */
.hp {
  position: absolute;
  left: -9999px;
}

.deal-status {
  display: inline-block;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  font-weight: 700;
  padding: 4px 9px;
  border-radius: 999px;
  background: #eee;
  color: #444;
}

.deal-status.status-negotiation,
.deal-status.status-dd,
.deal-status.status-closing { background: #fdecea; color: #a12622; }
.deal-status.status-closed { background: #e7f5ea; color: #1e6b34; }
.deal-status.status-archived { background: #eee; color: #888; }

/* Deal detail */
.deal-desc {
  margin: 20px 0 32px;
  line-height: 1.6;
}

.doc-list {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.doc-item {
  display: flex;
  align-items: center;
  gap: 10px;
  background: #fff;
  border-radius: 8px;
  padding: 12px 14px;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
}

.doc-item a {
  color: #1a1a1a;
  font-weight: 500;
}

.doc-item a:hover {
  color: #a12622;
}

/* Подзаголовок подгруппы: тизер против дата-рума. Заменил ярлык категории в
   строке — режим доступа сказан один раз на список, а не на каждый файл. */
.doc-sub {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: #888;
  margin: 14px 0 8px;
}

.doc-group h2 + .doc-sub {
  margin-top: 0;
}

/* Documents page: grouped by deal */
.doc-filter {
  width: 100%;
  max-width: 320px;
  padding: 10px 12px;
  border: 1px solid #ddd;
  border-radius: 8px;
  font-size: 14px;
  margin-bottom: 20px;
}

.doc-group {
  margin-bottom: 28px;
}

.doc-group h2 {
  font-size: 15px;
  margin: 0 0 10px;
}

.doc-group h2 a {
  color: #1a1a1a;
}

/* Account page: profile + password forms */
.notice {
  background: #e7f5ea;
  color: #1e6b34;
  border-radius: 8px;
  padding: 10px 12px;
  font-size: 13px;
  margin: 0 0 20px;
}

/* Each account card is a `.form` (app.css) section; give it its own spacing
   instead of an inline style, and cancel `.form h2`'s section-divider rule
   (border-top/padding-top) which is meant to separate sections INSIDE one
   form, not lead off a card — do not touch `.form h2` itself, other pages
   rely on it. */
.account-section { margin-bottom: 24px; }
.account-section h2 { border-top: 0; padding-top: 0; }

/* --- Phase 2 dashboard --- */
.tiles { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin: 20px 0; }
.tiles--metrics { grid-template-columns: repeat(3, 1fr); }
.tile { border: 1px solid var(--line, #e2e2e2); padding: 14px 16px; display: flex; flex-direction: column; gap: 6px; }
.tile-label { font-size: 12px; text-transform: uppercase; letter-spacing: .04em; opacity: .7; }
.tile-value { font-size: 22px; font-weight: 700; }
.ccy-warn { border-left: 3px solid #c0392b; padding: 8px 12px; background: rgba(192,57,43,.06); margin: 16px 0; }
.ccy-flag { color: #c0392b; }
.stack { margin: 20px 0; }
.stack-label { font-size: 12px; text-transform: uppercase; letter-spacing: .04em; opacity: .7; margin-bottom: 6px; }
.stack-bar { height: 16px; background: var(--line, #eee); position: relative; overflow: hidden; }
.stack-fill { position: absolute; inset: 0 auto 0 0; background: var(--red, #e10000); }
.stack-legend { display: flex; justify-content: space-between; font-size: 13px; margin-top: 6px; }
.chart { margin: 20px 0; }
.chart-title, .chart-legend { font-size: 12px; text-transform: uppercase; letter-spacing: .04em; opacity: .7; }
.cashflow { width: 100%; height: 160px; display: block; }
/* Series colors validated with the dataviz skill's validate_palette.js against
   the cabinet's page background (#f7f7f5) in both light and dark surface checks:
   --red (site brand token, already used for badges/CTAs) paired with the
   documented categorical "blue" slot — CVD ΔE 28.9, normal-vision ΔE 36.6,
   contrast >=3:1, all clean PASS (no WARN band), vs. red+green which only
   scrapes the CVD floor (WARN, ΔE 7.3) and risks the classic red/green
   confusion. The dashed stroke on cf-distrib is kept as belt-and-suspenders
   secondary encoding alongside the legend dots. */
.cf-contrib { stroke: var(--red, #e10000); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.cf-distrib { stroke: #2a78d6; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; stroke-dasharray: 4 3; }
.chart-legend { display: flex; align-items: center; gap: 8px; margin-top: 6px; }
.cf-dot { width: 10px; height: 10px; display: inline-block; }
.cf-dot--contrib { background: var(--red, #e10000); }
.cf-dot--distrib { background: #2a78d6; }
.deal-table-wrap { overflow-x: auto; margin: 20px 0; }
.deal-table { width: 100%; border-collapse: collapse; }
.deal-table th, .deal-table td { text-align: left; padding: 8px 10px; border-bottom: 1px solid var(--line, #eee); font-size: 14px; white-space: nowrap; }
.deal-row { cursor: pointer; }
.deal-row:hover { background: rgba(0,0,0,.03); }
.asof { font-size: 11px; opacity: .6; }
@media (max-width: 720px) { .tiles, .tiles--metrics { grid-template-columns: repeat(2, 1fr); } }
