/* =========================================================================
   CUSTOM WOOCOMMERCE STYLES — Nishan Academy
   Brings WooCommerce shop, single product, cart & checkout pages in line
   with the site's Elementor theme (orange brand accent, rounded cards,
   generous spacing, clean sans-serif typography).

   HOW TO USE:
   1. Appearance → Customize → Additional CSS  → paste this file, OR
   2. Enqueue as a separate stylesheet from your child theme's functions.php:
      wp_enqueue_style( 'custom-woocommerce', get_stylesheet_directory_uri() . '/custom-woocommerce.css', array('woocommerce-general'), '1.0' );

   Adjust the CSS variables below to match your exact brand hex codes if
   they differ from the values inferred from the site (logo/brand orange).
   ========================================================================= */

:root {
  --na-orange: #F58220;
  /* primary brand / CTA color (from logo) */
  --na-orange-dark: #D96C0F;
  /* hover / active state */
  --na-orange-light: #FFF1E4;
  /* soft backgrounds, badges */
  --na-dark: #1E1E1E;
  /* headings / body text */
  --na-gray: #6B6B6B;
  /* secondary text */
  --na-border: #EAEAEA;
  /* hairlines, card borders */
  --na-bg: #FAFAFA;
  /* section backgrounds */
  --na-success: #3C9A5F;
  --na-error: #D9534F;
  --na-radius: 10px;
  --na-radius-sm: 6px;
  --na-shadow: 0 4px 20px rgba(0, 0, 0, 0.06);
  --na-font: 'Tenor Sans', 'Segoe UI', Arial, sans-serif;
  /* match theme heading/body font */
}

/* -------------------------------------------------------------------------
   0. GLOBAL PAGE WRAPPER
   ------------------------------------------------------------------------- */
.woocommerce,
.woocommerce-page {
  color: var(--na-dark);
  font-family: var(--ff-util);
  font-size: 16px;
  line-height: 1.7;
}

.woocommerce-page #primary,
.woocommerce-page .site-main {
  max-width: 1200px;
  margin: 0 auto;
  padding: 40px 20px 0;
}

.woocommerce-page h1.entry-title,
.woocommerce-page .page-title {
  font-family: var(--na-font);
  font-weight: 700;
  font-size: 34px;
  color: var(--na-dark);
  text-align: center;
  margin-bottom: 40px;
  position: relative;
}

.woocommerce-page h1.entry-title::after {
  content: "";
  display: block;
  width: 60px;
  height: 3px;
  background: var(--na-orange);
  margin: 14px auto 0;
  border-radius: 2px;
}

/* -------------------------------------------------------------------------
   1. BUTTONS (Add to cart / Checkout / Update / Apply coupon etc.)
   ------------------------------------------------------------------------- */
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit,
.woocommerce-page a.button,
.woocommerce-page button.button,
.woocommerce-page input.button {
  background-color: var(--na-orange);
  color: #fff;
  border: none;
  border-radius: var(--na-radius-sm);
  padding: 13px 30px;
  font-weight: 600;
  font-size: 15px;
  letter-spacing: 0.2px;
  text-transform: none;
  transition: background-color 0.25s ease, transform 0.15s ease, box-shadow 0.25s ease;
  box-shadow: 0 4px 14px rgba(245, 130, 32, 0.25);
}

.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce #respond input#submit:hover,
.woocommerce-page a.button:hover,
.woocommerce-page button.button:hover,
.woocommerce-page input.button:hover {
  background-color: var(--na-orange-dark);
  color: #fff;
  transform: translateY(-1px);
  box-shadow: 0 6px 18px rgba(245, 130, 32, 0.35);
}

.woocommerce a.button.disabled,
.woocommerce button.button.disabled,
.woocommerce input.button.disabled {
  background-color: #cfcfcf;
  color: #888;
  box-shadow: none;
  cursor: not-allowed;
}

/* Secondary / alt buttons (e.g. "Continue Shopping", "Return to cart") */
.woocommerce a.button.wc-backward,
.woocommerce a.checkout-button.button.alt.wc-forward+.button {
  background-color: transparent;
  color: var(--na-orange);
  border: 2px solid var(--na-orange);
  box-shadow: none;
}

.woocommerce a.button.wc-backward:hover {
  background-color: var(--na-orange-light);
  color: var(--na-orange-dark);
}

/* -------------------------------------------------------------------------
   2. SHOP LOOP / PRODUCT CARDS
   ------------------------------------------------------------------------- */
.woocommerce ul.products {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: 28px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.woocommerce ul.products li.product {
  background: #fff;
  border: 1px solid var(--na-border);
  border-radius: var(--na-radius);
  padding: 18px 18px 26px;
  text-align: center;
  transition: box-shadow 0.25s ease, transform 0.25s ease;
  box-shadow: var(--na-shadow);
}

.woocommerce ul.products li.product:hover {
  transform: translateY(-4px);
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.1);
}

.woocommerce ul.products li.product img {
  border-radius: var(--na-radius-sm);
  margin-bottom: 14px;
}

.woocommerce ul.products li.product .woocommerce-loop-product__title {
  font-size: 17px;
  font-weight: 600;
  color: var(--na-dark);
  margin: 8px 0 6px;
}

.woocommerce ul.products li.product .price {
  color: var(--na-orange);
  font-weight: 700;
  font-size: 16px;
}

.woocommerce ul.products li.product .price del {
  color: var(--na-gray);
  opacity: 0.7;
  font-weight: 400;
}

.woocommerce span.onsale {
  background: var(--na-orange);
  color: #fff;
  font-weight: 600;
  border-radius: 50px;
  min-height: 46px;
  min-width: 46px;
  line-height: 46px;
}

/* -------------------------------------------------------------------------
   3. SINGLE PRODUCT PAGE
   ------------------------------------------------------------------------- */
.woocommerce div.product {
  background: #fff;
  border-radius: var(--na-radius);
  padding: 36px;
  box-shadow: var(--na-shadow);
  border: 1px solid var(--na-border);
}

.woocommerce div.product .woocommerce-product-gallery {
  border-radius: var(--na-radius-sm);
  overflow: hidden;
}

.woocommerce div.product .product_title {
  font-family: var(--na-font);
  font-weight: 700;
  font-size: 28px;
  color: var(--na-dark);
  margin-bottom: 10px;
}

.woocommerce div.product p.price,
.woocommerce div.product span.price {
  color: var(--na-orange);
  font-size: 26px;
  font-weight: 700;
  margin-bottom: 18px;
}

.woocommerce div.product .woocommerce-product-details__short-description {
  color: var(--na-gray);
  line-height: 1.8;
  margin-bottom: 20px;
}

.woocommerce div.product form.cart {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-top: 20px;
}

.woocommerce div.product form.cart .quantity {
  margin-right: 0;
}

.woocommerce div.product form.cart .quantity input.qty {
  width: 70px;
  height: 48px;
  border: 1px solid var(--na-border);
  border-radius: var(--na-radius-sm);
  text-align: center;
  font-size: 15px;
}

.woocommerce div.product .product_meta {
  margin-top: 24px;
  padding-top: 16px;
  border-top: 1px solid var(--na-border);
  font-size: 14px;
  color: var(--na-gray);
}

.woocommerce div.product .product_meta a {
  color: var(--na-orange);
  font-weight: 600;
}

/* Tabs (description / reviews / additional info) */
.woocommerce div.product .woocommerce-tabs ul.tabs {
  border-bottom: 2px solid var(--na-border);
  margin: 40px 0 0;
  padding: 0;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li {
  background: transparent;
  border: none;
  margin-right: 10px;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li a {
  color: var(--na-gray);
  font-weight: 600;
  padding: 12px 18px;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li.active a {
  color: var(--na-orange);
  border-bottom: 3px solid var(--na-orange);
}

.woocommerce div.product .woocommerce-tabs .panel {
  padding: 24px 0;
  color: var(--na-gray);
  line-height: 1.8;
}

/* -------------------------------------------------------------------------
   4. CART PAGE
   ------------------------------------------------------------------------- */
.woocommerce-cart .entry-content {
  margin: 0;
}

.woocommerce-cart table.cart,
.woocommerce table.shop_table {
  border-collapse: collapse;
  width: 100%;
  background: #fff;
  border-radius: var(--na-radius);
  overflow: hidden;
  box-shadow: var(--na-shadow);
  border: 1px solid var(--na-border);
}

.woocommerce table.shop_table thead th {
  background: var(--na-bg);
  color: var(--na-dark);
  font-weight: 700;
  text-transform: uppercase;
  font-size: 13px;
  letter-spacing: 0.5px;
  padding: 16px;
  border-bottom: 1px solid var(--na-border);
}

.woocommerce table.shop_table td {
  padding: 18px 16px;
  border-bottom: 1px solid var(--na-border);
  vertical-align: middle;
}

.woocommerce table.shop_table tr:last-child td {
  border-bottom: none;
}

.woocommerce table.shop_table td.product-name a {
  color: var(--na-dark);
  font-weight: 600;
}

.woocommerce table.shop_table td.product-price,
.woocommerce table.shop_table td.product-subtotal {
  color: var(--na-orange);
  font-weight: 700;
}

.woocommerce table.shop_table td.product-thumbnail img {
  border-radius: var(--na-radius-sm);
  width: 80px;
}

.woocommerce table.shop_table td.product-remove a.remove {
  background: var(--na-error) !important;
  color: #fff !important;
  border-radius: 50%;
  width: 26px;
  height: 26px;
  line-height: 26px;
  font-weight: 700;
}

.woocommerce table.shop_table td.product-remove a.remove:hover {
  background: #b8433f !important;
}

.woocommerce .cart-collaterals .cart_totals {
  background: #fff;
  border: 1px solid var(--na-border);
  border-radius: var(--na-radius);
  padding: 26px;
  box-shadow: var(--na-shadow);
}

.woocommerce .cart-collaterals .cart_totals h2 {
  font-size: 20px;
  font-weight: 700;
  margin-bottom: 16px;
  color: var(--na-dark);
}

.woocommerce .cart-collaterals .cart_totals table th {
  color: var(--na-gray);
  font-weight: 600;
}

.woocommerce .cart-collaterals .cart_totals table .order-total .amount {
  color: var(--na-orange);
  font-size: 20px;
  font-weight: 700;
}

/* Coupon form */
.woocommerce form.woocommerce-cart-form .coupon {
  display: flex;
  gap: 10px;
  align-items: center;
}

.woocommerce form.woocommerce-cart-form .coupon input#coupon_code {
  height: 48px;
  border: 1px solid var(--na-border);
  border-radius: var(--na-radius-sm);
  padding: 0 16px;
}

/* -------------------------------------------------------------------------
   5. CHECKOUT PAGE
   ------------------------------------------------------------------------- */
.woocommerce-checkout .entry-content {
  margin: 0;
}

.woocommerce-checkout #customer_details,
.woocommerce-checkout .woocommerce-checkout-review-order {
  background: #fff;
  border: 1px solid var(--na-border);
  border-radius: var(--na-radius);
  padding: 30px;
  box-shadow: var(--na-shadow);
}

.woocommerce-checkout h3#order_review_heading,
.woocommerce-checkout h3 {
  font-size: 20px;
  font-weight: 700;
  color: var(--na-dark);
  margin-bottom: 20px;
  padding-bottom: 12px;
  border-bottom: 2px solid var(--na-orange-light);
}

.woocommerce form .form-row label {
  font-weight: 600;
  color: var(--na-dark);
  font-size: 14px;
  margin-bottom: 6px;
}

.woocommerce form .form-row .required {
  color: var(--na-orange);
}

.woocommerce form .input-text,
.woocommerce form select,
.woocommerce-additional-fields textarea,
.woocommerce-checkout select#billing_country,
.woocommerce-checkout select#billing_state {
  border: 1px solid var(--na-border);
  border-radius: var(--na-radius-sm);
  padding: 12px 14px;
  font-size: 15px;
  width: 100%;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
  background: var(--na-bg);
}

.woocommerce form .input-text:focus,
.woocommerce form select:focus,
.woocommerce-additional-fields textarea:focus {
  border-color: var(--na-orange);
  outline: none;
  background: #fff;
  box-shadow: 0 0 0 3px rgba(245, 130, 32, 0.15);
}

.woocommerce-checkout .select2-container .select2-selection--single {
  height: 46px;
  border: 1px solid var(--na-border);
  border-radius: var(--na-radius-sm);
  display: flex;
  align-items: center;
  padding-left: 8px;
}

/* Order review table inside checkout */
.woocommerce-checkout-review-order-table thead th {
  background: var(--na-bg);
  font-weight: 700;
  font-size: 13px;
  text-transform: uppercase;
  padding: 14px;
}

.woocommerce-checkout-review-order-table td {
  padding: 14px;
  border-bottom: 1px solid var(--na-border);
}

.woocommerce-checkout-review-order-table .order-total .amount {
  color: var(--na-orange);
  font-weight: 700;
  font-size: 19px;
}

/* Payment methods box */
.woocommerce-checkout #payment {
  background: var(--na-orange-light);
  border-radius: var(--na-radius-sm);
  margin-top: 20px;
}

.woocommerce-checkout #payment ul.payment_methods {
  border-bottom: 1px solid rgba(245, 130, 32, 0.2);
  padding: 16px 20px 10px;
}

.woocommerce-checkout #payment ul.payment_methods li label {
  font-weight: 600;
  color: var(--na-dark);
}

.woocommerce-checkout #payment div.payment_box {
  background: #fff;
  border-radius: var(--na-radius-sm);
  margin: 10px 20px 16px;
  padding: 16px;
  color: var(--na-gray);
}

.woocommerce-checkout #payment div.payment_box::before {
  border-bottom-color: #fff;
}

#place_order {
  width: 100%;
  padding: 16px;
  font-size: 16px;
  margin-top: 16px;
}

/* =========================================================================
   5B. WOOCOMMERCE BLOCKS — CART & CHECKOUT
   These pages use the block editor (Cart block / Checkout block), which
   renders completely different markup (wc-block-* classes, no <table>,
   no #order_review). Everything above in sections 4 & 5 is kept for sites
   that still use the classic shortcodes, and this section styles the
   block version so both work regardless of which one is active.
   ========================================================================= */

/* --- Shared block wrapper --- */
.wp-block-woocommerce-cart,
.wp-block-woocommerce-checkout {
  font-family: 'Roboto' !important;
  color: var(--na-dark);
  max-width: 1200px;
  margin: 0 auto;
}

.wc-block-components-main {
  padding-right: 10px !important;
}

/* --- Panels used as the "cards" for line items / sidebar totals --- */
.wc-block-cart,
.wc-block-checkout {
  gap: 32px;
  flex-wrap: nowrap !important;
}

.wc-block-components-sidebar,
.wc-block-cart__sidebar,
.wc-block-checkout__sidebar {
  background: #fff;
  border: 1px solid var(--na-border);
  border-radius: var(--na-radius);
  padding: 26px;
  box-shadow: var(--na-shadow);
}

/* --- Section headings inside blocks (e.g. "Cart totals", "Contact information") --- */
.wc-block-components-title,
.wc-block-checkout__title,
.wc-block-components-checkout-step__title {
  font-family: var(--na-font);
  font-weight: 700;
  font-size: 20px;
  color: var(--na-dark);
}

.wc-block-components-checkout-step__title {
  padding-bottom: 10px;
  border-bottom: 2px solid var(--na-orange-light);
  margin-bottom: 16px;
}

/* --- Cart line items --- */
.wc-block-cart-items {
  background: #fff;
  border: 1px solid var(--na-border);
  border-radius: var(--na-radius);
  box-shadow: var(--na-shadow);
  overflow: hidden;
}

.wc-block-cart-items__header {
  background: var(--na-bg);
  text-transform: uppercase;
  font-size: 13px;
  letter-spacing: 0.5px;
  font-weight: 700;
  color: var(--na-dark);
  padding: 14px 20px;
}

.wc-block-cart-items__row,
.wc-block-cart-item {
  padding: 20px;
  border-bottom: 1px solid var(--na-border);
}

.wc-block-cart-items__row:last-child {
  border-bottom: none;
}

table.wc-block-cart-items .wc-block-cart-items__header .wc-block-cart-items__header-product {
  visibility: visible !important;
}

.wc-block-cart-item__image img,
.wc-block-components-product-image img {
  border-radius: var(--na-radius-sm);
}

.wc-block-components-product-name {
  color: var(--na-dark);
  font-weight: 600;
  text-decoration: none;
}

a.wc-block-components-product-name:hover {
  color: var(--na-orange);
}

.wc-block-components-product-price,
.wc-block-components-totals-item__value,
.wc-block-cart-item__total .wc-block-components-formatted-money-amount,
.wc-block-components-product-price .wc-block-components-formatted-money-amount {
  color: var(--na-orange);
  font-weight: 700;
}

.wc-block-components-product-metadata {
  color: var(--na-gray);
  font-size: 13px;
}

/* --- Quantity selector --- */
.wc-block-components-quantity-selector {
  border: 1px solid var(--na-border);
  border-radius: var(--na-radius-sm);
  overflow: hidden;
}

.wc-block-components-quantity-selector__button {
  color: var(--na-gray);
  background: var(--na-bg);
}

.wc-block-components-quantity-selector__button:hover {
  background: var(--na-orange-light);
  color: var(--na-orange-dark);
}

.wc-block-components-quantity-selector__input {
  border: none;
  font-weight: 600;
}

/* --- Remove item link --- */
.wc-block-cart-item__remove-link {
  color: var(--na-error);
  font-weight: 600;
}

.wc-block-cart-item__remove-link:hover {
  color: #b8433f;
}

/* --- Totals panel (Cart totals / Order summary) --- */
.wc-block-components-totals-item {
  padding: 10px 0;
  color: var(--na-gray);
  font-weight: 500;
}

.wc-block-components-totals-item__label {
  color: var(--na-dark);
  font-weight: 600;
}

.wc-block-components-totals-footer-item .wc-block-components-totals-item__label,
.wc-block-components-totals-footer-item .wc-block-components-totals-item__value {
  color: var(--na-dark);
  font-size: 19px;
  font-weight: 700;
}

.wc-block-components-totals-footer-item .wc-block-components-totals-item__value {
  color: var(--na-dark);
}

.wc-block-components-totals-item__description {
  color: var(--na-gray);
  font-size: 13px;
}

/* --- Order summary (checkout sidebar) product rows --- */
.wc-block-components-order-summary-item__quantity {
  background: var(--na-orange);
  color: #fff;
  border-radius: 50%;
}

.wc-block-components-panel__button {
  color: var(--na-dark);
  font-weight: 700;
}

/* --- Coupon form --- */
.wc-block-components-totals-coupon__button,
.wc-block-components-totals-coupon .wc-block-components-button {
  height: 44px;
}

.wc-block-components-totals-coupon-link {
  color: var(--na-orange);
  font-weight: 600;
}

/* --- Buttons (Proceed to checkout, Place order, Apply coupon, etc.) --- */
.wc-block-components-button,
.wc-block-cart__submit-button,
.wc-block-components-checkout-place-order-button {
  background-color: var(--na-orange) !important;
  color: #fff !important;
  border: none !important;
  border-radius: var(--na-radius-sm) !important;
  font-weight: 600 !important;
  padding: 14px 28px !important;
  box-shadow: 0 4px 14px rgba(245, 130, 32, 0.25);
  transition: background-color 0.25s ease, transform 0.15s ease, box-shadow 0.25s ease;
}

.wc-block-components-button:hover,
.wc-block-cart__submit-button:hover,
.wc-block-components-checkout-place-order-button:hover {
  background-color: var(--na-orange-dark) !important;
  transform: translateY(-1px);
  box-shadow: 0 6px 18px rgba(245, 130, 32, 0.35);
}

/* Outline / secondary buttons (e.g. "Apply" ghost variant if theme uses one) */
.wc-block-components-button.is-style-outline,
.wc-block-components-button.wp-element-button.is-secondary {
  background-color: transparent !important;
  color: var(--na-orange) !important;
  border: 2px solid var(--na-orange) !important;
  box-shadow: none;
}

/* --- Checkout form fields --- */
.wc-block-components-text-input input,
.wc-block-components-address-form input,
.wc-block-components-textarea textarea,
.wc-block-components-select select,
.wc-block-components-dropdown-selector__button {
  border: 1px solid var(--na-border) !important;
  border-radius: var(--na-radius-sm) !important;
  background: var(--na-bg) !important;
  padding: 12px 14px !important;
  font-family: 'Roboto' !important;
  font-size: 15px;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.wc-block-components-text-input input:focus,
.wc-block-components-address-form input:focus,
.wc-block-components-textarea textarea:focus,
.wc-block-components-select select:focus {
  border-color: var(--na-orange) !important;
  background: #fff !important;
  outline: none;
  box-shadow: 0 0 0 3px rgba(245, 130, 32, 0.15);
}

.wc-block-components-text-input label,
.wc-block-components-address-form label {
  color: var(--na-gray);
  font-weight: 500;
}

/* --- Radio controls (shipping method, payment method) --- */
.wc-block-components-radio-control__option {
  border: 1px solid var(--na-border);
  border-radius: var(--na-radius-sm);
  padding: 14px 16px;
  margin-bottom: 10px;
  background: #fff;
  transition: border-color 0.2s ease, background-color 0.2s ease;
}

.wc-block-components-radio-control__option--checked-option {
  border-color: var(--na-orange);
  background: var(--na-orange-light);
}

.wc-block-components-radio-control__input:checked {
  accent-color: var(--na-orange);
}

.wc-block-components-radio-control__label {
  font-weight: 600;
  color: var(--na-dark);
}

/* --- Payment methods block --- */
.wc-block-checkout__payment-method .wc-block-components-panel {
  background: var(--na-orange-light);
  border-radius: var(--na-radius-sm);
  padding: 16px 20px;
}

.wc-block-checkout__payment-method .wc-block-components-radio-control__option {
  background: #fff;
}

/* --- Checkboxes (e.g. "Create an account", "Ship to a different address") --- */
.wc-block-components-checkbox__input:checked+.wc-block-components-checkbox__mark {
  color: var(--na-orange);
}

.wc-block-components-checkbox svg {
  fill: var(--na-orange);
}

/* --- Notices inside blocks (coupon errors, validation errors, etc.) --- */
.wc-block-components-notice-banner {
  border-radius: var(--na-radius-sm);
  border-left-width: 4px;
}

.wc-block-components-notice-banner.is-error {
  border-left-color: var(--na-error);
}

.wc-block-components-notice-banner.is-success,
.wc-block-components-notice-banner.is-info {
  border-left-color: var(--na-orange);
}

/* --- Stepper numbers on checkout (1. Contact, 2. Shipping, 3. Payment) --- */
.wc-block-components-checkout-step__title .wc-block-components-checkout-step__title_text::before {
  color: var(--na-orange);
}

.wc-block-components-checkout-step--with-step-number .wc-block-components-checkout-step__heading-content::before {
  background: var(--na-orange);
  color: #fff;
}

/* -------------------------------------------------------------------------
   6. NOTICES / MESSAGES (info, error, success)
   ------------------------------------------------------------------------- */
.woocommerce-message,
.woocommerce-info,
.woocommerce-error,
.woocommerce-noreviews {
  border-top: 3px solid var(--na-orange);
  background: #fff;
  box-shadow: var(--na-shadow);
  border-radius: var(--na-radius-sm);
  padding: 16px 20px;
  font-size: 15px;
  color: var(--na-dark);
}

.woocommerce-message::before {
  color: var(--na-orange);
}

.woocommerce-error {
  border-top-color: var(--na-error);
}

.woocommerce-error::before {
  color: var(--na-error);
}

.woocommerce-message .button,
.woocommerce-info .button {
  float: right;
}

/* -------------------------------------------------------------------------
   7. BREADCRUMBS
   ------------------------------------------------------------------------- */
.woocommerce-breadcrumb {
  color: var(--na-gray);
  font-size: 14px;
  margin-bottom: 24px;
}

.woocommerce-breadcrumb a {
  color: var(--na-gray);
}

.woocommerce-breadcrumb a:hover {
  color: var(--na-orange);
}

/* -------------------------------------------------------------------------
   8. WOOCOMMERCE FORMS
   ------------------------------------------------------------------------- */
.woocommerce form.checkout_coupon,
.woocommerce form.login,
.woocommerce form.register {
  width: 100%;
  max-width: 480px;
  background-color: #ffffff;
  border-radius: 16px;
}


/* -------------------------------------------------------------------------
   9. RESPONSIVE ADJUSTMENTS
   ------------------------------------------------------------------------- */
@media (max-width: 768px) {
  .woocommerce div.product {
    padding: 20px;
  }

  .woocommerce div.product form.cart {
    flex-wrap: wrap;
  }

  .woocommerce-checkout #customer_details,
  .woocommerce-checkout .woocommerce-checkout-review-order {
    padding: 18px;
  }

  .woocommerce table.shop_table td.product-thumbnail img {
    width: 56px;
  }

  .woocommerce ul.products {
    grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
    gap: 16px;
  }

  .wc-block-components-sidebar,
  .wc-block-cart__sidebar,
  .wc-block-checkout__sidebar {
    padding: 18px;
  }

  .wc-block-cart-items__row,
  .wc-block-cart-item {
    padding: 14px;
  }

  .wc-block-components-radio-control__option {
    padding: 12px;
  }
}