/* ==========================================================================
   Buen Camino Theme
   Version 2.1
   ========================================================================== */


/* ==========================================================================
   01. Design Tokens
   ========================================================================== */

:root {
  --bc-ink: #1F2A44;
  --bc-stone: #F5F5F4;
  --bc-yellow: #F7C948;
  --bc-red: #B23A48;
  --bc-border: #E8E8E8;
  --bc-radius: 16px;
  --bc-radius-sm: 12px;
}


/* ==========================================================================
   02. Global Styles
   ========================================================================== */

html { scroll-behavior: smooth; }
body { font-family: system-ui, -apple-system, sans-serif; color: #111; -webkit-font-smoothing: antialiased; }


/* ==========================================================================
   03. Buttons
   ========================================================================== */

.button, .wp-element-button, .wp-block-button__link,
.woocommerce a.button, .woocommerce button.button,
.bc-backtotop-btn, a.bc-button, .woocommerce-message a.button,
.woocommerce-info a.button, .wc-block-cart__return-to-shop-button,
.xoo-wsc-footer .button, .xoo-wsc-cart-active .xoo-wsc-btn,
.xoo-wsc-ft-btn-checkout, .bc-contact-form input[type="submit"],
.bc-contact-form button[type="submit"] {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  background: var(--bc-yellow) !important;
  color: #111 !important;
  border-radius: 9999px !important;
  padding: 12px 28px !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  transition: all 0.2s ease;
  border: none !important;
  box-shadow: 0 4px 10px rgba(0,0,0,0.08);
  cursor: pointer;
}

.button:hover, .wp-element-button:hover, .bc-backtotop-btn:hover, 
.xoo-wsc-ft-btn-checkout:hover, .bc-contact-form input[type="submit"]:hover,
.bc-contact-form button[type="submit"]:hover {
  background: #111 !important;
  color: #fff !important;
  transform: translateY(-2px);
}

/* ---------- Alignment Logic ---------- */
.bc-backtotop-wrapper, .bc-back-to-shop, .bc-cta, 
.wp-block-button.is-content-justification-center,
.woocommerce-message, .woocommerce-info {
  display: flex !important;
  justify-content: center !important;
  width: 100% !important;
  text-align: center;
}

.bc-back-to-shop {
  margin-bottom: 20px;
}

/* ---------- Blog Post & Action Buttons ---------- */

a.bc-button,
.bc-backtotop-btn {
  padding: 9px 20px !important;
  font-size: 0.95rem !important;
}


/* ==========================================================================
   04. Header & Navigation
   ========================================================================== */

/* Reset header action buttons (Cart, Search, Account) */
.site-header button, .site-header a.button,
.wc-block-product-search__button, button[type="submit"].search-submit, 
.search-submit, .wp-block-search__button {
  background: transparent !important;
  border: none !important;
  padding: 0 10px !important;
  box-shadow: none !important;
  color: inherit !important;
  border-radius: 0 !important;
}

.site-header button:hover, .site-header a:hover {
  opacity: 0.7;
  transition: opacity 0.2s ease;
}

.wc-block-product-search__button svg,
.search-submit svg,
.wp-block-search__button svg {
  width: 20px !important;
  height: 20px !important;
  fill: currentColor;
}

/* Desktop Logo */
.wp-block-site-logo {
  width: 92px !important;
}

.wp-block-site-logo img {
  width: 92px !important;
  max-width: 92px !important;
  height: auto !important;
}

/* Mobile Header */
@media (max-width: 768px) {
  header.wp-block-template-part .wc-blocks-pattern-header-minimal {
    padding-top: 10px !important;
    padding-bottom: 10px !important;
  }

  .wp-block-site-logo {
    flex: 0 0 76px !important; 
    width: 76px !important;
  }
  
  .wp-block-site-logo img {
    width: 76px !important;
    max-width: 76px !important;
    height: auto !important;
  }
}


/* ==========================================================================
   05. Top Bar
   ========================================================================== */

.bc-topbar-wrapper {
  width: 100vw;
  margin-left: calc(50% - 50vw);
  background: var(--bc-ink) !important;
  color: var(--bc-yellow);
  overflow: hidden; 
  white-space: nowrap;
  padding: 10px 0;
  display: flex;
}

.bc-topbar-content {
  display: flex;
  animation: bc-marquee 25s linear infinite;
}

.bc-topbar-item {
  display: flex;
  align-items: center;
  padding: 0 100px !important;
  font-weight: 600;
  font-size: 14px;
  flex-shrink: 0;
}

@keyframes bc-marquee {
  0% { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}


/* ==========================================================================
   06. Breadcrumbs
   ========================================================================== */

.woocommerce-breadcrumb {
  font-size: 12px !important;
  color: #777 !important;
  margin-bottom: 20px !important;
}

.single-product .woocommerce-breadcrumb {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 300px;
}


/* ==========================================================================
   07. WooCommerce Layout & Purchase Area
   ========================================================================== */

.single-product .woocommerce.product > .wp-block-columns > .wp-block-column:nth-child(2) > .wp-block-post-title {
  margin-bottom: 8px !important;
}

.single-product .woocommerce.product > .wp-block-columns > .wp-block-column:nth-child(2) > .bc-product-price {
  margin: 0 0 28px !important;
}

.single-product .woocommerce.product > .wp-block-columns > .wp-block-column:nth-child(2) > .wp-block-woocommerce-add-to-cart-with-options {
  margin-top: 10px !important;
}

.single-product .woocommerce-variation-add-to-cart {
  display: flex;
  align-items: center;
  gap: 16px;
  width: 100%;
  margin-top: 18px;
}

.single-product .woocommerce-variation-add-to-cart .quantity {
  flex: 0 0 82px;
  margin: 0;
}

.single-product .woocommerce-variation-add-to-cart .qty {
  width: 100%;
  height: 56px;
  text-align: center;
  font-size: 1rem;
  border-radius: 10px;
}

.single-product .woocommerce-variation-add-to-cart .single_add_to_cart_button {
  flex: 1;
  height: 56px;
  min-width: 0;
  width: auto;
  padding: 0;
  font-size: 1.15rem;
  font-weight: 700;
  border-radius: 999px;
}


/* ==========================================================================
   08. Product Layout
   ========================================================================== */

.bc-policy-list {
  margin: 0 0 1rem;
  padding-left: 1.25rem;
}

.bc-policy-list li {
  margin-bottom: .55rem;
  line-height: 1.6;
}

.bc-policy-list + p {
  margin-top: 1rem;
}

.bc-policy-list + p a {
  font-weight: 600;
  text-decoration: none;
}

.bc-policy-list + p a:hover {
  text-decoration: underline;
}

.single-product .woocommerce.product > .wp-block-columns {
  margin-bottom: 16px !important;
}

.single-product .wp-block-column > p:empty {
  display: none !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  min-height: 0 !important;
}

.single-product .woocommerce.product > .wp-block-columns > .wp-block-column:nth-child(2) > * {
  margin-block-start: 0 !important;
  margin-block-end: 10px !important;
}

.single-product .woocommerce-product-gallery {
  margin-bottom: 0 !important;
}

.single-product .flex-control-thumbs {
  display: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

.single-product .woocommerce-product-gallery__wrapper {
  margin-bottom: 0 !important;
}


/* ==========================================================================
   09. Product Typography
   ========================================================================== */

.single-product .woocommerce.product > .wp-block-columns > .wp-block-column:nth-child(2) > .wp-block-post-title {
  font-size: 2rem;
  font-weight: 700 !important;
  line-height: 1.15;
  letter-spacing: -0.015em;
  color: var(--bc-ink);
}

.single-product .woocommerce.product > .wp-block-columns > .wp-block-column:nth-child(2) .woocommerce-product-rating {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 0 0 18px;
  font-size: .95rem;
  color: #666;
}

.single-product .woocommerce.product > .wp-block-columns > .wp-block-column:nth-child(2) .woocommerce-review-link {
  color: #666;
  text-decoration: none;
}

.single-product .woocommerce.product > .wp-block-columns > .wp-block-column:nth-child(2) .woocommerce-review-link:hover {
  color: var(--bc-ink);
}


/* ==========================================================================
   10. Trust Icons
   ========================================================================== */

.single-product .bc-trust-icons {
  margin: 12px 0 28px !important;
  padding: 0 !important;
}

.bc-trust-icons ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

.bc-trust-icons li {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 0 0 10px;
  line-height: 1.35;
  font-size: 1rem;
  font-weight: 500;
  color: var(--bc-ink);
}

.bc-trust-icons li:last-child {
  margin-bottom: 0;
}

.bc-trust-icons .emoji {
  flex: 0 0 24px;
  text-align: center;
  font-size: 1.1rem;
}


/* ==========================================================================
   11. Accordion
   ========================================================================== */

.single-product .wp-block-accordion {
  margin: 8px 0 24px;
  border-top: 1px solid var(--bc-border);
}

.single-product .wp-block-accordion-item {
  border-bottom: 1px solid var(--bc-border);
}

.single-product .wp-block-accordion-heading {
  margin: 0 !important;
  padding: 0 !important;
}

.single-product .wp-block-accordion-heading__toggle {
  min-height: 64px;
  padding: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 1.35rem;
  font-weight: 600;
  color: var(--bc-ink);
  transition: .25s;
}

.single-product .wp-block-accordion-heading__toggle:hover {
  color: var(--bc-yellow);
}

.single-product .wp-block-accordion-panel {
  padding: 0 0 20px;
  font-size: 1rem;
  line-height: 1.7;
}

.single-product .wp-block-accordion-heading__toggle-icon {
  font-size: 28px;
  font-weight: 300;
  transition: transform .25s ease;
  color: var(--bc-ink);
}

.single-product .wp-block-accordion-item.is-open .wp-block-accordion-heading__toggle-icon {
  transform: rotate(45deg);
}

.single-product .wp-block-accordion-panel p {
  margin-bottom: 16px;
}

.single-product .wp-block-accordion-panel ul {
  margin: 16px 0 16px 22px;
}

.single-product .wp-block-accordion-panel li {
  margin-bottom: 8px;
}

.single-product .wp-block-accordion + .wp-block-woocommerce-product-collection {
  margin-top: 32px;
}


/* ==========================================================================
   12. Related Products
   ========================================================================== */

.single-product .wp-block-woocommerce-product-collection > .wp-block-heading {
  margin: 0 0 28px !important;
  font-size: 1.6rem;
  font-weight: 700;
  line-height: 1.2;
  color: var(--bc-ink);
}

.single-product .wp-block-woocommerce-product-collection .wc-block-product-template {
  align-items: stretch;
}

.single-product .wp-block-woocommerce-product-collection .wc-block-product {
  display: flex;
  flex-direction: column;
  height: 100%;
}

.single-product .wp-block-woocommerce-product-collection .wc-block-product .wp-block-post-title {
  margin: 16px 0 10px !important;
  font-size: 1.05rem !important;
  font-weight: 600 !important;
  line-height: 1.3 !important;
  letter-spacing: 0 !important;
}

.single-product .wp-block-woocommerce-product-collection .wp-block-woocommerce-product-button {
  margin-top: auto;
}

.single-product .wp-block-woocommerce-product-collection .wp-block-woocommerce-product-button .wp-element-button {
  min-width: 180px;
}

.single-product .wp-block-woocommerce-product-collection .wc-block-components-product-image {
  margin-bottom: 0;
}

.single-product .wp-block-woocommerce-product-collection .wc-block-components-product-image img {
  width: 100%;
  height: auto;
  display: block;
}

.single-product .wp-block-woocommerce-product-collection .wp-block-woocommerce-product-sale-badge {
  min-width: auto;
  padding: 7px 9px;
  border-radius: 6px;
  font-size: .78rem;
  font-weight: 700;
  line-height: 1.05;
}

.single-product .wp-block-woocommerce-product-collection .wp-block-woocommerce-product-price {
  margin: 0 0 18px !important;
  font-size: .95rem;
  line-height: 1.4;
}

.single-product .wp-block-woocommerce-product-collection .wp-block-woocommerce-product-price del {
  color: #777;
  font-size: .88rem;
  font-weight: 400;
  opacity: .8;
}

.single-product .wp-block-woocommerce-product-collection .wp-block-woocommerce-product-price ins {
  color: var(--bc-ink);
  font-size: 1rem;
  font-weight: 700;
  text-decoration: none;
}

.single-product .wp-block-woocommerce-product-collection .wp-block-woocommerce-product-price small {
  font-size: .78rem;
  font-weight: 400;
  color: #666;
}


/* ==========================================================================
   13. Contact Us Page
   ========================================================================== */

.bc-contact-container {
  max-width: 1100px;
  margin: 0 auto;
  padding: 40px 20px;
}

.bc-contact-header {
  text-align: center;
  margin-bottom: 40px;
}

.bc-contact-header h1 {
  font-size: 2.5rem;
  font-weight: 700;
  color: var(--bc-ink);
  margin-bottom: 12px;
}

.bc-contact-header p {
  font-size: 1.15rem;
  color: #555;
  max-width: 600px;
  margin: 0 auto;
}

.bc-contact-grid {
  display: grid;
  grid-template-columns: 1fr 1.5fr;
  gap: 40px;
}

.bc-contact-card {
  background-color: var(--bc-stone);
  padding: 32px;
  border-radius: var(--bc-radius);
}

.bc-contact-card h3 {
  font-size: 1.35rem;
  color: var(--bc-ink);
  margin-top: 0;
  margin-bottom: 20px;
}

.bc-contact-info-item {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  margin-bottom: 20px;
  font-size: 1rem;
  color: var(--bc-ink);
}

.bc-contact-info-item .bc-icon {
  font-size: 1.25rem;
}

.bc-contact-form {
  background-color: #fff;
  padding: 32px;
  border-radius: var(--bc-radius);
  border: 1px solid var(--bc-border);
}

.bc-contact-form .form-group {
  margin-bottom: 20px;
}

.bc-contact-form label {
  display: block;
  font-size: 0.95rem;
  font-weight: 600;
  color: var(--bc-ink);
  margin-bottom: 8px;
}

.bc-contact-form input[type="text"],
.bc-contact-form input[type="email"],
.bc-contact-form textarea {
  width: 100%;
  padding: 14px;
  border: 1px solid var(--bc-border);
  border-radius: var(--bc-radius-sm);
  font-size: 1rem;
  box-sizing: border-box;
  transition: border-color 0.2s ease;
}

.bc-contact-form input[type="text"]:focus,
.bc-contact-form input[type="email"]:focus,
.bc-contact-form textarea:focus {
  outline: none;
  border-color: var(--bc-ink);
}

.bc-contact-form textarea {
  min-height: 140px;
  resize: vertical;
}


/* ==========================================================================
   14. Checkout Page
   ========================================================================== */

label[for="subscribe-to-sms"] {
  display: none !important;
}

#omnisend-subscribe-block:has(label[for="subscribe-to-sms"]) {
  margin: 0 !important;
  padding: 0 !important;
}


/* ==========================================================================
   15. Responsive Design
   ========================================================================== */

@media (max-width: 781px) {

  /* Mobile Grid Adjustment */
  .bc-contact-grid {
    grid-template-columns: 1fr;
    gap: 24px;
  }

  /* Main Product — Mobile Typography */
  .single-product .wp-block-columns > .wp-block-column:nth-child(2) > .wp-block-post-title {
    font-size: 1.55rem !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
    letter-spacing: -0.01em !important;
  }

  .single-product .wp-block-columns > .wp-block-column:nth-child(2) > .bc-product-price {
    font-size: 1.15rem !important;
    line-height: 1.25 !important;
  }

  /* Related Products — One Product Per Row */
  .single-product .wp-block-woocommerce-product-collection .wc-block-product-template {
    grid-template-columns: 1fr !important;
  }

  /* Main Product — Mobile Variation Spacing */
  .single-product table.variations {
    margin-bottom: 6px !important;
  }

  .single-product .wp-block-woocommerce-add-to-cart-with-options table.variations tr {
    margin-bottom: 12px !important;
  }

  .single-product .wp-block-woocommerce-add-to-cart-with-options table.variations th.label {
    padding-bottom: 6px !important;
  }

  .single-product .wp-block-woocommerce-add-to-cart-with-options table.variations td.value {
    padding-bottom: 12px !important;
  }

  .single-product .wp-block-woocommerce-add-to-cart-with-options .reset_variations {
    margin-top: 6px !important;
    margin-bottom: 6px !important;
  }

  .single-product table.variations tr:last-child td.value {
    padding-bottom: 0 !important;
  }

  /* Mobile Purchase Area Spacing */
  .single-product .bc-trust-icons {
    margin-top: 10px !important;
  }

  .single-product .woocommerce.product > .wp-block-columns {
    margin-bottom: 8px !important;
  }

  .single-product .wp-block-woocommerce-product-collection .wp-block-woocommerce-product-price del {
    font-size: .78rem !important;
    font-weight: 400 !important;
    opacity: .6;
  }

  .single-product .wp-block-woocommerce-product-collection .wp-block-woocommerce-product-price ins {
    font-size: 1.08rem !important;
    font-weight: 700 !important;
    color: var(--bc-ink);
  }

} /* end mobile media query */