/* ==========================================================================
   AKNAS — cart + checkout skin
   The markup underneath is WooCommerce native (spec §9: do not rebuild
   cart/checkout logic). This file only restyles it to the locked system.
   ========================================================================== */

.akn-shop { padding: clamp(30px,4vw,66px) var(--akn-pad) clamp(50px,6vw,90px); }
.akn-shop-head { margin-bottom: clamp(26px,3vw,40px); }
.akn-shop-head .akn-lbl { color: var(--akn-grey); }
.akn-shop-head h1 { font-size: clamp(34px,4.6vw,58px); margin: 13px 0 0; }
.akn-shop-head h1 i { font-style: italic; color: var(--akn-grey); }
.akn-shop-head p { color: var(--akn-soft); margin-top: 16px; max-width: 46ch; font-size: 15px; line-height: 1.66; }

/* progress rail — cart → details → payment */
.akn-steps { display: flex; flex-wrap: wrap; gap: 22px; border-block: 1px solid var(--akn-line); padding: 14px 0; margin-bottom: clamp(26px,3vw,40px); }
.akn-steps span { font-size: 10px; font-weight: 500; letter-spacing: .22em; text-transform: uppercase; color: var(--akn-grey); }
.akn-steps span.akn-on { color: var(--akn-ink); }
.akn-steps span.akn-on::before { content: ""; display: inline-block; width: 14px; height: 1px; background: var(--akn-oxblood); vertical-align: middle; margin-right: 9px; }

/* ── generic Woo resets inside the Aknas scope ────────────────────────── */
.akn-shop .woocommerce-message,
.akn-shop .woocommerce-info,
.akn-shop .woocommerce-error {
  background: var(--akn-paper-2);
  border: 1px solid var(--akn-line);
  border-top: 1px solid var(--akn-oxblood);
  color: var(--akn-soft);
  padding: 16px 20px;
  font-size: 13.5px;
  list-style: none;
  margin: 0 0 24px;
}
.akn-shop .woocommerce-message::before,
.akn-shop .woocommerce-info::before,
.akn-shop .woocommerce-error::before { display: none; }

.akn-shop table.shop_table {
  border: 0; border-collapse: collapse; width: 100%; margin: 0;
}
.akn-shop table.shop_table th {
  font-family: Jost, sans-serif; font-size: 10px; font-weight: 500;
  letter-spacing: .18em; text-transform: uppercase; color: var(--akn-grey);
  border-bottom: 1px solid var(--akn-line); padding: 12px 8px; text-align: left;
}
.akn-shop table.shop_table td {
  border-bottom: 1px solid var(--akn-line); padding: 18px 8px;
  font-size: 14px; color: var(--akn-soft); vertical-align: top;
}
.akn-shop table.shop_table td.product-name a,
.akn-shop table.shop_table td.product-name {
  font-family: 'Bodoni Moda', Didot, Georgia, serif; font-size: 17px; color: var(--akn-ink);
}
.akn-shop table.shop_table .product-thumbnail img { width: 62px; height: auto; aspect-ratio: 3/4; object-fit: cover; }
.akn-shop table.shop_table td.product-price,
.akn-shop table.shop_table td.product-subtotal,
.akn-shop .cart-subtotal td, .akn-shop .order-total td { color: var(--akn-oxblood); }
.akn-shop .variation { font-size: 11px; letter-spacing: .11em; text-transform: uppercase; color: var(--akn-grey); }
.akn-shop .variation dt, .akn-shop .variation dd { display: inline; margin: 0; font-weight: 400; }

/* quantity field + steppers (steppers injected by akn-bag.js on the cart) */
.akn-shop .quantity {
  display: inline-flex; align-items: stretch; width: max-content;
  border: 1px solid var(--akn-line); background: var(--akn-paper);
}
.akn-shop .quantity input.qty {
  width: 52px; height: 44px; text-align: center;
  border: 0; background: transparent;
  font-family: Jost, sans-serif; font-size: 13px; color: var(--akn-ink);
  -moz-appearance: textfield;
}
.akn-shop .quantity input.qty::-webkit-outer-spin-button,
.akn-shop .quantity input.qty::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.akn-shop .akn-qstep {
  width: 40px; height: 44px; background: transparent;
  color: var(--akn-soft); font-size: 16px; line-height: 1;
  border: 0; touch-action: manipulation; transition: color .16s;
}
.akn-shop .akn-qstep.akn-qminus { border-right: 1px solid var(--akn-line); }
.akn-shop .akn-qstep.akn-qplus { border-left: 1px solid var(--akn-line); }
.akn-shop .akn-qstep:hover { color: var(--akn-ink); }

/* remove — matched to the drawer's "Remove" text link, not Woo's red circle × */
.akn-shop td.product-remove { text-align: left; }
.akn-shop a.remove {
  display: inline-block; font-size: 0; line-height: 1;
  width: auto; height: auto; color: var(--akn-grey) !important; background: none !important;
}
.akn-shop a.remove::after {
  content: "Remove"; font-size: 10px; font-weight: 500; letter-spacing: .14em;
  text-transform: uppercase; border-bottom: 1px solid transparent; padding-bottom: 1px;
}
.akn-shop a.remove:hover { color: var(--akn-oxblood) !important; }
.akn-shop a.remove:hover::after { border-bottom-color: var(--akn-oxblood); }

/* totals + coupon */
.akn-shop .cart_totals h2,
.akn-shop .cross-sells h2,
.akn-shop #order_review_heading,
.akn-shop .woocommerce-billing-fields h3,
.akn-shop .woocommerce-additional-fields h3 {
  font-family: 'Bodoni Moda', Didot, Georgia, serif; font-weight: 400;
  font-size: clamp(22px,2.6vw,30px); color: var(--akn-ink); margin: 0 0 18px;
}
.akn-shop .cart_totals table th { border: 0; }
.akn-shop .cart_totals table td { border-bottom: 1px solid var(--akn-line); }
.akn-shop .order-total th, .akn-shop .order-total td {
  font-family: 'Bodoni Moda', Didot, Georgia, serif; font-size: 21px; color: var(--akn-ink);
}
.akn-shop .coupon { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 20px; }
.akn-cart-grid { display: grid; gap: clamp(30px,4vw,54px); }
@media (min-width: 900px) { .akn-cart-grid { grid-template-columns: 1.35fr .65fr; align-items: start; } }
.akn-cart-side { border: 1px solid var(--akn-line); padding: clamp(20px,2.4vw,28px); }

.akn-freebar { margin-top: 14px; }
.akn-freebar p { font-size: 12px; color: var(--akn-grey); line-height: 1.6; }
.akn-freebar i { display: block; height: 2px; background: var(--akn-line); margin-bottom: 10px; }
.akn-freebar i b { display: block; height: 2px; background: var(--akn-oxblood); width: 0; }

/* ── form fields ──────────────────────────────────────────────────────── */
.akn-shop .form-row { display: block; margin: 0 0 16px; padding: 0; }
.akn-shop label {
  display: block; font-size: 10px; font-weight: 500; letter-spacing: .2em;
  text-transform: uppercase; color: var(--akn-grey); margin-bottom: 8px;
}
.akn-shop .required { color: var(--akn-oxblood); border: 0; text-decoration: none; }
.akn-shop input[type="text"],
.akn-shop input[type="email"],
.akn-shop input[type="tel"],
.akn-shop input[type="number"],
.akn-shop input[type="password"],
.akn-shop select,
.akn-shop textarea,
.akn-shop .select2-container .select2-selection--single {
  width: 100%; background: var(--akn-paper);
  border: 1px solid var(--akn-line); border-radius: 0;
  padding: 14px 15px; height: auto;
  font-family: Jost, sans-serif; font-weight: 300; font-size: 15px;
  color: var(--akn-ink); box-shadow: none; transition: border-color .18s;
}
.akn-shop textarea { min-height: 110px; resize: vertical; }
.akn-shop input:focus, .akn-shop select:focus, .akn-shop textarea:focus {
  border-color: var(--akn-ink); outline: none;
}
.akn-shop .select2-container .select2-selection--single { display: flex; align-items: center; }
.akn-shop .select2-container--default .select2-selection--single .select2-selection__arrow { height: 100%; }

.akn-checkout-grid { display: grid; gap: clamp(30px,4vw,54px); }
@media (min-width: 960px) { .akn-checkout-grid { grid-template-columns: 1.1fr .9fr; align-items: start; } }

/* payment box — COD / JazzCash / Easypaisa */
.akn-shop #payment { background: transparent; border-radius: 0; }
.akn-shop #payment ul.payment_methods {
  border: 1px solid var(--akn-line); border-bottom: 0; padding: 0; margin: 0;
}
.akn-shop #payment ul.payment_methods li {
  border-bottom: 1px solid var(--akn-line); padding: 16px 18px; list-style: none;
}
.akn-shop #payment ul.payment_methods li label {
  display: inline; font-family: Jost, sans-serif; font-size: 12px;
  letter-spacing: .16em; text-transform: uppercase; color: var(--akn-ink); margin: 0;
}
.akn-shop #payment div.payment_box {
  background: var(--akn-paper-2); border-radius: 0; margin: 12px 0 0;
  padding: 14px 16px; font-size: 13.5px; color: var(--akn-soft); line-height: 1.6;
}
.akn-shop #payment div.payment_box::before { display: none; }
.akn-shop .woocommerce-terms-and-conditions-wrapper { margin: 18px 0; font-size: 13px; color: var(--akn-soft); }

/* ── my account (native [woocommerce_my_account], restyled) ───────────── */
.akn-account-grid { display: grid; gap: clamp(30px,4vw,54px); }
@media (min-width: 900px) { .akn-account-grid { grid-template-columns: 1.4fr .6fr; align-items: start; } }
.akn-account-main { min-width: 0; }

/* Woo floats the account nav left at 35% and the content right. Inside a
   constrained column that cramps both, so the nav becomes a hairline chip row
   above the content and everything runs full width beneath it. */
.akn-shop--account .woocommerce-MyAccount-navigation,
.akn-shop--account .woocommerce-MyAccount-content {
  float: none; width: auto;
}
.akn-shop--account .woocommerce-MyAccount-navigation {
  border-block: 1px solid var(--akn-line);
  margin: 0 0 clamp(24px,3vw,36px);
}
.akn-shop--account .woocommerce-MyAccount-navigation ul {
  display: flex; flex-wrap: wrap; gap: 4px 26px;
  list-style: none; margin: 0; padding: 0;
}
.akn-shop--account .woocommerce-MyAccount-navigation li { margin: 0; }
.akn-shop--account .woocommerce-MyAccount-navigation li a {
  display: inline-block; padding: 14px 0;
  font-size: 12px; letter-spacing: .14em; text-transform: uppercase;
  color: var(--akn-soft); border-bottom: 1px solid transparent;
}
.akn-shop--account .woocommerce-MyAccount-navigation li a:hover { color: var(--akn-ink); }
.akn-shop--account .woocommerce-MyAccount-navigation li.is-active a {
  color: var(--akn-ink); border-bottom-color: var(--akn-oxblood);
}
.akn-shop--account .woocommerce-MyAccount-content p { color: var(--akn-soft); font-size: 15px; line-height: 1.66; }
.akn-shop--account .woocommerce-MyAccount-content a:not(.button) { color: var(--akn-oxblood); }
.akn-shop--account .woocommerce-MyAccount-content mark { background: var(--akn-paper-2); color: var(--akn-ink); }

/* login / register (logged out) */
.akn-shop--account .u-columns.col2-set,
.akn-shop--account .u-columns { display: grid; gap: clamp(24px,4vw,40px); }
@media (min-width: 720px) { .akn-shop--account .u-columns.col2-set { grid-template-columns: 1fr 1fr; } }
.akn-shop--account form.login,
.akn-shop--account form.register {
  border: 1px solid var(--akn-line);
  padding: clamp(24px,3vw,36px); margin: 12px 0 0;
}
.akn-shop--account .woocommerce-form-login__rememberme,
.akn-shop--account .woocommerce-form-login__rememberme span { font-size: 13px; color: var(--akn-soft); letter-spacing: 0; text-transform: none; }

/* addresses */
.akn-shop--account .woocommerce-Addresses { display: grid; gap: clamp(20px,3vw,32px); }
@media (min-width: 620px) { .akn-shop--account .woocommerce-Addresses { grid-template-columns: 1fr 1fr; } }
.akn-shop--account .woocommerce-Address { border: 1px solid var(--akn-line); padding: clamp(20px,2.4vw,28px); }
.akn-shop--account .woocommerce-Address address { font-style: normal; color: var(--akn-soft); font-size: 14px; line-height: 1.7; }
.akn-shop--account .woocommerce-Address-title h3 {
  font-family: 'Bodoni Moda', Didot, Georgia, serif; font-weight: 400;
  font-size: 20px; color: var(--akn-ink); margin: 0 0 12px;
}

/* the small "Open" link on a help row */
.akn-help-link {
  display: inline-block; margin-top: 4px;
  font-size: 11px; letter-spacing: .13em; text-transform: uppercase;
  color: var(--akn-oxblood); border-bottom: 1px solid var(--akn-oxblood); padding-bottom: 1px;
}

/* ── empty cart ───────────────────────────────────────────────────────── */
.akn-empty { border: 1px solid var(--akn-line); padding: clamp(34px,5vw,64px) var(--akn-gpad); text-align: left; }
.akn-empty h2 { font-family: 'Bodoni Moda', Didot, Georgia, serif; font-weight: 400; font-size: clamp(24px,3vw,34px); margin: 0 0 12px; }
.akn-empty p { color: var(--akn-soft); font-size: 15px; line-height: 1.66; max-width: 40ch; margin-bottom: 24px; }

/* ── preview fallback (WooCommerce inactive / editor canvas) ──────────── */
.akn-preview-note {
  border: 1px solid var(--akn-line); border-left: 2px solid var(--akn-oxblood);
  padding: 14px 18px; margin-bottom: 26px;
  font-size: 12.5px; color: var(--akn-soft); line-height: 1.6;
}

/* ── order received ───────────────────────────────────────────────────── */
/* The confirmation runs full width: no checkout grid, no sidebar. A thank-you
   page hooked to woocommerce_thankyou gets the whole canvas rather than the
   55% column the checkout form sits in. */
.akn-shop--received { padding-inline: 0; }
.akn-checkout-done { width: 100%; max-width: none; }
.akn-checkout-done > .woocommerce { width: 100%; }

/* Woo's own confirmation furniture, restyled for the times it is left on.
   Hidden entirely when the order details table is removed in favour of a
   custom page — these rules simply have nothing to match then. */
.akn-checkout-done .woocommerce-order-overview,
.akn-checkout-done ul.order_details {
  list-style: none; margin: 0 0 clamp(26px,3vw,40px);
  padding: 0 var(--akn-pad);
  display: flex; flex-wrap: wrap; gap: 0;
  border-block: 1px solid var(--akn-line);
}
.akn-checkout-done ul.order_details li {
  flex: 1 1 auto; padding: 18px 22px 18px 0;
  font-size: 11px; letter-spacing: .18em; text-transform: uppercase;
  color: var(--akn-grey); border: 0;
}
.akn-checkout-done ul.order_details li strong {
  display: block; margin-top: 7px;
  font-family: 'Bodoni Moda', Didot, Georgia, serif;
  font-size: 19px; letter-spacing: 0; text-transform: none;
  color: var(--akn-ink); font-weight: 400;
}
.akn-checkout-done .woocommerce-order-details,
.akn-checkout-done .woocommerce-customer-details { padding-inline: var(--akn-pad); }
.akn-checkout-done .woocommerce-order-details h2,
.akn-checkout-done .woocommerce-customer-details h2 {
  font-family: 'Bodoni Moda', Didot, Georgia, serif;
  font-weight: 400; font-size: clamp(22px,2.6vw,30px);
  margin: clamp(28px,3vw,40px) 0 16px;
}