/**
 * SCPWOO Front-end Styles
 * Colors are intentionally absent — the active theme is responsible for
 * all color theming. Only structural/layout/animation rules live here.
 */

/* Cart shipping calculator — neighborhood field hidden until populated */
#calc_shipping_neighborhood_field {
  display: none;
}

/*
 * Degraded mode fallback: when JS fails to load, show hidden text inputs
 * that sit alongside the selects. JS removes these on successful init.
 */
.scpwoo-noscript-fallback {
  display: none;
}
.no-js .scpwoo-noscript-fallback,
noscript + .scpwoo-noscript-fallback {
  display: block;
}
/* The .scpwoo-noscript-fallback text inputs these rules assume are never actually
   rendered by PHP, so hiding the selects without JS left the customer with no city
   or neighborhood field at all — and no way to order. */

/* ── Free Shipping Progress Badge ────────────────────── */

.scpwoo-free-badge {
  margin-top: 8px;
  padding: 8px 12px;
  background: rgba(0, 0, 0, 0.04);
  border: 1px solid rgba(0, 0, 0, 0.1);
  border-radius: 4px;
}

.scpwoo-free-badge-text {
  font-size: 12px;
  font-weight: 600;
  margin-bottom: 6px;
  line-height: 1.3;
}

.scpwoo-free-badge-bar {
  height: 6px;
  background: rgba(0, 0, 0, 0.1);
  border-radius: 3px;
  overflow: hidden;
}

.scpwoo-free-badge-fill {
  height: 100%;
  background: currentColor;
  opacity: 0.4;
  border-radius: 3px;
  transition: width 0.4s ease;
}

/* Threshold reached — success confirmation */
.scpwoo-free-badge--reached {
  background: rgba(90, 156, 62, 0.12);
  border-color: rgba(90, 156, 62, 0.5);
}
.scpwoo-free-badge--reached .scpwoo-free-badge-text {
  color: #3f7a28;
}
.scpwoo-free-badge--reached .scpwoo-free-badge-text::before {
  content: '\2713\00a0'; /* ✓ + nbsp */
  font-weight: 700;
}
.scpwoo-free-badge--reached .scpwoo-free-badge-fill {
  background: #5a9c3e;
  opacity: 1;
}

/* ── Cascade select loading state ────────────────────── */

/* Class is set on the .woocommerce-input-wrapper parent (supports ::after). */
/* Pure CSS spinner — no data: URI, safe under any CSP. */

@keyframes scpwoo-spin {
  to { transform: rotate(360deg); }
}

.woocommerce-input-wrapper.scpwoo-cascade-loading {
  position: relative;
}

.woocommerce-input-wrapper.scpwoo-cascade-loading::after {
  content: '';
  position: absolute;
  top: 50%;
  right: 10px;
  transform: translateY(-50%);
  width: 16px;
  height: 16px;
  border: 2px solid rgba(0, 0, 0, 0.12);
  border-top-color: currentColor;
  border-radius: 50%;
  animation: scpwoo-spin 0.7s linear infinite;
  pointer-events: none;
}

/* ── Mobile responsive ───────────────────────────────── */

@media (max-width: 600px) {
  .scpwoo-free-badge {
    margin-top: 12px;
  }

  .scpwoo-free-badge-text {
    font-size: 13px;
  }
}

/* Auto-hide country field when store sells to a single supported country */

/*
 * Phase 1 (PHP): invisible but still :visible for jQuery — WC can fire
 * country_to_state_changing and initialise the region/city cascade normally.
 * position:absolute + 1×1 + clip means zero layout footprint.
 */
.scpwoo-country-single {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    pointer-events: none !important;
}

/* Phase 2 (JS): once cascade has initialised, switch to display:none */
.scpwoo-field-hidden {
    display: none !important;
}

/* Chosen pickup point / agency, shown on the order-received page & My Account.
   Colours are left to the theme; only structure is set here. */
.scpwoo-order-pickup {
    margin: 1.5em 0;
    padding: 14px 16px;
    border: 1px solid rgba(0, 0, 0, 0.12);
    border-radius: 6px;
}
.scpwoo-order-pickup-title {
    font-size: 1.1em;
    margin: 0 0 8px;
}
.scpwoo-order-pickup-name {
    margin: 0 0 4px;
}
.scpwoo-order-pickup-line {
    margin: 2px 0;
    font-size: 0.95em;
    opacity: 0.85;
}