/* CLP Marketing Dashboard -- clean, minimal, mobile-friendly. No external assets. */
:root{
  --bg:#0f1115; --panel:#171a21; --panel2:#1d212b; --ink:#e8eaf0; --muted:#9aa3b2;
  --line:#2a2f3a; --accent:#5b8cff; --good:#3ecf8e; --warn:#ffb454;
  --c1:#5b8cff; --c2:#7c5bff; --c3:#3ecf8e; --c4:#ff7a59; --c5:#ffb454;
}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);
  font:15px/1.5 system-ui,-apple-system,Segoe UI,Roboto,sans-serif;padding:18px;max-width:1100px;margin:0 auto}
a{color:var(--accent);text-decoration:none}
a:hover{text-decoration:underline}
h1{font-size:22px;margin:0}
h2{font-size:18px;margin:.2em 0}
h3{font-size:15px;margin:1.4em 0 .5em;color:var(--muted);text-transform:uppercase;letter-spacing:.04em}
.topbar{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:6px}
.sub{color:var(--muted);margin:.2em 0 1em}
.note{color:var(--muted);font-size:13px}
.muted{color:var(--muted)}
.back{font-size:20px;margin-right:6px}
.inline{margin:0}
.link{background:none;border:0;color:var(--muted);cursor:pointer;font-size:13px}
.link:hover{color:var(--ink)}
.tag{display:inline-block;background:var(--panel2);color:var(--good);font-size:11px;
  padding:1px 6px;border-radius:8px;margin-left:6px;vertical-align:middle}
.small{font-size:12px}
.err{background:#3a1d1d;color:#ff9a9a;padding:8px 10px;border-radius:8px;margin:.5em 0}

/* cards / grid */
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:14px}
.card{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:16px}
.chan{display:block;color:var(--ink);position:relative;transition:border-color .15s}
.chan:hover{border-color:var(--accent);text-decoration:none}
.chan-num{position:absolute;top:12px;right:14px;font-size:28px;font-weight:700;color:var(--line)}
.chan-1{border-left:4px solid var(--c1)}.chan-2{border-left:4px solid var(--c2)}
.chan-3{border-left:4px solid var(--c3)}.chan-4{border-left:4px solid var(--c4)}
.chan-5{border-left:4px solid var(--c5)}
.stats{list-style:none;padding:0;margin:.6em 0 0;display:flex;flex-wrap:wrap;gap:10px;font-size:13px}
.stats b{font-size:16px;display:block}
.last{color:var(--muted);font-size:12px;margin:.6em 0 0}

/* tables */
table.data{width:100%;border-collapse:collapse;font-size:13px;margin-top:.4em}
table.data th{text-align:left;color:var(--muted);font-weight:600;border-bottom:1px solid var(--line);padding:6px 8px}
table.data td{border-bottom:1px solid var(--panel2);padding:6px 8px}
tr.st-paused{opacity:.55}
tr.st-idea{color:var(--muted)}

/* ideas board + strategy panel */
.navrow{margin:.2em 0 1em;font-size:13px}
tr.prio-high td:nth-child(3){color:var(--warn);font-weight:700}
tr.prio-low{opacity:.7}
tr.seg-blocked td:nth-child(2){color:var(--c4);font-weight:700}
tr.seg-done,tr.seg-exhausted{opacity:.6}
.movecell{white-space:normal}
.movebtn{font-size:11px;padding:1px 4px;color:var(--accent)}
.movebtn:hover{color:var(--ink);text-decoration:underline}
.note-tag{cursor:help;color:var(--muted)}

/* forms */
.form{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:10px;align-items:end}
.form label{display:flex;flex-direction:column;font-size:12px;color:var(--muted);gap:4px}
.form input,.form select,.form textarea{background:var(--panel2);border:1px solid var(--line);
  color:var(--ink);border-radius:8px;padding:7px 8px;font:inherit;font-size:14px}
.form button,form button[type=submit]:not(.link){grid-column:1/-1;justify-self:start;
  background:var(--accent);color:#fff;border:0;border-radius:8px;padding:9px 16px;cursor:pointer;font:inherit}
.metricform{grid-template-columns:repeat(auto-fill,minmax(110px,1fr))}

/* login */
.login-wrap{display:flex;min-height:70vh;align-items:center;justify-content:center}
.login-card{width:320px;display:flex;flex-direction:column;gap:12px}
.login-card label{display:flex;flex-direction:column;gap:6px;font-size:13px;color:var(--muted)}
.login-card input{background:var(--panel2);border:1px solid var(--line);color:var(--ink);
  border-radius:8px;padding:9px;font:inherit}
.login-card button{background:var(--accent);color:#fff;border:0;border-radius:8px;padding:10px;cursor:pointer;font:inherit}
