/* ============================================================
   CEE WooCommerce takeover — shop / category / product pages.
   The whole page sits on one flowing gradient; the theme's gray
   content boxes are dissolved; products float as modern cards;
   a small one-line handwritten greeting sits top-left. No big
   header band.
   ============================================================ */

/* ---- 1. One flowing gradient behind the entire page ---- */
body.cee-woo-flat {
  background: #eff4fa !important;
  background-attachment: fixed !important;
}

/* ---- 2. Dissolve the theme's gray content boxes so the gradient shows ---- */
body.cee-woo-flat .page-header,
body.cee-woo-flat .header-half-background,
body.cee-woo-flat .hestia-title,
body.cee-woo-flat .title-in-header { display: none !important; }

body.cee-woo-flat #content,
body.cee-woo-flat .content,
body.cee-woo-flat .blog-post,
body.cee-woo-flat .site-content,
body.cee-woo-flat .site-main,
body.cee-woo-flat .container,
body.cee-woo-flat .container-fluid,
body.cee-woo-flat #primary,
body.cee-woo-flat .col-md-12,
body.cee-woo-flat .woocommerce,
body.cee-woo-flat .woocommerce-page,
body.cee-woo-flat main,
body.cee-woo-flat .wrapper,
body.cee-woo-flat article,
body.cee-woo-flat .hentry,
body.cee-woo-flat .type-product,
body.cee-woo-flat .single-product-content {
  background: transparent !important;
  box-shadow: none !important;
}

/* Kill the large empty gap the theme leaves at the top of product pages */
body.cee-woo-flat #content,
body.cee-woo-flat .content,
body.cee-woo-flat .blog-post,
body.cee-woo-flat #primary,
body.cee-woo-flat .container,
body.cee-woo-flat main {
  margin-top: 0 !important;
  padding-top: 0 !important;
}
body.single-product.cee-woo-flat #content,
body.single-product.cee-woo-flat .content { padding-top: 18px !important; }

/* ---- 3. Small, one-line handwritten greeting (top-left) ---- */
.cee-woo-greet {
  max-width: 1180px;
  margin: 0 auto;
  padding: 42px 26px 4px;
}
.cee-woo-greet-line {
  display: inline-block;
  font-family: 'Caveat', cursive !important;
  font-weight: 700 !important;
  color: #1d3043 !important;
  font-size: clamp(19px, 2.3vw, 27px) !important;
  line-height: 1.25 !important;
  letter-spacing: .01em;
  clip-path: inset(0 100% 0 0);
  animation: cee-woo-write 1.35s cubic-bezier(.4, 0, .2, 1) .2s forwards;
}
.cee-woo-greet-line em {
  font-style: normal !important;
  color: #3d6f9e !important;
}
@keyframes cee-woo-write { to { clip-path: inset(0 0 0 0); } }

/* ---- 4. Breadcrumb / result count / sorting, clean on the gradient ---- */
body.cee-woo-flat .woocommerce-breadcrumb {
  max-width: 1180px; margin: 0 auto 4px !important; padding: 0 26px !important;
  color: #6d8499 !important; font-size: 13px !important; font-weight: 700 !important;
}
body.cee-woo-flat .woocommerce-breadcrumb a { color: #6d8499 !important; }
body.cee-woo-flat .woocommerce-result-count { color: #45617c !important; font-weight: 700 !important; }
body.cee-woo-flat .woocommerce-ordering select,
body.cee-woo-flat select.orderby {
  background: #fff !important; border: 1.5px solid #d4e2ef !important; border-radius: 10px !important;
  padding: 9px 34px 9px 13px !important; color: #1d3043 !important; font-weight: 700 !important;
  box-shadow: 0 6px 18px -12px rgba(29,48,67,.3) !important;
}

/* ---- 5. Products as modern floating cards (NOT the county category tiles) ---- */
body.cee-woo-flat ul.products { gap: 26px !important; }
body.cee-woo-flat ul.products li.product:not(.product-category) {
  background: #fff !important;
  border: 1px solid #e6eef7 !important;
  border-radius: 20px !important;
  box-shadow: 0 22px 48px -30px rgba(29,48,67,.4) !important;
  padding: 16px !important;
  overflow: hidden !important;
  transition: transform .22s ease, box-shadow .22s ease !important;
}
body.cee-woo-flat ul.products li.product:not(.product-category):hover {
  transform: translateY(-7px) !important;
  box-shadow: 0 34px 64px -30px rgba(29,48,67,.5) !important;
}
body.cee-woo-flat ul.products li.product:not(.product-category) img {
  border-radius: 14px !important;
  margin-bottom: 14px !important;
}
body.cee-woo-flat ul.products li.product:not(.product-category) h2,
body.cee-woo-flat ul.products li.product:not(.product-category) h3,
body.cee-woo-flat ul.products li.product:not(.product-category) .woocommerce-loop-product__title {
  font-family: 'Playfair Display', serif !important;
  color: #1d3043 !important;
  font-size: 20px !important;
  font-weight: 700 !important;
}

/* ---- 5b. County category tiles — flat, no box, just enlarged logo + name.
   mix-blend-mode unifies the logos' white/cream backgrounds into the page. ---- */
body.cee-woo-flat ul.products li.product-category,
body.cee-woo-flat ul.products li.product-category > a,
body.cee-woo-flat ul.products li.product-category .card,
body.cee-woo-flat ul.products li.product-category figure,
body.cee-woo-flat ul.products li.product-category .box-shadow {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  border-radius: 0 !important;
}
body.cee-woo-flat ul.products li.product-category {
  padding: 12px !important;
  text-align: center !important;
  transition: transform .2s ease !important;
}
body.cee-woo-flat ul.products li.product-category:hover { transform: translateY(-4px) !important; }
body.cee-woo-flat ul.products li.product-category a { display: block !important; }
body.cee-woo-flat ul.products li.product-category img {
  width: 150px !important;
  height: 150px !important;
  max-width: 70% !important;
  object-fit: contain !important;
  margin: 0 auto 12px !important;
  padding: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  mix-blend-mode: multiply !important;
  transition: transform .2s ease !important;
}
body.cee-woo-flat ul.products li.product-category:hover img { transform: scale(1.05) !important; }
body.cee-woo-flat ul.products li.product-category h2,
body.cee-woo-flat ul.products li.product-category .woocommerce-loop-category__title {
  font-family: 'Playfair Display', serif !important;
  color: #1d3043 !important;
  font-size: 21px !important;
  font-weight: 700 !important;
  margin: 0 !important;
}
body.cee-woo-flat ul.products li.product-category .count {
  color: #6d8499 !important;
  font-weight: 700 !important;
  background: transparent !important;
  border: 0 !important;
}

/* ---- Responsive + motion ---- */
@media (max-width: 600px) {
  .cee-woo-greet { padding: 26px 18px 2px; }
  body.cee-woo-flat ul.products li.product { border-radius: 16px !important; }
}
@media (prefers-reduced-motion: reduce) {
  .cee-woo-greet-line { clip-path: none !important; animation: none !important; }
  body.cee-woo-flat ul.products li.product { transition: none !important; }
}

/* ============================================================
   Shop top: left-aligned soft toggle + small inline greeting,
   sitting inside the product display.
   ============================================================ */
.cee-shop-top {
  max-width: 1180px;
  margin: 4px auto 0;
  padding: 4px 26px 0;
  display: flex;
  justify-content: flex-start;
}
/* Handwritten greeting, top-right — sits opposite the breadcrumb line. */
.cee-woo-greet-top {
  max-width: 1180px;
  margin: -30px auto 6px;
  padding: 0 26px;
  text-align: right;
  position: relative;
  z-index: 3;
  pointer-events: none;
}
.cee-woo-greet-line {
  font-family: 'Caveat', cursive !important;
  font-weight: 700 !important;
  color: #1d3043 !important;
  font-size: clamp(17px, 2vw, 23px) !important;
  line-height: 1.2 !important;
  margin: 0 !important;
  display: inline-block;
  pointer-events: auto;
  clip-path: inset(0 100% 0 0);
  animation: cee-woo-write 1.35s cubic-bezier(.4, 0, .2, 1) .2s forwards;
}
.cee-woo-greet-line em { font-style: normal !important; color: #3d6f9e !important; }
@keyframes cee-woo-write { to { clip-path: inset(0 0 0 0); } }
@media (max-width: 768px) {
  .cee-woo-greet-top { margin: 8px auto 0; text-align: left; }
}

/* Flat List / Map toggle — nothing behind it, just the two labels. */
.cee-view-toggle {
  display: inline-flex;
  background: transparent !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  padding: 0 !important;
  gap: 6px;
}
.cee-vt-btn {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  cursor: pointer;
  font-family: 'Nunito Sans', system-ui, sans-serif;
  font-size: 13.5px;
  font-weight: 700;
  color: #6d8499 !important;
  padding: 8px 12px;
  border-radius: 0 !important;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  transition: color .2s ease;
}
.cee-vt-btn svg { width: 15px; height: 15px; }
.cee-vt-btn:hover { color: #3d6f9e !important; }
.cee-vt-btn.is-on {
  background: transparent !important;
  color: #3d6f9e !important;
  font-weight: 800;
}

.cee-cmap-wrap { display: none; }
body.cee-map-on .cee-cmap-wrap { display: block; }
body.cee-map-on ul.products,
body.cee-map-on .woocommerce-result-count,
body.cee-map-on .woocommerce-ordering,
body.cee-map-on nav.woocommerce-pagination { display: none !important; }

/* ============================================================
   ROBUST FLAT LAYER
   Keyed on WordPress core body classes (.tax-product_cat /
   .post-type-archive-product) as well as our own .cee-woo-flat,
   so the gradient + flattening apply even if the custom class is
   ever stripped by the theme/Elementor. End-of-file = wins ties.
   ============================================================ */
html { background: #eff4fa; }

body.cee-woo-flat,
body.tax-product_cat,
body.post-type-archive-product {
  background: #eff4fa !important;
  background-attachment: fixed !important;
}

/* Dissolve every opaque theme/Elementor wrapper between body and the grid. */
body.tax-product_cat #content,
body.tax-product_cat .content,
body.tax-product_cat #primary,
body.tax-product_cat .wrap,
body.tax-product_cat .container,
body.tax-product_cat .container-fluid,
body.tax-product_cat main,
body.tax-product_cat .site-content,
body.tax-product_cat .site-main,
body.tax-product_cat .blog-post,
body.tax-product_cat .woocommerce,
body.tax-product_cat .woocommerce-page,
body.tax-product_cat .elementor,
body.tax-product_cat .elementor-section,
body.tax-product_cat .elementor-container,
body.tax-product_cat .elementor-widget-wrap,
body.tax-product_cat .e-con,
body.tax-product_cat .entry-content,
body.tax-product_cat .page-content,
body.post-type-archive-product #content,
body.post-type-archive-product .content,
body.post-type-archive-product #primary,
body.post-type-archive-product .wrap,
body.post-type-archive-product .container,
body.post-type-archive-product main,
body.post-type-archive-product .woocommerce {
  background: transparent !important;
  box-shadow: none !important;
}

/* County tiles: fully flat, no box, large logo filling the tile. */
body.tax-product_cat ul.products li.product-category,
body.tax-product_cat ul.products li.product-category > a,
body.tax-product_cat ul.products li.product-category .card,
body.tax-product_cat ul.products li.product-category figure,
body.tax-product_cat ul.products li.product-category .box-shadow,
body.post-type-archive-product ul.products li.product-category,
body.post-type-archive-product ul.products li.product-category > a,
body.post-type-archive-product ul.products li.product-category .card {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  padding: 0 !important;
}
body.tax-product_cat ul.products li.product-category,
body.post-type-archive-product ul.products li.product-category {
  padding: 14px 10px !important;
  text-align: center !important;
}
body.tax-product_cat ul.products li.product-category img,
body.post-type-archive-product ul.products li.product-category img {
  width: 200px !important;
  height: auto !important;
  max-width: 88% !important;
  margin: 0 auto 14px !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  mix-blend-mode: multiply !important;
  transition: transform .2s ease !important;
}
body.tax-product_cat ul.products li.product-category:hover img,
body.post-type-archive-product ul.products li.product-category:hover img { transform: scale(1.05) !important; }
body.tax-product_cat ul.products li.product-category h2,
body.post-type-archive-product ul.products li.product-category h2,
body.tax-product_cat ul.products li.product-category .woocommerce-loop-category__title {
  font-family: 'Playfair Display', serif !important;
  color: #1d3043 !important;
  font-size: 22px !important;
  font-weight: 700 !important;
  margin: 0 !important;
}
body.tax-product_cat ul.products li.product-category .count,
body.post-type-archive-product ul.products li.product-category .count {
  color: #6d8499 !important;
  font-weight: 700 !important;
  background: transparent !important;
  border: 0 !important;
}

/* Professional cards: flatten too — soft translucent, no hard edges. */
body.tax-product_cat ul.products li.product:not(.product-category),
body.post-type-archive-product ul.products li.product:not(.product-category) {
  background: rgba(255,255,255,.55) !important;
  -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
  border: 1px solid rgba(255,255,255,.65) !important;
  box-shadow: 0 18px 44px -30px rgba(29,48,67,.4) !important;
  border-radius: 18px !important;
}
body.tax-product_cat ul.products li.product:not(.product-category) img,
body.post-type-archive-product ul.products li.product:not(.product-category) img {
  box-shadow: none !important;
}
