
/* =========================================================
   MME AI Sales Desk — Premium Compact Executive UI
   Safe visual override only. No DB / business logic changes.
   ========================================================= */

:root{
  --mme-navy:#071a36;
  --mme-navy-2:#0d2d5a;
  --mme-blue:#1f5eff;
  --mme-text:#17233a;
  --mme-muted:#7d8aa3;
  --mme-line:#e7ebf2;
  --mme-bg:#f5f7fb;
  --mme-white:#ffffff;
  --mme-green:#0b8f55;
  --mme-green-bg:#e9f8f0;
  --mme-red:#b42318;
  --mme-red-bg:#fff0ef;
  --mme-yellow:#916800;
  --mme-yellow-bg:#fff7d9;
  --mme-purple:#7047c9;
  --mme-purple-bg:#f3edff;
  --mme-blue-soft:#eef4ff;
  --mme-gray-bg:#f1f4f8;
  --mme-radius:14px;
  --mme-shadow:0 8px 28px rgba(14,32,68,.06);
}

html,body{
  background:var(--mme-bg);
  color:var(--mme-text);
  font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
  font-size:13px;
  line-height:1.45;
  letter-spacing:-.01em;
}

body{margin:0}

/* Make existing shell calmer and tighter */
.sidebar,
aside,
nav.sidebar{
  background:linear-gradient(180deg,#06182f 0%,#09244a 100%) !important;
}

.sidebar h1,
.sidebar h2,
aside h1,
aside h2{
  font-size:18px !important;
  letter-spacing:-.03em;
}

.sidebar a,
aside a{
  font-size:13px !important;
  border-radius:10px !important;
}

/* Main content */
.main,
.content,
main{
  background:var(--mme-bg);
}

.hero{
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
  padding:4px 2px 14px !important;
  margin:0 !important;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
}

.hero h2{
  margin:0 0 3px;
  font-size:21px !important;
  line-height:1.2;
  font-weight:750;
  letter-spacing:-.035em;
  color:var(--mme-navy);
}

.hero p{
  margin:0;
  color:var(--mme-muted);
  font-size:12.5px;
}

.hero .pill{
  font-size:10px !important;
  letter-spacing:.06em;
  padding:7px 10px !important;
  background:#edf3ff !important;
  color:#2b55a0 !important;
  border:1px solid #dce8ff !important;
  border-radius:999px !important;
}

/* KPI strip */
.cards{
  display:grid !important;
  grid-template-columns:repeat(8,minmax(112px,1fr)) !important;
  gap:10px !important;
  margin:0 0 14px !important;
}

.card{
  min-height:70px !important;
  padding:13px 14px !important;
  border:1px solid var(--mme-line) !important;
  border-radius:var(--mme-radius) !important;
  background:var(--mme-white) !important;
  box-shadow:0 3px 14px rgba(15,35,70,.035) !important;
}

.card .muted{
  font-size:10.5px !important;
  text-transform:uppercase;
  letter-spacing:.055em;
  font-weight:700;
  color:#8794aa !important;
  white-space:nowrap;
}

.card .num{
  margin-top:5px;
  font-size:22px !important;
  line-height:1;
  font-weight:780 !important;
  letter-spacing:-.045em;
  color:var(--mme-navy);
}

/* Dashboard controls */
.mme-toolbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:12px 14px;
  background:#fff;
  border:1px solid var(--mme-line);
  border-bottom:0;
  border-radius:var(--mme-radius) var(--mme-radius) 0 0;
}

.mme-toolbar-left{
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
}

.mme-toolbar-title{
  font-weight:750;
  color:var(--mme-navy);
  font-size:13px;
  margin-right:4px;
}

.mme-search{
  width:270px;
  max-width:38vw;
  border:1px solid #dce2eb;
  background:#fbfcfe;
  border-radius:10px;
  padding:9px 11px;
  font-size:12px;
  color:var(--mme-text);
  outline:none;
  transition:.18s ease;
}

.mme-search:focus{
  border-color:#9cb9f5;
  background:#fff;
  box-shadow:0 0 0 3px rgba(31,94,255,.08);
}

.mme-chip{
  border:1px solid #e0e6ef;
  background:#fff;
  color:#5f6e87;
  border-radius:999px;
  padding:7px 10px;
  font-size:10.5px;
  font-weight:700;
  cursor:pointer;
  transition:.15s ease;
}

.mme-chip:hover,
.mme-chip.active{
  background:#eef4ff;
  color:#2454a6;
  border-color:#d2e0ff;
}

.mme-toolbar-note{
  color:#8a96aa;
  font-size:10.5px;
  white-space:nowrap;
}

/* Table container */
.wrap{
  background:#fff !important;
  border:1px solid var(--mme-line) !important;
  border-radius:0 0 var(--mme-radius) var(--mme-radius) !important;
  box-shadow:var(--mme-shadow) !important;
  overflow:auto !important;
  margin:0 !important;
}

.wrap table{
  width:100%;
  border-collapse:separate;
  border-spacing:0;
  min-width:1120px;
  font-size:11.5px !important;
}

.wrap thead th{
  position:sticky;
  top:0;
  z-index:2;
  background:#f9fafc !important;
  color:#748199 !important;
  font-size:9.5px !important;
  text-transform:uppercase;
  letter-spacing:.055em;
  font-weight:760 !important;
  padding:10px 11px !important;
  border-bottom:1px solid var(--mme-line) !important;
  white-space:nowrap;
}

.wrap tbody td{
  padding:10px 11px !important;
  border-bottom:1px solid #edf0f5 !important;
  color:#26344e;
  vertical-align:middle !important;
}

.wrap tbody tr{
  transition:background-color .14s ease, box-shadow .14s ease;
}

.wrap tbody tr:hover{
  background:#fafcff !important;
}

.wrap tbody tr:last-child td{
  border-bottom:0 !important;
}

/* Buyer / message compact hierarchy */
.mme-buyer strong{
  display:block;
  font-size:12.5px;
  line-height:1.25;
  font-weight:760;
  color:#14223b;
  margin-bottom:2px;
}

.mme-buyer-meta{
  display:block;
  font-size:9.7px;
  color:#8a97ac;
  letter-spacing:.005em;
}

.mme-product-line{
  margin-top:4px;
  font-size:9.7px;
  color:#52647f;
  font-weight:620;
}

.mme-message{
  max-width:255px;
  line-height:1.38;
  color:#33415a;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
}

/* Existing badge override */
.badge{
  display:inline-flex !important;
  align-items:center;
  justify-content:center;
  min-height:20px;
  padding:3px 8px !important;
  border-radius:999px !important;
  border:1px solid transparent;
  font-size:9.5px !important;
  line-height:1;
  font-weight:760 !important;
  text-transform:none !important;
  letter-spacing:.005em;
  white-space:nowrap;
}

.badge.gray{background:var(--mme-gray-bg)!important;color:#64748b!important;border-color:#e7ebf0!important}
.badge.green{background:var(--mme-green-bg)!important;color:#087646!important;border-color:#d9f1e5!important}
.badge.red{background:var(--mme-red-bg)!important;color:var(--mme-red)!important;border-color:#ffdeda!important}
.badge.yellow{background:var(--mme-yellow-bg)!important;color:#826100!important;border-color:#f7ebaf!important}
.badge.blue{background:var(--mme-blue-soft)!important;color:#2759ae!important;border-color:#dde8ff!important}
.badge.purple{background:var(--mme-purple-bg)!important;color:var(--mme-purple)!important;border-color:#e9ddff!important}

/* Buttons */
.btn{
  border:0 !important;
  border-radius:9px !important;
  background:linear-gradient(180deg,#113a70,#0a2b56) !important;
  color:#fff !important;
  font-size:10px !important;
  font-weight:740 !important;
  padding:8px 10px !important;
  box-shadow:0 3px 8px rgba(5,34,72,.12);
  text-decoration:none !important;
  white-space:nowrap;
}

.btn:hover{
  transform:translateY(-1px);
  filter:brightness(1.05);
}

.btn.gray{
  background:#f4f6f9 !important;
  color:#33445f !important;
  border:1px solid #e1e6ee !important;
  box-shadow:none;
}

/* Response-time intelligence */
.mme-response{
  display:inline-flex;
  align-items:center;
  gap:5px;
  font-size:10.5px;
  font-weight:720;
  white-space:nowrap;
}

.mme-response::before{
  content:"";
  width:6px;
  height:6px;
  border-radius:50%;
  background:#9aa7ba;
}
.mme-response.fast{color:#0a7b4b}
.mme-response.fast::before{background:#12a765}
.mme-response.medium{color:#9a6a00}
.mme-response.medium::before{background:#e0a20b}
.mme-response.slow{color:#b42318}
.mme-response.slow::before{background:#d92d20}
.mme-response.none{color:#7c889b}

/* Attention rail */
.mme-attention{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:8px;
  margin:0 0 12px;
}

.mme-attention-card{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:9px 11px;
  border:1px solid var(--mme-line);
  border-radius:11px;
  background:#fff;
}

.mme-attention-card .label{
  font-size:10.5px;
  color:#6f7d94;
  font-weight:700;
}

.mme-attention-card .value{
  font-size:13px;
  color:var(--mme-navy);
  font-weight:800;
}

/* Login */
body.mme-login-body{
  min-height:100vh;
  display:grid;
  place-items:center;
  padding:24px;
  background:
    radial-gradient(circle at 15% 15%,rgba(34,94,190,.12),transparent 28%),
    radial-gradient(circle at 85% 80%,rgba(7,26,54,.10),transparent 34%),
    #f4f7fb;
}

.mme-login-shell{
  width:min(860px,94vw);
  min-height:470px;
  display:grid;
  grid-template-columns:1.05fr .95fr;
  overflow:hidden;
  border:1px solid #e1e7f0;
  border-radius:22px;
  background:#fff;
  box-shadow:0 24px 80px rgba(13,34,69,.12);
}

.mme-login-brand{
  padding:46px;
  color:#fff;
  background:
    linear-gradient(145deg,rgba(26,77,151,.26),transparent 45%),
    linear-gradient(160deg,#06162c,#0a2a55 70%,#0f376a);
  display:flex;
  flex-direction:column;
  justify-content:space-between;
}

.mme-login-brand h1{
  margin:10px 0 8px;
  font-size:25px;
  line-height:1.12;
  letter-spacing:-.045em;
}

.mme-login-brand p{
  margin:0;
  max-width:320px;
  color:#c8d6eb;
  font-size:12px;
}

.mme-login-brand .micro{
  font-size:9.5px;
  text-transform:uppercase;
  letter-spacing:.12em;
  color:#84a7d5;
  font-weight:800;
}

.mme-login-panel{
  padding:46px 42px;
  display:flex;
  flex-direction:column;
  justify-content:center;
}

.mme-login-panel h2{
  margin:0 0 5px;
  color:var(--mme-navy);
  font-size:20px;
  letter-spacing:-.035em;
}

.mme-login-panel .sub{
  color:#8793a7;
  margin-bottom:26px;
  font-size:11.5px;
}

.mme-login-panel label{
  display:block;
  margin:0 0 6px;
  color:#4c5c74;
  font-size:10px;
  font-weight:760;
  text-transform:uppercase;
  letter-spacing:.055em;
}

.mme-login-panel input{
  width:100%;
  box-sizing:border-box;
  padding:10px 11px;
  border:1px solid #dce3ed;
  border-radius:10px;
  outline:none;
  font-size:12px;
  color:#1f2e46;
  background:#fbfcfe;
  margin-bottom:15px;
}

.mme-login-panel input:focus{
  border-color:#9db8eb;
  background:#fff;
  box-shadow:0 0 0 3px rgba(31,94,255,.08);
}

.mme-login-panel button{
  width:100%;
  margin-top:4px;
  padding:10px 12px !important;
  font-size:11px !important;
}

.mme-login-error{
  margin:0 0 14px;
  padding:9px 10px;
  background:#fff1f0;
  color:#b42318;
  border:1px solid #ffdeda;
  border-radius:9px;
  font-size:10.5px;
}

/* Responsive */
@media(max-width:1250px){
  .cards{grid-template-columns:repeat(4,1fr)!important}
}
@media(max-width:900px){
  .cards{grid-template-columns:repeat(2,1fr)!important}
  .mme-attention{grid-template-columns:1fr}
  .mme-toolbar{align-items:flex-start;flex-direction:column}
  .mme-search{width:100%;max-width:none}
  .mme-login-shell{grid-template-columns:1fr;min-height:auto}
  .mme-login-brand{display:none}
}
