/* ============================================================
   CEREZA MAKEUP — Pink Feminine Theme Override
   ============================================================ */

:root {
  /* Paleta 100% rosada y femenina */
  --cherry:        #e91e8c;
  --cherry-dim:    #c4197a;
  --cherry-deep:   #9a1260;
  --cherry-light:  #f472c0;
  --cherry-xlight: #fff0f9;
  --rose:          #fde8f4;
  --blush:         #fdf2fa;
  --cream:         #fff8fd;
  --warm-white:    #fff5fc;
  --gold:          #f4a0c8;
  --gold-mid:      #f7bfd9;
  --gold-light:    #fce4f2;
  --ink:           #3d0a28;
  --ink-dim:       #7a3060;
  --ink-muted:     #b067a0;
  --surface:       #ffffff;
  --shadow-sm: 0 2px 12px rgba(233, 30, 140, 0.08);
  --shadow-md: 0 8px 32px rgba(233, 30, 140, 0.14);
  --shadow-lg: 0 20px 60px rgba(233, 30, 140, 0.18);
  --shadow-xl: 0 40px 100px rgba(233, 30, 140, 0.22);
}

/* Body background pink tint */
body { background: var(--warm-white); }

/* Cursor glow pink */
.cursor-glow {
  background: radial-gradient(circle, rgba(233,30,140,0.06) 0%, transparent 70%);
}

/* ── CEREZA ICON ANIMADO ── */
@keyframes cherryBounce {
  0%, 100% { transform: translateY(0) rotate(-3deg) scale(1); }
  30%       { transform: translateY(-6px) rotate(6deg) scale(1.1); }
  60%       { transform: translateY(-2px) rotate(-4deg) scale(1.05); }
}
@keyframes cherryStem {
  0%, 100% { transform: scaleY(1) rotate(0deg); }
  50%       { transform: scaleY(1.12) rotate(5deg); }
}
@keyframes cherryShine {
  0%, 100% { opacity: 0.5; transform: scale(1) translate(-1px,-1px); }
  50%       { opacity: 1;   transform: scale(1.15) translate(-2px,-2px); }
}

.cherry-logo-icon {
  display: inline-flex; align-items: center; justify-content: center;
  width: 36px; height: 36px; flex-shrink: 0;
  animation: cherryBounce 2.8s ease-in-out infinite;
}
.cherry-logo-icon svg {
  width: 28px; height: 28px; overflow: visible;
}
.cherry-ball-left, .cherry-ball-right {
  animation: cherryBounce 2.8s ease-in-out infinite;
}
.cherry-ball-right {
  animation-delay: 0.18s;
}
.cherry-stem {
  animation: cherryStem 2.8s ease-in-out infinite;
  transform-origin: bottom center;
}
.cherry-shine {
  animation: cherryShine 1.8s ease-in-out infinite;
}

/* Nav logo override */
.nav-logo { color: var(--cherry); }
.nav.transparent .nav-logo { color: #fff; }
.nav-logo-mark {
  background: var(--cherry);
  box-shadow: 0 2px 12px rgba(233,30,140,0.3);
}
.nav.transparent .nav-logo-mark { background: rgba(255,255,255,0.25); }

/* Buttons pink */
.btn-primary, .btn-cart, .btn.btn-primary {
  background: linear-gradient(135deg, var(--cherry), #c4197a) !important;
  box-shadow: 0 4px 20px rgba(233,30,140,0.35);
}
.btn-primary:hover, .btn-cart:hover {
  background: linear-gradient(135deg, #c4197a, var(--cherry-deep)) !important;
}
.btn-outline {
  border-color: var(--cherry) !important;
  color: var(--cherry) !important;
}
.btn-outline:hover { background: var(--cherry) !important; color: #fff !important; }

/* Hero gradient pink */
.hero { background: linear-gradient(135deg, #8a1060 0%, #c41888 40%, #e91e8c 70%, #ff6ec7 100%) !important; }
.hero-bg-img { background: linear-gradient(135deg, #7a0d55 0%, #b5177a 50%, #e91e8c 100%) !important; }

/* Mosaic pink cells */
.mosaic-cell { background: linear-gradient(135deg, var(--rose), var(--blush)); }
.mosaic-cell::before { background: linear-gradient(135deg, rgba(233,30,140,0.25), rgba(196,25,122,0.15)); }
.mosaic-cell.featured { background: linear-gradient(135deg, #e91e8c, #c4197a); }
.mosaic-cell-bg { background: linear-gradient(135deg, var(--rose), var(--gold-light)); }

/* Campaign cards pink */
.duo-a { background: linear-gradient(135deg, #d91680, #f4a0c8) !important; }
.duo-b { background: linear-gradient(135deg, #b5126e, #e91e8c) !important; }

/* Lifestyle image grads */
.grad-a { background: linear-gradient(135deg, #e91e8c, #f7bfd9) !important; }
.grad-b { background: linear-gradient(135deg, #c4197a, #e91e8c) !important; }
.grad-c { background: linear-gradient(135deg, #f4a0c8, #e91e8c) !important; }

/* Values section */
.values-section { background: linear-gradient(135deg, #6b0040, #9a1260, #c4197a) !important; }
.value-icon-ring { border-color: rgba(255,255,255,0.3) !important; background: rgba(255,255,255,0.1) !important; }

/* Instagram grid */
.insta-fill { background: linear-gradient(135deg, var(--rose), var(--gold-light)); }

/* Testimonials */
.testimonial-stars { color: var(--cherry); }
.testimonial-avatar { background: linear-gradient(135deg, var(--cherry), var(--cherry-light)); }

/* Footer */
footer { background: linear-gradient(135deg, #4a0030, #7a0d55) !important; }
.footer-brand-mark { background: var(--cherry) !important; }
.social-link { border-color: rgba(255,255,255,0.2); }
.social-link:hover { background: var(--cherry); border-color: var(--cherry); }

/* Product cards */
.product-img { background: linear-gradient(135deg, var(--rose), var(--blush)); }
.add-btn { background: var(--cherry) !important; }
.add-btn:hover { background: var(--cherry-dim) !important; }
.product-wish-btn.active { color: var(--cherry); }

/* Cart */
.cart-sidebar { border-left: 2px solid var(--rose); }
.cart-header { background: linear-gradient(135deg, #fff0f9, #fdf2fa); }
.cart-badge { background: var(--cherry) !important; }
.checkout-btn { background: linear-gradient(135deg, var(--cherry), #c4197a) !important; }

/* Scrollbar pink */
::-webkit-scrollbar-thumb { background: var(--cherry-light) !important; }
::-webkit-scrollbar-thumb:hover { background: var(--cherry) !important; }

/* eyebrow */
.eyebrow { color: var(--cherry); }
em { color: var(--cherry); }

/* Forms pink focus */
.form-field:focus, .form-control:focus {
  border-color: var(--cherry) !important;
  box-shadow: 0 0 0 3px rgba(233,30,140,0.12) !important;
}

/* Marquee */
.marquee-wrap { background: linear-gradient(90deg, #e91e8c, #c4197a, #e91e8c) !important; }

/* WhatsApp FAB keep green but add pink ring */
.wa-fab { box-shadow: 0 4px 20px rgba(37,211,102,0.4), 0 0 0 3px rgba(233,30,140,0.15); }

/* Filter bar */
.filter-bar { background: var(--rose); border-radius: 16px; padding: 1rem; }

/* Badges */
.badge.sale { background: linear-gradient(135deg, var(--cherry), #f4a0c8); }
.badge.new  { background: linear-gradient(135deg, #9a1260, var(--cherry)); }

/* Nav links active */
.nav-links a:hover, .nav-links a.active { color: var(--cherry); }
.nav-links a::after { background: var(--cherry); }

/* Page titles */
h1, h2, h3 { }
.hero-content h1 em { color: #ffd6f0; }

/* Btn WA */
.btn-wa { background: #25D366 !important; }

/* Admin sidebar accent */
.admin-sidebar { border-right: 2px solid var(--rose); }
.admin-sidebar-logo { background: linear-gradient(135deg, var(--cherry), var(--cherry-dim)); }
.admin-nav-item.active, .admin-nav-item:hover { background: var(--rose); color: var(--cherry); }
.admin-nav-item.active { border-left: 3px solid var(--cherry); }
.btn-admin-primary { background: var(--cherry) !important; }
.btn-admin-primary:hover { background: var(--cherry-dim) !important; }

/* Login page pink */
.login-screen {
  background: linear-gradient(135deg, #7a0d55, #c4197a, #e91e8c, #ff6ec7) !important;
}
.login-card {
  background: rgba(255,255,255,0.97);
  box-shadow: 0 30px 80px rgba(233,30,140,0.3);
  border-top: 4px solid var(--cherry);
}
.login-icon {
  background: linear-gradient(135deg, var(--cherry), var(--cherry-light)) !important;
  box-shadow: 0 8px 24px rgba(233,30,140,0.4);
}
.login-title { color: var(--cherry) !important; }

/* ── FIX: nav-logo button reset (browser default removes background/border) ── */
button.nav-logo {
  background: none !important;
  border: none !important;
  padding: 0 !important;
  outline: none !important;
  box-shadow: none !important;
}
button.nav-logo:focus { outline: 2px solid rgba(255,255,255,0.4); border-radius: 6px; }

/* ── FIX: hero-scroll button reset ── */
button.hero-scroll {
  background: none !important;
  border: none !important;
  box-shadow: none !important;
}
