/* Local overrides to switch the site to a dark purple palette */
:root{
  /* lighter/brighter purple palette */
  --brand-500:#6f1fbf; /* brighter purple */
  --brand-700:#3b0a6a; /* mid-dark purple */
  --accent-300:#b37be8; /* pale purple accent */
  --bg-1000:#120018; /* deep purple black */
  --text-on-dark:#ffffff; /* pure white for contrast */
}

/* Apply base backgrounds and text colors */
body{background:linear-gradient(180deg,var(--bg-1000) 0%, #220027 100%) fixed !important;color:var(--text-on-dark) !important}
.site-header, .global-header, .site-header__sites, .site-header__categories{background:var(--brand-700) !important}
.context-header{background:linear-gradient(90deg,var(--brand-700),var(--brand-500)) !important;color:var(--text-on-dark) !important}

/* Purchase panel and previews */
.item-preview,.purchase-panel,.box--no-padding{background:linear-gradient(180deg, rgba(111,31,191,0.12), rgba(59,10,106,0.18)) !important;backdrop-filter:blur(6px) !important;border-radius:12px !important;border:1px solid rgba(179,123,232,0.14) !important}
.purchase-panel a{color:var(--accent-300) !important}
.purchase-panel h3,.purchase-panel .price,.purchase-panel p,.purchase-panel label,.purchase-panel a,.purchase-panel .meta-attributes__attr-name,.purchase-panel .meta-attributes__attr-detail{color:var(--text-on-dark) !important}

/* Buttons */
.login, .register{color:#fff;padding:12px 14px;border-radius:10px;border:none}
.login{background:linear-gradient(180deg,var(--brand-500),var(--brand-700)) !important}
.register{background:linear-gradient(180deg,#d092ff, var(--accent-300)) !important}

/* Page tabs and highlights */
.page-tabs .selected a{background:var(--brand-500) !important;border-bottom-color:var(--brand-500) !important;color:var(--text-on-dark) !important}

/* Override inline gold header (from original) */
.context-header, .page-tabs .selected a, .page-tabs .selected a:hover{background:linear-gradient(90deg,var(--brand-700),var(--brand-500)) !important}

/* Make links have purple accent */
a{color:var(--accent-300) !important}

/* Small helper for image placeholders */
img.logo, img[alt="SARI4D"], img[src$="favicon.png"]{filter:drop-shadow(0 3px 8px rgba(0,0,0,0.6))}

/* Responsive tweaks */
@media (max-width: 600px){
  .n-columns-2{grid-template-columns:1fr !important}
}

/* Rating star fallback: if the icon font/glyphs are missing, show a PNG star image */
.e-icon.-icon-star{
  display:inline-block !important;
  width:14px !important;
  height:14px !important;
  vertical-align:middle !important;
  background-image:url("/images/IcoRating5.png") !important;
  background-size:contain !important;
  background-repeat:no-repeat !important;
  text-indent:-9999px !important; /* hide any glyph text */
}

/* Ensure the rating container aligns text when using image fallback */
.rating-detailed-small__stars, .rating-detailed-small-center__star-rating{line-height:16px}