/* Pete's Painting CRM — brand palette from the Pete's Painting logo (blue paintbrush P) */
:root{
  color-scheme: light;
  --surface-1:#fcfcfb; --surface-2:#f4f5f7; --surface-3:#eaedf1;
  --text-primary:#0b0b0b; --text-secondary:#4f5459; --text-muted:#767b81;
  --border:#e0e3e8; --border-strong:#c5cad1;
  --pp-blue:#0a8fe0; --pp-blue-deep:#0072d6; --pp-blue-dark:#005a9e; --pp-blue-bg:#e6f4fd;
  --series-1:#0a8fe0; --seq-250:#8ccdf3; --seq-350:#4fb2ec; --seq-450:#0a8fe0; --seq-650:#005a9e;
  --good:#008300; --warning:#b97b00; --serious:#d14900; --critical:#c22a2a;
  --good-bg:#e8f4e8; --warning-bg:#fdf3e0; --serious-bg:#fdeadf; --critical-bg:#fbe9e9;
  --accent:#0a8fe0; --radius:10px;
}
*{box-sizing:border-box;margin:0}
body{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  background:var(--surface-2);color:var(--text-primary);font-size:15px;min-height:100vh}
a{color:var(--series-1);text-decoration:none}
header{background:var(--surface-1);border-bottom:1px solid var(--border);padding:0 18px;height:56px;
  display:flex;align-items:center;gap:12px;position:sticky;top:0;z-index:40}
.logo{font-weight:700;font-size:16px;display:flex;gap:8px;align-items:center;white-space:nowrap}
.logo img{height:32px;width:auto;display:block}
.logo .crm-tag{font-size:10.5px;font-weight:700;letter-spacing:.6px;color:#fff;background:linear-gradient(180deg,var(--pp-blue),var(--pp-blue-deep));border-radius:5px;padding:2px 6px}
.leaf{color:var(--accent)}
.badge-ca{font-size:11px;color:var(--text-secondary);border:1px solid var(--border-strong);border-radius:99px;padding:2px 9px;white-space:nowrap}
.shadow-badge{font-size:10.5px;font-weight:700;color:var(--warning);background:var(--warning-bg);border-radius:99px;padding:3px 9px;white-space:nowrap}
nav{display:flex;gap:2px;margin-left:10px;overflow-x:auto}
nav a{padding:7px 12px;border-radius:8px;color:var(--text-secondary);font-size:14px;white-space:nowrap}
nav a:hover{background:var(--surface-3)}
nav a.active{background:var(--pp-blue-bg);color:var(--pp-blue-dark);font-weight:600}
.spacer{flex:1}
.who{font-size:13px;color:var(--text-secondary)}
main{max-width:1080px;margin:0 auto;padding:24px 18px 70px}
h1{font-size:21px;letter-spacing:-.3px;margin-bottom:4px}
.sub{color:var(--text-secondary);font-size:13px;margin-bottom:20px}
.flash{background:var(--good-bg);color:var(--good);border-radius:8px;padding:10px 14px;font-size:13.5px;margin-bottom:16px;font-weight:600}
.tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:13px;margin-bottom:24px}
.tile{background:var(--surface-1);border:1px solid var(--border);border-radius:var(--radius);padding:15px 17px}
.tile .label{font-size:12px;color:var(--text-secondary)}
.tile .num{font-size:26px;font-weight:700;letter-spacing:-.5px;margin-top:5px}
.tile .hint{font-size:11.5px;color:var(--text-muted);margin-top:3px}
.tile.alert .num{color:var(--critical)} .tile.warn .num{color:var(--serious)} .tile.good .num{color:var(--good)}
.card{background:var(--surface-1);border:1px solid var(--border);border-radius:var(--radius);padding:16px 18px;margin-bottom:18px}
.card h2{font-size:15px;margin-bottom:2px}
.card .desc{font-size:12px;color:var(--text-muted);margin-bottom:12px}
table{width:100%;border-collapse:collapse;font-size:13.5px}
th{text-align:left;font-size:11px;text-transform:uppercase;letter-spacing:.4px;color:var(--text-muted);font-weight:600;
  padding:6px 9px;border-bottom:1px solid var(--border)}
td{padding:8px 9px;border-bottom:1px solid var(--border);vertical-align:top}
tr:last-child td{border-bottom:0}
tbody tr:hover{background:var(--surface-2)}
.r{text-align:right} th.r{text-align:right}
.money{font-variant-numeric:tabular-nums;font-weight:600}
.name{font-weight:600}
.small{font-size:12px;color:var(--text-muted)}
.status{display:inline-block;font-size:11px;font-weight:600;border-radius:99px;padding:2px 8px;white-space:nowrap}
.s-gray{background:var(--surface-3);color:var(--text-secondary)}
.s-yellow{background:var(--warning-bg);color:var(--warning)}
.s-orange{background:var(--serious-bg);color:var(--serious)}
.s-red{background:var(--critical-bg);color:var(--critical)}
.s-green{background:var(--good-bg);color:var(--good)}
.btn{display:inline-block;border:1px solid var(--border-strong);background:var(--surface-1);color:var(--text-primary);
  font:inherit;font-size:12.5px;font-weight:600;border-radius:8px;padding:5px 11px;cursor:pointer}
.btn:hover{background:var(--surface-3)}
.btn.primary{background:linear-gradient(180deg,var(--pp-blue),var(--pp-blue-deep));border-color:var(--pp-blue-deep);color:#fff}
.btn.primary:hover{background:linear-gradient(180deg,var(--pp-blue-deep),var(--pp-blue-dark))}
.btn.small{font-size:12px;padding:3px 9px}
.fu{font-size:11.5px;font-weight:700}
.fu-day2{color:var(--seq-450)} .fu-day4{color:var(--warning)} .fu-day7{color:var(--serious)} .fu-nurture{color:var(--text-muted)}
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:18px}
@media(max-width:820px){.two-col{grid-template-columns:1fr}}
form.inline{display:inline}
.login-wrap{max-width:400px;margin:70px auto}
.login-wrap .card{padding:26px}
.login-wrap h1{margin-bottom:14px}
label{display:block;font-size:12.5px;font-weight:600;color:var(--text-secondary);margin:12px 0 4px}
input[type=email],input[type=password],input[type=text]{width:100%;border:1px solid var(--border-strong);
  border-radius:8px;padding:9px 12px;font:inherit;background:var(--surface-1)}
.login-actions{margin-top:18px;display:flex;gap:10px;align-items:center}
.err{background:var(--critical-bg);color:var(--critical);border-radius:8px;padding:9px 13px;font-size:13px;margin-bottom:12px;font-weight:600}
.footer-note{font-size:11.5px;color:var(--text-muted);margin-top:16px;text-align:center}
.search{border:1px solid var(--border-strong);border-radius:8px;padding:7px 12px;font:inherit;font-size:13.5px;width:280px;max-width:100%;margin-bottom:12px;background:var(--surface-1)}
/* v0.2: schedule + team */
.week{display:grid;grid-template-columns:repeat(6,1fr);gap:8px;margin-top:6px}
.day{background:var(--surface-2);border:1px solid var(--border);border-radius:8px;min-height:130px;padding:7px}
.day h4{font-size:11px;text-transform:uppercase;letter-spacing:.4px;color:var(--text-muted);margin-bottom:7px;font-weight:600}
.day.today{outline:2px solid var(--series-1);outline-offset:-1px}
.day.today h4{color:var(--series-1)}
.chip{border-radius:7px;padding:5px 7px;font-size:11px;margin-bottom:5px;line-height:1.35;border-left:3px solid;
  background:var(--surface-1);border-top:1px solid var(--border);border-right:1px solid var(--border);border-bottom:1px solid var(--border);position:relative}
.chip b{display:block;font-size:11.5px}
.chip form{position:absolute;top:2px;right:4px}
.chip .x{border:0;background:none;color:var(--text-muted);cursor:pointer;font-size:11px;padding:0 2px}
.crew-a{border-left-color:var(--series-1)} .crew-b{border-left-color:#eb6834} .crew-c{border-left-color:#1baf7a}
.visit{border-left-color:var(--text-muted);border-left-style:dashed}
.legend{display:flex;gap:14px;flex-wrap:wrap;font-size:12px;color:var(--text-secondary);margin:8px 0 2px}
.legend .sw{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:5px;vertical-align:-1px}
.week-nav{display:flex;gap:8px;align-items:center;margin-bottom:8px}
.add-row{display:flex;gap:8px;flex-wrap:wrap;align-items:flex-end;margin-top:12px}
.add-row label{margin:0 0 3px}
.add-row input,.add-row select{border:1px solid var(--border-strong);border-radius:8px;padding:7px 10px;font:inherit;font-size:13px;background:var(--surface-1)}
.emp-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(235px,1fr));gap:12px}
.emp{background:var(--surface-1);border:1px solid var(--border);border-radius:var(--radius);padding:13px 15px}
.emp .top{display:flex;align-items:center;gap:10px;margin-bottom:8px}
.avatar{width:36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:13px;color:#fff;flex-shrink:0;background:var(--text-muted)}
.av-a{background:var(--series-1)} .av-b{background:#eb6834} .av-c{background:#1baf7a}
.emp .role{font-size:11.5px;color:var(--text-muted)}
.emp .meta{font-size:12px;color:var(--text-secondary);display:flex;justify-content:space-between;padding:3px 0;border-top:1px solid var(--border)}
.clock-in{color:var(--good);font-weight:700} .clock-out{color:var(--text-muted);font-weight:600}
