/* Shemex visual refresh. Presentation only; shared by standalone and cloud.
 * Scoped selectors keep checkout geometry, dialogs and print layouts intact.
 * This file is deliberately independent of runtime-generated Tailwind CSS. */
.pricing-retired { margin:0; padding:32px 18px; background:#f3f6fb; color:#172b49; font:16px/1.7 system-ui,sans-serif; }
.pricing-retired main { max-width:680px; margin:40px auto; padding:32px; background:white; border:1px solid #dde5f0; border-radius:18px; }
.pricing-retired a { color:#245ac5; text-underline-offset:4px; }
.pricing-retired a:focus-visible { outline:3px solid #245ac5; outline-offset:4px; }
:root {
  --ui-ink: #172b49;
  --ui-accent: #4f46e5;
  --ui-canvas: #f3f6fb;
  --ui-line: #dde5f0;
  --ui-elevation: 0 5px 20px rgba(25, 45, 80, .055);
}

@media screen {
  .ui-refresh #pageContent {
    background: radial-gradient(ellipse at 100% 0, rgba(79,70,229,.045), transparent 45%), var(--ui-canvas);
  }
  html.dark .ui-refresh #pageContent {
    background: radial-gradient(ellipse at 100% 0, rgba(99,102,241,.07), transparent 45%), #0a1222;
  }
  .ui-refresh #mainContent > header { box-shadow: 0 2px 12px rgba(25,45,80,.035); }
  .ui-refresh #appSidebar { box-shadow: 3px 0 20px rgba(25,45,80,.025); }
  .ui-refresh #appSidebar .sidebar-header { border-bottom-color: var(--ui-line); }
  .ui-refresh #appSidebar .sidebar-link { margin: 2px 10px; border-radius: 10px; }
  .ui-refresh #appSidebar .sidebar-link[aria-current="page"] {
    background: linear-gradient(100deg, #eeedff, #f4f6ff);
    border-right: 0;
    box-shadow: inset 3px 0 var(--ui-accent);
    color: #4338ca;
  }
  html.dark .ui-refresh #appSidebar .sidebar-link[aria-current="page"] {
    background: linear-gradient(100deg, #292650, #19243c);
    box-shadow: inset 3px 0 #a5b4fc;
    color: #c7d2fe;
  }
  .ui-refresh .card { border-color: var(--ui-line); box-shadow: var(--ui-elevation); }
  .ui-refresh .card-header { background-image: linear-gradient(110deg, rgba(79,70,229,.035), transparent); }
  .ui-refresh .table thead th {
    background: #eef2f9 !important;
    color: #53627b !important;
    letter-spacing: .045em;
  }
  html.dark .ui-refresh .card { border-color: #29364d; box-shadow: none; }
  html.dark .ui-refresh .table thead th { background: #172237 !important; color: #b8c7dd !important; }
  .ui-refresh .form-control:focus, .ui-refresh .form-select:focus {
    border-color: #818cf8;
    box-shadow: 0 0 0 3px rgba(99,102,241,.13);
  }
  .ui-refresh .page-header-title { letter-spacing: -.035em; }

  /* Dashboard: orient first, scan numbers second, then take action. */
  .ui-refresh .dashboard-heading {
    padding: 24px 28px;
    border-radius: 20px;
    background: radial-gradient(ellipse at 95% 0, rgba(99,102,241,.42), transparent 60%), linear-gradient(115deg, #142742, #25345b);
    border: 1px solid rgba(148,163,184,.18);
    box-shadow: 0 8px 22px rgba(23,43,73,.12);
    gap: 20px;
  }
  .ui-refresh .dashboard-heading > div:first-child > p:first-child { color: #bac7ff; letter-spacing: .14em; }
  .ui-refresh .dashboard-heading h2 { color: #fff; font-size: clamp(1.45rem, 2.2vw, 1.9rem); letter-spacing: -.035em; }
  .ui-refresh .dashboard-heading > div:first-child > p:last-child { color: #cad5e8; margin-bottom: 0; }
  .ui-refresh .dashboard-heading > div:last-child > a {
    background: rgba(255,255,255,.09);
    border-color: rgba(255,255,255,.2);
    color: #f1f5ff;
    min-height: 36px;
  }
  .ui-refresh .dashboard-heading > div:last-child > a:hover { background: rgba(255,255,255,.17); }
  .ui-refresh .dashboard-kpis > * {
    --metric-color: #059669;
    --metric-tint: rgba(16,185,129,.075);
    border-radius: 16px;
    border-top: 3px solid var(--metric-color) !important;
    padding: 20px !important;
    min-height: 178px;
    background-image: linear-gradient(125deg, var(--metric-tint), transparent 70%);
    box-shadow: var(--ui-elevation);
    min-width: 0;
  }
  .ui-refresh .dashboard-kpis > :nth-child(2) { --metric-color: #e05c69; --metric-tint: rgba(244,63,94,.065); }
  .ui-refresh .dashboard-kpis > :nth-child(3) { --metric-color: #4283dd; --metric-tint: rgba(59,130,246,.075); }
  .ui-refresh .dashboard-kpis > :nth-child(4) { --metric-color: #8b5cf6; --metric-tint: rgba(139,92,246,.075); }
  .ui-refresh .dashboard-kpis .tabular-nums { font-weight: 750; letter-spacing: -.035em; overflow-wrap: anywhere; }
  .ui-refresh .dashboard-kpis > * > .text-xs:last-child { color: #64748b; }
  html.dark .ui-refresh .dashboard-kpis > * > .text-xs:last-child { color: #94a3b8; }
  .ui-refresh .dashboard-shortcut { border-radius: 14px; box-shadow: 0 3px 12px rgba(25,45,80,.035); }
  .ui-refresh .dashboard-shortcut > div { border-radius: 12px; background: #f1f3ff; border-color: #e5e7fc; }
  .ui-refresh .dashboard-shortcut > span { color: #465771; text-align: center; line-height: 1.35; }
  .ui-refresh .dashboard-shortcut:hover { border-color: #a5b4fc; box-shadow: 0 6px 20px rgba(79,70,229,.09); }
  html.dark .ui-refresh .dashboard-shortcut > div { background: #222b46; border-color: #34415d; }
  html.dark .ui-refresh .dashboard-shortcut > span { color: #bac8dc; }
  .ui-refresh #alerts-panel { scroll-margin-top: 20px; }

  /* Authentication: calm surfaces and a consistent accent. */
  .ui-login .rp { background: radial-gradient(ellipse at 90% 10%, #e5eaff, transparent 55%), #f5f7fc; }
  html.dark .ui-login .rp { background: radial-gradient(ellipse at 90% 10%, #1b2443, transparent 65%), #0c1425; }
  .ui-login .login-card { border-top: 3px solid #818cf8; box-shadow: 0 20px 60px rgba(28,44,78,.12); }
  .ui-login .lp { background: radial-gradient(ellipse at 15% 30%, #23345b, transparent 65%), #101d33; }
  .ui-login .auth-input { min-height: 48px; }
  .ui-agent-login {
    background: radial-gradient(ellipse at 10% 0, #e0e7ff, transparent 50%), radial-gradient(ellipse at 100% 100%, #dff3f0, transparent 50%), #f6f8fc;
  }
  .ui-agent-login .agent-login-card { border: 1px solid #dfe5f3; border-top: 3px solid #818cf8; box-shadow: 0 18px 45px rgba(29,49,89,.09); }

  /* Field operations use the same palette, while preserving their mobile nav. */
  .ui-agent { background: #eaf0f8; }
  .ui-agent .agent-shell { border-color: #d9e2ef; box-shadow: 0 18px 60px rgba(25,45,80,.13); }
  .ui-agent #agentMain { background: radial-gradient(ellipse at 100% 0, rgba(99,102,241,.05), transparent 55%), #f3f6fb; }
  .ui-agent .agent-shell header { background: linear-gradient(105deg, #263b68, #4f46e5); }
  .ui-agent .agent-dashboard-heading { padding: 18px; background: #fff; border: 1px solid #dde5f0; border-radius: 16px; box-shadow: var(--ui-elevation); }
  .ui-agent .agent-dashboard-heading h1 { font-size: 1.5rem; color: #192e4d; }
  .ui-agent .agent-dashboard-heading p:last-child { color: #64748b; font-size: .75rem; }
  .ui-agent .agent-stat-grid > div { border-top: 3px solid #6366f1; background-image: linear-gradient(130deg, rgba(99,102,241,.07), transparent 75%); box-shadow: var(--ui-elevation); }
  .ui-agent .agent-stat-grid > div:nth-child(2) { border-top-color: #10b981; background-image: linear-gradient(130deg, rgba(16,185,129,.07), transparent 75%); }
  .ui-agent .agent-stat-grid .text-slate-400 { color: #64748b; }
  .ui-agent .agent-quick-actions a { border-radius: 13px; min-height: 58px; }
  .ui-agent .agent-stock-panel { box-shadow: var(--ui-elevation); }
  .ui-agent .bottom-nav .nav-item.active { background: #eef2ff; border-radius: 12px; }
  .ui-agent .sidebar-link.active { background: #eeedff; box-shadow: inset 3px 0 #6366f1; }

  /* Terminal: color and surfaces only; preserve product/cart sizes. */
  .ui-pos > header { border-top: 3px solid #6366f1; box-shadow: 0 3px 16px rgba(25,45,80,.055); }
  .ui-pos #posMain { background: #f3f6fb; }
  .ui-pos .pos-card { border: 1px solid #dde5f0; background-color: #fff; box-shadow: 0 4px 14px rgba(25,45,80,.055); }
  .ui-pos .pos-card:hover { border-color: #818cf8; }
  .ui-pos .cat-pill.active { background: #4f46e5; border-color: #4f46e5; color: #fff; box-shadow: 0 3px 10px rgba(79,70,229,.16); }
  .ui-pos #posCartPanel { box-shadow: -5px 0 24px rgba(25,45,80,.07); }
  html.dark .ui-pos #posMain { background: #0c1526; }
  html.dark .ui-pos .pos-card { background-color: #17243a; border-color: #2e3d56; box-shadow: none; }
  html.dark .ui-pos .pos-card:hover { border-color: #818cf8; }
}

@media screen and (max-width: 767px) {
  .ui-refresh .dashboard-heading { padding: 19px; border-radius: 16px; }
  .ui-refresh .dashboard-heading > div:last-child { width: 100%; }
  .ui-refresh .dashboard-heading > div:last-child > a { min-height: 40px; }
  .ui-refresh .dashboard-kpis { gap: 12px; }
  .ui-refresh .dashboard-kpis > * { border-radius: 13px; padding: 14px !important; min-height: 160px; }
  .ui-refresh #mobileMenuButton { min-width: 44px; min-height: 44px; }
  .ui-agent .agent-shell { height: 100dvh; }
  .ui-agent .agent-dashboard-heading { flex-wrap: wrap; }
  .ui-agent .agent-dashboard-heading > a { min-height: 44px; }
  .ui-agent .agent-stat-grid .tabular-nums { overflow-wrap: anywhere; }
  .ui-login .auth-input { font-size: 16px; }
  .ui-agent-login select { font-size: 16px; }
}

@media screen and (max-width: 359px) {
  .ui-refresh .dashboard-kpis { grid-template-columns: minmax(0, 1fr); }
  .ui-agent .agent-stat-grid { grid-template-columns: minmax(0, 1fr); }
}

@media (prefers-reduced-motion: reduce) {
  .ui-agent *, .ui-agent-login *, .ui-login *, .ui-pos * { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}

@media (forced-colors: active) {
  .ui-refresh .dashboard-heading, .ui-refresh .dashboard-kpis > *, .ui-agent .agent-stat-grid > div { border: 1px solid CanvasText; }
}