:root {
  --ci-body-bg: #eef2f7;
  --ci-body-bg-soft: rgba(255, 255, 255, 0.78);
  --ci-surface: #ffffff;
  --ci-surface-soft: rgba(255, 255, 255, 0.84);
  --ci-surface-alt: #f5f7fb;
  --ci-surface-strong: #e8edf5;
  --ci-text: #1f2937;
  --ci-text-muted: #64748b;
  --ci-text-contrast: #ffffff;
  --ci-link-color: #0f4bbd;
  --ci-link-hover: #aa2e25;
  --ci-border: rgba(15, 23, 42, 0.12);
  --ci-border-strong: rgba(15, 23, 42, 0.18);
  --ci-shadow-soft: 0 5px 16px rgba(15, 23, 42, 0.06);
  --ci-shadow: 0 12px 30px rgba(15, 23, 42, 0.11);
  --ci-shadow-strong: 0 18px 40px rgba(15, 23, 42, 0.16);
  --ci-header-bg: rgba(255, 255, 255, 0.86);
  --ci-header-text: #475569;
  --ci-header-muted: #64748b;
  --ci-header-border: rgba(148, 163, 184, 0.22);
  --ci-panel-bg: rgba(255, 255, 255, 0.5);
  --ci-panel-border: rgba(255, 255, 255, 0.38);
  --ci-help-bg: #f4efc6;
  --ci-help-text: #444444;
  --ci-help-border: #666699;
  --ci-striped-bg: #f6f8fb;
  --ci-cabine-text: #ffffff;
  --ci-cabine-display-bg: #ffffff;
  --ci-cabine-display-fg: #1f2937;
  --ci-card-title: #1f2937;
  --ci-card-subtitle: #6b7280;
  --ci-top-accent: rgba(13, 110, 253, 0.16);
  --ci-overlay-bg: rgba(2, 6, 23, 0.55);
  --ci-theme-chip-bg: rgba(13, 110, 253, 0.08);
  --ci-theme-chip-border: rgba(13, 110, 253, 0.16);
  --ci-theme-chip-active-bg: linear-gradient(
    135deg,
    rgba(13, 110, 253, 0.14),
    rgba(13, 110, 253, 0.28)
  );
  --ci-theme-chip-active-border: rgba(13, 110, 253, 0.44);
  --ci-body-image-overlay: rgba(255, 255, 255, 0);
  --ci-img-filter-panel: none;
  --ci-img-filter-soft: none;
  --ci-alert-fg: #7c2d12;
  --ci-alert-bg: rgba(255, 251, 235, 0.9);
  --ci-alert-border: rgba(245, 158, 11, 0.22);
  --ci-equip-bg-url: #dddfdd;
  --ci-equip-bg-neutral: #dddddd;
  --ci-equip-bg-active: #adddbd;
  --ci-equip-bg-sensor: #adbded;
  --ci-equip-bg-processing: #ffffff;
  --ci-equip-text: #222222;
  --ci-equip-text-action: #229922;
  --ci-equip-text-sensor: #000066;
  --ci-equip-link: #006600;
  --ci-equip-alert: #990000;
  --ci-equip-border: rgba(15, 23, 42, 0.16);
  --ci-equip-shadow: 0 3px 10px rgba(15, 23, 42, 0.1);
  --ci-sensor-display-on-bg: #aa4444;
  --ci-sensor-display-on-text: #ffffff;
  --ci-sensor-display-off-bg: #aaaa44;
  --ci-sensor-display-off-text: #ffffff;
  --ci-legacy-success: #13824a;
  --ci-legacy-danger: #a92323;
  --ci-legacy-warning: #b96a11;
  --ci-legacy-muted: #64748b;
  --ci-custom-cor-barras: #3a5f8c;
  --ci-custom-cor-div-in: #3a5f8c;
  --ci-custom-cor-div-out: #4e6f98;
  --ci-custom-cor-lista-cab: #d9e0e8;
  --ci-custom-cor-lista-lin: #edf2f7;
  --ci-sem-bar-bg: var(--ci-custom-cor-barras);
  --ci-sem-bar-bg-end: color-mix(
    in srgb,
    var(--ci-custom-cor-barras) 72%,
    white
  );
  --ci-sem-bar-fg: #ffffff;
  --ci-sem-group-bg: var(--ci-custom-cor-div-in);
  --ci-sem-group-bg-end: color-mix(
    in srgb,
    var(--ci-custom-cor-div-out) 72%,
    white
  );
  --ci-sem-group-hover-bg: color-mix(
    in srgb,
    var(--ci-custom-cor-div-out) 86%,
    white
  );
  --ci-sem-group-hover-bg-end: color-mix(
    in srgb,
    var(--ci-custom-cor-div-out) 62%,
    white
  );
  --ci-sem-group-fg: #ffffff;
  --ci-sem-list-head-bg: color-mix(
    in srgb,
    var(--ci-custom-cor-lista-cab) 78%,
    var(--ci-surface)
  );
  --ci-sem-list-head-fg: var(--ci-text);
  --ci-sem-list-row-bg: color-mix(
    in srgb,
    var(--ci-custom-cor-lista-lin) 58%,
    var(--ci-surface)
  );
  --ci-sem-list-row-fg: var(--ci-text);
  --ci-sem-list-row-alt-bg: color-mix(
    in srgb,
    var(--ci-custom-cor-lista-lin) 42%,
    var(--ci-surface)
  );
  --ci-sem-list-row-alt-fg: var(--ci-text);
  --ci-sem-neutral-row-bg: color-mix(
    in srgb,
    var(--ci-surface-strong) 86%,
    var(--ci-surface)
  );
  --ci-sem-neutral-row-fg: var(--ci-text);
  --ci-sem-positive-row-bg: color-mix(
    in srgb,
    rgba(34, 197, 94, 0.22) 90%,
    var(--ci-surface)
  );
  --ci-sem-positive-row-fg: var(--ci-text);
  --ci-sem-warm-row-bg: #ffe9e0;
  --ci-sem-warm-row-fg: #7c3d14;
  --ci-sem-info-row-bg: #e9e9e9;
  --ci-sem-info-row-fg: var(--ci-text);
  --ci-sem-highlight-row-bg: #c5e9c5;
  --ci-sem-highlight-row-fg: #1f3b21;
  --ci-sem-highlight-alt-row-bg: #e5e9c5;
  --ci-sem-highlight-alt-row-fg: #4a4f16;
  --ci-sem-alert-row-bg: #ffffcc;
  --ci-sem-alert-row-fg: #7c2d12;
  --ci-sem-danger-row-bg: #ffcccc;
  --ci-sem-danger-row-fg: #7f1d1d;
  --ci-sem-reserva-solicitada-bg: #cee3fc;
  --ci-sem-reserva-solicitada-fg: #16324f;
  --ci-sem-reserva-paga-bg: #deffe6;
  --ci-sem-reserva-paga-fg: #16351f;
  --ci-sem-alert-past-bg: #eeeeaa;
  --ci-sem-alert-past-fg: #5c4710;
  --ci-sem-status-solicitada-bg: #996644;
  --ci-sem-status-solicitada-fg: #fff8ef;
  --ci-sem-status-limpando-bg: #ff8833;
  --ci-sem-status-limpando-fg: #2a1304;
  --ci-sem-status-verificar-bg: #b3a331;
  --ci-sem-status-verificar-fg: #211d08;
  --ci-sem-status-verificando-bg: #ffdf2c;
  --ci-sem-status-verificando-fg: #2a2300;
  --ci-legacy-bar-start: var(--ci-sem-bar-bg);
  --ci-legacy-bar-end: var(--ci-sem-bar-bg-end);
  --ci-legacy-group-start: var(--ci-sem-group-bg);
  --ci-legacy-group-end: var(--ci-sem-group-bg-end);
  --ci-legacy-row-bg: var(--ci-surface);
  --ci-legacy-row-alt-bg: var(--ci-surface-alt);
  --ci-legacy-head-bg: var(--ci-sem-list-head-bg);
  --ci-legacy-list-bg: var(--ci-sem-list-row-bg);
  --ci-legacy-neutral-bg: color-mix(
    in srgb,
    var(--ci-surface-strong) 86%,
    var(--ci-surface)
  );
  --ci-legacy-positive-bg: color-mix(
    in srgb,
    rgba(34, 197, 94, 0.22) 90%,
    var(--ci-surface)
  );
  --ci-legacy-input-border: color-mix(
    in srgb,
    var(--ci-border-strong) 88%,
    var(--ci-surface)
  );
  --ci-icon-bg: color-mix(
    in srgb,
    var(--ci-theme-chip-bg) 78%,
    var(--ci-surface)
  );
  --ci-icon-border: color-mix(
    in srgb,
    var(--ci-border-strong) 82%,
    var(--ci-surface)
  );
  --ci-icon-shadow: 0 4px 10px rgba(15, 23, 42, 0.12);
  --ci-icon-primary: var(--ci-link-color);
  --ci-icon-info: var(--ci-link-color);
  --ci-icon-success: var(--ci-legacy-success);
  --ci-icon-danger: var(--ci-legacy-danger);
  --ci-icon-warning: var(--ci-legacy-warning);
  --ci-icon-muted: var(--ci-legacy-muted);
  /* ?? Painel de Reservas ?? */
  --ci-sem-res-cab-row-a-bg: #e2e2e2;
  --ci-sem-res-cab-row-a-fg: #666666;
  --ci-sem-res-cab-row-b-bg: transparent;
  --ci-sem-res-cab-row-b-fg: #666666;
  --ci-sem-res-day-a-bg: #d6f1d6;
  --ci-sem-res-day-a-fg: #1a4500;
  --ci-sem-res-day-b-bg: transparent;
  --ci-sem-res-day-b-fg: #333333;
  --ci-sem-res-day-today-bg: #a1f956;
  --ci-sem-res-day-today-fg: #0a3000;
}

html,
body {
  min-height: 100%;
}

html[data-ci-theme] body {
  color: var(--ci-text);
  background-color: var(--ci-body-bg) !important;
}

body {
  font-family: Arial, Verdana, Geneva, sans-serif;
  font-size: 14px;
  color: var(--ci-text);
}

td {
  color: var(--ci-text);
  font-family: Arial, Verdana, Geneva, sans-serif;
  font-size: 13px;
}

input,
textarea,
option,
select,
button {
  color: var(--ci-text);
}

input,
textarea,
select {
  background-color: var(--ci-surface);
  border-color: var(--ci-border-strong);
}

.codigo {
  color: var(--ci-text-muted);
  word-break: break-all;
  padding: 4px;
}

a,
a:link,
a:visited {
  color: var(--ci-link-color);
  text-decoration: none;
  transition:
    color 0.16s ease,
    opacity 0.16s ease;
}

a:hover,
a:focus {
  color: var(--ci-link-hover);
  text-decoration: none;
}

.ClasseQnaoFunciona {
  padding: 0;
}

.LinkBtn2 {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 3px 5px;
  white-space: nowrap;
  background-color: rgba(30, 120, 180, 0.2);
  font-size: 12px;
  color: #ffffff !important;
  font-family: Arial, sans-serif;
  border-radius: 4px;
  transition:
    background-color 0.18s ease,
    box-shadow 0.18s ease;
}

.LinkBtn2:hover,
.LinkBtn2:focus {
  background-color: #2d71ac;
  color: #ffffff !important;
  box-shadow: 0 3px 10px rgba(45, 113, 172, 0.16);
}

.Bloco {
  text-align: center;
  align-items: center;
  justify-content: center;
}

.ItemBloco {
  float: left;
  margin-top: 2px;
  margin-bottom: 2px;
  margin-left: 2px;
  margin-right: 1px;
  display: inline;
}

input.pw {
  -webkit-text-security: disc;
}

.mini {
  font-family: Arial, Helvetica, sans-serif;
  font-size: 1px;
  color: #000000;
}

.texto {
  font-size: 8pt;
  color: var(--ci-text);
  font-family: Verdana, Arial, Helvetica, sans-serif;
  text-decoration: none;
}

.txtPequeno {
  font-size: 7pt;
  font-family: Verdana, Arial, Helvetica, sans-serif;
  text-decoration: none;
}

.ListaLin {
  font-size: 10pt;
  font-family: Arial, sans-serif;
  text-decoration: none;
}

.ListaLinDestaque {
  font-size: 9pt;
  color: var(--ci-text);
  font-family:
    Arial Black,
    Arial,
    sans-serif;
  text-decoration: none;
}

.estilo1,
.estilo2,
.equipamentoSt {
  border: 1px solid rgba(255, 255, 255, 0.85);
  font-size: 11px;
  color: var(--ci-cabine-text);
  font-family: Tahoma, Arial, sans-serif;
  text-decoration: none;
}

.estilo2,
.equipamentoSt {
  cursor: pointer;
}

.tabBorda {
  border: 1px solid var(--ci-border);
}

.ListaLinBorda {
  border: 1px solid rgba(148, 163, 184, 0.22);
}

.estiloEC {
  width: 390px;
  height: 28px;
  font-family: Arial, sans-serif;
  font-size: 20px;
}

.MenuFestiloTexto1,
.MenuFestiloTexto2 {
  font-size: 10px;
  font-family: Tahoma, Arial, sans-serif;
  text-decoration: none;
}

.MenuFestiloTexto1 {
  color: var(--ci-text-muted);
}

.MenuFestiloTexto2 {
  color: var(--ci-text);
}

.MenuFestilo1,
.MenuFestilo2,
.MenuFTitulo,
.EstiloHelpGeral {
  border: 1px solid var(--ci-border-strong);
  font-family: Tahoma, Arial, sans-serif;
  text-decoration: none;
}

.MenuFestilo1,
.MenuFestilo2 {
  font-size: 10px;
  color: var(--ci-text);
}

.MenuFestilo1 {
  background-color: var(--ci-surface-alt);
  color: var(--ci-text-muted);
}

.MenuFestilo2 {
  background-color: var(--ci-surface-strong);
}

.CiMenuFItem {
  opacity: 1 !important;
  transition:
    transform 0.16s ease,
    box-shadow 0.16s ease,
    border-color 0.16s ease,
    background-color 0.16s ease;
}

.CiMenuFItem:hover,
.CiMenuFItem:focus {
  transform: translateY(-1px);
  box-shadow: var(--ci-shadow-soft);
}

.CiMenuFItemTexto {
  color: inherit;
}

.CiMenuFLinkIcon {
  width: 22px;
  height: 22px;
  border-radius: 8px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--ci-theme-chip-bg);
  border: 1px solid var(--ci-theme-chip-border);
  color: var(--ci-link-color);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06);
}

.CiMenuFLinkIcon i {
  font-size: 0.88rem;
  line-height: 1;
}

.CiMenuFWrap {
  display: inline-block;
}

.CiMenuFLayer {
  padding: 6px;
  border-radius: 16px;
  background: color-mix(in srgb, var(--ci-surface-soft) 94%, transparent);
  border: 1px solid var(--ci-border);
  box-shadow: var(--ci-shadow);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}

.CiMenuFQuickCell {
  opacity: 1 !important;
  padding: 4px 0;
}

.CiMenuFQuickLink {
  width: 30px;
  height: 30px;
  border-radius: 12px;
  /* display: inline-flex; */
  align-items: center;
  justify-content: center;
  background: color-mix(in srgb, var(--ci-surface-soft) 94%, transparent);
  border: 1px solid var(--ci-border);
  color: var(--ci-card-title) !important;
  box-shadow: var(--ci-shadow-soft);
  transition:
    transform 0.16s ease,
    box-shadow 0.16s ease,
    border-color 0.16s ease,
    background-color 0.16s ease;
}

.CiMenuFQuickLink:hover,
.CiMenuFQuickLink:focus {
  transform: translateY(-1px);
  border-color: var(--ci-theme-chip-active-border);
  background: color-mix(
    in srgb,
    var(--ci-theme-chip-bg) 76%,
    var(--ci-surface)
  );
  box-shadow: var(--ci-shadow);
  color: var(--ci-link-hover) !important;
}

.CiMenuFQuickIcon {
  /* font-size: 0.98rem; */
  line-height: 1;
}

.CiMenuFLangLink {
  min-width: 42px;
  padding: 7px 10px;
  border-radius: 10px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  font-size: 11px;
  font-weight: 700;
  color: var(--ci-card-title) !important;
  background: var(--ci-theme-chip-bg);
  border: 1px solid var(--ci-theme-chip-border);
  transition:
    transform 0.16s ease,
    box-shadow 0.16s ease,
    border-color 0.16s ease;
}

.CiMenuFLangLink:hover,
.CiMenuFLangLink:focus {
  transform: translateY(-1px);
  border-color: var(--ci-theme-chip-active-border);
  box-shadow: var(--ci-shadow-soft);
}

.MenuFTitulo {
  background: linear-gradient(
    135deg,
    var(--ci-sem-bar-bg),
    var(--ci-sem-bar-bg-end)
  );
  color: var(--ci-sem-bar-fg);
  font-size: 10px;
}

.EstiloHelpGeral {
  font-size: 10px;
  color: var(--ci-help-text);
  background-color: var(--ci-help-bg);
  border-color: var(--ci-help-border);
}

.CiPanel,
.BordaArredondada,
[background*="BrancoTransp"] {
  border-radius: 7px;
  -moz-border-radius: 7px;
}

.CiPanel,
[background*="BrancoTransp"] {
  background-color: var(--ci-panel-bg);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  box-shadow: var(--ci-shadow-soft);
}

.CiConteudoWrap,
.CiConteudoFrame,
.CiConteudoInner {
  background-image: none !important;
  filter: none !important;
}

.CiConteudoWrap {
  background: color-mix(in srgb, var(--ci-surface-soft) 82%, transparent);
  border: 0px solid var(--ci-border);
  box-shadow: var(--ci-shadow);
}

.CiConteudoFrame {
  background: color-mix(in srgb, var(--ci-panel-bg) 84%, transparent);
  border: 0px solid color-mix(in srgb, var(--ci-panel-border) 80%, transparent);
}

.CiConteudoInner {
  background: color-mix(in srgb, var(--ci-surface) 72%, transparent);
  border: 0px solid color-mix(in srgb, var(--ci-border) 88%, transparent);
}

.CiConteudoTitulo {
  padding: 8px 10px;
  background: linear-gradient(
    135deg,
    color-mix(in srgb, var(--ci-theme-chip-bg) 82%, transparent),
    rgba(255, 255, 255, 0)
  ) !important;
  color: var(--ci-card-title);
  border-bottom: 0px solid var(--ci-border);
}

html[data-ci-theme="tech"] .CiConteudoWrap,
html[data-ci-theme="tech"] .CiConteudoFrame,
html[data-ci-theme="tech"] .CiConteudoInner,
html[data-ci-theme="escuro"] .CiConteudoWrap,
html[data-ci-theme="escuro"] .CiConteudoFrame,
html[data-ci-theme="escuro"] .CiConteudoInner {
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}

[background*="BrancoTransp"] {
  filter: var(--ci-img-filter-panel);
}

.cabineSt {
  font-size: 11px;
  color: var(--ci-cabine-text) !important;
  font-family: Tahoma, Arial, sans-serif;
  cursor: pointer;
  text-decoration: none;
  background-position: bottom right;
  background-repeat: no-repeat;
  background-size: cover;
  border-radius: 6px;
  filter: alpha(opacity=72);
  opacity: 0.72;
}

.cabineSt:hover {
  opacity: 1;
  color: var(--ci-cabine-text) !important;
}

.BotaoSense {
  filter: alpha(opacity=80);
  opacity: 0.8;
  cursor: pointer;
  transition: opacity 0.15s ease;
}

.BotaoSense:hover,
.BotaoSense:focus {
  filter: alpha(opacity=100);
  opacity: 1;
}

.CiLegacyIconBtn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 16px;
  min-height: 16px;
  vertical-align: middle;
  border-radius: 4px;
  border: 1px solid var(--ci-icon-border);
  background: var(--ci-icon-bg);
  box-shadow: var(--ci-icon-shadow);
  color: var(--ci-icon-primary);
  line-height: 1;
  transition:
    transform 0.16s ease,
    box-shadow 0.16s ease,
    border-color 0.16s ease,
    background-color 0.16s ease,
    color 0.16s ease,
    opacity 0.16s ease;
}

.CiLegacyIconBtn i {
  line-height: 1;
}

.CiLegacyIconBtn:hover,
.CiLegacyIconBtn:focus {
  transform: translateY(-1px);
  box-shadow: var(--ci-shadow-soft);
  border-color: var(--ci-theme-chip-active-border);
}

.CiLegacyIconBtn--plain {
  min-width: 0;
  min-height: 0;
  border-color: transparent;
  background: transparent;
  box-shadow: none;
  border-radius: 0;
}

.CiLegacyIconBtn--plain:hover,
.CiLegacyIconBtn--plain:focus {
  transform: none;
  box-shadow: none;
  border-color: transparent;
  background: transparent;
}

.CiLegacyIconBtn--primary {
  color: var(--ci-icon-primary);
}

.CiLegacyIconBtn--info {
  color: var(--ci-icon-info);
}

.CiLegacyIconBtn--success {
  color: var(--ci-icon-success);
}

.CiLegacyIconBtn--danger {
  color: var(--ci-icon-danger);
}

.CiLegacyIconBtn--warning {
  color: var(--ci-icon-warning);
}

.CiLegacyIconBtn--muted {
  color: var(--ci-icon-muted);
}

.btn-xs {
  padding: 0.2rem 0.3rem;
  font-size: 0.6rem;
}

.btn-micro {
  padding: 0.1rem 0.2rem;
  font-size: 0.5rem;
}

.btn-grad {
  background: linear-gradient(-30deg, #0c209d 0%, #5e83ef 100%);
  border: none;
  color: #fff;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.07);
  opacity: 0.92;
  transition: all 0.2s ease;
}

.btn-grad:hover,
.btn-grad:focus {
  opacity: 1;
  color: #fff !important;
  box-shadow:
    0 5px 16px rgba(94, 131, 239, 0.2),
    0 2px 5px rgba(0, 0, 0, 0.08);
}

.btn-grad,
.shine {
  position: relative;
  overflow: hidden;
}

.btn-grad::after,
.shine::after {
  content: "";
  position: absolute;
  left: -75%;
  top: 0;
  width: 40%;
  height: 100%;
  transform: skewX(-20deg);
  pointer-events: none;
}

.btn-grad::after {
  background: linear-gradient(
    120deg,
    rgba(255, 255, 255, 0.12),
    rgba(255, 255, 255, 0.28),
    rgba(255, 255, 255, 0.12)
  );
  transition: left 0.3s ease;
}

.btn-grad:hover::after,
.btn-grad:focus::after {
  left: 125%;
}

.shine::after {
  background: linear-gradient(
    120deg,
    rgba(255, 255, 255, 0.08),
    rgba(255, 255, 255, 0.2),
    rgba(255, 255, 255, 0.08)
  );
  transition:
    left 0.45s ease,
    opacity 0.2s ease;
  opacity: 0;
}

.shine:hover::after,
.shine:focus::after {
  left: 125%;
  opacity: 1;
}

.chk-wrap {
  display: inline-flex;
  align-items: center;
  cursor: pointer;
  margin: 10px 0;
  font-family: Arial, Helvetica, sans-serif;
}

.chk-wrap input[type="checkbox"] {
  position: absolute;
  opacity: 0;
  height: 0;
  width: 0;
}

.chk-wrap .chk-box {
  position: relative;
  width: 16px;
  height: 16px;
  border-radius: 4px;
  border: 1px solid var(--ci-border-strong);
  background: var(--ci-surface);
  display: inline-block;
  margin-right: 8px;
  box-shadow: inset 0 -2px 0 rgba(0, 0, 0, 0.03);
}

.chk-wrap .chk-label {
  font-size: 14px;
  color: var(--ci-text-muted);
}

.chk-wrap input[type="checkbox"]:checked + .chk-box {
  background: linear-gradient(-30deg, #0c209d 0%, #5e83ef 100%);
  border-color: #5e83ef;
}

.chk-wrap input[type="checkbox"]:focus + .chk-box {
  box-shadow: 0 0 0 3px rgba(94, 131, 239, 0.12);
}

.chk-wrap .chk-box::after {
  content: "";
  position: absolute;
  left: 4px;
  top: 1px;
  width: 6px;
  height: 10px;
  border: solid #fff;
  border-width: 0 2px 2px 0;
  transform: rotate(45deg) scale(0);
  opacity: 0;
  transition:
    transform 0.14s ease,
    opacity 0.14s ease;
}

.chk-wrap input[type="checkbox"]:checked + .chk-box::after {
  transform: rotate(45deg) scale(1);
  opacity: 1;
}

.toggle-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 14px;
  margin-top: 1px;
  cursor: pointer;
  border-radius: 10px;
  transition:
    filter 0.2s ease,
    box-shadow 0.2s ease,
    transform 0.2s ease;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 13px;
  font-weight: 600;
  color: var(--ci-sem-group-fg);
  letter-spacing: 0.3px;
  user-select: none;
  background: linear-gradient(
    135deg,
    var(--ci-sem-group-bg),
    var(--ci-sem-group-bg-end)
  );
}

.toggle-bar:hover,
.toggle-bar:focus {
  background: linear-gradient(
    135deg,
    var(--ci-sem-group-hover-bg),
    var(--ci-sem-group-hover-bg-end)
  );
  box-shadow: 0 5px 12px rgba(0, 0, 0, 0.12);
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
  transform: translateY(-1px);
}

.toggle-bar .toggle-titulo {
  flex: 1;
}

.toggle-bar .toggle-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  margin-left: 10px;
  flex-shrink: 0;
}

.toggle-bar .toggle-icon::after {
  content: "";
  display: inline-block;
  width: 9px;
  height: 9px;
  border-right: 2.5px solid rgba(255, 255, 255, 0.85);
  border-bottom: 2.5px solid rgba(255, 255, 255, 0.85);
  transform: rotate(-45deg);
  transition: transform 0.3s ease;
}

.toggle-bar.aberto .toggle-icon::after {
  transform: rotate(45deg);
}

.toggle-conteudo {
  overflow: hidden;
  max-height: 0;
  opacity: 0;
  transition:
    max-height 0.4s ease,
    opacity 0.3s ease;
}

.toggle-conteudo.aberto {
  max-height: none;
  opacity: 1;
}

.CabineDisplay {
  background-position: bottom right;
  background-repeat: no-repeat;
  border-radius: 6px;
}

/* Linha de display da cabine — segue o tema dinamicamente */
.CiCabineDefault {
  background-color: var(--ci-cabine-display-bg) !important;
}

.CiEquipBtnBase {
  background-image: none !important;
  border: 1px solid var(--ci-equip-border) !important;
  box-shadow: var(--ci-equip-shadow) !important;
  color: var(--ci-equip-text) !important;
  transition:
    background-color 0.16s ease,
    border-color 0.16s ease,
    box-shadow 0.16s ease,
    opacity 0.16s ease,
    transform 0.16s ease;
}

.CiEquipBtnBase:hover,
.CiEquipBtnBase:focus {
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.18) !important;
}

.CiEquipBtnUrl {
  background-color: var(--ci-equip-bg-url) !important;
}

.CiEquipBtnNeutral {
  background-color: var(--ci-equip-bg-neutral) !important;
}

.CiEquipBtnActive {
  background-color: var(--ci-equip-bg-active) !important;
}

.CiEquipBtnSensor {
  background-color: var(--ci-equip-bg-sensor) !important;
}

.CiEquipBtnProcess {
  background-color: var(--ci-equip-bg-processing) !important;
}

.CiEquipTxtBase {
  color: var(--ci-equip-text) !important;
}

.CiEquipTxtAction {
  color: var(--ci-equip-text-action) !important;
}

.CiEquipTxtSensor {
  color: var(--ci-equip-text-sensor) !important;
}

.CiEquipStatusError {
  color: var(--ci-equip-alert) !important;
}

.CiCabineFrame,
.CiCabineFrameInner {
  filter: none !important;
}

body.CiPageControle,
body.CiPageCadastro,
body.CiPageCardapio {
  color: var(--ci-text);
}

body.CiPageControle table,
body.CiPageCadastro table,
body.CiPageCardapio table {
  color: inherit;
}

body.CiPageControle input,
body.CiPageControle textarea,
body.CiPageControle select,
body.CiPageCadastro input,
body.CiPageCadastro textarea,
body.CiPageCadastro select,
body.CiPageCardapio input,
body.CiPageCardapio textarea,
body.CiPageCardapio select {
  background-color: var(--ci-surface);
  color: var(--ci-text);
  border: 1px solid var(--ci-legacy-input-border);
  box-shadow: none;
}

.CiLegacyBar,
.CiToneBar,
.CiToneBarCell {
  background: linear-gradient(
    135deg,
    var(--ci-legacy-bar-start),
    var(--ci-legacy-bar-end)
  ) !important;
}

.CiLegacyGroupBar,
.CiToneGroupBar,
.CiToneGroupBarCell,
.CiToneGroupBarInteractive,
body.CiPageCardapio .CiCardapioGroupToggle {
  background: linear-gradient(
    135deg,
    var(--ci-legacy-group-start),
    var(--ci-legacy-group-end)
  ) !important;
}

.CiToneGroupBarInteractive {
  cursor: pointer;
  transition:
    transform 0.18s ease,
    box-shadow 0.18s ease,
    background 0.18s ease;
}

.CiToneGroupBarInteractive:hover,
.CiToneGroupBarInteractive:focus {
  background: linear-gradient(
    135deg,
    var(--ci-sem-group-hover-bg),
    var(--ci-sem-group-hover-bg-end)
  ) !important;
  box-shadow: var(--ci-shadow-soft);
  transform: translateY(-1px);
}

.CiLegacyListHead,
.CiToneHeadRow,
.CiToneHeadCell {
  background-color: var(--ci-legacy-head-bg) !important;
}

.CiLegacyListAlt,
.CiToneRow,
.CiToneRow > tr,
.CiToneRowCell {
  background-color: var(--ci-legacy-list-bg) !important;
}

.CiToneRowAlt,
.CiToneRowAlt > tr,
.CiToneRowAltCell {
  background-color: var(--ci-sem-list-row-alt-bg) !important;
}

.CiLegacyNeutral,
.CiToneNeutralRow,
.CiToneNeutralRow > tr,
.CiToneNeutralCell,
body.CiPageCardapio .CiCardapioTotalRow {
  background-color: var(--ci-legacy-neutral-bg) !important;
}

.CiLegacyPositiveBg,
.CiTonePositiveRow,
.CiTonePositiveRow > tr,
.CiTonePositiveCell {
  background-color: var(--ci-legacy-positive-bg) !important;
}

.CiToneWarmRow,
.CiToneWarmRow > tr,
.CiToneWarmCell {
  background-color: var(--ci-sem-warm-row-bg) !important;
}

.CiToneInfoRow,
.CiToneInfoRow > tr,
.CiToneInfoCell {
  background-color: var(--ci-sem-info-row-bg) !important;
}

.CiToneHighlightRow,
.CiToneHighlightRow > tr,
.CiToneHighlightCell {
  background-color: var(--ci-sem-highlight-row-bg) !important;
}

.CiToneHighlightAltRow,
.CiToneHighlightAltRow > tr,
.CiToneHighlightAltCell {
  background-color: var(--ci-sem-highlight-alt-row-bg) !important;
}

.CiToneAlertRow,
.CiToneAlertRow > tr,
.CiToneAlertCell {
  background-color: var(--ci-sem-alert-row-bg) !important;
}

.CiToneDangerRow,
.CiToneDangerRow > tr,
.CiToneDangerCell {
  background-color: var(--ci-sem-danger-row-bg) !important;
}

.CiToneReservaSolicitada,
.CiToneReservaSolicitada > td,
.CiToneReservaSolicitadaCell {
  background-color: var(--ci-sem-reserva-solicitada-bg) !important;
}

.CiToneReservaPaga,
.CiToneReservaPaga > td,
.CiToneReservaPagaCell {
  background-color: var(--ci-sem-reserva-paga-bg) !important;
}

.CiToneAlertPast,
.CiToneAlertPast > td,
.CiToneAlertPastCell {
  background-color: var(--ci-sem-alert-past-bg) !important;
}

.CiToneStatusSolicitada,
.CiToneStatusSolicitada > td,
.CiToneStatusSolicitadaCell {
  background-color: var(--ci-sem-status-solicitada-bg) !important;
  color: var(--ci-sem-status-solicitada-fg) !important;
}

.CiToneStatusLimpando,
.CiToneStatusLimpando > td,
.CiToneStatusLimpandoCell {
  background-color: var(--ci-sem-status-limpando-bg) !important;
  color: var(--ci-sem-status-limpando-fg) !important;
}

.CiToneStatusVerificar,
.CiToneStatusVerificar > td,
.CiToneStatusVerificarCell {
  background-color: var(--ci-sem-status-verificar-bg) !important;
  color: var(--ci-sem-status-verificar-fg) !important;
}

.CiToneStatusVerificando,
.CiToneStatusVerificando > td,
.CiToneStatusVerificandoCell {
  background-color: var(--ci-sem-status-verificando-bg) !important;
  color: var(--ci-sem-status-verificando-fg) !important;
}

body.CiPageCardapio .CiLegacyCardapioRow,
body.CiPageCardapio .CiCardapioItemRow {
  background-color: var(--ci-legacy-row-bg) !important;
}

body.CiPageCardapio .CiLegacyCardapioRowAlt,
body.CiPageCardapio .CiCardapioItemRowAlt {
  background-color: var(--ci-legacy-row-alt-bg) !important;
}

.CiLegacyBar,
.CiLegacyBar td,
.CiLegacyBar font,
.CiLegacyGroupBar,
.CiLegacyGroupBar td,
.CiLegacyGroupBar font,
.CiToneBar,
.CiToneBar td,
.CiToneBar font,
.CiToneBar b,
.CiToneBar a,
.CiToneBarCell,
.CiToneBarCell font,
.CiToneBarCell b,
.CiToneBarCell a,
.CiToneGroupBar,
.CiToneGroupBar td,
.CiToneGroupBar font,
.CiToneGroupBar b,
.CiToneGroupBar a,
.CiToneGroupBarCell,
.CiToneGroupBarCell font,
.CiToneGroupBarCell b,
.CiToneGroupBarCell a,
.CiToneGroupBarInteractive,
.CiToneGroupBarInteractive font,
.CiToneGroupBarInteractive b,
.CiToneGroupBarInteractive a,
body.CiPageCardapio .CiCardapioGroupToggle,
body.CiPageCardapio .CiCardapioGroupToggle font,
body.CiPageCardapio .CiCardapioGroupToggle b {
  color: var(--ci-text-contrast) !important;
}

.CiToneHeadRow,
.CiToneHeadRow td,
.CiToneHeadRow font,
.CiToneHeadCell,
.CiToneHeadCell font,
.CiToneRow,
.CiToneRow td,
.CiToneRow font,
.CiToneRowCell,
.CiToneRowCell font,
.CiToneRowAlt,
.CiToneRowAlt td,
.CiToneRowAlt font,
.CiToneRowAltCell,
.CiToneRowAltCell font,
.CiToneNeutralRow,
.CiToneNeutralRow td,
.CiToneNeutralRow font,
.CiToneNeutralCell,
.CiTonePositiveRow,
.CiTonePositiveRow td,
.CiTonePositiveRow font,
.CiTonePositiveCell,
.CiToneWarmRow,
.CiToneWarmRow td,
.CiToneWarmRow font,
.CiToneWarmCell,
.CiToneInfoRow,
.CiToneInfoRow td,
.CiToneInfoRow font,
.CiToneInfoCell,
.CiToneHighlightRow,
.CiToneHighlightRow td,
.CiToneHighlightRow font,
.CiToneHighlightCell,
.CiToneHighlightAltRow,
.CiToneHighlightAltRow td,
.CiToneHighlightAltRow font,
.CiToneHighlightAltCell,
.CiToneAlertRow,
.CiToneAlertRow td,
.CiToneAlertRow font,
.CiToneAlertCell,
.CiToneDangerRow,
.CiToneDangerRow td,
.CiToneDangerRow font,
.CiToneDangerCell,
.CiToneReservaSolicitada,
.CiToneReservaSolicitada td,
.CiToneReservaSolicitada font,
.CiTextOnBar,
.CiTextOnBar a,
.CiTextOnBar b,
.CiTextOnBar font {
  color: var(--ci-sem-bar-fg) !important;
}

.CiTextMuted,
.CiTextMuted a,
.CiTextMuted b,
.CiTextMuted font {
  color: var(--ci-text-muted) !important;
}

.CiTextSuccess,
.CiTextSuccess a,
.CiTextSuccess b,
.CiTextSuccess font {
  color: var(--ci-legacy-success) !important;
}

.CiTextWarning,
.CiTextWarning a,
.CiTextWarning b,
.CiTextWarning font {
  color: var(--ci-legacy-warning) !important;
}

.CiTextDanger,
.CiTextDanger a,
.CiTextDanger b,
.CiTextDanger font {
  color: var(--ci-legacy-danger) !important;
}

.CiTextAccent,
.CiTextAccent a,
.CiTextAccent b,
.CiTextAccent font {
  color: var(--ci-link-color) !important;
}

a.CiTextAccent,
a.CiTextAccent:link,
a.CiTextAccent:visited {
  color: var(--ci-link-color) !important;
  text-decoration: none;
}

a.CiTextAccent:hover,
a.CiTextAccent:focus {
  color: var(--ci-link-hover) !important;
  text-decoration: none;
}

/* Centralização dos legados do Personaliza.asp enquanto a migração é concluída */
tr[bgcolor="EEEEEE"] > td,
tr[bgcolor="EEEEEE"] {
  background-color: var(--ci-sem-neutral-row-bg) !important;
  color: var(--ci-sem-neutral-row-fg) !important;
}

tr[bgcolor="FFFFEE"] > td,
tr[bgcolor="FFFFEE"] {
  background-color: var(--ci-sem-warm-row-bg) !important;
  color: var(--ci-sem-warm-row-fg) !important;
}

tr[bgcolor="F5F5F5"] > td,
tr[bgcolor="F5F5F5"] {
  background-color: var(--ci-sem-list-row-alt-bg) !important;
  color: var(--ci-text) !important;
}

tr[bgcolor="FFF6BB"] > td,
tr[bgcolor="FFF6BB"] {
  background-color: var(--ci-sem-alert-row-bg) !important;
  color: var(--ci-sem-alert-row-fg) !important;
}

tr[bgcolor="FFCCAA"] > td,
tr[bgcolor="FFCCAA"] {
  background-color: var(--ci-sem-danger-row-bg) !important;
  color: var(--ci-sem-danger-row-fg) !important;
}

td[bgcolor="DDDDDD"],
tr[bgcolor="DDDDDD"] > td,
tr[bgcolor="DDDDDD"] {
  background-color: var(--ci-sem-list-head-bg) !important;
  color: var(--ci-sem-list-head-fg) !important;
}

tr[bgcolor="AAAAAA"] > td,
tr[bgcolor="AAAAAA"] {
  background-color: var(--ci-sem-list-head-bg) !important;
  color: var(--ci-sem-list-head-fg) !important;
}

tr[bgcolor="EEEECC"] > td,
tr[bgcolor="EEEECC"] {
  background-color: var(--ci-sem-warm-row-bg) !important;
  color: var(--ci-sem-warm-row-fg) !important;
}

tr[bgcolor="EEFFEE"] > td,
tr[bgcolor="EEFFEE"],
tr[bgcolor="DDFFDD"] > td,
tr[bgcolor="DDFFDD"] {
  background-color: var(--ci-legacy-positive-bg) !important;
  color: var(--ci-text) !important;
}

font[color="666666"],
font[color="888888"],
font[color="999999"],
font[color="BB6666"] {
  color: var(--ci-text-muted) !important;
}

font[color="000000"],
font[color="#000000"],
font[color="000"] {
  color: var(--ci-text) !important;
}

font[color="990000"],
font[color="FF9900"],
font[color="AA8800"] {
  color: var(--ci-legacy-danger) !important;
}

font[color="009900"],
font[color="449900"] {
  color: var(--ci-legacy-success) !important;
}

font[color="FFFFFF"],
font[color="ffffff"] {
  color: var(--ci-sem-bar-fg) !important;
}

span[style*="#3333FF"],
font[color="#3333FF"] {
  color: var(--ci-link-color) !important;
}

/* ?? Autocomplete Dropdown ??????????????????????????????????????????????????
   Reutilizável em qualquer campo com sugestão dinâmica via Ajax.
   Uso: wrapper com position-relative > input + <div class="CiAutocompDropdown">
   Itens criados via JS recebem a classe CiAutocompItem.
   ??????????????????????????????????????????????????????????????????????????? */
.CiAutocompDropdown {
  position: absolute;
  left: 0;
  right: 0;
  top: calc(100% + 4px);
  z-index: 20;
  display: none;
  border: 1px solid var(--ci-border-strong);
  border-radius: 8px;
  background: var(--ci-surface);
  box-shadow: var(--ci-shadow);
  max-height: 210px;
  overflow-y: auto;
}

.CiAutocompItem {
  padding: 9px 12px;
  border-bottom: 1px solid var(--ci-border);
  cursor: pointer;
  font-size: 14px;
  line-height: 1.35;
  color: var(--ci-text);
}

.CiAutocompItem:last-child {
  border-bottom: none;
}

.CiAutocompItem:hover,
.CiAutocompItem:focus {
  background: var(--ci-surface-alt);
}
.CiToneReservaPaga td,
.CiToneReservaPaga font,
.CiToneAlertPast,
.CiToneAlertPast td,
.CiToneAlertPast font {
  color: inherit !important;
}

.CiToneHeadRow,
.CiToneHeadRow td,
.CiToneHeadRow font,
.CiToneHeadCell,
.CiToneHeadCell font {
  color: var(--ci-sem-list-head-fg) !important;
}

.CiToneRow,
.CiToneRow td,
.CiToneRow font,
.CiToneRowCell,
.CiToneRowCell font,
.CiToneRowAlt,
.CiToneRowAlt td,
.CiToneRowAlt font,
.CiToneRowAltCell,
.CiToneRowAltCell font,
.CiToneNeutralRow,
.CiToneNeutralRow td,
.CiToneNeutralRow font,
.CiToneNeutralCell,
.CiToneInfoRow,
.CiToneInfoRow td,
.CiToneInfoRow font,
.CiToneInfoCell,
.CiToneHighlightRow,
.CiToneHighlightRow td,
.CiToneHighlightRow font,
.CiToneHighlightCell,
.CiToneHighlightAltRow,
.CiToneHighlightAltRow td,
.CiToneHighlightAltRow font,
.CiToneHighlightAltCell,
.CiTonePositiveRow,
.CiTonePositiveRow td,
.CiTonePositiveRow font,
.CiTonePositiveCell {
  color: var(--ci-text) !important;
}

.CiToneWarmRow,
.CiToneWarmRow td,
.CiToneWarmRow font,
.CiToneWarmCell,
.CiToneWarmCell font {
  color: var(--ci-sem-warm-row-fg) !important;
}

.CiToneAlertRow,
.CiToneAlertRow td,
.CiToneAlertRow font,
.CiToneAlertCell,
.CiToneAlertCell font {
  color: var(--ci-sem-alert-row-fg) !important;
}

.CiToneDangerRow,
.CiToneDangerRow td,
.CiToneDangerRow font,
.CiToneDangerCell,
.CiToneDangerCell font {
  color: var(--ci-sem-danger-row-fg) !important;
}

.CiToneReservaSolicitada,
.CiToneReservaSolicitada td,
.CiToneReservaSolicitada font,
.CiToneReservaSolicitadaCell,
.CiToneReservaSolicitadaCell font {
  color: var(--ci-sem-reserva-solicitada-fg) !important;
}

.CiToneReservaPaga,
.CiToneReservaPaga td,
.CiToneReservaPaga font,
.CiToneReservaPagaCell,
.CiToneReservaPagaCell font {
  color: var(--ci-sem-reserva-paga-fg) !important;
}

.CiToneAlertPast,
.CiToneAlertPast td,
.CiToneAlertPast font,
.CiToneAlertPastCell,
.CiToneAlertPastCell font {
  color: var(--ci-sem-alert-past-fg) !important;
}

font.CiLegacyTextOnDark,
.CiToneTextContrast {
  color: var(--ci-text-contrast) !important;
}

font.CiLegacyTextDanger,
.CiToneTextDanger,
body.CiPageCardapio .CiCardapioTotalValor--danger {
  color: var(--ci-legacy-danger) !important;
}

font.CiLegacyTextSuccess,
.CiToneTextSuccess,
body.CiPageCardapio .CiCardapioPrice,
body.CiPageCardapio .CiCardapioTotalValor {
  color: var(--ci-legacy-success) !important;
}

font.CiLegacyTextWarning,
.CiToneTextWarning {
  color: var(--ci-legacy-warning) !important;
}

font.CiLegacyTextMuted,
.CiToneTextMuted,
body.CiPageCardapio .CiCardapioInfo,
body.CiPageCardapio .CiCardapioObsLabel {
  color: var(--ci-legacy-muted) !important;
}

body.CiPageCardapio .CiCardapioObsInput {
  border: 1px solid var(--ci-legacy-input-border) !important;
  border-radius: 7px;
  background-color: var(--ci-surface) !important;
  color: var(--ci-text) !important;
  transition:
    border-color 0.16s ease,
    box-shadow 0.16s ease,
    background-color 0.16s ease;
}

body.CiPageCardapio .CiCardapioObsInput:focus {
  border-color: var(--ci-theme-chip-active-border) !important;
  box-shadow: 0 0 0 0.18rem
    color-mix(in srgb, var(--ci-theme-chip-border) 72%, transparent);
}

body.CiPageCardapio .CiCardapioTotalValor {
  font-weight: 700;
}

/* Visualiza_Fechamento.asp — harmonização com temas do sistema */
.CiFechamentoFicha {
  color: var(--ci-text);
}

.CiFechamentoFicha a,
.CiFechamentoFicha a:link,
.CiFechamentoFicha a:visited {
  color: var(--ci-link-color);
}

.CiFechamentoFicha a:hover,
.CiFechamentoFicha a:focus {
  color: var(--ci-link-hover);
}

.CiFechamentoFicha table[border="1"],
.CiFechamentoFicha table[cellspacing="1"][cellpadding="1"] {
  border-color: var(--ci-border-strong);
  color: var(--ci-text);
}

.CiFechamentoFicha table[border="1"] td,
.CiFechamentoFicha table[cellspacing="1"][cellpadding="1"] td {
  border-color: var(--ci-border);
}

.CiFechamentoResumo > tbody > tr > td {
  padding: 3px 8px;
}

.CiFechamentoResumo > tbody > tr:nth-child(odd) > td {
  background-color: var(--ci-surface-soft);
}

.CiFechamentoResumo > tbody > tr:nth-child(even) > td {
  background-color: var(--ci-surface-alt);
}

.CiFechamentoResumo > tbody > tr > td:last-child {
  font-weight: 600;
  white-space: nowrap;
}

.CiFechamentoFicha
  table[border="1"]
  tr:not(.CiLegacyBar):not(.CiLegacyGroupBar):not(.CiToneBar):not(
    .CiToneBarCell
  ):not(.CiToneGroupBar):not(.CiToneGroupBarCell):not(
    .CiToneGroupBarInteractive
  ):not(.CiToneHeadRow):not(.CiToneWarmRow):not(.CiTonePositiveRow):not(
    .CiToneDangerRow
  ):not(.CiToneAlertRow):not(.CiToneNeutralRow):not(.CiToneHighlightRow):not(
    .CiToneHighlightAltRow
  ):not(.CiToneInfoRow):not(.CiToneReservaSolicitada):not(
    .CiToneReservaPaga
  ):nth-child(odd)
  > td,
.CiFechamentoFicha
  table[cellspacing="1"][cellpadding="1"]
  tr:not(.CiLegacyBar):not(.CiLegacyGroupBar):not(.CiToneBar):not(
    .CiToneBarCell
  ):not(.CiToneGroupBar):not(.CiToneGroupBarCell):not(
    .CiToneGroupBarInteractive
  ):not(.CiToneHeadRow):not(.CiToneWarmRow):not(.CiTonePositiveRow):not(
    .CiToneDangerRow
  ):not(.CiToneAlertRow):not(.CiToneNeutralRow):not(.CiToneHighlightRow):not(
    .CiToneHighlightAltRow
  ):not(.CiToneInfoRow):not(.CiToneReservaSolicitada):not(
    .CiToneReservaPaga
  ):nth-child(odd)
  > td {
  background-color: var(--ci-legacy-row-bg);
}

.CiFechamentoFicha
  table[border="1"]
  tr:not(.CiLegacyBar):not(.CiLegacyGroupBar):not(.CiToneBar):not(
    .CiToneBarCell
  ):not(.CiToneGroupBar):not(.CiToneGroupBarCell):not(
    .CiToneGroupBarInteractive
  ):not(.CiToneHeadRow):not(.CiToneWarmRow):not(.CiTonePositiveRow):not(
    .CiToneDangerRow
  ):not(.CiToneAlertRow):not(.CiToneNeutralRow):not(.CiToneHighlightRow):not(
    .CiToneHighlightAltRow
  ):not(.CiToneInfoRow):not(.CiToneReservaSolicitada):not(
    .CiToneReservaPaga
  ):nth-child(even)
  > td,
.CiFechamentoFicha
  table[cellspacing="1"][cellpadding="1"]
  tr:not(.CiLegacyBar):not(.CiLegacyGroupBar):not(.CiToneBar):not(
    .CiToneBarCell
  ):not(.CiToneGroupBar):not(.CiToneGroupBarCell):not(
    .CiToneGroupBarInteractive
  ):not(.CiToneHeadRow):not(.CiToneWarmRow):not(.CiTonePositiveRow):not(
    .CiToneDangerRow
  ):not(.CiToneAlertRow):not(.CiToneNeutralRow):not(.CiToneHighlightRow):not(
    .CiToneHighlightAltRow
  ):not(.CiToneInfoRow):not(.CiToneReservaSolicitada):not(
    .CiToneReservaPaga
  ):nth-child(even)
  > td {
  background-color: var(--ci-legacy-row-alt-bg);
}

.CiFechamentoFicha font[color="999999"],
.CiFechamentoFicha font[color="666666"] {
  color: var(--ci-text-muted) !important;
}

html[data-ci-theme="escuro"] .CiCabineFrame {
  background-image: none !important;
  background-color: rgba(10, 17, 30, 0.62);
  box-shadow: 0 0 0 1px rgba(148, 163, 184, 0.24);
}

html[data-ci-theme="escuro"] .CiCabineFrameInner {
  background-image: none !important;
  background-color: rgba(31, 41, 55, 0.54);
  box-shadow: inset 0 0 0 1px rgba(148, 163, 184, 0.22);
}

html[data-ci-theme="tech"] .CiCabineFrame {
  background-image: none !important;
  background-color: rgba(4, 20, 28, 0.68);
  box-shadow:
    0 0 0 1px rgba(0, 245, 255, 0.42),
    0 0 12px rgba(0, 245, 255, 0.18);
}

html[data-ci-theme="tech"] .CiCabineFrameInner {
  background-image: none !important;
  background-color: rgba(8, 39, 51, 0.56);
  box-shadow: inset 0 0 0 1px rgba(0, 245, 255, 0.32);
}

html[data-ci-theme="personalizado"] .CiCabineFrame {
  background-image: none !important;
  background-color: var(--ci-panel-bg);
  box-shadow: 0 0 0 1px var(--ci-border);
}

html[data-ci-theme="personalizado"] .CiCabineFrameInner {
  background-image: none !important;
  background-color: var(--ci-panel-bg);
  box-shadow: inset 0 0 0 1px var(--ci-border);
}

.ajuda {
  position: absolute;
  visibility: hidden;
  left: 100px;
  top: 100px;
  z-index: 99999;
  padding: 3px 6px;
  font-size: 11px;
  color: var(--ci-help-text);
  font-family: Tahoma, Arial, sans-serif;
  text-decoration: none;
  text-align: left;
  border-radius: 7px;
  filter: alpha(opacity=90);
  opacity: 0.9;
  background-color: var(--ci-help-bg);
  border: 1px solid var(--ci-help-border);
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2);
}

table.sortable thead {
  cursor: pointer;
}

.sorttable_nosort {
  cursor: default;
}

/* Auto-stripe em tabelas sortable: aplica fundo alternado a linhas sem tom ou bgcolor definidos.
   O JS em SortTable2.js assume o controle após o carregamento e após cada ordenação. */
table.sortable tbody tr:nth-child(odd):not([class*="CiTone"]):not([bgcolor]) {
  background-color: var(--ci-sem-list-row-bg);
}
table.sortable tbody tr:nth-child(even):not([class*="CiTone"]):not([bgcolor]) {
  background-color: var(--ci-sem-list-row-alt-bg);
}

table#striped tbody tr:nth-child(2n) td {
  background: var(--ci-striped-bg);
}

/* ??????????????????????????????????????????????????
   Painel de Reservas — Linhas de cabines e dias
   ?????????????????????????????????????????????????? */

/* Linhas de cabines — painel esquerdo */
.CiResCabRow {
  background-color: var(--ci-sem-res-cab-row-a-bg) !important;
}
.CiResCabRow td,
.CiResCabRow font,
.CiResCabRow b {
  color: var(--ci-sem-res-cab-row-a-fg) !important;
}

.CiResCabRowAlt {
  background-color: var(--ci-sem-res-cab-row-b-bg) !important;
}
.CiResCabRowAlt td,
.CiResCabRowAlt font,
.CiResCabRowAlt b {
  color: var(--ci-sem-res-cab-row-b-fg) !important;
}

/* Células de cabeçalho dos dias */
.CiResDayA {
  background-color: var(--ci-sem-res-day-a-bg) !important;
  color: var(--ci-sem-res-day-a-fg) !important;
}
.CiResDayA font {
  color: var(--ci-sem-res-day-a-fg) !important;
}

.CiResDayB {
  background-color: var(--ci-sem-res-day-b-bg) !important;
  color: var(--ci-sem-res-day-b-fg) !important;
}
.CiResDayB font {
  color: var(--ci-sem-res-day-b-fg) !important;
}

.CiResDayToday {
  background-color: var(--ci-sem-res-day-today-bg) !important;
  color: var(--ci-sem-res-day-today-fg) !important;
}
.CiResDayToday font {
  color: var(--ci-sem-res-day-today-fg) !important;
}

table#striped tbody tr:nth-child(2n + 1) td {
  background: var(--ci-surface);
}

.SemiTransparent {
  filter: alpha(opacity=75);
  opacity: 0.75;
}
.SemiTransparent0 {
  filter: alpha(opacity=0);
  opacity: 0;
}
.SemiTransparent1 {
  filter: alpha(opacity=1);
  opacity: 0.01;
}
.SemiTransparent2 {
  filter: alpha(opacity=2);
  opacity: 0.02;
}
.SemiTransparent3 {
  filter: alpha(opacity=3);
  opacity: 0.03;
}
.SemiTransparent4 {
  filter: alpha(opacity=4);
  opacity: 0.04;
}
.SemiTransparent5 {
  filter: alpha(opacity=5);
  opacity: 0.05;
}
.SemiTransparent6 {
  filter: alpha(opacity=6);
  opacity: 0.06;
}
.SemiTransparent7 {
  filter: alpha(opacity=7);
  opacity: 0.07;
}
.SemiTransparent8 {
  filter: alpha(opacity=8);
  opacity: 0.08;
}
.SemiTransparent9 {
  filter: alpha(opacity=9);
  opacity: 0.09;
}
/* Aliases para valores com zero à esquerda (00-09) gerados pelo VBScript para intensidades 0%-9% */
.SemiTransparent00 {
  filter: alpha(opacity=0);
  opacity: 0;
}
.SemiTransparent01 {
  filter: alpha(opacity=1);
  opacity: 0.01;
}
.SemiTransparent02 {
  filter: alpha(opacity=2);
  opacity: 0.02;
}
.SemiTransparent03 {
  filter: alpha(opacity=3);
  opacity: 0.03;
}
.SemiTransparent04 {
  filter: alpha(opacity=4);
  opacity: 0.04;
}
.SemiTransparent05 {
  filter: alpha(opacity=5);
  opacity: 0.05;
}
.SemiTransparent06 {
  filter: alpha(opacity=6);
  opacity: 0.06;
}
.SemiTransparent07 {
  filter: alpha(opacity=7);
  opacity: 0.07;
}
.SemiTransparent08 {
  filter: alpha(opacity=8);
  opacity: 0.08;
}
.SemiTransparent09 {
  filter: alpha(opacity=9);
  opacity: 0.09;
}
.SemiTransparent10 {
  filter: alpha(opacity=10);
  opacity: 0.1;
}
.SemiTransparent11 {
  filter: alpha(opacity=11);
  opacity: 0.11;
}
.SemiTransparent12 {
  filter: alpha(opacity=12);
  opacity: 0.12;
}
.SemiTransparent13 {
  filter: alpha(opacity=13);
  opacity: 0.13;
}
.SemiTransparent14 {
  filter: alpha(opacity=14);
  opacity: 0.14;
}
.SemiTransparent15 {
  filter: alpha(opacity=15);
  opacity: 0.15;
}
.SemiTransparent16 {
  filter: alpha(opacity=16);
  opacity: 0.16;
}
.SemiTransparent17 {
  filter: alpha(opacity=17);
  opacity: 0.17;
}
.SemiTransparent18 {
  filter: alpha(opacity=18);
  opacity: 0.18;
}
.SemiTransparent19 {
  filter: alpha(opacity=19);
  opacity: 0.19;
}
.SemiTransparent20 {
  filter: alpha(opacity=20);
  opacity: 0.2;
}
.SemiTransparent21 {
  filter: alpha(opacity=21);
  opacity: 0.21;
}
.SemiTransparent22 {
  filter: alpha(opacity=22);
  opacity: 0.22;
}
.SemiTransparent23 {
  filter: alpha(opacity=23);
  opacity: 0.23;
}
.SemiTransparent24 {
  filter: alpha(opacity=24);
  opacity: 0.24;
}
.SemiTransparent25 {
  filter: alpha(opacity=25);
  opacity: 0.25;
}
.SemiTransparent26 {
  filter: alpha(opacity=26);
  opacity: 0.26;
}
.SemiTransparent27 {
  filter: alpha(opacity=27);
  opacity: 0.27;
}
.SemiTransparent28 {
  filter: alpha(opacity=28);
  opacity: 0.28;
}
.SemiTransparent29 {
  filter: alpha(opacity=29);
  opacity: 0.29;
}
.SemiTransparent30 {
  filter: alpha(opacity=30);
  opacity: 0.3;
}
.SemiTransparent31 {
  filter: alpha(opacity=31);
  opacity: 0.31;
}
.SemiTransparent32 {
  filter: alpha(opacity=32);
  opacity: 0.32;
}
.SemiTransparent33 {
  filter: alpha(opacity=33);
  opacity: 0.33;
}
.SemiTransparent34 {
  filter: alpha(opacity=34);
  opacity: 0.34;
}
.SemiTransparent35 {
  filter: alpha(opacity=35);
  opacity: 0.35;
}
.SemiTransparent36 {
  filter: alpha(opacity=36);
  opacity: 0.36;
}
.SemiTransparent37 {
  filter: alpha(opacity=37);
  opacity: 0.37;
}
.SemiTransparent38 {
  filter: alpha(opacity=38);
  opacity: 0.38;
}
.SemiTransparent39 {
  filter: alpha(opacity=39);
  opacity: 0.39;
}
.SemiTransparent40 {
  filter: alpha(opacity=40);
  opacity: 0.4;
}
.SemiTransparent41 {
  filter: alpha(opacity=41);
  opacity: 0.41;
}
.SemiTransparent42 {
  filter: alpha(opacity=42);
  opacity: 0.42;
}
.SemiTransparent43 {
  filter: alpha(opacity=43);
  opacity: 0.43;
}
.SemiTransparent44 {
  filter: alpha(opacity=44);
  opacity: 0.44;
}
.SemiTransparent45 {
  filter: alpha(opacity=45);
  opacity: 0.45;
}
.SemiTransparent46 {
  filter: alpha(opacity=46);
  opacity: 0.46;
}
.SemiTransparent47 {
  filter: alpha(opacity=47);
  opacity: 0.47;
}
.SemiTransparent48 {
  filter: alpha(opacity=48);
  opacity: 0.48;
}
.SemiTransparent49 {
  filter: alpha(opacity=49);
  opacity: 0.49;
}
.SemiTransparent50 {
  filter: alpha(opacity=50);
  opacity: 0.5;
}
.SemiTransparent51 {
  filter: alpha(opacity=51);
  opacity: 0.51;
}
.SemiTransparent52 {
  filter: alpha(opacity=52);
  opacity: 0.52;
}
.SemiTransparent53 {
  filter: alpha(opacity=53);
  opacity: 0.53;
}
.SemiTransparent54 {
  filter: alpha(opacity=54);
  opacity: 0.54;
}
.SemiTransparent55 {
  filter: alpha(opacity=55);
  opacity: 0.55;
}
.SemiTransparent56 {
  filter: alpha(opacity=56);
  opacity: 0.56;
}
.SemiTransparent57 {
  filter: alpha(opacity=57);
  opacity: 0.57;
}
.SemiTransparent58 {
  filter: alpha(opacity=58);
  opacity: 0.58;
}
.SemiTransparent59 {
  filter: alpha(opacity=59);
  opacity: 0.59;
}
.SemiTransparent60 {
  filter: alpha(opacity=60);
  opacity: 0.6;
}
.SemiTransparent61 {
  filter: alpha(opacity=61);
  opacity: 0.61;
}
.SemiTransparent62 {
  filter: alpha(opacity=62);
  opacity: 0.62;
}
.SemiTransparent63 {
  filter: alpha(opacity=63);
  opacity: 0.63;
}
.SemiTransparent64 {
  filter: alpha(opacity=64);
  opacity: 0.64;
}
.SemiTransparent65 {
  filter: alpha(opacity=65);
  opacity: 0.65;
}
.SemiTransparent66 {
  filter: alpha(opacity=66);
  opacity: 0.66;
}
.SemiTransparent67 {
  filter: alpha(opacity=67);
  opacity: 0.67;
}
.SemiTransparent68 {
  filter: alpha(opacity=68);
  opacity: 0.68;
}
.SemiTransparent69 {
  filter: alpha(opacity=69);
  opacity: 0.69;
}
.SemiTransparent70 {
  filter: alpha(opacity=70);
  opacity: 0.7;
}
.SemiTransparent71 {
  filter: alpha(opacity=71);
  opacity: 0.71;
}
.SemiTransparent72 {
  filter: alpha(opacity=72);
  opacity: 0.72;
}
.SemiTransparent73 {
  filter: alpha(opacity=73);
  opacity: 0.73;
}
.SemiTransparent74 {
  filter: alpha(opacity=74);
  opacity: 0.74;
}
.SemiTransparent75 {
  filter: alpha(opacity=75);
  opacity: 0.75;
}
.SemiTransparent76 {
  filter: alpha(opacity=76);
  opacity: 0.76;
}
.SemiTransparent77 {
  filter: alpha(opacity=77);
  opacity: 0.77;
}
.SemiTransparent78 {
  filter: alpha(opacity=78);
  opacity: 0.78;
}
.SemiTransparent79 {
  filter: alpha(opacity=79);
  opacity: 0.79;
}
.SemiTransparent80 {
  filter: alpha(opacity=80);
  opacity: 0.8;
}
.SemiTransparent81 {
  filter: alpha(opacity=81);
  opacity: 0.81;
}
.SemiTransparent82 {
  filter: alpha(opacity=82);
  opacity: 0.82;
}
.SemiTransparent83 {
  filter: alpha(opacity=83);
  opacity: 0.83;
}
.SemiTransparent84 {
  filter: alpha(opacity=84);
  opacity: 0.84;
}
.SemiTransparent85 {
  filter: alpha(opacity=85);
  opacity: 0.85;
}
.SemiTransparent86 {
  filter: alpha(opacity=86);
  opacity: 0.86;
}
.SemiTransparent87 {
  filter: alpha(opacity=87);
  opacity: 0.87;
}
.SemiTransparent88 {
  filter: alpha(opacity=88);
  opacity: 0.88;
}
.SemiTransparent89 {
  filter: alpha(opacity=89);
  opacity: 0.89;
}
.SemiTransparent90 {
  filter: alpha(opacity=90);
  opacity: 0.9;
}
.SemiTransparent91 {
  filter: alpha(opacity=91);
  opacity: 0.91;
}
.SemiTransparent92 {
  filter: alpha(opacity=92);
  opacity: 0.92;
}
.SemiTransparent93 {
  filter: alpha(opacity=93);
  opacity: 0.93;
}
.SemiTransparent94 {
  filter: alpha(opacity=94);
  opacity: 0.94;
}
.SemiTransparent95 {
  filter: alpha(opacity=95);
  opacity: 0.95;
}
.SemiTransparent96 {
  filter: alpha(opacity=96);
  opacity: 0.96;
}
.SemiTransparent97 {
  filter: alpha(opacity=97);
  opacity: 0.97;
}
.SemiTransparent98 {
  filter: alpha(opacity=98);
  opacity: 0.98;
}
.SemiTransparent99 {
  filter: alpha(opacity=99);
  opacity: 0.99;
}
.SemiTransparent100 {
  filter: alpha(opacity=100);
  opacity: 1;
}

.txt444444 {
  color: #444444;
}

.txtBranco {
  color: #ffffff;
}

.Blinker {
  filter: alpha(opacity=99);
  opacity: 0.99;
}

.ComSombra {
  border: 1px solid #999999;
  filter: progid:DXImageTransform.Microsoft.Shadow(strength=5,color=gray,direction=135);
}

.ComBordaClara {
  border: 1px solid #cccccc;
}

.QuebraFolha {
  page-break-after: always;
}

.ItemAtivo {
  color: var(--ci-text);
}

.ItemInativo {
  color: var(--ci-text-muted);
}

@keyframes flickerAnimation {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0.3;
  }
  100% {
    opacity: 1;
  }
}

@keyframes flickerAnimation2 {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 1;
  }
  90% {
    opacity: 0.1;
  }
  100% {
    opacity: 1;
  }
}

.fadeBlinker {
  animation: flickerAnimation 1s infinite;
}

.fadeBlinker2 {
  animation: flickerAnimation2 1s infinite;
}

*,
input,
select,
textarea,
option,
button {
  outline: none !important;
}

@media print {
  a[href]::after {
    content: none !important;
  }

  .no-print,
  .no-print * {
    display: none !important;
  }

  font {
    color: #000000;
  }

  /* ??? Modo claro forçado na impressão ????????????????????????????????????
     Garante que qualquer tema escuro (Bootstrap dark, CI escuro/tech/
     personalizado-escuro) seja renderizado como claro ao imprimir.
  ??????????????????????????????????????????????????????????????????????? */
  :root,
  html[data-bs-theme="dark"],
  html[data-ci-theme="escuro"],
  html[data-ci-theme="tech"],
  html[data-ci-theme="personalizado"][data-bs-theme="dark"] {
    color-scheme: light !important;
    /* Bootstrap 5 — variáveis do modo claro */
    --bs-body-color: #212529 !important;
    --bs-body-bg: #ffffff !important;
    --bs-emphasis-color: #000000 !important;
    --bs-secondary-color: rgba(33, 37, 41, 0.75) !important;
    --bs-secondary-bg: #e9ecef !important;
    --bs-tertiary-bg: #f8f9fa !important;
    --bs-border-color: #dee2e6 !important;
    --bs-heading-color: inherit !important;
    --bs-link-color: #0d6efd !important;
    /* CI Theme — valores neutros para impressão */
    --ci-text: #000000 !important;
    --ci-text-muted: #333333 !important;
    --ci-body-bg: #ffffff !important;
    --ci-surface: #ffffff !important;
    --ci-surface-soft: #ffffff !important;
    --ci-surface-alt: #f8f9fa !important;
  }

  html,
  body {
    background-color: #ffffff !important;
    color: #000000 !important;
  }

  /* ??? Barras coloridas: texto preto na impressão ????????????????????????
     As regras normais definem "color: var(--ci-text-contrast) !important"
     nos seletores de barra com especificidade 0,1,1 (classe + elemento).
     Para vencer dois !important com a mesma especificidade, o bloco que
     vem DEPOIS no arquivo prevalece — por isso replicamos os mesmos
     seletores aqui, após as regras normais.
  ??????????????????????????????????????????????????????????????????????? */
  .CiLegacyBar,
  .CiLegacyBar td,
  .CiLegacyBar font,
  .CiLegacyBar b,
  .CiLegacyBar a,
  .CiLegacyGroupBar,
  .CiLegacyGroupBar td,
  .CiLegacyGroupBar font,
  .CiLegacyGroupBar b,
  .CiLegacyGroupBar a,
  .CiToneBar,
  .CiToneBar td,
  .CiToneBar font,
  .CiToneBar b,
  .CiToneBar a,
  .CiToneBarCell,
  .CiToneBarCell font,
  .CiToneBarCell b,
  .CiToneBarCell a,
  .CiToneGroupBar,
  .CiToneGroupBar td,
  .CiToneGroupBar font,
  .CiToneGroupBar b,
  .CiToneGroupBar a,
  .CiToneGroupBarCell,
  .CiToneGroupBarCell font,
  .CiToneGroupBarCell b,
  .CiToneGroupBarCell a,
  .CiToneGroupBarInteractive,
  .CiToneGroupBarInteractive font,
  .CiToneGroupBarInteractive b,
  .CiToneGroupBarInteractive a,
  .print-black {
    color: #000000 !important;
  }

  /* Fundo neutro nas barras para manter a estrutura visual no cupom impresso */
  .CiLegacyBar,
  .CiLegacyGroupBar,
  .CiToneBar,
  .CiToneBarCell,
  .CiToneGroupBar,
  .CiToneGroupBarCell,
  .CiToneGroupBarInteractive {
    background: #cccccc !important;
  }
}

.equipamentoSt {
  background-position: bottom right;
  background-repeat: no-repeat;
}

.EquipTexto {
  font-family: Arial, sans-serif;
  font-size: 13px;
  color: var(--ci-text);
  text-decoration: none;
}

.equipamentoBorda {
  border-radius: 10px;
}

.EquipButton {
  border-collapse: separate;
  border-radius: 8px;
  /* border: 1px solid var(--ci-border); */
  display: inline-block;
}

.sensorDisplayLigado,
.sensorDisplayDesligado {
  padding: 2px;
  font-size: 10px;
  color: var(--ci-sensor-display-on-text);
  font-family: Arial, sans-serif;
  text-decoration: none;
  border-radius: 10px;
  /* border: 1px solid var(--ci-equip-border); */
  box-shadow: var(--ci-equip-shadow);
}

.sensorDisplayLigado {
  background-color: var(--ci-sensor-display-on-bg);
}

.sensorDisplayDesligado {
  background-color: var(--ci-sensor-display-off-bg);
  color: var(--ci-sensor-display-off-text);
}

.padding-4 {
  padding: 4px;
}

.PgMenuSticky,
.BoxRodapeCenter,
.BoxRodapeLeft,
.BoxRodapeRight,
.BoxTopoCenter {
  z-index: 1040;
}

.PgMenuSticky {
  position: sticky;
  bottom: 0;
  background-color: var(--ci-body-bg-soft);
  box-shadow: 0 -2px 4px rgba(0, 0, 0, 0.12);
  padding: 0;
}

.BoxRodapeCenter,
.BoxRodapeLeft,
.BoxRodapeRight,
.BoxTopoCenter {
  position: fixed;
  padding: 2px;
  text-align: center;
  vertical-align: middle;
}

.BoxRodapeCenter {
  bottom: 4px;
  left: 50%;
  transform: translateX(-50%);
}

.BoxRodapeLeft {
  bottom: 4px;
  left: 16px;
}

.BoxRodapeRight {
  bottom: 4px;
  right: 16px;
}

.BoxTopoCenter {
  top: 4px;
  left: 50%;
  transform: translateX(-50%);
}

.Notific-container {
  position: fixed;
  width: 360px;
  bottom: 32px;
  left: 20px;
  background-color: #ffffee;
  color: #ffffff;
  border-radius: 18px;
  text-align: left;
  vertical-align: middle;
  font-size: 16px;
  box-shadow: 0 6px 14px rgba(15, 23, 42, 0.16);
  z-index: 10000;
  cursor: pointer;
}

#fixme {
  position: absolute;
  left: 0;
  top: 0;
}

#fixmetoo {
  position: absolute;
  right: 0;
  bottom: 0;
}

div > div#fixme,
div > div#fixmetoo {
  position: fixed;
}

pre.fixit {
  overflow: auto;
  border-left: 1px dashed #000;
  border-right: 1px dashed #000;
  padding-left: 2px;
}

.CiTopBar {
  width: 98%;
  margin: 0 auto 6px auto;
  border-collapse: separate;
  border-spacing: 0;
  background: var(--ci-header-bg);
  border: 1px solid var(--ci-header-border);
  border-radius: 14px;
  box-shadow: var(--ci-shadow-soft);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}

.CiTopBar td {
  padding: 8px 12px;
  font-size: 11px;
  color: var(--ci-header-text);
}

.CiTopBarBrand {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-weight: 700;
  color: var(--ci-card-title);
}

.CiTopBarVersion,
.CiTopBarMeta {
  color: var(--ci-header-muted);
}

.CiTopBarStatus {
  display: inline-flex;
  align-items: center;
  gap: 3px;
}

.CiTopBarUserWrap {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.CiTopBarUser {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 4px 10px;
  border-radius: 999px;
  background: var(--ci-top-accent);
  color: var(--ci-card-title);
  font-style: normal;
}

.CiThemeBtn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-width: 34px;
  min-height: 34px;
  padding: 0 11px;
  border-radius: 999px;
  border: 1px solid var(--ci-border);
  background: var(--ci-theme-chip-bg);
  color: var(--ci-card-title);
  cursor: pointer;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.06);
  transition:
    transform 0.18s ease,
    box-shadow 0.18s ease,
    border-color 0.18s ease,
    background-color 0.18s ease;
}

.CiThemeBtn:hover,
.CiThemeBtn:focus {
  transform: translateY(-1px);
  border-color: var(--ci-theme-chip-active-border);
  box-shadow: 0 5px 12px rgba(15, 23, 42, 0.1);
}

.CiThemeBtnIcon {
  font-size: 15px;
  line-height: 1;
}

.CiThemeBtnLabel {
  font-size: 11px;
  font-weight: 600;
}

.CiThemeBackdrop {
  position: fixed;
  inset: 0;
  background: var(--ci-overlay-bg);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  z-index: 1090;
  display: none;
}

.CiThemeBackdrop.show {
  display: block;
}

.CiThemeModal {
  position: fixed;
  inset: 0;
  z-index: 1095;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 10px;
}

.CiThemeModal.show {
  display: flex;
}

.CiThemeDialog {
  width: min(760px, 100%);
  max-height: calc(100vh - 20px);
  display: flex;
  flex-direction: column;
  background: var(--ci-surface-soft);
  border: 1px solid var(--ci-border);
  border-radius: 18px;
  box-shadow: var(--ci-shadow-strong);
  overflow: hidden;
}

.CiThemeHeader {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
  padding: 10px 14px 8px;
  border-bottom: 1px solid var(--ci-border);
  background: linear-gradient(
    135deg,
    rgba(13, 110, 253, 0.1),
    rgba(255, 255, 255, 0)
  );
  flex-shrink: 0;
}

.CiThemeTitle {
  margin: 0;
  font-size: 15px;
  font-weight: 700;
  color: var(--ci-card-title);
}

.CiThemeText {
  margin: 2px 0 0 0;
  color: var(--ci-card-subtitle);
  font-size: 11px;
}

.CiThemeClose {
  border: none;
  background: transparent;
  color: var(--ci-text-muted);
  font-size: 22px;
  line-height: 1;
  cursor: pointer;
  padding: 0;
  min-width: 28px;
  flex-shrink: 0;
}

.CiThemeBody {
  padding: 10px 12px 12px;
  overflow-y: auto;
  flex: 1;
}

.CiThemeGrid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(100px, 1fr));
  gap: 8px;
}

.CiThemeOption {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 8px;
  border-radius: 14px;
  border: 1px solid var(--ci-theme-chip-border);
  background: var(--ci-surface);
  box-shadow: var(--ci-shadow-soft);
  cursor: pointer;
  transition:
    transform 0.18s ease,
    box-shadow 0.18s ease,
    border-color 0.18s ease;
}

.CiThemeOption:hover,
.CiThemeOption:focus {
  transform: translateY(-2px);
  border-color: var(--ci-theme-chip-active-border);
  box-shadow: var(--ci-shadow);
}

.CiThemeOption.CiThemeAtivo {
  background: var(--ci-theme-chip-active-bg);
  border-color: var(--ci-theme-chip-active-border);
}

.CiThemePreview {
  height: 60px;
  border-radius: 10px;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.12);
}

.CiThemePreviewBar {
  height: 13px;
  opacity: 0.92;
}

.CiThemePreviewBody {
  display: grid;
  grid-template-columns: 1.15fr 0.85fr;
  gap: 5px;
  height: calc(100% - 13px);
  padding: 5px;
}

.CiThemePreviewMain,
.CiThemePreviewSide {
  border-radius: 10px;
}

.CiThemePreviewMain {
  display: grid;
  grid-template-rows: repeat(3, 1fr);
  gap: 4px;
}

.CiThemePreviewLine {
  border-radius: 8px;
}

/* ?? Seções e botões do modal de ajustes de supervisão ???????? */
.CiAjusteSecao {
  padding: 10px 0;
  border-top: 1px solid var(--ci-border);
  text-align: center;
}
.CiAjusteSecao:first-child {
  border-top: none;
  padding-top: 0;
}
.CiAjusteTitulo {
  display: block;
  font-size: 11px;
  font-weight: 700;
  color: var(--ci-text-muted);
  text-transform: uppercase;
  letter-spacing: 0.06em;
  margin-bottom: 8px;
}
.CiAjusteBtn {
  background: var(--ci-surface);
  border: 1px solid var(--ci-border-strong);
  color: var(--ci-text);
  border-radius: 8px;
  padding: 5px 12px;
  cursor: pointer;
  font-size: 12px;
  font-family: Arial, sans-serif;
  margin: 2px;
  transition:
    background 0.15s ease,
    border-color 0.15s ease;
}
.CiAjusteBtn:hover {
  background: var(--ci-surface-strong);
  border-color: var(--ci-border-strong);
}
.CiAjusteBtnAtivo {
  background: var(--ci-theme-chip-active-bg);
  border: 1px solid var(--ci-theme-chip-active-border);
  color: var(--ci-text);
  border-radius: 8px;
  padding: 5px 12px;
  cursor: pointer;
  font-size: 12px;
  font-family: Arial, sans-serif;
  margin: 2px;
}

.CiThemePreviewSide {
  display: grid;
  grid-template-rows: 1fr 1fr;
  gap: 6px;
}

.CiThemeInfo {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.CiThemeName {
  margin: 0;
  font-size: 12px;
  font-weight: 700;
  color: var(--ci-card-title);
}

.CiThemeDesc {
  margin: 1px 0 0 0;
  color: var(--ci-text-muted);
  font-size: 10px;
}

.CiThemeMark {
  width: 26px;
  height: 26px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--ci-theme-chip-border);
  color: var(--ci-link-color);
  background: rgba(255, 255, 255, 0.7);
  font-weight: 700;
}

.CiThemeStatus {
  margin-top: 10px;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 5px 10px;
  border-radius: 999px;
  background: var(--ci-alert-bg);
  color: var(--ci-alert-fg);
  border: 1px solid var(--ci-alert-border);
  font-size: 11px;
}

.CiThemeStatus strong {
  color: var(--ci-card-title);
}

/* Botão discreto para definir tema padrão do sistema */
.CiBtnTemaPadrao {
  background: none;
  border: 1px solid currentColor;
  border-radius: 12px;
  color: inherit;
  cursor: pointer;
  font-size: 0.72em;
  line-height: 1.4;
  opacity: 0.55;
  padding: 1px 9px;
  margin-left: 7px;
  transition: opacity 0.15s;
  vertical-align: middle;
}
.CiBtnTemaPadrao:hover,
.CiBtnTemaPadrao:focus {
  opacity: 1;
  outline: none;
}
.CiBtnTemaPadrao:disabled {
  opacity: 0.3;
  cursor: not-allowed;
}

/* Controles rápidos de relatório alinhados ao tema atual */
.CiBtnAcaoRelat {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 20px;
  padding: 2px 8px;
  border-radius: 8px;
  border: 1px solid var(--ci-theme-chip-active-border);
  background: linear-gradient(
    135deg,
    color-mix(in srgb, var(--ci-theme-chip-bg) 82%, var(--ci-surface)),
    color-mix(in srgb, var(--ci-top-accent) 88%, transparent)
  );
  color: var(--ci-card-title) !important;
  box-shadow: var(--ci-shadow-soft);
  font-family: Arial, sans-serif;
  font-size: 0.66rem;
  font-weight: 600;
  line-height: 1;
  text-decoration: none;
  transition:
    transform 0.16s ease,
    box-shadow 0.16s ease,
    border-color 0.16s ease,
    background-color 0.16s ease,
    color 0.16s ease;
}

.CiBtnAcaoRelat:hover,
.CiBtnAcaoRelat:focus {
  transform: translateY(-1px);
  border-color: var(--ci-theme-chip-active-border);
  box-shadow: var(--ci-shadow);
  color: var(--ci-link-hover) !important;
  text-decoration: none;
}

.CiBtnAcaoRelat--excel {
  background: linear-gradient(
    135deg,
    color-mix(in srgb, rgba(25, 135, 84, 0.18) 88%, var(--ci-surface)),
    color-mix(in srgb, rgba(25, 135, 84, 0.3) 74%, transparent)
  );
}

.CiDiaSemanaWrap {
  display: inline-flex;
  gap: 0px;
  vertical-align: middle;
  white-space: nowrap;
  margin: 0px;
  padding: 0;
}

.CiDiaSemanaBtn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 18px;
  height: 18px;
  border: 1px solid var(--ci-border-strong);
  border-radius: 4px;
  background: var(--ci-surface);
  color: var(--ci-text-muted);
  font-family: Arial, sans-serif;
  font-size: 8px;
  font-weight: 500;
  cursor: pointer;
  user-select: none;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08);
  transition:
    transform 0.16s ease,
    box-shadow 0.16s ease,
    border-color 0.16s ease,
    background-color 0.16s ease,
    color 0.16s ease;
}

.CiDiaSemanaBtn:hover,
.CiDiaSemanaBtn:focus {
  transform: translateY(-1px);
  border-color: var(--ci-theme-chip-active-border);
  box-shadow: var(--ci-shadow-soft);
  color: var(--ci-card-title);
}

.CiDiaSemanaBtn--ativo {
  background: var(--ci-theme-chip-active-bg);
  border-color: var(--ci-theme-chip-active-border);
  color: var(--ci-card-title);
  box-shadow: var(--ci-shadow-soft);
}

.CiTopAlert {
  background: linear-gradient(
    135deg,
    rgba(245, 158, 11, 0.12),
    rgba(249, 115, 22, 0.08)
  );
  border: 1px solid rgba(245, 158, 11, 0.18);
  color: var(--ci-alert-fg);
  border-radius: 14px;
  padding: 10px 12px;
  box-shadow: var(--ci-shadow-soft);
}

html[data-ci-theme="escuro"] .CiTopBar,
html[data-ci-theme="tech"] .CiTopBar {
  background: color-mix(in srgb, var(--ci-header-bg) 92%, transparent);
}

@media (max-width: 767px) {
  .CiTopBar {
    width: calc(100% - 10px);
  }

  .CiTopBar td {
    padding: 8px 8px;
  }

  .CiThemeBtnLabel {
    display: none;
  }

  .CiThemeDialog {
    border-radius: 14px;
  }
}

/* ???????????????????????????????????????????????????????????
   Card unificado do Tema Personalizado (ocupa 2 colunas do grid)
   ??????????????????????????????????????????????????????????? */
.CiThemeOptionTP {
  grid-column: span 2;
  display: grid;
  grid-template-columns: minmax(90px, 36%) 1fr;
  gap: 10px;
  padding: 8px;
  border-radius: 14px;
  border: 1px solid var(--ci-theme-chip-border);
  background: var(--ci-surface);
  box-shadow: var(--ci-shadow-soft);
  transition:
    border-color 0.18s ease,
    background 0.18s ease;
  cursor: default;
}

.CiThemeOptionTP:hover,
.CiThemeOptionTP:focus-within {
  border-color: var(--ci-theme-chip-active-border);
  box-shadow: var(--ci-shadow);
}

.CiThemeOptionTP.CiThemeAtivo {
  background: var(--ci-theme-chip-active-bg);
  border-color: var(--ci-theme-chip-active-border);
}

/* Botão de seleção (coluna esquerda) */
.CiTPBtnSel {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 0;
  border: none;
  background: transparent;
  cursor: pointer;
  text-align: left;
  width: 100%;
}

.CiTPBtnSel:hover .CiThemePreview {
  opacity: 0.88;
}

/* Formulário inline (coluna direita) */
.CiTPFormInline {
  display: flex;
  flex-direction: column;
  gap: 5px;
  justify-content: center;
  min-width: 0;
}

/* Grade de swatches minimalistas */
.CiTPFISwatches {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
}

.CiTPFISwatch {
  width: 20px;
  height: 20px;
  border-radius: 50%;
  border: 2px solid transparent;
  cursor: pointer;
  outline: none;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.18);
  padding: 0;
  transition:
    transform 0.12s ease,
    border-color 0.12s ease;
}

.CiTPFISwatch:hover,
.CiTPFISwatch:focus {
  transform: scale(1.2);
}

.CiTPFISwatch.CiTPSwatchAtivo {
  border-color: var(--ci-text);
  transform: scale(1.25);
  box-shadow: 0 0 0 2px var(--ci-theme-chip-active-border);
}

/* Botões de modo */
.CiTPFIMode {
  display: flex;
  gap: 4px;
}

.CiTPFIModeBtn {
  font-size: 10px;
  padding: 2px 8px;
  border-radius: 6px;
  border: 1px solid var(--ci-border-strong);
  background: var(--ci-surface);
  color: var(--ci-text);
  cursor: pointer;
  font-family: Arial, sans-serif;
  transition:
    background 0.12s ease,
    border-color 0.12s ease;
  white-space: nowrap;
}

.CiTPFIModeBtn:hover {
  background: var(--ci-surface-strong);
}

.CiTPFIModeBtnAtivo {
  background: var(--ci-theme-chip-active-bg);
  border-color: var(--ci-theme-chip-active-border);
}

/* Linhas de slider */
.CiTPFISliderRow {
  display: flex;
  align-items: center;
  gap: 5px;
  min-width: 0;
}

.CiTPFILabel {
  font-size: 9px;
  font-weight: 700;
  color: var(--ci-text-muted);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  min-width: 30px;
  flex-shrink: 0;
}

.CiTPFIVal {
  font-size: 10px;
  font-weight: 700;
  color: var(--ci-link-color);
  min-width: 26px;
  text-align: right;
  flex-shrink: 0;
}

.CiTPFISlider {
  -webkit-appearance: none;
  appearance: none;
  flex: 1;
  height: 4px;
  border-radius: 2px;
  background: var(--ci-surface-strong);
  outline: none;
  cursor: pointer;
  min-width: 0;
}

.CiTPFISlider::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  width: 13px;
  height: 13px;
  border-radius: 50%;
  background: var(--ci-link-color);
  cursor: pointer;
  border: 1.5px solid var(--ci-surface);
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2);
}

.CiTPFISlider::-moz-range-thumb {
  width: 13px;
  height: 13px;
  border-radius: 50%;
  background: var(--ci-link-color);
  cursor: pointer;
  border: 1.5px solid var(--ci-surface);
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2);
}

/* Painel CiTPPainel (legado — mantido para compatibilidade, não exibido no layout novo) */
.CiTPPainel {
  display: none;
}

/* ================================================================
   CAMPO DE FILTRO DINAMICO - compartilhado entre Menu e Personaliza
   Classes: ci-menu-filter-wrap / ci-menu-filter-ico / ci-menu-filter-inp
   ================================================================ */

.ci-menu-filter-wrap {
  position: relative;
  display: inline-flex;
  align-items: center;
}

.ci-menu-filter-ico {
  position: absolute;
  left: 11px;
  top: 50%;
  transform: translateY(-50%);
  color: var(--ci-text-muted);
  font-size: 0.82rem;
  pointer-events: none;
  line-height: 1;
}

.ci-menu-filter-inp {
  height: 32px;
  padding: 4px 12px 4px 30px;
  border-radius: 999px;
  border: 1px solid var(--ci-border);
  background: var(--ci-surface-alt);
  color: var(--ci-text);
  font-size: 0.8rem;
  width: 120px;
  outline: none;
  transition:
    border-color 0.15s ease-in-out,
    box-shadow 0.15s ease-in-out,
    width 0.2s ease;
}

.ci-menu-filter-inp:focus {
  border-color: var(--ci-top-accent, #0d6efd);
  box-shadow: 0 0 0 3px
    color-mix(in srgb, var(--ci-top-accent, #0d6efd) 18%, transparent);
  width: 180px;
}

.ci-menu-filter-inp::placeholder {
  color: var(--ci-text-muted);
  font-size: 0.78rem;
}

@media (max-width: 667px) {
  .ci-menu-filter-inp {
    width: 60px;
  }
  .ci-menu-filter-inp:focus {
    width: 70px;
  }
}

/* ================================================================
   DESTAQUE DE TEXTO - resultado de busca na pagina (ci-highlight)
   ================================================================ */

.ci-highlight {
  background: #ffe066;
  color: #1a1400;
  border-radius: 2px;
  padding: 0 2px;
}
