/* Raleway + black everywhere in the RAQ table (including injected rows) */
#yith-ywrq-table-list,
#yith-ywrq-table-list * {
  font-family: "Raleway", sans-serif !important;
}

/* Keep the remove × link red inside the RAQ table */
#yith-ywrq-table-list .product-remove a.remove {
  color: #c00 !important;  /* strong red */
  font-weight: bold;
}

/* Hide RAQ table until our schema has been applied to avoid flicker */
#yith-ywrq-table-list {
  opacity: 1;
}

#yith-ywrq-table-list[data-atf-ready="1"] {
  opacity: 1;
  transition: opacity .06s linear;
}

/* Base table typography (headers remain a touch larger) */
#yith-ywrq-table-list th,
#yith-ywrq-table-list .quantity {
  font-size: 16px !important;
  line-height: 1.45;
}

/* Body cell sizing: Product ID, Product name, Quantity → 14px */
#yith-ywrq-table-list tbody td.atf-product-id,
#yith-ywrq-table-list tbody td.product-name,
#yith-ywrq-table-list tbody td.product-quantity,
#yith-ywrq-table-list tbody td .quantity,
#yith-ywrq-table-list tbody td .quantity .qty {
  font-size: 14px !important;
  line-height: 1.4 !important;
  color: black !important;
}

/* Smaller helper note under item names (details) — lighten the color */
#yith-ywrq-table-list .atf-note {
  font-size: 14px !important;
  line-height: 1.35 !important;
  color: #6b7280 !important; /* neutral grey for contrast against black text */
  opacity: 1 !important;     /* rely on color, not opacity */
}

/* Fixed table layout and header widths (colgroup will also enforce this) */
#yith-ywrq-table-list {
  table-layout: fixed !important;
  width: 100% !important;
  border-collapse: separate;
}
#yith-ywrq-table-list thead th.product-remove   { width: 4%  !important; }
#yith-ywrq-table-list thead th.atf-product-id   { width: 22% !important; }
#yith-ywrq-table-list thead th.product-name     { width: 56% !important; }
#yith-ywrq-table-list thead th.product-quantity { width: 18% !important; }

/* Body fallback widths — match header schema */
#yith-ywrq-table-list > tbody > tr > td:nth-child(1) { width: 4%  !important; } /* remove */
#yith-ywrq-table-list > tbody > tr > td:nth-child(2) { width: 22% !important; } /* product id */
#yith-ywrq-table-list > tbody > tr > td:nth-child(3) { width: 56% !important; } /* name */
#yith-ywrq-table-list > tbody > tr > td:nth-child(4) { width: 18% !important; } /* qty */

/* Product name wrapping */
#yith-ywrq-table-list td.product-name span {
  display: inline-block;
  white-space: normal;
  word-break: break-word;
}

/* Make ALL qty inputs borderless + clean (native turf, install row, etc.) */
#yith-ywrq-table-list .product-quantity .qty {
  border: none !important;
  box-shadow: none !important;
  background: transparent !important;
  padding: 0 !important;
  width: auto !important;
  min-width: 3ch;
  text-align: left;
}

/* Turf qty: sqft badge inline beside the input, sized to 14px */
#yith-ywrq-table-list .atf-sqft-badge {
  display: inline-block;
  margin-left: 8px;
  font-size: 14px !important;
  line-height: 1.3 !important;
  font-weight: 600;
}

/* Keep native table on tablets if the theme tries to stack */
@media (max-width: 1024px) {
  #yith-ywrq-table-list,
  #yith-ywrq-table-list thead,
  #yith-ywrq-table-list tbody,
  #yith-ywrq-table-list tr,
  #yith-ywrq-table-list th,
  #yith-ywrq-table-list td { display: revert !important; }
}

/* Quote options UI (shortcode) */
.quote-options__sentence {
  font-family: "Raleway", sans-serif;
  font-size: 16px;
  color: #000;
  font-weight: 700;
  text-align: center;
  line-height: 1.6;
}
.checkbox-stack { display: inline-flex; flex-direction: column; align-items: center; margin: 0 6px; vertical-align: middle; }
.checkbox-stack label { display: flex; align-items: center; gap: 6px; cursor: pointer; font-weight: 600; color: #000; }
.checkbox-stack .main-option { margin-bottom: 4px; }
.checkbox-stack .sub-option input[type="checkbox"] { margin-left: -20px; }
.checkbox-stack input[type="checkbox"] { width: 16px; height: 16px; accent-color: #000; margin: 0; }

/* Tooltip */
.tooltip { position: relative; display: inline-block; margin-left: 6px; }
.tooltip-icon { display: inline-block; width: 18px; height: 18px; line-height: 18px; border-radius: 50%; background: #c00; color: #fff; font-size: 12px; font-weight: bold; text-align: center; cursor: pointer; }
.tooltip-text {
  visibility: hidden; opacity: 0; width: 260px; background: #fff; color: #000;
  text-align: left; font-size: 13px; line-height: 1.4; border: 1px solid #ccc;
  border-radius: 6px; padding: 8px 10px; position: absolute; z-index: 10;
  bottom: 125%; left: 50%; transform: translateX(-50%);
  box-shadow: 0 2px 8px rgba(0,0,0,.15); transition: opacity .2s ease;
}
.tooltip-text::after {
  content: ""; position: absolute; top: 100%; left: 50%; margin-left: -6px;
  border-width: 6px; border-style: solid; border-color: #ccc transparent transparent transparent;
}
.tooltip:hover .tooltip-text { visibility: visible; opacity: 1; }