:root{--primary-button-color: #0A192F; --main-third-color: #c5a059; --main-fourth-color: #0A192F; --main-second-color: #f8fafc; --product-card-bg: #fff; --product-card-border: #e2e8f0; --product-card-color: #0A192F; --border-radius: 10px;} /* ==========================================================================
   ENOX BAGNO - LUXURY CHECKOUT & PAYMENT THEME ADAPTATION (R2 & R3)
   Deep Obsidian Navy: #0A192F / #071324
   Champagne Gold: #c5a059, hover: #b38e47
   Clean typography, modern card layout, zero neon green
   ========================================================================== */

/* --- R2. CHECKOUT / BASKET LUXURY STYLING --- */

/* 1. Primary Action CTA Button: "Alışverişi Tamamla" */
.btn-success,
button.btn-success,
.complete-order-btn,
button.complete-order-btn,
.actions button.update-btn {
  background: #0A192F !important;
  background-color: #0A192F !important;
  color: #ffffff !important;
  border: 1.5px solid #0A192F !important;
  border-radius: 12px !important;
  font-weight: 600 !important;
  font-size: 15px !important;
  letter-spacing: 0.4px !important;
  height: 52px !important;
  box-shadow: 0 4px 14px rgba(10, 25, 47, 0.22) !important;
  transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1) !important;
  cursor: pointer !important;
  text-decoration: none !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
}

.btn-success:hover,
button.btn-success:hover,
.complete-order-btn:hover,
button.complete-order-btn:hover,
.actions button.update-btn:hover {
  background: #071324 !important;
  background-color: #071324 !important;
  border-color: #c5a059 !important;
  color: #c5a059 !important;
  box-shadow: 0 6px 20px rgba(10, 25, 47, 0.32), 0 0 0 2px rgba(197, 160, 89, 0.3) !important;
  transform: translateY(-2px) !important;
}

.btn-success:active,
button.btn-success:active,
.complete-order-btn:active,
button.complete-order-btn:active {
  transform: translateY(0) scale(0.99) !important;
  box-shadow: 0 2px 8px rgba(10, 25, 47, 0.2) !important;
}

/* 2. Price Displays & Discount Badges - Luxury Typography & Hierarchy */
.basket-item-price-customize {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-end !important;
  gap: 4px !important;
  font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", "SF Pro Text", "Helvetica Neue", sans-serif !important;
}

/* Struck-through Old / Market Price */
.basket-item-sale-price,
.customize-sale-price {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  color: #94a3b8 !important;
  text-decoration: none !important;
}

.basket-item-sale-price span,
.customize-sale-price span {
  color: #94a3b8 !important;
  font-weight: 500 !important;
  font-size: 13px !important;
  text-decoration: line-through !important;
}

/* Luxury Champagne Gold Discount Badge */
.basket-item-sale-price::before,
.customize-sale-price::before {
  content: "-%61" !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: rgba(197, 160, 89, 0.12) !important;
  color: #c5a059 !important;
  border: 1px solid rgba(197, 160, 89, 0.35) !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
  border-radius: 5px !important;
  padding: 2px 6px !important;
  letter-spacing: 0.4px !important;
  text-decoration: none !important;
  vertical-align: middle !important;
}

/* Active Final Basket Price */
.basket-item-basket-price,
.basket-item-basket-price span,
.customize-basket-price,
.customize-basket-price span,
.price-wrapper .basket-item-basket-price,
.basket-item-price,
.basket-item-price span {
  color: #0A192F !important;
  font-weight: 700 !important;
  font-size: 18px !important;
  letter-spacing: -0.2px !important;
}

/* 3. Product Cards in Basket */
.basket-item,
.cart-product-list .product-item {
  background: #ffffff !important;
  border: 1px solid #eef2f6 !important;
  border-radius: 16px !important;
  padding: 20px !important;
  margin-bottom: 16px !important;
  box-shadow: 0 2px 10px rgba(10, 25, 47, 0.03) !important;
  transition: all 0.25s ease !important;
}

.basket-item:hover,
.cart-product-list .product-item:hover {
  border-color: rgba(197, 160, 89, 0.4) !important;
  box-shadow: 0 8px 24px rgba(10, 25, 47, 0.06) !important;
}

.basket-item-image {
  border-radius: 12px !important;
  overflow: hidden !important;
  border: 1px solid #f1f5f9 !important;
  background: #ffffff !important;
  padding: 6px !important;
}

.basket-item-product-name,
.basket-item-product-name span {
  color: #0A192F !important;
  font-weight: 600 !important;
  font-size: 14.5px !important;
  line-height: 1.4 !important;
  transition: color 0.2s ease !important;
}

.basket-item-product-name:hover,
.basket-item-product-name:hover span {
  color: #c5a059 !important;
}

/* 4. Quantity Stepper */
.counter {
  background: #f8fafc !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: 8px !important;
  padding: 2px 4px !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 2px !important;
}

.counter .counter-button {
  width: 28px !important;
  height: 28px !important;
  border-radius: 6px !important;
  color: #0A192F !important;
  transition: all 0.2s ease !important;
}

.counter .counter-button:hover {
  background: #0A192F !important;
  color: #c5a059 !important;
}

.counter .counter-button.text-red {
  color: #94a3b8 !important;
}

.counter .counter-button.text-red:hover {
  background: #ef4444 !important;
  color: #ffffff !important;
}

.counter-text {
  color: #0A192F !important;
  font-weight: 600 !important;
  font-size: 13.5px !important;
  text-align: center !important;
}

.counter-unit {
  color: #64748b !important;
  font-size: 12px !important;
  font-weight: 500 !important;
}

/* 5. Order Summary Card */
.order-summary .basket-inner {
  background: #ffffff !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: 16px !important;
  padding: 24px !important;
  box-shadow: 0 4px 20px rgba(10, 25, 47, 0.05) !important;
}

.order-summary-card-title {
  color: #0A192F !important;
  font-weight: 700 !important;
  font-size: 17px !important;
  letter-spacing: 0.2px !important;
  padding-bottom: 14px !important;
  border-bottom: 1px solid #f1f5f9 !important;
  margin-bottom: 16px !important;
}

.order-summary-list-item .list-item-key {
  color: #64748b !important;
  font-size: 13.5px !important;
  font-weight: 500 !important;
}

.order-summary-list-item .list-item-value {
  color: #0f172a !important;
  font-weight: 600 !important;
  font-size: 14px !important;
}

.total-price-card {
  background: linear-gradient(135deg, #fdfbf7 0%, #f9f6f0 100%) !important;
  border: 1.5px solid rgba(197, 160, 89, 0.35) !important;
  border-radius: 14px !important;
  padding: 16px 20px !important;
  margin-top: 18px !important;
  margin-bottom: 20px !important;
}

.total-price-card .order-summary-card-title {
  border-bottom: none !important;
  padding-bottom: 0 !important;
  margin-bottom: 0 !important;
}

.basket-total-price,
.basket-total-price span {
  color: #0A192F !important;
  font-weight: 800 !important;
  font-size: 19px !important;
}

/* Header & Cart Actions */
.basket-header-actions button {
  color: #64748b !important;
  font-size: 13px !important;
  transition: color 0.2s ease !important;
}

.basket-header-actions button:hover {
  color: #ef4444 !important;
}

/* --- R3. PAYMENT STEPS & CONTRACT MODALS --- */

/* 1. Address & Payment Option Cards */
.step-box.completed,
.step-box.active {
  border: 1.5px solid #0A192F !important;
  background: #ffffff !important;
  border-radius: 14px !important;
  box-shadow: 0 4px 16px rgba(10, 25, 47, 0.06) !important;
}

.step-box.completed .mdi-check-circle {
  color: #c5a059 !important;
}

.step-box .v-btn,
.step-box .v-chip,
[class*="edit-btn"],
.address-edit-btn {
  background: rgba(10, 25, 47, 0.06) !important;
  color: #0A192F !important;
  border-radius: 8px !important;
  font-weight: 500 !important;
  transition: all 0.2s ease !important;
}

.step-box .v-btn:hover {
  background: #0A192F !important;
  color: #c5a059 !important;
}

.payment-option-card.active,
.payment-option-card.selected {
  border: 1.5px solid #0A192F !important;
  background: #ffffff !important;
  border-radius: 14px !important;
  box-shadow: 0 4px 16px rgba(10, 25, 47, 0.06) !important;
}

/* 2. Radio Buttons & Checkboxes */
.v-selection-control--dirty .v-selection-control__wrapper,
.v-selection-control--dirty .v-icon,
.v-selection-control--dirty .mdi-radiobox-marked,
.v-selection-control--dirty .mdi-checkbox-marked {
  color: #0A192F !important;
}

input[type="radio"]:checked {
  accent-color: #0A192F !important;
}

input[type="checkbox"]:checked {
  accent-color: #0A192F !important;
}

/* 3. Form Input Fields */
.v-field,
.v-field--variant-filled,
.v-field--variant-outlined,
.card-input-wrapper input {
  border-radius: 10px !important;
  border-color: #e2e8f0 !important;
  transition: all 0.2s ease !important;
}

.v-field--focused,
.card-input-wrapper input:focus {
  border-color: #c5a059 !important;
  box-shadow: 0 0 0 3px rgba(197, 160, 89, 0.15) !important;
}

.v-field.v-field--error,
.v-field--error .v-field__outline,
.v-input--error .v-field,
.v-field--error {
  border-color: #ef4444 !important;
  background-color: #fef2f2 !important;
  box-shadow: 0 0 0 1px rgba(239, 68, 68, 0.25) !important;
}

.v-messages__message,
.v-input--error .v-messages {
  color: #ef4444 !important;
  font-weight: 500 !important;
  font-size: 12px !important;
  margin-top: 4px !important;
}

/* 4. Contract Links */
.payment-agreement a,
a[href*="sozlesme"],
.contract-link {
  color: #0A192F !important;
  text-decoration: underline !important;
  text-underline-offset: 2px !important;
  font-weight: 500 !important;
  transition: color 0.2s ease !important;
}

.payment-agreement a:hover,
a[href*="sozlesme"]:hover,
.contract-link:hover {
  color: #c5a059 !important;
}

/* 5. Contract Modals ("Ön Bilgilendirme Formu" & "Mesafeli Satış Sözleşmesi") - Flawless Scrolling */
.v-overlay .v-dialog {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  max-width: 780px !important;
  width: 92vw !important;
}

.v-overlay .v-dialog > .v-overlay__content {
  max-height: 88vh !important;
  height: 88vh !important;
  display: flex !important;
  font-direction: column !important;
}

.v-dialog .v-card {
  display: flex !important;
  flex-direction: column !important;
  height: 100% !important;
  max-height: 88vh !important;
  border-radius: 16px !important;
  overflow: hidden !important;
  box-shadow: 0 24px 48px rgba(10, 25, 47, 0.22) !important;
  border: 1px solid rgba(197, 160, 89, 0.25) !important;
  background: #ffffff !important;
}

.v-dialog .dialog-title-wrapper,
.v-dialog .v-card-title,
.v-dialog .dialog-header {
  flex-shrink: 0 !important;
  position: sticky !important;
  top: 0 !important;
  z-index: 20 !important;
  background: #0A192F !important;
  color: #ffffff !important;
  font-weight: 700 !important;
  font-size: 16px !important;
  padding: 16px 24px !important;
  border-bottom: 1px solid rgba(197, 160, 89, 0.2) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
}

.v-dialog .contract-dialog-content,
.v-dialog .v-card-text,
.v-dialog div.container {
  flex: 1 1 auto !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  -webkit-overflow-scrolling: touch !important;
  overscroll-behavior: contain !important;
  padding: 24px 30px !important;
  background: #ffffff !important;
  color: #1e293b !important;
  line-height: 1.65 !important;
  font-size: 13.5px !important;
}

/* Custom Luxury Scrollbar */
.v-dialog .contract-dialog-content::-webkit-scrollbar,
.v-dialog .v-card-text::-webkit-scrollbar {
  width: 7px !important;
}

.v-dialog .contract-dialog-content::-webkit-scrollbar-track,
.v-dialog .v-card-text::-webkit-scrollbar-track {
  background: #f8fafc !important;
}

.v-dialog .contract-dialog-content::-webkit-scrollbar-thumb,
.v-dialog .v-card-text::-webkit-scrollbar-thumb {
  background: #cbd5e1 !important;
  border-radius: 9999px !important;
}

.v-dialog .contract-dialog-content::-webkit-scrollbar-thumb:hover,
.v-dialog .v-card-text::-webkit-scrollbar-thumb:hover {
  background: #c5a059 !important;
}

.v-dialog .mdi-close {
  color: #ffffff !important;
}

.v-dialog h1 {
  color: #0A192F !important;
  font-size: 22px !important;
  letter-spacing: 1.5px !important;
}

.v-dialog .brand-name,
div.container .brand-name {
  color: #c5a059 !important;
  font-weight: 700 !important;
}

.step-box--header h2::before,
.step-box h2::before,
h2::before {
  background: #c5a059 !important;
  border-radius: 2px !important;
}

.v-dialog h2 {
  color: #0A192F !important;
  background: #f8fafc !important;
  border-left: 4px solid #c5a059 !important;
  border-radius: 4px !important;
  padding: 10px 16px !important;
}

.v-dialog h2::before {
  display: none !important;
}

ul li::before,
.v-dialog ul li::before,
div.container ul li::before {
  color: #c5a059 !important;
}

.check-box,
.v-dialog .check-box,
div.container .check-box {
  background: rgba(197, 160, 89, 0.05) !important;
  border: 1.5px solid rgba(197, 160, 89, 0.4) !important;
  border-radius: 10px !important;
}

.check-item,
.v-dialog .check-item,
div.container .check-item {
  color: #0A192F !important;
}

.v-dialog h1,
div.container h1 {
  color: #0A192F !important;
}

.v-dialog .info-table td,
div.container .info-table td {
  border-bottom: 1px solid #f1f5f9 !important;
  color: #334155 !important;
}

.v-dialog .label,
div.container .label {
  color: #0A192F !important;
}

.modal-agreement-btn,
button.modal-agreement-btn,
.v-dialog .modal-agreement-btn,
.v-dialog button.confirm-btn,
.v-dialog button.btn-success,
.v-dialog .v-btn--variant-elevated,
.v-dialog .modal-confirm-btn,
.v-dialog button[class*="confirm"],
.v-dialog button[class*="onay"] {
  background: #0A192F !important;
  background-color: #0A192F !important;
  color: #ffffff !important;
  border: 1.5px solid #0A192F !important;
  border-radius: 10px !important;
  font-weight: 600 !important;
  transition: all 0.2s ease !important;
}

.modal-agreement-btn:hover,
button.modal-agreement-btn:hover,
.v-dialog .modal-agreement-btn:hover,
.v-dialog button.confirm-btn:hover,
.v-dialog button.btn-success:hover,
.v-dialog .v-btn--variant-elevated:hover,
.v-dialog .modal-confirm-btn:hover,
.v-dialog button[class*="confirm"]:hover,
.v-dialog button[class*="onay"]:hover {
  background: #071324 !important;
  border-color: #c5a059 !important;
  color: #c5a059 !important;
}

/* 6. Comprehensive Elimination of Default Ticimax Neon Green */
.text-green,
.bg-green,
[class*="success"]:not(.btn-success):not(button) {
  color: #0A192F !important;
}

.cp-card__variation-opt.active,
.variation-product-wrapper .variation-button-list .variation-handler-btn.active {
  background-color: #0A192F !important;
  border-color: #c5a059 !important;
  color: #ffffff !important;
}
/* Enhanced Specificity for Payment Options & Checkboxes */
div.payment-options .payment-option-card.active,
div.payment-options-content div.payment-option-card.active,
div.payment-options-content div.active,
div.payment-option-card.active[class*="active"],
div[class*="payment-option"][class*="active"],
div.active[class*="payment-option"],
div.payment-option-card.active,
.payment-option-card.active[class*="active"],
div.active[data-v-56c35613],
div.active[data-v-c5879d1e],
div.active[data-v-cba36c0e] {
  border: 1.5px solid #0A192F !important;
  border-color: #0A192F !important;
  background: rgba(10, 25, 47, 0.02) !important;
}

.payment-option-card .mdi-radiobox-marked,
.payment-option-card.active .mdi-radiobox-marked {
  color: #0A192F !important;
}

.payment-agreement input:checked ~ .checkmark {
  background-color: #0A192F !important;
  border-color: #0A192F !important;
}

.payment-agreement input:checked ~ .checkmark i {
  color: #c5a059 !important;
}