:root{--tt-admin-action-bg:var(--tt-accent);--tt-admin-action-fg:#FFFFFF;--tt-admin-action-border:var(--tt-accent);--tt-admin-action-icon-bg:rgba(255,255,255,.18)}.tt-account-header{display:flex!important;align-items:center!important;gap:10px!important}.tt-account-header span{overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important}.tt-account-panel-avatar{width:32px!important;height:32px!important;max-width:none!important;max-height:none!important;border-radius:50%!important;object-fit:cover!important;flex-shrink:0!important;display:block!important}.tt-mobile-user-photo{width:100%!important;height:100%!important;max-width:none!important;max-height:none!important;object-fit:cover!important;display:block!important;flex-shrink:0!important}.tt-mobile-user-profile-static{pointer-events:none!important}.tt-mobile-user-admin{background:var(--tt-admin-action-bg)!important;background-color:var(--tt-admin-action-bg)!important;color:var(--tt-admin-action-fg)!important;border-color:var(--tt-admin-action-border)!important}.tt-mobile-user-admin *{color:var(--tt-admin-action-fg)!important}.tt-mobile-user-admin-icon{display:grid!important;place-items:center!important;width:26px!important;height:26px!important;border-radius:50%!important;background:var(--tt-admin-action-icon-bg)!important;flex:0 0 auto!important}.ck-trust-item{color:var(--tt-text)!important}.ck-trust-item svg,.tt-themed-vector{stroke:currentColor!important;color:var(--tt-accent)!important}.ck-trust-item:first-child svg{color:var(--tt-accent)!important}svg[stroke="#4caf50"],svg[stroke="#b84c72"],svg[stroke="#B84C72"],svg[stroke="#D46A8A"],svg[stroke="#F6B7C8"],svg[stroke="#2B2B2B"],svg[stroke="#7B6F72"]{stroke:currentColor!important;color:var(--tt-accent)!important}[style*="#2B2B2B"],[style*="#7B6F72"],[style*="#D46A8A"],[style*="#F6B7C8"],[style*="#B84C72"],[style*="#b84c72"],[style*="#4caf50"]{--tt-inline-color-cleaned:1}

/* Fondos sólidos obligatorios en la navegación pública. El esquema global
   puede personalizar colores, pero no convertir el header ni cookies en capas
   transparentes que dejen ver la fotografía del hero por detrás. */
html body:not(:has(.adm-main)) #tt-header-desktop-tablet.tt-header,
html body:not(:has(.adm-main)) #tt-header-desktop-tablet.tt-header.scrolled{
  background:#FFFFFF!important;
  background-color:#FFFFFF!important;
  opacity:1!important;
  filter:none!important;
  mix-blend-mode:normal!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
  border-bottom:1px solid #F1E4E7!important;
  box-shadow:0 2px 18px rgba(173,63,103,.10)!important;
}
html body:not(:has(.adm-main)) #tt-privacy-consent.tt-privacy-consent{
  background:#FFFFFF!important;
  background-color:#FFFFFF!important;
  opacity:1!important;
  filter:none!important;
  mix-blend-mode:normal!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
  isolation:isolate!important;
  border:1px solid rgba(173,63,103,.12)!important;
  box-shadow:0 24px 64px rgba(38,24,30,.14),0 2px 8px rgba(38,24,30,.05)!important;
}
html body:not(:has(.adm-main)) #tt-privacy-consent .tt-privacy-btn-primary{
  background:var(--tt-accent,#AD3F67)!important;
  background-color:var(--tt-accent,#AD3F67)!important;
  border:1px solid var(--tt-accent,#AD3F67)!important;
  color:#FFFFFF!important;
  opacity:1!important;
}
html body:not(:has(.adm-main)) #tt-privacy-consent .tt-privacy-btn-primary *{color:#FFFFFF!important}
html body:not(:has(.adm-main)) #tt-privacy-consent .tt-privacy-btn-secondary{
  background:#FFFFFF!important;
  background-color:#FFFFFF!important;
  border:1px solid var(--tt-accent,#AD3F67)!important;
  color:var(--tt-accent,#AD3F67)!important;
  opacity:1!important;
}

/* El botón TIENDA es un <button>, no un enlace. Sin esta regla heredaba el
   negro global de los botones, mientras INICIO/NOSOTROS/CONTACTO usan el
   color de enlace de la marca. La flecha es texto y adopta el mismo color. */
#btn-tienda,
#btn-mobile-tienda{
  color:var(--tt-accent,#AD3F67)!important;
}
.tt-header.scrolled #btn-tienda,
#btn-tienda:hover,
#btn-tienda[aria-expanded="true"],
#btn-mobile-tienda:hover,
#btn-mobile-tienda[aria-expanded="true"]{
  color:var(--tt-accent,#AD3F67)!important;
}

/* Parte 2A: los dos flotantes usan lados opuestos en mobile para no pisarse. */
@media (max-width:768px){
  body.tt-public-shell-mounted:not(:has(.adm-main)) .tt-back-to-top{
    left:16px!important;
    right:auto!important;
    bottom:calc(var(--tt-mobile-nav-clearance,104px) + env(safe-area-inset-bottom,0px))!important;
  }
}

/* En 320–360px cuatro columnas comprimen las etiquetas del sheet de Tienda.
   Tres columnas flexibles conservan imagen, texto y botón dentro del panel. */
@media (max-width:360px){
  body.tt-public-shell-mounted:not(:has(.adm-main)) .tt-collections-sheet{
    overflow-x:hidden!important;
  }
  body.tt-public-shell-mounted:not(:has(.adm-main)) .tt-sheet-grid{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
  }
  body.tt-public-shell-mounted:not(:has(.adm-main)) .tt-sheet-item{
    min-width:0!important;
    overflow-wrap:anywhere;
  }
  body.tt-public-shell-mounted:not(:has(.adm-main)) .tt-sheet-footer :is(.tt-btn,a,button){
    width:100%;
    max-width:100%;
    white-space:normal;
    text-align:center;
  }
}