/* Camada do app: responsividade que os estilos inline dos kits não cobrem. */

.hce-grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.hce-tipos { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; }
.hce-form-body { display: flex; flex-direction: column; gap: 28px; padding: 28px 32px; }
.hce-form-footer {
  display: flex; align-items: center; gap: 16px; padding: 18px 32px;
  background: var(--surface-sunken); border-top: 1px solid var(--border-subtle);
}
.hce-track-grid { display: grid; grid-template-columns: 1fr 1.4fr auto; gap: 12px; align-items: end; }

.hce-metrics { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; }
.hce-dash-cols { display: grid; grid-template-columns: 1.4fr 1fr; gap: 14px; }
.hce-detail-grid { display: grid; grid-template-columns: 1.6fr 1fr; gap: 16px; align-items: start; }
.hce-queue-filters { display: grid; grid-template-columns: 1.6fr 1fr 1fr; gap: 12px; }
.hce-table-wrap { overflow-x: auto; }
.hce-table-wrap table { min-width: 780px; }
.hce-add-row { display: grid; grid-template-columns: 1fr 1fr auto; gap: 12px; align-items: end; }

@media (max-width: 900px) {
  .hce-metrics { grid-template-columns: repeat(2, 1fr); }
  .hce-dash-cols, .hce-detail-grid { grid-template-columns: 1fr; }
  .hce-queue-filters { grid-template-columns: 1fr 1fr; }
  .hce-queue-filters > :first-child { grid-column: 1 / -1; }
}

.hce-portal-logo { height: 38px; }

@media (max-width: 640px) {
  .hce-portal-logo { height: 28px; }
  .hce-portal-nav button { height: 34px !important; padding: 0 12px !important; font-size: 13px !important; }
  .hce-grid-2 { grid-template-columns: 1fr; }
  .hce-tipos { grid-template-columns: repeat(2, 1fr); }
  /* PriorityPicker usa grid inline de 4 colunas — sobrescreve no mobile */
  .hce-prio > div { grid-template-columns: repeat(2, 1fr) !important; }
  .hce-form-body { padding: 20px 16px; gap: 24px; }
  .hce-form-footer { padding: 14px 16px; flex-wrap: wrap; }
  .hce-track-grid { grid-template-columns: 1fr; align-items: stretch; }
  .hce-add-row { grid-template-columns: 1fr; }
  .hce-header-tag { display: none; }
}