/*
Theme Name: PDM Storefront
Theme URI: https://prodentalmart.com/theme
Author: Pro Dental Mart
Author URI: https://prodentalmart.com
Description: Fresh. Fast. Dental. — A modern WooCommerce block theme for Pro Dental Mart and other digital-first dental supply storefronts. Teal + white palette, Outfit display + Inter body, energetic voice. Ships with 11 templates and 8 reusable block patterns.
Requires at least: 6.4
Tested up to: 6.5
Requires PHP: 7.4
Version: 1.0.0
License: GPL-2.0-or-later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: pdm-storefront
Tags: full-site-editing, block-themes, e-commerce, store, two-columns, custom-colors, custom-menu, custom-logo, editor-style, featured-images, theme-options, threaded-comments, translation-ready, wide-blocks
*/

/* ============================================================
   PDM Storefront — supplementary theme CSS
   Tokens & most layout live in theme.json. This file holds:
   - @font-face for the local Outfit variable
   - Component styles that are awkward to express in theme.json
     (the pulsing live dot, the promo strip, hero overlays, etc.)
   - WooCommerce overrides
   ============================================================ */

@font-face {
  font-family: "Outfit";
  src: url("./assets/fonts/Outfit-VariableFont_wght.ttf") format("truetype-variations");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}

/* ---------- Brand mark in the site title ------------------- */
.wp-block-site-logo img,
.wp-block-site-logo a img { border-radius: 10px; }

/* ---------- Top ship-strip --------------------------------- */
.pdm-ship-strip {
  background: var(--wp--preset--color--teal);
  color: var(--wp--preset--color--teal-light);
  font-family: var(--wp--preset--font-family--body);
  font-size: 12.5px;
  padding: 6px 16px;
  text-align: center;
}
.pdm-ship-strip b { color: #fff; font-weight: 600; }
.pdm-ship-strip .pdm-bolt { color: var(--wp--preset--color--lime); margin-right: 6px; }

/* ---------- Reusable: product card pattern ----------------- */
.pdm-product-card {
  background: #fff;
  border: 0.5px solid var(--wp--preset--color--cloud);
  border-radius: 12px;
  overflow: hidden;
  transition: box-shadow .18s cubic-bezier(.16,.84,.44,1), transform .18s;
}
.pdm-product-card:hover {
  box-shadow: 0 4px 12px rgba(12,31,32,.06);
  transform: translateY(-1px);
}
.pdm-product-card__img {
  background: var(--wp--preset--color--teal-ice);
  height: 140px;
  display: flex; align-items: center; justify-content: center;
  position: relative;
}
.pdm-product-card__body { padding: 16px 18px 18px; }
.pdm-product-card__cat {
  display: inline-block;
  font-family: var(--wp--preset--font-family--body);
  font-size: 10.5px; font-weight: 600;
  padding: 3px 10px;
  border-radius: 999px;
  border: 1px solid;
}
.pdm-product-card__name {
  font-family: var(--wp--preset--font-family--body);
  font-size: 13.5px; font-weight: 600;
  color: var(--wp--preset--color--ink);
  margin: 10px 0 0; line-height: 1.4;
}
.pdm-product-card__sku {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 11px; color: var(--wp--preset--color--mist); margin-top: 4px;
}
.pdm-product-card__price-row {
  display: flex; justify-content: space-between; align-items: center;
  margin-top: 14px;
}
.pdm-product-card__price {
  font-family: var(--wp--preset--font-family--display);
  font-weight: 700; font-size: 22px;
  color: var(--wp--preset--color--teal);
  letter-spacing: -.01em;
}
.pdm-product-card__unit {
  font-family: var(--wp--preset--font-family--body);
  font-size: 11.5px; color: var(--wp--preset--color--mist);
  margin-left: 6px;
}
.pdm-product-card__stock {
  display: inline-flex; align-items: center; gap: 6px;
  font-family: var(--wp--preset--font-family--body);
  font-size: 11.5px; font-weight: 600;
  color: var(--wp--preset--color--success);
}
.pdm-product-card__stock-dot {
  width: 8px; height: 8px; border-radius: 50%;
  background: var(--wp--preset--color--lime);
}

/* ---------- Hero (image) overlay --------------------------- */
.pdm-hero-image {
  position: relative;
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 4px 12px rgba(12,31,32,.06);
}
.pdm-hero-image img { display: block; width: 100%; height: auto; }
.pdm-hero-image__overlay {
  position: absolute; left: 0; right: 0; bottom: 0;
  padding: 20px 32px 24px;
  display: flex; align-items: center; justify-content: space-between;
  gap: 18px;
  background: linear-gradient(to top, rgba(2,28,30,.55), rgba(2,28,30,0));
}
.pdm-hero-image__note {
  display: inline-flex; align-items: center; gap: 8px;
  font-family: var(--wp--preset--font-family--body);
  font-size: 13px; color: #fff;
  background: rgba(12,31,32,.45);
  border: 1px solid rgba(255,255,255,.18);
  padding: 8px 14px;
  border-radius: 999px;
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}
.pdm-hero-image__dot {
  width: 9px; height: 9px; border-radius: 50%;
  background: var(--wp--preset--color--lime);
  animation: pdm-pulse 1.4s ease-in-out infinite;
}
@keyframes pdm-pulse {
  0%,100% { box-shadow: 0 0 0 4px rgba(45,212,160,.18); }
  50%     { box-shadow: 0 0 0 7px rgba(45,212,160,.05); }
}

/* ---------- Promo strip pattern ---------------------------- */
.pdm-promo {
  background: var(--wp--preset--color--teal-ice);
  border: 1px solid var(--wp--preset--color--teal-light);
  border-radius: 12px;
  padding: 18px 24px;
  display: flex; align-items: center; gap: 16px;
}
.pdm-promo__icon {
  width: 44px; height: 44px;
  border-radius: 10px;
  background: var(--wp--preset--color--teal);
  color: var(--wp--preset--color--lime);
  display: inline-flex; align-items: center; justify-content: center;
  font-size: 22px;
  flex-shrink: 0;
}

/* ---------- WooCommerce overrides -------------------------- */
.woocommerce ul.products li.product .button,
.woocommerce-page ul.products li.product .button,
.woocommerce a.button.alt,
.woocommerce-page a.button.alt,
.woocommerce button.button.alt,
.woocommerce-page button.button.alt {
  background-color: var(--wp--preset--color--teal) !important;
  color: #fff !important;
  border-radius: 8px !important;
  font-family: var(--wp--preset--font-family--body) !important;
  font-weight: 600 !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
}
.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover {
  background-color: var(--wp--preset--color--teal-mid) !important;
}
.woocommerce ul.products li.product .price,
.woocommerce-page ul.products li.product .price {
  font-family: var(--wp--preset--font-family--display) !important;
  color: var(--wp--preset--color--teal) !important;
  font-weight: 700 !important;
}
.woocommerce span.onsale {
  background: var(--wp--preset--color--lime) !important;
  color: var(--wp--preset--color--ink) !important;
  border-radius: 999px !important;
  font-family: var(--wp--preset--font-family--body) !important;
  font-weight: 700 !important;
  padding: 4px 11px !important;
  min-height: 0 !important;
  min-width: 0 !important;
  line-height: 1 !important;
  text-transform: uppercase !important;
  font-size: 10.5px !important;
  letter-spacing: 0.08em !important;
}
.woocommerce-store-notice,
p.demo_store {
  background: var(--wp--preset--color--teal) !important;
  color: var(--wp--preset--color--teal-light) !important;
}

/* ---------- Forms (Contact 7 / WP forms) ------------------- */
input[type="text"], input[type="email"], input[type="tel"], input[type="search"],
textarea, select {
  border: 1px solid var(--wp--preset--color--cloud);
  border-radius: 8px;
  padding: 10px 12px;
  font-family: var(--wp--preset--font-family--body);
  font-size: 14px;
  background: var(--wp--preset--color--off-white);
}
input[type="text"]:focus, input[type="email"]:focus, input[type="tel"]:focus,
input[type="search"]:focus, textarea:focus, select:focus {
  outline: none;
  border-color: var(--wp--preset--color--teal);
  background: #fff;
  box-shadow: 0 0 0 3px rgba(0,122,124,.25);
}
