/*
 * mileOtica Design System
 * Camada visual do produto. Mantem Bootstrap como infraestrutura e centraliza
 * tokens e componentes para que as telas nao precisem de CSS local.
 */

:root {
  --mo-primary-50: #eff8ff;
  --mo-primary-100: #dbefff;
  --mo-primary-200: #bfe3ff;
  --mo-primary-300: #93d1ff;
  --mo-primary-400: #60b5fa;
  --mo-primary-500: #3698ee;
  --mo-primary-600: #1e78d3;
  --mo-primary-700: #1d61aa;
  --mo-primary-800: #1c528b;
  --mo-primary-900: #1b4674;

  --mo-neutral-0: #ffffff;
  --mo-neutral-25: #fcfcfd;
  --mo-neutral-50: #f8fafc;
  --mo-neutral-100: #f1f5f9;
  --mo-neutral-200: #e2e8f0;
  --mo-neutral-300: #cbd5e1;
  --mo-neutral-400: #94a3b8;
  --mo-neutral-500: #64748b;
  --mo-neutral-600: #475569;
  --mo-neutral-700: #334155;
  --mo-neutral-800: #1e293b;
  --mo-neutral-900: #0f172a;

  --mo-success: #16875d;
  --mo-success-soft: #eaf8f1;
  --mo-warning: #b36205;
  --mo-warning-soft: #fff7e6;
  --mo-danger: #c43d4b;
  --mo-danger-soft: #fff0f1;
  --mo-info: #176b9c;
  --mo-info-soft: #eaf6fc;

  --mo-font-sans: Inter, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --mo-text-xs: .75rem;
  --mo-text-sm: .875rem;
  --mo-text-base: 1rem;
  --mo-text-lg: 1.125rem;
  --mo-text-xl: 1.25rem;
  --mo-text-2xl: 1.5rem;
  --mo-text-3xl: 1.875rem;

  --mo-space-1: .25rem;
  --mo-space-2: .5rem;
  --mo-space-3: .75rem;
  --mo-space-4: 1rem;
  --mo-space-5: 1.25rem;
  --mo-space-6: 1.5rem;
  --mo-space-8: 2rem;
  --mo-space-10: 2.5rem;
  --mo-space-12: 3rem;

  --mo-radius-sm: .5rem;
  --mo-radius-md: .75rem;
  --mo-radius-lg: 1rem;
  --mo-radius-pill: 999px;
  --mo-shadow-xs: 0 1px 2px rgba(15, 23, 42, .05);
  --mo-shadow-sm: 0 1px 3px rgba(15, 23, 42, .07), 0 1px 2px rgba(15, 23, 42, .04);
  --mo-shadow-md: 0 10px 30px rgba(15, 23, 42, .09);
  --mo-focus-ring: 0 0 0 .2rem rgba(54, 152, 238, .22);
  --mo-control-height: 2.75rem;
  --mo-control-height-sm: 2.25rem;
  --mo-content-width: 1440px;
  --mo-transition: 160ms ease;
  --mo-primary: var(--mo-primary-600);
  --mo-primary-soft: var(--mo-primary-50);
  --mo-border: var(--mo-neutral-200);
  --mo-bg-subtle: var(--mo-neutral-50);
  --mo-text: var(--mo-neutral-800);
  --mo-text-secondary: var(--mo-neutral-600);
  --mo-text-muted: var(--mo-neutral-500);

  --bs-primary: var(--mo-primary-600);
  --bs-primary-rgb: 30, 120, 211;
  --bs-success: var(--mo-success);
  --bs-danger: var(--mo-danger);
  --bs-warning: var(--mo-warning);
  --bs-info: var(--mo-info);
  --bs-body-font-family: var(--mo-font-sans);
  --bs-body-color: var(--mo-neutral-700);
  --bs-body-bg: var(--mo-neutral-50);
  --bs-border-color: var(--mo-neutral-200);
  --bs-border-radius: var(--mo-radius-sm);
}

html { scroll-behavior: smooth; }

body {
  color: var(--mo-neutral-700);
  background: var(--mo-neutral-50);
  font-family: var(--mo-font-sans);
  line-height: 1.5;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}

/* Application shell */
.mo-app-body { min-height: 100vh; overflow-x: hidden; }
.mo-app-shell { min-height: 100vh; display: flex; }
.mo-sidebar {
  width: 16.5rem !important;
  height: 100vh;
  min-height: 100vh;
  max-height: 100vh;
  flex: 0 0 16.5rem;
  display: flex;
  flex-direction: column;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 1035;
  overflow-x: hidden;
  overflow-y: auto;
  background: #10283f;
  color: #d8e6f2;
  transition: width var(--mo-transition), flex-basis var(--mo-transition), transform var(--mo-transition);
}
.mo-sidebar-header { min-height: 4.75rem; display: flex; align-items: center; justify-content: space-between; padding: var(--mo-space-4); border-bottom: 1px solid rgba(255,255,255,.08); }
.mo-brand { min-width: 0; display: flex; align-items: center; }
.mo-brand img { width: auto; max-width: 9.5rem; height: 2.7rem; object-fit: contain; object-position: left center; }
.mo-brand-icon { display: none; }
.mo-sidebar-close { color: #fff; }
.mo-sidebar-close:hover { background: rgba(255,255,255,.1); color: #fff; }
.mo-sidebar-nav { flex: 1; padding: var(--mo-space-3); }
.mo-nav-label { display: block; margin: var(--mo-space-5) var(--mo-space-3) var(--mo-space-2); color: #7894aa; font-size: .65rem; font-weight: 750; letter-spacing: .1em; text-transform: uppercase; }
.mo-nav-link {
  width: 100%;
  min-height: 2.75rem;
  display: flex;
  align-items: center;
  gap: var(--mo-space-3);
  margin-bottom: var(--mo-space-1);
  padding: .65rem .75rem;
  border: 0;
  border-radius: var(--mo-radius-sm);
  background: transparent;
  color: #c5d5e2;
  font: inherit;
  font-size: var(--mo-text-sm);
  font-weight: 600;
  text-align: left;
  text-decoration: none;
  white-space: nowrap;
  transition: background-color var(--mo-transition), color var(--mo-transition);
}
.mo-nav-link > i:first-child { width: 1.25rem; flex: 0 0 1.25rem; color: #82a3bb; font-size: .95rem; text-align: center; }
.mo-nav-link:hover { background: rgba(255,255,255,.07); color: #fff; text-decoration: none; }
.mo-nav-link:hover > i:first-child { color: #b9dcf5; }
.mo-nav-link.active { background: #1e78d3; color: #fff; box-shadow: 0 4px 14px rgba(0,0,0,.15); }
.mo-nav-link.active > i:first-child { color: #fff; }
.mo-nav-chevron { margin-left: auto; font-size: .65rem; transition: transform var(--mo-transition); }
.mo-nav-toggle[aria-expanded="true"] .mo-nav-chevron { transform: rotate(180deg); }
.mo-subnav { margin: 0 0 var(--mo-space-2) 2.6rem; padding-left: var(--mo-space-3); border-left: 1px solid rgba(255,255,255,.12); }
.mo-subnav a { display: block; padding: .5rem .6rem; border-radius: .4rem; color: #9db5c7; font-size: var(--mo-text-sm); text-decoration: none; }
.mo-subnav a:hover { background: rgba(255,255,255,.06); color: #fff; }
.mo-sidebar-footer { padding: var(--mo-space-3); border-top: 1px solid rgba(255,255,255,.08); }
.mo-collapse-button { width: 100%; justify-content: flex-start; color: #9db5c7; }
.mo-collapse-button:hover { background: rgba(255,255,255,.07); color: #fff; }
.mo-sidebar-backdrop { display: none; }

.mo-app-content { width: calc(100% - 16.5rem); min-width: 0; min-height: 100vh; margin-left: 16.5rem; background: var(--mo-neutral-50); transition: width var(--mo-transition), margin-left var(--mo-transition); }
.mo-topbar { min-height: 4.75rem; display: flex; align-items: center; gap: var(--mo-space-3); position: fixed; top: 0; right: 0; left: 16.5rem; z-index: 1020; padding: 0 var(--mo-space-6); border-bottom: 1px solid var(--mo-neutral-200); background: rgba(255,255,255,.96); box-shadow: var(--mo-shadow-xs); backdrop-filter: blur(12px); transition: left var(--mo-transition); }
.mo-topbar-context { min-width: 0; display: flex; align-items: center; gap: var(--mo-space-2); font-size: var(--mo-text-sm); }
.mo-topbar-product { color: var(--mo-neutral-900); font-weight: 750; }
.mo-topbar-separator { color: var(--mo-neutral-300); }
.mo-topbar-section { color: var(--mo-neutral-500); }
.mo-user-menu { min-height: 3rem; padding: .25rem .5rem; }
.mo-user-avatar { width: 2.25rem; height: 2.25rem; display: inline-flex; align-items: center; justify-content: center; border-radius: 50%; background: var(--mo-primary-100); color: var(--mo-primary-800); font-weight: 750; }
.mo-user-copy { align-items: flex-start; flex-direction: column; gap: 0; line-height: 1.25; text-align: left; }
.mo-user-copy strong { max-width: 12rem; overflow: hidden; color: var(--mo-neutral-800); font-size: var(--mo-text-sm); text-overflow: ellipsis; white-space: nowrap; }
.mo-user-copy small { color: var(--mo-neutral-500); font-size: .68rem; }
.mo-user-chevron { color: var(--mo-neutral-400); font-size: .65rem; }
.mo-main-content { min-height: calc(100vh - 4.75rem); margin-top: 4.75rem; padding: var(--mo-space-6) 0 var(--mo-space-8); }
.mo-legacy-page-header { min-height: 2.75rem; display: grid; grid-template-columns: minmax(0,1fr) auto minmax(0,1fr); align-items: center; gap: var(--mo-space-4); margin: 0 var(--mo-space-6) var(--mo-space-5); }
.mo-legacy-title { margin: 0; font-size: var(--mo-text-2xl); text-align: center; }
.mo-legacy-left, .mo-legacy-actions { display: flex; align-items: center; }
.mo-legacy-actions { justify-content: flex-end; }
.mo-legacy-page-header:has(.mo-legacy-title:empty) { min-height: 0; margin-bottom: 0; }

.mo-sidebar-collapsed .mo-sidebar { width: 5rem !important; flex-basis: 5rem; }
.mo-sidebar-collapsed .mo-app-content { width: calc(100% - 5rem); margin-left: 5rem; }
.mo-sidebar-collapsed .mo-topbar { left: 5rem; }
.mo-sidebar-collapsed .mo-sidebar-header { justify-content: center; padding-inline: .65rem; }
.mo-sidebar-collapsed .mo-brand-full { display: none; }
.mo-sidebar-collapsed .mo-brand-icon { width: 2.45rem; max-width: 2.45rem; height: 2.45rem; display: block; border-radius: .55rem; }
.mo-sidebar-collapsed .mo-nav-label, .mo-sidebar-collapsed .mo-nav-link span, .mo-sidebar-collapsed .mo-nav-chevron, .mo-sidebar-collapsed .mo-collapse-button span { display: none; }
.mo-sidebar-collapsed .mo-nav-link { justify-content: center; padding-inline: .5rem; }
.mo-sidebar-collapsed .mo-nav-link > i:first-child { font-size: 1rem; }
.mo-sidebar-collapsed .mo-subnav { display: none; }
.mo-sidebar-collapsed .mo-collapse-button { justify-content: center; }
.mo-sidebar-collapsed .mo-collapse-button i { transform: rotate(180deg); }
#sidebarToggle::before, #sidebarToggle::after { content: none !important; }

/* Dashboard */
.mo-dashboard { max-width: var(--mo-content-width); margin-inline: auto; }
.mo-dashboard-welcome { display: flex; align-items: center; justify-content: space-between; gap: var(--mo-space-5); margin-bottom: var(--mo-space-6); padding: var(--mo-space-5) var(--mo-space-6); border: 1px solid var(--mo-neutral-200); border-radius: var(--mo-radius-md); background: linear-gradient(110deg, #fff 0%, var(--mo-primary-50) 100%); }
.mo-dashboard-welcome h2 { margin: .2rem 0; font-size: var(--mo-text-xl); }
.mo-dashboard-welcome p { margin: 0; color: var(--mo-neutral-500); font-size: var(--mo-text-sm); }
.mo-dashboard-eyebrow { color: var(--mo-primary-700); font-size: .7rem; font-weight: 750; letter-spacing: .07em; text-transform: uppercase; }
.mo-dashboard-date { display: inline-flex; align-items: center; gap: var(--mo-space-2); flex: 0 0 auto; padding: .55rem .75rem; border: 1px solid var(--mo-neutral-200); border-radius: var(--mo-radius-pill); background: #fff; color: var(--mo-neutral-600); font-size: var(--mo-text-sm); }
.mo-metric-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--mo-space-4); margin-bottom: var(--mo-space-5); }
.mo-metric-card { min-width: 0; display: flex; align-items: center; gap: var(--mo-space-4); padding: var(--mo-space-5); border: 1px solid var(--mo-neutral-200); border-radius: var(--mo-radius-md); background: #fff; box-shadow: var(--mo-shadow-xs); }
.mo-metric-icon { width: 2.8rem; height: 2.8rem; display: inline-flex; align-items: center; justify-content: center; flex: 0 0 2.8rem; border-radius: var(--mo-radius-md); background: var(--mo-primary-50); color: var(--mo-primary-700); }
.mo-metric-card > div { min-width: 0; display: flex; flex-direction: column; }
.mo-metric-label { color: var(--mo-neutral-500); font-size: var(--mo-text-xs); font-weight: 650; }
.mo-metric-card strong { overflow: hidden; color: var(--mo-neutral-900); font-size: var(--mo-text-xl); line-height: 1.4; text-overflow: ellipsis; white-space: nowrap; }
.mo-metric-card small { overflow: hidden; color: var(--mo-neutral-500); font-size: .7rem; text-overflow: ellipsis; white-space: nowrap; }
.mo-metric-card--primary { border-color: var(--mo-primary-200); background: var(--mo-primary-700); }
.mo-metric-card--primary .mo-metric-icon { background: rgba(255,255,255,.14); color: #fff; }
.mo-metric-card--primary .mo-metric-label, .mo-metric-card--primary small { color: #c9e5fa; }
.mo-metric-card--primary strong { color: #fff; }
.mo-dashboard-grid-main { display: grid; grid-template-columns: minmax(0, 2fr) minmax(18rem, .8fr); gap: var(--mo-space-5); margin-bottom: var(--mo-space-5); }
.mo-dashboard-grid-secondary { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--mo-space-5); margin-bottom: var(--mo-space-5); }
.mo-dashboard-card-header { min-height: 4.5rem; display: flex; align-items: center; justify-content: space-between; gap: var(--mo-space-4); padding: var(--mo-space-4) var(--mo-space-5); border-bottom: 1px solid var(--mo-neutral-200); }
.mo-dashboard-card-header h3 { margin: .15rem 0 0; font-size: var(--mo-text-lg); }
.mo-dashboard-card-header > a { font-size: var(--mo-text-sm); font-weight: 650; text-decoration: none; }
.mo-trend { display: inline-flex; align-items: center; gap: .3rem; padding: .35rem .6rem; border-radius: var(--mo-radius-pill); font-size: var(--mo-text-xs); font-weight: 750; }
.mo-trend.is-positive { background: var(--mo-success-soft); color: var(--mo-success); }
.mo-trend.is-negative { background: var(--mo-danger-soft); color: var(--mo-danger); }
.mo-sales-comparison { display: grid; grid-template-columns: 12rem minmax(0, 1fr); gap: var(--mo-space-5); padding: var(--mo-space-5); }
.mo-comparison-values { display: flex; flex-direction: column; justify-content: center; gap: var(--mo-space-6); }
.mo-comparison-values > div { display: flex; flex-direction: column; padding-left: var(--mo-space-3); border-left: 3px solid var(--mo-primary-500); }
.mo-comparison-values > div + div { border-left-color: #f0a35b; }
.mo-comparison-values span, .mo-comparison-values small { color: var(--mo-neutral-500); font-size: var(--mo-text-xs); }
.mo-comparison-values strong { color: var(--mo-neutral-900); font-size: var(--mo-text-lg); }
.mo-chart-wrap { min-width: 0; height: 16rem; }
.mo-chart-wrap canvas { width: 100%; height: 100%; }
.mo-attention-list { padding: var(--mo-space-2); }
.mo-attention-list a { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: var(--mo-space-3); padding: var(--mo-space-3); border-radius: var(--mo-radius-sm); color: var(--mo-neutral-600); font-size: var(--mo-text-sm); text-decoration: none; }
.mo-attention-list a:hover { background: var(--mo-neutral-50); color: var(--mo-neutral-900); }
.mo-attention-list a > i { color: var(--mo-neutral-300); font-size: .65rem; }
.mo-attention-list strong { color: var(--mo-neutral-900); }
.mo-attention-icon, .mo-list-icon { width: 2.35rem; height: 2.35rem; display: inline-flex; align-items: center; justify-content: center; border-radius: var(--mo-radius-sm); }
.mo-attention-icon.is-warning { background: var(--mo-warning-soft); color: var(--mo-warning); }.mo-attention-icon.is-danger { background: var(--mo-danger-soft); color: var(--mo-danger); }.mo-attention-icon.is-info { background: var(--mo-info-soft); color: var(--mo-info); }.mo-attention-icon.is-neutral { background: var(--mo-neutral-100); color: var(--mo-neutral-600); }
.mo-dashboard-list { padding: var(--mo-space-2); }
.mo-dashboard-list > a { display: flex; align-items: center; gap: var(--mo-space-3); padding: var(--mo-space-3); border-radius: var(--mo-radius-sm); color: var(--mo-neutral-600); text-decoration: none; }
.mo-dashboard-list > a:hover { background: var(--mo-neutral-50); }
.mo-dashboard-list > a > i { color: var(--mo-neutral-300); font-size: .65rem; }
.mo-list-date { width: 3.2rem; display: flex; align-items: center; flex: 0 0 3.2rem; flex-direction: column; padding: .35rem; border-radius: var(--mo-radius-sm); background: var(--mo-primary-50); color: var(--mo-primary-800); line-height: 1.1; }
.mo-list-date.is-late { background: var(--mo-danger-soft); color: var(--mo-danger); }.mo-list-date strong { font-size: var(--mo-text-lg); }.mo-list-date small { font-size: .62rem; }
.mo-list-icon { flex: 0 0 2.35rem; background: var(--mo-success-soft); color: var(--mo-success); }
.mo-list-copy { min-width: 0; display: flex; flex: 1; flex-direction: column; }.mo-list-copy strong, .mo-list-copy small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }.mo-list-copy strong { color: var(--mo-neutral-800); font-size: var(--mo-text-sm); }.mo-list-copy small { color: var(--mo-neutral-500); font-size: var(--mo-text-xs); }
.mo-list-value { flex: 0 0 auto; color: var(--mo-success); font-size: var(--mo-text-sm); }
.mo-compact-empty { min-height: 14rem; display: flex; align-items: center; justify-content: center; flex-direction: column; gap: var(--mo-space-3); color: var(--mo-neutral-400); }.mo-compact-empty i { font-size: var(--mo-text-2xl); }.mo-compact-empty p { margin: 0; }
.mo-quick-actions { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--mo-space-3); }
.mo-quick-actions a { display: flex; align-items: center; gap: var(--mo-space-3); padding: var(--mo-space-4); border: 1px solid var(--mo-neutral-200); border-radius: var(--mo-radius-md); background: #fff; color: var(--mo-neutral-700); font-size: var(--mo-text-sm); font-weight: 650; text-decoration: none; }.mo-quick-actions a:hover { border-color: var(--mo-primary-300); background: var(--mo-primary-50); color: var(--mo-primary-800); }.mo-quick-actions i { color: var(--mo-primary-600); }

/* Shared record listing */
.mo-listing-card { overflow: hidden; }
.mo-listing-toolbar { display: grid; grid-template-columns: minmax(0,1fr) minmax(20rem,32rem); align-items: center; gap: var(--mo-space-5); padding: var(--mo-space-5) var(--mo-space-6); border-bottom: 1px solid var(--mo-neutral-200); }
.mo-listing-toolbar > :first-child { min-width: 0; }
.mo-listing-toolbar h2 { margin: 0 0 .2rem; font-size: var(--mo-text-lg); }.mo-listing-toolbar p { margin: 0; color: var(--mo-neutral-500); font-size: var(--mo-text-sm); }
.mo-listing-search { min-width: 0; flex: 1 1 auto; position: relative; }.mo-listing-search > i { position: absolute; top: 50%; left: .85rem; z-index: 1; transform: translateY(-50%); color: var(--mo-neutral-400); }.mo-listing-search .form-control { padding-left: 2.5rem; }
.mo-listing-tools { min-width: 0; display: flex; align-items: center; gap: var(--mo-space-2); }.mo-listing-tools > .btn { flex: 0 0 auto; }
.mo-filter-active-dot { width: .45rem; height: .45rem; border-radius: 50%; background: var(--mo-primary-600); }
.mo-dynamic-filters { padding: var(--mo-space-5) var(--mo-space-6); border-bottom: 1px solid var(--mo-neutral-200); background: var(--mo-neutral-25); }
.mo-filter-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr)); gap: var(--mo-space-4); }
.mo-filter-field { min-width: 0; }.mo-period-fields { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: var(--mo-space-2); }
.mo-filter-actions { display: flex; justify-content: flex-end; gap: var(--mo-space-2); margin-top: var(--mo-space-4); }
.mo-listing-loading { display: flex; justify-content: center; padding: var(--mo-space-8); }
.mo-record-list { padding: var(--mo-space-3); }
.mo-record-card { display: grid; grid-template-columns: auto minmax(12rem, 1fr) minmax(8rem, auto) minmax(7rem, auto) auto; align-items: center; gap: var(--mo-space-4); margin-bottom: var(--mo-space-2); padding: var(--mo-space-4); border-color: transparent; background: var(--mo-neutral-25); box-shadow: none; transition: border-color var(--mo-transition), background-color var(--mo-transition), box-shadow var(--mo-transition); }
.mo-record-card:last-child { margin-bottom: 0; }.mo-record-card:hover { border-color: var(--mo-neutral-200); background: #fff; box-shadow: var(--mo-shadow-sm); }
.mo-record-icon { width: 3rem; height: 3rem; display: inline-flex; align-items: center; justify-content: center; border-radius: var(--mo-radius-md); background: var(--mo-primary-50); color: var(--mo-primary-700); font-size: var(--mo-text-lg); }
.mo-record-main { min-width: 0; }.mo-record-heading { display: flex; align-items: center; gap: var(--mo-space-2); }.mo-record-heading h3 { overflow: hidden; margin: 0; font-size: var(--mo-text-base); text-overflow: ellipsis; white-space: nowrap; }
.mo-record-meta { display: flex; flex-wrap: wrap; gap: var(--mo-space-4); margin-top: .3rem; color: var(--mo-neutral-500); font-size: var(--mo-text-xs); }.mo-record-meta span { display: inline-flex; align-items: center; gap: .35rem; }
.mo-product-price, .mo-product-stock { display: flex; flex-direction: column; }.mo-product-price small, .mo-product-stock small { color: var(--mo-neutral-500); font-size: .68rem; }.mo-product-price strong, .mo-product-stock strong { color: var(--mo-neutral-800); font-size: var(--mo-text-sm); }.mo-product-stock.is-empty strong { color: var(--mo-danger); }
.mo-record-actions { display: flex; align-items: center; justify-content: flex-end; flex-wrap: wrap; gap: var(--mo-space-2); }.mo-record-actions .btn { min-width: 5.5rem; }
.mo-record-card > .mo-record-actions { grid-column: -1; }
.mo-record-metric { min-width: 7rem; display: flex; flex-direction: column; }.mo-record-metric small { color: var(--mo-neutral-500); font-size: .68rem; }.mo-record-metric strong { color: var(--mo-neutral-800); font-size: var(--mo-text-sm); }
.mo-status-toggle { min-width: 5.5rem; display: inline-flex; align-items: center; justify-content: flex-start; gap: var(--mo-space-2); margin: 0; color: var(--mo-neutral-600); font-size: var(--mo-text-xs); line-height: 1; white-space: nowrap; cursor: pointer; }.mo-status-toggle .form-check-input { position: static; float: none; flex: 0 0 auto; margin: 0; }.mo-status-toggle .form-check-input:disabled { cursor: wait; opacity: .65; }
.mo-client-summary { overflow: hidden; border: 1px solid var(--mo-neutral-200); border-radius: var(--mo-radius-md); background: #fff; box-shadow: var(--mo-shadow-xs); }
.mo-client-summary-header { display: flex; align-items: center; gap: var(--mo-space-3); padding: var(--mo-space-4); border-bottom: 1px solid var(--mo-neutral-100); background: linear-gradient(135deg,var(--mo-primary-50),#fff 72%); }
.mo-client-summary-avatar { width: 2.5rem; height: 2.5rem; display: inline-flex; align-items: center; justify-content: center; flex: 0 0 2.5rem; border-radius: 50%; background: var(--mo-primary-600); color: #fff; }
.mo-client-summary-identity { min-width: 0; display: flex; flex: 1; flex-direction: column; }.mo-client-summary-identity strong { overflow: hidden; color: var(--mo-neutral-900); font-size: var(--mo-text-base); text-overflow: ellipsis; white-space: nowrap; }.mo-client-summary-identity span { color: var(--mo-neutral-500); font-size: var(--mo-text-xs); }
.mo-client-summary-grid { display: grid; grid-template-columns: repeat(auto-fit,minmax(9.5rem,1fr)); gap: 1px; background: var(--mo-neutral-100); }
.mo-client-detail { min-width: 0; display: flex; align-items: center; gap: var(--mo-space-2); padding: var(--mo-space-3) var(--mo-space-4); background: #fff; }.mo-client-detail > i { width: 1rem; flex: 0 0 1rem; color: var(--mo-primary-600); text-align: center; }.mo-client-detail > span,.mo-client-address > span { min-width: 0; display: flex; flex-direction: column; }.mo-client-detail small,.mo-client-address small { color: var(--mo-neutral-500); font-size: .65rem; line-height: 1.2; text-transform: uppercase; letter-spacing: .03em; }.mo-client-detail strong,.mo-client-address strong { overflow: hidden; color: var(--mo-neutral-700); font-size: var(--mo-text-xs); font-weight: 650; text-overflow: ellipsis; white-space: nowrap; }
.mo-client-address { display: flex; align-items: center; gap: var(--mo-space-3); padding: var(--mo-space-3) var(--mo-space-4); border-top: 1px solid var(--mo-neutral-100); background: var(--mo-neutral-25); }.mo-client-address > i { color: var(--mo-danger); }
.mo-client-summary.is-compact .mo-client-summary-header { padding-block: var(--mo-space-3); }.mo-client-summary.is-compact .mo-client-summary-avatar { width: 2rem; height: 2rem; flex-basis: 2rem; font-size: var(--mo-text-xs); }.mo-client-summary.is-compact .mo-client-detail,.mo-client-summary.is-compact .mo-client-address { padding-block: var(--mo-space-2); }
.mo-client-summary-empty { min-height: 4.5rem; display: flex; align-items: center; justify-content: center; gap: var(--mo-space-2); padding: var(--mo-space-4); border: 1px dashed var(--mo-neutral-300); border-radius: var(--mo-radius-md); background: var(--mo-neutral-25); color: var(--mo-neutral-500); font-size: var(--mo-text-sm); }.mo-client-summary-empty i { color: var(--mo-primary-500); }
.mo-listing-footer { display: flex; align-items: center; justify-content: space-between; gap: var(--mo-space-4); padding: var(--mo-space-4) var(--mo-space-6); border-top: 1px solid var(--mo-neutral-200); background: var(--mo-neutral-25); }
.mo-summary-grid { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: var(--mo-space-4); margin-bottom: var(--mo-space-5); }
.mo-summary-item { display: flex; flex-direction: column; padding: var(--mo-space-4) var(--mo-space-5); border: 1px solid var(--mo-neutral-200); border-radius: var(--mo-radius-md); background: #fff; box-shadow: var(--mo-shadow-xs); }.mo-summary-item span,.mo-summary-item small { color: var(--mo-neutral-500); font-size: var(--mo-text-xs); }.mo-summary-item strong { color: var(--mo-neutral-900); font-size: var(--mo-text-xl); }

h1, h2, h3, h4, h5, h6 {
  color: var(--mo-neutral-900);
  font-weight: 700;
  letter-spacing: -.02em;
}

h1 { font-size: clamp(1.5rem, 2vw, var(--mo-text-3xl)); }
h2 { font-size: clamp(1.25rem, 1.7vw, var(--mo-text-2xl)); }
h3 { font-size: var(--mo-text-xl); }
h4 { font-size: var(--mo-text-lg); }

a { color: var(--mo-primary-700); }
a:hover { color: var(--mo-primary-800); }

:focus-visible {
  outline: 3px solid rgba(54, 152, 238, .38);
  outline-offset: 2px;
}

::selection { background: var(--mo-primary-200); color: var(--mo-neutral-900); }

.mo-page {
  width: 100%;
  max-width: var(--mo-content-width);
  margin-inline: auto;
  padding: 0 var(--mo-space-6) var(--mo-space-8);
}

.mo-page-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--mo-space-4);
  margin-bottom: var(--mo-space-6);
}

.mo-page-title { margin: 0; }
.mo-page-description { margin: var(--mo-space-1) 0 0; color: var(--mo-neutral-500); }
.mo-page-actions { display: flex; flex-wrap: wrap; gap: var(--mo-space-2); }

.mo-breadcrumb {
  display: flex;
  flex-wrap: wrap;
  gap: var(--mo-space-2);
  margin: 0 0 var(--mo-space-2);
  padding: 0;
  color: var(--mo-neutral-500);
  font-size: var(--mo-text-sm);
  list-style: none;
}

.mo-breadcrumb li + li::before { content: "/"; margin-right: var(--mo-space-2); color: var(--mo-neutral-300); }

.card,
.mo-card {
  border: 1px solid var(--mo-neutral-200);
  border-radius: var(--mo-radius-md);
  background: var(--mo-neutral-0);
  box-shadow: var(--mo-shadow-xs);
}

.mo-card-header,
.mo-card-body,
.mo-card-footer { padding: var(--mo-space-5) var(--mo-space-6); }
.mo-card-header { border-bottom: 1px solid var(--mo-neutral-200); }
.mo-card-footer { border-top: 1px solid var(--mo-neutral-200); background: var(--mo-neutral-25); }

.btn {
  min-height: var(--mo-control-height);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--mo-space-2);
  border-radius: var(--mo-radius-sm);
  padding: .625rem 1rem;
  font-size: var(--mo-text-sm);
  font-weight: 650;
  transition: color var(--mo-transition), background-color var(--mo-transition), border-color var(--mo-transition), box-shadow var(--mo-transition), transform var(--mo-transition);
}

.btn-sm { min-height: var(--mo-control-height-sm); padding: .4rem .75rem; }
.btn:active:not(:disabled) { transform: translateY(1px); }
.btn:focus-visible { box-shadow: var(--mo-focus-ring); }
.btn-primary { background: var(--mo-primary-600); border-color: var(--mo-primary-600); }
.btn-primary:hover { background: var(--mo-primary-700); border-color: var(--mo-primary-700); }
.btn-success { background: var(--mo-success); border-color: var(--mo-success); }
.btn-danger { background: var(--mo-danger); border-color: var(--mo-danger); }
.btn-light { background: var(--mo-neutral-0); border-color: var(--mo-neutral-200); color: var(--mo-neutral-700); }
.btn-ghost { background: transparent; border-color: transparent; color: var(--mo-neutral-600); }
.btn-ghost:hover { background: var(--mo-neutral-100); color: var(--mo-neutral-900); }
.btn-icon { width: var(--mo-control-height); padding: 0; }
.btn:disabled, .btn.disabled { cursor: not-allowed; opacity: .55; }
.btn.is-loading { color: transparent !important; pointer-events: none; position: relative; }
.btn.is-loading::after {
  content: "";
  position: absolute;
  width: 1rem;
  height: 1rem;
  border: 2px solid rgba(255, 255, 255, .5);
  border-right-color: #fff;
  border-radius: 50%;
  animation: mo-spin .65s linear infinite;
}

.btn-light.is-loading::after,
.btn-outline-primary.is-loading::after,
.btn-ghost.is-loading::after {
  border-color: rgba(30, 120, 211, .25);
  border-right-color: var(--mo-primary-600);
}

.form-label { margin-bottom: var(--mo-space-2); color: var(--mo-neutral-700); font-size: var(--mo-text-sm); font-weight: 650; }
.form-label .required, .form-label-required::after { color: var(--mo-danger); }
.form-label-required::after { content: " *"; }

.form-control,
.form-select,
.select2-container .select2-selection--single,
.select2-container .select2-selection--multiple {
  min-height: var(--mo-control-height);
  border: 1px solid var(--mo-neutral-300);
  border-radius: var(--mo-radius-sm);
  background-color: var(--mo-neutral-0);
  color: var(--mo-neutral-800);
  font-size: var(--mo-text-sm);
  transition: border-color var(--mo-transition), box-shadow var(--mo-transition), background-color var(--mo-transition);
}

.form-control, .form-select { padding: .625rem .75rem; }
.form-control::placeholder { color: var(--mo-neutral-400); }
.form-control:hover, .form-select:hover { border-color: var(--mo-neutral-400); }
.form-control:focus, .form-select:focus,
.select2-container--focus .select2-selection,
.select2-container--open .select2-selection {
  border-color: var(--mo-primary-500) !important;
  box-shadow: var(--mo-focus-ring) !important;
}

.form-control:disabled, .form-select:disabled { background: var(--mo-neutral-100); color: var(--mo-neutral-500); cursor: not-allowed; }
.form-text { color: var(--mo-neutral-500); font-size: var(--mo-text-xs); }
.invalid-feedback { color: var(--mo-danger); font-size: var(--mo-text-xs); }
.is-invalid { border-color: var(--mo-danger) !important; }
.form-check-input { width: 1.125rem; height: 1.125rem; border-color: var(--mo-neutral-400); }
.form-check-input:checked { background-color: var(--mo-primary-600); border-color: var(--mo-primary-600); }
.form-check-input:focus { box-shadow: var(--mo-focus-ring); }
textarea.form-control { min-height: 7rem; resize: vertical; }

.mo-field-group { margin-bottom: var(--mo-space-5); }
.mo-form-grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: var(--mo-space-5); }
.mo-col-12 { grid-column: span 12; }
.mo-col-8 { grid-column: span 8; }
.mo-col-6 { grid-column: span 6; }
.mo-col-4 { grid-column: span 4; }
.mo-col-3 { grid-column: span 3; }

.mo-filter-bar {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: var(--mo-space-3);
  margin-bottom: var(--mo-space-5);
  padding: var(--mo-space-4);
  border: 1px solid var(--mo-neutral-200);
  border-radius: var(--mo-radius-md);
  background: var(--mo-neutral-25);
}
.mo-filter-bar .mo-filter-search { flex: 1 1 18rem; }

.table { --bs-table-bg: transparent; margin-bottom: 0; color: var(--mo-neutral-700); }
.table > :not(caption) > * > * { padding: .875rem 1rem; border-bottom-color: var(--mo-neutral-200); vertical-align: middle; }
.table thead th {
  border-bottom-width: 1px;
  background: var(--mo-neutral-50);
  color: var(--mo-neutral-500);
  font-size: var(--mo-text-xs);
  font-weight: 700;
  letter-spacing: .035em;
  text-transform: uppercase;
  white-space: nowrap;
}
.table tbody tr { transition: background-color var(--mo-transition); }
.table-hover > tbody > tr:hover > * { background: var(--mo-primary-50); color: inherit; }
.mo-table-wrap { overflow: hidden; border: 1px solid var(--mo-neutral-200); border-radius: var(--mo-radius-md); }
.mo-table-primary { color: var(--mo-neutral-900); font-weight: 650; }
.mo-table-secondary { display: block; margin-top: .125rem; color: var(--mo-neutral-500); font-size: var(--mo-text-xs); }
.mo-table-actions { display: flex; justify-content: flex-end; gap: var(--mo-space-1); }

.badge,
.mo-badge {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  border: 1px solid transparent;
  border-radius: var(--mo-radius-pill);
  padding: .3rem .6rem;
  font-size: var(--mo-text-xs);
  font-weight: 700;
  line-height: 1;
}
.mo-badge::before { width: .4rem; height: .4rem; border-radius: 50%; background: currentColor; content: ""; }
.mo-badge-success { background: var(--mo-success-soft); border-color: #bce8d4; color: var(--mo-success); }
.mo-badge-warning { background: var(--mo-warning-soft); border-color: #f5d49a; color: var(--mo-warning); }
.mo-badge-danger { background: var(--mo-danger-soft); border-color: #f2c1c7; color: var(--mo-danger); }
.mo-badge-info { background: var(--mo-info-soft); border-color: #bee2f2; color: var(--mo-info); }
.mo-badge-neutral { background: var(--mo-neutral-100); border-color: var(--mo-neutral-200); color: var(--mo-neutral-600); }

.alert {
  border-width: 1px;
  border-radius: var(--mo-radius-md);
  padding: var(--mo-space-4);
  font-size: var(--mo-text-sm);
}
.alert-success { background: var(--mo-success-soft); border-color: #bce8d4; color: #116b4a; }
.alert-warning { background: var(--mo-warning-soft); border-color: #f5d49a; color: #8b4b05; }
.alert-danger { background: var(--mo-danger-soft); border-color: #f2c1c7; color: #9d2f3a; }
.alert-info { background: var(--mo-info-soft); border-color: #bee2f2; color: #13597f; }

.modal-content { border: 0; border-radius: var(--mo-radius-lg); box-shadow: var(--mo-shadow-md); overflow: hidden; }
.modal-header, .modal-footer { border-color: var(--mo-neutral-200); padding: var(--mo-space-5) var(--mo-space-6); }
.modal-body { padding: var(--mo-space-6); }
.modal-title { font-size: var(--mo-text-lg); }
.dropdown-menu { border: 1px solid var(--mo-neutral-200); border-radius: var(--mo-radius-md); padding: var(--mo-space-2); box-shadow: var(--mo-shadow-md); }
.dropdown-item { border-radius: .4rem; padding: .625rem .75rem; font-size: var(--mo-text-sm); }
.dropdown-item:hover, .dropdown-item:focus { background: var(--mo-neutral-100); color: var(--mo-neutral-900); }
.dropdown-item.text-danger:hover { background: var(--mo-danger-soft); color: var(--mo-danger) !important; }

.pagination { flex-wrap: wrap; gap: var(--mo-space-1); }
.page-link {
  min-width: 2.375rem;
  min-height: 2.375rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--mo-neutral-200);
  border-radius: var(--mo-radius-sm) !important;
  color: var(--mo-neutral-600);
  font-size: var(--mo-text-sm);
}
.page-link:hover { background: var(--mo-neutral-100); border-color: var(--mo-neutral-300); color: var(--mo-neutral-900); }
.page-item.active .page-link { background: var(--mo-primary-600); border-color: var(--mo-primary-600); }
.page-item.disabled .page-link { background: var(--mo-neutral-50); color: var(--mo-neutral-400); }

.mo-empty-state { max-width: 34rem; margin: 0 auto; padding: var(--mo-space-12) var(--mo-space-6); text-align: center; }
.mo-empty-icon { width: 3.5rem; height: 3.5rem; display: inline-flex; align-items: center; justify-content: center; margin-bottom: var(--mo-space-4); border-radius: var(--mo-radius-lg); background: var(--mo-primary-50); color: var(--mo-primary-700); font-size: var(--mo-text-xl); }
.mo-empty-title { margin-bottom: var(--mo-space-2); font-size: var(--mo-text-lg); }
.mo-empty-description { margin-bottom: var(--mo-space-5); color: var(--mo-neutral-500); }

.mo-skeleton { position: relative; overflow: hidden; border-radius: .35rem; background: var(--mo-neutral-200); color: transparent !important; }
.mo-skeleton::after { position: absolute; inset: 0; transform: translateX(-100%); background: linear-gradient(90deg, transparent, rgba(255,255,255,.65), transparent); animation: mo-shimmer 1.4s infinite; content: ""; }
.mo-skeleton-line { height: .85rem; margin-bottom: var(--mo-space-2); }
.mo-skeleton-line:last-child { width: 65%; }
.mo-spinner { width: 1.25rem; height: 1.25rem; border: 2px solid var(--mo-neutral-300); border-right-color: var(--mo-primary-600); border-radius: 50%; animation: mo-spin .65s linear infinite; }

.toast-container { z-index: 1090; }
.toast { border: 0; border-radius: var(--mo-radius-md); box-shadow: var(--mo-shadow-md); }

@keyframes mo-spin { to { transform: rotate(360deg); } }
@keyframes mo-shimmer { 100% { transform: translateX(100%); } }

@media (max-width: 767.98px) {
  :root { --mo-control-height: 2.875rem; }
  .mo-page { padding-inline: var(--mo-space-4); }
  .mo-page-header { align-items: stretch; flex-direction: column; }
  .mo-page-actions .btn { flex: 1 1 auto; }
  .mo-form-grid { grid-template-columns: 1fr; gap: var(--mo-space-4); }
  .mo-col-3, .mo-col-4, .mo-col-6, .mo-col-8, .mo-col-12 { grid-column: 1; }
  .mo-filter-bar { align-items: stretch; flex-direction: column; }
  .mo-filter-bar > * { width: 100%; }
  .modal-dialog { margin: var(--mo-space-2); }
  .modal-dialog-scrollable { height: calc(100% - 1rem); }
  .modal-header, .modal-footer, .modal-body { padding: var(--mo-space-4); }
  .modal-footer .btn { flex: 1; }
}

@media (max-width: 991.98px) {
  .mo-sidebar { width: min(19rem, 86vw) !important; height: 100vh; min-height: 0; position: fixed; left: 0; transform: translateX(-105%); box-shadow: var(--mo-shadow-md); }
  .mo-app-content { width: 100%; margin-left: 0; }
  .mo-menu-open { overflow: hidden; }
  .mo-menu-open .mo-sidebar { transform: translateX(0); }
  .mo-sidebar-backdrop { position: fixed; inset: 0; z-index: 1030; border: 0; background: rgba(15,23,42,.5); opacity: 0; pointer-events: none; transition: opacity var(--mo-transition); }
  .mo-menu-open .mo-sidebar-backdrop { display: block; opacity: 1; pointer-events: auto; }
  .mo-topbar { padding-inline: var(--mo-space-4); }
  .mo-topbar, .mo-sidebar-collapsed .mo-topbar { left: 0; }
  .mo-metric-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .mo-dashboard-grid-main { grid-template-columns: 1fr; }
  .mo-listing-toolbar { grid-template-columns: 1fr; align-items: stretch; }
  .mo-record-card { grid-template-columns: auto minmax(0, 1fr) auto; }
  .mo-product-price, .mo-product-stock { grid-row: 2; }.mo-product-price { grid-column: 2; }.mo-product-stock { grid-column: 3; }.mo-record-actions { grid-column: 3; grid-row: 1; }
  .mo-record-metric { grid-row: 2; }.mo-record-metric:first-of-type { grid-column: 2; }
  .mo-summary-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
}

@media (max-width: 575.98px) {
  .mo-topbar-context { display: none; }
  .mo-main-content { padding-top: var(--mo-space-4); }
  .mo-legacy-page-header { grid-template-columns: 1fr; align-items: stretch; margin-inline: var(--mo-space-4); }
  .mo-legacy-title { grid-row: 1; text-align: left; }
  .mo-legacy-left, .mo-legacy-actions { width: 100%; }
  .mo-legacy-actions .btn, .mo-legacy-left .btn { width: 100%; }
  .mo-dashboard-welcome { align-items: flex-start; flex-direction: column; padding: var(--mo-space-4); }
  .mo-metric-grid, .mo-dashboard-grid-secondary { grid-template-columns: 1fr; }
  .mo-sales-comparison { grid-template-columns: 1fr; }
  .mo-comparison-values { flex-direction: row; justify-content: flex-start; gap: var(--mo-space-4); }
  .mo-comparison-values > div { min-width: 0; flex: 1; }
  .mo-chart-wrap { height: 13rem; }
  .mo-quick-actions { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .mo-list-value { font-size: var(--mo-text-xs); }
  .mo-listing-toolbar { padding: var(--mo-space-4); }
  .mo-listing-tools { align-items: stretch; flex-direction: column; }.mo-listing-tools .btn { width: 100%; }
  .mo-listing-search { min-width: 0; width: 100%; }
  .mo-record-list { padding: var(--mo-space-2); }
  .mo-record-card { grid-template-columns: auto minmax(0, 1fr); gap: var(--mo-space-3); padding: var(--mo-space-3); }
  .mo-record-heading { align-items: flex-start; flex-direction: column; }
  .mo-record-meta { gap: var(--mo-space-2); flex-direction: column; }
  .mo-product-price, .mo-product-stock { grid-row: 2; }.mo-product-price { grid-column: 1; }.mo-product-stock { grid-column: 2; }
  .mo-record-actions { grid-column: 1 / -1; grid-row: 3; }.mo-record-actions .btn { width: 100%; }
  .mo-record-actions { flex-wrap: wrap; }.mo-record-actions > * { flex: 1 1 auto; }
  .mo-record-metric { grid-row: auto !important; grid-column: auto !important; }
  .mo-listing-footer { align-items: stretch; flex-direction: column; padding: var(--mo-space-4); }.mo-listing-footer nav { overflow-x: auto; }.mo-listing-footer .pagination { flex-wrap: nowrap; justify-content: flex-start; }
  .mo-dynamic-filters { padding: var(--mo-space-4); }.mo-filter-grid { grid-template-columns: 1fr; }.mo-filter-actions { align-items: stretch; flex-direction: column; }.mo-filter-actions .btn { width: 100%; }
  .mo-summary-grid { grid-template-columns: 1fr 1fr; gap: var(--mo-space-2); }.mo-summary-item { padding: var(--mo-space-3); }.mo-summary-item strong { font-size: var(--mo-text-base); }
}

.mo-journey { display:grid; gap:var(--mo-space-5); }
.mo-journey-tabs { display:flex; gap:.35rem; overflow-x:auto; padding:.4rem; border:1px solid var(--mo-border); border-radius:var(--mo-radius-lg); background:#fff; box-shadow:var(--mo-shadow-sm); }
.mo-journey-tabs a { display:flex; align-items:center; gap:.55rem; flex:0 0 auto; padding:.7rem .9rem; border-radius:.65rem; color:var(--mo-text-secondary); font-size:.82rem; font-weight:700; text-decoration:none; white-space:nowrap; }
.mo-journey-tabs a:hover { background:var(--mo-bg-subtle); color:var(--mo-primary); }.mo-journey-tabs a.active { color:#fff; background:linear-gradient(135deg,var(--mo-primary),#2695e8); }
@media(min-width:992px){.mo-journey-tabs a{flex:1 1 auto;justify-content:center;min-width:0;padding:.7rem .4rem;font-size:.72rem}}
.mo-connect-feedback { align-self:center; margin-right:auto; color:var(--mo-success); font-size:.76rem; font-weight:700; }.mo-connect-feedback.is-error { color:var(--mo-danger); }
.mo-template-library { display:grid; gap:1rem; }.mo-template-library>header { display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:1.2rem; border:1px solid var(--mo-border); border-radius:var(--mo-radius-lg); background:#fff; }.mo-template-library h2 { margin:.15rem 0; font-size:1.2rem; }.mo-template-library>header p { margin:0; color:var(--mo-neutral-500); font-size:.8rem; }.mo-template-library>header>div:last-child { display:flex; gap:.5rem; }.mo-template-feedback { min-height:1rem; color:var(--mo-success); font-size:.75rem; }.mo-template-feedback.is-error { color:var(--mo-danger); }.mo-template-grid { display:grid; grid-template-columns:1fr 1fr; gap:1rem; }.mo-template-grid>div { min-width:0; padding:1rem; border:1px solid var(--mo-border); border-radius:var(--mo-radius-lg); background:#fff; }.mo-template-grid h3 { display:flex; justify-content:space-between; font-size:.95rem; }.mo-template-grid h3 span { color:var(--mo-neutral-500); }.mo-template-grid article { margin-top:.65rem; padding:.8rem; border:1px solid var(--mo-neutral-200); border-radius:.7rem; }.mo-template-grid article>div { display:flex; justify-content:space-between; gap:.5rem; }.mo-template-grid article small { color:var(--mo-neutral-500); font-size:.68rem; }.mo-template-grid article p { margin:.6rem 0; color:var(--mo-neutral-600); font-size:.77rem; white-space:pre-wrap; }.mo-template-grid article footer { display:flex; align-items:center; justify-content:space-between; gap:.4rem; }.mo-template-dialog { width:min(35rem,calc(100vw - 2rem)); padding:0; border:0; border-radius:1rem; box-shadow:0 24px 70px rgba(15,23,42,.25); }.mo-template-dialog::backdrop { background:rgba(15,23,42,.5); }.mo-template-dialog form { display:grid; gap:.85rem; padding:1rem; }.mo-template-dialog header,.mo-template-dialog footer { display:flex; align-items:center; justify-content:space-between; gap:.5rem; }.mo-template-dialog h3 { margin:0; font-size:1rem; }.mo-template-dialog label { display:grid; gap:.3rem; color:var(--mo-neutral-600); font-size:.72rem; font-weight:700; }.mo-template-dialog input,.mo-template-dialog select,.mo-template-dialog textarea { width:100%; padding:.65rem .75rem; border:1px solid var(--mo-border); border-radius:.55rem; font:inherit; font-size:.82rem; }.mo-variable-chips { display:flex; flex-wrap:wrap; gap:.3rem; }.mo-variable-chips button { padding:.25rem .45rem; border:1px solid var(--mo-primary-200); border-radius:999px; color:var(--mo-primary-700); background:var(--mo-primary-50); font-size:.62rem; }
@media(max-width:767.98px){.mo-template-library>header{align-items:stretch;flex-direction:column}.mo-template-library>header>div:last-child{flex-direction:column}.mo-template-grid{grid-template-columns:1fr}}
.mo-journey-builder,.mo-automation-panel { display:grid; gap:1rem; }.mo-journey-builder>header,.mo-automation-panel>header { display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:1.2rem; border:1px solid var(--mo-border); border-radius:var(--mo-radius-lg); background:#fff; }.mo-journey-builder h2,.mo-automation-panel h2 { margin:.15rem 0; font-size:1.2rem; }.mo-journey-builder header p,.mo-automation-panel header p { margin:0; color:var(--mo-neutral-500); font-size:.8rem; }.mo-journey-list,.mo-automation-list { display:grid; gap:.5rem; padding:1rem; border:1px solid var(--mo-border); border-radius:var(--mo-radius-lg); background:#fff; }.mo-journey-list article,.mo-automation-list article { display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:.75rem; padding:.8rem; border:1px solid var(--mo-neutral-200); border-radius:.75rem; }.mo-journey-list article>div,.mo-automation-list article>div { display:flex; min-width:0; flex-direction:column; }.mo-journey-list small,.mo-automation-list small { color:var(--mo-neutral-500); font-size:.7rem; }.mo-flow-icon { display:grid; place-items:center; width:2.25rem; height:2.25rem; border-radius:.7rem; color:var(--mo-primary-700); background:var(--mo-primary-50); }.mo-journey-dialog { width:min(48rem,calc(100vw - 2rem)); }.mo-step-toolbar { display:flex; align-items:center; flex-wrap:wrap; gap:.35rem; }.mo-step-toolbar span { margin-right:auto; font-weight:800; }.mo-step-toolbar button { padding:.3rem .5rem; border:1px solid var(--mo-primary-200); border-radius:999px; color:var(--mo-primary-700); background:var(--mo-primary-50); font-size:.68rem; }.mo-builder-steps { display:grid; gap:.5rem; max-height:45vh; overflow:auto; }.mo-builder-step { display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:.6rem; padding:.65rem; border:1px solid var(--mo-neutral-200); border-radius:.7rem; background:var(--mo-neutral-25); }.mo-step-index { display:grid; place-items:center; width:1.6rem; height:1.6rem; border-radius:50%; color:#fff; background:var(--mo-primary-600); font-size:.68rem; font-weight:800; }.mo-step-fields { display:flex; align-items:center; gap:.4rem; min-width:0; }.mo-step-fields strong { min-width:7rem; font-size:.74rem; }.mo-step-fields input,.mo-step-fields select { min-width:0; flex:1; padding:.45rem; border:1px solid var(--mo-border); border-radius:.45rem; font-size:.72rem; }
.mo-automation-list article{grid-template-columns:auto minmax(0,1fr) auto auto}.mo-template-dialog .mo-template-active{display:flex;align-items:center;gap:.55rem}.mo-template-dialog .mo-template-active input{width:1rem;height:1rem}.mo-template-grid article footer .btn{margin-left:auto}
.mo-execution-message{display:block;margin-top:.3rem;color:var(--mo-text-secondary)!important;white-space:pre-wrap}.mo-status-trail{display:flex;flex-wrap:wrap;gap:.25rem;margin-top:.35rem}.mo-status-trail b{padding:.16rem .4rem;border-radius:999px;color:var(--mo-primary-700);background:var(--mo-primary-50);font-size:.58rem;font-weight:700}
@media(max-width:575.98px){.mo-automation-list article{grid-template-columns:auto minmax(0,1fr) auto}.mo-automation-list article>[data-edit-automation]{grid-column:2}.mo-automation-list article>.mo-status-toggle{grid-column:3;grid-row:1/3}.mo-template-grid article footer{align-items:flex-start;flex-wrap:wrap}.mo-template-grid article footer .btn{width:100%;margin-left:0}}
@media(max-width:767.98px){.mo-journey-builder>header,.mo-automation-panel>header{align-items:stretch;flex-direction:column}.mo-step-fields{align-items:stretch;flex-direction:column}.mo-step-fields strong{min-width:0;width:100%}}
.mo-logs-panel { display:grid; gap:1rem; }.mo-logs-panel>header,.mo-execution-detail { padding:1.1rem; border:1px solid var(--mo-border); border-radius:var(--mo-radius-lg); background:#fff; }.mo-logs-panel h2 { margin:.15rem 0; font-size:1.2rem; }.mo-logs-panel header p { margin:0; color:var(--mo-neutral-500); font-size:.8rem; }.mo-log-tabs { display:grid; grid-template-columns:1fr 1fr; gap:1rem; }.mo-log-tabs>div { min-width:0; padding:1rem; border:1px solid var(--mo-border); border-radius:var(--mo-radius-lg); background:#fff; }.mo-log-tabs h3 { font-size:.9rem; }.mo-log-tabs a,.mo-log-tabs article { display:grid; grid-template-columns:1fr auto auto; align-items:center; gap:.5rem; padding:.65rem 0; border-bottom:1px solid var(--mo-neutral-100); color:var(--mo-neutral-700); text-decoration:none; }.mo-log-tabs a>span:first-child,.mo-log-tabs article>span:first-child { display:flex; min-width:0; flex-direction:column; }.mo-log-tabs small,.mo-log-tabs time,.mo-execution-timeline small,.mo-execution-timeline time { color:var(--mo-neutral-500); font-size:.65rem; }.mo-execution-detail>header { display:flex; align-items:center; justify-content:space-between; padding:0 0 .8rem; border:0; border-bottom:1px solid var(--mo-border); border-radius:0; }.mo-execution-detail h3 { margin:0; font-size:.95rem; }.mo-execution-timeline article { display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:.7rem; padding:.65rem 0; }.mo-execution-timeline article>i { display:grid; place-items:center; width:1.6rem; height:1.6rem; border-radius:50%; color:var(--mo-success); background:var(--mo-success-soft); font-size:.65rem; }.mo-execution-timeline article>span { display:flex; flex-direction:column; }
@media(max-width:767.98px){.mo-log-tabs{grid-template-columns:1fr}.mo-log-tabs a,.mo-log-tabs article{grid-template-columns:1fr auto}.mo-log-tabs time{grid-column:1/-1}}
.mo-trigger-configuration { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:.5rem; }.mo-trigger-configuration:empty { display:none; }.mo-trigger-configuration label { display:grid; gap:.25rem; }.mo-trigger-configuration input,.mo-trigger-configuration select { width:100%; padding:.5rem; border:1px solid var(--mo-border); border-radius:.5rem; font-size:.75rem; }
@media(max-width:575.98px){.mo-trigger-configuration{grid-template-columns:1fr}}
.mo-journey-hero,.mo-settings-card { border:1px solid var(--mo-border); border-radius:var(--mo-radius-lg); background:#fff; box-shadow:var(--mo-shadow-sm); }.mo-journey-hero { display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:1.35rem 1.5rem; background:linear-gradient(120deg,#fff 55%,#eff9ff); }
.mo-journey-hero h2,.mo-settings-card h2 { margin:.2rem 0; color:var(--mo-text); font-size:1.25rem; font-weight:800; }.mo-journey-hero p,.mo-settings-card p { margin:0; color:var(--mo-text-secondary); font-size:.88rem; }.mo-eyebrow { color:var(--mo-primary); font-size:.7rem; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }
.mo-connection-pill { display:inline-flex; align-items:center; gap:.5rem; padding:.55rem .75rem; border-radius:999px; font-size:.76rem; font-weight:800; white-space:nowrap; }.mo-connection-pill i { font-size:.5rem; }.mo-connection-pill.is-online { color:#087a55; background:#e7faf2; }.mo-connection-pill.is-offline { color:#7b8494; background:#eef1f5; }
.mo-journey-metrics { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:var(--mo-space-4); }.mo-journey-metrics article { display:grid; grid-template-columns:auto 1fr; gap:.1rem .75rem; padding:1.15rem; border:1px solid var(--mo-border); border-radius:var(--mo-radius-lg); background:#fff; box-shadow:var(--mo-shadow-sm); }.mo-journey-metrics article>i { grid-row:1/3; align-self:center; display:grid; place-items:center; width:2.35rem; height:2.35rem; border-radius:.75rem; color:var(--mo-primary); background:var(--mo-primary-soft); }.mo-journey-metrics span { color:var(--mo-text-secondary); font-size:.74rem; font-weight:700; }.mo-journey-metrics strong { color:var(--mo-text); font-size:1.4rem; line-height:1.15; }
.mo-journey-empty { display:flex; align-items:center; gap:1rem; min-height:8rem; padding:1.25rem; border:1px dashed #cbd6e4; border-radius:var(--mo-radius-lg); background:#fff; }.mo-journey-empty h3 { margin:0 0 .25rem; font-size:1rem; }.mo-journey-empty p { margin:0; color:var(--mo-text-secondary); font-size:.84rem; }.mo-empty-icon { display:grid; place-items:center; flex:0 0 auto; width:2.8rem; height:2.8rem; border-radius:.9rem; color:var(--mo-primary); background:var(--mo-primary-soft); }.mo-journey-empty .btn { margin-left:auto; }
.mo-settings-card { max-width:68rem; margin:auto; overflow:hidden; }.mo-settings-card>header { display:flex; align-items:center; justify-content:space-between; padding:1.4rem 1.5rem; border-bottom:1px solid var(--mo-border); }.mo-settings-card>header>i { color:#20b86a; font-size:2.3rem; }.mo-connect-state { display:flex; flex-direction:column; align-items:center; padding:3rem 1rem; text-align:center; }.mo-connect-state>span { display:grid; place-items:center; width:4rem; height:4rem; margin-bottom:1rem; border-radius:1.25rem; color:#20a866; background:#e9faf2; font-size:1.45rem; }.mo-connect-state h3 { margin:0 0 .4rem; font-size:1.08rem; }.mo-connect-state p { max-width:34rem; margin:0 0 1.2rem; }.mo-connect-state small { margin-top:.75rem; color:var(--mo-text-muted); }.mo-settings-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1px; background:var(--mo-border); }.mo-settings-grid>div { padding:1rem 1.2rem; background:#fff; }.mo-settings-grid span { display:block; color:var(--mo-text-muted); font-size:.72rem; }.mo-settings-grid strong { font-size:.88rem; }.mo-settings-card>footer { display:flex; justify-content:flex-end; gap:.6rem; padding:1rem 1.2rem; border-top:1px solid var(--mo-border); }
.mo-config-warning { width:min(100%,34rem); margin-top:1rem; padding:.85rem 1rem; border:1px solid #f2cc83; border-radius:.8rem; background:#fff9ed; color:#795313; text-align:left; }.mo-config-warning strong { display:block; margin-bottom:.25rem; }.mo-config-warning p { margin:0 0 .3rem; }.mo-config-warning ul { margin:.25rem 0 0; padding-left:1.25rem; }
.mo-chat-shell { display:grid; grid-template-columns:minmax(14rem,24rem) minmax(22rem,1fr) minmax(14rem,19rem); min-height:34rem; border:1px solid var(--mo-border); border-radius:var(--mo-radius-lg); background:#fff; box-shadow:var(--mo-shadow-sm); overflow:hidden; }.mo-chat-shell>aside,.mo-chat-shell>main { min-width:0; }.mo-chat-shell>aside { padding:1rem; border-right:1px solid var(--mo-border); }.mo-chat-shell label { display:flex; align-items:center; gap:.6rem; padding:.6rem .75rem; border:1px solid var(--mo-border); border-radius:.7rem; background:var(--mo-bg-subtle); }.mo-chat-shell input { min-width:0; width:100%; border:0; outline:0; background:transparent; }.mo-chat-empty,.mo-chat-details p { padding:2rem .5rem; color:var(--mo-text-muted); font-size:.82rem; text-align:center; }.mo-chat-welcome { display:grid; place-items:center; align-content:center; height:100%; padding:2rem; text-align:center; background:linear-gradient(135deg,#f8fafc,#eef8ff); }.mo-chat-welcome>i { color:#22ae69; font-size:3rem; }.mo-chat-welcome h3 { margin:1rem 0 .25rem; }.mo-chat-welcome p { color:var(--mo-text-secondary); }.mo-chat-details { border-right:0!important; border-left:1px solid var(--mo-border); }.mo-chat-details h3 { font-size:.95rem; }
.mo-conversation-list { padding:.65rem!important; }.mo-conversation-item { display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:.7rem; margin-top:.35rem; padding:.7rem; border-radius:.75rem; color:var(--mo-neutral-700); text-decoration:none; }.mo-conversation-item:hover,.mo-conversation-item.active { color:var(--mo-neutral-800); background:var(--mo-primary-50); }.mo-conversation-item>span:nth-child(2) { min-width:0; display:flex; flex-direction:column; }.mo-conversation-item strong,.mo-conversation-item small { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }.mo-conversation-item small { color:var(--mo-neutral-500); font-size:.7rem; }.mo-conversation-item>b { display:grid; place-items:center; min-width:1.25rem; height:1.25rem; padding:0 .3rem; border-radius:999px; color:#fff; background:var(--mo-primary-600); font-size:.65rem; }.mo-chat-avatar { display:grid; place-items:center; flex:0 0 auto; width:2.25rem; height:2.25rem; border-radius:50%; color:var(--mo-primary-800); background:var(--mo-primary-100); font-size:.78rem; font-weight:800; }.mo-chat-shell>main { display:flex; flex-direction:column; background:#f6f8fa; }.mo-chat-header { display:flex; align-items:center; gap:.7rem; padding:.75rem 1rem; border-bottom:1px solid var(--mo-border); background:#fff; }.mo-chat-header>div { display:flex; flex-direction:column; }.mo-chat-header small { color:var(--mo-neutral-500); font-size:.68rem; }.mo-message-timeline { display:flex; flex:1; flex-direction:column; gap:.45rem; overflow-y:auto; padding:1rem; }.mo-message { max-width:78%; padding:.6rem .75rem; border-radius:.8rem; box-shadow:var(--mo-shadow-xs); }.mo-message p { margin:0; color:var(--mo-neutral-800); font-size:.82rem; white-space:pre-wrap; }.mo-message small { display:block; margin-top:.25rem; color:var(--mo-neutral-500); font-size:.6rem; }.mo-message.is-inbound { align-self:flex-start; border-bottom-left-radius:.2rem; background:#fff; }.mo-message.is-outbound { align-self:flex-end; border-bottom-right-radius:.2rem; background:#dcf8e8; }.mo-message-composer { display:flex; gap:.5rem; padding:.7rem; border-top:1px solid var(--mo-border); background:#fff; }.mo-message-composer input { padding:.65rem .8rem; border:1px solid var(--mo-border); border-radius:.7rem; }.mo-client-chat-card { display:flex; flex-direction:column; gap:.7rem; }.mo-client-chat-card>strong { font-size:1rem; }.mo-client-chat-card>span { display:flex; align-items:center; gap:.5rem; color:var(--mo-neutral-600); font-size:.75rem; }.mo-client-chat-card i { width:1rem; color:var(--mo-primary-600); }
.mo-chat-back{display:none;color:var(--mo-neutral-600)}
.mo-chat-service-bar{display:flex;align-items:center;gap:1rem;margin-top:.75rem;padding:.75rem 1rem;border:1px solid var(--mo-border);border-radius:var(--mo-radius-md);background:#fff;box-shadow:var(--mo-shadow-xs)}.mo-chat-service-bar>div:first-child{display:flex;min-width:10rem;flex-direction:column}.mo-chat-service-bar span,.mo-chat-service-bar small{color:var(--mo-text-muted);font-size:.72rem}.mo-chat-service-actions{display:flex;flex:1;justify-content:flex-end;gap:.5rem;flex-wrap:wrap}.mo-chat-service-bar>small{flex-basis:100%;text-align:right}.mo-chat-service-bar>small.is-error{color:#b42318}@media(max-width:575.98px){.mo-chat-service-bar{align-items:stretch;flex-direction:column}.mo-chat-service-actions{justify-content:stretch}.mo-chat-service-actions .btn{flex:1 1 45%}}
.mo-template-composer{display:flex;align-items:center;gap:.6rem;margin-top:.6rem;padding:.65rem;border:1px solid var(--mo-border);border-radius:var(--mo-radius-md);background:#fff}.mo-template-composer label{display:flex;flex:1;align-items:center;gap:.5rem;margin:0}.mo-template-composer select{width:100%;padding:.55rem;border:1px solid var(--mo-border);border-radius:.55rem;background:#fff}.mo-template-composer small{color:var(--mo-text-muted);font-size:.7rem}.mo-template-composer small.is-error{color:#b42318}@media(max-width:575.98px){.mo-template-composer{align-items:stretch;flex-direction:column}.mo-template-composer .btn{width:100%}}
.mo-conversation-filters{display:flex;align-items:center;gap:.55rem;margin-bottom:.7rem;flex-wrap:wrap}.mo-conversation-filters>label{display:flex;min-width:16rem;flex:1;align-items:center;gap:.5rem;padding:.55rem .7rem;border:1px solid var(--mo-border);border-radius:.65rem;background:#fff}.mo-conversation-filters input{width:100%;border:0;outline:0}.mo-conversation-filters nav{display:flex;flex-basis:100%;gap:.4rem;overflow-x:auto;padding-bottom:.15rem}.mo-conversation-filters nav a{flex:0 0 auto;padding:.35rem .65rem;border:1px solid var(--mo-border);border-radius:999px;color:var(--mo-text-secondary);font-size:.7rem;text-decoration:none}.mo-conversation-filters nav a.active{border-color:var(--mo-primary-500);color:var(--mo-primary-700);background:var(--mo-primary-50)}@media(max-width:575.98px){.mo-conversation-filters>label{min-width:0}.mo-conversation-filters>.btn{width:auto}}
@media(max-width:991.98px){.mo-journey-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}.mo-chat-shell{grid-template-columns:minmax(14rem,20rem) 1fr}.mo-chat-details{display:none}.mo-settings-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:575.98px){.mo-journey{margin-inline:var(--mo-space-4)}.mo-journey-hero{align-items:flex-start;flex-direction:column}.mo-journey-metrics{grid-template-columns:1fr 1fr;gap:.6rem}.mo-journey-metrics article{grid-template-columns:1fr;padding:.9rem}.mo-journey-metrics article>i{display:none}.mo-journey-empty{align-items:flex-start;flex-wrap:wrap}.mo-journey-empty .btn{width:100%;margin-left:0}.mo-settings-grid{grid-template-columns:1fr}.mo-settings-card>footer{align-items:stretch;flex-direction:column}.mo-chat-shell{display:block;min-height:30rem}.mo-chat-shell>main,.mo-chat-details{display:none}.mo-chat-shell>aside{min-height:30rem;border:0}.mo-chat-shell.has-selected-conversation>.mo-conversation-list{display:none}.mo-chat-shell.has-selected-conversation>main{display:flex;min-height:30rem}.mo-chat-back{display:inline-grid;place-items:center;width:2rem;height:2rem}}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
}

.mo-client-chat-actions{display:grid;grid-template-columns:1fr 1fr;gap:.4rem;margin-top:.3rem}.mo-client-chat-actions a{padding:.4rem;border:1px solid var(--mo-border);border-radius:.5rem;color:var(--mo-primary-700);font-size:.68rem;text-align:center;text-decoration:none}.mo-client-chat-actions a:hover{background:var(--mo-primary-50)}

.mo-conversation-transfer{display:flex;align-items:center;gap:.55rem;margin-top:.55rem;padding:.6rem;border:1px solid var(--mo-border);border-radius:var(--mo-radius-md);background:#fff}.mo-conversation-transfer label{display:flex;flex:1;align-items:center;gap:.5rem;margin:0;font-size:.72rem}.mo-conversation-transfer select{flex:1;padding:.45rem;border:1px solid var(--mo-border);border-radius:.5rem}.mo-conversation-transfer small{color:var(--mo-text-muted);font-size:.68rem}.mo-conversation-transfer small.is-error{color:#b42318}@media(max-width:575.98px){.mo-conversation-transfer{align-items:stretch;flex-direction:column}.mo-conversation-transfer label{align-items:stretch;flex-direction:column}.mo-conversation-transfer .btn{width:100%}}
.mo-chat-attention{display:flex;align-items:center;gap:.75rem;margin-top:.7rem;padding:.75rem 1rem;border:1px solid #f2b8b5;border-radius:var(--mo-radius-md);background:#fff1f0;color:#8f1d18}.mo-chat-attention>i{font-size:1.1rem}.mo-chat-attention strong,.mo-chat-attention span{display:block}.mo-chat-attention span{margin-top:.15rem;font-size:.72rem;color:#a13a35}

.mo-version-tools{display:flex;align-items:flex-end;gap:.6rem;margin-top:.7rem;padding:.75rem;border:1px solid var(--mo-border);border-radius:var(--mo-radius-md);background:#fff}.mo-version-tools label{display:flex;flex:1;flex-direction:column;gap:.3rem;margin:0;color:var(--mo-text-secondary);font-size:.72rem}.mo-version-tools select{padding:.55rem;border:1px solid var(--mo-border);border-radius:.55rem;background:#fff}@media(max-width:575.98px){.mo-version-tools{align-items:stretch;flex-direction:column}.mo-version-tools .btn{width:100%}}

.mo-media-composer{display:flex;align-items:center;gap:.5rem;margin-top:.55rem;padding:.6rem;border:1px solid var(--mo-border);border-radius:var(--mo-radius-md);background:#fff}.mo-media-composer>input{flex:1;padding:.45rem .6rem;border:1px solid var(--mo-border);border-radius:.5rem}.mo-media-composer small{color:var(--mo-text-muted);font-size:.68rem}.mo-media-composer small.is-error{color:#b42318}@media(max-width:575.98px){.mo-media-composer{align-items:stretch;flex-direction:column}.mo-media-composer .btn{width:100%}}

.mo-permission-card{margin-top:1rem;border:1px solid var(--mo-border);border-radius:var(--mo-radius-lg);background:#fff;box-shadow:var(--mo-shadow-sm);overflow:hidden}.mo-permission-card>header{display:flex;align-items:center;justify-content:space-between;padding:1rem 1.2rem;border-bottom:1px solid var(--mo-border)}.mo-permission-card h2{margin:.15rem 0;font-size:1.05rem}.mo-permission-card p{margin:0;color:var(--mo-text-muted);font-size:.75rem}.mo-permission-card>header>i{color:var(--mo-primary-500);font-size:1.5rem}.mo-permission-grid{display:grid;grid-template-columns:1fr 1fr;gap:1rem;padding:1rem}.mo-permission-grid fieldset{display:grid;gap:.45rem;padding:.8rem;border:1px solid var(--mo-border);border-radius:.7rem}.mo-permission-grid legend{float:none;width:auto;margin:0;padding:0 .25rem;font-size:.78rem;font-weight:700}.mo-permission-grid label{display:flex;align-items:center;gap:.55rem;margin:0;color:var(--mo-text-secondary);font-size:.75rem}.mo-permission-grid input{width:1rem;height:1rem}.mo-permission-card footer{display:flex;justify-content:flex-end;padding:.8rem 1rem;border-top:1px solid var(--mo-border)}@media(max-width:575.98px){.mo-permission-grid{grid-template-columns:1fr}}

@media print {
  body { background: #fff; }
  .mo-no-print { display: none !important; }
  .card, .mo-card { box-shadow: none; }
}
.mo-message-media{display:inline-flex;align-items:center;gap:.4rem;margin:.15rem 0 .45rem;padding:.42rem .7rem;border-radius:.65rem;background:rgba(15,118,110,.1);color:#0f766e;font-size:.78rem;font-weight:700;text-decoration:none}.mo-message-media:before{content:'\f0c6';font-family:'Font Awesome 5 Free';font-weight:900}.mo-message-media:hover{background:rgba(15,118,110,.18);color:#115e59;text-decoration:none}
.mo-load-history{align-self:center;border:0;border-radius:999px;background:#fff;color:#64748b;box-shadow:0 1px 5px rgba(15,23,42,.12);padding:.42rem .85rem;font-size:.75rem;font-weight:700;cursor:pointer}.mo-load-history:disabled{opacity:.65;cursor:wait}