/*
 * ============================================================
 *  PEACHTREE LODGE — CHECKOUT / QUICK-ORDER LUXURY LAYER
 *  Targets: order-opc (one-page checkout / quick order),
 *  guest information, rooms & price summary, payment,
 *  cart total block, booking confirmation.
 *  Presentation only — every id/name/hook left intact.
 * ============================================================
 */

/* ── 1. CHECKOUT PAGE SHELL ──────────────────────────────────── */
#order-opc #content,
#order #content,
#order-opc #columns,
#order #columns {
  background: transparent !important;
}
.page-heading {
  font-family: var(--lux-serif) !important;
  font-size: clamp(28px, 3.4vw, 44px) !important;
  font-weight: 400 !important;
  color: var(--lux-ink) !important;
  letter-spacing: 0.02em !important;
  border-bottom: 1px solid var(--lux-sand) !important;
  padding-bottom: 20px !important;
  margin: 8px 0 28px !important;
}

/* ── 2. ACCORDION STEP CARDS ─────────────────────────────────── */
#oprder-opc-accordion .card,
.opc-collapse ~ .card,
#guest-info-block,
#shopping-cart-summary-block {
  background: var(--lux-white) !important;
  border: 1px solid var(--lux-sand) !important;
  border-radius: var(--radius-lg) !important;
  box-shadow: var(--shadow-sm) !important;
  overflow: hidden !important;
  margin-bottom: 20px !important;
  transition: var(--trans) !important;
}
#oprder-opc-accordion .card:hover {
  box-shadow: var(--shadow-md) !important;
}
.card-header {
  background: var(--lux-ivory) !important;
  border-bottom: 1px solid var(--lux-sand) !important;
  padding: 20px 26px !important;
  cursor: pointer !important;
}
.card-header span,
.card-header h2,
.card-header h3 {
  font-family: var(--lux-serif) !important;
  font-size: 22px !important;
  font-weight: 400 !important;
  color: var(--lux-ink) !important;
  letter-spacing: 0.02em !important;
}
.card-header .accordion-left-arrow { color: var(--lux-gold) !important; }
.card-body { padding: 26px !important; }

/* Numbered step accent on each accordion header */
.card-header { position: relative !important; }
.card-header::before {
  content: '' !important;
  position: absolute !important;
  left: 0 !important; top: 0 !important; bottom: 0 !important;
  width: 3px !important;
  background: var(--lux-gold) !important;
  opacity: 0.55 !important;
}

/* ── 3. ROOMS & PRICE SUMMARY ────────────────────────────────── */
.cart_item, .room-detail-row, .product-line-grid {
  border-bottom: 1px solid var(--lux-sand) !important;
}
.cart_avail, .cart_room_type_img img,
.shopping-cart-summary img,
.product-line-grid img {
  border-radius: var(--radius) !important;
  object-fit: cover !important;
}
.checkin-checkout-detail,
.date-detail-block,
.occupancy-detail-block {
  background: var(--lux-ivory) !important;
  border: 1px solid var(--lux-sand) !important;
  border-radius: var(--radius) !important;
  padding: 12px 16px !important;
}
.checkin-checkout-detail .label,
.date-detail-block .label {
  font-family: var(--lux-sans) !important;
  font-size: 10px !important;
  font-weight: 600 !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase !important;
  color: var(--lux-ink-lt) !important;
}
.remove_room_type, .cart_quantity_delete {
  color: var(--lux-ink-lt) !important;
  transition: var(--trans-fast) !important;
}
.remove_room_type:hover, .cart_quantity_delete:hover {
  color: #C0392B !important;
}

/* ── 4. GUEST INFORMATION ────────────────────────────────────── */
#checkout-guest-info-block .form-group,
#customer-guest-detail-container .form-group {
  margin-bottom: 18px !important;
}
#checkout-guest-info-block label,
#customer-guest-detail-container label,
#order-opc label.control-label {
  font-family: var(--lux-sans) !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
  color: var(--lux-ink-lt) !important;
  margin-bottom: 6px !important;
}
.guest-detail-value, .guest-info-value {
  font-size: 15px !important;
  color: var(--lux-ink) !important;
}
#customer_guest_detail_txt {
  font-size: 14px !important;
  color: var(--lux-ink-md) !important;
  font-weight: 500 !important;
}

/* ── 5. PROCEED / SUBMIT BUTTONS ─────────────────────────────── */
.submit-guest-details,
.proceed_btn_block .btn,
.opc_details_action .btn,
#order-opc .button-medium.pull-right,
.opc-collapse .btn-default.button {
  background: var(--lux-dark) !important;
  background-image: none !important;
  border: 2px solid var(--lux-dark) !important;
  color: var(--lux-white) !important;
  font-family: var(--lux-sans) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  padding: 14px 32px !important;
  border-radius: var(--radius-sm) !important;
  box-shadow: none !important;
  text-shadow: none !important;
  transition: var(--trans-fast) !important;
}
.submit-guest-details:hover,
.proceed_btn_block .btn:hover,
.opc_details_action .btn:hover,
#order-opc .button-medium.pull-right:hover,
.opc-collapse .btn-default.button:hover {
  background: var(--lux-gold) !important;
  border-color: var(--lux-gold) !important;
  color: var(--lux-dark) !important;
  transform: translateY(-1px) !important;
}

/* ── 6. PAYMENT OPTIONS ──────────────────────────────────────── */
#order-payment-content .payment_module,
#order-payment-content .payment-option,
.payment_module a,
#HOOK_PAYMENT .row > div > p > a,
.payment-options a {
  display: flex !important;
  align-items: center !important;
  gap: 16px !important;
  background: var(--lux-white) !important;
  border: 1px solid var(--lux-sand) !important;
  border-radius: var(--radius) !important;
  padding: 18px 22px !important;
  margin-bottom: 12px !important;
  transition: var(--trans-fast) !important;
  color: var(--lux-ink) !important;
  font-weight: 500 !important;
  text-decoration: none !important;
}
#order-payment-content .payment_module a:hover,
.payment_module a:hover,
.payment-options a:hover {
  border-color: var(--lux-gold) !important;
  background: var(--lux-gold-pale) !important;
  box-shadow: var(--shadow-sm) !important;
}
.conditions-to-approve label,
#cgv_container label,
.checkbox label {
  font-size: 13px !important;
  color: var(--lux-ink-md) !important;
}

/* ── 7. CART TOTAL SUMMARY (right column) ────────────────────── */
.cart_total_detail_block,
.cart_total_price {
  background: var(--lux-white) !important;
  border: 1px solid var(--lux-sand) !important;
  border-radius: var(--radius-lg) !important;
  box-shadow: var(--shadow-sm) !important;
  padding: 24px 26px !important;
}
@media (min-width: 992px) {
  #order-opc .col-md-4 .cart_total_detail_block,
  #order .col-md-4 .cart_total_detail_block {
    position: sticky !important;
    top: 90px !important;
  }
}
.cart_total_detail_block p,
.cart_total_price p {
  display: flex !important;
  justify-content: space-between !important;
  align-items: baseline !important;
  padding: 9px 0 !important;
  font-size: 14px !important;
  color: var(--lux-ink-md) !important;
  border: none !important;
}
.cart_total_values { color: var(--lux-ink) !important; font-weight: 500 !important; }
.cart_final_total_block {
  border-top: 1px solid var(--lux-sand) !important;
  margin-top: 8px !important;
  padding-top: 16px !important;
}
.cart_final_total_block .strong { font-family: var(--lux-sans) !important; font-size: 13px !important; letter-spacing: 0.1em !important; text-transform: uppercase !important; color: var(--lux-ink-lt) !important; }
.cart_final_total_block .cart_total_values {
  font-family: var(--lux-serif) !important;
  font-size: 30px !important;
  font-weight: 400 !important;
  color: var(--lux-gold) !important;
}
.cart_total_tax { font-size: 12px !important; color: var(--lux-ink-lt) !important; }

/* ── 8. CONFIRMATION PAGE ────────────────────────────────────── */
#order-confirmation .box,
.order-confirmation,
.confirmation-message {
  background: var(--lux-white) !important;
  border: 1px solid var(--lux-sand) !important;
  border-radius: var(--radius-lg) !important;
  box-shadow: var(--shadow-sm) !important;
  padding: 40px !important;
  text-align: center !important;
}
.confirmation-message .icon-check,
#order-confirmation .icon-ok {
  color: var(--lux-gold) !important;
  font-size: 48px !important;
}

/* ── 9. IMAGE FRAME ZOOM (marked by JS) ──────────────────────── */
.lux-img-frame { overflow: hidden !important; display: block; }
.lux-img-frame img { transition: transform 0.6s cubic-bezier(0.25,0.46,0.45,0.94) !important; }
.lux-img-frame:hover img { transform: scale(1.05) !important; }

.lux-reveal-delay-3 { transition-delay: 0.3s; }

/* ── 10. RESPONSIVE ──────────────────────────────────────────── */
@media (max-width: 991px) {
  .card-header { padding: 16px 20px !important; }
  .card-header span { font-size: 19px !important; }
  .card-body { padding: 20px !important; }
  .cart_total_detail_block { margin-top: 20px !important; }
  #order-opc .col-md-4, #order .col-md-4 { margin-top: 8px !important; }
}
@media (max-width: 767px) {
  .submit-guest-details,
  .proceed_btn_block .btn { width: 100% !important; text-align: center !important; float: none !important; }
  .cart_final_total_block .cart_total_values { font-size: 26px !important; }
}
