/* ==========================================================================
   MÉTODO SALADA NO POTE - RESPONSIVE STYLES
   ========================================================================== */

/* Very small mobile screens (e.g. 320px - 360px) */
@media (max-width: 360px) {
  .quick-actions-grid {
    grid-template-columns: 1fr;
  }
  
  .recipes-grid {
    grid-template-columns: 1fr;
  }
  
  .badge {
    font-size: 0.72rem;
    padding: 3px 7px;
  }
  
  .bottom-nav-btn {
    font-size: 0.68rem;
  }
  
  .brand-logo-img {
    height: 42px;
  }
}

/* Medium & large mobile screens (375px - 600px) */
@media (min-width: 375px) and (max-width: 600px) {
  .recipes-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 12px;
  }

  .recipe-card-content {
    padding: 10px 10px 14px;
  }

  .recipe-card-title {
    font-size: 0.88rem;
    min-height: 2.5em;
    margin-bottom: 6px;
  }

  .recipe-card-category {
    font-size: 0.7rem;
  }

  .badge {
    font-size: 0.72rem;
    padding: 2px 6px;
  }
}

/* Desktop enhancements */
@media (min-width: 1024px) {
  .app-container {
    padding: 0 32px;
  }

  .home-greeting-card {
    padding: 32px 36px;
  }

  .home-greeting-title {
    font-size: 1.7rem;
  }
}