/*
 * MHSM ADMIN PANEL — NAVY / ELECTRIC BLUE REDESIGN
 * -------------------------------------------------
 * This file intentionally sits after admin.css.
 * Edit the design tokens below to change the full interface quickly.
 * All custom classes remain prefixed with mhsmadm- to prevent conflicts.
 */

:root {
  --mhsmadm-v2-navy-950: #061226;
  --mhsmadm-v2-navy-900: #0a1931;
  --mhsmadm-v2-navy-850: #0d2142;
  --mhsmadm-v2-navy-800: #102a50;
  --mhsmadm-v2-blue-700: #1d4ed8;
  --mhsmadm-v2-blue-600: #2563eb;
  --mhsmadm-v2-blue-500: #3b82f6;
  --mhsmadm-v2-sky-500: #0ea5e9;
  --mhsmadm-v2-sky-400: #38bdf8;
  --mhsmadm-v2-cyan-300: #67e8f9;
  --mhsmadm-v2-page: #f4f7fc;
  --mhsmadm-v2-surface: #ffffff;
  --mhsmadm-v2-text: #14213d;
  --mhsmadm-v2-muted: #6b7b95;
  --mhsmadm-v2-border: #e4eaf3;
  --mhsmadm-v2-success: #0f9f6e;
  --mhsmadm-v2-warning: #d97706;
  --mhsmadm-v2-danger: #dc3545;
  --mhsmadm-v2-purple: #7c3aed;
  --mhsmadm-v2-radius-xl: 22px;
  --mhsmadm-v2-radius-lg: 16px;
  --mhsmadm-v2-radius-md: 12px;
  --mhsmadm-v2-shadow: 0 14px 40px rgba(13, 33, 66, 0.08);
  --mhsmadm-v2-shadow-hover: 0 20px 55px rgba(29, 78, 216, 0.13);
  --mhsmadm-v2-gradient: linear-gradient(135deg, #1d4ed8 0%, #2563eb 48%, #0ea5e9 100%);
}

html { scroll-behavior: smooth; }

body.mhsmadm-app {
  background:
    radial-gradient(circle at 82% -10%, rgba(56, 189, 248, 0.11), transparent 30rem),
    linear-gradient(180deg, #f7f9fd 0%, var(--mhsmadm-v2-page) 100%);
  color: var(--mhsmadm-v2-text);
  font-family: Inter, "Segoe UI", Arial, sans-serif;
}

body.mhsmadm-app::before {
  position: fixed;
  inset: 0;
  z-index: -1;
  background-image: radial-gradient(rgba(37, 99, 235, 0.1) 0.7px, transparent 0.7px);
  background-size: 28px 28px;
  content: "";
  mask-image: linear-gradient(to bottom, #000, transparent 48%);
  pointer-events: none;
}

.mhsmadm-layout { min-height: 100vh; }

.mhsmadm-sidebar {
  width: 268px;
  padding: 25px 18px 18px;
  overflow: hidden;
  background:
    radial-gradient(circle at 12% 4%, rgba(56, 189, 248, 0.2), transparent 15rem),
    linear-gradient(170deg, var(--mhsmadm-v2-navy-800), var(--mhsmadm-v2-navy-950) 68%);
  border-right: 1px solid rgba(255, 255, 255, 0.08);
  box-shadow: 20px 0 50px rgba(6, 18, 38, 0.12);
}

.mhsmadm-sidebar::before,
.mhsmadm-login-brand::before {
  position: absolute;
  width: 280px;
  height: 280px;
  border: 1px solid rgba(103, 232, 249, 0.12);
  border-radius: 50%;
  content: "";
  animation: mhsmadm-v2-float 8s ease-in-out infinite;
}

.mhsmadm-sidebar::before { right: -190px; bottom: 90px; }

.mhsmadm-sidebar .mhsmadm-brand-lockup {
  position: relative;
  z-index: 1;
  margin: 0 3px 18px;
  padding-bottom: 18px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.mhsmadm-brand-mark {
  display: grid;
  width: 45px;
  height: 45px;
  place-items: center;
  background: var(--mhsmadm-v2-gradient);
  border: 1px solid rgba(255, 255, 255, 0.28);
  border-radius: 14px;
  color: white;
  box-shadow: 0 10px 24px rgba(14, 165, 233, 0.28);
  font-size: 15px;
  font-weight: 700;
  letter-spacing: 0.04em;
}

.mhsmadm-brand-lockup strong { color: #fff; font-size: 16px; letter-spacing: -0.01em; }
.mhsmadm-brand-lockup span:not(.mhsmadm-brand-mark) { color: #8fa8cb; font-size: 11px; letter-spacing: 0.14em; text-transform: uppercase; }

.mhsmadm-sidebar-status {
  display: flex;
  align-items: center;
  gap: 9px;
  margin: 0 3px 25px;
  padding: 9px 11px;
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 10px;
  color: #a9bfdb;
  font-size: 12px;
}

.mhsmadm-sidebar-status i,
.mhsmadm-live-pill i {
  width: 7px;
  height: 7px;
  background: #38e3a2;
  border-radius: 50%;
  box-shadow: 0 0 0 5px rgba(56, 227, 162, 0.12);
  animation: mhsmadm-v2-pulse 2s infinite;
}

.mhsmadm-sidebar-label {
  margin: 0 11px 10px;
  color: #627da5;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.mhsmadm-nav { gap: 5px; }

.mhsmadm-nav-link {
  position: relative;
  min-height: 47px;
  padding: 0 13px;
  overflow: hidden;
  border: 1px solid transparent;
  border-radius: 11px;
  color: #99afd0;
  font-size: 14px;
  font-weight: 500;
  transition: color 180ms ease, background 180ms ease, border-color 180ms ease, transform 180ms ease;
}

.mhsmadm-nav-link svg { width: 19px; height: 19px; transition: transform 180ms ease; }
.mhsmadm-nav-link:hover { background: rgba(255, 255, 255, 0.065); border-color: rgba(255, 255, 255, 0.07); color: white; transform: translateX(3px); }
.mhsmadm-nav-link:hover svg { transform: scale(1.08); }
.mhsmadm-nav-link.is-active {
  background: linear-gradient(100deg, rgba(37, 99, 235, 0.9), rgba(14, 165, 233, 0.68));
  border-color: rgba(103, 232, 249, 0.24);
  color: white;
  box-shadow: 0 12px 25px rgba(0, 93, 255, 0.22);
}
.mhsmadm-nav-link.is-active::after { position: absolute; top: 11px; right: 9px; width: 4px; height: 24px; background: rgba(255,255,255,.75); border-radius: 9px; content: ""; }

.mhsmadm-sidebar-insight {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-top: auto;
  margin-bottom: 10px;
  padding: 13px;
  background: linear-gradient(135deg, rgba(37, 99, 235, .16), rgba(56, 189, 248, .08));
  border: 1px solid rgba(83, 156, 255, .18);
  border-radius: 14px;
  color: white;
}
.mhsmadm-sidebar-insight > span { display: grid; width: 34px; height: 34px; flex: 0 0 34px; place-items: center; background: rgba(56,189,248,.13); border-radius: 10px; color: var(--mhsmadm-v2-sky-400); }
.mhsmadm-sidebar-insight svg { width: 17px; }
.mhsmadm-sidebar-insight div { display: grid; }
.mhsmadm-sidebar-insight small { color: #718eb6; font-size: 10px; text-transform: uppercase; letter-spacing: .1em; }
.mhsmadm-sidebar-insight strong { font-size: 12px; font-weight: 600; }
.mhsmadm-sidebar-footer { position: static; margin-top: 0; padding-top: 9px; border-top-color: rgba(255,255,255,.08); }

.mhsmadm-main { margin-left: 268px; min-width: 0; }

.mhsmadm-topbar {
  height: 82px;
  padding: 0 31px;
  background: rgba(255, 255, 255, 0.86);
  border-bottom: 1px solid rgba(218, 227, 241, 0.9);
  box-shadow: 0 4px 25px rgba(13, 33, 66, 0.035);
  backdrop-filter: blur(18px);
}

.mhsmadm-topbar-left { align-items: center; }
.mhsmadm-topbar-left h1 { margin: 1px 0 0; color: var(--mhsmadm-v2-navy-900); font-size: 20px; font-weight: 650; letter-spacing: -0.02em; }
.mhsmadm-breadcrumb { margin: 0; color: #94a3b8; font-size: 11px; font-weight: 600; letter-spacing: .04em; text-transform: uppercase; }
.mhsmadm-breadcrumb span { color: var(--mhsmadm-v2-blue-600); }
.mhsmadm-topbar-actions { gap: 10px; }

.mhsmadm-global-search {
  display: flex;
  min-width: 225px;
  height: 41px;
  align-items: center;
  gap: 9px;
  padding: 0 8px 0 12px;
  background: #f8fafc;
  border: 1px solid var(--mhsmadm-v2-border);
  border-radius: 11px;
  color: #71809a;
  font-size: 13px;
  transition: border-color 180ms ease, box-shadow 180ms ease, background 180ms ease;
}
.mhsmadm-global-search:hover { background: white; border-color: #a8c6f8; box-shadow: 0 7px 20px rgba(37,99,235,.08); }
.mhsmadm-global-search svg { width: 17px; }
.mhsmadm-global-search span { margin-right: auto; }
.mhsmadm-global-search kbd,
.mhsmadm-command-search kbd { padding: 3px 6px; background: white; border: 1px solid #dae2ef; border-radius: 6px; color: #7a889e; box-shadow: 0 1px 1px rgba(0,0,0,.04); font-family: inherit; font-size: 10px; }

.mhsmadm-icon-button { position: relative; width: 41px; height: 41px; background: white; border-color: var(--mhsmadm-v2-border); color: #5d6d86; }
.mhsmadm-icon-button i { position: absolute; top: 7px; right: 7px; width: 7px; height: 7px; background: #3b82f6; border: 2px solid white; border-radius: 50%; }
.mhsmadm-user-chip { gap: 10px; padding: 4px 8px 4px 5px; background: white; border: 1px solid var(--mhsmadm-v2-border); border-radius: 12px; box-shadow: 0 5px 15px rgba(15,35,70,.04); }
.mhsmadm-user-chip > span:last-child { display: grid; color: var(--mhsmadm-v2-text); line-height: 1.25; }
.mhsmadm-user-chip strong { font-size: 12px; font-weight: 600; }
.mhsmadm-user-chip small { color: #8996aa; font-size: 10px; }
.mhsmadm-user-avatar { background: var(--mhsmadm-v2-gradient); color: white; }

.mhsmadm-content { max-width: 1680px; padding: 29px 31px 50px; }
.mhsmadm-page-intro { margin-bottom: 23px; padding: 0 2px; }
.mhsmadm-page-intro h2 { margin-bottom: 6px; color: var(--mhsmadm-v2-navy-900); font-size: 25px; font-weight: 650; letter-spacing: -0.035em; }
.mhsmadm-page-intro p { color: var(--mhsmadm-v2-muted); font-size: 14px; }

.mhsmadm-btn { min-height: 40px; padding: 0 15px; border-radius: 10px; font-size: 13px; font-weight: 600; letter-spacing: 0; transition: transform 160ms ease, box-shadow 160ms ease, background 160ms ease, border-color 160ms ease; }
.mhsmadm-btn:hover { transform: translateY(-1px); }
.mhsmadm-btn-primary { background: var(--mhsmadm-v2-gradient); border: 0; color: #fff; box-shadow: 0 9px 22px rgba(37,99,235,.2); }
.mhsmadm-btn-primary:hover { color: #fff; box-shadow: 0 13px 27px rgba(37,99,235,.27); }
.mhsmadm-btn-outline { background: white; border: 1px solid #d9e3f0; color: #315079; }
.mhsmadm-btn-outline:hover { background: #f4f8ff; border-color: #8db6f8; color: var(--mhsmadm-v2-blue-700); }
.mhsmadm-btn-danger { background: #fff; border-color: #f3c6cb; color: #c93445; }
.mhsmadm-btn-sm { min-height: 33px; padding: 0 11px; border-radius: 8px; font-size: 12px; }

.mhsmadm-metrics { grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 15px; margin-bottom: 18px; }
.mhsmadm-metric {
  position: relative;
  min-height: 148px;
  padding: 20px;
  overflow: hidden;
  background: linear-gradient(145deg, #fff 0%, #fbfdff 100%);
  border: 1px solid var(--mhsmadm-v2-border);
  border-radius: var(--mhsmadm-v2-radius-lg);
  box-shadow: 0 8px 28px rgba(20, 48, 89, 0.055);
  transition: transform 220ms ease, box-shadow 220ms ease, border-color 220ms ease;
}
.mhsmadm-metric::before { position: absolute; top: 0; right: 0; width: 80px; height: 80px; background: radial-gradient(circle at 100% 0, rgba(56,189,248,.13), transparent 70%); content: ""; }
.mhsmadm-metric:hover { border-color: #c0d7fa; box-shadow: var(--mhsmadm-v2-shadow-hover); transform: translateY(-3px); }
.mhsmadm-metric-icon { top: 18px; right: 18px; width: 39px; height: 39px; background: linear-gradient(135deg, #eff6ff, #e0f2fe); color: var(--mhsmadm-v2-blue-600); border: 1px solid #d8eafe; border-radius: 11px; }
.mhsmadm-metric-icon svg { width: 19px; }
.mhsmadm-metric-value { margin-top: 27px; color: var(--mhsmadm-v2-navy-900); font-size: 31px; font-weight: 680; letter-spacing: -0.05em; }
.mhsmadm-metric-label { margin-top: 1px; color: #3f506b; font-size: 12px; font-weight: 650; letter-spacing: .035em; text-transform: uppercase; }
.mhsmadm-metric-trend { margin-top: 12px; color: #8b99ad; font-size: 11px; }

.mhsmadm-grid-2 { gap: 18px; margin-bottom: 18px; }
.mhsmadm-panel,
.mhsmadm-form-card {
  overflow: hidden;
  background: rgba(255,255,255,.97);
  border: 1px solid var(--mhsmadm-v2-border);
  border-radius: var(--mhsmadm-v2-radius-lg);
  box-shadow: var(--mhsmadm-v2-shadow);
}
.mhsmadm-panel { margin-bottom: 18px; }
.mhsmadm-panel-head { min-height: 67px; padding: 14px 18px; background: linear-gradient(180deg, #fff, #fcfdff); border-bottom: 1px solid #e9eef6; }
.mhsmadm-panel-head h3 { color: var(--mhsmadm-v2-navy-900); font-size: 15px; font-weight: 650; }
.mhsmadm-panel-body { padding: 18px; }
.mhsmadm-eyebrow { display: block; margin-bottom: 3px; color: var(--mhsmadm-v2-blue-600); font-size: 9px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; }
.mhsmadm-live-pill { display: inline-flex; align-items: center; gap: 7px; padding: 6px 9px; background: #ecfdf5; border: 1px solid #c8f3df; border-radius: 99px; color: #087a56; font-size: 10px; font-weight: 650; }

.mhsmadm-chart { height: 285px; }
.mhsmadm-chart-grid { background-image: linear-gradient(to top, #e9eef6 1px, transparent 1px); opacity: .8; }
.mhsmadm-bar-group { gap: 5px; }
.mhsmadm-bar { width: 17px; background: linear-gradient(to top, #1d4ed8, #3b82f6); border-radius: 6px 6px 2px 2px; box-shadow: 0 8px 15px rgba(37,99,235,.18); animation: mhsmadm-v2-grow 800ms cubic-bezier(.2,.7,.2,1) both; transform-origin: bottom; }
.mhsmadm-bar.is-secondary { background: linear-gradient(to top, #0284c7, #67e8f9); }
.mhsmadm-bar-labels { color: #8794a7; font-size: 10px; }
.mhsmadm-legend { color: #61718a; font-size: 11px; }
.mhsmadm-donut { width: 174px; height: 174px; box-shadow: inset 0 0 0 1px rgba(37,99,235,.03), 0 16px 35px rgba(37,99,235,.12); transition: transform 350ms ease; }
.mhsmadm-donut:hover { transform: rotate(4deg) scale(1.02); }
.mhsmadm-donut::after { width: 118px; height: 118px; box-shadow: 0 4px 20px rgba(15,35,70,.06); }
.mhsmadm-donut strong { color: var(--mhsmadm-v2-navy-900); font-size: 26px; }

.mhsmadm-pipeline { display: grid; gap: 3px; }
.mhsmadm-pipeline-stage { display: grid; grid-template-columns: 36px minmax(0, 1fr) auto; align-items: center; gap: 11px; padding: 11px 10px; border-radius: 10px; transition: background 160ms ease, transform 160ms ease; }
.mhsmadm-pipeline-stage:hover { background: #f2f7ff; transform: translateX(3px); }
.mhsmadm-pipeline-stage > span { color: #9aabc1; font-size: 10px; font-weight: 700; }
.mhsmadm-pipeline-stage div { display: grid; }
.mhsmadm-pipeline-stage strong { color: #21324d; font-size: 12px; font-weight: 600; }
.mhsmadm-pipeline-stage small { color: #8795a9; font-size: 10px; }
.mhsmadm-pipeline-stage b { display: grid; width: 31px; height: 31px; place-items: center; background: #eef5ff; border: 1px solid #d9e8fd; border-radius: 9px; color: var(--mhsmadm-v2-blue-600); font-size: 12px; }
.mhsmadm-action-center { display: grid; gap: 8px; }
.mhsmadm-action-center a { display: flex; min-height: 54px; align-items: center; justify-content: space-between; padding: 10px 12px; background: #f8faff; border: 1px solid #ebf0f8; border-radius: 11px; color: inherit; text-decoration: none; transition: border-color 160ms ease, transform 160ms ease, box-shadow 160ms ease; }
.mhsmadm-action-center a:hover { border-color: #bcd5fb; box-shadow: 0 8px 20px rgba(37,99,235,.08); transform: translateY(-1px); }
.mhsmadm-action-center span { display: grid; }
.mhsmadm-action-center strong { color: #223650; font-size: 12px; font-weight: 600; }
.mhsmadm-action-center small { color: #8593a8; font-size: 10px; }
.mhsmadm-action-center b { min-width: 31px; padding: 5px 8px; background: linear-gradient(135deg, #dbeafe, #e0f2fe); border-radius: 8px; color: #1d4ed8; text-align: center; font-size: 12px; }

.mhsmadm-filter-bar { grid-template-columns: minmax(280px, 1.6fr) repeat(3, minmax(150px, .72fr)); gap: 10px; margin-bottom: 17px; padding: 15px; background: white; border: 1px solid var(--mhsmadm-v2-border); border-radius: var(--mhsmadm-v2-radius-lg); box-shadow: 0 9px 28px rgba(20,48,89,.05); }
.mhsmadm-filter-bar .form-control,
.mhsmadm-filter-bar .form-select,
.mhsmadm-input-wrap .form-control,
.mhsmadm-modal .form-control,
.mhsmadm-modal .form-select,
.mhsmadm-form-card .form-control,
.mhsmadm-form-card .form-select { min-height: 42px; background-color: #fbfcfe; border: 1px solid #dce5f0; border-radius: 10px; color: #21324d; font-size: 13px; box-shadow: none; }
.mhsmadm-filter-bar .form-control:focus,
.mhsmadm-filter-bar .form-select:focus,
.mhsmadm-input-wrap .form-control:focus,
.mhsmadm-modal .form-control:focus,
.mhsmadm-modal .form-select:focus,
.mhsmadm-form-card .form-control:focus,
.mhsmadm-form-card .form-select:focus { background: #fff; border-color: #6da1f4; box-shadow: 0 0 0 4px rgba(37,99,235,.09); }
.mhsmadm-search-wrap svg { color: var(--mhsmadm-v2-blue-600); }

.mhsmadm-table-wrap { scrollbar-color: #bfd0e7 transparent; scrollbar-width: thin; }
.mhsmadm-table { min-width: 920px; }
.mhsmadm-table thead th { height: 45px; padding: 0 16px; background: #f7f9fc; border-bottom: 1px solid #e7edf5; color: #66768d; font-size: 10px; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; white-space: nowrap; }
.mhsmadm-table thead th[data-sort-key]:not([data-sort-key="actions"]) { cursor: pointer; user-select: none; }
.mhsmadm-table thead th[data-sort-key]:hover { color: var(--mhsmadm-v2-blue-600); }
.mhsmadm-table thead th.is-sorted { background: #eff6ff; color: var(--mhsmadm-v2-blue-700); }
.mhsmadm-sort { color: #a7b4c6; font-style: normal; }
.mhsmadm-table tbody td { padding: 13px 16px; border-bottom-color: #edf1f6; color: #40516b; font-size: 12px; vertical-align: middle; }
.mhsmadm-table tbody tr { transition: background 150ms ease, box-shadow 150ms ease; }
.mhsmadm-table tbody tr:hover { background: #f7faff; box-shadow: inset 3px 0 var(--mhsmadm-v2-blue-500); }
.mhsmadm-person { display: flex; align-items: center; gap: 10px; min-width: 220px; }
.mhsmadm-avatar { display: grid; width: 35px; height: 35px; flex: 0 0 35px; place-items: center; background: linear-gradient(135deg, #dbeafe, #e0f2fe); border: 1px solid #bfdbfe; border-radius: 10px; color: #1d4ed8; font-size: 10px; font-weight: 700; }
.mhsmadm-applicant-cell strong { color: #182c49; font-size: 12px; font-weight: 650; }
.mhsmadm-applicant-cell span,
.mhsmadm-applicant-cell small { color: #8290a5; font-size: 10px; }
.mhsmadm-code { padding: 4px 7px; background: #f1f5f9; border-radius: 6px; color: #345073; font-family: "SFMono-Regular", Consolas, monospace; font-size: 10px; }
.mhsmadm-stage-pill { display: inline-flex; padding: 5px 8px; background: #eef5ff; border: 1px solid #d7e7ff; border-radius: 7px; color: #285aa6; font-size: 10px; font-weight: 600; white-space: nowrap; }
.mhsmadm-priority { display: inline-flex; align-items: center; gap: 6px; font-size: 11px; font-weight: 600; }
.mhsmadm-priority i { width: 7px; height: 7px; border-radius: 50%; }
.mhsmadm-priority.is-high { color: #c93445; } .mhsmadm-priority.is-high i { background: #ef4444; box-shadow: 0 0 0 4px #fee2e2; }
.mhsmadm-priority.is-normal { color: #2563eb; } .mhsmadm-priority.is-normal i { background: #3b82f6; box-shadow: 0 0 0 4px #dbeafe; }
.mhsmadm-priority.is-low { color: #0f9f6e; } .mhsmadm-priority.is-low i { background: #10b981; box-shadow: 0 0 0 4px #d1fae5; }

.mhsmadm-badge { padding: 5px 8px; border: 1px solid transparent; border-radius: 7px; font-size: 10px; font-weight: 650; }
.mhsmadm-badge-success { background: #e9fbf4; border-color: #c7f0df; color: #087757; }
.mhsmadm-badge-info { background: #eaf3ff; border-color: #d0e4ff; color: #1d5dbf; }
.mhsmadm-badge-warning { background: #fff7e6; border-color: #fde8b4; color: #a85b00; }
.mhsmadm-badge-neutral { background: #f0f3f7; border-color: #e1e7ef; color: #637187; }
.mhsmadm-badge-purple { background: #f2edff; border-color: #e2d7ff; color: #6d3bd1; }
.mhsmadm-progress-dots { gap: 3px; }
.mhsmadm-progress-dots i { width: 6px; height: 6px; background: #dce5f0; }
.mhsmadm-progress-dots i.is-complete { background: linear-gradient(135deg, #2563eb, #38bdf8); box-shadow: 0 2px 5px rgba(37,99,235,.18); }
.mhsmadm-progress-text { color: #8290a5; font-size: 9px; }
.mhsmadm-pagination { min-height: 60px; padding: 12px 16px; background: #fcfdff; border-top-color: #edf1f6; color: #738198; font-size: 11px; }
.mhsmadm-page-button { width: 33px; height: 33px; background: white; border-color: #dce5f0; border-radius: 8px; color: #60708a; }
.mhsmadm-page-button.is-active { background: var(--mhsmadm-v2-gradient); border-color: transparent; color: white; box-shadow: 0 7px 16px rgba(37,99,235,.2); }

.mhsmadm-stat-strip { grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 12px; padding: 0; background: transparent; border: 0; box-shadow: none; }
.mhsmadm-stat-item { position: relative; min-height: 108px; padding: 18px; background: white; border: 1px solid var(--mhsmadm-v2-border); border-radius: 14px; box-shadow: 0 8px 26px rgba(20,48,89,.05); }
.mhsmadm-stat-item::before { position: absolute; top: 0; left: 18px; width: 45px; height: 3px; background: var(--mhsmadm-v2-gradient); border-radius: 0 0 6px 6px; content: ""; }
.mhsmadm-stat-item strong { color: var(--mhsmadm-v2-navy-900); font-size: 21px; font-weight: 650; letter-spacing: -.03em; }
.mhsmadm-stat-item span { margin-top: 7px; color: #7f8da2; font-size: 10px; font-weight: 650; letter-spacing: .08em; text-transform: uppercase; }

.mhsmadm-detail-hero,
.mhsmadm-profile-banner {
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(circle at 86% 0, rgba(56,189,248,.28), transparent 20rem),
    linear-gradient(135deg, #0b1d3b 0%, #123a75 50%, #1557a6 100%);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: var(--mhsmadm-v2-radius-xl);
  box-shadow: 0 20px 46px rgba(6,18,38,.18);
}
.mhsmadm-detail-hero::after,
.mhsmadm-profile-banner::after { position: absolute; right: -60px; bottom: -105px; width: 250px; height: 250px; border: 1px solid rgba(255,255,255,.12); border-radius: 50%; content: ""; }
.mhsmadm-detail-hero h2,
.mhsmadm-profile-banner h2 { color: white; font-weight: 650; }
.mhsmadm-detail-hero p,
.mhsmadm-profile-banner p { color: #bdd3f1; }
.mhsmadm-detail-hero .mhsmadm-btn-outline { background: rgba(255,255,255,.1); border-color: rgba(255,255,255,.22); color: white; backdrop-filter: blur(8px); }
.mhsmadm-detail-section { margin-bottom: 15px; overflow: hidden; background: white; border: 1px solid var(--mhsmadm-v2-border); border-radius: 15px; box-shadow: 0 8px 28px rgba(20,48,89,.045); }
.mhsmadm-detail-section h3 { min-height: 50px; padding: 0 17px; background: linear-gradient(90deg, #eff6ff, #f8fbff); border-bottom: 1px solid #dfebfb; color: #1f4f91; font-size: 11px; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; }
.mhsmadm-detail-list { grid-template-columns: repeat(2, minmax(0,1fr)); }
.mhsmadm-detail-item { grid-template-columns: minmax(145px, .45fr) 1fr; min-height: 47px; padding: 12px 16px; border-bottom-color: #edf1f6; }
.mhsmadm-detail-item dt { color: #78869b; font-size: 11px; font-weight: 550; }
.mhsmadm-detail-item dd { color: #21324d; font-size: 12px; font-weight: 500; }
.mhsmadm-form-card { padding: 20px; }
.mhsmadm-form-card h3 { color: var(--mhsmadm-v2-navy-900); font-size: 15px; }
.mhsmadm-form-label { margin-bottom: 6px; color: #52627a; font-size: 11px; font-weight: 650; }

.mhsmadm-tabs { gap: 5px; padding: 4px; background: #f0f4fa; border-radius: 10px; }
.mhsmadm-tab { min-height: 33px; padding: 0 12px; border-radius: 8px; color: #6b7b93; font-size: 11px; font-weight: 600; }
.mhsmadm-tab.is-active { background: white; color: var(--mhsmadm-v2-blue-600); box-shadow: 0 4px 12px rgba(20,48,89,.08); }
.mhsmadm-progress-track { height: 8px; background: #e9eff7; border-radius: 9px; }
.mhsmadm-progress-fill { background: var(--mhsmadm-v2-gradient); border-radius: 9px; box-shadow: 0 3px 8px rgba(37,99,235,.18); transition: width 800ms cubic-bezier(.2,.7,.2,1); }
.mhsmadm-progress-row strong { color: #3c4e68; font-size: 11px; }
.mhsmadm-progress-row > span { color: #75849a; font-size: 10px; }

.mhsmadm-settings-grid { gap: 18px; }
.mhsmadm-setting-row { min-height: 61px; padding: 11px 13px; background: #f8faff; border: 1px solid #ebf0f7; border-radius: 11px; }
.mhsmadm-setting-row strong { color: #273a55; font-size: 12px; }
.mhsmadm-setting-row span { color: #8290a4; font-size: 10px; }
.mhsmadm-field-list,
.mhsmadm-column-list { gap: 9px; }
.mhsmadm-switch span { background: #c9d4e2; }
.mhsmadm-switch input:checked + span { background: var(--mhsmadm-v2-gradient); }

.mhsmadm-modal { padding: 20px; background: rgba(4, 14, 31, .66); backdrop-filter: blur(9px); }
.mhsmadm-modal-dialog { max-width: 720px; overflow: hidden; border: 1px solid rgba(255,255,255,.2); border-radius: 20px; box-shadow: 0 35px 90px rgba(4,14,31,.36); animation: mhsmadm-v2-modal 240ms cubic-bezier(.2,.8,.2,1); }
.mhsmadm-modal-head { min-height: 67px; padding: 0 20px; background: linear-gradient(135deg, #0d2142, #123a75); border-bottom: 0; }
.mhsmadm-modal-head h3 { color: white; font-size: 16px; }
.mhsmadm-close { background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.16); color: white; }
.mhsmadm-modal-body { padding: 22px; }
.mhsmadm-modal-foot { padding: 14px 20px; background: #f8fafd; border-top-color: #e8edf5; }

.mhsmadm-toast { border: 1px solid #cceadb; border-radius: 12px; box-shadow: 0 18px 45px rgba(6,18,38,.18); animation: mhsmadm-v2-toast 300ms cubic-bezier(.2,.8,.2,1); }
.mhsmadm-toast strong { background: var(--mhsmadm-v2-success); }

/* Global command palette */
.mhsmadm-command { position: fixed; inset: 0; z-index: 1300; display: none; align-items: flex-start; justify-content: center; padding: 10vh 18px 30px; background: rgba(4,14,31,.68); backdrop-filter: blur(10px); }
.mhsmadm-command.is-open { display: flex; }
.mhsmadm-command-dialog { width: min(650px, 100%); overflow: hidden; background: white; border: 1px solid rgba(255,255,255,.35); border-radius: 20px; box-shadow: 0 35px 100px rgba(4,14,31,.36); animation: mhsmadm-v2-modal 220ms cubic-bezier(.2,.8,.2,1); }
.mhsmadm-command-search { display: flex; height: 66px; align-items: center; gap: 12px; padding: 0 17px; border-bottom: 1px solid #e8edf5; }
.mhsmadm-command-search svg { width: 21px; color: var(--mhsmadm-v2-blue-600); }
.mhsmadm-command-search input { flex: 1; height: 100%; border: 0; outline: 0; color: #172b47; font-size: 15px; }
.mhsmadm-command-results { max-height: 390px; overflow: auto; padding: 9px; }
.mhsmadm-command-results a { display: flex; min-height: 59px; align-items: center; gap: 11px; padding: 9px 11px; border-radius: 11px; color: inherit; text-decoration: none; transition: background 150ms ease; }
.mhsmadm-command-results a:hover { background: #f1f6ff; }
.mhsmadm-command-results a > span:nth-child(2) { display: grid; flex: 1; }
.mhsmadm-command-results strong { color: #20344f; font-size: 12px; }
.mhsmadm-command-results small { color: #8694a7; font-size: 10px; }
.mhsmadm-command-results em { color: #9ba9bb; font-size: 12px; font-style: normal; }
.mhsmadm-command-icon { display: grid; width: 35px; height: 35px; place-items: center; background: #edf5ff; border-radius: 10px; color: #2563eb; }
.mhsmadm-command-icon svg { width: 17px; }
.mhsmadm-command-empty { padding: 45px 20px; color: #8492a6; text-align: center; font-size: 13px; }
.mhsmadm-command-foot { display: flex; gap: 15px; padding: 10px 16px; background: #f7f9fc; border-top: 1px solid #e8edf5; color: #8b98aa; font-size: 9px; text-transform: uppercase; letter-spacing: .06em; }

/* Login screen */
body.mhsmadm-login { background: #07152b; font-family: Inter, "Segoe UI", Arial, sans-serif; }
.mhsmadm-login-shell { min-height: 100vh; background: #f7f9fd; }
.mhsmadm-login-brand { position: relative; width: 56%; padding: 70px 7vw; overflow: hidden; background: radial-gradient(circle at 15% 10%, rgba(56,189,248,.25), transparent 22rem), linear-gradient(145deg, #07162e 0%, #0b2750 52%, #0c4a8b 100%); }
.mhsmadm-login-brand::before { right: -50px; bottom: -90px; width: 420px; height: 420px; border-color: rgba(255,255,255,.1); }
.mhsmadm-login-brand::after { position: absolute; right: 8%; top: 20%; width: 165px; height: 165px; background: linear-gradient(135deg, rgba(56,189,248,.12), rgba(37,99,235,.05)); border: 1px solid rgba(103,232,249,.14); border-radius: 34px; content: ""; transform: rotate(17deg); animation: mhsmadm-v2-float 7s ease-in-out infinite reverse; }
.mhsmadm-login-brand .mhsmadm-brand-lockup { position: relative; z-index: 2; }
.mhsmadm-login-message { position: relative; z-index: 2; max-width: 580px; }
.mhsmadm-login-message > p:first-child { color: #67e8f9; font-size: 11px; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; }
.mhsmadm-login-message h1 { max-width: 540px; color: white; font-size: 48px; font-weight: 650; line-height: 1.08; letter-spacing: -.05em; }
.mhsmadm-login-message h1::after { display: block; width: 75px; height: 4px; margin-top: 24px; background: var(--mhsmadm-v2-gradient); border-radius: 8px; content: ""; }
.mhsmadm-login-message p:last-child { max-width: 520px; margin-top: 25px; color: #b1c7e6; font-size: 15px; line-height: 1.8; }
.mhsmadm-login-footnote { position: relative; z-index: 2; color: #718caf; font-size: 11px; letter-spacing: .04em; }
.mhsmadm-login-panel { width: 44%; padding: 55px; background: radial-gradient(circle at 100% 0, rgba(59,130,246,.09), transparent 22rem), #f7f9fd; }
.mhsmadm-login-card { width: min(420px, 100%); padding: 34px; background: rgba(255,255,255,.92); border: 1px solid #e1e8f2; border-radius: 24px; box-shadow: 0 28px 70px rgba(9,30,66,.13); backdrop-filter: blur(15px); }
.mhsmadm-login-card h2 { color: #0a1931; font-size: 28px; font-weight: 650; letter-spacing: -.04em; }
.mhsmadm-login-card > p { color: #7b8aa0; font-size: 13px; }
.mhsmadm-field label { color: #40526d; font-size: 11px; font-weight: 650; }
.mhsmadm-input-wrap svg { color: #5a8ddd; }
.mhsmadm-login-card .mhsmadm-btn-primary { min-height: 48px; }
.mhsmadm-demo-box { background: linear-gradient(135deg, #eff6ff, #f0f9ff); border: 1px dashed #a6c8f6; border-radius: 12px; color: #49617e; font-size: 11px; }
.mhsmadm-demo-box strong { color: #1d4ed8; }

/* Motion is progressive and respects user preference. */
.mhsmadm-panel,
.mhsmadm-metric,
.mhsmadm-stat-item,
.mhsmadm-form-card { opacity: 0; transform: translateY(10px); }
.mhsmadm-panel.is-revealed,
.mhsmadm-metric.is-revealed,
.mhsmadm-stat-item.is-revealed,
.mhsmadm-form-card.is-revealed { opacity: 1; transform: translateY(0); transition: opacity 420ms ease var(--reveal-delay, 0ms), transform 420ms ease var(--reveal-delay, 0ms), box-shadow 200ms ease; }

@keyframes mhsmadm-v2-grow { from { transform: scaleY(0); opacity: .2; } to { transform: scaleY(1); opacity: 1; } }
@keyframes mhsmadm-v2-float { 0%,100% { transform: translate3d(0,0,0) rotate(0); } 50% { transform: translate3d(0,-14px,0) rotate(4deg); } }
@keyframes mhsmadm-v2-pulse { 0%,100% { opacity: 1; } 50% { opacity: .45; } }
@keyframes mhsmadm-v2-modal { from { opacity: 0; transform: translateY(15px) scale(.98); } to { opacity: 1; transform: none; } }
@keyframes mhsmadm-v2-toast { from { opacity: 0; transform: translateX(18px); } to { opacity: 1; transform: none; } }

@media (max-width: 1280px) {
  .mhsmadm-metrics { grid-template-columns: repeat(3, minmax(0,1fr)); }
  .mhsmadm-filter-bar { grid-template-columns: repeat(3, minmax(0,1fr)); }
  .mhsmadm-search-wrap { grid-column: span 2; }
  .mhsmadm-global-search { min-width: 185px; }
}

@media (max-width: 991.98px) {
  .mhsmadm-sidebar { width: 268px; transform: translateX(-100%); }
  .mhsmadm-sidebar.is-open { transform: translateX(0); }
  .mhsmadm-main { margin-left: 0; }
  .mhsmadm-topbar { padding: 0 20px; }
  .mhsmadm-content { padding: 24px 20px 40px; }
  .mhsmadm-global-search span,
  .mhsmadm-global-search kbd { display: none; }
  .mhsmadm-global-search { min-width: 41px; width: 41px; padding: 0; justify-content: center; }
  .mhsmadm-metrics { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .mhsmadm-grid-2,
  .mhsmadm-settings-grid { grid-template-columns: 1fr; }
  .mhsmadm-login-brand { width: 48%; padding: 45px; }
  .mhsmadm-login-panel { width: 52%; padding: 35px; }
  .mhsmadm-login-message h1 { font-size: 37px; }
}

@media (max-width: 767.98px) {
  .mhsmadm-topbar { height: 72px; padding: 0 14px; }
  .mhsmadm-topbar-left h1 { font-size: 17px; }
  .mhsmadm-breadcrumb { display: none; }
  .mhsmadm-user-chip > span:last-child { display: none; }
  .mhsmadm-content { padding: 20px 14px 35px; }
  .mhsmadm-page-intro { align-items: flex-start; }
  .mhsmadm-page-intro h2 { font-size: 22px; }
  .mhsmadm-metrics { grid-template-columns: 1fr 1fr; gap: 10px; }
  .mhsmadm-metric { min-height: 132px; padding: 16px; }
  .mhsmadm-metric-value { font-size: 27px; }
  .mhsmadm-filter-bar { grid-template-columns: 1fr; }
  .mhsmadm-search-wrap { grid-column: auto; }
  .mhsmadm-stat-strip { grid-template-columns: 1fr 1fr; }
  .mhsmadm-detail-list { grid-template-columns: 1fr; }
  .mhsmadm-detail-item { grid-template-columns: 1fr; gap: 4px; }
  .mhsmadm-detail-hero { padding: 20px; }
  .mhsmadm-login-shell { display: block; }
  .mhsmadm-login-brand { width: 100%; min-height: auto; padding: 35px 25px 45px; }
  .mhsmadm-login-message { margin-top: 60px; }
  .mhsmadm-login-message h1 { font-size: 34px; }
  .mhsmadm-login-message p:last-child { font-size: 13px; }
  .mhsmadm-login-footnote { display: none; }
  .mhsmadm-login-panel { width: 100%; min-height: auto; padding: 25px 15px 45px; }
  .mhsmadm-login-card { margin-top: -25px; padding: 25px; }
}

@media (max-width: 460px) {
  .mhsmadm-metrics { grid-template-columns: 1fr; }
  .mhsmadm-stat-strip { grid-template-columns: 1fr; }
  .mhsmadm-topbar-actions { gap: 6px; }
  .mhsmadm-user-chip { padding-right: 4px; }
  .mhsmadm-page-intro .d-flex { width: 100%; }
  .mhsmadm-page-intro .mhsmadm-btn { flex: 1 1 auto; }
  .mhsmadm-command { padding-top: 6vh; }
  .mhsmadm-command-foot { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
  .mhsmadm-panel,
  .mhsmadm-metric,
  .mhsmadm-stat-item,
  .mhsmadm-form-card { opacity: 1; transform: none; }
}

@media print {
  .mhsmadm-sidebar,
  .mhsmadm-topbar,
  .mhsmadm-page-intro,
  .mhsmadm-detail-actions,
  .mhsmadm-command { display: none !important; }
  .mhsmadm-main { margin: 0; }
  .mhsmadm-content { max-width: none; padding: 0; }
  .mhsmadm-detail-section,
  .mhsmadm-detail-hero { box-shadow: none; break-inside: avoid; }
}
