/* ============================================================
   Friendcationers — Custom CSS
   ============================================================ */

/* ---------- CSS Variables ---------- */
:root {
  --fc-orange:     #FF5A1F;
  --fc-amber:      #FFA630;
  --fc-navy:       #13263A;
  --fc-navy-soft:  #1E3A55;
  --fc-teal:       #1B8A8A;
  --fc-cream:      #FBF3E7;
  --fc-cream-deep: #F3E6D3;
  --fc-coral:      #FF6F91;
  --fc-indigo:     #5B63D6;
}

/* ---------- Global ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { -webkit-font-smoothing: antialiased; }
img { max-width: 100%; height: auto; display: block; }

/* ---------- Site Header ---------- */
.site-header { z-index: 100 !important; }

/* ---------- Hero Headline Accent ---------- */
.fc-headline-accent {
  background: linear-gradient(180deg, transparent 58%, var(--fc-orange) 58%);
  padding: 0 4px;
}

/* ---------- Eyebrow text ---------- */
.fc-eyebrow { letter-spacing: 0.12em; text-transform: uppercase; opacity: 0.65; }

/* ---------- Wave Divider ---------- */
.fc-wave-divider { line-height: 0; }
.fc-wave-divider svg { display: block; }

/* ---------- Trip Type Stamp Selector ---------- */
.fc-stamp-row {
  display: flex;
  gap: 18px;
  justify-content: center;
  flex-wrap: wrap;
  padding: 20px 8px;
}

.fc-stamp {
  width: 128px;
  height: 128px;
  border-radius: 50%;
  border: 3px dashed var(--c, var(--fc-orange));
  background: var(--fc-cream);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 6px;
  transform: rotate(var(--r, 0deg));
  transition: transform 0.25s ease, background 0.25s ease, box-shadow 0.25s ease;
  font-family: 'Space Mono', monospace;
  cursor: pointer;
  appearance: none;
  -webkit-appearance: none;
}

.fc-stamp:hover, .fc-stamp:focus-visible {
  transform: rotate(0deg) scale(1.06);
  outline: none;
  box-shadow: 0 0 0 3px var(--c, var(--fc-orange));
}

.fc-stamp.active { background: var(--c, var(--fc-orange)); transform: rotate(0deg); }
.fc-ic { font-size: 30px; line-height: 1; }
.fc-lb {
  font-size: 11px; font-weight: 700; letter-spacing: 0.06em;
  text-transform: uppercase; color: var(--c, var(--fc-orange)); line-height: 1.2;
}
.fc-stamp.active .fc-lb { color: #fff; }

/* ---------- WooCommerce Overrides ---------- */
.woocommerce ul.products li.product,
.wc-block-grid__product {
  background: #fff; border-radius: 18px; overflow: hidden;
  transition: transform 0.25s ease; border: 1px solid rgba(19,38,58,0.07);
}
.woocommerce ul.products li.product:hover,
.wc-block-grid__product:hover { transform: translateY(-5px); }

.woocommerce ul.products li.product .woocommerce-loop-product__title,
.wc-block-grid__product-title {
  font-family: 'Bricolage Grotesque', sans-serif; font-weight: 700;
  font-size: 18px; color: var(--fc-navy); padding: 14px 18px 4px;
}

.woocommerce ul.products li.product .price,
.wc-block-grid__product-price {
  font-family: 'Space Mono', monospace; font-weight: 700;
  font-size: 15px; color: var(--fc-navy); padding: 0 18px;
}

.woocommerce ul.products li.product .button,
.woocommerce a.button, .woocommerce button.button,
.wc-block-grid__product-add-to-cart .wp-block-button__link,
.fc-btn-primary {
  background: var(--fc-orange) !important; color: #fff !important;
  font-family: 'Work Sans', sans-serif; font-weight: 700; font-size: 13px;
  border-radius: 20px !important; border: none !important;
  padding: 9px 16px !important; transition: background 0.2s ease !important;
  margin: 10px 18px 18px !important; display: inline-block;
}

.woocommerce ul.products li.product .button:hover,
.woocommerce a.button:hover, .woocommerce button.button:hover,
.fc-btn-primary:hover { background: #e54c14 !important; }

.woocommerce div.product .product_title {
  font-family: 'Bricolage Grotesque', sans-serif; font-weight: 800; color: var(--fc-navy);
}
.woocommerce div.product p.price, .woocommerce div.product span.price {
  font-family: 'Space Mono', monospace; color: var(--fc-orange);
}

.woocommerce nav.woocommerce-pagination ul li a:hover,
.woocommerce nav.woocommerce-pagination ul li span.current {
  background: var(--fc-orange); color: #fff; border-color: var(--fc-orange);
}

/* ---------- Footer ---------- */
.fc-footer-heading {
  font-family: 'Space Mono', monospace !important; font-size: 12px !important;
  letter-spacing: 0.08em; text-transform: uppercase; color: var(--fc-amber) !important;
  margin-bottom: 14px !important;
}
.fc-footer-links { list-style: none !important; padding: 0 !important; margin: 0 !important; }
.fc-footer-links li { margin-bottom: 9px; }
.fc-footer-links a { color: rgba(251,243,231,0.8); font-size: 14px; text-decoration: none; transition: color 0.2s ease; }
.fc-footer-links a:hover { color: #fff; }

/* ---------- Newsletter ---------- */
.fc-newsletter input[type="email"] {
  width: 100%; padding: 11px 14px; border-radius: 8px;
  border: 1px solid rgba(251,243,231,0.25); background: transparent;
  color: #fff; font-size: 13.5px; font-family: 'Work Sans', sans-serif; margin-bottom: 10px;
}
.fc-newsletter input[type="email"]::placeholder { color: rgba(251,243,231,0.5); }
.fc-newsletter button[type="submit"] {
  background: var(--fc-orange); color: #fff; border: none;
  padding: 10px 18px; border-radius: 8px; font-weight: 700; font-size: 13.5px;
  font-family: 'Work Sans', sans-serif; width: 100%; cursor: pointer; transition: background 0.2s ease;
}
.fc-newsletter button[type="submit"]:hover { background: #e54c14; }

/* ---------- Testimonials ---------- */
.fc-testimonial-card { transition: transform 0.2s ease; }
.fc-testimonial-card:hover { transform: translateY(-3px); }

/* ---------- Responsive ---------- */
@media (max-width: 768px) {
  .fc-stamp-row { gap: 14px; }
  .fc-stamp { width: 100px; height: 100px; }
  .fc-ic { font-size: 24px; }
  .fc-lb { font-size: 10px; }
  .woocommerce ul.products { grid-template-columns: repeat(2, 1fr) !important; }
}
@media (max-width: 480px) {
  .fc-stamp { width: 86px; height: 86px; }
  .fc-ic { font-size: 20px; }
  .woocommerce ul.products { grid-template-columns: 1fr !important; }
}

/* ---------- Newsletter JS helper ---------- */
.fc-newsletter-thanks { display: none; color: rgba(251,243,231,0.8); font-size: 13px; margin-top: 8px; }


/* ============================================================
   CART, CHECKOUT & MINI-CART STYLES
   ============================================================ */

/* ---------- Mini-Cart Button (header) ---------- */
.wc-block-mini-cart__button {
  background: transparent !important;
  border: none !important;
  color: var(--fc-navy) !important;
  font-family: 'Work Sans', sans-serif !important;
  font-weight: 600 !important;
  font-size: 15px !important;
  padding: 6px 10px !important;
  border-radius: 20px !important;
  transition: background 0.2s ease, color 0.2s ease !important;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 6px;
}

.wc-block-mini-cart__button:hover {
  background: rgba(255,90,31,0.08) !important;
  color: var(--fc-orange) !important;
}

/* Cart count badge */
.wc-block-mini-cart__quantity-badge {
  background: var(--fc-orange) !important;
  color: #fff !important;
  font-family: 'Space Mono', monospace !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  border-radius: 50% !important;
  width: 20px !important;
  height: 20px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  line-height: 1 !important;
}

/* Mini-cart icon color */
.wc-block-mini-cart__icon { color: var(--fc-navy); }

/* ---------- Mini-Cart Drawer ---------- */
.wc-block-mini-cart__drawer .components-modal__header {
  background: var(--fc-navy);
  color: #fff;
  font-family: 'Bricolage Grotesque', sans-serif;
  font-weight: 800;
}

.wc-block-mini-cart__drawer .components-modal__header-heading {
  color: #fff !important;
  font-family: 'Bricolage Grotesque', sans-serif !important;
}

.wc-block-mini-cart__footer {
  border-top: 1px solid rgba(19,38,58,0.1);
  padding-top: 16px;
}

.wc-block-mini-cart__footer-actions .components-button,
.wc-block-mini-cart__footer .wp-block-button__link {
  border-radius: 30px !important;
  font-weight: 700 !important;
  font-family: 'Work Sans', sans-serif !important;
}

/* View Cart button in drawer — outlined */
.wc-block-mini-cart__footer-actions a:first-child {
  border: 2px solid var(--fc-navy) !important;
  color: var(--fc-navy) !important;
  background: transparent !important;
}
.wc-block-mini-cart__footer-actions a:first-child:hover {
  background: var(--fc-navy) !important;
  color: #fff !important;
}

/* Checkout button in drawer — filled orange */
.wc-block-mini-cart__footer-actions a:last-child,
.wc-block-mini-cart__footer-checkout-link {
  background: var(--fc-orange) !important;
  color: #fff !important;
  border: none !important;
}
.wc-block-mini-cart__footer-actions a:last-child:hover,
.wc-block-mini-cart__footer-checkout-link:hover {
  background: #e54c14 !important;
}

/* ---------- Cart Page ---------- */
.wc-block-cart {
  font-family: 'Work Sans', sans-serif;
}

.wc-block-cart__main-heading,
.wc-block-components-panel .wc-block-components-panel__button {
  font-family: 'Bricolage Grotesque', sans-serif !important;
  font-weight: 700 !important;
  color: var(--fc-navy) !important;
}

/* Cart table header row */
.wc-block-cart-items__header {
  font-family: 'Space Mono', monospace;
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: rgba(19,38,58,0.55);
  border-bottom: 2px solid rgba(19,38,58,0.1);
  padding-bottom: 12px;
}

/* Cart product name */
.wc-block-cart-item__product-name {
  font-family: 'Bricolage Grotesque', sans-serif !important;
  font-weight: 700 !important;
  font-size: 16px !important;
  color: var(--fc-navy) !important;
}

/* Cart product price */
.wc-block-cart-item__prices .wc-block-components-product-price {
  font-family: 'Space Mono', monospace !important;
  font-weight: 700 !important;
  color: var(--fc-navy) !important;
}

/* Remove item button */
.wc-block-cart-item__remove-link {
  color: rgba(19,38,58,0.45) !important;
  font-size: 13px !important;
  transition: color 0.2s ease !important;
}
.wc-block-cart-item__remove-link:hover { color: var(--fc-orange) !important; }

/* Quantity stepper */
.wc-block-components-quantity-selector {
  border: 1.5px solid rgba(19,38,58,0.2) !important;
  border-radius: 8px !important;
  overflow: hidden;
}

.wc-block-components-quantity-selector__button {
  background: var(--fc-cream) !important;
  color: var(--fc-navy) !important;
  border: none !important;
  font-weight: 700 !important;
  transition: background 0.15s ease !important;
}

.wc-block-components-quantity-selector__button:hover {
  background: var(--fc-navy) !important;
  color: #fff !important;
}

/* Order summary panel */
.wc-block-components-totals-wrapper,
.wc-block-cart__payment-options {
  background: var(--fc-cream) !important;
  border-radius: 16px !important;
  border: 1px solid rgba(19,38,58,0.08) !important;
  padding: 24px !important;
}

.wc-block-components-totals-item__label {
  font-family: 'Work Sans', sans-serif !important;
  color: var(--fc-navy-soft) !important;
}

.wc-block-components-totals-item__value {
  font-family: 'Space Mono', monospace !important;
  font-weight: 700 !important;
  color: var(--fc-navy) !important;
}

/* Totals — grand total row */
.wc-block-components-totals-footer-item .wc-block-components-totals-item__label,
.wc-block-components-totals-footer-item .wc-block-components-totals-item__value {
  font-size: 18px !important;
  font-weight: 800 !important;
  color: var(--fc-navy) !important;
}

/* Proceed to Checkout button */
.wc-block-cart__submit-button,
.wc-block-components-checkout-place-order-button {
  background: var(--fc-orange) !important;
  color: #fff !important;
  border: none !important;
  border-radius: 30px !important;
  font-family: 'Work Sans', sans-serif !important;
  font-weight: 700 !important;
  font-size: 16px !important;
  padding: 16px 32px !important;
  width: 100% !important;
  transition: background 0.2s ease !important;
  box-shadow: 0 8px 24px rgba(255,90,31,0.3) !important;
}

.wc-block-cart__submit-button:hover,
.wc-block-components-checkout-place-order-button:hover {
  background: #e54c14 !important;
  box-shadow: 0 12px 28px rgba(255,90,31,0.4) !important;
}

/* ---------- Checkout Page ---------- */
.wc-block-checkout {
  font-family: 'Work Sans', sans-serif;
}

/* Section headings (Contact info, Shipping, Payment) */
.wc-block-components-checkout-step__title {
  font-family: 'Bricolage Grotesque', sans-serif !important;
  font-weight: 800 !important;
  font-size: 20px !important;
  color: var(--fc-navy) !important;
}

.wc-block-components-checkout-step__description {
  color: var(--fc-navy-soft) !important;
  font-size: 14px !important;
}

/* Step number circle */
.wc-block-components-checkout-step__number {
  background: var(--fc-orange) !important;
  color: #fff !important;
  font-family: 'Space Mono', monospace !important;
  font-weight: 700 !important;
}

/* Text inputs */
.wc-block-components-text-input input,
.wc-block-components-text-input select,
.wc-block-components-country-input input,
.wc-block-components-state-input input {
  border: 1.5px solid rgba(19,38,58,0.2) !important;
  border-radius: 8px !important;
  font-family: 'Work Sans', sans-serif !important;
  font-size: 15px !important;
  color: var(--fc-navy) !important;
  padding: 12px 14px !important;
  transition: border-color 0.2s ease !important;
}

.wc-block-components-text-input input:focus,
.wc-block-components-text-input select:focus {
  border-color: var(--fc-orange) !important;
  outline: none !important;
  box-shadow: 0 0 0 3px rgba(255,90,31,0.12) !important;
}

.wc-block-components-label {
  font-weight: 600 !important;
  color: var(--fc-navy) !important;
  font-size: 14px !important;
}

/* Shipping method options */
.wc-block-components-shipping-rates-control__package label {
  font-family: 'Work Sans', sans-serif !important;
  color: var(--fc-navy) !important;
}

/* Payment section */
.wc-block-components-payment-method-label {
  font-family: 'Work Sans', sans-serif !important;
  font-weight: 600 !important;
  color: var(--fc-navy) !important;
}

.wc-block-components-radio-control__input:checked {
  accent-color: var(--fc-orange) !important;
}

/* Stripe card input */
.wc-block-gateway-container iframe {
  border-radius: 8px !important;
}

/* Security badge under checkout button */
.wc-block-checkout__actions .wc-block-checkout__privacy-policy-notice {
  text-align: center;
  font-size: 12.5px;
  color: rgba(19,38,58,0.5);
  margin-top: 12px;
  font-family: 'Space Mono', monospace;
}

/* ---------- Order Confirmation Page ---------- */
.wc-block-order-confirmation-status,
.wc-block-order-confirmation-summary-block {
  font-family: 'Work Sans', sans-serif;
  background: #fff;
  border-radius: 16px;
  border: 1px solid rgba(19,38,58,0.08);
  padding: 28px;
  margin-bottom: 24px;
}

.wc-block-order-confirmation-status__title {
  font-family: 'Bricolage Grotesque', sans-serif !important;
  font-weight: 800 !important;
  color: var(--fc-navy) !important;
}

/* ---------- Coupon code field ---------- */
.wc-block-components-totals-coupon__input input {
  border: 1.5px solid rgba(19,38,58,0.2) !important;
  border-radius: 8px 0 0 8px !important;
  font-family: 'Work Sans', sans-serif !important;
  padding: 11px 14px !important;
}

.wc-block-components-totals-coupon__button {
  background: var(--fc-navy) !important;
  color: #fff !important;
  border-radius: 0 8px 8px 0 !important;
  font-weight: 700 !important;
  font-family: 'Work Sans', sans-serif !important;
  border: none !important;
  padding: 11px 16px !important;
  transition: background 0.2s ease !important;
}

.wc-block-components-totals-coupon__button:hover {
  background: var(--fc-orange) !important;
}


/* ============================================================
   CART BADGE — Explicit display rules
   WooCommerce renders the badge but sometimes hides it via
   its own CSS. These rules ensure it is always visible when
   the count is > 0, using every class variant across WC versions.
   ============================================================ */

.wc-block-mini-cart__badge,
.wc-block-mini-cart__quantity-badge,
.wc-block-mini-cart__items-number {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 20px !important;
  height: 20px !important;
  padding: 0 5px !important;
  border-radius: 10px !important;
  background: var(--fc-orange) !important;
  color: #fff !important;
  font-family: 'Space Mono', monospace !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  position: absolute !important;
  top: -8px !important;
  right: -8px !important;
}

/* Container for the icon + badge together */
.wc-block-mini-cart__icon-wrapper,
.wc-block-mini-cart__button {
  position: relative !important;
}

/* Hide badge when explicitly empty */
.wc-block-mini-cart__badge:empty,
.wc-block-mini-cart__items-number:empty {
  display: none !important;
}


/* ============================================================
   PHP CART ICON (fragment-based, replaces mini-cart block)
   ============================================================ */

.fc-cart-icon {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--fc-navy);
    text-decoration: none;
    padding: 6px;
    border-radius: 8px;
    transition: color 0.2s ease, background 0.2s ease;
}

.fc-cart-icon:hover {
    color: var(--fc-orange);
    background: rgba(255, 90, 31, 0.08);
}

.fc-cart-icon svg {
    display: block;
    flex-shrink: 0;
}

/* Count badge */
.fc-cart-count {
    position: absolute;
    top: -6px;
    right: -6px;
    background: var(--fc-orange);
    color: #fff;
    font-family: 'Space Mono', monospace;
    font-size: 11px;
    font-weight: 700;
    line-height: 1;
    min-width: 20px;
    height: 20px;
    border-radius: 10px;
    padding: 0 5px;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 2px 6px rgba(255, 90, 31, 0.4);
    pointer-events: none;
}
