/* Shared Able primitives for the focused Bootstrap 5 public surfaces. */
:root {
  color-scheme: light;
  --able-ink: #20202b;
  --able-muted: #686877;
  --able-brand: #6552e8;
  --able-brand-dark: #4c3abf;
  --able-brand-soft: #eeebff;
  --able-canvas: #f7f7fb;
  --able-line: #dddde7;
  --able-danger: #b33a47;
  --able-card-shadow: 0 24px 70px rgba(32, 32, 43, .13);
  --bs-primary: var(--able-brand);
  --bs-primary-rgb: 101, 82, 232;
  --bs-body-color: var(--able-ink);
  --bs-body-bg: var(--able-canvas);
  --bs-link-color: var(--able-brand);
  --bs-link-hover-color: var(--able-brand-dark);
  --bs-border-color: var(--able-line);
  --bs-focus-ring-color: rgba(101, 82, 232, .25);
  --bs-font-sans-serif: "Instrument Sans", sans-serif;
}

.public-modern,
.public-modern * { box-sizing: border-box; }

body.public-modern {
  min-width: 320px;
  min-height: 100vh;
  margin: 0;
  background: var(--able-canvas);
  color: var(--able-ink);
  font-family: "Instrument Sans", Arial, sans-serif;
}

.public-modern a:not(.btn) { color: var(--able-brand-dark); }
.public-modern a:not(.btn):hover { color: var(--able-brand); }

.public-modern .btn-primary {
  --bs-btn-color: #fff;
  --bs-btn-bg: var(--able-brand);
  --bs-btn-border-color: var(--able-brand);
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: var(--able-brand-dark);
  --bs-btn-hover-border-color: var(--able-brand-dark);
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: var(--able-brand-dark);
  --bs-btn-active-border-color: var(--able-brand-dark);
  --bs-btn-disabled-color: #fff;
  --bs-btn-disabled-bg: var(--able-brand);
  --bs-btn-disabled-border-color: var(--able-brand);
  font-weight: 600;
}

.public-modern .btn-outline-primary {
  --bs-btn-color: var(--able-brand-dark);
  --bs-btn-border-color: var(--able-brand);
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: var(--able-brand);
  --bs-btn-hover-border-color: var(--able-brand);
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: var(--able-brand-dark);
  --bs-btn-active-border-color: var(--able-brand-dark);
}

.public-modal-content {
  border: 0;
  border-radius: 12px;
  box-shadow: var(--able-card-shadow);
}

@media print {
  body.public-modern { background: #fff; }
}