/*
 * WooCommerce tweaks for happynectar.
 *
 * Currently: single-product variation dropdowns (Size, Color, etc.).
 * NectarBlocks defaults render these as bare native <select> elements with
 * the chevron crowding the placeholder text ("Choose an option⌄"). This
 * gives them a proper form-field appearance with breathing room.
 *
 * Targets only `.variations select` on the single-product cart form so we
 * don't accidentally restyle other selects (shop sorting, checkout, etc.).
 *
 * Specificity: `.woocommerce div.product form.cart .variations select` is
 * (0,4,1) — beats NectarBlocks' `.variations_form .variations select`
 * (0,2,1) without needing !important.
 */

body.woocommerce div.product form.cart .variations select {
  width: 100% !important;
  max-width: 100%;
  box-sizing: border-box;
  font-family: "Satoshi", sans-serif;
  font-size: 16px !important;
  line-height: 1.4;
  height: auto !important;
  padding: 12px 40px 12px 16px !important;     /* 40px right gives room for chevron */
  border: 1px solid rgba(0, 0, 0, 0.2) !important;
  border-radius: 8px !important;
  background-color: #ffffff !important;
  color: inherit;
  cursor: pointer;

  /* Custom chevron — replaces NectarBlocks' underline gradient + native arrow */
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23232a3c' d='M7 10l5 5 5-5z'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: right 12px center !important;
  background-size: 16px !important;
  -webkit-appearance: none !important;
  -moz-appearance: none !important;
  appearance: none !important;

  transition: border-color .25s cubic-bezier(0.25, 1, 0.33, 1);
}

.woocommerce div.product form.cart .variations select:hover {
  border-color: rgba(0, 0, 0, 0.4);
}

.woocommerce div.product form.cart .variations select:focus {
  border-color: var(--nectar-accent-color, #ff9433);
  outline: none;
}

/* Breathing room between the attribute label and its dropdown */
.woocommerce div.product form.cart .variations th.label {
  padding-bottom: 6px;
}

/* Tidy the "Clear" reset link that sits inline after the second select */
.woocommerce div.product form.cart .variations .reset_variations {
  display: inline-block;
  margin-top: 8px;
  font-size: 14px;
}

/* My-account pages: top & bottom breathing room around the content.
   Applies to dashboard, orders, edit-account, subscriptions, my-library,
   delegate-dashboard — every URL under /my-account/. */
body.woocommerce-account #nectar-content-wrap {
  padding-top: 4rem;
  padding-bottom: 4rem;
}

@media (max-width: 767px) {
  body.woocommerce-account #nectar-content-wrap {
    padding-top: 2rem;
    padding-bottom: 2rem;
  }
}

/* My-account nav: icons for our custom endpoints (my_library + delegate_dashboard).
   The parent theme uses an icomoon font for built-in items; for our custom
   slugs we override `content:""` and substitute an inline SVG background so
   we don't need to know specific icomoon codepoints. */
.woocommerce-MyAccount-navigation ul li.woocommerce-MyAccount-navigation-link--my_library a:before,
.woocommerce-MyAccount-navigation ul li.woocommerce-MyAccount-navigation-link--delegate_dashboard a:before {
  content: "";
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  width: 1.1em;
  height: 1.1em;
  margin-right: 12px;
  vertical-align: -0.15em;
}

/* My Library — open-book icon (Lucide "book-open") */
.woocommerce-MyAccount-navigation ul li.woocommerce-MyAccount-navigation-link--my_library a:before {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 3h6a4 4 0 0 1 4 4v14a3 3 0 0 0-3-3H2z'/%3E%3Cpath d='M22 3h-6a4 4 0 0 0-4 4v14a3 3 0 0 1 3-3h7z'/%3E%3C/svg%3E");
}

/* Account Delegation — users icon (Lucide "users") */
.woocommerce-MyAccount-navigation ul li.woocommerce-MyAccount-navigation-link--delegate_dashboard a:before {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M16 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2'/%3E%3Ccircle cx='8.5' cy='7' r='4'/%3E%3Cpath d='M22 21v-2a4 4 0 0 0-3-3.87'/%3E%3Cpath d='M16 3.13a4 4 0 0 1 0 7.75'/%3E%3C/svg%3E");
}