/* /assets/js/styles/base/theme-sharp.css  (v3.1.762)
   The "Sharp" look, platform-wide: chosen in deck.mxaura.ai > UI Surfaces > Theme and served by
   GET /auth/theme; the app sets <html data-theme="sharp">. Every rule here is scoped to that attribute,
   so with the attribute absent the classic look is untouched. The palette (indigo primary, slate text)
   stays mxAURA's: this file re-points the shape tokens (radius, shadow, weight) and a short list of
   shell pieces (top bar, sidebar, buttons, inputs, cards, tables). No "important" overrides: tokens first, so
   later fixes never fight the theme. Values are from TaxWealth's theme-sharp.css. */

html[data-theme="sharp"] {
  --radius-sm: 8px; --radius-md: 12px; --radius-lg: 16px; --radius-xl: 20px;
  --btn-radius: 12px; --btn-font-weight: 700;
  --input-radius: 11px; --input-border: transparent; --input-focus-ring: 0 0 0 3px rgba(99, 102, 241, 0.18);
  --card-radius: 16px; --card-border: rgba(16, 35, 63, 0.06);
  --badge-radius: 999px;
  --shadow-sm: 0 1px 2px rgba(16, 35, 63, 0.06), 0 6px 18px -10px rgba(16, 35, 63, 0.18);
  --shadow-md: 0 1px 2px rgba(16, 35, 63, 0.06), 0 12px 32px -14px rgba(16, 35, 63, 0.25);
  --shadow-lg: 0 4px 8px rgba(16, 35, 63, 0.08), 0 22px 48px -16px rgba(16, 35, 63, 0.32);
  --shadow-float: 0 4px 8px rgba(16, 35, 63, 0.08), 0 22px 48px -16px rgba(16, 35, 63, 0.32);
  --table-header-bg: transparent;
  --table-hover: rgba(99, 102, 241, 0.05);
  --mm-bg-page: #f4f6fb;
}

/* Page: a soft vertical wash, and display type with tight tracking */
html[data-theme="sharp"] body { background: linear-gradient(180deg, #f6f8fd 0%, #ecf1f9 100%); }
html[data-theme="sharp"] h1, html[data-theme="sharp"] h2, html[data-theme="sharp"] h3,
html[data-theme="sharp"] .mm-detail-title, html[data-theme="sharp"] #context-title { letter-spacing: -0.025em; font-weight: 800; }

/* Top bar: sticky glass over the navy */
html[data-theme="sharp"] .mm-topbar {
  position: sticky; top: 0; z-index: 40;
  background: linear-gradient(180deg, rgba(10, 30, 61, 0.92) 0%, rgba(7, 20, 40, 0.92) 100%);
  backdrop-filter: blur(12px) saturate(1.4); -webkit-backdrop-filter: blur(12px) saturate(1.4);
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.06), 0 10px 30px -18px rgba(16, 35, 63, 0.6);
}

/* Sidebar: gradient with a glow at the top, pill-shaped active item */
html[data-theme="sharp"] .mm-sidebar {
  background: radial-gradient(120% 60% at 20% -10%, rgba(99, 102, 241, 0.22) 0%, rgba(99, 102, 241, 0) 55%),
              linear-gradient(180deg, #0f1b2d 0%, #0b1526 100%);
}
html[data-theme="sharp"] .mm-nav-item, html[data-theme="sharp"] .mm-nav-group-header, html[data-theme="sharp"] .mm-nav-expandable-header {
  border-radius: 12px; font-weight: 600; transition: background 0.14s ease, transform 0.14s ease;
}
html[data-theme="sharp"] .mm-nav-item:hover { background: rgba(255, 255, 255, 0.08); }
html[data-theme="sharp"] .mm-nav-item.active {
  background: linear-gradient(135deg, #6366f1, #4338ca); border-left: 0; color: #fff;
  box-shadow: 0 8px 22px -6px rgba(99, 102, 241, 0.7), inset 0 1px 0 rgba(255, 255, 255, 0.18);
}

/* Buttons: gradient primary, lift on hover */
html[data-theme="sharp"] .mm-btn { font-family: var(--font-family); transition: transform 0.14s ease, box-shadow 0.14s ease, filter 0.14s ease; }
html[data-theme="sharp"] .mm-btn.primary, html[data-theme="sharp"] .modal-btn-primary, html[data-theme="sharp"] .mm-btn-primary {
  background: linear-gradient(135deg, #6366f1 0%, #4f46e5 55%, #4338ca 100%); border-color: #4338ca; color: #fff;
  box-shadow: 0 8px 18px -8px rgba(79, 70, 229, 0.6);
}
html[data-theme="sharp"] .mm-btn.primary:hover:not(:disabled), html[data-theme="sharp"] .modal-btn-primary:hover:not(:disabled) {
  background: linear-gradient(135deg, #6366f1 0%, #4f46e5 55%, #4338ca 100%); transform: translateY(-1px); filter: brightness(1.06);
  box-shadow: 0 12px 26px -8px rgba(79, 70, 229, 0.7);
}
html[data-theme="sharp"] .mm-btn.ghost:hover:not(:disabled), html[data-theme="sharp"] .grey-btn:hover:not(:disabled) { background: rgba(16, 35, 63, 0.045); }
html[data-theme="sharp"] .grey-btn { border-radius: var(--btn-radius); font-weight: 600; }

/* Inputs: filled, no hairline, a ring on focus */
html[data-theme="sharp"] .view-content input[type="text"], html[data-theme="sharp"] .view-content input[type="search"],
html[data-theme="sharp"] .view-content input[type="email"], html[data-theme="sharp"] .view-content input[type="url"],
html[data-theme="sharp"] .view-content input[type="number"], html[data-theme="sharp"] .view-content textarea,
html[data-theme="sharp"] .view-content select, html[data-theme="sharp"] .modal-overlay input, html[data-theme="sharp"] .modal-overlay select, html[data-theme="sharp"] .modal-overlay textarea {
  background: #f2f5fb; border-color: transparent; border-radius: var(--input-radius);
  transition: background 0.14s ease, box-shadow 0.14s ease, border-color 0.14s ease;
}
html[data-theme="sharp"] .view-content input:focus, html[data-theme="sharp"] .view-content textarea:focus, html[data-theme="sharp"] .view-content select:focus,
html[data-theme="sharp"] .modal-overlay input:focus, html[data-theme="sharp"] .modal-overlay textarea:focus, html[data-theme="sharp"] .modal-overlay select:focus {
  background: #fff; border-color: rgba(99, 102, 241, 0.6); box-shadow: var(--input-focus-ring); outline: none;
}

/* Cards and panels: borderless elevation */
html[data-theme="sharp"] .mm-detail-header, html[data-theme="sharp"] .data-table-wrapper, html[data-theme="sharp"] .modal,
html[data-theme="sharp"] .campaign-detail-root .cdr-bulk-action-bar, html[data-theme="sharp"] .mdr-section, html[data-theme="sharp"] .pdr-header-card {
  background: #fff; border-color: var(--card-border); border-radius: var(--card-radius); box-shadow: var(--shadow-md);
}
html[data-theme="sharp"] .mm-detail-header { background: #fff; }

/* Tables: quieter header, soft hover, no inset bar */
html[data-theme="sharp"] .mm-table th { background: transparent; border-bottom: 1px solid rgba(16, 35, 63, 0.08); }
html[data-theme="sharp"] .mm-table tbody tr:hover { background: var(--table-hover); box-shadow: none; }
html[data-theme="sharp"] .mm-table tbody tr { transition: background 0.12s ease; }

/* Status pills and tags round off */
html[data-theme="sharp"] .mm-status-badge, html[data-theme="sharp"] .cdr-blocks-cell, html[data-theme="sharp"] .ab-tpl { border-radius: 999px; }
html[data-theme="sharp"] .ab-tpl--on { border-radius: 12px; }
