/* ReZapp UI v2: somente a aplicação autenticada; não estiliza login, landing nem editor Drawflow. */
html.rz-v1-ui {
  --rz-v2-base: #06090c;
  --rz-v2-side: #0b1115;
  --rz-v2-card: #0f171b;
  --rz-v2-mint: #00ffc8;
  --rz-v2-mint-light: #38efbd;
  --rz-v2-text: #f0f4f5;
  --rz-v2-subtle: #a4b2b5;
  --rz-v2-line: rgba(255,255,255,.09);
}
html.rz-v1-ui #root > div.flex.h-screen > div.h-screen.bg-slate-900 > div:first-child {
  min-height: 83px;
  padding: 0 18px 0 23px;
  gap: 11px;
}
html.rz-v1-ui #root > div.flex.h-screen > div.h-screen.bg-slate-900 > div:first-child img {
  width: 132px;
  max-width: 132px;
  height: auto;
  max-height: 42px;
}
html.rz-v1-ui #root > div.flex.h-screen > div.h-screen.bg-slate-900 > div:first-child > button {
  width: 31px;
  height: 31px;
  padding: 0;
  display: grid;
  place-items: center;
  flex: none;
  border-radius: 8px;
}
html.rz-v1-ui #root nav.flex-1 {
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding: 20px 13px 18px;
}
html.rz-v1-ui #root nav.flex-1 .rz-v2-caption {
  padding: 0 13px 10px;
  color: #76888c;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .15em;
  white-space: nowrap;
  pointer-events: none;
  user-select: none;
}
html.rz-v1-ui #root nav.flex-1 .rz-v2-caption.rz-v2-secondary { padding-top: 23px; }
html.rz-v1-ui #root nav.flex-1 button {
  position: relative;
  width: 100%;
  height: auto;
  min-height: 42px;
  padding: 10px 12px;
  gap: 13px;
  flex: none;
  text-align: left;
}
html.rz-v1-ui #root nav.flex-1 button.rz-v2-selected {
  color: var(--rz-v2-mint-light) !important;
  background: linear-gradient(100deg,rgba(0,255,200,.09),rgba(0,255,200,.035)) !important;
  border-color: rgba(0,255,200,.11) !important;
  font-weight: 600;
}
html.rz-v1-ui #root nav.flex-1 button.rz-v2-selected::after {
  content: '';
  position: absolute;
  right: 0;
  top: 12px;
  bottom: 12px;
  width: 2px;
  border-radius: 4px;
  background: var(--rz-v2-mint);
  pointer-events: none;
}
/* Um item da rota anterior não pode ficar destacado junto da página injetada em primeiro plano. */
html.rz-v1-ui #root nav.rz-v2-has-selection button[class*="bg-emerald-500/10"]:not(.rz-v2-selected) {
  color: var(--rz-v2-subtle) !important;
  background: transparent !important;
  border-color: transparent !important;
  font-weight: 500;
}
html.rz-v1-ui #root nav.rz-v2-has-selection button[class*="bg-emerald-500/10"]:not(.rz-v2-selected):hover {
  color: var(--rz-v2-text) !important;
  background: rgba(255,255,255,.045) !important;
}
html.rz-v1-ui #root > div.flex.h-screen > div.h-screen.bg-slate-900 > div:last-child {
  padding: 13px 13px 16px;
  background: var(--rz-v2-side);
}
html.rz-v1-ui #root > div.flex.h-screen > div.h-screen.bg-slate-900 > div:last-child > div:first-child {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-height: 55px;
  margin: 0 0 8px;
  padding: 7px 8px 7px 52px;
  background: rgba(255,255,255,.025);
  border: 1px solid var(--rz-v2-line);
  border-radius: 10px;
}
html.rz-v1-ui #root > div.flex.h-screen > div.h-screen.bg-slate-900 > div:last-child > div:first-child::before {
  content: attr(data-rz-profile-initials);
  position: absolute;
  left: 10px;
  top: 10px;
  width: 32px;
  height: 32px;
  display: grid;
  place-items: center;
  background: linear-gradient(130deg,#163b33,#0d2525);
  border: 1px solid rgba(0,255,200,.16);
  border-radius: 50%;
  color: var(--rz-v2-mint-light);
  font-size: 10px;
  font-weight: 700;
}
html.rz-v1-ui #root > div.flex.h-screen > div.h-screen.bg-slate-900 > div:last-child > div:first-child p:first-child {
  color: var(--rz-v2-text);
  font-size: 11.5px;
}
html.rz-v1-ui #root > div.flex.h-screen > div.h-screen.bg-slate-900 > div:last-child > div:first-child p:last-child {
  color: var(--rz-v2-subtle);
  font-size: 10px;
}
html.rz-v1-ui #root > div.flex.h-screen > div.h-screen.bg-slate-900 > div:last-child a,
html.rz-v1-ui #root > div.flex.h-screen > div.h-screen.bg-slate-900 > div:last-child > button {
  min-height: 37px;
  border-radius: 8px;
  font-size: 11.5px;
}
html.rz-v1-ui #root > div.flex.h-screen > div.h-screen.bg-slate-900.w-16 > div:first-child {
  min-height: 92px;
  padding: 9px 6px;
  gap: 4px;
}
html.rz-v1-ui #root > div.flex.h-screen > div.h-screen.bg-slate-900.w-16 nav.flex-1 {
  padding: 17px 8px;
}
html.rz-v1-ui #root > div.flex.h-screen > div.h-screen.bg-slate-900.w-16 nav.flex-1 .rz-v2-caption {
  font-size: 0;
  height: 17px;
  padding: 0;
}
html.rz-v1-ui #root > div.flex.h-screen > div.h-screen.bg-slate-900.w-16 nav.flex-1 .rz-v2-caption.rz-v2-secondary { padding-top: 12px; }
html.rz-v1-ui #root > div.flex.h-screen > div.h-screen.bg-slate-900.w-16 nav.flex-1 button {
  width: 46px;
  height: 45px;
  min-height: 45px;
  margin: 0 auto;
  padding: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}
html.rz-v1-ui #root > div.flex.h-screen > div.h-screen.bg-slate-900.w-16 > div:last-child > div:first-child { display: none; }
/* Topbar de apresentação: um elemento fixo irmão do main, sem capturar clicks nas telas operacionais. */
html.rz-v1-ui #rz-v2-topbar {
  position: fixed;
  top: 0;
  right: 0;
  left: 253px;
  z-index: 2000;
  height: 71px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 34px;
  background: rgba(11,17,21,.95);
  border-bottom: 1px solid var(--rz-v2-line);
  backdrop-filter: blur(12px);
  color: var(--rz-v2-text);
  font-family: 'Poppins',ui-sans-serif,system-ui,sans-serif;
  transition: left .25s cubic-bezier(.23,1,.32,1);
}
html.rz-v1-ui #root > div.flex.h-screen > div.h-screen.bg-slate-900.w-16 ~ #rz-v2-topbar { left: 64px; }
html.rz-v1-ui #rz-v2-topbar .rz-v2-breadcrumb {
  display: flex;
  align-items: center;
  gap: 11px;
  font-size: 12px;
  color: #76888c;
  white-space: nowrap;
}
html.rz-v1-ui #rz-v2-topbar .rz-v2-breadcrumb strong { color: var(--rz-v2-text);font-weight: 600; }
html.rz-v1-ui #rz-v2-topbar .rz-v2-actions { display: flex;align-items: center;gap: 13px; }
html.rz-v1-ui #rz-v2-topbar .rz-v2-badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--rz-v2-mint-light);
  letter-spacing: .10em;
  font-size: 10px;
  font-weight: 700;
}
html.rz-v1-ui #rz-v2-topbar .rz-v2-badge::before {
  content: '';
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--rz-v2-mint);
  box-shadow: 0 0 0 4px rgba(0,255,200,.095);
}
html.rz-v1-ui #rz-v2-topbar .rz-v2-bell {
  width: 34px;height: 34px;border: 0;border-radius: 8px;
  background: transparent;color: var(--rz-v2-subtle);
  display: grid;place-items: center;
}
html.rz-v1-ui #rz-v2-topbar .rz-v2-bell:hover { color: var(--rz-v2-mint);background: rgba(0,255,200,.06); }
html.rz-v1-ui #rz-v2-topbar .rz-v2-avatar {
  width: 31px;height: 31px;display: grid;place-items: center;border-radius: 50%;
  color: var(--rz-v2-mint-light);font-size: 10px;font-weight: 700;
  background: linear-gradient(130deg,#163b33,#0d2525);
  border: 1px solid rgba(0,255,200,.16);
}
html.rz-v1-ui #root > div.flex.h-screen > main.flex-1.overflow-y-auto.p-6 { padding-top: 104px !important; }
/* As páginas-legado são filhos absolutos do main; começam abaixo da nova topbar. */
html.rz-v1-ui #rz-dispatches-overlay,
html.rz-v1-ui #rz-gatilhos-overlay,
html.rz-v1-ui #rz-notifications-overlay,
html.rz-v1-ui #rz-affiliate-page,
html.rz-v1-ui #rz-como-usar-page {
  top: 71px !important;
  min-height: calc(100% - 71px) !important;
}
/* O loading antigo era o único retângulo slate visível antes das métricas. */
html.rz-v1-ui #rz-dashboard-loading {
  background: var(--rz-v2-base) !important;
  border: 0 !important;
  border-radius: 0 !important;
  align-items: stretch !important;
  justify-content: flex-start !important;
  padding: 0;
}
html.rz-v1-ui #rz-v2-loading-skeleton { width: 100%;font-family: 'Poppins',ui-sans-serif,system-ui,sans-serif; }
html.rz-v1-ui #rz-v2-loading-skeleton .rz-v2-loading-title { color: var(--rz-v2-mint-light);font-size: 11px;font-weight: 700;letter-spacing: .13em;margin-bottom: 11px; }
html.rz-v1-ui #rz-v2-loading-skeleton .rz-v2-loading-heading { width: 34%;height: 35px;margin-bottom: 28px; }
html.rz-v1-ui #rz-v2-loading-skeleton .rz-v2-loading-grid { display: grid;grid-template-columns: repeat(4,minmax(0,1fr));gap: 13px;margin-bottom: 15px; }
html.rz-v1-ui #rz-v2-loading-skeleton .rz-v2-loading-card { height: 117px; }
html.rz-v1-ui #rz-v2-loading-skeleton .rz-v2-loading-charts { display: grid;grid-template-columns: repeat(2,minmax(0,1fr));gap: 15px;margin-top: 18px; }
html.rz-v1-ui #rz-v2-loading-skeleton .rz-v2-loading-chart { height: 260px; }
html.rz-v1-ui #rz-v2-loading-skeleton .rz-v2-loading-heading,
html.rz-v1-ui #rz-v2-loading-skeleton .rz-v2-loading-card,
html.rz-v1-ui #rz-v2-loading-skeleton .rz-v2-loading-chart {
  border: 1px solid var(--rz-v2-line);
  border-radius: 13px;
  background: linear-gradient(108deg,#10181b,#152226 48%,#10181b 82%);
  background-size: 200% 100%;
  animation: rz-v2-shimmer 2.1s linear infinite;
}
@keyframes rz-v2-shimmer { to { background-position: -200% 0; } }
@media (max-width: 1150px) {
  html.rz-v1-ui #rz-v2-loading-skeleton .rz-v2-loading-grid {grid-template-columns: repeat(2,minmax(0,1fr));}
  html.rz-v1-ui #rz-v2-loading-skeleton .rz-v2-loading-charts {grid-template-columns: minmax(0,1fr);}
}
@media (max-width: 900px) {
  html.rz-v1-ui #rz-v2-topbar { left: 0 !important;height: 61px;padding: 0 17px 0 68px; }
  html.rz-v1-ui #rz-v2-topbar .rz-v2-badge {display: none;}
  html.rz-v1-ui #root > div.flex.h-screen > main.flex-1.overflow-y-auto.p-6 {padding-top: 82px !important;}
  html.rz-v1-ui #rz-dispatches-overlay,
  html.rz-v1-ui #rz-gatilhos-overlay,
  html.rz-v1-ui #rz-notifications-overlay,
  html.rz-v1-ui #rz-affiliate-page,
  html.rz-v1-ui #rz-como-usar-page {top: 61px !important;min-height: calc(100% - 61px) !important;}
  html.rz-v1-ui.rz-v1-open #rz-v2-topbar {z-index: 2000;}
  html.rz-v1-ui.rz-v1-open #root > div.flex.h-screen > div.h-screen.bg-slate-900 > div:first-child {min-height: 73px;padding: 0 16px;}
  html.rz-v1-ui.rz-v1-open #root nav.flex-1 .rz-v2-caption {font-size: 10px;height: auto;padding: 0 13px 10px;}
  html.rz-v1-ui.rz-v1-open #root nav.flex-1 .rz-v2-caption.rz-v2-secondary {padding-top: 23px;}
  html.rz-v1-ui.rz-v1-open #root nav.flex-1 button {width: 100%;height: auto;min-height: 42px;padding: 10px 12px;justify-content: flex-start;}
}
@media (max-width: 650px) {
  html.rz-v1-ui #rz-v2-topbar .rz-v2-breadcrumb {gap: 7px;font-size: 11px;}
  html.rz-v1-ui #rz-v2-topbar .rz-v2-breadcrumb .rz-v2-brand-text {display: none;}
  html.rz-v1-ui #rz-v2-topbar .rz-v2-breadcrumb .rz-v2-separator {display: none;}
  html.rz-v1-ui #rz-v2-loading-skeleton .rz-v2-loading-title {font-size: 9px;}
  html.rz-v1-ui #rz-v2-loading-skeleton .rz-v2-loading-heading {width: 65%;height: 28px;}
  html.rz-v1-ui #rz-v2-loading-skeleton .rz-v2-loading-grid {gap: 9px;}
  html.rz-v1-ui #rz-v2-loading-skeleton .rz-v2-loading-card {height: 115px;}
  html.rz-v1-ui:has(:is(#rz-affiliate-page,#rz-gatilhos-overlay,#rz-notifications-overlay,#rz-dispatches-overlay) :is(input,textarea,select):focus) body > a[title="Fale conosco no WhatsApp"] {
    opacity: 0 !important;
    pointer-events: none !important;
  }
}
@media (prefers-reduced-motion: reduce) {
  html.rz-v1-ui #rz-v2-loading-skeleton .rz-v2-loading-heading,
  html.rz-v1-ui #rz-v2-loading-skeleton .rz-v2-loading-card,
  html.rz-v1-ui #rz-v2-loading-skeleton .rz-v2-loading-chart {animation: none !important;}
}