/* Plataforma v4 — biblioteca primeiro, gestão editorial separada. */
#view-plataforma.plat-v4-ready {
  --plat-bg: #15121d;
  --plat-panel: #1d1827;
  --plat-panel-2: #231a2f;
  --plat-border: rgba(169, 126, 200, .22);
  --plat-muted: #a89bb2;
  --plat-copy: #f7f2fa;
  --plat-purple: #7b2fa4;
  --plat-purple-soft: #b583d2;
  --plat-gold: #e6c13d;
  --plat-green: #54d5a5;
  --plat-danger: #ff6477;
  color: var(--plat-copy);
  width: 100%;
  max-width: none;
  padding: clamp(14px, 1.8vw, 28px);
  background:
    radial-gradient(circle at 96% 0%, rgba(123, 47, 164, .11), transparent 30%),
    linear-gradient(180deg, rgba(25, 20, 34, .35), transparent 280px);
}

/* Nunca permita que o shell da Plataforma atravesse para outro módulo.
   A navegação global controla a visibilidade por .hidden. */
#view-plataforma.plat-v4-ready.hidden { display: none !important; }

#view-plataforma.plat-v4-ready > :not(#platV4Shell) { display: none !important; }
#platV4Shell { display: grid; gap: 18px; width: 100%; }

.plat-v4-header {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 24px;
  padding: 6px 2px 4px;
}
.plat-v4-heading { min-width: 0; }
.plat-v4-kicker,
.plat-v4-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  color: var(--plat-gold);
  font: 800 11px/1.2 'Inter', sans-serif;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.plat-v4-heading h2 {
  margin: 7px 0 3px;
  color: var(--plat-copy);
  font-size: clamp(24px, 2vw, 34px);
  font-weight: 800;
  line-height: 1.1;
}
.plat-v4-heading p,
.plat-v4-section-head p {
  margin: 0;
  color: var(--plat-muted);
  font-size: 13px;
  line-height: 1.5;
}
.plat-v4-header-actions { display: flex; align-items: center; gap: 10px; flex: 0 0 auto; }
.plat-v4-btn {
  min-height: 42px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  border-radius: 12px;
  padding: 0 16px;
  font: 800 12px/1 'Inter', sans-serif;
  transition: transform .15s ease, filter .15s ease, border-color .15s ease;
}
.plat-v4-btn:hover { transform: translateY(-1px); filter: brightness(1.08); }
.plat-v4-btn-primary { color: #241b00; background: var(--plat-gold); border: 1px solid var(--plat-gold); }
.plat-v4-btn-secondary { color: #eee4f4; background: rgba(123, 47, 164, .22); border: 1px solid rgba(181, 131, 210, .42); }

.plat-v4-tabs {
  display: flex;
  align-items: center;
  gap: 4px;
  min-height: 52px;
  padding: 5px;
  border: 1px solid var(--plat-border);
  border-radius: 15px;
  background: rgba(20, 16, 28, .72);
  overflow-x: auto;
  scrollbar-width: none;
}
.plat-v4-tabs::-webkit-scrollbar { display: none; }
.plat-v4-tab {
  min-height: 40px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 0 17px;
  border: 1px solid transparent;
  border-radius: 10px;
  color: var(--plat-muted);
  background: transparent;
  font: 800 12px/1 'Inter', sans-serif;
  white-space: nowrap;
  cursor: pointer;
}
.plat-v4-tab:hover { color: #fff; background: rgba(255, 255, 255, .035); }
.plat-v4-tab.is-active {
  color: #fff;
  border-color: rgba(181, 131, 210, .25);
  background: linear-gradient(135deg, rgba(123, 47, 164, .48), rgba(77, 28, 102, .45));
  box-shadow: inset 0 -2px 0 var(--plat-gold);
}

#platV4Biblioteca { display: grid; gap: 16px; min-width: 0; }
#platV4Biblioteca.hidden,
#platV4Gestao.hidden { display: none !important; }

#view-plataforma .plat-v4-search-panel {
  display: grid;
  gap: 12px;
  padding: 14px !important;
  border: 1px solid var(--plat-border) !important;
  border-radius: 15px !important;
  background: rgba(29, 24, 39, .72) !important;
  box-shadow: none !important;
}
#view-plataforma .plat-v4-search-panel > .flex:first-child { margin: 0 !important; }
#view-plataforma .plat-v4-search-panel #filtroMatBusca {
  min-height: 44px;
  font-size: 13px;
}
.plat-v4-quick-filters {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  order: 2;
}
.plat-v4-chip {
  min-height: 32px;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 0 12px;
  border-radius: 999px;
  border: 1px solid rgba(169, 126, 200, .24);
  background: rgba(15, 12, 21, .54);
  color: var(--plat-muted);
  font: 750 11px/1 'Inter', sans-serif;
  cursor: pointer;
}
.plat-v4-chip:hover { color: #fff; border-color: rgba(181, 131, 210, .45); }
.plat-v4-chip.is-active {
  color: #fff;
  border-color: rgba(181, 131, 210, .62);
  background: rgba(123, 47, 164, .38);
}

#view-plataforma #platDescobrir { display: grid; gap: 14px; }
#view-plataforma #platStripsTopo { display: grid; gap: 14px; }
#view-plataforma[data-plat-staff="1"] #platDescobrir:has(#platStripsTopo:empty) { display: none; }
#view-plataforma #platProgressoLateral {
  border-radius: 15px !important;
  background: linear-gradient(135deg, rgba(55, 31, 70, .72), rgba(28, 23, 36, .78)) !important;
  border-color: var(--plat-border) !important;
}

/* O motor cria cartões muito altos para o pior caso. A biblioteca v4 usa
   uma altura de leitura mais humana e deixa cada fileira absorver variações. */
#view-plataforma #gridMateriais { display: block !important; min-width: 0; }
#view-plataforma.plat-v4-ready #btnCorrecaoMonitorBar,
#view-plataforma.plat-v4-ready #btnLixeira_lista_bar { display: none !important; }
#view-plataforma #gridMateriais > .col-span-full { margin-bottom: 22px; }
#view-plataforma #gridMateriais > .col-span-full > .flex:first-child {
  min-height: 34px;
  margin: 0 2px 8px !important;
}
#view-plataforma #gridMateriais .plat-fileira {
  gap: 12px;
  padding: 4px 2px 8px;
  scroll-snap-type: x proximity;
}
#view-plataforma #gridMateriais .plat-fileira .plat-card {
  flex-basis: clamp(252px, 20vw, 306px);
  max-width: clamp(252px, 20vw, 306px);
  min-height: 334px !important;
  scroll-snap-align: start;
  border-color: var(--plat-border);
  border-radius: 15px;
  background: linear-gradient(180deg, rgba(35, 27, 47, .92), rgba(27, 22, 36, .9));
  box-shadow: 0 12px 28px rgba(3, 2, 6, .18);
}
#view-plataforma #gridMateriais .plat-card:hover {
  border-color: rgba(181, 131, 210, .5);
  box-shadow: 0 16px 32px rgba(3, 2, 6, .32);
}
#view-plataforma #gridMateriais .plat-card-title { font-size: 15px; line-height: 1.26; }
#view-plataforma #gridMateriais .plat-card-desc { font-size: 11.5px; color: #b1a5ba; }
#view-plataforma #gridMateriais .plat-meta { font-size: 10.5px; color: #8f8398; }
#view-plataforma #gridMateriais .plat-badge { font-size: 9px; letter-spacing: .03em; }
#view-plataforma #gridMateriais .plat-actions .av-btn-roxo { min-height: 42px; border-radius: 11px !important; }

#platV4Gestao {
  display: grid;
  gap: 18px;
  padding: 20px;
  border: 1px solid var(--plat-border);
  border-radius: 17px;
  background: rgba(26, 21, 35, .72);
}
.plat-v4-section-head { display: flex; justify-content: space-between; gap: 16px; }
.plat-v4-section-head h3 { margin: 5px 0 3px; color: #fff; font-size: 21px; font-weight: 800; }
#platV4GestaoStats #platProgressoLateral { margin: 0; }
.plat-v4-management-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
.plat-v4-management-card {
  min-height: 112px;
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr) 18px;
  align-items: center;
  gap: 13px;
  padding: 16px;
  border: 1px solid var(--plat-border);
  border-radius: 14px;
  background: rgba(19, 15, 26, .62);
  color: #fff;
  text-align: left;
  cursor: pointer;
  transition: border-color .15s ease, transform .15s ease, background .15s ease;
}
.plat-v4-management-card:hover { transform: translateY(-1px); border-color: rgba(181, 131, 210, .48); background: rgba(45, 31, 58, .72); }
.plat-v4-management-card.is-primary { border-color: rgba(230, 193, 61, .42); }
.plat-v4-management-icon {
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  border-radius: 11px;
  color: #eadcf2;
  background: rgba(123, 47, 164, .32);
}
.plat-v4-management-card.is-primary .plat-v4-management-icon { color: #2b2100; background: var(--plat-gold); }
.plat-v4-management-card b { display: block; font: 800 13px/1.25 'Poppins', sans-serif; }
.plat-v4-management-card small { display: block; margin-top: 5px; color: var(--plat-muted); font: 500 11px/1.45 'Inter', sans-serif; }
.plat-v4-legacy-tools:empty { display: none; }
.plat-v4-legacy-tools #painelGeradorListasPlataformaFixo,
.plat-v4-legacy-tools #painelAddMaterial { display: none !important; }

body.theme-light #view-plataforma.plat-v4-ready {
  --plat-bg: #f8f5fa;
  --plat-panel: #fff;
  --plat-panel-2: #f4eef7;
  --plat-border: rgba(91, 31, 126, .18);
  --plat-muted: #706579;
  --plat-copy: #261c2e;
  background: linear-gradient(180deg, #fbf9fc, #f7f3f9 320px);
}
body.theme-light .plat-v4-tabs,
body.theme-light #view-plataforma .plat-v4-search-panel,
body.theme-light #platV4Gestao { background: rgba(255, 255, 255, .88) !important; }
body.theme-light #view-plataforma #gridMateriais .plat-fileira .plat-card { background: #fff; }
body.theme-light .plat-v4-management-card { color: #2c2134; background: #fff; }
body.theme-light .plat-v4-section-head h3 { color: var(--plat-copy); }

@media (max-width: 760px) {
  #view-plataforma.plat-v4-ready { padding: 14px 12px 112px; }
  #platV4Shell { gap: 13px; }
  .plat-v4-header { align-items: flex-start; padding-top: 2px; }
  .plat-v4-heading h2 { font-size: 24px; }
  .plat-v4-heading p { font-size: 12px; max-width: 310px; }
  .plat-v4-header-actions { gap: 6px; }
  .plat-v4-header-actions .plat-v4-btn { width: 42px; min-width: 42px; padding: 0; }
  .plat-v4-header-actions .plat-v4-btn span { display: none; }
  .plat-v4-tabs { width: 100%; }
  .plat-v4-tab { flex: 1 0 auto; padding: 0 12px; }
  #view-plataforma .plat-v4-search-panel { padding: 11px !important; }
  .plat-v4-quick-filters { flex-wrap: nowrap; overflow-x: auto; padding-bottom: 2px; scrollbar-width: none; }
  .plat-v4-quick-filters::-webkit-scrollbar { display: none; }
  .plat-v4-chip { flex: 0 0 auto; }
  #view-plataforma #gridMateriais > .col-span-full { margin-bottom: 18px; }
  #view-plataforma #gridMateriais .plat-fileira .plat-card {
    flex-basis: min(78vw, 300px);
    max-width: min(78vw, 300px);
    min-height: 320px !important;
  }
  #view-plataforma .plat-seta { display: none !important; }
  #platV4Gestao { padding: 15px; }
  .plat-v4-management-grid { grid-template-columns: 1fr; }
  .plat-v4-management-card { min-height: 96px; }
}

@media (min-width: 1500px) {
  #view-plataforma.plat-v4-ready { padding-inline: clamp(28px, 3vw, 54px); }
  #view-plataforma #gridMateriais .plat-fileira .plat-card { flex-basis: 298px; max-width: 298px; }
}
