/* Item 18 (padronização visual): CSS legado em camada (ver crm-ui.css). As declarações !important genéricas que a ponte substitui
   ficaram normais (cópia em @layer legacy-imp, no fim, mantendo a prioridade sobre o restante do legado); as demais seguem !important. */
@layer legacy {
.app-page {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  padding-bottom: calc(var(--dock-height) + 12px);
}

.app-page.has-topbar {
  padding-top: var(--topbar-height);
}

.app-page.dashboard-page.has-topbar {
  padding-top: 0;
}

.app-page::before {
  content: "";
  position: fixed;
  inset: 82px 0 auto 0;
  z-index: -1;
  height: 42vh;
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.42), rgba(78, 115, 255, 0.12) 48%, rgba(178, 151, 255, 0.18));
  clip-path: polygon(0 0, 100% 0, 100% 58%, 0 100%);
  pointer-events: none;
}

.app-shell {
  width: min(1600px, calc(100% - 32px));
  margin: 0 auto;
  padding: var(--space-6) 0;
}

.app-main {
  flex: 1;
  width: min(1600px, calc(100% - 32px));
  margin: 0 auto;
  padding: 44px 0 34px;
}

.app-main.narrow {
  width: min(760px, calc(100% - 32px));
}

.app-topbar {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 100;
  height: 82px;
  display: grid;
  align-items: center;
  padding: 10px 32px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.60);
  background: rgba(245, 247, 250, 0.58);
  backdrop-filter: blur(24px) saturate(150%);
  box-shadow: 0 18px 48px rgba(59, 78, 132, 0.10);
}

:root[data-contrast="high"] .app-topbar {
  background: rgba(17, 24, 39, 0.95);
  border-bottom-color: var(--color-border);
}

:root.theme-dark .app-topbar {
  border-bottom-color: rgba(255, 255, 255, 0.08);
  background: rgba(20, 28, 48, 0.72);
  box-shadow: 0 18px 48px rgba(0, 0, 0, 0.26);
}

.app-topbar-inner {
  width: 100%;
  min-height: 62px;
  margin: 0;
  display: grid;
  grid-template-columns: 220px minmax(0, 1fr) 180px;
  gap: 20px;
  align-items: center;
}

.app-logo {
  display: inline-flex;
  align-items: center;
  gap: var(--space-3);
  min-width: 0;
  color: var(--color-text);
  text-decoration: none;
  font-weight: 750;
  padding-left: 4px;
}

.app-logo img {
  width: 146px;
  height: 46px;
  object-fit: contain;
}

.app-logo span {
  white-space: nowrap;
}

.app-nav {
  display: flex;
  gap: 10px;
  align-items: center;
  overflow-x: auto;
  padding: 0;
  scrollbar-width: thin;
  justify-content: center;
}

.icon-nav {
  overflow: visible;
}

.app-menu-icons {
  justify-content: center;
}

.menu-cluster {
  position: relative;
  flex: 0 0 auto;
}

.nav-icon-button {
  position: relative;
  width: 66px;
  height: 62px;
  display: grid;
  grid-template-rows: 1fr auto;
  place-items: center;
  border: 1px solid rgba(255, 255, 255, 0.58);
  border-radius: 17px;
  color: var(--color-text);
  background: rgba(255, 255, 255, 0.54);
  box-shadow: 0 12px 28px rgba(59, 78, 132, 0.12);
  cursor: pointer;
  backdrop-filter: blur(18px) saturate(150%);
  transition: transform 160ms ease, box-shadow 160ms ease, background 160ms ease, border-color 160ms ease;
  overflow: hidden;
}

:root.theme-dark .nav-icon-button {
  border-color: rgba(255, 255, 255, 0.12);
  color: #f5f7ff;
  background: rgba(22, 31, 53, 0.68);
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.22);
}

.app-menu-icon {
  flex: 0 0 auto;
}

.nav-icon-button:hover,
.nav-icon-button:focus-visible,
.nav-icon-button[aria-current="page"],
.menu-cluster.is-open .nav-icon-button {
  border-color: rgba(78, 115, 255, 0.36);
  background: rgba(231, 240, 255, 0.82);
  box-shadow: 0 18px 40px rgba(78, 115, 255, 0.20);
  transform: translateY(-2px);
}

.nav-icon-button[aria-current="page"],
.menu-cluster.is-open .nav-icon-button {
  color: #2f63f5;
}

:root.theme-dark .nav-icon-button:hover,
:root.theme-dark .nav-icon-button:focus-visible,
:root.theme-dark .nav-icon-button[aria-current="page"],
:root.theme-dark .menu-cluster.is-open .nav-icon-button {
  border-color: rgba(110, 139, 255, 0.42);
  color: #f5f7ff;
  background: rgba(42, 58, 94, 0.82);
  box-shadow: 0 18px 42px rgba(0, 0, 0, 0.30);
}

.nav-icon {
  width: 30px;
  height: 30px;
  display: grid;
  place-items: center;
  font-size: 1.45rem;
  line-height: 1;
  transform: translateY(0);
  transition: transform 160ms ease;
}

.ui-svg-icon {
  width: 22px;
  height: 22px;
  display: block;
  object-fit: contain;
}

.nav-icon .ui-svg-icon {
  width: 30px;
  height: 30px;
}

.nav-icon-label {
  max-width: 62px;
  color: var(--color-text);
  font-size: 0.66rem;
  font-weight: 750;
  line-height: 1.1;
  text-align: center;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
  opacity: 1;
  transition: opacity 160ms ease, transform 160ms ease;
  transform: translateY(0);
}

.nav-icon-button:hover .nav-icon,
.nav-icon-button:focus-visible .nav-icon,
.menu-cluster.is-open .nav-icon-button .nav-icon {
  transform: translateY(-2px) scale(1.03);
}

.nav-icon-button:hover .nav-icon-label,
.nav-icon-button:focus-visible .nav-icon-label,
.menu-cluster.is-open .nav-icon-button .nav-icon-label {
  opacity: 1;
  transform: translateY(0);
}

.menu-dropdown {
  position: absolute;
  top: calc(100% + 16px);
  left: 50%;
  z-index: 10;
  min-width: 240px;
  display: none;
  padding: var(--space-3);
  border: 1px solid var(--color-border);
  border-radius: 22px;
  background: var(--color-glass-strong);
  box-shadow: var(--shadow-soft);
  backdrop-filter: blur(26px) saturate(145%);
  transform: translateX(-50%);
}

:root.theme-dark .menu-dropdown {
  background: rgba(24, 35, 60, 0.94);
}

.menu-cluster.is-open .menu-dropdown {
  display: grid;
  gap: var(--space-2);
}

.menu-dropdown a {
  min-height: 40px;
  display: flex;
  align-items: center;
  padding: 0 var(--space-3);
  border-radius: var(--radius-sm);
  color: var(--color-text);
  text-decoration: none;
  font-size: 0.9rem;
}

.menu-dropdown a:hover,
.menu-dropdown a:focus-visible {
  color: #2f63f5;
  background: #e7f0ff;
}

.app-user {
  display: flex;
  gap: 10px;
  align-items: center;
  justify-content: flex-end;
  min-width: 0;
}

.topbar-actions {
  display: inline-flex;
  gap: 10px;
  align-items: center;
}

.topbar-action {
  width: 42px;
  height: 42px;
  display: inline-grid;
  place-items: center;
  border: 1px solid rgba(255, 255, 255, 0.58);
  border-radius: 999px;
  color: var(--color-text);
  background: rgba(255, 255, 255, 0.54);
  box-shadow: 0 10px 26px rgba(59, 78, 132, 0.12);
  cursor: pointer;
  transition: transform 160ms ease, background 160ms ease, box-shadow 160ms ease;
}

:root.theme-dark .topbar-action {
  border-color: rgba(255, 255, 255, 0.12);
  background: rgba(22, 31, 53, 0.72);
}

.topbar-action:hover,
.topbar-action:focus-visible,
.topbar-action[aria-expanded="true"] {
  background: rgba(231, 240, 255, 0.86);
  box-shadow: 0 14px 34px rgba(78, 115, 255, 0.18);
  transform: translateY(-1px);
}

:root.theme-dark .topbar-action:hover,
:root.theme-dark .topbar-action:focus-visible,
:root.theme-dark .topbar-action[aria-expanded="true"] {
  background: rgba(42, 58, 94, 0.88);
}

.topbar-action .ui-svg-icon {
  width: 20px;
  height: 20px;
}

:root.theme-dark .topbar-action .ui-svg-icon,
:root.theme-dark .input-action-button .ui-svg-icon {
  filter: invert(1) brightness(1.45);
}

.topbar-avatar {
  width: 36px;
  height: 36px;
  display: inline-grid;
  flex: 0 0 auto;
  place-items: center;
  border-radius: 999px;
  color: #ffffff;
  background: linear-gradient(135deg, var(--color-primary), #6f8cff);
  box-shadow: 0 10px 24px rgba(15, 98, 254, 0.18);
  font-size: 0.78rem;
  font-weight: 850;
}

.app-user-meta {
  min-width: 0;
  text-align: right;
}

.app-user-name {
  margin: 0;
  font-weight: 700;
  line-height: 1.2;
  max-width: 92px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.app-user-role {
  margin: 0;
  color: var(--color-muted);
  font-size: 0.82rem;
}

.profile-popover {
  position: fixed;
  top: 92px;
  right: 24px;
  z-index: 120;
  width: min(320px, calc(100vw - 32px));
  display: grid;
  gap: var(--space-4);
  padding: var(--space-5);
  border: 1px solid var(--color-border);
  border-radius: 24px;
  color: var(--color-text);
  background: var(--color-glass-strong);
  box-shadow: var(--shadow-soft);
  backdrop-filter: blur(24px) saturate(145%);
}

.profile-popover h2 {
  margin: 0;
  font-size: 1.2rem;
}

.profile-details {
  display: grid;
  grid-template-columns: 82px minmax(0, 1fr);
  gap: 8px 12px;
  margin: 0;
}

.profile-details dt {
  color: var(--color-muted);
  font-weight: 800;
}

.profile-details dd {
  margin: 0;
  min-width: 0;
  overflow-wrap: anywhere;
  font-weight: 700;
}

.profile-close {
  justify-self: end;
}

.app-card {
  border: 1px solid var(--color-border);
  border-radius: 28px;
  background: var(--color-glass);
  box-shadow: var(--shadow-subtle);
  backdrop-filter: blur(22px) saturate(140%);
}

:root.theme-dark .app-card {
  background: rgba(22, 31, 53, 0.72);
}

.app-card.padded {
  padding: var(--space-6);
}

.brand-mark {
  width: min(220px, 70vw);
  padding: 10px 14px;
  border: 1px solid rgba(255, 255, 255, 0.72);
  border-radius: 20px;
  background: rgba(255, 255, 255, 0.94);
  box-shadow: 0 14px 34px rgba(59, 78, 132, 0.12);
}

.eyebrow {
  margin: 0;
  color: var(--color-primary-strong);
  font-weight: 700;
  letter-spacing: 0;
}

h1,
h2,
h3,
p {
  margin-top: 0;
}

.page-title {
  margin-bottom: var(--space-4);
  font-size: clamp(2rem, 5vw, 4.6rem);
  line-height: 1.02;
  letter-spacing: 0;
}

.section-title {
  margin-bottom: var(--space-3);
  font-size: clamp(1.6rem, 3vw, 2.6rem);
  line-height: 1.08;
}

.lead {
  max-width: 64ch;
  color: var(--color-muted);
  font-size: 1.14rem;
  line-height: 1.7;
}

.form-stack {
  display: grid;
  gap: var(--space-4);
}

.field-group {
  display: grid;
  gap: var(--space-2);
}

.field-group label {
  font-weight: 700;
}

.field-group input {
  width: 100%;
  min-height: 48px;
  padding: 0 var(--space-4);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  color: var(--color-text);
  background: var(--color-surface);
}

:root.theme-dark .field-group input {
  border-color: rgba(255, 255, 255, 0.14);
  background: rgba(15, 23, 42, 0.62);
}

.input-action-wrap {
  position: relative;
}

.input-action-wrap input {
  padding-right: 52px;
}

.input-action-button {
  position: absolute;
  top: 50%;
  right: 8px;
  width: 36px;
  height: 36px;
  display: inline-grid;
  place-items: center;
  border: 1px solid transparent;
  border-radius: 999px;
  color: var(--color-text);
  background: transparent;
  cursor: pointer;
  transform: translateY(-50%);
}

.input-action-button:hover,
.input-action-button:focus-visible {
  background: #e7f0ff;
}

:root.theme-dark .input-action-button:hover,
:root.theme-dark .input-action-button:focus-visible {
  background: rgba(42, 58, 94, 0.84);
}

.input-action-button[hidden] {
  display: none;
}

.input-action-button .ui-svg-icon {
  width: 18px;
  height: 18px;
}

.app-button,
.app-button-secondary,
.app-button-danger {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 38px;
  padding: 0 var(--space-4);
  border: 1px solid transparent;
  border-radius: var(--radius-button);
  cursor: pointer;
  text-decoration: none;
  font-weight: 700;
}

.app-button {
  color: #ffffff;
  background: linear-gradient(135deg, var(--color-primary), #7f94ff);
  box-shadow: 0 12px 28px rgba(78, 115, 255, 0.24);
}

.app-button:hover {
  background: var(--color-primary-strong);
}

.app-button-secondary {
  color: var(--color-text);
  background: rgba(255, 255, 255, 0.74);
  border-color: var(--color-border);
}

:root.theme-dark .app-button-secondary {
  background: rgba(22, 31, 53, 0.70);
}

.app-button-danger {
  color: #ffffff;
  background: var(--ui-destructive);
}

.app-button[disabled],
.app-button-secondary[disabled],
.app-button-danger[disabled] {
  cursor: not-allowed;
  opacity: 0.58;
}

.status-badge {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: 0 var(--space-3);
  border-radius: 999px;
  color: var(--color-primary-strong);
  background: rgba(15, 98, 254, 0.10);
  font-size: 0.82rem;
  font-weight: 700;
}

.status-badge.success {
  color: var(--color-success);
  background: rgba(16, 124, 65, 0.12);
}

.status-badge.warning {
  color: var(--color-warning);
  background: rgba(183, 121, 31, 0.14);
}

.status-badge.danger {
  color: var(--ui-danger);
  background: rgba(255, 59, 48, 0.12);
}

.status-badge.black {
  color: #ffffff;
  background: #000000;
}


.message-area {
  min-height: 28px;
  color: var(--color-muted);
  line-height: 1.5;
}

.message-area.error {
  color: var(--color-danger);
}

.message-area.success {
  color: var(--color-success);
}

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

.dashboard-main {
  width: min(1220px, calc(100% - 40px));
  margin: 126px auto 64px;
  display: grid;
  gap: 22px;
  padding: 0;
}

.dashboard-overview {
  display: grid;
  grid-template-columns: minmax(0, 1.12fr) minmax(360px, 0.82fr);
  gap: 22px;
  align-items: stretch;
  margin-bottom: 0;
}

.dashboard-hero-card {
  min-height: 300px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 180px;
  gap: 28px;
  align-items: center;
  padding: 34px;
  overflow: hidden;
  border-radius: 30px;
  background:
    radial-gradient(circle at 88% 18%, rgba(126, 158, 255, 0.30), transparent 17rem),
    linear-gradient(145deg, rgba(255, 255, 255, 0.86), rgba(255, 255, 255, 0.60));
}

:root.theme-dark .dashboard-hero-card {
  background:
    radial-gradient(circle at 88% 18%, rgba(110, 139, 255, 0.24), transparent 17rem),
    linear-gradient(145deg, rgba(31, 43, 70, 0.88), rgba(22, 31, 53, 0.70));
}

.dashboard-hero-copy {
  display: grid;
  gap: var(--space-4);
}

.dashboard-title {
  margin: 0;
  max-width: 15ch;
  font-size: clamp(36px, 4vw, 56px);
  line-height: 1.02;
  letter-spacing: -1.6px;
}

.dashboard-actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-3);
  align-items: center;
}

.dashboard-hero-visual {
  display: grid;
  place-items: center;
}

.hero-app-icon {
  width: 160px;
  aspect-ratio: 1;
  display: grid;
  place-items: center;
  border: 1px solid rgba(255, 255, 255, 0.7);
  border-radius: 36px;
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.86), rgba(255, 255, 255, 0.36)),
    linear-gradient(135deg, rgba(78, 115, 255, 0.90), rgba(127, 148, 255, 0.80));
  box-shadow: 0 34px 70px rgba(78, 115, 255, 0.24);
}

:root.theme-dark .hero-app-icon {
  border-color: rgba(255, 255, 255, 0.14);
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.10), rgba(255, 255, 255, 0.04)),
    linear-gradient(135deg, rgba(110, 139, 255, 0.90), rgba(127, 116, 255, 0.78));
}

.hero-app-icon span {
  width: 78px;
  height: 78px;
  display: grid;
  place-items: center;
  border-radius: 999px;
  color: #ffffff;
  background: linear-gradient(135deg, var(--color-primary), #6f8cff);
  font-size: 3.15rem;
  font-weight: 900;
}

.hero-app-icon span .ui-svg-icon {
  width: 54px;
  height: 54px;
}

.daily-summary {
  display: grid;
  gap: 18px;
  align-content: start;
  min-height: 300px;
  padding: 26px;
  color: #ffffff;
  border-radius: 30px;
  background:
    radial-gradient(circle at 82% 18%, rgba(122, 183, 255, 0.32), transparent 14rem),
    linear-gradient(145deg, rgba(22, 30, 46, 0.96), rgba(37, 48, 69, 0.88));
}

:root.theme-dark .daily-summary {
  background:
    radial-gradient(circle at 82% 18%, rgba(110, 139, 255, 0.26), transparent 14rem),
    linear-gradient(145deg, #26344f, #2f3e59);
}

.daily-summary .eyebrow,
.daily-summary dt {
  color: rgba(255, 255, 255, 0.72);
}

.daily-summary h2 {
  margin: 0;
  font-size: 1.55rem;
}

.summary-list {
  display: grid;
  gap: 12px;
  margin: 0;
}

.summary-list div {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-4);
  min-height: 58px;
  padding: 10px 12px;
  border: 1px solid rgba(255, 255, 255, 0.10);
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.06);
}

.summary-list div:last-child {
  padding: 10px 12px;
  border: 1px solid rgba(255, 255, 255, 0.10);
}

.summary-list dt {
  font-weight: 700;
}

.summary-list dd {
  margin: 0;
  display: grid;
  gap: 2px;
  text-align: right;
}

.summary-list dd strong {
  font-size: 1.45rem;
  font-weight: 850;
}

.summary-list dd span {
  color: rgba(255, 255, 255, 0.66);
  font-size: 0.78rem;
  font-weight: 700;
}

.kpi-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
  margin-bottom: 0;
}

.kpi-card {
  position: relative;
  min-height: 124px;
  display: grid;
  grid-template-columns: 52px minmax(0, 1fr);
  grid-template-areas:
    "icon label"
    "icon value"
    "spark text";
  align-items: center;
  column-gap: 14px;
  row-gap: 4px;
  padding: 18px;
  overflow: hidden;
  border-radius: 26px;
}

:root.theme-dark .kpi-card,
:root.theme-dark .data-panel {
  border-color: rgba(255, 255, 255, 0.12);
  background: rgba(22, 31, 53, 0.72);
}

.kpi-icon {
  grid-area: icon;
  width: 52px;
  height: 52px;
  display: grid;
  place-items: center;
  border-radius: 14px;
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.82), rgba(255, 255, 255, 0.42)),
    linear-gradient(135deg, rgba(15, 98, 254, 0.18), rgba(111, 140, 255, 0.14));
  box-shadow: 0 12px 26px rgba(23, 32, 51, 0.10);
  font-size: 1.25rem;
}

:root.theme-dark .kpi-icon,
:root.theme-dark .module-icon {
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.10), rgba(255, 255, 255, 0.04)),
    linear-gradient(135deg, rgba(110, 139, 255, 0.22), rgba(127, 116, 255, 0.12));
}

.kpi-label {
  grid-area: label;
  color: var(--color-muted);
  font-size: 0.86rem;
  font-weight: 800;
  text-transform: uppercase;
}

.kpi-card strong {
  grid-area: value;
  font-size: 2.05rem;
  line-height: 1;
}

.kpi-card p {
  grid-area: text;
  margin: 0;
  color: var(--color-muted);
  font-size: 0.86rem;
}

.kpi-sparkline {
  grid-area: spark;
  width: 52px;
  height: 18px;
  border-radius: 999px;
  background:
    linear-gradient(135deg, transparent 0 20%, rgba(15, 98, 254, 0.28) 20% 34%, transparent 34% 48%, rgba(111, 140, 255, 0.34) 48% 64%, transparent 64% 78%, rgba(15, 98, 254, 0.18) 78% 100%);
}

.dashboard-panels {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 18px;
}

.data-panel {
  padding: 24px;
  border-radius: 30px;
}

.panel-heading {
  display: flex;
  gap: var(--space-4);
  align-items: start;
  justify-content: space-between;
  margin-bottom: var(--space-4);
}

.panel-heading h2 {
  margin: 0;
  font-size: 1.35rem;
}

.panel-link {
  display: inline-flex;
  margin-top: var(--space-4);
  color: var(--color-primary-strong);
  font-weight: 800;
  text-decoration: none;
}


.panel-link:hover,
.panel-link:focus-visible {
  text-decoration: underline;
}

.metric-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-4);
}

.metric-card {
  padding: var(--space-5);
}

.metric-card strong {
  display: block;
  margin-top: var(--space-2);
  font-size: 2rem;
}

.metric-card span,
.dock-item span {
  color: var(--color-muted);
  font-size: 0.84rem;
  font-weight: 700;
}

.dashboard-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-4);
}

.module-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: var(--space-4);
}

.module-card {
  display: grid;
  gap: var(--space-4);
  min-height: 210px;
  padding: var(--space-5);
  color: var(--color-text);
  text-decoration: none;
}

.module-card:hover {
  transform: translateY(-2px);
  box-shadow: var(--shadow-soft);
}

.app-dock {
  position: fixed;
  inset: auto 0 0 0;
  z-index: 45;
  width: 100%;
  height: 30px;
  min-height: 30px;
  display: grid;
  grid-template-columns: 260px minmax(0, 1fr) 260px;
  gap: var(--space-2);
  align-items: center;
  margin: 0;
  padding: 3px var(--space-4);
  border-top: 1px solid rgba(255, 255, 255, 0.18);
  border-radius: 0;
  color: #f8fafc;
  background: rgba(15, 23, 42, 0.76);
  box-shadow: 0 -8px 28px rgba(23, 32, 51, 0.08);
  backdrop-filter: blur(22px) saturate(140%);
}

.status-dock {
  grid-template-columns: 260px minmax(0, 1fr) 260px;
}

.dock-item {
  display: inline-flex;
  gap: 6px;
  align-items: center;
  min-width: 0;
  padding: 0;
  border-radius: 0;
  background: transparent;
  font-size: 0.76rem;
}

.app-dock .dock-item span {
  color: rgba(248, 250, 252, 0.78);
}

.dock-user {
  justify-content: start;
}

.dock-brand {
  justify-content: center;
}

.dock-date {
  justify-content: end;
}

.dock-avatar {
  width: 20px;
  height: 20px;
  display: inline-grid;
  place-items: center;
  border-radius: 999px;
  color: #ffffff;
  background: linear-gradient(135deg, var(--color-primary), #6f8cff);
  font-size: 0.62rem;
  font-weight: 850;
}

.dock-brand a {
  color: #dbeafe;
  font-weight: 850;
  text-decoration: none;
}

.dock-brand a:hover,
.dock-brand a:focus-visible {
  text-decoration: underline;
}

.dock-item strong {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.module-icon {
  width: 48px;
  height: 48px;
  display: grid;
  place-items: center;
  border-radius: var(--radius-md);
  background: var(--color-surface-muted);
  font-size: 1.35rem;
}

.module-card h2 {
  margin-bottom: 0;
  font-size: 1.25rem;
}

.module-card p {
  margin-bottom: 0;
  color: var(--color-muted);
  line-height: 1.55;
}

.placeholder-table-wrap {
  overflow-x: auto;
  overflow-y: auto;
  max-height: 650px;
}

.placeholder-table {
  width: 100%;
  min-width: 620px;
  border-collapse: collapse;
}

.placeholder-table th,
.placeholder-table td {
  padding: var(--space-3) var(--space-4);
  border-bottom: 1px solid rgba(217, 226, 238, 0.72);
  text-align: left;
}

.placeholder-table th {
  color: var(--color-muted);
  font-size: 0.82rem;
  text-transform: uppercase;
  position: sticky;
  top: 0;
  z-index: 10;
  background-color: var(--color-surface);
}

.placeholder-table td {
  color: var(--color-text);
}

.page-actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-3);
  margin-top: var(--space-4);
}

.empty-state,
.loading-state,
.access-denied-state {
  padding: var(--space-6);
  text-align: center;
}

.empty-state p,
.loading-state p,
.access-denied-state p {
  color: var(--color-muted);
}

.content-stack {
  display: grid;
  gap: var(--space-5);
}

.info-list {
  display: grid;
  gap: var(--space-3);
  padding-left: 1.2rem;
  line-height: 1.7;
}

.app-footer {
  width: min(1120px, calc(100% - 32px));
  margin: auto auto 0;
  padding: var(--space-6) 0;
  color: var(--color-muted);
  font-size: 0.92rem;
  text-align: center;
}

.app-footer a {
  color: var(--color-primary-strong);
  font-weight: 700;
}

.accessibility-toggle {
  position: fixed;
  right: var(--space-4);
  bottom: calc(var(--dock-height) + 28px);
  z-index: 80;
  width: 52px;
  height: 52px;
  border: 1px solid rgba(255, 255, 255, 0.62);
  border-radius: 999px;
  color: var(--color-text);
  background: var(--color-glass-strong);
  box-shadow: var(--shadow-soft);
  cursor: pointer;
  display: grid;
  place-items: center;
  backdrop-filter: blur(18px) saturate(145%);
}

.accessibility-toggle .ui-svg-icon {
  width: 24px;
  height: 24px;
}

:root.theme-dark .accessibility-toggle .ui-svg-icon {
  filter: invert(1) brightness(1.35);
}

.accessibility-panel {
  position: fixed;
  right: var(--space-4);
  bottom: calc(var(--dock-height) + 92px);
  z-index: 80;
  width: min(320px, calc(100vw - 32px));
  padding: var(--space-4);
  border: 1px solid rgba(255, 255, 255, 0.62);
  border-radius: var(--radius-lg);
  background: var(--color-glass-strong);
  box-shadow: var(--shadow-soft);
}

.accessibility-panel[hidden] {
  display: none;
}

.accessibility-panel-header {
  display: grid;
  gap: var(--space-2);
  margin-bottom: var(--space-3);
}

.accessibility-panel-logo {
  width: 150px;
  max-height: 42px;
  object-fit: contain;
  filter: drop-shadow(0 8px 18px rgba(59, 78, 132, 0.16));
}

:root.theme-dark .accessibility-panel-logo {
  filter: drop-shadow(0 0 12px rgba(255, 255, 255, 0.20)) drop-shadow(0 10px 18px rgba(0, 0, 0, 0.25));
}

.accessibility-panel h2 {
  margin-bottom: 0;
  font-size: 1rem;
}

.accessibility-actions {
  display: grid;
  gap: var(--space-2);
}

.accessibility-actions button,
.accessibility-actions a {
  min-height: 40px;
  padding: var(--space-2) var(--space-3);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  color: var(--color-text);
  background: var(--color-surface);
  text-align: left;
  text-decoration: none;
  cursor: pointer;
}

.accessibility-actions button[aria-pressed="true"] {
  border-color: var(--color-primary);
  background: rgba(15, 98, 254, 0.10);
}

:root[data-reduce-transparency="on"] .app-card,
:root[data-reduce-transparency="on"] .app-topbar,
:root[data-reduce-transparency="on"] .accessibility-panel,
:root[data-reduce-transparency="on"] .app-dock,
:root[data-reduce-transparency="on"] .topbar-action,
:root[data-reduce-transparency="on"] .nav-icon-button {
  backdrop-filter: none;
  background: var(--color-surface);
}

:root.theme-dark[data-reduce-transparency="on"] .app-card,
:root.theme-dark[data-reduce-transparency="on"] .app-topbar,
:root.theme-dark[data-reduce-transparency="on"] .accessibility-panel,
:root.theme-dark[data-reduce-transparency="on"] .topbar-action,
:root.theme-dark[data-reduce-transparency="on"] .nav-icon-button {
  background: #161f35;
}

:root[data-menu-names="off"] .nav-icon-label {
  opacity: 0;
}

/* Correção 210P: reconstrução visual pelo modelo aprovado. */
.app-topbar {
  height: 88px;
  padding: 12px 34px;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.68), rgba(232, 240, 255, 0.48));
  border-bottom: 1px solid rgba(255, 255, 255, 0.64);
  box-shadow: 0 18px 50px rgba(59, 78, 132, 0.10);
}

:root.theme-dark .app-topbar {
  background:
    linear-gradient(135deg, rgba(20, 28, 48, 0.82), rgba(26, 35, 61, 0.66));
  border-bottom-color: rgba(255, 255, 255, 0.08);
}

.app-topbar-inner {
  grid-template-columns: 228px minmax(0, 1fr) 176px;
  gap: 18px;
}

.app-logo {
  width: 172px;
  min-height: 54px;
  justify-content: center;
  padding: 7px 12px;
  border: 1px solid rgba(255, 255, 255, 0.70);
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.92);
  box-shadow: 0 12px 30px rgba(59, 78, 132, 0.12);
}

:root.theme-dark .app-logo {
  border-color: rgba(255, 255, 255, 0.78);
  background: rgba(255, 255, 255, 0.96);
  box-shadow: 0 14px 34px rgba(0, 0, 0, 0.24);
}

.app-logo img {
  width: 142px;
  height: 40px;
}

.app-nav {
  gap: 10px;
}

.nav-icon-button {
  width: 76px;
  height: 64px;
  grid-template-rows: 34px 18px;
  padding: 7px 6px 6px;
  border-radius: 19px;
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.78), rgba(255, 255, 255, 0.46));
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.72),
    0 12px 30px rgba(59, 78, 132, 0.13);
}

:root.theme-dark .nav-icon-button {
  background:
    linear-gradient(145deg, rgba(35, 48, 79, 0.82), rgba(20, 29, 50, 0.70));
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.09),
    0 14px 32px rgba(0, 0, 0, 0.24);
}

.nav-icon-button:hover,
.nav-icon-button:focus-visible,
.menu-cluster.is-open .nav-icon-button {
  width: 76px;
  background:
    linear-gradient(145deg, rgba(231, 240, 255, 0.98), rgba(255, 255, 255, 0.72));
}

.nav-icon-button[aria-current="page"] {
  width: 76px;
  color: #ffffff;
  border-color: rgba(78, 115, 255, 0.52);
  background:
    radial-gradient(circle at 26% 14%, rgba(255, 255, 255, 0.36), transparent 1.8rem),
    linear-gradient(145deg, #4e73ff, #7f94ff);
}

.nav-icon-button[aria-current="page"] .nav-icon-label {
  color: #ffffff;
}

:root.theme-dark .nav-icon-button:hover,
:root.theme-dark .nav-icon-button:focus-visible,
:root.theme-dark .menu-cluster.is-open .nav-icon-button {
  background:
    linear-gradient(145deg, rgba(50, 67, 108, 0.94), rgba(30, 43, 74, 0.84));
}

:root.theme-dark .nav-icon-button[aria-current="page"] {
  color: #ffffff;
  background:
    radial-gradient(circle at 26% 14%, rgba(255, 255, 255, 0.18), transparent 1.8rem),
    linear-gradient(145deg, #5f7cff, #7f74ff);
}

.nav-icon {
  width: 28px;
  height: 28px;
}

.nav-icon .ui-svg-icon {
  width: 27px;
  height: 27px;
}

.nav-icon-label {
  width: 100%;
  max-width: 68px;
  min-width: 0;
  color: var(--color-text);
  font-size: 0.6rem;
  font-weight: 850;
  letter-spacing: 0;
  line-height: 1;
  text-align: center;
}

.menu-dropdown {
  top: calc(100% + 14px);
  border-radius: 20px;
  box-shadow: 0 24px 70px rgba(59, 78, 132, 0.20);
}

:root.theme-dark .menu-dropdown a:hover,
:root.theme-dark .menu-dropdown a:focus-visible {
  color: #b8c7ff;
  background: rgba(78, 115, 255, 0.20);
}

.topbar-actions {
  justify-content: flex-end;
}

.topbar-action {
  width: 44px;
  height: 44px;
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.78), rgba(255, 255, 255, 0.48));
}

:root.theme-dark .topbar-action {
  background:
    linear-gradient(145deg, rgba(35, 48, 79, 0.82), rgba(20, 29, 50, 0.72));
}

.dashboard-main {
  width: min(1240px, calc(100% - 36px));
  margin: 128px auto 66px;
  gap: 24px;
}

.dashboard-overview {
  grid-template-columns: minmax(0, 1.16fr) minmax(365px, 0.84fr);
  gap: 24px;
}

.dashboard-hero-card {
  min-height: 326px;
  grid-template-columns: minmax(0, 1fr) 210px;
  padding: 36px;
  border-radius: 32px;
  background:
    radial-gradient(circle at 86% 18%, rgba(78, 115, 255, 0.22), transparent 16rem),
    radial-gradient(circle at 8% 94%, rgba(180, 151, 255, 0.16), transparent 15rem),
    linear-gradient(145deg, rgba(255, 255, 255, 0.88), rgba(255, 255, 255, 0.58));
  box-shadow: 0 26px 72px rgba(59, 78, 132, 0.15);
}

:root.theme-dark .dashboard-hero-card {
  background:
    radial-gradient(circle at 86% 18%, rgba(110, 139, 255, 0.20), transparent 16rem),
    radial-gradient(circle at 8% 94%, rgba(127, 116, 255, 0.14), transparent 15rem),
    linear-gradient(145deg, rgba(31, 43, 70, 0.90), rgba(22, 31, 53, 0.72));
}

.dashboard-hero-copy {
  gap: 18px;
}

.dashboard-title {
  max-width: 17ch;
  font-size: clamp(40px, 4.4vw, 62px);
  line-height: 0.98;
}

.dashboard-hero-card .lead {
  max-width: 48ch;
  font-size: 1.03rem;
  line-height: 1.6;
}

.dashboard-actions .app-button,
.dashboard-actions .app-button-secondary {
  min-height: 42px;
  box-shadow: 0 12px 28px rgba(78, 115, 255, 0.16);
}

.hero-app-icon {
  width: 188px;
  border-radius: 42px;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.64),
    0 34px 76px rgba(78, 115, 255, 0.28);
}

.hero-app-icon span {
  width: 88px;
  height: 88px;
  font-size: 3.35rem;
}

.daily-summary {
  min-height: 326px;
  padding: 28px;
  border-radius: 32px;
  box-shadow: 0 28px 76px rgba(17, 24, 39, 0.24);
}

.daily-summary h2 {
  font-size: 1.68rem;
}

.summary-list {
  gap: 14px;
}

.summary-list div {
  min-height: 64px;
  padding: 12px 14px;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.10), rgba(255, 255, 255, 0.045));
}

.kpi-grid {
  gap: 18px;
}

.kpi-card {
  min-height: 142px;
  grid-template-columns: 58px minmax(0, 1fr) 54px;
  grid-template-areas:
    "icon label spark"
    "icon value spark"
    "icon text spark";
  padding: 20px;
  border-radius: 28px;
}

.kpi-card::after {
  content: "";
  position: absolute;
  right: -34px;
  bottom: -40px;
  width: 122px;
  height: 122px;
  border: 18px solid rgba(78, 115, 255, 0.10);
  border-radius: 999px;
}

:root.theme-dark .kpi-card::after {
  border-color: rgba(110, 139, 255, 0.13);
}

.kpi-icon {
  width: 58px;
  height: 58px;
  border-radius: 18px;
}

.kpi-icon .ui-svg-icon,
.module-icon .ui-svg-icon {
  width: 30px;
  height: 30px;
}

.kpi-label {
  font-size: 0.78rem;
  letter-spacing: 0;
}

.kpi-card strong {
  font-size: 2.28rem;
}

.kpi-sparkline {
  justify-self: end;
  width: 46px;
  height: 76px;
  border-radius: 999px;
  background:
    linear-gradient(180deg, rgba(78, 115, 255, 0.32), rgba(127, 148, 255, 0.08));
}

.dashboard-panels {
  gap: 20px;
}

.data-panel {
  padding: 26px;
  border-radius: 32px;
  box-shadow: 0 18px 50px rgba(59, 78, 132, 0.12);
}

:root.theme-dark .data-panel {
  box-shadow: 0 18px 54px rgba(0, 0, 0, 0.24);
}

.placeholder-table th,
.placeholder-table td {
  padding: 13px 16px;
}

:root.theme-dark .placeholder-table th,
:root.theme-dark .placeholder-table td {
  border-bottom-color: rgba(255, 255, 255, 0.10);
}

@media (max-width: 1100px) {
  .app-topbar-inner {
    grid-template-columns: 180px minmax(0, 1fr) 220px;
    padding: var(--space-3) 0;
  }

  .dashboard-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .dashboard-overview,
  .dashboard-hero-card,
  .dashboard-panels {
    grid-template-columns: 1fr;
  }

  .dashboard-hero-card {
    min-height: auto;
  }

  .dashboard-hero-visual {
    justify-content: start;
  }

  .module-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .dashboard-hero,
  .metric-grid {
    grid-template-columns: 1fr;
  }

  .app-dock {
    grid-template-columns: 220px minmax(0, 1fr) 220px;
  }
}

@media (max-width: 900px) {
  .app-topbar {
    height: auto;
    min-height: 82px;
  }

  .app-topbar-inner {
    grid-template-columns: 1fr;
  }

  .app-page.has-topbar {
    padding-top: 148px;
  }

  .app-page.dashboard-page.has-topbar {
    padding-top: 0;
  }

  .dashboard-main {
    margin-top: 166px;
  }

  .app-user {
    justify-content: space-between;
  }

  .kpi-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 600px) {
  :root {
    --topbar-height: 64px;
  }

  .app-main,
  .app-shell,
  .app-footer {
    width: min(100% - 24px, 1120px);
  }

  .app-page.has-topbar {
    padding-top: 156px;
  }

  .app-page.dashboard-page.has-topbar {
    padding-top: 0;
  }

  .dashboard-main {
    width: min(100% - 24px, 1180px);
    margin-top: 172px;
  }

  .app-card.padded {
    padding: var(--space-5);
  }

  .dashboard-header {
    display: grid;
    align-items: start;
  }

  .dashboard-grid {
    grid-template-columns: 1fr;
  }

  .dashboard-hero-card {
    padding: var(--space-5);
  }

  .dashboard-title {
    font-size: clamp(2.2rem, 12vw, 3.6rem);
  }

  .dashboard-actions,
  .dashboard-actions .app-button,
  .dashboard-actions .app-button-secondary {
    width: 100%;
  }

  .hero-app-icon {
    width: 128px;
    border-radius: 32px;
  }

  .hero-app-icon span {
    width: 62px;
    height: 62px;
    font-size: 2.6rem;
  }

  .kpi-grid {
    grid-template-columns: 1fr;
  }

  .panel-heading {
    display: grid;
  }

  .module-grid {
    grid-template-columns: 1fr;
  }

  .app-dock {
    grid-template-columns: 1fr;
    justify-items: center;
    min-height: auto;
    padding: 4px var(--space-3);
  }

  .dock-item {
    font-size: 0.72rem;
  }

  .dock-user,
  .dock-brand,
  .dock-date {
    justify-content: center;
  }

  .menu-dropdown {
    left: 0;
    transform: none;
  }

  .app-logo span {
    white-space: normal;
  }

  .app-user-meta {
    text-align: left;
  }
}

/* ==========================================================================
   PADRAO VISUAL SMART3LAB — adaptado aos portais Certifique e Safeweb
   Referencia validada em 21/08/2026: tipografia, cabecalho, cartoes e formularios.
   ========================================================================== */
:root {
  --smart-bg: #f5f5f7;
  --smart-surface: #ffffff;
  --smart-surface-muted: #f4f5f6;
  --smart-text: #17232d;
  --smart-muted: #5f6d78;
  --smart-primary: #1f7599;
  --smart-primary-strong: #185f7e;
  --smart-primary-soft: #e9f2f6;
  --smart-border: #d9e0e5;
  --smart-border-strong: #aebbc5;
  --smart-shadow: 0 16px 42px rgba(23, 35, 45, 0.07);
  --smart-shadow-login: 0 28px 70px rgba(23, 35, 45, 0.15);
  --font-system: Inter, "Segoe UI", Roboto, Arial, sans-serif;
  --color-bg: var(--smart-bg);
  --color-surface: var(--smart-surface);
  --color-surface-muted: var(--smart-surface-muted);
  --color-text: var(--smart-text);
  --color-muted: var(--smart-muted);
  --color-primary: var(--smart-primary);
  --color-primary-strong: var(--smart-primary-strong);
  --color-border: var(--smart-border);
  --color-focus: #087dad;
  --radius-md: 12px;
  --radius-lg: 20px;
  --radius-button: 10px;
  --topbar-height: 72px;
}

body:not(.login-screen),
:root.theme-dim body:not(.login-screen) {
  background: var(--smart-bg);
}

body:not(.login-screen)::before,
.app-page::before,
:root.theme-dim body:not(.login-screen)::before,
:root.theme-dark body:not(.login-screen)::before {
  display: none;
}

.app-page.has-topbar {
  padding-top: var(--topbar-height);
}

.app-main,
.app-shell,
.dashboard-main {
  width: min(1420px, calc(100% - 40px));
}

.app-main,
.dashboard-main {
  padding-top: 28px;
}

.app-topbar {
  position: fixed;
  height: var(--topbar-height);
  padding: 0 28px;
  border: 0;
  border-bottom: 1px solid #e5e8eb;
  border-radius: 0;
  background: rgba(255, 255, 255, 0.96);
  box-shadow: none;
  backdrop-filter: blur(18px) saturate(130%);
}

.app-topbar-inner {
  width: min(1500px, 100%);
  min-height: var(--topbar-height);
  margin: 0 auto;
  display: grid;
  gap: 20px;
  align-items: center;
}

.app-logo {
  width: 176px;
  padding: 0;
  justify-self: start;
}

.app-logo img {
  width: 170px;
  height: 48px;
  object-fit: contain;
  object-position: left center;
}

.app-topbar .brand-logo--glow::before {
  display: none;
}

.app-nav {
  justify-self: center;
  justify-content: center;
  gap: 3px;
}

.menu-cluster {
  min-height: 42px;
  display: inline-flex;
  align-items: center;
  gap: 2px;
  padding: 4px 8px;
  border-radius: 10px;
  transition: background-color 160ms ease;
}

.menu-cluster:hover,
.menu-cluster:focus-within,
.menu-cluster.is-open,
.menu-cluster:has(.nav-icon-button[aria-current="page"]) {
  background: var(--smart-primary-soft);
}

.nav-icon-button {
  min-width: 24px;
  display: inline-grid;
  place-items: center;
  backdrop-filter: none;
}

.nav-icon,
.nav-icon-button .nav-icon {
  transform: none !important;
}

.nav-icon-label {
  min-height: 0;
  color: var(--smart-text);
  font-size: 0.77rem;
  font-weight: 650;
  line-height: 1.1;
  transform: none;
}

.menu-cluster:has(.nav-icon-button[aria-current="page"]) .nav-icon-label,
.menu-cluster.is-open .nav-icon-label {
  font-weight: 700; /* R9 W2: peso na escala (400/600/700); a ponte do crm-ui.css define o peso */
}

.menu-dropdown {
  top: calc(100% + 10px);
  left: 0;
  min-width: 250px;
  padding: 8px;
  border: 1px solid var(--smart-border);
  border-radius: 14px;
  background: #ffffff;
  box-shadow: 0 18px 44px rgba(23, 35, 45, 0.14);
  backdrop-filter: none;
  transform: none;
}

.menu-dropdown a {
  min-height: 40px;
  border-radius: 9px;
  font-size: 0.88rem;
  font-weight: 550;
}

.menu-dropdown a:hover,
.menu-dropdown a:focus-visible {
  color: var(--smart-primary-strong);
  background: var(--smart-primary-soft);
}

.app-user {
  justify-self: end;
}

.topbar-action {
  width: 38px;
  height: 38px;
  border: 1px solid var(--smart-border);
  border-radius: 10px;
  background: #ffffff;
  box-shadow: none !important;
}

.topbar-action:hover,
.topbar-action:focus-visible {
  background: var(--smart-primary-soft);
  transform: none;
}

.topbar-avatar {
  background: var(--smart-primary);
  box-shadow: none;
}

.app-user-name {
  max-width: 125px;
  font-size: 0.86rem;
}

.app-user-role {
  font-size: 0.74rem;
}

.profile-popover {
  border-radius: 18px;
  box-shadow: 0 20px 48px rgba(23, 35, 45, 0.14);
  backdrop-filter: none;
}

.accessibility-panel {
  border: 1px solid var(--smart-border);
  border-radius: 18px;
  background: #ffffff;
  box-shadow: 0 20px 48px rgba(23, 35, 45, 0.14);
}

.app-card,
.data-panel,
.kpi-card,
.daily-summary,
.dashboard-hero-card,
.ios-calendar-widget {
  border: 1px solid #e7eaed;
  border-radius: 18px;
  background: #ffffff;
  box-shadow: var(--smart-shadow);
  backdrop-filter: none;
}

.dashboard-overview,
.dashboard-panels,
.kpi-grid {
  gap: 18px;
}

.dashboard-hero-card {
  min-height: 280px;
  padding: 28px;
}

.dashboard-title,
.page-title {
  max-width: none;
  color: var(--smart-text);
  font-size: clamp(2rem, 3.2vw, 3rem);
  line-height: 1.04;
  letter-spacing: -0.035em;
}

.section-title {
  color: var(--smart-text);
  font-size: clamp(1.35rem, 2vw, 1.8rem);
  letter-spacing: -0.025em;
}

.eyebrow,
.kpi-label {
  color: var(--smart-muted);
  font-size: 0.76rem;
  font-weight: 750;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.lead {
  color: var(--smart-muted);
  font-size: 0.98rem;
  line-height: 1.55;
}

.kpi-card {
  min-height: 124px;
  border-left-width: 4px;
}

.kpi-card strong {
  font-size: 2rem;
}

.data-panel,
.app-card.padded {
  padding: 22px;
}

.app-button,
.app-button-secondary,
.app-button-danger {
  min-height: 42px;
  padding-inline: 18px;
  border-radius: 10px;
  box-shadow: none;
  font-weight: 700;
}

.app-button {
  border-color: var(--smart-primary);
  background: var(--smart-primary);
}

.app-button:hover,
.app-button:focus-visible {
  background: var(--smart-primary-strong);
}

.app-button-secondary {
  color: var(--smart-text);
  border-color: var(--smart-border);
  background: #ffffff;
}

.app-button-secondary:hover,
.app-button-secondary:focus-visible {
  border-color: var(--smart-border-strong);
  background: var(--smart-surface-muted);
}

input:not([type="checkbox"]):not([type="radio"]),
select,
textarea,
.field-group input {
  min-height: 46px;
  border: 1px solid var(--smart-border-strong);
  border-radius: 11px;
  color: var(--smart-text);
  background: #ffffff;
  box-shadow: none;
}

input:not([type="checkbox"]):not([type="radio"]):focus,
select:focus,
textarea:focus {
  border-color: var(--smart-primary);
  box-shadow: 0 0 0 3px rgba(31, 117, 153, 0.12);
}

.field-group label,
label > span:first-child {
  color: #3f4f5c;
  font-size: 0.85rem;
  font-weight: 650;
}

.placeholder-table,
.agenda-dia-table,
.table-scroll,
.table-responsive,
[class*="table-wrapper"] {
  max-width: 100%;
}

.table-scroll,
.table-responsive,
[class*="table-wrapper"] {
  overflow: auto;
}

.placeholder-table th {
  padding: 12px 14px;
  color: #536371;
  background: #f4f5f6;
  border-bottom: 1px solid #dfe4e8;
  font-size: 0.74rem;
  font-weight: 750;
  letter-spacing: 0.045em;
  text-transform: uppercase;
}

.placeholder-table td {
  padding: 12px 14px;
  color: var(--smart-text);
  background: #ffffff;
  border-bottom: 1px solid #eceff1;
}

.placeholder-table tbody tr:hover td,
.agenda-dia-table tbody tr:hover td {
  background: #f8fafb;
}

/* Login com a composicao da referencia e fotos rotativas preservadas. */

/* Tema escuro conserva a mesma hierarquia, sem o efeito de vidro antigo. */
:root.theme-dark {
  --smart-bg: #111821;
  --smart-surface: #18222d;
  --smart-surface-muted: #202d39;
  --smart-text: #f3f6f8;
  --smart-muted: #aebbc5;
  --smart-primary: #56a8ca;
  --smart-primary-strong: #7ec1dd;
  --smart-primary-soft: #223b49;
  --smart-border: #32424f;
  --smart-border-strong: #536673;
}

:root.theme-dark body:not(.login-screen) {
  background: var(--smart-bg);
}

:root.theme-dark .profile-popover {
  box-shadow: none;
}

:root.theme-dark .app-topbar,
:root.theme-dark .app-card,
:root.theme-dark .data-panel,
:root.theme-dark .kpi-card,
:root.theme-dark .dashboard-hero-card,
:root.theme-dark .daily-summary,
:root.theme-dark .accessibility-panel,
:root.theme-dark .menu-dropdown {
  border-color: var(--smart-border);
  background: var(--smart-surface);
  box-shadow: none;
}

:root.theme-dark input:not([type="checkbox"]):not([type="radio"]),
:root.theme-dark select,
:root.theme-dark textarea,
:root.theme-dark .app-button-secondary,
:root.theme-dim input:not([type="checkbox"]):not([type="radio"]),
:root.theme-dim select,
:root.theme-dim textarea {
  color: var(--smart-text);
  border-color: var(--smart-border-strong);
  background: var(--smart-surface);
}

:root.theme-dark .placeholder-table th {
  color: var(--smart-muted);
  background: var(--smart-surface-muted);
}

:root.theme-dark .placeholder-table td {
  color: var(--smart-text);
  background: var(--smart-surface);
}

@media (max-width: 1220px) {
  .app-topbar-inner {
    gap: 10px;
  }

  .app-logo,
  .app-logo img {
    width: 150px;
  }

  .menu-cluster {
    padding-inline: 5px;
  }

  .nav-icon-label {
    font-size: 0.7rem;
  }
}

@media (max-width: 960px) {
  .app-topbar {
    height: 66px;
    padding-inline: 18px;
  }

  .app-topbar-inner {
    min-height: 66px;
  }

  .app-nav {
    display: none;
  }

  .app-logo {
    grid-column: auto;
    justify-self: start;
  }

  .app-user {
    grid-column: auto;
    justify-self: end;
  }

  .app-hamburger-menu {
    display: inline-grid;
  }

  .app-page.has-topbar {
    padding-top: 66px;
  }
}

@media (max-width: 600px) {
  .app-main,
  .app-shell,
  .dashboard-main {
    width: min(100% - 24px, 1420px);
  }
}

/* Correção 210Q: assets reais do usuário, logo transparente e sparklines SVG. */
.app-logo {
  width: 178px;
  min-height: 54px;
  justify-content: flex-start;
  padding: 0 0 0 4px;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

:root.theme-dark .app-logo {
  border-color: transparent;
  background: transparent;
  box-shadow: none;
}

.app-logo img {
  width: 160px;
  height: 46px;
  object-fit: contain;
  filter: drop-shadow(0 10px 22px rgba(59, 78, 132, 0.16));
}

:root.theme-dark .app-logo img {
  filter: drop-shadow(0 0 12px rgba(255, 255, 255, 0.22)) drop-shadow(0 12px 24px rgba(0, 0, 0, 0.30));
}

.brand-mark {
  width: min(220px, 70vw);
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  filter: drop-shadow(0 10px 22px rgba(59, 78, 132, 0.16));
}

:root.theme-dark .brand-mark {
  filter: drop-shadow(0 0 14px rgba(255, 255, 255, 0.22)) drop-shadow(0 12px 24px rgba(0, 0, 0, 0.26));
}

.nav-icon .ui-svg-icon {
  width: 31px;
  height: 31px;
  border-radius: 10px;
}

.kpi-sparkline {
  position: relative;
  z-index: 1;
  justify-self: end;
  width: 76px;
  height: 56px;
  display: grid;
  place-items: center;
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.34);
}

.kpi-sparkline img {
  width: 70px;
  height: 48px;
  opacity: 0.82;
}

:root.theme-dark .kpi-sparkline {
  background: rgba(255, 255, 255, 0.055);
}

/* Correção 210R: login com imagem grande, logo transparente e acessibilidade elevada. */

.brand-mark {
  width: min(240px, 70vw);
}

/* Correção 210S: login com fundo em loop e painel de acessibilidade padronizado. */

.accessibility-toggle {
  bottom: 72px;
  color: #0f172a;
  background: rgba(255, 255, 255, 0.86);
}

:root.theme-dark .accessibility-toggle {
  color: #f5f7ff;
  background: rgba(22, 31, 53, 0.86);
}

.accessibility-panel {
  bottom: 138px;
  width: min(360px, calc(100vw - 32px));
  padding: 0;
  overflow: hidden;
}

.accessibility-panel-header {
  grid-template-columns: 36px 1fr 34px;
  align-items: center;
  gap: var(--space-3);
  margin: 0;
  padding: var(--space-4);
  border-bottom: 1px solid var(--color-border);
}

.accessibility-panel-icon {
  width: 36px;
  height: 36px;
  display: grid;
  place-items: center;
  border-radius: 999px;
  color: #2f63f5;
  background: #e7f0ff;
}

.accessibility-panel-icon .ui-svg-icon {
  width: 22px;
  height: 22px;
}

.accessibility-close {
  width: 34px;
  height: 34px;
  border: 1px solid var(--color-border);
  border-radius: 999px;
  color: var(--color-text);
  background: var(--color-glass);
  cursor: pointer;
  font-weight: 900;
}

.accessibility-actions {
  gap: 0;
}

.accessibility-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: var(--space-3);
  align-items: center;
  padding: var(--space-4);
  border-bottom: 1px solid rgba(217, 226, 238, 0.72);
}

:root.theme-dark .accessibility-row {
  border-bottom-color: rgba(255, 255, 255, 0.10);
}

.accessibility-row:last-child {
  border-bottom: 0;
}

.accessibility-row-copy {
  display: grid;
  gap: 4px;
}

.accessibility-row-copy strong {
  font-size: 0.92rem;
}

.accessibility-row-copy span {
  color: var(--color-muted);
  font-size: 0.78rem;
  line-height: 1.35;
}

.accessibility-font-buttons {
  display: inline-flex;
  gap: 6px;
}

.accessibility-actions button {
  min-height: 34px;
  padding: 0 12px;
  border-radius: 999px;
  white-space: nowrap;
  text-align: center;
}

.accessibility-font-buttons button {
  min-width: 42px;
  padding: 0 10px;
  font-weight: 900;
}

.accessibility-page-actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-3);
  order: -1;
}

.accessibility-page-icon {
  width: 56px;
  height: 56px;
  display: grid;
  place-items: center;
  border-radius: 20px;
  color: #2f63f5;
  background: #e7f0ff;
}

.accessibility-page-icon .ui-svg-icon {
  width: 34px;
  height: 34px;
}

/* Correção 210T: ajustes finos do login. */

/* CRM 2026-08: superfícies objetivas, rolagem segura e formulários densos. */
.app-card,
.schema-panel {
  border-radius: 18px;
  border-color: color-mix(in srgb, var(--color-border) 82%, transparent);
  box-shadow: 0 14px 38px rgba(15, 23, 42, 0.07);
}

.module-workspace,
.table-responsive,
.table-scroll,
.ios-table-wrapper,
.data-table-container,
.preview-table-container {
  max-width: 100%;
  overflow: auto;
  scrollbar-gutter: stable;
  overscroll-behavior: contain;
}

.module-workspace table,
.table-responsive table,
.table-scroll table,
.ios-table-wrapper table,
.data-table-container table,
.preview-table-container table {
  min-width: max-content;
}

/* .pedido-field e #agenda-atendimento-panel.is-disabled: movidos para op-agenda-novo.css (R9 W3-B). */

.brand-mark {
  width: min(240px, 70vw);
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  filter: none;
}

:root.theme-dark .brand-mark {
  filter: drop-shadow(0 0 10px rgba(255, 255, 255, 0.18));
}

/* Correção 210U: login sem card interno de imagem. */

/* Correção 210U: glow LED do logo Certifique no modo dark. */
.brand-logo {
  position: relative;
  isolation: isolate;
  display: inline-flex;
  align-items: center;
  width: fit-content;
}

.brand-logo--glow::before {
  content: "";
  position: absolute;
  inset: -16px -24px;
  z-index: -1;
  border-radius: 999px;
  pointer-events: none;
  background:
    radial-gradient(circle at 34% 48%, rgba(210, 230, 255, 0.18), transparent 58%),
    radial-gradient(circle at 62% 52%, rgba(70, 115, 255, 0.14), transparent 66%);
  filter: blur(18px);
  opacity: 0.18;
  transform: translateZ(0);
}

:root.theme-dark .brand-logo--glow::before {
  inset: -20px -30px;
  background:
    radial-gradient(circle at 32% 48%, rgba(210, 230, 255, 0.45), transparent 58%),
    radial-gradient(circle at 62% 52%, rgba(70, 115, 255, 0.65), transparent 68%);
  filter: blur(24px);
  opacity: 0.9;
}

.brand-logo--glow img {
  position: relative;
  z-index: 1;
}

:root.theme-dark .brand-logo--glow img {
  filter:
    drop-shadow(0 0 12px rgba(210, 230, 255, 0.42))
    drop-shadow(0 0 24px rgba(70, 115, 255, 0.46));
}

/* Correção 210V: logo maior no login e na topbar, sem título duplicado. */

.app-topbar-inner {
  grid-template-columns: 260px minmax(0, 1fr) 250px;
}

.app-logo {
  width: 230px;
  min-height: 62px;
}

.app-logo img {
  width: 216px;
  height: 58px;
}

@media (max-width: 1100px) {
  .app-topbar-inner {
    grid-template-columns: 220px minmax(0, 1fr) 220px;
  }

  .app-logo {
    width: 204px;
  }

  .app-logo img {
    width: 196px;
    height: 54px;
  }
}

/* Correção 210Y: seletor real do logo no login com tamanho efetivo. */

/* Correção 210Z: respiro entre logo e card e azul institucional no login. */

/* Correção 210U: card interno de imagem removido e glow LED refinado. */

.app-topbar .brand-logo--glow::before {
  inset: -18px -28px;
  background:
    radial-gradient(circle at 32% 48%, rgba(210, 230, 255, 0.20), transparent 58%),
    radial-gradient(circle at 62% 52%, rgba(70, 115, 255, 0.16), transparent 68%);
  filter: blur(20px);
  opacity: 0.22;
}

:root.theme-dark .app-topbar .brand-logo--glow::before {
  inset: -24px -36px;
  background:
    radial-gradient(circle at 31% 48%, rgba(210, 230, 255, 0.52), transparent 58%),
    radial-gradient(circle at 64% 52%, rgba(70, 115, 255, 0.72), transparent 70%);
  filter: blur(28px);
  opacity: 0.96;
}

:root.theme-dark .app-topbar .brand-logo--glow img {
  filter:
    drop-shadow(0 0 10px rgba(230, 242, 255, 0.46))
    drop-shadow(0 0 24px rgba(70, 115, 255, 0.52))
    drop-shadow(0 0 42px rgba(70, 115, 255, 0.28));
}

/* Correção 210ZD: aplicação do modelo HTML de referência descrito. */
body:not(.login-screen) {
  background:
    radial-gradient(ellipse at 12% 8%, rgba(78, 115, 255, 0.20), transparent 34rem),
    radial-gradient(ellipse at 88% 12%, rgba(180, 160, 255, 0.22), transparent 28rem),
    linear-gradient(135deg, #edf4ff 0%, #f7f9ff 46%, #eef1ff 100%);
}

body:not(.login-screen)::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background:
    linear-gradient(156deg, transparent 0 46%, rgba(255, 255, 255, 0.48) 46.2% 57%, transparent 57.2%),
    radial-gradient(circle at 50% 105%, rgba(78, 115, 255, 0.10), transparent 34rem);
}

:root.theme-dark body:not(.login-screen) {
  background:
    radial-gradient(ellipse at 12% 8%, rgba(76, 126, 255, 0.22), transparent 34rem),
    radial-gradient(ellipse at 88% 12%, rgba(126, 102, 255, 0.16), transparent 30rem),
    linear-gradient(135deg, #0d1325 0%, #111a31 52%, #16122c 100%);
}

:root.theme-dark body:not(.login-screen)::before {
  background:
    linear-gradient(156deg, transparent 0 45%, rgba(255, 255, 255, 0.045) 45.2% 57%, transparent 57.2%),
    radial-gradient(circle at 50% 105%, rgba(110, 139, 255, 0.12), transparent 34rem);
}

/* Correção 210U-A: reforço final contra card interno de imagem no login. */

.app-topbar .brand-logo--glow {
  background: transparent;
  box-shadow: none;
}

.app-topbar .brand-logo--glow::before {
  background:
    radial-gradient(circle at 34% 48%, rgba(210, 230, 255, 0.18), transparent 58%),
    radial-gradient(circle at 62% 52%, rgba(70, 115, 255, 0.14), transparent 68%);
  opacity: 0.18;
}

:root.theme-dark .app-topbar .brand-logo--glow::before {
  background:
    radial-gradient(circle at 32% 48%, rgba(210, 230, 255, 0.52), transparent 58%),
    radial-gradient(circle at 64% 52%, rgba(70, 115, 255, 0.72), transparent 70%);
  filter: blur(30px);
  opacity: 0.96;
}

:root.theme-dark .app-topbar .brand-logo--glow img {
  filter:
    drop-shadow(0 0 10px rgba(230, 242, 255, 0.46))
    drop-shadow(0 0 24px rgba(70, 115, 255, 0.52))
    drop-shadow(0 0 42px rgba(70, 115, 255, 0.28));
}

.app-card,
.data-panel,
.kpi-card,
.daily-summary,
.dashboard-hero-card {
  border: 1px solid rgba(255, 255, 255, 0.62);
  background-color: rgba(255, 255, 255, 0.58);
  box-shadow: 0 24px 70px rgba(59, 78, 132, 0.14);
  backdrop-filter: blur(28px) saturate(150%);
}

:root.theme-dark .app-card,
:root.theme-dark .data-panel,
:root.theme-dark .kpi-card,
:root.theme-dark .dashboard-hero-card {
  border-color: rgba(255, 255, 255, 0.12);
  background-color: rgba(20, 29, 51, 0.66);
  box-shadow: 0 26px 80px rgba(0, 0, 0, 0.30);
}

.app-topbar {
  top: 16px;
  left: 50%;
  right: auto;
  width: min(1240px, calc(100% - 32px));
  height: 84px;
  padding: 10px 18px;
  border-radius: 30px;
  border: 1px solid rgba(255, 255, 255, 0.68);
  background: rgba(255, 255, 255, 0.54);
  transform: translateX(-50%);
}

:root.theme-dark .app-topbar {
  background: rgba(16, 25, 46, 0.72);
}

.app-topbar-inner {
  grid-template-columns: 250px minmax(0, 1fr) 190px;
  gap: 16px;
}

.app-logo {
  width: 236px;
}

.app-logo img {
  width: 224px;
  height: 62px;
}

.app-nav {
  gap: 12px;
}

.menu-cluster {
  display: grid;
  justify-items: center;
  gap: 5px;
}

.nav-icon-button {
  width: 54px;
  height: 50px;
  grid-template-rows: 1fr;
  border-radius: 18px;
}

.nav-icon-button .nav-icon {
  width: 30px;
  height: 30px;
}

.nav-icon-label {
  max-width: 78px;
  min-height: 14px;
  color: rgba(24, 35, 61, 0.82);
  font-size: 0.66rem;
  font-weight: 800;
  line-height: 1;
  text-align: center;
}

:root.theme-dark .nav-icon-label {
  color: rgba(245, 247, 255, 0.82);
}

.menu-cluster.is-open .nav-icon-label,
.nav-icon-button[aria-current="page"] + .nav-icon-label {
  color: var(--color-primary-strong);
}

.nav-icon-button:hover .nav-icon-label,
.nav-icon-button:focus-visible .nav-icon-label,
.menu-cluster.is-open .nav-icon-button .nav-icon-label {
  transform: none;
}

.menu-dropdown {
  top: calc(100% + 14px);
}

.dashboard-main {
  width: min(1180px, calc(100% - 40px));
  margin-top: 132px;
  margin-bottom: 72px;
}

.dashboard-overview {
  grid-template-columns: minmax(0, 1.12fr) minmax(340px, 0.78fr);
  gap: 20px;
}

.dashboard-hero-card {
  min-height: 326px;
  border-radius: 28px;
  background:
    radial-gradient(circle at 86% 20%, rgba(78, 115, 255, 0.26), transparent 18rem),
    radial-gradient(circle at 12% 90%, rgba(180, 160, 255, 0.18), transparent 16rem),
    rgba(255, 255, 255, 0.58);
}

.daily-summary {
  border-radius: 28px;
}

.kpi-grid {
  gap: 18px;
}

.kpi-card {
  min-height: 136px;
  border-radius: 24px;
}

.dashboard-panels {
  gap: 20px;
}

.data-panel {
  min-height: 268px;
  border-radius: 28px;
}

.app-dock {
  left: 50%;
  right: auto;
  bottom: 12px;
  width: min(1180px, calc(100% - 40px));
  border-radius: 999px;
  transform: translateX(-50%);
}

.app-footer {
  padding-bottom: calc(var(--dock-height) + 18px);
}

.accessibility-toggle {
  bottom: 58px;
}

@media (max-width: 1100px) {
  .app-topbar {
    top: 10px;
    width: min(100% - 20px, 760px);
    height: auto;
  }

  .app-topbar-inner {
    grid-template-columns: 1fr;
    justify-items: center;
  }

  .app-user {
    justify-content: center;
  }

  .dashboard-main {
    margin-top: 210px;
  }
}

/* Correção 210ZE: acessibilidade completa, submenus por label e menu centralizado. */
.app-topbar-inner {
  grid-template-columns: minmax(220px, 1fr) auto minmax(220px, 1fr);
  justify-items: stretch;
}

.app-logo {
  justify-self: start;
}

.app-nav {
  justify-self: center;
  justify-content: center;
}

.app-user {
  justify-self: end;
}

.nav-icon-label {
  cursor: pointer;
  user-select: none;
}

.nav-icon-label:focus-visible {
  outline: 3px solid rgba(38, 39, 137, 0.42);
  outline-offset: 5px;
  border-radius: 999px;
}

:root[data-menu-names="off"] .nav-icon-label {
  visibility: hidden;
  opacity: 0;
}

.app-footer a {
  color: var(--color-primary-strong);
}

body:not(.login-screen) .app-footer a {
  color: #dbeafe;
}

.dock-brand a,
.app-footer a {
  font-weight: 900;
  text-decoration: none;
}

.dock-brand a:hover,
.app-footer a:hover,
.dock-brand a:focus-visible,
.app-footer a:focus-visible {
  text-decoration: underline;
}

.accessibility-toggle {
  right: 22px;
  bottom: 70px;
  box-shadow: 0 18px 42px rgba(38, 39, 137, 0.24);
}

.accessibility-panel {
  right: 22px;
  bottom: 136px;
  width: min(390px, calc(100vw - 32px));
  padding: 18px;
  border: 1px solid rgba(255, 255, 255, 0.66);
  border-radius: 24px;
  background: rgba(255, 255, 255, 0.86);
  box-shadow: 0 24px 70px rgba(31, 42, 68, 0.22);
  backdrop-filter: blur(26px) saturate(150%);
}

:root.theme-dark .accessibility-panel {
  border-color: rgba(255, 255, 255, 0.14);
  background: rgba(18, 26, 47, 0.92);
  box-shadow: 0 26px 74px rgba(0, 0, 0, 0.40);
}

.accessibility-panel-header {
  display: grid;
  grid-template-columns: 44px 1fr 36px;
  align-items: center;
  gap: 10px;
  margin-bottom: 14px;
}

.accessibility-panel-header h2 {
  margin: 0;
  font-size: 1rem;
  font-weight: 900;
  letter-spacing: 0;
}

.accessibility-panel-header .accessibility-panel-icon {
  width: 42px;
  height: 42px;
  border-radius: 16px;
  display: grid;
  place-items: center;
  background: rgba(38, 39, 137, 0.10);
}

:root.theme-dark .accessibility-panel-header .accessibility-panel-icon {
  background: rgba(135, 166, 255, 0.16);
}

.accessibility-panel-header .ui-svg-icon {
  width: 25px;
  height: 25px;
}

.accessibility-close {
  width: 34px;
  height: 34px;
  border: 0;
  border-radius: 999px;
  background: rgba(31, 42, 68, 0.08);
  color: var(--color-text);
  cursor: pointer;
  font-size: 1rem;
  font-weight: 900;
}

:root.theme-dark .accessibility-close {
  background: rgba(255, 255, 255, 0.10);
  color: rgba(245, 247, 255, 0.92);
}

.accessibility-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 14px;
  padding: 13px 0;
  border-top: 1px solid rgba(31, 42, 68, 0.10);
}

:root.theme-dark .accessibility-row {
  border-top-color: rgba(255, 255, 255, 0.10);
}

.accessibility-row-copy {
  display: grid;
  gap: 4px;
}

.accessibility-row-copy strong {
  color: var(--color-text);
  font-size: 0.92rem;
  font-weight: 900;
}

.accessibility-row-copy span {
  color: var(--color-muted);
  font-size: 0.78rem;
  line-height: 1.35;
}

.accessibility-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 8px;
}

.accessibility-actions button {
  min-width: 44px;
  border: 1px solid rgba(38, 39, 137, 0.18);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.72);
  color: var(--color-text);
  cursor: pointer;
  font-weight: 900;
}

.accessibility-actions button[aria-pressed="true"] {
  border-color: rgba(38, 39, 137, 0.48);
  background: var(--ui-accent);
  color: #fff;
}

:root.theme-dark .accessibility-actions button {
  border-color: rgba(255, 255, 255, 0.16);
  background: rgba(255, 255, 255, 0.08);
  color: rgba(245, 247, 255, 0.92);
}

:root.theme-dark .accessibility-actions button[aria-pressed="true"] {
  background: #8ea6ff;
  color: #081229;
}

@media (max-width: 1100px) {
  .app-topbar-inner {
    grid-template-columns: 1fr;
  }

  .app-logo,
  .app-nav,
  .app-user {
    justify-self: center;
  }
}

@media (max-width: 640px) {
  .accessibility-toggle {
    right: 14px;
    bottom: 82px;
  }

  .accessibility-panel {
    right: 14px;
    bottom: 148px;
  }

  .accessibility-row {
    grid-template-columns: 1fr;
    align-items: start;
  }

  .accessibility-actions {
    justify-content: flex-start;
  }
}

/* Correção 210ZG: topbar alinhada ao mesmo container do dashboard. */
:root {
  --app-shell-max-width: 1560px;
  --app-shell-padding: 40px;
  --app-shell-width: min(var(--app-shell-max-width), calc(100% - var(--app-shell-padding)));
}

.dashboard-main,
.app-topbar,
.app-dock {
  width: var(--app-shell-width);
  max-width: var(--app-shell-max-width);
  margin-inline: auto;
}

.dashboard-main {
  margin-left: auto;
  margin-right: auto;
}

.app-topbar {
  left: 50%;
  right: auto;
  box-sizing: border-box;
  transform: translateX(-50%);
}

.app-topbar-inner {
  width: 100%;
  grid-template-columns: minmax(230px, 1fr) auto minmax(230px, 1fr);
}

.app-nav {
  max-width: 100%;
  overflow-x: auto;
  overflow-y: visible;
  scrollbar-width: thin;
}

.app-dock {
  left: 50%;
  right: auto;
  transform: translateX(-50%);
}

@media (max-width: 1100px) {
  :root {
    --app-shell-padding: 28px;
  }

  .app-topbar {
    width: var(--app-shell-width);
    max-width: var(--app-shell-max-width);
  }

  .app-topbar-inner {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 640px) {
  :root {
    --app-shell-padding: 20px;
  }
}

/* Correção 210ZH: menu superior centralizado sem barra de rolagem. */
.app-topbar-inner {
  position: relative;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
}

.app-logo {
  grid-column: 1;
  z-index: 2;
}

.app-user {
  grid-column: 2;
  z-index: 2;
}

.app-nav {
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 1;
  max-width: none;
  justify-content: center;
  gap: 10px;
  overflow: visible;
  overflow-x: visible;
  overflow-y: visible;
  scrollbar-width: auto;
  transform: translate(-50%, -50%);
}

.nav-icon-button {
  width: 52px;
}

.nav-icon-label {
  max-width: 72px;
  font-size: 0.62rem;
}

@media (max-width: 1100px) {
  .app-topbar-inner {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  }

  .app-logo {
    justify-self: start;
  }

  .app-user {
    justify-self: end;
  }
}

@media (max-width: 960px) {
  .app-topbar-inner {
    grid-template-columns: 1fr;
    justify-items: center;
    row-gap: 10px;
  }

  .app-logo,
  .app-user {
    grid-column: 1;
    justify-self: center;
  }

  .app-nav {
    position: static;
    max-width: 100%;
    flex-wrap: wrap;
    transform: none;
  }
}

/* Correção 210ZI: parte inferior e barra inferior alinhadas ao dashboard. */
.dashboard-panels {
  width: 100%;
  margin-inline: auto;
}

.dashboard-main {
  margin-bottom: calc(var(--dock-height, 40px) + 96px);
  padding-bottom: 20px;
}

.app-dock {
  left: 0;
  right: 0;
  bottom: 12px;
  width: 100%;
  max-width: none;
  height: auto;
  min-height: 0;
  display: block;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  backdrop-filter: none;
  transform: none;
}

.app-dock-inner {
  width: var(--app-shell-width);
  max-width: var(--app-shell-max-width);
  min-height: 34px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  align-items: center;
  gap: 16px;
  margin-inline: auto;
  padding: 5px 16px;
  border: 1px solid rgba(255, 255, 255, 0.18);
  border-radius: 999px;
  color: #f8fafc;
  background: rgba(15, 23, 42, 0.82);
  box-shadow: 0 14px 42px rgba(23, 32, 51, 0.18);
  backdrop-filter: blur(22px) saturate(140%);
}

.dock-user {
  justify-self: start;
  justify-content: flex-start;
  max-width: 100%;
}

.dock-brand {
  justify-self: center;
  justify-content: center;
  text-align: center;
  white-space: nowrap;
}

.dock-date {
  justify-self: end;
  justify-content: flex-end;
  white-space: nowrap;
}

.dock-date strong,
.dock-date span {
  display: inline-flex;
}

.dock-item strong {
  min-width: 0;
}

.accessibility-toggle {
  bottom: 76px;
}

.accessibility-panel {
  bottom: 142px;
}

@media (max-width: 760px) {
  .dashboard-main {
    margin-bottom: calc(var(--dock-height, 40px) + 132px);
  }

  .app-dock-inner {
    grid-template-columns: 1fr;
    justify-items: center;
    gap: 4px;
    padding: 8px 14px;
    border-radius: 22px;
  }

  .dock-user,
  .dock-brand,
  .dock-date {
    justify-self: center;
    justify-content: center;
    text-align: center;
  }

  .dock-brand {
    white-space: normal;
  }
}

/* Correção 210ZJ: barras superior e inferior de ponta a ponta. */
.app-topbar {
  top: 0;
  left: 0;
  right: 0;
  width: 100%;
  max-width: none;
  height: 82px;
  padding: 0;
  border-radius: 0;
  border-width: 0 0 1px;
  border-color: rgba(255, 255, 255, 0.58);
  overflow: visible;
  background: rgba(245, 247, 250, 0.72);
  box-shadow: 0 12px 34px rgba(59, 78, 132, 0.12);
  transform: none;
}

:root.theme-dark .app-topbar {
  border-bottom-color: rgba(255, 255, 255, 0.10);
  background: rgba(16, 25, 46, 0.82);
  box-shadow: 0 14px 38px rgba(0, 0, 0, 0.28);
}

.app-topbar-inner {
  width: 100%;
  min-height: 82px;
  display: grid;
  grid-template-columns: 260px minmax(0, 1fr) 260px;
  align-items: center;
  gap: 14px;
  padding: 10px 24px;
  position: relative;
}

.app-logo {
  grid-column: 1;
  justify-self: start;
}

.app-user {
  grid-column: 3;
  justify-self: end;
}

.app-nav {
  position: static;
  grid-column: 2;
  justify-self: center;
  max-width: 100%;
  gap: 8px;
  flex-wrap: nowrap;
  overflow: visible;
  overflow-x: visible;
  overflow-y: visible;
  scrollbar-width: auto;
  transform: none;
}

.topbar-actions {
  justify-content: flex-end;
}

.app-dock {
  left: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  max-width: none;
  display: block;
  padding: 0;
  background: rgba(15, 23, 42, 0.84);
  border-top: 1px solid rgba(255, 255, 255, 0.16);
  border-radius: 0;
  box-shadow: 0 -10px 28px rgba(23, 32, 51, 0.14);
  backdrop-filter: blur(22px) saturate(140%);
  transform: none;
}

.app-dock-inner {
  width: 100%;
  max-width: none;
  min-height: 34px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  align-items: center;
  gap: 16px;
  margin: 0;
  padding: 6px 24px;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  backdrop-filter: none;
}

.app-footer {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 40;
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 7px 24px;
  display: flex;
  justify-content: center;
  border-top: 1px solid rgba(255, 255, 255, 0.16);
  color: #f8fafc;
  background: rgba(15, 23, 42, 0.84);
  box-shadow: 0 -10px 28px rgba(23, 32, 51, 0.14);
  backdrop-filter: blur(22px) saturate(140%);
  font-size: 0.76rem;
  font-weight: 800;
}

.dashboard-main {
  margin-top: 126px;
  margin-bottom: calc(var(--dock-height, 40px) + 74px);
  padding-bottom: 18px;
}

.dock-user {
  justify-self: start;
  justify-content: flex-start;
}

.dock-brand {
  justify-self: center;
  justify-content: center;
  text-align: center;
}

.dock-date {
  justify-self: end;
  justify-content: flex-end;
}

.tenant-badge {
  display: inline-flex;
  align-items: center;
  min-height: 20px;
  padding: 2px 8px;
  border: 1px solid rgba(255, 255, 255, 0.22);
  border-radius: 999px;
  color: rgba(248, 250, 252, 0.86);
  font-size: 0.64rem;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.tenant-ar-field {
  display: grid;
  gap: 8px;
  margin: 18px 0;
  padding: 16px;
  border: 1px solid rgba(75, 85, 99, 0.16);
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.62);
  box-shadow: 0 14px 34px rgba(15, 23, 42, 0.08);
}

.tenant-ar-field[hidden] {
  display: none !important;
}

.tenant-ar-field label {
  color: var(--color-text);
  font-size: 0.78rem;
  font-weight: 900;
  text-transform: uppercase;
}

.tenant-ar-field select,
.tenant-ar-field input {
  min-height: 42px;
  width: min(100%, 420px);
  padding: 0 14px;
  border: 1px solid rgba(75, 85, 99, 0.22);
  border-radius: 12px;
  color: var(--color-text);
  background: rgba(255, 255, 255, 0.82);
  font: inherit;
  font-weight: 700;
}

.tenant-ar-field p {
  max-width: 620px;
  margin: 0;
  color: var(--color-muted);
  font-size: 0.86rem;
}

.theme-dark .tenant-ar-field {
  border-color: rgba(148, 163, 184, 0.2);
  background: rgba(15, 23, 42, 0.58);
}

.theme-dark .tenant-ar-field select,
.theme-dark .tenant-ar-field input {
  border-color: rgba(148, 163, 184, 0.24);
  background: rgba(15, 23, 42, 0.82);
  color: #f8fafc;
}

.schema-flow,
.schema-grid,
.schema-field-grid {
  display: grid;
  gap: 14px;
}

.schema-flow {
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
  margin: 18px 0;
}

.schema-step,
.schema-panel {
  border: 1px solid rgba(75, 85, 99, 0.14);
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.7);
  box-shadow: 0 16px 38px rgba(15, 23, 42, 0.08);
}

.schema-step {
  padding: 16px;
}

.schema-step strong,
.schema-panel h3 {
  color: var(--color-text);
}

.schema-step span {
  display: inline-grid;
  place-items: center;
  width: 28px;
  height: 28px;
  margin-bottom: 10px;
  border-radius: 999px;
  color: #ffffff;
  background: #2563eb;
  font-weight: 900;
}

.schema-panel {
  padding: 18px;
}

.schema-panel h3 {
  margin: 0 0 12px;
  font-size: 1rem;
}

.schema-field-grid {
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
}

.readonly-field {
  min-height: 70px;
  padding: 12px;
  border: 1px solid rgba(75, 85, 99, 0.16);
  border-radius: 12px;
  background: rgba(248, 250, 252, 0.76);
}

.readonly-field span {
  display: block;
  margin-bottom: 6px;
  color: var(--color-muted);
  font-size: 0.72rem;
  font-weight: 900;
  text-transform: uppercase;
}

.masked-value {
  color: var(--color-text);
  font-weight: 900;
}

.integration-warning {
  margin: 16px 0;
  padding: 14px 16px;
  border: 1px solid rgba(245, 158, 11, 0.28);
  border-radius: 14px;
  color: #92400e;
  background: rgba(254, 243, 199, 0.72);
  font-weight: 800;
}

.disabled-action,
.disabled-action:disabled {
  cursor: not-allowed;
  opacity: 0.68;
}

.theme-dark .schema-step,
.theme-dark .schema-panel {
  border-color: rgba(148, 163, 184, 0.18);
  background: rgba(15, 23, 42, 0.62);
}

.theme-dark .readonly-field {
  border-color: rgba(148, 163, 184, 0.2);
  background: rgba(15, 23, 42, 0.72);
}

.theme-dark .integration-warning {
  color: #fde68a;
  border-color: rgba(251, 191, 36, 0.32);
  background: rgba(113, 63, 18, 0.36);
}

.accessibility-toggle {
  bottom: 58px;
}

.accessibility-panel {
  bottom: 124px;
}

@media (max-width: 1100px) {
  .app-topbar {
    top: 0;
    width: 100%;
    max-width: none;
    height: auto;
  }

  .app-topbar-inner {
    grid-template-columns: 220px minmax(0, 1fr) 190px;
    min-height: 82px;
    padding-inline: 16px;
  }

  .app-nav {
    gap: 6px;
  }

  .nav-icon-button {
    width: 48px;
  }

  .nav-icon-label {
    max-width: 66px;
    font-size: 0.58rem;
  }
}

@media (max-width: 900px) {
  .app-topbar-inner {
    grid-template-columns: 1fr;
    justify-items: center;
    row-gap: 10px;
    padding-block: 10px;
  }

  .app-logo,
  .app-user,
  .app-nav {
    grid-column: 1;
    justify-self: center;
  }

  .app-nav {
    flex-wrap: wrap;
  }

  .dashboard-main {
    margin-top: 190px;
  }
}

@media (max-width: 760px) {
  .app-dock-inner {
    grid-template-columns: 1fr;
    justify-items: center;
    gap: 4px;
    padding: 8px 14px;
  }

  .dock-user,
  .dock-brand,
  .dock-date {
    justify-self: center;
    justify-content: center;
    text-align: center;
  }

  .dashboard-main {
    margin-bottom: calc(var(--dock-height, 40px) + 132px);
  }

  .accessibility-toggle {
    bottom: 92px;
  }

  .accessibility-panel {
    bottom: 158px;
  }
}

/* ==========================================================================
   Apple iOS Style Modal, Switches and Elements
   ========================================================================== */

.ios-modal-backdrop {
  position: fixed;
  inset: 0;
  z-index: 2000;
  display: grid;
  place-items: center;
  padding: 20px;
  background-color: rgba(0, 0, 0, 0.4);
  backdrop-filter: blur(16px) saturate(190%);
  animation: iosFadeIn 250ms ease-out;
}

[hidden] {
  display: none !important;
}

:root.theme-dark .ios-modal-backdrop {
  background-color: rgba(0, 0, 0, 0.65);
}

.ios-modal-sheet {
  width: min(500px, 100%);
  background: var(--color-surface);
  border-radius: 14px;
  border: 1px solid var(--color-border);
  box-shadow: 0 24px 60px rgba(0, 0, 0, 0.15);
  display: flex;
  flex-direction: column;
  overflow: hidden;
  max-height: 90vh;
  animation: iosSlideUp 300ms cubic-bezier(0.16, 1, 0.3, 1);
}

:root.theme-dark .ios-modal-sheet {
  box-shadow: 0 24px 60px rgba(0, 0, 0, 0.45);
}

.ios-modal-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 16px 20px;
  border-bottom: 0.5px solid var(--color-border);
  background: var(--color-surface);
}

.ios-modal-header h2 {
  margin: 0;
  font-size: 1.15rem;
  font-weight: 600;
  color: var(--color-text);
  letter-spacing: -0.3px;
}

.ios-modal-close-btn {
  background: none;
  border: none;
  font-size: 1.6rem;
  line-height: 1;
  cursor: pointer;
  color: var(--color-muted);
  padding: 4px;
  display: grid;
  place-items: center;
  transition: color 150ms;
}

.ios-modal-close-btn:hover {
  color: var(--color-text);
}

.ios-modal-sheet form {
  padding: 20px;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.ios-modal-sheet form > * {
  flex-shrink: 0;
}

.ios-grouped-section {
  background: var(--color-bg);
  border-radius: 10px;
  border: 1px solid var(--color-border);
  overflow: hidden;
  display: flex;
  flex-direction: column;
}

.ios-grouped-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 11px 16px;
  gap: 12px;
  border-bottom: 0.5px solid var(--color-border);
}

.ios-grouped-row:last-child {
  border-bottom: none;
}

.ios-grouped-row label {
  font-size: 0.95rem;
  font-weight: 500;
  color: var(--color-text);
  min-width: 100px;
  flex-shrink: 0;
  text-align: left;
}

.ios-grouped-row input[type="text"],
.ios-grouped-row input[type="email"],
.ios-grouped-row input[type="password"],
.ios-grouped-row select {
  flex: 1;
  border: none;
  background: transparent;
  color: var(--color-text);
  font-size: 0.95rem;
  padding: 4px 0;
  outline: none;
  text-align: right;
  -webkit-appearance: none;
  appearance: none;
}

.ios-grouped-row select {
  cursor: pointer;
  padding-right: 12px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238e8e93' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='8 9 12 13 16 9'%3E%3C/polyline%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right center;
  background-size: 14px;
}

.ios-grouped-row input::placeholder {
  color: var(--color-muted);
  opacity: 0.8;
}

.ios-switch-row {
  min-height: 48px;
  padding-block: 8px;
}

.ios-switch-label-wrap {
  display: flex;
  flex-direction: column;
  gap: 1px;
  text-align: left;
  flex: 1;
}

.ios-switch-title {
  font-size: 0.95rem;
  font-weight: 500;
  color: var(--color-text);
}

.ios-switch-desc {
  font-size: 0.75rem;
  color: var(--color-muted);
}

/* UISwitch Estilização */
.ios-switch {
  position: relative;
  display: inline-block;
  width: 51px;
  height: 31px;
  flex-shrink: 0;
}

.ios-switch input {
  opacity: 0;
  width: 0;
  height: 0;
}

.ios-switch-slider {
  position: absolute;
  cursor: pointer;
  inset: 0;
  background-color: var(--color-surface-muted);
  border-radius: 34px;
  transition: background-color 200ms, border-color 200ms;
  border: 1px solid var(--color-border);
}

.ios-switch-slider::before {
  content: "";
  position: absolute;
  height: 27px;
  width: 27px;
  left: 1px;
  bottom: 1px;
  background-color: white;
  border-radius: 50%;
  transition: transform 200ms cubic-bezier(0.25, 0.8, 0.25, 1);
  box-shadow: 0 3px 8px rgba(0, 0, 0, 0.12), 0 1px 3px rgba(0, 0, 0, 0.04);
}

.ios-switch input:checked + .ios-switch-slider {
  background-color: var(--ui-success-fill);
  border-color: var(--color-success);
}

.ios-switch input:checked + .ios-switch-slider::before {
  transform: translateX(20px);
}

.ios-switch input:disabled + .ios-switch-slider {
  opacity: 0.5;
  cursor: not-allowed;
}

.ios-modal-footer {
  display: flex;
  gap: 12px;
  justify-content: flex-end;
  margin-top: 10px;
}

.ios-btn-primary,
.ios-btn-secondary {
  font-size: 0.95rem;
  font-weight: 600;
  padding: 10px 20px;
  border-radius: 8px;
  border: none;
  cursor: pointer;
  transition: opacity 150ms, background-color 150ms;
}

.ios-btn-primary {
  background-color: var(--ui-accent);
  color: white;
}

.ios-btn-primary:hover:not(:disabled) {
  opacity: 0.9;
}

.ios-btn-primary:disabled {
  opacity: 0.4;
  cursor: not-allowed;
}

.ios-btn-secondary {
  background-color: var(--color-surface-muted);
  color: var(--color-text);
}

.ios-btn-secondary:hover {
  background-color: var(--color-border);
}

/* Toast de Simulação */
.ios-toast {
  position: fixed;
  inset: 0;
  z-index: 3000;
  display: grid;
  place-items: center;
  padding: 20px;
  background-color: rgba(0, 0, 0, 0.5);
  backdrop-filter: blur(8px);
  animation: iosFadeIn 200ms ease-out;
}

.ios-toast-content {
  width: min(420px, 100%);
  background: var(--color-surface);
  border-radius: 14px;
  border: 1px solid var(--color-border);
  padding: 20px;
  display: flex;
  flex-direction: column;
  gap: 14px;
  box-shadow: 0 30px 70px rgba(0, 0, 0, 0.25);
  text-align: center;
  animation: iosScaleUp 250ms cubic-bezier(0.16, 1, 0.3, 1);
}

.ios-toast-content strong {
  font-size: 1.1rem;
  font-weight: 600;
  color: var(--color-text);
}

.ios-toast-content pre {
  text-align: left;
  background: var(--color-bg);
  padding: 12px;
  border-radius: 8px;
  border: 0.5px solid var(--color-border);
  font-family: monospace;
  font-size: 0.82rem;
  overflow-x: auto;
  color: var(--color-text);
  margin: 0;
}

.ios-toast-content .ios-btn-primary.small {
  padding: 8px 16px;
  align-self: center;
}

/* Animações */
@keyframes iosFadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}

@keyframes iosSlideUp {
  from { transform: translateY(30px); opacity: 0; }
  to { transform: translateY(0); opacity: 1; }
}

@keyframes iosScaleUp {
  from { transform: scale(0.95); opacity: 0; }
  to { transform: scale(1); opacity: 1; }
}

/* ==========================================================================
   Apple iOS Style Mobile Drawer & Responsive Sizing Enhancements
   ========================================================================== */

/* Hamburger menu button */
.app-hamburger-menu {
  display: none;
  width: 44px;
  height: 44px;
  place-items: center;
  border: 1px solid rgba(255, 255, 255, 0.58);
  border-radius: 12px;
  color: var(--color-text);
  background: rgba(255, 255, 255, 0.54);
  box-shadow: 0 10px 26px rgba(59, 78, 132, 0.12);
  cursor: pointer;
  transition: transform 160ms ease, background 160ms ease, box-shadow 160ms ease;
}

:root.theme-dark .app-hamburger-menu {
  border-color: rgba(255, 255, 255, 0.12);
  background: rgba(22, 31, 53, 0.72);
  color: #f5f7ff;
}

.app-hamburger-menu:hover,
.app-hamburger-menu:focus-visible {
  background: rgba(231, 240, 255, 0.86);
  box-shadow: 0 14px 34px rgba(78, 115, 255, 0.18);
  transform: scale(1.02);
}

:root.theme-dark .app-hamburger-menu:hover,
:root.theme-dark .app-hamburger-menu:focus-visible {
  background: rgba(42, 58, 94, 0.88);
}

.app-hamburger-menu svg {
  width: 22px;
  height: 22px;
}

/* Mobile drawer backdrop */
.ios-menu-drawer-backdrop {
  position: fixed;
  inset: 0;
  z-index: 2400;
  background: rgba(0, 0, 0, 0.35);
  backdrop-filter: blur(8px);
  opacity: 0;
  pointer-events: none;
  transition: opacity 300ms ease;
}

.ios-menu-drawer-backdrop.is-open {
  opacity: 1;
  pointer-events: auto;
}

/* Mobile drawer */
.ios-menu-drawer {
  position: fixed;
  top: 0;
  left: 0;
  bottom: 0;
  width: min(290px, 85vw);
  z-index: 2500;
  background: var(--color-glass-strong);
  backdrop-filter: blur(28px) saturate(155%);
  border-right: 0.5px solid var(--color-border);
  box-shadow: 0 0 50px rgba(0, 0, 0, 0.18);
  padding: var(--space-4);
  transform: translateX(-100%);
  transition: transform 320ms cubic-bezier(0.16, 1, 0.3, 1);
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
}

:root.theme-dark .ios-menu-drawer {
  background: rgba(24, 35, 60, 0.94);
  box-shadow: 0 0 50px rgba(0, 0, 0, 0.45);
}

.ios-menu-drawer.is-open {
  transform: translateX(0);
}

.ios-drawer-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-bottom: var(--space-3);
  border-bottom: 0.5px solid var(--color-border);
}

.ios-drawer-close-btn {
  background: none;
  border: none;
  color: var(--color-muted);
  cursor: pointer;
  padding: var(--space-2);
  display: grid;
  place-items: center;
  border-radius: 999px;
  transition: background 150ms, color 150ms;
}

.ios-drawer-close-btn:hover {
  color: var(--color-text);
  background: rgba(0, 0, 0, 0.05);
}

:root.theme-dark .ios-drawer-close-btn:hover {
  background: rgba(255, 255, 255, 0.08);
}

.ios-drawer-nav {
  flex: 1;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
  padding-right: var(--space-1);
}

/* Accordion item style inside drawer */
.ios-drawer-item-container {
  display: flex;
  flex-direction: column;
  border-bottom: 0.5px solid var(--color-border);
  padding-bottom: var(--space-2);
}

.ios-drawer-accordion-btn {
  width: 100%;
  background: none;
  border: none;
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 8px;
  cursor: pointer;
  text-align: left;
  border-radius: 10px;
  transition: background-color 150ms;
}

.ios-drawer-accordion-btn:hover,
.ios-drawer-accordion-btn:focus-visible {
  background-color: rgba(78, 115, 255, 0.08);
}

.ios-drawer-item-icon-wrap {
  display: grid;
  place-items: center;
  width: 32px;
  height: 32px;
  border-radius: 8px;
  background: rgba(15, 98, 254, 0.08);
}

:root.theme-dark .ios-drawer-item-icon-wrap {
  background: rgba(110, 139, 255, 0.12);
}

.ios-drawer-item-icon-wrap img {
  width: 18px;
  height: 18px;
}

.ios-drawer-item-text {
  flex: 1;
  font-weight: 600;
  font-size: 0.95rem;
  color: var(--color-text);
}

.ios-drawer-item-chevron {
  color: var(--color-muted);
  transition: transform 250ms ease;
  display: flex;
  align-items: center;
}

.ios-drawer-accordion-btn[aria-expanded="true"] .ios-drawer-item-chevron {
  transform: rotate(90deg);
}

/* Submenu items list */
.ios-drawer-submenu-list {
  display: grid;
  grid-template-rows: 0fr;
  transition: grid-template-rows 250ms ease, padding 250ms ease;
  overflow: hidden;
  padding-left: 44px;
}

.ios-drawer-submenu-list.is-open {
  grid-template-rows: 1fr;
  padding-top: var(--space-1);
  padding-bottom: var(--space-2);
}

.ios-drawer-submenu-link {
  min-height: 36px;
  display: flex;
  align-items: center;
  color: var(--color-muted);
  text-decoration: none;
  font-size: 0.88rem;
  font-weight: 500;
  border-radius: 6px;
  padding: 0 10px;
  transition: color 150ms, background-color 150ms;
}

.ios-drawer-submenu-link:hover,
.ios-drawer-submenu-link:focus-visible {
  color: var(--color-primary-strong);
  background-color: rgba(78, 115, 255, 0.06);
}

.ios-drawer-submenu-link.is-active {
  color: var(--color-primary-strong);
  font-weight: 700;
  background-color: rgba(78, 115, 255, 0.10);
}

/* Media query updates */
@media (max-width: 900px) {
  .app-hamburger-menu {
    display: inline-grid;
  }
  .app-topbar-inner {
    gap: 16px;
    padding: var(--space-2) 0;
  }
  .app-logo img {
    height: 36px;
    width: auto;
  }
  .app-page.has-topbar {
    padding-top: 100px;
  }
  .app-main {
    padding-top: var(--space-4);
  }
}

@media (max-width: 600px) {
  .app-topbar {
    padding: 8px 16px;
  }
  .app-user-meta {
    display: none; /* Hide role and name to save space on mobile */
  }
  .topbar-actions {
    gap: 6px;
  }
  .topbar-action {
    width: 38px;
    height: 38px;
  }
  .app-logo img {
    height: 32px;
  }
}

/* theme-dim overrides to support 1/2 Dark theme */
:root.theme-dim body:not(.login-screen) {
  background:
    radial-gradient(ellipse at 12% 8%, rgba(99, 102, 241, 0.14), transparent 34rem),
    radial-gradient(ellipse at 88% 12%, rgba(129, 140, 248, 0.10), transparent 28rem),
    linear-gradient(135deg, #242730 0%, #2d3139 52%, #353a44 100%);
}

:root.theme-dim body:not(.login-screen)::before {
  background:
    linear-gradient(156deg, transparent 0 45%, rgba(255, 255, 255, 0.04) 45.2% 57%, transparent 57.2%),
    radial-gradient(circle at 50% 105%, rgba(99, 102, 241, 0.10), transparent 34rem);
}

:root.theme-dark .app-page::before {
  background: linear-gradient(135deg, rgba(22, 31, 53, 0.42), rgba(78, 115, 255, 0.06) 48%, rgba(111, 76, 255, 0.08));
}

:root.theme-dim .app-page::before {
  background: linear-gradient(135deg, rgba(58, 63, 75, 0.42), rgba(99, 102, 241, 0.06) 48%, rgba(129, 140, 248, 0.08));
}

:root.theme-dim .app-topbar {
  border-bottom-color: rgba(255, 255, 255, 0.08);
  background: rgba(45, 49, 57, 0.72);
  box-shadow: 0 18px 48px rgba(0, 0, 0, 0.20);
}

:root.theme-dim .nav-icon-button:hover,
:root.theme-dim .nav-icon-button:focus-visible,
:root.theme-dim .nav-icon-button[aria-current="page"],
:root.theme-dim .menu-cluster.is-open .nav-icon-button {
  border-color: rgba(129, 140, 248, 0.42) !important;
  background: rgba(77, 84, 100, 0.82) !important;
  box-shadow: 0 18px 42px rgba(0, 0, 0, 0.24) !important;
}

:root.theme-dim .app-card,
:root.theme-dim .data-panel,
:root.theme-dim .kpi-card,
:root.theme-dim .daily-summary,
:root.theme-dim .dashboard-hero-card {
  border-color: rgba(255, 255, 255, 0.08);
  background-color: rgba(45, 49, 57, 0.85);
  background:
    radial-gradient(circle at 88% 18%, rgba(99, 102, 241, 0.16), transparent 17rem),
    linear-gradient(145deg, rgba(58, 63, 75, 0.90), rgba(45, 49, 57, 0.75));
  box-shadow: 0 24px 70px rgba(0, 0, 0, 0.22);
  color: #f3f4f6;
}

:root.theme-dim .app-card p,
:root.theme-dim .data-panel p,
:root.theme-dim .kpi-card p,
:root.theme-dim .daily-summary p,
:root.theme-dim .dashboard-hero-card p {
  color: #e5e7eb;
}

:root.theme-dim .readonly-field span,
:root.theme-dim label span {
  color: var(--ui-label-2);
}

:root.theme-dim .placeholder-table th {
  color: #f3f4f6;
  border-bottom-color: rgba(255, 255, 255, 0.08);
  font-weight: 700;
}

:root.theme-dim .placeholder-table td {
  color: #e5e7eb;
  border-bottom-color: rgba(255, 255, 255, 0.08);
}

:root.theme-dim .nav-icon-label {
  color: rgba(243, 244, 246, 0.82);
}

/* Brand logo backlight glow overrides for 1/2 Dark */
:root.theme-dim .brand-logo--glow::before {
  inset: -20px -30px;
  background:
    radial-gradient(circle at 32% 48%, rgba(210, 230, 255, 0.45), transparent 58%),
    radial-gradient(circle at 62% 52%, rgba(70, 115, 255, 0.65), transparent 68%);
  filter: blur(24px);
  opacity: 0.9;
}

:root.theme-dim .app-topbar .brand-logo--glow::before {
  inset: -24px -36px;
  background:
    radial-gradient(circle at 31% 48%, rgba(210, 230, 255, 0.52), transparent 58%),
    radial-gradient(circle at 64% 52%, rgba(70, 115, 255, 0.72), transparent 70%);
  filter: blur(28px);
}

/* Additional overrides for 1/2 Dark (theme-dim) and theme-dark legibility */
:root.theme-dim .readonly-field,
:root.theme-dark .readonly-field {
  border-color: rgba(255, 255, 255, 0.12);
  background: rgba(45, 49, 57, 0.50);
}

:root.theme-dim .app-button-secondary,
:root.theme-dark .app-button-secondary {
  color: #ffffff;
  background: rgba(255, 255, 255, 0.08);
  border-color: rgba(255, 255, 255, 0.16);
}

:root.theme-dim .app-button-secondary:hover,
:root.theme-dark .app-button-secondary:hover {
  background: rgba(255, 255, 255, 0.16);
}

:root.theme-dim input,
:root.theme-dim select,
:root.theme-dim textarea,
:root.theme-dark input,
:root.theme-dark select,
:root.theme-dark textarea {
  background-color: rgba(255, 255, 255, 0.06);
  color: #ffffff;
  border-color: rgba(255, 255, 255, 0.14);
}

:root.theme-dim .schema-panel,
:root.theme-dark .schema-panel {
  border-color: rgba(255, 255, 255, 0.08);
  background: rgba(58, 63, 75, 0.62);
}




/* ==========================================
   AJUSTES DE TABELA (DIVISÓRIAS SUAVES) E LAYOUT OVERFLOW
   ========================================== */
.placeholder-table th,
.placeholder-table td,
table.placeholder-table tr td,
table.placeholder-table tr th {
  border-bottom: 1px solid rgba(0, 0, 0, 0.09);
}

:root.theme-dark .placeholder-table th,
:root.theme-dark .placeholder-table td,
:root.theme-dark table.placeholder-table tr td,
:root.theme-dark table.placeholder-table tr th,
:root.theme-dim .placeholder-table th,
:root.theme-dim .placeholder-table td,
:root.theme-dim table.placeholder-table tr td,
:root.theme-dim table.placeholder-table tr th {
  border-bottom: 1px solid rgba(255, 255, 255, 0.15);
}

/* Prevenção de estouro de campos em filtros de busca */
.readonly-field,
.filter-item,
.filter-group,
.ios-filter-box,
.schema-field-grid label {
  max-width: 100%;
  overflow: hidden !important;
}

.readonly-field input,
.readonly-field select,
.readonly-field textarea,
.filter-item input,
.filter-item select,
.filter-group input,
.filter-group select,
input[type="text"],
input[type="search"],
input[type="email"],
select {
  box-sizing: border-box;
  width: 100% !important;
  text-overflow: ellipsis;
}





/* ==========================================================================
   DARK AND DIM THEME INPUT FOCUS AND AUTOFILL FIX
   ========================================================================== */
:root.theme-dim input:focus,
:root.theme-dim select:focus,
:root.theme-dim textarea:focus,
:root.theme-dark input:focus,
:root.theme-dark select:focus,
:root.theme-dark textarea:focus {
  background-color: rgba(15, 23, 42, 0.9);
  color: #ffffff;
  border-color: #007aff;
}

:root.theme-dim input:-webkit-autofill,
:root.theme-dark input:-webkit-autofill {
  -webkit-text-fill-color: #ffffff;
  transition: background-color 5000s ease-in-out 0s;
  -webkit-box-shadow: 0 0 0px 1000px rgba(15, 23, 42, 0.9) inset;
}

.ios-modal-sheet-large {
  width: 96%;
  max-width: 1350px;
}

/* Smart3Lab: camada final contra regressao por regras legadas. */
.app-topbar{height:72px;border-radius:0;background:rgba(255,255,255,.96);box-shadow:none}
.app-topbar-inner{min-height:72px}
.app-card,.data-panel,.kpi-card,.daily-summary,.dashboard-hero-card{border-color:#e7eaed;border-radius:18px;background:#fff;box-shadow:var(--smart-shadow);backdrop-filter:none}
.table-scroll,.table-responsive,.app-card:has(> table),.data-panel:has(> table){max-width:100%!important;overflow-x:auto!important;overscroll-behavior-inline:contain;scrollbar-gutter:stable}
[class*="table-wrapper"]{overflow-x:auto;overscroll-behavior-inline:contain;scrollbar-gutter:stable}
.placeholder-table,.agenda-dia-table,.data-panel table,.app-card table{width:100%;min-width:max-content;border-collapse:separate;border-spacing:0}
.placeholder-table thead th,.data-panel table thead th,.app-card table thead th{position:sticky;top:0;z-index:2;color:#536371;background:#f4f5f6;border-bottom:1px solid #dfe4e8}

/* Smart3Lab: tres niveis de tema e maior presenca das fotos no login. */

:root.theme-dim{--smart-bg:#303841;--smart-surface:#3a4550;--smart-surface-muted:#424e5a;--smart-text:#f3f6f8;--smart-muted:#c1cbd2;--smart-primary:#67b0cf;--smart-primary-strong:#8bc7df;--smart-primary-soft:#465a67;--smart-border:#52606c;--smart-border-strong:#71808c;--color-text:var(--smart-text);--color-muted:var(--smart-muted);--color-primary:var(--smart-primary);--color-primary-strong:var(--smart-primary-strong);--color-border:var(--smart-border)}
:root.theme-dim body:not(.login-screen){background:var(--smart-bg);color:var(--smart-text)}
:root.theme-dim .app-topbar{border-bottom-color:#4b5965;background:rgba(52,63,73,.97)}
:root.theme-dim .profile-popover,:root.theme-dim .agenda-ios-card{box-shadow:0 12px 34px rgba(0,0,0,.18)}
:root.theme-dim .app-card,:root.theme-dim .data-panel,:root.theme-dim .kpi-card,:root.theme-dim .daily-summary,:root.theme-dim .dashboard-hero-card,:root.theme-dim .accessibility-panel,:root.theme-dim .menu-dropdown,:root.theme-dim .ios-calendar-widget{border-color:var(--smart-border);background:var(--smart-surface);box-shadow:0 12px 34px rgba(0,0,0,.18)}
:root.theme-dim .app-user-name,:root.theme-dim .section-title,:root.theme-dim .page-title,:root.theme-dim .dashboard-title{color:var(--smart-text)!important}
:root.theme-dim .nav-icon-label{color:var(--smart-text)}
:root.theme-dim .topbar-action,:root.theme-dim .app-button-secondary,:root.theme-dim input:not([type="checkbox"]):not([type="radio"]),:root.theme-dim select,:root.theme-dim textarea{border-color:var(--smart-border-strong);background:var(--smart-surface-muted);color:var(--smart-text)}
:root.theme-dim .placeholder-table th,:root.theme-dim .data-panel table thead th,:root.theme-dim .app-card table thead th{color:#d2dbe1;background:#46525e;border-bottom-color:#5b6873}
:root.theme-dim .placeholder-table td,:root.theme-dim .data-panel table td,:root.theme-dim .app-card table td{color:var(--smart-text);background:var(--smart-surface);border-bottom-color:#4c5964}

:root.theme-dark{--smart-bg:#0d141b;--smart-surface:#151f28;--smart-surface-muted:#1d2a34;--smart-text:#f4f7f9;--smart-muted:#aab8c2;--smart-primary:#65b4d4;--smart-primary-strong:#91cee5;--smart-primary-soft:#203b49;--smart-border:#2b3b47;--smart-border-strong:#526672;--color-text:var(--smart-text);--color-muted:var(--smart-muted);--color-primary:var(--smart-primary);--color-primary-strong:var(--smart-primary-strong);--color-border:var(--smart-border)}
:root.theme-dark body:not(.login-screen){background:var(--smart-bg);color:var(--smart-text)}
:root.theme-dark .app-topbar{border-bottom-color:#263641;background:rgba(16,25,33,.98)}
:root.theme-dark .app-card,:root.theme-dark .data-panel,:root.theme-dark .kpi-card,:root.theme-dark .daily-summary,:root.theme-dark .dashboard-hero-card,:root.theme-dark .accessibility-panel,:root.theme-dark .menu-dropdown,:root.theme-dark .ios-calendar-widget{border-color:var(--smart-border);background:var(--smart-surface);box-shadow:none}
:root.theme-dark .app-user-name,:root.theme-dark .section-title,:root.theme-dark .page-title,:root.theme-dark .dashboard-title{color:var(--smart-text)!important}
:root.theme-dark .nav-icon-label{color:var(--smart-text)}
:root.theme-dark .topbar-action,:root.theme-dark .app-button-secondary,:root.theme-dark input:not([type="checkbox"]):not([type="radio"]),:root.theme-dark select,:root.theme-dark textarea{border-color:var(--smart-border-strong);background:var(--smart-surface-muted);color:var(--smart-text)}

/* Agenda (.purchase-link-*): movido para op-agenda-novo.css (R9 W3-B). */

/* Login responsivo: todo o conteúdo funcional em uma única tela. */
:root.theme-dark .placeholder-table th,:root.theme-dark .data-panel table thead th,:root.theme-dark .app-card table thead th{color:#cbd6dd;background:#1d2a34;border-bottom-color:#354651}
:root.theme-dark .placeholder-table td,:root.theme-dark .data-panel table td,:root.theme-dark .app-card table td{color:var(--smart-text);background:var(--smart-surface);border-bottom-color:#2a3944}

/* Smart3Lab: alinhamento definitivo do menu superior com todos os modulos. */
.app-hamburger-menu{grid-row:1}
.app-logo{grid-row:1}
.app-logo img{height:46px}
.app-nav{grid-column:2;grid-row:1;width:100%;gap:1px}
.app-user{grid-column:3;grid-row:1}
.nav-icon-label{font-size:.72rem}
@media(max-width:1100px){.app-hamburger-menu{grid-column:1}.app-logo{grid-column:2;justify-self:start}}

/* Regra final do login: remove alturas legadas que geravam rolagem. */

/* O painel permanece integralmente acessível sem devolver rolagem à página. */
.accessibility-panel{max-height:calc(100dvh - 156px);overflow-y:auto;overscroll-behavior:contain;scrollbar-gutter:stable}
:root[data-contrast="high"] body{background:#05070a;color:#fff}

/* Menu principal: ícone destacado com o nome centralizado abaixo. */
.app-topbar-inner{gap:8px}
.app-logo{max-width:178px}
.app-logo img{width:170px;max-width:170px}
.app-nav{align-items:stretch}
.menu-cluster{display:flex;flex-direction:column;justify-content:center;padding:3px}
.nav-icon-label{max-width:74px;min-height:12px;font-size:calc(.62rem * var(--menu-font-scale,1));line-height:1.05}
:root[data-menu-names="off"] .nav-icon-label{display:none}

/* Login consolidado: cartão compacto, sem áreas vazias ou regras concorrentes. */

/* Marca no menu: contraste consistente sobre os três temas. */
.app-topbar-inner{grid-template-columns:206px minmax(0,1fr) 150px}
.app-topbar .app-logo{width:190px!important;max-width:190px;padding:2px 11px;justify-content:center;border-radius:13px;overflow:hidden}
.app-topbar .app-logo img{max-width:166px;height:58px}
@media(max-width:1100px){.app-topbar-inner{grid-template-columns:auto minmax(0,1fr) auto!important}}
}

@layer legacy-imp {
body:not(.login-screen), :root.theme-dim body:not(.login-screen) { background: var(--smart-bg); }
.app-page.has-topbar { padding-top: var(--topbar-height); }
.app-topbar { border: 0; border-bottom: 1px solid #e5e8eb; border-radius: 0; background: rgba(255, 255, 255, 0.96); box-shadow: none; }
.nav-icon-label { color: var(--smart-text); font-size: 0.77rem; font-weight: 650; }
.topbar-action { border: 1px solid var(--smart-border); background: #ffffff; }
.topbar-action:hover, .topbar-action:focus-visible { background: var(--smart-primary-soft); }
.accessibility-panel { border: 1px solid var(--smart-border); border-radius: 18px; background: #ffffff; box-shadow: 0 20px 48px rgba(23, 35, 45, 0.14); }
.app-card, .data-panel, .kpi-card, .daily-summary, .dashboard-hero-card, .ios-calendar-widget { border: 1px solid #e7eaed; border-radius: 18px; background: #ffffff; box-shadow: var(--smart-shadow); backdrop-filter: none; }
.kpi-card { border-left-width: 4px; }
.app-button, .app-button-secondary, .app-button-danger { box-shadow: none; }
.app-button { border-color: var(--smart-primary); background: var(--smart-primary); }
.app-button:hover, .app-button:focus-visible { background: var(--smart-primary-strong); }
.app-button-secondary { border-color: var(--smart-border); background: #ffffff; }
.app-button-secondary:hover, .app-button-secondary:focus-visible { border-color: var(--smart-border-strong); background: var(--smart-surface-muted); }
input:not([type="checkbox"]):not([type="radio"]), select, textarea, .field-group input { border: 1px solid var(--smart-border-strong); border-radius: 11px; color: var(--smart-text); background: #ffffff; box-shadow: none; }
input:not([type="checkbox"]):not([type="radio"]):focus, select:focus, textarea:focus { border-color: var(--smart-primary); box-shadow: 0 0 0 3px rgba(31, 117, 153, 0.12); }
.placeholder-table th { padding: 12px 14px; color: #536371; background: #f4f5f6; border-bottom: 1px solid #dfe4e8; }
.placeholder-table td { padding: 12px 14px; color: var(--smart-text); border-bottom: 1px solid #eceff1; }
:root.theme-dark body:not(.login-screen) { background: var(--smart-bg); }
:root.theme-dark .app-topbar, :root.theme-dark .app-card, :root.theme-dark .data-panel, :root.theme-dark .kpi-card, :root.theme-dark .dashboard-hero-card, :root.theme-dark .daily-summary, :root.theme-dark .accessibility-panel, :root.theme-dark .menu-dropdown { border-color: var(--smart-border); background: var(--smart-surface); box-shadow: none; }
:root.theme-dark input:not([type="checkbox"]):not([type="radio"]), :root.theme-dark select, :root.theme-dark textarea, :root.theme-dark .app-button-secondary, :root.theme-dim input:not([type="checkbox"]):not([type="radio"]), :root.theme-dim select, :root.theme-dim textarea { color: var(--smart-text); border-color: var(--smart-border-strong); background: var(--smart-surface); }
:root.theme-dark .placeholder-table th { color: var(--smart-muted); background: var(--smart-surface-muted); }
:root.theme-dark .placeholder-table td { color: var(--smart-text); background: var(--smart-surface); }
@media (max-width: 1220px) {
.nav-icon-label { font-size: 0.7rem; }
}
@media (max-width: 960px) {
.app-page.has-topbar { padding-top: 66px; }
}
:root.theme-dim body:not(.login-screen) { background: radial-gradient(ellipse at 12% 8%, rgba(99, 102, 241, 0.14), transparent 34rem),
    radial-gradient(ellipse at 88% 12%, rgba(129, 140, 248, 0.10), transparent 28rem),
    linear-gradient(135deg, #242730 0%, #2d3139 52%, #353a44 100%); }
:root.theme-dim body:not(.login-screen)::before { background: linear-gradient(156deg, transparent 0 45%, rgba(255, 255, 255, 0.04) 45.2% 57%, transparent 57.2%),
    radial-gradient(circle at 50% 105%, rgba(99, 102, 241, 0.10), transparent 34rem); }
:root.theme-dark .app-page::before { background: linear-gradient(135deg, rgba(22, 31, 53, 0.42), rgba(78, 115, 255, 0.06) 48%, rgba(111, 76, 255, 0.08)); }
:root.theme-dim .app-page::before { background: linear-gradient(135deg, rgba(58, 63, 75, 0.42), rgba(99, 102, 241, 0.06) 48%, rgba(129, 140, 248, 0.08)); }
:root.theme-dim .app-topbar { border-bottom-color: rgba(255, 255, 255, 0.08); background: rgba(45, 49, 57, 0.72); box-shadow: 0 18px 48px rgba(0, 0, 0, 0.20); }
:root.theme-dim .app-card, :root.theme-dim .data-panel, :root.theme-dim .kpi-card, :root.theme-dim .daily-summary, :root.theme-dim .dashboard-hero-card { border-color: rgba(255, 255, 255, 0.08); background-color: rgba(45, 49, 57, 0.85); background: radial-gradient(circle at 88% 18%, rgba(99, 102, 241, 0.16), transparent 17rem),
    linear-gradient(145deg, rgba(58, 63, 75, 0.90), rgba(45, 49, 57, 0.75)); box-shadow: 0 24px 70px rgba(0, 0, 0, 0.22); color: #f3f4f6; }
:root.theme-dim .app-card p, :root.theme-dim .data-panel p, :root.theme-dim .kpi-card p, :root.theme-dim .daily-summary p, :root.theme-dim .dashboard-hero-card p { color: #e5e7eb; }
:root.theme-dim .readonly-field span, :root.theme-dim label span { color: var(--ui-label-2); }
:root.theme-dim .placeholder-table th { color: #f3f4f6; border-bottom-color: rgba(255, 255, 255, 0.08); font-weight: 700; }
:root.theme-dim .placeholder-table td { color: #e5e7eb; border-bottom-color: rgba(255, 255, 255, 0.08); }
:root.theme-dim .nav-icon-label { color: rgba(243, 244, 246, 0.82); }
:root.theme-dim .readonly-field, :root.theme-dark .readonly-field { border-color: rgba(255, 255, 255, 0.12); background: rgba(45, 49, 57, 0.50); }
:root.theme-dim .app-button-secondary, :root.theme-dark .app-button-secondary { color: #ffffff; background: rgba(255, 255, 255, 0.08); border-color: rgba(255, 255, 255, 0.16); }
:root.theme-dim .app-button-secondary:hover, :root.theme-dark .app-button-secondary:hover { background: rgba(255, 255, 255, 0.16); }
:root.theme-dim input, :root.theme-dim select, :root.theme-dim textarea, :root.theme-dark input, :root.theme-dark select, :root.theme-dark textarea { background-color: rgba(255, 255, 255, 0.06); color: #ffffff; border-color: rgba(255, 255, 255, 0.14); }
:root.theme-dim .schema-panel, :root.theme-dark .schema-panel { border-color: rgba(255, 255, 255, 0.08); background: rgba(58, 63, 75, 0.62); }
.placeholder-table th, .placeholder-table td, table.placeholder-table tr td, table.placeholder-table tr th { border-bottom: 1px solid rgba(0, 0, 0, 0.09); }
:root.theme-dark .placeholder-table th, :root.theme-dark .placeholder-table td, :root.theme-dark table.placeholder-table tr td, :root.theme-dark table.placeholder-table tr th, :root.theme-dim .placeholder-table th, :root.theme-dim .placeholder-table td, :root.theme-dim table.placeholder-table tr td, :root.theme-dim table.placeholder-table tr th { border-bottom: 1px solid rgba(255, 255, 255, 0.15); }
.readonly-field input, .readonly-field select, .readonly-field textarea, .filter-item input, .filter-item select, .filter-group input, .filter-group select, input[type="text"], input[type="search"], input[type="email"], select { box-sizing: border-box; }
:root.theme-dim input:focus, :root.theme-dim select:focus, :root.theme-dim textarea:focus, :root.theme-dark input:focus, :root.theme-dark select:focus, :root.theme-dark textarea:focus { background-color: rgba(15, 23, 42, 0.9); color: #ffffff; border-color: #007aff; }
:root.theme-dim input:-webkit-autofill, :root.theme-dark input:-webkit-autofill { -webkit-text-fill-color: #ffffff; -webkit-box-shadow: 0 0 0px 1000px rgba(15, 23, 42, 0.9) inset; }
.ios-modal-sheet-large { width: 96%; max-width: 1350px; }
.app-topbar { height: 72px; border-radius: 0; background: rgba(255,255,255,.96); box-shadow: none; }
.app-card, .data-panel, .kpi-card, .daily-summary, .dashboard-hero-card { border-color: #e7eaed; border-radius: 18px; background: #fff; box-shadow: var(--smart-shadow); backdrop-filter: none; }
[class*="table-wrapper"] { overflow-x: auto; }
.placeholder-table thead th, .data-panel table thead th, .app-card table thead th { color: #536371; background: #f4f5f6; border-bottom: 1px solid #dfe4e8; }
:root.theme-dim body:not(.login-screen) { background: var(--smart-bg); color: var(--smart-text); }
:root.theme-dim .app-topbar { border-bottom-color: #4b5965; background: rgba(52,63,73,.97); }
:root.theme-dim .app-card, :root.theme-dim .data-panel, :root.theme-dim .kpi-card, :root.theme-dim .daily-summary, :root.theme-dim .dashboard-hero-card, :root.theme-dim .accessibility-panel, :root.theme-dim .menu-dropdown, :root.theme-dim .ios-calendar-widget { border-color: var(--smart-border); background: var(--smart-surface); box-shadow: 0 12px 34px rgba(0,0,0,.18); }
:root.theme-dim .nav-icon-label { color: var(--smart-text); }
:root.theme-dim .topbar-action, :root.theme-dim .app-button-secondary, :root.theme-dim input:not([type="checkbox"]):not([type="radio"]), :root.theme-dim select, :root.theme-dim textarea { border-color: var(--smart-border-strong); background: var(--smart-surface-muted); color: var(--smart-text); }
:root.theme-dim .placeholder-table th, :root.theme-dim .data-panel table thead th, :root.theme-dim .app-card table thead th { color: #d2dbe1; background: #46525e; border-bottom-color: #5b6873; }
:root.theme-dim .placeholder-table td, :root.theme-dim .data-panel table td, :root.theme-dim .app-card table td { color: var(--smart-text); background: var(--smart-surface); border-bottom-color: #4c5964; }
:root.theme-dark body:not(.login-screen) { background: var(--smart-bg); color: var(--smart-text); }
:root.theme-dark .app-topbar { border-bottom-color: #263641; background: rgba(16,25,33,.98); }
:root.theme-dark .app-card, :root.theme-dark .data-panel, :root.theme-dark .kpi-card, :root.theme-dark .daily-summary, :root.theme-dark .dashboard-hero-card, :root.theme-dark .accessibility-panel, :root.theme-dark .menu-dropdown, :root.theme-dark .ios-calendar-widget { border-color: var(--smart-border); background: var(--smart-surface); box-shadow: none; }
:root.theme-dark .nav-icon-label { color: var(--smart-text); }
:root.theme-dark .topbar-action, :root.theme-dark .app-button-secondary, :root.theme-dark input:not([type="checkbox"]):not([type="radio"]), :root.theme-dark select, :root.theme-dark textarea { border-color: var(--smart-border-strong); background: var(--smart-surface-muted); color: var(--smart-text); }
:root.theme-dark .placeholder-table th, :root.theme-dark .data-panel table thead th, :root.theme-dark .app-card table thead th { color: #cbd6dd; background: #1d2a34; border-bottom-color: #354651; }
:root.theme-dark .placeholder-table td, :root.theme-dark .data-panel table td, :root.theme-dark .app-card table td { color: var(--smart-text); background: var(--smart-surface); border-bottom-color: #2a3944; }
.nav-icon-label { font-size: .72rem; }
:root[data-contrast="high"] body { background: #05070a; color: #fff; }
.nav-icon-label { font-size: calc(.62rem * var(--menu-font-scale,1)); line-height: 1.05; }/* R10 L2: declarações que eram !important na camada legacy e só precisam vencer o restante do legado. */
.app-main, .dashboard-main { margin-top: 0; }
.nav-icon-button { border: 0; border-radius: 7px; color: var(--smart-muted); background: transparent; box-shadow: none; transform: none; }
.nav-icon-label { opacity: 1; }
.accessibility-panel { backdrop-filter: none; }
:root.theme-dim .nav-icon-button { border-color: rgba(255, 255, 255, 0.08); color: #f3f4f6; background: rgba(58, 63, 75, 0.68); box-shadow: 0 12px 30px rgba(0, 0, 0, 0.18); }
.app-topbar .app-logo img { filter: none; }
}

@layer ui-bridge {
/* R10 L2: declarações que eram !important na camada legacy e precisam vencer a ponte (ui-bridge do crm-ui.css). */
.menu-cluster:has(.nav-icon-button[aria-current="page"]) .nav-icon-label, .menu-cluster.is-open .nav-icon-label { color: var(--smart-primary-strong); }
.topbar-action[aria-expanded="true"] { background: var(--smart-primary-soft); }
.profile-popover { border: 1px solid var(--smart-border); }
:root.theme-dark .profile-popover { background: var(--smart-surface); }
:root.theme-dim .profile-popover, :root.theme-dim .agenda-ios-card { background: var(--smart-surface); color: var(--smart-text); }
:root.theme-dark .profile-popover, :root.theme-dark .agenda-ios-card { color: var(--smart-text); }
}

@layer ui-components {
/* R10 L2: declarações que eram !important na camada legacy e precisam vencer os componentes (ui-components do crm-ui.css). */
:root.theme-dim .brand-logo--glow img { filter: drop-shadow(0 0 12px rgba(210, 230, 255, 0.42))
    drop-shadow(0 0 24px rgba(70, 115, 255, 0.46)); }
:root.theme-dim .app-topbar .brand-logo--glow img { filter: drop-shadow(0 0 10px rgba(230, 242, 255, 0.46))
    drop-shadow(0 0 24px rgba(70, 115, 255, 0.52))
    drop-shadow(0 0 42px rgba(70, 115, 255, 0.28)); }
.readonly-field input, .readonly-field select, .readonly-field textarea, .filter-item input, .filter-item select, .filter-group input, .filter-group select, input[type="text"], input[type="search"], input[type="email"], select { max-width: 100%; }
:root.theme-dim .app-card, :root.theme-dim .data-panel, :root.theme-dim .kpi-card, :root.theme-dim .daily-summary, :root.theme-dim .dashboard-hero-card, :root.theme-dim .accessibility-panel, :root.theme-dim .menu-dropdown, :root.theme-dim .ios-calendar-widget { color: var(--smart-text); }
:root.theme-dark .app-card, :root.theme-dark .data-panel, :root.theme-dark .kpi-card, :root.theme-dark .daily-summary, :root.theme-dark .dashboard-hero-card, :root.theme-dark .accessibility-panel, :root.theme-dark .menu-dropdown, :root.theme-dark .ios-calendar-widget { color: var(--smart-text); }
}
