/* ==========================================================================
   v1.3.0 — one add-to-cart button everywhere, SKU, bigger prices, smart search, minimal checkout
   (loads after style.css and layout.css)
   ========================================================================== */

/* a. Same orange button on every product card (home, shop, categories, sliders, mini cards).
   The old rules only matched under .woocommerce, so on the home page the button looked like plain text. */
.product-card .product-card__cta a.button,
.mini-card .mini-card__cta a.button {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  min-height: 44px; padding: 8px 18px; margin: 0; border-radius: var(--radius-s);
  border: 1px solid var(--orange); background: var(--orange); color: var(--navy);
  font-family: var(--font-head); font-weight: 700; font-size: .875rem; line-height: 1.2; text-decoration: none; white-space: nowrap;
  box-shadow: none; transform: none; cursor: pointer;
}
.product-card .product-card__cta a.button:hover,
.mini-card .mini-card__cta a.button:hover,
.product-card .product-card__cta a.button:focus-visible,
.mini-card .mini-card__cta a.button:focus-visible { background: var(--orange-hover); border-color: var(--orange-hover); color: var(--navy); transform: none; }
.product-card .product-card__cta a.button:active,
.mini-card .mini-card__cta a.button:active { background: var(--orange-active); border-color: var(--orange-active); }
.product-card .product-card__cta a.button.loading,
.mini-card .mini-card__cta a.button.loading { opacity: .7; pointer-events: none; }
.product-card .product-card__cta a.button.added::after,
.mini-card .mini-card__cta a.button.added::after { display: none; }
.mini-card__cta .added_to_cart { display: none; }

/* b. SKU: faint line under the title everywhere */
.pisol-sku { display: block; font-size: .75rem; font-weight: 500; letter-spacing: .01em; line-height: 1.3; color: #8794A6; }
.pisol-sku--single { margin: -2px 0 10px; font-size: .875rem; }
.bundle__item > .pisol-sku { display: block; min-height: 0; margin: 2px 0 0; -webkit-line-clamp: unset; font-size: .72rem; font-weight: 500; }
.woocommerce-cart-form .pisol-sku, .woocommerce-checkout-review-order-table .pisol-sku, .pisol-drawer .pisol-sku { margin-top: 2px; font-size: .72rem; font-weight: 500; }
.product-card .pisol-sku { margin-top: -2px; }

/* c. Bigger prices, as tall as the button, vertically centred next to it */
.product-card__foot { align-items: center; gap: 12px; }
.product-card__price .price { font-size: 1.4rem; line-height: 1.05; min-height: 44px; justify-content: center; letter-spacing: -.01em; }
.product-card__price .price del { font-size: .8rem; line-height: 1.1; font-weight: 500; }
.product-card__price .price ins { font-size: 1.4rem; }

/* d. Mini cards: link + button, so the markup is no longer one big <a> */
.mini-card { display: grid; grid-template-columns: 96px minmax(0, 1fr); align-items: center; gap: 14px; padding: 12px; border: 1px solid var(--line); border-radius: var(--radius); background: #fff; color: var(--navy); }
.mini-card__media { display: grid; place-items: center; width: 96px; height: 96px; border-radius: var(--radius-s); background: var(--surface); overflow: hidden; }
.mini-card__title { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; font-weight: 700; font-size: .9rem; line-height: 1.3; color: var(--navy); }
.mini-card__title:hover { color: var(--orange-hover); }
.mini-card__foot { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: 6px; }
.mini-card__price { display: flex; flex-direction: column; justify-content: center; min-height: 44px; margin: 0; font-size: 1.25rem; line-height: 1.05; font-weight: 800; color: var(--navy); }
.mini-card__price del { display: block; margin: 0; font-size: .78rem; font-weight: 500; color: var(--slate); }
.mini-card__price ins { text-decoration: none; color: var(--red); }

/* e. Smart search dropdown */
.ssearch { position: absolute; z-index: 1200; background: #fff; border: 1px solid var(--line); border-radius: var(--radius); box-shadow: 0 18px 50px rgba(13, 41, 77, .18); overflow: hidden; max-height: min(78vh, 640px); overflow-y: auto; overscroll-behavior: contain; }
.ssearch[hidden] { display: none; }
.ssearch.is-loading { opacity: .85; }
.ssearch__cats { display: flex; flex-wrap: wrap; gap: 8px; padding: 12px 14px 4px; }
.ssearch__cat { display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; border-radius: 999px; background: var(--surface); color: var(--navy); font-size: .8rem; font-weight: 600; }
.ssearch__cat span { color: var(--slate); font-weight: 500; }
.ssearch__cat:hover { background: var(--navy); color: #fff; }
.ssearch__cat:hover span { color: #fff; }
.ssearch__list { list-style: none; margin: 0; padding: 6px 0; }
.ssearch__item { display: grid; grid-template-columns: 56px minmax(0, 1fr) auto; align-items: center; gap: 12px; padding: 8px 14px; color: var(--navy); }
.ssearch__item:hover, .ssearch__item.is-active { background: var(--surface); color: var(--navy); }
.ssearch__img { width: 56px; height: 56px; border-radius: 10px; background: #fff; border: 1px solid var(--line); display: grid; place-items: center; overflow: hidden; }
.ssearch__img img { width: 100%; height: 100%; object-fit: contain; padding: 4px; }
.ssearch__txt { min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.ssearch__title { font-size: .9rem; font-weight: 600; line-height: 1.3; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.ssearch__title mark, .ssearch__meta mark { background: var(--orange-soft); color: inherit; border-radius: 3px; padding: 0 1px; }
.ssearch__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; font-size: .75rem; color: var(--slate); }
.ssearch__meta .pisol-sku { display: inline; }
.ssearch__stock { font-style: normal; font-weight: 600; color: var(--orange-active); }
.ssearch__stock.is-out { color: var(--red); }
.ssearch__price { font-family: var(--font-head); font-weight: 800; font-size: 1rem; color: var(--navy); text-align: right; white-space: nowrap; }
.ssearch__price del { display: block; font-size: .75rem; font-weight: 500; color: var(--slate); }
.ssearch__price ins { text-decoration: none; color: var(--red); }
.ssearch__all { display: flex; align-items: center; justify-content: center; gap: 8px; padding: 13px 14px; border-top: 1px solid var(--line); background: var(--surface); color: var(--navy); font-weight: 700; font-size: .9rem; }
.ssearch__all:hover, .ssearch__all.is-active { background: var(--navy); color: #fff; }
.ssearch__empty { margin: 0; padding: 20px 18px; color: var(--slate); font-size: .9rem; }
.ssearch__empty a { color: var(--navy); text-decoration: underline; }

/* f. Minimal checkout */
.pisol-visually-hidden { position: absolute !important; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.woocommerce-checkout form.checkout { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); column-gap: 40px; align-items: start; }
.woocommerce-checkout form.checkout > * { grid-column: 1 / -1; }
.woocommerce-checkout form.checkout #customer_details { grid-column: 1; grid-row: 1 / span 3; }
.woocommerce-checkout form.checkout #order_review_heading { grid-column: 2; grid-row: 1; margin: 0 0 14px; }
.woocommerce-checkout form.checkout #order_review { grid-column: 2; grid-row: 2; }
.woocommerce-checkout #customer_details .col-1, .woocommerce-checkout #customer_details .col-2 { float: none; width: 100%; max-width: none; }
.woocommerce-checkout #customer_details .col-2 { margin-top: 8px; }
.woocommerce-checkout h3 { font-size: 1.15rem; margin: 0 0 16px; }
.woocommerce-checkout .woocommerce-billing-fields > h3 { margin-bottom: 14px; }
.woocommerce-checkout .form-row { margin: 0 0 14px; padding: 0; }
.woocommerce-checkout .form-row label { display: block; margin: 0 0 5px; font-size: .8125rem; font-weight: 600; color: var(--navy); line-height: 1.3; }
.woocommerce-checkout .form-row label .optional { display: none; }
.woocommerce-checkout .form-row .input-text, .woocommerce-checkout .form-row select, .woocommerce-checkout .form-row textarea {
  width: 100%; min-height: 48px; padding: 11px 14px; border: 1px solid var(--line); border-radius: var(--radius-s); background: #fff; font-size: .95rem; color: var(--navy); box-shadow: none;
}
.woocommerce-checkout .form-row textarea { min-height: 96px; }
.woocommerce-checkout .form-row .input-text:focus, .woocommerce-checkout .form-row select:focus, .woocommerce-checkout .form-row textarea:focus { border-color: var(--navy); outline: 0; box-shadow: 0 0 0 4px rgba(13, 41, 77, .08); }
.woocommerce-checkout .form-row-first, .woocommerce-checkout .form-row-last { width: calc(50% - 7px); float: left; clear: none; }
.woocommerce-checkout .form-row-last { float: right; }
.woocommerce-checkout .form-row-wide { clear: both; width: 100%; float: none; }
.woocommerce-checkout .woocommerce-billing-fields__field-wrapper::after, .woocommerce-checkout .woocommerce-shipping-fields__field-wrapper::after { content: ""; display: block; clear: both; }
.woocommerce-checkout .pisol-country { display: none; }
.woocommerce-checkout .validate-required .required, .woocommerce-checkout abbr.required { color: var(--red); text-decoration: none; }
.woocommerce-checkout #billing_state_field, .woocommerce-checkout #shipping_state_field { display: none; }

/* invoice group */
.woocommerce-checkout #billing_timologio_field { margin: 4px 0 12px; }
.pisol-check { display: flex; align-items: center; gap: 10px; margin: 0 !important; padding: 12px 14px; border: 1px solid var(--line); border-radius: var(--radius-s); background: var(--surface); font-size: .9rem; font-weight: 600; color: var(--navy); cursor: pointer; }
.pisol-check input { width: 18px; height: 18px; accent-color: var(--orange); margin: 0; }
body:not(.pisol-invoice-on) .woocommerce-checkout .timologio-hide { display: none !important; }
body.pisol-invoice-on .woocommerce-checkout .timologio-hide { display: block !important; }
.pisol-afm-wrap { display: flex; gap: 8px; }
.pisol-afm-wrap .input-text { flex: 1; min-width: 0; }
.pisol-afm-btn { flex: none; min-height: 48px; padding: 0 16px; border: 1px solid var(--navy); border-radius: var(--radius-s); background: var(--navy); color: #fff; font-weight: 600; font-size: .85rem; cursor: pointer; transition: background var(--t-fast); }
.pisol-afm-btn:hover { background: #081B33; }
.pisol-afm-btn:disabled { opacity: .6; cursor: progress; }
.pisol-afm-msg { margin: 6px 0 0; font-size: .8rem; color: var(--slate); }
.pisol-afm-msg:empty { display: none; }
.pisol-afm-msg.is-ok { color: #1B7F4B; }
.pisol-afm-msg.is-warn { color: var(--red); }

/* login / coupon strips, shipping toggle, account, note, summary */
body.woocommerce-checkout .woocommerce-info { margin: 0 0 10px; padding: 11px 16px; font-size: .875rem; border-radius: var(--radius-s); }
body.woocommerce-checkout .checkout_coupon { margin: 0 0 14px; padding: 14px; border: 1px solid var(--line); border-radius: var(--radius-s); }
.woocommerce-checkout #ship-to-different-address { margin: 4px 0 14px; }
.woocommerce-checkout #ship-to-different-address label { display: flex; align-items: center; gap: 10px; font-size: .9rem; cursor: pointer; }
.woocommerce-checkout .woocommerce-account-fields { margin: 0 0 8px; }
.woocommerce-checkout .woocommerce-additional-fields > h3 { display: none; }
.pisol-note-toggle { display: inline-block; margin: 0 0 14px; padding: 0; border: 0; background: none; color: var(--navy); font-weight: 600; font-size: .875rem; text-decoration: underline; cursor: pointer; }
.pisol-note-toggle:hover { color: var(--orange-hover); }
.woocommerce-checkout #order_review { padding: 22px; }
.woocommerce-checkout #order_review table.shop_table { border: 0; margin: 0 0 14px; }
.woocommerce-checkout #order_review table.shop_table th, .woocommerce-checkout #order_review table.shop_table td { padding: 10px 0; border-top: 1px solid var(--line); background: transparent; font-size: .9rem; }
.woocommerce-checkout #order_review table.shop_table thead th { border-top: 0; font-size: .75rem; text-transform: uppercase; letter-spacing: .06em; color: var(--slate); }
.woocommerce-checkout #order_review .order-total th, .woocommerce-checkout #order_review .order-total td { font-size: 1.1rem; font-weight: 800; }
.woocommerce-checkout #payment { padding: 0 !important; background: transparent !important; }
.woocommerce-checkout #payment #place_order { width: 100%; min-height: 54px; font-size: 1rem; }
.woocommerce-checkout .woocommerce-privacy-policy-text, .woocommerce-checkout .woocommerce-terms-and-conditions-wrapper { font-size: .8rem; color: var(--slate); }
.woocommerce-checkout #shipping_method { list-style: none; margin: 0; padding: 0; }

@media (max-width: 960px) {
  .woocommerce-checkout form.checkout { display: block; }
  .woocommerce-checkout form.checkout #order_review_heading { margin-top: 24px; }
  .mini-card { grid-template-columns: 84px minmax(0, 1fr); }
  .mini-card__media { width: 84px; height: 84px; }
}
@media (max-width: 560px) {
  .woocommerce-checkout .form-row-first, .woocommerce-checkout .form-row-last { width: 100%; float: none; }
  .mini-card__foot { flex-wrap: wrap; }
  .product-card__price .price { min-height: 0; font-size: 1.3rem; }
  .ssearch__item { grid-template-columns: 48px minmax(0, 1fr); }
  .ssearch__price { grid-column: 2; text-align: left; }
  .ssearch__img { width: 48px; height: 48px; }
}

/* g. The closed side cart sat outside the viewport and widened the page (horizontal scrollbar on every page) */
.pisol-drawer { overflow: hidden; }
.pisol-drawer.is-open { overflow: visible; }
html, body { overflow-x: clip; }

/* long labels (external products) must never break the card footer */
.product-card .product-card__cta a.button { max-width: 100%; overflow: hidden; text-overflow: ellipsis; }

/* h. Hover colours: the global a:hover (orange) used to repaint the text of card-like links, so on the orange promo card
   or on dark banners the copy turned orange on hover. Cards keep their own text colour on hover. */
.promo-card__link:hover, .promo-card__link:hover h3, .promo-card__link:hover p { color: var(--navy); }
.promo:hover, .promo--navy:hover, .photo-banner:hover, .banner--navy:hover { color: #fff; }
.promo--sand:hover, .promo--orange:hover, .banner--sand:hover { color: var(--navy); }
.product-card__link:hover, .mini-card__media:hover, .post-card__media:hover, .bundle__item:hover, .tile a:hover { color: var(--navy); }
.bundle__item:hover > span:first-of-type { color: var(--orange-hover); }
.pisol-drawer .woocommerce-mini-cart__buttons .button:hover, .pisol-drawer .woocommerce-mini-cart__buttons .button.checkout:hover { color: var(--navy); }
.skip-link:hover { color: #fff; }
.btn--dark:hover, .btn--light:hover { color: #fff; }
.btn--primary:hover, .btn--secondary:hover, .btn--ghost:hover { color: var(--navy); }

/* i. Mobile / tablet header. layout.css re-set gap: 36px at every width and the logo took 236px, so the account and
   cart icons were pushed off-screen on phones. */
@media (max-width: 1024px) {
  .mainbar__inner { grid-template-columns: auto minmax(0, 1fr) auto; gap: 10px 12px; min-height: 68px; }
  .mainbar__brand { min-width: 0; }
  .mainbar__brand .brand, .mainbar__brand a { display: inline-flex; max-width: 100%; }
  form.search { margin-bottom: 12px; }
}
@media (max-width: 720px) {
  .mainbar__inner { gap: 8px 8px; }
  .mainbar__brand img, .mainbar__brand .brand img { height: 34px; width: auto; max-width: 100%; }
  .mainbar__actions { gap: 0; }
  .mainbar__actions .action--track, .mainbar__actions a[href*="wishlist"] { display: none; }
  .action { padding: 8px 6px; }
}

.product-card__price .price { align-items: flex-start; text-align: left; }

/* j. Checkout on phones: single column (WooCommerce's own .woocommerce form .form-row-first is more specific) */
@media (max-width: 560px) {
  body.woocommerce-checkout form.checkout .form-row-first, body.woocommerce-checkout form.checkout .form-row-last { width: 100%; float: none; }
  body.woocommerce-checkout #order_review { padding: 16px; }
  body.woocommerce-checkout #order_review table.shop_table { table-layout: fixed; width: 100%; }
  body.woocommerce-checkout #order_review table.shop_table .product-name { word-break: break-word; }
  body.woocommerce-checkout #order_review table.shop_table .product-total, body.woocommerce-checkout #order_review table.shop_table td:last-child { width: 38%; text-align: right; }
}

/* k. Phones: price above a full-width button, both left-aligned (the desktop centring above must not win here) */
@media (max-width: 720px) {
  .product-card__foot { flex-direction: column; align-items: stretch; gap: 8px; }
  .product-card__price .price { min-height: 0; }
}

/* l. Footer: the padding shorthand on .footer__grid / .footer__bottom-inner wiped the container gutter, so on phones
   (and tablets) all footer text touched the screen edge */
.footer__grid, .footer__bottom-inner { padding-left: var(--gutter); padding-right: var(--gutter); }
@media (max-width: 720px) {
  .footer__contact li { align-items: flex-start; }
  .newsletter__form, .footer__col form { max-width: 100%; }
}

/* m. Contact page had the same gutter bug; shop toolbar on phones */
.contact__grid { padding-left: var(--gutter); padding-right: var(--gutter); }
@media (max-width: 720px) {
  .contact__grid { gap: 24px; padding-top: 32px; }
  .contact__form { padding: 20px; }
  .shop-toolbar { flex-wrap: wrap; gap: 10px 12px; }
  .shop-toolbar__filters { flex: none; white-space: nowrap; min-height: 44px; }
  .shop-toolbar .woocommerce-ordering { flex: 1 1 0; min-width: 0; margin: 0; }
  .shop-toolbar .woocommerce-ordering select { width: 100%; min-height: 44px; }
  .shop-toolbar .woocommerce-result-count { order: 3; flex: 1 1 100%; margin: 0; font-size: .8125rem; color: var(--slate); }
}

/* n. Live fixes: WooCommerce's address JS sets inline display:block on the (single-country) country row, and the
   login / coupon strips need room for their icon */
.woocommerce-checkout .pisol-country, .woocommerce-checkout #billing_country_field, .woocommerce-checkout #shipping_country_field { display: none !important; }
body.woocommerce-checkout .woocommerce-info { padding: 12px 16px 12px 48px; }
body.woocommerce-checkout .woocommerce-info::before { left: 16px; top: 12px; }

/* o) Footer: full logo with the π */
.site-footer .footer__col--brand .brand img { height: 66px; width: auto; max-width: 100%; }
@media (max-width: 560px) { .site-footer .footer__col--brand .brand img { height: 56px; } }