:root{
  /* Enhanced color palette */
  --mm-bg:#0f0f0f;--mm-card:#1e1e1e;--mm-text:#ffffff;--mm-muted:#a0a0a0;--mm-line:#333333;
  --mm-gold:#ffd700;--mm-gold-2:#e6c200;--mm-gold-3:#fff44f;--mm-gold-4:#b8860b;
  --mm-ok:#00ff88;--mm-warn:#ff9f00;--mm-danger:#ff4757;--mm-blue:#00d4ff;--mm-purple:#9c88ff;
  --mm-accent:#ff6b6b;--mm-success:#51cf66;--mm-info:#339af0;
  
  /* Enhanced spacing and effects */
  --mm-radius:12px;--mm-radius-lg:16px;--mm-radius-xl:20px;
  --mm-shadow:0 8px 32px rgba(255,215,0,.15);--mm-shadow-lg:0 16px 48px rgba(255,215,0,.25);
  --mm-shadow-glow:0 0 20px rgba(255,215,0,.3);--mm-shadow-intense:0 4px 24px rgba(255,215,0,.4);
  --mm-focus:0 0 0 3px rgba(255,215,0,.4);
  
  /* Gradients */
  --mm-gradient-gold:linear-gradient(135deg, var(--mm-gold), var(--mm-gold-2));
  --mm-gradient-dark:linear-gradient(135deg, #1a1a1a, #2d2d2d);
  --mm-gradient-card:linear-gradient(145deg, rgba(30,30,30,0.95), rgba(45,45,45,0.8));
  --mm-gradient-accent:linear-gradient(135deg, var(--mm-blue), var(--mm-purple));
  
  /* Animation timing */
  --mm-transition:all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  --mm-transition-fast:all 0.15s cubic-bezier(0.4, 0, 0.2, 1);
}
*{box-sizing:border-box}

/* Enhanced base styling */
.mm-wrap{
  font-family:'Inter', ui-sans-serif, system-ui, "Segoe UI", Roboto, Arial, sans-serif;
  color:var(--mm-text);
  background:var(--mm-bg);
  background-image:radial-gradient(circle at 20% 50%, rgba(255,215,0,0.05) 0%, transparent 50%),
                   radial-gradient(circle at 80% 20%, rgba(0,212,255,0.05) 0%, transparent 50%);
  border-radius:var(--mm-radius);
  padding:20px;
  min-height:100vh;
  position:relative;
  overflow-x:hidden;
}

.mm-wrap::before{
  content:'';
  position:fixed;
  top:0;left:0;right:0;bottom:0;
  background:url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><defs><pattern id="grid" width="10" height="10" patternUnits="userSpaceOnUse"><path d="M 10 0 L 0 0 0 10" fill="none" stroke="rgba(255,215,0,0.03)" stroke-width="0.5"/></pattern></defs><rect width="100" height="100" fill="url(%23grid)"/></svg>');
  pointer-events:none;
  z-index:-1;
}

.mm-hero{
  margin:0 0 32px;
  text-align:center;
  padding:24px 0;
  position:relative;
}

.mm-hero::before{
  content:'';
  position:absolute;
  top:0;left:50%;transform:translateX(-50%);
  width:200px;height:2px;
  background:var(--mm-gradient-gold);
  border-radius:1px;
  box-shadow:var(--mm-shadow-glow);
}

.mm-hero-title{
  background:var(--mm-gradient-gold) !important;
  -webkit-background-clip:text !important;
  background-clip:text !important;
  -webkit-text-fill-color:transparent !important;
  color:transparent !important;
  font-weight:900;
  font-size:2.5rem;
  margin:0.5rem 0;
  text-shadow:0 2px 4px rgba(0,0,0,0.3);
  letter-spacing:-0.02em;
}

.mm-sub{
  color:var(--mm-muted);
  font-size:0.95rem;
  line-height:1.5;
}
.mm-grid{display:grid;gap:1.25rem}
@media(min-width:768px){.mm-cols-2{grid-template-columns:repeat(2,1fr)}.mm-cols-3{grid-template-columns:repeat(3,1fr)}.mm-cols-4{grid-template-columns:repeat(4,1fr)}}
/* Enhanced card styling */
.mm-card{
  background:var(--mm-card);
  border:1px solid rgba(212,175,55,.35);
  border-radius:var(--mm-radius);
  box-shadow:var(--mm-shadow);
  padding:24px;
  transition:all var(--mm-transition);
  position:relative;
  overflow:hidden;
}

.mm-card::before{
  content:'';
  position:absolute;
  top:0;left:0;right:0;
  height:2px;
  background:var(--mm-gradient-gold);
  opacity:0;
  transition:opacity var(--mm-transition);
}

.mm-card:hover{
  transform:translateY(-4px);
  box-shadow:var(--mm-shadow-xl);
  border-color:rgba(212,175,55,.65);
}

.mm-card:hover::before{
  opacity:1;
}
.mm-card h2{color:var(--mm-gold-2);font-weight:800;margin:0 0 .25rem}
.mm-toolbar{display:flex;flex-wrap:wrap;gap:.6rem;align-items:center}
/* Enhanced sticky toolbar */
.mm-sticky{
  position:sticky;
  top:0;
  z-index:99;
  background:rgba(42,42,42,.98);
  backdrop-filter:saturate(180%) blur(12px);
  border:1px solid rgba(212,175,55,.4);
  border-radius:var(--mm-radius);
  padding:16px 20px;
  margin-bottom:20px;
  box-shadow:var(--mm-shadow-lg);
  transition:all var(--mm-transition);
}

.mm-sticky::before{
  content:'';
  position:absolute;
  top:0;left:0;right:0;
  height:1px;
  background:var(--mm-gradient-gold);
  opacity:0.6;
}
/* Enhanced button styling */
.mm-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  background:var(--mm-gradient-gold);
  color:#fff;
  font-weight:700;
  padding:12px 20px;
  border-radius:var(--mm-radius);
  box-shadow:var(--mm-shadow-md);
  transition:all var(--mm-transition);
  border:0;
  cursor:pointer;
  min-height:44px;
  position:relative;
  overflow:hidden;
  text-shadow:0 1px 2px rgba(0,0,0,0.2);
  font-size:14px;
}

.mm-btn::before{
  content:'';
  position:absolute;
  top:0;left:-100%;right:0;bottom:0;
  background:linear-gradient(90deg, transparent, rgba(255,255,255,0.15), transparent);
  transition:left 0.6s;
}

.mm-btn:hover{
  transform:translateY(-2px);
  box-shadow:var(--mm-shadow-lg);
  filter:brightness(1.05);
}

.mm-btn:hover::before{
  left:100%;
}

.mm-btn:active{
  transform:translateY(0);
  box-shadow:var(--mm-shadow-sm);
}

.mm-btn.secondary{
  background:var(--mm-gradient-secondary);
  color:var(--mm-text);
  box-shadow:var(--mm-shadow-sm);
}

.mm-btn.ghost{
  background:var(--mm-card);
  color:var(--mm-text);
  border:1px solid var(--mm-line);
  box-shadow:none;
}

.mm-btn.ghost:hover{
  background:var(--mm-secondary);
  border-color:var(--mm-gold);
}

.mm-btn:disabled{
  opacity:0.6;
  cursor:not-allowed;
  transform:none !important;
  box-shadow:var(--mm-shadow-sm) !important;
}
.mm-field{display:flex;flex-direction:column;gap:.35rem}
.mm-field label{color:var(--mm-text);font-weight:600;font-size:.9rem}
/* Enhanced form inputs */
.mm-input,.mm-select,.mm-textarea{
  border:1px solid var(--mm-line);
  border-radius:var(--mm-radius);
  padding:12px 16px;
  background:var(--mm-card);
  color:var(--mm-text);
  min-height:44px;
  transition:all var(--mm-transition);
  font-size:14px;
  position:relative;
}

.mm-input:focus,.mm-select:focus,.mm-textarea:focus{
  outline:none;
  box-shadow:var(--mm-shadow-focus);
  border-color:var(--mm-gold);
  background:rgba(255,255,255,0.02);
  transform:translateY(-1px);
}

.mm-input:hover,.mm-select:hover,.mm-textarea:hover{
  border-color:rgba(212,175,55,.5);
  box-shadow:var(--mm-shadow-sm);
}
/* Enhanced table styling */
.mm-table{
  width:100%;
  border-collapse:separate;
  border-spacing:0;
  overflow:auto;
  border-radius:var(--mm-radius);
  box-shadow:var(--mm-shadow);
  background:var(--mm-card);
}

.mm-table th,.mm-table td{
  padding:12px 16px;
  border-bottom:1px solid var(--mm-line);
  text-align:left;
  vertical-align:middle;
  white-space:nowrap;
  transition:all var(--mm-transition);
}

.mm-table tr:hover td{
  background:rgba(212,175,55,.12);
  transform:scale(1.002);
}

.mm-table tr.is-active td{
  background:var(--mm-gradient-gold) !important;
  color:var(--mm-dark) !important;
  font-weight:600;
}

.mm-table th{
  font-weight:700;
  color:var(--mm-text);
  user-select:none;
  position:sticky;
  top:0;
  background:var(--mm-gradient-secondary);
  border-bottom:2px solid var(--mm-gold);
  backdrop-filter:blur(8px);
}
.mm-table th.sortable{cursor:pointer}
.mm-table th.sortable:after{content:'⇅';font-size:.8rem;color:#bbb;margin-left:.4rem}
.mm-table th.sort-asc:after{content:'↑'}
.mm-table th.sort-desc:after{content:'↓'}
/* Enhanced badge styling */
.mm-badge{
  display:inline-flex;
  align-items:center;
  gap:4px;
  font-size:0.75rem;
  font-weight:600;
  padding:6px 12px;
  border-radius:999px;
  border:1px solid var(--mm-line);
  transition:all var(--mm-transition);
  text-shadow:0 1px 2px rgba(0,0,0,0.1);
  box-shadow:var(--mm-shadow-sm);
}

.mm-badge:hover{
  transform:translateY(-1px);
  box-shadow:var(--mm-shadow-md);
}

.mm-badge.status-planning{
  background:linear-gradient(135deg, rgba(37,99,235,.15), rgba(37,99,235,.08));
  border-color:rgba(37,99,235,.35);
  color:var(--mm-blue);
}

.mm-badge.status-ready{
  background:linear-gradient(135deg, rgba(22,163,74,.15), rgba(22,163,74,.08));
  border-color:rgba(22,163,74,.35);
  color:var(--mm-ok);
}

.mm-badge.status-active{
  background:linear-gradient(135deg, rgba(37,99,235,.20), rgba(37,99,235,.12));
  border-color:rgba(37,99,235,.4);
  color:var(--mm-blue);
  animation:pulse 2s infinite;
}

.mm-badge.status-complete{
  background:linear-gradient(135deg, rgba(22,163,74,.20), rgba(22,163,74,.12));
  border-color:rgba(22,163,74,.4);
  color:var(--mm-ok);
}

.mm-badge.status-archived{
  background:linear-gradient(135deg, rgba(107,114,128,.15), rgba(107,114,128,.1));
  border-color:rgba(107,114,128,.35);
  color:#6b7280;
}

.mm-badge.priority-low {
  background:linear-gradient(135deg, rgba(37,99,235,.12), rgba(37,99,235,.08));
  border-color:rgba(37,99,235,.3);
  color:var(--mm-blue);
}

.mm-badge.priority-normal{
  background:linear-gradient(135deg, rgba(75,85,99,.12), rgba(75,85,99,.08));
  border-color:rgba(75,85,99,.25);
  color:#374151;
}

.mm-badge.priority-high{
  background:linear-gradient(135deg, rgba(245,158,11,.18), rgba(245,158,11,.12));
  border-color:rgba(245,158,11,.4);
  color:var(--mm-warn);
}

.mm-badge.priority-critical{
  background:linear-gradient(135deg, rgba(220,38,38,.18), rgba(220,38,38,.12));
  border-color:rgba(220,38,38,.4);
  color:var(--mm-danger);
  animation:pulse 2s infinite;
}
/* Enhanced summary components */
.mm-summary-box{
  background:linear-gradient(135deg, rgba(212,175,55,.12), rgba(212,175,55,.06));
  border:1px dashed rgba(212,175,55,.5);
  border-radius:var(--mm-radius);
  padding:16px;
  position:relative;
  overflow:hidden;
  transition:all var(--mm-transition);
}

.mm-summary-box::before{
  content:'';
  position:absolute;
  top:0;left:0;
  width:4px;height:100%;
  background:var(--mm-gradient-gold);
}

.mm-summary-box:hover{
  background:linear-gradient(135deg, rgba(212,175,55,.16), rgba(212,175,55,.08));
  border-color:rgba(212,175,55,.6);
  transform:translateY(-1px);
  box-shadow:var(--mm-shadow-sm);
}

.mm-summary-value{
  display:block;
  font-weight:800;
  font-size:1.1rem;
  color:var(--mm-text);
  margin-top:6px;
  text-shadow:0 1px 2px rgba(0,0,0,0.1);
}

.mm-metric{
  font-size:1.2rem;
  font-weight:900;
  color:var(--mm-gold);
  margin-top:4px;
  text-shadow:0 1px 2px rgba(0,0,0,0.2);
}
.mm-btn.tiny{padding:6px 10px;min-height:auto;font-size:.82rem}
.badge-ok{background:rgba(22,163,74,.08);border-color:rgba(22,163,74,.25);color:var(--mm-ok)}
.badge-warn{background:rgba(245,158,11,.08);border-color:rgba(245,158,11,.25);color:var(--mm-warn)}
.badge-danger{background:rgba(220,38,38,.08);border-color:rgba(220,38,38,.25);color:var(--mm-danger)}
.mm-stat .label{color:var(--mm-muted);font-size:.82rem;margin-bottom:3px}
.mm-stat .value{font-size:1.35rem;font-weight:800;letter-spacing:.2px;color:var(--mm-text)}
.mm-activity{display:flex;align-items:center;gap:.6rem;padding:10px 0;border-bottom:1px solid rgba(212,175,55,.22)}
.mm-dot{width:8px;height:8px;border-radius:50%;background:var(--mm-gold-2)}
.dot-income{background:var(--mm-ok)}.dot-expense{background:var(--mm-danger)}.dot-stock{background:#a16207}.dot-session{background:var(--mm-blue)}
.mm-toast{position:fixed;right:16px;bottom:16px;background:#111;color:#fff;padding:10px 14px;border-radius:10px;box-shadow:0 10px 25px rgba(0,0,0,.35);opacity:.96;z-index:9999}
.mm-actions{display:flex;gap:.5rem;align-items:center}
.mm-search{max-width:260px}
.mm-empty{color:var(--mm-muted);text-align:center;padding:12px}
.mm-pagination{display:flex;gap:.5rem;align-items:center;justify-content:flex-end;margin-top:10px}
/* Legacy page button styles - replaced above */
.mm-modal-backdrop{position:fixed;inset:0;background:rgba(0,0,0,.35);display:flex;align-items:center;justify-content:center;z-index:9998}
.mm-modal{background:var(--mm-card);border-radius:16px;box-shadow:var(--mm-shadow-lg);width:520px;max-width:95vw;padding:18px;border:1px solid rgba(212,175,55,.35)}
.mm-modal h3{margin:0 0 .5rem;color:var(--mm-text);font-weight:800}
.mm-modal .mm-modal-actions{display:flex;justify-content:flex-end;gap:.5rem;margin-top:10px}

/* Ledger analytics */
.mm-ledger-analytics{margin-bottom:18px}
.mm-chart-block{display:flex;flex-wrap:wrap;gap:1.5rem;align-items:center;justify-content:space-between}
.mm-chart-pie{--size:170px;width:var(--size);height:var(--size);border-radius:50%;position:relative;background:#f3f4f6;box-shadow:inset 0 0 0 1px rgba(0,0,0,.05)}
.mm-chart-pie::after{content:"";position:absolute;inset:22%;background:#fff;border-radius:50%;box-shadow:inset 0 0 0 1px rgba(0,0,0,.04)}
.mm-chart-empty{display:flex;align-items:center;justify-content:center;text-align:center;color:var(--mm-muted);min-height:140px}
.mm-chart-legend{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:.6rem}
.mm-chart-legend li{display:flex;align-items:center;gap:.45rem;background:rgba(17,24,39,.04);border:1px solid rgba(17,24,39,.08);padding:6px 10px;border-radius:12px;font-size:.85rem}
.mm-chart-legend .swatch{width:12px;height:12px;border-radius:4px;display:inline-block;box-shadow:0 0 0 1px rgba(17,24,39,.08)}
.mm-ledger-trend{width:100%}
.mm-ledger-trend svg{width:100%;height:160px}
.mm-trend-legend{display:flex;gap:1rem;font-size:.85rem;color:var(--mm-muted);flex-wrap:wrap}
.mm-trend-legend span{display:inline-flex;align-items:center;gap:.4rem}
.mm-trend-dot{width:10px;height:10px;border-radius:50%;display:inline-block}
.mm-trend-labels{display:flex;justify-content:space-between;font-size:.8rem;color:var(--mm-muted);margin-top:8px}
.mm-chip{display:inline-flex;align-items:center;gap:.4rem;padding:5px 12px;border-radius:999px;font-size:.8rem;font-weight:600;background:rgba(17,24,39,.05);color:#1f2937;border:1px solid rgba(17,24,39,.08)}
.mm-chip.income{background:rgba(22,163,74,.12);border-color:rgba(22,163,74,.25);color:var(--mm-ok)}
.mm-chip.expense{background:rgba(220,38,38,.12);border-color:rgba(220,38,38,.25);color:var(--mm-danger)}
.mm-chip.muted{background:rgba(107,114,128,.08);border-color:rgba(107,114,128,.2);color:#4b5563}
.mm-ledger-pills{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:12px}
.mm-ledger-pills button{border:1px solid rgba(17,24,39,.15);background:#fff;padding:6px 12px;border-radius:999px;font-size:.82rem;cursor:pointer;transition:all .12s}
.mm-ledger-pills button .pill-value{font-weight:700;color:var(--mm-text)}
.mm-ledger-pills button:hover{border-color:rgba(212,175,55,.6);box-shadow:0 6px 16px rgba(212,175,55,.18)}
.mm-ledger-pills button.is-active{background:linear-gradient(90deg,var(--mm-gold),var(--mm-gold-2));color:#fff;border-color:transparent}
.mm-ledger-pills button.is-active .pill-value{color:#fff}
.mm-ledger-form-note{display:flex;align-items:center;gap:.5rem;color:var(--mm-muted);font-size:.82rem;margin-top:6px}
.mm-ledger-form-note .dot-expense,.mm-ledger-form-note .dot-income{width:8px;height:8px;border-radius:50%;display:inline-block}


/* Contrast fix for gold hero bg */
.mm-wrap > h1, .mm-wrap > h2, .mm-wrap > h3, .mm-wrap .section-title{ color:var(--mm-text) !important; }
.mm-card h1, .mm-card h2, .mm-card h3{ color:var(--mm-gold-2) !important; }

/* Color-coded values */
.mm-num.pos{color:var(--mm-ok);font-weight:700}
.mm-num.neg{color:var(--mm-danger);font-weight:700}

/* Footer */
.mm-footer{display:flex;gap:.5rem;align-items:center;justify-content:center;color:#777;margin-top:18px;font-size:.9rem}

/* Enhanced pagination */
.mm-pagination{display:flex;gap:.5rem;align-items:center;justify-content:space-between;margin:16px 0;padding:12px;background:var(--mm-card);border-radius:12px;border:1px solid var(--mm-line)}
.mm-pagination-info{color:var(--mm-muted);font-size:.9rem}
.mm-pagination-controls{display:flex;gap:.5rem;align-items:center}
.mm-page-btn{border:1px solid var(--mm-line);background:var(--mm-card);color:var(--mm-text);padding:8px 12px;border-radius:8px;cursor:pointer;min-width:40px;display:flex;align-items:center;justify-content:center}
.mm-page-btn:hover:not([disabled]){background:rgba(212,175,55,.1);border-color:var(--mm-gold)}
.mm-page-btn.active{background:var(--mm-gold);color:#000;border-color:var(--mm-gold)}
.mm-page-btn[disabled]{opacity:.4;cursor:not-allowed}

/* Bulk operations */
.mm-bulk-toolbar{display:flex;align-items:center;gap:.8rem;margin-bottom:12px;padding:10px;background:rgba(212,175,55,.08);border:1px solid rgba(212,175,55,.2);border-radius:10px}
.mm-bulk-select{margin-right:8px}
.mm-bulk-actions{display:flex;gap:.5rem}
.mm-bulk-btn{background:var(--mm-warn);color:#fff;padding:6px 12px;border-radius:6px;border:0;cursor:pointer;font-size:.85rem}
.mm-bulk-btn.danger{background:var(--mm-danger)}
.mm-bulk-btn.success{background:var(--mm-ok)}
.mm-bulk-btn:disabled{opacity:.6;cursor:not-allowed}

/* Checkbox styling */
.mm-checkbox{width:18px;height:18px;accent-color:var(--mm-gold)}
.mm-table .mm-checkbox-cell{width:40px;text-align:center}

/* Search and filter improvements */
.mm-search-bar{display:flex;gap:.5rem;align-items:center;margin-bottom:12px}
.mm-search{flex:1;max-width:none}
.mm-filter-select{min-width:120px}

/* Responsive improvements */
@media(max-width: 1024px){
  .mm-cols-4{grid-template-columns:repeat(2,1fr)}
  .mm-pagination{flex-direction:column;gap:8px;align-items:stretch}
  .mm-pagination-controls{justify-content:center}
  .mm-bulk-toolbar{flex-wrap:wrap}
}

/* Elementor integration */
.elementor-widget-shortcode .mm-wrap{
  margin:0;
  max-width:none;
}

.elementor-element .mm-wrap{
  background:transparent;
  border-radius:0;
  padding:0;
}

.elementor-element .mm-card{
  background:rgba(42,42,42,.95);
  backdrop-filter:blur(10px);
  border:1px solid rgba(212,175,55,.2);
}

/* Better tablet experience */
@media(max-width: 1024px) and (min-width: 769px){
  .mm-cols-4{grid-template-columns:repeat(2,1fr)}
  .mm-toolbar h1{font-size:1.3rem}
  .mm-btn{padding:8px 14px;font-size:.9rem}
  .mm-table{font-size:.9rem}
  .mm-modal{width:90vw;max-width:600px}
}

/* Mobile tweaks */
@media(max-width: 768px){
  .mm-wrap{padding:8px}
  .mm-hero-title{font-size:1.5rem}
  .mm-toolbar{
    padding:8px;
    flex-direction:column;
    align-items:stretch;
    gap:8px;
  }
  .mm-toolbar h1{
    font-size:1.2rem;
    text-align:center;
    margin-bottom:8px;
  }
  .mm-toolbar div{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(120px,1fr));
    gap:6px;
  }
  .mm-btn{
    min-width:auto;
    padding:10px 8px;
    font-size:.85rem;
    text-align:center;
  }
  .mm-table{
    display:block;
    overflow-x:auto;
    white-space:nowrap;
    font-size:.8rem;
  }
  .mm-table th,.mm-table td{
    padding:6px 8px;
    min-width:80px;
  }
  .mm-grid{gap:.8rem}
  .mm-cols-2,.mm-cols-3,.mm-cols-4{grid-template-columns:1fr}
  .mm-field label{font-size:.85rem;margin-bottom:4px}
  .mm-input,.mm-select,.mm-textarea{
    padding:8px 10px;
    font-size:.9rem;
  }
  .mm-card{padding:12px}
  .mm-card h2{font-size:1.1rem}
  .mm-modal{
    width:95vw;
    max-width:95vw;
    margin:10px;
    padding:12px;
  }
  .mm-pagination{
    padding:6px;
    flex-direction:column;
    gap:8px;
  }
  .mm-pagination-controls{
    flex-wrap:wrap;
    justify-content:center;
    gap:4px;
  }
  .mm-page-btn{
    padding:6px 10px;
    min-width:36px;
    font-size:.8rem;
  }
  .mm-bulk-toolbar{
    flex-direction:column;
    align-items:stretch;
    gap:8px;
    padding:8px;
  }
  .mm-bulk-actions{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(100px,1fr));
    gap:6px;
  }
  .mm-search-bar{
    flex-direction:column;
    align-items:stretch;
  }
}

/* Extra small screens */
@media(max-width: 480px){
  .mm-wrap{padding:4px}
  .mm-card{padding:8px}
  .mm-btn{padding:8px 6px;font-size:.8rem}
  .mm-input,.mm-select{padding:6px 8px;font-size:.85rem}
  .mm-table{font-size:.75rem}
  .mm-table th,.mm-table td{padding:4px 6px;min-width:60px}
  .mm-hero-title{font-size:1.3rem}
  .mm-toolbar h1{font-size:1rem}
}

/* Fix any remaining text color issues */
.mm-card .mm-sub,
.mm-sub,
.mm-pagination-info,
.mm-field .mm-sub {
  color: var(--mm-muted) !important;
}

.mm-card h1,
.mm-card h2,
.mm-card h3,
.mm-card h4,
.mm-card .mm-stat .value,
.mm-card .label {
  color: var(--mm-text) !important;
}

/* Ensure all buttons have consistent styling */
.mm-btn,
.mm-btn.ghost,
.mm-btn.secondary {
  color: inherit;
}

.mm-btn.ghost {
  color: var(--mm-text);
}

/* Inventory specific improvements */
.mm-field .mm-sub {
  font-size: 0.8rem;
  margin-top: 4px;
  line-height: 1.3;
}

/* Better spacing for inventory category field */
.mm-field select + input {
  margin-top: 6px;
}

/* Enhanced date range controls */
.mm-date-range-controls .mm-btn.active {
  background: var(--mm-gold);
  color: #000;
}

.mm-custom-date-range input[type="date"] {
  font-size: 0.85rem;
}

/* Financial metrics */
.mm-summary-value.positive {
  color: var(--mm-ok);
}

.mm-summary-value.negative {
  color: var(--mm-danger);
}

/* Enhanced list styling */
.mm-list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.mm-list li {
  padding: 4px 0;
  border-bottom: 1px solid rgba(212,175,55,.1);
}

.mm-list li:last-child {
  border-bottom: none;
}

/* Advanced Search Styles */
.mm-global-search {
  margin: 12px 0;
  position: relative;
}

.mm-search-input-wrapper {
  position: relative;
}

.mm-search-filters {
  display: flex;
  gap: 12px;
  margin-top: 8px;
  flex-wrap: wrap;
}

.mm-search-filters label {
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 0.85rem;
  color: var(--mm-muted);
  cursor: pointer;
}

.mm-search-filters input[type="checkbox"] {
  accent-color: var(--mm-gold);
}

.mm-search-results, .mm-search-suggestions {
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  background: var(--mm-card);
  border: 1px solid var(--mm-line);
  border-radius: 8px;
  box-shadow: var(--mm-shadow-lg);
  z-index: 1000;
  max-height: 400px;
  overflow-y: auto;
}

.mm-search-header {
  padding: 12px;
  border-bottom: 1px solid var(--mm-line);
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-weight: 600;
}

.mm-search-section {
  padding: 8px 0;
}

.mm-search-section-title {
  padding: 8px 12px;
  margin: 0;
  font-size: 0.9rem;
  font-weight: 600;
  color: var(--mm-gold-2);
  border-bottom: 1px solid rgba(212,175,55,.2);
}

.mm-search-result-item, .mm-suggestion-item {
  padding: 10px 12px;
  cursor: pointer;
  border-bottom: 1px solid rgba(212,175,55,.1);
  transition: background-color 0.15s;
}

.mm-search-result-item:hover, .mm-suggestion-item:hover {
  background: rgba(212,175,55,.08);
}

.mm-search-result-item:last-child {
  border-bottom: none;
}

.mm-search-result-item .mm-sub {
  display: block;
  margin-top: 2px;
}

.mm-suggestions-header {
  padding: 8px 12px;
  font-size: 0.85rem;
  font-weight: 600;
  color: var(--mm-muted);
  border-bottom: 1px solid var(--mm-line);
}

.mm-suggestion-item {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.mm-suggestion-module {
  font-size: 0.75rem;
  color: var(--mm-muted);
  background: rgba(212,175,55,.1);
  padding: 2px 6px;
  border-radius: 4px;
}

.mm-search-loading, .mm-search-error, .mm-search-empty {
  padding: 20px 12px;
  text-align: center;
  color: var(--mm-muted);
}

.mm-search-error {
  color: var(--mm-danger);
}

/* Bulk operations enhancements */
.mm-bulk-toolbar {
  background: rgba(212,175,55,.08);
  border: 1px solid rgba(212,175,55,.25);
  border-radius: 8px;
  padding: 10px 12px;
  margin: 8px 0;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.mm-bulk-actions {
  display: flex;
  gap: 6px;
}

.mm-bulk-btn {
  padding: 6px 12px;
  border-radius: 6px;
  border: 1px solid var(--mm-line);
  background: var(--mm-card);
  color: var(--mm-text);
  cursor: pointer;
  font-size: 0.85rem;
  transition: all 0.15s;
}

.mm-bulk-btn:hover {
  background: rgba(212,175,55,.1);
  border-color: var(--mm-gold);
}

.mm-bulk-btn.danger {
  background: var(--mm-danger);
  color: white;
  border-color: var(--mm-danger);
}

.mm-bulk-btn.ghost {
  background: transparent;
}

/* Inventory alerts and management */
.mm-alert-container {
  max-height: 200px;
  overflow-y: auto;
}

.mm-alert {
  padding: 12px;
  border-radius: 6px;
  border-left: 4px solid;
  transition: all 0.2s ease;
}

.mm-alert:hover {
  transform: translateX(2px);
  box-shadow: 0 2px 8px rgba(0,0,0,0.3);
}

.mm-alert-warning {
  background: rgba(255, 193, 7, 0.1);
  border-left-color: #ffc107;
  color: #ffc107;
}

.mm-alert-error {
  background: rgba(220, 53, 69, 0.1);
  border-left-color: #dc3545;
  color: #dc3545;
}

.mm-alert-info {
  background: rgba(13, 202, 240, 0.1);
  border-left-color: #0dcaf0;
  color: #0dcaf0;
}

/* Advanced form controls */
.mm-form-section {
  background: var(--dark-bg-secondary);
  border: 1px solid var(--dark-border);
  border-radius: 6px;
  padding: 16px;
  margin-bottom: 16px;
}

.mm-form-section h3 {
  margin: 0 0 12px 0;
  color: var(--text-primary);
  font-size: 14px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.mm-tag-input {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  align-items: center;
  min-height: 36px;
  padding: 6px;
  background: var(--dark-bg-primary);
  border: 1px solid var(--dark-border);
  border-radius: 4px;
}

.mm-tag {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  background: var(--accent-color);
  color: white;
  padding: 2px 8px;
  border-radius: 12px;
  font-size: 12px;
  font-weight: 500;
}

.mm-tag-remove {
  background: none;
  border: none;
  color: white;
  cursor: pointer;
  font-size: 14px;
  padding: 0;
  width: 16px;
  height: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
}

.mm-tag-remove:hover {
  background: rgba(255,255,255,0.2);
}

.mm-condition-indicator {
  display: inline-block;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  margin-right: 6px;
}

.mm-condition-new { background: #28a745; }
.mm-condition-good { background: #17a2b8; }
.mm-condition-fair { background: #ffc107; }
.mm-condition-poor { background: #dc3545; }

/* Advanced Dashboard Widgets */
.mm-dashboard-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  grid-auto-rows: 200px;
  gap: 16px;
  margin-bottom: 24px;
}

.mm-widget {
  background: var(--dark-bg-secondary);
  border: 1px solid var(--dark-border);
  border-radius: 8px;
  overflow: hidden;
  transition: all 0.3s ease;
  position: relative;
}

.mm-widget:hover {
  border-color: var(--accent-color);
  box-shadow: 0 4px 12px rgba(0,0,0,0.3);
}

.mm-widget.mm-dragging {
  opacity: 0.8;
  transform: scale(1.05);
  z-index: 1000;
  box-shadow: 0 8px 20px rgba(0,0,0,0.4);
}

.mm-widget-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 12px 16px;
  background: var(--dark-bg-primary);
  border-bottom: 1px solid var(--dark-border);
}

.mm-widget-title {
  margin: 0;
  font-size: 14px;
  font-weight: 600;
  color: var(--text-primary);
}

.mm-widget-controls {
  display: flex;
  gap: 4px;
  opacity: 0;
  transition: opacity 0.2s ease;
}

.mm-widget:hover .mm-widget-controls {
  opacity: 1;
}

.mm-widget-btn {
  background: none;
  border: none;
  color: var(--text-secondary);
  cursor: pointer;
  padding: 4px;
  border-radius: 4px;
  font-size: 12px;
  transition: all 0.2s ease;
}

.mm-widget-btn:hover {
  background: var(--dark-border);
  color: var(--text-primary);
}

.mm-drag-handle {
  cursor: grab;
}

.mm-drag-handle:active {
  cursor: grabbing;
}

.mm-widget-content {
  padding: 16px;
  height: calc(100% - 60px);
  overflow: auto;
}

/* Widget size variants */
.mm-widget-small {
  grid-column: span 1;
  grid-row: span 1;
}

.mm-widget-medium {
  grid-column: span 2;
  grid-row: span 1;
}

.mm-widget-large {
  grid-column: span 2;
  grid-row: span 2;
}

.mm-widget-wide {
  grid-column: span 4;
  grid-row: span 1;
}

/* Widget content styles */
.mm-stats-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
  height: 100%;
}

.mm-stat-item {
  text-align: center;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.mm-stat-value {
  font-size: 24px;
  font-weight: 700;
  color: var(--accent-color);
  margin-bottom: 4px;
}

.mm-stat-label {
  font-size: 12px;
  color: var(--text-secondary);
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.mm-chart-container {
  position: relative;
  height: 60%;
  margin-bottom: 12px;
}

.mm-chart-legend {
  display: flex;
  justify-content: center;
  gap: 16px;
}

.mm-legend-item {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
}

.mm-legend-color {
  width: 12px;
  height: 12px;
  border-radius: 2px;
}

/* Activity heatmap */
.mm-activity-heatmap {
  margin-bottom: 12px;
}

.mm-heatmap-days {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 2px;
  margin-bottom: 8px;
}

.mm-day-label {
  text-align: center;
  font-size: 10px;
  color: var(--text-secondary);
  font-weight: 500;
}

.mm-heatmap-grid {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 2px;
}

.mm-heatmap-cell {
  aspect-ratio: 1;
  background: var(--dark-bg-primary);
  border-radius: 2px;
  transition: all 0.2s ease;
}

.mm-heatmap-cell.activity-low { background: rgba(212, 175, 55, 0.3); }
.mm-heatmap-cell.activity-medium { background: rgba(212, 175, 55, 0.6); }
.mm-heatmap-cell.activity-high { background: rgba(212, 175, 55, 0.9); }

.mm-activity-stats {
  display: flex;
  justify-content: space-between;
  font-size: 12px;
}

/* Performance metrics */
.mm-metrics-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 16px;
  margin-bottom: 16px;
}

.mm-metric {
  text-align: center;
}

.mm-metric-value {
  font-size: 20px;
  font-weight: 700;
  color: var(--accent-color);
  margin-bottom: 4px;
}

.mm-metric-label {
  font-size: 11px;
  color: var(--text-secondary);
  text-transform: uppercase;
}

.mm-progress-bars {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.mm-progress-item label {
  display: block;
  font-size: 11px;
  color: var(--text-secondary);
  margin-bottom: 4px;
  text-transform: uppercase;
}

.mm-progress-bar {
  height: 6px;
  background: var(--dark-bg-primary);
  border-radius: 3px;
  overflow: hidden;
}

.mm-progress-fill {
  height: 100%;
  background: var(--accent-color);
  border-radius: 3px;
  transition: width 0.3s ease;
}

.mm-recent-list {
  height: calc(100% - 40px);
  overflow-y: auto;
}

/* Responsive dashboard */
@media (max-width: 1200px) {
  .mm-dashboard-grid {
    grid-template-columns: repeat(3, 1fr);
  }
  
  .mm-widget-wide {
    grid-column: span 3;
  }
}

@media (max-width: 768px) {
  .mm-dashboard-grid {
    grid-template-columns: repeat(2, 1fr);
    grid-auto-rows: 180px;
  }
  
  .mm-widget-wide,
  .mm-widget-large {
    grid-column: span 2;
  }
  
  .mm-stats-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

/* Operation Templates & Scheduling */
.mm-template-details {
  background: var(--dark-bg-primary);
  border: 1px solid var(--dark-border);
  border-radius: 6px;
  padding: 16px;
  margin-top: 12px;
}

.mm-template-info {
  font-size: 13px;
  line-height: 1.6;
}

.mm-template-info strong {
  color: var(--text-primary);
}

.mm-template-list {
  max-height: 400px;
  overflow-y: auto;
  border: 1px solid var(--dark-border);
  border-radius: 6px;
}

.mm-template-item {
  padding: 12px;
  border-bottom: 1px solid var(--dark-border);
  cursor: pointer;
  transition: all 0.2s ease;
}

.mm-template-item:last-child {
  border-bottom: none;
}

.mm-template-item:hover {
  background: var(--dark-bg-primary);
}

.mm-template-item.selected {
  background: rgba(212, 175, 55, 0.1);
  border-left: 3px solid var(--accent-color);
}

.mm-template-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin-bottom: 6px;
}

.mm-template-name {
  font-weight: 600;
  color: var(--text-primary);
  margin: 0;
}

.mm-template-category {
  background: var(--accent-color);
  color: white;
  padding: 2px 6px;
  border-radius: 3px;
  font-size: 10px;
  font-weight: 500;
  text-transform: uppercase;
}

.mm-template-description {
  color: var(--text-secondary);
  font-size: 12px;
  margin: 4px 0 0 0;
}

.mm-template-meta {
  display: flex;
  gap: 12px;
  margin-top: 8px;
  font-size: 11px;
  color: var(--text-secondary);
}

.mm-template-meta span {
  display: flex;
  align-items: center;
  gap: 4px;
}

.mm-risk-low { color: #28a745; }
.mm-risk-medium { color: #ffc107; }
.mm-risk-high { color: #dc3545; }
.mm-risk-critical { color: #6f42c1; }

/* Scheduling interface */
.mm-upcoming-list {
  max-height: 300px;
  overflow-y: auto;
  border: 1px solid var(--dark-border);
  border-radius: 6px;
}

.mm-upcoming-item {
  padding: 12px;
  border-bottom: 1px solid var(--dark-border);
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
}

.mm-upcoming-item:last-child {
  border-bottom: none;
}

.mm-upcoming-info h4 {
  margin: 0 0 4px 0;
  color: var(--text-primary);
  font-size: 14px;
}

.mm-upcoming-meta {
  font-size: 12px;
  color: var(--text-secondary);
}

.mm-upcoming-actions {
  display: flex;
  gap: 4px;
}

.mm-upcoming-actions button {
  padding: 4px 8px;
  font-size: 11px;
}

/* Schedule frequency indicators */
.mm-frequency-indicator {
  display: inline-block;
  padding: 2px 6px;
  border-radius: 3px;
  font-size: 10px;
  font-weight: 500;
  text-transform: uppercase;
}

.mm-frequency-once { background: rgba(108, 117, 125, 0.2); color: #6c757d; }
.mm-frequency-daily { background: rgba(40, 167, 69, 0.2); color: #28a745; }
.mm-frequency-weekly { background: rgba(0, 123, 255, 0.2); color: #007bff; }
.mm-frequency-monthly { background: rgba(220, 53, 69, 0.2); color: #dc3545; }

/* Template creation wizard */
.mm-template-wizard {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.mm-wizard-step {
  display: none;
}

.mm-wizard-step.active {
  display: block;
}

.mm-wizard-progress {
  display: flex;
  justify-content: space-between;
  margin-bottom: 20px;
}

.mm-wizard-progress-item {
  flex: 1;
  text-align: center;
  padding: 8px;
  background: var(--dark-bg-primary);
  border: 1px solid var(--dark-border);
  border-right: none;
  font-size: 12px;
  color: var(--text-secondary);
}

.mm-wizard-progress-item:first-child {
  border-radius: 6px 0 0 6px;
}

.mm-wizard-progress-item:last-child {
  border-radius: 0 6px 6px 0;
  border-right: 1px solid var(--dark-border);
}

.mm-wizard-progress-item.completed {
  background: var(--accent-color);
  color: white;
}

.mm-wizard-progress-item.active {
  background: rgba(212, 175, 55, 0.2);
  color: var(--accent-color);
  border-color: var(--accent-color);
}

/* Responsive design for templates */
@media (max-width: 768px) {
  .mm-template-details {
    padding: 12px;
  }
  
  .mm-template-list {
    max-height: 250px;
  }
  
  .mm-upcoming-list {
    max-height: 200px;
  }
  
  .mm-template-meta {
    flex-direction: column;
    gap: 4px;
  }
}

/* Data Visualization Enhancements */
.mm-tooltip {
  position: absolute;
  background: var(--dark-bg-secondary);
  border: 1px solid var(--dark-border);
  border-radius: 6px;
  padding: 8px 12px;
  color: var(--text-primary);
  font-size: 12px;
  z-index: 1000;
  pointer-events: none;
  box-shadow: 0 4px 12px rgba(0,0,0,0.3);
  max-width: 200px;
}

.mm-tooltip::before {
  content: '';
  position: absolute;
  bottom: -6px;
  left: 50%;
  transform: translateX(-50%);
  border: 6px solid transparent;
  border-top-color: var(--dark-border);
}

/* Interactive Chart Styles */
.mm-chart-container {
  position: relative;
  width: 100%;
  height: 100%;
}

.mm-chart-controls {
  position: absolute;
  top: 10px;
  right: 10px;
  display: flex;
  gap: 4px;
}

.mm-chart-btn {
  background: rgba(0,0,0,0.7);
  border: none;
  color: white;
  padding: 4px 8px;
  border-radius: 4px;
  cursor: pointer;
  font-size: 11px;
  transition: background 0.2s ease;
}

.mm-chart-btn:hover {
  background: rgba(0,0,0,0.9);
}

/* Heatmap Styles */
.mm-heatmap-table {
  display: inline-block;
  border-radius: 4px;
  overflow: hidden;
}

.mm-heatmap-row {
  display: flex;
}

.mm-heatmap-cell {
  cursor: pointer;
  transition: all 0.2s ease;
  position: relative;
  border: 1px solid var(--dark-bg-primary);
}

.mm-heatmap-cell:hover {
  transform: scale(1.1);
  z-index: 10;
  border-color: var(--accent-color);
  box-shadow: 0 2px 8px rgba(0,0,0,0.3);
}

.mm-heatmap-legend {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 12px;
  font-size: 12px;
}

.mm-heatmap-legend-gradient {
  width: 100px;
  height: 12px;
  border-radius: 6px;
  background: linear-gradient(to right, #1e1e1e, #d4af37);
}

.mm-heatmap-legend-labels {
  display: flex;
  justify-content: space-between;
  width: 100px;
  font-size: 10px;
  color: var(--text-secondary);
}

/* Timeline Styles */
.mm-timeline {
  position: relative;
  background: var(--dark-bg-primary);
  border: 1px solid var(--dark-border);
  border-radius: 6px;
  overflow: hidden;
}

.mm-timeline-axis {
  height: 40px;
  border-bottom: 1px solid var(--dark-border);
  position: relative;
  background: var(--dark-bg-secondary);
}

.mm-timeline-tick {
  position: absolute;
  top: 0;
  height: 100%;
  display: flex;
  align-items: center;
  font-size: 11px;
  color: var(--text-secondary);
  padding: 0 8px;
  border-left: 1px solid var(--dark-border);
  transform: translateX(-50%);
}

.mm-timeline-tick:first-child {
  transform: translateX(0);
}

.mm-timeline-tick:last-child {
  transform: translateX(-100%);
}

.mm-timeline-lanes {
  height: calc(100% - 40px);
  overflow-y: auto;
}

.mm-timeline-lane {
  height: 60px;
  position: relative;
  border-bottom: 1px solid var(--dark-border);
  padding: 8px 0;
}

.mm-timeline-event {
  position: absolute;
  height: 44px;
  min-width: 120px;
  border-radius: 4px;
  cursor: pointer;
  transition: all 0.2s ease;
  display: flex;
  align-items: center;
  padding: 0 8px;
  top: 8px;
}

.mm-timeline-event:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(0,0,0,0.3);
  z-index: 10;
}

.mm-timeline-event-content {
  width: 100%;
}

.mm-timeline-event-title {
  font-weight: 600;
  font-size: 12px;
  color: white;
  margin-bottom: 2px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.mm-timeline-event-date {
  font-size: 10px;
  color: rgba(255,255,255,0.8);
}

.mm-timeline-zoom-controls {
  position: absolute;
  top: 10px;
  right: 10px;
  display: flex;
  gap: 4px;
}

.mm-timeline-zoom-controls button {
  background: rgba(0,0,0,0.7);
  border: none;
  color: white;
  padding: 4px 8px;
  border-radius: 4px;
  cursor: pointer;
  font-size: 11px;
  transition: background 0.2s ease;
}

.mm-timeline-zoom-controls button:hover {
  background: rgba(0,0,0,0.9);
}

/* Chart Export Options */
.mm-chart-export {
  position: absolute;
  bottom: 10px;
  right: 10px;
}

.mm-chart-export select {
  background: rgba(0,0,0,0.7);
  border: 1px solid var(--dark-border);
  color: white;
  padding: 4px 8px;
  border-radius: 4px;
  font-size: 11px;
}

/* Drill-down Chart Styles */
.mm-chart-breadcrumb {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 12px;
  font-size: 12px;
}

.mm-chart-breadcrumb-item {
  color: var(--text-secondary);
  cursor: pointer;
  transition: color 0.2s ease;
}

.mm-chart-breadcrumb-item:hover {
  color: var(--accent-color);
}

.mm-chart-breadcrumb-separator {
  color: var(--text-secondary);
}

.mm-chart-breadcrumb-item.active {
  color: var(--text-primary);
  cursor: default;
}

/* Interactive Chart States */
.mm-chart-loading {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  color: var(--text-secondary);
  font-size: 14px;
}

.mm-chart-loading::before {
  content: '';
  width: 20px;
  height: 20px;
  border: 2px solid var(--dark-border);
  border-top: 2px solid var(--accent-color);
  border-radius: 50%;
  margin-right: 8px;
  animation: spin 1s linear infinite;
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

.mm-chart-error {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  color: var(--text-danger);
  font-size: 14px;
}

/* Responsive chart design */
@media (max-width: 768px) {
  .mm-timeline-event {
    min-width: 80px;
    padding: 0 4px;
  }
  
  .mm-timeline-event-title {
    font-size: 10px;
  }
  
  .mm-timeline-event-date {
    font-size: 9px;
  }
  
  .mm-heatmap-cell {
    width: 15px !important;
    height: 15px !important;
  }
  
  .mm-chart-controls,
  .mm-timeline-zoom-controls {
    flex-direction: column;
    top: 5px;
    right: 5px;
  }
}

/* Advanced Report Generation */
.mm-report-templates {
  display: flex;
  flex-direction: column;
  gap: 12px;
  max-height: 400px;
  overflow-y: auto;
}

.mm-template-card {
  background: var(--dark-bg-primary);
  border: 1px solid var(--dark-border);
  border-radius: 6px;
  padding: 16px;
  cursor: pointer;
  transition: all 0.2s ease;
}

.mm-template-card:hover {
  border-color: var(--accent-color);
  background: var(--dark-bg-secondary);
}

.mm-template-card.selected {
  border-color: var(--accent-color);
  background: rgba(212, 175, 55, 0.1);
}

.mm-template-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin-bottom: 8px;
}

.mm-template-header h4 {
  margin: 0;
  color: var(--text-primary);
  font-size: 14px;
  font-weight: 600;
}

.mm-template-badge {
  background: var(--accent-color);
  color: white;
  padding: 2px 6px;
  border-radius: 3px;
  font-size: 10px;
  font-weight: 500;
  text-transform: uppercase;
}

.mm-template-badge.popular {
  background: #28a745;
}

.mm-template-badge.comprehensive {
  background: #17a2b8;
}

.mm-template-badge.analytics {
  background: #6f42c1;
}

.mm-template-description {
  color: var(--text-secondary);
  font-size: 12px;
  margin: 0 0 12px 0;
  line-height: 1.4;
}

.mm-template-features {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.mm-template-features span {
  color: var(--text-secondary);
  font-size: 11px;
}

/* Report Content Styles */
.mm-report-content {
  background: var(--dark-bg-primary);
  border: 1px solid var(--dark-border);
  border-radius: 6px;
  padding: 20px;
  max-height: 600px;
  overflow-y: auto;
}

.mm-report-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin-bottom: 12px;
}

.mm-report-header h2 {
  margin: 0;
}

.mm-report-summary {
  margin-bottom: 24px;
}

.mm-summary-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
  margin: 16px 0;
}

.mm-summary-item {
  text-align: center;
  padding: 16px;
  background: var(--dark-bg-secondary);
  border: 1px solid var(--dark-border);
  border-radius: 6px;
}

.mm-summary-value {
  font-size: 24px;
  font-weight: 700;
  color: var(--accent-color);
  margin-bottom: 4px;
}

.mm-summary-label {
  font-size: 12px;
  color: var(--text-secondary);
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.mm-summary-text {
  color: var(--text-primary);
  line-height: 1.6;
}

.mm-summary-text p {
  margin: 0 0 12px 0;
}

.mm-report-table {
  margin: 16px 0;
}

.mm-report-table .mm-table {
  font-size: 13px;
}

.mm-report-table .mm-table th {
  background: var(--dark-bg-secondary);
  color: var(--accent-color);
  font-weight: 600;
  padding: 12px 8px;
}

.mm-report-table .mm-table td {
  padding: 8px;
  border-bottom: 1px solid var(--dark-border);
}

/* Report Generation Progress */
.mm-report-progress {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 16px;
  background: var(--dark-bg-primary);
  border: 1px solid var(--dark-border);
  border-radius: 6px;
  margin: 12px 0;
}

.mm-report-progress-spinner {
  width: 20px;
  height: 20px;
  border: 2px solid var(--dark-border);
  border-top: 2px solid var(--accent-color);
  border-radius: 50%;
  animation: spin 1s linear infinite;
}

.mm-report-progress-text {
  color: var(--text-primary);
  font-size: 14px;
}

/* Report Export Options */
.mm-report-export {
  background: var(--dark-bg-secondary);
  border: 1px solid var(--dark-border);
  border-radius: 6px;
  padding: 12px;
  margin-top: 16px;
}

.mm-report-export h4 {
  margin: 0 0 8px 0;
  color: var(--text-primary);
  font-size: 14px;
}

.mm-export-options {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.mm-export-option {
  padding: 6px 12px;
  background: var(--dark-bg-primary);
  border: 1px solid var(--dark-border);
  border-radius: 4px;
  color: var(--text-primary);
  text-decoration: none;
  font-size: 12px;
  transition: all 0.2s ease;
}

.mm-export-option:hover {
  border-color: var(--accent-color);
  background: rgba(212, 175, 55, 0.1);
}

/* Report Status Indicators */
.mm-report-status {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 8px;
  border-radius: 3px;
  font-size: 11px;
  font-weight: 500;
  text-transform: uppercase;
}

.mm-report-status.generating {
  background: rgba(255, 193, 7, 0.2);
  color: #ffc107;
}

.mm-report-status.complete {
  background: rgba(40, 167, 69, 0.2);
  color: #28a745;
}

.mm-report-status.error {
  background: rgba(220, 53, 69, 0.2);
  color: #dc3545;
}

/* Responsive report design */
@media (max-width: 768px) {
  .mm-summary-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 12px;
  }
  
  .mm-template-card {
    padding: 12px;
  }
  
  .mm-report-content {
    padding: 16px;
    max-height: 400px;
  }
  
  .mm-report-templates {
    max-height: 250px;
  }
  
  .mm-export-options {
    flex-direction: column;
  }
}

/* Performance Optimization Styling */
.mm-lazy-loading {
  background: linear-gradient(90deg, #f0f0f0 25%, transparent 50%, #f0f0f0 75%);
  background-size: 200% 100%;
  animation: mm-loading-skeleton 1.5s infinite;
  min-height: 40px;
  border-radius: 4px;
}

.mm-loading {
  position: relative;
  overflow: hidden;
}

.mm-loading::after {
  content: '';
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,0.3), transparent);
  animation: mm-loading-shimmer 1.5s infinite;
}

.mm-loaded {
  animation: mm-fade-in 0.3s ease-in-out;
}

.mm-error {
  background-color: #fee;
  border: 1px solid #fcc;
  color: #c33;
}

.mm-virtual-scroll {
  position: relative;
  overflow-y: auto;
  height: 400px;
}

.mm-virtual-item {
  position: absolute;
  width: 100%;
  box-sizing: border-box;
}

.mm-performance-monitor {
  position: fixed;
  top: 10px;
  right: 10px;
  background: rgba(0,0,0,0.8);
  color: white;
  padding: 8px 12px;
  border-radius: 4px;
  font-size: 12px;
  z-index: 10000;
  display: none;
}

.mm-performance-monitor.active {
  display: block;
}

.mm-optimistic-update {
  opacity: 0.7;
  position: relative;
}

.mm-optimistic-update::after {
  content: '⟳';
  position: absolute;
  top: 50%;
  right: 8px;
  transform: translateY(-50%);
  animation: mm-spin 1s linear infinite;
  color: #0066cc;
}

.mm-batch-operation {
  background: linear-gradient(45deg, #f0f8ff, #e6f3ff);
  border-left: 4px solid #0066cc;
  padding: 12px;
  margin: 8px 0;
  border-radius: 4px;
}

.mm-batch-progress {
  width: 100%;
  height: 4px;
  background: #e0e0e0;
  border-radius: 2px;
  overflow: hidden;
  margin-top: 8px;
}

.mm-batch-progress-bar {
  height: 100%;
  background: linear-gradient(90deg, #0066cc, #0088ff);
  width: 0%;
  transition: width 0.3s ease;
  animation: mm-progress-pulse 2s ease-in-out infinite;
}

@keyframes mm-loading-skeleton {
  0% { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}

@keyframes mm-loading-shimmer {
  0% { left: -100%; }
  100% { left: 100%; }
}

@keyframes mm-fade-in {
  from { opacity: 0; transform: translateY(10px); }
  to { opacity: 1; transform: translateY(0); }
}

@keyframes mm-spin {
  from { transform: translateY(-50%) rotate(0deg); }
  to { transform: translateY(-50%) rotate(360deg); }
}

@keyframes mm-progress-pulse {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.7; }
}

/* Cache indicator */
.mm-cached {
  position: relative;
}

.mm-cached::before {
  content: '⚡';
  position: absolute;
  top: -2px;
  right: -2px;
  font-size: 10px;
  color: #00cc66;
  z-index: 1;
}

/* Virtual scroll enhancements */
.mm-table.mm-virtual {
  position: relative;
  overflow: visible;
}

.mm-table.mm-virtual tbody {
  position: relative;
  overflow: visible;
}

/* Enhanced Tooltip System */
.mm-tooltip {
  position: relative;
}

.mm-info {
  display: inline-block;
  width: 14px;
  height: 14px;
  background: var(--mm-gold);
  color: var(--mm-bg);
  border-radius: 50%;
  font-size: 10px;
  font-weight: bold;
  text-align: center;
  line-height: 14px;
  margin-left: 4px;
  cursor: help;
  opacity: 0.8;
  transition: opacity 0.2s;
}

.mm-info:hover {
  opacity: 1;
}

/* Enhanced tooltips for form fields */
.mm-field[title]:hover::after {
  content: attr(title);
  position: absolute;
  bottom: 100%;
  left: 50%;
  transform: translateX(-50%);
  background: rgba(0, 0, 0, 0.95);
  color: white;
  padding: 8px 12px;
  border-radius: 6px;
  font-size: 12px;
  white-space: pre-wrap;
  max-width: 300px;
  z-index: 1000;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
  border: 1px solid var(--mm-gold);
  animation: mm-tooltip-in 0.2s ease-out;
}

.mm-field[title]:hover::before {
  content: '';
  position: absolute;
  bottom: 95%;
  left: 50%;
  transform: translateX(-50%);
  width: 0;
  height: 0;
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
  border-top: 6px solid rgba(0, 0, 0, 0.95);
  z-index: 1001;
}

@keyframes mm-tooltip-in {
  from {
    opacity: 0;
    transform: translateX(-50%) translateY(5px);
  }
  to {
    opacity: 1;
    transform: translateX(-50%) translateY(0);
  }
}

/* Commission Module Enhancements */
.mm-info-panel {
  background: rgba(212, 175, 55, 0.1);
  border: 1px solid rgba(212, 175, 55, 0.3);
  border-radius: 8px;
  padding: 12px;
  margin: 12px 0;
}

.mm-info-panel h4 {
  margin: 0 0 8px;
  color: var(--mm-gold);
  font-size: 14px;
}

.mm-info-panel ul {
  margin: 0;
  padding-left: 16px;
  color: var(--mm-muted);
  font-size: 13px;
}

.mm-info-panel li {
  margin-bottom: 4px;
}

.mm-payment-guide {
  font-size: 13px;
  color: var(--mm-muted);
}

.mm-rate-example {
  padding: 6px 0;
  transition: opacity 0.3s ease;
}

.mm-rate-example strong {
  color: var(--mm-text);
}

.mm-help-text {
  font-size: 13px;
  line-height: 1.4;
  padding: 8px 12px;
  background: rgba(66, 165, 245, 0.1);
  border-left: 4px solid #42a5f5;
  border-radius: 4px;
  color: var(--mm-muted);
}

.mm-help-text strong {
  color: var(--mm-text);
}

/* Toast message type styling */
.mm-toast-success {
  background: var(--mm-ok);
  border-left: 4px solid #22c55e;
}

.mm-toast-error {
  background: var(--mm-danger);
  border-left: 4px solid #ef4444;
}

.mm-toast-warning {
  background: var(--mm-warn);
  border-left: 4px solid #f59e0b;
  color: #1a1a1a;
}

.mm-toast-info {
  background: var(--mm-blue);
  border-left: 4px solid #3b82f6;
}

/* Enhanced status dropdown styling */
select#c_status {
  font-weight: 500;
}

select#c_status option[value="open"] {
  color: var(--mm-ok);
}

select#c_status option[value="running"] {
  color: var(--mm-blue);
}

select#c_status option[value="stopped"] {
  color: var(--mm-warn);
}

select#c_status option[value="finalized"] {
  color: var(--mm-danger);
}

/* Modern animations and effects */
@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes pulse {
  0%, 100% {
    opacity: 1;
  }
  50% {
    opacity: 0.7;
  }
}

@keyframes shimmer {
  0% {
    background-position: -200% 0;
  }
  100% {
    background-position: 200% 0;
  }
}

@keyframes slideInRight {
  from {
    opacity: 0;
    transform: translateX(30px);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}

@keyframes glow {
  0%, 100% {
    box-shadow: var(--mm-shadow-md);
  }
  50% {
    box-shadow: var(--mm-shadow-glow);
  }
}

/* Enhanced grid system */
.mm-grid {
  animation: fadeInUp 0.6s ease-out;
}

/* Loading states */
.mm-loading {
  background: linear-gradient(90deg, var(--mm-card) 25%, rgba(255,255,255,0.1) 50%, var(--mm-card) 75%);
  background-size: 200% 100%;
  animation: shimmer 2s infinite;
}

.mm-skeleton {
  background: linear-gradient(90deg, rgba(255,255,255,0.05) 25%, rgba(255,255,255,0.15) 50%, rgba(255,255,255,0.05) 75%);
  background-size: 200% 100%;
  animation: shimmer 1.5s infinite;
  border-radius: var(--mm-radius);
}

/* Utility classes */
.mm-fade-in {
  animation: fadeInUp 0.5s ease-out;
}

.mm-slide-in {
  animation: slideInRight 0.4s ease-out;
}

.mm-glass {
  background: rgba(255, 255, 255, 0.05);
  backdrop-filter: blur(10px);
  border: 1px solid rgba(255, 255, 255, 0.1);
}

.mm-glow {
  box-shadow: var(--mm-shadow-glow);
}

.mm-text-glow {
  text-shadow: 0 0 10px rgba(212, 175, 55, 0.3);
}

.mm-hover-lift {
  transition: transform var(--mm-transition);
}

.mm-hover-lift:hover {
  transform: translateY(-2px);
}

.mm-rotate {
  animation: spin 2s linear infinite;
}

@keyframes spin {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}

/* Enhanced scrollbar */
.mm-scrollbar::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}

.mm-scrollbar::-webkit-scrollbar-track {
  background: var(--mm-secondary);
  border-radius: 4px;
}

.mm-scrollbar::-webkit-scrollbar-thumb {
  background: var(--mm-gradient-gold);
  border-radius: 4px;
}

.mm-scrollbar::-webkit-scrollbar-thumb:hover {
  background: var(--mm-gold);
}

/* Enhanced notification/alert styles */
.mm-alert {
  padding: 16px 20px;
  border-radius: var(--mm-radius);
  border-left: 4px solid;
  margin: 16px 0;
  animation: slideInRight 0.4s ease-out;
}

.mm-alert-success {
  background: rgba(22, 163, 74, 0.1);
  border-color: var(--mm-ok);
  color: var(--mm-ok);
}

.mm-alert-warning {
  background: rgba(245, 158, 11, 0.1);
  border-color: var(--mm-warn);
  color: var(--mm-warn);
}

.mm-alert-error {
  background: rgba(220, 38, 38, 0.1);
  border-color: var(--mm-danger);
  color: var(--mm-danger);
}

.mm-alert-info {
  background: rgba(37, 99, 235, 0.1);
  border-color: var(--mm-blue);
  color: var(--mm-blue);
}

/* Progress indicators */
.mm-progress {
  width: 100%;
  height: 8px;
  background: var(--mm-secondary);
  border-radius: 4px;
  overflow: hidden;
  position: relative;
}

.mm-progress-bar {
  height: 100%;
  background: var(--mm-gradient-gold);
  border-radius: 4px;
  transition: width 0.3s ease;
  position: relative;
}

.mm-progress-bar::after {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0; bottom: 0;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,0.3), transparent);
  animation: shimmer 2s infinite;
}

/* Enhanced loading and error states */
.mm-spinner {
  display: inline-block;
  width: 14px;
  height: 14px;
  border: 2px solid rgba(255,255,255,0.3);
  border-top: 2px solid white;
  border-radius: 50%;
  animation: spin 1s linear infinite;
  margin-right: 6px;
}

.mm-btn.mm-loading {
  pointer-events: none;
  opacity: 0.7;
}

.mm-error {
  border-color: var(--mm-danger) !important;
  background: rgba(220, 38, 38, 0.05) !important;
  box-shadow: 0 0 0 1px rgba(220, 38, 38, 0.2) !important;
}

.mm-success {
  border-color: var(--mm-ok) !important;
  background: rgba(22, 163, 74, 0.05) !important;
  box-shadow: 0 0 0 1px rgba(22, 163, 74, 0.2) !important;
}

.mm-network-offline {
  opacity: 0.6;
  pointer-events: none;
}

.mm-network-offline::after {
  content: "Offline";
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background: var(--mm-danger);
  color: white;
  padding: 4px 8px;
  border-radius: 4px;
  font-size: 12px;
  z-index: 1000;
}

/* Dashboard Widget System Styles */
.mm-dashboard-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  grid-auto-rows: 200px;
  gap: 16px;
  margin: 20px 0;
}

.mm-widget {
  background: var(--mm-card);
  border: 1px solid rgba(212,175,55,.25);
  border-radius: var(--mm-radius);
  padding: 16px;
  position: relative;
  transition: all var(--mm-transition);
  overflow: hidden;
}

.mm-widget:hover {
  border-color: rgba(212,175,55,.4);
  box-shadow: var(--mm-shadow-md);
  transform: translateY(-1px);
}

.mm-widget-small { grid-column: span 1; grid-row: span 1; }
.mm-widget-medium { grid-column: span 2; grid-row: span 1; }
.mm-widget-large { grid-column: span 2; grid-row: span 2; }
.mm-widget-wide { grid-column: span 4; grid-row: span 1; }

.mm-widget-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 12px;
  padding-bottom: 8px;
  border-bottom: 1px solid rgba(212,175,55,.15);
}

.mm-widget-title {
  font-size: 0.9rem;
  font-weight: 700;
  color: var(--mm-gold);
  margin: 0;
}

.mm-widget-controls {
  display: flex;
  gap: 4px;
  opacity: 0.6;
  transition: opacity var(--mm-transition);
}

.mm-widget:hover .mm-widget-controls {
  opacity: 1;
}

.mm-widget-btn {
  background: none;
  border: none;
  color: var(--mm-muted);
  cursor: pointer;
  padding: 4px 6px;
  border-radius: 4px;
  transition: all var(--mm-transition);
  font-size: 12px;
}

.mm-widget-btn:hover {
  background: rgba(212,175,55,.1);
  color: var(--mm-gold);
}

.mm-widget-content {
  height: calc(100% - 40px);
  overflow: auto;
}

.mm-drag-handle {
  cursor: move;
  user-select: none;
}

.mm-widget.mm-dragging {
  opacity: 0.8;
  transform: rotate(2deg);
  z-index: 1000;
  box-shadow: var(--mm-shadow-xl);
}

.mm-stats-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 12px;
  height: 100%;
}

.mm-stat-item {
  text-align: center;
  padding: 8px;
}

.mm-stat-value {
  font-size: 1.4rem;
  font-weight: 800;
  color: var(--mm-gold);
  margin-bottom: 4px;
}

.mm-stat-label {
  font-size: 0.75rem;
  color: var(--mm-muted);
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.mm-chart-container {
  position: relative;
  height: calc(100% - 30px);
  margin-bottom: 8px;
}

.mm-chart-legend {
  display: flex;
  justify-content: center;
  gap: 16px;
  font-size: 0.75rem;
}

.mm-legend-item {
  display: flex;
  align-items: center;
  gap: 4px;
}

.mm-legend-color {
  width: 12px;
  height: 12px;
  border-radius: 2px;
}

.mm-activity-heatmap {
  height: calc(100% - 30px);
}

.mm-heatmap-days {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 2px;
  margin-bottom: 8px;
}

.mm-day-label {
  text-align: center;
  font-size: 0.7rem;
  color: var(--mm-muted);
  font-weight: 600;
}

.mm-heatmap-grid {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 1px;
  height: calc(100% - 40px);
}

.mm-metrics-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 8px;
  height: 100%;
}

.mm-metric {
  text-align: center;
  padding: 8px;
  background: rgba(212,175,55,.05);
  border-radius: 6px;
}

.mm-metric-value {
  font-size: 1.2rem;
  font-weight: 700;
  color: var(--mm-text);
  margin-bottom: 2px;
}

.mm-metric-label {
  font-size: 0.7rem;
  color: var(--mm-muted);
}

.mm-progress-bars {
  margin-top: 12px;
}

.mm-progress-item {
  margin-bottom: 8px;
}

.mm-progress-item label {
  font-size: 0.7rem;
  color: var(--mm-muted);
  margin-bottom: 4px;
  display: block;
}

.mm-activity-stats {
  margin-top: 8px;
  font-size: 0.75rem;
  display: flex;
  justify-content: space-between;
}

@media (max-width: 1200px) {
  .mm-dashboard-grid {
    grid-template-columns: repeat(3, 1fr);
  }
  .mm-widget-wide { grid-column: span 3; }
}

@media (max-width: 768px) {
  .mm-dashboard-grid {
    grid-template-columns: repeat(2, 1fr);
    grid-auto-rows: 180px;
  }
  .mm-widget-wide,
  .mm-widget-large { grid-column: span 2; }
  .mm-stats-grid { grid-template-columns: repeat(2, 1fr); }
}