/* ===========================================================
   SOLMIO – Core (Kerros 1). Ladataan pluginista solmio-shop-styles.
   WC-perusteet: napit, lomakkeet, ilmoitukset, tuotelistat, ostoskori, kassa.
   Mobiilivalikon z-index- ja Astran offcanvas-menun säätely.

   EI sisällä moduulispesifisiä selektoreita. Tilakohtaiset säännöt asuvat
   moduuleiden frontend.css-tiedostoissa skopattuna body.solmio-shop-mode-{type}
   -etuliitteellä. Onboarding-kohtaiset (banner / front-wrap) asuvat onboardingin
   omassa frontend.css:ssä.
   =========================================================== */

/* Mobiilivalikko: ei jää admin barin tai sivuston headerin (topbar) taakse */
@media (max-width: 782px) {
  /* Admin bar (46px) + sivuston header ~56px = valikon sisällön padding yläreunasta */
  body.admin-bar .ast-mobile-popup-inner,
  body.admin-bar .ast-mobile-popup-drawer .ast-mobile-popup-content,
  body.admin-bar .ast-mobile-popup-drawer .ast-desktop-popup-content {
    padding-top: 102px !important; /* 46 + 56 */
  }
  body.admin-bar .ast-mobile-header-content,
  body.admin-bar .ast-desktop-header-content {
    padding-top: 46px !important;
  }
  /* Ilman admin baria: vain headerin korkeus, jotta valikko ei mene topbarin taakse */
  .ast-mobile-popup-drawer.active .ast-mobile-popup-inner,
  .ast-mobile-popup-drawer.active .ast-mobile-popup-content,
  .ast-mobile-popup-drawer.active .ast-desktop-popup-content {
    padding-top: 56px !important;
  }
  /* Varmista että popup on aina headerin päällä */
  #ast-mobile-popup-wrapper,
  .ast-mobile-popup-drawer.active {
    z-index: 999999 !important;
  }
  /* Kun mobiilivalikko on auki: header (topbar) alle popupin, ettei peitä valikon sisältöä */
  body.ast-popup-nav-open .site-header,
  body.ast-popup-nav-open #ast-mobile-header,
  body.ast-popup-nav-open .ast-mobile-header-wrap,
  body.ast-popup-nav-open .main-header-bar,
  body.ast-main-header-nav-open .site-header,
  body.ast-main-header-nav-open #ast-mobile-header,
  body.ast-main-header-nav-open .ast-mobile-header-wrap,
  body.ast-main-header-nav-open .main-header-bar {
    z-index: 999990 !important;
  }
  body.admin-bar .ast-mobile-popup-drawer.active .ast-mobile-popup-inner,
  body.admin-bar .ast-mobile-popup-drawer.active .ast-mobile-popup-content {
    padding-top: 102px !important;
  }
}

/* Mobiilipopup: piilota turhat valikkokohteet (sivulistaus tai valikko). Astran offcanvas. */
.ast-mobile-popup-drawer .main-header-menu li:has(a[href*="tietosuoja"]),
.ast-mobile-popup-drawer .main-header-menu li:has(a[href*="privacy-policy"]),
.ast-mobile-popup-drawer .main-header-menu li:has(a[href*="toimitusehdot"]),
.ast-mobile-popup-drawer .main-header-menu li:has(a[href*="yhteystiedot"]),
.ast-mobile-popup-drawer .main-header-menu li:has(a[href*="terms-and-conditions"]),
.ast-mobile-popup-drawer .main-header-menu li:has(a[href*="käyttöehdot"]),
.ast-mobile-popup-drawer .main-header-menu li:has(a[href*="/contact"]),
.ast-mobile-popup-drawer .main-header-menu li:has(a[href*="/tc/"]),
.ast-mobile-popup-drawer .main-header-menu li:has(a[href*="/tc"]) {
  display: none !important;
}

/* Design tokenit */
:root {
  --solmio-gap-sm: 14px;
  --solmio-gap-md: 20px;
  --solmio-gap-lg: 24px;
  --solmio-radius: 12px;
  --solmio-border: 1px solid #e5e7eb;
  --solmio-shadow: 0 2px 10px rgba(15, 23, 42, .06);
  --solmio-accent: #f89420;
  --solmio-muted: #f9fafb;
}

/* ---------- Yleiset napit ---------- */
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.button,
.add_to_cart_button,
.single_add_to_cart_button {
  background: var(--solmio-accent) !important;
  border: 0 !important;
  color: #fff !important;
  font-weight: 600 !important;
  padding: 10px 18px !important;
  border-radius: 9999px !important;
  line-height: 1.2 !important;
  cursor: pointer;
  transition: background .2s ease !important;
  text-decoration: none !important;
}

.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.button:hover,
.add_to_cart_button:hover,
.single_add_to_cart_button:hover {
  background: #d87a10 !important;
}

/* ---------- Lomakekentät ---------- */
.woocommerce input.input-text,
.woocommerce select,
.woocommerce textarea {
  border: 1px solid #cbd5e1;
  border-radius: var(--solmio-radius);
  padding: 10px 12px;
  font-size: 14px;
}

.woocommerce input.input-text:focus,
.woocommerce select:focus,
.woocommerce textarea:focus {
  outline: none;
  border-color: var(--solmio-accent);
  box-shadow: 0 0 0 2px rgba(248, 148, 32, .2);
}

/* ---------- Ilmoitukset ---------- */
.woocommerce-message,
.woocommerce-info,
.woocommerce-error {
  border-radius: var(--solmio-radius);
  box-shadow: var(--solmio-shadow);
}

/* ===========================================================
   Tuotelistat (kortit)
   =========================================================== */
.wc-block-grid__products,
.woocommerce ul.products {
  display: grid !important;
  gap: var(--solmio-gap-sm);
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

@media (min-width:768px) {

  .wc-block-grid__products,
  .woocommerce ul.products {
    gap: var(--solmio-gap-md);
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (min-width:1280px) {

  .wc-block-grid__products,
  .woocommerce ul.products {
    gap: var(--solmio-gap-lg);
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }
}

.wc-block-grid__product,
.woocommerce ul.products li.product {
  padding: 12px;
  border: var(--solmio-border);
  border-radius: var(--solmio-radius);
  background: #fff;
  box-shadow: var(--solmio-shadow);
  transition: transform .15s ease, box-shadow .15s ease;
}

.wc-block-grid__product:hover,
.woocommerce ul.products li.product:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 20px rgba(15, 23, 42, .08);
}

.wc-block-components-product-image,
.woocommerce ul.products li.product img {
  aspect-ratio: 1/1;
  width: 100%;
  max-height: 180px;
  object-fit: cover;
  border-radius: var(--solmio-radius);
}

.wc-block-grid__product-title,
.woocommerce ul.products li.product .woocommerce-loop-product__title {
  font-size: 15px;
  line-height: 1.35;
  margin: 10px 0 6px;
  text-align: center;
}

.wc-block-grid__product-price,
.woocommerce ul.products li.product .price {
  font-size: 14px;
  font-weight: 600;
  margin: 0 0 6px;
  text-align: center;
}

/* Piilota Astran hover-nappi kuvan päältä */
.woocommerce ul.products li.product a.ast-on-card-button,
.woocommerce ul.products li.product a.ast-on-card-button.ast-select-options-trigger {
  display: none !important;
}

/* Tuotekortti: keskusta Lisää ostoskoriin (Astran summary-lohko voittaa muuten align-leftin) */
.woocommerce ul.products li.product .astra-shop-summary-wrap {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  width: 100% !important;
  box-sizing: border-box !important;
}

/* YITH Quick View – kompakti nappi; loopissa on pelkkä a.yith-wcqv-button (ei .yith-wcqv-wrapper, se on modaalissa).
   display flex + margin auto: keskitys vaikka li:llä olisi Astran text-align left.
   Linkkioverlay ei peitä nappeja: */
.woocommerce ul.products li.product a.woocommerce-LoopProduct-link,
.woocommerce ul.products li.product .ast-loop-product__link {
  position: static !important;
  z-index: auto !important;
}

/* Jos teema/plugin joskus käärii napit wrapperiin */
.woocommerce ul.products li.product .yith-wcqv-wrapper {
  display: flex !important;
  gap: 8px !important;
  justify-content: center !important;
  align-items: center !important;
  margin-top: 6px !important;
}

.woocommerce ul.products li.product .add_to_cart_button {
  display: inline-flex !important;
  width: auto !important;
  max-width: none !important;
  padding: 8px 14px !important;
  font-size: 13px !important;
  line-height: 1.2 !important;
  border-radius: 9999px !important;
  white-space: nowrap !important;
  position: relative !important;
  z-index: 5 !important;
  pointer-events: auto !important;
}

.woocommerce ul.products li.product .yith-wcqv-button {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  width: fit-content !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  padding: 6px 12px !important;
  font-size: 12.5px !important;
  margin-top: 6px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  line-height: 1.2 !important;
  border-radius: 9999px !important;
  white-space: nowrap !important;
  position: relative !important;
  z-index: 5 !important;
  pointer-events: auto !important;
}

/* Mobiilissa pinotaan allekkain siististi */
@media (max-width:480px) {
  .woocommerce ul.products li.product .yith-wcqv-wrapper {
    flex-wrap: wrap !important;
  }
}

/* ===========================================================
   Ostoskori (klassinen)
   =========================================================== */
.woocommerce-cart table.cart {
  border-collapse: separate;
  border-spacing: 0 12px;
  width: 100%;
}

.woocommerce-cart table.cart td,
.woocommerce-cart table.cart th {
  border: none !important;
  padding: 12px !important;
  vertical-align: middle;
}

.woocommerce-cart table.cart tr {
  background: #fff;
  border: var(--solmio-border);
  border-radius: var(--solmio-radius);
  box-shadow: var(--solmio-shadow);
}

.woocommerce-cart table.cart img {
  border-radius: var(--solmio-radius);
  max-width: 80px;
}

.woocommerce-cart .coupon input.input-text {
  border-radius: var(--solmio-radius);
  padding: 8px 12px;
  border: 1px solid #cbd5e1;
}

.woocommerce .cart_totals .shop_table {
  background: #fff;
  border: var(--solmio-border);
  border-radius: var(--solmio-radius);
  box-shadow: var(--solmio-shadow);
  padding: 12px;
  display: block;
}

/* ===========================================================
   Kassa (klassinen)
   =========================================================== */
.woocommerce-checkout form.checkout {
  background: #fff;
  padding: 20px;
  border-radius: var(--solmio-radius);
  box-shadow: var(--solmio-shadow);
}

.woocommerce-checkout #order_review {
  background: #fff;
  padding: 16px;
  border-radius: var(--solmio-radius);
  box-shadow: var(--solmio-shadow);
}

.woocommerce-checkout #order_review .shop_table {
  border: none;
  background: transparent;
}

.woocommerce-checkout #payment {
  border: none;
  background: transparent;
}

.woocommerce-checkout #payment div.payment_box {
  background: var(--solmio-muted);
  border-radius: var(--solmio-radius);
  padding: 12px;
  margin: 8px 0;
}

/* Määräkenttä */
.quantity input.qty {
  border: 1px solid #cbd5e1 !important;
  border-radius: 8px !important;
  width: 70px !important;
  height: 40px !important;
  text-align: center !important;
}

/* Pienet viimeistelyt */
.woocommerce form .form-row {
  margin-bottom: 12px;
}

.woocommerce-checkout-review-order-table tfoot th,
.woocommerce-checkout-review-order-table tfoot td {
  font-weight: 600;
}