/* ==========================================================================
   TEXAS CHECKOUT — FOREST GREEN REDESIGN
   Palette: forest #003D29 / dark #002217 / canvas #FAFAF7 / ink #1F1F1F
   Built step-by-step. STEP 1 = CTA + title.
   ========================================================================== */

/* ---- STEP 1: primary CTA (was yellow) ---- */
#amscheckout-onepage .amscheckout-submit,
button.amscheckout-submit{
  background:#003D29 !important;
  color:#fff !important;
  border:none !important;
  border-radius:12px !important;
  font-size:17px !important;
  font-weight:800 !important;
  padding:16px 24px !important;
  width:100% !important;
  cursor:pointer !important;
  box-shadow:0 4px 14px rgba(0,61,41,.20) !important;
  transition:background .2s ease, box-shadow .2s ease !important;
}
#amscheckout-onepage .amscheckout-submit:hover,
button.amscheckout-submit:hover{
  background:#002217 !important;
  box-shadow:0 6px 18px rgba(0,61,41,.30) !important;
}

/* ---- STEP 1: contact title (was pink) ---- */
.custom-contact-title,
.amscheckout .first-column .title,
.column-block .title{
  color:#003D29 !important;
}
/* === STEP2 START === */

/* ---- CTA text WHITE (inner spans were dark #111827) ---- */
#amscheckout-onepage .amscheckout-submit,
#amscheckout-onepage .amscheckout-submit span,
button.amscheckout-submit span,
button.amscheckout-submit span span{
  color:#fff !important;
}

/* ---- trust / notice bar (was pink/red) → soft forest ---- */
.order-review-info,
.order-review-info ul,
.order-review-info li{
  background:#F0F4F1 !important;
  color:#003D29 !important;
  border:none !important;
}
.order-review-info{
  border:1px solid #D8E3DC !important;
  border-radius:12px !important;
  padding:14px 18px !important;
  list-style:none !important;
}
.order-review-info li.first,
.order-review-info li.second,
.order-review-info li{
  color:#003D29 !important;
  font-size:14px !important;
  line-height:1.7 !important;
  padding:2px 0 !important;
}
.order-review-info li.first{
  font-weight:800 !important;
  color:#1F1F1F !important;
}

/* ---- form inputs → clean, rounded, forest focus ---- */
#amscheckout-onepage .input-text,
#amscheckout-onepage input[type=text],
#amscheckout-onepage input[type=email],
#amscheckout-onepage input[type=tel],
#amscheckout-onepage input[type=date],
#amscheckout-onepage select,
#amscheckout-onepage textarea{
  border:1px solid #D8D2C6 !important;
  border-radius:10px !important;
  padding:12px 14px !important;
  background:#fff !important;
  color:#1F1F1F !important;
  font-size:15px !important;
  width:100% !important;
  box-sizing:border-box !important;
  transition:border-color .18s ease, box-shadow .18s ease !important;
}
#amscheckout-onepage .input-text:focus,
#amscheckout-onepage input:focus,
#amscheckout-onepage select:focus,
#amscheckout-onepage textarea:focus{
  border-color:#003D29 !important;
  box-shadow:0 0 0 3px rgba(0,61,41,.12) !important;
  outline:none !important;
}

/* field labels — readable ink */
#amscheckout-onepage label,
.column-block label{
  color:#1F1F1F !important;
  font-size:13.5px !important;
  font-weight:600 !important;
}

/* NOTE: validation-advice (red "field required") intentionally NOT styled — stays red */

/* === STEP2 END === */
/* === STEP3 START === */

/* ---- "עדכן" update button (was pink #FF5C9D) → forest ---- */
.second-column .quantity-button,
.second-column button.quantity-button.validation-passed,
.amscheckout .quantity-button.validation-passed,
.order-review .quantity-button{
  background:#003D29 !important;
  color:#fff !important;
  border:none !important;
  border-radius:8px !important;
  font-weight:700 !important;
  padding:6px 16px !important;
  cursor:pointer !important;
  transition:background .18s ease !important;
}
.second-column .quantity-button:hover,
.amscheckout .quantity-button.validation-passed:hover{
  background:#002217 !important;
}

/* ---- prices (was pink/red #ED1C24) → graphite ---- */
.second-column .price,
.order-review .price,
.amscheckout .second-column span.price,
.amscheckout-row .price{
  color:#1F1F1F !important;
  font-weight:700 !important;
}

/* ---- column headers "כמות"/"מחיר"/"פרטי המוצר" (was pink) → forest ---- */
.second-column th,
.second-column th.a-center,
.amscheckout th{
  color:#003D29 !important;
  font-weight:800 !important;
  font-size:14px !important;
}

/* === STEP3 END === */
/* === STEP4 START === */

/* ---- qty input → narrow & centered (was 206px wide) ---- */
.second-column .input-qty,
.second-column input.input-qty,
input.input-qty[name*="qty"]{
  width:75px !important;
  max-width:75px !important;
  text-align:center !important;
  padding:8px 6px !important;
  font-weight:700 !important;
  font-size:15px !important;
}

/* ---- validation messages → RED (override any green leak) ---- */
.validation-advice,
.validation-advice *,
div.validation-advice,
#amscheckout-onepage .validation-advice,
.second-column .validation-advice{
  color:#DC2626 !important;
  font-weight:700 !important;
  font-size:13px !important;
}

/* ---- trust / notice bar → bigger, readable ---- */
.order-review-info li,
.order-review-info li.first,
.order-review-info li.second{
  font-size:16px !important;
  line-height:1.9 !important;
}
.order-review-info li.first{
  font-weight:800 !important;
  color:#1F1F1F !important;
  font-size:16.5px !important;
}

/* === STEP4 END === */
/* === STEP5 START === */

/* ---- hide the small pink "כמות" label above the qty input ---- */
.second-column .quantity-border > span,
.quantity-border > span:first-child{
  display:none !important;
}
/* tidy the qty cell: input + button stacked & centered */
.second-column .quantity-border{
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  gap:8px !important;
  border:none !important;
}

/* ---- product image → nice framed thumbnail ---- */
.second-column img.product-img,
.second-column td img.product-img{
  width:88px !important;
  height:88px !important;
  object-fit:contain !important;
  background:#FAFAF7 !important;
  border:1px solid #E6E2D8 !important;
  border-radius:12px !important;
  padding:6px !important;
  box-shadow:0 2px 8px rgba(15,30,20,.06) !important;
  transition:transform .2s ease, box-shadow .2s ease !important;
}
.second-column img.product-img:hover{
  transform:scale(1.05) !important;
  box-shadow:0 6px 16px rgba(15,30,20,.14) !important;
}

/* ---- table → spacing, row hover, clean dividers ---- */
.second-column table{
  border-collapse:separate !important;
  border-spacing:0 !important;
  width:100% !important;
}
.second-column tbody tr{
  transition:background .15s ease !important;
}
.second-column tbody tr:hover{
  background:#F0F4F1 !important;
}
.second-column tbody td{
  padding:16px 12px !important;
  border-bottom:1px solid #EFEDE4 !important;
  vertical-align:middle !important;
}
/* product name → readable, bold-ish */
.second-column tbody td a,
.second-column .product-name{
  color:#1F1F1F !important;
  font-weight:600 !important;
  font-size:15px !important;
  text-decoration:none !important;
}
/* column header row → subtle bg */
.second-column thead th,
.second-column tr.first th{
  border-bottom:2px solid #E6E2D8 !important;
  padding-bottom:12px !important;
}

/* === STEP5 END === */
/* === STEP6 START === */

/* ---- delete X (.amasty-checkout-delete) → pretty circular button ---- */
.second-column .amasty-checkout-delete,
span.amasty-checkout-delete{
  display:inline-grid !important;
  place-items:center !important;
  width:30px !important;
  height:30px !important;
  border-radius:50% !important;
  background:#FEE2E2 !important;
  cursor:pointer !important;
  font-size:0 !important;            /* hide any existing glyph */
  transition:all .2s cubic-bezier(.2,.7,.2,1) !important;
}
.second-column .amasty-checkout-delete::before{
  content:"\2715" !important;
  font-size:14px !important;
  font-weight:700 !important;
  color:#DC2626 !important;
  line-height:1 !important;
}
.second-column .amasty-checkout-delete:hover{
  background:#DC2626 !important;
  transform:rotate(90deg) scale(1.08) !important;
}
.second-column .amasty-checkout-delete:hover::before{
  color:#fff !important;
}

/* ---- qty cell centered under "כמות" header ---- */
.second-column .quantity-border{
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  justify-content:center !important;
  gap:8px !important;
  margin:0 auto !important;
}
.second-column td.a-center{
  text-align:center !important;
  vertical-align:middle !important;
}

/* === STEP6 END === */
/* === STEP7 START === */

/* ---- kill the duplicate original X image — keep only the ::before ✕ ---- */
.second-column .amasty-checkout-delete img,
span.amasty-checkout-delete img{
  display:none !important;
}

/* ---- prices → centered & aligned with other columns ---- */
.second-column td.a-right,
.second-column .price,
.second-column td .price{
  text-align:center !important;
}
.second-column td.a-right{
  vertical-align:middle !important;
}
.second-column .price{
  font-size:16px !important;
  font-weight:700 !important;
  color:#1F1F1F !important;
  display:inline-block !important;
}

/* ---- consistent vertical centering across all cells ---- */
.second-column tbody td{
  vertical-align:middle !important;
  text-align:center !important;
}
/* product name cell stays right-aligned (RTL natural) */
.second-column tbody td:last-child,
.second-column .product-name{
  text-align:right !important;
}

/* === STEP7 END === */
/* === STEP8A START === */

/* delete X — NEUTRAL by default, soft red on hover (like the popup) */
.second-column .amasty-checkout-delete,
span.amasty-checkout-delete{
  background:transparent !important;
}
.second-column .amasty-checkout-delete::before{
  color:#9CA3AF !important;          /* neutral grey ✕ */
}
.second-column .amasty-checkout-delete:hover{
  background:#FEE2E2 !important;     /* very soft red bg */
  transform:rotate(90deg) scale(1.08) !important;
}
.second-column .amasty-checkout-delete:hover::before{
  color:#DC2626 !important;          /* red ✕ on hover */
}

/* === STEP8A END === */
