/* ============================================================
   Theme refinement layer.
   Loads after the vendor "aprex" template CSS on every page.
   Purpose: correct a handful of template defaults that were
   never fully adapted to this site's actual mint/teal brand,
   without touching any page markup, content, or section order.
   ============================================================ */

/* ---- Brand accent: the vendor "--theme" token still ships as
   template-default coral (#ec595a), clashing with the site's
   actual mint identity everywhere it was never re-themed
   (highlight badges, counter numbers, notification dots). ---- */

:root[data-theme="light"] {
  --theme: #0cc1b9;
}

:root[data-theme="dark"] {
  --theme: #2fd6c9;
}

/* ---- Navbar & footer: quiet, considered chrome instead of
   borderless-and-shadowless-by-accident. ---- */

.vine-navbar {
  border-bottom: 1px solid var(--border-color);
}

.dropdown-menu {
  border: 1px solid var(--border-color);
  box-shadow: 0 1px 2px rgba(15, 18, 34, 0.04), 0 16px 32px rgba(15, 18, 34, 0.10);
}

[data-theme="dark"] .dropdown-menu {
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3), 0 16px 32px rgba(0, 0, 0, 0.4);
}

.footer-top {
  background: var(--surface-subtle);
}

/* ---- Primary/secondary buttons: give the brand CTA real
   presence instead of a flat, shadowless color swap. ---- */

.btn-mint,
.btn-outline-mint {
  border-radius: 999px;
  font-weight: 600;
}

.btn-mint {
  box-shadow: 0 10px 24px rgba(8, 190, 171, 0.28);
}

.btn-mint:hover {
  box-shadow: 0 14px 28px rgba(8, 190, 171, 0.34);
  transform: translateY(-1px);
}

.btn-outline-mint:hover {
  transform: translateY(-1px);
}

/* ---- Result-page badges: a mint pairing (solid + soft) to replace
   the vendor's default bg-warning/bg-primary combo. ---- */

.badge-mint {
  background: #0cc1b9;
  color: #ffffff;
}

.progress-bar-mint {
  background-color: #0cc1b9;
}

.badge-mint-soft {
  background: rgba(12, 193, 185, 0.14);
  color: #068b85;
}

[data-theme="dark"] .badge-mint-soft {
  background: rgba(12, 193, 185, 0.22);
  color: #7ee4dc;
}

/* ---- About page "charm" list: plain bulletless text becomes
   a set of quiet accent-bordered rows. Scoped to the #uniqueness
   id, which only exists on the about page. ---- */

#uniqueness li {
  padding: 1.1rem 1.25rem 1.1rem 1.5rem;
  margin-bottom: 0.9rem;
  border-radius: 12px;
  border-left: 3px solid #0cc1b9;
  background: var(--surface-subtle);
}

#uniqueness li b {
  display: block;
  margin-bottom: 0.35rem;
  font-size: 1.05rem;
  color: var(--theme-black);
}

#uniqueness li span {
  color: var(--text-color);
  line-height: 1.6;
}

/* ---- Remove the dated decorative dash under page titles. ---- */

.title-01 h1::after,
.title-02 h1::after {
  content: none;
}

/* ---- Stat counter cards: a tighter, less diffuse "soft-UI"
   card shadow, with a hairline border for definition. ---- */

.counter-item {
  border-radius: 16px;
  border: 1px solid var(--border-color);
  box-shadow: 0 1px 2px rgba(15, 18, 34, 0.03), 0 12px 24px rgba(15, 18, 34, 0.05);
}

[data-theme="dark"] .counter-item {
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2), 0 12px 24px rgba(0, 0, 0, 0.28);
}

/* ---- Dashboard overview stat cards: the vendor's plain .card is
   borderless and shadowless by default, so the whole stat grid reads
   as flat white boxes with no edges. Scoped to the overview capture
   region so it doesn't touch .card elsewhere on the site. ---- */

.dashboard-overview-capture .card {
  border: 1px solid var(--border-color);
  box-shadow: 0 1px 2px rgba(15, 18, 34, 0.03), 0 12px 24px rgba(15, 18, 34, 0.05);
}

[data-theme="dark"] .dashboard-overview-capture .card {
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.25), 0 12px 24px rgba(0, 0, 0, 0.3);
}