/* Global UI overrides (site-wide) */

/* ---------------- Brand color (green) ---------------- */
:root {
  --yn-primary: #1f9d55;
  --yn-primary-dark: #15803d;
  --yn-primary-soft: rgba(31, 157, 85, 0.18);
}

.bg-theme1 {
  background-color: #75c10a !important;
}

.text-primary {
  color: #75c10a !important;
}

.btn-primary,
button.btn-primary {
  background-color: #75c10a !important;
  border-color: #75c10a !important;
}

.btn-primary:hover,
.btn-primary:focus,
button.btn-primary:hover,
button.btn-primary:focus {
  background-color: var(--yn-primary-dark) !important;
  border-color: var(--yn-primary-dark) !important;
}

.btn-outline-primary {
  border-color: #75c10a !important;
  color: #75c10a !important;
}

.btn-outline-primary:hover,
.btn-outline-primary:focus {
  background-color: #75c10a !important;
  border-color: #75c10a !important;
  color: #fff !important;
}

/* ---------------- SweetAlert (v1) + SweetAlert2 (v11) ----------------
   Some pages use dark body text, causing modal content to inherit white.
   Force default SweetAlert look: white modal with dark text. */
.swal-modal,
.swal-overlay--show-modal .swal-modal {
  background-color: #ffffff !important;
  color: #111111 !important;
}

.swal-title,
.swal-text,
.swal-content,
.swal-content__input,
.swal-content__textarea {
  color: #111111 !important;
}

.swal-footer .swal-button {
  color: #ffffff;
}

.swal-footer .swal-button--cancel {
  color: #111111;
}

.swal2-popup {
  background: #ffffff !important;
  color: #111111 !important;
}

.swal2-title,
.swal2-html-container,
.swal2-content,
.swal2-input,
.swal2-textarea {
  color: #111111 !important;
}

.swal2-icon {
  color: inherit;
}

/* ---------------- Dark page wrappers (opt-in via class) ---------------- */
.yn-dark-page {
  background: radial-gradient(1200px 600px at 50% 0%, rgba(41, 41, 41, 0.55) 0%, rgba(0, 0, 0, 0.95) 60%, #000 100%) !important;
  color: rgba(255, 255, 255, 0.92) !important;
}

.yn-dark-page section,
.yn-dark-page .main-wrapper,
.yn-dark-page .ynaps_body,
.yn-dark-page .container {
  background: transparent !important;
}

.yn-dark-page h1,
.yn-dark-page h2,
.yn-dark-page h3,
.yn-dark-page h4,
.yn-dark-page h5,
.yn-dark-page h6,
.yn-dark-page p,
.yn-dark-page span,
.yn-dark-page li,
.yn-dark-page label,
.yn-dark-page small {
  color: rgba(255, 255, 255, 0.92) !important;
}

.yn-dark-page .text-muted {
  color: rgba(255, 255, 255, 0.65) !important;
}

/* Cards / tables that were white */
.yn-dark-page .bg-white,
.yn-dark-page .card,
.yn-dark-page .table-responsive {
  background: rgba(18, 18, 18, 0.92) !important;
  border: 1px solid rgba(255, 255, 255, 0.10) !important;
}

.yn-dark-page .shadow-sm,
.yn-dark-page .shadow_3 {
  box-shadow: 0 10px 26px rgba(0, 0, 0, 0.45) !important;
}

.yn-dark-page .breadcrumb {
  background: rgba(255, 255, 255, 0.06) !important;
  border: 1px solid rgba(255, 255, 255, 0.10) !important;
}

.yn-dark-page .breadcrumb a {
  color: rgba(255, 255, 255, 0.88) !important;
}

.yn-dark-page .breadcrumb-item.active {
  color: rgba(255, 255, 255, 0.65) !important;
}

.yn-dark-page .table {
  color: rgba(255, 255, 255, 0.92) !important;
}

.yn-dark-page .table-light,
.yn-dark-page thead.table-light {
  --bs-table-bg: rgba(255, 255, 255, 0.06);
  --bs-table-color: rgba(255, 255, 255, 0.92);
}

.yn-dark-page .btn-outline-secondary {
  border-color: rgba(255, 255, 255, 0.25) !important;
  color: rgba(255, 255, 255, 0.92) !important;
}

.yn-dark-page .btn-outline-secondary:hover {
  background: rgba(255, 255, 255, 0.08) !important;
}

/* Cart-specific: make product link readable */
.yn-cart-page a.text-dark {
  color: rgba(255, 255, 255, 0.92) !important;
}

/* Product page: neutralize any forced "dark" text colors */
.yn-product-page .text-dark,
.yn-product-page .js-product-selling-price,
.yn-product-page #productPrice {
  color: rgba(255, 255, 255, 0.94) !important;
}

.yn-product-page .product-view-pill {
  background: linear-gradient(120deg, #1f9d55 0%, #15803d 100%) !important;
}

/* ---------------- Header Cart Offcanvas (sidebar cart) ---------------- */
#cartOffcanvas.offcanvas,
#cartOffcanvas .offcanvas-header,
#cartOffcanvas .offcanvas-body {
  background: radial-gradient(900px 420px at 50% 0%, rgba(31, 157, 85, 0.16) 0%, rgba(0, 0, 0, 0.92) 62%, #000 100%) !important;
  color: rgba(255, 255, 255, 0.92) !important;
}

#cartOffcanvas .offcanvas-header {
  border-bottom: 1px solid rgba(255, 255, 255, 0.10) !important;
}

#cartOffcanvas .offcanvas-title,
#cartOffcanvas .cart-item-title,
#cartOffcanvas .subtotal-label {
  color: rgba(255, 255, 255, 0.92) !important;
}

#cartOffcanvas .cart-variant,
#cartOffcanvas .count,
#cartOffcanvas .cart-empty {
  color: rgba(255, 255, 255, 0.70) !important;
}

#cartOffcanvas .price,
#cartOffcanvas .subtotal-value {
  color: #75c10a !important;
}

#cartOffcanvas .cart-item {
  border-bottom: 1px solid rgba(255, 255, 255, 0.10) !important;
}

#cartOffcanvas .btn-close {
  filter: invert(1) grayscale(100%) brightness(200%);
  opacity: 0.9;
}

#cartOffcanvas .btn-close:hover {
  opacity: 1;
}

#cartOffcanvas .head-cart-button,
#cartOffcanvas a.btn.btn-primary.cart-action-btn {
  background: #75c10a !important;
  border-color: #75c10a !important;
  color: #fff !important;
}

#cartOffcanvas .head-cart-button:hover,
#cartOffcanvas a.btn.btn-primary.cart-action-btn:hover {
  background: var(--yn-primary-dark) !important;
  border-color: var(--yn-primary-dark) !important;
}

#cartOffcanvas .cart-checkout-btn {
  background: rgba(255, 255, 255, 0.06) !important;
  border: 1px solid rgba(255, 255, 255, 0.16) !important;
  color: rgba(255, 255, 255, 0.92) !important;
}

#cartOffcanvas .cart-checkout-btn:hover {
  background: rgba(255, 255, 255, 0.10) !important;
  border-color: rgba(255, 255, 255, 0.22) !important;
}

/* ---------------- Close icons on dark offcanvas/modals ---------------- */
.yn-dark-page .btn-close,
#offcanvasMenu .btn-close,
#offcanvasFilterMobile .btn-close,
#mobileFilters .btn-close {
  filter: invert(1) grayscale(100%) brightness(200%);
  opacity: 0.9;
}

/* Cart remove action: keep trash icon visible on dark theme */
.yn-cart-page .btn.btn-light.text-danger,
.yn-cart-page .btn.btn-light.text-danger i,
.yn-cart-page .btn.btn-light.text-danger svg {
  color: #ff6b6b !important;
}

.yn-cart-page .btn.btn-light.text-danger {
  background: rgba(255, 107, 107, 0.10) !important;
  border: 1px solid rgba(255, 107, 107, 0.45) !important;
}

#cartOffcanvas .remove_cart_btn,
#cartOffcanvas .remove_cart_btn i,
#cartOffcanvas .remove_cart_btn svg {
  color: #ff8a8a !important;
}