/* Feliz Creek client portal. Same palette as the Wine Tools site: burgundy and gold on cream. */
:root{
  --burgundy:#6d1f34; --burgundy-dark:#4d1526; --gold:#b8892b;
  --card:#ffffff; --ink:#2b2320; --muted:#7a6f68; --border:#e5ddd2; --bg:#f3ede2; --ok:#3f7d4f;
  --field:#faf7f1; --warn:#a3342c; --info:#35607a; --soft:#f7f1e7;
  --shadow: 0 1px 3px rgba(60,30,20,0.08), 0 1px 2px rgba(60,30,20,0.06);
  --pill-new:#e8eef4; --pill-new-ink:#35607a;
  --pill-wait:#fbefd8; --pill-wait-ink:#86601a;
  --pill-ok:#e3f0e5; --pill-ok-ink:#2f6a3d;
  --pill-bad:#f6e1df; --pill-bad-ink:#9a3129;
  --pill-muted:#ece7e0; --pill-muted-ink:#6d635b;
  color-scheme: light;
}
:root[data-theme="dark"]{
  --burgundy:#c46b83; --burgundy-dark:#8f3a52; --gold:#d6ab5c;
  --card:#26201c; --ink:#f0e8df; --muted:#a89a8e; --border:#3a322b; --bg:#171310; --ok:#7fc98f;
  --field:#1f1a16; --warn:#e0837a; --info:#8fb8d0; --soft:#2d2621;
  --shadow: 0 1px 3px rgba(0,0,0,0.4);
  --pill-new:#22323d; --pill-new-ink:#9cc3db; --pill-wait:#3a2f1a; --pill-wait-ink:#e2bd6f;
  --pill-ok:#1f3324; --pill-ok-ink:#8fd19e; --pill-bad:#3d2320; --pill-bad-ink:#eb9a92;
  --pill-muted:#2f2925; --pill-muted-ink:#b3a79c;
  color-scheme: dark;
}
*{ box-sizing:border-box; }
[hidden]{ display:none !important; }
html{ padding-top:env(safe-area-inset-top, 0px); padding-bottom:env(safe-area-inset-bottom, 0px); }
body{ margin:0; font-family:-apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;
  background:var(--bg); color:var(--ink); line-height:1.45; font-size:14px; }
button, input, select, textarea{ font-family:inherit; font-size:14px; color:var(--ink); }
a{ color:var(--burgundy); }
h1{ font-size:21px; margin:0 0 4px; text-wrap:balance; }
h2{ font-size:16px; margin:0 0 10px; }
.muted{ color:var(--muted); }
:focus-visible{ outline:2px solid var(--gold); outline-offset:2px; }
.boot{ padding:40px 16px; text-align:center; color:var(--muted); }

.card{ background:var(--card); border:1px solid var(--border); border-radius:12px; box-shadow:var(--shadow); padding:16px; }
.pill{ display:inline-block; font-size:11.5px; font-weight:700; padding:2px 9px; border-radius:999px; white-space:nowrap; }
.p-new{ background:var(--pill-new); color:var(--pill-new-ink); }
.p-wait{ background:var(--pill-wait); color:var(--pill-wait-ink); }
.p-ok{ background:var(--pill-ok); color:var(--pill-ok-ink); }
.p-bad{ background:var(--pill-bad); color:var(--pill-bad-ink); }
.p-muted{ background:var(--pill-muted); color:var(--pill-muted-ink); }
.btn{ border:1px solid var(--border); background:var(--card); border-radius:8px; padding:8px 14px; cursor:pointer; font-weight:600; text-decoration:none; color:var(--ink); display:inline-block; }
.btn:hover{ border-color:var(--muted); }
.btn.primary{ background:var(--burgundy); border-color:var(--burgundy); color:#fff; }
.btn.gold{ background:var(--gold); border-color:var(--gold); color:#1d1408; }
.btn.sm{ padding:4px 10px; font-size:12.5px; }
.btn:disabled{ opacity:.55; cursor:default; }
table.list{ width:100%; border-collapse:collapse; }
table.list th{ text-align:left; font-size:11.5px; text-transform:uppercase; letter-spacing:.04em; color:var(--muted); font-weight:700; padding:6px 8px; border-bottom:1px solid var(--border); }
table.list td{ padding:9px 8px; border-bottom:1px solid var(--border); vertical-align:top; }
table.list tr[data-href]{ cursor:pointer; }
table.list tr[data-href]:hover td{ background:var(--soft); }
.tw{ overflow-x:auto; }
.note{ background:var(--soft); border:1px solid var(--border); border-radius:10px; padding:10px 12px; font-size:13.5px; }
.note.gold{ border-left:4px solid var(--gold); }
.note.warn{ border-left:4px solid var(--warn); }
.note.ok{ border-left:4px solid var(--ok); }
.errs{ color:var(--warn); font-weight:600; font-size:13px; }
.errs ul{ margin:6px 0 0; padding-left:18px; }
label.f{ display:block; font-size:12px; font-weight:700; color:var(--muted); }
label.f input, label.f textarea, label.f select{ display:block; width:100%; margin-top:4px; padding:9px 11px; border:1px solid var(--border); border-radius:8px; background:var(--field); font-weight:400; font-size:15px; }
label.f textarea{ min-height:90px; resize:vertical; }
.toast{ position:fixed; left:50%; bottom:calc(24px + env(safe-area-inset-bottom, 0px)); transform:translateX(-50%); background:var(--ink); color:var(--bg); padding:10px 16px; border-radius:10px; font-weight:600; font-size:13.5px; opacity:0; transition:opacity .2s; pointer-events:none; z-index:99; max-width:90vw; }
.toast.on{ opacity:1; }
@media (prefers-reduced-motion: reduce){ .toast{ transition:none; } }

/* top bar + layout */
.top{ background:var(--card); border-bottom:1px solid var(--border); position:sticky; top:0; z-index:20; }
.top .in{ max-width:1180px; margin:0 auto; padding:10px 16px; display:flex; align-items:center; gap:14px; flex-wrap:wrap; }
.brand{ font-weight:800; color:var(--burgundy); font-size:16px; text-decoration:none; }
.brand span{ font-weight:600; color:var(--muted); font-size:13px; margin-left:6px; }
.who{ margin-left:auto; font-size:13px; color:var(--muted); display:flex; gap:10px; align-items:center; flex-wrap:wrap; }
.who b{ color:var(--ink); }
.linkbtn{ background:none; border:none; padding:0; color:var(--burgundy); font-weight:600; cursor:pointer; font-size:13px; text-decoration:underline; }
.theme{ background:none; border:1px solid var(--border); border-radius:8px; padding:3px 8px; cursor:pointer; color:var(--muted); }
.layout{ max-width:1180px; margin:0 auto; padding:16px; display:grid; grid-template-columns:200px minmax(0, 1fr); gap:18px; }
@media (max-width:860px){ .layout{ grid-template-columns:minmax(0, 1fr); } }
.side a{ display:block; padding:9px 12px; border-radius:8px; color:var(--ink); text-decoration:none; font-weight:600; margin-bottom:2px; }
.side a:hover{ background:var(--card); }
.side a.on{ background:var(--burgundy); color:#fff; }
.side .cnt{ float:right; font-size:11.5px; opacity:.85; margin-left:8px; }
@media (max-width:860px){ .side{ display:flex; gap:4px; overflow-x:auto; } .side a{ white-space:nowrap; } }

/* home */
.stats{ display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:12px; margin:14px 0 16px; }
@media (max-width:620px){ .stats{ grid-template-columns:minmax(0,1fr); } }
.stat .lab{ font-size:11.5px; font-weight:700; text-transform:uppercase; letter-spacing:.04em; color:var(--muted); }
.stat .val{ font-size:24px; font-weight:800; margin-top:2px; font-variant-numeric:tabular-nums; }
.stat small{ color:var(--muted); }
.types{ display:grid; grid-template-columns:repeat(auto-fill, minmax(190px, 1fr)); gap:10px; margin:12px 0 18px; }
.type{ text-align:left; background:var(--card); border:1px solid var(--border); border-radius:12px; padding:12px; cursor:pointer; text-decoration:none; color:var(--ink); display:block; }
.type:hover{ border-color:var(--muted); }
.type.on{ border:2px solid var(--burgundy); padding:11px; }
.type .ic{ font-size:20px; }
.type b{ display:block; margin-top:4px; }
.type small{ display:block; margin-top:2px; font-size:12px; color:var(--muted); }
.banner{ margin:0 0 12px; display:flex; gap:12px; align-items:center; flex-wrap:wrap; justify-content:space-between; }

/* forms */
.formcard h2{ font-size:18px; }
.formfoot{ display:flex; gap:10px; align-items:center; justify-content:flex-end; margin-top:8px; flex-wrap:wrap; }
.formfoot .muted{ margin-right:auto; font-size:12.5px; }

/* request page */
.rq-head{ display:flex; gap:10px; align-items:flex-start; flex-wrap:wrap; }
.rq-head .sp{ flex:1; }
.rq-num{ font-weight:800; color:var(--burgundy); }
.flow{ display:flex; gap:6px; align-items:center; flex-wrap:wrap; font-size:12.5px; margin:10px 0 2px; }
.flow span{ padding:4px 10px; border-radius:999px; background:var(--soft); border:1px solid var(--border); font-weight:600; }
.flow span.done{ background:var(--pill-ok); color:var(--pill-ok-ink); border-color:transparent; }
.flow span.now{ background:var(--pill-wait); color:var(--pill-wait-ink); border-color:transparent; }
.flow i{ font-style:normal; color:var(--muted); }
.facts{ display:flex; gap:6px 18px; flex-wrap:wrap; font-size:13px; color:var(--muted); margin-top:8px; }
.facts b{ color:var(--ink); font-weight:600; }
.ask{ border:2px solid var(--gold); border-radius:12px; padding:12px 14px; background:var(--soft); margin:14px 0; }
.ask .q{ white-space:pre-wrap; margin:6px 0 10px; font-size:14.5px; }
.thread{ display:flex; flex-direction:column; gap:10px; margin:10px 0 4px; }
.msg{ border:1px solid var(--border); border-radius:10px; padding:9px 12px; max-width:720px; background:var(--card); }
.msg.fc{ background:var(--soft); }
.msg.sys{ border-style:dashed; background:transparent; }
.msg .h{ font-size:12px; color:var(--muted); margin-bottom:3px; }
.msg .h b{ color:var(--ink); }
.msg .t{ white-space:pre-wrap; overflow-wrap:anywhere; }
table.diff{ border-collapse:collapse; font-size:12.5px; margin-top:6px; }
table.diff td{ padding:3px 8px 3px 0; vertical-align:top; }
table.diff td.was{ color:var(--muted); text-decoration:line-through; }
table.diff td.now{ font-weight:700; color:var(--ok); }
#reply{ scroll-margin-top:80px; }
.section-gap{ margin-top:14px; }
.addrcard2{ display:grid; gap:2px; }

/* sign in */
.signin{ max-width:440px; margin:8vh auto 0; padding:0 16px; }
.signin .card{ padding:22px; }
.signin h1{ color:var(--burgundy); }
.signin form{ display:grid; gap:12px; margin-top:14px; }
