/* =========================================================
   BUZZWORKS APP CSS (AUTH ONLY)
   Source of truth for logged-in pages
========================================================= */

/* =========================
   THEME VARIABLES
========================= */
:root{
  --bg:#05060a;
  --text:#f5e6cf;
  --muted:rgba(245,230,207,.78);

  --glass: rgba(12,10,14,.55);
  --border: rgba(255,170,60,.20);
  --shadow: 0 18px 50px rgba(0,0,0,.55);

  --orange:#ff8a1f;
  --orange2:#ffb34d;

  --radius:18px;
}

*{ box-sizing:border-box; }

.hidden { display: none; }

body{
  margin:0;
  font-family: Arial, sans-serif;
  color: var(--text);
  background: var(--bg);
  min-height:100vh;
  overflow-x: hidden;
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

/* =========================================================
   APP BACKGROUND
========================================================= */
.page{
  min-height:100vh;
  background:
    radial-gradient(1200px 700px at 55% 20%, rgba(255,150,40,.22), rgba(0,0,0,0) 60%),
    radial-gradient(900px 540px at 12% 40%, rgba(255,120,20,.16), rgba(0,0,0,0) 58%),
    linear-gradient(180deg, rgba(0,0,0,.18), rgba(0,0,0,.65)),
    url("/images/bg-home-embers.jpg");
  background-size: cover;
  background-position: center;
  background-attachment: fixed;
}

/* =========================================================
   APP HEADER (AUTH SHELL)
   Matches marketing look, isolated for app
========================================================= */
.app-header,
.bw-header{
  position: sticky;
  top: 0;
  z-index: 50;
  border-bottom: 1px solid rgba(255,170,60,.14);
  background: linear-gradient(
    to bottom,
    rgba(8,6,10,.86),
    rgba(8,6,10,.55)
  );
  backdrop-filter: blur(10px);
}

.app-header-inner,
.bw-header-inner{
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  max-width: 1600px;
  margin: 0 auto;
  padding: 14px 32px;
  gap: 18px;
}

/* Beta IV header: tagline + compact nav in center column */
.bw-header-mid--beta {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-width: 0;
}

.bw-header-beta-tagline {
  margin: 0;
  text-align: center;
  font-size: 0.72rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  opacity: 0.72;
}

.bw-nav--beta {
  flex-wrap: wrap;
  gap: 10px 14px;
}

.bw-nav--beta a {
  font-size: 13px;
  padding: 7px 12px;
}

/* =========================================================
   Beta header — BulkMailTracker brand mark/wordmark
   Scoped to the beta-IV auth header so the BuzzWorks AI logo
   styling (.bw-logo) elsewhere is unaffected.
========================================================= */
.bw-header--beta-bmt .bmt-app-logo {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  text-decoration: none;
  font-weight: 800;
  letter-spacing: 0.02em;
  color: var(--text, #f5e6cf);
  line-height: 1;
}

.bw-header--beta-bmt .bmt-app-logo:hover { filter: brightness(1.06); }

.bw-header--beta-bmt .bmt-app-logo__mark {
  display: inline-block;
  width: 22px;
  height: 22px;
  border-radius: 6px;
  background: radial-gradient(circle at 30% 30%, #ffd28a, #ff8a1f 55%, #b04500 100%);
  box-shadow:
    0 0 14px rgba(255, 138, 31, 0.55),
    inset 0 0 6px rgba(255, 220, 180, 0.4);
  flex-shrink: 0;
}

.bw-header--beta-bmt .bmt-app-logo__wordmark {
  font-size: 1.02rem;
  font-weight: 800;
  white-space: nowrap;
  color: var(--text, #f5e6cf);
}

@media (max-width: 720px) {
  .bw-header--beta-bmt .bmt-app-logo__wordmark { font-size: 0.94rem; }
  .bw-header--beta-bmt .bmt-app-logo__mark { width: 20px; height: 20px; }
}

.bw-header-left{
  display: flex;
  align-items: center;
  min-width: 0;
}

/* ---- Brand ---- */
.app-header .logo,
.bw-logo{
  display: inline-flex;
  align-items: center;
  gap: 10px;
  text-decoration: none;
  color: var(--text);
  font-weight: 900;
  letter-spacing: .2px;
  white-space: nowrap;
}

.bw-logo span{
  color: var(--orange);
}

.app-header .logo img{
  height: 36px;
  width: auto;
  display: block;
}

/* ---- Nav ---- */
.app-header .app-nav,
.bw-nav{
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 28px;
}

/* Nav links only (no bleed) */
.app-header .app-nav a,
.bw-nav a{
  padding: 8px 14px;
  border-radius: 999px;
  border: 1px solid rgba(255,170,60,.16);
  background: rgba(0,0,0,.18);
  color: rgba(245,230,207,.92);
  font-size: 14px;
  font-weight: 800;
  text-decoration: none;
  line-height: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: background .15s ease, border-color .15s ease;
}

.app-header .app-nav a:hover,
.bw-nav a:hover{
  background: rgba(0,0,0,.28);
  border-color: rgba(255,170,60,.32);
}

/* Active tab */
.app-header .app-nav a.active,
.bw-nav a.active{
  background: linear-gradient(
    180deg,
    rgba(255,168,68,.95),
    rgba(255,120,20,.95)
  );
  color: #1b0b00;
  border-color: rgba(255,170,60,.85);
}

.bw-header-right{
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 16px;
}

.bw-credits,
.bw-account,
.bw-logout,
.bw-menu-toggle{
  min-height: 38px;
  border: 1px solid rgba(255,170,60,.16);
  border-radius: 999px;
  background: rgba(0,0,0,.18);
  color: rgba(245,230,207,.92);
  font: inherit;
  font-size: 14px;
  font-weight: 800;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
}

.bw-credits,
.bw-logout,
.bw-menu-toggle{
  cursor: pointer;
}

.bw-credits{
  padding: 8px 14px;
  color: var(--orange2);
}

.bw-account{
  padding: 8px 12px;
}

.bw-account svg,
.bw-logout svg,
.bw-menu-toggle svg{
  width: 18px;
  height: 18px;
}

.bw-logout{
  width: 40px;
  color: #ff9a9a;
  border-color: rgba(255,80,80,.35);
  background: rgba(255,80,80,.08);
}

.bw-logout:hover{
  background: rgba(255,80,80,.18);
  border-color: rgba(255,80,80,.6);
}

.bw-menu-toggle{
  display: none;
  width: 40px;
}

.bw-mobile-menu{
  display: none;
}

@media (max-width: 900px) {
  .bw-header-inner{
    grid-template-columns: auto 1fr auto;
    padding: 12px 20px;
  }

  .bw-nav{
    display: none;
  }

  .bw-credits,
  .bw-account,
  .bw-logout{
    display: none;
  }

  .bw-menu-toggle{
    display: inline-flex;
    margin-left: auto;
  }

  .bw-mobile-menu{
    position: absolute;
    top: 60px;
    right: 20px;
    left: auto;
    width: 240px;
    background: #000;
    border: 1px solid rgba(255,106,0,0.2);
    border-radius: 8px;
    padding: 16px;
    display: none;
    flex-direction: column;
    gap: 12px;
    box-shadow: var(--shadow);
  }

  .bw-mobile-menu.open{
    display: flex;
  }

  .bw-mobile-menu a,
  .bw-mobile-menu button{
    width: 100%;
    padding: 10px 12px;
    border: 1px solid rgba(255,170,60,.16);
    border-radius: 10px;
    background: rgba(255,255,255,.03);
    color: var(--text);
    font: inherit;
    font-weight: 800;
    text-align: left;
    text-decoration: none;
  }

  .bw-mobile-menu button{
    color: #ff9a9a;
    cursor: pointer;
  }
}

/* =========================================================
   PAGE LAYOUT
========================================================= */
.page-inner{
  max-width: 1200px;
  margin: 0 auto;
  padding: 26px 18px 80px;
}

h2{
  margin: 0 0 6px;
  font-size: 30px;
}

.subtle{
  color: var(--muted);
  font-size: 14px;
}

/* =========================================================
   CARDS
========================================================= */
.card{
  margin-top: 22px;
  background: linear-gradient(180deg, rgba(10,8,12,.62), rgba(10,8,12,.38));
  border-radius: var(--radius);
  padding: 18px;
  box-shadow: var(--shadow);
  border: 1px solid rgba(255,170,60,.18);
  backdrop-filter: blur(10px);
}

.card-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}

.card-header h3{
  margin:0;
}

/* Project header block (iv-project-details, project details) */
.bw-project-header {
  margin-bottom: 1rem;
}
.bw-title-lg {
  margin: 0;
  font-size: 1.5rem;
  font-weight: 700;
  color: var(--text);
}
.bw-meta-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem 1.25rem;
  margin-top: 0.5rem;
  align-items: baseline;
}
.bw-meta-label {
  font-size: 0.85rem;
  color: var(--muted);
  margin-right: 0.25rem;
}
.bw-meta-value {
  font-size: 0.95rem;
  color: var(--text);
}
.bw-meta-item {
  display: inline;
}
.bw-project-header .bw-meta-item::after {
  content: " · ";
  color: var(--muted);
}
.bw-project-header .bw-meta-item:last-child::after {
  content: "";
}
.bw-meta-value a {
  color: inherit;
  text-decoration: none;
}
.bw-meta-link {
  color: inherit;
  text-decoration: none;
}
.bw-meta-link:hover {
  text-decoration: underline;
}
.bw-icon-btn {
  background: transparent;
  border: none;
  cursor: pointer;
  padding: 2px 6px;
  margin-left: 6px;
  vertical-align: middle;
  color: var(--muted);
  font-size: 1rem;
}
.bw-icon-btn:hover {
  color: var(--orange);
}
.bw-edit-btn {
  font-size: 0.95rem;
}

/* =========================================================
   BUTTONS
========================================================= */
.btn{
  padding: 10px 14px;
  border-radius: 12px;
  font-weight: 900;
  cursor: pointer;
  border: 1px solid rgba(255,170,60,.55);
  background: linear-gradient(180deg, rgba(255,168,68,1), rgba(255,120,20,1));
  color:#1b0b00;
}

.btn.secondary{
  background: rgba(0,0,0,.35);
  color: var(--text);
  border-color: rgba(255,170,60,.25);
}

.btn.btn-warning {
  background: rgba(180, 80, 0, 0.9);
  color: #fff;
  border-color: rgba(180, 80, 0, 0.6);
}

.btn.btn-warning:hover {
  filter: brightness(1.1);
}

.btn:hover{ filter: brightness(1.05); }

/* =========================================================
   DOWNLOAD QR BUTTON
========================================================= */
.btn-download-qr {
  padding: 6px 10px;
  border-radius: 8px;
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
  border: 1px solid rgba(255, 170, 60, 0.35);
  background: rgba(255, 138, 31, 0.15);
  color: var(--orange);
  display: inline-flex;
  align-items: center;
  gap: 4px;
  transition: all 0.2s ease;
}

.btn-download-qr:hover {
  background: rgba(255, 138, 31, 0.25);
  border-color: rgba(255, 170, 60, 0.5);
  filter: brightness(1.1);
}

.btn-download-qr:focus {
  outline: 2px solid rgba(255, 138, 31, 0.5);
  outline-offset: 2px;
}

.btn-download-qr:disabled {
  opacity: 0.5;
  cursor: not-allowed;
  pointer-events: none;
}

/* =========================================================
   TABLES
========================================================= */
.table-wrap{
  margin-top: 14px;
  overflow-x: auto;
}

table{
  width:100%;
  border-collapse: collapse;
  font-size:14px;
}

thead th{
  text-align:left;
  padding:12px 14px;
  border-bottom:1px solid rgba(255,255,255,.12);
  white-space: nowrap;
}

tbody td{
  padding:12px 14px;
  border-bottom:1px solid rgba(255,255,255,.06);
}

tbody tr:hover{
  background: rgba(255,255,255,.04);
}

td.empty{
  text-align:center;
  color: var(--muted);
  padding:20px;
}

/* =========================================================
   MODALS
========================================================= */
.modal-overlay{
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,.65);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 200;
}

.modal-overlay.hidden{
  display: none;
}

.modal-card{
  width: 100%;
  max-width: 520px;
  background: linear-gradient(180deg, rgba(10,8,12,.85), rgba(10,8,12,.65));
  border-radius: var(--radius);
  padding: 22px;
  border: 1px solid rgba(255,170,60,.25);
  box-shadow: var(--shadow);
}

.modal-actions{
  display:flex;
  justify-content:flex-end;
  gap:12px;
  margin-top: 10px;
}

/* BuzzWorks modal (IV dashboard create, etc.) */
.bw-modal {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,.65);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 200;
}
.bw-modal.hidden { display: none; }
.bw-modal-content {
  width: 100%;
  max-width: 520px;
  background: linear-gradient(180deg, rgba(10,8,12,.85), rgba(10,8,12,.65));
  border-radius: var(--radius);
  border: 1px solid rgba(255,170,60,.25);
  box-shadow: var(--shadow);
  overflow: hidden;
}
.bw-modal-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 20px;
  border-bottom: 1px solid rgba(255,170,60,.15);
}
.bw-modal-header h3 { margin: 0; font-size: 1.15rem; flex: 1; min-width: 0; }
.bw-modal-header-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
}
.bw-modal-autofill-wrap {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
  justify-content: flex-end;
  max-width: min(340px, 58vw);
}
.bw-modal-autofill-wrap .btn.secondary {
  font-size: 12px;
  font-weight: 400;
  padding: 4px 10px;
  white-space: nowrap;
}
.bw-modal-body { padding: 20px; }
.bw-modal-footer {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 12px;
  padding: 14px 20px;
  border-top: 1px solid rgba(255,170,60,.15);
}
.bw-close-btn {
  background: transparent;
  border: none;
  color: var(--muted);
  font-size: 1.5rem;
  cursor: pointer;
  padding: 0 4px;
  line-height: 1;
}
.bw-close-btn:hover { color: var(--text); }
.bw-btn { padding: 8px 14px; border-radius: 10px; font-weight: 700; cursor: pointer; border: 1px solid rgba(255,170,60,.35); }
.bw-btn-primary { background: linear-gradient(180deg, rgba(255,168,68,1), rgba(255,120,20,1)); color: #1b0b00; }
.bw-btn-secondary { background: rgba(0,0,0,.35); color: var(--text); border-color: rgba(255,170,60,.25); }
.bw-btn-warning { background: rgba(180, 80, 0, 0.9); color: #fff; border-color: rgba(180, 80, 0, 0.6); }
.bw-btn:hover { filter: brightness(1.05); }
.bw-action-buttons { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.bw-form-row { margin-bottom: 14px; }
.bw-form-row label { display: block; margin-bottom: 4px; font-size: 0.9rem; color: var(--muted); }
.bw-modal-body .bw-input,
.bw-modal-body .bw-select {
  width: 100%;
  padding: 8px 12px;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: rgba(0,0,0,.25);
  color: var(--text);
  font-size: 14px;
}

/* ---------------------------------------------------------
   Dark-theme dropdown consistency (mailing setup + others)
   Target: all selects using .bw-select (and their options).
--------------------------------------------------------- */
select.bw-select{
  background-color: #2a0f0f;
  color: #ffffff;
  border: 1px solid #ff7a1a;
}

select.bw-select:focus{
  outline: none;
  border-color: #ffa64d;
}

select.bw-select option{
  background-color: #2a0f0f;
  color: #ffffff;
}

/* Note: option hover styling support varies by browser/OS */
select.bw-select option:hover{
  background-color: #ff7a1a;
  color: #000000;
}

/* Mailing list address cell — compact row */
.bw-address-cell {
  font-size: 0.85rem;
  line-height: 1.3;
  color: #bbb;
}

.bw-pagination {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-top: 14px;
}

.bw-search-bar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px 12px;
  margin-bottom: 14px;
}

.bw-search-bar .bw-input {
  padding: 8px 12px;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: rgba(0,0,0,.25);
  color: var(--text);
  font-size: 14px;
  min-width: 160px;
}

.bw-search-bar .bw-select {
  padding: 8px 12px;
  border-radius: 8px;
  border: 1px solid var(--border);
  background-color: #2a0f0f;
  color: #ffffff;
  font-size: 14px;
}

.bw-search-bar .bw-select option {
  background-color: #2a0f0f;
  color: #ffffff;
}

.bw-result-count {
  margin-left: auto;
  font-size: 13px;
  color: var(--muted);
}

.bw-phase {
  font-weight: 500;
  color: var(--orange2);
}

.bw-track-cell {
  display: flex;
  align-items: center;
  gap: 8px;
}

.bw-track-btn,
.track-piece {
  font-size: 0.875em;
  white-space: nowrap;
}

.bw-imb-info {
  font-size: 0.85rem;
  color: var(--muted);
  cursor: help;
  border: 1px solid var(--border);
  border-radius: 50%;
  padding: 2px 6px;
  line-height: 1;
}

.bw-imb-info:hover {
  background: rgba(0,0,0,.4);
  color: var(--text);
}

/* Project Info panel: links match panel text (no blue) */
.project-info a,
.project-info a:visited,
.project-info a:hover,
.project-info a:active {
  color: inherit;
  text-decoration: none;
}

.bw-phase-legend {
  margin: 20px 0;
}

.bw-phase-summary {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 10px;
}

.bw-phase-total {
  font-size: 1.1rem;
  font-weight: 600;
}

.bw-phase-grid {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
}

.bw-phase-card {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 8px 14px;
  border-radius: 8px;
  background: rgba(0,0,0,.35);
  font-size: 0.9rem;
}

.bw-phase-card .phase-count {
  margin-left: 6px;
  font-weight: 600;
}

.phase-dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
}

.bw-phase-card.processing .phase-dot { background: #ffc107; }
.bw-phase-card.transit .phase-dot { background: #17a2b8; }
.bw-phase-card.outfordelivery .phase-dot { background: #fd7e14; }
.bw-phase-card.delivered .phase-dot { background: #28a745; }

.bw-view-toggle {
  display: flex;
  align-items: center;
  gap: 10px 12px;
  flex-wrap: wrap;
  margin: 16px 0;
}

.bw-view-btn {
  background: #111;
  border: 1px solid #444;
  color: var(--text);
}

.bw-view-btn.active {
  background: var(--orange);
  color: #000;
}

.bw-geo-header-row {
  display: grid;
  grid-template-columns: 1fr 80px 80px 80px 80px 80px;
  gap: 10px;
  padding: 10px 14px;
  font-weight: 700;
  font-size: 12px;
  text-transform: uppercase;
  color: var(--muted);
  border-bottom: 1px solid var(--border);
}

/* Geo phase drilldown — full width grid */
.geo-header,
.geo-city-row,
.geo-zip-row {
  display: grid;
  grid-template-columns: 28px 120px 80px 80px 80px 80px 80px;
  align-items: center;
  padding: 8px 12px;
  border-bottom: 1px solid rgba(255,255,255,0.1);
  gap: 8px;
}

.geo-chart-icon {
  cursor: pointer;
  opacity: 0.7;
}

.geo-chart-icon:hover {
  opacity: 1;
}

/* Geo timeline drilldown modal (iv-timeline.js openTimelineModal) */
.iv-piece-modal {
  position: fixed;
  inset: 0;
  z-index: 10000;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(0, 0, 0, 0.6);
}
.iv-piece-modal .iv-piece-modal-content {
  background: var(--card-bg, #1e293b);
  border-radius: 8px;
  padding: 16px;
  max-width: 90vw;
  max-height: 90vh;
  overflow: auto;
  box-shadow: 0 4px 24px rgba(0, 0, 0, 0.4);
}
.iv-piece-modal .iv-piece-modal-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 12px;
}
.iv-piece-modal .iv-piece-modal-header h3 {
  margin: 0;
  font-size: 1.1rem;
}
.iv-piece-modal .iv-modal-close {
  background: none;
  border: none;
  font-size: 1.5rem;
  cursor: pointer;
  color: var(--muted);
  padding: 0 6px;
  line-height: 1;
}
.iv-piece-modal .iv-modal-close:hover {
  color: #fff;
}
.iv-piece-modal .iv-modal-timeline {
  height: 320px;
  min-width: 360px;
}

.geo-header {
  font-weight: 700;
  font-size: 12px;
  text-transform: uppercase;
  color: var(--muted, rgba(255,255,255,.7));
  background: rgba(0,0,0,.2);
}

.geo-state-row {
  cursor: pointer;
  font-weight: 600;
  font-size: 13px;
}

.geo-state-row:hover {
  background: rgba(255,255,255,0.05);
}

.iv-geo-card .geo-state-row.active {
  background: rgba(255,255,255,0.08);
}

.geo-city-row {
  padding-left: 25px;
  opacity: 0.85;
  font-size: 13px;
}

#ivGeoCities .geo-city-row {
  cursor: pointer;
}

#ivGeoCities .geo-city-row:hover {
  background: rgba(255,255,255,0.05);
}

#ivGeoCities .geo-zip-container {
  padding-left: 45px;
}

#ivGeoCities .geo-zip-row {
  padding: 6px 12px;
  font-size: 0.85em;
  opacity: 0.85;
  border-bottom: 1px solid rgba(255,255,255,0.06);
}

#ivGeoCities .geo-zip-row:nth-child(even) {
  background: rgba(0,0,0,.1);
}

.iv-geo-fullwidth .iv-geo-states,
.iv-geo-fullwidth .iv-geo-cities,
.iv-geo-fullwidth .iv-geo-zip-panel {
  width: 100%;
  max-width: 100%;
}

.iv-geo-fullwidth .iv-geo-container {
  flex-direction: column;
  gap: 0;
}

.iv-geo-fullwidth .iv-geo-states {
  margin-bottom: 16px;
}

.iv-geo-fullwidth #ivGeoCities .geo-header,
.iv-geo-fullwidth #ivGeoZipPanel .geo-header {
  margin-top: 0;
}

.geo-state-row.expanded {
  background: rgba(0,0,0,.15);
}

.geo-state-header {
  display: grid;
  grid-template-columns: 1fr 80px 80px 80px 80px 80px;
  gap: 10px;
  padding: 10px 14px;
  align-items: center;
  cursor: pointer;
  font-weight: 600;
  background: rgba(0,0,0,.2);
}

.geo-state-header:hover {
  background: rgba(0,0,0,.35);
}

.geo-city-container {
  padding-left: 20px;
}

.geo-city-row:not(.geo-city-header) {
  cursor: default;
}

.geo-city-row:nth-child(even) {
  background: rgba(0,0,0,.15);
}

.geo-city-row.geo-city-header {
  cursor: pointer;
}

.geo-city-row.geo-city-header:hover {
  background: rgba(0,0,0,.25);
}

.geo-zip-container {
  padding-left: 24px;
}

.geo-zip-row {
  display: grid;
  grid-template-columns: 1fr 80px 80px 80px 80px 80px;
  gap: 10px;
  padding: 6px 14px 6px 28px;
  font-size: 12px;
  border-bottom: 1px solid rgba(255,255,255,.05);
  color: var(--muted);
}

.geo-zip-row:nth-child(even) {
  background: rgba(0,0,0,.1);
}

/* GEO two-pane drilldown layout */
.iv-geo-card {
  width: 100%;
  min-height: 220px;
  height: auto;
  display: flex;
  flex-direction: column;
}

.iv-geo-container {
  display: flex;
  gap: 24px;
  width: 100%;
  overflow: hidden;
}

.iv-geo-states {
  flex: 1;
  min-width: 0;
}

.iv-geo-cities {
  flex: 1;
  min-width: 0;
}

/* Legacy two-pane geo (non–IV drilldown). IV Geography uses .geo-layout.geo-drilldown in iv-view-tabs.css */
.geo-layout:not(.geo-drilldown) {
  display: flex;
  gap: 20px;
}

.geo-layout:not(.geo-drilldown) .geo-left {
  width: 45%;
  max-height: 700px;
  overflow: auto;
}

.geo-layout:not(.geo-drilldown) .geo-right {
  width: 55%;
  max-height: 700px;
  overflow: auto;
}

.geo-state {
  padding: 10px;
  border-bottom: 1px solid rgba(255,255,255,0.1);
  cursor: pointer;
}

.geo-state.open {
  background: rgba(255,255,255,0.05);
}

.geo-state .geo-count {
  margin-left: 8px;
  font-weight: normal;
  opacity: 0.85;
}

.geo-city {
  padding: 8px 10px 8px 25px;
  font-size: 14px;
  opacity: 0.9;
  border-bottom: 1px solid rgba(255,255,255,0.08);
  cursor: pointer;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.geo-city:hover {
  background: rgba(255,255,255,0.05);
}

.geo-city.active {
  background: rgba(255,165,0,0.15);
}

.geo-city-loading {
  cursor: default;
  opacity: 0.8;
  font-style: italic;
}

.geo-placeholder {
  padding: 24px;
  color: var(--muted);
  font-size: 14px;
}

.geo-zip-header {
  display: flex;
  justify-content: space-between;
  padding: 10px 10px 8px;
  border-bottom: 1px solid rgba(255,255,255,0.15);
  font-weight: 700;
  font-size: 12px;
  text-transform: uppercase;
  color: var(--muted);
}

.geo-zip-panel h3 {
  margin: 0 0 12px 0;
  font-size: 18px;
}

.geo-zip-row {
  display: flex;
  justify-content: space-between;
  padding: 8px 10px;
  border-bottom: 1px solid rgba(255,255,255,0.08);
  grid-template-columns: unset;
}

.geo-zip-row:nth-child(even) {
  background: rgba(0,0,0,.1);
}

/* =========================================================
   FOOTER
========================================================= */
footer{
  text-align:center;
  font-size:13px;
  color: var(--muted);
  padding:26px 0;
}

/* =========================================================
   IV START OF CLOCK PANEL (shared auth + public)
========================================================= */
.iv-start-clock-panel {
  background: rgba(0,0,0,0.25);
  border: 1px solid rgba(255,255,255,0.15);
  border-radius: 8px;
  padding: 14px 20px;
  margin: 16px 0 20px;
}

.iv-clock-bar {
  display: flex;
  justify-content: center;
  gap: 60px;
  padding: 14px 20px;
  align-items: center;
}

.iv-clock-item {
  text-align: center;
}

.iv-clock-label {
  font-size: 11px;
  color: #bfbfbf;
  letter-spacing: 0.08em;
}

.iv-clock-value {
  font-size: 16px;
  font-weight: 600;
  color: #ffffff;
}

/* Project page — final PDF ZIP link above layout background thumbnails */
.pdf-download-link-wrap {
  margin-bottom: 12px;
}
.pdf-download-link-wrap .pdf-download-link {
  font-weight: 600;
}