/*
 * Limpeza visual global.
 *
 * A aba do workspace e o localizador visivel da pagina. O conteudo comeca
 * diretamente pela tarefa: filtros, tabela, indicadores ou abas do cadastro.
 */
:root {
  --primary-nav-height: 58px;
  --workspace-bar-height: 50px;
  --app-header-height: calc(var(--primary-nav-height) + var(--workspace-bar-height));
}

.app-shell {
  display: block;
  min-width: 0;
  min-height: 100vh;
}

.main {
  grid-column: auto;
  width: 100%;
  min-width: 0;
  margin: 0;
}

.visually-hidden {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
  clip: rect(0 0 0 0) !important;
  clip-path: inset(50%) !important;
  white-space: nowrap !important;
  border: 0 !important;
  margin: -1px !important;
  padding: 0 !important;
}

.content {
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 20px clamp(14px, 1.5vw, 24px) 30px;
}

.dashboard-utility {
  display: flex;
  justify-content: flex-end;
  min-height: 36px;
  margin-bottom: 12px;
}

.dashboard-utility .today:empty {
  visibility: hidden;
}

.table-toolbar {
  align-items: center;
}

.table-toolbar-actions {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  margin-left: auto;
}

.table-toolbar-actions .primary-button {
  min-height: 40px;
  padding: 10px 14px;
  white-space: nowrap;
}

.registration-header {
  top: var(--app-header-height);
  align-items: center;
  min-height: 64px;
  padding: 11px 20px;
}

.registration-editor {
  scroll-margin-top: calc(var(--app-header-height) + 12px);
}

.registration-heading {
  flex: 1 1 320px;
}

.registration-heading > p:last-child {
  margin: 0;
}

.registration-actions {
  padding-top: 0;
}

.registration-body {
  min-height: 0;
  padding: 20px 24px 24px;
}

.tab-section-heading {
  margin-bottom: 16px;
}

.section-heading {
  margin: 20px 0 14px;
}

.punch-filter-panel {
  margin-bottom: 14px;
}

.punch-filter-guidance {
  margin: 11px 0 -3px;
  color: var(--muted);
  font-size: var(--type-from-11, 12px);
  line-height: 1.5;
}

.pending-resolution-context {
  grid-template-columns: repeat(3, minmax(0, 1fr)) auto;
  align-items: stretch;
}

.pending-resolution-context > .secondary-button {
  align-self: stretch;
  border-radius: 0;
  padding: 0 18px;
  white-space: nowrap;
}

.monthly-timecard-filter-actions {
  flex-wrap: wrap;
}

#export-monthly-timecard-pdf {
  border: 1px solid #d5e0ec;
  background: #fff;
  color: var(--blue);
}

#export-monthly-timecard-pdf:disabled {
  opacity: .48;
  cursor: not-allowed;
  transform: none;
}

@media (max-width: 1120px) {
  .registration-header {
    display: flex;
    flex-wrap: wrap;
  }

  .registration-actions {
    margin-top: 0;
  }
}

@media (max-width: 760px) {
  .content {
    padding: 14px 10px 22px;
  }

  .dashboard-utility {
    display: none;
  }

  .table-toolbar,
  .journey-toolbar,
  .equipment-toolbar {
    align-items: stretch;
    flex-direction: column;
  }

  .table-toolbar > input {
    max-width: none;
  }

  .table-toolbar-actions {
    width: 100%;
    flex-wrap: wrap;
    justify-content: space-between;
    margin-left: 0;
  }

  .table-toolbar-actions .primary-button {
    flex: 1 1 150px;
  }

  .registration-header {
    position: static;
    display: block;
    min-height: 0;
    padding: 13px 16px;
  }

  .registration-actions {
    margin-top: 11px;
  }

  .registration-body {
    min-height: 0;
    padding: 17px 16px 20px;
  }

  .pending-resolution-context {
    grid-template-columns: 1fr;
  }

  .pending-resolution-context > .secondary-button {
    min-height: 44px;
    padding: 10px 15px;
  }
}

@media (max-width: 420px) {
  .table-toolbar-actions .count-pill,
  .table-toolbar-actions .primary-button {
    width: 100%;
  }

  .table-toolbar-actions .count-pill {
    text-align: center;
  }
}
