/* ========================================================================== 
   FÊNIX GESTOR DE TRÁFEGO
   Camada visual premium isolada do restante da Agenda.
   O prefixo .trf- e body.trf-modo impedem que esta identidade vaze.
   ========================================================================== */

body.trf-modo {
  --trf-bg: #f4f6fa;
  --trf-surface: #ffffff;
  --trf-surface-2: #fafbfe;
  --trf-line: #e3e7ef;
  --trf-line-strong: #d6dce7;
  --trf-text: #172033;
  --trf-text-2: #475467;
  --trf-muted: #7a8497;
  --trf-primary: #6840c6;
  --trf-primary-2: #8c63db;
  --trf-primary-soft: #f2edff;
  --trf-success: #16835d;
  --trf-success-soft: #e9f8f1;
  --trf-warning: #a96608;
  --trf-warning-soft: #fff7e7;
  --trf-danger: #bd3e4b;
  --trf-danger-soft: #fff0f2;
  --trf-shadow: 0 9px 28px rgba(28, 38, 62, .065);
  background: var(--trf-bg);
  color: var(--trf-text);
}

body.trf-modo #main,
body.trf-modo #view {
  background: var(--trf-bg);
}

body.trf-modo #view {
  padding: 0;
}

body.trf-modo #topbar {
  display: none;
}

body.trf-modo #rodape {
  background: #fff;
  border-top-color: var(--trf-line);
  color: var(--trf-muted);
}

body.trf-modo #rodape b {
  color: var(--trf-primary);
}

body.trf-modo #taskbar {
  background: rgba(255, 255, 255, .96);
  border-top: 1px solid var(--trf-line);
  box-shadow: 0 -5px 18px rgba(28, 38, 62, .035);
  backdrop-filter: blur(10px);
}

body.trf-modo #taskbar .tab {
  background: #fff;
  border-color: var(--trf-line);
  color: var(--trf-text-2);
}

body.trf-modo #taskbar .tab:hover {
  border-color: #c8b9ec;
  color: var(--trf-primary);
}

body.trf-modo #taskbar .tab.on {
  background: var(--trf-primary);
  border-color: var(--trf-primary);
  color: #fff;
  box-shadow: 0 5px 14px rgba(104, 64, 198, .2);
}

/* Barra própria */
body.trf-modo #sidebar {
  width: 226px;
  padding: 0;
  gap: 0;
  align-items: stretch;
  overflow-y: auto;
  background: linear-gradient(180deg, #fff 0%, #fcfbff 68%, #f8f5ff 100%);
  border-right: 1px solid var(--trf-line);
  box-shadow: 5px 0 22px rgba(42, 31, 76, .035);
}

body.trf-modo .trf-marca {
  min-height: 84px;
  padding: 17px 16px 18px;
  gap: 11px;
  border-bottom: 1px solid #eeeaf7;
}

body.trf-modo .trf-marca-ic,
body.trf-modo .trf-perfil-ic,
body.trf-modo .trf-eu-av {
  display: grid;
  place-items: center;
  overflow: hidden;
  background: linear-gradient(145deg, #fbf9ff, #eee7ff);
  border: 1px solid #e4d9fb;
  box-shadow: none;
}

body.trf-modo .trf-marca-ic {
  width: 43px;
  height: 43px;
  border-radius: 13px;
}

body.trf-modo .trf-marca-ic img {
  width: 47px;
  height: 47px;
  object-fit: contain;
}

body.trf-modo .trf-marca b {
  color: var(--trf-text);
  font-size: 15px;
  letter-spacing: 1.55px;
}

body.trf-modo .trf-marca small {
  margin-top: 3px;
  color: var(--trf-muted);
  font-size: 9px;
  letter-spacing: .7px;
}

body.trf-modo .trf-item {
  width: calc(100% - 20px);
  min-height: 41px;
  margin: 2px 10px;
  padding: 10px 12px;
  border-radius: 10px;
  color: #596579;
  font-size: 13px;
  transition: background .14s ease, color .14s ease, transform .14s ease;
}

body.trf-modo .trf-item:hover {
  color: var(--trf-primary);
  background: #f7f3ff;
  transform: translateX(1px);
}

body.trf-modo .trf-item.on {
  color: #5732af;
  background: var(--trf-primary-soft);
  box-shadow: inset 3px 0 0 var(--trf-primary);
  font-weight: 700;
}

body.trf-modo .trf-item.on .trf-ic {
  color: var(--trf-primary);
}

body.trf-modo #sidebar .sep {
  flex: 1;
  min-height: 18px;
}

body.trf-modo .trf-rodape {
  padding: 12px 10px 14px;
  margin-top: 8px;
  border-top: 1px solid #ece8f5;
}

body.trf-modo .trf-perfil {
  padding: 9px 10px;
  background: rgba(255, 255, 255, .72);
  border: 1px solid #ece7f7;
  border-radius: 12px;
}

body.trf-modo .trf-perfil-ic {
  width: 34px;
  height: 34px;
  border-radius: 10px;
}

body.trf-modo .trf-perfil-ic img,
body.trf-modo .trf-eu-av img {
  width: 38px;
  height: 38px;
  object-fit: contain;
}

body.trf-modo .trf-perfil b {
  color: var(--trf-text);
}

body.trf-modo .trf-perfil small,
body.trf-modo .trf-voltar {
  color: var(--trf-muted);
}

/* Área principal e cabeçalho */
body.trf-modo .trf-raiz {
  min-height: 100%;
  padding: 20px 24px 28px;
  color: var(--trf-text);
  background:
    linear-gradient(180deg, rgba(248, 246, 255, .8), rgba(244, 246, 250, 0) 280px),
    var(--trf-bg);
}

body.trf-modo .trf-raiz::before,
body.trf-modo .trf-raiz::after {
  content: none !important;
  display: none !important;
}

body.trf-modo .trf-cab {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-bottom: 16px;
  padding: 13px 15px;
  background: rgba(255, 255, 255, .88);
  border: 1px solid var(--trf-line);
  border-radius: 16px;
  box-shadow: 0 4px 16px rgba(28, 38, 62, .035);
  backdrop-filter: blur(10px);
}

body.trf-modo .trf-cab-ident {
  display: flex;
  align-items: center;
  gap: 11px;
  min-width: 230px;
}

body.trf-modo .trf-cab-marca {
  display: grid;
  width: 42px;
  height: 42px;
  flex: none;
  place-items: center;
  overflow: hidden;
  border: 1px solid #e7def8;
  border-radius: 12px;
  background: #f8f5ff;
}

body.trf-modo .trf-cab-marca img {
  width: 46px;
  height: 46px;
  object-fit: contain;
}

body.trf-modo .trf-cab-supra {
  display: block;
  margin: 0 0 2px;
  color: var(--trf-primary) !important;
  font-size: 9.5px !important;
  font-weight: 750;
  letter-spacing: .7px;
  text-transform: uppercase;
}

body.trf-modo .trf-cab h1 {
  margin: 0;
  color: var(--trf-text);
  font-size: 21px;
  font-weight: 750;
  line-height: 1.1;
  letter-spacing: -.25px;
}

body.trf-modo .trf-cab-ident > div > span:last-child {
  display: block;
  margin-top: 3px;
  color: var(--trf-muted);
  font-size: 11.5px;
}

body.trf-modo .trf-cab-dir {
  margin-left: auto;
  gap: 8px;
}

body.trf-modo .trf-cab-status,
body.trf-modo .trf-config-status,
body.trf-modo .trf-cover-status {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--trf-success);
  font-size: 10.5px;
  font-weight: 700;
  white-space: nowrap;
}

body.trf-modo .trf-cab-status {
  padding: 6px 9px;
  border: 1px solid #cdeadd;
  border-radius: 999px;
  background: var(--trf-success-soft);
}

body.trf-modo .trf-cab-status i,
body.trf-modo .trf-config-status i,
body.trf-modo .trf-cover-status i {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: currentColor;
}

body.trf-modo .trf-cab-status.inativa,
body.trf-modo .trf-config-status.inativa,
body.trf-modo .trf-cover-status.inativa {
  color: var(--trf-danger);
  border-color: #f0cdd2;
  background: var(--trf-danger-soft);
}

body.trf-modo .trf-sel,
body.trf-modo .trf-busca {
  color: var(--trf-text-2);
  background: #fff;
  border: 1px solid var(--trf-line-strong);
  box-shadow: 0 1px 2px rgba(16, 24, 40, .025);
}

body.trf-modo .trf-sel:hover,
body.trf-modo .trf-busca:hover {
  border-color: #bca9e5;
}

body.trf-modo .trf-sel:focus,
body.trf-modo .trf-busca:focus {
  outline: 3px solid rgba(104, 64, 198, .12);
  border-color: #8f71d1;
  background: #fff;
}

body.trf-modo .trf-busca::placeholder {
  color: #9aa3b2;
}

body.trf-modo .trf-ic-bt,
body.trf-modo .trf-bt {
  color: var(--trf-primary);
  background: #fff;
  border: 1px solid var(--trf-line-strong);
  box-shadow: 0 1px 2px rgba(16, 24, 40, .025);
}

body.trf-modo .trf-ic-bt:hover,
body.trf-modo .trf-bt:hover {
  color: #5530ad;
  background: #f8f5ff;
  border-color: #bca9e5;
}

body.trf-modo .trf-bt.cheio {
  color: #fff;
  background: linear-gradient(135deg, #7550ce, #5e38b9);
  border-color: transparent;
  box-shadow: 0 7px 17px rgba(104, 64, 198, .18);
}

body.trf-modo .trf-eu-txt b {
  color: var(--trf-text);
}

body.trf-modo .trf-eu-txt small {
  color: var(--trf-muted);
}

body.trf-modo .trf-eu-av {
  width: 38px;
  height: 38px;
  border-radius: 50%;
}

/* Capa */
body.trf-modo .trf-cover {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 260px;
  min-height: 205px;
  margin-bottom: 16px;
  overflow: hidden;
  background:
    radial-gradient(circle at 84% 30%, rgba(151, 111, 224, .2), transparent 38%),
    linear-gradient(115deg, #22143d 0%, #392364 48%, #6241a5 100%);
  border: 1px solid rgba(86, 54, 143, .45);
  border-radius: 20px;
  box-shadow: 0 15px 34px rgba(46, 28, 82, .16);
}

body.trf-modo .trf-cover::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(90deg, rgba(255, 255, 255, .035) 1px, transparent 1px);
  background-size: 38px 100%;
  opacity: .22;
}

body.trf-modo .trf-cover-conteudo {
  position: relative;
  z-index: 2;
  align-self: center;
  padding: 28px 32px;
}

body.trf-modo .trf-cover-selo {
  display: inline-flex;
  padding: 5px 9px;
  color: #dfd3ff;
  background: rgba(255, 255, 255, .09);
  border: 1px solid rgba(255, 255, 255, .16);
  border-radius: 999px;
  font-size: 9.5px;
  font-weight: 750;
  letter-spacing: .8px;
  text-transform: uppercase;
}

body.trf-modo .trf-cover h2 {
  max-width: 620px;
  margin: 12px 0 7px;
  color: #fff;
  font-size: clamp(24px, 2.1vw, 34px);
  font-weight: 760;
  line-height: 1.08;
  letter-spacing: -.7px;
}

body.trf-modo .trf-cover p {
  max-width: 590px;
  margin: 0;
  color: #d5cae9;
  font-size: 13px;
  line-height: 1.55;
}

body.trf-modo .trf-cover-meta {
  display: flex;
  align-items: center;
  gap: 9px;
  margin-top: 18px;
  flex-wrap: wrap;
}

body.trf-modo .trf-cover-meta > span {
  padding: 5px 9px;
  color: #e5ddf4;
  background: rgba(255, 255, 255, .08);
  border: 1px solid rgba(255, 255, 255, .12);
  border-radius: 999px;
  font-size: 10.5px;
}

body.trf-modo .trf-cover-meta .trf-cover-status {
  color: #aee8cf;
  background: rgba(38, 170, 116, .13);
  border-color: rgba(145, 232, 197, .24);
}

body.trf-modo .trf-cover-meta .trf-cover-status.inativa {
  color: #ffc5cb;
  background: rgba(207, 69, 83, .15);
  border-color: rgba(255, 197, 203, .2);
}

body.trf-modo .trf-cover-arte {
  position: relative;
  z-index: 1;
  display: grid;
  place-items: center;
  min-height: 205px;
}

body.trf-modo .trf-cover-arte img {
  width: 275px;
  max-width: 112%;
  height: 235px;
  object-fit: contain;
  filter: drop-shadow(0 15px 22px rgba(18, 8, 34, .3));
}

/* Carregamento, erro e vazio */
body.trf-modo .trf-carregando {
  min-height: 330px;
  margin-top: 12px;
  padding: 45px 20px;
  justify-content: center;
  color: var(--trf-muted);
  background: #fff;
  border: 1px solid var(--trf-line);
  border-radius: 18px;
  box-shadow: var(--trf-shadow);
}

body.trf-modo .trf-carregando-marca {
  display: grid;
  width: 82px;
  height: 82px;
  margin-bottom: 3px;
  place-items: center;
  overflow: hidden;
  background: #f8f5ff;
  border: 1px solid #e7def8;
  border-radius: 23px;
}

body.trf-modo .trf-carregando-marca img {
  width: 91px;
  height: 91px;
  object-fit: contain;
}

body.trf-modo .trf-carregando b {
  color: var(--trf-text);
  font-size: 14px;
}

body.trf-modo .trf-spin {
  width: 25px;
  height: 25px;
  border-color: #e5dff2;
  border-top-color: var(--trf-primary);
}

body.trf-modo .trf-erro {
  display: flex;
  align-items: center;
  gap: 20px;
  padding: 25px;
  text-align: left;
  color: var(--trf-text-2);
  background: #fff;
  border: 1px solid #efd5d9;
  border-left: 4px solid var(--trf-danger);
  box-shadow: var(--trf-shadow);
}

body.trf-modo .trf-erro-marca {
  display: grid;
  width: 86px;
  height: 86px;
  flex: none;
  place-items: center;
  overflow: hidden;
  background: #fbf8ff;
  border-radius: 20px;
}

body.trf-modo .trf-erro-marca img {
  width: 94px;
  height: 94px;
  object-fit: contain;
  filter: grayscale(.25);
}

body.trf-modo .trf-erro-conteudo {
  min-width: 0;
}

body.trf-modo .trf-erro-rotulo {
  display: block;
  margin-bottom: 4px;
  color: var(--trf-danger);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .7px;
  text-transform: uppercase;
}

body.trf-modo .trf-erro b {
  display: block;
  color: var(--trf-text);
  font-size: 16px;
}

body.trf-modo .trf-erro p {
  margin: 6px 0 0;
  color: var(--trf-muted);
  font-size: 12.5px;
  line-height: 1.5;
}

body.trf-modo .trf-erro-acoes {
  display: flex;
  gap: 8px;
  margin-top: 14px;
  flex-wrap: wrap;
}

body.trf-modo .trf-erro button {
  margin-top: 0;
}

body.trf-modo .trf-vazio-premium {
  display: flex;
  min-height: 115px;
  padding: 20px;
  align-items: center;
  justify-content: center;
  gap: 12px;
  color: var(--trf-muted);
  background: var(--trf-surface-2);
  border: 1px dashed #d8dfea;
  border-radius: 13px;
  text-align: left;
}

body.trf-modo .trf-vazio-ic {
  display: grid;
  width: 40px;
  height: 40px;
  flex: none;
  place-items: center;
  color: #8b71c7;
  background: #f1ecfb;
  border-radius: 12px;
}

body.trf-modo .trf-vazio-ic svg {
  width: 19px;
  height: 19px;
}

body.trf-modo .trf-vazio-premium b,
body.trf-modo .trf-vazio-premium span {
  display: block;
}

body.trf-modo .trf-vazio-premium b {
  color: var(--trf-text-2);
  font-size: 12.5px;
}

body.trf-modo .trf-vazio-premium div > span {
  margin-top: 3px;
  font-size: 11.5px;
  line-height: 1.45;
}

/* Cards e caixas */
body.trf-modo .trf-card,
body.trf-modo .trf-cx,
body.trf-modo .trf-kpi2 {
  background: var(--trf-surface);
  border: 1px solid var(--trf-line);
  box-shadow: var(--trf-shadow);
}

body.trf-modo .trf-card {
  min-height: 126px;
  padding: 17px 18px;
  border-radius: 15px;
  transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease;
}

body.trf-modo .trf-card:hover {
  border-color: #d6cbea;
  box-shadow: 0 12px 28px rgba(35, 35, 62, .085);
  transform: translateY(-1px);
}

body.trf-modo .trf-card-rot,
body.trf-modo .trf-kpi2 i {
  color: var(--trf-muted);
}

body.trf-modo .trf-card-val,
body.trf-modo .trf-kpi2 b {
  color: var(--trf-text);
}

body.trf-modo .trf-var i,
body.trf-modo .trf-var.vazio i,
body.trf-modo .trf-kpi2 span {
  color: #8b94a5;
}

body.trf-modo .trf-var.bom,
body.trf-modo .trf-verde {
  color: var(--trf-success);
}

body.trf-modo .trf-var.ruim,
body.trf-modo .trf-verm {
  color: var(--trf-danger);
}

body.trf-modo .trf-amb {
  color: var(--trf-warning);
}

body.trf-modo .trf-forte {
  color: var(--trf-primary);
}

body.trf-modo .trf-card-ic {
  box-shadow: none;
}

body.trf-modo .trf-card-ic.roxo {
  color: #6840c6;
  background: #f1ecfb;
}

body.trf-modo .trf-card-ic.azul {
  color: #286bc2;
  background: #eaf3ff;
}

body.trf-modo .trf-card-ic.verde {
  color: #16835d;
  background: #e9f8f1;
}

body.trf-modo .trf-card-ic.laranja {
  color: #b06d14;
  background: #fff3e5;
}

body.trf-modo .trf-cx {
  padding: 17px;
  border-radius: 15px;
}

body.trf-modo .trf-cx-cab b,
body.trf-modo .trf-cria-txt b,
body.trf-modo .trf-legenda b,
body.trf-modo .trf-gal-txt > b,
body.trf-modo .trf-gal-num b,
body.trf-modo .trf-cp-txt b,
body.trf-modo .trf-cj-cab b,
body.trf-modo .trf-kv b,
body.trf-modo .trf-al b,
body.trf-modo .trf-insight b,
body.trf-modo .trf-rec b {
  color: var(--trf-text);
}

body.trf-modo .trf-dica,
body.trf-modo .trf-nota,
body.trf-modo .trf-sub2,
body.trf-modo .trf-cria-txt span,
body.trf-modo .trf-cria-num span,
body.trf-modo .trf-legenda em,
body.trf-modo .trf-cp-txt span,
body.trf-modo .trf-cp-num span,
body.trf-modo .trf-cj-kv i,
body.trf-modo .trf-kv i {
  color: var(--trf-muted);
}

body.trf-modo .trf-link {
  color: var(--trf-primary);
  border-top-color: var(--trf-line);
}

body.trf-modo .trf-link:hover {
  color: #4f2ca7;
}

body.trf-modo .trf-leg {
  color: var(--trf-muted);
}

body.trf-modo .trf-leg .p1 { background: #6d4bd1; }
body.trf-modo .trf-leg .p2 { background: #3478db; }
body.trf-modo .trf-leg .p3 { background: #159b83; }

/* Alertas e leituras */
body.trf-modo .trf-alerta {
  background: var(--trf-danger-soft);
  border-color: #f0d1d5;
}

body.trf-modo .trf-alerta-ic {
  color: #fff;
  background: var(--trf-danger);
}

body.trf-modo .trf-alerta b {
  color: #9f2f3d;
}

body.trf-modo .trf-alerta span {
  color: #80545b;
}

body.trf-modo .trf-aviso {
  color: #77551d;
  background: var(--trf-warning-soft);
  border-color: #efdba9;
}

body.trf-modo .trf-aviso b {
  color: #8e5a06;
}

body.trf-modo .trf-aviso.urg {
  color: #80545b;
  background: var(--trf-danger-soft);
  border-color: #efcbd0;
}

body.trf-modo .trf-aviso.urg b {
  color: var(--trf-danger);
}

body.trf-modo .trf-al,
body.trf-modo .trf-leitura {
  background: var(--trf-surface-2);
  border-color: var(--trf-line);
}

body.trf-modo .trf-al span,
body.trf-modo .trf-leitura span,
body.trf-modo .trf-insight span,
body.trf-modo .trf-rec span {
  color: var(--trf-text-2);
}

body.trf-modo .trf-al.grave {
  background: var(--trf-danger-soft);
  border-left-color: var(--trf-danger);
}

body.trf-modo .trf-al.grave b { color: #9f2f3d; }

body.trf-modo .trf-al.atencao {
  background: var(--trf-warning-soft);
  border-left-color: #d59122;
}

body.trf-modo .trf-al.atencao b { color: #8d5a08; }

body.trf-modo .trf-al.info {
  background: #eef6ff;
  border-left-color: #4d87cc;
}

body.trf-modo .trf-al.info b { color: #285f9f; }

body.trf-modo .trf-leitura b {
  color: var(--trf-primary);
}

body.trf-modo .trf-insight-ic {
  color: var(--trf-primary);
  background: var(--trf-primary-soft);
  box-shadow: none;
}

body.trf-modo .trf-rec {
  border-left-color: var(--trf-primary);
}

/* Tabelas */
body.trf-modo table,
body.trf-modo .trf-tab {
  color: var(--trf-text-2);
  background: transparent;
}

body.trf-modo .trf-tab th {
  padding: 9px 10px;
  color: #778296;
  background: #f8f9fc;
  border-bottom: 1px solid var(--trf-line);
}

body.trf-modo .trf-tab td,
body.trf-modo .trf-tab tbody tr:nth-child(even) td {
  padding: 10px;
  color: var(--trf-text-2);
  background: #fff;
  border-bottom: 1px solid #edf0f5;
}

body.trf-modo .trf-tab tbody tr:nth-child(even) td {
  background: #fcfcfe;
}

body.trf-modo .trf-tab tbody tr:hover td,
body.trf-modo .trf-tab tbody tr.trf-top:hover td {
  background: #f6f2ff;
}

body.trf-modo .trf-tab tbody tr.trf-top td {
  background: #faf8ff;
}

body.trf-modo .trf-tab td b,
body.trf-modo .trf-tab td strong {
  color: var(--trf-text);
}

body.trf-modo .trf-tab td .trf-forte,
body.trf-modo .trf-tab td.trf-forte {
  color: var(--trf-primary);
}

body.trf-modo .trf-tab td.trf-verm,
body.trf-modo .trf-tab td .trf-verm {
  color: var(--trf-danger);
}

body.trf-modo .trf-tab td.trf-amb {
  color: var(--trf-warning);
}

body.trf-modo .trf-tab td.trf-dica,
body.trf-modo .trf-tab td .trf-dica,
body.trf-modo .trf-tab td .trf-sub2 {
  color: var(--trf-muted);
}

body.trf-modo .trf-tab th.ordenavel:hover,
body.trf-modo .trf-tab th.ord {
  color: var(--trf-primary);
  background: #f4efff;
}

body.trf-modo .trf-pt {
  background: #c2c9d4;
}

body.trf-modo .trf-pt.on {
  background: var(--trf-success);
  box-shadow: 0 0 0 3px rgba(22, 131, 93, .12);
}

body.trf-modo .trf-viv,
body.trf-modo .trf-gal-viv {
  color: #0f6848;
  background: #ddf5e9;
}

/* Criativos, árvore e recortes */
body.trf-modo .trf-cria img,
body.trf-modo .trf-gal-img img,
body.trf-modo .trf-mini img,
body.trf-modo .trf-img-sem,
body.trf-modo span.trf-img-sem,
body.trf-modo .trf-cria-sem,
body.trf-modo .trf-gal-sem {
  background: #f1f3f7;
  border-color: var(--trf-line);
}

body.trf-modo .trf-img-sem,
body.trf-modo span.trf-img-sem {
  color: #98a1b0;
}

body.trf-modo .trf-cria-num b,
body.trf-modo .trf-cp-num b,
body.trf-modo .trf-ad b,
body.trf-modo .trf-gal-tit {
  color: var(--trf-primary);
}

body.trf-modo .trf-legenda span,
body.trf-modo .trf-cj-kv div,
body.trf-modo .trf-ad,
body.trf-modo .trf-gal-corpo {
  color: var(--trf-text-2);
}

body.trf-modo .trf-gal,
body.trf-modo .trf-cp,
body.trf-modo .trf-cj {
  background: #fff;
  border-color: var(--trf-line);
  box-shadow: 0 5px 16px rgba(28, 38, 62, .04);
}

body.trf-modo .trf-gal-img {
  background: #f1f3f7;
}

body.trf-modo .trf-gal-num,
body.trf-modo .trf-cp-corpo {
  border-color: var(--trf-line);
}

body.trf-modo .trf-cp-cab {
  background: #fafbfe;
}

body.trf-modo .trf-cp-cab:hover {
  background: #f5f1ff;
}

body.trf-modo .trf-cp-corpo,
body.trf-modo .trf-pub,
body.trf-modo .trf-ad {
  background: #f7f8fb;
}

body.trf-modo .trf-pub {
  color: var(--trf-text-2);
}

body.trf-modo .trf-modo {
  color: var(--trf-primary);
  background: var(--trf-primary-soft);
}

body.trf-modo .trf-seta {
  color: var(--trf-muted);
}

body.trf-modo .trf-kv div {
  background: #f8f9fc;
  border: 1px solid #edf0f5;
}

/* Funil */
body.trf-modo .trf-fn-total {
  border-top-color: var(--trf-line);
}

body.trf-modo .trf-fn-total span,
body.trf-modo .trf-fn-total b {
  color: var(--trf-primary);
}

body.trf-modo .trf-fn-total em,
body.trf-modo .trf-fn-n span,
body.trf-modo .trf-fn-n i {
  color: var(--trf-muted);
}

body.trf-modo .trf-fn-n b {
  color: var(--trf-text);
}

/* Integrações */
body.trf-modo .trf-int {
  background: #fff;
  border-color: var(--trf-line);
}

body.trf-modo .trf-int.on {
  background: #fbfefd;
  border-color: #cfe9dd;
}

body.trf-modo .trf-int.pendente {
  background: #fffaf1;
  border-color: #efdfbd;
}

body.trf-modo .trf-int.leitura {
  background: #faf8ff;
  border-color: #e3daf7;
}

body.trf-modo .trf-int-ic {
  display: grid;
  width: 39px;
  height: 39px;
  flex: none;
  place-items: center;
  color: var(--trf-primary);
  background: var(--trf-primary-soft);
  border-radius: 11px;
}

body.trf-modo .trf-int-ic svg {
  width: 19px;
  height: 19px;
}

body.trf-modo .trf-int b {
  color: var(--trf-text);
}

body.trf-modo .trf-int small {
  color: var(--trf-muted);
}

body.trf-modo .trf-int em {
  color: var(--trf-text-2);
  background: #f1f3f7;
}

body.trf-modo .trf-int.on em {
  color: var(--trf-success);
  background: var(--trf-success-soft);
}

body.trf-modo .trf-int.pendente em {
  color: var(--trf-warning);
  background: var(--trf-warning-soft);
}

body.trf-modo .trf-int.leitura em {
  color: var(--trf-primary);
  background: var(--trf-primary-soft);
}

/* Configuração e estado de login/conexão */
body.trf-modo .trf-config-capa {
  display: flex;
  align-items: center;
  gap: 17px;
  margin-bottom: 15px;
  padding: 19px 21px;
  color: #fff;
  background: linear-gradient(120deg, #2b194c, #513187 62%, #724db0);
  border-radius: 18px;
  box-shadow: 0 13px 30px rgba(50, 30, 87, .15);
}

body.trf-modo .trf-config-marca {
  display: grid;
  width: 70px;
  height: 70px;
  flex: none;
  place-items: center;
  overflow: hidden;
  background: rgba(255, 255, 255, .09);
  border: 1px solid rgba(255, 255, 255, .16);
  border-radius: 18px;
}

body.trf-modo .trf-config-marca img {
  width: 78px;
  height: 78px;
  object-fit: contain;
}

body.trf-modo .trf-config-capa > div:nth-child(2) {
  flex: 1;
  min-width: 0;
}

body.trf-modo .trf-config-capa > div > span {
  color: #d8c9f2;
  font-size: 9.5px;
  font-weight: 750;
  letter-spacing: .7px;
  text-transform: uppercase;
}

body.trf-modo .trf-config-capa h2 {
  margin: 4px 0 3px;
  color: #fff;
  font-size: 21px;
}

body.trf-modo .trf-config-capa p {
  margin: 0;
  color: #d6cbe8;
  font-size: 12px;
}

body.trf-modo .trf-config-status {
  padding: 6px 10px;
  color: #aee8cf;
  background: rgba(25, 137, 94, .22);
  border: 1px solid rgba(174, 232, 207, .22);
  border-radius: 999px;
}

body.trf-modo .trf-config-status.inativa {
  color: #ffc5cb;
  background: rgba(189, 62, 75, .22);
  border-color: rgba(255, 197, 203, .2);
}

body.trf-modo .trf-config-grade {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(300px, .65fr);
  gap: 15px;
}

body.trf-modo .trf-config-grade .trf-cx {
  margin-bottom: 0;
}

body.trf-modo .trf-kv-config {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

body.trf-modo .trf-config-acesso {
  display: flex;
  flex-direction: column;
}

body.trf-modo .trf-config-leitura {
  display: flex;
  gap: 12px;
  padding: 13px;
  color: var(--trf-text-2);
  background: #f7f4ff;
  border: 1px solid #e4dcf7;
  border-radius: 12px;
}

body.trf-modo .trf-config-leitura-ic {
  display: grid;
  width: 38px;
  height: 38px;
  flex: none;
  place-items: center;
  color: var(--trf-primary);
  background: #fff;
  border-radius: 10px;
}

body.trf-modo .trf-config-leitura-ic svg {
  width: 19px;
  height: 19px;
}

body.trf-modo .trf-config-leitura b,
body.trf-modo .trf-config-leitura span {
  display: block;
}

body.trf-modo .trf-config-leitura b {
  color: var(--trf-text);
  font-size: 12.5px;
}

body.trf-modo .trf-config-leitura span {
  margin-top: 4px;
  color: var(--trf-muted);
  font-size: 11.5px;
  line-height: 1.5;
}

body.trf-modo .trf-config-acoes {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-top: auto;
  padding-top: 16px;
}

body.trf-modo .trf-config-acoes p {
  margin: 0;
  color: var(--trf-muted);
  font-size: 11.5px;
}

/* Modal de imagem continua escuro para preservar contraste da peça. */
body.trf-modo .trf-lupa {
  background: rgba(19, 15, 29, .88);
}

body.trf-modo .trf-lupa img {
  background: #fff;
  border-color: rgba(255, 255, 255, .18);
}

body.trf-modo .trf-lupa-pe span {
  color: #f4f1f9;
}

/* Compatibilidade da antiga entrada Anúncios para permissões já cadastradas. */
.an-topo-premium {
  align-items: center;
  padding: 13px 15px;
  background: #fff;
  border: 1px solid #e3e7ef;
  border-radius: 15px;
  box-shadow: 0 6px 18px rgba(28, 38, 62, .045);
}

.an-marca-premium {
  display: grid;
  width: 44px;
  height: 44px;
  flex: none;
  place-items: center;
  overflow: hidden;
  background: #f5f1ff;
  border: 1px solid #e5dcf7;
  border-radius: 12px;
}

.an-marca-premium img {
  width: 49px;
  height: 49px;
  object-fit: contain;
}

.an-topo-premium .an-titulo {
  color: #172033;
  font-weight: 750;
}

.an-topo-premium .an-sel,
.an-topo-premium .an-bt {
  background: #fff;
  border-color: #d6dce7;
}

.an-topo-premium + .an-selo-leitura {
  margin: 10px 0 14px;
  color: #5f4a8a;
  background: #f7f4ff;
  border-color: #e3daf7;
  border-radius: 11px;
}

/* Entrada antiga de Anúncios, exibida apenas durante a troca de view. */
.mkt-alias-carregando,
.mkt-alias-erro {
  display: flex;
  min-height: 320px;
  padding: 30px;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 7px;
  color: #667085;
  text-align: center;
  background: #fff;
  border: 1px solid #e3e7ef;
  border-radius: 18px;
}

.mkt-alias-carregando img {
  width: 104px;
  height: 104px;
  margin-bottom: 5px;
  object-fit: contain;
}

.mkt-alias-carregando b,
.mkt-alias-erro b {
  color: #172033;
  font-size: 15px;
}

.mkt-alias-carregando span,
.mkt-alias-erro span {
  font-size: 12px;
}

/* Rolagem e acessibilidade */
body.trf-modo *::-webkit-scrollbar {
  width: 9px;
  height: 9px;
}

body.trf-modo *::-webkit-scrollbar-track {
  background: transparent;
}

body.trf-modo *::-webkit-scrollbar-thumb {
  background: #cbd1dc;
  border: 2px solid transparent;
  border-radius: 9px;
  background-clip: content-box;
}

body.trf-modo *::-webkit-scrollbar-thumb:hover {
  background: #aeb6c5;
  background-clip: content-box;
}

body.trf-modo button:focus-visible,
body.trf-modo select:focus-visible,
body.trf-modo input:focus-visible {
  outline: 3px solid rgba(104, 64, 198, .2);
  outline-offset: 2px;
}

@media (max-width: 1180px) {
  body.trf-modo .trf-cab-status,
  body.trf-modo .trf-eu-txt {
    display: none;
  }

  body.trf-modo .trf-config-grade {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 1100px) {
  body.trf-modo #sidebar {
    width: 76px;
  }

  body.trf-modo .trf-item span:last-child,
  body.trf-modo .trf-marca > div:last-child,
  body.trf-modo .trf-perfil > div:last-child {
    display: none;
  }

  body.trf-modo .trf-marca {
    justify-content: center;
    padding-inline: 9px;
  }

  body.trf-modo .trf-item {
    justify-content: center;
  }

  body.trf-modo .trf-cover {
    grid-template-columns: minmax(0, 1fr) 205px;
  }

  body.trf-modo .trf-cover-arte img {
    width: 225px;
  }
}

@media (max-width: 780px) {
  body.trf-modo .trf-raiz {
    padding: 13px;
  }

  body.trf-modo .trf-cab {
    align-items: flex-start;
    padding: 12px;
  }

  body.trf-modo .trf-cab-dir {
    width: 100%;
    margin-left: 0;
  }

  body.trf-modo .trf-cab-dir .trf-sel {
    flex: 1;
  }

  body.trf-modo .trf-cover {
    grid-template-columns: 1fr;
    min-height: 0;
  }

  body.trf-modo .trf-cover-conteudo {
    padding: 24px;
  }

  body.trf-modo .trf-cover-arte {
    position: absolute;
    right: -45px;
    bottom: -55px;
    min-height: 190px;
    opacity: .2;
  }

  body.trf-modo .trf-cover-conteudo {
    padding-right: 70px;
  }

  body.trf-modo .trf-erro {
    align-items: flex-start;
    flex-direction: column;
  }

  body.trf-modo .trf-erro-marca {
    width: 64px;
    height: 64px;
  }

  body.trf-modo .trf-config-capa {
    align-items: flex-start;
    flex-wrap: wrap;
  }

  body.trf-modo .trf-config-status {
    margin-left: 87px;
  }

  body.trf-modo .trf-kv-config {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 560px) {
  body.trf-modo .trf-cab-marca,
  body.trf-modo .trf-eu {
    display: none;
  }

  body.trf-modo .trf-cover h2 {
    font-size: 24px;
  }

  body.trf-modo .trf-cover-conteudo {
    padding: 22px 18px;
  }

  body.trf-modo .trf-config-marca {
    width: 58px;
    height: 58px;
  }

  body.trf-modo .trf-config-status {
    width: 100%;
    margin-left: 0;
    justify-content: center;
  }

  body.trf-modo .trf-config-acoes {
    align-items: stretch;
    flex-direction: column;
  }
}

@media (prefers-reduced-motion: reduce) {
  body.trf-modo .trf-item,
  body.trf-modo .trf-card,
  body.trf-modo .trf-clicavel {
    transition: none;
  }
}
