/* RecipeLab V15.42 — visible component action and safer responsive header. */
.recipe-head .head-buttons {
  display: grid !important;
  grid-template-columns: repeat(3, max-content) !important;
  gap: 10px !important;
  align-items: end !important;
}

.quick-add-component {
  color: #0f8f6a !important;
  border-color: #b9dfd2 !important;
  background: #f2fbf7 !important;
  white-space: nowrap !important;
}

.quick-add-component:hover,
.quick-add-component:focus-visible {
  color: #087454 !important;
  border-color: #72c3a8 !important;
  background: #e6f7f0 !important;
}

.recipe-card,
.workspace-grid,
.table-wrap {
  min-width: 0 !important;
}

@media (max-width: 1180px) {
  .recipe-head {
    grid-template-columns: minmax(220px, 1fr) 190px !important;
  }

  .recipe-head .head-buttons {
    grid-column: 1 / -1 !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 720px) {
  .recipe-head .head-buttons {
    display: grid !important;
    grid-template-columns: 1fr !important;
  }

  .recipe-head .head-buttons button {
    width: 100% !important;
    min-height: 46px !important;
    justify-content: center !important;
  }
}