/* Dravik — Shop Archive (product cards, catalog, cart/checkout tables)
   Part of the Dravik design system. Loaded by functions.php (see enqueue order).
*/

/* ==========================================================================
   SHOP ARCHIVE FRAME — quiet catalog header
   ========================================================================== */

.woocommerce-products-header__title.page-title {
  color: var(--dravik-heading);
}

/* Brand lead line under the catalog title (Dravik_Shop::dravik_shop_lead) */
.dravik-shop-lead {
  max-width: var(--dravik-container-narrow);
  margin: var(--dravik-space-2) 0 var(--dravik-space-8);
  color: var(--dravik-text);
  font-size: var(--dravik-text-lg);
  line-height: var(--dravik-leading-normal);
}

/* "Showing all N results" restates what the eye already sees in a
   six-product catalog — boilerplate hidden; the sorting control remains. */
.woocommerce .woocommerce-result-count {
  display: none;
}

.woocommerce .woocommerce-ordering select {
  background: var(--dravik-surface);
  color: var(--dravik-text);
  border: 1px solid var(--dravik-border);
  border-radius: var(--dravik-radius);
  padding: var(--dravik-space-2) var(--dravik-space-3);
}

/* ==========================================================================
   PRODUCT CARDS — consistent structure, equal heights
   Every product inherits automatically; no per-product design.
   ========================================================================== */

.woocommerce ul.products li.product {
  display: flex;
  flex-direction: column;
  height: 100%;
  background: var(--dravik-surface-deep);
  border: 1px solid var(--dravik-border-soft);
  border-radius: var(--dravik-radius-lg);
  overflow: hidden;
  box-shadow: var(--dravik-shadow-sm);
  transition: transform var(--dravik-duration) var(--dravik-ease),
              box-shadow var(--dravik-duration) var(--dravik-ease),
              border-color var(--dravik-duration) var(--dravik-ease);
}

/* Restrained lift on hover-capable (desktop) devices only. */
@media (hover: hover) and (pointer: fine) {
  .woocommerce ul.products li.product:hover {
    transform: translateY(-2px);
    box-shadow: var(--dravik-shadow);
    border-color: var(--dravik-border-hover);
  }
  .woocommerce ul.products li.product:hover a img {
    transform: scale(1.02);
  }
}

.woocommerce ul.products li.product a img {
  border-radius: 0;
  margin-bottom: 0;
  transition: transform var(--dravik-duration-slow) var(--dravik-ease);
}

/* Astra card internals: summary wrap becomes a flex column so the button
   pins to the bottom and every card in a row reads identically. */
.woocommerce ul.products li.product .astra-shop-summary-wrap {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  align-items: flex-start;
  text-align: left;
  padding: var(--dravik-space-6);
}

/* Astra's hover bag-icon overlay: redundant with the card button — hidden
   for a quieter, less dashboard-like card. */
.woocommerce ul.products li.product .ast-on-card-button {
  display: none;
}

/* Empty category slot (products currently uncategorized) */
.woocommerce ul.products li.product .ast-woo-product-category:empty {
  display: none;
}

/* The separator span only exists so tag-stripping contexts (breadcrumbs)
   keep the original name; visually the two lines replace it. */
.woocommerce .dravik-title-sep {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
}

/* Structured title: designation + quantity (see Dravik_Shop::dravik_split_title) */
.woocommerce ul.products li.product .woocommerce-loop-product__title {
  display: flex;
  flex-direction: column;
  gap: var(--dravik-space-1);
  padding: 0;
}

.woocommerce ul.products li.product .dravik-product-designation {
  color: var(--dravik-heading);
  font-size: var(--dravik-text-lg);
  font-weight: 600;
  letter-spacing: 0.04em;
}

.woocommerce ul.products li.product .dravik-product-quantity {
  color: var(--dravik-accent);
  font-size: var(--dravik-text-sm);
  font-weight: 600;
  letter-spacing: var(--dravik-tracking-wide);
  text-transform: uppercase;
}

/* Pre-launch status line (products without a price) */
.woocommerce ul.products li.product .dravik-product-status {
  display: block;
  margin-top: var(--dravik-space-3);
  color: var(--dravik-text-dim);
  font-size: var(--dravik-text-xs);
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.woocommerce ul.products li.product .price {
  color: var(--dravik-accent);
  font-weight: 600;
  margin-top: var(--dravik-space-2);
}

/* Button pinned to the card bottom so every card in a row matches. */
.woocommerce ul.products li.product .astra-shop-summary-wrap .button {
  margin-top: var(--dravik-space-6);
  margin-bottom: 0;
  align-self: flex-start;
  background: transparent;
  border: 1px solid var(--dravik-border);
  color: var(--dravik-heading);
}

.woocommerce ul.products li.product .astra-shop-summary-wrap > a:last-child {
  margin-top: auto;
}

.woocommerce ul.products li.product .astra-shop-summary-wrap .button:hover {
  border-color: var(--dravik-accent);
  color: var(--dravik-accent);
  background: transparent;
}

/* Small screens: Astra shows two cards per row — tighten card internals so
   the button and status line hold a single line. */
@media (max-width: 543px) {
  .woocommerce ul.products li.product .astra-shop-summary-wrap {
    padding: var(--dravik-space-4);
  }

  .woocommerce ul.products li.product .astra-shop-summary-wrap .button {
    padding: var(--dravik-space-2) var(--dravik-space-4);
    font-size: var(--dravik-text-sm);
    white-space: nowrap;
  }

  .woocommerce ul.products li.product .dravik-product-status {
    font-size: 0.7rem;
  }
}

/* ==========================================================================
   CART / CHECKOUT — surfaces
   ========================================================================== */

.woocommerce table.shop_table {
  background: var(--dravik-surface);
  border: 1px solid var(--dravik-border);
  border-radius: var(--dravik-radius-lg);
}