/* Glowtto · regreso a la identidad visual del Sistema P&L (2026-10-25).
 * Fuente: glowtto_estado_resultados.html.
 * Capa de tema: NO altera imágenes, jerarquía de campañas, reglas de negocio,
 * dimensiones internas de los iconos corregidos ni funciones del panel.
 */
:root {
  --pnl-purple: #7138ce;
  --pnl-purple-dark: #422080;
  --pnl-purple-soft: #f3edff;
  --pnl-pink: #e84598;
  --pnl-ink: #241a3f;
  --pnl-muted: #78718b;
  --pnl-line: #e9e4f1;
  --pnl-paper: #f8f6fc;
  --pnl-shadow: 0 12px 34px rgba(67,32,102,.065);
  --pnl-gradient: linear-gradient(112deg,#47218d 0%,#7138ce 58%,#bc50b4 100%);

  /* Alias para componentes ya existentes; no sobreescribir colores del logo. */
  --purple: var(--pnl-purple);
  --purple-dark: var(--pnl-purple-dark);
  --lavender: #e5d8fa;
  --pink: var(--pnl-pink);
  --palepink: #f8eefb;
  --light: #fff;
  --ink: var(--pnl-ink);
  --muted: var(--pnl-muted);
  --border: var(--pnl-line);
  --shadow: var(--pnl-shadow);
}
html{background:var(--pnl-paper)}
body{background:var(--pnl-paper)!important;color:var(--pnl-ink);font-family:'Poppins',system-ui,sans-serif}
:where(button,a,input,textarea,select,[tabindex]):focus-visible{
  outline:3px solid #ad8bf0!important;
  outline-offset:3px;
}

/* Identidad reconocible del P&L sin oscurecer el logotipo oficial negro. */
header{
  background:linear-gradient(110deg,rgba(255,255,255,.99) 0%,#fbf8ff 55%,#f2eaff 100%)!important;
  border-bottom:1px solid var(--pnl-line)!important;
  box-shadow:0 5px 22px rgba(56,24,99,.07);
}
header::after{
  content:"";position:absolute;bottom:0;left:0;right:0;height:3px;
  background:var(--pnl-gradient);pointer-events:none;
}
.head-actions button:not(.brand){color:var(--pnl-purple-dark)!important}
.head-actions button:hover,.ghost:hover{background:#eee7fc!important}
.head-actions .cart-trigger{
  background:#f0e7ff!important;color:var(--pnl-purple-dark)!important;
  border:1px solid #ddcdf7!important;
  box-shadow:0 4px 12px rgba(86,43,146,.09)!important;
}
.cart-trigger b,.order-unread-count{background:var(--pnl-pink)!important;color:#fff!important}
.testbar{background:var(--pnl-gradient)!important;color:#fff!important}
main{color:var(--pnl-ink)}

/* Buscador + navegación: tarjeta de bienvenida inspirada en el hero P&L. */
#shopView{
  --ys-rose:var(--pnl-purple);
  --ys-ink:var(--pnl-ink);
  --ys-line:var(--pnl-line);
  --ys-paper:#fff;
}
#shopView .ys-discover-head{
  position:relative;isolation:isolate;overflow:hidden;
  padding:clamp(14px,2.5vw,24px);border-radius:22px;
  background:var(--pnl-gradient);box-shadow:0 15px 35px rgba(86,42,151,.18);
  border:1px solid rgba(255,255,255,.22);
}
#shopView .ys-discover-head::before,
#shopView .ys-discover-head::after{
  content:"";position:absolute;pointer-events:none;z-index:-1;
  width:210px;height:210px;border-radius:50%;
  border:1px solid rgba(255,255,255,.15);
}
#shopView .ys-discover-head::before{right:-72px;top:-140px}
#shopView .ys-discover-head::after{left:45%;bottom:-184px}
#shopView .ys-quick-search{
  position:relative;z-index:1;
  background:#fff!important;border:1px solid #f3ebff!important;
  border-radius:14px!important;
  box-shadow:0 10px 25px rgba(26,11,60,.1)!important;
}
#shopView .ys-quick-search input{color:var(--pnl-ink)!important}
#shopView .ys-quick-search input::placeholder{color:#837691}
#shopView .ys-quick-search .g-icon{flex-shrink:0}
#shopView .ys-quick-search button{
  background:var(--pnl-purple)!important;color:#fff!important;
  border-radius:11px!important;border:0;
}
#shopView .ys-quick-search button:hover{background:var(--pnl-purple-dark)!important}
#shopView .ys-shop-nav{position:relative;z-index:1;gap:8px}
#shopView .ys-shop-nav button{
  background:rgba(255,255,255,.15)!important;
  color:#fff!important;border:1px solid rgba(255,255,255,.36)!important;
  border-radius:999px;box-shadow:none!important;
  backdrop-filter:blur(8px);
}
#shopView .ys-shop-nav button:hover,
#shopView .ys-shop-nav button[aria-current="page"],
#shopView .ys-shop-nav button.active{
  background:#fff!important;color:var(--pnl-purple-dark)!important;
  border-color:#fff!important;
}
#shopView .ys-service-note{
  background:#f3edff!important;color:#5f398c!important;
  border:1px solid #e5d9f6!important;border-radius:14px;
}
#shopView .ys-service-note span+span{border-color:#d9c8f2}

/* ¡No cambiar fondo, imagen, textos, promociones o animaciones de banners!
 * Solo su marco, botones de interfaz y énfasis visual del sitio. */
#shopView .hero.hero-carousel{
  border:1px solid #e4d7f5!important;
  border-radius:23px!important;
  box-shadow:0 14px 36px rgba(83,44,138,.12)!important;
}
#shopView .hero-carousel .hero-feature-link{color:var(--pnl-purple)!important}
#shopView .hero-carousel .hero-price-inline{color:#8c2ca0}
#shopView .hero-carousel .hero-arrow,
#shopView .top-carousel .top-carousel-arrow{
  color:var(--pnl-purple)!important;background:#fff!important;
  border:1px solid #d8c3f1!important;
}
#shopView .hero-carousel .hero-dots button.is-active,
#shopView .top-section .dots button.selected{background:var(--pnl-purple)!important}

/* Titulares y fichas con el lenguaje de métricas/tarjetas del P&L. */
#shopView .ys-heading small,#shopView .eyebrow,
#shopView .top-section .section-heading small{color:var(--pnl-purple)!important}
#shopView .ys-heading h2,#shopView .section-heading h2,
#shopView .catalog-top h2{color:var(--pnl-ink)!important;letter-spacing:-.035em}
#shopView .ys-more-link{color:var(--pnl-purple)!important}
#shopView .ys-category-card{
  background:#fff!important;border:1px solid var(--pnl-line)!important;
  border-radius:19px!important;
  box-shadow:var(--pnl-shadow)!important;
}
#shopView .ys-category-card:hover{
  border-color:#c9b3f2!important;
  box-shadow:0 13px 28px rgba(93,48,156,.14)!important;
}
#shopView .ys-category-image{
  background:linear-gradient(145deg,#fcf9ff,#f1eaff)!important;
  border-radius:14px!important;
}
#shopView .ys-category-card strong{color:#3f265c!important}
#shopView .ys-category-card small{color:var(--pnl-muted)!important}
#shopView .ys-category-label-icon,
#shopView .ys-category-label-icon .g-icon{max-width:24px;max-height:24px}
#shopView .ys-product,
#shopView .products .product{
  background:#fff!important;border:1px solid var(--pnl-line)!important;
  border-radius:18px!important;
  box-shadow:var(--pnl-shadow)!important;
}
#shopView .ys-product-visual,
#shopView .product .image{
  background:#faf7ff!important;
}
#shopView .ys-product-name,#shopView .product-body h3{color:var(--pnl-ink)!important}
#shopView .ys-product-details strong,#shopView .ys-product-link,
#shopView .product .price{color:var(--pnl-purple)!important}
#shopView .ys-product-details small,#shopView .product-body .category{color:#806697!important}
#shopView .ys-discount,.disc-tag{
  background:linear-gradient(112deg,var(--pnl-purple),var(--pnl-pink))!important;color:#fff!important;
}
#shopView .ys-rail-controls button{background:#fff!important;color:var(--pnl-purple)!important;border-color:#e0d1f4!important}
#shopView .category-pills button{border-color:#e5dbf3!important;color:#5d4680!important;background:#fff!important}
#shopView .category-pills button.active{background:#eee5ff!important;color:#50209e!important;border-color:#bd9eed!important}

/* Acciones, formularios y paneles de cliente/administración. */
.primary{
  background:var(--pnl-gradient)!important;color:#fff!important;
  border:1px solid transparent!important;border-radius:12px!important;
  box-shadow:0 7px 19px rgba(100,47,173,.17)!important;
}
.primary:hover{filter:brightness(1.06)!important}
.secondary{
  background:#fff!important;color:var(--pnl-purple)!important;
  border:1px solid #d9c7ef!important;border-radius:12px!important;
}
.secondary:hover{background:#f5efff!important}
.panel,.line-card,.stat-card,.fragrance-card{
  background:#fff!important;border-color:var(--pnl-line)!important;
  box-shadow:var(--pnl-shadow)!important;
}
.panel{border-radius:18px!important}
.line-card{border-radius:13px}
.stat-card{background:#f8f4ff!important}
.stat-card strong{color:var(--pnl-purple-dark)}
.tabs button,.admin-tabs button{
  color:#5d4680!important;background:#fff!important;
  border:1px solid var(--pnl-line)!important;border-radius:11px!important;
}
.tabs button.selected,.admin-tabs button.selected{
  color:var(--pnl-purple-dark)!important;
  background:#eee5ff!important;border-color:#cbb0f5!important;
  box-shadow:0 0 0 1px #d4c1ee;
}
.page-title h1,.page-title h2{color:var(--pnl-ink)!important}
.eyebrow{color:var(--pnl-purple)!important}
input:focus,textarea:focus,select:focus{
  outline:2px solid #c4b5fd!important;border-color:var(--pnl-purple)!important;
}
#adminView>.page-title{
  padding:24px 27px;margin:20px 0 21px;
  border-radius:21px;background:var(--pnl-gradient);
  box-shadow:0 14px 31px rgba(95,45,161,.16);
}
#adminView>.page-title h1,
#adminView>.page-title p,
#adminView>.page-title .eyebrow{color:#fff!important}
#adminView>.page-title .eyebrow{color:#ead6ff!important}
.pnl-hero{background:var(--pnl-gradient)!important}
.pnl-metric.net{background:linear-gradient(118deg,#5f2eae,#9b46be)!important}
#cartView>.page-title,#accountView>.page-title{border-bottom:1px solid var(--pnl-line)}

/* Pie de página y navegación móvil, iconos v2 sin recolorear. */
footer{background:#f1ebfb!important;border-top:1px solid #ded0ee!important;color:#665879!important}
footer strong{color:var(--pnl-purple-dark)!important}
.mobile-bottom{
  background:rgba(255,255,255,.97)!important;
  border-top:1px solid #dfd2ef!important;
  box-shadow:0 -6px 23px rgba(66,32,128,.075);
  backdrop-filter:blur(14px);
}
.mobile-bottom button{color:#6c528d!important}
.mobile-bottom button[data-view="shop"],.mobile-bottom button[aria-current="page"]{
  color:var(--pnl-purple)!important;
}
.mobile-bottom .g-icon,.head-actions .g-icon{
  /* Conservar escala, transparencia y cromatismo propio del paquete v2. */
  filter:none!important;
}
.glow-help-launcher{
  background:var(--pnl-gradient)!important;color:#fff!important;
  border:1px solid rgba(255,255,255,.26)!important;
  box-shadow:0 9px 22px rgba(95,47,160,.22)!important;
}
.glow-help-dialog .glow-help-sheet{border-color:var(--pnl-line)!important}
:where(.panel,.product,.ys-category-card,.ys-product) :where(button,a):focus-visible{
  outline-color:var(--pnl-purple)!important;
}

/* Respeta el diseño y los tamaños de la pantalla, sin volver a saturar el móvil. */
@media(max-width:750px){
  #shopView .ys-discover-head{border-radius:17px;padding:13px 12px;margin-top:11px}
  #shopView .ys-shop-nav{gap:5px}
  #shopView .ys-shop-nav button{font-size:10px;min-height:34px;padding:7px 10px}
  #shopView .ys-quick-search{min-height:48px!important;padding-left:12px!important}
  #shopView .ys-quick-search button{min-height:35px;padding:0 13px}
  #shopView .ys-service-note{
    margin-top:11px;display:flex;flex-wrap:wrap;
    justify-content:center;align-items:center;
    gap:5px 12px;padding:10px 12px;
    overflow:visible;min-width:0;
  }
  #shopView .ys-service-note span{
    white-space:normal;line-height:1.4;
    max-width:100%;overflow-wrap:break-word;text-align:center;
  }
  #shopView .ys-service-note span+span{
    border-left:0;padding-left:0;
  }
  #shopView .ys-category-grid{gap:10px}
  #shopView .ys-category-card{border-radius:16px!important}
  #shopView .hero.hero-carousel{border-radius:18px!important}
  #adminView>.page-title{padding:18px 17px;margin:13px 0 16px;border-radius:16px}
}
@media(max-width:390px){
  #shopView .ys-discover-head{padding:11px 9px}
  #shopView .ys-quick-search input{font-size:12px!important}
  #shopView .ys-shop-nav button{padding-inline:8px}
  #shopView .ys-category-grid{gap:8px}
}
@media(prefers-reduced-motion:reduce){
  #shopView .ys-category-card,.primary{transition:none!important}
}