
/*
Theme Name: AEP Simple
Theme URI: https://theaep.link
Author: AEP
Description: Boutique WooCommerce theme — sticky blurred header, chic pastel styling, flexbox shop grid, uniform spacing, mobile emoji nav, and in-page product gallery.
Version: 3.4
License: GNU General Public License v2 or later
Text Domain: aep-simple
*/

/* ===== Design tokens ===== */
:root{
  --aep-wrap: 1100px;
  --aep-canvas: #f6efe8;
  --aep-surface: #ffffff;
  --aep-text: #3f3136;
  --aep-muted: #6c5a61;

  /* Logo-matching pinks */
  --aep-primary: #e4a7a7;
  --aep-primary-600: #d0847c;
  --aep-primary-700: #cd7376;

  --aep-border: #eadfe6;
  --aep-shadow: 0 6px 20px rgba(32,24,28,.06);
  --aep-shadow-soft: 0 8px 24px rgba(32,24,28,.05);
  --aep-focus: 0 0 0 3px rgba(208,132,124,0.30);
  --aep-radius: 12px;
  --aep-gap: 20px;
  --aep-gap-sm: 16px;
  --aep-pad: 20px;
  --aep-pad-sm: 16px;

  /* Unified button sizing */
  --aep-btn-fs: 15px;
  --aep-btn-py: 10px;
  --aep-btn-px: 16px;
  --aep-btn-radius: 18px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  color: var(--aep-text);
  background: linear-gradient(180deg, #fffaf8 0%, var(--aep-canvas) 40%, var(--aep-canvas) 100%);
  font-family: 'Poppins', 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  opacity: 0;               /* loading fade */
  transition: opacity .35s ease;
}
body.is-ready { opacity: 1; }

/* ===== Containers ===== */
.header-inner,
.container,
.site-main {
  max-width: var(--aep-wrap);
  margin-left: auto;
  margin-right: auto;
  padding-left: 16px;
  padding-right: 16px;
}
.site-main {
  padding-top: var(--aep-gap);
  padding-bottom: var(--aep-gap);
}

/* ===== Header & Nav ===== */
.site-header {
  position: sticky;
  top: 0;
  z-index: 50;
  background: var(--aep-surface);
  border-bottom: 1px solid var(--aep-border);
  padding: 12px 0 8px;
  transition: padding .18s ease, box-shadow .18s ease, background .18s ease, backdrop-filter .18s ease;
}
body.is-scrolled .site-header {
  box-shadow: 0 6px 16px rgba(32,24,28,.06);
  padding: 8px 0 6px;
  background: rgba(255,255,255,0.75);
  backdrop-filter: saturate(140%) blur(8px);
  -webkit-backdrop-filter: saturate(140%) blur(8px);
}
.header-inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
}
.site-logo img {
  display: block;
  max-height: 62px;
  width: auto;
  margin: 0 auto;
  transition: max-height .18s ease;
}
@media (max-width:700px){ .site-logo img{ max-height: 54px; } }
body.is-scrolled .site-logo img{ max-height: 54px; }

/* Nav */
.site-header nav ul{
  list-style: none; margin: 0; padding: 0;
  display: flex; flex-wrap: wrap; gap: var(--aep-gap); justify-content: center;
}
@media (max-width:700px){ .site-header nav ul{ gap: var(--aep-gap-sm); } }
.site-header nav ul li a{
  display: inline-block;
  background: var(--aep-primary);
  color: var(--aep-text);
  padding: var(--aep-btn-py) var(--aep-btn-px);
  border-radius: var(--aep-btn-radius);
  border: 1px solid var(--aep-border);
  font-weight: 600;
  font-size: var(--aep-btn-fs);
  text-decoration: none;
  box-shadow: 1px 1px 0 var(--aep-border);
  transition: transform .12s ease, box-shadow .15s ease, background .15s ease;
}
.site-header nav ul li a:hover{ background: var(--aep-primary-600); transform: translateY(1px); box-shadow: none; }
.site-header .current-menu-item > a,
.site-header .current_page_parent > a,
.site-header .current-menu-ancestor > a{ background: var(--aep-primary-600); box-shadow: none; }

/* === v3.4 Mobile nav: emojis only === */
@media (max-width:700px){
  .site-header nav ul li a{ font-size: 0 !important; }
  .site-header nav ul li a::before{
    content: attr(data-icon);
    font-size: 20px;
    line-height: 1;
  }
}

/* ===== Footer & Back-to-top ===== */
.site-footer {
  background: var(--aep-surface);
  border-top: 1px solid var(--aep-border);
  margin-top: var(--aep-gap);
  padding: 20px;
  text-align: center;
}
.back-to-top{
  position: fixed; right: 14px; bottom: 16px; width: 44px; height: 44px;
  background: var(--aep-primary); border: 1px solid var(--aep-border);
  border-radius: 999px; display:flex; align-items:center; justify-content:center;
  box-shadow: var(--aep-shadow); cursor: pointer;
  transition: transform .12s ease, box-shadow .15s ease, background .15s ease;
  z-index: 99; opacity: 0; pointer-events: none;
}
.back-to-top.show{ opacity: 1; pointer-events: auto; }
.back-to-top:hover{ background: var(--aep-primary-600); transform: translateY(-1px); }
.back-to-top span{ font-size: 18px; }

/* ===== Universal cards (top-level only) ===== */
.aep-card,
.entry-content > *:not(.alignwide):not(.alignfull):not(.wp-block-image):not(figure),
.woocommerce .woocommerce-cart-form,
.woocommerce .cart-collaterals,
.woocommerce .woocommerce-checkout,
.woocommerce .woocommerce-account .woocommerce-MyAccount-content,
.woocommerce .woocommerce-account .woocommerce-MyAccount-navigation,
.woocommerce .woocommerce-order,
.woocommerce .woocommerce-notices-wrapper > *{
  background: var(--aep-surface);
  border: 1px solid var(--aep-border);
  border-radius: var(--aep-radius);
  box-shadow: var(--aep-shadow-soft);
  padding: var(--aep-pad);
  margin-bottom: var(--aep-gap);
}
@media (max-width:700px){
  .aep-card,
  .entry-content > *:not(.alignwide):not(.alignfull):not(.wp-block-image):not(figure),
  .woocommerce .woocommerce-cart-form,
  .woocommerce .cart-collaterals,
  .woocommerce .woocommerce-checkout,
  .woocommerce .woocommerce-account .woocommerce-MyAccount-content,
  .woocommerce .woocommerce-account .woocommerce-MyAccount-navigation,
  .woocommerce .woocommerce-order,
  .woocommerce .woocommerce-notices-wrapper > *{
    padding: var(--aep-pad-sm);
    margin-bottom: var(--aep-gap-sm);
  }
}

/* ===== Buttons & Forms ===== */
.wp-element-button, .wp-block-button__link, button,
input[type=submit], input[type=button], input[type=reset],
.woocommerce a.button, .woocommerce button.button,
.woocommerce input.button, .woocommerce #respond input#submit{
  background: var(--aep-primary); color: var(--aep-text);
  border: 1px solid var(--aep-border); border-radius: var(--aep-btn-radius); box-shadow: var(--aep-shadow);
  font-weight: 700; font-size: var(--aep-btn-fs);
  padding: var(--aep-btn-py) var(--aep-btn-px);
  transition: transform .08s ease, box-shadow .15s ease, background .15s ease, filter .15s ease;
}
.woocommerce a.button:hover, .woocommerce button.button:hover,
.woocommerce input.button:hover, .woocommerce #respond input#submit:hover,
.wp-element-button:hover, .wp-block-button__link:hover, button:hover,
input[type=submit]:hover, input[type=button]:hover, input[type=reset]:hover{
  background: var(--aep-primary-600);
  filter: drop-shadow(0 0 10px rgba(208,132,124,0.4));
  transform: translateY(1px); box-shadow: 0 8px 18px rgba(32,24,28,.10);
}

/* Inputs */
input[type=text], input[type=email], input[type=url], input[type=password],
input[type=search], input[type=tel], textarea, select, .wp-block-search__input{
  background: var(--aep-surface); color: var(--aep-text);
  border: 1px solid var(--aep-border); border-radius: 10px; padding: 10px 12px;
  transition: border-color .15s ease, box-shadow .15s ease;
}
input:focus, textarea:focus, select:focus, .wp-block-search__input:focus{
  outline: none; border-color: var(--aep-primary-600); box-shadow: var(--aep-focus);
}

/* ===== Woo list grid ===== */
.woocommerce ul.products{
  display: flex; flex-wrap: wrap; justify-content: center; gap: var(--aep-gap);
  margin: 0 auto; padding: 0; max-width: 100%; width: 100%;
  list-style: none;
}
@media (max-width:700px){ .woocommerce ul.products{ gap: var(--aep-gap-sm); } }
.woocommerce ul.products li.product{
  flex: 1 1 260px; max-width: 260px; margin: 0;
  background: var(--aep-surface); border: 1px solid var(--aep-border); border-radius: 12px;
  box-shadow: 0 6px 18px rgba(32,24,28,.08);
  padding: calc(var(--aep-pad) - 4px);
  transition: transform .15s ease, box-shadow .2s ease;
}
.woocommerce ul.products li.product:hover{ transform: translateY(-2px); box-shadow: 0 10px 22px rgba(32,24,28,.12); }
.woocommerce ul.products li.product a img{
  border-radius: 10px; width: 100%; height: auto; aspect-ratio: 4 / 5; object-fit: cover;
}
/* Product titles neutral & sized like buttons */
.woocommerce ul.products li.product .woocommerce-loop-product__title{
  color: var(--aep-text) !important;
  font-size: var(--aep-btn-fs);
  font-weight: 700;
  margin-top: 10px;
  margin-bottom: 6px;
}
.woocommerce ul.products li.product a.woocommerce-LoopProduct-link,
.woocommerce ul.products li.product a.woocommerce-loop-product__link{
  color: var(--aep-text) !important; text-decoration: none;
}
@media (max-width:700px){
  .woocommerce ul.products{ display: flex !important; flex-direction: column !important; align-items: center !important; }
  .woocommerce ul.products li.product{ width: 100% !important; max-width: 360px !important; }
}

/* Sale badge */
.woocommerce span.onsale{
  background: var(--aep-primary); color: var(--aep-text);
  border:1px solid var(--aep-border); border-radius: 999px;
  box-shadow: var(--aep-shadow); padding:.25rem .6rem;
  min-height: auto; min-width: auto; line-height:1.2; font-weight:700;
  top:12px; left:12px;
}

/* Tables */
.woocommerce table.shop_table{ width:100%; border-collapse:collapse; background:var(--aep-surface); border:1px solid var(--aep-border); border-radius:12px; overflow:hidden; }
.woocommerce table.shop_table th, .woocommerce table.shop_table td{ padding:12px 16px; border-bottom:1px solid #f1e9ef; }
.woocommerce table.shop_table th{ background:#fff1f1; font-weight:700; color:var(--aep-text); }

/* ===== Single product layout ===== */
.single-product .site-main{ padding-top: var(--aep-gap); padding-bottom: var(--aep-gap); }
.single-product div.product{
  background: var(--aep-surface); border: 1px solid var(--aep-border); border-radius: var(--aep-radius);
  box-shadow: var(--aep-shadow-soft); padding: var(--aep-pad); margin-bottom: var(--aep-gap);
  display: grid; grid-template-columns: 1fr; gap: var(--aep-gap);
}
@media(min-width:900px){ .single-product div.product{ grid-template-columns: minmax(320px,1fr) minmax(320px,1fr); align-items: start; } }
@media(min-width:1100px){ .single-product div.product{ grid-template-columns: 1.2fr 0.8fr; } }
.single-product div.product .images, .single-product div.product .summary{ float:none !important; width:auto !important; max-width:100%; margin:0; }
.woocommerce div.product div.images img{ border-radius: 12px; }
.woocommerce div.product .summary{ padding: 0; background: transparent; border: 0; box-shadow: none; }

/* Tabs header only (panel is flat) */
.woocommerce div.product .woocommerce-tabs{ grid-column: 1 / -1; margin-top: var(--aep-gap); }
.woocommerce div.product .woocommerce-tabs ul.tabs{
  display:flex; gap:10px; list-style:none; margin: var(--aep-gap) 0 var(--aep-pad) 0; padding:0;
  border-bottom:1px solid var(--aep-border);
}
.woocommerce div.product .woocommerce-tabs ul.tabs li{ margin:0; padding:0; }
.woocommerce div.product .woocommerce-tabs ul.tabs li a{
  display:inline-block; padding:8px 12px; border-radius:10px; text-decoration:none;
  background: var(--aep-primary); border:1px solid var(--aep-border); color: var(--aep-text);
}
.woocommerce div.product .woocommerce-tabs .panel{ background: transparent; border:0; box-shadow:none; padding: 0; margin-top: var(--aep-gap); }

/* Related/upsells section below */
.single-product .related, .single-product .upsells{
  max-width: var(--aep-wrap); margin: var(--aep-gap) auto; padding: 0 16px; clear: both;
}
.single-product .related h2, .single-product .upsells h2{ margin-bottom: var(--aep-gap-sm); }
.single-product .related ul.products,
.single-product .upsells ul.products{
  display:flex !important; flex-wrap:wrap; justify-content:center; gap: var(--aep-gap);
  max-width:100% !important; margin:0 auto; padding-left:0 !important;
}
@media (max-width:700px){
  .single-product .related ul.products, .single-product .upsells ul.products{ gap: var(--aep-gap-sm); }
}
.single-product .related ul.products li.product,
.single-product .upsells ul.products li.product{ flex: 1 1 260px; max-width:260px; margin:0; }

/* ===== Gallery thumbnails ===== */
.woocommerce div.product div.images{ position: relative; }
.woocommerce div.product div.images .woocommerce-product-gallery__image{ border-radius: 12px; overflow:hidden; }
.woocommerce div.product div.images .flex-control-nav,
.woocommerce div.product div.images .woocommerce-product-gallery__thumbnails{
  display: grid; grid-template-columns: repeat(auto-fill, minmax(96px, 1fr)); gap: 10px;
  margin-top: 10px; padding: 0; list-style: none;
}
@media (min-width:1100px){
  .woocommerce div.product div.images .flex-control-nav,
  .woocommerce div.product div.images .woocommerce-product-gallery__thumbnails{
    grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
    gap: 12px;
  }
}
.woocommerce div.product div.images .flex-control-nav li,
.woocommerce div.product div.images .woocommerce-product-gallery__thumbnails li{ margin: 0; width:auto !important; }
.woocommerce div.product div.images .flex-control-nav img,
.woocommerce div.product div.images .woocommerce-product-gallery__thumbnails img{
  width: 100%; height:auto; aspect-ratio: 1/1; object-fit: cover;
  display:block; border-radius:8px; border:1px solid var(--aep-border);
  cursor: pointer; transition: box-shadow .15s ease, transform .12s ease;
}
.woocommerce div.product div.images .flex-control-nav img:hover,
.woocommerce div.product div.images .woocommerce-product-gallery__thumbnails img:hover{
  box-shadow: 0 0 0 2px var(--aep-primary-600); transform: translateY(-1px);
}

/* ===== Empty cart/checkout button sizing ===== */
.woocommerce .return-to-shop{
  display: flex; justify-content: center; margin-top: var(--aep-gap-sm);
}
.woocommerce .return-to-shop .button,
.woocommerce .return-to-shop a.button,
.woocommerce .return-to-shop .wp-element-button{
  width: auto !important; max-width: none !important; height: auto !important; aspect-ratio: auto !important;
  padding: var(--aep-btn-py) var(--aep-btn-px) !important; line-height: 1.2 !important;
  display: inline-flex !important; align-items: center; justify-content: center; box-shadow: var(--aep-shadow); border-radius: var(--aep-btn-radius);
}

/* ===== 404 ===== */
.aep-404{ max-width:680px; margin:40px auto; padding:0 16px; }
.aep-404 .bubble{ background:var(--aep-surface); border:1px solid var(--aep-border); border-radius:16px; box-shadow: var(--aep-shadow); padding:28px; text-align:center; }
.aep-404 .shop-link{ display:inline-block; margin-top:16px; background:var(--aep-primary); border:1px solid var(--aep-border); padding:10px 16px; border-radius:999px; text-decoration:none; font-weight:700; }
.aep-404 .shop-link:hover{ background: var(--aep-primary-600); }
