/* Reset */
* { -webkit-tap-highlight-color: transparent; }

/* Smooth scroll */
html { scroll-behavior: smooth; }

/* Bottom nav safe area */
footer, nav.fixed { padding-bottom: env(safe-area-inset-bottom, 0); }

/* Active states */
a:active, button:active { opacity: 0.8; }

/* Loading spinner */
@keyframes spin {
  to { transform: rotate(360deg); }
}
.animate-spin { animation: spin 1s linear infinite; }

/* Input focus */
input:focus, textarea:focus, select:focus {
  outline: none;
  box-shadow: 0 0 0 2px rgba(199,169,126,0.3);
}

/* Table styles */
#itemsTable input:focus {
  box-shadow: 0 0 0 2px rgba(199,169,126,0.3);
  background: #fff;
}

/* Prevent zoom on iOS input */
input, textarea, select { font-size: 16px; }

/* Card corner override — Tailwind rounded-[20px] inline preferred */
.card-20 { border-radius: 20px; }

/* Upload zone dashed border */
.upload-dashed {
  background-image: url("data:image/svg+xml,%3csvg width='100%25' height='100%25' xmlns='http://www.w3.org/2000/svg'%3e%3crect width='100%25' height='100%25' fill='none' rx='20' ry='20' stroke='%23C7A97E' stroke-width='2' stroke-dasharray='8%2c 6' stroke-dashoffset='0' stroke-linecap='square'/%3e%3c/svg%3e");
}

/* Before/After slider divider */
.compare-divider {
  position: relative;
}
.compare-divider::after {
  content: '';
  position: absolute;
  top: 0; bottom: 0; left: 50%;
  width: 2px;
  background: #C7A97E;
}

/* Skeleton loading pulse */
@keyframes pulse {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.5; }
}
.skeleton { animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite; }