/* Compact UI overrides: loaded after styles.css */

/* Layout */
.container { max-width: 1100px; padding-left: 1rem; padding-right: 1rem; }
.header-content { padding: 0.75rem 0; padding-left: 1rem; padding-right: 1rem; }
.main-nav { gap: 1rem; }
.nav-link { padding: 0.35rem 0.5rem; gap: 0.15rem; }
.auth-buttons { gap: 0.5rem; }

/* Logo */
.logo-container img { width: 56px; height: 56px; border-radius: 10px; }

/* Buttons */
.button { padding: 0.6rem 1rem; font-size: 0.85rem; }
.action-btn { padding: 8px; font-size: 0.95rem; }

/* Cards and grids */
.products-grid { grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 0.75rem; }
.product-card { box-shadow: 0 3px 10px rgba(0,0,0,0.12); }
.product-image { height: 160px; }
.product-info { padding: 14px; }
.product-info h4 {
  font-size: 1rem; line-height: 1.2; margin: 0 0 6px 0;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.product-price { font-size: 1.1rem; margin: 0 0 8px 0; }
.product-actions { gap: 8px; padding: 0 14px 14px; }

/* Generic cards */
.detail-card { padding: 18px; border-radius: 12px; }
.section-header { margin-bottom: 18px; }

/* Footer */
.main-footer .footer-content { grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 0.75rem; }

/* Text clamping utility */
.clamp-2 { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.clamp-3 { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }

/* Responsive */
@media (max-width: 768px) {
  .nav-link { padding: 0.35rem 0.5rem; font-size: 0.9rem; }
  .products-grid { grid-template-columns: repeat(2, 1fr); gap: 0.6rem; }
  .product-actions { gap: 0.4rem; }
}

@media (max-width: 480px) {
  .products-grid { grid-template-columns: 1fr; }
}