.dtb-opc {
  padding: 40px 16px;
  min-height: 100vh;
  box-sizing: border-box;
  position: relative;
  font-family: var(--dtb-opc-font, inherit);
  color: #000;
  background: var(--dtb-opc-bottom-bg-color, transparent);
}
.dtb-opc * { color: #000; }

.dtb-opc::before{
  content:"";
  position:absolute;
  top:0; left:0; right:0;
  height: var(--dtb-opc-top-bg-height, 0px);
  background: var(--dtb-opc-top-bg-color, transparent);
  z-index: 0;
}
.dtb-opc__hero, .dtb-opc__card { position: relative; z-index: 1; }

.dtb-opc__hero { max-width: 980px; margin: 0 auto 24px; position: relative; text-align: center; }
.dtb-opc__back { position: absolute; left: 0; top: 0; text-decoration: none; opacity: .9; color: inherit; }
.dtb-opc__logo { font-weight: 700; letter-spacing: .5px; }
.dtb-opc__logo img { display: inline-block; }

.dtb-opc__card {
  margin: 0 auto;
  background: #fff;
  border-radius: 14px;
  box-shadow: 0 10px 40px rgba(0,0,0,.12);
  overflow: hidden;
}

.dtb-opc-summary { border-bottom: 1px solid rgba(0,0,0,.08); }
.dtb-opc-summary__head {
  display: flex; align-items: center; justify-content: space-between;
  padding: 18px 18px;
}
.dtb-opc-summary__toggle { display: flex; gap: 10px; align-items: center; }
.dtb-opc-summary__icon { width:18px; height:18px; display:inline-block; }
.dtb-opc-summary__btn { background: none; border: 0; padding: 0; cursor: pointer; font-weight: 400; font-size:14px; }
.dtb-opc-summary__total { font-weight: 500; font-size: 20px; }
.dtb-opc-summary__body { padding: 0 18px 18px; }

.dtb-opc-summary.is-collapsed .dtb-opc-summary__body { display: none; }

/* Items */
.dtb-opc-item {
  display: grid;
  grid-template-columns: 144px 1fr 90px;
  gap: 12px;
  padding: 14px 0;
  border-top: 1px solid rgba(0,0,0,.06);
}
.dtb-opc-item__thumbimg { border-radius: 10px; display:block; width:128px; height:192px; object-fit:cover; }
.dtb-opc-item__title { font-weight: 400; font-size:14px; margin-bottom: 6px; }
.dtb-opc-item__meta { font-size: 12px; opacity: .85; line-height: 1.35; }
.dtb-opc-item__side { text-align: right; display:flex; flex-direction: column; gap: 10px; align-items: flex-end; }
.dtb-opc-item__remove { border: 1px solid rgba(0,0,0,.18); background: #fff; width: 28px; height: 28px; border-radius: 999px; cursor: pointer; font-size:16px; line-height:26px; display:flex; align-items:center; justify-content:center; }
.dtb-opc-item__price { font-weight: 600; font-size:14px; }
.dtb-opc-item__price .dtb-opc-price__regular{ display:block; opacity:0.55; margin:0 0 2px 0; font-weight:400; }
.dtb-opc-item__price .dtb-opc-price__regular *{ opacity:1; }
.dtb-opc-item__price .dtb-opc-price__saved{ display:block; margin:0 0 2px 0; font-weight:400; font-size:12px; color:#1f7a3a !important; }
.dtb-opc-item__price .dtb-opc-price__saved *{ color:#1f7a3a !important; font-weight:400; font-size:12px; }

.dtb-opc-item__price .dtb-opc-price__saved .woocommerce-Price-amount,
.dtb-opc-item__price .dtb-opc-price__saved .woocommerce-Price-currencySymbol{ color:#1f7a3a !important; }
.dtb-opc-item__price .dtb-opc-price__sale{ display:block; text-decoration:none; font-weight:600; margin:0; }


/* Qty */
/* Coupon */
.dtb-opc-summary__coupon{
  display:block;
  margin-top:14px;
}
.dtb-opc-coupon__row{
  display:flex;
  flex-wrap:nowrap;
  gap:12px;
  align-items:stretch;
}
.dtb-opc-coupon__msg{
  width:100%;
  margin-top:10px;
}

.dtb-opc-coupon__input{
  flex:1 1 auto;
  width:100%;
  height:48px;
  padding:0 16px;
  border:1px solid rgba(0,0,0,.18);
  border-radius:14px;
  background:#fff;
  font-family: inherit;
  font-size: inherit;
  line-height: normal;
  box-sizing:border-box;
}
.dtb-opc-coupon__input::placeholder{
  color: rgba(0,0,0,.55);
}
.dtb-opc-coupon__btn{
  width:180px;
  height:48px;
  border-radius:14px;
  border:0;
  background:#1b1b1b;
  cursor:pointer;
  font-weight:700;
  color:#fff;
  box-sizing:border-box;
}
.dtb-opc-coupon__btn:hover{
  background:#d4af37;
  color:#fff;
}
.dtb-opc-coupon__msg{
  flex: 0 0 100%;
  width:100%;
  margin-top:0;
  font-size:13px;
  line-height:1.35;
}
@media (max-width: 640px){
  /* Mobile: stack discount code input and Apply button as full-width rows */
  .dtb-opc-coupon__row{
    flex-direction:column;
    gap:10px;
    align-items:stretch;
  }
  .dtb-opc-coupon__input{
    width:100%;
    height:48px !important;
    min-height:48px !important;
    font-size:16px; /* iOS-friendly */
  }
  .dtb-opc-coupon__btn{
    width:100%;
    flex:0 0 auto;
    height:48px !important;
    min-height:48px !important;
    padding:0 16px !important;
    line-height:48px !important;
    display:flex;
    align-items:center;
    justify-content:center;
  }
}


@media (max-width: 640px){
  /* Mobile: prevent long product titles from breaking the item layout */
  .dtb-opc-item{
    grid-template-columns: 120px 1fr;
    grid-template-rows: auto auto;
    grid-template-areas:
      "thumb main"
      "thumb side";
    gap: 12px;
  }
  .dtb-opc-item__thumb{ grid-area: thumb; }
  .dtb-opc-item__main{ grid-area: main; min-width: 0; }
  .dtb-opc-item__title{
    overflow-wrap: anywhere;
    word-break: break-word;
  }
  .dtb-opc-item__side{
    grid-area: side;
    flex-direction: row;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
  }
  .dtb-opc-item__price{
    text-align: right;
  }
}
/* Totals */
.dtb-opc-summary__totals { margin-top: 16px; border-top: 1px solid rgba(0,0,0,.06); padding-top: 12px; }
.dtb-opc-trow { display:flex; justify-content: space-between; padding: 6px 0; }
.dtb-opc-trow--total { font-weight: 800; padding-top: 10px; border-top: 1px solid rgba(0,0,0,.06); margin-top: 10px; }

/* Checkout block styling */
.dtb-opc-checkout { padding: 18px; }
.dtb-opc-h2 { margin: 18px 0 10px; font-size: 20px; }
.dtb-opc-block { padding: 12px 0 6px; }

/* Keep Woo fields clean */
.dtb-opc .woocommerce form .form-row { margin: 0 0 12px; }
.dtb-opc .woocommerce form .form-row input.input-text,
.dtb-opc .woocommerce form .form-row select,
.dtb-opc .woocommerce form .form-row textarea {
  border-radius: 10px;
  border: 1px solid rgba(0,0,0,.12);
  padding: 10px 12px;
}

/* Mobile */
@media (max-width: 640px) {
  .dtb-opc-item { grid-template-columns: 104px 1fr; }
  .dtb-opc-item__thumbimg{ width:96px; height:144px; }
  .dtb-opc-item__side { grid-column: 2; align-items:flex-start; text-align:left; flex-direction: row; justify-content: space-between; width:100%; }
  .dtb-opc-summary__coupon { flex-direction: column; }
  .dtb-opc-coupon__btn { width: 180px; height: 44px; border-radius: 10px; border: 0; background: #1b1b1b; cursor:pointer; font-weight: 700; color:#fff; }
.dtb-opc-coupon__btn:hover{ background:#d4af37; color:#fff; }
}

/* Hide Woo coupon toggle notice inside this UI */
.dtb-opc .woocommerce-form-coupon-toggle,
.dtb-opc .woocommerce-info {
  display:none !important;
}

/* Back link should not change color after visit */
.dtb-opc__back:link,
.dtb-opc__back:visited,
.dtb-opc__back:hover,
.dtb-opc__back:active{ color: inherit; }

.dtb-opc-qty__btn, .dtb-opc-qty__input, .dtb-opc-coupon__input, .dtb-opc-coupon__btn { width: 180px; height: 44px; border-radius: 10px; border: 0; background: #1b1b1b; cursor:pointer; font-weight: 700; color:#fff; }
.dtb-opc-coupon__btn:hover{ background:#d4af37; color:#fff; }

/* Back link: default white, hover gold, visited same as default */
.dtb-opc__back:link,
.dtb-opc__back:visited{
  color:#ffffff;
}
.dtb-opc__back:hover,
.dtb-opc__back:active{
  color:#d4af37;
}

.dtb-opc-summary__btn{ display:flex; align-items:center; gap:8px; }
.dtb-opc-summary__arrow{ font-size:12px; opacity:.85; }

/* Force rounded checkout fields (Woo may override) */
.dtb-opc .woocommerce form .form-row input.input-text,
.dtb-opc .woocommerce form .form-row select,
.dtb-opc .woocommerce form .form-row textarea{
  border-radius:14px !important;
}

/* Thumbnail qty badge + controls */
.dtb-opc-thumbwrap{ position:relative; display:inline-block; }
.dtb-opc-qty-under{ margin-top:6px; display:flex; gap:10px; align-items:center; justify-content:center; }

/* Variation labels/values in cart item meta (single line per attribute) */
.dtb-opc-item__meta{ font-size:12px; line-height:1.35; }
.dtb-opc-item__meta dl{ margin:0; }
.dtb-opc-item__meta dt{ display:inline; white-space:nowrap; font-weight:500; margin-right:4px; }
.dtb-opc-item__meta dd{ display:inline; white-space:nowrap; font-weight:400; margin:0; }
.dtb-opc-item__meta dd p{ display:inline; margin:0; }
.dtb-opc-item__meta dd:after{ content:""; display:block; }


.dtb-opc-qtyunder__btn{
  border: 1px solid rgba(0,0,0,.18);
  background: #fff;
  width: 28px;
  height: 28px;
  border-radius: 999px;
  cursor: pointer;
  font-size:16px;
  line-height:26px;
  display:flex;
  align-items:center;
  justify-content:center;
  color:#000;
}
.dtb-opc-qtyunder__btn:hover{
  background: rgba(0,0,0,.06);
}

/* Coupon input: keep original styling (do not inherit global rounding) */
.dtb-opc-coupon__input{
  border-radius:10px !important;
  border:1px solid rgba(0,0,0,.12) !important;
  height:44px !important;
  padding:0 12px !important;
  background:#fff !important;
  color:#000 !important;
}


/* Summary totals (bottom of order summary) */
.dtb-opc-totals,
.dtb-opc-totals *{
  font-size:20px;
  font-weight:500;
}

@media (max-width: 640px){
  .dtb-opc-coupon{ display:block; }
  .dtb-opc-coupon__input{ width:100% !important; }
  .dtb-opc-coupon__btn{ width:100% !important; margin-top:10px; }
}

@media (max-width: 640px){
  .dtb-opc-item__head{ display:flex; align-items:flex-start; justify-content:space-between; gap:10px; flex-wrap:nowrap; }
  .dtb-opc-item__title{ white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
  .dtb-opc-item__price{ white-space:nowrap; }
}

/* Force correct sizing for remove and qty buttons (override any theme styles) */
.dtb-opc-item__remove{
  width:28px !important;
  height:28px !important;
  border-radius:999px !important;
  background:#fff !important;
  font-size:16px !important;
  line-height:26px !important;
}
.dtb-opc-qtyunder__btn{
  width:28px !important;
  height:28px !important;
  border-radius:999px !important;
  background:#fff !important;
  font-size:16px !important;
  line-height:26px !important;
}

/* Summary bottom total row */
.dtb-opc-summary__totals .dtb-opc-trow--total .dtb-opc-trow__label,
.dtb-opc-summary__totals .dtb-opc-trow--total .dtb-opc-trow__value{
  font-size:20px !important;
  font-weight:500 !important;
}

.dtb-opc-qtybadge{
  position:absolute;
  right:6px;
  bottom:6px;
  width:32px;
  height:32px;
  border-radius:999px;
  background:#d4af37;
  border:1px solid rgba(0,0,0,.25);
  color:#000;
  font-weight:500;
  font-size:16px;
  display:flex;
  align-items:center;
  justify-content:center;
  box-shadow:0 4px 12px rgba(0,0,0,.18);
}

@media (max-width: 640px){
  .dtb-opc-item__head{
    display:flex !important;
    align-items:flex-start !important;
    justify-content:space-between !important;
    gap:10px !important;
    flex-wrap:nowrap !important;
  }
  .dtb-opc-item__title{
    flex:1 1 auto !important;
    min-width:0 !important;
    white-space:nowrap !important;
    overflow:hidden !important;
    text-overflow:ellipsis !important;
  }
  .dtb-opc-item__price{
    flex:0 0 auto !important;
    white-space:nowrap !important;
    margin-left:auto !important;
  }
}

@media (max-width: 640px){
  .dtb-opc-coupon{
    display:block !important;
  }
  .dtb-opc-coupon__input{
    width:100% !important;
    height:44px !important;
    font-size:14px !important;
  }
  .dtb-opc-coupon__btn{
    width:100% !important;
    height:50px !important;
    margin-top:10px !important;
  }
}

/* --- Customer details tweaks --- */
/* Hide Woo default Billing/Shipping section titles inside our blocks (keeps our own 'Customer details' title) */
.dtb-opc .woocommerce-billing-fields > h3,
.dtb-opc .woocommerce-shipping-fields > h3{
  display:none !important;
}

/* Remove "Ship to a different address" checkbox + extra address fields */
.dtb-opc #ship-to-different-address,
.dtb-opc .shipping_address{
  display:none !important;
}

/* Rounded inputs in Customer details */
.dtb-opc-form input[type="text"],
.dtb-opc-form input[type="email"],
.dtb-opc-form input[type="tel"],
.dtb-opc-form input[type="password"],
.dtb-opc-form input[type="number"],
.dtb-opc-form select,
.dtb-opc-form textarea{
  border-radius:14px !important;
}

/* Place order button rounded */
.dtb-opc-form #place_order,
.dtb-opc-form button#place_order,
.dtb-opc-form .woocommerce-checkout-payment button,
.dtb-opc-form button[type="submit"].button{
  border-radius:14px !important;
}


to{transform:rotate(360deg);} }

/* Order notes textarea: taller, but normal text + equal padding */
.dtb-opc-form textarea#order_comments{
  min-height: 140px !important; /* ~3x */
  padding: 14px 14px !important; /* equal top/sides */
  line-height: 1.4 !important;
  font-size: inherit !important;
  box-sizing: border-box !important;
}


/* Hide all footer rows except shipping */
#dtb-opc-shipping-methods .woocommerce-checkout-review-order-table tfoot tr{
  display:none !important;
}
#dtb-opc-shipping-methods .woocommerce-checkout-review-order-table tfoot tr.woocommerce-shipping-totals{
  display:table-row !important;
}
#dtb-opc-shipping-methods .woocommerce-checkout-review-order-table tfoot tr.woocommerce-shipping-totals th{
  display:none !important; /* remove "Shipping" label, keep radios */
}
#dtb-opc-shipping-methods #shipping_method{
  margin:0;
  padding:0;
  list-style:none;
}
#dtb-opc-shipping-methods #shipping_method li{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:12px 14px;
  border:1px solid rgba(0,0,0,.12);
  border-radius:12px;
  margin:10px 0 0;
}
#dtb-opc-shipping-methods #shipping_method li input{
  margin-right:10px;
}
#dtb-opc-shipping-methods #shipping_method li label{
  flex:1;
  cursor:pointer;
  font-size:14px;
  line-height:1.3;
}
#dtb-opc-shipping-methods #shipping_method li .amount{
  font-weight:600;
}

/* Delivery method: shipping methods only */
.dtb-opc-shipping-only ul.woocommerce-shipping-methods{
  margin:0;
  padding:0;
  list-style:none;
}
.dtb-opc-shipping-only li.woocommerce-shipping-method{
  margin:10px 0 0;
}
.dtb-opc-shipping-only li.woocommerce-shipping-method label{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:12px 14px;
  border:1px solid rgba(0,0,0,.12);
  border-radius:12px;
  cursor:pointer;
  width:100%;
}
.dtb-opc-shipping-only li.woocommerce-shipping-method input[type="radio"]{
  margin:0 10px 0 0;
  flex:0 0 auto;
}
.dtb-opc-shipping-only .dtb-ship-label{
  flex:1 1 auto;
  font-size:14px;
  line-height:1.3;
}
.dtb-opc-shipping-only .amount{
  font-weight:600;
}
.dtb-opc-shipping-empty{
  font-size:14px;
  opacity:.7;
  margin:8px 0 0;
}

/* Rounded country select */
.dtb-opc-form select,
.dtb-opc-form .select2-container .select2-selection--single{
  border-radius:14px !important;
}

/* Mid order total block (between delivery & payment) */
.dtb-opc-midtotal{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:14px 16px;
  border:1px solid rgba(0,0,0,.10);
  border-radius:16px;
  margin:14px 0 22px;
}
.dtb-opc-midtotal__label{
  font-size:14px;
  font-weight:500;
}
.dtb-opc-midtotal__amount{
  font-size:20px;
  font-weight:500;
}

/* Mid totals block spacing */
.dtb-opc-block--midtotals{
  background: transparent;
  border: 0;
  padding: 0;
  margin: 18px 0 22px;
}
.dtb-opc-summary__totals--mid{
  margin: 0;
}



/* Apply button keeps existing theme colors but matches height/rounding */
.dtb-opc-coupon button,
.dtb-opc-coupon button[name="apply_coupon"],
.woocommerce-form-coupon button,
.woocommerce-form-coupon button[name="apply_coupon"]{
  height:48px !important;
  border-radius:14px !important;
  box-sizing:border-box !important;
}


/* Customer details: make street / postcode / city compact (2-column grid on desktop) */
.dtb-opc-fields-grid .woocommerce-billing-fields__field-wrapper{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap:16px 24px;
}
@media (max-width: 900px){
  .dtb-opc-fields-grid .woocommerce-billing-fields__field-wrapper{
    grid-template-columns: 1fr !important;
    gap:14px !important;
  }
  /* Ensure all fields span full width on mobile */
  .dtb-opc-fields-grid #billing_first_name_field,
  .dtb-opc-fields-grid #billing_phone_field,
  .dtb-opc-fields-grid #billing_address_1_field,
  .dtb-opc-fields-grid #billing_postcode_field,
  .dtb-opc-fields-grid #billing_city_field,
  .dtb-opc-fields-grid #billing_country_field{
    grid-column: 1 / -1 !important;
  }
}

/* Force specific address fields to take one column (not full width) */
.dtb-opc-fields-grid #billing_address_1_field,
.dtb-opc-fields-grid #billing_postcode_field,
.dtb-opc-fields-grid #billing_city_field,
.dtb-opc-fields-grid #billing_country_field,
.dtb-opc-fields-grid #billing_first_name_field,
.dtb-opc-fields-grid #billing_phone_field,
.dtb-opc-fields-grid #billing_email_field{
  width:auto;
}

/* Make email full width */
.dtb-opc-fields-grid #billing_email_field{
  grid-column: 1 / -1;
}

/* Place Name + Phone on same row */
.dtb-opc-fields-grid #billing_first_name_field{ grid-column: 1; }
.dtb-opc-fields-grid #billing_phone_field{ grid-column: 2; }

/* Street + Postcode on same row */
.dtb-opc-fields-grid #billing_address_1_field{ grid-column: 1; }
.dtb-opc-fields-grid #billing_postcode_field{ grid-column: 2; }

/* City + Country on same row */
.dtb-opc-fields-grid #billing_city_field{ grid-column: 1; }
.dtb-opc-fields-grid #billing_country_field{ grid-column: 2; }

/* Ensure field wrappers don't expand weirdly */
.dtb-opc-fields-grid .form-row{
  margin:0 !important;
}


/* Coupon line in totals */
.dtb-opc-trow--coupon{
  color:#147a2f;
  background: rgba(31, 143, 58, 0.18);
  border: 1px solid rgba(31, 143, 58, 0.28);
  border-radius: 12px;
  padding: 8px 10px;
  margin: 6px 0;
}
.dtb-opc-trow--coupon .dtb-opc-trow__label{
  display:flex;
  align-items:center;
  gap:8px;
}
.dtb-opc-couponline__remove{
  appearance:none;
  border:0;
  background:transparent;
  color:inherit;
  border-radius:0;
  width:auto;
  height:auto;
  line-height:1;
  font-size:16px;
  font-weight:700;
  padding:0 2px;
  cursor:pointer;
  box-shadow:none;
}
.dtb-opc-couponline__remove:hover{
  opacity:.85;
}

.dtb-opc-couponline__prefix{font-weight:600;}


/* Empty cart / Thank you title row */
.dtb-opc-empty__title{
  display:flex;
  align-items:center;
  gap:10px;
  margin-bottom:6px;
}
.dtb-opc-empty__title .dtb-opc-summary__icon{ flex:0 0 auto; }

/* Primary CTA (match Place Order look) */
.dtb-opc-btn-primary{
  display:flex;
  align-items:center;
  justify-content:center;
  width:100%;
  padding: 18px 18px;
  border-radius: 14px;
  border: 0;
  text-decoration:none;
  font-weight: 600;
  font-size: 16px;
  line-height: 1;
  background: #111;
  color: #fff !important;
  cursor: pointer;
}
.dtb-opc-btn-primary:hover{ opacity: .94; }
.dtb-opc-btn-primary:active{ transform: translateY(1px); }