/* Light, clean UI — start fresh */
:root{ --tp-primary:#8071fe; --tp-border:#8071fe; --tp-text:#111827; --tp-muted:#6b7280; }
html,body{ margin:0; padding:0; font-family:'Inter', system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif; color:var(--tp-text); background:#fff; }

/* Navbar logo block */
.brand-square{ width:28px; height:28px; font-size:14px; line-height:1; background:transparent; color:#111827; border:none; overflow:hidden; }

/* Buttons use a simple brand color */
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:12px;
  font-weight:600;
  padding:.625rem 1rem !important; /* default padding for all buttons */
  line-height:1.25;
  text-decoration:none;
  cursor:pointer;
  border:1px solid transparent; /* ensure outline variants render borders */
}
a.btn{ appearance:none; -webkit-appearance:none; text-decoration:none; }

/* Compact size */
.btn-sm{
  padding:.45rem .75rem !important;
  font-size:.875rem;
  border-radius:10px;
}
a.btn{ appearance:none; -webkit-appearance:none; text-decoration:none; }
.btn:active{ transform: translateY(1px); }
/* Outline and ghost styles */
.btn-outline-secondary, .btn-outline-dark{
  color: var(--tp-primary);
  border-color: var(--tp-primary);
  background: linear-gradient(#fff,#fff) padding-box, linear-gradient(180deg, rgba(128,113,254,.35), rgba(128,113,254,.15)) border-box;
}
.btn-outline-secondary:hover, .btn-outline-dark:hover{ color:#fff !important; background: var(--tp-primary) !important; border-color: var(--tp-primary) !important; box-shadow: 0 4px 14px rgba(128,113,254,.25); }
.btn-ghost{ color: var(--tp-primary); background: transparent; border: none; }
.btn-ghost:hover{ background: rgba(128,113,254,.06); }
/* Soft variant */
.btn-soft{
  color:#fff; background: linear-gradient(180deg, #8b7bff, #6f61fd);
  border:1px solid #6f61fd;
  box-shadow: 0 8px 22px rgba(128,113,254,.35);
}
.btn-soft:hover{ color:#fff !important; background: linear-gradient(180deg, #7366ff, #5a4afc) !important; border-color:#5a4afc !important; }
.btn-outline-primary{ color:var(--tp-primary); border-color:var(--tp-primary); background: linear-gradient(#fff,#fff) padding-box, linear-gradient(180deg, rgba(128,113,254,.35), rgba(128,113,254,.15)) border-box; padding:.5rem 1rem !important; }
.btn-outline-primary:hover{ color:#fff; background-color:var(--tp-primary); }

/* Refined primary button - elegant violet with thinner profile */
.btn-primary{
  color:#fff;
  background: linear-gradient(135deg, #8b7bff, #6f61fd);
  border:1px solid rgba(111, 97, 253, 0.8);
  transition: all .2s ease;
  font-weight: 500;
  letter-spacing: -0.01em;
}
.btn-primary:hover, .btn-primary:focus{ 
  background: linear-gradient(135deg, #7366ff, #5a4afc); 
  border-color:#5a4afc; 
  box-shadow: 0 4px 12px rgba(111, 97, 253, 0.25);
  transform: translateY(-0.5px);
}
.btn-primary.btn-sm{ 
  padding: .4rem .7rem !important;
  font-size: .8125rem;
  font-weight: 500;
}

/* Cards and inputs are always light */
.card{
  background:#fff;
  border-radius:8px;
  border:1px solid #e5e7eb !important;
  box-shadow: 0 1px 3px rgba(0,0,0,.08);
}
.card:hover{ box-shadow: 0 2px 6px rgba(0,0,0,.10); }
.card-accent{
  border-color: #e5e7eb !important;
  box-shadow: 0 1px 3px rgba(0,0,0,.08);
}
.badge{
  display:inline-flex;
  align-items:center;
  gap:.35rem;
  border-radius:9999px;
  padding:.375rem .625rem;
  font-weight:600;
  font-size:.8125rem;
  line-height:1;
  border:1px solid transparent;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.6);
}
.badge.bg-success-subtle{ background:#ecfdf5!important; color:#065f46!important; border-color:#bbf7d0!important; }
.badge.bg-secondary-subtle{ background:#f3f4f6!important; color:#4b5563!important; border-color:#e5e7eb!important; }
.border-success-subtle{ border-color:#bbf7d0!important; }
.badge.status-active{
  /* Explicitly override Bootstrap badge variables */
  --bs-badge-bg: #86efac;
  --bs-badge-color: #064e3b;
  --bs-badge-border-radius: 9999px;
  background: linear-gradient(180deg, #a7f3d0, #6ee7b7) !important;
  color:#064e3b !important;
  border-color:#34d399 !important;
  box-shadow: 0 1px 2px rgba(6,95,70,.12), inset 0 1px 0 rgba(255,255,255,.7);
}
.badge.status-neutral{
  --bs-badge-bg: #e5e7eb;
  --bs-badge-color: #374151;
  --bs-badge-border-radius: 9999px;
  background: linear-gradient(180deg, #e5e7eb, #d1d5db) !important;
  color:#374151 !important;
  border-color:#9ca3af !important;
  box-shadow: 0 1px 2px rgba(55,65,81,.1), inset 0 1px 0 rgba(255,255,255,.7);
}
.badge.status-warning{
  --bs-badge-bg: #fbbf24;
  --bs-badge-color: #92400e;
  --bs-badge-border-radius: 9999px;
  background: linear-gradient(180deg, #fde68a, #fbbf24) !important;
  color:#92400e !important;
  border-color:#f59e0b !important;
  box-shadow: 0 1px 2px rgba(146,64,14,.12), inset 0 1px 0 rgba(255,255,255,.7);
}
.badge.status-active::before,
.badge.status-neutral::before,
.badge.status-warning::before{
  content:"";
  display:inline-block;
  width:6px; height:6px;
  border-radius:50%;
  margin-right:.4rem;
  vertical-align:middle;
}
.badge.status-active::before{ background:#059669; box-shadow:0 0 0 2px rgba(5,150,105,.2); }
.badge.status-neutral::before{ background:#6b7280; box-shadow:0 0 0 2px rgba(107,114,128,.18); }
.badge.status-warning::before{ background:#d97706; box-shadow:0 0 0 2px rgba(217,119,6,.22); }
.form-control{ background:#fff!important; color:var(--tp-text)!important; border-color: var(--tp-border)!important; }
.form-control::placeholder{ color:#9ca3af; }

/* Hero helpers */
.hero-eyebrow{ letter-spacing:.08em; color:var(--tp-primary); font-weight:700; text-transform:uppercase; }
.preview-panel{ min-height:260px; background: radial-gradient(1200px 300px at -10% 0%, #f5f3ff, transparent), radial-gradient(800px 300px at 110% 70%, #eef2ff, transparent); border:1px solid #eef2ff; border-radius:8px; }

/* Utility */
.text-secondary{ color:var(--tp-muted)!important; }
.shadow-soft{ box-shadow:0 1px 3px rgba(0,0,0,.08); }
.shadow-focus{ box-shadow:0 0 0 .2rem rgba(128,113,254,.15)!important; }
/* Viewport helper */
.min-vh-60{ min-height:60vh; }

/* Email CTA styling to match reference */
.email-cta .form-control{
  border-width:2px;
  border-color: var(--tp-border) !important;
  border-radius:12px;
}
.email-cta .form-control:focus{
  border-color: var(--tp-primary) !important;
  box-shadow: 0 0 0 .2rem rgba(128,113,254,.15);
}
.email-cta .btn{
  border-radius:12px;
  padding-left:1.25rem; padding-right:1.25rem;
}

/* Auth page polish */
.auth-hero{
  background:
    radial-gradient(1200px 320px at -10% 0%, #f5f3ff 20%, transparent 60%),
    radial-gradient(900px 320px at 110% 90%, #eef2ff 20%, transparent 60%);
}
.auth-card{
  max-width:560px;
  margin-left:auto; margin-right:auto;
  background:#fff;
  border:1px solid #e5e7eb;
  border-radius:8px;
  box-shadow: 0 2px 8px rgba(0,0,0,.08);
  padding: 1.25rem 1.25rem 1.5rem;
}
.auth-card .form-control{ border-width:2px; border-radius:12px; }
.auth-card .btn{ border-radius:12px; }

/* Minimal page wrapper when there is no navbar/footer */
.page-center{
  min-height: min(88vh, 900px);
  display:flex; align-items:center; justify-content:center;
}
/* Global border tint for typical components */
.border, .list-group-item, .badge.border{ border-color: var(--tp-border) !important; }

/* Header spacing adjustments */
header .brand-square{ width:28px; height:28px; }
header .fw-semibold{ font-weight:600; }

/* Page header */
.page-header{
  display:flex; align-items:flex-start; justify-content:space-between; gap:1rem;
}
.page-title{
  font-weight:800; letter-spacing:-.01em;
}
.page-subtitle{ color:var(--tp-muted); }

/* Elegant text links */
.link-elegant{
  color: #6f61fd;
  text-decoration: underline;
  text-decoration-color: rgba(111, 97, 253, 0.35);
  text-underline-offset: 3px;
  text-decoration-thickness: 1px;
  transition: all 0.2s ease;
}
.link-elegant:hover{
  color: #5a4afc;
  text-decoration-color: rgba(90, 74, 252, 0.65);
  text-underline-offset: 2px;
}