/* TBTS CRM — brez knjižnic, brez zunanjih virov.
   Stran, ki se odpre v BD na telefonu prek počasne povezave, mora priti v enem zahtevku. */

:root{
  --bg:#fbfaf8; --fg:#1c1a17; --dim:#6b6660; --line:#e2ddd6; --card:#fff;
  --ok:#1a7f4b; --off:#8a8a8a; --acc:#8a5a1a; --warn:#a33;
}
@media (prefers-color-scheme:dark){
  :root{ --bg:#16150f; --fg:#eae6df; --dim:#9c968c; --line:#332f28; --card:#1e1c16;
         --ok:#4fb87d; --off:#7a756c; --acc:#d3a25f; }
}
*{box-sizing:border-box}
body{margin:0;padding:0 1rem 4rem;background:var(--bg);color:var(--fg);
  font:15px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;}
a{color:var(--acc)}
h1{font-size:1.5rem;margin:1rem 0 .3rem}
h2{font-size:1rem;margin:1.6rem 0 .5rem;letter-spacing:.02em}
.dim{color:var(--dim);font-size:.87rem}
.nowrap{white-space:nowrap}
code{font:.85em ui-monospace,SFMono-Regular,Menlo,monospace}

header{display:flex;gap:1rem;align-items:center;padding:.7rem 0;border-bottom:1px solid var(--line);
  position:sticky;top:0;background:var(--bg);z-index:5;flex-wrap:wrap}
header .me{margin-left:auto;color:var(--dim);font-size:.85rem}
header nav a{margin-right:.8rem;text-decoration:none;color:var(--dim)}
header nav a.on{color:var(--fg);font-weight:600;border-bottom:2px solid var(--acc)}

.filters{display:flex;gap:.5rem;flex-wrap:wrap;margin:.9rem 0}
.filters input[name=q]{flex:1 1 20rem}
input,select,textarea,button{font:inherit;padding:.5rem .6rem;border:1px solid var(--line);
  border-radius:6px;background:var(--card);color:var(--fg);max-width:100%}
textarea{width:100%;resize:vertical}
button{background:var(--acc);color:#fff;border-color:transparent;cursor:pointer;font-weight:600}
button:hover{filter:brightness(1.08)}

table.list{width:100%;border-collapse:collapse;font-size:.92rem;display:block;overflow-x:auto}
table.list th{text-align:left;color:var(--dim);font-weight:600;font-size:.8rem;
  text-transform:uppercase;letter-spacing:.04em;padding:.4rem .6rem;border-bottom:1px solid var(--line)}
table.list td{padding:.55rem .6rem;border-bottom:1px solid var(--line);vertical-align:top}
table.list tr:hover td{background:var(--card)}
td.tb a{font:.85rem ui-monospace,Menlo,monospace;text-decoration:none}
td.todo{max-width:34rem}
.sub{color:var(--dim);font-size:.82rem}
table.facts th{width:12rem;text-transform:none;font-size:.85rem;letter-spacing:0}

.pill{display:inline-block;padding:.1rem .5rem;border:1px solid var(--line);border-radius:999px;
  font-size:.75rem;color:var(--dim);margin-right:.3rem;white-space:nowrap}
.pill.ok{color:var(--ok);border-color:var(--ok)}
.pill.off{color:var(--off)}
.pill.dos{color:var(--acc);border-color:var(--acc)}
.pill.link{text-decoration:none}

form.write{background:var(--card);border:1px solid var(--line);border-radius:10px;
  padding:1rem;margin:1rem 0}
form.write h2{margin-top:0}
form.write label{display:block;margin:.7rem 0 .2rem;color:var(--dim);font-size:.85rem}
form.write label input,form.write label select{display:block;width:100%;margin-top:.2rem}
form.write .row{display:flex;gap:1rem;flex-wrap:wrap}
form.write .row label{flex:1 1 12rem}
form.write.inline{display:flex;gap:.5rem;flex-wrap:wrap;align-items:center}
form.write.inline input{flex:1 1 12rem}

ul.notes{list-style:none;padding:0;margin:0}
ul.notes li{border-left:3px solid var(--line);padding:.4rem 0 .6rem .8rem;margin-bottom:.6rem}

.ok-bar{background:var(--ok);color:#fff;padding:.5rem .8rem;border-radius:6px;margin:.8rem 0}
.err{color:var(--warn);margin:.4rem 0}
.dossier{background:var(--card);border:1px solid var(--line);border-radius:8px;padding:.7rem 1rem}

body.login{display:flex;align-items:center;justify-content:center;min-height:100vh;padding:1rem}
body.login .card{background:var(--card);border:1px solid var(--line);border-radius:12px;
  padding:2rem;width:min(22rem,100%)}
body.login h1{margin:0 0 1rem;font-size:1.2rem}
body.login label{display:block;margin:.8rem 0;color:var(--dim);font-size:.85rem}
body.login input{display:block;width:100%;margin-top:.25rem}
body.login button{width:100%;margin-top:1rem}