/* ============ Global ============ */
html { scroll-behavior: smooth; }

/* ============ Product Cards ============ */
.product-card {
  transition: transform 0.15s ease, box-shadow 0.15s ease, border-color 0.15s ease;
}
.product-card:hover {
  transform: translateY(-2px);
  border-color: #a8a29e;
  box-shadow: 0 4px 12px rgba(0,0,0,0.04);
}

/* ============ Accordion ============ */
.accordion-toggle {
  cursor: pointer;
  user-select: none;
  transition: background-color 0.15s ease;
}
.accordion-toggle:hover {
  background-color: #f5f5f4;
}
.accordion-content {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 0;
  overflow: hidden;
  transition: max-height 0.3s ease, opacity 0.2s ease, padding 0.3s ease;
  max-height: 3000px;
  opacity: 1;
}
.accordion-content.collapsed {
  max-height: 0;
  opacity: 0;
  padding-top: 0;
  padding-bottom: 0;
}
.accordion-arrow {
  transition: transform 0.2s ease;
  display: inline-block;
}
.accordion-arrow.open {
  transform: rotate(90deg);
}

/* ============ Cart ============ */
#cartSidebar { transition: transform 0.3s ease; }

/* ============ Toast ============ */
#toast { transition: opacity 0.25s ease, visibility 0.25s ease; }

/* ============ Featured ============ */
.featured-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
}

/* ============ Input focus ring ============ */
input:focus, textarea:focus, select:focus {
  outline: none;
  border-color: #78716c;
}

/* ============ Scrollbar ============ */
::-webkit-scrollbar { width: 4px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: #d6d3d1; }
::-webkit-scrollbar-thumb:hover { background: #a8a29e; }

/* ============ Line clamp ============ */
.line-clamp-2 {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
