/* Renewals Ledger — shared styles */

:root{
  --paper:#f6f3ea;
  --surface:#ffffff;
  --surface-alt:#efeade;
  --ink:#242219;
  --ink-muted:#726c5c;
  --ink-faint:#a39c88;
  --border:#ddd5c1;
  --border-soft:#e9e3d3;
  --accent:#3d4f5e;
  --accent-strong:#28353f;
  --accent-soft:#dfe6e9;
  --ok:#2f7d54; --ok-soft:#dcefe2; --ok-ink:#1d5b3a;
  --warn:#b4780f; --warn-soft:#f5e6c8; --warn-ink:#7a5309;
  --bad:#b1433d; --bad-soft:#f5dcda; --bad-ink:#7d2b26;
  --neutral:#8b8672; --neutral-soft:#eae6d8; --neutral-ink:#5f5a48;
  --radius:10px;
  --shadow: 0 1px 2px rgba(36,34,25,0.06), 0 8px 24px -14px rgba(36,34,25,0.2);
}

*{ box-sizing:border-box; }
html,body{ margin:0; }
body{
  background:var(--paper);
  color:var(--ink);
  font-family:-apple-system,"Segoe UI",Inter,Arial,sans-serif;
  font-size:14px;
  line-height:1.5;
}
a{ color:var(--accent-strong); }
h1,h2,h3{ font-weight:700; letter-spacing:-0.01em; }

.site-header{ background:var(--surface); border-bottom:1px solid var(--border); }
.site-header-inner{
  max-width:1180px; margin:0 auto; padding:0 20px;
  display:flex; align-items:center; gap:24px; height:56px;
}
.brand{ font-weight:700; font-size:16px; color:var(--ink); text-decoration:none; white-space:nowrap; }
.main-nav{ display:flex; gap:4px; flex:1; overflow-x:auto; }
.main-nav a{
  color:var(--ink-muted); text-decoration:none; font-size:13.5px; font-weight:600;
  padding:8px 10px; border-radius:6px; white-space:nowrap;
}
.main-nav a:hover{ background:var(--surface-alt); color:var(--ink); }
.main-nav a.on{ background:var(--accent-soft); color:var(--accent-strong); }
.who{ display:flex; align-items:center; gap:8px; white-space:nowrap; }
.who-name{ font-size:13px; color:var(--ink-muted); }

.role-pill{ font-size:10.5px; font-weight:700; text-transform:uppercase; letter-spacing:.04em; padding:2px 7px; border-radius:99px; }
.role-superadmin{ background:#f5dcda; color:#7d2b26; }
.role-admin{ background:#f5e6c8; color:#7a5309; }
.role-user{ background:#dfe6e9; color:#28353f; }

.app{ max-width:1180px; margin:0 auto; padding:22px 20px 70px; }

.flash{ padding:10px 14px; border-radius:8px; margin-bottom:16px; font-size:13.5px; font-weight:600; }
.flash-ok{ background:var(--ok-soft); color:var(--ok-ink); }
.flash-error{ background:var(--bad-soft); color:var(--bad-ink); }

h1.page-title{ font-size:24px; margin:0 0 4px; }
p.page-sub{ margin:0 0 20px; color:var(--ink-muted); font-size:13.5px; }

.stats{ display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-bottom:20px; }
.stat{ background:var(--surface); border:1px solid var(--border-soft); border-radius:var(--radius); padding:14px 16px; box-shadow:var(--shadow); text-decoration:none; color:inherit; display:block; }
.stat .n{ font-size:26px; font-weight:700; font-variant-numeric:tabular-nums; display:block; }
.stat .l{ margin-top:4px; font-size:12px; color:var(--ink-muted); text-transform:uppercase; letter-spacing:.04em; }
.stat.s-active .n{ color:var(--ok-ink); }
.stat.s-soon .n{ color:var(--warn-ink); }
.stat.s-expired .n{ color:var(--bad-ink); }

.toolbar{ display:flex; gap:10px; flex-wrap:wrap; align-items:center; margin-bottom:14px; }
.toolbar .spacer{ flex:1; }

label{ font-size:12px; font-weight:600; color:var(--ink-muted); text-transform:uppercase; letter-spacing:.03em; display:block; margin-bottom:4px; }
select, input[type=text], input[type=date], input[type=search], input[type=email], input[type=tel], input[type=url], input[type=password], input[type=file], textarea{
  font-family:inherit; font-size:13.5px; color:var(--ink); background:var(--surface);
  border:1px solid var(--border); border-radius:7px; padding:8px 10px; width:100%;
}
textarea{ min-height:70px; resize:vertical; }
.field{ margin-bottom:14px; }
.field-row{ display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.field-row3{ display:grid; grid-template-columns:1fr 1fr 1fr; gap:12px; }

.btn{
  font-family:inherit; font-size:13.5px; font-weight:600; border-radius:7px; padding:8px 14px;
  border:1px solid var(--border); background:var(--surface); color:var(--ink); cursor:pointer;
  text-decoration:none; display:inline-block;
}
.btn:hover{ border-color:var(--ink-faint); }
.btn.primary{ background:var(--accent); border-color:var(--accent); color:#fff; }
.btn.primary:hover{ background:var(--accent-strong); border-color:var(--accent-strong); }
.btn.danger{ color:var(--bad-ink); border-color:var(--bad); }
.btn.ghost{ border-color:transparent; background:none; }
.btn.small{ padding:5px 10px; font-size:12px; }

.card{ background:var(--surface); border:1px solid var(--border-soft); border-radius:var(--radius); box-shadow:var(--shadow); padding:18px 20px; margin-bottom:18px; }

.table-wrap{ background:var(--surface); border:1px solid var(--border-soft); border-radius:var(--radius); box-shadow:var(--shadow); overflow-x:auto; }
table{ width:100%; border-collapse:collapse; min-width:700px; }
thead th{ text-align:left; font-size:11px; text-transform:uppercase; letter-spacing:.05em; color:var(--ink-muted); font-weight:700; padding:10px 14px; border-bottom:1px solid var(--border); white-space:nowrap; }
tbody td{ padding:9px 14px; border-bottom:1px solid var(--border-soft); vertical-align:middle; }
tbody tr:last-child td{ border-bottom:none; }
tbody tr:hover{ background:var(--surface-alt); }
td.mono, .mono{ font-variant-numeric:tabular-nums; }

.pill{ display:inline-flex; align-items:center; gap:5px; padding:3px 9px; border-radius:99px; font-size:11.5px; font-weight:700; white-space:nowrap; }
.pill.p-active{ background:var(--ok-soft); color:var(--ok-ink); }
.pill.p-soon{ background:var(--warn-soft); color:var(--warn-ink); }
.pill.p-expired{ background:var(--bad-soft); color:var(--bad-ink); }
.pill.p-none{ background:var(--neutral-soft); color:var(--neutral-ink); }
.pill.p-archived{ background:var(--neutral-soft); color:var(--neutral-ink); }

.empty{ padding:40px 20px; text-align:center; color:var(--ink-muted); }

.doc-preview{ border:1px solid var(--border); border-radius:8px; padding:12px; background:var(--surface-alt); text-align:center; }
.doc-preview img{ max-width:100%; max-height:420px; border-radius:6px; }

.log-list{ list-style:none; margin:0; padding:0; }
.log-list li{ padding:10px 0; border-bottom:1px solid var(--border-soft); font-size:13px; }
.log-list li:last-child{ border-bottom:none; }
.log-when{ color:var(--ink-faint); font-size:12px; margin-left:6px; }
.log-who{ font-weight:700; }

.confirm-inline form{ display:inline; }

@media (max-width:760px){
  .stats{ grid-template-columns:repeat(2,1fr); }
  .field-row, .field-row3{ grid-template-columns:1fr; }
  .main-nav{ display:none; }
}

@media print{
  .site-header, .toolbar, .no-print{ display:none !important; }
  body{ background:#fff; }
  .app{ max-width:none; padding:0; }
  .card, .table-wrap{ box-shadow:none; border:1px solid #ccc; }
}
