/* =========================================
   public-theme.css
   Light theme overrides for ALL /public pages
   - put this AFTER base.css and components.css
   - keep page-specific styles in page css files
   ========================================= */

body.public{
  /* Core palette */
  --bg: #ffffff;
  --text: rgba(11,13,18,0.92);
  --muted: rgba(11,13,18,0.62);
  --muted2: rgba(11,13,18,0.46);
  --border: rgba(11,13,18,0.10);

  /* Soft elevation */
  --shadow: 0 14px 40px rgba(11,13,18,0.06);

  background: var(--bg);
  color: var(--text);

  -webkit-font-smoothing: antialiased;
  text-rendering: geometricPrecision;
}

/* Links */
body.public a{
  color: inherit;
  text-decoration: none;
}
body.public a:hover{
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* “Card-ish” surfaces used across public pages */
body.public .card{
  background: rgba(255,255,255,0.78);
  border: 1px solid rgba(11,13,18,0.08);
  border-radius: 18px;
  box-shadow: var(--shadow);
}

/* If any base styles set a dark page background on wrappers */
body.public main,
body.public .container{
  background: transparent;
}

/* Horizontal distance on all public pages — left and right margin */
body.public .container{
  padding-left: 24px;
  padding-right: 24px;
}

/* Inputs (if you have public forms later) */
body.public input,
body.public textarea,
body.public select{
  color: var(--text);
  background: rgba(255,255,255,0.92);
  border: 1px solid rgba(11,13,18,0.14);
  border-radius: 12px;
}

/* Selection */
body.public ::selection{
  background: rgba(11,13,18,0.10);
}