/* anserve.ai shared stylesheet — consolidated 28 Aug 2026 from previously-duplicated
   per-page <style> blocks. Loaded on every page after bootstrap.min.css; page-specific
   <style> blocks (if any remain) load after this file and override where a page's design
   genuinely differs (e.g. index.php's dark hero). */

:root {
  --brand: #5c55ed;
  --text: #111827;
  --muted: #6b7280;
  --card: #ffffff;
  --bg: #f8fafc;
}

body {
  color: var(--text);
}

a {
  text-decoration: none;
}

.section-title {
  letter-spacing: -.02em;
}

.small-muted {
  color: var(--muted);
  font-size: .95rem;
}

.text-muted-custom {
  color: var(--muted);
}

.card {
  border: 1px solid rgba(0, 0, 0, .08);
  border-radius: 18px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, .04);
}

.icon-pill {
  width: 42px;
  height: 42px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(92, 85, 237, .12);
  color: var(--brand);
  flex: 0 0 auto;
}

.hero {
  padding: 5.5rem 0 3.5rem;
  background:
    radial-gradient(1200px 600px at 10% 0%, rgba(92, 85, 237, .15), transparent 60%),
    radial-gradient(900px 500px at 90% 20%, rgba(92, 85, 237, .10), transparent 55%);
}

.navbar {
  backdrop-filter: blur(8px);
}

.badge-soft i {
  font-size: .95rem;
  opacity: .9;
}

.breadcrumb {
  --bs-breadcrumb-divider: '›';
}

footer {
  border-top: 1px solid rgba(0, 0, 0, .08);
}

.table th {
  white-space: nowrap;
}

/* Feature/comparison-table indicator colors (used on comparison pages) */
.check {
  color: #16a34a;
  font-weight: bold;
}

.cross {
  color: #dc2626;
}

.partial {
  color: #d97706;
}

/* Header/footer logo sizing — intrinsic size set via width/height attrs on the <img>
   (400x118 source), CSS pins the display height and lets width follow automatically. */
.navbar-brand img {
  height: 36px;
  width: auto;
}

.footer-brand img {
  height: 42px;
  width: auto;
}

/* ---- Brand recolor: purple (#5c55ed) replacing Bootstrap's default primary blue ----
   bootstrap.min.css is loaded precompiled from CDN, so most components hardcode their
   own component-scoped custom property (e.g. .btn-primary sets --bs-btn-bg itself)
   rather than reading the root --bs-primary variable. Overriding those same properties
   here (loaded after bootstrap.min.css, same selector/specificity, later source order
   wins) re-themes them without a Sass rebuild. */
a {
  color: #5c55ed;
}

/* Exclude .btn: the generic a:hover/a:focus colour would otherwise beat Bootstrap's
   .btn colour (specificity 0,1,1 vs 0,1,0) and leave a dark-purple label on the purple
   button after navigating back (the link keeps focus / :visited state). */
a:not(.btn):hover,
a:not(.btn):focus {
  color: #4f49cb;
}

.btn-primary,
.btn-primary:visited,
.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active {
  color: #fff;
}

.btn-primary {
  --bs-btn-bg: #5c55ed;
  --bs-btn-border-color: #5c55ed;
  --bs-btn-hover-bg: #4f49cb;
  --bs-btn-hover-border-color: #4f49cb;
  --bs-btn-active-bg: #4540b4;
  --bs-btn-active-border-color: #4540b4;
  --bs-btn-disabled-bg: #5c55ed;
  --bs-btn-disabled-border-color: #5c55ed;
  --bs-btn-focus-shadow-rgb: 92, 85, 237;
}

.btn-outline-primary {
  --bs-btn-color: #5c55ed;
  --bs-btn-border-color: #5c55ed;
  --bs-btn-hover-bg: #5c55ed;
  --bs-btn-hover-border-color: #5c55ed;
  --bs-btn-active-bg: #5c55ed;
  --bs-btn-active-border-color: #5c55ed;
  --bs-btn-disabled-color: #5c55ed;
  --bs-btn-disabled-border-color: #5c55ed;
  --bs-btn-focus-shadow-rgb: 92, 85, 237;
}

.text-primary {
  color: #5c55ed !important;
}

.bg-primary {
  background-color: #5c55ed !important;
}

.text-bg-primary {
  background-color: #5c55ed !important;
}

.border-primary {
  border-color: #5c55ed !important;
}
