/* ===========================================
   MegahSakti — Component Styles
   =========================================== */

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

/* Safe area for mobile bottom nav */
.safe-area-bottom {
  padding-bottom: env(safe-area-inset-bottom, 0);
}

/* Flash countdown responsive */
@media (max-width: 640px) {
  .flash-countdown-digit {
    height: 1.75rem;
    width: 1.75rem;
    font-size: 0.75rem;
  }
  .flash-countdown-separator {
    font-size: 0.75rem;
  }
}

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

/* Focus styles */
:focus-visible {
  outline: 2px solid #DC2626;
  outline-offset: 2px;
  border-radius: 4px;
}

/* Custom scrollbar */
.scrollbar-thin::-webkit-scrollbar {
  height: 4px;
}
.scrollbar-thin::-webkit-scrollbar-track {
  background: #F4F4F5;
}
.scrollbar-thin::-webkit-scrollbar-thumb {
  background: #D4D4D8;
  border-radius: 2px;
}

/* WooCommerce form field styling */
.form-row {
  margin-bottom: 1rem;
}

.form-row label {
  display: block;
  font-size: 0.875rem;
  font-weight: 500;
  color: #18181B;
  margin-bottom: 0.375rem;
}

.form-row .input-text,
.form-row input[type="text"],
.form-row input[type="email"],
.form-row input[type="tel"],
.form-row input[type="number"],
.form-row input[type="password"],
.form-row select,
.form-row textarea {
  width: 100%;
  padding: 0.625rem 0.875rem;
  border: 1px solid #E4E4E7;
  border-radius: 0.5rem;
  font-size: 0.875rem;
  color: #18181B;
  background-color: #FAFAFA;
  transition: border-color 0.15s, background-color 0.15s;
}

.form-row .input-text:focus,
.form-row input:focus,
.form-row select:focus,
.form-row textarea:focus {
  border-color: #DC2626;
  background-color: #FFFFFF;
  outline: none;
  box-shadow: 0 0 0 3px rgba(220, 38, 38, 0.1);
}

/* WooCommerce notices */
.woocommerce-notices-wrapper .woocommerce-message,
.woocommerce-notices-wrapper .woocommerce-info,
.woocommerce-notices-wrapper .woocommerce-error {
  padding: 0.875rem 1rem;
  border-radius: 0.75rem;
  font-size: 0.875rem;
  margin-bottom: 1rem;
}

.woocommerce-notices-wrapper .woocommerce-message {
  background-color: #F0FDF4;
  border: 1px solid #BBF7D0;
  color: #166534;
}

.woocommerce-notices-wrapper .woocommerce-error {
  background-color: #FEF2F2;
  border: 1px solid #FECACA;
  color: #991B1B;
}

.woocommerce-notices-wrapper .woocommerce-info {
  background-color: #EFF6FF;
  border: 1px solid #BFDBFE;
  color: #1E40AF;
}

/* Product tabs JS toggle */
[data-tab-content].hidden {
  display: none;
}
