/**
 * HM2 Factory - Correções CSS para o tema administrativo Gin.
 *
 * Carregado apenas em páginas admin via hook_page_attachments().
 */

/* ==========================================================================
   FIX 1: overflow-x no body (gin.css + tableheader.js inline style)
   ==========================================================================
   gin.css define body { overflow-x: hidden } em mobile e overflow-x: auto
   no desktop. O tableheader.js também aplica document.body.style.overflowX
   = "hidden" como inline style quando há sticky header.
   overflow-x: hidden no body força overflow-y: auto (spec CSS), tornando
   o body o scroll container e quebrando cálculos de posição do tableDrag.
   A regra !important supera inline styles sem !important.
   ========================================================================== */

body.gin--horizontal-toolbar,
body.gin--vertical-toolbar,
body.gin--classic-toolbar,
body.gin--navigation,
body.gin--core-navigation {
  overflow-x: initial !important;
  overflow-y: initial !important;
}

/* ==========================================================================
   FIX 2: .gin-table-scroll-wrapper (table.html.twig do Gin)
   ==========================================================================
   O Gin envolve cada tabela em <div class="gin-table-scroll-wrapper"> com
   overflow-x: auto; overflow-y: hidden. O overflow-y: hidden cria um BFC
   que interfere com os cálculos de getBoundingClientRect / offset().top
   durante o drag, fazendo o tableDrag não detectar o drop target correto.
   Voltamos overflow-y para visible para remover a restrição vertical.
   (overflow-x: auto continua via Gin — só sobrescrevemos overflow-y)
   ========================================================================== */

.gin-table-scroll-wrapper {
  overflow-y: visible !important;
}

/* ==========================================================================
   FIX 3: Visibilidade das linhas em drag (Gin oculta em alguns contextos)
   ========================================================================== */

tr.drag,
tr.drag td,
tr.drag-previous,
tr.drag-previous td {
  visibility: visible !important;
  opacity: 1 !important;
}

/* Eleva o handle acima de possíveis sobreposições */
.tabledrag-handle {
  position: relative;
  z-index: 200;
}

/* ==========================================================================
   HM2 FACTORY — Destaque no menu administrativo
   Usa data-drupal-link-system-path para funcionar em todos os temas.
   ========================================================================== */

/* Container do item principal (li) */
li:has(> a[data-drupal-link-system-path="admin/hm2-factory"]) {
  border-left: 4px solid #0055cc !important;
  background: rgba(0, 85, 204, 0.22) !important;
}

/* Link principal */
a[data-drupal-link-system-path="admin/hm2-factory"] {
  color: #0055cc !important;
  font-weight: 700 !important;
}

a[data-drupal-link-system-path="admin/hm2-factory"]:hover {
  color: #003d99 !important;
}

/* Ícone HM2 Factory (grid 2x2 = representa o multisite)
   Gin usa mask-image+background-color; frontend usa background-image.
   Usamos mask-image para unificar: a cor preenche os 4 quadrados.
   Não alteramos width/height — o ::before herda 39px do toolbar (como os demais itens). */
.toolbar-icon-hm2-factory-gerenciamento-dashboard::before {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect x='3' y='3' width='7' height='7' rx='1' fill='white'/%3E%3Crect x='14' y='3' width='7' height='7' rx='1' fill='white'/%3E%3Crect x='3' y='14' width='7' height='7' rx='1' fill='white'/%3E%3Crect x='14' y='14' width='7' height='7' rx='1' fill='white'/%3E%3C/svg%3E") !important;
          mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect x='3' y='3' width='7' height='7' rx='1' fill='white'/%3E%3Crect x='14' y='3' width='7' height='7' rx='1' fill='white'/%3E%3Crect x='3' y='14' width='7' height='7' rx='1' fill='white'/%3E%3Crect x='14' y='14' width='7' height='7' rx='1' fill='white'/%3E%3C/svg%3E") !important;
  -webkit-mask-size: 16px 16px !important;
          mask-size: 16px 16px !important;
  -webkit-mask-repeat: no-repeat !important;
          mask-repeat: no-repeat !important;
  -webkit-mask-position: center center !important;
          mask-position: center center !important;
  background-color: #0055cc !important;
  background-image: none !important;
}

.toolbar-icon-hm2-factory-gerenciamento-dashboard:hover::before,
.toolbar-icon-hm2-factory-gerenciamento-dashboard.is-active::before {
  background-color: #003d99 !important;
}

/* Subitens no toolbar (classe toolbar-icon delimita ao toolbar) */
a.toolbar-icon[data-drupal-link-system-path^="admin/hm2-factory/"] {
  color: #0055cc !important;
}

a.toolbar-icon[data-drupal-link-system-path^="admin/hm2-factory/"]:hover {
  color: #003d99 !important;
}
