/* ─── Daily Brain / Morning Launch — Sprint E ────────────────────────────────
   E16: Calm visual hierarchy. One dominant Priority Move. Red reserved for
   truly critical items only. Clear section labels. ADHD-friendly layout.
   ─────────────────────────────────────────────────────────────────────────── */

/* ── Wrapper ── */
.db-wrap {
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 2px 0 12px;
}

/* ── Header ── */
.db-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
  padding: 20px 20px 16px;
  background: linear-gradient(135deg, var(--card) 0%, rgba(201,168,76,.05) 100%);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
}
.db-greeting {
  font-size: 22px;
  font-weight: 600;
  letter-spacing: -.01em;
  line-height: 1.2;
}
.db-date {
  font-size: 12px;
  color: var(--text-2);
  margin-top: 3px;
}
.db-subhead {
  font-size: 11px;
  color: var(--text-3);
  margin-top: 2px;
  text-transform: uppercase;
  letter-spacing: .05em;
}

/* ── Snapshot chips ── */
.db-chips {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  align-items: center;
}
.db-chip {
  display: flex;
  align-items: center;
  gap: 5px;
  padding: 5px 11px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 20px;
}
.db-chip-icon  { font-size: 13px; line-height: 1; }
.db-chip-label { font-size: 10px; color: var(--text-3); white-space: nowrap; }
.db-chip-value { font-size: 13px; font-weight: 700; white-space: nowrap; }

/* ── E2: Priority Move — dominant card ── */
.db-priority-move {
  background: var(--card);
  border: 1.5px solid rgba(201, 168, 76, .45);
  border-radius: var(--radius-lg);
  padding: 18px 20px;
  box-shadow: 0 2px 12px rgba(201, 168, 76, .08);
}
.db-pm-eyebrow {
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .08em;
  color: var(--gold);
  margin-bottom: 10px;
}
.db-pm-body {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  margin-bottom: 14px;
}
.db-pm-icon {
  font-size: 22px;
  flex-shrink: 0;
  line-height: 1.3;
}
.db-pm-text {
  font-size: 15px;
  font-weight: 500;
  line-height: 1.5;
  color: var(--text);
  flex: 1;
}
.db-pm-actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  align-items: center;
}
.db-pm-btn {
  padding: 7px 16px;
  background: var(--gold);
  border: none;
  border-radius: 6px;
  color: var(--bg);
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
  font-family: inherit;
  letter-spacing: .01em;
}
.db-pm-btn:hover { opacity: .88; }

/* E3: Start My Day button — calm green, not aggressive */
.db-start-btn {
  padding: 7px 14px;
  background: transparent;
  border: 1px solid var(--green, #3dba7a);
  border-radius: 6px;
  color: var(--green, #3dba7a);
  font-size: 12px;
  font-weight: 500;
  cursor: pointer;
  font-family: inherit;
  letter-spacing: .01em;
  transition: all .15s;
}
.db-start-btn:hover {
  background: rgba(61, 186, 122, .1);
}

/* ── E17: All-clear healthy state ── */
.db-all-clear {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 16px 20px;
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  flex-wrap: wrap;
}
.db-all-clear-icon { font-size: 20px; }
.db-all-clear-text { font-size: 13px; color: var(--text-2); flex: 1; line-height: 1.4; }

/* ── Sections ── */
.db-section {
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 14px 16px;
}
.db-section-hdr {
  display: flex;
  align-items: center;
  gap: 7px;
  margin-bottom: 10px;
}
.db-section-emoji { font-size: 14px; flex-shrink: 0; }
.db-section-title {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .07em;
  color: var(--text-2);
  flex: 1;
}
.db-section-count {
  font-size: 10px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 1px 7px;
  color: var(--text-3);
}
.db-section-items { display: flex; flex-direction: column; gap: 2px; }

/* ── Item rows ── */
.db-item {
  display: flex;
  align-items: flex-start;
  gap: 9px;
  padding: 6px 4px;
  border-radius: 5px;
  line-height: 1.45;
}
.db-item--link { cursor: pointer; }
.db-item--link:hover { background: var(--surface); }
.db-item-icon  { font-size: 14px; flex-shrink: 0; padding-top: 1px; }
.db-item-label { font-size: 13px; color: var(--text); flex: 1; }
.db-item-val   { color: var(--green); font-weight: 600; margin-left: 4px; }

/* ── Section accent colors (E16: limited red) ── */
/* NEEDS YOU NOW — amber border, not full red */
.db-section--urgent {
  border-left: 3px solid var(--gold, #c9a84c);
}
/* TODAY — blue tint */
.db-section--today {
  border-left: 3px solid var(--blue, #4a90d9);
}
/* WAITING ON — neutral */
.db-section--waiting {
  border-left: 3px solid var(--border);
  opacity: .9;
}
/* COMING UP — subtle */
.db-section--coming {
  border-left: 3px solid var(--border);
}
/* OPPORTUNITIES — green */
.db-section--opps {
  border-left: 3px solid var(--green, #3dba7a);
}

/* ─── E3: Focus Mode overlay ─────────────────────────────────────────────────── */
.db-focus-modal {
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 16px;
  padding: 32px 28px;
  max-width: 480px;
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 0;
  box-shadow: 0 8px 40px rgba(0,0,0,.4);
}
.db-focus-progress {
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .08em;
  color: var(--text-3);
  margin-bottom: 20px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 20px;
  padding: 3px 12px;
}
/* S2-4: Focus Mode enhancements */
.db-focus-intro {
  font-size: 13px;
  font-weight: 600;
  color: var(--gold, #c9a84c);
  text-transform: uppercase;
  letter-spacing: .06em;
  margin-bottom: 12px;
}
.db-focus-why {
  font-size: 12px;
  color: var(--text-3);
  margin: 8px 0 16px;
  max-width: 320px;
  line-height: 1.5;
  font-style: italic;
}
.db-focus-snooze-btn {
  background: transparent;
  border: 1px solid var(--border);
  color: var(--text-2);
  border-radius: 8px;
  padding: 8px 16px;
  font-size: 13px;
  cursor: pointer;
  transition: background .15s;
}
.db-focus-snooze-btn:hover { background: var(--surface); }
.db-focus-icon-lg {
  font-size: 48px;
  line-height: 1;
  margin-bottom: 16px;
}
.db-focus-title {
  font-size: 18px;
  font-weight: 600;
  color: var(--text);
  line-height: 1.4;
  margin-bottom: 10px;
}
.db-focus-sub {
  font-size: 13px;
  color: var(--text-2);
  line-height: 1.5;
  margin-bottom: 8px;
}
.db-focus-open {
  background: none;
  border: none;
  color: var(--gold);
  font-size: 12px;
  font-weight: 500;
  cursor: pointer;
  font-family: inherit;
  padding: 4px 8px;
  border-radius: 4px;
  margin-bottom: 20px;
  text-decoration: underline;
}
.db-focus-open:hover { opacity: .8; }
.db-focus-btns {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  justify-content: center;
  margin-bottom: 16px;
  width: 100%;
}
.db-focus-done {
  flex: 1;
  min-width: 100px;
  padding: 10px 18px;
  background: var(--green, #3dba7a);
  border: none;
  border-radius: 8px;
  color: #fff;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  font-family: inherit;
}
.db-focus-done:hover { opacity: .88; }
.db-focus-reschedule {
  flex: 1;
  min-width: 100px;
  padding: 10px 18px;
  background: transparent;
  border: 1px solid var(--gold);
  border-radius: 8px;
  color: var(--gold);
  font-size: 14px;
  font-weight: 500;
  cursor: pointer;
  font-family: inherit;
}
.db-focus-reschedule:hover { background: rgba(201,168,76,.08); }
.db-focus-skip {
  padding: 10px 18px;
  background: transparent;
  border: 1px solid var(--border);
  border-radius: 8px;
  color: var(--text-2);
  font-size: 14px;
  cursor: pointer;
  font-family: inherit;
}
.db-focus-skip:hover { border-color: var(--text-2); }
.db-focus-exit {
  background: none;
  border: none;
  color: var(--text-3);
  font-size: 11px;
  cursor: pointer;
  font-family: inherit;
  padding: 4px 8px;
  margin-top: 4px;
  border-radius: 4px;
}
.db-focus-exit:hover { color: var(--text-2); }

/* ── E11: Quick Capture tab bar ── */
.ceo-capture-tabs {
  display: flex;
  gap: 4px;
  border-bottom: 1px solid var(--border);
  padding-bottom: 10px;
  margin-bottom: 12px;
}
.ceo-capture-tab {
  flex: 1;
  padding: 6px 8px;
  background: none;
  border: 1px solid var(--border);
  border-radius: 6px;
  color: var(--text-2);
  font-size: 12px;
  cursor: pointer;
  font-family: inherit;
  transition: all .15s;
  white-space: nowrap;
}
.ceo-capture-tab.active {
  background: var(--gold);
  color: var(--bg);
  border-color: var(--gold);
  font-weight: 600;
}
.ceo-capture-tab:not(.active):hover {
  border-color: var(--gold);
  color: var(--gold);
}
.ceo-capture-pane { display: flex; flex-direction: column; gap: 10px; }

/* ─── E12: Brain Dump → Action buttons ──────────────────────────────────────── */
.bd-to-task {
  background: none;
  border: 1px solid var(--border);
  border-radius: 4px;
  color: var(--text-3);
  font-size: 10px;
  padding: 2px 7px;
  cursor: pointer;
  font-family: inherit;
  flex-shrink: 0;
  margin-left: auto;
  white-space: nowrap;
  transition: all .15s;
}
.bd-to-task:hover { border-color: var(--gold); color: var(--gold); }
.bd-to-task:disabled { color: var(--green); border-color: var(--green); cursor: default; }

.bd-action-row {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 0 2px;
  border-top: 1px solid var(--border);
  margin-top: 10px;
}
.bd-send-all {
  padding: 6px 14px;
  background: var(--gold);
  border: none;
  border-radius: 6px;
  color: var(--bg);
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
  font-family: inherit;
}
.bd-send-all:hover { opacity: .88; }
.bd-send-all:disabled { opacity: .6; cursor: default; }
.bd-action-hint { font-size: 11px; color: var(--text-3); }

/* ─── Responsive ─────────────────────────────────────────────────────────────── */
@media (max-width: 600px) {
  .db-header     { flex-direction: column; padding: 16px; }
  .db-chips      { gap: 6px; }
  .db-chip       { padding: 4px 9px; }
  .db-greeting   { font-size: 18px; }
  .db-pm-icon    { font-size: 18px; }
  .db-pm-text    { font-size: 14px; }
  .db-focus-modal { padding: 24px 18px; border-radius: 12px; }
  .db-focus-icon-lg { font-size: 36px; }
  .db-focus-title   { font-size: 16px; }
}

/* ─── PF-TODAY2: New section accent colors ────────────────────────────────────── */
.db-section--closings  { border-left: 3px solid #f59e0b; background: rgba(245,158,11,.06); }
.db-section--contracts { border-left: 3px solid #3b82f6; background: rgba(59,130,246,.05); }
.db-section--agents    { border-left: 3px solid #8b5cf6; background: rgba(139,92,246,.05); }
.db-section--closings .db-section-hdr  { color: #b45309; }
.db-section--contracts .db-section-hdr { color: #1d4ed8; }
.db-section--agents .db-section-hdr    { color: #6d28d9; }

/* ─── BrandVoice taglines (QA Sprint 2026-08-31) ────────────────────────────── */
/* Today header tagline — subtle, below the date */
.db-tagline {
  font-size: 12px;
  font-style: italic;
  color: var(--text-3, #9ca3af);
  margin-top: 3px;
  letter-spacing: 0.01em;
}

/* Brain Dump result area tagline — sits above classified buckets */
.bd-tagline {
  font-size: 12px;
  font-style: italic;
  color: var(--text-3, #9ca3af);
  margin-bottom: 12px;
  padding-left: 2px;
}