.tfd-co-table .button{ margin-right:6px; }
.tfd-co-actions{ margin-top:16px; display:flex; flex-wrap:wrap; gap:8px; }
.tfd-co-actions .checkout-button{ font-weight:600; }
.tfd-co-matrix{ display:flex; flex-direction:column; gap:16px; }
.tfd-co-block{ border:1px solid rgba(0,0,0,.08); border-radius:10px; padding:12px; overflow:visible; background:#fff; }

/* Allow the size matrix to scroll horizontally on small screens (instead of clipping columns) */
.tfd-co-matrix-wrap{ display:block; width:100%; max-width:100%; overflow-x:auto; -webkit-overflow-scrolling:touch; }
.tfd-co-matrix-wrap::-webkit-scrollbar{ height:10px; }

/* Allow the size matrix to scroll horizontally on small screens (instead of clipping columns) */

.tfd-co-matrix-table{
  width:100% !important;
  min-width:0;
  margin:10px 0 0 0;
  box-sizing:border-box;
  table-layout:fixed;
  font-size:20px; /* consistent with Retail/Your price */
}
.tfd-co-block-header{ display:flex; gap:12px; align-items:center; margin-bottom:10px; }
.tfd-co-img img{ border-radius:8px; }
.tfd-co-title{ font-size:1.05em; font-weight:600; }
.tfd-co-sku, .tfd-co-variant{ opacity:.8; font-size:.95em; }
.tfd-co-prices{ display:flex; gap:16px; flex-wrap:wrap; margin:6px 0 10px; }
.tfd-co-matrix-table th, .tfd-co-matrix-table td{ text-align:center; vertical-align:middle; }
.tfd-co-matrix-table th:first-child, .tfd-co-matrix-table td:first-child{ text-align:left; }
.tfd-co-rowlabel{ font-weight:600; }
.tfd-co-qty{
  width:72px;
  max-width:100%;
  text-align:center;
  font-size:inherit;
  padding:8px 8px;
  box-sizing:border-box;
}
.tfd-co-matrix-table th:last-child,
.tfd-co-matrix-table td:last-child{ width:80px; }
.tfd-co-matrix-table th:first-child,
.tfd-co-matrix-table td:first-child{ width:180px; }
.tfd-co-total{ font-weight:600; text-align:right; }

/* Primary button (green) */
.tfd-co-btn-primary{
  display:inline-block;
  padding: 12px 18px;
  border-radius: 6px;
  background: #2eae5b;
  color: #fff !important;
  border: 0;
  font-weight: 600;
  text-decoration: none !important;
  cursor: pointer;
}
.tfd-co-btn-primary:hover,
.tfd-co-btn-primary:focus{
  filter: brightness(0.95);
  color:#fff !important;
  text-decoration:none !important;
}

/* Cart/Checkout */
/*
 * IMPORTANT:
 * - In Woo Blocks we render the save button using Woo's own button classes
 *   (wc-block-components-button ...). We should NOT override its styling.
 * - In classic templates we keep Woo's checkout button classes and only ensure
 *   full width + spacing.
 */
a.tfd-co-save{ text-decoration:none !important; }
a.tfd-co-save:not(.wc-block-components-button){
  width:100%;
  display:block;
  text-align:center;
  margin:12px 0;
}

/* Keep a bit of breathing room between the Save button and the checkout/order button */
.tfd-co-save-wrap{ margin-bottom: 14px; }

/* In cart blocks the Save button is also a button element; ensure spacing even if wrappers get merged */
.wc-block-components-button.tfd-co-save{ margin-bottom: 14px !important; }

/* Save changes should be in proportion (match surrounding link typography) */
.tfd-co-edit .tfd-co-btn-primary{
  display: inline-block;
  width: auto;
  font-size: inherit;
  line-height: 1.2;
  padding: 8px 14px;
  border-radius: 8px;
}

/* Modal */
.tfd-co-modal-backdrop{ position:fixed; inset:0; background:rgba(0,0,0,.55); z-index:9998; display:none; }
.tfd-co-modal{ position:fixed; inset:0; z-index:9999; display:none; align-items:center; justify-content:center; padding:24px; }
.tfd-co-modal-card{ width:min(560px, 100%); background:#fff; border-radius:14px; padding:26px; box-shadow:0 20px 60px rgba(0,0,0,.25); }
.tfd-co-modal-title{ font-size:26px; font-weight:700; margin:0 0 14px; }
.tfd-co-modal-card .tfd-co-modal-input{
  width:100%;
  box-sizing:border-box;
  font-size:20px !important;
  line-height:1.2;
  padding:14px 14px;
  border:2px solid rgba(0,0,0,.12);
  border-radius:12px;
  box-shadow:none !important;
  outline:none;
  margin: 4px 0 0;
}
.tfd-co-modal-card .tfd-co-modal-input:focus{
  border-color: rgba(0,0,0,.35);
  box-shadow:none !important;
}
.tfd-co-modal-actions{ display:flex; gap:10px; justify-content:flex-end; margin-top:12px; }
.tfd-co-btn-secondary{ padding:12px 18px; border-radius:6px; background:#e9e9e9; color:#111 !important; border:0; font-weight:600; cursor:pointer; }
.tfd-co-btn-secondary:hover,.tfd-co-btn-secondary:focus{ filter:brightness(.97); }

/* Only enforce hover/focus styling in classic templates.
   In Woo Blocks we use Woo's button classes and should not override text colors. */
a.tfd-co-save:not(.wc-block-components-button):hover,
a.tfd-co-save:not(.wc-block-components-button):focus{
  text-decoration: none !important;
}

/* --- Matrix: prevent header/total truncation on narrow screens --- */
.tfd-co-matrix-table th,
.tfd-co-matrix-table td{ white-space:nowrap; }
.tfd-co-matrix-table .tfd-co-variant,
.tfd-co-matrix-table th:first-child{ white-space:normal; }