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

:root {
  --ke-bg: #fafafa;
  --ke-surface: #ffffff;
  --ke-surface-2: #f4f4f5;
  --ke-border: #e4e4e7;
  --ke-border-strong: #d4d4d8;
  --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(24, 24, 27, 0.02);
  --ke-shadow-lg: 0 1px 3px rgba(24, 24, 27, 0.04);
  --ke-shadow-card: none;
  --ke-radius: 12px;
  --ke-radius-lg: 16px;
  --ke-radius-xl: 16px;
  --ke-sidebar-w: 272px;
  --ke-font-display: "Gabarito", "Figtree", sans-serif;
  --ke-font-body: "Figtree", sans-serif;
  --ke-tabbar-h: 4.25rem;
  --ke-tabbar-offset: 0.65rem;
  /* Space below scrollable main so fixed tab bar never covers pagination / footers */
  --ke-mobile-content-bottom: calc(
    var(--ke-tabbar-h) + var(--ke-tabbar-offset) + 2.75rem +
      env(safe-area-inset-bottom, 0px)
  );
}

/* ─── 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-pending],
[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:not(.landing-page):not(.auth-shell) > main {
  background: var(--ke-surface);
  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.65rem 1.5rem 1.5rem;
  gap: 1.15rem !important;
  border-radius: var(--vf-radius-shell, 28px);
  border: 1px solid var(--ke-border);
  box-sizing: border-box;
}

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

/* Dashboard welcome header: pull closer to Elart profile row above */
.ui-main > .ui-page-header--vendify.ui-page-header--with-strip:first-child,
.legacy-view-root > main > .ui-page-header--vendify.ui-page-header--with-strip:first-child {
  margin-top: 0;
  margin-bottom: 0.25rem;
}

.ui-main > .ui-page-header--vendify.ui-page-header--with-strip:first-child + .ui-dashboard-toolbar,
.legacy-view-root > main > .ui-page-header--vendify.ui-page-header--with-strip:first-child + .ui-dashboard-toolbar {
  margin-top: 0.15rem;
  margin-bottom: 0.55rem;
}

/* Beat Tailwind gap on shell main — breathable dashboard rhythm */
.ui-main.gap-5,
.ui-main.gap-6,
.legacy-view-root:not(.landing-page) > main.gap-5,
.legacy-view-root:not(.landing-page) > main.gap-6 {
  gap: 1.5rem !important;
}

/* Panel top: welcome + status + date should sit tight (no giant whitespace) */
.ui-main:has(> .ui-page-header--welcome),
.legacy-view-root:not(.landing-page) > main:has(> .ui-page-header--welcome) {
  gap: 0.45rem !important;
}

.landing-page.legacy-view-root > .landing-main {
  padding: 0 !important;
  gap: 0 !important;
  background: transparent;
}

/* Flex column main must not shrink children */
.ui-main > *,
.legacy-view-root > main > * {
  flex-shrink: 0;
}

/* Dashboard inner spacing — preserve Tailwind gap-6 / p-6 rhythm */
.legacy-view-root:not(.landing-page):not(.auth-shell) main .gap-5,
.legacy-view-root:not(.landing-page):not(.auth-shell)
  main
  .flex.flex-col.gap-5 {
  gap: 1.25rem !important;
}

.legacy-view-root:not(.landing-page):not(.auth-shell) main .gap-6,
.legacy-view-root:not(.landing-page):not(.auth-shell)
  main
  .flex.flex-col.gap-6 {
  gap: 1.5rem !important;
}

.legacy-view-root:not(.landing-page):not(.auth-shell) main .glass-panel.p-5,
.legacy-view-root:not(.landing-page):not(.auth-shell) main .ui-widget.p-5 {
  padding: 1.25rem !important;
}

.legacy-view-root:not(.landing-page):not(.auth-shell) main .glass-panel.p-6,
.legacy-view-root:not(.landing-page):not(.auth-shell) main .ui-widget.p-6 {
  padding: 1.5rem !important;
}

@media (min-width: 1280px) {
  .legacy-view-root:not(.landing-page):not(.auth-shell)
    main
    .glass-panel.xl\:p-6,
  .legacy-view-root:not(.landing-page):not(.auth-shell) main .ui-widget.xl\:p-6,
  .legacy-view-root:not(.landing-page):not(.auth-shell)
    main
    .glass-panel.xl\:p-8,
  .legacy-view-root:not(.landing-page):not(.auth-shell)
    main
    .ui-widget.xl\:p-8 {
    padding: 2rem !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: #fafafa !important;
  border-right: 1px solid #e4e4e7 !important;
  box-shadow: none !important;
  display: flex;
  flex-direction: column;
  padding: 1rem 0.5rem;
  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.15s ease,
    border-color 0.15s ease,
    opacity 0.15s ease;
}

.ui-sidebar__nav,
#sidebar nav,
.ui-sidebar__nav {
  scrollbar-gutter: stable;
  scrollbar-width: thin;
  scrollbar-color: transparent transparent;
  overflow-anchor: none;
}

.ui-sidebar__nav:hover,
#sidebar nav:hover {
  scrollbar-color: rgba(24, 24, 27, 0.22) transparent;
}

.ui-sidebar__nav::-webkit-scrollbar,
#sidebar nav::-webkit-scrollbar {
  width: 5px;
}

.ui-sidebar__nav::-webkit-scrollbar-track,
#sidebar nav::-webkit-scrollbar-track {
  background: transparent;
}

.ui-sidebar__nav::-webkit-scrollbar-thumb,
#sidebar nav::-webkit-scrollbar-thumb {
  background: transparent;
  border-radius: 999px;
}

.ui-sidebar__nav:hover::-webkit-scrollbar-thumb,
#sidebar nav:hover::-webkit-scrollbar-thumb {
  background: rgba(24, 24, 27, 0.22);
}

.ui-sidebar__nav:active::-webkit-scrollbar-thumb,
#sidebar nav:active::-webkit-scrollbar-thumb,
.ui-sidebar__nav:focus-within::-webkit-scrollbar-thumb,
#sidebar nav:focus-within::-webkit-scrollbar-thumb {
  background: rgba(24, 24, 27, 0.32);
}

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

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

.ui-sidebar__build {
  display: block;
  width: 100%;
  border: 0;
  background: transparent;
  text-align: left;
  font-size: 0.625rem;
  line-height: 1;
  color: var(--brand-textMuted, #94a3b8);
  padding: 0.35rem 0 0 2.625rem;
  letter-spacing: 0.02em;
  cursor: pointer;
  user-select: text;
}

html[data-ops-status="1"] .ui-sidebar__build {
  color: #059669;
  font-weight: 600;
}

.ui-sidebar__logo-icon {
  width: 2rem;
  height: 2rem;
  border-radius: 0.5rem;
  background: linear-gradient(135deg, var(--ke-orange), #ff8f65);
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  box-shadow: none;
  flex-shrink: 0;
}

.ui-sidebar__logo-text {
  font-size: 0.875rem;
  font-weight: 600;
  color: #18181b;
  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.125rem;
  padding: 0 0.25rem;
  overflow-x: hidden;
  overflow-y: auto;
  scroll-behavior: auto;
}

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

.ui-sidebar__footer {
  margin-top: auto;
  padding: 1rem 0.25rem 0;
  border-top: 1px solid #e4e4e7;
  display: flex;
  flex-direction: column;
  gap: 0.125rem;
}

.sidebar-nav-link,
.ui-nav-link {
  display: flex;
  align-items: center;
  gap: 0.625rem;
  padding: 0.5rem 0.75rem;
  min-height: 2.25rem;
  border-radius: 0.5rem;
  font-size: 0.875rem;
  font-weight: 500;
  color: #52525b !important;
  text-decoration: none;
  transition:
    background-color 0.15s ease,
    border-color 0.15s 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: 2.25rem;
}

[data-nav-group="otonom-ajanlar"],
[data-nav-group="cari-yonetimi"] {
  display: flex !important;
  align-items: center;
  min-height: 2.375rem;
  box-sizing: border-box;
  width: calc(100% - 0.5rem) !important;
  max-width: calc(100% - 0.5rem);
  margin-left: 0.25rem;
  margin-right: 0.25rem;
}

[data-nav-group="otonom-ajanlar"] > span,
[data-nav-group="cari-yonetimi"] > span {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  width: 100%;
  min-width: 0;
  gap: 0.35rem;
}

[data-nav-group] > span > span:first-child {
  flex: 1 1 auto;
  min-width: 0;
  white-space: normal;
  line-height: 1.35;
}

[data-nav-group="otonom-ajanlar"].otonom-nav-group--active {
  background: #18181b !important;
  border-color: #18181b !important;
  color: #ffffff !important;
  box-shadow: none;
}

[data-nav-group="otonom-ajanlar"].otonom-nav-group--active:hover {
  background: #27272a !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: #52525b !important;
}

[data-nav-group="otonom-ajanlar"].otonom-nav-group--idle:hover {
  background: #f4f4f5 !important;
  color: #18181b !important;
}

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

[data-nav-group="cari-yonetimi"].cari-nav-group--active {
  background: #18181b !important;
  border-color: #18181b !important;
  color: #ffffff !important;
  box-shadow: none;
}

[data-nav-group="cari-yonetimi"].cari-nav-group--active:hover {
  background: #27272a !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;
}

/* ─── Sidebar tier badges (PRO / PLUS) ─── */
.menu-tier-pill,
.menu-tier-chip {
  margin-left: auto;
  flex: 0 0 auto;
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 1px;
  width: 34px;
  min-width: 34px;
  max-width: 34px;
  padding: 2px 1px;
  border-radius: 4px;
  border: 1px solid transparent;
  box-sizing: border-box;
  line-height: 1;
}

.menu-tier-pill__text,
.menu-tier-pill__label,
.menu-tier-chip .menu-tier-pill__text {
  font-size: 7px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  line-height: 1;
  white-space: nowrap;
  text-align: center;
  flex: 1 1 auto;
  min-width: 0;
}

.menu-tier-pill--plus,
.menu-tier-chip--plus {
  color: #c2410c;
  background: rgba(255, 107, 53, 0.1);
  border-color: rgba(251, 146, 60, 0.34);
}

.menu-tier-pill--pro,
.menu-tier-pill--cari,
.menu-tier-chip--pro,
.menu-tier-chip--cari {
  color: #1e3a5f;
  background: rgba(30, 58, 95, 0.1);
  border-color: rgba(61, 90, 128, 0.34);
}

.menu-tier-pill__dot {
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: #10b981;
  flex-shrink: 0;
}

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

.menu-tier-pill--pro .menu-tier-pill__dot,
.menu-tier-pill--cari .menu-tier-pill__dot {
  background: var(--ke-navy-mid);
}

.menu-tier-pill--upsell.menu-tier-pill--pro .menu-tier-pill__plus,
.menu-tier-pill--upsell.menu-tier-pill--cari .menu-tier-pill__plus {
  background: var(--ke-navy-mid);
  animation: none;
}

.menu-tier-pill--group,
.menu-group-brand.menu-tier-pill {
  margin-left: 0;
  width: 26px;
  min-width: 26px;
  max-width: 26px;
  padding: 2px 1px;
  flex-shrink: 0;
}

/* Legacy group brand — align with tier pills */
.menu-group-brand {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 2px 6px;
  border-radius: 5px;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.06em;
  line-height: 1.1;
  text-transform: uppercase;
}

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

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

.menu-group-brand--micro {
  min-width: 0 !important;
  width: auto !important;
  height: auto !important;
  padding: 2px 6px !important;
  font-size: 9px !important;
  line-height: 1.1 !important;
}

/* Active group header — tier pill on dark row */
[data-nav-group].cari-nav-group--active .menu-tier-pill--pro,
[data-nav-group].cari-nav-group--active .menu-group-brand--cari,
[data-nav-group].otonom-nav-group--active .menu-tier-pill--plus,
[data-nav-group].otonom-nav-group--active .menu-group-brand--otonom {
  color: #ffffff !important;
  background: rgba(255, 255, 255, 0.14) !important;
  border-color: rgba(255, 255, 255, 0.28) !important;
}

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

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

/* Nav label — 2 lines max; tier pills stay single-line */
.sidebar-nav-link
  > span:not(.menu-tier-pill):not(.menu-tier-chip):not(.menu-upsell-lock):not(
    .menu-upsell-plus
  ),
.ui-nav-link
  > span:not(.menu-tier-pill):not(.menu-tier-chip):not(.menu-upsell-lock):not(
    .menu-upsell-plus
  ) {
  line-height: 1.35;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  white-space: normal;
  word-break: break-word;
}

.sidebar-nav-group-header,
[data-nav-group="cari-yonetimi"],
[data-nav-group="otonom-ajanlar"] {
  min-height: 2.375rem;
}

.sidebar-nav-group-header {
  display: flex !important;
  align-items: center;
  width: calc(100% - 0.5rem) !important;
  max-width: calc(100% - 0.5rem);
  box-sizing: border-box;
  transition:
    background-color 0.15s ease,
    border-color 0.15s ease;
}

[data-nav-group="cari-yonetimi"],
[data-nav-group="otonom-ajanlar"] {
  transition:
    background-color 0.15s ease,
    border-color 0.15s ease !important;
}

.sidebar-nav-link i,
.ui-nav-link i {
  font-size: 1.125rem;
  color: #a1a1aa;
  flex-shrink: 0;
  transition: none;
}

.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: #f4f4f5 !important;
  background-color: #f4f4f5 !important;
  color: #18181b !important;
}

.sidebar-nav-link:hover i,
.ui-nav-link:hover i,
#sidebar a:not(.sidebar-nav-link-active):hover i {
  color: #52525b !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: #18181b !important;
  background-color: #18181b !important;
  color: #ffffff !important;
  box-shadow: none;
}

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

.sidebar-nav-link-active > i,
.ui-nav-link--active > i,
.sidebar-nav-link-active > span:not(.menu-tier-pill):not(.menu-tier-chip),
.ui-nav-link--active > span:not(.menu-tier-pill):not(.menu-tier-chip),
.sidebar-nav-link-active .ui-nav-chevron,
.ui-nav-link--active .ui-nav-chevron {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  transition: none;
}

/* 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-tier-pill):not(.menu-tier-chip):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 auto !important;
  width: 34px !important;
  min-width: 34px !important;
  max-width: 34px !important;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 3px;
  padding: 2px 5px 2px 4px;
  border-radius: 5px;
  background: rgba(255, 107, 53, 0.1);
  border: 1px solid rgba(251, 146, 60, 0.34);
  box-shadow: none;
  box-sizing: border-box;
}

.menu-upsell-lock--compact {
  flex: 0 0 auto !important;
  width: auto !important;
  min-width: auto !important;
  max-width: none !important;
  flex-direction: row !important;
  padding: 2px 7px 2px 5px !important;
  gap: 4px !important;
  border-radius: 6px !important;
}

.menu-upsell-lock--included.menu-upsell-lock--compact {
  padding: 2px 6px !important;
  gap: 5px !important;
}

.menu-upsell-dot {
  display: inline-block;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: #10b981;
  flex-shrink: 0;
}

.menu-upsell-lock--cari .menu-upsell-dot {
  background: var(--ke-navy-mid);
}

.menu-upsell-lock--compact .menu-upsell-plus {
  width: 13px;
  height: 13px;
  font-size: 10px;
}

.menu-upsell-lock--compact .menu-upsell-badge {
  font-size: 9px;
  max-width: none;
}

.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 auto !important;
  width: 34px !important;
  min-width: 34px !important;
  max-width: 34px !important;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  padding: 2px 5px 2px 4px;
  gap: 3px;
  border-color: rgba(16, 185, 129, 0.38);
  background: rgba(16, 185, 129, 0.08);
  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"].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;
  }
}

/* ─── 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;
}

.ui-page-header__extras > button,
.ui-page-header__extras > .inline-flex {
  min-height: 2.625rem;
  height: 2.625rem;
  box-sizing: border-box;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

/* Finance page: title left + badges top-right (no empty gap under badges) */
.ui-page-header--finans {
  gap: 0.4rem;
  margin-bottom: 0.25rem;
}

.ui-page-header--vendify.ui-page-header--finans {
  margin-bottom: 0.5rem;
}

.ui-page-header--vendify.ui-page-header--finans
  .ui-page-header__extras--finans {
  margin-top: 0.15rem;
}

.ui-page-header--vendify.ui-page-header--urunler,
.ui-page-header--vendify.ui-page-header--urun-karlilik {
  margin-bottom: 0.25rem;
  width: 100%;
}

.ui-page-header--vendify.ui-page-header--urunler .ui-page-header__intro,
.ui-page-header--vendify.ui-page-header--urun-karlilik .ui-page-header__intro {
  width: 100%;
  max-width: none;
}

.ui-page-header--vendify.ui-page-header--urunler .ui-page-header__subtitle,
.ui-page-header--vendify.ui-page-header--urun-karlilik .ui-page-header__subtitle {
  max-width: none;
  width: 100%;
}

.ui-page-header--finans .ui-page-header__top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.75rem 1rem;
  width: 100%;
}

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

.ui-page-header--finans .ui-page-header__extras--finans {
  flex: 0 0 auto;
  align-self: center;
  justify-content: flex-end;
  gap: 0.4rem;
  margin-top: 0;
}

.ui-page-header--finans .ui-page-header__actions {
  gap: 0.35rem;
}

.ui-page-header--finans .ui-header-toolbar {
  gap: 0.35rem;
}

.ui-page-header--finans .ui-data-status-bar {
  min-height: 2rem;
  padding: 0.3rem 0.7rem;
}

@media (max-width: 767px) {
  .ui-page-header--finans .ui-page-header__top {
    flex-direction: column;
    align-items: stretch;
  }

  .ui-page-header--finans .ui-page-header__extras--finans {
    justify-content: flex-start;
    margin-top: 0;
  }
}

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

/* Date toolbar: one row; horizontal scroll on tablet/mobile when content overflows */
.ui-header-toolbar__controls--unified {
  flex-wrap: nowrap !important;
  align-items: center;
  gap: 0.625rem;
  width: 100%;
  min-width: 0;
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
  overscroll-behavior-x: contain;
  scrollbar-gutter: stable;
}

.ui-header-toolbar__controls--unified .ui-date-toolbar__range,
.ui-header-toolbar__controls--unified .ui-date-toolbar__quick,
.ui-header-toolbar__controls--unified .ui-header-toolbar__inline-action {
  flex-shrink: 0;
}

.ui-header-toolbar__controls--unified .ui-store-badge,
.ui-header-toolbar__controls--unified .ui-pill-badge.ui-store-badge {
  flex: 1 1 auto;
  min-width: 0;
  max-width: 15rem;
  overflow: hidden;
  min-height: 2.5rem !important;
  height: 2.5rem !important;
  padding-left: 0.75rem !important;
  padding-right: 0.75rem !important;
  font-size: 0.75rem !important;
}

.ui-header-toolbar__controls--unified .ui-store-badge__name {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
}

.ui-header-toolbar__controls--unified .ui-toolbar-compact-btn {
  min-height: 2.5rem;
  height: 2.5rem;
  line-height: 1.2;
}

.ui-header-toolbar__controls--unified .ui-date-toolbar__range {
  min-height: 2.5rem;
  height: 2.5rem;
}

.ui-header-toolbar__controls--unified input[type="date"] {
  width: 8.75rem;
  max-width: 8.75rem;
  font-size: 0.8125rem;
}

.ui-dashboard-toolbar .ui-header-toolbar__row {
  flex-wrap: nowrap;
  align-items: center;
  min-width: 0;
  overflow: hidden;
}

@media (max-width: 1024px) {
  .ui-dashboard-toolbar .ui-header-toolbar__row {
    flex-direction: row;
    align-items: center;
  }

  .ui-header-toolbar__row--unified {
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 0 !important;
    overflow: hidden;
  }

  .ui-header-toolbar__controls--unified {
    flex: 1 1 auto !important;
    width: 100% !important;
    max-width: 100% !important;
    justify-content: flex-start !important;
    align-items: center !important;
    gap: 0.35rem !important;
    flex-wrap: nowrap !important;
  }

  .ui-header-toolbar__controls--unified > * {
    flex: 0 0 auto !important;
    width: auto !important;
    max-width: none !important;
    margin: 0 !important;
  }

  .ui-header-toolbar__controls--unified .ui-date-toolbar__quick {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    flex: 0 0 auto !important;
    align-items: center !important;
    gap: 0.35rem !important;
    width: auto !important;
    min-width: 0 !important;
  }

  .ui-header-toolbar__controls--unified .ui-date-toolbar__quick .quick-range-btn,
  .ui-header-toolbar__controls--unified .ui-date-toolbar__quick #drApply {
    flex: 0 0 auto !important;
    width: auto !important;
  }

  .ui-header-toolbar__controls--unified .ui-store-badge,
  .ui-header-toolbar__controls--unified .ui-pill-badge.ui-store-badge {
    flex: 0 0 auto !important;
    max-width: none !important;
    min-width: auto !important;
    width: auto !important;
  }

  .ui-header-toolbar__controls--unified .ui-store-badge__name {
    overflow: visible;
    text-overflow: clip;
  }

  .ui-dashboard-toolbar .ui-header-toolbar__row--unified {
    overflow: hidden;
  }
}

@media (max-width: 639px) {
  .ui-header-toolbar__controls--unified {
    gap: 0.3rem !important;
    padding-bottom: 0.15rem;
  }

  .ui-header-toolbar__controls--unified .ui-date-toolbar__quick {
    gap: 0.3rem !important;
  }

  .ui-header-toolbar__controls--unified .ui-toolbar-compact-btn,
  .ui-header-toolbar__controls--unified .ui-date-toolbar__range,
  .ui-header-toolbar__controls--unified .ui-store-badge,
  .ui-header-toolbar__controls--unified .ui-pill-badge.ui-store-badge {
    min-height: 2.375rem !important;
    height: 2.375rem !important;
  }

  .ui-header-toolbar__controls--unified input[type="date"] {
    width: 8.25rem;
    max-width: 8.25rem;
    font-size: 0.75rem;
  }
}

@media (min-width: 1280px) {
  .ui-header-toolbar__controls--unified,
  .ui-dashboard-toolbar .ui-header-toolbar__row {
    overflow-x: hidden;
  }
}

/* Compact dashboard welcome — strip lives in React toolbar left of Elart */
.ui-page-header--vendify.ui-page-header--welcome {
  flex-direction: column !important;
  align-items: stretch !important;
  gap: 0 !important;
  margin: 0 0 0.2rem !important;
  padding: 0 !important;
  min-height: 0 !important;
}

.ui-page-header--vendify.ui-page-header--welcome .ui-page-header__intro {
  flex: 0 0 auto;
  max-width: min(28rem, 70%);
  min-width: 0;
  padding: 0;
  margin: 0;
}

.ui-page-header--vendify.ui-page-header--welcome .ui-page-header__title {
  font-size: clamp(1.15rem, 1.6vw, 1.35rem) !important;
  font-weight: 600 !important;
  line-height: 1.15 !important;
  margin: 0 !important;
  padding: 0 !important;
  letter-spacing: -0.02em !important;
}

.ui-page-header--vendify.ui-page-header--welcome .ui-page-header__subtitle {
  margin: 0.08rem 0 0 !important;
  padding: 0 !important;
  font-size: 0.75rem !important;
  line-height: 1.25 !important;
  color: #64748b !important;
}

.ui-main > .ui-page-header--vendify.ui-page-header--welcome:first-child,
.legacy-view-root > main > .ui-page-header--vendify.ui-page-header--welcome:first-child {
  margin-top: 0 !important;
  margin-bottom: 0.15rem !important;
}

.ui-main > .ui-page-header--vendify.ui-page-header--welcome:first-child + .ui-dashboard-toolbar,
.legacy-view-root > main > .ui-page-header--vendify.ui-page-header--welcome:first-child + .ui-dashboard-toolbar {
  margin-top: 0;
  margin-bottom: 0.35rem;
}

/* ─── Order status strip — 3 boxes left of Elart profile pill ─── */

.ui-app-toolbar__end {
  gap: 0.5rem;
}

.order-strip {
  display: flex;
  align-items: center;
  gap: 0.25rem;
  flex-shrink: 0;
}

.order-strip__cell {
  display: flex;
  align-items: center;
  gap: 0.28rem;
  background: #fff;
  border: 1px solid #e4e4e7;
  border-radius: 8px;
  padding: 0.22rem 0.5rem 0.22rem 0.38rem;
  min-height: 1.9rem;
}

.order-strip__icon {
  font-size: 0.7rem;
  color: #6b7686;
  flex-shrink: 0;
}

.order-strip__cell--new    .order-strip__icon { color: #ff6b35; }
.order-strip__cell--processing .order-strip__icon { color: #1e3a5f; }
.order-strip__cell--shipping   .order-strip__icon { color: #14b8a6; }

.order-strip__cell-body {
  display: flex;
  flex-direction: column;
  gap: 0;
}

.order-strip__label {
  font-size: 0.48rem;
  font-weight: 500;
  color: #6b7686;
  line-height: 1.1;
  text-transform: uppercase;
  letter-spacing: 0.02em;
}

.order-strip__value {
  font-size: 0.8rem;
  font-weight: 700;
  color: #0c1a3a;
  line-height: 1.1;
  font-family: var(--ke-font-display);
}

.order-strip__pending {
  font-size: 0.6rem;
  color: #6b7686;
  margin-left: 0.2rem;
  white-space: nowrap;
}

.order-strip__pending strong {
  color: #0c1a3a;
  font-weight: 700;
}

@media (max-width: 1023px) {
  .order-strip {
    display: none;
  }

  .ui-page-header--vendify.ui-page-header--welcome .ui-page-header__intro {
    max-width: 100%;
  }
}

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

.ui-page-header--vendify.ui-page-header--with-strip .ui-page-header__intro {
  flex: 0 1 auto;
  min-width: 0;
  max-width: min(22rem, 42vw);
  padding-top: 0;
}

.ui-page-header--vendify.ui-page-header--with-strip .ui-page-header__title {
  font-size: clamp(1.2rem, 1.8vw, 1.4rem) !important;
  line-height: 1.15 !important;
  margin: 0 !important;
}

.ui-page-header--vendify.ui-page-header--with-strip .ui-page-header__subtitle {
  margin-top: 0.1rem !important;
  font-size: 0.75rem !important;
  line-height: 1.25 !important;
}

/* Sit beside welcome (= left of Elart profile), not pushed to far right */
.ui-page-header__status-slot {
  flex: 0 1 auto;
  width: min(22rem, 52vw);
  max-width: min(22rem, 52vw);
  min-width: 16rem;
  margin-left: 0 !important;
  margin-right: 0;
}

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

.ui-page-header__emoji {
  display: inline-block;
  margin-left: 0.2rem;
  font-size: 0.92em;
  line-height: 1;
  vertical-align: middle;
  transform-origin: 70% 70%;
  animation: ui-welcome-wave 2.8s ease-in-out infinite;
}

@keyframes ui-welcome-wave {
  0%,
  72%,
  100% {
    transform: rotate(0deg);
  }
  12% {
    transform: rotate(16deg);
  }
  24% {
    transform: rotate(-10deg);
  }
  36% {
    transform: rotate(14deg);
  }
  48% {
    transform: rotate(0deg);
  }
}

.ui-status-strip--header {
  width: 100%;
  max-width: 100%;
  padding: 0 !important;
  gap: 0.28rem !important;
  background: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

.ui-status-strip--header .ui-status-strip__footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  padding: 0;
  width: 100%;
  min-height: 0;
}

.ui-status-strip--header .ui-status-strip__label {
  font-size: 0.625rem;
  letter-spacing: 0.01em;
  text-transform: none;
  font-weight: 600;
  color: #71717a;
  gap: 0.3rem;
}

.ui-status-strip--header .ui-status-strip__title {
  white-space: nowrap;
}

.ui-status-strip--header .ui-status-strip__dot {
  width: 5px;
  height: 5px;
  background: #22c55e;
  box-shadow: 0 0 0 2px rgba(34, 197, 94, 0.22);
}

.ui-status-strip--header .ui-status-strip__last-check,
.ui-status-strip--header .ui-status-strip__badge[data-dashboard-last-check] {
  font-size: 0.625rem;
  font-weight: 500;
  color: #a1a1aa;
  padding: 0;
  border: none;
  background: transparent;
  white-space: nowrap;
  text-align: right;
}

.ui-status-strip--header .ui-status-strip__scroll {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.35rem !important;
  width: 100%;
  min-width: 0;
  max-width: 100%;
  overflow: visible !important;
  padding: 0 !important;
}

.ui-status-strip--header .ui-status-cell {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: flex-start !important;
  text-align: left !important;
  min-height: 0 !important;
  height: auto !important;
  min-height: 2.15rem !important;
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
  padding: 0.32rem 0.5rem 0.32rem 0.4rem !important;
  border-radius: 10px !important;
  gap: 0.35rem !important;
  overflow: hidden;
  border: 1px solid rgba(15, 23, 42, 0.07) !important;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04) !important;
}

.ui-status-strip--header .ui-status-cell__content {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  gap: 0.05rem;
  min-width: 0;
  flex: 1 1 auto;
  padding-right: 0;
}

.ui-status-strip--header .ui-status-cell:hover {
  transform: translateY(-1px);
  box-shadow: 0 4px 10px rgba(15, 23, 42, 0.06) !important;
}

.ui-status-strip--header .ui-status-cell__icon {
  width: 1.45rem !important;
  height: 1.45rem !important;
  flex-shrink: 0;
}

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

.ui-status-strip--header .ui-status-cell__label {
  font-size: 0.5625rem !important;
  font-weight: 600 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  line-height: 1.15 !important;
  max-height: none !important;
  overflow: visible !important;
  text-overflow: unset !important;
  white-space: nowrap !important;
  color: #64748b !important;
  width: auto !important;
}

.ui-status-strip--header .ui-status-cell__value,
.ui-status-strip--header [data-api-strip-pending],
.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.875rem !important;
  font-weight: 800 !important;
  line-height: 1 !important;
  margin-top: 0 !important;
  text-align: left !important;
  width: auto !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;
    gap: 0.4rem;
  }

  .ui-page-header--vendify.ui-page-header--with-strip .ui-page-header__intro {
    max-width: 100%;
  }

  .ui-page-header__status-slot {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    margin-left: 0 !important;
  }

  .ui-status-strip--header .ui-status-strip__scroll {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    width: 100%;
  }
}

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

/* Hidden from customers. Staff: click logo version or open ?ops=1 */
html:not([data-ops-status="1"]) .ui-data-status-bar {
  display: none !important;
}

.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,
.ui-header-toolbar__trailing .ui-store-badge,
.ui-header-toolbar__row .ui-pill-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__trailing {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 0.5rem;
  flex: 0 0 auto;
  margin-left: auto;
  min-width: 0;
}

.ui-header-toolbar__trailing .ui-live-refresh-btn {
  flex-shrink: 0;
}

.ui-header-toolbar__row .ui-store-badge,
.ui-header-toolbar__trailing .ui-store-badge,
.ui-header-toolbar__row .ui-pill-badge.ui-store-badge {
  flex: 0 0 auto;
  margin-left: 0;
  align-self: center;
  justify-content: center;
  align-items: center;
  max-width: min(100%, 18rem);
  white-space: nowrap;
}

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

  .ui-header-toolbar__trailing {
    margin-left: 0;
    width: 100%;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: center;
    gap: 0.5rem;
  }

  .ui-header-toolbar__trailing .ui-live-refresh-btn {
    flex: 0 0 auto;
  }

  .ui-header-toolbar__trailing .ui-store-badge,
  .ui-header-toolbar__trailing .ui-pill-badge.ui-store-badge {
    flex: 0 1 auto;
    max-width: min(100%, 14.5rem);
  }
}

@media (max-width: 639px) {
  .ui-header-toolbar__row .ui-store-badge,
  .ui-header-toolbar__row .ui-pill-badge.ui-store-badge {
    max-width: 100%;
  }
}

/* ─── Unified pill badges (store, period, KPI) ─── */
.ui-pill-badge,
.ui-store-badge,
.ui-badge-soft {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.4rem;
  min-height: 2.625rem;
  height: 2.625rem;
  padding: 0 0.875rem;
  box-sizing: border-box;
  border-radius: 999px;
  line-height: 1.15;
  font-weight: 700;
  vertical-align: middle;
  max-width: 100%;
  min-width: 0;
  white-space: nowrap;
}

.ui-badge-soft {
  font-size: 0.6875rem;
  padding: 0 0.75rem;
}

.ui-badge-soft > strong,
.ui-pill-badge > strong {
  font-weight: 800;
}

.ui-badge-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem;
}

.ui-store-badge.ui-pill-badge {
  line-height: 1;
  font-weight: 600;
}

.ui-store-badge {
  border: 1px solid var(--ke-orange-border);
  background: var(--ke-orange-soft);
  box-shadow: var(--ke-shadow);
  flex-wrap: nowrap;
  gap: 0.5rem;
  align-items: center;
  justify-content: center;
  line-height: 1;
  font-size: 0.75rem;
  font-weight: 600;
}

.ui-store-badge__label,
.ui-store-badge__name,
.ui-store-badge__id {
  display: inline-block;
  margin: 0;
  padding: 0;
  font-size: 0.75rem;
  line-height: 1;
  vertical-align: middle;
}

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

.ui-store-badge__name {
  font-weight: 800;
  color: var(--ke-navy);
  letter-spacing: -0.01em;
  max-width: min(8rem, 36vw);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.ui-store-badge__id {
  font-weight: 600;
  color: var(--ke-text-muted);
  white-space: nowrap;
}

.ui-store-badge__id[hidden] {
  display: none !important;
}

/* Legacy selectors — cached DOM */
.ui-store-badge__meta,
.ui-store-badge__meta[hidden],
.ui-store-badge__sep,
.ui-store-badge__dot {
  display: none !important;
}

.ui-live-refresh-btn,
#drLiveRefresh {
  background: #ff6b35;
  background-image: none;
  color: #ffffff;
  border: 1px solid #e85a24;
  font-weight: 700;
  box-shadow: 0 2px 10px rgba(255, 107, 53, 0.38);
  transition:
    transform 0.22s cubic-bezier(0.34, 1.2, 0.64, 1),
    box-shadow 0.22s ease,
    background-color 0.2s ease,
    filter 0.2s ease;
  will-change: transform;
}

.ui-live-refresh-btn:hover:not(:disabled),
#drLiveRefresh:hover:not(:disabled) {
  background: #ff7f4f;
  background-image: none;
  border-color: #e85a24;
  color: #ffffff;
  transform: translateY(-2px) scale(1.04);
  box-shadow: 0 8px 20px rgba(255, 107, 53, 0.48);
  filter: brightness(1.06);
}

.ui-live-refresh-btn:hover:not(:disabled) [data-dashboard-live-refresh-icon],
#drLiveRefresh:hover:not(:disabled) [data-dashboard-live-refresh-icon] {
  animation: ui-live-refresh-icon-pop 0.55s ease;
}

.ui-live-refresh-btn:active:not(:disabled),
#drLiveRefresh:active:not(:disabled) {
  transform: translateY(0) scale(0.97);
  box-shadow: 0 2px 8px rgba(255, 107, 53, 0.32);
  filter: brightness(0.98);
}

.ui-live-refresh-btn:disabled,
#drLiveRefresh:disabled {
  opacity: 0.72;
  cursor: wait;
  transform: none;
  box-shadow: 0 2px 6px rgba(255, 107, 53, 0.2);
}

@keyframes ui-live-refresh-icon-pop {
  0% {
    transform: scale(1);
  }
  45% {
    transform: scale(1.22) rotate(-6deg);
  }
  100% {
    transform: scale(1);
  }
}

.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: #ffffff !important;
  border: 1px solid #e4e4e7 !important;
  border-radius: 1rem !important;
  box-shadow: none !important;
  color: var(--ke-text) !important;
  transition:
    border-color 0.15s ease,
    background-color 0.15s 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: center;
  justify-content: space-between;
  gap: 0.5rem;
  margin-bottom: 0.375rem;
  position: relative;
  z-index: 1;
  min-width: 0;
}

.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--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: 1 1 auto;
  min-width: 0;
  max-width: 52%;
}

.ui-ai-health-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.85rem;
  height: 1.85rem;
  border-radius: 999px;
  flex-shrink: 0;
}

.ui-ai-health-badge--ok {
  background: #ecfdf5;
  border: 1px solid #a7f3d0;
  box-shadow: 0 0 0 3px rgba(34, 197, 94, 0.08);
}

.ui-ai-health-badge--warn {
  background: #fffbeb;
  border: 1px solid #fde68a;
  box-shadow: 0 0 0 3px rgba(245, 158, 11, 0.08);
}

.ui-ai-health-dot {
  position: relative;
  width: 0.5rem;
  height: 0.5rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.ui-ai-health-dot__core {
  position: relative;
  width: 0.5rem;
  height: 0.5rem;
  border-radius: 999px;
  background: #22c55e;
}

.ui-ai-health-badge--warn .ui-ai-health-dot__core {
  background: #f59e0b;
}

.ui-ai-health-dot__ping {
  position: absolute;
  inset: 0;
  border-radius: 999px;
  background: #22c55e;
  opacity: 0.55;
  animation: ui-ai-health-ping 2s cubic-bezier(0, 0, 0.2, 1) infinite;
}

.ui-ai-health-badge--warn .ui-ai-health-dot__ping {
  background: #f59e0b;
}

@keyframes ui-ai-health-ping {
  0% {
    transform: scale(1);
    opacity: 0.55;
  }
  70% {
    transform: scale(2.2);
    opacity: 0;
  }
  100% {
    transform: scale(2.2);
    opacity: 0;
  }
}

.ui-ai-health-hint {
  font-size: 0.6875rem;
  line-height: 1.45;
}

.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;
}

/* ─── Dashboard AI card (sidekick row) ─── */
.ui-dashboard-ai-card__header {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  margin-bottom: 0.65rem;
}

.ui-dashboard-ai-card__star {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #ff6b35;
  font-size: 1.125rem;
  line-height: 1;
  flex-shrink: 0;
}

.ui-dashboard-ai-card__title {
  font-family: var(--ke-font-display);
  font-size: 1.0625rem;
  font-weight: 800;
  color: var(--ke-navy);
  letter-spacing: -0.02em;
  line-height: 1.2;
}

.ui-dashboard-ai-card__body {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  flex: 1;
  min-height: 0;
}

.ui-dashboard-ai-card__cta {
  margin-top: 0.35rem;
  width: fit-content;
  padding: 0.45rem 0.8rem;
  border-radius: 10px;
  border: 1px solid #e4e4e7;
  background: #ffffff;
  font-size: 0.75rem;
  font-weight: 600;
  color: #18181b;
  transition:
    border-color 0.15s ease,
    background-color 0.15s ease;
}

.ui-dashboard-ai-card__cta:hover {
  border-color: #d4d4d8;
  background: #fafafa;
}

.ui-dashboard-ai-card .ui-ai-health-hint {
  font-size: 0.6875rem;
  line-height: 1.45;
  color: #71717a;
}

/* ─── İptal / İade ciro kaybı widgets ─── */
.ui-loss-widget__header {
  align-items: center;
  margin-bottom: 0.85rem !important;
}

.ui-loss-widget__grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.5rem;
  flex: 1;
}

.ui-loss-widget__cell {
  border-radius: 14px;
  padding: 0.72rem 0.8rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 0.15rem;
  min-height: 4.35rem;
  box-sizing: border-box;
}

.ui-loss-widget__label {
  font-size: 0.625rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #71717a;
  line-height: 1.2;
}

.ui-loss-widget__label--accent {
  color: #ea580c;
}

.ui-loss-widget__value {
  font-family: var(--ke-font-display);
  font-size: 1.5rem;
  font-weight: 800;
  line-height: 1.05;
  color: var(--ke-navy);
  letter-spacing: -0.02em;
}

.ui-loss-widget__value--accent {
  color: #ff6b35;
  font-size: 1.35rem;
}

.ui-loss-widget__note {
  font-size: 0.6875rem;
  color: #a1a1aa;
  line-height: 1.25;
}

.ui-loss-widget__link {
  margin-top: 0.15rem;
  padding: 0;
  border: none;
  background: transparent;
  font-size: 0.75rem;
  font-weight: 700;
  color: #ff6b35;
  text-align: left;
  cursor: pointer;
  transition: color 0.15s ease;
}

.ui-loss-widget__link:hover {
  color: #ea580c;
}

.dashboard-cancel-loss-widget .ui-loss-widget__cell--count,
.dashboard-cancel-loss-widget .ui-loss-widget__cell--amount {
  background: #fff8eb;
  border: 1px solid #ffe4b8;
}

.dashboard-cancel-loss-widget
  .ui-loss-widget__cell--count
  .ui-loss-widget__label {
  color: #ea580c;
}

.dashboard-return-loss-widget .ui-loss-widget__cell--return {
  background: #fdf2f8;
  border: 1px solid #fbcfe8;
}

.dashboard-return-loss-widget
  .ui-loss-widget__cell--return
  .ui-loss-widget__label,
.dashboard-return-loss-widget
  .ui-loss-widget__cell--return
  .ui-loss-widget__value {
  color: #db2777;
}

.dashboard-return-loss-widget .ui-loss-widget__cell--amount {
  background: #fff8eb;
  border: 1px solid #ffe4b8;
}

.dashboard-cancel-loss-widget .ui-loss-widget__cell--rate,
.dashboard-cancel-loss-widget .ui-loss-widget__cell--link,
.dashboard-return-loss-widget .ui-loss-widget__cell--rate,
.dashboard-return-loss-widget .ui-loss-widget__cell--link {
  background: #f8fafc;
  border: 1px solid #eef2f6;
}

.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);
}

.ui-dashboard-sidekick__metric.ui-widget--plain .ui-ai-card-body,
.ui-dashboard-sidekick__metric .ui-dashboard-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-pending],
  .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.75rem;
  padding: 1.5rem;
  border-radius: var(--vf-radius-card, 1rem);
  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;
  box-sizing: border-box;
}

@media (min-width: 1280px) {
  .ui-ai-insights {
    padding: 2rem;
  }
}

.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.28rem;
  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.3rem 0.62rem;
}

.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.3rem 0.62rem;
  }
}

@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,
.ui-status-strip__footer {
  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-pending],
[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;
}

/* Pending (Yeni + İşlemde) — matches Trendyol "Bekleyen Siparişler" */
.ui-status-cell--pending {
  background: #ecfdf5;
}

.ui-status-cell--pending::before {
  background: linear-gradient(180deg, #34d399 0%, #059669 100%);
}

.ui-status-cell--pending .ui-status-cell__icon {
  color: #047857;
  background: rgba(167, 243, 208, 0.55);
}

.ui-status-cell--pending .ui-status-cell__value,
[data-api-strip-pending] {
  color: #065f46 !important;
}

/* 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;
}

/* ─── 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;
  border: none !important;
  background: transparent !important;
  box-shadow: none !important;
  outline: none !important;
  -webkit-appearance: none;
  appearance: none;
}

.ui-header-toolbar__controls input[type="date"]:focus,
#date-range-picker input:focus {
  border: none !important;
  box-shadow: none !important;
  outline: none !important;
}

/* Compact custom popover (mobile / narrow) — see panel-date-popover.js */
.ui-panel-date-popover {
  position: fixed;
  z-index: 10050;
  width: min(16.25rem, calc(100vw - 1.25rem));
  padding: 0.45rem 0.5rem 0.5rem;
  border: 1px solid var(--ke-border);
  border-radius: 12px;
  background: #ffffff;
  box-shadow: 0 10px 28px rgba(15, 23, 42, 0.14);
  font-size: 0.75rem;
  color: var(--ke-text);
}

.ui-panel-date-popover.hidden {
  display: none !important;
}

.ui-panel-date-popover__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.35rem;
  margin-bottom: 0.35rem;
}

.ui-panel-date-popover__title {
  flex: 1;
  text-align: center;
  font-size: 0.8125rem;
  font-weight: 700;
  color: var(--ke-ink);
}

.ui-panel-date-popover__nav {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.75rem;
  height: 1.75rem;
  border: 1px solid var(--ke-border);
  border-radius: 8px;
  background: #fff;
  color: var(--ke-text-secondary);
  cursor: pointer;
}

.ui-panel-date-popover__nav:hover {
  background: var(--ke-surface-2);
}

.ui-panel-date-popover__weekdays {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 0.15rem;
  margin-bottom: 0.2rem;
  text-align: center;
  font-size: 0.625rem;
  font-weight: 700;
  color: var(--ke-text-muted);
}

.ui-panel-date-popover__grid {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 0.15rem;
}

.ui-panel-date-popover__day {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.85rem;
  height: 1.85rem;
  margin: 0 auto;
  border: none;
  border-radius: 8px;
  background: transparent;
  font-size: 0.6875rem;
  font-weight: 600;
  color: var(--ke-text);
  cursor: pointer;
}

.ui-panel-date-popover__day.is-empty {
  pointer-events: none;
}

.ui-panel-date-popover__day.is-selected {
  background: #2563eb;
  color: #ffffff;
}

.ui-panel-date-popover__day.is-disabled {
  opacity: 0.35;
  cursor: not-allowed;
}

.ui-panel-date-popover__footer {
  display: flex;
  justify-content: space-between;
  gap: 0.5rem;
  margin-top: 0.45rem;
  padding-top: 0.35rem;
  border-top: 1px solid var(--ke-border);
}

.ui-panel-date-popover__footer button {
  border: none;
  background: transparent;
  font-size: 0.75rem;
  font-weight: 600;
  color: #2563eb;
  cursor: pointer;
  padding: 0.15rem 0.25rem;
}

@media (max-width: 1023px) {
  /* Avoid oversized native calendar — custom popover handles open */
  .ui-header-toolbar__controls input[type="date"]::-webkit-calendar-picker-indicator,
  #date-range-picker input::-webkit-calendar-picker-indicator {
    display: none;
    -webkit-appearance: none;
    appearance: none;
  }
}

.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 on intentional surfaces (no inherit * — avoids icon lag on active) */
.ui-kpi--orange,
.ui-kpi--orange *,
.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,
.ui-nav-link--active,
.sidebar-nav-link-active > span:not(.menu-tier-pill):not(.menu-tier-chip),
.ui-nav-link--active > span:not(.menu-tier-pill):not(.menu-tier-chip) {
  color: #ffffff !important;
}

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

/* Tier pills on active nav — readable on dark background */
.sidebar-nav-link-active .menu-tier-pill,
.sidebar-nav-link-active .menu-tier-chip,
.ui-nav-link--active .menu-tier-pill,
.ui-nav-link--active .menu-tier-chip {
  color: #fdba74 !important;
  background: rgba(255, 255, 255, 0.12) !important;
  border-color: rgba(255, 255, 255, 0.26) !important;
}

.sidebar-nav-link-active .menu-tier-pill--pro,
.sidebar-nav-link-active .menu-tier-pill--cari,
.sidebar-nav-link-active .menu-tier-chip--cari,
.ui-nav-link--active .menu-tier-pill--pro,
.ui-nav-link--active .menu-tier-pill--cari,
.ui-nav-link--active .menu-tier-chip--cari {
  color: #e2e8f0 !important;
}

.sidebar-nav-link-active .menu-tier-pill__text,
.sidebar-nav-link-active .menu-tier-pill__label,
.ui-nav-link--active .menu-tier-pill__text,
.ui-nav-link--active .menu-tier-pill__label {
  color: inherit !important;
  -webkit-text-fill-color: inherit !important;
}

.sidebar-nav-link-active .menu-tier-pill__dot,
.ui-nav-link--active .menu-tier-pill__dot {
  background: #34d399 !important;
}

.sidebar-nav-link-active .menu-tier-pill--pro .menu-tier-pill__dot,
.ui-nav-link--active .menu-tier-pill--pro .menu-tier-pill__dot {
  background: #ffffff !important;
}

/* Legacy upsell lock on active row */
.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: #fdba74 !important;
  color: #fdba74 !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;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 2.625rem !important;
  height: 2.625rem !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  line-height: 1 !important;
  font-size: 0.75rem !important;
  font-weight: 600 !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 .ui-store-badge__label,
#active-store-badge .ui-store-badge__name,
#active-store-badge .ui-store-badge__id {
  font-size: 0.75rem !important;
  line-height: 1 !important;
}

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

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

.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: 10px;
  overflow: hidden;
  font-size: 0.75rem;
}

.legacy-view-root main .pcq-data-table thead th {
  border-bottom: 2px solid #cbd5e1 !important;
  border-right: 1px solid #e2e8f0 !important;
  background: #f8fafc !important;
  padding-top: 0.375rem !important;
  padding-bottom: 0.375rem !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;
  padding-top: 0.375rem !important;
  padding-bottom: 0.375rem !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.pcq-table__index,
.legacy-view-root main .pcq-data-table td.pcq-table__index,
.legacy-app-shell main .pcq-data-table th.pcq-table__index,
.legacy-app-shell main .pcq-data-table td.pcq-table__index,
.pcq-page .pcq-data-table .pcq-table__index {
  width: 2rem !important;
  max-width: 2rem !important;
  min-width: 2rem !important;
  padding-left: 0.5rem !important;
  padding-right: 0.25rem !important;
  text-align: left !important;
}

.legacy-view-root main .pcq-data-table th.pcq-table__product,
.legacy-view-root main .pcq-data-table td.pcq-table__product,
.legacy-app-shell main .pcq-data-table th.pcq-table__product,
.legacy-app-shell main .pcq-data-table td.pcq-table__product,
.pcq-page .pcq-data-table .pcq-table__product {
  width: 36% !important;
  max-width: none !important;
  min-width: 11rem !important;
}

.legacy-view-root main .pcq-data-table th.pcq-table__content,
.legacy-view-root main .pcq-data-table td.pcq-table__content {
  width: 11rem !important;
  min-width: 9rem !important;
}

.legacy-view-root main .pcq-data-table th.pcq-table__bool,
.legacy-view-root main .pcq-data-table td.pcq-table__bool,
.legacy-view-root main .pcq-data-table th.pcq-table__attrs,
.legacy-view-root main .pcq-data-table td.pcq-table__attrs {
  display: none !important;
}

.legacy-view-root main .pcq-data-table th.pcq-table__issues,
.legacy-view-root main .pcq-data-table td.pcq-table__issues {
  width: auto !important;
  min-width: 14rem !important;
}

.legacy-view-root main .pcq-data-table th.pcq-table__score,
.legacy-view-root main .pcq-data-table td.pcq-table__score {
  width: 3.25rem !important;
}

.legacy-view-root main .pcq-data-table th.pcq-table__status,
.legacy-view-root main .pcq-data-table td.pcq-table__status {
  width: 4.5rem !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-pending],
.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-pending] {
  color: #065f46 !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-top: 0.25rem;
  margin-bottom: 1.125rem;
  border-radius: 1rem;
  border: 1px solid #e4e4e7;
  background: #ffffff;
}

/* Ürün listesi toolbar */
.uk-list-toolbar {
  padding: 1.25rem 1.5rem 0;
}

@media (min-width: 1024px) {
  .uk-list-toolbar {
    padding: 1.5rem 2rem 0;
  }
}

.uk-list-toolbar__head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.75rem 1rem;
  margin-bottom: 0.875rem;
}

.uk-list-toolbar__eyebrow {
  display: block;
  font-size: 0.6875rem;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #a1a1aa;
}

.uk-list-toolbar__title {
  margin: 0.25rem 0 0;
  font-size: 1.0625rem;
  font-weight: 700;
  letter-spacing: -0.02em;
  color: #18181b;
  line-height: 1.3;
}

.uk-list-toolbar__status {
  flex-shrink: 0;
  font-size: 0.75rem;
  font-weight: 500;
  color: #71717a;
  text-align: right;
  line-height: 1.4;
  max-width: 14rem;
}

.uk-list-toolbar__body {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

@media (min-width: 1024px) {
  .uk-list-toolbar__body {
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.625rem 0.75rem;
  }

  .uk-list-toolbar__search {
    flex: 1 1 14rem;
    min-width: 12rem;
    max-width: 24rem;
  }

  .uk-list-toolbar__actions {
    flex: 0 0 auto;
  }
}

.uk-list-toolbar__search {
  width: 100%;
  min-width: 0;
}

.uk-list-search-input {
  width: 100%;
  padding: 0.5rem 0.875rem 0.5rem 2.5rem;
  border-radius: 9999px;
  border: 1px solid #e4e4e7;
  background: #fafafa;
  font-size: 0.8125rem;
  color: #18181b;
  transition:
    border-color 0.15s ease,
    background 0.15s ease;
}

.uk-list-search-input::placeholder {
  color: #a1a1aa;
}

.uk-list-search-input:focus {
  outline: none;
  border-color: #a1a1aa;
  background: #ffffff;
}

.uk-list-toolbar__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.375rem;
  width: 100%;
}

@media (min-width: 640px) {
  .uk-list-toolbar__actions {
    width: auto;
  }
}

.uk-list-action-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.35rem;
  flex: 1 1 auto;
  min-width: 0;
  padding: 0.5rem 0.875rem;
  border-radius: 0.5rem;
  border: 1px solid #e4e4e7;
  background: #ffffff;
  color: #3f3f46;
  font-size: 0.8125rem;
  font-weight: 500;
  line-height: 1.2;
  white-space: nowrap;
  transition:
    background 0.15s ease,
    border-color 0.15s ease,
    color 0.15s ease;
}

.uk-list-action-btn i {
  font-size: 1rem;
}

.uk-list-action-btn:hover {
  background: #f4f4f5;
  border-color: #d4d4d8;
}

.uk-list-action-btn--primary {
  background: #18181b;
  border-color: #18181b;
  color: #ffffff;
}

.uk-list-action-btn--primary:hover {
  background: #27272a;
  border-color: #27272a;
  color: #ffffff;
}

.uk-list-toolbar__hint {
  margin: 0.75rem 0 0;
  padding-top: 0.75rem;
  border-top: 1px solid #f4f4f5;
  font-size: 0.75rem;
  line-height: 1.45;
  color: #71717a;
}

.uk-list-toolbar__hint--warn {
  color: #b45309;
}

.uk-list-toolbar__hint--ok {
  color: #047857;
}

.uk-profit-section .uk-profit-table-panel {
  padding: 1rem 1.5rem 1.25rem;
}

@media (min-width: 1024px) {
  .uk-profit-section .uk-profit-table-panel {
    padding: 1rem 2rem 1.5rem;
  }
}

.uk-profit-table-panel .uk-profit-table-wrap {
  border: 1px solid #e4e4e7;
  border-radius: 0.75rem;
  background: #ffffff;
  overflow: hidden;
}

.uk-profit-section #ukPagination,
.uk-profit-section [data-uk-scroll-hint] {
  padding-left: 1.5rem;
  padding-right: 1.5rem;
}

@media (min-width: 1024px) {
  .uk-profit-section #ukPagination,
  .uk-profit-section [data-uk-scroll-hint] {
    padding-left: 2rem;
    padding-right: 2rem;
  }
}
.uk-summary-kpi-grid {
  gap: 1rem;
}

@media (min-width: 768px) {
  .uk-summary-kpi-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (min-width: 1280px) {
  .uk-summary-kpi-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

.uk-summary-kpi {
  min-height: 7.25rem;
  padding: 1rem 1.15rem;
  border-radius: 1rem;
  box-shadow: none;
  transition:
    transform 0.15s ease,
    box-shadow 0.15s ease,
    border-color 0.15s ease;
}

.uk-summary-kpi:hover {
  transform: translateY(-2px);
  box-shadow: 0 10px 28px rgba(15, 23, 42, 0.07);
}

.uk-summary-kpi--violet {
  background: linear-gradient(145deg, #f5f3ff 0%, #ede9fe 100%);
  border-color: #ddd6fe;
}

.uk-summary-kpi--violet .ui-vendify-kpi__icon {
  background: rgba(124, 58, 237, 0.12);
  color: #7c3aed;
}

.uk-summary-kpi--sky {
  background: linear-gradient(145deg, #eff6ff 0%, #e0f2fe 100%);
  border-color: #bae6fd;
}

.uk-summary-kpi--sky .ui-vendify-kpi__icon {
  background: rgba(14, 165, 233, 0.12);
  color: #0284c7;
}

.uk-summary-kpi--amber {
  background: linear-gradient(145deg, #fffbeb 0%, #fef3c7 100%);
  border-color: #fde68a;
}

.uk-summary-kpi--amber .ui-vendify-kpi__icon {
  background: rgba(245, 158, 11, 0.14);
  color: #d97706;
}

.uk-summary-kpi--mint {
  background: linear-gradient(145deg, #ecfdf5 0%, #d1fae5 100%);
  border-color: #a7f3d0;
}

.uk-summary-kpi--mint .ui-vendify-kpi__icon {
  background: rgba(16, 185, 129, 0.14);
  color: #059669;
}

.uk-summary-kpi .ui-vendify-kpi__label {
  margin-top: 0.45rem;
  font-size: 0.6875rem;
  letter-spacing: 0.06em;
  color: #64748b;
}

.uk-summary-kpi .ui-vendify-kpi__value {
  color: #0f172a;
  font-size: clamp(1.3rem, 2.2vw, 1.65rem);
  font-weight: 800;
}

.uk-summary-kpi .ui-vendify-kpi__meta {
  margin-top: 0.25rem;
  font-size: 0.75rem;
  color: #64748b;
}

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

.uk-summary-kpi .uk-profit-stack__kpi-compact-main {
  font-size: 0.9375rem;
  font-weight: 800;
  line-height: 1.2;
}

.uk-summary-kpi .uk-profit-rate-pct--kpi-compact {
  font-size: 0.75rem;
  font-weight: 700;
  line-height: 1.2;
}

.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;
  padding: 0.55rem 0.85rem !important;
}

.ui-profit-source-note--uk > i {
  margin-right: 0.25rem;
}

.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 {
  width: 100%;
  min-width: 82rem;
  table-layout: auto;
  border-collapse: collapse;
  border-spacing: 0;
  font-size: 0.8125rem;
  font-variant-numeric: tabular-nums;
}

.uk-profit-table thead th {
  position: sticky;
  top: 0;
  z-index: 2;
  padding: 0.625rem 0.75rem;
  font-size: 0.75rem;
  font-weight: 600;
  line-height: 1.35;
  color: #52525b;
  background: #f4f4f5;
  border-bottom: 1px solid #e4e4e7;
  vertical-align: bottom;
  white-space: normal;
  overflow: visible;
  text-transform: none;
  letter-spacing: 0;
  box-shadow: 0 1px 0 #e4e4e7;
}

.uk-profit-th--left {
  text-align: left;
}

.uk-profit-th--right {
  text-align: right;
}

.uk-profit-th--rank {
  width: 2.5rem;
  min-width: 2.5rem;
  padding-left: 1rem;
}

.uk-profit-th--product {
  min-width: 14rem;
  width: 20%;
}

.uk-profit-th--qty {
  min-width: 3.75rem;
}

.uk-profit-th--money {
  min-width: 6.75rem;
}

.uk-profit-th--money-sm {
  min-width: 5.25rem;
}

.uk-profit-th--commission {
  min-width: 7rem;
}

.uk-profit-th--rate {
  min-width: 5.5rem;
  padding-right: 1rem;
}

.uk-profit-th__label {
  display: block;
  line-height: 1.3;
}

.uk-profit-th__hint {
  display: block;
  margin-top: 0.125rem;
  font-size: 0.6875rem;
  font-weight: 500;
  line-height: 1.25;
  color: #a1a1aa;
}

.uk-profit-table__empty {
  padding: 2.5rem 1rem;
  text-align: center;
  font-size: 0.875rem;
  color: #71717a;
}

.uk-profit-table tbody td {
  padding: 0.5rem 0.75rem;
  vertical-align: top;
  color: var(--ke-text, #18181b);
  border-bottom: 1px solid #f4f4f5;
  background: #ffffff;
}

.uk-profit-table tbody td:first-child {
  padding-left: 1rem;
}

.uk-profit-table tbody td:last-child {
  padding-right: 1rem;
}

.uk-profit-table-row:last-child td {
  border-bottom: none;
}

.uk-profit-table-row:hover td {
  background: #fafafa;
}

/* Legacy col widths — kept for any remaining colgroup usage */
.uk-profit-col-rank {
  width: 2.5rem;
}
.uk-profit-col-product {
  width: 18%;
  min-width: 14rem;
}
.uk-profit-col-qty {
  width: 3.75rem;
}
.uk-profit-col-money {
  width: 6.75rem;
  min-width: 6.75rem;
}
.uk-profit-col-money-sm {
  width: 5.25rem;
  min-width: 5.25rem;
}
.uk-profit-col-commission {
  width: 7rem;
  min-width: 7rem;
}
.uk-profit-col-rate {
  width: 5.5rem;
  min-width: 5.5rem;
}

/* Product profitability: click-to-open detail modal */
.uk-profit-detail-modal {
  position: fixed;
  inset: 0;
  z-index: 10060;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1rem;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.18s ease;
}
.uk-profit-detail-modal.hidden {
  display: none !important;
}
.uk-profit-detail-modal.is-open {
  opacity: 1;
  pointer-events: auto;
}
.uk-profit-detail-modal__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(15, 23, 42, 0.42);
  backdrop-filter: blur(5px);
  -webkit-backdrop-filter: blur(5px);
}
.uk-profit-detail-modal__stage {
  position: relative;
  z-index: 1;
  width: min(28rem, calc(100vw - 1.5rem));
  max-height: min(92vh, 40rem);
  overflow: auto;
  transform: translateY(10px) scale(0.98);
  transition: transform 0.2s cubic-bezier(0.22, 1, 0.36, 1);
}
.uk-profit-detail-modal.is-open .uk-profit-detail-modal__stage {
  transform: translateY(0) scale(1);
}
.uk-profit-detail-modal__panel {
  position: relative;
  border-radius: 1.125rem;
  border: 1px solid rgba(226, 232, 240, 0.95);
  background:
    radial-gradient(
      120% 80% at 0% 0%,
      rgba(16, 185, 129, 0.08),
      transparent 55%
    ),
    radial-gradient(
      100% 70% at 100% 0%,
      rgba(14, 165, 233, 0.07),
      transparent 50%
    ),
    #ffffff;
  box-shadow:
    0 24px 64px rgba(15, 23, 42, 0.22),
    0 2px 0 rgba(255, 255, 255, 0.7) inset;
  overflow: hidden;
}
.uk-profit-detail-modal__close {
  position: absolute;
  top: 0.75rem;
  right: 0.75rem;
  z-index: 2;
  width: 2rem;
  height: 2rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  border: 1px solid #e2e8f0;
  background: rgba(255, 255, 255, 0.92);
  color: #475569;
  cursor: pointer;
  transition:
    background 0.15s ease,
    color 0.15s ease,
    border-color 0.15s ease;
}
.uk-profit-detail-modal__close:hover {
  background: #f8fafc;
  color: #0f172a;
  border-color: #cbd5e1;
}
.uk-profit-detail-modal__hero {
  display: flex;
  gap: 0.875rem;
  align-items: flex-start;
  padding: 1.15rem 1.15rem 0.95rem;
  padding-right: 3rem;
}
.uk-profit-detail-modal__thumb {
  width: 3.5rem;
  height: 3.5rem;
  border-radius: 0.75rem;
  object-fit: cover;
  border: 1px solid #e2e8f0;
  background: #f8fafc;
  flex-shrink: 0;
}
.uk-profit-detail-modal__thumb--empty {
  background: linear-gradient(145deg, #f1f5f9, #e2e8f0);
}
.uk-profit-detail-modal__eyebrow {
  margin: 0;
  font-size: 0.625rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #64748b;
}
.uk-profit-detail-modal__title {
  margin: 0.25rem 0 0;
  font-size: 0.95rem;
  font-weight: 700;
  line-height: 1.35;
  color: #0f172a;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.uk-profit-detail-modal__meta {
  margin: 0.35rem 0 0;
  font-size: 0.6875rem;
  color: #64748b;
  display: flex;
  flex-wrap: wrap;
  gap: 0.25rem 0.35rem;
}
.uk-profit-detail-modal__grid-head,
.uk-profit-detail-modal__row {
  display: grid;
  grid-template-columns: 1fr minmax(5.5rem, auto) minmax(5rem, auto);
  gap: 0.5rem;
  align-items: baseline;
}
.uk-profit-detail-modal__grid-head {
  padding: 0.35rem 1.15rem;
  font-size: 0.625rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #94a3b8;
  border-top: 1px solid #eef2f7;
  border-bottom: 1px solid #eef2f7;
  background: rgba(248, 250, 252, 0.9);
}
.uk-profit-detail-modal__grid-head span:nth-child(2),
.uk-profit-detail-modal__grid-head span:nth-child(3),
.uk-profit-detail-modal__total,
.uk-profit-detail-modal__unit {
  text-align: right;
  font-variant-numeric: tabular-nums;
}
.uk-profit-detail-modal__body {
  padding: 0.35rem 1.15rem 0.55rem;
  display: flex;
  flex-direction: column;
}
.uk-profit-detail-modal__row {
  padding: 0.45rem 0;
  border-bottom: 1px solid #f1f5f9;
}
.uk-profit-detail-modal__row:last-child {
  border-bottom: none;
}
.uk-profit-detail-modal__label {
  font-size: 0.75rem;
  font-weight: 600;
  color: #475569;
}
.uk-profit-detail-modal__total {
  font-size: 0.8125rem;
  font-weight: 700;
  color: #0f172a;
  font-family:
    ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono",
    "Courier New", monospace;
}
.uk-profit-detail-modal__unit {
  font-size: 0.75rem;
  font-weight: 600;
  color: #64748b;
  font-family:
    ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono",
    "Courier New", monospace;
}
.uk-profit-detail-modal__foot {
  padding: 0.75rem 1.15rem 1rem;
  border-top: 1px solid #e2e8f0;
  background: linear-gradient(180deg, #f8fafc 0%, #ffffff 100%);
}
.uk-profit-detail-modal__row--profit .uk-profit-detail-modal__label,
.uk-profit-detail-modal__row--profit .uk-profit-detail-modal__total,
.uk-profit-detail-modal__row--profit .uk-profit-detail-modal__unit {
  font-size: 0.875rem;
}
.uk-profit-detail-modal__foot.is-profit
  .uk-profit-detail-modal__row--profit
  .uk-profit-detail-modal__total,
.uk-profit-detail-modal__foot.is-profit
  .uk-profit-detail-modal__row--profit
  .uk-profit-detail-modal__unit,
.uk-profit-detail-modal__foot.is-profit .uk-profit-detail-modal__rate {
  color: #047857;
}
.uk-profit-detail-modal__foot.is-loss
  .uk-profit-detail-modal__row--profit
  .uk-profit-detail-modal__total,
.uk-profit-detail-modal__foot.is-loss
  .uk-profit-detail-modal__row--profit
  .uk-profit-detail-modal__unit,
.uk-profit-detail-modal__foot.is-loss .uk-profit-detail-modal__rate {
  color: #e11d48;
}
.uk-profit-detail-modal__rate {
  margin-top: 0.35rem;
  text-align: right;
  font-size: 0.75rem;
  font-weight: 600;
  color: #64748b;
}
.uk-profit-detail-modal__rate strong {
  font-weight: 800;
}
.uk-profit-data-row {
  cursor: pointer;
  transition: background-color 0.12s ease;
}
.uk-profit-data-row:hover {
  background: transparent;
}

.uk-profit-data-row:active {
  background: transparent;
}

@media (max-width: 640px) {
  .uk-profit-detail-modal {
    padding: 0.5rem;
    align-items: flex-end;
  }
  .uk-profit-detail-modal__stage {
    width: 100%;
    max-height: 88vh;
  }
  .uk-profit-detail-modal__panel {
    border-radius: 1rem 1rem 0.5rem 0.5rem;
  }
  .uk-profit-detail-modal__grid-head,
  .uk-profit-detail-modal__row {
    grid-template-columns: 1fr minmax(4.75rem, auto) minmax(4.25rem, auto);
    gap: 0.35rem;
  }
}

.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: 14rem;
  max-width: 22rem;
}

.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ı — compact light layout */
.kza-page {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  width: 100%;
  min-width: 0;
  --kza-panel-inset: 1rem;
}

@media (min-width: 768px) {
  .kza-page {
    gap: 1.25rem;
    --kza-panel-inset: 1.25rem;
  }
}

.kza-page .kza-panel-inset {
  padding-inline: var(--kza-panel-inset);
}

.kza-threshold-panel__inner {
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
}

.kza-table-panel {
  margin-top: 0.5rem;
  min-width: 0;
  max-width: 100%;
}

.kza-table-wrap {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  padding-top: 0.75rem;
  padding-bottom: 0.375rem;
  scrollbar-width: thin;
  scrollbar-color: #cbd5e1 transparent;
}

.kza-table-wrap::-webkit-scrollbar {
  height: 6px;
}

.kza-table-wrap::-webkit-scrollbar-thumb {
  border-radius: 999px;
  background: #cbd5e1;
}

.kza-table {
  width: 100%;
  min-width: 54rem;
  table-layout: fixed;
  font-size: 0.8125rem;
  border-collapse: collapse;
}

.kza-table .kza-table__index {
  width: 2rem;
  padding-left: var(--kza-panel-inset) !important;
}

.kza-table .kza-table__product {
  width: 28%;
  min-width: 10rem;
}

.kza-table .kza-table__status {
  width: 6.75rem;
}

.kza-table .kza-table__money {
  width: 5.25rem;
  white-space: nowrap;
}

.kza-table .kza-table__advice {
  width: 16%;
  min-width: 7.5rem;
}

.kza-table-product {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  min-width: 0;
}

.kza-table-product__body {
  flex: 1 1 auto;
  min-width: 0;
}

.kza-table-product__name {
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  word-break: break-word;
}

.kza-table-product__sku {
  margin-top: 0.125rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.kza-table-pagination {
  row-gap: 0.75rem;
}

@media (max-width: 1023px) {
  .kza-table {
    min-width: 50rem;
    font-size: 0.75rem;
  }

  .kza-table .kza-table__product {
    min-width: 9rem;
  }

  .kza-table .kza-table__money {
    width: 4.75rem;
  }

  .kza-table .kza-table__status {
    width: 6.25rem;
  }

  .kza-page .uk-profit-thumb,
  .kza-page .uk-profit-thumb--empty {
    width: 1.5rem;
    height: 1.5rem;
    min-width: 1.5rem;
    min-height: 1.5rem;
  }
}

@media (max-width: 639px) {
  .kza-table {
    min-width: 46rem;
    font-size: 0.6875rem;
  }

  .kza-table th,
  .kza-table td {
    padding-left: 0.375rem !important;
    padding-right: 0.375rem !important;
  }

  .kza-table .kza-table__index {
    width: 1.75rem;
    padding-left: var(--kza-panel-inset) !important;
  }

  .kza-table .kza-table__product {
    min-width: 8rem;
  }

  .kza-table .kza-table__money {
    width: 4.25rem;
  }

  .kza-table .kza-table__status {
    width: 5.5rem;
  }

  .kza-table .kza-table__advice {
    min-width: 6.5rem;
  }
}

.kza-table-panel__head {
  padding-top: 0.75rem;
  padding-bottom: 1rem;
}

.kza-ticker-wrap {
  border-radius: 1rem;
  border: 1px solid #e2e8f0;
  background: linear-gradient(180deg, #f8fafc 0%, #ffffff 100%);
  overflow: hidden;
}

.kza-ticker-wrap--critical {
  border-color: #fda4af;
  background: linear-gradient(135deg, #fff1f2 0%, #fff7ed 52%, #ffffff 100%);
}

.kza-ticker-wrap--warning {
  border-color: #fcd34d;
  background: linear-gradient(135deg, #fffbeb 0%, #fff7ed 55%, #ffffff 100%);
}

.kza-ticker-wrap--calm {
  border-color: #86efac;
  background: linear-gradient(135deg, #ecfdf5 0%, #f8fafc 60%, #ffffff 100%);
}

.kza-ticker-head {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.5rem 0.625rem;
  padding: 0.5rem var(--kza-panel-inset);
  border-bottom: 1px solid #e2e8f0;
}

.kza-ticker-wrap--critical .kza-ticker-head {
  border-bottom-color: #fecdd3;
}

.kza-ticker-wrap--warning .kza-ticker-head {
  border-bottom-color: #fde68a;
}

.kza-ticker-wrap--calm .kza-ticker-head {
  border-bottom-color: #bbf7d0;
}

.kza-ticker-title {
  font-size: 0.625rem;
  text-transform: uppercase;
  letter-spacing: 0.2em;
  font-weight: 700;
  color: #64748b;
}

.kza-ticker-title--critical {
  color: #be123c;
}

.kza-ticker-title--warning {
  color: #b45309;
}

.kza-ticker-title--calm {
  color: #047857;
}

.kza-ticker-meta {
  display: inline-flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.375rem;
  margin-left: auto;
}

.kza-ticker-meta--empty {
  font-size: 0.6875rem;
  color: #94a3b8;
}

.kza-ticker-stat {
  display: inline-flex;
  align-items: center;
  gap: 0.2rem;
  padding: 0.125rem 0.5rem;
  border-radius: 999px;
  border: 1px solid transparent;
  font-size: 0.6875rem;
  font-weight: 600;
  line-height: 1.2;
  white-space: nowrap;
}

.kza-ticker-stat strong {
  font-weight: 800;
}

.kza-ticker-stat--urgent {
  border-color: #fecdd3;
  background: #ffe4e6;
  color: #9f1239;
}

.kza-ticker-stat--margin {
  border-color: #fde68a;
  background: #fef3c7;
  color: #92400e;
}

.kza-ticker-stat--threshold {
  border-color: #c7d2fe;
  background: #eef2ff;
  color: #3730a3;
}

.kza-live-dot {
  display: inline-flex;
  width: 0.5rem;
  height: 0.5rem;
  border-radius: 999px;
  background: #94a3b8;
  flex-shrink: 0;
  animation: kza-pulse 1.8s ease-in-out infinite;
}

.kza-live-dot--critical {
  background: #e11d48;
  box-shadow: 0 0 0 0 rgba(225, 29, 72, 0.45);
}

.kza-live-dot--warning {
  background: #f59e0b;
  box-shadow: 0 0 0 0 rgba(245, 158, 11, 0.4);
}

.kza-live-dot--calm {
  background: #10b981;
  box-shadow: 0 0 0 0 rgba(16, 185, 129, 0.35);
}

.kza-ticker-track {
  display: flex;
  width: max-content;
  gap: 0.5rem;
  padding: 0.625rem var(--kza-panel-inset);
  animation: kza-ticker var(--kza-ticker-duration, 180s) linear infinite;
}

.kza-ticker-wrap:hover .kza-ticker-track {
  animation-play-state: paused;
}

.kza-ticker-chip {
  flex-shrink: 0;
  border-radius: 999px;
  border: 1px solid #e2e8f0;
  background: #ffffff;
  padding: 0.375rem 0.75rem;
  font-size: 0.75rem;
  font-weight: 600;
  line-height: 1.25;
  color: #334155;
  white-space: nowrap;
}

.kza-ticker-chip--loss {
  border-color: #f87171;
  background: linear-gradient(180deg, #fef2f2 0%, #ffe4e6 100%);
  color: #991b1b;
  box-shadow: 0 1px 0 rgba(185, 28, 28, 0.08);
}

.kza-ticker-chip--watch {
  border-color: #fb923c;
  background: linear-gradient(180deg, #fff7ed 0%, #ffedd5 100%);
  color: #9a3412;
  box-shadow: 0 1px 0 rgba(194, 65, 12, 0.08);
}

.kza-ticker-chip--margin {
  border-color: #facc15;
  background: linear-gradient(180deg, #fefce8 0%, #fef9c3 100%);
  color: #854d0e;
  box-shadow: 0 1px 0 rgba(180, 83, 9, 0.08);
}

.kza-ticker-chip--ok {
  border-color: #6ee7b7;
  background: linear-gradient(180deg, #ecfdf5 0%, #d1fae5 100%);
  color: #065f46;
  box-shadow: 0 1px 0 rgba(4, 120, 87, 0.08);
}

.kza-filter-btn--active {
  background: #0f172a !important;
  color: #ffffff !important;
}

.kza-filter-toolbar .ui-header-toolbar {
  width: auto;
  min-width: 0;
}

.kza-filter-toolbar .ui-header-toolbar__row {
  justify-content: flex-start;
}

.kza-filter-toolbar .ui-header-toolbar__controls {
  flex-wrap: wrap;
  gap: 0.375rem;
}

.kza-filter-toolbar__products {
  padding-top: 0.125rem;
}

@media (min-width: 1280px) {
  .kza-filter-toolbar__products {
    padding-top: 0;
  }
}

@keyframes kza-ticker {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-50%);
  }
}

@keyframes kza-pulse {
  0%,
  100% {
    opacity: 0.55;
  }
  50% {
    opacity: 1;
  }
}

@media (prefers-reduced-motion: reduce) {
  .kza-ticker-track,
  .kza-live-dot {
    animation: none !important;
  }
}

/* ═══════════════════════════════════════════════════════════
   OTONOM COMMAND CENTER — light dashboard theme
   ═══════════════════════════════════════════════════════════ */

.legacy-view-root main [data-otonom-command].otonom-page {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
  width: 100%;
  min-height: auto;
  padding: 0;
  border-radius: 0;
  background: transparent;
  color: #0f172a;
}

.otonom-agent-card {
  color: #0f172a;
  background: #ffffff !important;
}

.otonom-agent-card--active {
  background: #ffffff !important;
  box-shadow: none;
}

.otonom-agent-card--active:hover {
  background: #ffffff !important;
  box-shadow: 0 4px 14px rgba(15, 23, 42, 0.06);
}

.otonom-agent-card--build {
  background: #ffffff !important;
  opacity: 1;
}

.otonom-agent-card--build:hover {
  background: #ffffff !important;
}

.otonom-agent-card__title {
  color: #0f172a !important;
}

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

.otonom-agent-card__meta,
.otonom-agent-card__footer {
  color: #64748b !important;
}

.otonom-agent-card__bar {
  box-shadow: none;
}

/* Otonom — Core hub (minimal + card-tone accents) */
.otonom-network-panel {
  background: linear-gradient(180deg, #f8fafc 0%, #f1f5f9 100%);
}

.otonom-core-ambient {
  position: absolute;
  width: 9rem;
  height: 9rem;
  border-radius: 999px;
  pointer-events: none;
  filter: blur(28px);
  opacity: 0.45;
  animation: otonom-ambient-drift 8s ease-in-out infinite;
}

.otonom-core-ambient--emerald {
  top: 8%;
  left: 6%;
  background: rgba(16, 185, 129, 0.22);
}

.otonom-core-ambient--cyan {
  top: 10%;
  right: 8%;
  background: rgba(6, 182, 212, 0.2);
  animation-delay: -2s;
}

.otonom-core-ambient--violet {
  bottom: 18%;
  right: 10%;
  background: rgba(139, 92, 246, 0.18);
  animation-delay: -4s;
}

.otonom-core-ambient--amber {
  bottom: 12%;
  left: 18%;
  background: rgba(245, 158, 11, 0.2);
  animation-delay: -6s;
}

.otonom-core-radar {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 17rem;
  height: 17rem;
  margin-left: -8.5rem;
  margin-top: -8.5rem;
  border-radius: 999px;
  border: 1px solid rgba(16, 185, 129, 0.2);
  pointer-events: none;
  animation: otonom-core-radar 3.5s ease-out infinite;
}

.otonom-core-line {
  fill: none;
  stroke-width: 1.25;
  stroke-linecap: round;
  opacity: 0.55;
  animation: otonom-line-pulse 4s ease-in-out infinite;
}

.otonom-core-line--emerald {
  stroke: #10b981;
  animation-delay: 0s;
}

.otonom-core-line--cyan {
  stroke: #06b6d4;
  animation-delay: -0.6s;
}

.otonom-core-line--violet {
  stroke: #8b5cf6;
  animation-delay: -1.2s;
}

.otonom-core-line--rose {
  stroke: #f43f5e;
  animation-delay: -1.8s;
}

.otonom-core-line--amber {
  stroke: #f59e0b;
  animation-delay: -2.4s;
}

.otonom-core-hub {
  position: absolute;
  left: 50%;
  top: 50%;
  z-index: 2;
  width: 14rem;
  height: 14rem;
  margin-left: -7rem;
  margin-top: -7rem;
}

.otonom-core-hub__orbit {
  position: absolute;
  inset: 0;
  border-radius: 999px;
  border: 1px dashed rgba(148, 163, 184, 0.4);
  animation: otonom-core-orbit 24s linear infinite;
}

.otonom-core-hub__disc {
  position: absolute;
  inset: 0.75rem;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  border: 1px solid #e2e8f0;
  background: #ffffff;
  box-shadow: 0 8px 24px rgba(15, 23, 42, 0.06);
  animation: otonom-core-breathe 4s ease-in-out infinite;
}

.otonom-core-hub__indicator {
  display: flex;
  justify-content: center;
  margin-top: 0.75rem;
}

.otonom-core-hub__indicator span {
  display: block;
  width: 3rem;
  height: 0.125rem;
  border-radius: 999px;
  background: linear-gradient(
    90deg,
    #10b981,
    #06b6d4,
    #8b5cf6,
    #f59e0b
  );
  opacity: 0.65;
  animation: otonom-core-indicator 3s ease-in-out infinite;
}

.otonom-core-status-dot {
  display: inline-block;
  width: 0.5rem;
  height: 0.5rem;
  border-radius: 999px;
  background: #10b981;
  box-shadow: 0 0 0 0 rgba(16, 185, 129, 0.45);
  animation: otonom-status-dot 2.2s ease-in-out infinite;
}

.otonom-core-node {
  z-index: 1;
  border-radius: 0.375rem;
  padding: 0.25rem 0.5rem;
  font-size: 0.625rem;
  font-weight: 600;
  line-height: 1.2;
  border: 1px solid #e2e8f0;
  background: rgba(255, 255, 255, 0.95);
  color: #475569;
}

.otonom-core-node--emerald {
  border-color: rgba(16, 185, 129, 0.35);
  background: rgba(236, 253, 245, 0.95);
  color: #047857;
}

.otonom-core-node--cyan {
  border-color: rgba(6, 182, 212, 0.35);
  background: rgba(236, 254, 255, 0.95);
  color: #0e7490;
}

.otonom-core-node--violet {
  border-color: rgba(139, 92, 246, 0.35);
  background: rgba(245, 243, 255, 0.95);
  color: #6d28d9;
}

.otonom-core-node--rose {
  border-color: rgba(244, 63, 94, 0.35);
  background: rgba(255, 241, 242, 0.95);
  color: #be123c;
}

.otonom-core-node--amber {
  border-color: rgba(245, 158, 11, 0.35);
  background: rgba(255, 251, 235, 0.95);
  color: #b45309;
}

@keyframes otonom-ambient-drift {
  0%,
  100% {
    transform: translate(0, 0) scale(1);
    opacity: 0.38;
  }
  50% {
    transform: translate(4px, -3px) scale(1.06);
    opacity: 0.52;
  }
}

@keyframes otonom-line-pulse {
  0%,
  100% {
    opacity: 0.45;
  }
  50% {
    opacity: 0.78;
  }
}

@keyframes otonom-core-radar {
  0% {
    transform: scale(0.92);
    opacity: 0.5;
  }
  70% {
    opacity: 0.1;
  }
  100% {
    transform: scale(1.35);
    opacity: 0;
  }
}

@keyframes otonom-core-orbit {
  to {
    transform: rotate(360deg);
  }
}

@keyframes otonom-core-breathe {
  0%,
  100% {
    box-shadow: 0 8px 24px rgba(15, 23, 42, 0.06);
  }
  50% {
    box-shadow:
      0 10px 28px rgba(16, 185, 129, 0.08),
      0 8px 20px rgba(6, 182, 212, 0.06);
  }
}

@keyframes otonom-core-indicator {
  0%,
  100% {
    opacity: 0.5;
    transform: scaleX(0.88);
  }
  50% {
    opacity: 0.85;
    transform: scaleX(1);
  }
}

@keyframes otonom-status-dot {
  0%,
  100% {
    box-shadow: 0 0 0 0 rgba(16, 185, 129, 0.4);
  }
  50% {
    box-shadow: 0 0 0 4px rgba(16, 185, 129, 0);
  }
}

@media (prefers-reduced-motion: reduce) {
  .otonom-network-panel .otonom-core-ambient,
  .otonom-network-panel .otonom-core-radar,
  .otonom-network-panel .otonom-core-line,
  .otonom-network-panel .otonom-core-hub__orbit,
  .otonom-network-panel .otonom-core-hub__disc,
  .otonom-network-panel .otonom-core-hub__indicator span,
  .otonom-network-panel .otonom-core-status-dot {
    animation: none !important;
  }
}

.cari-agent-card {
  cursor: pointer;
}

.cari-agent-card:hover:not(.cari-agent-card--upsell) {
  box-shadow: 0 4px 14px rgba(15, 23, 42, 0.06);
}

@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: #64748b !important;
}

.otonom-progress-bar {
  animation: none;
}

.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 */
  body.is-mobile-shell .ui-main,
  body.is-mobile-shell
    .legacy-view-root:not(.landing-page):not(.auth-shell)
    > main,
  body.is-mobile-shell .legacy-app-shell > main {
    padding-bottom: var(--ke-mobile-content-bottom) !important;
  }

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

  /* Pagination / pager rows stay above the floating tab bar when scrolled into view */
  body.is-mobile-shell .ui-main [id$="Pagination"],
  body.is-mobile-shell .ui-main [id$="pagination"],
  body.is-mobile-shell .ui-main [data-api-fin-daily-pagination],
  body.is-mobile-shell .ui-main .orders-dual-panel__pager,
  body.is-mobile-shell .legacy-app-shell > main [id$="Pagination"],
  body.is-mobile-shell .legacy-app-shell > main [id$="pagination"] {
    scroll-margin-bottom: calc(var(--ke-mobile-content-bottom) - 1rem);
    padding-bottom: 0.25rem;
  }

  body.is-mobile-shell .ui-main > *:last-child,
  body.is-mobile-shell .legacy-app-shell > main > *:last-child {
    margin-bottom: 0.35rem;
  }

  /* Mobile drawer — sidebar off-canvas until .mobile-open */
  .ui-sidebar,
  .app-sidebar,
  #sidebar {
    width: min(280px, 88vw) !important;
    min-width: 0 !important;
    max-width: 88vw !important;
    position: fixed !important;
    left: 0 !important;
    top: 0 !important;
    bottom: 0 !important;
    height: 100dvh !important;
    max-height: 100dvh !important;
    z-index: 99999 !important;
    transform: translateX(-100%) !important;
    transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
    box-shadow: 0 0 40px rgba(15, 23, 42, 0.14) !important;
    padding-top: max(1rem, env(safe-area-inset-top, 0px)) !important;
    padding-bottom: max(0.5rem, env(safe-area-inset-bottom, 0px)) !important;
    border-right: 1px solid var(--ke-border) !important;
    background: #fafafa !important;
    visibility: visible !important;
    opacity: 1 !important;
  }

  #sidebar.mobile-open,
  .ui-sidebar.mobile-open {
    transform: translateX(0) !important;
  }

  .legacy-app-shell .ui-app,
  .ui-app.legacy-app-shell {
    height: 100dvh !important;
    max-height: 100dvh !important;
    min-height: 0 !important;
  }

  .ui-main,
  .legacy-view-root:not(.landing-page) > main,
  .legacy-app-shell > main {
    padding-top: 1rem !important;
    padding-left: 1rem !important;
    padding-right: 1rem !important;
    padding-bottom: var(--ke-mobile-content-bottom) !important;
  }

  .ui-sidebar__logo-row {
    justify-content: space-between;
    gap: 0.5rem;
  }

  .ui-sidebar__mobile-close {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    flex-shrink: 0;
    border: 1px solid var(--ke-border);
    border-radius: 0.5rem;
    background: #fff;
    color: var(--ke-text-muted);
    cursor: pointer;
    transition:
      background-color 0.2s ease,
      color 0.2s ease,
      border-color 0.2s ease;
  }

  .ui-sidebar__mobile-close:hover {
    background: var(--ke-surface-2);
    color: var(--ke-ink);
    border-color: var(--ke-border-strong);
  }

  #sidebar a.sidebar-nav-link,
  #sidebar a.ui-nav-link,
  .ui-sidebar a.sidebar-nav-link,
  .ui-sidebar a.ui-nav-link {
    min-height: 2.75rem;
    padding-top: 0.625rem !important;
    padding-bottom: 0.625rem !important;
  }

  .sidebar-nav-group-header {
    min-height: 2.5rem;
  }

  /* Agent / dashboard headers — stack on narrow screens */
  .agent-page-shell header.flex-col.xl\:flex-row,
  .ui-page-header--vendify {
    gap: 1rem !important;
  }
}

.ui-sidebar__mobile-close {
  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 page — modern refresh (/) ─── */
.landing-page--modern {
  background:
    radial-gradient(
      ellipse 90% 55% at 50% -15%,
      rgba(255, 107, 53, 0.09),
      transparent 58%
    ),
    radial-gradient(
      ellipse 55% 40% at 100% 5%,
      rgba(45, 212, 191, 0.07),
      transparent 55%
    ),
    radial-gradient(
      ellipse 45% 35% at 0% 85%,
      rgba(30, 58, 95, 0.05),
      transparent 50%
    ),
    var(--ke-bg, #f2f4f7);
}

.landing-top-nav--glass {
  background: rgba(255, 255, 255, 0.86) !important;
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border: none !important;
  border-bottom: 1px solid rgba(226, 232, 240, 0.95) !important;
  border-radius: 0 !important;
  box-shadow: 0 1px 0 rgba(15, 23, 42, 0.04) !important;
  transform: none !important;
}

.landing-top-nav--glass:hover {
  transform: none !important;
  box-shadow: 0 1px 0 rgba(15, 23, 42, 0.04) !important;
}

.landing-brand {
  color: var(--ke-navy, #0c1a3a);
  text-decoration: none;
  transition: opacity 0.2s ease;
}

.landing-brand:hover {
  opacity: 0.88;
}

.landing-brand__icon {
  width: 2.25rem;
  height: 2.25rem;
  border-radius: 0.75rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, #fff1e8 0%, #ffe8d8 100%);
  border: 1px solid rgba(255, 107, 53, 0.22);
  color: var(--ke-orange, #ff6b35);
  font-size: 1.15rem;
  flex-shrink: 0;
}

.landing-nav-chip {
  font-size: 0.8125rem;
  font-weight: 600;
  padding: 0.45rem 0.85rem;
  border-radius: 0.65rem;
  border: 1px solid transparent;
  transition:
    background-color 0.2s ease,
    border-color 0.2s ease,
    transform 0.2s ease,
    box-shadow 0.2s ease;
  cursor: pointer;
  line-height: 1.2;
}

.landing-nav-chip:hover {
  transform: translateY(-1px);
}

.landing-nav-chip--pro {
  border-color: rgba(20, 184, 166, 0.35);
  background: rgba(236, 253, 245, 0.9);
  color: #0f766e;
}

.landing-nav-chip--pro:hover {
  background: #ecfdf5;
  border-color: rgba(20, 184, 166, 0.5);
  box-shadow: 0 4px 14px rgba(20, 184, 166, 0.12);
}

.landing-nav-chip--plus {
  border-color: rgba(251, 146, 60, 0.35);
  background: rgba(255, 247, 237, 0.95);
  color: #c2410c;
}

.landing-nav-chip--plus:hover {
  background: #fff7ed;
  border-color: rgba(251, 146, 60, 0.5);
  box-shadow: 0 4px 14px rgba(251, 146, 60, 0.12);
}

.landing-nav-chip--login {
  border-color: rgba(226, 232, 240, 0.95);
  background: rgba(255, 255, 255, 0.95);
  color: #334155;
}

.landing-nav-chip--login:hover {
  background: #fff;
  border-color: #cbd5e1;
  box-shadow: 0 4px 14px rgba(15, 23, 42, 0.06);
}

.landing-hero {
  position: relative;
  isolation: isolate;
}

.landing-hero__orb {
  position: absolute;
  border-radius: 999px;
  filter: blur(48px);
  pointer-events: none;
  z-index: -1;
}

.landing-hero__orb--orange {
  width: min(420px, 70vw);
  height: min(280px, 45vw);
  top: -8%;
  left: 50%;
  transform: translateX(-50%);
  background: rgba(255, 107, 53, 0.14);
}

.landing-hero__orb--teal {
  width: min(320px, 55vw);
  height: min(220px, 38vw);
  top: 18%;
  right: -12%;
  background: rgba(45, 212, 191, 0.12);
}

.landing-hero__badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.625rem;
  margin: 0 auto 1.75rem;
  padding: 0.55rem 1.15rem;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.88);
  border: 1px solid rgba(255, 107, 53, 0.22);
  box-shadow: 0 4px 20px rgba(15, 23, 42, 0.04);
  vertical-align: middle;
}

@media (min-width: 640px) {
  .landing-hero__badge {
    margin-bottom: 2rem;
    padding: 0.6rem 1.25rem;
    gap: 0.7rem;
  }
}

.landing-hero__badge-dot {
  position: relative;
  display: grid;
  place-items: center;
  width: 0.5rem;
  height: 0.5rem;
  min-width: 0.5rem;
  min-height: 0.5rem;
  flex-shrink: 0;
}

.landing-hero__badge-dot-ping {
  position: absolute;
  inset: 0;
  border-radius: 999px;
  background: var(--ke-orange, #ff6b35);
  opacity: 0.75;
  animation: landing-hero-badge-ping 1.5s cubic-bezier(0, 0, 0.2, 1) infinite;
}

.landing-hero__badge-dot-core {
  width: 0.5rem;
  height: 0.5rem;
  border-radius: 999px;
  background: var(--ke-orange, #ff6b35);
}

.landing-hero__badge-label {
  display: inline-block;
  font-size: 0.625rem;
  font-weight: 700;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  line-height: 1.25;
  text-align: center;
  color: var(--ke-orange, #ff6b35);
}

@media (min-width: 480px) {
  .landing-hero__badge-label {
    white-space: nowrap;
    line-height: 1;
    letter-spacing: 0.18em;
  }
}

@media (min-width: 640px) {
  .landing-hero__badge-label {
    font-size: 0.6875rem;
  }
}

@keyframes landing-hero-badge-ping {
  0% {
    transform: scale(1);
    opacity: 0.75;
  }
  75%,
  100% {
    transform: scale(2.2);
    opacity: 0;
  }
}

.landing-hero__title {
  font-family: var(--ke-font-display, "Gabarito", sans-serif);
}

.landing-cta {
  transition:
    transform 0.2s ease,
    box-shadow 0.2s ease,
    background-color 0.2s ease,
    border-color 0.2s ease;
}

.landing-cta:hover {
  transform: translateY(-2px);
}

.landing-cta--primary:hover {
  box-shadow: 0 12px 28px rgba(255, 107, 53, 0.28);
}

.landing-cta--ghost {
  background: rgba(255, 255, 255, 0.92);
  border: 1px solid rgba(226, 232, 240, 0.95);
  box-shadow: 0 2px 10px rgba(15, 23, 42, 0.04);
}

.landing-cta--ghost:hover {
  background: #fff;
  border-color: #cbd5e1;
  box-shadow: 0 8px 24px rgba(15, 23, 42, 0.07);
}

.landing-features {
  gap: 0.875rem;
}

@media (min-width: 640px) {
  .landing-features {
    gap: 1rem;
  }
}

.landing-feature-card {
  background: rgba(255, 255, 255, 0.92);
  border: 1px solid rgba(226, 232, 240, 0.95);
  border-radius: 1.125rem;
  padding: 1.5rem 1.6rem;
  box-shadow: 0 2px 12px rgba(15, 23, 42, 0.04);
  transition:
    transform 0.25s ease,
    box-shadow 0.25s ease,
    border-color 0.25s ease;
}

@media (min-width: 640px) {
  .landing-feature-card {
    padding: 1.65rem 1.75rem;
  }
}

.landing-feature-card:hover {
  transform: translateY(-3px);
  border-color: rgba(203, 213, 225, 0.95);
  box-shadow: 0 12px 32px rgba(15, 23, 42, 0.08);
}

.landing-feature-card__icon {
  width: 2.65rem;
  height: 2.65rem;
  border-radius: 0.8rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 1rem;
  font-size: 1.35rem;
}

.landing-feature-card__icon--orange {
  background: rgba(255, 107, 53, 0.1);
  border: 1px solid rgba(255, 107, 53, 0.2);
  color: #ea580c;
}

.landing-feature-card__icon--teal {
  background: rgba(45, 212, 191, 0.12);
  border: 1px solid rgba(45, 212, 191, 0.28);
  color: #0d9488;
}

.landing-feature-card__icon--navy {
  background: rgba(30, 58, 95, 0.08);
  border: 1px solid rgba(30, 58, 95, 0.16);
  color: #1e3a5f;
}

.landing-feature-card__title {
  font-family: var(--ke-font-display, "Gabarito", sans-serif);
  font-size: 1.05rem;
  font-weight: 700;
  color: #0f172a;
  margin: 0 0 0.55rem;
  letter-spacing: -0.02em;
}

.landing-feature-card__body {
  font-size: 0.875rem;
  line-height: 1.6;
  color: #64748b;
  margin: 0;
  padding-right: 0.25rem;
}

/* Landing tier cards — inner wrappers control padding (dashboard compact rules excluded) */
.landing-page .landing-tier-hero.glass-panel {
  padding: 0 !important;
}

.landing-page .landing-tier-hero__body {
  padding: 2rem 1.65rem;
  gap: 2rem !important;
}

.landing-page .landing-plus-pricing.glass-panel,
.landing-page .landing-pro-pricing.glass-panel {
  padding: 0 !important;
}

.landing-page .landing-tier-pricing__inner {
  padding: 1.85rem 1.65rem;
  display: flex;
  flex-direction: column;
  gap: 1.35rem;
}

.landing-page .landing-tier-pricing__inner > * {
  margin-bottom: 0 !important;
}

.landing-page .landing-tier-pricing__inner .landing-tier-price-box {
  padding: 1.35rem 1.45rem !important;
  margin: 0 !important;
}

.landing-page .landing-tier-pricing__inner .landing-tier-price-box__label {
  margin-bottom: 0.55rem !important;
}

.landing-page .landing-tier-pricing__inner .flex.flex-col.gap-3 {
  gap: 1rem !important;
}

.landing-page .landing-tier-features {
  gap: 1rem !important;
}

@media (min-width: 640px) {
  .landing-page .landing-tier-hero__body {
    padding: 2.25rem 2rem;
    gap: 2.25rem !important;
  }

  .landing-page .landing-tier-pricing__inner {
    padding: 2.1rem 1.85rem;
    gap: 1.5rem;
  }

  .landing-page .landing-tier-features {
    gap: 1.15rem !important;
  }
}

@media (min-width: 1024px) {
  .landing-page .landing-tier-hero__body {
    padding: 2.75rem 2.5rem;
    gap: 2.75rem !important;
  }

  .landing-page .landing-tier-pricing__inner {
    padding: 2.35rem 2.1rem;
  }
}

.landing-tier-hero {
  transition:
    box-shadow 0.3s ease,
    transform 0.3s ease;
}

.landing-tier-hero .landing-tier-hero__content > .landing-tier-badge {
  margin-bottom: 1.35rem !important;
}

.landing-tier-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  padding: 0.5rem 0.9rem 0.5rem 0.7rem;
  border-radius: 999px;
  border: 1px solid transparent;
  font-family: var(--ke-font-body, "Figtree", sans-serif);
  vertical-align: middle;
}

.landing-tier-badge__icon {
  display: grid;
  place-items: center;
  width: 1.125rem;
  height: 1.125rem;
  min-width: 1.125rem;
  min-height: 1.125rem;
  border-radius: 999px;
  flex-shrink: 0;
  font-size: 0.6875rem;
  font-weight: 800;
  line-height: 1;
  padding: 0;
  text-align: center;
  box-sizing: border-box;
}

.landing-tier-badge__label {
  display: inline-block;
  font-size: 0.6875rem;
  font-weight: 800;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  line-height: 1;
  white-space: nowrap;
}

.landing-tier-badge--plus {
  border-color: rgba(251, 146, 60, 0.4);
  background: rgba(255, 247, 237, 0.95);
  color: #c2410c;
}

.landing-tier-badge--plus .landing-tier-badge__icon {
  background: var(--ke-orange, #ff6b35);
  color: #fff;
  box-shadow: 0 0 0 0 rgba(255, 107, 53, 0.35);
  animation: landing-tier-badge-plus-pulse 1.45s ease-in-out infinite;
}

.landing-tier-badge--pro {
  border-color: rgba(20, 184, 166, 0.45);
  background: rgba(236, 253, 245, 0.95);
  color: #0f766e;
}

.landing-tier-badge__icon--glyph {
  font-size: 0;
  font-weight: 400;
}

.landing-tier-badge__icon--glyph i {
  display: block;
  font-size: 0.625rem;
  line-height: 1;
}

.landing-tier-badge--pro .landing-tier-badge__icon {
  width: 1.25rem;
  height: 1.25rem;
  min-width: 1.25rem;
  min-height: 1.25rem;
  background: #0f766e;
  color: #fff;
}

.landing-tier-badge--pro .landing-tier-badge__icon--glyph i {
  font-size: 0.6875rem;
}

@keyframes landing-tier-badge-plus-pulse {
  0%,
  100% {
    transform: scale(1);
    box-shadow: 0 0 0 0 rgba(255, 107, 53, 0.4);
  }
  50% {
    transform: scale(1.08);
    box-shadow: 0 0 6px 2px rgba(255, 107, 53, 0.32);
  }
}

.landing-tier-hero .landing-tier-hero__content > h2 {
  margin-bottom: 1.25rem !important;
  line-height: 1.22 !important;
}

.landing-tier-hero .landing-tier-hero__content > p {
  margin-bottom: 2rem !important;
  line-height: 1.65 !important;
}

.landing-tier-hero:hover {
  box-shadow: var(--ke-shadow-lg, 0 18px 44px rgba(16, 24, 40, 0.08));
}

.landing-plus-pricing,
.landing-pro-pricing {
  box-shadow: 0 8px 28px rgba(15, 23, 42, 0.06);
  border-radius: 1.25rem !important;
}

.landing-plus-pricing .btn-primary,
.landing-plus-pricing button[type="button"],
.landing-pro-pricing .landing-pro-cta-primary,
.landing-pro-pricing button[type="button"] {
  padding-top: 0.95rem !important;
  padding-bottom: 0.95rem !important;
}

@media (max-width: 639px) {
  .landing-top-nav__inner {
    padding-top: 0.65rem;
    padding-bottom: 0.65rem;
  }

  .landing-nav-chip {
    padding: 0.4rem 0.6rem;
    font-size: 0.75rem;
  }

  .landing-hero__actions {
    max-width: 100%;
  }

  .landing-page .landing-tier-hero__body {
    gap: 1.75rem !important;
    padding: 1.75rem 1.5rem;
  }

  .landing-page .landing-tier-pricing__inner {
    padding: 1.65rem 1.5rem;
  }
}

@media (max-width: 380px) {
  .landing-nav-chip--login {
    padding-left: 0.55rem;
    padding-right: 0.55rem;
  }
}

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

.landing-plus-section {
  padding-bottom: 1.5rem !important;
}

.landing-pro-section {
  padding-top: 0.75rem !important;
}

@media (min-width: 640px) {
  .landing-plus-section {
    padding-bottom: 2rem !important;
  }

  .landing-pro-section {
    padding-top: 1rem !important;
    padding-bottom: 5rem !important;
  }
}

.landing-tier-feature {
  display: flex;
  align-items: flex-start;
  gap: 0.85rem;
  padding: 1.2rem 1.3rem !important;
  min-height: 4.5rem;
  border-radius: 0.95rem;
  border: 1px solid rgba(148, 163, 184, 0.35);
  background: rgba(255, 255, 255, 0.72);
  font-size: 0.875rem;
  line-height: 1.55;
  color: #334155;
}

.landing-page .landing-tier-feature {
  padding: 1.3rem 1.4rem !important;
  min-height: 4.75rem;
}

.landing-tier-feature span {
  display: block;
  padding: 0.15rem 0.1rem 0.1rem;
}

.landing-tier-feature i {
  font-size: 1.2rem;
  margin-top: 0.15rem;
  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-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-chip--pro,
  .landing-top-nav .landing-nav-chip--plus {
    padding-left: 0.55rem;
    padding-right: 0.55rem;
    font-size: 0.75rem;
  }
}

.st-stock-display {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  min-width: 3.25rem;
  padding: 0.2rem 0.45rem;
  border-radius: 0.375rem;
  border: 1px solid transparent;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  font-size: 0.75rem;
  font-weight: 600;
  line-height: 1.2;
}

.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: 4rem;
  padding: 0.15rem 0.45rem;
  border-radius: 999px;
  font-size: 0.625rem;
  font-weight: 700;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  line-height: 1.2;
}

.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 {
  overflow: visible;
}

.st-stock-table {
  width: 100%;
  table-layout: fixed;
}

.st-stock-table .st-stock-table__index {
  width: 2.75rem;
  min-width: 2.75rem;
  max-width: 2.75rem;
  text-align: center;
  font-size: 0.75rem;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  color: #64748b;
}

.st-stock-table .st-stock-table__product {
  width: 46%;
}

.st-stock-table .st-stock-table__units {
  width: 7.5rem;
}

.st-stock-table .st-stock-table__stock {
  width: 7rem;
}

.st-stock-table .st-stock-table__status {
  width: 6.5rem;
}

.st-stock-thumb {
  width: 1.75rem;
  height: 1.75rem;
  min-width: 1.75rem;
  min-height: 1.75rem;
  object-fit: cover;
  object-position: center;
  border-radius: 0.375rem;
  border: 1px solid #e2e8f0;
  background: #fff;
  flex-shrink: 0;
  display: block;
}

.st-stock-thumb--empty {
  background: #f8fafc;
}

.st-stock-product {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  min-width: 0;
}

.st-stock-product__name {
  font-size: 0.8125rem;
  font-weight: 600;
  line-height: 1.3;
  color: #0f172a;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.st-stock-product__sku {
  margin-top: 0.125rem;
  font-size: 0.6875rem;
  line-height: 1.25;
  color: #64748b;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.st-stock-row td {
  vertical-align: middle;
}

.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 {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.4rem 0.75rem;
  border-radius: 9999px;
  border: 1px solid #e4e4e7;
  background: #ffffff;
  font-size: 0.75rem;
  font-weight: 500;
  color: #52525b;
  white-space: nowrap;
  transition:
    background 0.15s ease,
    border-color 0.15s ease,
    color 0.15s ease;
}

.uk-rate-filter-btn:hover:not(.uk-rate-filter-btn--active) {
  background: #f4f4f5;
  border-color: #d4d4d8;
  color: #18181b;
}

.uk-rate-filter-btn--loss {
  border-color: #fecaca;
  background: #fff1f2;
  color: #be123c;
}

.uk-rate-filter-btn--loss:hover:not(.uk-rate-filter-btn--active) {
  background: #ffe4e6;
  border-color: #fda4af;
}

.uk-rate-filter-btn--ghost {
  color: #a1a1aa;
  border-color: transparent;
  background: transparent;
}

.uk-rate-filter-btn--ghost:hover:not(.uk-rate-filter-btn--active) {
  background: #f4f4f5;
  border-color: #e4e4e7;
  color: #52525b;
}

.uk-rate-filter-btn--active {
  background: #18181b !important;
  border: 1px solid #18181b !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 — compact control panel (no inner scroll) */
.pr-products-panel {
  display: block;
  box-sizing: border-box;
  width: 100%;
  padding: 0;
  border-radius: 1rem;
  border: 1px solid #e4e4e7;
  background: #ffffff;
  overflow: hidden;
}

.pr-products-panel__body {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  box-sizing: border-box;
  width: 100%;
  padding: 1.25rem 1.5rem;
}

@media (min-width: 1024px) {
  .pr-products-panel__body {
    padding: 1.5rem 2rem;
  }
}

.legacy-view-root main .pr-products-panel__body,
.legacy-app-shell main .pr-products-panel__body,
.legacy-app-shell .ui-main > .pr-products-panel .pr-products-panel__body {
  padding-left: 1.5rem !important;
  padding-right: 1.5rem !important;
}

@media (min-width: 1024px) {
  .legacy-view-root main .pr-products-panel__body,
  .legacy-app-shell main .pr-products-panel__body,
  .legacy-app-shell .ui-main > .pr-products-panel .pr-products-panel__body {
    padding-left: 2rem !important;
    padding-right: 2rem !important;
  }
}

.pr-products-toolbar {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  width: 100%;
}

.pr-products-toolbar__top {
  display: flex;
  flex-direction: column;
  gap: 0.625rem;
  min-width: 0;
  width: 100%;
}

@media (min-width: 640px) {
  .pr-products-toolbar__top {
    flex-direction: row;
    align-items: center;
    gap: 0.75rem;
  }
}

.pr-products-toolbar__search {
  width: 100%;
  min-width: 0;
  flex: 1 1 auto;
}

.pr-products-search-input {
  width: 100%;
  padding: 0.5rem 0.875rem 0.5rem 2.5rem;
  border-radius: 9999px;
  border: 1px solid #e4e4e7;
  background: #fafafa;
  font-size: 0.8125rem;
  color: #18181b;
  transition:
    border-color 0.15s ease,
    background 0.15s ease;
}

.pr-products-search-input::placeholder {
  color: #a1a1aa;
}

.pr-products-search-input:focus {
  outline: none;
  border-color: #a1a1aa;
  background: #ffffff;
}

.pr-products-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.5rem;
  width: 100%;
}

@media (max-width: 639px) {
  .pr-products-actions #productUnmatchedExportBtn,
  .pr-products-actions #productCostExcelBtn {
    grid-column: 1 / -1;
  }
}

@media (min-width: 640px) {
  .pr-products-actions {
    grid-template-columns: repeat(6, minmax(0, 1fr));
  }

  .pr-products-actions #productRefreshBtn,
  .pr-products-actions #productCostTemplateBtn,
  .pr-products-actions #productExportBtn {
    grid-column: span 2;
  }

  .pr-products-actions #productUnmatchedExportBtn,
  .pr-products-actions #productCostExcelBtn {
    grid-column: span 3;
  }
}

@media (min-width: 640px) {
  .pr-action-btn {
    min-width: 0;
  }
}

.pr-product-tabs {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.375rem;
  flex-shrink: 0;
}

.pr-action-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.35rem;
  width: 100%;
  min-width: 0;
  padding: 0.5rem 0.75rem;
  border-radius: 0.5rem;
  border: 1px solid #e4e4e7;
  background: #ffffff;
  color: #3f3f46;
  font-size: 0.8125rem;
  font-weight: 500;
  line-height: 1.2;
  white-space: nowrap;
  transition:
    background 0.15s ease,
    border-color 0.15s ease,
    color 0.15s ease;
}

.pr-action-btn i {
  font-size: 1rem;
  flex-shrink: 0;
}

.pr-action-btn:hover {
  background: #f4f4f5;
  border-color: #d4d4d8;
}

.pr-action-btn--primary {
  background: #18181b;
  border-color: #18181b;
  color: #ffffff;
}

.pr-action-btn--primary:hover {
  background: #27272a;
  border-color: #27272a;
  color: #ffffff;
}

.pr-action-btn--warn {
  background: #fffbeb;
  border-color: #fde68a;
  color: #92400e;
}

.pr-action-btn--warn:hover {
  background: #fef3c7;
  border-color: #fcd34d;
}

.pr-action-btn:disabled,
.pr-action-btn--warn:disabled {
  opacity: 0.45;
  cursor: not-allowed;
  pointer-events: none;
}

.pr-product-tab {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  padding: 0.4rem 0.85rem;
  border-radius: 9999px;
  font-size: 0.8125rem;
  font-weight: 500;
  color: #52525b;
  background: #ffffff;
  border: 1px solid #e4e4e7;
  white-space: nowrap;
  transition:
    background 0.15s ease,
    border-color 0.15s ease,
    color 0.15s ease;
}

.pr-product-tab:hover:not(.pr-product-tab--active) {
  background: #f4f4f5;
  color: #18181b;
}

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

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

.pr-product-tab__count {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 1.25rem;
  padding: 0.0625rem 0.375rem;
  border-radius: 9999px;
  font-size: 0.6875rem;
  font-weight: 600;
  line-height: 1.2;
  background: #f4f4f5;
  color: #52525b;
}

.pr-product-tab--active .pr-product-tab__count {
  background: rgba(255, 255, 255, 0.18);
  color: #ffffff;
}

.pr-excel-hint {
  margin: 0;
  padding-top: 0.75rem;
  border-top: 1px solid #f4f4f5;
  font-size: 0.8125rem;
  line-height: 1.5;
  color: #71717a;
  width: 100%;
}

.pr-excel-hint strong {
  color: #18181b;
  font-weight: 600;
}

.pr-products-status {
  display: flex;
  flex-wrap: wrap;
  gap: 0.375rem 0.75rem;
  min-height: 0;
}

.pr-products-status__item:empty {
  display: none;
}

.pr-products-status__item {
  font-size: 0.8125rem;
  line-height: 1.4;
}

.pr-toolbar-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  padding: 0.5rem 0.75rem;
  border-radius: 0.625rem;
  border: 1px solid #e2e8f0;
  background: #ffffff;
  color: #334155;
  font-size: 0.8125rem;
  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;
  }
}

/* ─── Auth page (login / register) — Kontrol Merkezi shell ─── */
.legacy-view-root.auth-shell {
  background: var(--ke-bg) !important;
  display: flex;
  flex-direction: column;
  width: 100%;
  min-height: 100vh;
  min-height: 100dvh;
}

.legacy-view-root.auth-shell > main.auth-shell__stage {
  padding: 0 !important;
  gap: 0 !important;
  background: var(--ke-bg) !important;
}

.auth-shell {
  background: var(--ke-bg);
  color: var(--ke-text);
  display: flex;
  flex-direction: column;
  width: 100%;
  min-height: 100vh;
  min-height: 100dvh;
}

.auth-shell__stage {
  position: relative;
  z-index: 1;
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  min-height: 0;
  width: 100%;
  overflow-y: auto;
  overflow-x: hidden;
  overscroll-behavior-y: contain;
  -webkit-overflow-scrolling: touch;
  padding: max(1rem, env(safe-area-inset-top, 0px))
    max(1rem, env(safe-area-inset-right, 0px))
    max(1rem, env(safe-area-inset-bottom, 0px))
    max(1rem, env(safe-area-inset-left, 0px));
}

.auth-shell__wrap {
  position: relative;
  width: 100%;
  max-width: min(26rem, calc(100vw - 2rem));
  margin: auto;
  flex-shrink: 0;
}

.auth-shell__back {
  position: fixed;
  top: max(0.75rem, env(safe-area-inset-top, 0px));
  left: max(0.75rem, env(safe-area-inset-left, 0px));
  z-index: 30;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.4rem;
  min-height: 2.75rem;
  min-width: 2.75rem;
  padding: 0.45rem 0.75rem;
  border: 1px solid var(--ke-border);
  border-radius: 12px;
  background: var(--ke-surface);
  color: var(--ke-text-muted);
  font-size: 0.8125rem;
  font-weight: 600;
  cursor: pointer;
  box-shadow: var(--ke-shadow);
  transition:
    color 0.2s ease,
    border-color 0.2s ease,
    background-color 0.2s ease;
}

.auth-shell__back:hover {
  color: var(--ke-text);
  border-color: var(--ke-border-strong);
  background: #fff;
}

.auth-shell__back i {
  font-size: 1rem;
  line-height: 1;
}

.auth-panel {
  position: relative;
  padding: 0 !important;
  border-radius: var(--ke-radius-lg) !important;
  overflow: hidden;
}

.auth-panel.glass-panel:hover,
.auth-panel.ui-widget:hover {
  transform: none !important;
}

.auth-panel__inner {
  position: relative;
  padding: 1.5rem 1.35rem 1.6rem;
}

@media (min-width: 640px) {
  .auth-panel__inner {
    padding: 1.65rem 1.5rem 1.75rem;
  }
}

.auth-panel__brand {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  margin-bottom: 1.15rem;
}

.auth-panel__brand .ui-sidebar__logo-icon {
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 12px;
}

.auth-panel__brand .ui-sidebar__logo-text {
  font-size: 1.125rem;
}

.auth-panel__head {
  margin-bottom: 1.15rem;
}

.auth-panel__title {
  font-family: var(--ke-font-display);
  font-size: 1.3125rem;
  font-weight: 800;
  color: var(--ke-navy);
  letter-spacing: -0.02em;
  margin: 0 0 0.4rem;
  line-height: 1.25;
}

.auth-panel__subtitle {
  font-size: 0.8125rem;
  line-height: 1.5;
  color: var(--ke-text-muted);
  margin: 0;
}

.auth-tabs {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.3rem;
  padding: 0.3rem;
  margin-bottom: 1rem;
  border-radius: 12px;
  background: var(--ke-surface-2);
  border: 1px solid var(--ke-border);
}

.auth-tab {
  padding: 0.6rem 0.55rem;
  min-height: 2.75rem;
  border-radius: 10px;
  border: 1px solid transparent;
  background: transparent;
  color: var(--ke-text-muted);
  font-size: 0.8125rem;
  font-weight: 700;
  cursor: pointer;
  transition:
    background-color 0.2s ease,
    color 0.2s ease,
    border-color 0.2s ease,
    box-shadow 0.2s ease;
}

.auth-tab:hover:not(.auth-tab--active) {
  color: var(--ke-text-secondary);
  background: rgba(255, 255, 255, 0.7);
}

.auth-tab--active {
  background: var(--ke-surface);
  color: var(--ke-orange);
  border-color: var(--ke-border);
  box-shadow: var(--ke-shadow);
}

.auth-form {
  display: flex;
  flex-direction: column;
  gap: 0.85rem;
}

.auth-form__group {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
}

.auth-label {
  font-size: 0.6875rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--ke-text-muted);
  padding-left: 0.1rem;
}

.auth-field-wrap {
  position: relative;
}

.auth-field-icon {
  position: absolute;
  left: 0.8rem;
  top: 50%;
  transform: translateY(-50%);
  color: var(--ke-text-muted);
  pointer-events: none;
  z-index: 1;
  font-size: 1.0625rem;
  line-height: 1;
}

.auth-error {
  padding: 0.65rem 0.8rem;
  border-radius: 10px;
  border: 1px solid rgba(244, 63, 94, 0.28);
  background: #fef2f2;
  color: #be123c;
  font-size: 0.8125rem;
  line-height: 1.45;
}

.auth-error.hidden {
  display: none;
}

.auth-consent {
  padding: 0.8rem 0.85rem;
  border-radius: 10px;
  border: 1px solid var(--ke-border);
  background: var(--ke-surface-2);
  display: flex;
  flex-direction: column;
  gap: 0.7rem;
}

.auth-consent__note {
  font-size: 0.75rem;
  line-height: 1.5;
  color: var(--ke-text-muted);
  margin: 0;
}

.auth-consent__check {
  display: flex;
  align-items: flex-start;
  gap: 0.55rem;
  font-size: 0.8125rem;
  line-height: 1.45;
  color: var(--ke-text-secondary);
  cursor: pointer;
}

.auth-consent__check input {
  margin-top: 0.1rem;
  width: 0.9rem;
  height: 0.9rem;
  flex-shrink: 0;
  accent-color: var(--ke-orange);
}

.auth-consent__check span {
  min-width: 0;
  word-break: break-word;
}

.auth-consent__link {
  border: none;
  background: none;
  padding: 0;
  color: var(--ke-orange);
  font-weight: 700;
  text-decoration: underline;
  text-underline-offset: 2px;
  cursor: pointer;
  font-size: inherit;
}

.auth-success {
  padding: 0.7rem 0.75rem;
  border-radius: 10px;
  border: 1px solid rgba(16, 185, 129, 0.35);
  background: var(--ke-teal-soft);
}

.auth-success.hidden {
  display: none;
}

.auth-success__title {
  font-size: 0.8125rem;
  font-weight: 800;
  color: #065f46;
  margin: 0 0 0.35rem;
}

.auth-success__body {
  font-size: 0.75rem;
  line-height: 1.5;
  color: #047857;
  margin: 0;
}

.auth-success__btn {
  margin-top: 0.65rem;
  width: 100%;
  padding: 0.55rem 0.75rem;
  border-radius: 10px;
  border: 1px solid rgba(16, 185, 129, 0.35);
  background: var(--ke-surface);
  color: #065f46;
  font-size: 0.75rem;
  font-weight: 700;
  cursor: pointer;
  transition: background-color 0.2s ease;
}

.auth-success__btn:hover {
  background: #ecfdf5;
}

.auth-submit {
  width: 100%;
  margin-top: 0.2rem;
  padding: 0.75rem 1rem;
  min-height: 2.75rem;
  border-radius: 12px;
  font-size: 0.875rem;
  font-weight: 700;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.45rem;
  transition:
    transform 0.2s ease,
    box-shadow 0.2s ease;
}

.auth-submit i {
  font-size: 1.0625rem;
}

.auth-submit:hover {
  transform: translateY(-1px);
  box-shadow: 0 8px 20px rgba(255, 107, 53, 0.25);
}

.auth-loading {
  position: absolute;
  inset: 0;
  z-index: 10;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.4rem;
  padding: 1.25rem;
  background: rgba(255, 255, 255, 0.94);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  border-radius: var(--ke-radius-lg);
}

.auth-loading.hidden {
  display: none;
}

.auth-loading__spinner {
  width: 2.25rem;
  height: 2.25rem;
  border-radius: 999px;
  border: 2px solid rgba(255, 107, 53, 0.2);
  border-top-color: var(--ke-orange);
  animation: auth-loading-spin 0.75s linear infinite;
}

.auth-loading__text {
  font-size: 0.8125rem;
  font-weight: 700;
  color: var(--ke-orange);
  margin: 0;
}

.auth-loading__hint {
  font-size: 0.6875rem;
  color: var(--ke-text-muted);
  margin: 0;
}

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

/* Auth — tablet */
@media (min-width: 640px) {
  .auth-shell__stage {
    padding: max(1.25rem, env(safe-area-inset-top, 0px))
      max(1.5rem, env(safe-area-inset-right, 0px))
      max(1.25rem, env(safe-area-inset-bottom, 0px))
      max(1.5rem, env(safe-area-inset-left, 0px));
  }

  .auth-shell__wrap {
    max-width: min(28rem, calc(100vw - 3rem));
  }

  .auth-shell__back {
    top: max(1rem, env(safe-area-inset-top, 0px));
    left: max(1.25rem, env(safe-area-inset-left, 0px));
  }
}

/* Auth — desktop */
@media (min-width: 1024px) {
  .auth-shell__wrap {
    max-width: 28rem;
  }
}

/* Auth — mobile */
@media (max-width: 639px) {
  .auth-shell__stage {
    padding-top: max(4.25rem, calc(env(safe-area-inset-top, 0px) + 3.25rem));
  }

  .auth-shell__back span {
    display: none;
  }

  .auth-shell__back {
    padding: 0.45rem;
    min-width: 2.75rem;
  }

  .auth-panel__inner {
    padding: 1.25rem 1.15rem 1.35rem;
  }

  .auth-panel__title {
    font-size: 1.1875rem;
  }

  .auth-panel__subtitle {
    font-size: 0.8125rem;
  }
}

/* Auth — very small phones */
@media (max-width: 380px) {
  .auth-shell__wrap {
    max-width: calc(100vw - 1.25rem);
  }

  .auth-shell__stage {
    padding-left: max(0.625rem, env(safe-area-inset-left, 0px));
    padding-right: max(0.625rem, env(safe-area-inset-right, 0px));
  }

  .auth-panel__inner {
    padding: 1.1rem 1rem 1.2rem;
  }

  .auth-tab {
    font-size: 0.75rem;
    padding: 0.55rem 0.4rem;
  }
}

/* Auth — landscape phones (register form scroll) */
@media (max-height: 520px) and (orientation: landscape) {
  .auth-shell__stage {
    padding-top: max(3.5rem, calc(env(safe-area-inset-top, 0px) + 2.5rem));
    padding-bottom: max(0.75rem, env(safe-area-inset-bottom, 0px));
  }

  .auth-panel__inner {
    padding: 1rem 1.1rem 1.15rem;
  }

  .auth-panel__brand {
    margin-bottom: 0.85rem;
  }

  .auth-panel__head {
    margin-bottom: 0.85rem;
  }

  .auth-form {
    gap: 0.65rem;
  }
}

/* Orders — page shell */
.orders-page {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  overflow-x: hidden;
  box-sizing: border-box;
}

.orders-page > * {
  min-width: 0;
  max-width: 100%;
  box-sizing: border-box;
}

@media (min-width: 768px) {
  .orders-page {
    gap: 1.5rem;
  }
}

.orders-page .ui-page-header {
  margin-bottom: 0;
}

.orders-page .ui-page-header,
.orders-page .ui-page-header__intro,
.orders-page .ui-page-header__actions,
.orders-page .ui-header-toolbar,
.orders-page .ui-header-toolbar__row,
.orders-page .ui-header-toolbar__controls {
  min-width: 0;
  max-width: 100%;
  box-sizing: border-box;
}

.orders-page .ui-header-toolbar__controls .ui-date-toolbar__range,
.orders-page .ui-header-toolbar__trailing .ui-store-badge {
  max-width: 100%;
}

@media (max-width: 639px) {
  .orders-page .ui-header-toolbar__trailing .ui-store-badge {
    margin-left: 0;
    max-width: 100%;
  }

  .orders-page .orders-dual-panel__live-badge {
    white-space: normal;
    max-width: 100%;
  }
}

/* Orders — dual panel grid (category + revenue) */
.orders-dual-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.5rem;
  align-items: start;
  min-width: 0;
  max-width: 100%;
}

@media (min-width: 1280px) {
  .orders-dual-grid {
    grid-template-columns: 0.95fr 1.05fr;
    align-items: stretch;
  }

  .orders-dual-grid > .orders-dual-panel {
    min-height: 100%;
  }

  .orders-dual-grid > .orders-dual-panel .orders-dual-panel__body {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    min-height: 0;
  }

  .orders-dual-grid > .orders-dual-panel .orders-dual-panel__list {
    flex: 1 1 auto;
  }
}

/* Orders — paired panel header (category + revenue side by side) */
.orders-dual-panel__header--paired {
  margin-bottom: 0;
  min-height: 0;
}

.orders-dual-panel__toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-start;
  gap: 0.5rem;
  margin-top: 0.75rem;
  margin-bottom: 0.875rem;
}

.orders-dual-panel__toolbar-caption {
  flex: 1 1 auto;
  min-width: 0;
  margin: 0;
}

.orders-dual-grid .orders-dual-panel__header--paired {
  flex-direction: column;
  align-items: stretch;
  gap: 0;
}

.orders-dual-grid .orders-dual-panel__toolbar {
  justify-content: space-between;
}

.orders-dual-grid .orders-dual-panel__toolbar .orders-dual-panel__actions {
  width: auto;
  justify-content: flex-end;
  flex-shrink: 0;
}

.orders-dual-grid .orders-dual-panel__title {
  font-size: 1.125rem;
  line-height: 1.35;
}

@media (min-width: 640px) {
  .orders-dual-grid .orders-dual-panel__title {
    font-size: 1.25rem;
  }
}

@media (min-width: 1280px) {
  .orders-dual-grid .orders-dual-panel__header--paired,
  .orders-dual-grid .orders-dual-panel__header {
    min-height: 0;
  }

  .orders-dual-grid .orders-dual-panel__title {
    font-size: 1.375rem;
    line-height: 1.3;
  }
}

.orders-dual-panel {
  display: flex;
  flex-direction: column;
  min-height: 0;
  min-width: 0;
  max-width: 100%;
  padding: 1rem;
  border-radius: 1.25rem;
  box-sizing: border-box;
  overflow: visible;
}

@media (min-width: 640px) {
  .orders-dual-panel {
    padding: 1.25rem;
    border-radius: 1.5rem;
  }
}

@media (min-width: 1280px) {
  .orders-dual-panel {
    padding: 1.5rem;
    border-radius: 1.75rem;
  }
}

.orders-dual-panel__header {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  margin-bottom: 0.875rem;
  min-height: 0;
}

.orders-dual-panel__header--solo {
  margin-bottom: 1rem;
}

@media (min-width: 768px) {
  .orders-dual-panel__header {
    flex-direction: row;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    min-height: 4.75rem;
  }

  .orders-dual-panel__header--solo {
    min-height: 0;
  }
}

@media (min-width: 1280px) {
  .orders-dual-panel__header {
    min-height: 5.5rem;
  }
}

.orders-dual-panel__title-block {
  min-width: 0;
  flex: 1;
}

.orders-dual-panel__title {
  font-size: 1.25rem;
  line-height: 1.3;
  font-weight: 600;
  color: var(--vf-text-primary, #0f172a);
}

@media (min-width: 640px) {
  .orders-dual-panel__title {
    font-size: 1.375rem;
  }
}

@media (min-width: 1280px) {
  .orders-dual-panel__title {
    font-size: 1.5rem;
    line-height: 1.25;
  }
}

.orders-dual-panel__subtitle {
  margin-top: 0.5rem;
  font-size: 0.875rem;
  line-height: 1.45;
  color: var(--vf-text-muted, #64748b);
}

.orders-dual-panel__actions {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-start;
  gap: 0.5rem;
  flex-shrink: 0;
  width: 100%;
}

@media (min-width: 768px) {
  .orders-dual-panel__actions {
    justify-content: flex-end;
    width: auto;
    max-width: 100%;
  }
}

.orders-dual-panel__export-btn {
  white-space: nowrap;
}

.orders-dual-panel__meta {
  font-size: 0.75rem;
  line-height: 1.35;
  color: var(--vf-text-muted, #64748b);
}

.orders-dual-panel__live-badge {
  display: inline-flex;
  align-items: center;
  padding: 0.5rem 0.875rem;
  border-radius: 0.75rem;
  border: 1px solid rgba(34, 211, 238, 0.25);
  background: rgba(6, 182, 212, 0.1);
  font-size: 0.75rem;
  font-weight: 600;
  line-height: 1.25;
  color: #0e7490;
  white-space: nowrap;
}

@media (min-width: 640px) {
  .orders-dual-panel__live-badge {
    font-size: 0.8125rem;
    padding: 0.5rem 1rem;
  }
}

.orders-dual-panel__live-badge--amber {
  border-color: rgba(245, 158, 11, 0.35);
  background: rgba(245, 158, 11, 0.12);
  color: #b45309;
}

.orders-dual-panel__pager {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 0.5rem;
}

.orders-dual-panel__search {
  margin-bottom: 1rem;
}

.orders-dual-panel__body {
  flex: 0 1 auto;
  display: block;
  min-width: 0;
  max-width: 100%;
  overflow: visible;
}

.orders-dual-panel__list {
  width: 100%;
  min-width: 0;
  max-width: 100%;
  overflow: visible;
}

.orders-dual-panel__footer {
  flex-shrink: 0;
  margin-top: 0.75rem;
  padding-top: 0.75rem;
}

.orders-dual-panel__footer:not(.hidden) {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.75rem;
}

@media (max-width: 639px) {
  .orders-dual-panel__footer:not(.hidden) {
    flex-direction: column;
    align-items: stretch;
  }

  .orders-dual-panel__pager {
    justify-content: space-between;
    width: 100%;
  }
}

/* Orders — pending date filters */
.orders-pending-filters {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 0.5rem;
  margin-bottom: 1rem;
}

@media (min-width: 640px) {
  .orders-pending-filters {
    flex-direction: row;
    align-items: center;
    gap: 0.75rem;
  }
}

.orders-pending-filters__label {
  font-size: 0.6875rem;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--vf-text-muted, #64748b);
  flex-shrink: 0;
}

.orders-pending-filters__buttons {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem;
  min-width: 0;
}

.orders-pending-filters__btn {
  padding: 0.375rem 0.75rem;
  border-radius: 0.5rem;
  border: 1px solid var(--vf-border-subtle, #e2e8f0);
  background: #fff;
  font-size: 0.75rem;
  font-weight: 600;
  line-height: 1.25;
  color: var(--vf-text-muted, #64748b);
  transition:
    background-color 0.15s ease,
    border-color 0.15s ease,
    color 0.15s ease;
}

.orders-pending-filters__btn:hover {
  border-color: #cbd5e1;
  background: #f8fafc;
}

.orders-pending-filters__btn--active {
  border-color: rgba(245, 158, 11, 0.45);
  background: rgba(245, 158, 11, 0.12);
  color: #b45309;
}

/* Orders — movement analysis grid */
.orders-movement-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1rem;
  min-width: 0;
}

@media (min-width: 1024px) {
  .orders-movement-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
  }
}

.orders-movement-grid > div {
  min-width: 0;
  max-width: 100%;
  overflow: visible;
  box-sizing: border-box;
}

.orders-movement-grid .flex.items-center.justify-between {
  flex-wrap: wrap;
  gap: 0.5rem;
}

/* Orders — movement analysis grid */
@media (max-width: 639px) {
  .orders-page .ui-header-toolbar__controls {
    flex-direction: column;
    align-items: stretch;
    width: 100%;
  }

  .orders-page .ui-header-toolbar__controls .ui-date-toolbar__range {
    width: 100%;
    justify-content: center;
  }

  .orders-page .ui-header-toolbar__controls .ui-date-toolbar__range input {
    width: 6.75rem;
    max-width: 42%;
  }

  .orders-page .ui-header-toolbar__controls .ui-date-toolbar__quick {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.5rem;
    width: 100%;
  }

  .orders-page
    .ui-header-toolbar__controls
    .ui-date-toolbar__quick
    .quick-range-btn,
  .orders-page .ui-header-toolbar__controls .ui-date-toolbar__quick #drApply {
    width: 100%;
    justify-content: center;
  }

  .orders-page .ui-header-toolbar__trailing {
    width: 100%;
    flex-wrap: nowrap;
    justify-content: space-between;
  }

  .orders-page .ui-header-toolbar__trailing #drLiveRefresh {
    flex: 0 0 auto;
    width: auto;
  }
}

@media (max-width: 639px) {
  .legacy-app-shell .ui-main:has(.orders-page) {
    padding-top: 1rem !important;
    padding-left: 1rem !important;
    padding-right: 1rem !important;
    padding-bottom: var(--ke-mobile-content-bottom) !important;
    overflow-x: hidden;
    max-width: 100%;
  }
}

@media (max-width: 767px) {
  .legacy-app-shell.ui-app:has(.orders-page),
  .legacy-app-shell .ui-main:has(.orders-page) {
    overflow-x: hidden;
    max-width: 100%;
  }
}

@media (max-width: 479px) {
  #productPagination.flex {
    flex-direction: column;
    align-items: stretch;
    gap: 0.65rem;
  }

  #productPagination.flex > .flex.items-center {
    justify-content: space-between;
    width: 100%;
  }

  .orders-movement-grid #lowSellersPagination.flex,
  .orders-movement-grid #noMovePagination.flex {
    flex-direction: column;
    align-items: stretch;
    gap: 0.5rem;
  }

  .orders-movement-grid #lowSellersPagination .flex.items-center,
  .orders-movement-grid #noMovePagination .flex.items-center {
    justify-content: space-between;
    width: 100%;
  }
}

/* Orders — compact category leaderboard rows */
.orders-category-list {
  gap: 0.5rem;
}

.orders-category-row {
  border: 1px solid var(--vf-border-subtle, #e2e8f0);
  border-radius: 0.625rem;
  background: var(--vf-surface-muted, #f8fafc);
  padding: 0.5rem 0.625rem 0.45rem;
}

.orders-category-row__main {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
}

.orders-category-row__left {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  min-width: 0;
  flex: 1;
}

.orders-category-row__rank {
  width: 1.625rem;
  height: 1.625rem;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 0.375rem;
  border: 1px solid var(--vf-border-subtle, #e2e8f0);
  background: #fff;
  font-size: 0.6875rem;
  font-weight: 700;
  color: #0891b2;
}

.orders-category-row__thumb {
  width: 2.25rem;
  height: 2.25rem;
  flex-shrink: 0;
  border-radius: 0.375rem;
  object-fit: cover;
  border: 1px solid var(--vf-border-subtle, #e2e8f0);
  background: #fff;
}

.orders-category-row__thumb--placeholder {
  display: flex;
  align-items: center;
  justify-content: center;
  color: #94a3b8;
  font-size: 0.875rem;
}

.orders-category-row__name {
  font-size: 0.8125rem;
  font-weight: 600;
  line-height: 1.25;
  color: var(--vf-text-primary, #0f172a);
}

.orders-category-row__orders {
  margin-top: 0.125rem;
  font-size: 0.6875rem;
  line-height: 1.2;
  color: var(--vf-text-muted, #64748b);
}

.orders-category-row__revenue {
  font-size: 0.8125rem;
  font-weight: 700;
  line-height: 1.25;
  color: var(--vf-text-primary, #0f172a);
}

.orders-category-row__share {
  margin-top: 0.125rem;
  font-size: 0.6875rem;
  line-height: 1.2;
  color: #059669;
  font-weight: 500;
}

.orders-category-row__bar {
  margin-top: 0.375rem;
  height: 0.25rem;
  border-radius: 9999px;
  background: rgba(15, 23, 42, 0.06);
  overflow: hidden;
}

.orders-category-row__bar-fill {
  height: 100%;
  border-radius: 9999px;
  background: linear-gradient(90deg, #22d3ee, #a78bfa, #34d399);
}

/* Orders — compact revenue product rows */
.orders-product-list {
  gap: 0.5rem;
}

.orders-product-row {
  border: 1px solid var(--vf-border-subtle, #e2e8f0);
  border-radius: 0.625rem;
  background: var(--vf-surface-muted, #f8fafc);
  padding: 0.5rem 0.625rem 0.45rem;
}

.orders-product-row__main {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
}

.orders-product-row__left {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  min-width: 0;
  flex: 1;
}

.orders-product-row__rank {
  width: 1.625rem;
  height: 1.625rem;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 0.375rem;
  border: 1px solid #fed7aa;
  background: #fff7ed;
  font-size: 0.6875rem;
  font-weight: 700;
  color: #ea580c;
}

.orders-product-row__thumb {
  width: 2.25rem;
  height: 2.25rem;
  flex-shrink: 0;
  border-radius: 0.375rem;
  object-fit: cover;
  border: 1px solid var(--vf-border-subtle, #e2e8f0);
  background: #fff;
}

.orders-product-row__thumb--placeholder {
  display: flex;
  align-items: center;
  justify-content: center;
  color: #94a3b8;
  font-size: 0.875rem;
}

.orders-product-row__name {
  font-size: 0.8125rem;
  font-weight: 600;
  line-height: 1.25;
  color: var(--vf-text-primary, #0f172a);
}

.orders-product-row__sub {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.375rem;
  margin-top: 0.125rem;
}

.orders-product-row__sku {
  font-size: 0.6875rem;
  line-height: 1.2;
  color: var(--vf-text-muted, #64748b);
  max-width: 9rem;
}

.orders-product-row__orders {
  font-size: 0.625rem;
  line-height: 1.2;
  font-weight: 600;
  color: #0f766e;
  padding: 0.0625rem 0.375rem;
  border-radius: 9999px;
  background: #f0fdfa;
  border: 1px solid #99f6e4;
}

.orders-product-row__revenue {
  font-size: 0.8125rem;
  font-weight: 700;
  line-height: 1.25;
  color: var(--vf-text-primary, #0f172a);
}

.orders-product-row__share {
  margin-top: 0.125rem;
  font-size: 0.6875rem;
  line-height: 1.2;
  color: #64748b;
  font-weight: 500;
}

.orders-product-row__bar {
  margin-top: 0.375rem;
  height: 0.25rem;
  border-radius: 9999px;
  background: rgba(15, 23, 42, 0.06);
  overflow: hidden;
}

.orders-product-row__bar-fill {
  height: 100%;
  border-radius: 9999px;
  background: linear-gradient(90deg, #fb923c, #fdba74, #2dd4bf);
}

/* Orders — paired dual-grid row parity (category + revenue lists) */
.orders-dual-grid .orders-category-row,
.orders-dual-grid .orders-product-row {
  padding: 0.5rem 0.625rem 0.45rem;
  min-height: 4rem;
  box-sizing: border-box;
}

.orders-dual-grid .orders-category-row__main,
.orders-dual-grid .orders-product-row__main {
  min-height: 2.25rem;
  align-items: center;
}

.orders-dual-grid .orders-category-row__left,
.orders-dual-grid .orders-product-row__left {
  gap: 0.5rem;
}

.orders-dual-grid .orders-category-row__rank,
.orders-dual-grid .orders-product-row__rank {
  width: 1.625rem;
  height: 1.625rem;
  font-size: 0.6875rem;
}

.orders-dual-grid .orders-category-row__thumb,
.orders-dual-grid .orders-product-row__thumb {
  width: 2.25rem;
  height: 2.25rem;
  border-radius: 0.375rem;
}

.orders-dual-grid .orders-category-row__name,
.orders-dual-grid .orders-product-row__name {
  font-size: 0.8125rem;
  line-height: 1.25;
}

.orders-dual-grid .orders-category-row__orders,
.orders-dual-grid .orders-product-row__sku {
  font-size: 0.6875rem;
  line-height: 1.2;
  margin-top: 0.125rem;
}

.orders-dual-grid .orders-product-row__sub {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.375rem;
  margin-top: 0.125rem;
}

.orders-dual-grid .orders-product-row__orders {
  font-size: 0.6875rem;
  line-height: 1.2;
  font-weight: 400;
  color: var(--vf-text-muted, #64748b);
  padding: 0;
  border: none;
  background: transparent;
  border-radius: 0;
}

.orders-dual-grid .orders-category-row__revenue,
.orders-dual-grid .orders-product-row__revenue {
  font-size: 0.8125rem;
  line-height: 1.25;
}

.orders-dual-grid .orders-category-row__share,
.orders-dual-grid .orders-product-row__share {
  margin-top: 0.125rem;
  font-size: 0.6875rem;
  line-height: 1.2;
  font-weight: 500;
  color: #64748b;
}

.orders-dual-grid .orders-category-row__bar,
.orders-dual-grid .orders-product-row__bar {
  margin-top: 0.375rem;
  height: 0.25rem;
}

/* Orders — compact pending shipment rows */
.orders-pending-list {
  gap: 0.5rem;
}

.orders-pending-row {
  border: 1px solid var(--vf-border-subtle, #e2e8f0);
  border-radius: 0.625rem;
  background: var(--vf-surface-muted, #f8fafc);
  padding: 0.5rem 0.625rem;
}

.orders-pending-row__main {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
}

.orders-pending-row__left {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  min-width: 0;
  flex: 1;
}

.orders-pending-row__rank {
  width: 1.625rem;
  height: 1.625rem;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 0.375rem;
  border: 1px solid #fde68a;
  background: #fffbeb;
  font-size: 0.6875rem;
  font-weight: 700;
  color: #d97706;
}

.orders-pending-row__thumb {
  width: 2.25rem;
  height: 2.25rem;
  flex-shrink: 0;
  border-radius: 0.375rem;
  object-fit: cover;
  border: 1px solid var(--vf-border-subtle, #e2e8f0);
  background: #fff;
}

.orders-pending-row__thumb--placeholder {
  display: flex;
  align-items: center;
  justify-content: center;
  color: #94a3b8;
  font-size: 0.875rem;
}

.orders-pending-row__name {
  font-size: 0.8125rem;
  font-weight: 600;
  line-height: 1.25;
  color: var(--vf-text-primary, #0f172a);
}

.orders-pending-row__sku {
  margin-top: 0.125rem;
  font-size: 0.6875rem;
  line-height: 1.2;
  color: var(--vf-text-muted, #64748b);
}

.orders-pending-row__count {
  font-size: 0.8125rem;
  font-weight: 700;
  line-height: 1.25;
  color: #d97706;
}

.orders-pending-row__label {
  margin-top: 0.125rem;
  font-size: 0.6875rem;
  line-height: 1.2;
  color: var(--vf-text-muted, #64748b);
}

/* Orders — compact movement analysis rows */
.orders-movement-list {
  list-style: none;
  padding: 0;
  margin: 0;
}

.orders-movement-row {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.375rem 0.5rem;
  border-radius: 0.5rem;
  border: 1px solid var(--vf-border-subtle, #e2e8f0);
  background: rgba(255, 255, 255, 0.75);
  min-width: 0;
}

.orders-movement-row__rank {
  width: 1.375rem;
  height: 1.375rem;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 0.25rem;
  font-size: 0.625rem;
  font-weight: 700;
  color: var(--vf-text-primary, #0f172a);
  background: #fff;
  border: 1px solid var(--vf-border-subtle, #e2e8f0);
}

.orders-movement-row__thumb {
  width: 1.75rem;
  height: 1.75rem;
  flex-shrink: 0;
  border-radius: 0.25rem;
  object-fit: cover;
  border: 1px solid var(--vf-border-subtle, #e2e8f0);
  background: #fff;
}

.orders-movement-row__thumb--placeholder {
  display: flex;
  align-items: center;
  justify-content: center;
  color: #94a3b8;
  font-size: 0.75rem;
}

.orders-movement-row__name {
  flex: 1;
  min-width: 0;
  font-size: 0.75rem;
  line-height: 1.25;
  color: var(--vf-text-primary, #0f172a);
}

.orders-movement-row__qty {
  font-size: 0.75rem;
  min-width: 1.5rem;
  text-align: right;
  color: var(--vf-text-primary, #0f172a);
}

/* Orders — disable panel and row hover on list tables */
.orders-page .glass-panel:hover {
  transform: none !important;
  box-shadow: none !important;
  border-color: #e4e4e7 !important;
}

.orders-page .orders-category-row:hover,
.orders-page .orders-product-row:hover,
.orders-page .orders-pending-row:hover {
  background: var(--vf-surface-muted, #f8fafc);
  border-color: var(--vf-border-subtle, #e2e8f0);
}

.orders-page .orders-movement-row:hover {
  background: rgba(255, 255, 255, 0.75);
  border-color: var(--vf-border-subtle, #e2e8f0);
}

/* Products table — compact rows */
.pr-product-table-row__thumb {
  width: 2.5rem;
  height: 2.5rem;
  flex-shrink: 0;
  border-radius: 0.375rem;
  object-fit: cover;
  border: 1px solid var(--vf-border-subtle, #e2e8f0);
  background: #fff;
}

.pr-product-table-row__thumb--placeholder {
  display: flex;
  align-items: center;
  justify-content: center;
  color: #94a3b8;
  font-size: 0.875rem;
}

.pr-product-table-row__name {
  font-size: 0.8125rem;
  font-weight: 600;
  line-height: 1.25;
  color: var(--vf-text-primary, #0f172a);
}

.pr-product-table-row__sku {
  margin-top: 0.125rem;
  font-size: 0.6875rem;
  line-height: 1.2;
  color: var(--vf-text-muted, #64748b);
}

.pr-product-table-row__index {
  width: 2.5rem;
  text-align: center;
}

.pr-product-table-row__field {
  display: flex;
  align-items: center;
  gap: 0.375rem;
}

.pr-product-table-row__save-state {
  display: inline-flex;
  width: 1.25rem;
  height: 1.25rem;
  flex-shrink: 0;
  align-items: center;
  justify-content: center;
  font-size: 0.875rem;
  color: #94a3b8;
}

.pr-product-table-row__input--dirty {
  border-color: #f59e0b !important;
  box-shadow: 0 0 0 1px rgba(245, 158, 11, 0.18);
}

.pr-product-table-row__input--error {
  border-color: #f43f5e !important;
  box-shadow: 0 0 0 1px rgba(244, 63, 94, 0.15);
}

.pr-product-table-row__input:disabled {
  opacity: 0.65;
  cursor: wait;
}

.pr-product-table-row__save-state--saving {
  color: #64748b;
}

.pr-product-table-row__save-state--saved {
  color: #10b981;
}

.pr-product-table-row__save-state--error {
  color: #f43f5e;
}

/* Finance — expense breakdown donut (responsive-safe) */
.fin-expense-panel {
  min-width: 0;
  max-width: 100%;
  overflow: hidden;
  box-sizing: border-box;
}

.fin-expense-chart {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  min-width: 0;
  max-width: 100%;
}

.fin-expense-chart__ring {
  position: relative;
  width: 100%;
  height: 11.5rem;
  min-height: 11.5rem;
  max-height: 11.5rem;
  flex-shrink: 0;
  overflow: hidden;
}

.fin-expense-chart__ring canvas {
  display: block;
  width: 100% !important;
  height: 100% !important;
  max-width: 100%;
}

.fin-expense-chart__legend {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.45rem 0.65rem;
  width: 100%;
  min-width: 0;
}

@media (min-width: 480px) {
  .fin-expense-chart__legend {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

.fin-expense-chart__legend-item {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  min-width: 0;
  font-size: 0.6875rem;
  font-weight: 600;
  line-height: 1.25;
  color: #334155;
}

.fin-expense-chart__legend-swatch {
  width: 0.625rem;
  height: 0.625rem;
  border-radius: 0.125rem;
  flex-shrink: 0;
}

.fin-expense-chart__legend-label {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* Finance — monthly net sales history (scrollable chart + table) */
.fin-monthly-body {
  align-items: stretch;
}

.fin-monthly-chart-panel,
.fin-monthly-table-panel {
  height: 17.5rem;
}

@media (min-width: 640px) {
  .fin-monthly-chart-panel,
  .fin-monthly-table-panel {
    height: 21.25rem;
  }
}

.fin-monthly-chart-scroll {
  width: 100%;
  height: 100%;
  overflow-x: auto;
  overflow-y: hidden;
  scrollbar-width: thin;
  scrollbar-color: rgba(167, 139, 250, 0.45) transparent;
}

.fin-monthly-chart-scroll::-webkit-scrollbar {
  height: 6px;
}

.fin-monthly-chart-scroll::-webkit-scrollbar-thumb {
  background: rgba(167, 139, 250, 0.45);
  border-radius: 999px;
}

.fin-monthly-chart-inner {
  height: 100%;
  min-width: 100%;
}

.fin-monthly-chart-inner canvas {
  display: block;
  width: 100% !important;
  height: 100% !important;
}

.fin-monthly-table-scroll {
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-width: thin;
  scrollbar-color: rgba(100, 116, 139, 0.45) transparent;
  padding-right: 0.15rem;
}

.fin-monthly-table-scroll::-webkit-scrollbar {
  width: 5px;
}

.fin-monthly-table-scroll::-webkit-scrollbar-thumb {
  background: rgba(100, 116, 139, 0.4);
  border-radius: 999px;
}

.fin-monthly-table-scroll--compact .fin-monthly-table-row {
  padding-top: 0.35rem;
  padding-bottom: 0.35rem;
  font-size: 0.75rem;
}

.fin-monthly-table-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  border-radius: 0.75rem;
  padding: 0.5rem 0.75rem;
}

.fin-monthly-table-row__label {
  min-width: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.fin-monthly-table-row__value {
  flex-shrink: 0;
  font-variant-numeric: tabular-nums;
  text-align: right;
}

/* Finance — performance chart container (prevents canvas squash on mobile) */
.fin-performance-chart-wrap {
  position: relative;
  width: 100%;
  height: 15.625rem;
  min-height: 15.625rem;
  max-height: 15.625rem;
  overflow: hidden;
}

.fin-performance-chart-wrap canvas {
  display: block;
  width: 100% !important;
  height: 100% !important;
  max-width: 100%;
}

/* ─── İade İptal Tazmin page ─── */
.iit-page {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  box-sizing: border-box;
}

.iit-page > * {
  min-width: 0;
  max-width: 100%;
  box-sizing: border-box;
}

.iit-page .grid {
  gap: 1.25rem !important;
}

@media (min-width: 768px) {
  .iit-page {
    gap: 1.75rem;
  }

  .iit-page .grid {
    gap: 1.5rem !important;
  }
}

.iit-page__header {
  margin-bottom: 0;
}

.iit-page__eyebrow {
  font-size: 0.6875rem;
  font-weight: 600;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--ke-text-muted, #64748b);
  margin-bottom: 0.375rem;
}

.iit-page__title {
  margin: 0;
  font-size: 1.5rem;
  font-weight: 700;
  line-height: 1.25;
  letter-spacing: -0.01em;
  color: var(--ke-navy, #0f172a);
}

.iit-page__subtitle {
  margin: 0.5rem 0 0;
  font-size: 0.8125rem;
  line-height: 1.5;
  color: var(--ke-text-muted, #64748b);
}

.iit-page__meta {
  margin: 0.375rem 0 0;
  font-size: 0.75rem;
  line-height: 1.45;
  color: #64748b;
}

.iit-page__meta-sep {
  margin: 0 0.375rem;
  color: #cbd5e1;
}

.iit-kpi {
  padding: 1.25rem 1.375rem !important;
  border-radius: 1rem !important;
}

@media (min-width: 768px) {
  .iit-kpi {
    padding: 1.375rem 1.5rem !important;
  }
}

.iit-kpi--cyan {
  border-color: rgb(34 211 238 / 0.25) !important;
  background: rgb(6 182 212 / 0.04) !important;
}

.iit-kpi--amber {
  border-color: rgb(251 191 36 / 0.25) !important;
  background: rgb(245 158 11 / 0.04) !important;
}

.iit-kpi--rose {
  border-color: rgb(251 113 133 / 0.25) !important;
  background: rgb(244 63 94 / 0.04) !important;
}

.iit-kpi--orange {
  border-color: rgb(251 146 60 / 0.25) !important;
  background: rgb(249 115 22 / 0.04) !important;
}

.iit-kpi__label {
  font-size: 0.8125rem;
  font-weight: 600;
  line-height: 1.35;
  color: var(--ke-text-muted, #64748b);
  margin-bottom: 0.5rem;
}

.iit-kpi__value {
  font-size: 1.5rem;
  font-weight: 800;
  line-height: 1.15;
  letter-spacing: -0.02em;
  color: var(--ke-navy, #0f172a);
}

.iit-kpi__value--hero {
  font-size: 2rem;
}

.iit-kpi--cyan .iit-kpi__value {
  color: #0891b2;
}

.iit-kpi--amber .iit-kpi__value {
  color: #d97706;
}

.iit-kpi--rose .iit-kpi__value {
  color: #e11d48;
}

.iit-kpi--orange .iit-kpi__value {
  color: #ea580c;
}

.iit-kpi__hint {
  margin-top: 0.625rem;
  font-size: 0.75rem;
  line-height: 1.5;
  color: #64748b;
}

.iit-panel {
  padding: 1.375rem 1.5rem !important;
  border-radius: 1rem !important;
}

@media (min-width: 768px) {
  .iit-panel {
    padding: 1.5rem 1.625rem !important;
  }
}

.iit-panel--accent {
  border-color: rgb(59 130 246 / 0.2) !important;
  background: rgb(59 130 246 / 0.03) !important;
}

.iit-panel--sky {
  border-color: rgb(14 165 233 / 0.2) !important;
  background: rgb(14 165 233 / 0.03) !important;
}

.iit-panel--violet {
  border-color: rgb(139 92 246 / 0.2) !important;
  background: rgb(139 92 246 / 0.03) !important;
}

.iit-panel--comp {
  border-color: rgb(6 182 212 / 0.2) !important;
  background: rgb(6 182 212 / 0.03) !important;
}

.iit-panel--accent,
.iit-panel--sky,
.iit-panel--violet,
.iit-panel--comp {
  --iit-inset: 0.625rem;
}

@media (min-width: 768px) {
  .iit-panel--accent,
  .iit-panel--sky,
  .iit-panel--violet,
  .iit-panel--comp {
    --iit-inset: 0.875rem;
  }
}

/* Inset titles & body from panel left & right edges */
.iit-panel--accent > .iit-panel__title,
.iit-panel--violet > .iit-panel__title,
.iit-panel--sky > .iit-panel__head,
.iit-panel--comp > .iit-panel__head,
.iit-panel--accent > .iit-list--reasons,
.iit-panel--accent > .iit-list--cards,
.iit-panel--violet > .iit-list--cards,
.iit-panel--sky > .iit-list--cards,
.iit-panel--comp > .iit-comp-grid,
.iit-panel--comp > .iit-comp-detail {
  margin-inline: var(--iit-inset);
  max-width: calc(100% - (var(--iit-inset) * 2));
  box-sizing: border-box;
}

.iit-panel__head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  flex-wrap: wrap;
  margin-bottom: 1.25rem;
}

.iit-panel__title {
  margin: 0 0 0.625rem;
  font-size: 1rem;
  font-weight: 700;
  line-height: 1.35;
  color: var(--ke-navy, #0f172a);
}

.iit-panel > .iit-panel__title:has(+ .iit-list--ranked) {
  margin-bottom: 1.125rem;
}

.iit-panel > .iit-panel__title:has(+ .iit-list--cards),
.iit-panel > .iit-panel__title:has(+ .iit-list--reasons) {
  margin-bottom: 1.125rem;
}

.iit-panel__head + .iit-list--cards {
  margin-top: 0.25rem;
}

.iit-panel__head .iit-panel__title {
  margin-bottom: 0.375rem;
}

.iit-panel__subtitle {
  margin: 0;
  font-size: 0.75rem;
  line-height: 1.5;
  color: var(--ke-text-muted, #64748b);
}

.iit-badge {
  display: inline-flex;
  align-items: center;
  max-width: 100%;
  padding: 0.25rem 0.625rem;
  border-radius: 0.5rem;
  font-size: 0.6875rem;
  font-weight: 600;
  line-height: 1.35;
  white-space: normal;
}

.iit-badge--sky {
  border: 1px solid rgb(14 165 233 / 0.2);
  background: rgb(14 165 233 / 0.08);
  color: #0369a1;
}

.iit-badge--cyan {
  border: 1px solid rgb(6 182 212 / 0.2);
  background: rgb(6 182 212 / 0.08);
  color: #0e7490;
}

.iit-list {
  display: flex;
  flex-direction: column;
  gap: 0.625rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.iit-list--compact {
  gap: 0.5rem;
}

.iit-list--cargo {
  gap: 0.875rem;
}

.iit-list--insights {
  gap: 0.75rem;
}

/* Card-style rows — reasons, cargo, insights, compensation status */
.iit-list--cards {
  gap: 0.75rem;
}

.iit-list--cards .iit-list__item {
  padding: 0.875rem 1rem;
  border: 1px solid #e2e8f0;
  border-radius: 0.75rem;
  background: #ffffff;
  border-bottom: none;
}

.iit-panel--accent .iit-list--cards .iit-list__item {
  border-color: rgb(59 130 246 / 0.18);
  background: rgb(255 255 255 / 0.92);
}

.iit-panel--sky .iit-list--cards .iit-cargo-item {
  padding: 0.875rem 1rem;
  border: 1px solid rgb(14 165 233 / 0.18);
  border-radius: 0.75rem;
  background: #ffffff;
}

.iit-panel--violet .iit-list--cards .iit-insight {
  padding: 0.875rem 1rem;
  border: 1px solid rgb(139 92 246 / 0.18);
  border-radius: 0.75rem;
  background: #ffffff;
}

.iit-panel--comp .iit-list--cards .iit-list__item {
  border-color: rgb(6 182 212 / 0.18);
  background: #ffffff;
}

.iit-list--cards .iit-list__empty {
  padding: 1rem;
  border: 1px dashed #e2e8f0;
  border-radius: 0.75rem;
  background: rgb(248 250 252 / 0.9);
  text-align: center;
}

/* Compact table — return reasons */
.iit-list--reasons {
  gap: 0;
  border: 1px solid rgb(59 130 246 / 0.15);
  border-radius: 0.5rem;
  overflow: hidden;
  background: #ffffff;
}

.iit-reasons-row {
  display: grid;
  grid-template-columns: 1.5rem minmax(0, 1fr) auto;
  align-items: center;
  gap: 0.5rem;
  padding: 0.3125rem 0.625rem;
  min-height: 1.75rem;
  font-size: 0.75rem;
  line-height: 1.3;
  border-bottom: 1px solid #f1f5f9;
}

.iit-reasons-row:last-child {
  border-bottom: none;
}

.iit-reasons-row:nth-child(even) {
  background: rgb(248 250 252 / 0.65);
}

.iit-reasons-row__index {
  font-size: 0.6875rem;
  font-weight: 700;
  text-align: center;
  color: #94a3b8;
}

.iit-reasons-row__label {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: #334155;
}

.iit-reasons-row__value {
  flex-shrink: 0;
  font-size: 0.6875rem;
  font-weight: 600;
  color: #2563eb;
  white-space: nowrap;
}

.iit-reasons-row--empty {
  display: block;
  grid-template-columns: none;
  padding: 0.625rem;
  text-align: center;
  font-size: 0.75rem;
  color: #64748b;
  border-bottom: none;
  background: transparent;
}

/* Ranked product rows */
.iit-list--ranked {
  gap: 0.625rem;
}

.iit-list--ranked .iit-list__item {
  display: grid;
  grid-template-columns: 2rem minmax(0, 1fr) auto;
  align-items: center;
  gap: 0.75rem;
  padding: 0.75rem 1rem;
  border: 1px solid #e2e8f0;
  border-radius: 0.75rem;
  background: #ffffff;
  border-bottom: none;
}

.iit-list__item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding-bottom: 0;
  border-bottom: none;
  font-size: 0.8125rem;
  line-height: 1.45;
}

.iit-list__label {
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: #334155;
}

.iit-list__value {
  flex-shrink: 0;
  font-weight: 600;
  color: #0f172a;
}

.iit-list__value--primary {
  color: #2563eb;
}

.iit-list__value--rose {
  color: #e11d48;
}

.iit-list__value--amber {
  color: #d97706;
}

.iit-list__empty {
  font-size: 0.8125rem;
  line-height: 1.45;
  color: var(--ke-text-muted, #64748b);
}

.iit-cargo-item {
  display: flex;
  flex-direction: column;
  gap: 0.625rem;
}

.iit-cargo-item__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  font-size: 0.8125rem;
  line-height: 1.45;
}

.iit-cargo-item__name {
  font-weight: 600;
  color: #0f172a;
}

.iit-cargo-item__meta {
  flex-shrink: 0;
  font-weight: 700;
  color: #0369a1;
}

.iit-cargo-item__track {
  height: 0.375rem;
  border-radius: 999px;
  background: #f1f5f9;
  overflow: hidden;
}

.iit-cargo-item__bar {
  height: 100%;
  border-radius: 999px;
  background: rgb(14 165 233 / 0.75);
}

.iit-insight {
  display: flex;
  align-items: flex-start;
  gap: 0.625rem;
  font-size: 0.8125rem;
  line-height: 1.5;
  color: #475569;
}

.iit-insight__icon {
  flex-shrink: 0;
  margin-top: 0.125rem;
  font-size: 0.875rem;
  color: #8b5cf6;
}

.iit-comp-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1rem;
  margin-bottom: 1.25rem;
}

@media (min-width: 768px) {
  .iit-comp-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

.iit-comp-stat {
  padding: 1rem 1.125rem;
  border-radius: 0.75rem;
  border: 1px solid transparent;
}

.iit-comp-stat--amber {
  border-color: rgb(251 191 36 / 0.25);
  background: rgb(245 158 11 / 0.08);
}

.iit-comp-stat--emerald {
  border-color: rgb(52 211 153 / 0.25);
  background: rgb(16 185 129 / 0.08);
}

.iit-comp-stat--rose {
  border-color: rgb(251 113 133 / 0.25);
  background: rgb(244 63 94 / 0.08);
}

.iit-comp-stat__label {
  font-size: 0.6875rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #64748b;
}

.iit-comp-stat--amber .iit-comp-stat__label {
  color: #b45309;
}

.iit-comp-stat--emerald .iit-comp-stat__label {
  color: #047857;
}

.iit-comp-stat--rose .iit-comp-stat__label {
  color: #be123c;
}

.iit-comp-stat__value {
  margin-top: 0.375rem;
  font-size: 1.125rem;
  font-weight: 700;
  line-height: 1.2;
  color: #0f172a;
}

.iit-comp-stat--amber .iit-comp-stat__value {
  color: #d97706;
}

.iit-comp-stat--emerald .iit-comp-stat__value {
  color: #059669;
}

.iit-comp-stat--rose .iit-comp-stat__value {
  color: #e11d48;
}

.iit-comp-detail {
  padding: 1.25rem;
  border-radius: 0.75rem;
  border: 1px solid #e2e8f0;
  background: #f8fafc;
}

.iit-comp-detail__label {
  margin-bottom: 0.875rem;
  font-size: 0.6875rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #64748b;
}

.iit-comp-detail .iit-list--cards {
  margin-bottom: 0;
}

.iit-comp-detail__total {
  margin-top: 0.875rem;
  padding-top: 0.875rem;
  border-top: 1px solid #e2e8f0;
  font-size: 0.8125rem;
  line-height: 1.5;
  color: #0e7490;
}

.iit-comp-detail__total span {
  font-weight: 600;
}

.iit-list__index {
  flex-shrink: 0;
  width: 2rem;
  font-size: 0.75rem;
  font-weight: 700;
  line-height: 1;
  text-align: center;
  color: #94a3b8;
}

.iit-pagination {
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  flex-wrap: wrap;
  padding-top: 1rem;
  margin-top: 1rem;
  border-top: 1px solid #e2e8f0;
}

.iit-pagination__info {
  font-size: 0.75rem;
  line-height: 1.35;
  color: #64748b;
}

.iit-pagination__controls {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  flex-shrink: 0;
}

.iit-pagination__label {
  font-size: 0.75rem;
  font-weight: 600;
  color: #64748b;
  white-space: nowrap;
}

.iit-pagination__btn {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  padding: 0.375rem 0.625rem;
  border: 1px solid #e2e8f0;
  border-radius: 0.5rem;
  background: #ffffff;
  font-size: 0.75rem;
  font-weight: 600;
  line-height: 1.2;
  color: #334155;
  cursor: pointer;
  transition:
    background-color 0.15s ease,
    opacity 0.15s ease;
}

.iit-pagination__btn:hover:not(:disabled) {
  background: #f8fafc;
}

.iit-pagination__btn:disabled {
  opacity: 0.4;
  cursor: not-allowed;
}

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

  .iit-pagination__controls {
    justify-content: space-between;
  }
}

.iit-page .glass-panel:hover {
  transform: none;
}

/* Manuel Finans — index column alignment */
.mf-finance-table .mf-finance-table__index {
  width: 2.75rem;
  min-width: 2.75rem;
  max-width: 2.75rem;
  padding-left: 0.5rem;
  padding-right: 0.5rem;
  text-align: center;
  font-size: 0.8125rem;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  color: #64748b;
  vertical-align: middle;
}

.mf-finance-table thead .mf-finance-table__index {
  color: #94a3b8;
}

/* Stok Takip — unified page horizontal inset */
.st-page {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
  width: 100%;
  --st-panel-inset: 1rem;
}

@media (min-width: 768px) {
  .st-page {
    gap: 1.5rem;
    --st-panel-inset: 1.25rem;
  }
}

.st-page .st-panel-inset {
  padding-inline: var(--st-panel-inset);
}

.st-settings-panel__inner.st-panel-inset {
  padding-top: 0.875rem;
  padding-bottom: 0.875rem;
}

.st-products-panel__head {
  padding-top: 1rem;
  padding-bottom: 1rem;
}

/* Table spans full panel width — no side inset */
.st-products-panel .st-stock-table-wrap {
  padding-top: 0.25rem;
  padding-bottom: 0.25rem;
}

/* Stok Takip — settings panel */
.st-settings-panel {
  box-sizing: border-box;
}

.st-settings-panel__inner {
  padding-top: 0.875rem;
  padding-bottom: 0.875rem;
}

@media (min-width: 768px) {
  .st-settings-panel__inner {
    padding-top: 1rem;
    padding-bottom: 1rem;
  }
}

/* B2B Online — compact proportional layout */
.b2b-page {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  width: 100%;
  --b2b-panel-inset: 1rem;
}

@media (min-width: 768px) {
  .b2b-page {
    gap: 1.25rem;
    --b2b-panel-inset: 1.25rem;
  }
}

.b2b-page .b2b-panel-inset {
  padding-inline: var(--b2b-panel-inset);
}

/* Warning: Trendyol sale price dropped below B2B floor */
.b2b-below-alert {
  border: 1px solid rgba(244, 63, 94, 0.28);
  background:
    linear-gradient(135deg, rgba(255, 241, 242, 0.96), rgba(255, 247, 237, 0.92));
  border-radius: 1.15rem;
  padding: 0.9rem 1rem 0.75rem;
  box-shadow: 0 10px 28px rgba(244, 63, 94, 0.06);
}

.b2b-below-alert.hidden {
  display: none;
}

.b2b-below-alert__head {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  gap: 0.75rem 1rem;
}

.b2b-below-alert__icon {
  width: 2.25rem;
  height: 2.25rem;
  border-radius: 9999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  background: rgba(244, 63, 94, 0.12);
  color: #be123c;
  font-size: 1.25rem;
}

.b2b-below-alert__copy {
  flex: 1 1 12rem;
}

.b2b-below-alert__title {
  font-size: 0.875rem;
  font-weight: 700;
  color: #9f1239;
  line-height: 1.3;
}

.b2b-below-alert__sub {
  margin-top: 0.2rem;
  font-size: 0.75rem;
  color: #9f1239;
  opacity: 0.85;
  line-height: 1.45;
}

.b2b-below-alert__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  margin-left: auto;
}

.b2b-below-alert__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 0.65rem;
  border: 1px solid rgba(190, 18, 60, 0.28);
  background: #fff;
  color: #9f1239;
  font-size: 0.6875rem;
  font-weight: 700;
  padding: 0.4rem 0.7rem;
  cursor: pointer;
  transition: background 0.15s ease, border-color 0.15s ease;
}

.b2b-below-alert__btn:hover {
  background: rgba(255, 228, 230, 0.9);
  border-color: rgba(190, 18, 60, 0.45);
}

.b2b-below-alert__btn--ghost {
  background: transparent;
}

.b2b-below-alert__list {
  list-style: none;
  margin: 0.75rem 0 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
}

.b2b-below-alert__item-btn {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 0.35rem 0.75rem;
  text-align: left;
  border: 1px solid rgba(244, 63, 94, 0.12);
  background: rgba(255, 255, 255, 0.72);
  border-radius: 0.7rem;
  padding: 0.45rem 0.65rem;
  cursor: pointer;
  transition: background 0.15s ease, border-color 0.15s ease;
}

.b2b-below-alert__item-btn:hover {
  background: #fff;
  border-color: rgba(244, 63, 94, 0.28);
}

.b2b-below-alert__item-name {
  font-size: 0.75rem;
  font-weight: 600;
  color: #0f172a;
  min-width: 0;
  flex: 1 1 10rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.b2b-below-alert__item-meta {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 0.45rem 0.7rem;
  font-size: 0.6875rem;
  color: #64748b;
  font-variant-numeric: tabular-nums;
}

.b2b-below-alert__gap {
  color: #e11d48;
  font-weight: 700;
}

.b2b-below-alert__more {
  font-size: 0.6875rem;
  color: #9f1239;
  opacity: 0.8;
  padding: 0.25rem 0.15rem 0;
}

.b2b-match-badge--danger {
  display: inline-flex;
  align-items: center;
  gap: 0.2rem;
  color: #be123c;
  background: rgba(244, 63, 94, 0.1);
  border: 1px solid rgba(244, 63, 94, 0.22);
}

.b2b-summary-card--below {
  cursor: pointer;
  transition: border-color 0.15s ease, box-shadow 0.15s ease, transform 0.15s ease;
}

.b2b-summary-card--below:hover {
  border-color: rgba(244, 63, 94, 0.55);
  box-shadow: 0 8px 20px rgba(244, 63, 94, 0.08);
}

.b2b-summary-card--below-active {
  border-color: rgba(190, 18, 60, 0.65);
  box-shadow: 0 0 0 2px rgba(244, 63, 94, 0.18);
}

.b2b-summary-card--below:not(.b2b-summary-card--below-active) [data-b2b-below]:is(:empty),
.b2b-summary-card--below [data-b2b-below] {
  letter-spacing: -0.02em;
}

@media (max-width: 640px) {
  .b2b-below-alert__actions {
    width: 100%;
    margin-left: 0;
  }

  .b2b-below-alert__btn {
    flex: 1 1 auto;
  }
}

.b2b-upload-panel__inner {
  display: flex;
  flex-direction: column;
  gap: 0.875rem;
  padding-top: 0.875rem;
  padding-bottom: 0.875rem;
}

@media (min-width: 1024px) {
  .b2b-upload-panel__inner {
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    gap: 1rem 1.25rem;
  }
}

.b2b-upload-panel__intro {
  min-width: 0;
  flex: 1 1 auto;
}

.b2b-upload-panel__tools {
  display: flex;
  flex-direction: column;
  gap: 0.65rem;
  width: 100%;
  flex-shrink: 0;
}

@media (min-width: 768px) {
  .b2b-upload-panel__tools {
    flex-direction: row;
    align-items: center;
    width: auto;
    max-width: 100%;
  }
}

.b2b-replace-toggle {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  min-height: 2.375rem;
  padding: 0.45rem 0.8rem;
  border: 1px solid #e4e4e7;
  border-radius: 10px;
  background: #fafafa;
  cursor: pointer;
  user-select: none;
  white-space: nowrap;
  flex-shrink: 0;
  transition:
    border-color 0.15s ease,
    background-color 0.15s ease,
    box-shadow 0.15s ease;
}

.b2b-replace-toggle:hover {
  border-color: #d4d4d8;
  background: #ffffff;
}

.b2b-replace-toggle:has(.b2b-replace-toggle__input:checked) {
  border-color: #ffd3ba;
  background: #fff7ed;
  box-shadow: 0 0 0 1px rgba(255, 107, 53, 0.08);
}

.b2b-replace-toggle:has(.b2b-replace-toggle__input:focus-visible) {
  outline: 2px solid rgba(255, 107, 53, 0.35);
  outline-offset: 2px;
}

.b2b-replace-toggle__input {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.b2b-replace-toggle__control {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 1.125rem;
  height: 1.125rem;
  border: 1.5px solid #d4d4d8;
  border-radius: 4px;
  background: #ffffff;
  color: #ffffff;
  transition:
    background-color 0.15s ease,
    border-color 0.15s ease;
}

.b2b-replace-toggle__check {
  font-size: 0.7rem;
  line-height: 1;
  opacity: 0;
  transform: scale(0.75);
  transition:
    opacity 0.15s ease,
    transform 0.15s ease;
}

.b2b-replace-toggle__input:checked + .b2b-replace-toggle__control {
  background: #ff6b35;
  border-color: #e85a24;
}

.b2b-replace-toggle__input:checked + .b2b-replace-toggle__control .b2b-replace-toggle__check {
  opacity: 1;
  transform: scale(1);
}

.b2b-replace-toggle__label {
  font-size: 0.75rem;
  font-weight: 600;
  line-height: 1.2;
  color: #334155;
}

.b2b-upload-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.45rem;
  flex: 1 1 auto;
}

.b2b-upload-actions__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.35rem;
  min-height: 2.375rem;
  padding: 0.45rem 0.8rem;
  border-radius: 10px;
  border: 1px solid transparent;
  font-size: 0.75rem;
  font-weight: 600;
  line-height: 1.2;
  white-space: nowrap;
  transition:
    background-color 0.15s ease,
    border-color 0.15s ease,
    color 0.15s ease,
    opacity 0.15s ease;
}

.b2b-upload-actions__btn i {
  font-size: 0.95rem;
  line-height: 1;
}

.b2b-upload-actions__btn--ghost {
  border-color: #d4d4d8;
  background: #ffffff;
  color: #334155;
}

.b2b-upload-actions__btn--ghost:hover {
  background: #f8fafc;
  border-color: #cbd5e1;
}

.b2b-upload-actions__btn--danger {
  border-color: #fecdd3;
  background: #fff1f2;
  color: #be123c;
}

.b2b-upload-actions__btn--danger:hover {
  background: #ffe4e6;
  border-color: #fda4af;
}

.b2b-upload-actions__btn--primary {
  border-color: #e85a24;
  background: #ff6b35;
  color: #ffffff;
}

.b2b-upload-actions__btn--primary:hover {
  opacity: 0.92;
}

@media (max-width: 639px) {
  .b2b-upload-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    width: 100%;
  }

  .b2b-upload-actions__btn {
    width: 100%;
  }

  .b2b-upload-actions__btn--primary {
    grid-column: 1 / -1;
  }

  .b2b-replace-toggle {
    width: 100%;
    justify-content: flex-start;
  }
}

.b2b-table-panel__head {
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
}

.b2b-table-wrap {
  overflow: visible;
}

.b2b-price-table {
  width: 100%;
  table-layout: fixed;
  font-size: 0.8125rem;
}

.b2b-price-table .b2b-price-table__index {
  width: 2.25rem;
  min-width: 2.25rem;
  max-width: 2.25rem;
  text-align: center;
  font-size: 0.75rem;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  color: #64748b;
}

.b2b-price-table .b2b-price-table__product {
  width: 36%;
}

.b2b-price-table .b2b-price-table__barcode {
  width: 14%;
}

.b2b-price-table .b2b-price-table__price {
  width: 5.75rem;
}

.b2b-price-table .b2b-price-table__diff {
  width: 5rem;
}

.b2b-product-thumb {
  width: 1.75rem;
  height: 1.75rem;
  min-width: 1.75rem;
  min-height: 1.75rem;
  object-fit: cover;
  object-position: center;
  border-radius: 0.375rem;
  border: 1px solid #e2e8f0;
  background: #fff;
  flex-shrink: 0;
  display: block;
}

.b2b-product-thumb--empty {
  background: #f8fafc;
}

.b2b-product {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  min-width: 0;
}

.b2b-product__name {
  font-size: 0.8125rem;
  font-weight: 600;
  line-height: 1.3;
  color: #0f172a;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.b2b-product__sku {
  margin-top: 0.125rem;
  font-size: 0.6875rem;
  line-height: 1.25;
  color: #64748b;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.b2b-match-badge {
  font-size: 0.625rem;
  font-weight: 600;
}

.b2b-match-badge--ok {
  color: #047857;
}

.b2b-match-badge--warn {
  color: #b45309;
}

.b2b-buybox-order {
  margin-top: 0.125rem;
  font-size: 0.625rem;
  line-height: 1.2;
  color: #94a3b8;
}

.b2b-price-table .b2b-price-table__price,
.b2b-price-table .b2b-price-table__diff {
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

/* Rakip Analizi — compact layout */
.ra-page {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  width: 100%;
  min-width: 0;
}

@media (min-width: 768px) {
  .ra-page {
    gap: 1rem;
  }
}

.ra-page .ra-select {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  padding-right: 2.75rem;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 256 256' fill='none'%3E%3Cpath d='M213.66 101.66l-80 80a8 8 0 0 1-11.32 0l-80-80a8 8 0 0 1 11.32-11.32L128 164.69l74.34-74.35a8 8 0 0 1 11.32 11.32Z' fill='%2394a3b8'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 1.125rem center;
  background-size: 0.875rem;
  cursor: pointer;
}

.ra-page .ra-field,
.ra-page .ra-select {
  min-height: 2rem;
}

/* Ürün İçerik Kalite — compact layout */
.pcq-page {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  width: 100%;
  min-width: 0;
}

@media (min-width: 768px) {
  .pcq-page {
    gap: 1rem;
  }
}

.pcq-page {
  --pcq-panel-inset: 1rem;
}

@media (min-width: 768px) {
  .pcq-page {
    --pcq-panel-inset: 1.25rem;
  }
}

.pcq-page .pcq-panel-inset {
  padding-inline: var(--pcq-panel-inset);
}

.pcq-page .pcq-table-panel {
  overflow: hidden;
}

.pcq-page .pcq-table-wrap {
  padding: 0;
  margin: 0;
}

.pcq-page .pcq-table-panel .pcq-data-table {
  border-left: 0;
  border-right: 0;
  border-radius: 0;
}

/* Column widths — scoped to .pcq-page (React shell uses legacy-app-shell, not legacy-view-root) */
.pcq-page .pcq-data-table col.pcq-col-index {
  width: 2rem;
}

.pcq-page .pcq-data-table col.pcq-col-product {
  width: 36%;
}

.pcq-page .pcq-data-table col.pcq-col-score {
  width: 3.25rem;
}

.pcq-page .pcq-data-table col.pcq-col-status {
  width: 4.25rem;
}

.pcq-page .pcq-data-table col.pcq-col-content {
  width: 9.5rem;
}

.pcq-page .pcq-data-table col.pcq-col-issues {
  width: auto;
}

.pcq-page .pcq-data-table .pcq-table__index {
  width: 2rem;
  min-width: 2rem;
  max-width: 2rem;
  padding-left: 0.5rem !important;
  padding-right: 0.25rem !important;
  text-align: left;
}

.pcq-page .pcq-data-table .pcq-table__product {
  width: 36%;
  min-width: 11rem;
}

.pcq-page .pcq-product-name {
  overflow-wrap: anywhere;
  word-break: break-word;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.pcq-page .pcq-table-panel__head {
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
}

.pcq-page .pcq-kpi {
  min-height: 0;
}

.pcq-content-checks {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.25rem;
}

.pcq-check-pill {
  display: inline-flex;
  align-items: center;
  gap: 0.2rem;
  padding: 0.125rem 0.375rem;
  border-radius: 999px;
  border: 1px solid transparent;
  font-size: 0.625rem;
  font-weight: 600;
  line-height: 1.2;
  white-space: nowrap;
}

.pcq-check-pill--ok {
  border-color: #bbf7d0;
  background: #ecfdf5;
  color: #047857;
}

.pcq-check-pill--bad {
  border-color: #fecdd3;
  background: #fff1f2;
  color: #be123c;
}

.pcq-issue-summary {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.5rem;
  min-width: 0;
}

.pcq-issue-summary--ok {
  align-items: center;
}

.pcq-issue-summary--ok .pcq-issue-summary__meta {
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
}

.pcq-issue-summary__meta {
  min-width: 0;
  flex: 1 1 auto;
}

.pcq-issue-counts {
  display: flex;
  flex-wrap: wrap;
  gap: 0.25rem;
}

.pcq-issue-count {
  display: inline-flex;
  padding: 0.1rem 0.4rem;
  border-radius: 999px;
  font-size: 0.625rem;
  font-weight: 700;
  line-height: 1.2;
}

.pcq-issue-count--critical {
  background: #ffe4e6;
  color: #be123c;
}

.pcq-issue-count--warning {
  background: #fef3c7;
  color: #b45309;
}

.pcq-issue-preview {
  margin-top: 0.25rem;
  font-size: 0.6875rem;
  line-height: 1.35;
  color: #475569;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.pcq-expand-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.2rem;
  flex-shrink: 0;
  padding: 0.2rem 0.45rem;
  border-radius: 0.375rem;
  border: 1px solid #e2e8f0;
  background: #ffffff;
  color: #475569;
  font-size: 0.625rem;
  font-weight: 700;
  transition: background-color 0.15s ease, border-color 0.15s ease;
}

.pcq-expand-btn:hover {
  background: #f8fafc;
  border-color: #cbd5e1;
}

.pcq-row--expanded {
  box-shadow: inset 0 -1px 0 #e2e8f0;
}

.pcq-row-detail__cell {
  padding: 0 !important;
  border-bottom: 1px solid #cbd5e1 !important;
  background: #f8fafc !important;
}

.pcq-row-detail__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0.75rem;
  padding: 0.75rem 1rem 1rem;
}

@media (min-width: 1024px) {
  .pcq-row-detail__grid {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr);
  }
}

.pcq-row-detail__panel {
  min-width: 0;
  border: 1px solid #e2e8f0;
  border-radius: 0.625rem;
  background: #ffffff;
  padding: 0.625rem 0.75rem;
}

.pcq-row-detail__title {
  display: flex;
  align-items: center;
  gap: 0.375rem;
  margin-bottom: 0.5rem;
  font-size: 0.6875rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: #64748b;
}

.pcq-row-detail__count {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 1.125rem;
  height: 1.125rem;
  padding: 0 0.3rem;
  border-radius: 999px;
  background: #f1f5f9;
  color: #475569;
  font-size: 0.625rem;
  font-weight: 700;
}

.pcq-row-detail__empty {
  font-size: 0.75rem;
  color: #94a3b8;
}

.pcq-attr-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 0.375rem;
}

.pcq-attr-chip {
  display: inline-flex;
  flex-direction: column;
  gap: 0.05rem;
  max-width: 100%;
  padding: 0.3rem 0.5rem;
  border-radius: 0.5rem;
  border: 1px solid #e2e8f0;
  background: #f8fafc;
}

.pcq-attr-chip__name {
  font-size: 0.625rem;
  font-weight: 700;
  color: #64748b;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.pcq-attr-chip__value {
  font-size: 0.75rem;
  font-weight: 600;
  color: #0f172a;
  word-break: break-word;
}

.pcq-issue-list {
  display: flex;
  flex-direction: column;
  gap: 0.375rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.pcq-issue-item {
  display: flex;
  align-items: flex-start;
  gap: 0.5rem;
  padding: 0.45rem 0.55rem;
  border-radius: 0.5rem;
}

.pcq-issue-item__dot {
  width: 0.4rem;
  height: 0.4rem;
  border-radius: 999px;
  margin-top: 0.3rem;
  flex-shrink: 0;
}

.pcq-issue-item__message {
  font-size: 0.75rem;
  line-height: 1.4;
  font-weight: 500;
}

.pcq-issue-item__tag {
  display: inline-flex;
  margin-top: 0.2rem;
  padding: 0.05rem 0.35rem;
  border-radius: 0.25rem;
  background: #d1fae5;
  color: #047857;
  font-size: 0.625rem;
  font-weight: 700;
}

.pcq-issue-item__note {
  margin-top: 0.15rem;
  font-size: 0.6875rem;
  color: #047857;
  font-weight: 500;
}

/* ═══════════════════════════════════════════
   Ayarlar (Trendyol API Settings)
   Semantic layout — light theme, readable hierarchy
   ═══════════════════════════════════════════ */

.ayarlar-page {
  display: flex;
  flex-direction: column;
  gap: 0.875rem;
  width: 100%;
  box-sizing: border-box;
  --ayarlar-card-inset: 1.5rem;
}

@media (min-width: 768px) {
  .ayarlar-page {
    --ayarlar-card-inset: 1.75rem;
    gap: 1rem;
  }
}

@media (min-width: 1024px) {
  .ayarlar-page {
    --ayarlar-card-inset: 2rem;
    gap: 1.25rem;
  }
}

/* Card horizontal padding — works inside ui-main shell (SPA navigation) */
.ayarlar-panel.glass-panel,
.ayarlar-callout.glass-panel,
.ayarlar-notice {
  padding-inline: var(--ayarlar-card-inset, 1.5rem) !important;
  box-sizing: border-box;
}

/* Page header */
.ayarlar-header {
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
}

.ayarlar-header__icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 2.5rem;
  height: 2.5rem;
  flex-shrink: 0;
  border-radius: 0.75rem;
  background: var(--ke-orange-soft);
  border: 1px solid var(--ke-orange-border);
  color: var(--ke-orange-dark);
  font-size: 1.25rem;
}

.ayarlar-header__title {
  margin: 0;
  font-size: 1.125rem;
  font-weight: 700;
  letter-spacing: 0.01em;
  color: var(--ke-navy);
  line-height: 1.3;
}

.ayarlar-header__subtitle {
  margin: 0.25rem 0 0;
  font-size: 0.75rem;
  color: var(--ke-text-muted);
  line-height: 1.45;
  max-width: 42rem;
}

/* Tip / notice banners */
.ayarlar-notice {
  display: flex;
  align-items: flex-start;
  gap: 0.625rem;
  padding-block: 0.875rem;
  border-radius: 0.75rem;
  font-size: 0.75rem;
  line-height: 1.5;
  border: 1px solid var(--ke-border);
  background: var(--ke-surface-2);
  color: var(--ke-text-secondary);
}

.ayarlar-notice__icon {
  flex-shrink: 0;
  margin-top: 0.1rem;
  font-size: 1rem;
}

.ayarlar-notice--amber {
  background: #fffbeb;
  border-color: #fde68a;
  color: #92400e;
}

.ayarlar-notice--amber .ayarlar-notice__icon {
  color: #d97706;
}

.ayarlar-notice--cyan {
  background: #ecfeff;
  border-color: #a5f3fc;
  color: #155e75;
}

.ayarlar-notice--cyan .ayarlar-notice__icon {
  color: #0891b2;
}

.ayarlar-notice--ok {
  background: #ecfdf5;
  border-color: #a7f3d0;
  color: #065f46;
}

.ayarlar-notice--ok .ayarlar-notice__icon {
  color: #059669;
}

.ayarlar-notice--error {
  background: #fef2f2;
  border-color: #fecaca;
  color: #991b1b;
}

.ayarlar-notice--error .ayarlar-notice__icon {
  color: #dc2626;
}

.ayarlar-notice--warn {
  background: #fffbeb;
  border-color: #fde68a;
  color: #92400e;
}

.ayarlar-notice--warn .ayarlar-notice__icon {
  color: #d97706;
}

.ayarlar-notice b {
  font-weight: 700;
  color: inherit;
}

/* Settings panels */
.ayarlar-panel {
  padding-block: 1.25rem;
}

@media (min-width: 768px) {
  .ayarlar-panel {
    padding-block: 1.5rem;
  }
}

@media (min-width: 1024px) {
  .ayarlar-panel {
    padding-block: 1.75rem;
  }
}

.ayarlar-panel__head {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.75rem;
  margin-bottom: 1rem;
}

.ayarlar-panel__eyebrow {
  margin: 0 0 0.25rem;
  font-size: 0.625rem;
  font-weight: 600;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--ke-text-muted);
}

.ayarlar-panel__title {
  margin: 0;
  font-size: 1rem;
  font-weight: 700;
  color: var(--ke-navy);
  line-height: 1.3;
}

.ayarlar-panel__desc {
  margin: 0.35rem 0 0;
  font-size: 0.75rem;
  color: var(--ke-text-muted);
  line-height: 1.45;
  max-width: 40rem;
}

.ayarlar-panel__badge {
  align-items: center;
  gap: 0.375rem;
  padding: 0.35rem 0.625rem;
  border-radius: 0.5rem;
  font-size: 0.6875rem;
  font-weight: 600;
  white-space: nowrap;
  border: 1px solid var(--ke-border);
  background: var(--ke-surface-2);
  color: var(--ke-text-secondary);
}

.ayarlar-panel__badge i {
  font-size: 0.875rem;
}

.ayarlar-panel__badge--ok {
  background: #ecfdf5;
  border-color: #a7f3d0;
  color: #047857;
}

.ayarlar-panel__badge--shopify {
  background: #f5f3ff;
  border-color: #ddd6fe;
  color: #6d28d9;
}

.ayarlar-panel__badge--expense {
  background: #ecfdf5;
  border-color: #a7f3d0;
  color: #047857;
}

.ayarlar-panel--shopify {
  border-color: #ddd6fe !important;
}

.ayarlar-panel--expense {
  border-color: #a7f3d0 !important;
}

/* Form fields */
.ayarlar-form {
  display: flex;
  flex-direction: column;
  gap: 0.875rem;
}

.ayarlar-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1rem;
}

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

  .ayarlar-grid--3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (min-width: 1280px) {
  .ayarlar-grid--3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

.ayarlar-field {
  display: block;
  min-width: 0;
}

.ayarlar-field--full {
  grid-column: 1 / -1;
}

.ayarlar-field__label {
  display: block;
  margin-bottom: 0.35rem;
  font-size: 0.6875rem;
  font-weight: 600;
  color: var(--ke-text-muted);
}

.ayarlar-field__hint {
  margin-left: 0.25rem;
  font-size: 0.625rem;
  font-weight: 500;
  color: #0891b2;
}

.ayarlar-input {
  width: 100%;
  box-sizing: border-box;
  padding: 0.55rem 0.75rem;
  border-radius: 0.625rem;
  border: 1px solid var(--ke-border);
  background: var(--ke-surface);
  color: var(--ke-text);
  font-size: 0.875rem;
  line-height: 1.4;
  outline: none;
  transition:
    border-color 0.15s ease,
    box-shadow 0.15s ease;
}

.ayarlar-input::placeholder {
  color: var(--ke-text-muted);
  opacity: 0.85;
}

.ayarlar-input:focus {
  border-color: var(--ke-orange);
  box-shadow: 0 0 0 3px rgba(255, 107, 53, 0.12);
}

.ayarlar-input--readonly {
  background: var(--ke-surface-2);
  color: var(--ke-text-secondary);
  cursor: not-allowed;
  border-color: #bae6fd;
}

.ayarlar-input--readonly:focus {
  border-color: #7dd3fc;
  box-shadow: none;
}

/* Action row */
.ayarlar-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem;
  padding-top: 0.25rem;
}

.ayarlar-actions--spaced {
  margin-top: 0.75rem;
}

.ayarlar-grid--spaced {
  margin-top: 0.75rem;
}

.ayarlar-field--end {
  display: flex;
  align-items: flex-end;
}

.ayarlar-btn--block {
  width: 100%;
}

.ayarlar-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.35rem;
  padding: 0.55rem 0.875rem;
  border-radius: 0.625rem;
  font-size: 0.75rem;
  font-weight: 650;
  line-height: 1.2;
  border: 1px solid transparent;
  cursor: pointer;
  transition:
    background-color 0.15s ease,
    border-color 0.15s ease,
    opacity 0.15s ease;
}

.ayarlar-btn:hover {
  opacity: 0.92;
}

.ayarlar-btn--primary {
  background: var(--ke-orange);
  color: #fff;
  border-color: var(--ke-orange);
}

.ayarlar-btn--primary:hover {
  background: var(--ke-orange-dark);
  border-color: var(--ke-orange-dark);
  opacity: 1;
}

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

.ayarlar-btn--secondary:hover {
  background: var(--ke-surface-2);
  opacity: 1;
}

.ayarlar-btn--ghost-emerald {
  background: #ecfdf5;
  color: #047857;
  border-color: #a7f3d0;
}

.ayarlar-btn--ghost-emerald:hover {
  background: #d1fae5;
  opacity: 1;
}

.ayarlar-btn--ghost-violet {
  background: #f5f3ff;
  color: #6d28d9;
  border-color: #ddd6fe;
}

.ayarlar-btn--ghost-violet:hover {
  background: #ede9fe;
  opacity: 1;
}

.ayarlar-btn--ghost-cyan {
  background: #ecfeff;
  color: #0e7490;
  border-color: #a5f3fc;
}

.ayarlar-btn--ghost-cyan:hover {
  background: #cffafe;
  opacity: 1;
}

.ayarlar-btn--danger {
  background: #fff1f2;
  color: #be123c;
  border-color: #fecdd3;
}

.ayarlar-btn--danger:hover {
  background: #ffe4e6;
  opacity: 1;
}

.ayarlar-status {
  font-size: 0.75rem;
  color: var(--ke-text-muted);
  font-weight: 500;
}

.ayarlar-status--ok {
  color: #047857;
  font-weight: 600;
}

.ayarlar-status--warn {
  color: #b45309;
  font-weight: 600;
}

.ayarlar-status--error {
  color: #be123c;
  font-weight: 600;
}

.ayarlar-status--busy {
  color: var(--ke-orange-dark);
  font-weight: 600;
  animation: ayarlar-pulse 1.2s ease-in-out infinite;
}

@keyframes ayarlar-pulse {
  0%,
  100% {
    opacity: 1;
  }
  50% {
    opacity: 0.55;
  }
}

.ayarlar-hint {
  margin: 0.5rem 0 0;
  font-size: 0.6875rem;
  color: var(--ke-text-muted);
  line-height: 1.45;
}

.ayarlar-hint i {
  margin-right: 0.25rem;
}

/* Callout / reference blocks */
.ayarlar-callout {
  padding-block: 1rem;
}

@media (min-width: 768px) {
  .ayarlar-callout {
    padding-block: 1.125rem;
  }
}

@media (min-width: 1024px) {
  .ayarlar-callout {
    padding-block: 1.25rem;
  }
}

.ayarlar-callout__head {
  display: flex;
  align-items: flex-start;
  gap: 0.625rem;
  margin-bottom: 0.5rem;
}

.ayarlar-callout__icon {
  flex-shrink: 0;
  margin-top: 0.1rem;
  font-size: 1.125rem;
}

.ayarlar-callout__title {
  margin: 0;
  font-size: 0.8125rem;
  font-weight: 700;
  line-height: 1.35;
  color: var(--ke-navy);
}

.ayarlar-callout__list {
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  font-size: 0.75rem;
  line-height: 1.5;
  color: var(--ke-text-secondary);
}

.ayarlar-callout__list li {
  padding-left: 0.85rem;
  position: relative;
}

.ayarlar-callout__list li::before {
  content: '•';
  position: absolute;
  left: 0;
  color: var(--ke-text-muted);
}

.ayarlar-callout__list b {
  font-weight: 700;
  color: var(--ke-navy);
}

.ayarlar-callout__list code {
  font-size: 0.6875rem;
  padding: 0.05rem 0.3rem;
  border-radius: 0.25rem;
  background: var(--ke-surface-2);
  border: 1px solid var(--ke-border);
  color: var(--ke-text-secondary);
}

.ayarlar-callout--warn {
  border-color: #fde68a !important;
  background: #fffbeb !important;
}

.ayarlar-callout--warn .ayarlar-callout__icon {
  color: #d97706;
}

.ayarlar-callout--warn .ayarlar-callout__title {
  color: #92400e;
}

.ayarlar-callout--ok {
  border-color: #a7f3d0 !important;
  background: #ecfdf5 !important;
}

.ayarlar-callout--ok .ayarlar-callout__icon {
  color: #059669;
}

.ayarlar-callout--ok .ayarlar-callout__title {
  color: #065f46;
}

.ayarlar-callout--info {
  border-color: #bfdbfe !important;
  background: #eff6ff !important;
}

.ayarlar-callout--info .ayarlar-callout__icon {
  color: #2563eb;
}

.ayarlar-callout--info .ayarlar-callout__title {
  color: #1e40af;
}

.ayarlar-formula {
  margin: 0.35rem 0 0.5rem;
  padding: 0.5rem 0.75rem;
  border-radius: 0.5rem;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  font-size: 0.6875rem;
  background: var(--ke-surface);
  border: 1px solid var(--ke-border);
  color: var(--ke-navy);
  overflow-x: auto;
}

.ayarlar-callout__section-label {
  margin: 0.5rem 0 0.25rem;
  font-size: 0.75rem;
  font-weight: 650;
  color: #047857;
}

/* Internal expense rows */
.ayarlar-expense-list {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  margin-bottom: 0.875rem;
}

.internal-expense-row {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0.75rem;
  align-items: end;
  padding: 1rem var(--ayarlar-card-inset, 1rem);
  border-radius: 0.75rem;
  border: 1px solid var(--ke-border);
  background: var(--ke-surface-2);
  box-sizing: border-box;
}

@media (min-width: 768px) {
  .internal-expense-row {
    grid-template-columns: repeat(12, minmax(0, 1fr));
    gap: 0.75rem 1rem;
    padding: 1.125rem var(--ayarlar-card-inset, 1.25rem);
  }

  .internal-expense-row .ayarlar-field--cat {
    grid-column: span 4;
  }

  .internal-expense-row .ayarlar-field--month {
    grid-column: span 3;
  }

  .internal-expense-row .ayarlar-field--amount {
    grid-column: span 3;
  }

  .internal-expense-row .ayarlar-field--remove {
    grid-column: span 2;
    display: flex;
    justify-content: flex-end;
  }
}

.internal-expense-row .ayarlar-btn--danger {
  width: 100%;
}

@media (min-width: 768px) {
  .internal-expense-row .ayarlar-btn--danger {
    width: auto;
  }
}

/* Disable lift on settings panels — forms shouldn't jump on hover */
.ayarlar-page .glass-panel:hover {
  transform: none;
  box-shadow: none !important;
}

/* ─── App toolbar + user menu ─── */
.ui-content-wrap {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  min-height: 0;
  min-width: 0;
  overflow: hidden;
  position: relative;
}

.ui-app-toolbar {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-shrink: 0;
  min-height: 2.85rem;
  padding: 0.3rem 1.5rem 0.15rem;
  position: relative;
  z-index: 100;
  isolation: isolate;
  overflow: visible;
}

.ui-content-wrap > .ui-main {
  position: relative;
  z-index: 1;
}

@media (min-width: 1024px) {
  .ui-app-toolbar {
    padding: 0.35rem 2rem 0.1rem;
    min-height: 3rem;
  }
}

.ui-app-toolbar__end {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 0.55rem;
  min-width: 0;
}

.ui-user-menu {
  position: relative;
}

.ui-user-menu__trigger {
  display: inline-flex;
  align-items: center;
  gap: 0.55rem;
  max-width: min(16rem, 72vw);
  padding: 0.35rem 0.45rem 0.35rem 0.35rem;
  border: 1px solid #e4e4e7;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.92);
  color: #18181b;
  box-shadow: 0 1px 2px rgba(24, 24, 27, 0.04);
  cursor: pointer;
  transition:
    border-color 0.15s ease,
    box-shadow 0.15s ease,
    background-color 0.15s ease;
}

.ui-user-menu__trigger:hover,
.ui-user-menu--open .ui-user-menu__trigger {
  border-color: #d4d4d8;
  background: #ffffff;
  box-shadow: 0 4px 14px rgba(24, 24, 27, 0.08);
}

.ui-user-menu__avatar {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2rem;
  height: 2rem;
  border-radius: 999px;
  background: linear-gradient(135deg, var(--ke-orange, #ff6b35), #ff8f65);
  color: #ffffff;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.02em;
  flex-shrink: 0;
}

.ui-user-menu__avatar--lg {
  width: 2.5rem;
  height: 2.5rem;
  font-size: 0.82rem;
}

.ui-user-menu__name {
  font-size: 0.8125rem;
  font-weight: 600;
  color: #18181b;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  min-width: 0;
}

.ui-user-menu__chevron {
  font-size: 0.85rem;
  color: #71717a;
  transition: transform 0.15s ease;
  flex-shrink: 0;
}

.ui-user-menu--open .ui-user-menu__chevron {
  transform: rotate(180deg);
}

.ui-user-menu__dropdown {
  position: absolute;
  top: calc(100% + 0.45rem);
  right: 0;
  min-width: 15.5rem;
  padding: 0.45rem;
  border: 1px solid #e4e4e7;
  border-radius: 1rem;
  background: #ffffff;
  box-shadow:
    0 10px 30px rgba(24, 24, 27, 0.12),
    0 2px 8px rgba(24, 24, 27, 0.06);
  opacity: 0;
  visibility: hidden;
  transform: translateY(-4px) scale(0.98);
  transform-origin: top right;
  transition:
    opacity 0.16s ease,
    transform 0.16s ease,
    visibility 0.16s ease;
  pointer-events: none;
  z-index: 101;
}

.ui-user-menu--open .ui-user-menu__dropdown {
  opacity: 1;
  visibility: visible;
  transform: translateY(0) scale(1);
  pointer-events: auto;
}

.ui-user-menu__header {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.55rem 0.6rem 0.65rem;
}

.ui-user-menu__header-copy {
  min-width: 0;
}

.ui-user-menu__header-name {
  font-size: 0.875rem;
  font-weight: 700;
  color: #18181b;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.ui-user-menu__header-label {
  margin-top: 0.1rem;
  font-size: 0.72rem;
  font-weight: 500;
  color: #71717a;
}

.ui-user-menu__divider {
  height: 1px;
  margin: 0.15rem 0.35rem 0.35rem;
  background: #f4f4f5;
}

.ui-user-menu__item {
  display: flex;
  align-items: center;
  gap: 0.65rem;
  width: 100%;
  padding: 0.62rem 0.7rem;
  border: 0;
  border-radius: 0.72rem;
  background: transparent;
  color: #3f3f46;
  font-size: 0.8125rem;
  font-weight: 600;
  text-align: left;
  cursor: pointer;
  transition: background-color 0.14s ease, color 0.14s ease;
}

.ui-user-menu__item i {
  font-size: 1.05rem;
  color: #71717a;
}

.ui-user-menu__item:hover,
.ui-user-menu__item:focus-visible {
  outline: none;
  background: #f4f4f5;
  color: #18181b;
}

.ui-user-menu__item--active {
  background: #fafafa;
  color: #18181b;
}

.ui-user-menu__item--danger {
  color: #dc2626;
}

.ui-user-menu__item--danger i {
  color: #ef4444;
}

.ui-user-menu__item--danger:hover,
.ui-user-menu__item--danger:focus-visible {
  background: #fef2f2;
  color: #b91c1c;
}

.ui-content-wrap > .ui-app-toolbar + .ui-main {
  padding-top: 0.35rem !important;
}

@media (max-width: 639px) {
  .ui-user-menu__name {
    display: none;
  }

  .ui-user-menu__trigger {
    padding-right: 0.4rem;
  }

  .ui-app-toolbar {
    padding-top: 0.65rem;
    padding-left: 1rem;
    padding-right: 1rem;
  }
}

@media (max-width: 1023px) {
  body.is-mobile-shell .ui-app-toolbar {
    padding-right: 1rem;
  }
}