/* 
 * GLOBAL THEME CSS
 * 
 * This file is loaded for ALL themes across the application.
 * Add styles here that should apply universally regardless of active theme.
 * 
 * Best Practices:
 * - Use for truly global styles (scrollbars, transitions, etc.)
 * - Avoid theme-specific colors here
 * - Use CSS variables for flexibility
 */

/* Global transitions */
.theme-transition {
  transition: all 0.3s ease;
}

/* Custom homepage content styling (shared across themes) */
.custom-homepage-content {
  line-height: 1.6;
}

.custom-homepage-content img {
  max-width: 100%;
  height: auto;
}

.custom-homepage-content h1,
.custom-homepage-content h2,
.custom-homepage-content h3 {
  margin-top: 1.5rem;
  margin-bottom: 0.75rem;
}

.custom-homepage-content p {
  margin-bottom: 1rem;
}

/* Storeflo content container: 1209px content + 16px side padding */
.storeflo-container,
.container {
  box-sizing: border-box;
  width: 100%;
  max-width: 1580px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 16px;
  padding-right: 16px;
}
@media (max-width: 1760px) {
  .storeflo-container,
  .container {
    max-width: 1280px;
  }
}
@media (max-width: 1440px) {
  .storeflo-container,
  .container {
    max-width: 1100px;
  }
}
@media (max-width: 1280px) {
  .storeflo-container,
  .container {
    max-width: 992px;
  }
}
@media (max-width: 1140px) {
  .storeflo-container,
  .container {
    max-width: 860px;
  }
}
@media (max-width: 1023px) {
  .storeflo-container,
  .container {
    max-width: 100%;
  }
}

/* iOS Safari auto-zooms focused inputs when font-size is below 16px */
@media screen and (max-width: 1023px) {
  input:not(
    [type="checkbox"],
    [type="radio"],
    [type="range"],
    [type="hidden"],
    [type="button"],
    [type="submit"],
    [type="reset"],
    [type="file"],
    [type="image"]
  ),
  select,
  textarea {
    font-size: 16px !important;
  }
}

/* =========================================================
   ORDER LIST BADGES (promeos web parity — all themes)
   Used on /user/orders, dashboard recent activity, etc.
========================================================= */
.badge {
  border-radius: 8px;
  font-weight: 500;
  letter-spacing: 0.25px;
  line-height: 17px;
  text-align: center;
  box-shadow: none;
  text-shadow: none;
}

.badge-3-day-rush {
  background: #ffecfc !important;
  color: #e3026f !important;
  box-shadow: none !important;
}

.badge-proofs-ready,
.badge-standard {
  background: #e3feff !important;
  color: #0576f0 !important;
  box-shadow: none !important;
}

.badge-fulfilled {
  background: #eaf9de !important;
  color: #008a00 !important;
  box-shadow: none !important;
}

.badge-paid {
  background: #eaf9de !important;
  color: #067306 !important;
  box-shadow: none !important;
}

.badge-default {
  background: #c3f4e3 !important;
  color: #14142b !important;
  box-shadow: none !important;
}

/* =========================================================
   ORDER STATUS BADGES
   ========================================================= */
/* SUCCESS */
.badge.status-ready-to-fulfill {
  background-color: #dcfce7 !important;
  color: #374151 !important;
}
.badge.status-fulfilled {
  background-color: #d1fae5 !important;
  color: #374151 !important;
}
.badge.status-pickup {
  background-color: #dcfce7 !important;
  color: #374151 !important;
}
/* ACTIVE / IN PROGRESS */
.badge.status-processing {
  background-color: #dbeafe !important;
  color: #374151 !important;
}
.badge.status-in-production {
  background-color: #e0e7ff !important;
  color: #374151 !important;
}
.badge.status-fulfillment-in-progress {
  background-color: #e0f2fe !important;
  color: #374151 !important;
}
/* NEUTRAL */
.badge.status-unfulfilled {
  background-color: #f3f4f6 !important;
  color: #374151 !important;
}
/* WARNING */
.badge.status-partially-fulfilled {
  background-color: #fef3c7 !important;
  color: #374151 !important;
}
.badge.status-on-hold {
  background-color: #fde68a !important;
  color: #374151 !important;
}
.badge.status-payment-pending {
  background-color: #fff4d6 !important;
  color: #374151 !important;
}
/* VENDOR / EXTERNAL */
.badge.status-sent-to-vendor {
  background-color: #f3e8ff !important;
  color: #374151 !important;
}
.badge.status-ready-to-vendor {
  background-color: #e9d5ff !important;
  color: #374151 !important;
}
/* SHIPPING */
.badge.status-shipped {
  background-color: #ddf4ff !important;
  color: #374151 !important;
}
.badge.status-ready-to-schedule {
  background-color: #e0f2fe !important;
  color: #374151 !important;
}
/* ERROR */
.badge.status-canceled,
.badge.status-cancelled,
.badge.status-order-canceled,
.badge.status-order-cancelled {
  background-color: #fee2e2 !important;
  color: #374151 !important;
}

.badge.status-order-cancelled {
  background-color: #fee2e2 !important;
  color: #374151 !important;
}