/* ============================================================
   Dashboard Polish — cohesive UI/UX pass (loads LAST)
   Goals:
   1. No content/icons falling off buttons.
   2. Setup strip, stats, and quick actions all stay on ONE row and
      shrink dynamically as the screen narrows.
   3. Consistent card look (bg, border, radius, shadow) across sections.
   Scoped to the dashboard main content; additive and easy to revert.
   ============================================================ */

/* ---- Shared tokens ---- */
:root {
  --dash-card-bg: #ffffff;
  --dash-card-border: 1px solid rgba(226, 232, 240, 0.9);
  --dash-card-radius: 14px;
  --dash-card-shadow: 0 2px 10px rgba(15, 23, 42, 0.06);
  --dash-card-shadow-hover: 0 8px 24px rgba(15, 23, 42, 0.12);
}

/* =========================================================
   1. QUICK ACTIONS — always one row, buttons shrink, nothing clips
   ========================================================= */
.quick-actions {
  display: flex !important;
  flex-wrap: nowrap !important;
  gap: 0.5rem !important;
  align-items: stretch;
}
.quick-actions .btn {
  flex: 1 1 0 !important;
  min-width: 0 !important;            /* allow shrink */
  justify-content: center !important;
  gap: 0.35rem;
  padding: 0.55rem 0.35rem !important;
  font-size: clamp(0.6rem, 1.25vw, 0.85rem) !important;  /* scales with width */
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
/* Label text truncates with ellipsis, never pushes past the button edge */
.quick-actions .btn { line-height: 1.1; }
.quick-actions .btn .qa-ico,
.quick-actions .btn svg,
.quick-actions .btn i {
  flex: 0 0 auto;                     /* icon never shrinks off */
  width: 15px; height: 15px;
}
/* Tablet range: hard-shrink labels so the longest ("Cost Estimates") fits */
@media (min-width: 561px) and (max-width: 1100px) {
  .quick-actions .btn {
    font-size: 0.6rem !important;
    padding: 0.5rem 0.25rem !important;
    gap: 0.25rem;
  }
  .quick-actions .btn .qa-ico,
  .quick-actions .btn svg,
  .quick-actions .btn i { width: 13px; height: 13px; }
}
/* Hide label text only at very tight widths so icons never fall off */
@media (max-width: 560px) {
  .quick-actions .btn { font-size: 0; gap: 0; }   /* icon-only */
  .quick-actions .btn .qa-ico,
  .quick-actions .btn svg,
  .quick-actions .btn i { width: 18px; height: 18px; }
}

/* =========================================================
   2. SETUP + BETA STRIP — one row, shrink, no cutoff
   ========================================================= */
#onb-strip,
.onb-strip {
  flex-wrap: nowrap !important;
  overflow: hidden !important;
  gap: 12px !important;
}
.onb-strip-left { flex: 0 0 auto; min-width: 0; }
.onb-strip-steps { flex: 0 1 auto; min-width: 0; overflow: hidden; }
.onb-strip-beta {
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
}
.onb-strip-right { flex: 0 0 auto; }
.onb-strip-continue-btn { white-space: nowrap; }

/* ---------------------------------------------------------
   2b. STRIP responsive HIDE-BY-PRIORITY (tablet & small desktop)
   Desktop >1200px is untouched. As width shrinks we drop the
   LOWEST-priority items first so the row never clips/overflows.
   Priority HIGH->LOW kept on screen:
     Continue Setup btn > "Complete Your Setup / 3 of 4"
     > step dots > BETA tag > Subscribe link > long sub line.
   --------------------------------------------------------- */

/* Small-desktop 1025-1200px: still a bit cramped — drop the two
   lowest-priority beta items (long descriptive line + Subscribe link). */
@media (min-width: 1025px) and (max-width: 1200px) {
  .onb-strip-beta-sub,
  .onb-strip-beta-sub-link { display: none !important; }
}

/* Tablet 561-1024px: PRIMARY fix.
   Drop long sub line + Subscribe link, AND hide the step dots so the
   BETA tag + "Complete Your Setup / 3 of 4" + Continue button all stay
   fully visible and readable with no overflow / horizontal scroll. */
@media (min-width: 561px) and (max-width: 1024px) {
  /* lowest priority: long descriptive line + Subscribe link */
  .onb-strip-beta-sub,
  .onb-strip-beta-sub-link { display: none !important; }
  /* next priority: step dots (were squishing to ~37px) */
  .onb-strip-steps { display: none !important; }
  /* let the (now short) beta block size to its content, no stretch */
  .onb-strip-beta {
    flex: 0 1 auto !important;
    min-width: 0 !important;
    overflow: hidden !important;
  }
  /* ALWAYS-keep items: title/count, BETA tag, days, Continue button */
  .onb-strip-left,
  .onb-strip-beta-tag,
  .onb-strip-beta-title,
  .onb-strip-beta-bugs,
  .onb-strip-right { flex: 0 0 auto !important; }
}

/* =========================================================
   3. STATS — one row that shrinks (desktop & tablet)
   ========================================================= */
@media (min-width: 769px) {
  .stats-grid {
    display: flex !important;
    flex-wrap: nowrap !important;
    gap: 0.5rem !important;
  }
  .stats-grid .stat-card {
    flex: 1 1 0 !important;
    min-width: 0 !important;
    padding: 0.55rem 0.7rem !important;
  }
  .stats-grid .stat-value { font-size: clamp(1rem, 2vw, 1.4rem) !important; white-space: nowrap; }
  .stats-grid .stat-label { font-size: clamp(0.55rem, 1.1vw, 0.68rem) !important; }
  .stats-grid .stat-change { font-size: clamp(0.52rem, 1vw, 0.62rem) !important; }
}

/* =========================================================
   4. CONSISTENT CARD LOOK across the dashboard sections
   ========================================================= */
.widget-quotes-section,
.card.fade-in {
  background: var(--dash-card-bg) !important;
  border: var(--dash-card-border) !important;
  border-radius: var(--dash-card-radius) !important;
  box-shadow: var(--dash-card-shadow) !important;
}

/* Unify the three lead/quote/report card kinds */
.widget-quotes-table tbody tr,
.estimate-preview-card,
.report-preview-card {
  background: #fff !important;
  border: 1px solid rgba(226, 232, 240, 0.9) !important;
  border-radius: 12px !important;
  box-shadow: 0 2px 8px rgba(15, 23, 42, 0.05) !important;
  transition: box-shadow 0.18s ease, transform 0.18s ease !important;
}
.widget-quotes-table tbody tr:hover,
.estimate-preview-card:hover,
.report-preview-card:hover {
  box-shadow: var(--dash-card-shadow-hover) !important;
  transform: translateY(-2px);
}