/* Lasso "Western" theme — layered on top of Velzon + lasso-overrides.
 * Goal: cowboy flavor without breaking the Shield Management brand.
 * The Shield blue/cyan stays as the action color; we add saddle-leather
 * accents, a Western display font for headings, rope dividers, and
 * sheriff-star/lasso/horseshoe motifs sprinkled in.
 *
 * Palette:
 *   Saddle    #8B5A2B   leather / rope
 *   Buckskin  #D4A55A   light rope highlight
 *   Sunset    #C0392B   accent only (CTA-adjacent)
 *   Dust      #F5EFE1   page-bg tint
 *   Coal      #3D2710   deep brown for borders/text accents
 */

@import url("https://fonts.googleapis.com/css2?family=Rye&family=Smokum&family=Special+Elite&display=swap");

:root {
  --western-saddle:   #8B5A2B;
  --western-buckskin: #D4A55A;
  --western-sunset:   #C0392B;
  --western-dust:     #F5EFE1;
  --western-coal:     #3D2710;
}

/* ---------- Page background: faint parchment ---------- */
body {
  background:
    radial-gradient(circle at 5% 5%, rgba(212,165,90,.06), transparent 40%),
    radial-gradient(circle at 95% 90%, rgba(139,90,43,.05), transparent 45%),
    #FBF8F1;
}
[data-bs-theme="light"] .page-content { background: transparent; }

/* ---------- Display font for big headings ---------- */
h1, .page-title-box h4,
.card-title-western,
.brand-wordmark {
  font-family: "Rye", "Smokum", "Georgia", serif;
  letter-spacing: .02em;
}
.font-western { font-family: "Rye", serif !important; }
.font-typewriter { font-family: "Special Elite", "Courier New", monospace !important; }

/* ---------- Brand mark: lasso loop instead of plain "L" ---------- */
.brand-mark {
  background-image: url("/static/img/lasso-loop.svg");
  background-size: 70% 70%;
  background-repeat: no-repeat;
  background-position: center;
  background-color: #FFF8E7;
  color: transparent;            /* hides the fallback "L" glyph */
  border: 1px solid var(--western-buckskin);
  box-shadow: 0 2px 8px rgba(139,90,43,.30);
}

/* Sidebar wordmark gets Western font, white on dark sidebar */
.logo-lg .fw-semibold { font-family: "Rye", serif; letter-spacing: .04em; }

/* ---------- Rope divider under topbar ---------- */
#page-topbar::after {
  content: "";
  display: block;
  height: 8px;
  background: url("/static/img/rope-divider.svg") repeat-x center / auto 8px;
  opacity: .85;
}

/* ---------- Sheriff-star badges for the top-right user pill ---------- */
.topbar-user .avatar-xs {
  background: url("/static/img/sheriff-star.svg") center/85% no-repeat,
              linear-gradient(135deg, #FFD66B 0%, #C9962D 100%) !important;
  color: transparent !important;
}

/* ---------- Sidebar accents: leather seam ---------- */
.app-menu {
  border-right: 3px solid var(--western-saddle);
}
.app-menu .menu-title {
  color: var(--western-buckskin) !important;
  text-transform: uppercase;
  letter-spacing: .12em;
  font-size: 11px;
  border-top: 1px dashed rgba(212,165,90,.30);
  padding-top: .75rem !important;
  margin-top: .5rem;
}
.app-menu .menu-title:first-child { border-top: 0; }
.app-menu .nav-link.menu-link:hover { background: rgba(139,90,43,.18); }
.app-menu .nav-link.menu-link.active {
  background: linear-gradient(90deg, rgba(212,165,90,.22), transparent 70%);
  border-left: 3px solid var(--western-buckskin);
}

/* ---------- Cards: subtle wanted-poster vibe ---------- */
.card {
  border: 1px solid rgba(139,90,43,.12);
  box-shadow: 0 1px 3px rgba(61,39,16,.06), 0 4px 12px rgba(61,39,16,.04);
}
.card .card-header {
  background: linear-gradient(180deg, #FBF8F1 0%, #F5EFE1 100%);
  border-bottom: 1px solid rgba(139,90,43,.18);
  font-family: "Special Elite", "Georgia", serif;
  letter-spacing: .03em;
}

/* Wanted poster — used on dashboard hero / login */
.wanted-poster {
  background: #F5EFE1;
  border: 2px solid var(--western-coal);
  border-radius: 4px;
  padding: 1.75rem 1.5rem;
  box-shadow: inset 0 0 0 6px #FBF8F1, 0 6px 18px rgba(61,39,16,.18);
  position: relative;
  color: var(--western-coal);
}
.wanted-poster::before, .wanted-poster::after {
  content: "★";
  position: absolute; top: .5rem; color: var(--western-coal);
  font-size: 1.2rem;
}
.wanted-poster::before { left: 1rem; }
.wanted-poster::after  { right: 1rem; }
.wanted-poster h1, .wanted-poster h2, .wanted-poster .title {
  font-family: "Rye", serif;
  text-align: center;
  margin-bottom: .5rem;
}
.wanted-poster .reward {
  font-family: "Special Elite", monospace;
  text-align: center;
  text-transform: uppercase;
  letter-spacing: .15em;
  font-size: 12px;
  color: #5B3920;
}

/* ---------- Status badges: lean western (keep original colors but tweak font) ---------- */
.badge.st-raw, .badge.st-enriched, .badge.st-qualified,
.badge.st-in_pipeline, .badge.st-won, .badge.st-lost, .badge.st-rejected {
  font-family: "Special Elite", monospace;
  letter-spacing: .04em;
  text-transform: uppercase;
  font-size: 10.5px;
  padding: .35em .6em;
}

/* ---------- Buttons: primary button gets a subtle stitched border ---------- */
.btn-primary {
  background: linear-gradient(180deg, #046BD2 0%, #035BB8 100%);
  border: 1px solid #034E9D;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.12), 0 1px 0 rgba(0,0,0,.15);
}
.btn-primary:hover { background: linear-gradient(180deg, #0578E6 0%, #046BD2 100%); }

.btn-outline-saddle {
  color: var(--western-coal);
  border: 1px solid var(--western-saddle);
  background: #FFF8E7;
}
.btn-outline-saddle:hover {
  background: var(--western-buckskin); color: var(--western-coal);
}

/* ---------- Footer: brand the cowboy ---------- */
.footer {
  background: linear-gradient(180deg, #FBF8F1 0%, #F0E6D0 100%);
  border-top: 1px solid rgba(139,90,43,.25);
  font-family: "Special Elite", monospace;
  color: var(--western-coal);
}
.footer .yeehaw::before {
  content: "🤠 ";
}

/* ---------- Page-header "title-box" — adds a sheriff star on the left ---------- */
.page-title-box h4 {
  position: relative;
  padding-left: 38px;
}
.page-title-box h4::before {
  content: "";
  position: absolute;
  left: 0; top: 50%;
  width: 28px; height: 28px;
  transform: translateY(-50%);
  background: url("/static/img/sheriff-star.svg") center/contain no-repeat;
}

/* Per-page title icon override hook — pages can opt OUT or pick another */
.page-title-box.no-star h4 { padding-left: 0; }
.page-title-box.no-star h4::before { content: none; }
.page-title-box.icon-lasso h4::before    { background-image: url("/static/img/lasso-loop.svg"); }
.page-title-box.icon-horseshoe h4::before{ background-image: url("/static/img/horseshoe.svg"); }
.page-title-box.icon-hat h4::before      { background-image: url("/static/img/cowboy-hat.svg"); }

/* ---------- Login page: full wanted-poster treatment ---------- */
.auth-page-content .card {
  background: #F5EFE1 url("/static/img/rope-divider.svg") top/100% 10px repeat-x;
  border: 2px solid var(--western-coal) !important;
}
.auth-page-content .card::after {
  content: "";
  display: block;
  background: url("/static/img/rope-divider.svg") bottom/100% 10px repeat-x;
  height: 10px;
}

/* ---------- Empty-states ---------- */
.empty-tumbleweed {
  text-align: center;
  padding: 3rem 1rem;
  color: var(--western-coal);
  font-family: "Special Elite", monospace;
}
.empty-tumbleweed::before {
  content: "🌵";
  display: block;
  font-size: 3rem;
  margin-bottom: .5rem;
  opacity: .7;
}

/* ---------- Score-axis chips: bullet-marks ---------- */
.score-chip {
  display: inline-flex; align-items: center; gap: .25rem;
  background: #FFF8E7;
  border: 1px solid var(--western-buckskin);
  color: var(--western-coal);
  font-family: "Special Elite", monospace;
  font-size: 11px;
  padding: .15rem .5rem;
  border-radius: 999px;
}
.score-chip.s-high { background: #DCFCE7; border-color: #65A30D; color: #14532D; }
.score-chip.s-mid  { background: #FEF3C7; border-color: #B45309; color: #78350F; }
.score-chip.s-low  { background: #FEE2E2; border-color: #B91C1C; color: #7F1D1D; }

/* ---------- "Round'em up" CTA helper ---------- */
.btn-roundup {
  background: var(--western-saddle);
  border: 1px solid var(--western-coal);
  color: #FFF8E7;
  font-family: "Rye", serif;
  letter-spacing: .04em;
  padding: .5rem 1rem;
}
.btn-roundup:hover { background: var(--western-coal); color: #FFD66B; }

/* ---------- Small print: typewriter ---------- */
.text-muted, .form-text, .table-caption { font-family: "Special Elite", monospace; }
