/* ===========================================================
   Rainbow Glam Theme — override sobre Mioca
   Paleta: rosa, lila, pastel arcoiris, sparkles dorados.
   =========================================================== */

:root{
  --rg-pink:#ff4fa3;
  --rg-pink-soft:#ff8fc8;
  --rg-pink-deep:#e63d92;
  --rg-lilac:#c9a3ff;
  --rg-lilac-deep:#a87bff;
  --rg-sky:#a8d8ff;
  --rg-mint:#b5f0d6;
  --rg-peach:#ffd1b0;
  --rg-gold:#ffd166;
  --rg-cream:#fff8fb;
  --rg-ink:#4a2c4a;
  --rg-ink-soft:#6b5a85;
  --rg-border:#f1e6ff;
  --rg-gradient-pink:linear-gradient(135deg,#ff4fa3 0%,#ff8fc8 50%,#c9a3ff 100%);
  --rg-gradient-pastel:linear-gradient(135deg,#ffe6f1 0%,#f1e6ff 25%,#e1ecff 50%,#e2fbef 75%,#fff1e1 100%);
  --rg-gradient-topbar:linear-gradient(90deg,#ff4fa3,#c9a3ff,#a8d8ff,#b5f0d6,#ffd166,#ffd1b0,#ff4fa3);
  --rg-shadow-soft:0 8px 24px rgba(255,79,163,.12);
  --rg-shadow-card:0 10px 30px rgba(45,26,58,.08);
}

/* ---- Tipografia ---- */
body,
input,select,textarea,button{
  font-family:'Poppins',sans-serif !important;
  color:var(--rg-ink) !important;
  background-color:var(--rg-cream) !important;
}
h1,h2,h3,h4,h5,h6,
.section-title h2,
.section-title h3,
.product-title a,
.brand-text{
  font-family:'Pacifico', cursive !important;
  color:var(--rg-ink) !important;
  font-weight:400 !important;
  letter-spacing:.5px;
}
.product-title a, .product-title{ font-family:'Poppins',sans-serif !important; font-weight:600 !important; }
.btn, .button, button{ font-family:'Poppins',sans-serif !important; font-weight:600 !important; }

/* ---- Reemplazo color de marca Mioca (peach) -> Rainbow pink ---- */
[class*="eaaa85"], .text-primary{ color:var(--rg-pink) !important; }

a{ color:var(--rg-pink); }
a:hover{ color:var(--rg-lilac-deep); }

/* ---- Topbar (arcoiris pastel) ---- */
.header-top, .header-top-area, .topbar{
  background:var(--rg-gradient-topbar) !important;
  background-size:300% 100% !important;
  animation:rgRainbow 15s linear infinite;
  color:#fff !important;
  padding:8px 0 !important;
  font-size:13px;
  font-weight:500;
}
.header-top *, .topbar *{ color:#fff !important; }
@keyframes rgRainbow{
  0%{ background-position:0% 50%; }
  100%{ background-position:300% 50%; }
}

/* ---- Header ---- */
header, .header-main, .header-area{ background:#fff !important; box-shadow:var(--rg-shadow-soft); }
.header-logo img{ height:54px !important; width:auto !important; }
.main-menu > ul > li > a,
.main-menu ul li a{
  font-family:'Poppins',sans-serif !important;
  font-weight:500 !important;
  color:var(--rg-ink) !important;
  text-transform:none !important;
}
.main-menu ul li:hover > a,
.main-menu ul li.active > a{ color:var(--rg-pink) !important; }
.header-right-action a, .header-right a{ color:var(--rg-ink) !important; }
.header-right-action a:hover{ color:var(--rg-pink) !important; }
.header-right-action .header-cart-count,
.header-cart .item-count,
.cart-count, .badge-count{
  background:var(--rg-gradient-pink) !important;
  color:#fff !important;
  border:none !important;
}

/* ---- Botones ---- */
.btn,
.btn-primary,
.btn-outline-primary,
button.btn-primary,
.shop-btn,
.product-detail-cart-btn .add-cart-btn,
.add-to-cart-btn,
.checkout-btn,
input[type=submit].btn-primary{
  background:var(--rg-gradient-pink) !important;
  background-image:var(--rg-gradient-pink) !important;
  border:none !important;
  color:#fff !important;
  border-radius:999px !important;
  padding:12px 28px !important;
  box-shadow:var(--rg-shadow-soft);
  transition:transform .25s ease, box-shadow .25s ease, filter .25s ease;
  text-transform:none !important;
  font-weight:600 !important;
}
.btn:hover,
.btn-primary:hover,
.btn-outline-primary:hover,
.shop-btn:hover,
.add-to-cart-btn:hover{
  transform:translateY(-2px);
  filter:brightness(1.05);
  box-shadow:0 12px 28px rgba(255,79,163,.28) !important;
  color:#fff !important;
}
.btn-primary::before, .btn-primary::after{ display:none !important; }
.btn-ghost, .btn-outline-secondary{
  background:#fff !important;
  background-image:none !important;
  color:var(--rg-pink) !important;
  border:2px solid var(--rg-pink) !important;
  border-radius:999px !important;
  padding:10px 24px !important;
  font-weight:600 !important;
}
.btn-ghost:hover, .btn-outline-secondary:hover{
  background:var(--rg-pink) !important;
  color:#fff !important;
}
.btn-sm{ padding:7px 16px !important; font-size:13px !important; }

/* ---- Formularios ---- */
input[type=text],
input[type=email],
input[type=password],
input[type=number],
input[type=search],
input[type=tel],
select, textarea{
  background:#fff !important;
  border:1px solid var(--rg-border) !important;
  border-radius:12px !important;
  padding:10px 14px !important;
  font-family:'Poppins',sans-serif !important;
  color:var(--rg-ink) !important;
  transition:border-color .2s, box-shadow .2s;
}
input:focus, select:focus, textarea:focus{
  outline:none !important;
  border-color:var(--rg-pink) !important;
  box-shadow:0 0 0 4px rgba(255,79,163,.15) !important;
}
label{ color:var(--rg-ink-soft); font-weight:500; font-size:14px; margin-bottom:6px; display:inline-block; }

/* ---- Hero / Slider ---- */
.hero, .slider-area, .home-slider, .hero-area{
  background:var(--rg-gradient-pastel);
  position:relative;
  overflow:hidden;
  padding:80px 0;
}
.hero::before, .slider-area::before{
  content:""; position:absolute; inset:0;
  background:radial-gradient(ellipse at 20% 30%, rgba(255,255,255,.6), transparent 50%),
             radial-gradient(ellipse at 80% 70%, rgba(255,255,255,.5), transparent 55%);
  pointer-events:none;
}
.hero-content{ position:relative; z-index:2; }
.hero-eyebrow{
  display:inline-block;
  padding:6px 16px;
  background:#fff;
  color:var(--rg-pink);
  border-radius:999px;
  font-size:13px;
  font-weight:600;
  margin-bottom:18px;
  box-shadow:var(--rg-shadow-soft);
}
.hero h1{
  font-size:60px;
  line-height:1.1;
  margin-bottom:18px;
  background:var(--rg-gradient-pink);
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
  background-clip:text;
}
.hero p{ font-size:18px; color:var(--rg-ink-soft); max-width:520px; margin-bottom:28px; }
.hero-actions{ display:flex; gap:14px; flex-wrap:wrap; }
.hero-art{ position:relative; min-height:340px; }
.rainbow-orb{
  width:340px;height:340px;border-radius:50%;
  background:conic-gradient(from 0deg, #ff4fa3, #ffd166, #b5f0d6, #a8d8ff, #c9a3ff, #ff4fa3);
  filter:blur(2px);
  position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);
  box-shadow:0 30px 80px rgba(255,79,163,.3);
  animation:rgSpin 18s linear infinite;
}
@keyframes rgSpin{ to{ transform:translate(-50%,-50%) rotate(360deg); } }

/* ---- Sparkles ---- */
.sparkle{
  position:absolute; pointer-events:none;
  color:var(--rg-gold); font-size:18px;
  animation:rgTwinkle 2.4s ease-in-out infinite;
}
.sparkle.s1{ top:12%; left:8%; }
.sparkle.s2{ top:24%; right:12%; animation-delay:.4s; font-size:22px; }
.sparkle.s3{ bottom:18%; left:18%; animation-delay:.8s; font-size:14px; }
.sparkle.s4{ bottom:10%; right:22%; animation-delay:1.2s; font-size:24px; }
.sparkle.s5{ top:50%; left:48%; animation-delay:1.6s; }
@keyframes rgTwinkle{
  0%,100%{ opacity:.4; transform:scale(.8) rotate(0deg); }
  50%{ opacity:1; transform:scale(1.15) rotate(30deg); }
}

/* ---- Section titles ---- */
.section-title, .section-head{ text-align:center; margin-bottom:42px; }
.section-title h2, .section-head h2{
  font-size:44px;
  background:var(--rg-gradient-pink);
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
  background-clip:text;
  margin:0 0 8px;
}
.section-title p, .section-head p{ color:var(--rg-ink-soft); font-size:16px; max-width:600px; margin:0 auto; }

/* ---- Product cards (Mioca .single-product) ---- */
.product-card, .single-product, .product-item{
  background:#fff !important;
  border-radius:20px !important;
  border:1px solid var(--rg-border) !important;
  overflow:hidden;
  box-shadow:var(--rg-shadow-card);
  transition:transform .3s ease, box-shadow .3s ease;
}
.product-card:hover, .single-product:hover, .product-item:hover{
  transform:translateY(-6px);
  box-shadow:0 18px 40px rgba(255,79,163,.18);
}
.product-card .product-media, .single-product .product-img{ display:block; aspect-ratio:1/1; overflow:hidden; background:var(--rg-gradient-pastel); }
.product-card .product-media img, .single-product .product-img img{ width:100%; height:100%; object-fit:cover; transition:transform .5s; }
.product-card:hover .product-media img, .single-product:hover .product-img img{ transform:scale(1.05); }

.product-card .product-info, .single-product .product-content{
  padding:18px 18px 20px !important;
}
.product-card .product-cat, .single-product .product-cat{
  font-size:12px; letter-spacing:.5px; text-transform:uppercase;
  color:var(--rg-lilac-deep) !important; font-weight:600;
}
.product-card h3, .single-product h3, .product-card .product-title, .single-product .product-name{
  font-family:'Poppins',sans-serif !important; font-size:16px !important; margin:8px 0; font-weight:600 !important;
}
.product-card h3 a, .single-product h3 a{ color:var(--rg-ink) !important; }
.product-card h3 a:hover, .single-product h3 a:hover{ color:var(--rg-pink) !important; }
.product-card .product-price, .single-product .product-price, .price-box{
  font-size:18px !important; font-weight:700 !important; color:var(--rg-pink) !important;
}
.price-compare, .old-price{ color:#bbb !important; text-decoration:line-through; font-weight:400 !important; margin-left:6px; font-size:14px !important; }

.product-badge{
  position:absolute; top:12px; left:12px;
  padding:5px 12px;
  border-radius:999px;
  font-size:11px; font-weight:600; color:#fff;
  background:var(--rg-gradient-pink);
  letter-spacing:.5px; text-transform:uppercase;
  z-index:2;
}
.product-badge.sale{ background:linear-gradient(135deg,#ff4fa3,#ffd166); }
.product-badge.new{ background:linear-gradient(135deg,#a8d8ff,#c9a3ff); }
.product-card .product-media{ position:relative; }

/* ---- Product grid container ---- */
.product-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(240px,1fr)); gap:24px; }

/* ---- Categorias ---- */
.cat-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); gap:16px; }
.cat-card{
  display:flex; align-items:center; justify-content:center;
  padding:30px 16px;
  border-radius:20px;
  background:var(--rg-gradient-pastel);
  border:1px solid var(--rg-border);
  text-decoration:none;
  text-align:center;
  font-family:'Pacifico',cursive;
  color:var(--rg-ink) !important;
  font-size:20px;
  transition:transform .3s, box-shadow .3s;
}
.cat-card:hover{ transform:translateY(-4px); box-shadow:var(--rg-shadow-soft); color:var(--rg-pink) !important; }

/* ---- Sections genericas ---- */
.section{ padding:80px 0; }
section.section{ padding:80px 0; }

/* ---- Newsletter ---- */
.newsletter-area, .newsletter-section{
  background:#ffe6f1 !important;
  padding:60px 0;
  text-align:center;
}
.newsletter-area input[type=email]{ max-width:380px; }

/* ---- Footer ---- */
footer, .footer-area, .site-footer{
  background:#2d1a3a !important;
  color:#fff !important;
  padding:60px 0 0;
}
footer *, .site-footer *{ color:#fff !important; }
footer h4, .site-footer h4{ color:#fff !important; font-family:'Pacifico',cursive !important; font-size:22px; margin-bottom:18px; }
footer a, .site-footer a{ color:rgba(255,255,255,.78) !important; }
footer a:hover, .site-footer a:hover{ color:var(--rg-pink-soft) !important; }
.footer-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); gap:30px; padding-bottom:40px; }
.site-footer .brand{ display:flex; align-items:center; gap:10px; margin-bottom:14px; }
.site-footer .brand img{ width:54px; height:54px; }
.site-footer .brand-text{ font-family:'Pacifico',cursive; font-size:24px; }
.footer-socials a{
  display:inline-flex; align-items:center; justify-content:center;
  width:38px; height:38px; border-radius:50%;
  background:rgba(255,255,255,.08);
  margin-right:8px; transition:background .25s, transform .25s;
}
.footer-socials a:hover{ background:var(--rg-gradient-pink); transform:translateY(-2px); }
.copyright{ text-align:center; padding:20px 0; border-top:1px solid rgba(255,255,255,.08); opacity:.7; font-size:13px; }

/* ---- Breadcrumb ---- */
.breadcrumb-area, .page-breadcrumb{
  background:var(--rg-gradient-pastel);
  padding:30px 0;
  margin-bottom:0;
}
.breadcrumb-area h1, .breadcrumb-area h2{ font-size:34px; margin:0 0 6px; }
.breadcrumb-area a{ color:var(--rg-pink) !important; }

/* ---- Flash ---- */
.flash{
  padding:14px 18px; border-radius:14px; margin:16px 0;
  font-size:14px; font-weight:500;
  display:flex; align-items:center; gap:10px;
}
.flash.success{ background:#e2fbef; color:#1f7a52; border:1px solid #b5f0d6; }
.flash.error{ background:#ffe1ec; color:#a72050; border:1px solid #ffb9d2; }
.flash.warning{ background:#fff4e0; color:#a06800; border:1px solid #ffd9a3; }
.flash.info{ background:#e2f0ff; color:#1d5499; border:1px solid #a8d8ff; }

/* ---- Cart / Tables ---- */
.cart-table, .table-cart, .shopping-cart-table{
  background:#fff; border-radius:18px; border:1px solid var(--rg-border); overflow:hidden;
}
.cart-table thead th{ background:#fdf0f7 !important; color:var(--rg-ink) !important; font-weight:600; padding:14px !important; text-transform:uppercase; font-size:12px; letter-spacing:.5px; }
.cart-table td{ padding:16px 14px !important; border-top:1px solid var(--rg-border) !important; }

.summary-box, .order-summary, .cart-summary, .checkout-summary{
  background:#fff; border-radius:18px; padding:24px; border:1px solid var(--rg-border);
  box-shadow:var(--rg-shadow-card);
}

/* ---- Shop sidebar (filtros) ---- */
.shop-sidebar{ background:#fff; border-radius:18px; padding:24px; border:1px solid var(--rg-border); box-shadow:var(--rg-shadow-card); }
.shop-sidebar h4{ font-family:'Pacifico',cursive !important; color:var(--rg-ink) !important; font-size:22px; margin-bottom:14px; }
.shop-filters{
  display:flex; gap:12px; flex-wrap:wrap;
  background:#fff; padding:18px; border-radius:16px; border:1px solid var(--rg-border);
  margin-bottom:28px; box-shadow:var(--rg-shadow-card);
}

/* ---- Product detail page ---- */
.product-show-grid{ display:grid; grid-template-columns:1fr 1fr; gap:48px; align-items:start; }
.product-gallery img{ width:100%; border-radius:24px; box-shadow:var(--rg-shadow-card); }
.product-detail .product-cat{ color:var(--rg-lilac-deep); font-size:13px; letter-spacing:.5px; text-transform:uppercase; font-weight:600; }
.product-detail h1{ font-family:'Pacifico',cursive !important; font-size:42px; margin:8px 0 12px; }
.product-detail .product-price{ font-size:30px; font-weight:700; color:var(--rg-pink); margin-bottom:18px; }
.variant-swatch{
  border:2px solid var(--rg-border); border-radius:14px; padding:8px 16px; cursor:pointer; display:inline-flex; align-items:center; gap:8px;
  background:#fff; transition:all .2s;
}
.variant-swatch.active, .variant-swatch:hover{ border-color:var(--rg-pink); box-shadow:var(--rg-shadow-soft); }
.qty-control{ display:inline-flex; align-items:center; gap:10px; background:#fff; border:1px solid var(--rg-border); border-radius:999px; padding:4px 8px; }
.qty-control button{ background:transparent !important; color:var(--rg-pink) !important; border:none !important; padding:6px 10px !important; box-shadow:none !important; }
.qty-control input{ width:50px; text-align:center; border:none !important; box-shadow:none !important; padding:6px !important; }

/* ---- Container helper ---- */
.container{ width:100%; max-width:1240px; margin:0 auto; padding:0 16px; box-sizing:border-box; }

/* ---- Layout grid utils used in views ---- */
.rg-grid-2{ display:grid; grid-template-columns:1fr 1fr; gap:30px; align-items:start; }
.rg-grid-shop{ display:grid; grid-template-columns:260px 1fr; gap:30px; align-items:start; }
.rg-grid-cart{ display:grid; grid-template-columns:1fr 380px; gap:30px; align-items:start; }
.rg-grid-checkout{ display:grid; grid-template-columns:1.5fr 1fr; gap:30px; align-items:start; }
@media (max-width: 900px){
  .rg-grid-2,.rg-grid-shop,.rg-grid-cart,.rg-grid-checkout,.product-show-grid{ grid-template-columns:1fr; }
  .hero{ padding:50px 0; }
  .hero h1{ font-size:42px; }
  .hero-art{ min-height:240px; }
  .rainbow-orb{ width:220px; height:220px; }
  .section, section.section{ padding:50px 0; }
}

/* ---- Header layout (Mioca clases simplificadas) ---- */
.rg-header{ background:#fff; box-shadow:var(--rg-shadow-soft); position:sticky; top:0; z-index:100; }
.rg-header-inner{ display:flex; align-items:center; gap:24px; padding:14px 0; }
.rg-header .brand{ display:flex; align-items:center; gap:12px; text-decoration:none; }
.rg-header .brand img{ width:54px; height:54px; }
.rg-header .brand-text{ font-family:'Pacifico',cursive; color:var(--rg-ink); font-size:22px; line-height:1; }
.rg-header .brand-text small{ display:block; font-size:11px; font-family:'Poppins',sans-serif; letter-spacing:2px; color:var(--rg-lilac-deep); text-transform:uppercase; }
.rg-nav{ display:flex; gap:22px; margin-left:auto; }
.rg-nav a{ color:var(--rg-ink); text-decoration:none; font-weight:500; padding:8px 4px; position:relative; }
.rg-nav a.active, .rg-nav a:hover{ color:var(--rg-pink); }
.rg-nav a.active::after{
  content:""; position:absolute; bottom:-2px; left:0; right:0; height:3px;
  background:var(--rg-gradient-pink); border-radius:99px;
}
.rg-tools{ display:flex; align-items:center; gap:8px; }
.rg-tools .icon-btn{
  width:40px; height:40px; display:inline-flex; align-items:center; justify-content:center;
  border-radius:50%; background:transparent; border:none;
  color:var(--rg-ink); position:relative; text-decoration:none; cursor:pointer;
  transition:background .2s, color .2s;
}
.rg-tools .icon-btn:hover{ background:#ffe6f1; color:var(--rg-pink); }
.rg-tools .badge{
  position:absolute; top:2px; right:2px;
  background:var(--rg-gradient-pink); color:#fff;
  font-size:10px; font-weight:700; min-width:18px; height:18px; padding:0 5px;
  border-radius:99px; display:inline-flex; align-items:center; justify-content:center;
}
@media (max-width: 768px){
  .rg-nav{ display:none; }
}

/* ---- Auth layout ---- */
.rg-auth{
  min-height:100vh; display:flex; align-items:center; justify-content:center;
  padding:40px 16px;
  background:var(--rg-gradient-pastel);
  position:relative; overflow:hidden;
}
.rg-auth-card{
  background:#fff; border-radius:24px; padding:42px;
  max-width:440px; width:100%;
  box-shadow:0 22px 60px rgba(45,26,58,.12);
  position:relative; z-index:2;
}
.rg-auth-card .brand-wrap{ text-align:center; margin-bottom:18px; }
.rg-auth-card .brand-wrap img{ width:64px; height:64px; }
.rg-auth-card h1{ text-align:center; font-size:32px; margin:0 0 22px; }
.rg-auth-card .form-row{ margin-bottom:14px; display:flex; flex-direction:column; gap:6px; }
.rg-auth-card .alt{ text-align:center; margin-top:18px; color:var(--rg-ink-soft); }
.rg-auth-card .btn-primary{ width:100%; display:block; }

/* ---- Account sidebar ---- */
.account-grid{ display:grid; grid-template-columns:260px 1fr; gap:30px; align-items:start; }
.account-sidebar{ background:#fff; border-radius:18px; padding:20px; border:1px solid var(--rg-border); box-shadow:var(--rg-shadow-card); }
.account-sidebar a{
  display:block; padding:10px 14px; border-radius:12px;
  color:var(--rg-ink) !important; text-decoration:none; font-weight:500;
  margin-bottom:4px;
}
.account-sidebar a:hover{ background:#ffe6f1; color:var(--rg-pink) !important; }
.account-sidebar a.active{ background:var(--rg-gradient-pink); color:#fff !important; }
@media (max-width: 900px){ .account-grid{ grid-template-columns:1fr; } }

/* ---- Pagination ---- */
.pagination{ display:flex; gap:8px; justify-content:center; padding:0; margin:30px 0 0; list-style:none; }
.pagination a, .pagination span{
  display:inline-flex; align-items:center; justify-content:center;
  min-width:38px; height:38px; padding:0 12px;
  border-radius:12px; background:#fff; border:1px solid var(--rg-border);
  color:var(--rg-ink); text-decoration:none; font-weight:500;
}
.pagination .active span, .pagination li.active span{
  background:var(--rg-gradient-pink); color:#fff; border:none;
}
.pagination a:hover{ background:#ffe6f1; color:var(--rg-pink); }

/* ---- Tables genericas (cuenta/orders) ---- */
.rg-table{ width:100%; background:#fff; border-radius:18px; border:1px solid var(--rg-border); border-collapse:separate; border-spacing:0; overflow:hidden; box-shadow:var(--rg-shadow-card); }
.rg-table thead th{ background:#fdf0f7; color:var(--rg-ink); padding:14px; text-align:left; font-weight:600; font-size:13px; text-transform:uppercase; letter-spacing:.5px; }
.rg-table td{ padding:14px; border-top:1px solid var(--rg-border); }
.rg-table a{ color:var(--rg-pink); font-weight:500; }

/* ---- Status pill ---- */
.status-pill{ display:inline-block; padding:4px 12px; border-radius:99px; background:#ffe6f1; color:var(--rg-pink-deep); font-size:12px; font-weight:600; }

/* ---- About / Contact ---- */
.text-block{ background:#fff; border-radius:24px; padding:40px; box-shadow:var(--rg-shadow-card); border:1px solid var(--rg-border); }
.text-block p{ color:var(--rg-ink-soft); font-size:16px; line-height:1.7; }

/* ===========================================================
   === MOBILE OPTIMIZATIONS ===
   iPhone 16e (390x844, notch, safe-areas) + Android (360x800, 412x915)
   Mobile-first overrides. Trabaja sobre Mioca + base Rainbow Glam.
   =========================================================== */

/* ---- Globales ---- */
html, body{
  overflow-x:hidden;
  -webkit-text-size-adjust:100%;
  text-size-adjust:100%;
}
*, *::before, *::after{ -webkit-tap-highlight-color:rgba(255,79,163,.15); }
img, video, iframe{ max-width:100%; height:auto; }
body.rg-no-scroll{ overflow:hidden; touch-action:none; }

/* Safe areas iPhone (notch / home indicator) */
.rg-header,
main,
.site-footer,
.topbar{
  padding-left:max(16px, env(safe-area-inset-left));
  padding-right:max(16px, env(safe-area-inset-right));
}
.rg-header{ padding-top:env(safe-area-inset-top); }
.site-footer{ padding-bottom:env(safe-area-inset-bottom); }
@supports (padding: env(safe-area-inset-top)){
  .rg-header > .container{ padding-left:0; padding-right:0; }
  main > .container, .topbar > .container, .site-footer > .container{ padding-left:0; padding-right:0; }
}

/* ---- Hamburger / mobile tools (default oculto en desktop) ---- */
.rg-burger{ display:none; }
.rg-hide-mobile{ display:inline-flex; }

/* ---- Off-canvas mobile menu ---- */
.rg-mobile-overlay{
  position:fixed; inset:0;
  background:rgba(45,26,58,.55);
  opacity:0; pointer-events:none;
  transition:opacity .25s ease;
  z-index:1090;
}
.rg-mobile-overlay.is-open{ opacity:1; pointer-events:auto; }
.rg-mobile-menu{
  position:fixed; top:0; left:0;
  width:min(86vw, 340px); height:100vh; height:100dvh;
  background:#fff;
  z-index:1100;
  transform:translateX(-105%);
  transition:transform .3s cubic-bezier(.22,1,.36,1);
  box-shadow:6px 0 24px rgba(45,26,58,.18);
  display:flex; flex-direction:column;
  padding:env(safe-area-inset-top) 0 env(safe-area-inset-bottom);
  overflow-y:auto; -webkit-overflow-scrolling:touch;
}
.rg-mobile-menu.is-open{ transform:translateX(0); }
.rg-mobile-menu-head{
  display:flex; align-items:center; justify-content:space-between;
  padding:18px 18px 14px;
  border-bottom:1px solid var(--rg-border);
}
.rg-mobile-menu-head .brand-text{ color:var(--rg-ink); }
.rg-mobile-menu-head .icon-btn{
  width:44px; height:44px; border-radius:50%; background:#fdf0f7;
  color:var(--rg-pink); border:none; display:inline-flex;
  align-items:center; justify-content:center; cursor:pointer; font-size:18px;
}
.rg-mobile-nav{ display:flex; flex-direction:column; padding:10px 10px 24px; }
.rg-mobile-nav a,
.rg-mobile-nav .rg-mobile-logout{
  display:flex; align-items:center; gap:12px;
  padding:14px 16px;
  color:var(--rg-ink) !important;
  text-decoration:none;
  font-weight:500;
  font-size:16px;
  border-radius:12px;
  min-height:48px;
  background:transparent;
  border:none;
  width:100%;
  text-align:left;
  cursor:pointer;
  font-family:'Poppins',sans-serif;
}
.rg-mobile-nav a i{ color:var(--rg-pink); width:20px; text-align:center; }
.rg-mobile-nav a.active{
  background:var(--rg-gradient-pink); color:#fff !important;
}
.rg-mobile-nav a.active i{ color:#fff; }
.rg-mobile-nav a:hover{ background:#fdf0f7; }

.rg-mobile-submenu{ display:flex; flex-direction:column; }
.rg-mobile-sublabel{
  display:flex; align-items:center; justify-content:space-between;
  padding:14px 16px; border:none; background:transparent;
  color:var(--rg-ink); font-weight:500; font-size:16px;
  cursor:pointer; min-height:48px; border-radius:12px;
  font-family:'Poppins',sans-serif;
}
.rg-mobile-sublabel > span{ display:flex; align-items:center; gap:12px; }
.rg-mobile-sublabel i:first-child{ color:var(--rg-pink); }
.rg-chev{ transition:transform .2s; font-size:12px; color:var(--rg-ink-soft); }
.rg-mobile-submenu.is-expanded .rg-chev{ transform:rotate(180deg); }
.rg-mobile-sublist{
  max-height:0; overflow:hidden; transition:max-height .3s ease;
  padding-left:34px;
}
.rg-mobile-submenu.is-expanded .rg-mobile-sublist{ max-height:600px; }
.rg-mobile-sublist a{
  padding:11px 14px; font-size:15px; min-height:44px;
  color:var(--rg-ink-soft) !important;
}

/* ---- Filtros drawer (shop) ---- */
.rg-filters-trigger{ display:none; }
.rg-filters-overlay{
  position:fixed; inset:0; background:rgba(45,26,58,.55);
  opacity:0; pointer-events:none; transition:opacity .25s;
  z-index:1080;
}
.rg-filters-overlay.is-open{ opacity:1; pointer-events:auto; }
.rg-filters-close{ display:none; }

/* ===========================================================
   <= 991px  — tablet & móvil grande
   =========================================================== */
@media (max-width: 991px){
  /* Tipografía base */
  body{ font-size:15px; }

  /* Header */
  .rg-header-inner{ gap:12px; padding:10px 0; }
  .rg-nav{ display:none; }
  .rg-burger{
    display:inline-flex; align-items:center; justify-content:center;
    width:44px; height:44px; border-radius:50%;
    font-size:20px; color:var(--rg-ink); background:transparent;
    border:none; cursor:pointer;
  }
  .rg-burger:hover{ background:#fdf0f7; color:var(--rg-pink); }
  .rg-header .brand{ gap:8px; }
  .rg-header .brand img{ width:42px; height:42px; }
  .rg-header .brand-text{ font-size:18px; }
  .rg-header .brand-text small{ font-size:9px; letter-spacing:1.5px; }
  .rg-tools{ margin-left:auto; gap:2px; }
  .rg-tools .icon-btn{ width:44px; height:44px; font-size:18px; }
  .rg-hide-mobile{ display:none !important; }

  /* Hero */
  .hero, .slider-area, .home-slider, .hero-area{ padding:50px 0; }
  .hero h1{ font-size:clamp(1.8rem, 7vw, 2.6rem); line-height:1.15; }
  .hero p{ font-size:16px; }
  .rainbow-orb{ width:260px; height:260px; }

  /* Sections */
  .section, section.section{ padding:48px 0; }
  .section-title h2, .section-head h2,
  .breadcrumb-area h1, .breadcrumb-area h2{ font-size:clamp(1.6rem, 6vw, 2.2rem); line-height:1.2; }

  /* Product grid */
  .product-grid{ grid-template-columns:repeat(3, 1fr); gap:18px; }

  /* Shop filters → drawer */
  .rg-filters-trigger{
    display:inline-flex; align-items:center; gap:8px;
    margin-bottom:18px; min-height:44px;
  }
  .shop-filters.rg-filters-drawer{
    position:fixed; top:0; right:0;
    width:min(92vw, 380px); height:100vh; height:100dvh;
    background:#fff;
    z-index:1090;
    transform:translateX(105%);
    transition:transform .3s cubic-bezier(.22,1,.36,1);
    box-shadow:-6px 0 24px rgba(45,26,58,.18);
    flex-direction:column; flex-wrap:nowrap;
    align-items:stretch;
    gap:14px; padding:24px 18px;
    border-radius:0;
    overflow-y:auto;
    margin-bottom:0;
    padding-top:max(24px, env(safe-area-inset-top));
    padding-bottom:max(24px, env(safe-area-inset-bottom));
  }
  .shop-filters.rg-filters-drawer.is-open{ transform:translateX(0); }
  .shop-filters.rg-filters-drawer > *{ width:100%; min-width:0; flex:none; }
  .rg-filters-close{
    display:inline-flex; align-items:center; justify-content:center;
    position:absolute; top:14px; right:14px;
    width:40px; height:40px;
    background:#fdf0f7 !important; color:var(--rg-pink) !important;
    border-radius:50%;
  }

  /* Account grid */
  .account-grid{ grid-template-columns:1fr; }
  .account-sidebar{ padding:14px; overflow-x:auto; }
  .account-sidebar{ display:flex; flex-direction:row; gap:6px; }
  .account-sidebar a{ flex:0 0 auto; white-space:nowrap; margin-bottom:0; padding:10px 14px; }

  /* Footer */
  .footer-grid{ grid-template-columns:repeat(2,1fr); gap:24px; }
}

/* ===========================================================
   <= 767px  — móvil estándar (iPhone 16e, Pixel 8)
   =========================================================== */
@media (max-width: 767px){
  body{ font-size:15px; }

  /* Topbar: reduce a 1 mensaje, font menor */
  .topbar{ font-size:11.5px; padding:6px 0 !important; }
  .topbar .container{ gap:10px !important; }
  .topbar span:not(:first-child){ display:none; }

  /* Container padding más generoso */
  .container{ padding:0 14px; }

  /* Hero */
  .hero, .slider-area, .home-slider, .hero-area{ padding:40px 0; }
  .hero-art{ min-height:200px; }
  .rainbow-orb{ width:200px; height:200px; }
  .sparkle{ font-size:14px !important; }
  .sparkle.s2, .sparkle.s4{ font-size:16px !important; }

  /* Section titles */
  .section-title, .section-head{ margin-bottom:28px; }

  /* Product grid → 2 columnas */
  .product-grid{ grid-template-columns:repeat(2,1fr); gap:14px; }
  .product-card .product-info, .single-product .product-content{ padding:12px 12px 14px !important; }
  .product-card h3, .single-product h3, .product-card .product-title, .single-product .product-name{
    font-size:14px !important; margin:6px 0;
  }
  .product-card .product-cat, .single-product .product-cat{ font-size:10.5px; }
  .product-card .product-price, .single-product .product-price, .price-box{ font-size:15px !important; }
  .price-compare, .old-price{ font-size:12px !important; }
  .product-badge{ font-size:9.5px; padding:3px 8px; top:8px; left:8px; }

  /* Categorias grid */
  .cat-grid{ grid-template-columns:repeat(2,1fr); gap:12px; }
  .cat-card{ padding:22px 12px; font-size:17px; }

  /* Newsletter */
  .newsletter-area, .newsletter-section{ padding:40px 0; }

  /* Breadcrumb */
  .breadcrumb-area, .page-breadcrumb{ padding:22px 0; }

  /* Producto detalle */
  .product-show-grid{ grid-template-columns:1fr; gap:24px; }
  .product-detail h1{ font-size:28px; line-height:1.15; }
  .product-detail .product-price{ font-size:24px; }
  .product-gallery img{ border-radius:18px; }
  /* Sticky buy bar */
  .rg-product-actions{ display:none !important; }
  .rg-mobile-buy-bar{
    display:flex; align-items:center; justify-content:space-between; gap:12px;
    position:fixed; left:0; right:0; bottom:0;
    background:#fff;
    padding:12px 16px;
    padding-bottom:calc(12px + env(safe-area-inset-bottom));
    border-top:1px solid var(--rg-border);
    box-shadow:0 -8px 24px rgba(45,26,58,.12);
    z-index:80;
  }
  .rg-mobile-buy-bar .btn{ flex:1; min-height:48px; }
  .rg-mobile-buy-price{ font-weight:700; color:var(--rg-pink); font-size:18px; white-space:nowrap; }
  .product-show.section{ padding-bottom:120px; }

  /* Cart: tabla → cards */
  .rg-cart-table thead{ display:none; }
  .rg-cart-table, .rg-cart-table tbody, .rg-cart-table tr, .rg-cart-table td{
    display:block; width:100%; box-sizing:border-box;
  }
  .rg-cart-table{ background:transparent; border:none; box-shadow:none; }
  .rg-cart-table tr{
    background:#fff; border:1px solid var(--rg-border); border-radius:16px;
    margin-bottom:14px; padding:14px; box-shadow:var(--rg-shadow-card);
  }
  .rg-cart-table td{
    padding:8px 0 !important; border:none !important;
    display:flex; align-items:center; justify-content:space-between;
    gap:12px;
  }
  .rg-cart-table td:first-child{ justify-content:flex-start; }
  .rg-cart-table td:nth-child(2)::before{ content:"Precio"; color:var(--rg-ink-soft); font-size:12px; font-weight:500; }
  .rg-cart-table td:nth-child(3)::before{ content:"Cantidad"; color:var(--rg-ink-soft); font-size:12px; font-weight:500; }
  .rg-cart-table td:nth-child(4)::before{ content:"Total"; color:var(--rg-ink-soft); font-size:12px; font-weight:500; }
  .rg-cart-table td:last-child{ justify-content:flex-end; }

  .rg-grid-cart{ grid-template-columns:1fr !important; gap:18px; }
  .cart-summary{ padding:18px; }

  /* Checkout / forms */
  .rg-grid-checkout{ grid-template-columns:1fr !important; }

  /* Auth */
  .rg-auth{ padding:24px 14px; min-height:auto; }
  .rg-auth-card{ padding:28px 22px; border-radius:20px; }
  .rg-auth-card h1{ font-size:26px; }

  /* Footer */
  .footer-grid{ grid-template-columns:repeat(2,1fr); padding-bottom:24px; gap:18px; }
  footer, .footer-area, .site-footer{ padding:40px 0 0; }
  .site-footer h4, footer h4{ font-size:19px; margin-bottom:12px; }

  /* Section title h2 más compacto */
  .section-title h2, .section-head h2{ font-size:1.9rem; }

  /* Pagination tap targets */
  .pagination a, .pagination span{ min-width:44px; height:44px; padding:0 12px; }
}

/* ===========================================================
   <= 480px  — móvil pequeño (Android 360, iPhone SE)
   =========================================================== */
@media (max-width: 480px){
  .container{ padding:0 12px; }
  .rg-header .brand-text small{ display:none; }
  .rg-header .brand-text{ font-size:17px; }

  .product-grid{ gap:12px; }
  .product-card .product-info, .single-product .product-content{ padding:10px !important; }
  .product-card .btn, .single-product .btn{ padding:8px 10px !important; font-size:12px !important; }

  .hero h1{ font-size:clamp(1.6rem, 8.5vw, 2rem); }
  .hero p{ font-size:15px; }

  .footer-grid{ grid-template-columns:1fr; }
  .site-footer .copyright{ font-size:12px; }

  .product-detail h1{ font-size:24px; }
  .product-detail .product-price{ font-size:22px; }

  .cat-grid{ grid-template-columns:repeat(2,1fr); }
  .cat-card{ font-size:15px; padding:18px 10px; }

  .breadcrumb-area, .page-breadcrumb{ padding:18px 0; }
  .breadcrumb-area h1{ font-size:22px; }
}

/* ===========================================================
   Inputs iOS: evitar zoom al enfocar (font-size >= 16px)
   =========================================================== */
@media (max-width: 991px){
  input[type=text],
  input[type=email],
  input[type=password],
  input[type=number],
  input[type=search],
  input[type=tel],
  input[type=url],
  input[type=date],
  select,
  textarea{
    font-size:16px !important;
    padding:12px 14px !important;
    min-height:48px;
  }
  textarea{ min-height:96px; }
  label{ font-size:14px; }
  .btn, button.btn{ min-height:44px; padding:12px 22px !important; }
  .btn-sm{ min-height:38px; padding:9px 16px !important; font-size:13px !important; }
  .qty-control input{ font-size:16px !important; min-height:auto; }
  .qty-control button{ min-width:36px; min-height:36px; }
  .icon-btn{ min-width:44px; min-height:44px; }
}

/* ===========================================================
   Admin sidebar collapse en móvil (cobertura mínima)
   =========================================================== */
@media (max-width: 991px){
  .admin-layout, .admin-wrapper{ grid-template-columns:1fr !important; }
  .admin-sidebar{ position:static !important; width:100% !important; overflow-x:auto; }
  .admin-sidebar nav{ display:flex; flex-wrap:nowrap; gap:6px; }
  .admin-sidebar nav a{ white-space:nowrap; }
}
