/* Lighthouse Beets — tenant portal style tokens
   Drop into the tenant front end. Fonts:
   <link href="https://fonts.googleapis.com/css2?family=Newsreader:ital,opsz,wght@0,6..72,400..700;1,6..72,400..700&family=Source+Sans+3:wght@400..700&display=swap" rel="stylesheet">
*/
:root{
  /* colour */
  --bg:#FAF8F5;            /* warm off-white page */
  --card:#FFFFFF;          /* card surface */
  --ink:#1C1B19;           /* near-black text */
  --ink-soft:#6B655B;      /* secondary text, warm grey */
  --hairline:#E8E3DB;      /* borders, dividers */
  --accent:#17505F;        /* the ONE accent — links, active, sign CTA */
  --accent-hover:color-mix(in oklab,var(--accent),black 12%);
  --on-accent:#FAF8F5;
  --flag:#A14D21;          /* "action needed" only */
  --flag-bg:#F9EFE6;
  --ok:#3E7355;            /* signed / done */
  --ok-bg:#EDF3EE;

  /* type */
  --font-display:'Newsreader',Georgia,serif;   /* headings, addresses, key dates */
  --font-body:'Source Sans 3',system-ui,sans-serif;
  --mono:ui-monospace,'SF Mono',Menlo,monospace; /* sha-256, refs, small print codes */

  /* shape */
  --radius:10px;
  --radius-lg:14px;
  --shadow:0 1px 2px rgba(28,27,25,.04),0 6px 20px rgba(28,27,25,.05);

  /* spacing scale: 4 8 12 16 24 32 48 */
}

body{margin:0;background:var(--bg);color:var(--ink);
  font:17px/1.6 var(--font-body);-webkit-font-smoothing:antialiased}

h1,h2,h3,.display{font-family:var(--font-display);font-weight:500;line-height:1.15;letter-spacing:-.01em}
a{color:var(--accent);font-weight:600;text-decoration:underline;text-underline-offset:3px}
small,.small{font-size:14px;color:var(--ink-soft)}

.card{background:var(--card);border:1px solid var(--hairline);
  border-radius:var(--radius-lg);box-shadow:var(--shadow)}

.label{font-size:13px;font-weight:600;letter-spacing:.1em;
  text-transform:uppercase;color:var(--ink-soft)}

.btn{display:inline-flex;align-items:center;justify-content:center;
  min-height:48px;padding:12px 22px;border-radius:var(--radius);border:0;
  background:var(--accent);color:var(--on-accent);
  font:600 16px var(--font-body);cursor:pointer}
.btn:hover{background:var(--accent-hover)}
.btn.secondary{background:var(--card);color:var(--ink);border:1px solid var(--hairline)}

.pill{font-size:13px;font-weight:600;padding:5px 12px;border-radius:999px;white-space:nowrap}
.pill.need{background:var(--flag-bg);color:var(--flag)}
.pill.done{background:var(--ok-bg);color:var(--ok)}

input[type=text],input[type=email],textarea{
  padding:12px 14px;border:1px solid #D8D1C6;border-radius:var(--radius);
  font:16px var(--font-body);background:#fff;box-sizing:border-box}
input:focus,textarea:focus{outline:2px solid var(--accent);outline-offset:1px;border-color:var(--accent)}