/* General Styles */
body {
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    background-color: #f8f9fa;
    color: #222; /* slightly darker text */
}

/* Theme */
:root {
  --gold: #FACC15;
  --gold-dark: #d1a90f;
  --dark: #1f1f1f;
}

/* Hero Slider */
.hero-slider {
  height: 600px; /* Default height */
  overflow: hidden;
  position: relative;
}

/* Adjust hero slider height for different screen sizes */
@media (min-width: 1200px) {
  .hero-slider {
    height: 650px; /* Larger height for extra large screens */
  }
  
  .carousel-item.hero-slide {
    height: 650px;
  }
}

@media (min-width: 1400px) {
  .hero-slider {
    height: 700px; /* Even larger height for very large screens */
  }
  
  .carousel-item.hero-slide {
    height: 700px;
  }
}

.carousel-item.hero-slide {
  height: 600px; /* Increased from 500px */
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
  position: relative;
  /* Add a subtle overlay for better text readability */
  background-color: rgba(0, 0, 0, 0.1);
}

/* Add overlay for better text contrast */
.carousel-item.hero-slide .overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.3); /* Dark overlay for better text readability */
  z-index: 1;
}

/* Carousel Controls */
.carousel-control-prev,
.carousel-control-next {
  width: 48px;
  height: 48px;
  top: 50%;
  transform: translateY(-50%);
  background: rgba(0, 0, 0, 0.5);
  border-radius: 50%;
  opacity: 0.8;
  transition: all 0.3s ease;
}

.carousel-control-prev:hover,
.carousel-control-next:hover {
  background: rgba(0, 0, 0, 0.7);
  opacity: 1;
}

.carousel-control-prev-icon,
.carousel-control-next-icon {
  width: 24px;
  height: 24px;
}

/* Carousel Indicators */
.carousel-indicators {
  bottom: 20px;
  margin-bottom: 0;
}

.carousel-indicators [data-bs-target] {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background-color: rgba(255, 255, 255, 0.5);
  border: none;
  margin: 0 5px;
  transition: all 0.3s ease;
}

.carousel-indicators .active {
  background-color: #fff;
  width: 12px;
  height: 12px;
}

/* Adjust hero slider height for smaller screens */
@media (max-width: 991.98px) {
  .hero-slider {
    height: 500px;
  }
  
  .carousel-item.hero-slide {
    height: 500px;
  }
}

@media (max-width: 767.98px) {
  .hero-slider {
    height: 400px;
  }
  
  .carousel-item.hero-slide {
    height: 400px;
  }
  
  .carousel-control-prev,
  .carousel-control-next {
    width: 36px;
    height: 36px;
  }
  
  .carousel-control-prev-icon,
  .carousel-control-next-icon {
    width: 18px;
    height: 18px;
  }
}

@media (max-width: 575.98px) {
  .hero-slider {
    height: 350px;
  }
  
  .carousel-item.hero-slide {
    height: 350px;
  }
  
  .carousel-indicators {
    bottom: 10px;
  }
  
  .carousel-indicators [data-bs-target] {
    width: 8px;
    height: 8px;
    margin: 0 3px;
  }
  
  .carousel-indicators .active {
    width: 10px;
    height: 10px;
  }
}

/* Hero Content Animation */
@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translate3d(0, 20px, 0);
  }
  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}

.hero-content {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
  text-align: center;
  z-index: 2;
  padding: 0 15px; /* Add padding for better text containment */
}

/* Ensure text is properly centered and readable */
.hero-content h1 {
  font-size: 2.5rem;
  margin-bottom: 1rem;
  text-shadow: 0 2px 4px rgba(0,0,0,0.5); /* Add shadow for better readability */
}

.hero-content p {
  font-size: 1.25rem;
  text-shadow: 0 1px 3px rgba(0,0,0,0.5); /* Add shadow for better readability */
}

/* Adjust for smaller screens */
@media (max-width: 767.98px) {
  .hero-content h1 {
    font-size: 2rem;
  }
  
  .hero-content p {
    font-size: 1rem;
  }
}

@media (max-width: 575.98px) {
  .hero-content h1 {
    font-size: 1.75rem;
  }
  
  .hero-content p {
    font-size: 0.9rem;
  }
}

/* Fixed CTA Buttons */
.hero-cta-fixed {
  position: absolute;
  bottom: 100px; /* Position above the brand bar */
  left: 0;
  width: 100%;
  z-index: 3;
  text-align: center;
}

/* Adjust for smaller screens */
@media (max-width: 767.98px) {
  .hero-cta-fixed {
    bottom: 80px;
  }
}

@media (max-width: 575.98px) {
  .hero-cta-fixed {
    bottom: 70px;
  }
  
  .hero-cta-fixed .btn {
    padding: 0.5rem 1rem !important;
    font-size: 0.875rem;
  }
}

/* Adjust for smaller screens */
@media (max-width: 767.98px) {
  .hero-cta-fixed {
    bottom: 80px;
  }
}

@media (max-width: 575.98px) {
  .hero-cta-fixed {
    bottom: 70px;
  }
  
  .hero-cta-fixed .btn {
    padding: 0.5rem 1rem !important;
    font-size: 0.875rem;
  }
}

/* Topbar Marquee */
.topbar-track {
  overflow: hidden;
  white-space: nowrap;
}

.topbar-marquee {
  display: inline-block;
  animation: marquee 20s linear infinite;
  padding-left: 100%;
}

.topbar-marquee span {
  display: inline-block;
  padding: 0 20px;
}

@keyframes marquee {
  0% { transform: translateX(0); }
  100% { transform: translateX(-100%); }
}

/* Navbar */
.navbar-brand-img {
  height: 40px;
  width: auto;
  display: block;
}

.bg-dark-gold { background: linear-gradient(180deg, #121212, #1b1b1b); }
.text-gold { color: var(--gold) !important; }
.btn-gold { background-color: var(--gold); color: #1a1a1a; border: none; }
.btn-gold:hover { background-color: var(--gold-dark); color: #000; }
.btn-outline-gold { border: 1px solid var(--gold); color: var(--gold); }
.btn-outline-gold:hover { background: var(--gold); color: #1a1a1a; }
.cart-badge, .wishlist-badge { 
  min-width: 18px; 
  min-height: 18px; 
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  font-size: 0.7rem;
  padding: 0.2em 0.4em !important;
  border-radius: 50%; /* Ensure perfect circle */
}
/* Make red badge stand out nicely */
.badge.bg-danger.cart-badge, .cart-badge.bg-danger,
.badge.bg-danger.wishlist-badge, .wishlist-badge.bg-danger {
  box-shadow: 0 0 0 2px #fff; /* ring to separate from icon */
}
/* Tighten cart badge to icon */
.nav-actions .nav-link.position-relative .cart-badge,
.mobile-actions .nav-link.position-relative .cart-badge,
.nav-actions .nav-link.position-relative .wishlist-badge,
.mobile-actions .nav-link.position-relative .wishlist-badge {
  top: -3px !important;
  right: -6px !important;
  left: auto !important;
  transform: none !important;
}
.navbar { min-height: 56px; }
.navbar .container-fluid { align-items: center; }
.navbar .nav-link { 
    color: #111; 
    font-weight: 500; 
    transition: color .15s ease; 
    font-size: 1.1rem; /* Increased font size */
}
.navbar .nav-link i { line-height: 1; display: inline-block; }
.navbar .nav-link:hover, .navbar .nav-link.active { color: var(--gold); }
.navbar-brand { font-weight: 800; letter-spacing: .5px; color: var(--gold) !important; padding-top: 0; padding-bottom: 0; }
.navbar-brand img { height: 56px; width: auto; display: block; }
.navbar-toggler { padding: .25rem .5rem; }
.navbar .navbar-brand { padding-left: 0; }
.navbar .dropdown-menu { border-radius: 12px; border-color: #eee; }
.navbar .dropdown-item { color: #222; }
.navbar .dropdown-item:hover { background: var(--gold); color: #111; }
.nav-actions { display:flex; align-items:center; gap: .5rem; }
.nav-actions { padding-right: .75rem; }
.mobile-actions { display:flex; flex-direction: row; align-items:center; gap:.25rem; }
.mobile-actions .nav-link { padding: .25rem .4rem; line-height: 1; }
@media (max-width: 991.98px){
  .navbar .nav-link { padding: .25rem .5rem; }
}
.auth-btn { padding: .45rem 1rem; font-weight: 600; }
.center-nav { justify-content: center; width: 100%; }

/* Footer */
.footer-brand-img {
  height: 56px;
  width: auto;
  display: block;
}

.site-footer { background:#0b1020; color:#cbd5e1; padding: 48px 0; }
.site-footer h5 { color:#fff; font-weight:700; }
.site-footer .footer-brand { color: var(--gold); font-weight:800; font-size: 1.25rem; }
.site-footer a { color:#a8b3c7; text-decoration: none; }
.site-footer a:hover { color: var(--gold); text-decoration: none; }
.footer-divider { border-color: rgba(255,255,255,.08); }
.footer-bottom a { color:#a8b3c7; }
.footer-bottom a:hover { color: var(--gold); }
.pay-badge { font-size:.75rem; padding:.2rem .5rem; border-radius:.35rem; color:#fff; margin-left:.25rem; }
.pay-visa { background:#1a1f71; }
.pay-mc { background:#eb001b; }
.pay-upi { background:#008000; }
.pay-paytm { background:#00baf2; }
.footer-social .bi-instagram { color:#E1306C; }
.footer-social .bi-youtube { color:#FF0000; }
.footer-social .bi-twitter { color:#1DA1F2; }

/* Sections */
section.section-padding { padding: 64px 0; }
section.section-padding.bg-light, .about-light { background:#f5f7fb !important; color:#111 !important; }
section.section-padding.bg-gold { background: rgba(250,204,21,.2) !important; }
/* Homepage-only dark FAQs */
.faqs-dark { background:#0a0f1e; color:#e5e7eb; }

/* FAQs styling */
.accordion-item { border: 0; background: transparent; }
/* Default (light) accordions keep Bootstrap look, only gold arrow */
.accordion-button { border: 1px solid #e5e7eb; border-radius: 8px; }
.accordion-button::after{
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23FACC15'%3e%3cpath fill-rule='evenodd' d='M1.5 5.5l6 6 6-6'/%3e%3c/svg%3e") !important;
}
.accordion-button:focus { box-shadow: none; }
.accordion-button:not(.collapsed){ border-color: var(--gold) !important; }

/* Dark variant only inside .faqs-dark */
.faqs-dark .accordion-button { background:#0f172a; color:#e5e7eb; border:1px solid rgba(255,255,255,.08); border-radius:12px; box-shadow: 0 6px 16px rgba(0,0,0,.16); margin-bottom:.75rem; }
.faqs-dark .accordion-button:not(.collapsed) { background:#111827; color:#fff; border-color: var(--gold); }
.faqs-dark .accordion-body { background: transparent; color:#cbd5e1; padding: .75rem 0 1rem 0; }

/* Testimonials */
.testimonial-card { max-width: 420px; background: #fff; border-radius: 16px; box-shadow: 0 6px 24px rgba(0,0,0,.06); border: 1px solid #eee; }
.testimonial-stars i { color: var(--gold); }
.testimonial-quote { color: var(--gold); font-size: 24px; opacity: .7; }
.testimonial-tag { display:inline-block; background: rgba(250,204,21,.18); color:#7c6500; padding:.2rem .6rem; border-radius: 999px; font-size:.775rem; font-weight:600; }
.testimonial-divider { height:1px; background:#eee; margin: .75rem 0; }
.testimonial-name { font-weight:700; }
.testimonial-loc { font-size:.85rem; color:#6b7280; }
.testimonial-avatar { width:40px; height:40px; background:#f8f8f8; color:#777; }

/* Testimonials Continuous Slider */
.testimonial-slider { --gap:16px; --perView:3; overflow: hidden; }
.testimonial-slider .slider-track { display: flex; align-items: stretch; gap: var(--gap); transition: transform .6s ease; will-change: transform; }
.testimonial-slider .testimonial-card { flex: 0 0 calc((100% - (var(--perView) - 1) * var(--gap)) / var(--perView)); }

@media (max-width: 991.98px){
  .testimonial-slider { --perView:2; }
}
@media (max-width: 575.98px){
  .testimonial-slider { --perView:1; }
}

/* WhatsApp Chat Widget */
.wa-widget { position: fixed; right: 16px; bottom: 16px; z-index: 1050; }
.wa-toggle { width: 56px; height: 56px; border-radius: 50%; border: none; background: #25D366; color: #fff; display:flex; align-items:center; justify-content:center; box-shadow: 0 12px 28px rgba(0,0,0,.22); font-size: 24px; }
.wa-card { width: 340px; background:#fff; border-radius: 16px; overflow: hidden; border:1px solid rgba(250,204,21,.35); display:none; box-shadow: 0 18px 48px rgba(0,0,0,.22); animation: wa-pop .25s ease-out; }
.wa-card-header { padding:.75rem 1rem; background: linear-gradient(135deg, rgba(250,204,21,.25), rgba(250,204,21,.08)); border-bottom:1px solid rgba(250,204,21,.35); }
.wa-card-body { padding: 1rem; }
.wa-card-footer { padding: .75rem; border-top:1px solid rgba(250,204,21,.25); }
.wa-greet { font-weight:600; }
.wa-options .btn { text-align: left; border-width: 1.5px; }
.wa-widget.open .wa-card { display:block; }
.wa-widget.open .wa-toggle { display:none; }

.wa-brand-avatar { width: 36px; height: 36px; border-radius: 50%; background: rgba(250,204,21,.18); color:#7c6500; display:flex; align-items:center; justify-content:center; border:1px solid rgba(250,204,21,.45); }
.wa-online-badge { color: #22c55e; margin-left: 4px; animation: pulse 1.4s ease-in-out infinite; }

@keyframes pulse { 0%{ opacity:.4; } 50%{ opacity:1; } 100%{ opacity:.4; } }
@keyframes wa-pop { from { transform: translateY(8px); opacity: 0; } to { transform: translateY(0); opacity: 1; } }

/* Gold button outline utility */
.btn-outline-gold { color: #7c6500; border:1px solid rgba(250,204,21,.8); background: transparent; }
.btn-outline-gold:hover { background: rgba(250,204,21,.18); color:#111; border-color: var(--gold); }

/* Red button with white text for better visibility */
.btn-red-white { 
    background-color: #dc3545; 
    color: white; 
    border: 1px solid #dc3545; 
    font-weight: 600;
}
.btn-red-white:hover { 
    background-color: #c82333; 
    border-color: #bd2130; 
    color: white; 
}

/* Gold solid button */
.btn-gold { background: linear-gradient(135deg, #f4d03f, #d4ac0d); border: none; color: #111; font-weight: 600; }
.btn-gold:hover { background: linear-gradient(135deg, #f1c40f, #b7950b); color:#000; }

/* Gold border utility for cards */
.border-gold { border: 1px solid rgba(250,204,21,.6) !important; }

/* Product Card */
.product-card {
    border: 1px solid rgba(250,204,21,.6);
    border-radius: 14px;
    overflow: hidden;
    transition: transform .2s, box-shadow .2s, border-color .2s;
    background: #fff;
}

.product-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 4px 15px rgba(0,0,0,0.1);
    border-color: var(--gold);
}

.product-card .card-img-top {
    aspect-ratio: 1 / 1;
    object-fit: cover; /* Changed from contain to cover to fill the space properly */
    background: #f8f9fa;
    width: 100%;
    height: 100%;
}

.product-card .card-body {
    text-align: center;
}
.card-title { font-size: 0.85rem !important; }
.card-price { color: var(--gold-dark); font-weight: 600; }

/* Add to Cart Button with Icon */
.btn-add-to-cart {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}

/* Out of Stock Button */
.btn-out-of-stock {
    background-color: #dc3545 !important;
    border-color: #dc3545 !important;
    color: white !important;
}

/* Sections */
.section-padding { padding: 60px 0; }
.section-title { font-weight: 800; letter-spacing: .3px; }

/* Category Tiles - Light Ivory with Gold accents */
.category-tile {
  background: linear-gradient(180deg, #fffdf5, #fffaf0);
  border: 1px solid rgba(212,175,55,.35);
  border-radius: 12px;
  color: #1f2937; /* slate-800 */
  text-decoration: none;
  transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
  box-shadow: 0 8px 22px rgba(0,0,0,.06);
}
.category-tile:hover {
  transform: translateY(-4px);
  box-shadow: 0 14px 30px rgba(0,0,0,.12);
  border-color: var(--gold);
}
.category-tile:focus { outline: none; box-shadow: 0 0 0 3px rgba(250,204,21,.25); }
.category-tile img {
  border-radius: 8px;
  box-shadow: none; /* keep image clear */
  filter: none;     /* ensure no dimming */
  background: transparent;
  object-fit: cover; /* Ensure images cover the space properly */
}
.category-tile .fw-semibold { color: #111; font-weight: 700; letter-spacing: .2px; }
.icon-circle { width: 56px; height: 56px; border-radius: 50%; margin: 0 auto; display:flex; align-items:center; justify-content:center; background: rgba(250,204,21,.12); color: var(--gold-dark); font-size: 22px; border: 1px solid rgba(212,175,55,.45); }

/* Collections */
.collection-card { background: linear-gradient(180deg, #fff, #faf7ef); border: 1px solid #f0e6c8; border-radius: 14px; }

/* CTA */
.cta-band { background: linear-gradient(90deg, #fff7dd, #fff); }

/* Footer */
.site-footer { background:#0b1020; color:#cbd5e1; padding: 48px 0; }
.site-footer h5 { color:#fff; font-weight:700; }
.site-footer .footer-brand { color: var(--gold); font-weight:800; font-size: 1.25rem; }
.site-footer a { color:#a8b3c7; text-decoration: none; }
.site-footer a:hover { color: var(--gold); text-decoration: none; }
.footer-divider { border-color: rgba(255,255,255,.08); }
.footer-bottom a { color:#a8b3c7; }
.footer-bottom a:hover { color: var(--gold); }
.pay-badge { font-size:.75rem; padding:.2rem .5rem; border-radius:.35rem; color:#fff; margin-left:.25rem; }
.pay-visa { background:#1a1f71; }
.pay-mc { background:#eb001b; }
.pay-upi { background:#008000; }
.pay-paytm { background:#00baf2; }
.footer-social .bi-instagram { color:#E1306C; }
.footer-social .bi-youtube { color:#FF0000; }
.footer-social .bi-twitter { color:#1DA1F2; }

/* FAQ width */
.limit-width { max-width: 800px; margin: 0 auto; }

/* Admin Dashboard KPI cards */
.kpi { border: 0; border-radius: 14px; color:#111; }
.kpi .card-body { padding: 1rem 1.1rem; }
.kpi .kpi-label { font-size:.85rem; color:#111827; opacity:.75; }
.kpi .kpi-value { font-size:1.6rem; font-weight:800; letter-spacing:.3px; }
.kpi-primary { background: linear-gradient(135deg, rgba(13,110,253,.12), rgba(13,110,253,.06)); border:1px solid rgba(13,110,253,.25); }
.kpi-success { background: linear-gradient(135deg, rgba(25,135,84,.12), rgba(25,135,84,.06)); border:1px solid rgba(25,135,84,.25); }
.kpi-warning { background: linear-gradient(135deg, rgba(255,193,7,.16), rgba(255,193,7,.08)); border:1px solid rgba(255,193,7,.35); }
.kpi-danger  { background: linear-gradient(135deg, rgba(220,53,69,.12), rgba(220,53,69,.06)); border:1px solid rgba(220,53,69,.25); }

/* Soft badges */
.badge-soft-secondary { background: rgba(108,117,125,.15); color:#343a40; }
.badge-soft-primary   { background: rgba(13,110,253,.15); color:#0d6efd; }
.badge-soft-info      { background: rgba(13,202,240,.15); color:#0dcaf0; }
.badge-soft-warning   { background: rgba(255,193,7,.18); color:#a87900; }
.badge-soft-success   { background: rgba(25,135,84,.15); color:#198754; }
.badge-soft-danger    { background: rgba(220,53,69,.15); color:#dc3545; }
.badge-soft-dark      { background: rgba(33,37,41,.15); color:#212529; }

/* Modal Offer */
.offer-modal .modal-content { border-radius:16px; overflow:hidden; }
.offer-modal .modal-header { border:0; }
.offer-code { background: rgba(250,204,21,.15); color:#1f2937; border:1px dashed var(--gold); padding:.5rem .75rem; border-radius: 8px; font-weight:700; }

/* Brand Bar - Noticeable Card Style */
.brand-bar {
  background: linear-gradient(135deg, #fff, #fafafa);
  border-top: 1px solid rgba(212,175,55,.2);
  border-bottom: 1px solid rgba(212,175,55,.2);
  box-shadow: 0 2px 10px rgba(0,0,0,.05);
  position: relative;
  z-index: 10;
}

.brand-bar .bb-item {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.75rem 1.5rem;
  font-weight: 600;
  color: #1f2937;
  border-radius: 8px;
  background: rgba(250,204,21,.1);
  margin: 0.5rem;
  transition: all 0.3s ease;
}

.brand-bar .bb-item:hover {
  background: rgba(250,204,21,.2);
  transform: translateY(-2px);
  box-shadow: 0 4px 8px rgba(0,0,0,.1);
}

.brand-bar .bb-item i {
  font-size: 1.2rem;
  margin-right: 0.5rem;
}

/* Colorful icons */
.brand-bar .bb-item:nth-child(1) i:not(.text-warning) { /* Free Shipping - Blue */
  color: #3b82f6;
}

.brand-bar .bb-item:nth-child(2) i { /* Easy Returns - Green */
  color: #10b981;
}

.brand-bar .bb-item:nth-child(3) i { /* Secure Payments - Gold */
  color: var(--gold);
}

/* Star icon for conditions */
.brand-bar .bb-item .text-warning {
  font-size: 0.8rem;
  margin-left: 0.25rem;
  vertical-align: top;
}

/* Responsive adjustments for brand bar */
@media (max-width: 767.98px) {
  .brand-bar .bb-item {
    padding: 0.5rem 1rem;
    font-size: 0.9rem;
    margin: 0.25rem;
  }
  
  .brand-bar .bb-item i {
    font-size: 1rem;
    margin-right: 0.3rem;
  }
}

@media (max-width: 575.98px) {
  .brand-bar .bb-item {
    padding: 0.4rem 0.8rem;
    font-size: 0.85rem;
  }
}
