:root { color-scheme: light dark; --bg:#fafafa; --fg:#1b1b1f; --muted:#62666f; --line:#d9dbe0; --card:#fff; --accent:#1f5fbf; --bad:#b3261e; --ok:#1e7a3c; }
@media (prefers-color-scheme: dark) { :root { --bg:#16171a; --fg:#e6e7ea; --muted:#9a9ea8; --line:#2d2f35; --card:#1e2024; --accent:#6ea2ff; --bad:#ff8a80; --ok:#7bd88f; } }
* { box-sizing: border-box; }
body { margin:0; background:var(--bg); color:var(--fg); font:15px/1.5 system-ui, sans-serif; }
header { display:flex; gap:1rem; align-items:center; flex-wrap:wrap; padding:.6rem 1rem; border-bottom:1px solid var(--line); background:var(--card); }
header a { color:var(--fg); text-decoration:none; padding:.2rem .5rem; border-radius:4px; }
header a:hover { background:var(--line); }
header .brand { font-weight:600; }
header form { margin-left:auto; }
main { max-width:1100px; margin:0 auto; padding:1rem; }
h1 { font-size:1.4rem; margin:.4rem 0 1rem; } h2 { font-size:1.1rem; margin:1.5rem 0 .5rem; }
a { color:var(--accent); }
table { border-collapse:collapse; width:100%; background:var(--card); }
th, td { text-align:left; padding:.4rem .6rem; border-bottom:1px solid var(--line); vertical-align:top; }
th { color:var(--muted); font-weight:600; font-size:.85rem; }
.scroll { overflow-x:auto; }
pre, code, textarea, input { font-family: ui-monospace, Menlo, Consolas, monospace; font-size:.85rem; }
pre { background:var(--card); border:1px solid var(--line); padding:.6rem; overflow-x:auto; border-radius:4px; margin:.3rem 0; }
.card { background:var(--card); border:1px solid var(--line); border-radius:6px; padding:1rem; margin:.8rem 0; }
.grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); gap:.8rem; }
.stat b { display:block; font-size:1.6rem; } .stat span { color:var(--muted); font-size:.85rem; }
label { display:block; margin:.6rem 0 .2rem; font-weight:600; font-size:.9rem; }
input[type=text], input[type=password], input[type=number], textarea, select { width:100%; padding:.45rem; border:1px solid var(--line); border-radius:4px; background:var(--bg); color:var(--fg); }
textarea { min-height:14rem; }
button { padding:.45rem .9rem; border:1px solid var(--line); border-radius:4px; background:var(--card); color:var(--fg); cursor:pointer; font:inherit; }
button.primary { background:var(--accent); border-color:var(--accent); color:#fff; }
button.danger { color:var(--bad); }
.error { border:1px solid var(--bad); color:var(--bad); background:var(--card); padding:.6rem .8rem; border-radius:4px; margin:.8rem 0; }
.muted { color:var(--muted); } .row { display:flex; gap:.6rem; flex-wrap:wrap; align-items:end; } .row > * { flex:1 1 140px; }
.tag { display:inline-block; padding:0 .45rem; border:1px solid var(--line); border-radius:99px; font-size:.78rem; }
.tag.pending { color:var(--accent); } .tag.approved { color:var(--ok); } .tag.rejected { color:var(--bad); }
.actions { display:flex; gap:.6rem; flex-wrap:wrap; margin-top:1rem; } .actions form { margin:0; }
.notice { border:1px solid var(--ok); color:var(--ok); background:var(--card); padding:.6rem .8rem; border-radius:4px; margin:.8rem 0; }
[wire\:loading] { display:none; } [wire\:loading].inline { display:inline; }
.field-error { color:var(--bad); font-size:.85rem; }
.shrink { flex:0 0 auto; }
