:root {
  /* Base theme colors */
  --pt-primary: #6b4a7e; /* aligns with violet-700 */
  --pt-primary-hover: #5a3c6a;
  --pt-secondary: #c7a5d9; /* lilac-300 */
  --pt-accent: #eac3d1; /* rose-200 */
  --pt-text: #17354a; /* blue-900 */
  --pt-text-muted: #334155; /* text-700 */
  --pt-surface: #ffffff;
  --pt-app-bg: #faf7f9; /* offwhite */

  /* Headings */
  --pt-heading-color: var(--pt-text);
  --pt-heading-contrast: var(--pt-primary);

  /* Background */
  --pt-background: linear-gradient(135deg, rgba(234,195,209,0.18), rgba(199,165,217,0.18));

  /* Focus ring */
  --pt-focus-ring: 0 0 0 3px rgba(213,182,107,0.45);
}

html { scroll-behavior: smooth; }
body {
  background: var(--pt-background), var(--pt-app-bg);
  color: var(--pt-text);
  font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  line-height: 1.7;
}

h1, h2, h3, h4, h5, h6 {
  color: var(--pt-heading-color);
  letter-spacing: 0.2px;
}

.heading-accent { position: relative; display: inline-block; }
.heading-accent::after {
  content: "";
  position: absolute; left: 0; bottom: -10px;
  width: 64px; height: 4px;
  background: linear-gradient(90deg, var(--pt-heading-contrast), var(--pt-secondary));
  border-radius: 2px;
}

/* Buttons and standard UI components */
.btn-primary { background-color: var(--pt-primary) !important; border-color: var(--pt-primary) !important; color: #fff !important; }
.btn-primary:hover { background-color: var(--pt-primary-hover) !important; border-color: var(--pt-primary-hover) !important; }
.btn-outline-primary { color: var(--pt-primary) !important; border-color: var(--pt-primary) !important; }
.btn-outline-primary:hover { color: #fff !important; background-color: var(--pt-primary) !important; }

.card { background: var(--pt-surface); border: 1px solid rgba(27,31,59,0.10); border-radius: 16px; box-shadow: 0 10px 24px rgba(27,31,59,0.06); }
.card .card-header { background: transparent; border-bottom: 0; color: var(--pt-text); font-weight: 600; }
.text-muted { color: var(--pt-text-muted) !important; }

/* Forms */
.form-label { color: var(--pt-text-muted); }
.form-control { border-radius: 12px; border-color: rgba(27,31,59,0.18); }
.form-control:focus { box-shadow: var(--pt-focus-ring); border-color: var(--pt-primary); }

/* Accessibility helpers */
:focus-visible { box-shadow: var(--pt-focus-ring); border-radius: 8px; }
.text-on-light { color: var(--pt-text); }
.bg-on-app { background-color: var(--pt-app-bg); }

/* Responsive heading sizes */
@media (max-width: 992px) {
  h1 { font-size: 2.2rem; }
  h2 { font-size: 1.8rem; }
}
@media (max-width: 576px) {
  h1 { font-size: 1.8rem; }
  h2 { font-size: 1.5rem; }
}

/* Dark mode */
@media (prefers-color-scheme: dark) {
  :root {
    --pt-app-bg: #12131a;
    --pt-surface: #171821;
    --pt-text: #e6e8ee;
    --pt-text-muted: #a8b0c0;
    --pt-background: linear-gradient(135deg, rgba(107,74,126,0.25), rgba(199,165,217,0.18));
    --pt-heading-color: #e6e8ee;
    --pt-heading-contrast: #c7a5d9;
  }
  body { background: var(--pt-background), var(--pt-app-bg); color: var(--pt-text); }
  .card { border-color: rgba(255,255,255,0.08); box-shadow: 0 10px 24px rgba(0,0,0,0.3); }
  .btn-outline-primary { color: var(--pt-secondary) !important; border-color: var(--pt-secondary) !important; }
  .btn-outline-primary:hover { color: #111 !important; background-color: var(--pt-secondary) !important; }
}
