:root{
  --mec-primary:#0b2a4a;      /* deep navy */
  --mec-primary-2:#124b7a;    /* mid blue */
  --mec-accent:#1b6fbf;       /* accent */
  --mec-bg:#f3f6fb;
  --mec-card:#ffffff;
  --mec-border:rgba(0,0,0,.07);
}

body{ background:var(--mec-bg); overflow-x:hidden; }

.mec-sidebar{
  width:270px;
	flex:0 0 270px;
	min-width:270px;
	flex-shrink:0 !important;
	max-width:270px;
	box-sizing:border-box;
  background:linear-gradient(180deg,var(--mec-primary) 0%, #081f36 100%);
  height:100vh;
  max-height:100vh;
  min-height:100vh;
	display:flex;
	flex-direction:column;
	overflow:hidden;
	position:fixed;
	left:0;
	top:0;
	bottom:0;
	z-index:1000;
}
.mec-sidebar-nav{
	flex:1 1 auto;
	min-height:0;
	overflow-y:auto;
	overflow-x:hidden;
	-webkit-overflow-scrolling:touch;
	margin-top:4px;
	padding-right:2px;
	padding-bottom:8px;
}
.mec-sidebar-nav::-webkit-scrollbar{
	width:6px;
}
.mec-sidebar-nav::-webkit-scrollbar-track{
	background:transparent;
}
.mec-sidebar-nav::-webkit-scrollbar-thumb{
	background:rgba(255,255,255,.22);
	border-radius:999px;
}
.mec-sidebar-nav::-webkit-scrollbar-thumb:hover{
	background:rgba(255,255,255,.35);
}
.flex-grow-1{
	min-width:0; /* allow flex item to shrink without squeezing sidebar */
	margin-left:0;
	padding-left:270px; /* reserve space for fixed sidebar without increasing layout width */
	flex:1 1 auto;
}
.d-flex{
	min-width:0;
	flex-wrap:nowrap;
	width:100%;
	padding-left:0;
}
.flex-grow-1, main{
	overflow-x:hidden; /* prevent global horizontal scrollbar affecting sidebar width */
}

main{
	min-width:0;
	width:100%;
}

/* Prevent form controls from forcing the whole layout wider */
.form-control, .form-select, textarea{
	max-width:100%;
	box-sizing:border-box;
}

/* Settings page specific: ensure content never expands layout width */
.mec-settings-page{
	min-width:0;
	width:100%;
	overflow-x:hidden; /* prevent horizontal spillover that makes sidebar look squeezed */
}
.mec-settings-page .table{
	width:100%;
	table-layout:fixed;
	min-width:0;
}
.mec-settings-page .table-responsive{
	overflow-x:auto;
}

/* Bootstrap .row has negative side margins; on settings page this can spill
   outside the main flex area and affect visible sidebar width. */
.mec-settings-page .row{
	margin-left:0 !important;
	margin-right:0 !important;
}
.mec-sidebar a{ color:rgba(255,255,255,.86); text-decoration:none; }
.mec-sidebar a:hover{ color:#fff; }
.mec-sidebar .nav-link.active{ background:rgba(255,255,255,.12); }
.mec-sidebar .nav-link{ border-radius:10px; }
.mec-brand{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:0;
  padding:6px 4px 14px 4px;
  flex-shrink:0;
}
.mec-brand .title{ color:#fff; font-weight:800; letter-spacing:.5px; line-height:1.1; }
.mec-brand .subtitle{ color:rgba(255,255,255,.7); font-size:.75rem; }
.mec-logo{
  width:100%;
  height:auto;
  border-radius:12px;
  background:#fff;
  padding:10px 12px;
  text-align:center;
}
.mec-topbar{ background:#fff; border-bottom:1px solid var(--mec-border); }
.card{ border:0; box-shadow:0 1px 10px rgba(12,25,40,.06); }
.badge.bg-danger-soft{ background:rgba(220,53,69,.12); color:#b02a37; }
.badge.bg-warning-soft{ background:rgba(255,193,7,.18); color:#7a5b00; }
.badge.bg-info-soft{ background:rgba(13,202,240,.18); color:#0b7285; }

.kpi{
  border:1px solid var(--mec-border);
  border-radius:14px;
  background:var(--mec-card);
  padding:14px;
}
.kpi .label{ color:#6c757d; font-size:.85rem; }
.kpi .value{ font-size:1.6rem; font-weight:800; }
.kpi .value.danger{ color:#dc3545; }
.kpi .value.success{ color:#198754; }

/* Dashboard hero */
.dashboard-hero{
  background:linear-gradient(135deg, var(--mec-primary) 0%, var(--mec-accent) 100%);
  border-radius:16px;
  padding:28px 32px;
  color:#fff;
  box-shadow:0 8px 32px rgba(11,42,74,.25);
}
.dashboard-hero-sales{
  background:linear-gradient(135deg, #124b7a 0%, #1b8fbf 100%);
}
.dashboard-hero-content{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:20px;
  flex-wrap:wrap;
}
.dashboard-hero-title{ font-weight:800; font-size:1.5rem; }
.dashboard-hero-sub{ color:rgba(255,255,255,.85); }

/* Enhanced KPI cards */
.kpi{
  position:relative;
  overflow:hidden;
  transition:transform .2s, box-shadow .2s;
}
.kpi:hover{
  transform:translateY(-2px);
  box-shadow:0 6px 20px rgba(12,25,40,.1);
}
.kpi-icon{
  position:absolute;
  top:12px;
  right:14px;
  font-size:1.4rem;
  opacity:.15;
}
.kpi-primary{ border-left:4px solid #0d6efd; }
.kpi-info{ border-left:4px solid #0dcaf0; }
.kpi-accent{ border-left:4px solid var(--mec-accent); }
.kpi-success{ border-left:4px solid #198754; }
.kpi-danger{ border-left:4px solid #dc3545; }
.kpi-value-sm{ font-size:1.3rem !important; }

/* Pipeline board (kanban) */
.pipeline-board{
  display:flex;
  gap:12px;
  overflow-x:auto;
  padding-bottom:8px;
}
.pipeline-column{
  flex:0 0 180px;
  min-width:180px;
  background:#f8fafc;
  border-radius:12px;
  border:1px solid var(--mec-border);
}
.pipeline-column-header{
  padding:10px 12px;
  font-weight:700;
  font-size:.85rem;
  display:flex;
  justify-content:space-between;
  align-items:center;
  border-bottom:1px solid var(--mec-border);
  background:#fff;
  border-radius:12px 12px 0 0;
}
.pipeline-column-body{
  padding:8px;
  min-height:80px;
  max-height:200px;
  overflow-y:auto;
}
.pipeline-card{
  display:block;
  background:#fff;
  border:1px solid var(--mec-border);
  border-radius:8px;
  padding:8px 10px;
  margin-bottom:6px;
  text-decoration:none;
  color:inherit;
  transition:box-shadow .15s, border-color .15s;
}
.pipeline-card:hover{
  border-color:var(--mec-accent);
  box-shadow:0 2px 8px rgba(27,111,191,.15);
  color:inherit;
}
.pipeline-card-code{ font-weight:700; font-size:.8rem; color:var(--mec-accent); }
.pipeline-card-company{ font-size:.78rem; color:#6c757d; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.pipeline-empty{ color:#adb5bd; font-size:.8rem; text-align:center; padding:16px 0; }

/* Pipeline stepper */
/* Lead status badges */
.lead-status-badge{ font-weight:600; font-size:.78rem; padding:.35em .65em; }
.lead-status-new{ background:rgba(13,110,253,.12); color:#0d6efd; }
.lead-status-assigned{ background:rgba(102,16,242,.12); color:#6610f2; }
.lead-status-contacted{ background:rgba(13,202,240,.15); color:#0b7285; }
.lead-status-analysis{ background:rgba(111,66,193,.12); color:#6f42c1; }
.lead-status-visit{ background:rgba(32,201,151,.15); color:#0f7a5c; }
.lead-status-qualified{ background:rgba(25,135,84,.15); color:#198754; }
.lead-status-draft{ background:rgba(108,117,125,.15); color:#495057; }
.lead-status-sent{ background:rgba(253,126,20,.15); color:#c45a00; }
.lead-status-negotiation{ background:rgba(255,193,7,.2); color:#7a5b00; }
.lead-status-won{ background:rgba(25,135,84,.2); color:#146c43; }
.lead-status-lost{ background:rgba(220,53,69,.15); color:#b02a37; }
.lead-status-hold{ background:rgba(108,117,125,.12); color:#6c757d; }
.lead-status-disqualified{ background:rgba(52,58,64,.12); color:#343a40; }
.lead-status-recycled{ background:rgba(13,202,240,.12); color:#0b7285; }
.lead-status-default{ background:rgba(108,117,125,.1); color:#6c757d; }

/* Status filter chips (DreamCRM-style) */
.status-chip-bar{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  padding:12px 14px;
  background:#fff;
  border-radius:12px;
  border:1px solid var(--mec-border);
  box-shadow:0 1px 6px rgba(12,25,40,.04);
}
.status-chip{
  display:inline-block;
  padding:6px 14px;
  border-radius:20px;
  font-size:.8rem;
  font-weight:600;
  text-decoration:none;
  color:#495057;
  background:#f1f3f5;
  border:1px solid transparent;
  transition:all .15s;
}
.status-chip:hover{ background:#e9ecef; color:#212529; }
.status-chip.active{
  background:var(--mec-accent);
  color:#fff;
  border-color:var(--mec-accent);
}

.pipeline-stepper{ padding:8px 0; }
.pipeline-stepper-compact .pipeline-step{ min-width:72px; }
.pipeline-stepper-compact .pipeline-label{ font-size:.65rem; max-width:72px; }
.pipeline-stepper-compact .pipeline-node{ width:34px; height:34px; font-size:.95rem; }
.pipeline-stepper-compact .pipeline-connector{ margin-top:17px; }
.pipeline-track{
  display:flex;
  align-items:flex-start;
  flex-wrap:wrap;
  gap:0;
}
.pipeline-step{
  display:flex;
  flex-direction:column;
  align-items:center;
  min-width:90px;
  flex:1;
}
.pipeline-node{
  width:40px;
  height:40px;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  background:#e9ecef;
  color:#6c757d;
  font-size:1.1rem;
  border:2px solid #dee2e6;
  transition:all .2s;
}
.pipeline-step.done .pipeline-node{
  background:#198754;
  color:#fff;
  border-color:#198754;
}
.pipeline-step.active .pipeline-node{
  background:var(--mec-accent);
  color:#fff;
  border-color:var(--mec-accent);
  box-shadow:0 0 0 4px rgba(27,111,191,.25);
}
.pipeline-label{
  margin-top:6px;
  font-size:.72rem;
  font-weight:600;
  text-align:center;
  color:#6c757d;
  max-width:90px;
}
.pipeline-step.active .pipeline-label{ color:var(--mec-primary); font-weight:800; }
.pipeline-step.done .pipeline-label{ color:#198754; }
.pipeline-connector{
  flex:1;
  height:2px;
  background:#dee2e6;
  margin-top:20px;
  min-width:20px;
}
.pipeline-connector.done{ background:#198754; }
.pipeline-badge-won{ background:rgba(25,135,84,.15); color:#198754; }
.pipeline-badge-lost{ background:rgba(220,53,69,.15); color:#dc3545; }
.pipeline-badge-hold{ background:rgba(255,193,7,.2); color:#7a5b00; }

/* Quotation status badges */
.quote-status-draft{ background:rgba(108,117,125,.15); color:#495057; }
.quote-status-sent{ background:rgba(13,110,253,.15); color:#0d6efd; }
.quote-status-approved{ background:rgba(25,135,84,.15); color:#198754; }
.quote-status-rejected{ background:rgba(220,53,69,.15); color:#dc3545; }

/* Quotation builder */
.quote-builder-header{
  background:linear-gradient(135deg, #f8fafc 0%, #e8f0fe 100%);
  border-radius:12px;
  padding:20px;
  margin-bottom:20px;
  border:1px solid var(--mec-border);
}
.quote-totals-panel{
  background:linear-gradient(180deg, var(--mec-primary) 0%, #081f36 100%);
  color:#fff;
  border-radius:12px;
  padding:20px;
}
.quote-totals-panel .total-line{
  display:flex;
  justify-content:space-between;
  padding:6px 0;
  font-size:.95rem;
}
.quote-totals-panel .grand-total{
  font-size:1.5rem;
  font-weight:800;
  border-top:1px solid rgba(255,255,255,.2);
  padding-top:12px;
  margin-top:8px;
}
.quote-quick-row{
  padding:10px 12px;
  border-radius:8px;
  background:#f8fafc;
  border:1px solid var(--mec-border);
}
.attention-item{
  padding:6px 10px;
  border-radius:6px;
  background:#fafbfc;
}

/* Sidebar highlight for quotations */
.nav-link.nav-link-featured{
  background:rgba(255,255,255,.18) !important;
  font-weight:700;
  border:1px solid rgba(255,255,255,.2);
}
.nav-link.nav-link-featured:hover{
  background:rgba(255,255,255,.25) !important;
}

/* Report cards */
.report-card{
  border-radius:14px;
  transition:transform .2s, box-shadow .2s;
  height:100%;
}
.report-card:hover{
  transform:translateY(-3px);
  box-shadow:0 8px 24px rgba(12,25,40,.12);
}
.report-card .report-icon{
  width:48px;
  height:48px;
  border-radius:12px;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:1.4rem;
  margin-bottom:12px;
}