/* Shared public-page skin. Keep coupon, detail, and join pages visually aligned
   with the storefront without changing the publisher or admin workspace. */
:root {
  --forsa-ink: #142b35;
  --forsa-green: #087f5b;
  --forsa-green-dark: #066343;
  --forsa-mint: #d8f5df;
  --forsa-paper: #f6f7f3;
  --forsa-line: #dce6df;
  --forsa-muted: #5f746a;
  --forsa-amber: #c47d18;
}

body.forsa-public {
  background: var(--forsa-paper);
  color: var(--forsa-ink);
  background-image: none;
}

.forsa-public .public-header {
  background: rgba(255, 255, 255, .94);
  border-color: var(--forsa-line);
  backdrop-filter: blur(16px);
}

.forsa-public .public-logo-mark {
  background: var(--forsa-green);
  box-shadow: none;
}

.forsa-public .public-logo-title,
.forsa-public .public-heading,
.forsa-public .public-card h3,
.forsa-public .public-card h4 {
  color: var(--forsa-ink);
}

.forsa-public .public-logo-subtitle,
.forsa-public .public-copy,
.forsa-public .public-meta {
  color: var(--forsa-muted);
}

.forsa-public .text-white { color: var(--forsa-ink) !important; }
.forsa-public .text-slate-300,
.forsa-public .text-slate-400,
.forsa-public .text-slate-500 { color: var(--forsa-muted) !important; }
.forsa-public .bg-slate-950,
.forsa-public .bg-slate-950\/60,
.forsa-public .bg-slate-950\/70,
.forsa-public .bg-slate-950\/80,
.forsa-public .bg-slate-900,
.forsa-public .bg-slate-900\/90,
.forsa-public .bg-slate-800,
.forsa-public .bg-slate-800\/80 {
  background-color: #f4f8f4 !important;
  color: var(--forsa-ink) !important;
}
.forsa-public .border-white\/10,
.forsa-public .border-white\/\[0\.08\],
.forsa-public .border-white\/15 { border-color: var(--forsa-line) !important; }
.forsa-public .public-primary,
.forsa-public .public-primary.text-white,
.forsa-public .public-primary .text-white { color: #fff !important; }
.forsa-public .bg-gradient-to-r.from-rose-600,
.forsa-public .bg-gradient-to-r.from-rose-500 { background-image: none !important; background-color: var(--forsa-green) !important; }
.forsa-public .text-rose-400,
.forsa-public .text-rose-300,
.forsa-public .text-amber-300,
.forsa-public .text-amber-400 { color: var(--forsa-amber) !important; }

.forsa-public .public-hero {
  background: var(--forsa-mint);
  border: 1px solid #c5e9ce;
  box-shadow: 0 14px 36px rgba(20, 43, 53, .07);
}

.forsa-public .public-card,
.forsa-public .public-panel {
  background: #fff;
  border: 1px solid var(--forsa-line);
  color: var(--forsa-ink);
  box-shadow: 0 10px 28px rgba(20, 43, 53, .06);
}

.forsa-public .public-code {
  background: #f4faf5;
  border-color: #b8ddc1;
  color: var(--forsa-green-dark);
}

.forsa-public .public-primary {
  background: var(--forsa-green);
  color: #fff;
}

.forsa-public .public-primary:hover { background: var(--forsa-green-dark); }

.forsa-public .public-secondary {
  background: #fff;
  color: var(--forsa-ink);
  border-color: var(--forsa-line);
}

.forsa-public .public-footer {
  background: var(--forsa-ink);
  color: #d8f5df;
  border-color: transparent;
}

.forsa-public .public-footer a { color: #fff; }

.forsa-join { min-height: 100vh; }
.forsa-join .bg-gray-900\/90 {
  background: #fff !important;
  border-color: var(--forsa-line) !important;
  color: var(--forsa-ink) !important;
}
.forsa-join .bg-white\/5 { background: #f4faf5 !important; border-color: var(--forsa-line) !important; }
.forsa-join .text-gray-300,
.forsa-join .text-gray-500 { color: var(--forsa-muted) !important; }
.forsa-join .text-white { color: var(--forsa-ink) !important; }
.forsa-join a.text-white { color: #fff !important; }
.forsa-join .border-white\/10 { border-color: var(--forsa-line) !important; }

.forsa-public .public-stamp {
  color: var(--forsa-green-dark);
  background: #e6f5eb;
  border-color: #c5e9ce;
}

@media (max-width: 640px) {
  .forsa-public .public-header-inner { padding: 10px 14px; }
  .forsa-public .public-hero { border-radius: 22px; padding: 24px 18px; }
  .forsa-public .public-card,
  .forsa-public .public-panel { border-radius: 18px; }
  .forsa-public .public-mobile-stack { flex-direction: column; align-items: stretch; }
  .forsa-public .public-mobile-stack > * { width: 100%; }
}

@media (prefers-reduced-motion: reduce) {
  .forsa-public *, .forsa-public *::before, .forsa-public *::after {
    animation: none !important;
    transition: none !important;
  }
}
