/* Shared standardized nav — desktop + mobile */
nav {
  position: fixed; top: 0; left: 0; right: 0; z-index: 100;
  height: 54px; background: #faf9f7; border-bottom: 0.5px solid #e0dbd4;
  display: flex; align-items: center; justify-content: space-between; padding: 0 24px;
}
.nav-brand { font-family: Georgia, serif; font-size: 16px; font-weight: 500; letter-spacing: 0.01em; color: #1a1815; text-decoration: none; }
.nav-links { display: flex; align-items: center; gap: 28px; }
.nav-links a { font-family: Arial, sans-serif; font-size: 12px; font-weight: 400; letter-spacing: 0.03em; color: #6b6560; text-decoration: none; }
.nav-links a:hover { color: #1a1815; }
.nav-links a.active { color: #1a1815; font-weight: 500; border-bottom: 2px solid #2d6e4a; padding-bottom: 2px; }
.nav-signout { font-family: Arial, sans-serif; font-size: 12px; letter-spacing: 0.03em; color: #a09890; background: none; border: none; cursor: pointer; padding: 0; }
.nav-signout:hover { color: #6b6560; }
.nav-badge { display: inline-flex; align-items: center; justify-content: center; background: #b83232; color: #fff; font-size: 9px; font-weight: 600; font-family: Arial, sans-serif; border-radius: 50%; min-width: 14px; height: 14px; padding: 0 3px; margin-left: 3px; line-height: 1; vertical-align: middle; }
.nav-toggle { display: none; background: none; border: none; cursor: pointer; padding: 8px; margin: -8px; flex-direction: column; gap: 4px; }
.nav-toggle-bar { display: block; width: 22px; height: 2px; background: #1a1815; border-radius: 2px; }

/* index.html and trips.html previously used an in-flow nav; now that nav is fixed they need top spacing (.dashboard is their content container; .page pages already compensate themselves) */
.dashboard { padding-top: 82px; }

@media (max-width: 768px) {
  nav { padding: 0 16px; }
  .nav-toggle { display: flex; }
  .nav-links {
    position: fixed; top: 54px; left: 0; right: 0; z-index: 99;
    flex-direction: column; align-items: stretch; gap: 0;
    background: #faf9f7; border-bottom: 0.5px solid #e0dbd4; box-shadow: 0 12px 24px rgba(0,0,0,0.06);
    transform: translateY(-8px); opacity: 0; pointer-events: none; transition: opacity 0.15s, transform 0.15s;
  }
  nav.open .nav-links { transform: translateY(0); opacity: 1; pointer-events: auto; }
  .nav-links a, .nav-signout { width: 100%; text-align: left; padding: 14px 18px; font-size: 14px; border-bottom: 0.5px solid #ece9e3; }
  .nav-links a.active { border-bottom: 0.5px solid #ece9e3; border-left: 3px solid #2d6e4a; padding-left: 15px; }
  .nav-signout { border-bottom: none; }
}

/* Dashboard (index.html) — mobile reflow */
@media (max-width: 768px) {
  .dashboard { padding-left: 1rem; padding-right: 1rem; }
  .metrics-bar { grid-template-columns: 1fr; gap: 8px; }
  .metric-card { padding: 12px 16px 12px; }
  .metric-head { margin-bottom: 10px; }
  .spark-note { display: none; }
  .dash-panels { grid-template-columns: 1fr; }
  .dash-panels .panel-row-name { white-space: normal; }
  .pipeline-grid { grid-template-columns: 1fr; }
}

/* Contacts — phone card view (table stays for desktop) */
.contact-cards { display: none; }
@media (max-width: 768px) {
  .table-toolbar { display: none; }
  .table-wrap { display: none; }
  .contact-cards { display: block; }
  .cc { background: #fff; border: 0.5px solid #e8e4de; border-radius: 12px; padding: 13px 15px; margin-bottom: 10px; cursor: pointer; }
  .cc-overdue { border-left: 4px solid #b83232; }
  .cc-snoozed { border-left: 4px solid #c9922e; }
  .cc-disabled { border-left: 4px solid var(--text-muted); }
  .cc-status-overdue, .cc-status-snoozed { font-family: inherit; font-size: 10.5px; text-transform: uppercase; letter-spacing: .05em; font-weight: 600; border-radius: 3px; padding: 2px 6px; margin-top: 8px; display: inline-block; }
  .cc-status-overdue { color: #b83232; background: #f7e9e9; }
  .cc-status-snoozed { color: #8a6416; background: #f7f1de; }
  .cc-top { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; }
  .cc-name { font-size: 15px; font-weight: 500; color: #1a1815; line-height: 1.3; }
  .cc-prefix { display: block; font-size: 11px; font-weight: 500; color: #BA7517; line-height: 1.2; margin-bottom: 1px; }
  .cc-firm { font-size: 13px; color: #6b6560; margin-top: 5px; display: flex; align-items: center; gap: 6px; }
  .cc-meta { font-size: 11px; color: #a09890; margin-top: 3px; }
  .cc .lc-pill { flex-shrink: 0; }
  .cc .has-notes { flex-shrink: 0; }
  .cc-empty { text-align: center; color: #a09890; font-size: 13px; padding: 40px 0; }
}

/* Contacts mobile polish: header wraps, card pills align */
@media (max-width: 768px) {
  .page-header-bar { flex-wrap: wrap; row-gap: 12px; }
  .page-header-left { flex-wrap: wrap; row-gap: 8px; align-items: center; }
  .cc-top { align-items: center; }
  .cc .lc-pill { display: inline-flex; align-items: center; line-height: 1; }
}

/* Companies — phone card view (table stays for desktop) */
.company-cards { display: none; }
@media (max-width: 768px) {
  .table-outer { display: none; }
  .company-cards { display: block; }
  .cc-co { background:#fff; border:.5px solid #e8e4de; border-radius:12px; padding:13px 15px; margin-bottom:10px; cursor:pointer; }
  .cc-co-top { display:flex; align-items:flex-start; justify-content:space-between; gap:8px; }
  .cc-co-name { font-size:15px; font-weight:500; color:#1a1815; line-height:1.3; }
  .cc-co-us { font-size:11px; font-weight:600; color:#185fa5; background:#e6f1fb; border-radius:4px; padding:1px 6px; letter-spacing:.04em; flex-shrink:0; }
  .cc-co-sub { font-size:12px; color:#6b6560; margin-top:5px; }
  .cc-co-loc { font-size:11px; color:#a09890; margin-top:2px; }
  .cc-co-stages { display:flex; gap:10px; flex-wrap:wrap; margin-top:9px; align-items:center; }
  .cc-co-stage { display:inline-flex; align-items:center; gap:5px; font-size:11px; color:#a09890; }
  .cc-co-fund { font-weight:600; color:#6b6560; letter-spacing:.04em; }
  .cc-co-foot { display:flex; align-items:center; justify-content:space-between; gap:8px; margin-top:10px; padding-top:9px; border-top:.5px solid #efece7; font-size:11px; color:#a09890; }
}

/* Forms — single column on mobile */
@media (max-width: 768px) {
  .form-grid { grid-template-columns: 1fr !important; }
  .form-grid > [style*="grid-template-columns"] { grid-template-columns: 1fr !important; grid-column: auto; }
  .form-field.full { grid-column: auto; }
  .form-row { flex-direction: column; }
  .dm-band { grid-template-columns: 1fr; }
  .form-actions { flex-wrap: wrap; gap: 8px; }
  .form-actions .btn-delete,
  .form-actions .btn-cancel,
  .form-actions .btn-save { white-space: nowrap; min-height: 44px; padding: 9px 14px; }
  .form-actions .btn-delete { flex-basis: 100%; }
}

/* Activity — stat bar + phone card view (fail-safe) */
.activity-cards { display: none; }
@media (max-width: 768px) {
  .metrics-row { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; align-items: center; }
  .metrics-row .metrics-label { grid-column: 1 / -1; min-width: 0; margin-bottom: 2px; }
  .metrics-row .page-count-pill { text-align: center; padding: 5px 8px; }
  #activityTableWrap.cards-ready { display: block; border: none; background: transparent; border-radius: 0; padding: 0; overflow: visible; }
  #activityTableWrap.cards-ready table { display: none; }
  #activityTableWrap.cards-ready .activity-cards { display: block; }
  .cc-act { background:#fff; border:.5px solid #e8e4de; border-radius:12px; padding:12px 14px; margin-bottom:9px; cursor:pointer; }
  .cc-act-top { display:flex; align-items:center; justify-content:space-between; gap:8px; margin-bottom:7px; }
  .cc-act-date { font-size:11px; color:#a09890; flex-shrink:0; }
  .cc-act-firm { font-size:14px; font-weight:500; color:#1a1815; }
  .cc-act-with { font-size:11px; color:#6b6560; margin-top:3px; }
}

/* Prospecting — phone card view */
.prospecting-cards { display: none; }
@media (max-width: 768px) {
  .prospecting-cards { display: block; }
  .cc-ps { background:#fff; border:.5px solid #e8e4de; border-radius:12px; padding:13px 15px; margin-bottom:10px; }
  .cc-ps-top { display:flex; align-items:flex-start; justify-content:space-between; gap:8px; }
  .cc-ps-name { font-size:15px; font-weight:500; color:#1a1815; line-height:1.3; }
  .cc-ps-meta { font-size:12px; color:#6b6560; margin-top:5px; }
  .cc-ps-foot { display:flex; align-items:center; justify-content:space-between; gap:8px; margin-top:10px; padding-top:9px; border-top:.5px solid #efece7; font-size:11px; color:#a09890; }
  .cc-ps-controls { margin-top:10px; padding-top:9px; border-top:.5px solid #efece7; }
  .cc-ps-controls .ps-actions { flex-wrap:wrap; gap:8px; }
  .cc-empty { text-align:center; color:#a09890; font-size:13px; padding:40px 0; }
}