/* =====================================================================
   AstroGrace - SHOP + PRODUCT PAGE  (Flatsome child theme)   v3
   File: astrograce-shop.css  (child theme root, next to astrograce-homepage.css)
   Loads only on the shop and product-category pages (see functions-shop-snippet.php).
   Everything is scoped to .ag-shop, so no other page is affected.
   ===================================================================== */
.ag-shop{--ag-navy:#071a33;--ag-navy-2:#0b2444;--ag-ink:#173252;--ag-body:#4a5d74;--ag-gold:#c99a3b;--ag-gold-2:#e2bf72;--ag-gold-dk:#8d6b2e;--ag-line:#e7dfd0;--ag-ivory:#fbf8f1}

/* ---------- page background ---------- */
.ag-shop #wrapper,.ag-shop #main{background:var(--ag-ivory)}

/* ---------- title bar: navy band with a real heading ---------- */
.ag-shop .shop-page-title{position:relative;overflow:hidden;border:0;padding:50px 0 46px;
  background:radial-gradient(900px 280px at 85% -30%,rgba(201,154,59,.24),transparent 62%),linear-gradient(135deg,var(--ag-navy),var(--ag-navy-2))}
.ag-shop .shop-page-title .page-title-inner{min-height:0;flex-direction:column;align-items:center;text-align:center}
.ag-shop .shop-page-title .page-title-inner>.flex-col{flex:none;width:100%;order:1;text-align:center}
.ag-shop .shop-page-title .page-title-inner>.flex-col:not(.flex-grow),
.ag-shop .woocommerce-ordering,.ag-shop .woocommerce-result-count{display:none!important}
.ag-shop .shop-page-title .breadcrumbs,.ag-shop .shop-page-title .breadcrumbs a{font-family:"Jost","Helvetica Neue",Arial,sans-serif;font-size:12px;font-weight:500;letter-spacing:.2em;text-transform:uppercase;color:var(--ag-gold-2)!important}
.ag-shop .shop-page-title .breadcrumbs{margin:0 0 12px;opacity:.95}
.ag-shop .shop-page-title .breadcrumbs .divider{opacity:.6;margin:0 6px}
.ag-shop .shop-page-title .page-title-inner::before{content:"Vedic Astrology Reports";order:2;display:block;margin:0 0 10px;
  font:700 46px/1.08 "Cormorant Garamond",Georgia,serif;color:#fff;letter-spacing:.005em}
.ag-shop .shop-page-title .page-title-inner::after{content:"Personalised, chart-based guidance for the areas of life that matter most.";order:3;display:block;max-width:620px;
  font:400 17px/1.6 "Jost","Helvetica Neue",Arial,sans-serif;color:#cdd7e6}

/* ---------- grid: 3 across on desktop, 2 on tablet, 1 on phone; always centred ---------- */
.ag-shop .products.row{max-width:1100px!important;margin-left:auto!important;margin-right:auto!important;justify-content:center}
.ag-shop .products>.col{padding:0 12px 26px!important}
.ag-shop .products .col-inner{height:100%}
@media (min-width:850px){.ag-shop .products>.col{flex-basis:33.3333%!important;max-width:33.3333%!important}}
@media (min-width:550px) and (max-width:849px){.ag-shop .products>.col{flex-basis:50%!important;max-width:50%!important}}
@media (max-width:549px){.ag-shop .products>.col{flex-basis:100%!important;max-width:100%!important}}

/* ---------- the card ---------- */
.ag-shop .product-small.box{position:relative;display:flex!important;flex-direction:column;align-items:stretch!important;height:100%;overflow:hidden;
  background:#fff;border:1px solid var(--ag-line);border-radius:18px;box-shadow:0 10px 28px rgba(17,34,54,.08);
  transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease}
.ag-shop .product-small.box:hover{transform:translateY(-4px);box-shadow:0 18px 40px rgba(17,34,54,.14);border-color:#d8c08a}
.ag-shop .image-tools{display:none!important}

/* image area: fixed 4:3 frame (works in every browser), the picture fills it completely */
.ag-shop .product-small.box .box-image{position:relative!important;display:block!important;flex:0 0 auto;width:100%!important;height:0!important;
  padding:75% 0 0 0!important;margin:0!important;overflow:hidden;background:#0b2147;border-radius:0}
.ag-shop .product-small.box .box-image>div{position:absolute!important;top:0;left:0;width:100%!important;height:100%!important;padding:0!important;margin:0}
.ag-shop .product-small.box .box-image .image-cover{padding-top:0!important}
.ag-shop .product-small.box .box-image a{display:block!important;width:100%;height:100%}
.ag-shop .product-small.box .box-image img{position:absolute!important;top:0;left:0;display:block;width:100%!important;height:100%!important;
  max-width:none;object-fit:cover;transition:transform .5s ease}
.ag-shop .product-small.box:hover .box-image img{transform:scale(1.04)}
/* small "REPORT" tag, same style as the homepage cards */
.ag-shop .product-small.box .box-image::before{content:"Report";position:absolute;top:14px;left:14px;z-index:4;padding:4px 11px;border-radius:99px;
  background:rgba(7,26,51,.78);border:1px solid rgba(226,191,114,.7);color:#f1d89a;
  font:700 11px/1.4 "Jost","Helvetica Neue",Arial,sans-serif;letter-spacing:.16em;text-transform:uppercase}
/* "Most Popular" badge: shows on any product you mark as Featured (star icon in the Products list) */
.ag-shop .product.featured .box-image::after{content:"Most Popular";position:absolute;top:14px;right:14px;z-index:4;padding:5px 12px;border-radius:99px;
  background:linear-gradient(135deg,#d8ad52,#b98a2e);color:#fff;
  font:700 11px/1.4 "Jost","Helvetica Neue",Arial,sans-serif;letter-spacing:.12em;text-transform:uppercase}

/* text area: padded, left aligned, everything the full width of the card */
.ag-shop .product-small.box .box-text{position:static!important;display:flex!important;flex-direction:column;align-items:stretch!important;flex:1 1 auto;
  padding:22px 24px 22px!important;text-align:left!important}
.ag-shop .product-small.box .box-text>*{width:100%;box-sizing:border-box}
.ag-shop .box-text .title-wrapper{position:static!important;margin:0}
.ag-shop .box-text .product-title,.ag-shop .box-text .product-title a{position:static!important;margin:0 0 8px;text-align:left!important;
  font-family:"Cormorant Garamond",Georgia,serif!important;font-size:28px!important;line-height:1.12;font-weight:700!important;
  color:var(--ag-ink)!important;text-transform:none!important;letter-spacing:.005em}
.ag-shop .box-text .product-title a{margin:0}
.ag-shop .ag-shop-desc{margin:0 0 18px;font:400 15.5px/1.6 "Jost","Helvetica Neue",Arial,sans-serif;color:var(--ag-body)}
/* whole card is clickable */
.ag-shop .box-text .product-title a::after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;z-index:3}

/* price (left) + "View details" cue (right), full width with a thin line above */
.ag-shop .box-text .price-wrapper{display:flex!important;align-items:center;justify-content:space-between;gap:12px;
  width:100%!important;margin:auto 0 0!important;padding:14px 0 0!important;border-top:1px solid #eadfc7;text-align:left}
.ag-shop .price-wrapper .price{margin:0!important;font-family:"Jost","Helvetica Neue",Arial,sans-serif;font-size:21px;font-weight:600;color:var(--ag-ink)}
.ag-shop .price-wrapper .price del{opacity:.5;font-size:16px;margin-right:6px}
.ag-shop .price-wrapper .price ins{text-decoration:none}
.ag-shop .price-wrapper::after{content:"View details \2192";font:600 14.5px/1 "Jost","Helvetica Neue",Arial,sans-serif;color:var(--ag-gold-dk);transition:transform .2s ease;white-space:nowrap}
.ag-shop .product-small.box:hover .price-wrapper::after{transform:translateX(4px)}

/* star ratings off until each product has real reviews */
.ag-shop .star-rating,.ag-shop .rating-wrap{display:none!important}

@media (max-width:549px){
  .ag-shop .shop-page-title{padding:38px 0 34px}
  .ag-shop .shop-page-title .page-title-inner::before{font-size:34px}
  .ag-shop .shop-page-title .page-title-inner::after{font-size:15.5px;padding:0 12px}
  .ag-shop .box-text .product-title,.ag-shop .box-text .product-title a{font-size:26px!important}
}


/* =====================================================================
   v3 - SINGLE PRODUCT PAGE (body class .ag-product, set by functions-shop-snippet-part2.php)
   Gives the cover image half of the row instead of about a third.
   ===================================================================== */
.ag-product .product-main .product-gallery{flex-basis:50%!important;max-width:50%!important}
.ag-product .product-main .product-gallery .woocommerce-product-gallery__image img{width:100%;border-radius:14px}
@media (max-width:849px){
  .ag-product .product-main .product-gallery{flex-basis:100%!important;max-width:100%!important}
}


/* =====================================================================
   v4 - RELATED PRODUCTS on the single product page: same card look as the shop
   (full 4:3 cover, no cropping). Smaller type because these cards are narrower.
   ===================================================================== */
.ag-product{--ag-ink:#173252;--ag-line:#e7dfd0;--ag-gold-2:#e2bf72}
.ag-product .related .product-small.box{position:relative;display:flex!important;flex-direction:column;align-items:stretch!important;height:100%;overflow:hidden;
  background:#fff;border:1px solid var(--ag-line);border-radius:16px;box-shadow:0 8px 22px rgba(17,34,54,.08);
  transition:transform .25s ease,box-shadow .25s ease}
.ag-product .related .product-small.box:hover{transform:translateY(-3px);box-shadow:0 14px 32px rgba(17,34,54,.14)}
.ag-product .related .image-tools{display:none!important}
.ag-product .related .product-small.box .box-image{position:relative!important;display:block!important;flex:0 0 auto;width:100%!important;height:0!important;
  padding:75% 0 0 0!important;margin:0!important;overflow:hidden;background:#0b2147;border-radius:0}
.ag-product .related .product-small.box .box-image>div{position:absolute!important;top:0;left:0;width:100%!important;height:100%!important;padding:0!important;margin:0}
.ag-product .related .product-small.box .box-image .image-cover{padding-top:0!important}
.ag-product .related .product-small.box .box-image a{display:block!important;width:100%;height:100%}
.ag-product .related .product-small.box .box-image img{position:absolute!important;top:0;left:0;display:block;width:100%!important;height:100%!important;max-width:none;object-fit:cover}
.ag-product .related .product-small.box .box-text{position:static!important;display:flex!important;flex-direction:column;align-items:stretch!important;flex:1 1 auto;
  padding:16px 18px 18px!important;text-align:left!important}
.ag-product .related .box-text .title-wrapper{position:static!important;margin:0}
.ag-product .related .box-text .product-title,.ag-product .related .box-text .product-title a{position:static!important;margin:0 0 6px;text-align:left!important;
  font-family:"Cormorant Garamond",Georgia,serif!important;font-size:22px!important;line-height:1.15;font-weight:700!important;
  color:var(--ag-ink)!important;text-transform:none!important}
.ag-product .related .box-text .product-title a::after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;z-index:3}
.ag-product .related .box-text .price-wrapper{margin:auto 0 0!important;padding:10px 0 0!important;border-top:1px solid #eadfc7;text-align:left;width:100%}
.ag-product .related .price-wrapper .price{margin:0!important;font-family:"Jost","Helvetica Neue",Arial,sans-serif;font-size:18px;font-weight:600;color:var(--ag-ink)}
.ag-product .related .star-rating,.ag-product .related .rating-wrap{display:none!important}