/* =========================================================
   Noor Nama · WooCommerce skin  (shop · product · cart · checkout · account)
   Loaded only on WooCommerce pages. Uses the theme tokens.
   ========================================================= */

/* ---- typography + wrapper ---- */
.woocommerce, .woocommerce-page{ color:var(--ink); font-family:var(--ff-body); font-size:19px; }
.woocommerce h1,.woocommerce h2,.woocommerce h3,
.woocommerce .product_title,.woocommerce-loop-product__title,
.woocommerce-cart h1,.woocommerce-checkout h1{ font-family:var(--ff-display)!important; color:var(--sage)!important; font-weight:600; }
.woocommerce a{ color:var(--gold-deep); }
.woocommerce a:hover{ color:var(--sage-deep); }

/* ---- buttons: primary = gold noor pill ---- */
.woocommerce a.button.alt,.woocommerce button.button.alt,.woocommerce input.button.alt,
.woocommerce #respond input#submit.alt,
.woocommerce .single_add_to_cart_button,
.woocommerce #place_order,.woocommerce .checkout-button,
.woocommerce-cart .wc-proceed-to-checkout .button,
.wc-block-components-button.contained{
  background:var(--gold)!important; color:var(--forest-deep)!important;
  font-family:var(--ff-ui); font-weight:700; letter-spacing:.04em; text-transform:none;
  border:none!important; border-radius:40px!important; padding:15px 34px!important;
  box-shadow:0 6px 20px rgba(201,168,76,.26); transition:transform .16s ease, box-shadow .16s ease; }
.woocommerce a.button.alt:hover,.woocommerce button.button.alt:hover,.woocommerce input.button.alt:hover,
.woocommerce .single_add_to_cart_button:hover,.woocommerce #place_order:hover,
.woocommerce .checkout-button:hover,.wc-block-components-button.contained:hover{
  transform:translateY(-2px); box-shadow:0 9px 24px rgba(201,168,76,.34); color:var(--forest-deep)!important; }
/* secondary = sage outline */
.woocommerce a.button,.woocommerce button.button,.woocommerce input.button{
  background:transparent; color:var(--sage-deep); border:1px solid var(--line)!important;
  border-radius:40px; padding:12px 26px; font-family:var(--ff-ui); font-weight:600; letter-spacing:.03em; }
.woocommerce a.button:hover,.woocommerce button.button:hover{ background:var(--cream-2); border-color:var(--gold)!important; color:var(--sage-deep); }

/* ---- price ---- */
.woocommerce .price,.woocommerce .amount,.woocommerce span.woocommerce-Price-amount{
  font-family:var(--ff-display); color:var(--forest); font-weight:600; }
.woocommerce del .amount{ color:var(--ink-soft); }
.woocommerce ins{ text-decoration:none; }
.woocommerce span.onsale{ background:var(--gold); color:var(--forest-deep); border-radius:40px; font-family:var(--ff-ui);
  font-weight:700; font-size:12px; letter-spacing:.04em; min-height:auto; min-width:auto; padding:6px 14px; line-height:1; top:12px; }

/* ---- notices ---- */
.woocommerce-message,.woocommerce-info,.woocommerce-error,.woocommerce-noreviews{
  border-top:none!important; border-radius:12px; font-family:var(--ff-ui); font-size:15px; }
.woocommerce-message{ background:var(--cream-2); border:1px solid var(--line); box-shadow:inset 3px 0 0 var(--gold); color:var(--ink); }
.woocommerce-info{ background:linear-gradient(160deg,#0C4835,#08321e); border:none; box-shadow:inset 3px 0 0 var(--gold); color:#EFE7CF; }
.woocommerce-info a{ color:var(--gold-soft); }
.woocommerce-error{ background:#fbecea; border:1px solid #e6b8b0; box-shadow:inset 3px 0 0 #b4432f; color:#7a2f22; }
.woocommerce-message .button,.woocommerce-info .button{ box-shadow:none; }

/* ---- shop archive: name-card look ---- */
.woocommerce ul.products li.product,.woocommerce-page ul.products li.product{
  background:var(--cream-2); border:1px solid var(--line); border-radius:16px; padding:18px 18px 22px; text-align:center;
  transition:transform .16s ease, box-shadow .16s ease, border-color .16s ease; }
.woocommerce ul.products li.product:hover{ transform:translateY(-4px); border-color:rgba(201,168,76,.5); box-shadow:0 12px 30px rgba(94,115,99,.14); }
.woocommerce ul.products li.product img{ border-radius:12px; margin-bottom:14px; }
.woocommerce ul.products li.product .woocommerce-loop-product__title{ font-size:22px; padding:.2em 0 .3em; }
.woocommerce ul.products li.product .price{ font-size:20px; display:block; margin-bottom:12px; }

/* ---- single product ---- */
.woocommerce div.product .product_title{ font-size:clamp(30px,4vw,44px); margin-bottom:.2em; }
.woocommerce div.product p.price,.woocommerce div.product span.price{ font-size:28px; color:var(--forest); }
.woocommerce div.product .woocommerce-product-details__short-description{ font-size:20px; line-height:1.7; color:var(--ink); }
.woocommerce div.product form.cart{ background:var(--cream-2); border:1px solid var(--line); border-radius:16px; padding:22px; margin:18px 0; }
.woocommerce div.product form.cart div.quantity input.qty{ border:1px solid var(--line); border-radius:10px; padding:12px; background:#fff; }
.woocommerce .woocommerce-tabs ul.tabs{ border:none; }
.woocommerce .woocommerce-tabs ul.tabs::before{ border-color:var(--line); }
.woocommerce .woocommerce-tabs ul.tabs li{ background:transparent; border:none; border-radius:0; font-family:var(--ff-ui); }
.woocommerce .woocommerce-tabs ul.tabs li.active{ background:transparent; border-bottom:2px solid var(--gold); }
.woocommerce .woocommerce-tabs ul.tabs li a{ color:var(--sage); font-weight:600; }
.woocommerce div.product .woocommerce-tabs .panel h2{ color:var(--sage); }
/* subtle reflection note under add-to-cart */
.in-wc-note{ font-family:var(--ff-ui); font-size:13.5px; letter-spacing:.02em; color:var(--ink-soft); margin-top:14px; }
.in-wc-note b{ color:var(--sage-deep); }

/* ---- form fields (cart/checkout/account) ---- */
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce-page form .form-row input.input-text,
.woocommerce #order_comments,
.select2-container--default .select2-selection--single,
.woocommerce form .form-row .select2-selection{
  background:#fff!important; border:1px solid var(--line)!important; border-radius:10px!important;
  padding:13px 14px!important; font-family:var(--ff-ui); font-size:15px; color:var(--ink); line-height:1.4; box-shadow:none!important; min-height:48px; }
.woocommerce form .form-row input.input-text:focus,
.woocommerce form .form-row textarea:focus,
.select2-container--default.select2-container--focus .select2-selection--single{
  border-color:var(--gold)!important; outline:none!important; box-shadow:0 0 0 3px rgba(201,168,76,.18)!important; }
.woocommerce form .form-row label,.woocommerce-checkout label{ font-family:var(--ff-ui); font-size:14px; color:var(--sage-deep); }
.woocommerce .select2-dropdown{ border-color:var(--line); }

/* ---- cart + checkout tables / totals ---- */
.woocommerce table.shop_table{ border:1px solid var(--line); border-radius:14px; overflow:hidden; background:#fff; }
.woocommerce table.shop_table th{ font-family:var(--ff-ui); color:var(--sage-deep); font-size:14px; letter-spacing:.03em; }
.woocommerce-cart .cart_totals,
.woocommerce-checkout #order_review{
  background:var(--cream-2); border:1px solid var(--line); border-radius:16px; padding:8px 22px 18px; }
.woocommerce-checkout #order_review{ box-shadow:0 -3px 0 var(--gold) inset; }
.woocommerce-checkout #order_review_heading{ font-family:var(--ff-display); color:var(--sage); }
.woocommerce table.shop_table tfoot .order-total .amount,
.woocommerce .cart_totals .order-total .amount{ color:var(--forest); font-size:24px; }
#add_payment_method .wc-proceed-to-checkout, .woocommerce-cart .wc-proceed-to-checkout{ padding-top:12px; }
.woocommerce-checkout #payment{ background:var(--cream); border-radius:14px; }
.woocommerce-checkout #payment ul.payment_methods{ border-bottom:1px solid var(--line); }
.woocommerce-checkout #payment div.payment_box{ background:#fff; border-radius:10px; }
.woocommerce-checkout #payment div.payment_box::before{ border-bottom-color:#fff; }
.woocommerce #place_order{ width:100%; font-size:17px; margin-top:6px; }
.woocommerce form.checkout_coupon{ border:1px dashed var(--line); border-radius:12px; background:var(--cream-2); }

/* ---- checkout trust strip + ghayb note (injected) ---- */
.in-wc-trust{ display:flex; flex-wrap:wrap; gap:10px 22px; align-items:center; justify-content:center;
  background:var(--cream-2); border:1px solid var(--line); border-radius:40px; padding:12px 20px; margin:0 0 22px;
  font-family:var(--ff-ui); font-size:13.5px; letter-spacing:.02em; color:var(--sage-deep); }
.in-wc-disclaimer{ margin:16px auto 0; max-width:640px; text-align:center; font-family:var(--ff-ui);
  font-size:12.5px; line-height:1.7; color:var(--ink-soft); }

/* ---- my account + order received ---- */
.woocommerce-account .woocommerce-MyAccount-navigation ul{ border:1px solid var(--line); border-radius:14px; overflow:hidden; background:var(--cream-2); list-style:none; margin:0; padding:0; }
.woocommerce-account .woocommerce-MyAccount-navigation li{ border-bottom:1px solid var(--line-soft); }
.woocommerce-account .woocommerce-MyAccount-navigation li a{ display:block; padding:13px 18px; font-family:var(--ff-ui); font-size:14px; color:var(--sage); }
.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a{ background:#fff; color:var(--gold-deep); font-weight:700; }
.woocommerce-order .woocommerce-order-overview,
.woocommerce ul.order_details{ background:var(--cream-2); border:1px solid var(--line); border-radius:14px; }
.woocommerce ul.order_details li{ border-right:1px solid var(--line-soft); }
.woocommerce ul.order_details li strong{ color:var(--forest); font-family:var(--ff-display); }

/* ---- responsive ---- */
@media (max-width:768px){
  .woocommerce, .woocommerce-page{ font-size:17px; }
  .woocommerce div.product .product_title{ font-size:30px; }
  .in-wc-trust{ border-radius:16px; }
}

/* =========================================================
   v2 additions — cart/checkout embeds (native HTML blocks)
   + My Reports account tab. Uses theme tokens only.
   ========================================================= */

/* ---- shared hero band (cart + checkout) ---- */
.nn-wc-hero{ display:flex; gap:18px; align-items:flex-start;
  background:linear-gradient(160deg,var(--forest-deep),var(--forest) 60%,#123a2c);
  border-radius:16px; padding:30px 28px; margin:0 0 14px; }
.nn-wc-hero-compact{ padding:22px 28px; }
.nn-wc-hero-moon{ width:52px; height:52px; flex-shrink:0; border-radius:50%;
  background:linear-gradient(135deg,var(--gold),var(--gold-soft));
  display:flex; align-items:center; justify-content:center; font-size:24px;
  box-shadow:0 0 24px rgba(201,168,76,.35); }
.nn-wc-eyebrow{ display:block; font-family:var(--ff-ui); font-size:11px; font-weight:700;
  letter-spacing:.22em; text-transform:uppercase; color:var(--gold); margin-bottom:6px; }
.nn-wc-hero-title{ font-family:var(--ff-display)!important; font-weight:400;
  font-size:clamp(26px,4vw,36px); color:#FFFCF5!important; line-height:1.15; margin:0 0 6px; }
.nn-wc-hero-title em{ color:var(--gold); font-style:italic; }
.nn-wc-hero-sub{ font-family:var(--ff-ui); font-size:14px; color:rgba(255,252,245,.55);
  line-height:1.6; margin:0; }

/* ---- step indicator ---- */
.nn-wc-steps{ display:flex; align-items:center; gap:8px; flex-wrap:wrap;
  margin:0 0 22px; font-family:var(--ff-ui); }
.nn-wc-step{ display:inline-flex; align-items:center; gap:7px; font-size:12.5px;
  color:var(--ink-soft); letter-spacing:.03em; }
.nn-wc-step b{ width:24px; height:24px; border-radius:50%; display:inline-flex;
  align-items:center; justify-content:center; font-size:11px;
  background:var(--cream-2); border:1px solid var(--line); color:var(--ink-soft); }
.nn-wc-step.done b{ background:rgba(94,115,99,.12); border-color:var(--sage); color:var(--sage-deep); }
.nn-wc-step.done{ color:var(--sage-deep); }
.nn-wc-step.active b{ background:var(--gold); border-color:var(--gold); color:var(--forest-deep); font-weight:700; }
.nn-wc-step.active{ color:var(--sage-deep); font-weight:700; }
.nn-wc-step + .nn-wc-step::before{ content:'—'; margin-right:8px; color:var(--line); }

/* ---- "what your reflection includes" ---- */
.nn-wc-includes{ background:var(--cream-2); border:1px solid var(--line);
  border-radius:14px; margin:0 0 26px; }
.nn-wc-includes summary{ cursor:pointer; list-style:none; padding:15px 20px;
  font-family:var(--ff-ui); font-size:14px; font-weight:700; color:var(--gold-deep);
  letter-spacing:.03em; }
.nn-wc-includes summary::-webkit-details-marker{ display:none; }
.nn-wc-includes summary::after{ content:'▾'; float:right; color:var(--gold-deep);
  transition:transform .2s; }
.nn-wc-includes[open] summary::after{ transform:rotate(180deg); }
.nn-wc-inc-grid{ display:grid; grid-template-columns:1fr 1fr; gap:10px; padding:4px 20px 14px; }
.nn-wc-inc{ display:flex; gap:10px; align-items:flex-start; background:#fff;
  border:1px solid var(--line-soft); border-radius:10px; padding:11px 13px; }
.nn-wc-inc > span{ font-size:17px; flex-shrink:0; margin-top:1px; }
.nn-wc-inc strong{ display:block; font-family:var(--ff-ui); font-size:13.5px;
  color:var(--sage-deep); margin-bottom:2px; }
.nn-wc-inc small{ font-family:var(--ff-ui); font-size:12px; color:var(--ink-soft); line-height:1.5; }
.nn-wc-inc-note{ font-family:var(--ff-ui); font-size:12px; color:var(--ink-soft);
  font-style:italic; text-align:center; padding:0 20px 15px; margin:0; }

/* ---- My Reports account tab ---- */
.nn-my-reports-intro{ font-family:var(--ff-ui); font-size:15px; color:var(--ink);
  line-height:1.7; margin-bottom:20px; }
.nn-report-card{ display:flex; gap:16px; align-items:center; flex-wrap:wrap;
  background:var(--cream-2); border:1px solid var(--line); border-radius:14px;
  padding:18px 20px; margin-bottom:14px; }
.nn-report-card-icon{ width:44px; height:44px; flex-shrink:0; border-radius:12px;
  background:linear-gradient(135deg,var(--forest),#123a2c);
  display:flex; align-items:center; justify-content:center; font-size:20px; }
.nn-report-card-body{ flex:1; min-width:220px; }
.nn-report-card-title{ font-family:var(--ff-display); font-size:19px; font-weight:600;
  color:var(--sage-deep); margin:0 0 2px; }
.nn-report-card-meta{ font-family:var(--ff-ui); font-size:12.5px; color:var(--ink-soft); }
.nn-report-card-meta .nn-rc-status{ display:inline-block; padding:2px 9px; border-radius:20px;
  font-weight:700; font-size:11px; letter-spacing:.04em; margin-left:6px; }
.nn-rc-status.ready{ background:rgba(94,115,99,.14); color:var(--sage-deep); }
.nn-rc-status.pending{ background:rgba(201,168,76,.16); color:var(--gold-deep); }
.nn-report-card-actions{ display:flex; gap:9px; flex-wrap:wrap; }
.nn-report-card-actions .nn-btn-view,
.nn-report-card-actions .nn-btn-dl{ font-family:var(--ff-ui); font-size:13.5px;
  font-weight:700; letter-spacing:.03em; padding:10px 20px; border-radius:40px;
  text-decoration:none; transition:transform .15s ease, box-shadow .15s ease; }
.nn-btn-view{ background:var(--gold); color:var(--forest-deep)!important;
  box-shadow:0 4px 14px rgba(201,168,76,.25); }
.nn-btn-view:hover{ transform:translateY(-2px); }
.nn-btn-dl{ background:transparent; color:var(--sage-deep)!important;
  border:1px solid var(--line); }
.nn-btn-dl:hover{ border-color:var(--gold); }
.nn-my-reports-empty{ text-align:center; background:var(--cream-2);
  border:1px dashed var(--line); border-radius:14px; padding:44px 24px; }
.nn-my-reports-empty .nn-mre-moon{ font-size:34px; display:block; margin-bottom:10px; }
.nn-my-reports-empty h3{ font-family:var(--ff-display); color:var(--sage); margin:0 0 6px; }
.nn-my-reports-empty p{ font-family:var(--ff-ui); font-size:14px; color:var(--ink-soft);
  margin:0 0 18px; }

@media (max-width:680px){
  .nn-wc-hero{ flex-direction:column; gap:12px; padding:22px 20px; }
  .nn-wc-inc-grid{ grid-template-columns:1fr; }
  .nn-report-card{ flex-direction:column; align-items:flex-start; }
}

/* =========================================================
   v2.1 fixes — shop grid (kills the letter-stacking columns)
   ========================================================= */
.woocommerce ul.products,
.woocommerce-page ul.products{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:26px; width:100%; margin:0 0 30px!important; padding:0!important;
  list-style:none;
}
.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product{
  width:100%!important; float:none!important; margin:0!important;
  display:flex; flex-direction:column;
}
.woocommerce ul.products li.product .woocommerce-loop-product__link{
  display:flex; flex-direction:column; flex:1;
}
.woocommerce ul.products li.product .woocommerce-loop-product__title{
  font-size:20px; line-height:1.3; word-break:normal; overflow-wrap:break-word;
  min-height:0; flex:1;
}
.woocommerce ul.products li.product .button{ margin-top:auto; align-self:center; }
/* result-count + ordering on one row */
.woocommerce .woocommerce-result-count{ font-family:var(--ff-ui); font-size:14px; color:var(--ink-soft); }
.woocommerce .woocommerce-ordering select{
  border:1px solid var(--line); border-radius:10px; padding:10px 14px;
  background:#fff; font-family:var(--ff-ui); font-size:14px; color:var(--ink); }

@media (max-width:900px){
  .woocommerce ul.products, .woocommerce-page ul.products{ grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:560px){
  .woocommerce ul.products, .woocommerce-page ul.products{ grid-template-columns:1fr; }
}

/* =========================================================
   v2.1.1 — grid hardening
   Covers: classic loop (ul.products), WC product blocks
   (wc-block-grid), GP column classes, and any leftover
   float/width rules from parent or plugin CSS.
   ========================================================= */
.woocommerce ul.products::before,
.woocommerce ul.products::after,
.woocommerce-page ul.products::before,
.woocommerce-page ul.products::after{ display:none!important; content:none!important; }

.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product,
.woocommerce ul.products.columns-3 li.product,
.woocommerce-page ul.products.columns-3 li.product,
.woocommerce ul.products.columns-4 li.product,
.woocommerce-page ul.products.columns-4 li.product{
  width:100%!important; max-width:none!important;
  float:none!important; clear:none!important;
  margin:0!important;
}

/* WooCommerce "Products" blocks (block-based shop pages) */
.wc-block-grid__products{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:26px; margin:0 0 30px!important; padding:0!important; list-style:none;
}
.wc-block-grid__product{
  width:100%!important; max-width:none!important; float:none!important;
  margin:0!important; padding:18px 18px 22px!important;
  background:var(--cream-2); border:1px solid var(--line); border-radius:16px;
  text-align:center;
}
.wc-block-grid__product .wc-block-grid__product-title{
  font-family:var(--ff-display)!important; font-size:20px; color:var(--sage)!important;
  font-weight:600; line-height:1.3;
}
.wc-block-grid__product .wc-block-grid__product-price{
  font-family:var(--ff-display); color:var(--forest); font-weight:600; font-size:19px;
}
@media (max-width:900px){ .wc-block-grid__products{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:560px){ .wc-block-grid__products{ grid-template-columns:1fr; } }

/* =========================================================
   v2.1.2 — container reset on WooCommerce archives.
   The blog card-grid must never grid-ify site-main on shop.
   ========================================================= */
.woocommerce.archive .site-main,
.woocommerce-page.archive .site-main,
.post-type-archive-product .site-main,
.tax-product_cat .site-main,
.tax-product_tag .site-main{
  display:block!important; max-width:none!important;
}