/* =========================================================
   CLIPSE502 — Overrides for Anon Template
   Adapt colors & typography to Clipse brand
   ========================================================= */

:root {
  --salmon-pink: #7B3FCF;
  --bittersweet: #F7C6D9;
  --sandy-brown: #BFA2F5;
  --ocean-green: #7B3FCF;
  --eerie-black: #1E1E1E;
  --onyx: #1E1E1E;
  --sonic-silver: #6B6B6B;
  --davys-gray: #333333;
  --spanish-gray: #9E9E9E;
  --cultured: #EBE8F0;
  --white: #F8F7F5;
}

html {
  font-family: 'Inter', system-ui, sans-serif;
}

body {
  background: var(--white);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* Use Poppins for display headings */
.hero-glass-card h1,
.banner-title,
.category-item-title,
.title,
.cta-title,
.service-title,
.blog-title,
.footer-category-title,
.nav-title,
.showcase-title,
.testimonial-name,
.menu-title,
.sidebar-title,
.showcase-heading {
  font-family: 'Poppins', sans-serif;
}

/* Header overrides */
.header-main {
  border-bottom: 1px solid var(--cultured);
}

.header-search-container .search-field:focus {
  border-color: var(--salmon-pink);
  outline: none;
}

.search-btn:hover { color: var(--salmon-pink); }

/* Mobile bottom nav */
.mobile-bottom-navigation {
  box-shadow: 0 -2px 15px rgba(123, 63, 207, 0.12);
}

.mobile-bottom-navigation .count {
  background: var(--salmon-pink);
}

/* Desktop nav hover */
.desktop-menu-category-list .menu-category > .menu-title:hover { color: var(--salmon-pink); }
.desktop-menu-category-list .menu-category > .menu-title::after { background: var(--salmon-pink); }
.panel-list-item a:hover { color: var(--salmon-pink); }
.dropdown-list .dropdown-item a:hover { color: var(--salmon-pink); }

/* Banner */
.banner-btn {
  background: var(--salmon-pink);
}
.banner-btn:hover { background: var(--eerie-black); }
.banner-subtitle { color: var(--salmon-pink); }

/* Categories */
.category-btn { color: var(--salmon-pink); }

/* Product minimal */
.product-minimal .showcase-category:hover { color: var(--salmon-pink); }
.product-minimal .price { color: var(--salmon-pink); }

/* Product featured */
.product-featured .price { color: var(--salmon-pink); }
.product-featured .add-cart-btn {
  background: var(--salmon-pink);
}
.product-featured .add-cart-btn:hover {
  background: var(--eerie-black);
}
.product-featured .showcase-status-bar::before { background: var(--salmon-pink); }

/* Product grid */
.product-grid .showcase-category { color: var(--salmon-pink); }
.product-grid .showcase-title {
  font-family: 'Poppins', sans-serif;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 100%;
  line-height: 1.35;
  min-height: 1.35em;
}
.product-grid .showcase-title:hover { color: var(--eerie-black); }
.product-grid .showcase-content {
  display: flex;
  flex-direction: column;
  min-height: 130px;
}
.product-grid .price-box {
  margin-top: auto;
  padding-bottom: 15px;
}
.product-grid .btn-action:hover {
  background: var(--eerie-black);
  border-color: var(--eerie-black);
}

/* Product minimal (New Arrivals / Trending / Top Rated) */
.product-minimal .showcase-title {
  font-family: 'Poppins', sans-serif;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 100%;
}

/* Testimonial */
.testimonial-card { border-color: var(--cultured); }

/* CTA */
.cta-content .discount { background: var(--eerie-black); }

/* Service */
.service-icon { color: var(--salmon-pink); }
.service-item:hover .service-icon { color: var(--eerie-black); }

/* Blog */
.blog-category { color: var(--salmon-pink); }
.blog-title:hover { color: var(--salmon-pink); }

/* Footer */
footer { background: var(--eerie-black); }
.footer-category-title { color: var(--salmon-pink); }
.footer-nav-link:hover { color: var(--salmon-pink); }

/* Modal */
.modal-close-btn { background: var(--salmon-pink); }
.btn-newsletter:hover { background: var(--salmon-pink); }

/* Sidebar */
.sidebar .showcase-title { color: var(--onyx); }
.sidebar .price-box .price { color: var(--davys-gray); }

/* Toast */
.notification-toast { box-shadow: 0 5px 20px rgba(123, 63, 207, 0.15); }

/* Scrollbar tint */
body::-webkit-scrollbar-track { border-left-color: var(--cultured); }
body::-webkit-scrollbar-thumb { background: hsl(270, 20%, 75%); border-color: var(--white); }
body::-webkit-scrollbar-thumb:hover { background: hsl(270, 20%, 65%); }

/* Smooth scroll */
html { scroll-behavior: smooth; }