/* =====================================================================
   SWOT Consultancy Ltd. -- Canadian Cyber Evaluation & CRM
   Corporate, compact, high-density UI. Light theme.
   ===================================================================== */

:root{
  --navy:#0b1f3a;
  --navy-800:#122b4d;
  --navy-700:#17335c;
  --cyan:#12b6c9;
  --cyan-dark:#0c93a3;
  --steel:#5b6b7c;
  --steel-light:#8592a1;
  --bg:#f4f6f8;
  --surface:#ffffff;
  --border:#dde3ea;
  --border-strong:#c6ced8;
  --text:#1b2531;
  --text-muted:#5b6b7c;
  --danger:#c62839;
  --danger-bg:#fdecee;
  --warning:#b0740a;
  --warning-bg:#fdf3e0;
  --success:#12793f;
  --success-bg:#e7f6ed;
  --info:#0c5f9c;
  --info-bg:#e7f2fb;
  --muted-bg:#eef1f4;
  --radius:4px;
  --sidebar-w:230px;
  --font: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}

*{box-sizing:border-box;}
html,body{margin:0;padding:0;}
body{
  font-family:var(--font);
  font-size:13px;
  color:var(--text);
  background:var(--bg);
  line-height:1.45;
}
h1,h2,h3,h4{margin:0 0 8px;color:var(--navy);font-weight:700;}
h1{font-size:18px;} h2{font-size:16px;} h3{font-size:14px;} h4{font-size:13px;}
p{margin:0 0 8px;}
a{color:var(--cyan-dark);text-decoration:none;}
a:hover{text-decoration:underline;}
table{border-collapse:collapse;width:100%;}
img{max-width:100%;display:block;}

/* ---------- Buttons ---------- */
.btn{
  display:inline-flex;align-items:center;gap:4px;
  padding:5px 12px;font-size:12.5px;font-weight:600;border-radius:var(--radius);
  border:1px solid var(--border-strong);background:var(--surface);color:var(--text);
  cursor:pointer;line-height:1.2;
}
.btn:hover{text-decoration:none;border-color:var(--steel);}
.btn-sm{padding:3px 9px;font-size:11.5px;}
.btn-primary{background:var(--navy);border-color:var(--navy);color:#fff;}
.btn-primary:hover{background:var(--navy-700);}
.btn-cyan{background:var(--cyan);border-color:var(--cyan-dark);color:#fff;}
.btn-cyan:hover{background:var(--cyan-dark);}
.btn-ghost{background:transparent;border-color:transparent;color:var(--steel);}
.btn-ghost:hover{background:var(--muted-bg);}
.btn-danger{background:var(--danger);border-color:var(--danger);color:#fff;}
.btn:disabled,.btn.locked{opacity:.55;cursor:not-allowed;}

/* ---------- Badges / Pills ---------- */
.badge{display:inline-block;padding:2px 8px;border-radius:999px;font-size:11px;font-weight:700;background:var(--muted-bg);color:var(--steel);}
.badge-success{background:var(--success-bg);color:var(--success);}
.badge-success-strong{background:var(--success);color:#fff;}
.badge-danger{background:var(--danger-bg);color:var(--danger);}
.badge-warning{background:var(--warning-bg);color:var(--warning);}
.badge-info{background:var(--info-bg);color:var(--info);}
.badge-muted{background:var(--muted-bg);color:var(--steel);}

.tier-pill{display:inline-block;padding:3px 10px;border-radius:999px;font-size:11px;font-weight:700;}
.tier-free{background:var(--warning-bg);color:var(--warning);}
.tier-production{background:var(--success-bg);color:var(--success);}

.ribbon{
  display:inline-flex;align-items:center;gap:6px;
  background:linear-gradient(90deg,var(--cyan),var(--cyan-dark));
  color:#fff;font-weight:800;font-size:12px;letter-spacing:.03em;
  padding:5px 14px;border-radius:999px;text-transform:uppercase;
  box-shadow:0 1px 3px rgba(0,0,0,.15);
}

/* ---------- App Shell ---------- */
.app-shell{display:flex;min-height:100vh;}
.sidebar{
  width:var(--sidebar-w);flex:0 0 var(--sidebar-w);background:var(--navy);color:#fff;
  display:flex;flex-direction:column;position:sticky;top:0;height:100vh;overflow-y:auto;
  transition:margin-left .15s ease;
}
.sidebar.collapsed{margin-left:calc(var(--sidebar-w) * -1);}
.sidebar-brand{display:flex;align-items:center;gap:8px;padding:14px 12px;border-bottom:1px solid rgba(255,255,255,.12);}
.brand-mark{
  width:30px;height:30px;border-radius:6px;background:var(--cyan);color:var(--navy);
  display:flex;align-items:center;justify-content:center;font-weight:800;font-size:12px;flex:0 0 auto;
}
.brand-text{display:flex;flex-direction:column;line-height:1.2;}
.brand-text strong{font-size:12.5px;}
.brand-text small{font-size:10px;color:#9fb3c8;}

.sidebar-nav{padding:8px 0;flex:1;}
.nav-item{
  display:flex;align-items:center;gap:9px;width:100%;padding:8px 12px;
  color:#d7e2ee;background:none;border:none;font-size:12.5px;text-align:left;cursor:pointer;
}
.nav-item:hover{background:rgba(255,255,255,.06);text-decoration:none;}
.nav-item.active{background:var(--cyan);color:var(--navy);font-weight:700;}
.nav-icon{width:16px;text-align:center;opacity:.9;}
.nav-caret{margin-left:auto;font-size:10px;transition:transform .15s;}
.nav-group.open .nav-caret{transform:rotate(180deg);}
.nav-children{display:none;flex-direction:column;background:rgba(0,0,0,.15);}
.nav-group.open .nav-children{display:flex;}
.nav-subitem{padding:6px 12px 6px 38px;font-size:12px;color:#c3d2e2;}
.nav-subitem:hover{background:rgba(255,255,255,.06);text-decoration:none;}
.nav-subitem.active{color:var(--cyan);font-weight:700;}
.sidebar-footer{padding:10px 12px;border-top:1px solid rgba(255,255,255,.12);}

.main-col{flex:1;display:flex;flex-direction:column;min-width:0;}
.topbar{
  position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:10px;
  padding:8px 14px;background:var(--surface);border-bottom:1px solid var(--border);
}
.icon-btn{background:none;border:1px solid var(--border-strong);border-radius:var(--radius);width:28px;height:28px;cursor:pointer;font-size:14px;}
.topbar-title{font-size:15px;margin:0;}
.topbar-spacer{flex:1;}
.topbar-user{display:flex;align-items:center;gap:8px;}
.avatar{width:26px;height:26px;border-radius:50%;background:var(--navy);color:#fff;display:flex;align-items:center;justify-content:center;font-size:10.5px;font-weight:700;}
.user-meta{display:flex;flex-direction:column;line-height:1.15;font-size:11.5px;}
.user-meta small{color:var(--text-muted);}
.page-content{padding:14px;}
.app-footer{display:flex;justify-content:space-between;padding:8px 14px;font-size:11px;color:var(--text-muted);border-top:1px solid var(--border);background:var(--surface);}

/* ---------- Filter Bar ---------- */
.filter-bar{
  position:sticky;top:45px;z-index:15;display:flex;gap:8px;align-items:center;flex-wrap:wrap;
  background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);
  padding:7px 10px;margin-bottom:10px;
}
.filter-search{flex:1;min-width:160px;padding:5px 8px;border:1px solid var(--border-strong);border-radius:var(--radius);font-size:12.5px;}
.filter-select{padding:5px 8px;border:1px solid var(--border-strong);border-radius:var(--radius);font-size:12.5px;background:#fff;}

/* ---------- Cards / Panels ---------- */
.panel{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:12px;margin-bottom:12px;}
.panel-title-row{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px;}
.kpi-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:8px;margin-bottom:12px;}
.kpi-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:9px 12px;}
.kpi-card .kpi-value{font-size:20px;font-weight:800;color:var(--navy);}
.kpi-card .kpi-label{font-size:11px;color:var(--text-muted);text-transform:uppercase;letter-spacing:.03em;}

.card-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:10px;}
.eval-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:12px;display:flex;flex-direction:column;gap:6px;}
.eval-card.locked{background:var(--muted-bg);color:var(--text-muted);position:relative;}
.eval-card .lock-icon{position:absolute;top:10px;right:10px;font-size:15px;color:var(--steel-light);}
.eval-card h4{margin:0;}
.eval-meta{font-size:11px;color:var(--text-muted);}

/* ---------- Data Table ---------- */
.table-wrap{overflow-x:auto;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);}
.data-table{font-size:12.5px;}
.data-table th{
  background:var(--muted-bg);color:var(--steel);text-transform:uppercase;font-size:10.5px;letter-spacing:.03em;
  text-align:left;padding:6px 8px;border-bottom:1px solid var(--border-strong);white-space:nowrap;position:sticky;top:0;
}
.data-table td{padding:6px 8px;border-bottom:1px solid var(--border);vertical-align:middle;}
.data-table tr:hover td{background:#f8fafc;}
.cell-name strong{display:block;font-size:12.5px;}
.cell-name small{color:var(--text-muted);font-size:11px;}

/* action menu (three dots) */
.action-menu{position:relative;display:inline-block;}
.action-dots{background:none;border:none;cursor:pointer;font-size:16px;line-height:1;padding:2px 6px;border-radius:var(--radius);color:var(--steel);}
.action-dots:hover{background:var(--muted-bg);}
.action-dropdown{
  display:none;position:absolute;right:0;top:24px;min-width:150px;background:#fff;
  border:1px solid var(--border-strong);border-radius:var(--radius);box-shadow:0 4px 14px rgba(0,0,0,.12);z-index:30;
}
.action-menu.open .action-dropdown{display:block;}
.action-dropdown a,.action-dropdown button{
  display:block;width:100%;text-align:left;padding:6px 10px;font-size:12px;color:var(--text);
  background:none;border:none;cursor:pointer;
}
.action-dropdown a:hover,.action-dropdown button:hover{background:var(--muted-bg);text-decoration:none;}

/* ---------- Forms ---------- */
.form-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:10px;}
label{display:block;font-size:11.5px;font-weight:700;color:var(--steel);margin-bottom:3px;text-transform:uppercase;letter-spacing:.02em;}
input[type=text],input[type=email],input[type=password],input[type=date],input[type=number],select,textarea{
  width:100%;padding:6px 8px;border:1px solid var(--border-strong);border-radius:var(--radius);font-size:12.5px;font-family:var(--font);
}
textarea{min-height:70px;}
.field{margin-bottom:10px;}

/* ---------- Progress / Score ---------- */
.progress-track{height:8px;background:var(--muted-bg);border-radius:99px;overflow:hidden;}
.progress-fill{height:100%;background:linear-gradient(90deg,var(--cyan),var(--navy));}
.score-ring{font-size:30px;font-weight:800;color:var(--navy);}

/* ---------- Kanban ---------- */
.kanban{display:grid;grid-template-columns:repeat(5,minmax(180px,1fr));gap:10px;overflow-x:auto;}
.kanban-col{background:var(--muted-bg);border-radius:var(--radius);padding:8px;}
.kanban-col h4{font-size:11.5px;text-transform:uppercase;color:var(--steel);margin-bottom:6px;}
.kanban-card{background:#fff;border:1px solid var(--border);border-radius:var(--radius);padding:7px 8px;margin-bottom:6px;font-size:12px;}
.kanban-card small{color:var(--text-muted);}

/* ---------- Native reporting dashboards ---------- */
.freshness-strip{font-size:11px;color:var(--text-muted);background:var(--muted-bg);border:1px solid var(--border);border-radius:var(--radius);padding:5px 10px;margin-bottom:10px;}
.chart-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:10px;margin-bottom:10px;}
.chart-box{position:relative;width:100%;}
.delta-chip{display:inline-block;font-size:10.5px;font-weight:700;padding:1px 7px;border-radius:999px;margin-left:6px;}
.delta-up{background:var(--success-bg);color:var(--success);}
.delta-down{background:var(--danger-bg);color:var(--danger);}
.delta-flat{background:var(--muted-bg);color:var(--steel);}
.kpi-card .kpi-sub{font-size:10.5px;color:var(--text-muted);margin-top:2px;}
.heatmap-row{display:grid;grid-template-columns:180px 1fr 60px 50px;gap:8px;align-items:center;padding:5px 0;border-bottom:1px solid var(--border);font-size:12px;}
.heatmap-row:last-child{border-bottom:none;}
.heatmap-track{height:14px;background:var(--muted-bg);border-radius:3px;overflow:hidden;position:relative;}
.heatmap-fill{height:100%;border-radius:3px;}
.aging-row{display:flex;align-items:center;gap:8px;padding:4px 0;font-size:12px;}
.aging-bar-track{flex:1;height:10px;background:var(--muted-bg);border-radius:3px;overflow:hidden;}
.aging-bar-fill{height:100%;background:linear-gradient(90deg,var(--cyan),var(--navy));}
.funnel-row{display:grid;grid-template-columns:220px 1fr 90px;gap:10px;align-items:center;padding:6px 0;border-bottom:1px solid var(--border);font-size:12px;}
.funnel-row:last-child{border-bottom:none;}
.funnel-bar-track{height:16px;background:var(--muted-bg);border-radius:3px;overflow:hidden;}
.funnel-bar-fill{height:100%;background:linear-gradient(90deg,var(--navy),var(--cyan));}
.quality-score{font-size:26px;font-weight:800;}
.quality-score.q-good{color:var(--success);}
.quality-score.q-warn{color:var(--warning);}
.quality-score.q-bad{color:var(--danger);}
.dq-row{display:flex;justify-content:space-between;gap:10px;padding:5px 0;border-bottom:1px solid var(--border);font-size:12px;}
.dq-row:last-child{border-bottom:none;}

/* ---------- Power BI embed ---------- */
.pbi-embed{width:100%;aspect-ratio:16/8.5;border:1px solid var(--border);border-radius:var(--radius);background:var(--muted-bg);
  display:flex;align-items:center;justify-content:center;text-align:center;color:var(--text-muted);font-size:12px;padding:14px;}
.report-list{list-style:none;margin:0;padding:0;}
.report-list li{display:flex;justify-content:space-between;gap:10px;padding:8px 0;border-bottom:1px solid var(--border);font-size:12.5px;}
.report-list li:last-child{border-bottom:none;}

/* ---------- Maintenance page ---------- */
.maintenance-body{background:var(--navy);display:flex;align-items:center;justify-content:center;min-height:100vh;font-family:var(--font);}
.maintenance-card{background:#fff;border-radius:8px;padding:36px 30px;max-width:420px;text-align:center;}
.maintenance-card h1{font-size:17px;}

/* ---------- Public marketing site ---------- */
.public-header{display:flex;align-items:center;gap:10px;padding:12px 24px;background:var(--navy);color:#fff;position:sticky;top:0;z-index:20;}
.public-header a{color:#fff;}
.public-nav{display:flex;gap:16px;margin-left:auto;font-size:12.5px;font-weight:600;}
.public-nav a:hover{color:var(--cyan);text-decoration:none;}
.hero{padding:48px 24px;background:linear-gradient(135deg,var(--navy) 0%,var(--navy-700) 100%);color:#fff;text-align:center;}
.hero h1{color:#fff;font-size:28px;max-width:780px;margin:0 auto 10px;}
.hero p{color:#c3d2e2;max-width:640px;margin:0 auto 18px;font-size:14px;}
.hero-actions{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;}
.section{padding:32px 24px;max-width:1100px;margin:0 auto;}
.section h2{font-size:19px;text-align:center;margin-bottom:18px;}
.trust-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:10px;}
.trust-item{background:#fff;border:1px solid var(--border);border-radius:var(--radius);padding:12px;font-size:12.5px;}
.offer-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:12px;}
.offer-card{background:#fff;border:1px solid var(--border);border-radius:6px;padding:16px;display:flex;flex-direction:column;gap:6px;}
.offer-card.featured{border:2px solid var(--cyan);}
.offer-price{font-size:20px;font-weight:800;color:var(--navy);}
.disclaimer-box{background:#fff;border:1px solid var(--border-strong);border-left:4px solid var(--cyan);border-radius:var(--radius);padding:12px 14px;font-size:11.5px;color:var(--text-muted);}
.public-footer{background:var(--navy);color:#9fb3c8;padding:20px 24px;font-size:11.5px;text-align:center;}
.public-footer a{color:#fff;}

img.brand-logo{max-height:26px;width:auto;}

/* ---------- Utility ---------- */
.text-muted{color:var(--text-muted);}
.text-right{text-align:right;}
.mt-0{margin-top:0;} .mb-0{margin-bottom:0;}
.flex{display:flex;} .items-center{align-items:center;} .gap-8{gap:8px;} .gap-4{gap:4px;}
.hidden{display:none !important;}
.print-header{display:none;} /* shown only in print media, see print.css */
.pricing-table td.text-muted{font-size:11.5px;}
.row-featured td{background:#f0fbfc;}
.data-table tbody tr:target td{background:#fff6d9 !important;animation:swot-row-flash 2.4s ease-out 1;}
@keyframes swot-row-flash{0%{background:#ffe9a8;}100%{background:#fff6d9;}}

/* ---------- Chatbot widget ---------- */
.chat-widget{position:fixed;right:18px;bottom:18px;z-index:200;}
.chat-toggle-btn{
  width:52px;height:52px;border-radius:50%;border:none;background:var(--cyan);color:#fff;
  font-size:22px;cursor:pointer;box-shadow:0 4px 14px rgba(0,0,0,.25);
}
.chat-toggle-btn:hover{background:var(--cyan-dark);}
.chat-panel{
  position:absolute;right:0;bottom:64px;width:320px;max-height:440px;background:#fff;
  border:1px solid var(--border-strong);border-radius:8px;box-shadow:0 8px 28px rgba(0,0,0,.25);
  display:flex;flex-direction:column;overflow:hidden;
}
.chat-panel.hidden{display:none;}
.chat-panel-header{display:flex;align-items:center;justify-content:space-between;padding:9px 12px;background:var(--navy);color:#fff;font-size:12.5px;}
.chat-panel-header .icon-btn{background:none;border:none;color:#fff;font-size:13px;}
.chat-messages{flex:1;overflow-y:auto;padding:10px;display:flex;flex-direction:column;gap:8px;background:var(--bg);}
.chat-msg{max-width:85%;padding:7px 10px;border-radius:10px;font-size:12px;line-height:1.4;white-space:pre-line;}
.chat-msg-bot{align-self:flex-start;background:#fff;border:1px solid var(--border);}
.chat-msg-user{align-self:flex-end;background:var(--navy);color:#fff;}
.chat-typing{opacity:.6;font-style:italic;}
.chat-input-row{display:flex;gap:6px;padding:8px;border-top:1px solid var(--border);background:#fff;}
.chat-input-row input{flex:1;padding:6px 8px;border:1px solid var(--border-strong);border-radius:var(--radius);font-size:12px;}
@media (max-width:480px){.chat-panel{width:90vw;right:-4px;}}

@media (max-width:900px){
  .sidebar{position:fixed;left:0;z-index:40;box-shadow:0 0 20px rgba(0,0,0,.25);}
  .sidebar:not(.mobile-open){margin-left:calc(var(--sidebar-w) * -1);}
  .kanban{grid-template-columns:repeat(5,minmax(160px,1fr));}
  img.brand-logo{max-height:20px;}
}