/*
Theme Name: AlphaEdge
Theme URI: https://alphaedge.example.com
Author: AlphaEdge
Author URI: https://alphaedge.example.com
Description: AlphaEdge — a clean, modern demo storefront theme with a warm neutral palette and terracotta accent. Includes 16 curated demo products, a cart drawer, product detail pages and a checkout flow (client-side demo, no payment processing).
Version: 1.0.0
Requires at least: 5.8
Tested up to: 6.5
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: alphaedge
Tags: e-commerce, one-column, custom-menu, custom-logo, featured-images, threaded-comments, translation-ready
*/

/* Reset + base */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;
  font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif;
  color:#1a1a1a;
  background:#ffffff;
  line-height:1.5;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}
button{font:inherit;cursor:pointer;border:none;background:none;color:inherit}
h1,h2,h3,h4{margin:0;font-weight:600;letter-spacing:-0.01em}
p{margin:0}

/* Design tokens */
:root{
  --bg:#ffffff;
  --fg:#1a1a1a;
  --muted:#f5f2ee;
  --muted-fg:#6b6660;
  --border:#e8e3dd;
  --primary:#C45D3C;
  --primary-fg:#ffffff;
  --accent:#f0ebe5;
  --radius:10px;
  --shadow-sm:0 1px 2px rgba(0,0,0,.04);
  --shadow-lg:0 20px 40px rgba(0,0,0,.12);
  --maxw:1200px;
}

/* Header */
.ae-header{
  position:sticky;top:0;z-index:50;
  background:rgba(255,255,255,.85);backdrop-filter:blur(10px);
  border-bottom:1px solid var(--border);
}
.ae-header-inner{
  max-width:var(--maxw);margin:0 auto;
  padding:16px 20px;display:flex;align-items:center;justify-content:space-between;gap:16px;
}
.ae-logo{font-size:20px;font-weight:600;letter-spacing:-0.02em}
.ae-nav{display:flex;gap:28px}
.ae-nav a{font-size:14px;color:var(--muted-fg);font-weight:500}
.ae-nav a:hover{color:var(--fg)}
.ae-cart-btn{
  position:relative;padding:8px;border-radius:999px;transition:background .15s;
}
.ae-cart-btn:hover{background:var(--accent)}
.ae-cart-badge{
  position:absolute;top:2px;right:2px;background:var(--primary);color:var(--primary-fg);
  border-radius:999px;min-width:18px;height:18px;padding:0 5px;
  font-size:10px;font-weight:600;display:flex;align-items:center;justify-content:center;
}
@media (max-width:640px){.ae-nav{display:none}}

/* Hero */
.ae-hero{background:var(--muted)}
.ae-hero-inner{
  max-width:var(--maxw);margin:0 auto;padding:64px 20px;
  display:grid;gap:48px;align-items:center;
}
@media (min-width:900px){.ae-hero-inner{grid-template-columns:1fr 1fr;padding:96px 20px}}
.ae-hero h1{font-size:40px;line-height:1.1}
@media (min-width:900px){.ae-hero h1{font-size:56px}}
.ae-hero p{margin-top:16px;color:var(--muted-fg);font-size:18px;max-width:500px}
.ae-btn{
  display:inline-flex;align-items:center;gap:8px;
  background:var(--primary);color:var(--primary-fg);
  padding:14px 24px;border-radius:var(--radius);
  font-size:14px;font-weight:500;transition:opacity .15s;margin-top:32px;
}
.ae-btn:hover{opacity:.9}
.ae-btn-block{width:100%;justify-content:center;margin-top:0}
.ae-hero-img{aspect-ratio:4/3;border-radius:16px;overflow:hidden}
.ae-hero-img img{width:100%;height:100%;object-fit:cover}

/* Section + grid */
.ae-section{max-width:var(--maxw);margin:0 auto;padding:64px 20px}
.ae-filters{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:40px}
.ae-chip{
  padding:8px 20px;border-radius:999px;background:var(--muted);color:var(--muted-fg);
  font-size:14px;font-weight:500;transition:background .15s,color .15s;
}
.ae-chip:hover{background:var(--accent);color:var(--fg)}
.ae-chip.is-active{background:var(--primary);color:var(--primary-fg)}
.ae-grid{
  display:grid;gap:32px 24px;grid-template-columns:1fr;
}
@media (min-width:600px){.ae-grid{grid-template-columns:repeat(2,1fr)}}
@media (min-width:900px){.ae-grid{grid-template-columns:repeat(3,1fr)}}
@media (min-width:1100px){.ae-grid{grid-template-columns:repeat(4,1fr)}}

/* Card */
.ae-card{display:block;transition:transform .3s}
.ae-card-img{
  aspect-ratio:4/5;background:var(--muted);border-radius:14px;overflow:hidden;
}
.ae-card-img img{width:100%;height:100%;object-fit:cover;transition:transform .5s}
.ae-card:hover .ae-card-img img{transform:scale(1.05)}
.ae-card-body{padding:12px 4px 0}
.ae-card-name{font-size:14px;font-weight:500}
.ae-card-rating{display:flex;align-items:center;gap:4px;margin-top:4px;font-size:12px;color:var(--muted-fg)}
.ae-star{color:var(--primary)}
.ae-card-price{margin-top:4px;font-size:14px;font-weight:600}

/* Product detail */
.ae-product{max-width:var(--maxw);margin:0 auto;padding:40px 20px}
.ae-product-grid{display:grid;gap:40px}
@media (min-width:900px){.ae-product-grid{grid-template-columns:1fr 1fr;gap:64px}}
.ae-gallery-main{aspect-ratio:1;background:var(--muted);border-radius:16px;overflow:hidden}
.ae-gallery-main img{width:100%;height:100%;object-fit:cover}
.ae-gallery-thumbs{display:flex;gap:12px;margin-top:12px;flex-wrap:wrap}
.ae-thumb{
  width:80px;height:80px;border-radius:10px;overflow:hidden;
  border:2px solid transparent;background:var(--muted);
}
.ae-thumb.is-active{border-color:var(--primary)}
.ae-thumb img{width:100%;height:100%;object-fit:cover}
.ae-price{font-size:28px;font-weight:600;margin-top:8px}
.ae-category{font-size:12px;color:var(--muted-fg);text-transform:uppercase;letter-spacing:0.08em}
.ae-desc{color:var(--muted-fg);margin-top:20px;line-height:1.7}
.ae-selector{margin-top:24px}
.ae-selector-label{font-size:13px;font-weight:500;margin-bottom:8px}
.ae-opts{display:flex;flex-wrap:wrap;gap:8px}
.ae-opt{
  padding:8px 16px;border:1px solid var(--border);border-radius:8px;
  font-size:13px;background:#fff;transition:all .15s;
}
.ae-opt:hover{border-color:var(--fg)}
.ae-opt.is-active{background:var(--fg);color:#fff;border-color:var(--fg)}
.ae-add{
  margin-top:32px;width:100%;padding:16px;border-radius:var(--radius);
  background:var(--primary);color:var(--primary-fg);font-weight:500;font-size:14px;
  transition:opacity .15s;
}
.ae-add:hover{opacity:.9}
.ae-back{display:inline-flex;align-items:center;gap:6px;color:var(--muted-fg);font-size:14px;margin-bottom:20px}
.ae-back:hover{color:var(--fg)}

/* Cart drawer */
.ae-drawer-backdrop{
  position:fixed;inset:0;background:rgba(0,0,0,.3);z-index:60;
  opacity:0;pointer-events:none;transition:opacity .2s;
}
.ae-drawer-backdrop.is-open{opacity:1;pointer-events:auto}
.ae-drawer{
  position:fixed;top:0;right:0;height:100%;width:100%;max-width:420px;
  background:#fff;z-index:70;display:flex;flex-direction:column;
  transform:translateX(100%);transition:transform .25s ease;
  box-shadow:var(--shadow-lg);
}
.ae-drawer.is-open{transform:translateX(0)}
.ae-drawer-head{
  display:flex;align-items:center;justify-content:space-between;
  padding:16px 24px;border-bottom:1px solid var(--border);
}
.ae-drawer-head h2{font-size:17px}
.ae-drawer-body{flex:1;overflow-y:auto;padding:16px 24px}
.ae-drawer-foot{border-top:1px solid var(--border);padding:16px 24px}
.ae-drawer-empty{text-align:center;color:var(--muted-fg);padding:40px 0}
.ae-line{display:flex;gap:16px;padding:16px 0;border-bottom:1px solid var(--border)}
.ae-line:last-child{border-bottom:none}
.ae-line-img{width:80px;height:80px;border-radius:10px;object-fit:cover;background:var(--muted)}
.ae-line-body{flex:1;display:flex;flex-direction:column;justify-content:space-between;gap:8px}
.ae-line-name{font-size:14px;font-weight:500}
.ae-line-variant{font-size:12px;color:var(--muted-fg);margin-top:2px}
.ae-line-row{display:flex;align-items:center;justify-content:space-between;gap:8px}
.ae-qty{display:flex;align-items:center;gap:6px}
.ae-qty-btn{
  width:26px;height:26px;border-radius:6px;border:1px solid var(--border);
  display:flex;align-items:center;justify-content:center;font-size:14px;
}
.ae-qty-btn:hover{background:var(--muted)}
.ae-qty-val{min-width:20px;text-align:center;font-size:13px}
.ae-line-remove{color:var(--muted-fg);font-size:16px;padding:4px}
.ae-line-remove:hover{color:#c0392b}
.ae-line-price{font-size:14px;font-weight:600}
.ae-subtotal{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}
.ae-subtotal span:first-child{color:var(--muted-fg);font-size:14px}
.ae-subtotal span:last-child{font-size:18px;font-weight:600}
.ae-drawer-close{padding:6px;border-radius:999px}
.ae-drawer-close:hover{background:var(--muted)}

/* Checkout */
.ae-checkout{max-width:1000px;margin:0 auto;padding:40px 20px}
.ae-checkout-title{font-size:28px;margin-bottom:32px}
.ae-checkout-grid{display:grid;gap:40px}
@media (min-width:900px){.ae-checkout-grid{grid-template-columns:1.4fr 1fr}}
.ae-form-block{margin-bottom:28px}
.ae-form-block h3{font-size:16px;margin-bottom:12px}
.ae-field{margin-bottom:12px}
.ae-field label{display:block;font-size:13px;color:var(--muted-fg);margin-bottom:6px}
.ae-field input,.ae-field select{
  width:100%;padding:12px 14px;border:1px solid var(--border);border-radius:var(--radius);
  font-size:14px;background:#fff;font-family:inherit;
}
.ae-field input:focus,.ae-field select:focus{outline:none;border-color:var(--primary)}
.ae-row-2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.ae-summary{background:var(--muted);border-radius:14px;padding:24px;height:fit-content}
.ae-summary h3{font-size:16px;margin-bottom:16px}
.ae-summary-line{display:flex;justify-content:space-between;font-size:14px;padding:8px 0}
.ae-summary-line.total{border-top:1px solid var(--border);padding-top:16px;margin-top:8px;font-size:16px;font-weight:600}
.ae-place{
  margin-top:20px;width:100%;padding:16px;border-radius:var(--radius);
  background:var(--primary);color:var(--primary-fg);font-weight:500;font-size:14px;
}
.ae-place:hover{opacity:.9}
.ae-empty-cart{text-align:center;padding:60px 20px;color:var(--muted-fg)}
.ae-empty-cart a{color:var(--primary);text-decoration:underline}

/* Footer */
.ae-footer{border-top:1px solid var(--border);padding:32px 20px;text-align:center;color:var(--muted-fg);font-size:13px;margin-top:60px}

/* Toast */
.ae-toast{
  position:fixed;bottom:24px;left:50%;transform:translateX(-50%) translateY(20px);
  background:var(--fg);color:#fff;padding:12px 20px;border-radius:10px;
  font-size:14px;z-index:100;opacity:0;pointer-events:none;transition:all .2s;
}
.ae-toast.is-show{opacity:1;transform:translateX(-50%) translateY(0)}
