/* =====================================================
   Bottlecart – Enhanced Responsive Order Table
   ===================================================== */

:root {
  --bc-font-sans: "Inter", system-ui, sans-serif;
  --bc-font-display: "Allerta Stencil", var(--bc-font-sans);
  --bc-accent: #f44336;
  --bc-gray-50: #fafafa;
  --bc-gray-100: #f2f2f2;
  --bc-gray-200: #e5e5e5;
  --bc-gray-300: #d4d4d4;
  --bc-gray-500: #8a8a8a;
  --bc-category-bg: #f8f8f8;
  --bc-category-border: #e0e0e0;
  --bc-border-radius: 6px;
  --bc-heading-fg: #4a4a4a;
}

/* Base Table Styles */
.bottlecart-table-responsive {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

.bottlecart-table {
  width: 100%;
  min-width: 700px;
  border-collapse: collapse;
  font: 0.95rem/1.45 var(--bc-font-sans);
  border: 1px solid var(--bc-gray-200);
}

/* Header */
.bottlecart-table thead th {
  padding: 0.75rem 0.6rem;
  color: var(--bc-heading-fg);
  background: var(--bc-gray-100);
  font: 600 0.95rem var(--bc-font-display);
  border-bottom: 2px solid var(--bc-gray-300);
  white-space: nowrap;
  text-align: left;
}

.bottlecart-table thead th:nth-child(n + 2) {
  text-align: center;
}

/* Body */
.bottlecart-table tbody td {
  padding: 0.75rem 0.6rem;
  vertical-align: middle;
  background: #fff;
}

.bottlecart-table tbody tr:not(.bottlecart-category):hover td {
  background: var(--bc-gray-50);
}

/* Category styling */
.bottlecart-category td {
  background: var(--bc-category-bg) !important;
  border-top: 2px solid var(--bc-category-border);
  border-bottom: 2px solid var(--bc-category-border);
  color: #555;
  font: 600 0.9rem var(--bc-font-display);
  text-align: left !important;
  text-transform: uppercase;
  padding: 0.8rem 1rem !important;
  letter-spacing: 0.5px;
}

/* Numeric columns */
.bottlecart-table td.subtotal,
.bottlecart-table td.bottlecart-vat,
.bottlecart-table td.bottlecart-total {
  text-align: center;
}

.bottlecart-table td.price,
.bottlecart-table td.subtotal,
.bottlecart-table td.bottlecart-vat,
.bottlecart-table td.bottlecart-total {
  white-space: nowrap;
}

/* Product meta column */
.bottlecart-table td.meta {
  display: flex;
  align-items: center;
  gap: 0.75rem;
}

.bottlecart-table .meta-image img {
  border-radius: var(--bc-border-radius);
  max-width: 50px;
}

.bottlecart-table .prod-title {
  font-family: var(--bc-font-display);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.bottlecart-table .prod-title a {
  color: #000;
}

.bottlecart-table .prod-title a:hover {
  color: var(--e-global-color-el_color_1);
}

.bottlecart-table .prod-meta {
  font-size: 0.85rem;
  color: var(--bc-gray-500);
  margin-top: 0.125rem;
}

/* Quantity controls */
.bottlecart-table td.qty {
  text-align: center;
}

.bottlecart-table .qty-inner {
  display: inline-flex;
  align-items: center;
  gap: 0.2rem;
}

.bottlecart-qty {
  width: 6.5ch;
  height: 2.2rem;
  text-align: center;
  font-size: 0.95rem;
  padding: 0.15rem 0.25rem;
  border: 1px solid var(--bc-gray-300);
  border-radius: var(--bc-border-radius);
  margin-bottom: 0 !important;
}

.bottlecart-plus,
.bottlecart-minus {
  width: 2.2rem;
  height: 2.2rem;
  display: grid;
  place-items: center;
  font-size: 1.05rem;
  background: var(--bc-gray-100);
  border: 1px solid var(--bc-gray-300);
  border-radius: var(--bc-border-radius);
  cursor: pointer;
  transition: background 0.15s, border-color 0.15s;
}

.bottlecart-plus:hover,
.bottlecart-minus:hover,
.bottlecart-plus:focus-visible,
.bottlecart-minus:focus-visible {
  background: var(--bc-gray-200);
  border-color: var(--bc-gray-500);
  outline: none;
}

 .bottlecart-controls .qty-inner {
    display: flex;
    align-items: center;
    gap: 8px;
  }

/* Totals & footer */
.bottlecart-total {
  font: 700 1.2rem/1 var(--bc-font-sans);
}

.bottlecart-table tfoot tr:first-child td strong {
  font-weight: 400;
}

/* Clear cart button */
.bottlecart-clear-cart {
  font-family: var(--bc-font-display);
  display: inline-block;
  padding: 0.5rem 1.25rem;
  background: var(--bc-accent);
  color: #fff;
  border: none;
  cursor: pointer;
  font-size: 1rem;
  transition: background 0.2s;
}

.bottlecart-clear-cart:hover,
.bottlecart-clear-cart:focus-visible {
  background: #d73228;
  outline: none;
}

/* Accessibility outline helpers */
.bottlecart-plus:focus-visible,
.bottlecart-minus:focus-visible,
.bottlecart-clear-cart:focus-visible,
.bottlecart-qty:focus-visible {
  outline: 2px solid var(--bc-accent);
  outline-offset: 2px;
}

/* Tablet & Mobile (768px and below) */
@media (max-width: 768px) {
  .bottlecart-table {
    min-width: 0;
    border: none;
    font-size: 0.85rem;
  }

  .bottlecart-table thead,
  .bottlecart-category {
    display: none;
  }

  .bottlecart-category td {
    display: table !important;
    width: inherit;
  }

  .bottlecart-table,
  .bottlecart-table tbody,
  .bottlecart-table tfoot,
  .bottlecart-table tr {
    display: block;
    width: 100%;
  }

  .bottlecart-table tr {
    margin: 0 0 1rem;
    border: 1px solid var(--bc-gray-200);
    border-radius: var(--bc-border-radius);
    overflow: hidden;
    border-collapse: separate;
  }

  .bottlecart-table td {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 0.5rem;
    align-items: center;
    padding: 0.75rem;
    border-top: 1px solid var(--bc-gray-200);
    background: #fff;
    text-align: right;
  }

  .bottlecart-table tr:first-child td {
    border-top: none;
  }

  .bottlecart-table td::before {
    content: attr(data-label);
    font-weight: 600;
    color: var(--bc-gray-500);
    text-align: left;
  }

  .bottlecart-table td.subtotal,
  .bottlecart-table td.bottlecart-vat,
  .bottlecart-table td.bottlecart-total {
    text-align: right;
  }

  /* Product meta special handling */
  .bottlecart-table td.meta {
    grid-template-columns: 1fr;
    text-align: left;
    padding-bottom: 0.75rem;
  }

  .bottlecart-table td.meta::before {
    display: none;
  }

  .bottlecart-table .prod-title {
    white-space: normal;
    line-height: 1.3;
    font-size: 1.05rem;
  }

  .bottlecart-table .prod-meta {
    display: block;
    margin-top: 0.25rem;
    font-size: 0.8rem;
  }

  /* Quantity controls */
  .bottlecart-table .qty-inner {
    display: flex;
    justify-content: flex-end;
    gap: 0.2rem;
  }

  .bottlecart-qty {
    width: 5.5ch;
    height: 2rem;
    font-size: 0.9rem;
    padding: 0.15rem 0.25rem;
  }

  .bottlecart-plus,
  .bottlecart-minus {
    width: 2rem;
    height: 2rem;
    font-size: 0.95rem;
  }

  /* Show buttons on tablets (481px-768px) */
  @media (min-width: 481px) {
    .bottlecart-table .qty-inner button {
      display: grid !important;
    }
  }

  /* Footer */
  .bottlecart-table tfoot tr {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 0;
    margin: 0;
    border: none;
    background: transparent;
    border-radius: 0;
    overflow: visible;
    box-shadow: none;
  }

  .bottlecart-table tfoot td {
    padding: 0.65rem 0.75rem;
    border-top: none;
    background: #fff;
  }

  .bottlecart-table tfoot tr:first-child td {
    border-top: 1px solid var(--bc-gray-200);
    border-bottom: 1px solid var(--bc-gray-200);
  }

  .bottlecart-table tfoot tr:last-child td {
    border-bottom: 2px solid var(--bc-gray-300);
  }

  .bottlecart-table tfoot td:first-child {
    font-weight: 600;
    text-align: left;
  }

  .bottlecart-table tfoot tr:last-child td:first-child {
    font-weight: 700;
    font-size: 1.1rem;
  }

  .bottlecart-total {
    font: 700 1.1rem/1 var(--bc-font-sans);
  }

  .bottlecart-total {
    font-size: 1.1rem;
  }
}

/* Small Mobile (480px and below) */
@media (max-width: 480px) {
  .bottlecart-table td {
    padding: 0.65rem;
  }

  .bottlecart-table .prod-title {
    font-size: 1rem;
  }

  .bottlecart-table .prod-meta {
    font-size: 0.75rem;
  }

  .bottlecart-table .qty-inner button {
    display: none !important;
  }

  .bottlecart-qty {
    width: 6ch;
  }

  .bottlecart-table tfoot td:first-child,
  .bottlecart-table tfoot tr:last-child td:first-child {
    font-size: 0.95rem;
  }

  .bottlecart-vat,
  .bottlecart-total {
    font-size: 1rem;
  }
}

/* Misc */
.elementor-field-group-bottlecart_order_lines {
  display: none !important;
}