/* Gen9 Portal — Vendify-style Dashboard Design System (app-like, light, rounded) */

:root {
  --ke-bg: #f2f4f7;
  --ke-surface: #ffffff;
  --ke-surface-2: #f7f8fa;
  --ke-border: #eceff3;
  --ke-border-strong: #dde2ea;
  --ke-navy: #0c1a3a;
  --ke-navy-mid: #1e3a5f;
  --ke-ink: #101828;
  --ke-text: #0c1a3a;
  --ke-text-secondary: #3f4c63;
  --ke-text-muted: #6b7686;
  --ke-orange: #ff6b35;
  --ke-orange-dark: #e85a24;
  --ke-orange-soft: #fff1e8;
  --ke-orange-border: #ffd3ba;
  --ke-navy-soft: #e9edf5;
  --ke-teal: #14b8a6;
  --ke-teal-soft: #e7f7f0;
  --ke-blue: #1e3a5f;
  --ke-blue-soft: #eef2f8;
  /* Vendify tint palette — soft pastel card fills */
  --ke-tint-cream: #fff1e8;
  --ke-tint-mint: #e9f6ec;
  --ke-tint-sky: #e9f2fb;
  --ke-tint-lav: #eeedfb;
  --ke-tint-sun: #fdf3d8;
  --ke-shadow: 0 1px 2px rgba(16, 24, 40, 0.03), 0 6px 20px rgba(16, 24, 40, 0.04);
  --ke-shadow-lg: 0 4px 10px rgba(16, 24, 40, 0.04), 0 18px 44px rgba(16, 24, 40, 0.08);
  --ke-shadow-card: 0 1px 3px rgba(16, 24, 40, 0.03), 0 10px 30px rgba(16, 24, 40, 0.05);
  --ke-radius: 18px;
  --ke-radius-lg: 22px;
  --ke-radius-xl: 26px;
  --ke-sidebar-w: 288px;
  --ke-font-display: 'Gabarito', 'Figtree', sans-serif;
  --ke-font-body: 'Figtree', sans-serif;
  --ke-tabbar-h: 4.25rem;
}

/* ─── Global typography ─── */
body,
.ui-app,
.legacy-app-shell {
  font-family: var(--ke-font-body);
}

h1, h2, h3, h4,
.ui-page-header__title,
.ui-section-head__title,
.ui-widget__title,
.ui-widget__value,
.ui-kpi__value,
.ui-status-cell__value,
[data-api-strip-new],
[data-api-strip-processing],
[data-api-strip-shipping],
.ui-sidebar__logo-text {
  font-family: var(--ke-font-display);
}

/* ─── App shell ─── */
.ui-app,
.legacy-app-shell {
  background: var(--ke-bg) !important;
  color: var(--ke-text) !important;
  min-height: 0;
  height: 100vh;
  height: 100dvh;
  max-height: 100dvh;
  overflow: hidden;
}

#app {
  height: 100dvh;
  max-height: 100dvh;
  min-height: 0;
  overflow: hidden;
}

#app > .legacy-view-root,
#app > .ui-app,
#app > .legacy-app-shell {
  flex: 1 1 auto;
  min-height: 0;
  height: 100%;
  max-height: 100%;
}

.ui-main,
.legacy-view-root > main {
  background: var(--ke-bg);
  color: var(--ke-text);
  flex: 1 1 auto;
  min-height: 0;
  min-width: 0;
  overflow-y: auto;
  overflow-x: hidden;
  overscroll-behavior-y: contain;
  -webkit-overflow-scrolling: touch;
  padding: 0.625rem 0.75rem;
  gap: 0.625rem !important;
}

/* Flex column main must not shrink children — otherwise overflow-hidden sections clip content without page scroll */
.ui-main > *,
.legacy-view-root > main > * {
  flex-shrink: 0;
}

@media (min-width: 1024px) {
  .ui-main,
  .legacy-view-root > main {
    padding: 0.75rem 1rem;
  }
}

/* Beat Tailwind gap-5 on shell main */
.ui-main.gap-5,
.legacy-view-root > main.gap-5,
.legacy-view-root > main.gap-6 {
  gap: 0.625rem !important;
}

/* Dashboard block spacing — half default Tailwind gaps/padding */
.legacy-view-root main .gap-5,
.legacy-view-root main .flex.flex-col.gap-5 {
  gap: 0.625rem !important;
}

.legacy-view-root main .gap-6,
.legacy-view-root main .flex.flex-col.gap-6 {
  gap: 0.75rem !important;
}

.legacy-view-root main .glass-panel.p-5,
.legacy-view-root main .ui-widget.p-5 {
  padding: 0.625rem !important;
}

.legacy-view-root main .glass-panel.p-6 {
  padding: 0.75rem !important;
}

@media (min-width: 1280px) {
  .legacy-view-root main .glass-panel.xl\:p-6,
  .legacy-view-root main .ui-widget.xl\:p-6 {
    padding: 0.75rem !important;
  }
}

/* ─── Sidebar ─── */
.ui-sidebar,
.app-sidebar,
#sidebar {
  width: var(--ke-sidebar-w) !important;
  min-width: var(--ke-sidebar-w) !important;
  max-width: var(--ke-sidebar-w) !important;
  background: var(--ke-surface) !important;
  border-right: 1px solid var(--ke-border) !important;
  box-shadow: 4px 0 32px rgba(15, 23, 42, 0.04);
  display: flex;
  flex-direction: column;
  padding: 1.5rem 0;
  flex-shrink: 0;
  z-index: 40;
  overflow-x: hidden;
}

.ui-sidebar__nav a,
.ui-sidebar__nav button,
#sidebar nav a,
#sidebar nav button {
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease, opacity 0.2s ease;
}

.ui-sidebar__logo {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.2rem;
  padding: 0 1.5rem;
  margin-bottom: 1.5rem;
}

.ui-sidebar__logo-row {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  width: 100%;
}

.ui-sidebar__logo-icon {
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 12px;
  background: linear-gradient(135deg, var(--ke-orange), #ff8f65);
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  box-shadow: 0 8px 20px rgba(255, 107, 53, 0.35);
  flex-shrink: 0;
}

.ui-sidebar__logo-text {
  font-size: 1.125rem;
  font-weight: 800;
  color: var(--ke-text);
  letter-spacing: -0.02em;
  white-space: nowrap;
}

.ui-sidebar__version {
  display: block;
  margin-left: 3.25rem;
  font-size: 0.625rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  line-height: 1;
  color: #94a3b8;
  user-select: none;
}

.ui-sidebar__nav {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 0.375rem;
  padding: 0 0.75rem;
  overflow-x: hidden;
  overflow-y: auto;
  scroll-behavior: auto;
}

#sidebar nav {
  overflow-x: hidden;
  overflow-y: auto;
  gap: 0.375rem;
  scroll-behavior: auto;
}

.ui-sidebar__footer {
  margin-top: auto;
  padding: 1rem 0.75rem 0;
  border-top: 1px solid var(--ke-border);
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}

.sidebar-nav-link,
.ui-nav-link {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.65rem 1rem;
  min-height: 2.75rem;
  border-radius: 999px;
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--ke-text-secondary) !important;
  text-decoration: none;
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
  border: 1px solid transparent;
  background: transparent;
  cursor: pointer;
  width: 100%;
  text-align: left;
  box-sizing: border-box;
}

a.menu-item--included.sidebar-nav-link,
a.menu-item--upsell.sidebar-nav-link {
  min-height: 3.125rem;
}

[data-nav-group="otonom-ajanlar"] {
  min-height: 2.625rem;
  box-sizing: border-box;
  width: calc(100% - 0.5rem);
}

[data-nav-group="otonom-ajanlar"].otonom-nav-group--active {
  background: var(--ke-ink) !important;
  border-color: rgba(16, 24, 40, 0.4) !important;
  color: #ffffff !important;
  box-shadow: 0 10px 24px rgba(16, 24, 40, 0.28);
}

[data-nav-group="otonom-ajanlar"].otonom-nav-group--active:hover {
  background: #1a2740 !important;
  color: #ffffff !important;
}

[data-nav-group="otonom-ajanlar"].otonom-nav-group--active span,
[data-nav-group="otonom-ajanlar"].otonom-nav-group--active i {
  color: #ffffff !important;
}

[data-nav-group="otonom-ajanlar"].otonom-nav-group--idle {
  color: var(--ke-navy) !important;
}

[data-nav-group="otonom-ajanlar"].otonom-nav-group--idle:hover {
  background: #f1f5f9 !important;
  color: var(--ke-navy) !important;
}

[data-nav-group="otonom-ajanlar"].otonom-nav-group--idle span,
[data-nav-group="otonom-ajanlar"].otonom-nav-group--idle i {
  color: var(--ke-navy) !important;
}

[data-nav-group="cari-yonetimi"] {
  min-height: 2.625rem;
  box-sizing: border-box;
  width: calc(100% - 0.5rem);
}

[data-nav-group="cari-yonetimi"].cari-nav-group--active {
  background: var(--ke-navy-mid) !important;
  border-color: rgba(30, 58, 95, 0.45) !important;
  color: #ffffff !important;
  box-shadow: 0 10px 24px rgba(12, 26, 58, 0.28);
}

[data-nav-group="cari-yonetimi"].cari-nav-group--active:hover {
  background: var(--ke-navy) !important;
  color: #ffffff !important;
}

[data-nav-group="cari-yonetimi"].cari-nav-group--active span,
[data-nav-group="cari-yonetimi"].cari-nav-group--active i {
  color: #ffffff !important;
}

[data-nav-group="cari-yonetimi"].cari-nav-group--idle {
  color: var(--ke-navy) !important;
}

[data-nav-group="cari-yonetimi"].cari-nav-group--idle:hover {
  background: var(--ke-navy-soft) !important;
  color: var(--ke-navy-mid) !important;
}

[data-nav-group="cari-yonetimi"].cari-nav-group--idle span,
[data-nav-group="cari-yonetimi"].cari-nav-group--idle i {
  color: var(--ke-navy) !important;
}

[data-nav-group="cari-yonetimi"].menu-item--upsell,
[data-nav-group="cari-yonetimi"].menu-item--included {
  min-height: 2.625rem;
}

/* Group header product line: Cari Yönetimi = Pro, Otonom Ajanlar = Plus */
.menu-group-brand {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 2.5rem;
  padding: 0.1rem 0.45rem;
  border-radius: 0.45rem;
  font-size: 0.58rem;
  font-weight: 800;
  letter-spacing: 0.14em;
  line-height: 1.2;
}

.menu-group-brand--cari {
  color: #1e3a5f;
  background: rgba(30, 58, 95, 0.12);
  border: 1px solid rgba(61, 90, 128, 0.35);
}

.menu-group-brand--otonom {
  color: #c2410c;
  background: rgba(255, 107, 53, 0.12);
  border: 1px solid rgba(251, 146, 60, 0.35);
}

[data-nav-group="cari-yonetimi"].cari-nav-group--active .menu-group-brand--cari {
  color: #fff;
  background: rgba(255, 255, 255, 0.16);
  border-color: rgba(255, 255, 255, 0.35);
}

[data-nav-group="otonom-ajanlar"].otonom-nav-group--active .menu-group-brand--otonom {
  color: #fff;
  background: rgba(255, 255, 255, 0.16);
  border-color: rgba(255, 255, 255, 0.35);
}

.sidebar-nav-link i,
.ui-nav-link i {
  font-size: 1.35rem;
  color: #64748b;
  flex-shrink: 0;
}

.sidebar-nav-link:hover,
.ui-nav-link:hover,
#sidebar a.sidebar-nav-link:not(.sidebar-nav-link-active):hover,
#sidebar a.ui-nav-link:not(.sidebar-nav-link-active):hover,
.ui-sidebar a:not(.sidebar-nav-link-active):not(.ui-nav-link--active):hover {
  background: #f1f5f9 !important;
  background-color: #f1f5f9 !important;
  color: var(--ke-navy) !important;
}

.sidebar-nav-link:hover i,
.ui-nav-link:hover i,
#sidebar a:not(.sidebar-nav-link-active):hover i {
  color: var(--ke-navy-mid) !important;
}

.sidebar-nav-link-active,
.ui-nav-link--active,
#sidebar a.sidebar-nav-link-active,
#sidebar a.ui-nav-link--active,
.ui-sidebar a.sidebar-nav-link-active {
  background: var(--ke-ink) !important;
  background-color: var(--ke-ink) !important;
  color: #ffffff !important;
  box-shadow: 0 10px 24px rgba(16, 24, 40, 0.28);
}

.sidebar-nav-link-active:hover,
.ui-nav-link--active:hover,
#sidebar a.sidebar-nav-link-active:hover {
  background: #1a2740 !important;
  background-color: #1a2740 !important;
  color: #ffffff !important;
}

.sidebar-nav-link-active i,
.sidebar-nav-link-active span,
.ui-nav-link--active i,
.ui-nav-link--active span,
#sidebar a.sidebar-nav-link-active i,
#sidebar a.sidebar-nav-link-active span {
  color: #ffffff !important;
}

/* Kill Tailwind hover:bg-white on sidebar */
#sidebar a[class*="hover:bg-white"],
.ui-sidebar a[class*="hover:bg-white"] {
  --tw-bg-opacity: 0 !important;
}
#sidebar a:hover {
  --tw-bg-opacity: 1 !important;
}

/* Otonom Ajanlar submenu policy (hidden / upsell) */
.menu-item--upsell,
button.menu-item--upsell,
a.menu-item--upsell,
[data-nav-group="otonom-ajanlar"].menu-item--upsell {
  opacity: 0.72 !important;
  cursor: pointer !important;
  filter: grayscale(0.08);
}

.menu-item--upsell:hover,
button.menu-item--upsell:hover,
a.menu-item--upsell:hover {
  opacity: 0.9 !important;
}

a.menu-item--upsell.sidebar-nav-link,
a.menu-item--upsell.ui-nav-link {
  gap: 0.35rem !important;
  padding-right: 0.45rem !important;
  overflow: hidden;
  max-width: 100%;
}

a.menu-item--upsell > span:not(.menu-upsell-lock) {
  min-width: 0;
  flex: 1 1 auto;
  overflow: hidden;
}

[data-nav-group="otonom-ajanlar"].menu-item--upsell {
  overflow: hidden;
  max-width: 100%;
}

.menu-upsell-lock {
  margin-left: auto;
  flex: 0 0 3.35rem;
  width: 3.35rem;
  min-width: 3.35rem;
  max-width: 3.35rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 3px;
  padding: 2px 4px 2px 3px;
  border-radius: 999px;
  background: rgba(255, 107, 53, 0.14);
  border: 1px solid rgba(255, 107, 53, 0.42);
  box-shadow: 0 0 0 0 rgba(255, 107, 53, 0.35);
  box-sizing: border-box;
}

.menu-upsell-plus {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 15px;
  height: 15px;
  border-radius: 50%;
  background: var(--ke-orange);
  color: #fff;
  font-size: 11px;
  font-weight: 800;
  line-height: 1;
  animation: menu-plus-pulse 1.45s ease-in-out infinite;
}

@keyframes menu-plus-pulse {
  0%,
  100% {
    transform: scale(1);
    opacity: 1;
    box-shadow: 0 0 0 0 rgba(255, 107, 53, 0.45);
  }
  50% {
    transform: scale(1.14);
    opacity: 0.92;
    box-shadow: 0 0 7px 2px rgba(255, 107, 53, 0.38);
  }
}

.menu-upsell-badge {
  display: inline-block;
  font-size: 8px;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--ke-orange);
  max-width: 48px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  line-height: 1.2;
}

.menu-upsell-badge--card {
  margin-left: 0;
  font-size: 0.68rem;
  max-width: none;
}

.menu-upsell-lock--included {
  flex: 0 0 3.35rem;
  width: 3.35rem;
  min-width: 3.35rem;
  max-width: 3.35rem;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 4px 5px 5px;
  gap: 2px;
  border-color: rgba(16, 185, 129, 0.38);
  background: rgba(16, 185, 129, 0.12);
  box-shadow: none;
  box-sizing: border-box;
}

.menu-upsell-stack {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
  line-height: 1;
}

.menu-upsell-top {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  white-space: nowrap;
}

.menu-upsell-badge--included {
  max-width: none;
  font-size: 8px;
  letter-spacing: 0.06em;
}

.menu-upsell-plus--included {
  animation: none;
  background: #10b981;
  box-shadow: none;
  flex-shrink: 0;
}

.menu-upsell-active {
  display: block;
  font-size: 7px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #059669;
  line-height: 1;
  white-space: nowrap;
  text-align: center;
}

/* Cari Yönetimi — navy Plus badge (not green) */
.menu-upsell-lock--cari,
a.menu-item--cari-plus .menu-upsell-lock--included {
  border-color: rgba(30, 58, 95, 0.38) !important;
  background: rgba(233, 237, 245, 0.95) !important;
  box-shadow: none;
}

.menu-upsell-plus--cari,
a.menu-item--cari-plus .menu-upsell-plus--included {
  background: var(--ke-navy-mid) !important;
  color: #ffffff !important;
  box-shadow: none;
  animation: none;
}

.menu-upsell-lock--cari .menu-upsell-badge,
a.menu-item--cari-plus .menu-upsell-badge--included {
  color: var(--ke-navy-mid) !important;
}

.menu-upsell-active--cari,
a.menu-item--cari-plus .menu-upsell-active {
  color: var(--ke-navy-mid) !important;
}

a.menu-item--cari-plus.menu-item--upsell .menu-upsell-lock--cari {
  background: rgba(233, 237, 245, 0.95) !important;
  border-color: rgba(30, 58, 95, 0.35) !important;
}

a.menu-item--cari-plus.menu-item--upsell .menu-upsell-plus--cari {
  background: var(--ke-navy-mid) !important;
  color: #ffffff !important;
}

/* Sidebar parent colors must not bleed into cari plus circle */
a.menu-item--cari-plus .menu-upsell-plus--cari,
a.menu-item--cari-plus .menu-upsell-plus--included {
  -webkit-text-fill-color: #ffffff !important;
}

a.menu-item--included.menu-item--cari-plus.sidebar-nav-link,
a.menu-item--included.menu-item--cari-plus.ui-nav-link,
a.menu-item--upsell.menu-item--cari-plus.sidebar-nav-link,
a.menu-item--upsell.menu-item--cari-plus.ui-nav-link {
  display: flex !important;
  align-items: center !important;
  width: 100%;
  padding-right: 0.5rem !important;
  gap: 0.4rem !important;
}

a.menu-item--cari-plus.menu-item--included .ui-nav-chevron,
a.menu-item--cari-plus.menu-item--upsell .ui-nav-chevron {
  display: none !important;
}

a.menu-item--included.sidebar-nav-link,
a.menu-item--included.ui-nav-link,
a.menu-item--upsell.sidebar-nav-link,
a.menu-item--upsell.ui-nav-link,
[data-nav-group="otonom-ajanlar"].menu-item--included,
[data-nav-group="otonom-ajanlar"].menu-item--upsell {
  display: flex !important;
  align-items: center !important;
  width: 100%;
  padding-right: 0.5rem !important;
  gap: 0.4rem !important;
}

a.menu-item--included.sidebar-nav-link > span:not(.menu-upsell-lock),
a.menu-item--included.ui-nav-link > span:not(.menu-upsell-lock),
a.menu-item--upsell.sidebar-nav-link > span:not(.menu-upsell-lock),
a.menu-item--upsell.ui-nav-link > span:not(.menu-upsell-lock) {
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
}

a.menu-item--included.sidebar-nav-link:has(.menu-upsell-lock) .ui-nav-chevron,
a.menu-item--included.ui-nav-link:has(.menu-upsell-lock) .ui-nav-chevron,
a.menu-item--upsell.sidebar-nav-link:has(.menu-upsell-lock) .ui-nav-chevron,
a.menu-item--upsell.ui-nav-link:has(.menu-upsell-lock) .ui-nav-chevron {
  display: none !important;
}

[data-nav-group="otonom-ajanlar"] {
  display: flex !important;
  width: 100%;
}

[data-nav-group="otonom-ajanlar"] > span.flex {
  display: flex !important;
  align-items: center !important;
  width: 100%;
  min-width: 0;
  gap: 0.4rem;
}

[data-nav-group="otonom-ajanlar"] > span.flex > span:first-child {
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

a.menu-item--included.sidebar-nav-link,
a.menu-item--included.ui-nav-link,
[data-nav-group="otonom-ajanlar"].menu-item--included {
  padding-right: 0.45rem !important;
  gap: 0.5rem !important;
}

.menu-item--hidden {
  display: none !important;
}

.menu-agent-card--upsell {
  opacity: 0.85;
  cursor: pointer;
}

.menu-agent-card--upsell:hover {
  opacity: 0.95;
}

/* In-app Plus upsell modal */
body.plus-upsell-modal-open {
  overflow: hidden;
}

.plus-upsell-modal {
  position: fixed;
  inset: 0;
  z-index: 100000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1rem;
}

.plus-upsell-modal.hidden {
  display: none !important;
}

.plus-upsell-modal__backdrop {
  position: absolute;
  inset: 0;
  border: 0;
  background: rgba(12, 26, 58, 0.55);
  backdrop-filter: blur(4px);
  cursor: pointer;
}

.plus-upsell-modal__panel {
  position: relative;
  z-index: 1;
  width: min(100%, 520px);
  max-height: min(90vh, 720px);
  overflow-y: auto;
  background: #ffffff;
  border: 1px solid #e8edf5;
  border-radius: 24px;
  box-shadow: 0 24px 64px rgba(12, 26, 58, 0.18);
  padding: 1.5rem;
}

.plus-upsell-modal__close {
  position: absolute;
  top: 0.85rem;
  right: 0.85rem;
  width: 2.25rem;
  height: 2.25rem;
  border: 0;
  border-radius: 999px;
  background: #f8fafc;
  color: #64748b;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}

.plus-upsell-modal__badge {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  border-radius: 999px;
  border: 1px solid rgba(255, 107, 53, 0.35);
  background: #fff4ed;
  color: #ea580c;
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  padding: 0.35rem 0.7rem;
  margin-bottom: 0.85rem;
}

.plus-upsell-modal__title {
  margin: 0 2rem 0.75rem 0;
  font-size: 1.45rem;
  line-height: 1.25;
  font-weight: 800;
  color: #0c1a3a;
}

.plus-upsell-modal__lead {
  margin: 0 0 1rem;
  color: #475569;
  font-size: 0.92rem;
  line-height: 1.55;
}

.plus-upsell-modal__features {
  list-style: none;
  margin: 0 0 1rem;
  padding: 0;
  display: grid;
  gap: 0.55rem;
}

.plus-upsell-modal__features li {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  padding: 0.65rem 0.75rem;
  border-radius: 14px;
  background: #f8fafc;
  border: 1px solid #e8edf5;
  color: #1e293b;
  font-size: 0.86rem;
  font-weight: 600;
}

.plus-upsell-modal__features i {
  color: #ff6b35;
  font-size: 1.1rem;
}

.plus-upsell-modal__price {
  border-radius: 16px;
  border: 1px dashed rgba(255, 107, 53, 0.45);
  background: #fff7f2;
  padding: 0.9rem 1rem;
  margin-bottom: 1rem;
}

.plus-upsell-modal__price-label {
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: #ea580c;
  margin-bottom: 0.2rem;
}

.plus-upsell-modal__price-value {
  font-size: 1.1rem;
  font-weight: 800;
  color: #0c1a3a;
  margin-bottom: 0.25rem;
}

.plus-upsell-modal__price p {
  margin: 0;
  font-size: 0.8rem;
  color: #64748b;
}

.plus-upsell-modal__actions {
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
}

.plus-upsell-modal__cta-primary,
.plus-upsell-modal__cta-secondary {
  width: 100%;
  border-radius: 14px;
  padding: 0.8rem 1rem;
  font-size: 0.9rem;
  font-weight: 700;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
}

.plus-upsell-modal__cta-primary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.45rem;
  background: #ff6b35;
  color: #fff;
  border: 0;
}

.plus-upsell-modal__cta-secondary {
  background: #fff;
  color: #334155;
  border: 1px solid #e2e8f0;
}

@media (min-width: 640px) {
  .plus-upsell-modal__panel {
    padding: 1.75rem;
  }
}

/* KVKK aydınlatma metni modal */
body.privacy-aydinlatma-modal-open {
  overflow: hidden;
}

.privacy-aydinlatma-modal {
  position: fixed;
  inset: 0;
  z-index: 100001;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1rem;
}

.privacy-aydinlatma-modal.hidden {
  display: none !important;
}

.privacy-aydinlatma-modal__backdrop {
  position: absolute;
  inset: 0;
  border: 0;
  background: rgba(12, 26, 58, 0.55);
  backdrop-filter: blur(4px);
  cursor: pointer;
}

.privacy-aydinlatma-modal__panel {
  position: relative;
  z-index: 1;
  width: min(100%, 560px);
  max-height: min(90vh, 720px);
  overflow-y: auto;
  background: #ffffff;
  border: 1px solid #e8edf5;
  border-radius: 24px;
  box-shadow: 0 24px 64px rgba(12, 26, 58, 0.18);
  padding: 1.5rem;
}

.privacy-aydinlatma-modal__close {
  position: absolute;
  top: 0.85rem;
  right: 0.85rem;
  width: 2.25rem;
  height: 2.25rem;
  border: 0;
  border-radius: 999px;
  background: #f1f5f9;
  color: #475569;
  cursor: pointer;
}

.privacy-aydinlatma-modal__title {
  font-size: 1.25rem;
  font-weight: 800;
  color: #0c1a3a;
  margin-bottom: 1rem;
  padding-right: 2rem;
}

.privacy-aydinlatma-modal__cta {
  margin-top: 1rem;
  width: 100%;
  border: 0;
  border-radius: 12px;
  background: #0c1a3a;
  color: #fff;
  font-weight: 600;
  padding: 0.75rem 1rem;
  cursor: pointer;
}

@media (max-width: 640px) {
  .privacy-aydinlatma-modal__panel {
    padding: 1.1rem;
    border-radius: 18px;
  }
}

.ui-sidebar__logout {
  color: var(--ke-text-muted) !important;
}

.ui-sidebar__logout:hover {
  background: #fef2f2 !important;
  color: #dc2626 !important;
}

/* ─── Page header ─── */
.ui-page-header {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  margin-bottom: 1rem;
  width: 100%;
}

.ui-page-header__intro {
  min-width: 0;
  flex: 0 0 auto;
}

.ui-page-header__actions {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 0.5rem;
  width: 100%;
  min-width: 0;
}

.ui-page-header__extras {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 0.5rem;
}

/* Dashboard toolbar — önbellek + tarih filtresi header flex çakışmasından ayrı tutulur */
.ui-dashboard-toolbar {
  width: 100%;
  margin-bottom: 0.75rem;
}

/* Dashboard only: welcome + compact status strip row */
.ui-page-header--vendify.ui-page-header--with-strip {
  flex-direction: column !important;
  flex-wrap: nowrap !important;
  align-items: stretch;
  gap: 0.5rem;
  margin-bottom: 0.5rem;
}

.ui-page-header--vendify.ui-page-header--with-strip .ui-page-header__welcome-row {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.75rem 1rem;
  width: 100%;
  min-width: 0;
}

.ui-page-header--vendify.ui-page-header--with-strip .ui-page-header__actions {
  width: 100%;
  flex: 1 1 100%;
}

.ui-page-header__status-slot {
  flex: 0 1 auto;
  min-width: 0;
  max-width: min(34rem, 48vw);
}

.ui-status-strip--header {
  width: 100%;
  padding: 0.15rem 0.19rem 0.19rem !important;
  gap: 0.19rem !important;
}

.ui-status-strip--header .ui-status-strip__top {
  gap: 0.26rem;
}

.ui-status-strip--header .ui-status-strip__label {
  font-size: 0.5625rem;
  letter-spacing: 0.06em;
}

.ui-status-strip--header .ui-status-strip__label > span:last-child {
  max-width: 7rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.ui-status-strip--header .ui-status-strip__meta {
  gap: 0.2rem;
  flex-wrap: nowrap;
}

.ui-status-strip--header .ui-status-strip__badge {
  font-size: 0.5625rem;
  padding: 0.1rem 0.35rem;
}

.ui-status-strip--header .ui-status-strip__sync--inline {
  font-size: 0.5625rem;
  padding: 0.12rem 0.35rem;
}

.ui-status-strip--header .ui-status-strip__scroll {
  gap: 0.28rem !important;
}

/* Compact cells: keep ~25% shorter than 3.7rem, shrink digits so they fit */
.ui-status-strip--header .ui-status-cell {
  min-height: 0 !important;
  height: 2.775rem;
  padding: 0.12rem 0.2rem 0.1rem !important;
  border-radius: 10px !important;
  gap: 0.06rem;
  overflow: hidden;
  justify-content: center;
}

.ui-status-strip--header .ui-status-cell__icon {
  width: 0.78rem !important;
  height: 0.78rem !important;
}

.ui-status-strip--header .ui-status-cell__icon i {
  font-size: 0.46rem !important;
}

.ui-status-strip--header .ui-status-cell__label {
  font-size: 0.42rem !important;
  letter-spacing: 0.04em !important;
  line-height: 1.05;
  max-height: 1.1em;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.ui-status-strip--header .ui-status-cell__value,
.ui-status-strip--header [data-api-strip-new],
.ui-status-strip--header [data-api-strip-processing],
.ui-status-strip--header [data-api-strip-shipping] {
  font-size: 0.78rem !important;
  font-weight: 800 !important;
  line-height: 1 !important;
  margin-top: 0 !important;
}

@media (max-width: 1023px) {
  .ui-page-header--vendify.ui-page-header--with-strip .ui-page-header__welcome-row {
    flex-direction: column;
    align-items: stretch;
  }

  .ui-page-header__status-slot {
    max-width: 100%;
  }
}

.ui-header-toolbar {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 0.5rem;
  width: 100%;
  min-width: 0;
}

.ui-data-status-bar {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  gap: 0.75rem;
  width: 100%;
  min-height: 2.5rem;
  padding: 0.45rem 0.85rem;
  border-radius: 12px;
  border: 1px solid rgba(16, 185, 129, 0.35);
  background: rgba(16, 185, 129, 0.1);
  box-sizing: border-box;
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
}

.ui-data-status-bar--loading {
  border-color: rgba(148, 163, 184, 0.35);
  background: rgba(248, 250, 252, 0.95);
}

.ui-data-status-bar--fresh {
  border-color: rgba(16, 185, 129, 0.35);
  background: rgba(16, 185, 129, 0.1);
}

.ui-data-status-bar--cache {
  border-color: rgba(245, 158, 11, 0.35);
  background: rgba(255, 251, 235, 0.95);
}

.ui-data-status-bar--error {
  border-color: rgba(239, 68, 68, 0.35);
  background: rgba(254, 242, 242, 0.95);
}

.ui-data-status-bar .ui-data-source-banner--hidden {
  display: none !important;
  width: 0 !important;
  min-width: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  overflow: hidden !important;
}

/* Keep "Sistem Durumu" banner beside checklist when report is ready */
.ui-data-status-bar:has(.ui-dashboard-load-report:not(.is-empty)) .ui-dashboard-load-report {
  flex: 1 1 auto;
  width: auto;
  min-width: 0;
}

@keyframes ui-sistem-durumu-blink {
  0%,
  100% {
    opacity: 1;
    transform: scale(1);
  }
  50% {
    opacity: 0.35;
    transform: scale(0.92);
  }
}

.ui-sistem-durumu-success {
  color: #059669 !important;
  animation: ui-sistem-durumu-blink 1.15s ease-in-out infinite;
}

.ui-data-status-bar .ui-data-source-banner {
  flex: 0 0 auto;
  width: auto !important;
  max-width: none;
  min-width: 0;
  border: none !important;
  background: transparent !important;
  padding: 0 !important;
  margin: 0;
  min-height: 0;
  white-space: nowrap;
  overflow: visible;
  text-overflow: clip;
}

.ui-data-status-bar .ui-dashboard-load-report {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  border: none !important;
  background: transparent !important;
  padding: 0 0 0 0.75rem !important;
  margin: 0;
  min-height: 0;
  border-left: 1px solid rgba(16, 185, 129, 0.28) !important;
}

.ui-data-status-bar--loading .ui-dashboard-load-report,
.ui-data-status-bar--cache .ui-dashboard-load-report {
  border-left-color: rgba(148, 163, 184, 0.35) !important;
}

.ui-data-status-bar--error .ui-dashboard-load-report {
  border-left-color: rgba(239, 68, 68, 0.28) !important;
}

.ui-data-status-bar .ui-dashboard-load-report.is-empty {
  display: none;
  border-left: none !important;
  padding: 0 !important;
}

.ui-data-status-bar .ui-data-source-banner__meta {
  display: inline;
  margin-top: 0;
  margin-left: 0.2rem;
  font-size: inherit;
  opacity: 0.9;
  white-space: nowrap;
}

/* Sticky integrity warning — survives Sistem Durumu / checklist repaints */
.ui-data-integrity-alert {
  display: inline-flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.35rem 0.5rem;
  max-width: min(42rem, 100%);
  padding: 0.2rem 0.55rem;
  margin: 0 0 0 0.5rem;
  border-radius: 0.55rem;
  font-size: 0.72rem;
  font-weight: 700;
  line-height: 1.25;
}

.ui-data-integrity-alert.is-empty {
  display: none;
  margin: 0;
  padding: 0;
}

.ui-data-integrity-alert--error {
  border: 1px solid rgba(239, 68, 68, 0.45);
  background: rgba(254, 226, 226, 0.95);
  color: #991b1b;
}

.ui-data-integrity-alert--pending {
  border: 1px solid rgba(14, 165, 233, 0.4);
  background: rgba(224, 242, 254, 0.95);
  color: #0c4a6e;
}

.ui-data-integrity-alert__msg {
  white-space: normal;
}

.ui-data-integrity-alert__detail {
  font-weight: 600;
  opacity: 0.9;
  white-space: normal;
}

.ui-data-integrity-alert__detail::before {
  content: '·';
  margin-right: 0.35rem;
  opacity: 0.7;
}

.ui-data-integrity-alert__retry {
  margin-left: 0.15rem;
  padding: 0.15rem 0.55rem;
  border-radius: 0.4rem;
  border: 1px solid rgba(185, 28, 28, 0.45);
  background: #fff;
  color: #991b1b;
  font-size: 0.68rem;
  font-weight: 800;
  cursor: pointer;
  white-space: nowrap;
}

.ui-data-integrity-alert__retry:hover {
  background: #fee2e2;
}

@media (max-width: 900px) {
  .ui-data-integrity-alert {
    margin-left: 0;
    margin-top: 0.35rem;
    width: 100%;
    max-width: none;
  }
}

.ui-dashboard-load-report {
  display: flex;
  align-items: center;
  min-height: 2.375rem;
  padding: 0.45rem 0.75rem;
  border-radius: 12px;
  border: 1px solid var(--ke-border, #e2e8f0);
  background: #fff;
  box-sizing: border-box;
}

.ui-dashboard-load-report__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem 1rem;
  width: 100%;
  min-width: 0;
}

.ui-dashboard-load-report__list {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  gap: 0.65rem;
  margin: 0;
  padding: 0;
  list-style: none;
  min-width: 0;
  flex: 1 1 auto;
  overflow-x: auto;
  scrollbar-width: none;
}

.ui-dashboard-load-report__list::-webkit-scrollbar {
  display: none;
}

.ui-dashboard-load-report__archive {
  flex: 0 0 auto;
  margin-left: auto;
  padding-left: 0.85rem;
  border-left: 1px solid rgba(16, 185, 129, 0.28);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.01em;
  color: #065f46;
  white-space: nowrap;
}

.ui-data-status-bar--cache .ui-dashboard-load-report__archive {
  border-left-color: rgba(148, 163, 184, 0.35);
  color: #475569;
}

.ui-data-status-bar--error .ui-dashboard-load-report__archive {
  border-left-color: rgba(239, 68, 68, 0.28);
  color: #b91c1c;
}

@media (max-width: 1100px) {
  .ui-dashboard-load-report__inner {
    flex-wrap: wrap;
  }

  .ui-dashboard-load-report__archive {
    width: 100%;
    margin-left: 0;
    padding-left: 0;
    border-left: none;
    padding-top: 0.35rem;
    border-top: 1px dashed rgba(16, 185, 129, 0.22);
  }
}

.ui-dashboard-load-report__item {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  font-size: 11px;
  font-weight: 600;
  color: #334155;
  white-space: nowrap;
}

.ui-dashboard-load-report__item i {
  font-size: 0.95rem;
  flex-shrink: 0;
}

.ui-header-toolbar__row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem 0.625rem;
  width: 100%;
}

.ui-header-toolbar__controls {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem;
  flex: 1 1 auto;
  min-width: 0;
}

.ui-header-toolbar__controls .ui-date-toolbar__range,
.ui-header-toolbar__row .ui-store-badge {
  min-height: 2.625rem;
  height: 2.625rem;
  box-sizing: border-box;
}

.ui-header-toolbar__controls .ui-date-toolbar__range {
  padding-top: 0;
  padding-bottom: 0;
  flex: 0 0 auto;
  width: auto;
  max-width: 100%;
}

.ui-header-toolbar__row .ui-store-badge {
  flex: 0 0 auto;
  margin-left: auto;
  align-self: center;
  max-width: min(100%, 320px);
  white-space: nowrap;
}

@media (max-width: 639px) {
  .ui-header-toolbar__row {
    flex-direction: column;
    align-items: stretch;
  }

  .ui-header-toolbar__row .ui-store-badge {
    margin-left: 0;
    align-self: flex-end;
  }
}

.ui-store-badge {
  display: inline-flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.35rem 0.5rem;
  align-self: flex-end;
  max-width: 100%;
  padding: 0.45rem 0.8rem;
  border-radius: 999px;
  border: 1px solid var(--ke-orange-border);
  background: var(--ke-orange-soft);
  box-shadow: var(--ke-shadow);
}

.ui-store-badge__label {
  font-size: 0.625rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--ke-orange-dark);
}

.ui-store-badge__name {
  font-size: 0.8125rem;
  font-weight: 800;
  color: var(--ke-navy);
  letter-spacing: -0.01em;
  text-transform: none;
  max-width: min(280px, 52vw);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.ui-store-badge__id {
  font-size: 0.6875rem;
  font-weight: 700;
  color: var(--ke-text-muted);
  letter-spacing: 0.02em;
}

.ui-date-toolbar {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 0.5rem;
  width: 100%;
}

@media (min-width: 768px) {
  .ui-date-toolbar {
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: 0.5rem 0.625rem;
  }
}

.ui-date-toolbar__range {
  width: 100%;
}

@media (min-width: 768px) {
  .ui-date-toolbar__range {
    width: auto;
  }
}

.ui-date-toolbar__quick {
  width: 100%;
}

@media (min-width: 768px) {
  .ui-date-toolbar__quick {
    width: auto;
  }
}

.ui-page-header__eyebrow {
  font-size: 0.6875rem;
  font-weight: 700;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--ke-orange);
  margin-bottom: 0.35rem;
}

.ui-page-header__title {
  font-size: 2rem;
  font-weight: 800;
  color: var(--ke-ink);
  letter-spacing: -0.035em;
  line-height: 1.12;
}

.ui-page-header__subtitle {
  font-size: 0.875rem;
  color: var(--ke-text-secondary);
  margin-top: 0.35rem;
  max-width: 42rem;
  line-height: 1.5;
}

/* ─── Cards (Vendify-style: white, chunky radius, hairline border) ─── */
.ui-card,
.glass-panel {
  background: var(--ke-surface) !important;
  border: 1px solid var(--ke-border) !important;
  border-radius: var(--ke-radius-xl) !important;
  box-shadow: var(--ke-shadow-card) !important;
  color: var(--ke-text) !important;
  transition: box-shadow 0.25s ease, transform 0.25s ease;
}

.ui-card:hover,
.glass-panel:hover {
  box-shadow: var(--ke-shadow-lg) !important;
  border-color: var(--ke-border-strong) !important;
  transform: translateY(-1px);
}

.ui-card__title {
  font-size: 1rem;
  font-weight: 700;
  color: var(--ke-navy);
}

.ui-card__subtitle {
  font-size: 0.75rem;
  color: var(--ke-text-muted);
}

/* ─── Widget cards (dashboard charts & stats) ─── */
.ui-widget {
  position: relative;
  overflow: hidden;
}

.ui-widget::before {
  content: '';
  position: absolute;
  top: -40px;
  right: -40px;
  width: 120px;
  height: 120px;
  border-radius: 999px;
  background: var(--ke-orange-soft);
  opacity: 0.55;
  pointer-events: none;
}

.ui-widget--navy::before {
  background: var(--ke-navy-soft);
  opacity: 0.7;
}

.ui-widget--plain::before {
  display: none;
}

.ui-widget__header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.375rem;
  margin-bottom: 0.375rem;
  position: relative;
  z-index: 1;
}

.ui-widget__title {
  font-size: 0.9375rem;
  font-weight: 700;
  color: var(--ke-navy);
  letter-spacing: -0.01em;
}

.ui-widget__subtitle {
  font-size: 0.6875rem;
  color: var(--ke-text-muted);
  margin-top: 0.2rem;
}

.ui-widget__icon {
  width: 2.75rem;
  height: 2.75rem;
  border-radius: 14px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  font-size: 1.25rem;
}

.ui-widget__icon--orange {
  background: var(--ke-orange-soft);
  color: var(--ke-orange);
}

.ui-widget__icon--navy {
  background: var(--ke-navy-soft);
  color: var(--ke-navy);
}

.ui-widget__value {
  font-size: 1.875rem;
  font-weight: 800;
  color: var(--ke-navy);
  letter-spacing: -0.03em;
  line-height: 1.1;
}

.ui-widget__value--accent {
  color: var(--ke-orange);
}

.ui-stat-mini {
  border-radius: 14px;
  background: var(--ke-surface-2);
  padding: 0.625rem 0.75rem;
}

.ui-stat-mini__label {
  font-size: 0.625rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--ke-text-muted);
}

.ui-stat-mini__value {
  font-size: 0.875rem;
  font-weight: 800;
  color: var(--ke-navy);
  margin-top: 0.15rem;
}

.ui-stat-mini__value--orange {
  color: var(--ke-orange-dark);
}

.ui-stat-mini--compact {
  padding: 0.5rem 0.625rem;
}

.ui-badge-soft {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  padding: 0.35rem 0.75rem;
  border-radius: 999px;
  font-size: 0.6875rem;
  font-weight: 700;
}

.ui-badge-soft--success {
  background: var(--ke-teal-soft);
  color: #0f766e;
  border: 1px solid #99f6e4;
}

.ui-badge-soft--orange {
  background: var(--ke-orange-soft);
  color: var(--ke-orange-dark);
  border: 1px solid var(--ke-orange-border);
}

.ui-section-head {
  margin-bottom: 0.625rem;
}

.ui-section-head__eyebrow {
  font-size: 0.6875rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ke-text-muted);
  margin-bottom: 0.25rem;
}

.ui-section-head__title {
  font-size: 1.25rem;
  font-weight: 800;
  color: var(--ke-navy);
  letter-spacing: -0.02em;
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.ui-section-head--ai-trend {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 1rem;
}

.ui-ai-trend-layer {
  margin-top: 1.5rem;
  margin-bottom: 0.5rem;
}

.ui-ai-trend-layer__badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 999px;
  background: linear-gradient(135deg, #fff7ed 0%, #ffedd5 100%);
  border: 1px solid rgba(255, 107, 53, 0.22);
  color: var(--ke-orange);
  box-shadow: 0 8px 20px rgba(255, 107, 53, 0.12);
  flex-shrink: 0;
}

.ui-ai-trend-layer__badge i {
  font-size: 1.125rem;
}

.ui-ai-trend-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1rem;
}

@media (min-width: 768px) {
  .ui-ai-trend-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
  }
}

@media (min-width: 1280px) {
  .ui-ai-trend-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1.125rem;
  }
}

.ui-ai-trend-card {
  position: relative;
  overflow: hidden;
  border-radius: 1.25rem;
  border: 1px solid rgba(15, 23, 42, 0.07);
  background: #fff;
  padding: 1.125rem 1.125rem 1.25rem;
  min-height: 8.75rem;
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  box-shadow:
    0 1px 2px rgba(15, 23, 42, 0.04),
    0 10px 24px rgba(15, 23, 42, 0.05);
  transition: transform 0.22s ease, box-shadow 0.22s ease, border-color 0.22s ease;
}

.ui-ai-trend-card::before {
  content: '';
  position: absolute;
  inset: 0 auto auto 0;
  width: 100%;
  height: 3px;
  background: var(--ui-ai-trend-accent, linear-gradient(90deg, #ff6b35, #fb923c));
  opacity: 0.95;
}

.ui-ai-trend-card:hover {
  transform: translateY(-2px);
  border-color: rgba(15, 23, 42, 0.12);
  box-shadow:
    0 2px 6px rgba(15, 23, 42, 0.05),
    0 16px 32px rgba(15, 23, 42, 0.08);
}

.ui-ai-trend-card__head {
  display: flex;
  align-items: center;
  gap: 0.625rem;
}

.ui-ai-trend-card__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2rem;
  height: 2rem;
  border-radius: 0.75rem;
  background: var(--ui-ai-trend-icon-bg, rgba(255, 107, 53, 0.1));
  color: var(--ui-ai-trend-icon-color, var(--ke-orange));
  flex-shrink: 0;
}

.ui-ai-trend-card__icon i {
  font-size: 1rem;
}

.ui-ai-trend-card__title {
  font-size: 0.9375rem;
  font-weight: 800;
  color: var(--ke-navy);
  letter-spacing: -0.01em;
  line-height: 1.2;
}

.ui-ai-trend-card__body {
  margin: 0;
  font-size: 0.8125rem;
  line-height: 1.55;
  color: #475569;
  flex: 1;
}

.ui-ai-trend-card--sales {
  --ui-ai-trend-accent: linear-gradient(90deg, #0c1a3a, #1e3a8a);
  --ui-ai-trend-icon-bg: rgba(12, 26, 58, 0.08);
  --ui-ai-trend-icon-color: #0c1a3a;
}

.ui-ai-trend-card--campaign {
  --ui-ai-trend-accent: linear-gradient(90deg, #ff6b35, #fb923c);
  --ui-ai-trend-icon-bg: rgba(255, 107, 53, 0.12);
  --ui-ai-trend-icon-color: #ea580c;
}

.ui-ai-trend-card--ops {
  --ui-ai-trend-accent: linear-gradient(90deg, #0d9488, #14b8a6);
  --ui-ai-trend-icon-bg: rgba(13, 148, 136, 0.12);
  --ui-ai-trend-icon-color: #0f766e;
}

.ui-ai-trend-card--returns {
  --ui-ai-trend-accent: linear-gradient(90deg, #e11d48, #fb7185);
  --ui-ai-trend-icon-bg: rgba(225, 29, 72, 0.1);
  --ui-ai-trend-icon-color: #be123c;
}

.ui-ai-card {
  border-left: 4px solid var(--ke-orange) !important;
  padding-left: 1.25rem !important;
}

.ui-ai-card--navy {
  border-left-color: var(--ke-navy) !important;
}

.ui-ai-card--teal {
  border-left-color: var(--ke-teal) !important;
}

.ui-ai-card__title {
  font-size: 0.9375rem;
  font-weight: 700;
  color: var(--ke-navy);
  margin-bottom: 0.5rem;
}

.ui-ai-sphere {
  border-radius: 1rem;
  background: transparent;
  overflow: hidden;
  position: relative;
  min-height: 207px;
  cursor: pointer;
}

.ui-ai-sphere--compact {
  width: calc(10.5rem * 1.15);
  height: calc(10.5rem * 1.15);
  min-height: 0;
  flex: 0 0 calc(10.5rem * 1.15);
  margin-left: auto;
  border-radius: 1rem;
}

.ui-ai-card-body {
  min-height: calc(10.5rem * 1.15);
  flex: 1;
  justify-content: space-between;
  align-items: center;
}

.ui-ai-health-panel {
  flex: 0 1 auto;
  min-width: 0;
  max-width: 43.5%;
}

.ui-ai-health-panel .ui-badge-soft {
  max-width: 100%;
  font-size: 0.55rem;
  padding: 0.28rem 0.6rem;
  gap: 0.28rem;
}

.ui-ai-health-dot {
  width: 0.4rem !important;
  height: 0.4rem !important;
}

.ui-ai-health-hint {
  font-size: 0.55rem;
  line-height: 1.35;
}

.ui-ai-sphere canvas {
  width: 100% !important;
  height: 100% !important;
  min-height: 207px;
  max-height: 218px;
  display: block;
}

.ui-ai-sphere--compact canvas {
  min-height: 0 !important;
  max-height: none !important;
}

#sphere-loading {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 0.25rem;
  z-index: 2;
  color: var(--ke-orange, #ff6b35) !important;
}

.ui-ai-sphere--compact #sphere-loading {
  font-size: 0.65rem;
}

.ui-table-light thead {
  background: var(--ke-surface-2) !important;
  border-bottom: 1px solid var(--ke-border) !important;
}

.ui-table-light thead th {
  color: var(--ke-text-muted) !important;
  font-weight: 700 !important;
}

.ui-table-light tbody tr {
  border-bottom: 1px solid var(--ke-border);
}

.ui-table-light tbody td {
  color: var(--ke-navy) !important;
  padding-top: 1rem;
  padding-bottom: 1rem;
}

.ui-icon-btn {
  width: 2.25rem;
  height: 2.25rem;
  border-radius: 999px;
  border: 1px solid var(--ke-border);
  background: var(--ke-surface);
  color: var(--ke-text-muted);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: all 0.2s ease;
}

.ui-icon-btn:hover {
  color: var(--ke-orange);
  border-color: var(--ke-orange-border);
  background: var(--ke-orange-soft);
}

/* ─── Status strip (Libra-style horizontal cards) ─── */
.ui-status-strip {
  display: flex;
  flex-direction: column;
  gap: 0.4375rem;
  padding: 0.5rem 0.5625rem;
  background: var(--ke-surface);
  border: 1px solid var(--ke-border);
  border-radius: var(--ke-radius-lg);
  box-shadow: var(--ke-shadow);
  margin-bottom: 0;
  min-height: 0;
  flex-shrink: 0;
  width: 100%;
}

/* Dashboard sidekick row — AI + metrics + cargo */
.ui-dashboard-sidekick {
  width: 100%;
  margin-top: 0;
  margin-bottom: 0;
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}

.ui-dashboard-sidekick__metrics {
  align-items: stretch;
  --sidekick-metric-min-h: 13.75rem;
}

.ui-dashboard-sidekick__metrics > [class*="col-span"] {
  min-width: 0;
  max-width: 100%;
  display: flex;
  flex-direction: column;
}

.ui-dashboard-sidekick__metric {
  width: 100%;
  max-width: 100%;
  height: 100%;
  flex: 1;
  min-height: calc(var(--sidekick-metric-min-h) * 1.2);
}

.ui-dashboard-sidekick__cargo .ui-widget__title {
  font-size: 0.75rem;
  letter-spacing: 0.06em;
}

.ui-dashboard-sidekick__cargo [data-api-kargo-range-note] {
  min-height: 1rem;
}

.ui-kargo-list {
  margin: 0;
  padding: 0;
  list-style: none;
}

.ui-dashboard-sidekick__cargo .ui-kargo-list {
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.ui-kargo-list li {
  min-height: calc(1.5rem * 1.1);
}

.dashboard-cancel-loss-widget,
.dashboard-return-loss-widget {
  min-height: calc(var(--sidekick-metric-min-h, 13.75rem) * 1.2);
}

.dashboard-cancel-loss-widget .grid,
.dashboard-return-loss-widget .grid {
  flex: 1;
}

.dashboard-cancel-loss-widget .rounded-2xl,
.dashboard-return-loss-widget .rounded-2xl {
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
}

.dashboard-cancel-loss-widget .ui-stat-mini--compact,
.dashboard-return-loss-widget .ui-stat-mini--compact {
  min-height: 3.6rem;
}

.dashboard-cancel-loss-widget .ui-stat-mini--compact .ui-stat-mini__label,
.dashboard-return-loss-widget .ui-stat-mini--compact .ui-stat-mini__label {
  font-size: calc(0.625rem * 1.25);
}

.dashboard-cancel-loss-widget .ui-stat-mini--compact .ui-stat-mini__value,
.dashboard-return-loss-widget .ui-stat-mini--compact .ui-stat-mini__value {
  font-size: calc(0.875rem * 1.35);
}

.dashboard-cancel-loss-widget .ui-stat-mini--compact button,
.dashboard-return-loss-widget .ui-stat-mini--compact button {
  font-size: calc(0.75rem * 1.25);
}

.ui-dashboard-sidekick__metric.ui-widget--plain .ui-ai-card-body {
  align-items: center;
}

.ui-dashboard-sidekick__secondary {
  align-items: stretch;
  --sidekick-secondary-min-h: 13rem;
}

.ui-dashboard-sidekick__secondary > [class*="col-span"] {
  min-width: 0;
  display: flex;
  flex-direction: column;
}

.ui-dashboard-sidekick__secondary .ui-dashboard-sidekick__cargo,
.ui-dashboard-sidekick__secondary .ui-ai-insights {
  min-height: calc(var(--sidekick-secondary-min-h) * 1.1);
  flex: 1;
  height: 100%;
}

.ui-dashboard-sidekick__secondary .ui-ops-row__insights {
  display: flex;
  flex-direction: column;
  min-height: 100%;
}

.ui-dashboard-sidekick__secondary .ui-ai-insights {
  flex: 1;
  height: 100%;
}

.ui-dashboard-sidekick__secondary .ui-ai-insights__track {
  min-height: calc(1.5rem * 1.1);
}

.legacy-view-root main > .ui-dashboard-hero + .ui-dashboard-sidekick {
  margin-top: 0;
}

.legacy-view-root main > .ui-dashboard-sidekick + .ui-ops-row {
  margin-top: 0;
}

/* Align ops row with dashboard grid below (same gap-5 rhythm) */
.legacy-view-root main > .ui-ops-row + .grid,
.legacy-view-root main > .ui-dashboard-sidekick + .ui-ops-row + .grid,
.legacy-view-root main > .ui-status-strip + .grid {
  margin-top: 0;
}

/* ── Operations row: aligns with dashboard 12-col (4 + 8) ── */
.ui-ops-row {
  width: 100%;
  margin-bottom: 0;
  align-items: stretch;
}

.ui-ops-row__strip,
.ui-ops-row__insights {
  min-width: 0;
  display: flex;
  flex-direction: column;
}

.ui-ops-row__strip .ui-status-strip,
.ui-ops-row__insights .ui-ai-insights {
  flex: 1;
  height: 100%;
  min-height: 100%;
}

.ui-ops-row__strip .ui-status-strip {
  display: flex;
  flex-direction: column;
}

.ui-ops-row__strip .ui-status-strip__top {
  flex-shrink: 0;
}

.ui-ops-row__strip .ui-status-strip__scroll {
  flex: 1;
  display: flex;
  align-items: stretch;
  min-height: 0;
}

.ui-ops-row__insights .ui-ai-insights {
  display: flex;
  flex-direction: column;
}

@media (min-width: 1280px) {
  .ui-ops-row__strip .ui-status-cell {
    flex: 1;
    min-width: 0;
    min-height: 0;
    padding: 0.75rem 0.4rem 0.65rem;
    gap: 0.4rem;
    border-radius: 12px;
  }

  .ui-ops-row__strip .ui-status-cell__icon {
    width: 2.25rem;
    height: 2.25rem;
  }

  .ui-ops-row__strip .ui-status-cell__icon i {
    font-size: 1.125rem;
  }

  .ui-ops-row__strip .ui-status-cell__label {
    font-size: 0.5625rem;
    letter-spacing: 0.07em;
    line-height: 1.25;
  }

  .ui-ops-row__strip .ui-status-cell__value,
  .ui-ops-row__strip [data-api-strip-new],
  .ui-ops-row__strip [data-api-strip-processing],
  .ui-ops-row__strip [data-api-strip-shipping] {
    font-size: 1.25rem !important;
    font-weight: 700 !important;
    letter-spacing: -0.035em !important;
  }

  .ui-ops-row__strip .ui-status-strip {
    padding: 0.38rem 0.45rem 0.4rem;
    gap: 0.2rem;
  }

  .ui-ops-row__strip .ui-status-strip__scroll {
    gap: 0.5rem;
    padding-bottom: 0;
  }
}

/* ── AI insights panel — typewriter only, no extra motion ── */
.ui-ai-insights,
.ui-ai-insights * {
  animation: none !important;
}

.ui-ai-insights {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  padding: 0.45rem 0.5625rem 0.5rem;
  border-radius: 10px;
  border: 1px solid rgba(12, 26, 58, 0.1);
  background: #ffffff;
  box-shadow: 0 4px 14px rgba(16, 24, 40, 0.06);
  overflow: hidden;
  min-height: 0;
}

.ui-ai-insights__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
}

.ui-ai-insights__label {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  font-size: 0.6875rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ke-navy);
}

.ui-ai-insights__spark {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2rem;
  height: 2rem;
  border-radius: 8px;
  background: #ff6b35;
  color: #ffffff;
  font-size: 1rem;
}

.ui-ai-insights__chip {
  font-size: 0.625rem;
  font-weight: 700;
  color: var(--ke-navy);
  padding: 0.28rem 0.55rem;
  border-radius: 4px;
  border: 1px solid rgba(12, 26, 58, 0.12);
  background: #f8fafc;
  white-space: nowrap;
  max-width: 48%;
  overflow: hidden;
  text-overflow: ellipsis;
}

.ui-ai-insights__body {
  display: flex;
  flex-direction: column;
  gap: 0.16rem;
  flex: 1;
  justify-content: space-between;
  min-height: 0;
}

.ui-ai-insights__line {
  display: flex;
  align-items: stretch;
  gap: 0.34rem;
  margin: 0;
  flex: 1;
  min-height: 0;
}

.ui-ai-insights__line:not([data-typed]):not(.ui-ai-insights__line--active) .ui-ai-insights__detail {
  color: transparent;
}

.ui-ai-insights__idx {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  align-self: center;
  min-width: 1.45rem;
  height: 1.45rem;
  padding: 0 0.24rem;
  border-radius: 5px;
  font-size: 0.58rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  color: #ffffff !important;
  font-variant-numeric: tabular-nums;
  background: #64748b;
}

.ui-ai-insights__line[data-ai-insight-line="0"] .ui-ai-insights__idx { background: #ff6b35; }
.ui-ai-insights__line[data-ai-insight-line="1"] .ui-ai-insights__idx { background: #3b82f6; }
.ui-ai-insights__line[data-ai-insight-line="2"] .ui-ai-insights__idx { background: #64748b; }
.ui-ai-insights__line[data-ai-insight-line="3"] .ui-ai-insights__idx { background: #ea580c; }
.ui-ai-insights__line[data-ai-insight-line="4"] .ui-ai-insights__idx { background: #2563eb; }
.ui-ai-insights__line[data-ai-insight-line="5"] .ui-ai-insights__idx { background: #94a3b8; }

.ui-ai-insights__track {
  position: relative;
  flex: 1;
  min-width: 0;
  min-height: 1.5rem;
  border-radius: 6px;
  border: 1px solid rgba(12, 26, 58, 0.1);
  background: #f2f4f7;
  overflow: hidden;
  display: flex;
  align-items: center;
  padding: 0.24rem 0.42rem;
}

.ui-ai-insights__content {
  min-width: 0;
  width: 100%;
}

.ui-ai-insights__line-text {
  display: block;
  font-size: 0.66rem;
  line-height: 1.32;
  color: var(--ke-navy) !important;
  word-break: break-word;
}

.ui-ai-insights__title,
.ui-ai-insights__sep {
  display: none !important;
}

.ui-ai-insights__detail {
  display: inline;
  font-weight: 600;
  color: var(--ke-navy) !important;
}

@media (min-width: 1024px) {
  .ui-ai-insights__line-text {
    font-size: 0.66rem;
    line-height: 1.32;
  }

  .ui-ai-insights__track {
    min-height: 1.5rem;
    padding: 0.24rem 0.42rem;
  }
}

@media (max-width: 1023px) {
  .ui-ai-insights {
    min-height: 7rem;
  }

  .ui-ai-insights__line-text {
    font-size: 0.68rem;
  }

  .ui-ai-insights__track {
    min-height: 1.95rem;
  }
}

.ui-status-strip__top {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.35rem;
}

.ui-status-strip__scroll {
  display: flex;
  gap: 0.625rem;
  overflow-x: auto;
  overflow-y: visible;
  padding-bottom: 0.25rem;
  scrollbar-width: thin;
  -webkit-overflow-scrolling: touch;
}

.ui-status-strip__scroll::-webkit-scrollbar {
  height: 6px;
}

.ui-status-strip__scroll::-webkit-scrollbar-thumb {
  background: #cbd5e1;
  border-radius: 999px;
}

.ui-status-strip__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  min-width: 200px;
}

.ui-status-strip__label {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.75rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ke-navy);
  line-height: 1.2;
}

.ui-status-strip__dot {
  width: 8px;
  height: 8px;
  border-radius: 999px;
  background: var(--ke-orange);
  animation: ui-pulse 2s ease-in-out infinite;
  flex-shrink: 0;
}

.ui-status-strip__meta {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: flex-end;
  gap: 0.35rem;
  margin-left: auto;
  min-width: 0;
}

.ui-status-strip__badge {
  font-size: 0.6875rem;
  font-weight: 600;
  color: var(--ke-text-secondary);
  padding: 0.28rem 0.55rem;
  border-radius: 999px;
  border: 1px solid var(--ke-border);
  background: var(--ke-surface-2);
  white-space: nowrap;
  line-height: 1.2;
}

.ui-status-strip__grid {
  display: flex;
  gap: 0.625rem;
  overflow-x: auto;
}

.ui-status-cell {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  min-height: 108px;
  min-width: 0;
  flex: 1 1 0;
  padding: 0.875rem 0.625rem 0.75rem;
  border-radius: 18px;
  border: 1px solid rgba(15, 23, 42, 0.05);
  background: #ffffff;
  box-shadow:
    0 1px 2px rgba(15, 23, 42, 0.04),
    0 4px 16px rgba(15, 23, 42, 0.03);
  overflow: hidden;
  -webkit-font-smoothing: antialiased;
  text-align: center;
  transition: box-shadow 0.2s ease, border-color 0.2s ease, transform 0.2s ease;
}

.ui-status-cell:hover {
  box-shadow:
    0 2px 4px rgba(15, 23, 42, 0.05),
    0 8px 22px rgba(15, 23, 42, 0.06);
}

.ui-status-cell::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 3px;
  border-radius: 3px 0 0 3px;
}

.ui-status-cell__icon {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 999px;
  border: none;
}

.ui-status-cell__icon i {
  font-size: 1.25rem;
  line-height: 1;
}

.ui-status-cell__label {
  width: 100%;
  font-family: var(--ke-font-body);
  font-size: 0.625rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: #64748b;
  line-height: 1.3;
  white-space: normal;
  word-break: break-word;
}

.ui-status-cell__value,
[data-api-strip-new],
[data-api-strip-processing],
[data-api-strip-shipping] {
  width: 100%;
  margin-top: 0.125rem;
  text-align: center;
  font-family: var(--ke-font-body);
  font-size: 1.25rem !important;
  font-weight: 700 !important;
  color: #0f172a !important;
  line-height: 1 !important;
  letter-spacing: -0.04em !important;
  font-variant-numeric: tabular-nums;
}

/* New — sky accent */
.ui-status-cell--new {
  background: var(--ke-tint-sky);
}

.ui-status-cell--new::before {
  background: linear-gradient(180deg, #38bdf8 0%, #0ea5e9 100%);
}

.ui-status-cell--new .ui-status-cell__icon {
  color: #0369a1;
  background: rgba(186, 230, 253, 0.55);
}

/* Processing — slate/navy accent */
.ui-status-cell--processing {
  background: var(--ke-tint-lav);
}

.ui-status-cell--processing::before {
  background: linear-gradient(180deg, #334155 0%, #1e3a5f 100%);
}

.ui-status-cell--processing .ui-status-cell__icon {
  color: #1e3a5f;
  background: rgba(203, 213, 225, 0.45);
}

/* Shipping — brand orange */
.ui-status-cell--shipping,
.ui-status-cell--active {
  background: var(--ke-tint-cream);
}

.ui-status-cell--shipping::before,
.ui-status-cell--active::before {
  background: linear-gradient(180deg, #ff8f4f 0%, #ff6b35 100%);
}

.ui-status-cell--shipping .ui-status-cell__icon,
.ui-status-cell--active .ui-status-cell__icon {
  color: #c2410c;
  background: rgba(254, 215, 170, 0.55);
}

.ui-status-cell--shipping .ui-status-cell__value,
.ui-status-cell--active .ui-status-cell__value,
[data-api-strip-shipping] {
  color: #9a3412 !important;
}

.ui-status-strip__sync {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  min-height: 40px;
  padding: 0 1rem;
  border-radius: 12px;
  border: 1px solid var(--ke-border);
  background: var(--ke-surface);
  color: var(--ke-navy);
  font-size: 0.6875rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  cursor: pointer;
  transition: all 0.2s;
  white-space: nowrap;
  flex-shrink: 0;
}

.ui-status-strip__sync i {
  font-size: 1rem;
}

.ui-status-strip__sync--top {
  margin-left: auto;
}

.ui-status-strip__sync--inline {
  min-height: 0;
  height: auto;
  padding: 0.24rem 0.5rem;
  border-radius: 999px;
  font-size: 0.6rem;
  gap: 0.28rem;
  letter-spacing: 0.05em;
}

.ui-status-strip__sync--inline i {
  font-size: 0.8rem;
}

.ui-ops-row__strip .ui-status-strip__top {
  gap: 0.25rem;
}

.ui-ops-row__strip .ui-status-strip__label {
  font-size: 0.625rem;
  letter-spacing: 0.08em;
  min-width: 0;
}

.ui-ops-row__strip .ui-status-strip__label > span:last-child {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.ui-ops-row__strip .ui-status-strip__badge {
  font-size: 0.5625rem;
  padding: 0.2rem 0.42rem;
}

.ui-ops-row__strip .ui-status-strip__sync--inline {
  padding: 0.2rem 0.42rem;
  font-size: 0.5625rem;
}

.ui-ops-row__strip .ui-status-strip {
  padding: 0.38rem 0.45rem 0.42rem;
  gap: 0.22rem;
}

.ui-status-strip__sync:hover {
  background: var(--ke-orange-soft);
  border-color: var(--ke-orange-border);
  color: var(--ke-orange-dark);
}

/* Chart cards — light theme */
.ui-chart-card {
  min-height: 200px;
}

.ui-chart-card canvas {
  min-height: 140px;
  max-height: 160px;
}

.ui-chart-card .chartjs-legend,
.legacy-view-root main .glass-panel canvas {
  /* legend rendered on canvas — colors set in charts.js */
}

/* ─── KPI gradient cards (SM Info style) ─── */
.ui-kpi-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 1rem;
}

.ui-kpi {
  position: relative;
  border-radius: var(--ke-radius-xl);
  padding: 1.25rem 1.5rem;
  color: var(--ke-ink);
  overflow: hidden;
  min-height: 110px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  border: 1px solid rgba(16, 24, 40, 0.05);
  box-shadow: var(--ke-shadow-card);
}

.ui-kpi::after {
  content: '';
  position: absolute;
  right: -14px;
  top: 50%;
  transform: translateY(-50%);
  width: 84px;
  height: 84px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.55);
}

/* Vendify tints: pastel fills, dark readable text; hero card stays brand orange */
.ui-kpi--orange {
  background: linear-gradient(135deg, #ff6b35 0%, #ff8f5c 100%);
  color: #ffffff;
}

.ui-kpi--orange::after {
  background: rgba(255, 255, 255, 0.2);
}

.ui-kpi--teal {
  background: var(--ke-tint-mint);
}

.ui-kpi--purple {
  background: var(--ke-tint-lav);
}

.ui-kpi--blue {
  background: var(--ke-tint-sky);
}

.ui-kpi__label {
  font-size: 0.75rem;
  font-weight: 700;
  opacity: 0.82;
  margin-bottom: 0.35rem;
}

.ui-kpi__value {
  font-size: 1.85rem;
  font-weight: 800;
  line-height: 1.08;
  letter-spacing: -0.02em;
}

.ui-kpi__meta {
  font-size: 0.6875rem;
  opacity: 0.8;
  margin-top: 0.25rem;
}

/* ─── Form controls ─── */
.ui-input,
.ui-field input,
.ui-field select,
.ui-field textarea {
  width: 100%;
  background: var(--ke-surface) !important;
  border: 1px solid var(--ke-border) !important;
  border-radius: 12px !important;
  padding: 0.65rem 0.875rem !important;
  font-size: 0.875rem !important;
  color: var(--ke-text) !important;
  outline: none;
  transition: border-color 0.2s, box-shadow 0.2s;
}

.ui-input:focus,
.ui-field input:focus {
  border-color: var(--ke-orange) !important;
  box-shadow: 0 0 0 3px rgba(255, 107, 53, 0.15) !important;
}

.ui-input::placeholder {
  color: var(--ke-text-muted) !important;
}

/* Search fields in legacy views (Tailwind pl-10/left-3 not compiled from app.js) */
.legacy-view-root main .ui-search-field,
.legacy-view-root main .relative:has(> i.ph-magnifying-glass) {
  position: relative;
  min-width: 0;
}

.legacy-view-root main .ui-search-field__icon,
.legacy-view-root main .relative:has(> i.ph-magnifying-glass) > i.ph-magnifying-glass {
  position: absolute !important;
  left: 0.85rem !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  pointer-events: none !important;
  z-index: 1;
  font-size: 1rem;
  line-height: 1;
  color: var(--ke-text-muted, #94a3b8) !important;
}

.legacy-view-root main .ui-search-field__input,
.legacy-view-root main .relative:has(> i.ph-magnifying-glass) > input[type="search"],
.legacy-view-root main .relative:has(> i.ph-magnifying-glass) > input[type="text"] {
  width: 100%;
  padding-left: 2.5rem !important;
}

/* ─── Buttons ─── */
.ui-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  padding: 0.55rem 1.15rem;
  border-radius: 999px;
  font-size: 0.8125rem;
  font-weight: 700;
  border: 1px solid transparent;
  cursor: pointer;
  transition: all 0.2s;
}

.ui-btn-primary {
  background: var(--ke-orange) !important;
  color: #fff !important;
  border-color: var(--ke-orange) !important;
  box-shadow: 0 6px 16px rgba(255, 107, 53, 0.28);
}

.ui-btn-primary:hover {
  background: var(--ke-orange-dark) !important;
}

.ui-btn-ghost {
  background: var(--ke-surface);
  color: var(--ke-text-secondary);
  border-color: var(--ke-border);
}

.ui-btn-ghost:hover {
  background: var(--ke-surface-2);
  color: var(--ke-text);
}

.ui-btn-teal {
  background: var(--ke-teal-soft);
  color: #0f766e;
  border-color: #99f6e4;
}

/* ─── Date picker ─── */
.ui-header-toolbar__controls .ui-date-box,
#date-range-picker .ui-date-box {
  background: var(--ke-surface) !important;
  border: 1px solid var(--ke-border) !important;
  border-radius: 14px !important;
  box-shadow: var(--ke-shadow);
}

.ui-header-toolbar__controls input[type="date"],
#date-range-picker input {
  color: var(--ke-text) !important;
}

.quick-range-btn {
  border: 1px solid var(--ke-border) !important;
  background: var(--ke-surface) !important;
  color: var(--ke-text-secondary) !important;
  border-radius: 999px !important;
}

.quick-range-btn:hover {
  background: var(--ke-surface-2) !important;
  color: var(--ke-text) !important;
}

/* ─── Tables ─── */
.ui-table-wrap {
  overflow-x: auto;
  border-radius: var(--ke-radius);
  border: 1px solid var(--ke-border);
}

.ui-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.875rem;
}

.ui-table thead {
  background: var(--ke-surface-2);
}

.ui-table th {
  padding: 0.75rem 1rem;
  text-align: left;
  font-size: 0.6875rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--ke-text-muted);
  border-bottom: 1px solid var(--ke-border);
}

.ui-table td {
  padding: 0.75rem 1rem;
  color: var(--ke-text);
  border-bottom: 1px solid var(--ke-border);
}

.ui-table tbody tr:hover {
  background: var(--ke-surface-2);
}

/* ─── Chips / badges ─── */
.ui-chip {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  padding: 0.35rem 0.75rem;
  border-radius: 999px;
  font-size: 0.6875rem;
  font-weight: 700;
  border: 1px solid var(--ke-border);
  background: var(--ke-surface-2);
  color: var(--ke-text-secondary);
}

.ui-chip--success {
  background: var(--ke-teal-soft);
  border-color: #99f6e4;
  color: #0f766e;
}

.ui-chip--warning {
  background: var(--ke-orange-soft);
  border-color: var(--ke-orange-border);
  color: var(--ke-orange-dark);
}

/* ─── Main content readability fix ─── */
.legacy-view-root main,
.legacy-view-root main .glass-panel,
.legacy-view-root main section {
  color: var(--ke-text);
}

.legacy-view-root main h1,
.legacy-view-root main h2,
.legacy-view-root main h3,
.legacy-view-root main h4 {
  color: var(--ke-text) !important;
}

.legacy-view-root main .text-brand-textMuted {
  color: var(--ke-text-secondary) !important;
}

/* Preserve white text only on intentional surfaces */
.ui-kpi--orange,
.ui-kpi--orange *,
.sidebar-nav-link-active,
.sidebar-nav-link-active *,
.ui-nav-link--active,
.ui-nav-link--active *,
.ui-btn-primary,
.ui-btn-primary *,
.ui-sidebar__logo-icon,
.ui-sidebar__logo-icon *,
[data-keep-light-text] *,
[data-keep-light-text] {
  color: inherit;
}

.sidebar-nav-link-active,
.sidebar-nav-link-active span,
.sidebar-nav-link-active i,
.ui-btn-primary,
#drApply {
  color: #ffffff !important;
}

/* Pro/Plus pill badge — keep dark text on active nav (light badge background) */
.sidebar-nav-link-active .menu-upsell-lock .menu-upsell-badge,
.sidebar-nav-link-active .menu-upsell-lock .menu-upsell-active,
.ui-nav-link--active .menu-upsell-lock .menu-upsell-badge,
.ui-nav-link--active .menu-upsell-lock .menu-upsell-active,
#sidebar a.sidebar-nav-link-active .menu-upsell-lock .menu-upsell-badge,
#sidebar a.sidebar-nav-link-active .menu-upsell-lock .menu-upsell-active,
#sidebar a.ui-nav-link--active .menu-upsell-lock .menu-upsell-badge,
#sidebar a.ui-nav-link--active .menu-upsell-lock .menu-upsell-active {
  -webkit-text-fill-color: var(--ke-orange) !important;
  color: var(--ke-orange) !important;
}

.sidebar-nav-link-active .menu-upsell-lock--included .menu-upsell-badge--included,
.sidebar-nav-link-active .menu-upsell-lock--included .menu-upsell-active,
.ui-nav-link--active .menu-upsell-lock--included .menu-upsell-badge--included,
.ui-nav-link--active .menu-upsell-lock--included .menu-upsell-active,
#sidebar a.sidebar-nav-link-active .menu-upsell-lock--included .menu-upsell-badge--included,
#sidebar a.sidebar-nav-link-active .menu-upsell-lock--included .menu-upsell-active,
#sidebar a.ui-nav-link--active .menu-upsell-lock--included .menu-upsell-badge--included,
#sidebar a.ui-nav-link--active .menu-upsell-lock--included .menu-upsell-active {
  -webkit-text-fill-color: #059669 !important;
  color: #059669 !important;
}

.sidebar-nav-link-active .menu-upsell-lock--cari .menu-upsell-badge,
.sidebar-nav-link-active .menu-upsell-lock--cari .menu-upsell-active,
.sidebar-nav-link-active .menu-upsell-lock--cari .menu-upsell-active--cari,
.ui-nav-link--active .menu-upsell-lock--cari .menu-upsell-badge,
.ui-nav-link--active .menu-upsell-lock--cari .menu-upsell-active,
.ui-nav-link--active .menu-upsell-lock--cari .menu-upsell-active--cari,
.sidebar-nav-link-active.menu-item--cari-plus .menu-upsell-badge,
.sidebar-nav-link-active.menu-item--cari-plus .menu-upsell-active,
.ui-nav-link--active.menu-item--cari-plus .menu-upsell-badge,
.ui-nav-link--active.menu-item--cari-plus .menu-upsell-active,
#sidebar a.sidebar-nav-link-active .menu-upsell-lock--cari .menu-upsell-badge,
#sidebar a.sidebar-nav-link-active .menu-upsell-lock--cari .menu-upsell-active,
#sidebar a.sidebar-nav-link-active .menu-upsell-lock--cari .menu-upsell-active--cari,
#sidebar a.ui-nav-link--active .menu-upsell-lock--cari .menu-upsell-badge,
#sidebar a.ui-nav-link--active .menu-upsell-lock--cari .menu-upsell-active,
#sidebar a.ui-nav-link--active .menu-upsell-lock--cari .menu-upsell-active--cari {
  -webkit-text-fill-color: var(--ke-navy-mid) !important;
  color: var(--ke-navy-mid) !important;
}

/* Only the hero orange KPI keeps white text — pastel tints use dark ink */
.ui-kpi--orange,
.ui-kpi--orange * {
  color: #ffffff !important;
}

.ui-kpi:not(.ui-kpi--orange),
.ui-kpi:not(.ui-kpi--orange) * {
  color: var(--ke-ink) !important;
}

@keyframes ui-pulse {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.45; }
}

/* Mobile */
.mobile-menu-btn {
  background: var(--ke-surface) !important;
  border: 1px solid var(--ke-border) !important;
  color: var(--ke-text) !important;
  box-shadow: var(--ke-shadow) !important;
}

#active-store-badge {
  position: static !important;
  right: auto !important;
  top: auto !important;
  z-index: auto !important;
  pointer-events: auto !important;
  background: var(--ke-orange-soft) !important;
  border: 1px solid var(--ke-orange-border) !important;
  color: var(--ke-navy) !important;
  box-shadow: var(--ke-shadow) !important;
}

#active-store-badge [data-store-name] {
  color: var(--ke-navy) !important;
}

/* ═══════════════════════════════════════════════════════════
   CONTRAST FIX — navy + orange on white (all pages)
   ═══════════════════════════════════════════════════════════ */

.legacy-view-root main,
.legacy-view-root main *:not(.ui-btn-primary):not(.ui-btn-primary *):not(.ui-kpi):not(.ui-kpi *):not(#drApply):not([data-keep-light-text]):not([data-keep-light-text] *) {
  /* inherit readable base */
}

.legacy-view-root main:not(:has([data-otonom-command])) .text-white,
.legacy-view-root main:not(:has([data-otonom-command])) h1.text-white,
.legacy-view-root main:not(:has([data-otonom-command])) h2.text-white,
.legacy-view-root main:not(:has([data-otonom-command])) h3.text-white,
.legacy-view-root main:not(:has([data-otonom-command])) .font-bold.text-white,
.legacy-view-root main:not(:has([data-otonom-command])) .font-semibold.text-white,
.legacy-view-root main:not(:has([data-otonom-command])) .font-black.text-white {
  color: var(--ke-navy) !important;
}

/* Light pastel text → dark readable */
.legacy-view-root main:not(:has([data-otonom-command])) [class*="text-sky-1"],
.legacy-view-root main:not(:has([data-otonom-command])) [class*="text-sky-2"],
.legacy-view-root main:not(:has([data-otonom-command])) [class*="text-sky-3"],
.legacy-view-root main:not(:has([data-otonom-command])) [class*="text-cyan-1"],
.legacy-view-root main:not(:has([data-otonom-command])) [class*="text-cyan-2"],
.legacy-view-root main:not(:has([data-otonom-command])) [class*="text-cyan-3"],
.legacy-view-root main:not(:has([data-otonom-command])) [class*="text-emerald-1"],
.legacy-view-root main:not(:has([data-otonom-command])) [class*="text-emerald-2"],
.legacy-view-root main:not(:has([data-otonom-command])) [class*="text-emerald-3"],
.legacy-view-root main:not(:has([data-otonom-command])) [class*="text-amber-1"],
.legacy-view-root main:not(:has([data-otonom-command])) [class*="text-amber-2"],
.legacy-view-root main:not(:has([data-otonom-command])) [class*="text-amber-3"],
.legacy-view-root main:not(:has([data-otonom-command])) [class*="text-orange-1"],
.legacy-view-root main:not(:has([data-otonom-command])) [class*="text-orange-2"],
.legacy-view-root main:not(:has([data-otonom-command])) [class*="text-orange-3"],
.legacy-view-root main:not(:has([data-otonom-command])) [class*="text-red-2"],
.legacy-view-root main:not(:has([data-otonom-command])) [class*="text-red-3"],
.legacy-view-root main:not(:has([data-otonom-command])) [class*="text-violet-1"],
.legacy-view-root main:not(:has([data-otonom-command])) [class*="text-violet-2"],
.legacy-view-root main:not(:has([data-otonom-command])) [class*="text-violet-3"],
.legacy-view-root main:not(:has([data-otonom-command])) [class*="text-fuchsia-3"],
.legacy-view-root main:not(:has([data-otonom-command])) [class*="text-pink-2"],
.legacy-view-root main:not(:has([data-otonom-command])) [class*="text-pink-3"],
.legacy-view-root main:not(:has([data-otonom-command])) [class*="text-yellow-2"],
.legacy-view-root main:not(:has([data-otonom-command])) [class*="text-yellow-3"],
.legacy-view-root main:not(:has([data-otonom-command])) [class*="text-rose-2"],
.legacy-view-root main:not(:has([data-otonom-command])) [class*="text-rose-3"],
.legacy-view-root main:not(:has([data-otonom-command])) [class*="text-blue-3"],
.legacy-view-root main:not(:has([data-otonom-command])) [class*="text-blue-4"] {
  color: var(--ke-navy-mid) !important;
}

/* Finans & panel metric values */
.legacy-view-root main [data-api-fin-ciro],
.legacy-view-root main [data-api-fin-urun-maliyet],
.legacy-view-root main [data-api-fin-komisyon],
.legacy-view-root main [data-api-fin-hizmet],
.legacy-view-root main [data-api-fin-reklam],
.legacy-view-root main [data-api-fin-kargo],
.legacy-view-root main [data-api-fin-stoppage],
.legacy-view-root main [data-api-fin-eticaret-stopaj],
.legacy-view-root main [data-api-fin-influencer],
.legacy-view-root main [data-api-fin-gider],
.legacy-view-root main [data-api-fin-count-raw],
.legacy-view-root main [data-api-fin-count-gross],
.legacy-view-root main [data-api-fin-count-cancel],
.legacy-view-root main [data-api-fin-count-return],
.legacy-view-root main [data-api-fin-count-return-pending],
.legacy-view-root main [data-api-fin-count-net],
.legacy-view-root main [data-api-fin-sales-gross],
.legacy-view-root main [data-api-fin-sales-cancel],
.legacy-view-root main [data-api-fin-sales-return],
.legacy-view-root main [data-api-fin-sales-return-pending],
.legacy-view-root main [data-api-fin-sales-discount],
.legacy-view-root main [data-api-fin-sales-net],
.legacy-view-root main [data-api-fin-sales-check],
.legacy-view-root main [data-otonom-summary] .font-semibold,
.legacy-view-root main [data-otonom-summary] [class*="text-white"] {
  color: var(--ke-navy) !important;
  font-weight: 800 !important;
}

/* Trendyol doğrulama mini kartları */
.legacy-view-root main:not(:has([data-otonom-command])) .rounded-xl.border.px-3.py-3,
.legacy-view-root main:not(:has([data-otonom-command])) .rounded-xl.border.p-3 {
  background: #ffffff !important;
}

.legacy-view-root main [data-api-fin-count-gross] { color: #0369a1 !important; }
.legacy-view-root main [data-api-fin-count-cancel],
.legacy-view-root main [data-api-fin-sales-cancel] { color: #b91c1c !important; }
.legacy-view-root main [data-api-fin-count-return],
.legacy-view-root main [data-api-fin-sales-return] { color: #c2410c !important; }
.legacy-view-root main [data-api-fin-count-return-pending],
.legacy-view-root main [data-api-fin-sales-return-pending] { color: #ea580c !important; }
.legacy-view-root main [data-api-fin-count-net],
.legacy-view-root main [data-api-fin-sales-net] { color: #047857 !important; }
.legacy-view-root main [data-api-fin-sales-discount] { color: #0e7490 !important; }

/* Veri özeti satırları */
.legacy-view-root main [data-otonom-summary] > div {
  background: #ffffff !important;
  border: 1px solid var(--ke-border) !important;
  border-radius: 14px !important;
  padding: 0.75rem 1rem !important;
}

.legacy-view-root main [data-otonom-summary] .text-brand-textMuted {
  color: var(--ke-text-muted) !important;
}

/* Ürün tablosu & sipariş kartları */
.legacy-view-root main .top-order-row,
.legacy-view-root main [data-product-row],
.legacy-view-root main table tbody tr {
  color: var(--ke-navy) !important;
}

.legacy-view-root main .top-order-row .text-white,
.legacy-view-root main table td.text-white,
.legacy-view-root main table .text-white {
  color: var(--ke-navy) !important;
}

.legacy-view-root main table td {
  color: var(--ke-navy) !important;
}

/* Primary buttons keep white text */
.legacy-view-root main .ui-btn-primary,
.legacy-view-root main .ui-btn-primary *,
.legacy-view-root main #drApply,
.legacy-view-root main #drApply *,
.legacy-view-root main button.bg-brand-primary,
.legacy-view-root main button.bg-cyan-500,
.legacy-view-root main button.bg-slate-900,
.legacy-view-root main .kza-filter-btn.bg-slate-900,
.legacy-view-root main .pcq-filter-btn.bg-slate-900,
.legacy-view-root main .bg-brand-primary.text-white {
  color: #ffffff !important;
}

/* Product content quality table — clear row/column separation */
.legacy-view-root main .pcq-data-table {
  border-collapse: separate;
  border-spacing: 0;
  border: 1px solid #cbd5e1;
  border-radius: 12px;
  overflow: hidden;
}

.legacy-view-root main .pcq-data-table thead th {
  border-bottom: 2px solid #cbd5e1 !important;
  border-right: 1px solid #e2e8f0 !important;
  background: #f8fafc !important;
}

.legacy-view-root main .pcq-data-table thead th:last-child {
  border-right: none !important;
}

.legacy-view-root main .pcq-data-table tbody tr.pcq-row {
  background: #ffffff !important;
}

.legacy-view-root main .pcq-data-table tbody tr.pcq-row--critical {
  background: #fff1f2 !important;
}

.legacy-view-root main .pcq-data-table tbody tr.pcq-row--warning {
  background: #fffbeb !important;
}

.legacy-view-root main .pcq-data-table tbody tr.pcq-row:hover {
  background: #f8fafc !important;
}

.legacy-view-root main .pcq-data-table tbody tr.pcq-row--critical:hover {
  background: #ffe4e6 !important;
}

.legacy-view-root main .pcq-data-table tbody tr.pcq-row--warning:hover {
  background: #fef3c7 !important;
}

.legacy-view-root main .pcq-data-table tbody td {
  border-right: 1px solid #e2e8f0 !important;
  border-bottom: 1px solid #cbd5e1 !important;
  vertical-align: top !important;
}

.legacy-view-root main .pcq-data-table tbody td:last-child {
  border-right: none !important;
}

.legacy-view-root main .pcq-data-table tbody tr:last-child td {
  border-bottom: none !important;
}

.legacy-view-root main .pcq-data-table th:first-child,
.legacy-view-root main .pcq-data-table td:first-child {
  width: 165px !important;
  max-width: 165px !important;
}

.legacy-view-root main button.bg-cyan-500 {
  background: var(--ke-orange) !important;
  border-color: var(--ke-orange) !important;
}

/* Section headers */
.legacy-view-root main .ui-page-header__eyebrow {
  color: var(--ke-orange) !important;
}

.legacy-view-root main .ui-status-strip__label {
  color: var(--ke-navy-mid) !important;
}

.legacy-view-root main .ui-status-cell__label {
  color: #64748b !important;
  font-weight: 600 !important;
  letter-spacing: 0.07em !important;
}

.legacy-view-root main .ui-status-cell__value,
.legacy-view-root main [data-api-strip-new],
.legacy-view-root main [data-api-strip-processing] {
  color: #0f172a !important;
  font-size: 1.25rem !important;
  font-weight: 700 !important;
  letter-spacing: -0.04em !important;
}

.legacy-view-root main [data-api-strip-shipping] {
  color: #9a3412 !important;
  font-size: 1.25rem !important;
  font-weight: 700 !important;
  letter-spacing: -0.04em !important;
}

.legacy-view-root main .ui-status-strip__dot {
  background: var(--ke-orange) !important;
}

.legacy-view-root main .ui-widget__title,
.legacy-view-root main .ui-section-head__title,
.legacy-view-root main .ui-ai-card__title,
.legacy-view-root main .ui-ai-trend-card__title {
  color: var(--ke-navy) !important;
}

.legacy-view-root main .ui-widget__value,
.legacy-view-root main .ui-stat-mini__value {
  color: var(--ke-navy) !important;
}

.legacy-view-root main .ui-ai-insights__line-text {
  color: var(--ke-navy) !important;
}

.legacy-view-root main .ui-ai-insights__title {
  color: var(--ke-navy) !important;
  font-weight: 800 !important;
}

.legacy-view-root main .ui-ai-insights__detail {
  color: #334155 !important;
  font-weight: 500 !important;
}

.legacy-view-root main .ui-ai-insights__sep {
  color: var(--ke-muted) !important;
}

.legacy-view-root main .ui-widget__value--accent,
.legacy-view-root main .ui-stat-mini__value--orange {
  color: var(--ke-orange-dark) !important;
}

.ui-data-source-banner {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  width: 100%;
  min-height: 2.375rem;
  margin: 0;
  padding: 0.5rem 0.75rem;
  border-radius: 12px;
  font-size: 11px;
  line-height: 1.4;
  font-weight: 500;
  box-sizing: border-box;
  flex-wrap: nowrap;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.ui-data-source-banner span {
  min-width: 0;
  word-break: break-word;
}

.ui-data-source-banner__meta {
  display: inline;
  margin-top: 0;
  font-size: inherit;
  opacity: 0.85;
  font-weight: 400;
}

.ui-data-source-banner i {
  font-size: 1rem;
  flex-shrink: 0;
}

.ui-data-source-banner--loading {
  border: 1px solid rgba(148, 163, 184, 0.35);
  background: rgba(248, 250, 252, 0.9);
  color: #64748b;
}

.ui-data-source-banner--fresh {
  border: 1px solid rgba(16, 185, 129, 0.35);
  background: rgba(16, 185, 129, 0.1);
  color: #065f46;
}

.ui-data-source-banner--cache {
  border: 1px solid rgba(245, 158, 11, 0.4);
  background: rgba(245, 158, 11, 0.12);
  color: #92400e;
}

.ui-data-source-banner--error {
  border: 1px solid rgba(239, 68, 68, 0.4);
  background: rgba(239, 68, 68, 0.1);
  color: #991b1b;
}

.ui-panel-notice-host {
  position: fixed;
  top: 1rem;
  left: 50%;
  z-index: 10050;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  width: min(420px, calc(100vw - 1.5rem));
  transform: translateX(-50%);
  pointer-events: none;
}

.ui-panel-notice {
  display: flex;
  align-items: flex-start;
  gap: 0.625rem;
  padding: 0.75rem 1rem;
  border-radius: 0.875rem;
  font-size: 0.8125rem;
  line-height: 1.4;
  box-shadow: 0 12px 32px rgba(15, 23, 42, 0.18);
  pointer-events: auto;
}

.ui-panel-notice--warning {
  border: 1px solid rgba(245, 158, 11, 0.45);
  background: #fffbeb;
  color: #92400e;
}

.ui-panel-notice--error {
  border: 1px solid rgba(239, 68, 68, 0.4);
  background: #fef2f2;
  color: #991b1b;
}

.ui-panel-notice--success {
  border: 1px solid rgba(16, 185, 129, 0.4);
  background: #ecfdf5;
  color: #065f46;
}

.ui-panel-notice__close {
  margin-left: auto;
  border: 0;
  background: transparent;
  color: inherit;
  font-size: 1.125rem;
  line-height: 1;
  cursor: pointer;
  opacity: 0.7;
}

.ui-panel-notice__close:hover {
  opacity: 1;
}

/* Ürün & Karlılık table */
.uk-profit-section {
  overflow: visible !important;
  margin-bottom: 1.125rem;
}

.ui-profit-source-note {
  display: flex;
  align-items: flex-start;
  gap: 0.5rem;
  margin: 0.625rem 0 0;
  padding: 0.5rem 0.75rem;
  border-radius: 0.75rem;
  border: 1px solid rgba(148, 163, 184, 0.35);
  background: rgba(248, 250, 252, 0.95);
  font-size: 0.6875rem;
  line-height: 1.45;
  color: #475569;
}

.ui-profit-source-note i {
  flex-shrink: 0;
  margin-top: 0.1rem;
  font-size: 0.875rem;
  color: #64748b;
}

.ui-profit-source-note strong {
  color: #334155;
  font-weight: 700;
}

.ui-profit-source-note--uk {
  margin-bottom: 0.875rem;
}

.ui-dashboard-hero__right .ui-profit-source-note {
  margin-top: 0.4rem;
  font-size: 0.65rem;
  line-height: 1.35;
  padding: 0.4rem 0.55rem;
}

@media (max-width: 1023px) {
  .ui-profit-source-note {
    font-size: 0.65rem;
  }
}

.uk-profit-table-wrap {
  overflow-x: auto;
  overflow-y: visible;
  -webkit-overflow-scrolling: touch;
}

.uk-profit-table {
  table-layout: auto;
  border-collapse: separate;
  border-spacing: 0;
}

.uk-profit-col-rank { width: 2.125rem; }
.uk-profit-col-product { width: 15rem; min-width: 13.125rem; }
.uk-profit-col-qty { width: 3.125rem; }
.uk-profit-col-money { width: 7.25rem; min-width: 6.75rem; }
.uk-profit-col-money-sm { width: 5.375rem; min-width: 4.875rem; }
.uk-profit-col-commission { width: 8.125rem; min-width: 7.625rem; }
.uk-profit-col-rate { width: 3.375rem; }

.uk-profit-table thead th,
.uk-profit-table tbody td {
  color: var(--ke-text);
  vertical-align: top;
  padding: 0.5625rem 0.375rem;
}

.uk-profit-table tbody tr {
  min-height: 2.8125rem;
}

.uk-profit-product-row {
  display: flex;
  align-items: flex-start;
  gap: 0.5625rem;
  min-width: 0;
}

.uk-profit-product-sku {
  margin-top: 0.125rem;
}

.uk-profit-stack {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  justify-content: flex-start;
  gap: 0.125rem;
  line-height: 1.2;
  min-width: 0;
}

.uk-profit-stack__main {
  display: block;
  white-space: nowrap;
  font-size: 0.8125rem;
}

.uk-profit-stack__sub {
  display: block;
  font-size: 0.625rem;
  font-weight: 500;
  line-height: 1.15;
  white-space: normal;
  text-align: right;
  max-width: 8.5rem;
}

/* Product profitability: 0-1 ratio main line; % line 25% smaller */
.uk-profit-rate-pct {
  display: block;
  font-size: 0.609375rem; /* 75% of .uk-profit-stack__main (0.8125rem) */
  font-weight: 600;
  line-height: 1.15;
  white-space: nowrap;
  text-align: right;
}

.uk-profit-margin-kpi {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.125rem;
  line-height: 1.2;
  margin-top: 0.5rem;
}

.uk-profit-margin-kpi--compact {
  margin-top: 0.25rem;
}

.uk-profit-margin-kpi--vendify {
  margin-top: 0;
}

.uk-profit-stack__kpi-main {
  display: block;
  font-size: 1.5rem;
  font-weight: 700;
  line-height: 1.15;
  white-space: nowrap;
}

.uk-profit-rate-pct--kpi {
  display: block;
  font-size: 1.125rem; /* 75% of kpi main (1.5rem) */
  font-weight: 600;
  line-height: 1.15;
  white-space: nowrap;
}

.uk-profit-stack__kpi-compact-main {
  display: block;
  font-size: 0.875rem;
  font-weight: 600;
  line-height: 1.15;
  white-space: nowrap;
}

.uk-profit-rate-pct--kpi-compact {
  display: block;
  font-size: 0.65625rem; /* 75% of compact main (0.875rem) */
  font-weight: 600;
  line-height: 1.15;
  white-space: nowrap;
}

.uk-profit-cell-product {
  min-width: 13.125rem;
  max-width: 16.875rem;
}

.uk-profit-cell-money,
.uk-profit-cell-money-sm,
.uk-profit-cell-commission,
.uk-profit-cell-qty,
.uk-profit-cell-rate {
  white-space: nowrap;
}

.uk-profit-thumb {
  width: 2.0625rem;
  height: 2.0625rem;
  min-width: 2.0625rem;
  min-height: 2.0625rem;
  aspect-ratio: 1 / 1;
  object-fit: cover;
  object-position: center;
  border-radius: 0.375rem;
  border: 1px solid var(--ke-border);
  background: #fff;
  flex-shrink: 0;
  display: block;
}

.uk-profit-thumb--empty {
  background: #f8fafc;
}

@media (min-width: 1280px) {
  .uk-profit-thumb {
    width: 2.25rem;
    height: 2.25rem;
    min-width: 2.25rem;
    min-height: 2.25rem;
  }
}

/* Kar-Zarar Ajanı — dark ticker band keeps light text (theme normalizer must not override) */
.legacy-view-root main .kza-ticker-wrap,
.legacy-view-root main .kza-ticker-wrap [data-keep-light-text],
.legacy-view-root main .kza-ticker-chip {
  color: #ffffff !important;
}

.legacy-view-root main .kza-ticker-wrap [data-kza-ticker-meta] {
  color: #cbd5e1 !important;
}

/* ═══════════════════════════════════════════════════════════
   OTONOM COMMAND CENTER — dark ops theme + animations
   ═══════════════════════════════════════════════════════════ */

.legacy-view-root main [data-otonom-command] {
  background: linear-gradient(180deg, #0a101c 0%, #0f172a 48%, #111827 100%);
  color: #e2e8f0;
  padding: 1rem;
  border-radius: 1rem;
  min-height: calc(100vh - 2rem);
}

@media (min-width: 1024px) {
  .legacy-view-root main [data-otonom-command] {
    padding: 1.5rem 2rem;
  }
}

.legacy-view-root main [data-otonom-command] .text-white,
.legacy-view-root main [data-otonom-command] h1,
.legacy-view-root main [data-otonom-command] h2,
.legacy-view-root main [data-otonom-command] h3 {
  color: #f8fafc !important;
}

.legacy-view-root main [data-otonom-command] [class*="text-cyan-"],
.legacy-view-root main [data-otonom-command] [class*="text-emerald-"],
.legacy-view-root main [data-otonom-command] [class*="text-amber-"],
.legacy-view-root main [data-otonom-command] [class*="text-violet-"],
.legacy-view-root main [data-otonom-command] [class*="text-rose-"],
.legacy-view-root main [data-otonom-command] [class*="text-slate-3"] {
  /* keep Tailwind pastel on dark panels */
}

.legacy-view-root main [data-otonom-command] .rounded-xl.border.p-3,
.legacy-view-root main [data-otonom-command] .otonom-stat-pill {
  background: inherit !important;
}

.otonom-agent-card {
  color: #f1f5f9;
  background: rgba(15, 23, 42, 0.72);
  backdrop-filter: blur(6px);
}

.otonom-agent-card--active {
  background: rgba(15, 23, 42, 0.88);
  box-shadow: 0 0 0 1px rgba(125, 211, 252, 0.08), 0 12px 32px rgba(2, 6, 23, 0.35);
}

.otonom-agent-card--active:hover {
  background: rgba(30, 41, 59, 0.92);
  box-shadow: 0 0 24px rgba(34, 211, 238, 0.12);
}

.otonom-agent-card--build {
  background: rgba(30, 41, 59, 0.55);
  opacity: 0.92;
}

.otonom-agent-card--build:hover {
  opacity: 1;
  background: rgba(30, 41, 59, 0.75);
}

.otonom-agent-card__note {
  color: #cbd5e1 !important;
}

.otonom-agent-card__bar {
  box-shadow: 0 0 12px currentColor;
}

@keyframes gen9-pulse {
  0%, 100% { transform: scale(1); opacity: 0.92; }
  50% { transform: scale(1.045); opacity: 1; }
}

@keyframes gen9-rotate {
  to { transform: translate(-50%, -50%) rotate(360deg); }
}

@keyframes gen9-counter {
  to { transform: translate(-50%, -50%) rotate(-360deg); }
}

@keyframes gen9-scan {
  0% { transform: translateX(-120%); }
  100% { transform: translateX(220%); }
}

@keyframes gen9-dash {
  to { stroke-dashoffset: -240; }
}

@keyframes gen9-data-travel {
  0% { offset-distance: 0%; opacity: 0; }
  12% { opacity: 1; }
  88% { opacity: 1; }
  100% { offset-distance: 100%; opacity: 0; }
}

@keyframes gen9-bar-glow {
  0%, 100% { box-shadow: 0 0 8px rgba(103, 232, 249, 0.35); }
  50% { box-shadow: 0 0 18px rgba(103, 232, 249, 0.75); }
}

@keyframes gen9-progress-shine {
  0% { filter: brightness(1); }
  50% { filter: brightness(1.15); }
  100% { filter: brightness(1); }
}

.gen9-font {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
}

.gen9-grid-dots {
  background-image: radial-gradient(circle at center, rgba(34, 211, 238, 0.12) 0 1px, transparent 1px);
  background-size: 24px 24px;
}

.gen9-grid-glow {
  background: linear-gradient(135deg, rgba(8, 47, 73, 0.34), transparent 45%, rgba(15, 23, 42, 0.55));
}

.gen9-scanline::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, transparent, rgba(125, 211, 252, 0.18), transparent);
  transform: translateX(-120%);
  animation: gen9-scan 4.8s linear infinite;
  pointer-events: none;
}

.gen9-link {
  stroke-dasharray: 8 12;
  animation: gen9-dash 12s linear infinite;
}

.gen9-link--delay-1 { animation-delay: -2s; }
.gen9-link--delay-2 { animation-delay: -4s; }
.gen9-link--delay-3 { animation-delay: -6s; }
.gen9-link--delay-4 { animation-delay: -8s; }
.gen9-link--delay-5 { animation-delay: -10s; }

.gen9-ring {
  position: absolute;
  left: 50%;
  top: 50%;
  border: 1px solid rgba(125, 211, 252, 0.22);
  border-radius: 999px;
  transform: translate(-50%, -50%);
  pointer-events: none;
}

.gen9-ring.r1 { width: 320px; height: 320px; animation: gen9-rotate 18s linear infinite; }
.gen9-ring.r2 { width: 430px; height: 430px; border-style: dashed; animation: gen9-counter 26s linear infinite; }
.gen9-ring.r3 { width: 540px; height: 540px; border-color: rgba(251, 191, 36, 0.18); animation: gen9-rotate 38s linear infinite; }

.gen9-core-wrap {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 16rem;
  height: 16rem;
  transform: translate(-50%, -50%);
  z-index: 2;
}

.gen9-core-pulse {
  position: relative;
  animation: gen9-pulse 4s ease-in-out infinite;
}

.gen9-core-sweep {
  position: absolute;
  inset: -18px;
  border-radius: 999px;
  background: conic-gradient(from 0deg, transparent 0 68%, rgba(125, 211, 252, 0.28), transparent 82% 100%);
  animation: gen9-rotate 5.6s linear infinite;
  pointer-events: none;
}

.gen9-core-orbit {
  animation: gen9-counter 14s linear infinite;
}

.gen9-core-bar {
  animation: gen9-bar-glow 2.8s ease-in-out infinite;
}

.gen9-data-dot {
  position: absolute;
  top: 0;
  left: 0;
  width: 7px;
  height: 7px;
  border-radius: 999px;
  background: #67e8f9;
  box-shadow: 0 0 14px #67e8f9;
  offset-rotate: 0deg;
  animation: gen9-data-travel 4.8s linear infinite;
}

.gen9-data-dot--1 { offset-path: path("M260 260 C150 130 118 102 72 74"); -webkit-offset-path: path("M260 260 C150 130 118 102 72 74"); }
.gen9-data-dot--2 { offset-path: path("M260 260 C385 126 402 98 452 75"); -webkit-offset-path: path("M260 260 C385 126 402 98 452 75"); background: #fbbf24; box-shadow: 0 0 14px #fbbf24; animation-delay: 0.6s; }
.gen9-data-dot--3 { offset-path: path("M260 260 C405 280 438 335 452 418"); -webkit-offset-path: path("M260 260 C405 280 438 335 452 418"); background: #34d399; box-shadow: 0 0 14px #34d399; animation-delay: 1.2s; }
.gen9-data-dot--4 { offset-path: path("M260 260 C110 275 82 330 72 418"); -webkit-offset-path: path("M260 260 C110 275 82 330 72 418"); background: #a78bfa; box-shadow: 0 0 14px #a78bfa; animation-delay: 1.8s; }

.legacy-view-root main [data-otonom-command] .text-brand-textMuted {
  color: #94a3b8 !important;
}

.gen9-badge-pulse {
  animation: gen9-pulse 3s ease-in-out infinite;
}

.gen9-icon-pulse {
  animation: gen9-pulse 2.2s ease-in-out infinite;
}

.otonom-progress-bar {
  animation: gen9-progress-shine 2.4s ease-in-out infinite;
}

.otonom-progress-bar--delay-1 { animation-delay: 0.4s; }
.otonom-progress-bar--delay-2 { animation-delay: 0.8s; }

@media (prefers-reduced-motion: reduce) {
  [data-otonom-command] *,
  [data-otonom-command] *::before,
  [data-otonom-command] *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}

/* Son 7 Net Satış widget loading */
.net7-sales-widget--loading [data-api-net-sales-7d-total],
.net7-sales-widget--loading [data-api-net-sales-7d-range] {
  opacity: 0.45;
}

.net7-sales-chart-loading {
  position: absolute;
  inset: 0;
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.75rem;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.92) 0%, rgba(248, 250, 252, 0.88) 100%);
  border-radius: 0.75rem;
  pointer-events: none;
}

.net7-sales-widget:not(.net7-sales-widget--loading) .net7-sales-chart-loading {
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.22s ease, visibility 0.22s ease;
}

.net7-sales-widget--loading .net7-sales-chart-loading {
  opacity: 1;
  visibility: visible;
}

.net7-sales-chart-loading__bars {
  display: flex;
  align-items: flex-end;
  justify-content: center;
  gap: 0.45rem;
  width: 100%;
  max-width: 280px;
  height: 72px;
  padding: 0 0.5rem;
}

.net7-sales-chart-loading__bars span {
  flex: 1;
  max-width: 28px;
  border-radius: 6px 6px 2px 2px;
  background: linear-gradient(180deg, #e2e8f0 0%, #cbd5e1 100%);
  animation: net7-bar-pulse 1.1s ease-in-out infinite;
}

.net7-sales-chart-loading__bars span:nth-child(1) { height: 38%; animation-delay: 0s; }
.net7-sales-chart-loading__bars span:nth-child(2) { height: 58%; animation-delay: 0.08s; }
.net7-sales-chart-loading__bars span:nth-child(3) { height: 72%; animation-delay: 0.16s; }
.net7-sales-chart-loading__bars span:nth-child(4) { height: 64%; animation-delay: 0.24s; }
.net7-sales-chart-loading__bars span:nth-child(5) { height: 68%; animation-delay: 0.32s; }
.net7-sales-chart-loading__bars span:nth-child(6) { height: 52%; animation-delay: 0.4s; }
.net7-sales-chart-loading__bars span:nth-child(7) { height: 44%; animation-delay: 0.48s; background: linear-gradient(180deg, #fed7aa 0%, #ff6b35 100%); }

.net7-sales-chart-loading__label {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  font-size: 0.75rem;
  font-weight: 600;
  color: #64748b;
  letter-spacing: 0.01em;
}

.net7-sales-chart-loading__label .ph-spinner {
  animation: net7-spin 0.9s linear infinite;
}

@keyframes net7-bar-pulse {
  0%, 100% { transform: scaleY(0.92); opacity: 0.72; }
  50% { transform: scaleY(1); opacity: 1; }
}

@keyframes net7-spin {
  to { transform: rotate(360deg); }
}

/* ═══════════════════════════════════════════════════════════
   MOBILE BOTTOM TAB BAR — app-like navigation (Vendify style)
   ═══════════════════════════════════════════════════════════ */
.ui-tabbar {
  display: none;
}

@media (max-width: 1024px) {
  .ui-tabbar {
    display: flex;
    position: fixed;
    left: 0.75rem;
    right: 0.75rem;
    bottom: calc(0.65rem + env(safe-area-inset-bottom, 0px));
    height: var(--ke-tabbar-h);
    z-index: 9600;
    background: rgba(255, 255, 255, 0.95);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border: 1px solid var(--ke-border);
    border-radius: 999px;
    box-shadow: 0 14px 40px rgba(16, 24, 40, 0.18);
    align-items: stretch;
    justify-content: space-around;
    gap: 0.15rem;
    padding: 0.4rem;
  }

  .ui-tabbar__item {
    flex: 1 1 0;
    min-width: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.15rem;
    border: 0;
    background: transparent;
    border-radius: 999px;
    color: var(--ke-text-muted);
    font-family: var(--ke-font-body);
    font-size: 0.575rem;
    font-weight: 700;
    letter-spacing: 0.02em;
    cursor: pointer;
    text-decoration: none;
    -webkit-tap-highlight-color: transparent;
    transition: background-color 0.2s ease, color 0.2s ease;
  }

  .ui-tabbar__item i {
    font-size: 1.3rem;
    line-height: 1;
  }

  .ui-tabbar__item span {
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .ui-tabbar__item--active {
    background: var(--ke-ink);
    color: #ffffff;
    box-shadow: 0 8px 18px rgba(16, 24, 40, 0.3);
  }

  .ui-tabbar__item:not(.ui-tabbar__item--active):active {
    background: var(--ke-surface-2);
    color: var(--ke-ink);
  }

  /* Reserve space under content so tab bar never covers it */
  .ui-main,
  .legacy-view-root > main {
    padding-bottom: calc(var(--ke-tabbar-h) + 2rem + env(safe-area-inset-bottom, 0px)) !important;
  }

  body.mobile-menu-open .ui-tabbar {
    display: none;
  }
}

/* GPT Asistan — preserve GLM line breaks and markdown */
.ui-ai-chat-message {
  white-space: pre-wrap;
  word-break: break-word;
  line-height: 1.65;
  font-size: 0.925rem;
}

.ui-ai-chat-message strong {
  font-weight: 700;
  color: inherit;
}

.ui-ai-chat-message em {
  font-style: italic;
}

.ui-ai-chat-message__heading {
  display: block;
  margin-top: 0.35rem;
  margin-bottom: 0.15rem;
  font-size: 0.98rem;
}

.ui-ai-chat-message--user {
  white-space: pre-wrap;
}

/* Yorum & Puan Ajanı — store URL is hidden input; blur kept for optional re-enable */
#storeReviewsUrl.store-link-blurred,
#storeReviewsUrlVisible.store-link-blurred {
  filter: blur(6px);
  user-select: none;
  -webkit-user-select: none;
  pointer-events: none;
}

.ypa-toolbar select,
.ypa-toolbar input[type="number"] {
  min-height: 42px;
}

/* Landing — Gen9 Plus / Gen9 Pro tier blocks */
.landing-tier-section {
  scroll-margin-top: 5.5rem;
}

.landing-tier-feature {
  display: flex;
  align-items: flex-start;
  gap: 0.65rem;
  padding: 0.75rem 0.85rem;
  border-radius: 0.85rem;
  border: 1px solid rgba(148, 163, 184, 0.35);
  background: rgba(255, 255, 255, 0.72);
  font-size: 0.84rem;
  line-height: 1.45;
  color: #334155;
}

.landing-tier-feature i {
  font-size: 1.15rem;
  margin-top: 0.1rem;
  flex-shrink: 0;
}

.landing-tier-feature--plus {
  border-color: rgba(251, 146, 60, 0.28);
  background: rgba(255, 247, 237, 0.65);
}

.landing-tier-feature--pro {
  border-color: rgba(20, 184, 166, 0.28);
  background: rgba(236, 253, 245, 0.65);
}

.landing-pro-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1rem;
  height: 1rem;
  border-radius: 999px;
  background: #0f766e;
  color: #fff;
  font-size: 0.62rem;
  font-weight: 800;
  line-height: 1;
}

.landing-pro-cta-primary {
  background: linear-gradient(135deg, #0f766e 0%, #14b8a6 100%);
  color: #fff;
  box-shadow: 0 10px 24px rgba(15, 118, 110, 0.22);
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.landing-pro-cta-primary:hover {
  transform: translateY(-1px);
  box-shadow: 0 14px 28px rgba(15, 118, 110, 0.28);
  color: #fff;
}

@media (max-width: 640px) {
  .landing-top-nav .landing-nav-pro,
  .landing-top-nav .landing-nav-plus {
    padding-left: 0.65rem;
    padding-right: 0.65rem;
    font-size: 0.78rem;
  }
}

.st-stock-display {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
}

.st-stock-cell--low {
  border-color: rgba(244, 63, 94, 0.45) !important;
  background: rgba(254, 226, 226, 0.85) !important;
  color: #9f1239 !important;
}

.st-stock-cell--ok {
  border-color: rgba(16, 185, 129, 0.45) !important;
  background: rgba(209, 250, 229, 0.85) !important;
  color: #047857 !important;
}

.st-stock-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 4.5rem;
  padding: 0.25rem 0.55rem;
  border-radius: 999px;
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.st-stock-badge--low {
  color: #9f1239;
  background: rgba(254, 226, 226, 0.9);
  border: 1px solid rgba(244, 63, 94, 0.35);
}

.st-stock-badge--ok {
  color: #047857;
  background: rgba(209, 250, 229, 0.9);
  border: 1px solid rgba(16, 185, 129, 0.35);
}

.st-stock-table-wrap {
  max-height: min(68vh, 720px);
  overflow: auto;
}

.st-summary-card {
  width: 100%;
  cursor: pointer;
}

.st-summary-card--active {
  box-shadow: 0 0 0 2px rgba(15, 23, 42, 0.85);
}

.st-summary-card--low.st-summary-card--active {
  box-shadow: 0 0 0 2px rgba(244, 63, 94, 0.55);
}

.st-summary-card--ok.st-summary-card--active {
  box-shadow: 0 0 0 2px rgba(16, 185, 129, 0.55);
}

.st-filter-btn {
  white-space: nowrap;
}

.st-filter-btn--active {
  background: #0f172a !important;
  border: 1px solid #0f172a !important;
  color: #ffffff !important;
}

.legacy-view-root main .st-filter-btn.st-filter-btn--active {
  color: #ffffff !important;
}

.uk-rate-filter-btn {
  white-space: nowrap;
}

.uk-rate-filter-btn--active {
  background: #0f172a !important;
  border: 1px solid #0f172a !important;
  color: #ffffff !important;
}

.uk-rate-filter-btn--loss.uk-rate-filter-btn--active {
  background: #be123c !important;
  border: 1px solid #be123c !important;
  color: #ffffff !important;
}

.legacy-view-root main .uk-rate-filter-btn.uk-rate-filter-btn--active,
.legacy-view-root main .uk-rate-filter-btn.uk-rate-filter-btn--loss.uk-rate-filter-btn--active {
  color: #ffffff !important;
}

.uk-profit-rate-filter-input {
  min-width: 0;
}

/* Products page — light toolbar (readable on white main) */
.pr-product-tab {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  padding: 0.5rem 0.85rem;
  border-radius: 0.5rem;
  font-size: 0.875rem;
  font-weight: 600;
  color: #475569;
  background: transparent;
  border: 1px solid transparent;
  white-space: nowrap;
  transition: background 0.15s ease, color 0.15s ease;
}

.pr-product-tab:hover:not(.pr-product-tab--active) {
  background: #ffffff;
  color: #0f172a;
}

.pr-product-tab--active {
  background: #0f172a !important;
  border-color: #0f172a !important;
  color: #ffffff !important;
}

.legacy-view-root main .pr-product-tab.pr-product-tab--active {
  color: #ffffff !important;
}

.pr-toolbar-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.55rem 0.9rem;
  border-radius: 0.75rem;
  border: 1px solid #e2e8f0;
  background: #ffffff;
  color: #334155;
  font-size: 0.875rem;
  font-weight: 600;
  white-space: nowrap;
  transition: background 0.15s ease, border-color 0.15s ease;
}

.pr-toolbar-btn:hover {
  background: #f8fafc;
  border-color: #cbd5e1;
}

.pr-toolbar-btn--primary {
  border-color: #67e8f9;
  background: #ecfeff;
  color: #0e7490;
}

.pr-toolbar-btn--primary:hover {
  background: #cffafe;
  border-color: #22d3ee;
}

.pr-toolbar-btn--warn {
  border-color: #fcd34d;
  background: #fffbeb;
  color: #b45309;
}

.pr-toolbar-btn--warn:hover {
  background: #fef3c7;
  border-color: #fbbf24;
}

/* Gen9 live-fetch overlay — orb only, no card chrome */
html.kolay-query-loading-lock,
html.kolay-query-loading-lock body {
  overflow: hidden;
}

.kolay-query-loading {
  position: fixed;
  inset: 0;
  z-index: 99999;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 1.25rem;
  pointer-events: auto;
}

.kolay-query-loading--open {
  display: flex !important;
}

.kolay-query-loading--closed,
.kolay-query-loading[hidden] {
  display: none !important;
}

.kolay-query-loading__backdrop {
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse 70% 55% at 50% 42%, rgba(255, 107, 53, 0.12), transparent 62%),
    rgba(8, 12, 22, 0.28);
  backdrop-filter: blur(7px) saturate(1.05);
  -webkit-backdrop-filter: blur(7px) saturate(1.05);
}

.kolay-query-loading__content {
  position: relative;
  z-index: 1;
  width: min(20rem, calc(100vw - 2rem));
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  background: transparent;
  border: 0;
  box-shadow: none;
  animation: kolay-ql-fade-in 0.24s ease-out;
}

.kolay-query-loading__orb {
  position: relative;
  width: 7.75rem;
  height: 7.75rem;
  margin-bottom: 1.1rem;
  cursor: default;
  pointer-events: auto;
}

.kolay-query-loading__backdrop,
.kolay-query-loading__title,
.kolay-query-loading__detail,
.kolay-query-loading__bar {
  cursor: pointer;
}

.kolay-query-loading__orb-spin {
  position: absolute;
  inset: 14%;
  animation: kolay-ql-spin 3.2s linear infinite;
}

.kolay-query-loading__orb-core {
  position: absolute;
  inset: 0;
  border-radius: 999px;
  background:
    radial-gradient(circle at 32% 28%, #ffd0a8 0%, #ff6b35 42%, #c2410c 78%, #7c2d12 100%);
  box-shadow:
    inset 0 -10px 22px rgba(0, 0, 0, 0.35),
    inset 0 8px 16px rgba(255, 255, 255, 0.22),
    0 0 36px rgba(255, 107, 53, 0.55);
}

.kolay-query-loading__orb-glow {
  position: absolute;
  inset: -12%;
  border-radius: 999px;
  background: radial-gradient(circle, rgba(255, 140, 60, 0.35) 0%, transparent 68%);
  filter: blur(6px);
  pointer-events: none;
}

.kolay-query-loading__orb-ring {
  position: absolute;
  inset: 0;
  border-radius: 999px;
  border: 1px solid rgba(255, 160, 90, 0.35);
  box-shadow: 0 0 18px rgba(255, 107, 53, 0.2);
}

.kolay-query-loading__orb-ring--a {
  animation: kolay-ql-spin 7s linear infinite;
  border-top-color: rgba(255, 200, 140, 0.85);
  border-right-color: transparent;
}

.kolay-query-loading__orb-ring--b {
  inset: 10%;
  border-style: dashed;
  border-color: rgba(255, 107, 53, 0.28);
  animation: kolay-ql-spin-rev 11s linear infinite;
}

.kolay-query-loading__orb-spark {
  position: absolute;
  width: 6px;
  height: 6px;
  border-radius: 999px;
  background: #ffd7a8;
  box-shadow: 0 0 10px #ff6b35;
}

.kolay-query-loading__orb-spark--1 {
  top: 8%;
  left: 48%;
  animation: kolay-ql-spark 2.2s ease-in-out infinite;
}

.kolay-query-loading__orb-spark--2 {
  right: 10%;
  bottom: 28%;
  background: #67e8f9;
  box-shadow: 0 0 10px #22d3ee;
  animation: kolay-ql-spark 2.6s ease-in-out infinite 0.4s;
}

.kolay-query-loading__orb-spark--3 {
  left: 12%;
  bottom: 18%;
  background: #fbbf24;
  box-shadow: 0 0 10px #f59e0b;
  animation: kolay-ql-spark 2.8s ease-in-out infinite 0.8s;
}

.kolay-query-loading__title {
  font-family: "Segoe UI", ui-sans-serif, system-ui, sans-serif;
  font-size: 1.1rem;
  font-weight: 800;
  letter-spacing: 0.02em;
  color: #fff7ed;
  text-shadow: 0 2px 18px rgba(0, 0, 0, 0.45), 0 0 24px rgba(255, 107, 53, 0.35);
}

.kolay-query-loading__detail {
  margin-top: 0.4rem;
  max-width: 100%;
  font-size: 0.75rem;
  font-weight: 600;
  color: rgba(255, 232, 214, 0.82);
  text-shadow: 0 1px 10px rgba(0, 0, 0, 0.4);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.kolay-query-loading__detail[hidden] {
  display: none !important;
}

.kolay-query-loading__bar {
  margin-top: 1.1rem;
  width: 58%;
  height: 3px;
  overflow: hidden;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.14);
}

.kolay-query-loading__bar-fill {
  display: block;
  height: 100%;
  width: 42%;
  border-radius: inherit;
  background: linear-gradient(90deg, #ff6b35, #ffb086, #67e8f9);
  animation: kolay-ql-bar 1.35s ease-in-out infinite;
}

@keyframes kolay-ql-fade-in {
  from { opacity: 0; transform: translateY(8px) scale(0.97); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes kolay-ql-spin {
  to { transform: rotate(360deg); }
}

@keyframes kolay-ql-spin-rev {
  to { transform: rotate(-360deg); }
}

@keyframes kolay-ql-spark {
  0%, 100% { opacity: 0.35; transform: scale(0.85); }
  50% { opacity: 1; transform: scale(1.15); }
}

@keyframes kolay-ql-bar {
  0% { transform: translateX(-120%); }
  100% { transform: translateX(260%); }
}

@media (prefers-reduced-motion: reduce) {
  .kolay-query-loading__content,
  .kolay-query-loading__orb-spin,
  .kolay-query-loading__orb-ring,
  .kolay-query-loading__orb-spark,
  .kolay-query-loading__bar-fill {
    animation: none !important;
  }
}