/* Đồng bộ màu Ritual Pro — load CUỐI cùng */

/* ── Nền & chữ ── */
body,
body.tca-page,
body.store-page,
body.dash-page,
body.dashboard-page,
body.checkout-page,
body.mo-page,
body.cm-page,
body.auth-page,
body.track-page,
body.hx-page,
body.deposit-page,
body.withdraw-page,
body.landing-page,
body.cart-page,
body.legal-page,
body.ts-page,
body.seller-page,
html.sk-loading {
  background-color: var(--rl-bg, #faf9f7) !important;
  color: var(--rl-text, #12100e) !important;
}

body::before,
body.store-page::before,
body.tca-page::before,
body.auth-page::before,
body.dash-page::before {
  background:
    radial-gradient(ellipse 90% 70% at 8% -8%, rgba(212, 184, 106, 0.1), transparent 52%),
    radial-gradient(ellipse 70% 55% at 96% 4%, rgba(245, 240, 230, 0.85), transparent 48%),
    linear-gradient(180deg, #ffffff, #faf9f7, #f0eeea) !important;
}

body::after {
  display: none !important;
}

/* ── Nav ── */
.store-nav,
.store-nav.is-scrolled,
.cm-nav,
.dp-nav,
.co-header,
.checkout-header,
.wd-nav,
.track-header,
.hx-header,
.dash-header,
.header,
.auth-header,
.le-nav,
.le-nav.is-scrolled,
.cart-header,
.pd-header,
.mo-header,
.nap-nav,
.deposit-nav {
  background: rgba(255, 255, 255, 0.92) !important;
  backdrop-filter: blur(16px) saturate(1.1) !important;
  -webkit-backdrop-filter: blur(16px) saturate(1.1) !important;
  border-color: rgba(26, 24, 20, 0.08) !important;
  box-shadow: 0 1px 0 rgba(26, 24, 20, 0.04), 0 4px 16px rgba(26, 24, 20, 0.04) !important;
}

.store-nav .nav-container,
.store-dock__island,
.store-bottom-nav .dock-island,
.dp-nav .nav-container,
.le-nav__inner {
  background: rgba(255, 255, 255, 0.96) !important;
  border: 1px solid rgba(26, 24, 20, 0.06) !important;
  box-shadow: 0 1px 2px rgba(26, 24, 20, 0.04), 0 8px 24px rgba(26, 24, 20, 0.05) !important;
}

/* ── Cards ── */
.product-card,
.shop-card,
.store-hero__shell,
.store-hero__core,
.bezel-shell,
.bezel-core,
.auth-card,
.auth-panel,
.auth-box,
.hx-item,
.hx-card,
.co-card,
.checkout-card,
.co-panel,
.track-shell,
.track-card,
.track-panel,
.track-hero,
.wd-shell,
.wd-panel,
.wd-card,
.dash-card,
.dashboard-card,
.stat-card,
.action-tile,
.mo-card,
.order-card,
.cm-compose,
.cm-post,
.cm-card,
.cm-thread,
.cart-item,
.cart-summary,
.pd-panel,
.pd-card,
.le-section,
.le-card,
.le-feature,
.le-cta,
.deposit-card,
.nap-card,
.certificate-card,
.settings-card,
.profile-card,
.charm-card,
.bb-card,
.scratch-card {
  background: #ffffff !important;
  border-color: rgba(26, 24, 20, 0.08) !important;
  color: #1a1814 !important;
  box-shadow: 0 1px 2px rgba(26, 24, 20, 0.04), 0 8px 24px rgba(26, 24, 20, 0.05) !important;
}

.cm-compose,
.track-hero,
.bezel-core,
.store-hero__core {
  background: #ffffff !important;
}

/* ── Typography colors ── */
h1, h2, h3, h4, h5, h6,
.store-hero h1,
.le-hero h1,
.dash-title,
.auth-title,
.cm-nav__title,
.track-hero h1 {
  color: #1a1814 !important;
}

.text-muted,
.store-nav__link,
.cm-compose__hint,
.lead,
.subtitle,
[class*="__muted"],
[class*="-muted"] {
  color: #524c44 !important;
}

.lead,
.subtitle {
  color: #3a3530 !important;
}

a:not(.btn):not(.rl-btn):not(.rb-btn):not(.store-nav__link) {
  color: #5c470f !important;
}

.store-nav__link:hover,
.store-nav__link.is-active {
  color: #5c470f !important;
}

/* ── Forms ── */
input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]),
select,
textarea {
  background: #ffffff !important;
  border-color: rgba(26, 24, 20, 0.12) !important;
  color: #1a1814 !important;
  border-radius: 8px !important;
}

input:focus,
select:focus,
textarea:focus {
  border-color: rgba(166, 124, 26, 0.45) !important;
  box-shadow: 0 0 0 3px rgba(166, 124, 26, 0.1) !important;
  outline: none !important;
}

input::placeholder,
textarea::placeholder {
  color: #b5aea3 !important;
}

/* ── Buttons ── */
.btn-primary,
.co-submit,
.mo-btn-primary,
.auth-submit,
.dash-btn-primary,
.le-btn-primary,
.cm-btn-primary,
[class*="btn-primary"] {
  background: linear-gradient(180deg, #b8862e 0%, #a67c1a 100%) !important;
  color: #fff !important;
  border-color: rgba(125, 94, 20, 0.3) !important;
  box-shadow: 0 1px 2px rgba(26, 24, 20, 0.08), 0 4px 14px rgba(166, 124, 26, 0.18) !important;
  border-radius: 8px !important;
}

.btn-secondary,
.btn-ghost,
.btn-outline {
  background: #ffffff !important;
  color: #5c564d !important;
  border-color: rgba(26, 24, 20, 0.12) !important;
}

.btn-secondary:hover,
.btn-ghost:hover {
  color: #5c470f !important;
  border-color: rgba(166, 124, 26, 0.25) !important;
  background: rgba(166, 124, 26, 0.06) !important;
}

/* ── Dock ── */
.store-bottom-nav,
.store-dock,
.cm-bottom-nav,
.dash-bottom-nav {
  background: rgba(255, 255, 255, 0.96) !important;
  border-color: rgba(26, 24, 20, 0.08) !important;
}

.store-dock__item.is-active,
.dock-item.active,
.cm-bottom-nav a.active {
  color: #5c470f !important;
}

/* ── Tables ── */
table th {
  background: #f5f3ef !important;
  color: #8a8378 !important;
}

table td {
  border-color: rgba(26, 24, 20, 0.06) !important;
  color: #1a1814 !important;
}

/* ── Modals ── */
.modal-content,
.modal-panel,
.dialog,
.popup,
.toast {
  background: #ffffff !important;
  color: #1a1814 !important;
  border-color: rgba(26, 24, 20, 0.08) !important;
}

/* ── Badges ── */
.badge-success,
.hx-badge.is-success {
  background: rgba(22, 101, 52, 0.08) !important;
  color: #166534 !important;
  border-color: rgba(22, 101, 52, 0.2) !important;
}

.badge-danger,
.hx-badge.is-danger {
  background: rgba(185, 28, 28, 0.08) !important;
  color: #b91c1c !important;
}

/* ── Landing ── */
.le-nav,
.le-footer {
  background: rgba(255, 255, 255, 0.94) !important;
}

.le-hero,
.le-hero__inner {
  background: transparent !important;
}

/* ── Dashboard ── */
.dash-balance,
.wallet-card,
.balance-card {
  background: #ffffff !important;
  border-color: rgba(166, 124, 26, 0.18) !important;
}

body.dash-page .hero-card,
body.dash-page .hero-balance-block {
  background: #ffffff !important;
  color: #1a1814 !important;
  border-color: rgba(26, 24, 20, 0.08) !important;
}

body.dash-page .quick-action,
body.dash-page .action-tile,
body.dash-page .stat-card,
body.dash-page .dash-tile {
  background: #ffffff !important;
  border-color: rgba(26, 24, 20, 0.08) !important;
  color: #1a1814 !important;
}

body.dash-page .action-label,
body.dash-page .action-label--emph,
body.dash-page .stat-label {
  color: #8a8378 !important;
}

body.dash-page .stat-value,
body.dash-page .action-title {
  color: #1a1814 !important;
}

/* ── Track / checkout panels ── */
body.tca-page .rc,
body.tca-page .track-shell,
body.tca-page .track-panel,
body.tca-page .track-card,
body.tca-page .co-panel,
body.tca-page .wd-panel,
body.tca-page .hx-item,
body.tca-page .mo-card {
  background: #ffffff !important;
  border-color: rgba(26, 24, 20, 0.08) !important;
  box-shadow: 0 1px 2px rgba(26, 24, 20, 0.04), 0 8px 24px rgba(26, 24, 20, 0.05) !important;
}

body.checkout-page .checkout-order-card,
body.checkout-page .checkout-order-card .shop-nm {
  color: #1a1814 !important;
}

/* ── Seller ── */
.seller-sidebar,
.seller-main {
  background: transparent !important;
}

.seller-card {
  background: #ffffff !important;
}

/* ── Skeleton ── */
.page-skeleton {
  background: #faf9f7 !important;
}

.page-skeleton::before {
  background:
    radial-gradient(ellipse 90% 70% at 8% -8%, rgba(212, 184, 106, 0.1), transparent 52%),
    linear-gradient(180deg, #ffffff, #faf9f7) !important;
}

.sk-logo-wrap {
  background: #ffffff !important;
  border-color: rgba(26, 24, 20, 0.08) !important;
}

.sk-loading-text {
  color: #5c564d !important;
}

/* ── Scrollbar ── */
body.tca-page ::-webkit-scrollbar-thumb {
  background: rgba(26, 24, 20, 0.18) !important;
  border-radius: 999px !important;
}

body.tca-page ::-webkit-scrollbar-track {
  background: #f5f3ef !important;
}