/* ========================================================================
   REVA RAE — GLOBAL LIGHT LUXURY SKIN
   Warm ivory canvas based on the supplied Reva Rae reference artwork.
   This stylesheet is intentionally loaded last so the entire storefront,
   including WooCommerce pages, uses the same light background.
   ======================================================================== */

:root {
  --reva-canvas: #fdf6ef;
  --reva-surface: #fbf2e8;
  --reva-surface-2: #f6eadd;
  --reva-text: #34231a;
  --reva-muted: #806d5d;
  --reva-brown: #6f3d25;
  --reva-brown-light: #8b5a3c;
  --reva-line: rgba(111, 61, 37, 0.16);
}

/* Global canvas: remove every legacy dark page background. */
html,
body,
body.custom-background,
#page,
.site,
.site-content,
.site-main,
main,
main.site-main,
.lk-site,
.lk-section,
.lk-section--dark-alt,
.woocommerce,
.woocommerce-page,
.woocommerce-page main,
.woocommerce-page main.site-main,
.woocommerce-cart,
.woocommerce-checkout,
.woocommerce-account,
.woocommerce-shop,
.woocommerce.archive,
.woocommerce.single-product {
  background-color: var(--reva-canvas) !important;
  color: var(--reva-text) !important;
}

/* Make full-width sections visually continuous with the reference canvas. */
.lk-section--dark-alt,
.lk-footer,
.lk-review-card,
.lk-newsletter,
.lk-section--newsletter,
.lk-archive-banner,
.related.products,
.upsells.products,
.cross-sells,
.cart_totals,
.woocommerce-Address,
.woocommerce-form-login,
.woocommerce-form-register,
.lk-order-tracking-note,
.lk-modal-content,
.lk-search-panel,
.lk-mobile-menu,
.payment_box,
.woocommerce-MyAccount-navigation li.is-active a {
  background-color: var(--reva-canvas) !important;
  color: var(--reva-text) !important;
}

.lk-newsletter,
.lk-section--newsletter {
  background: var(--reva-surface) !important;
}

.lk-header {
  background: rgba(253, 246, 239, 0.96) !important;
  border-bottom-color: var(--reva-line) !important;
}

.lk-search-panel,
.lk-mobile-menu {
  background: var(--reva-canvas) !important;
}

/* Typography and links stay dark brown for contrast on ivory. */
h1, h2, h3, h4, h5, h6,
.lk-text-logo,
.lk-nav-menu a,
.lk-icon-btn,
.lk-mobile-toggle,
.lk-mobile-close,
.lk-search-close,
.lk-product-info h2 a,
.lk-product-info h3 a,
.woocommerce-page,
.woocommerce-page table,
.woocommerce-page label,
.woocommerce-page .quantity .qty,
.woocommerce-page input,
.woocommerce-page textarea,
.woocommerce-page select {
  color: var(--reva-text) !important;
}

p,
.lk-muted,
.lk-breadcrumbs,
.lk-breadcrumbs a,
.product_meta,
.woocommerce-page .woocommerce-result-count,
.woocommerce-page .woocommerce-breadcrumb {
  color: var(--reva-muted) !important;
}

/* Cards, product placeholders and form controls use subtle ivory surfaces. */
.lk-product-image-wrap,
.lk-why-card,
.lk-blog-card,
.lk-product-card,
.lk-review-card,
.woocommerce-product-gallery__wrapper,
.cart_totals,
.woocommerce-Address,
.woocommerce-form-login,
.woocommerce-form-register,
table.shop_table,
.wc_payment_methods {
  background-color: var(--reva-surface) !important;
}

.lk-product-image-wrap {
  border: 1px solid var(--reva-line);
}

/* Replace legacy near-black quick-shop/wishlist treatments with brown. */
.lk-product-quickshop {
  background: rgba(111, 61, 37, 0.92) !important;
  color: #fffaf4 !important;
}

.lk-wishlist-btn {
  background: rgba(253, 246, 239, 0.92) !important;
  color: var(--reva-brown) !important;
  border: 1px solid var(--reva-line) !important;
}

.lk-wishlist-btn:hover,
.lk-wishlist-btn.is-active {
  background: var(--reva-brown) !important;
  color: #fffaf4 !important;
}

/* All major borders use the same soft brown line as the reference design. */
.lk-header,
.lk-breadcrumbs,
.lk-footer,
.lk-footer-payments,
.lk-footer-bottom,
.woocommerce-tabs,
ul.tabs,
.product_meta,
table.shop_table,
table.shop_table td,
table.shop_table th,
.woocommerce-Address,
.cart_totals,
.woocommerce-form-login,
.woocommerce-form-register,
.wc_payment_methods,
.woocommerce-MyAccount-navigation ul,
.woocommerce-MyAccount-navigation li,
.lk-blog-card,
.lk-why-card {
  border-color: var(--reva-line) !important;
}

/* Footer is part of the same canvas instead of a dark block. */
.lk-footer {
  background: var(--reva-canvas) !important;
  color: var(--reva-text) !important;
}

/* WooCommerce notices/selects/forms should never fall back to black. */
.woocommerce-message,
.woocommerce-info,
.woocommerce-error,
.woocommerce-noreviews,
.woocommerce-ordering select,
form.woocommerce-checkout,
.woocommerce-checkout #customer_details,
.woocommerce-checkout #order_review,
.woocommerce-checkout .form-row input,
.woocommerce-checkout .form-row select,
.woocommerce-checkout .form-row textarea,
.woocommerce-form-row input,
.lk-form-row input,
.lk-form-row textarea,
#review_form input,
#review_form textarea,
.lk-newsletter-form input[type="email"] {
  background-color: var(--reva-canvas) !important;
  color: var(--reva-text) !important;
  border-color: var(--reva-line) !important;
}

/* Select/dropdown native controls on light backgrounds. */
select,
option {
  background-color: var(--reva-canvas) !important;
  color: var(--reva-text) !important;
}

/* Preserve the supplied hero photography while keeping its surrounding canvas light. */
.lk-hero {
  background: var(--reva-surface) !important;
}

/* Hero placeholder remains warm and light if no uploaded slide exists. */
.lk-hero-slide--placeholder {
  background: radial-gradient(circle at 30% 30%, #fdf6ef, #eadccc 70%) !important;
}

/* Announcement bar: maintain the deep brown accent with high-contrast ivory text. */
.lk-announcement-bar {
  background: var(--reva-brown) !important;
  color: #fffaf4 !important;
}

.lk-announcement-bar p,
.lk-announcement-bar a,
.lk-announcement-bar span {
  color: #fffaf4 !important;
  opacity: 1 !important;
}

/* Brown accent treatment. */
.lk-btn-gold,
.lk-announcement-bar,
button.single_add_to_cart_button:hover,
.lk-buy-now-btn,
#place_order,
.woocommerce-form-login .button,
.woocommerce-form-register .button,
.wc-proceed-to-checkout .checkout-button,
td.actions .button,
.lk-product-info .button:hover,
.lk-swatch-btn.is-selected {
  background: var(--reva-brown) !important;
  border-color: var(--reva-brown) !important;
  color: #fffaf4 !important;
}

.lk-btn-outline,
.lk-product-info .button,
button.single_add_to_cart_button,
.lk-swatch-btn,
.lk-wishlist-btn {
  border-color: var(--reva-brown) !important;
  color: var(--reva-brown) !important;
}

.lk-btn-outline:hover,
.lk-product-info .button:hover,
.lk-swatch-btn:hover {
  background: var(--reva-brown) !important;
  color: #fffaf4 !important;
}

.lk-nav-menu a:hover,
.lk-nav-menu li.current-menu-item > a,
.lk-icon-btn:hover,
.lk-mobile-social a,
.lk-view-all,
.lk-section-eyebrow,
.lk-product-price,
.product_meta a,
ul.tabs li.active a,
.lk-fabric-tab h3,
.cart_totals .order-total .amount,
.lk-footer-col h4 {
  color: var(--reva-brown) !important;
}

/* Accessibility: focus outlines remain visible against ivory. */
:focus-visible {
  outline: 2px solid var(--reva-brown) !important;
  outline-offset: 3px;
}

/* ---------- Reva Rae header logo crop fix ---------- */
.lk-branding,
.lk-branding .custom-logo-link,
.lk-branding .lk-image-logo {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  line-height: 0 !important;
  height: auto !important;
  min-height: 0 !important;
  overflow: visible !important;
}

.lk-branding .custom-logo-link,
.lk-branding .lk-image-logo {
  width: 180px !important;
  max-width: 180px !important;
}

.lk-header .lk-branding img,
.lk-header .lk-branding .custom-logo,
.lk-header .lk-branding .lk-image-logo img {
  display: block !important;
  width: auto !important;
  max-width: 180px !important;
  height: auto !important;
  max-height: 78px !important;
  object-fit: contain !important;
  object-position: center !important;
  overflow: visible !important;
}

.lk-header-inner {
  min-height: 96px !important;
}

@media (max-width: 768px) {
  .lk-branding .custom-logo-link,
  .lk-branding .lk-image-logo {
    width: 140px !important;
    max-width: 140px !important;
  }

  .lk-header .lk-branding img,
  .lk-header .lk-branding .custom-logo,
  .lk-header .lk-branding .lk-image-logo img {
    max-width: 140px !important;
    max-height: 64px !important;
  }

  .lk-header-inner {
    min-height: 78px !important;
  }
}


/* Clothing size selectors — used on cards and after quantity on simple products. */
.lk-loop-size-selector,
.lk-simple-size-selector {
  margin: 0.75rem 0 0.9rem;
}
.lk-size-label {
  display: block;
  margin-bottom: 0.45rem;
  color: var(--reva-text) !important;
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 1.2px;
  text-transform: uppercase;
}
.lk-loop-size-options {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
}
.lk-size-option {
  min-width: 38px;
  min-height: 34px;
  padding: 0.35rem 0.65rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--reva-line) !important;
  border-radius: 2px;
  background: var(--reva-canvas) !important;
  color: var(--reva-brown) !important;
  font-size: 0.72rem;
  line-height: 1;
  text-decoration: none !important;
  cursor: pointer;
  transition: all .2s ease;
}
.lk-size-option:hover,
.lk-size-option.is-selected {
  background: var(--reva-brown) !important;
  border-color: var(--reva-brown) !important;
  color: #fffaf4 !important;
}
.lk-product-info .lk-loop-size-selector + .button,
.lk-product-info .lk-loop-size-selector ~ .button {
  margin-top: 0.15rem;
}

/* Elementor editor/live content must inherit the same Reva Rae canvas. */
.elementor,
.elementor-page,
.elementor-editor-active,
.elementor-section,
.elementor-container,
.elementor-widget-wrap,
.elementor-widget-container {
  --reva-canvas: #fdf6ef;
}
body.elementor-page,
body.elementor-editor-active,
body.elementor-page #page,
body.elementor-page .site-main {
  background-color: var(--reva-canvas) !important;
}