:root { color-scheme: dark; }
.saas-shell { width:min(1180px, calc(100% - 32px)); margin:0 auto; min-height:100vh; }
.saas-topbar { min-height:84px; display:flex; align-items:center; justify-content:space-between; gap:18px; border-bottom:1px solid var(--line); }
.auth-shell { width:min(1080px, calc(100% - 32px)); }
.auth-main { min-height:calc(100vh - 90px); display:grid; place-items:center; padding:40px 0; }
.auth-card, .panel-card, .metric-card, .modal-card { border:1px solid var(--line); background:rgba(16,23,40,.92); box-shadow:0 22px 70px rgba(0,0,0,.28); }
.auth-card { width:min(100%, 520px); padding:32px; border-radius:24px; }
.auth-intro h1 { margin:4px 0 8px; font-size:34px; }
.auth-intro p { color:var(--muted); }
.auth-tabs { display:grid; grid-template-columns:1fr 1fr; gap:8px; padding:6px; background:#0b1020; border-radius:14px; margin:24px 0; }
.auth-tab { border:0; padding:11px; border-radius:10px; background:transparent; color:var(--muted); font-weight:850; cursor:pointer; }
.auth-tab.active { background:#1b2845; color:#fff; }
.form-stack { display:grid; gap:15px; }
.form-stack label { display:grid; gap:7px; font-size:13px; font-weight:800; color:#bec8dc; }
.form-stack input, .inline-form input, .inline-form select, .tenant-status { width:100%; border:1px solid var(--line); background:#0d1424; color:#fff; padding:12px 13px; border-radius:11px; outline:none; }
.form-stack input:focus, .inline-form input:focus, .inline-form select:focus { border-color:#6d7df9; box-shadow:0 0 0 3px rgba(109,125,249,.12); }
.dashboard-user { display:flex; align-items:center; gap:12px; color:#bdc7dc; font-size:13px; }
.dashboard-main { padding:34px 0 70px; }
.dashboard-heading { display:flex; align-items:end; justify-content:space-between; gap:20px; margin-bottom:26px; }
.dashboard-heading h1 { margin:4px 0 6px; font-size:34px; }
.muted { color:var(--muted); margin:0; }
.metric-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; margin-bottom:18px; }
.metric-card { border-radius:18px; padding:20px; display:grid; gap:7px; }
.metric-card span, .metric-card small { color:var(--muted); }
.metric-card strong { font-size:26px; }
.panel-card { border-radius:20px; padding:22px; margin-top:18px; }
.section-head { display:flex; justify-content:space-between; align-items:center; gap:16px; margin-bottom:16px; }
.section-head h2 { margin:0 0 5px; }
.section-head p { margin:0; color:var(--muted); font-size:13px; }
.table-wrap { width:100%; overflow:auto; }
table { width:100%; border-collapse:collapse; min-width:680px; }
th, td { padding:13px 12px; border-bottom:1px solid var(--line); text-align:left; font-size:13px; vertical-align:middle; }
th { color:#8895ad; font-size:11px; text-transform:uppercase; letter-spacing:.08em; }
td code { color:#a9b7ff; }
.table-actions { display:flex; gap:7px; flex-wrap:wrap; }
.state-pill { padding:6px 9px; border-radius:999px; font-size:11px; font-weight:900; background:#21304f; }
.state-pill.active { color:#8ff0b3; }
.state-pill.closed { color:#ff9cab; }
.empty-state { padding:20px; border:1px dashed var(--line); border-radius:14px; color:var(--muted); margin-bottom:14px; }
.inline-form { display:grid; grid-template-columns:1.2fr 1.4fr .8fr 1.3fr auto; gap:8px; margin:16px 0; }
.modal-card { width:min(520px, calc(100% - 30px)); padding:26px; border-radius:20px; color:#fff; }
.modal-card::backdrop { background:rgba(4,8,18,.72); backdrop-filter:blur(4px); }
@media (max-width:900px) { .metric-grid { grid-template-columns:repeat(2,1fr); } .inline-form { grid-template-columns:1fr 1fr; } }
@media (max-width:620px) { .saas-shell { width:min(100% - 20px, 1180px); } .saas-topbar { min-height:70px; } .dashboard-user span { display:none; } .dashboard-heading { align-items:start; } .dashboard-heading h1 { font-size:27px; } .metric-grid { grid-template-columns:1fr 1fr; } .inline-form { grid-template-columns:1fr; } .auth-card { padding:22px; } }

/* TOQUE v0.4 - WhatsApp Quick Share */
.integration-pill {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  padding: .4rem .7rem;
  border-radius: 999px;
  background: rgba(37, 211, 102, .12);
  border: 1px solid rgba(37, 211, 102, .28);
  color: #bbf7d0;
  font-size: .78rem;
  font-weight: 700;
  white-space: nowrap;
}

.mini-btn.whatsapp {
  border-color: rgba(37, 211, 102, .45);
  color: #bbf7d0;
}

.mini-btn.whatsapp:hover {
  background: rgba(37, 211, 102, .12);
}

/* TOQUE v0.4.1 - WhatsApp Cloud API foundation */
.metric-grid { grid-template-columns:repeat(auto-fit,minmax(175px,1fr)); }
.integration-pill.cloud-ready { background:rgba(37,211,102,.2); border-color:rgba(37,211,102,.5); color:#dcfce7; }
.whatsapp-actions { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.whatsapp-status.sent, .whatsapp-status.delivered, .whatsapp-status.read { color:#8ff0b3; }
.whatsapp-status.failed { color:#ff9cab; }
.whatsapp-status.queued { color:#fbd38d; }
#whatsappPhone { font-variant-numeric:tabular-nums; letter-spacing:.03em; }
@media (max-width:620px) { .whatsapp-actions { grid-template-columns:1fr; } }
