/*
Theme Name: Rakhmani Activewear
Theme URI: https://rakhmani.com
Author: Rakhmani Activewear
Description: Custom storefront theme for Rakhmani Activewear — modest sportswear for Muslimah athletes in Malaysia. Built with WooCommerce support.
Version: 1.0.0
Text Domain: rakhmani-activewear
Requires PHP: 7.4
*/

:root{
  --teal-1:#0B2E29;
  --teal-2:#134238;
  --teal-3:#1B5147;
  --cream:#F3ECD8;
  --cream-deep:#E9DFC2;
  --ink:#1C2320;
  --gold:#C9A24B;
  --gold-light:#E4C878;
  --gold-deep:#8A6A28;
  --white:#FCFBF7;
  --font-display:'Cormorant Garamond', serif;
  --font-body:'Manrope', sans-serif;
  --font-mono:'IBM Plex Mono', monospace;
}
*{box-sizing:border-box;}
body{margin:0;font-family:var(--font-body);color:var(--ink);background:var(--white);line-height:1.5;-webkit-font-smoothing:antialiased;}
img{max-width:100%;display:block;}
a{color:inherit;text-decoration:none;}
button{font-family:inherit;cursor:pointer;}
.container{max-width:1180px;margin:0 auto;padding:0 24px;}

/* ---------- Ornate teal masthead ---------- */
.masthead{
  position:relative;
  background:
    radial-gradient(ellipse at 20% -10%, rgba(255,255,255,.05), transparent 45%),
    radial-gradient(ellipse at 85% 110%, rgba(0,0,0,.35), transparent 55%),
    linear-gradient(160deg, var(--teal-3) 0%, var(--teal-1) 70%);
  padding:34px 24px 30px;
  text-align:center;
  overflow:hidden;
}
.mast-flourish{position:absolute;width:170px;height:170px;opacity:.85;}
.mast-flourish.tl{top:-14px;left:-14px;}
.mast-flourish.tr{top:-14px;right:-14px;transform:scaleX(-1);}
.mast-flourish.bl{bottom:-14px;left:-14px;transform:scaleY(-1);}
.mast-flourish.br{bottom:-14px;right:-14px;transform:scale(-1,-1);}
.masthead-inner{position:relative;z-index:2;}
.masthead img.logo{height:96px;width:auto;margin:0 auto 4px;filter:drop-shadow(0 4px 10px rgba(0,0,0,.35));}
.masthead h1{font-family:var(--font-display);font-weight:700;font-size:44px;letter-spacing:.04em;color:var(--gold-light);margin:6px 0 2px;text-shadow:0 2px 12px rgba(0,0,0,.4);}
.masthead .sub{font-family:var(--font-mono);font-size:13px;letter-spacing:.4em;color:var(--cream);text-transform:uppercase;opacity:.85;}

/* ---------- Nav bar (cream) ---------- */
nav.mainnav{background:var(--cream);border-bottom:2px solid var(--gold);position:sticky;top:0;z-index:40;}
.nav-inner{display:flex;align-items:center;justify-content:center;gap:26px;padding:14px 24px;flex-wrap:wrap;font-family:var(--font-display);font-size:17px;font-weight:600;color:var(--teal-1);}
.nav-inner a{position:relative;padding:0 4px;}
.nav-inner a:hover{color:var(--gold-deep);}
.nav-inner ul{list-style:none;margin:0;padding:0;display:flex;gap:26px;flex-wrap:wrap;align-items:center;}
.nav-sep{color:var(--gold);opacity:.7;font-size:13px;}
.icon-actions{display:flex;gap:16px;align-items:center;margin-left:10px;}
.icon-actions a,.icon-actions button{background:none;border:none;font-size:18px;color:var(--teal-1);position:relative;}
.icon-actions .badge{position:absolute;top:-7px;right:-9px;background:var(--gold-deep);color:#fff;font-size:9px;width:15px;height:15px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-family:var(--font-body);}

/* ---------- Hero ---------- */
.hero{position:relative;min-height:520px;display:flex;align-items:center;background:var(--teal-1);background-size:cover;background-position:center 28%;overflow:hidden;}
.hero::after{content:'';position:absolute;inset:0;background:linear-gradient(100deg, rgba(11,46,41,.92) 0%, rgba(11,46,41,.6) 40%, rgba(11,46,41,.15) 75%);}
.hero-inner{position:relative;z-index:2;padding:70px 24px;max-width:560px;}
.hero-inner h2{font-family:var(--font-display);font-weight:700;font-size:56px;line-height:1.08;color:var(--white);margin:0 0 8px;text-shadow:0 2px 14px rgba(0,0,0,.4);}
.hero-inner h2 em{font-style:normal;color:var(--gold-light);}
.hero-inner p{color:var(--cream);font-size:16px;max-width:400px;margin:14px 0 30px;}
.btn-gold{display:inline-block;padding:15px 34px;border-radius:6px;background:linear-gradient(180deg, var(--gold-light), var(--gold-deep));color:#241c05;font-family:var(--font-display);font-weight:700;font-size:17px;letter-spacing:.03em;box-shadow:0 8px 22px rgba(0,0,0,.3);border:1px solid rgba(255,255,255,.3);}
.btn-gold:hover{filter:brightness(1.05);}

/* ---------- Section divider ---------- */
.divider{display:flex;align-items:center;justify-content:center;gap:14px;margin:0 0 30px;}
.divider img{height:26px;width:auto;}
.divider h2{font-family:var(--font-display);font-weight:700;font-size:32px;color:var(--teal-1);margin:0;letter-spacing:.02em;}

/* ---------- Popular collections ---------- */
.section-cream{background:var(--cream);padding:60px 0;}
.coll-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;}
.coll-card{position:relative;border-radius:4px;overflow:hidden;aspect-ratio:3/4;box-shadow:0 8px 24px rgba(0,0,0,.12);border:1px solid rgba(201,162,75,.4);}
.coll-card img{width:100%;height:100%;object-fit:cover;}
.coll-card .label{position:absolute;left:0;right:0;bottom:0;background:linear-gradient(180deg, transparent, rgba(11,46,41,.5) 30%, var(--teal-1) 100%);color:var(--gold-light);text-align:center;padding:26px 10px 14px;font-family:var(--font-display);font-weight:700;font-size:17px;letter-spacing:.02em;}
.coll-card .label::before,.coll-card .label::after{content:'✦';font-size:10px;margin:0 6px;opacity:.7;}

/* ---------- WooCommerce shop grid override ---------- */
.section-cream ul.products{list-style:none;display:grid;grid-template-columns:repeat(4,1fr);gap:20px;padding:0;margin:0;}
.section-cream ul.products li.product{background:#fff;border:1px solid rgba(201,162,75,.3);border-radius:8px;padding:14px;text-align:center;}
.section-cream ul.products li.product img{border-radius:6px;margin-bottom:10px;aspect-ratio:3/4;object-fit:cover;}
.section-cream ul.products li.product .woocommerce-loop-product__title{font-family:var(--font-display);font-weight:700;color:var(--teal-1);font-size:16px;}
.section-cream ul.products li.product .price{color:var(--gold-deep);font-weight:700;}
.section-cream ul.products li.product .button{background:var(--teal-1);color:var(--gold-light);border-radius:20px;padding:8px 18px;font-size:13px;margin-top:8px;display:inline-block;}

/* ---------- Customer favorites ---------- */
.section-white{background:var(--white);padding:60px 0 70px;}
.fav-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;}
.fav-card{position:relative;border-radius:4px;overflow:hidden;aspect-ratio:1/1;box-shadow:0 6px 18px rgba(0,0,0,.1);}
.fav-card img{width:100%;height:100%;object-fit:cover;}
.fav-card .cap{position:absolute;left:0;right:0;bottom:0;background:linear-gradient(0deg, rgba(11,46,41,.92), rgba(11,46,41,.05) 90%);color:var(--cream);text-align:center;padding:22px 8px 12px;font-family:var(--font-display);font-style:italic;font-weight:600;font-size:15px;}

/* ---------- Footer / trust bar ---------- */
footer.mainfoot{background:linear-gradient(180deg, var(--teal-1), #071c18);padding:30px 0 26px;border-top:3px solid var(--gold);}
.foot-row{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:22px;color:var(--cream);}
.pay-badge{display:flex;align-items:center;gap:8px;background:rgba(255,255,255,.06);padding:8px 16px;border-radius:8px;font-weight:700;font-size:15px;color:var(--cream);border:1px solid rgba(201,162,75,.25);}
.foot-links{display:flex;justify-content:center;gap:26px;margin-top:18px;font-size:12.5px;color:#9FBBB2;flex-wrap:wrap;}
.foot-links a:hover{color:var(--gold-light);}
.foot-copy{text-align:center;color:#6E8A82;font-size:11.5px;margin-top:16px;}

/* ---------- WhatsApp floater ---------- */
.wa-float{position:fixed;bottom:24px;left:24px;background:linear-gradient(135deg,#1FAA55,#0E7C3A);color:#fff;border-radius:14px;padding:12px 16px;display:flex;align-items:center;gap:10px;box-shadow:0 10px 26px rgba(0,0,0,.3);z-index:9998;border:1px solid rgba(255,255,255,.25);}
.wa-float .wa-icon{width:32px;height:32px;border-radius:50%;background:rgba(255,255,255,.18);display:flex;align-items:center;justify-content:center;font-size:16px;flex-shrink:0;}
.wa-float .wa-text{font-size:12px;line-height:1.3;}
.wa-float .wa-text b{display:block;font-size:13px;}

/* ---------- WooCommerce page basics (cart/checkout/account) ---------- */
.woocommerce-page .container,.woocommerce-account .container{padding-top:40px;padding-bottom:60px;}
.woocommerce-page h1.entry-title, .woocommerce-account h1.entry-title{font-family:var(--font-display);color:var(--teal-1);font-size:34px;}
.woocommerce a.button, .woocommerce button.button, .woocommerce input.button{background:var(--teal-1);color:var(--gold-light);border-radius:20px;border:none;padding:10px 22px;}
.woocommerce a.button:hover, .woocommerce button.button:hover{background:var(--gold-deep);color:#241c05;}
.woocommerce #payment #place_order{background:linear-gradient(180deg, var(--gold-light), var(--gold-deep));color:#241c05;font-weight:700;}

/* ---------- Account / Login / Signup ---------- */
.woocommerce-account .container,.woocommerce-checkout .container,.woocommerce-cart .container{max-width:1000px;}
.woocommerce-form-login, .woocommerce-form-register{
  background:var(--cream);border:1px solid var(--gold);border-radius:14px;
  padding:28px 26px;max-width:420px;
}
.woocommerce form .form-row label{font-weight:600;color:var(--teal-1);font-size:13px;}
.woocommerce form .form-row input.input-text, .woocommerce-page form .form-row input.input-text,
.woocommerce form select, .woocommerce-page form select,
.woocommerce-checkout textarea{
  border:1px solid rgba(11,46,41,.25) !important;border-radius:8px !important;
  padding:11px 13px !important;font-family:var(--font-body) !important;background:#fff !important;
}
.woocommerce form .form-row input.input-text:focus{border-color:var(--gold) !important;outline:none;}
.woocommerce-account .woocommerce-MyAccount-navigation ul{list-style:none;padding:0;background:var(--teal-1);border-radius:10px;overflow:hidden;}
.woocommerce-account .woocommerce-MyAccount-navigation li{border-bottom:1px solid rgba(255,255,255,.08);}
.woocommerce-account .woocommerce-MyAccount-navigation li a{display:block;padding:12px 18px;color:var(--cream);font-weight:600;}
.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a{color:var(--gold-light);background:rgba(255,255,255,.06);}
.woocommerce-account .woocommerce-MyAccount-content{background:#fff;border:1px solid rgba(201,162,75,.3);border-radius:10px;padding:24px;}
.u-column1,.u-column2{vertical-align:top;}
.lost_password a, .woocommerce-LostPassword a{color:var(--gold-deep);font-weight:600;}

/* ---------- Checkout page ---------- */
.woocommerce-checkout h3{font-family:var(--font-display);color:var(--teal-1);font-size:24px;font-weight:700;}
#customer_details{background:#fff;border:1px solid rgba(201,162,75,.3);border-radius:12px;padding:24px;margin-bottom:24px;}
#order_review, table.woocommerce-checkout-review-order-table{
  background:var(--cream);border:1px solid var(--gold);border-radius:12px;padding:20px !important;
}
table.woocommerce-checkout-review-order-table{border-collapse:collapse;width:100%;}
table.woocommerce-checkout-review-order-table th, table.woocommerce-checkout-review-order-table td{
  padding:10px 4px;border-bottom:1px dashed rgba(11,46,41,.2);
}
table.woocommerce-checkout-review-order-table .order-total td, table.woocommerce-checkout-review-order-table .order-total th{
  font-weight:800;color:var(--teal-1);font-size:16px;border-bottom:none;border-top:2px solid var(--gold);
}
#payment{background:var(--cream);border:1px solid var(--gold);border-radius:12px;margin-top:16px;}
#payment ul.payment_methods{border-bottom:1px solid rgba(201,162,75,.4) !important;padding:16px 16px 10px !important;}
#payment div.payment_box{background:#fff !important;border-radius:8px;border:1px solid rgba(201,162,75,.3) !important;}
#payment div.payment_box::before{border-bottom-color:#fff !important;}
.woocommerce-checkout #payment #place_order{width:100%;padding:15px;font-size:16px;margin-top:14px;}
.woocommerce-billing-fields h3, .woocommerce-shipping-fields h3, .woocommerce-additional-fields h3{
  font-family:var(--font-display);color:var(--teal-1);font-size:20px;margin-bottom:12px;
}

/* ---------- Cart page ---------- */
.woocommerce-cart table.shop_table{border:1px solid rgba(201,162,75,.3);border-radius:10px;overflow:hidden;}
.woocommerce-cart table.shop_table th{background:var(--teal-1);color:var(--gold-light);padding:12px;}
.cart-collaterals .cart_totals{background:var(--cream);border:1px solid var(--gold);border-radius:12px;padding:20px;}
.cart-collaterals .cart_totals h2{font-family:var(--font-display);color:var(--teal-1);}

@media(max-width:900px){
  .hero-inner h2{font-size:38px;}
  .coll-grid,.section-cream ul.products{grid-template-columns:repeat(2,1fr);}
  .fav-grid{grid-template-columns:repeat(2,1fr);}
  .nav-inner{font-size:14px;gap:14px;}
  .masthead h1{font-size:32px;}
  .wa-float .wa-text{display:none;}
}
