/* DEVA BD — page-scoped color layer for Checkout/Product/Confirmation.
   STEP 05 maps the core page accent tokens to central theme variables while
   retaining page-specific line/shadow shades as production-safe fallbacks. */

:root {
  --deva-primary: var(--brand-primary, #A8843A);
  --deva-primary-hover: var(--brand-primary-hover, #76581A);
  --deva-primary-soft: var(--brand-primary-soft, #F8F3E7);
  --deva-primary-line: var(--brand-primary-soft, #F8F3E7);
  --deva-brand-shadow: var(--brand-primary-soft, #F8F3E7);
  --deva-black: var(--brand-secondary, #111111);
  --deva-white: #ffffff;
}

/* Shared header accents on these two pages only. */
body.checkout-page .navbar,
body.product-page .navbar {
  border-bottom-color: var(--deva-primary-line) !important;
  box-shadow: 0 3px 14px rgba(17, 17, 17, .08) !important;
}

body.checkout-page [data-ks-language][aria-pressed="true"],
body.product-page [data-ks-language][aria-pressed="true"] {
  background: var(--deva-primary) !important;
  border-color: var(--deva-primary) !important;
  color: var(--deva-white) !important;
}

body.checkout-page .drawer-head,
body.product-page .drawer-head {
  border-bottom-color: var(--deva-primary) !important;
}

/* Checkout: gold actions and progress, black primary text, soft-gold selection. */
body.checkout-page {
  --gold: var(--deva-primary) !important;
  --gold2: var(--deva-primary-hover) !important;
  --checkout-accent: var(--deva-primary) !important;
  --checkout-accent-hover: var(--deva-primary-hover) !important;
  --checkout-error: var(--red, #C62828) !important;
  --checkout-line: #e7e7e7 !important;
  background: #fafafa !important;
}

body.checkout-page .page-header {
  border-bottom: 1px solid var(--deva-primary-line) !important;
}

body.checkout-page .checkout-step.active,
body.checkout-page .area-box.selected .area-title,
body.checkout-page .os-row.total span:last-child {
  color: var(--deva-primary-hover) !important;
}

body.checkout-page .checkout-step.active .checkout-step-circle {
  background: var(--deva-primary) !important;
  border-color: var(--deva-primary) !important;
  color: var(--deva-white) !important;
  box-shadow: 0 5px 12px var(--deva-brand-shadow) !important;
}

body.checkout-page .checkout-step-line.done {
  border-color: var(--deva-primary) !important;
}

body.checkout-page .section-icon {
  color: var(--deva-primary) !important;
}

body.checkout-page .form-group input:focus,
body.checkout-page .form-group textarea:focus,
body.checkout-page .form-group select:focus,
body.checkout-page .checkout-coupon-row input:focus {
  border-color: var(--deva-primary) !important;
  box-shadow: 0 0 0 3px var(--deva-brand-shadow) !important;
}

body.checkout-page .area-box:hover,
body.checkout-page .area-box.selected {
  border-color: var(--deva-primary) !important;
}

body.checkout-page .area-box.selected {
  background: var(--deva-primary-soft) !important;
  box-shadow: 0 0 0 1px var(--deva-primary) inset !important;
}

body.checkout-page .coupon-row button,
body.checkout-page .checkout-coupon-row button,
body.checkout-page .place-order-btn {
  background: var(--deva-primary) !important;
  color: var(--deva-white) !important;
  box-shadow: 0 6px 16px var(--deva-brand-shadow) !important;
}

body.checkout-page .coupon-row button:hover,
body.checkout-page .checkout-coupon-row button:hover,
body.checkout-page .place-order-btn:hover {
  background: var(--deva-primary-hover) !important;
  color: var(--deva-white) !important;
}

body.checkout-page .os-remove:hover {
  background: var(--deva-primary-soft) !important;
  color: var(--deva-primary) !important;
}

/* Product: keep gallery/layout intact and recolor interactive accents only. */
body.product-page {
  --gold: var(--deva-primary) !important;
  --gold2: var(--deva-primary-hover) !important;
  background: #fafafa !important;
}

body.product-page .product-gallery .img-badge.bd,
body.product-page .product-gallery .img-badge.bo {
  background: var(--deva-primary) !important;
  color: var(--deva-white) !important;
  box-shadow: 0 5px 13px var(--deva-brand-shadow) !important;
}

body.product-page .product-gallery .thumb.active {
  border-color: var(--deva-primary) !important;
  box-shadow: 0 0 0 1px var(--deva-primary), 0 5px 13px var(--deva-brand-shadow) !important;
}

body.product-page .product-gallery .gallery-dot.active {
  background: var(--deva-primary) !important;
}

body.product-page .product-cat,
body.product-page .product-voucher-code,
body.product-page .product-voucher-code-main,
body.product-page .dtab.active,
body.product-page .bnav-item.active,
body.product-page .bnav-item:hover,
body.product-page .ks-bnav-item.active,
body.product-page .ks-bnav-item:hover {
  color: var(--deva-primary) !important;
}

body.product-page .dtab.active {
  border-bottom-color: var(--deva-primary) !important;
}

body.product-page .btn-buy,
body.product-page .sticky-btn-g,
body.product-page .wr-submit-btn,
body.product-page .review-login-btn,
body.product-page .checkout-btn,
body.product-page .checkout-cta,
body.product-page .cart-foot .checkout-btn {
  background: var(--deva-primary) !important;
  color: var(--deva-white) !important;
  box-shadow: 0 6px 15px var(--deva-brand-shadow) !important;
}

body.product-page .btn-buy:hover,
body.product-page .sticky-btn-g:hover,
body.product-page .wr-submit-btn:hover,
body.product-page .review-login-btn:hover,
body.product-page .checkout-btn:hover,
body.product-page .checkout-cta:hover {
  background: var(--deva-primary-hover) !important;
  color: var(--deva-white) !important;
}

body.product-page .rbar-fill,
body.product-page .rc-avatar {
  background: var(--deva-primary) !important;
}

body.product-page .rc-avatar {
  color: var(--deva-white) !important;
}

body.product-page .product-voucher {
  border-color: var(--deva-brand-shadow) !important;
  background: linear-gradient(135deg, #ffffff 0%, var(--deva-primary-soft) 100%) !important;
}

body.product-page .product-voucher::before {
  background: linear-gradient(180deg, var(--deva-black), var(--deva-primary)) !important;
}

body.product-page .ks-bottom-nav,
body.product-page .bottom-nav {
  border-top-color: var(--deva-primary-line) !important;
}

/* Order confirmation: black success mark with red brand accents. */
body.order-confirmation-page {
  --gold: var(--deva-primary) !important;
  --gold2: var(--deva-primary-hover) !important;
  background: #fafafa !important;
}

body.order-confirmation-page .navbar {
  border-bottom-color: var(--deva-primary-line) !important;
  box-shadow: 0 3px 14px rgba(17, 17, 17, .08) !important;
}

body.order-confirmation-page [data-ks-language][aria-pressed="true"] {
  background: var(--deva-primary) !important;
  border-color: var(--deva-primary) !important;
  color: var(--deva-white) !important;
}

body.order-confirmation-page .drawer-head {
  border-bottom-color: var(--deva-primary) !important;
}

body.order-confirmation-page .oc-hero .tick {
  background: var(--deva-black) !important;
  color: var(--deva-white) !important;
  box-shadow: 0 0 0 4px #fff, 0 0 0 6px var(--deva-primary), 0 10px 24px rgba(17, 17, 17, .20) !important;
}

body.order-confirmation-page .receipt {
  border-color: var(--deva-primary-line) !important;
  border-top: 3px solid var(--deva-primary) !important;
  box-shadow: 0 8px 24px rgba(17, 17, 17, .08) !important;
}

/* Compact order identity block: the global header already carries the logo. */
body.order-confirmation-page .receipt-head {
  display: block !important;
  padding: 1.15rem 1.3rem 1.05rem !important;
  background:
    radial-gradient(circle at 50% -35%, var(--deva-brand-shadow), transparent 58%),
    linear-gradient(180deg, var(--deva-white), #fffafa) !important;
  border-bottom: 1px solid var(--deva-primary-line) !important;
}

body.order-confirmation-page .receipt-meta {
  width: 100% !important;
  align-items: stretch !important;
  text-align: center !important;
  color: var(--deva-black) !important;
}

body.order-confirmation-page .receipt-order-main {
  position: relative;
  padding-bottom: .9rem;
  margin-bottom: .8rem;
}

body.order-confirmation-page .receipt-order-main::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: 0;
  width: 42px;
  height: 3px;
  border-radius: 999px;
  background: var(--deva-primary);
  transform: translateX(-50%);
}

body.order-confirmation-page .receipt-meta .order-no {
  margin-top: .12rem;
  font-size: 1.45rem !important;
  line-height: 1.15 !important;
  letter-spacing: .045em !important;
}

body.order-confirmation-page .receipt-meta-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.45fr) minmax(0, 1fr);
  gap: .65rem;
}

body.order-confirmation-page .receipt-meta-item {
  min-height: 58px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: .55rem .6rem;
  background: var(--deva-white);
  border: 1px solid var(--deva-primary-line);
  border-radius: 10px;
}

body.order-confirmation-page .receipt-meta-label {
  margin-bottom: .18rem;
  color: #696969 !important;
  font-size: .62rem !important;
  font-weight: 700;
  letter-spacing: .075em !important;
}

body.order-confirmation-page .receipt-meta-value {
  font-size: .78rem;
  font-weight: 600;
  line-height: 1.35;
}

body.order-confirmation-page .receipt-meta-item .status-pill {
  margin-top: 0;
}

body.order-confirmation-page .receipt-meta .order-no,
body.order-confirmation-page .tot-row.grand span:last-child,
body.order-confirmation-page .a2hs-box:hover .a2hs-caption,
body.order-confirmation-page .bnav-item.active,
body.order-confirmation-page .bnav-item:hover,
body.order-confirmation-page .ks-bnav-item.active,
body.order-confirmation-page .ks-bnav-item:hover {
  color: var(--deva-primary) !important;
}

body.order-confirmation-page .status-pending {
  background: #fdecea !important;
  color: var(--red, #C62828) !important;
  border: 1px solid #f3c7c7 !important;
}

body.order-confirmation-page .a2hs-modal .close-btn,
body.order-confirmation-page .oc-btn.primary {
  background: var(--deva-primary) !important;
  color: var(--deva-white) !important;
  box-shadow: 0 6px 16px var(--deva-brand-shadow) !important;
}

body.order-confirmation-page .a2hs-modal .close-btn:hover,
body.order-confirmation-page .oc-btn.primary:hover {
  background: var(--deva-primary-hover) !important;
  color: var(--deva-white) !important;
}

body.order-confirmation-page .receipt-foot {
  background: var(--deva-primary-soft) !important;
  border-top-color: var(--deva-primary-line) !important;
}

body.order-confirmation-page .ks-bottom-nav,
body.order-confirmation-page .bottom-nav {
  border-top-color: var(--deva-primary-line) !important;
}

/* Order page: DEVA BD gold, black and white theme. */
body.order-page {
  --gold: var(--deva-primary) !important;
  --gold2: var(--deva-primary-hover) !important;
  --cream: #fafafa !important;
  --border: var(--deva-primary-line) !important;
  background: #fafafa !important;
}

body.order-page .navbar {
  border-bottom-color: var(--deva-primary-line) !important;
  box-shadow: 0 3px 14px rgba(17, 17, 17, .08) !important;
}

body.order-page [data-ks-language][aria-pressed="true"] {
  background: var(--deva-primary) !important;
  border-color: var(--deva-primary) !important;
  color: var(--deva-white) !important;
}

body.order-page .drawer-head {
  border-bottom-color: var(--deva-primary) !important;
}

body.order-page #ks-order-tabs {
  background: var(--deva-white) !important;
  border-bottom-color: var(--deva-primary-line) !important;
}

body.order-page #ks-order-tabs > .tab {
  border-color: var(--deva-primary-line) !important;
  background: var(--deva-white) !important;
  color: #555 !important;
}

body.order-page #ks-order-tabs > .tab.active,
body.order-page #ks-order-tabs > .tab:hover {
  background: var(--deva-primary) !important;
  border-color: var(--deva-primary) !important;
  color: var(--deva-white) !important;
  box-shadow: 0 5px 14px var(--deva-brand-shadow) !important;
}

body.order-page .order-card,
body.order-page .history-card,
body.order-page .track-box,
body.order-page .suggestion-card {
  border-color: var(--deva-primary-line) !important;
  box-shadow: 0 5px 16px rgba(17, 17, 17, .07) !important;
}

body.order-page .order-card-head {
  background: var(--deva-black) !important;
  border-bottom-color: var(--deva-black) !important;
}

body.order-page .order-card-head .order-id,
body.order-page .order-card-head .order-date {
  color: var(--deva-white) !important;
}

body.order-page .status-pending {
  background: #2b2b2b !important;
  color: var(--deva-white) !important;
  border: 1px solid #555 !important;
}

body.order-page .order-total,
body.order-page .history-total,
body.order-page .suggestion-price,
body.order-page .s-row.grand span:last-child {
  color: var(--deva-primary-hover) !important;
}

body.order-page .order-item-thumb,
body.order-page .history-thumb,
body.order-page .sp-ico {
  background: var(--deva-primary-soft) !important;
  border-color: var(--deva-primary-line) !important;
}

body.order-page .empty-btn,
body.order-page .track-btn,
body.order-page .suggestion-badge,
body.order-page .track-step.done .ts-dot,
body.order-page .s-step.done .s-dot {
  background: var(--deva-primary) !important;
  border-color: var(--deva-primary) !important;
  color: var(--deva-white) !important;
}

body.order-page .track-input:focus,
body.order-page .complaint-dialog textarea:focus,
body.order-page .track-step.active .ts-dot,
body.order-page .s-step.active .s-dot {
  border-color: var(--deva-primary) !important;
}

body.order-page .track-step.active .ts-dot,
body.order-page .s-step.active .s-dot {
  box-shadow: 0 0 0 4px var(--deva-brand-shadow) !important;
}

body.order-page .track-step.done::after,
body.order-page .s-step.done::after {
  background: var(--deva-primary) !important;
}

body.order-page .track-status-message,
body.order-page .order-warranty-card,
body.order-page .complaint-upload-label {
  background: var(--deva-primary-soft) !important;
  border-color: var(--deva-primary-line) !important;
}

body.order-page .sheet-head {
  border-bottom-color: var(--deva-primary-line) !important;
}

body.order-page nav.ks-reference-bottom {
  border-top-color: var(--deva-primary) !important;
}

/* Match Shop: inactive icons stay dark and labels remain readable. */
body.order-page nav.ks-reference-bottom .ks-bnav-item:not(.active) {
  color: #5f6368 !important;
  opacity: 1 !important;
}

body.order-page nav.ks-reference-bottom .ks-bnav-item:not(.active) .ks-bnav-ico {
  color: #353638 !important;
  opacity: 1 !important;
}

body.order-page nav.ks-reference-bottom .ks-bnav-item:not(.active) .ks-bnav-label {
  color: #5f6368 !important;
  opacity: 1 !important;
}

body.order-page nav.ks-reference-bottom .ks-bnav-item.active,
body.order-page nav.ks-reference-bottom .ks-bnav-item:hover,
body.order-page nav.ks-reference-bottom .ks-bnav-item.active .ks-bnav-ico {
  color: var(--deva-primary) !important;
}

body.order-page nav.ks-reference-bottom .ks-bnav-badge {
  background: var(--deva-primary) !important;
}

body.order-page nav.ks-reference-bottom .ks-bnav-item:focus-visible {
  outline-color: var(--deva-primary) !important;
}

@media (max-width: 380px) {
  body.order-confirmation-page .receipt-head {
    padding-inline: 1rem !important;
  }

  body.order-confirmation-page .receipt-meta-grid {
    grid-template-columns: 1fr;
  }

  body.order-confirmation-page .receipt-meta-item {
    min-height: 52px;
  }
}

@media (prefers-reduced-motion: reduce) {
  body.checkout-page *,
  body.product-page *,
  body.order-page *,
  body.order-confirmation-page * {
    transition-duration: .01ms !important;
  }
}
