/**
 * CT Woo Cart Mobile - Stacked Layout Styles
 * Companion plugin for Essential Addons Woo Cart & Woo Checkout widgets.
 */

/* ==========================================================================
   MOBILE STACKED LAYOUT (max-width: 767px)
   Targets Style 1 ("default") when mobile layout is set to "stacked"
   ========================================================================== */

@media (max-width: 767px) {

  /* Remove the min-width that forces horizontal scroll */
  .ct-mobile-layout-stacked .eael-woo-cart-wrapper.eael-woo-default .eael-woo-cart-table {
    min-width: unset !important;
  }

  .ct-mobile-layout-stacked .eael-woo-cart-wrapper.eael-woo-default .eael-woo-cart-table-warp {
    overflow-x: visible;
  }

  /* Hide the table header row */
  .ct-mobile-layout-stacked .eael-woo-cart-wrapper.eael-woo-default .eael-woo-cart-table .eael-wc-table-header {
    display: none !important;
  }

  /* Convert each product row to a stacked card */
  .ct-mobile-layout-stacked .eael-woo-cart-wrapper.eael-woo-default .eael-woo-cart-table .eael-wc-table-body .eael-wct-tr {
    display: block !important;
    position: relative;
    padding: 15px;
  }

  /* Stack each cell vertically */
  .ct-mobile-layout-stacked .eael-woo-cart-wrapper.eael-woo-default .eael-woo-cart-table .eael-wc-table-body .eael-wct-tr .eael-wct-td {
    display: block !important;
    width: 100% !important;
    flex: none !important;
    text-align: left;
    padding: 6px 0;
  }

  /* Data-label for cells (set by JS) */
  .ct-mobile-layout-stacked .eael-woo-cart-wrapper.eael-woo-default .eael-woo-cart-table .eael-wc-table-body .eael-wct-td[data-label]::before {
    content: attr(data-label) ": ";
    font-weight: 600;
    display: inline;
    margin-right: 8px;
  }

  /* No label for thumbnail and remove columns */
  .ct-mobile-layout-stacked .eael-woo-cart-wrapper.eael-woo-default .eael-woo-cart-table .eael-wc-table-body .eael-wct-td.product-thumbnail::before,
  .ct-mobile-layout-stacked .eael-woo-cart-wrapper.eael-woo-default .eael-woo-cart-table .eael-wc-table-body .eael-wct-td.product-remove::before,
  .ct-mobile-layout-stacked .eael-woo-cart-wrapper.eael-woo-default .eael-woo-cart-table .eael-wc-table-body .eael-wct-td.product-name::before {
    display: none;
  }

  /* Thumbnail sizing */
  .ct-mobile-layout-stacked .eael-woo-cart-wrapper.eael-woo-default .eael-woo-cart-table .eael-wc-table-body .eael-wct-td.product-thumbnail {
    text-align: center;
    padding-bottom: 10px;
  }

  .ct-mobile-layout-stacked .eael-woo-cart-wrapper.eael-woo-default .eael-woo-cart-table .eael-wc-table-body .eael-wct-td.product-thumbnail img {
    max-width: 150px;
    height: auto;
  }

  /* Product name styling */
  .ct-mobile-layout-stacked .eael-woo-cart-wrapper.eael-woo-default .eael-woo-cart-table .eael-wc-table-body .eael-wct-td.product-name {
    font-weight: 600;
    font-size: 1.05em;
    padding-bottom: 8px;
  }

  /* Remove button - position top-right of card */
  .ct-mobile-layout-stacked .eael-woo-cart-wrapper.eael-woo-default .eael-woo-cart-table .eael-wc-table-body .eael-wct-td.product-remove {
    position: absolute;
    top: 15px;
    right: 15px;
    width: auto !important;
    padding: 0;
  }

  /* Price and subtotal inline layout */
  .ct-mobile-layout-stacked .eael-woo-cart-wrapper.eael-woo-default .eael-woo-cart-table .eael-wc-table-body .eael-wct-td.product-price,
  .ct-mobile-layout-stacked .eael-woo-cart-wrapper.eael-woo-default .eael-woo-cart-table .eael-wc-table-body .eael-wct-td.product-subtotal {
    display: inline-flex !important;
    width: auto !important;
    align-items: center;
    margin-right: 15px;
  }

  /* Quantity */
  .ct-mobile-layout-stacked .eael-woo-cart-wrapper.eael-woo-default .eael-woo-cart-table .eael-wc-table-body .eael-wct-td.product-quantity {
    display: inline-flex !important;
    width: auto !important;
    align-items: center;
  }

  .ct-mobile-layout-stacked .eael-woo-cart-wrapper.eael-woo-default .eael-woo-cart-table .eael-wc-table-body .eael-wct-td.product-quantity .quantity {
    justify-content: flex-start;
  }
}

/* ==========================================================================
   TABLET STACKED LAYOUT (max-width: 1024px)
   Same rules but for tablet breakpoint
   ========================================================================== */

@media (max-width: 1024px) and (min-width: 768px) {

  .ct-tablet-layout-stacked .eael-woo-cart-wrapper.eael-woo-default .eael-woo-cart-table {
    min-width: unset !important;
  }

  .ct-tablet-layout-stacked .eael-woo-cart-wrapper.eael-woo-default .eael-woo-cart-table-warp {
    overflow-x: visible;
  }

  .ct-tablet-layout-stacked .eael-woo-cart-wrapper.eael-woo-default .eael-woo-cart-table .eael-wc-table-header {
    display: none !important;
  }

  .ct-tablet-layout-stacked .eael-woo-cart-wrapper.eael-woo-default .eael-woo-cart-table .eael-wc-table-body .eael-wct-tr {
    display: block !important;
    position: relative;
    padding: 15px;
  }

  .ct-tablet-layout-stacked .eael-woo-cart-wrapper.eael-woo-default .eael-woo-cart-table .eael-wc-table-body .eael-wct-tr .eael-wct-td {
    display: block !important;
    width: 100% !important;
    flex: none !important;
    text-align: left;
    padding: 6px 0;
  }

  .ct-tablet-layout-stacked .eael-woo-cart-wrapper.eael-woo-default .eael-woo-cart-table .eael-wc-table-body .eael-wct-td[data-label]::before {
    content: attr(data-label) ": ";
    font-weight: 600;
    display: inline;
    margin-right: 8px;
  }

  .ct-tablet-layout-stacked .eael-woo-cart-wrapper.eael-woo-default .eael-woo-cart-table .eael-wc-table-body .eael-wct-td.product-thumbnail::before,
  .ct-tablet-layout-stacked .eael-woo-cart-wrapper.eael-woo-default .eael-woo-cart-table .eael-wc-table-body .eael-wct-td.product-remove::before,
  .ct-tablet-layout-stacked .eael-woo-cart-wrapper.eael-woo-default .eael-woo-cart-table .eael-wc-table-body .eael-wct-td.product-name::before {
    display: none;
  }

  .ct-tablet-layout-stacked .eael-woo-cart-wrapper.eael-woo-default .eael-woo-cart-table .eael-wc-table-body .eael-wct-td.product-thumbnail {
    text-align: center;
    padding-bottom: 10px;
  }

  .ct-tablet-layout-stacked .eael-woo-cart-wrapper.eael-woo-default .eael-woo-cart-table .eael-wc-table-body .eael-wct-td.product-thumbnail img {
    max-width: 150px;
    height: auto;
  }

  .ct-tablet-layout-stacked .eael-woo-cart-wrapper.eael-woo-default .eael-woo-cart-table .eael-wc-table-body .eael-wct-td.product-name {
    font-weight: 600;
    font-size: 1.05em;
    padding-bottom: 8px;
  }

  .ct-tablet-layout-stacked .eael-woo-cart-wrapper.eael-woo-default .eael-woo-cart-table .eael-wc-table-body .eael-wct-td.product-remove {
    position: absolute;
    top: 15px;
    right: 15px;
    width: auto !important;
    padding: 0;
  }

  .ct-tablet-layout-stacked .eael-woo-cart-wrapper.eael-woo-default .eael-woo-cart-table .eael-wc-table-body .eael-wct-td.product-price,
  .ct-tablet-layout-stacked .eael-woo-cart-wrapper.eael-woo-default .eael-woo-cart-table .eael-wc-table-body .eael-wct-td.product-subtotal {
    display: inline-flex !important;
    width: auto !important;
    align-items: center;
    margin-right: 15px;
  }

  .ct-tablet-layout-stacked .eael-woo-cart-wrapper.eael-woo-default .eael-woo-cart-table .eael-wc-table-body .eael-wct-td.product-quantity {
    display: inline-flex !important;
    width: auto !important;
    align-items: center;
  }

  .ct-tablet-layout-stacked .eael-woo-cart-wrapper.eael-woo-default .eael-woo-cart-table .eael-wc-table-body .eael-wct-td.product-quantity .quantity {
    justify-content: flex-start;
  }
}

/* ==========================================================================
   CHECKOUT - MOBILE STACKED LAYOUT (max-width: 767px)
   Targets the EA Woo Checkout order review table
   ========================================================================== */

@media (max-width: 767px) {

  /* Remove the fixed width that forces horizontal scroll */
  .ct-checkout-mobile-layout-stacked .ea-woo-checkout .woocommerce .ea-woo-checkout-order-review .ea-order-review-table .table-row,
  .ct-checkout-mobile-layout-stacked .ea-woo-checkout .woocommerce .ea-woo-checkout-order-review .ea-order-review-table .table-header {
    width: auto !important;
  }

  .ct-checkout-mobile-layout-stacked .ea-woo-checkout .woocommerce .ea-woo-checkout-order-review .ea-order-review-table {
    overflow-x: visible !important;
    overflow-y: visible !important;
  }

  /* Hide the table header row */
  .ct-checkout-mobile-layout-stacked .ea-woo-checkout .woocommerce .ea-woo-checkout-order-review .ea-order-review-table .table-header {
    display: none !important;
  }

  /* Convert each product row to a stacked card */
  .ct-checkout-mobile-layout-stacked .ea-woo-checkout .woocommerce .ea-woo-checkout-order-review .ea-order-review-table .table-row {
    display: block !important;
    padding: 15px;
  }

  /* Stack each column vertically */
  .ct-checkout-mobile-layout-stacked .ea-woo-checkout .woocommerce .ea-woo-checkout-order-review .ea-order-review-table .table-row .table-col-1,
  .ct-checkout-mobile-layout-stacked .ea-woo-checkout .woocommerce .ea-woo-checkout-order-review .ea-order-review-table .table-row .table-col-2,
  .ct-checkout-mobile-layout-stacked .ea-woo-checkout .woocommerce .ea-woo-checkout-order-review .ea-order-review-table .table-row .table-col-3 {
    display: block !important;
    flex-basis: 100% !important;
    max-width: 100% !important;
    text-align: left;
    padding: 6px 0;
  }

  /* Product thumbnail + name - keep flex for side-by-side layout */
  .ct-checkout-mobile-layout-stacked .ea-woo-checkout .woocommerce .ea-woo-checkout-order-review .ea-order-review-table .table-row .product-thum-name {
    display: flex;
    align-items: center;
  }

  .ct-checkout-mobile-layout-stacked .ea-woo-checkout .woocommerce .ea-woo-checkout-order-review .ea-order-review-table .table-row .product-thumbnail {
    width: 65px;
    flex-shrink: 0;
  }

  /* Data-label for Qty and Total columns (set by JS) */
  .ct-checkout-mobile-layout-stacked .ea-woo-checkout .woocommerce .ea-woo-checkout-order-review .ea-order-review-table .table-row .table-col-2[data-label]::before,
  .ct-checkout-mobile-layout-stacked .ea-woo-checkout .woocommerce .ea-woo-checkout-order-review .ea-order-review-table .table-row .table-col-3[data-label]::before {
    content: attr(data-label) ": ";
    font-weight: 600;
    display: inline;
    margin-right: 8px;
  }

  /* Qty and Total inline */
  .ct-checkout-mobile-layout-stacked .ea-woo-checkout .woocommerce .ea-woo-checkout-order-review .ea-order-review-table .table-row .table-col-2,
  .ct-checkout-mobile-layout-stacked .ea-woo-checkout .woocommerce .ea-woo-checkout-order-review .ea-order-review-table .table-row .table-col-3 {
    display: inline-flex !important;
    flex-basis: auto !important;
    max-width: none !important;
    align-items: center;
    margin-right: 15px;
    padding-right: 0 !important;
  }
}

/* ==========================================================================
   CHECKOUT - TABLET STACKED LAYOUT (max-width: 1024px)
   ========================================================================== */

@media (max-width: 1024px) and (min-width: 768px) {

  .ct-checkout-tablet-layout-stacked .ea-woo-checkout .woocommerce .ea-woo-checkout-order-review .ea-order-review-table .table-row,
  .ct-checkout-tablet-layout-stacked .ea-woo-checkout .woocommerce .ea-woo-checkout-order-review .ea-order-review-table .table-header {
    width: auto !important;
  }

  .ct-checkout-tablet-layout-stacked .ea-woo-checkout .woocommerce .ea-woo-checkout-order-review .ea-order-review-table {
    overflow-x: visible !important;
    overflow-y: visible !important;
  }

  .ct-checkout-tablet-layout-stacked .ea-woo-checkout .woocommerce .ea-woo-checkout-order-review .ea-order-review-table .table-header {
    display: none !important;
  }

  .ct-checkout-tablet-layout-stacked .ea-woo-checkout .woocommerce .ea-woo-checkout-order-review .ea-order-review-table .table-row {
    display: block !important;
    padding: 15px;
  }

  .ct-checkout-tablet-layout-stacked .ea-woo-checkout .woocommerce .ea-woo-checkout-order-review .ea-order-review-table .table-row .table-col-1,
  .ct-checkout-tablet-layout-stacked .ea-woo-checkout .woocommerce .ea-woo-checkout-order-review .ea-order-review-table .table-row .table-col-2,
  .ct-checkout-tablet-layout-stacked .ea-woo-checkout .woocommerce .ea-woo-checkout-order-review .ea-order-review-table .table-row .table-col-3 {
    display: block !important;
    flex-basis: 100% !important;
    max-width: 100% !important;
    text-align: left;
    padding: 6px 0;
  }

  .ct-checkout-tablet-layout-stacked .ea-woo-checkout .woocommerce .ea-woo-checkout-order-review .ea-order-review-table .table-row .product-thum-name {
    display: flex;
    align-items: center;
  }

  .ct-checkout-tablet-layout-stacked .ea-woo-checkout .woocommerce .ea-woo-checkout-order-review .ea-order-review-table .table-row .product-thumbnail {
    width: 65px;
    flex-shrink: 0;
  }

  .ct-checkout-tablet-layout-stacked .ea-woo-checkout .woocommerce .ea-woo-checkout-order-review .ea-order-review-table .table-row .table-col-2[data-label]::before,
  .ct-checkout-tablet-layout-stacked .ea-woo-checkout .woocommerce .ea-woo-checkout-order-review .ea-order-review-table .table-row .table-col-3[data-label]::before {
    content: attr(data-label) ": ";
    font-weight: 600;
    display: inline;
    margin-right: 8px;
  }

  .ct-checkout-tablet-layout-stacked .ea-woo-checkout .woocommerce .ea-woo-checkout-order-review .ea-order-review-table .table-row .table-col-2,
  .ct-checkout-tablet-layout-stacked .ea-woo-checkout .woocommerce .ea-woo-checkout-order-review .ea-order-review-table .table-row .table-col-3 {
    display: inline-flex !important;
    flex-basis: auto !important;
    max-width: none !important;
    align-items: center;
    margin-right: 15px;
    padding-right: 0 !important;
  }
}
