/* axtlan.mx - shop layer (release 20261007): top bar, shop menu, deals strip, footer share line, holiday effects.
   Ported from shop.axtlan.mx (axtlan_holiday top bar, ax-explore menu, rotation deals, share line, rotation-fx). */


/* ---- top bars = shop header group: announcement (deals) bar, then the YouTube bar (axtlan-holiday-bar).
   In normal page flow at the very top; they scroll away with the page like on the shop (no fade, no slide).
   The floating header rail starts below them and follows them up until it reaches the top (--ax-bars-offset, JS). ---- */
:root { --ax-bars-offset: 0px; }
.ax-bars { position: relative; z-index: 60; }
.ax-ann {
  display: flex; align-items: center; justify-content: center; gap: .6rem;
  min-block-size: 34px; padding: .45rem max(1rem, 4vw);
  background: #120d09; border-block-end: 1px solid rgb(255 255 255 / .06);
  color: #e3a45a; font-family: "Axtlan Soles", sans-serif; font-size: .7rem; letter-spacing: .14em; text-transform: uppercase;
  text-align: center; text-decoration: none;
}
.ax-ann:is(:hover, :focus-visible) { color: var(--orange-hot); }
.ax-ann i { font-style: normal; }
.ax-topbar {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: .55rem .9rem;
  min-block-size: 40px; padding: .4rem max(1rem, 4vw);
  background: #0d0b09; border-block-end: 1px solid rgb(255 106 36 / .35);
  color: var(--paper); font-size: .8rem; line-height: 1.3;
}
html.ax-has-topbar :is(.site-header, .site-header.is-compact) { inset-block-start: calc(.65rem + var(--ax-bars-offset)); }
html.ax-has-topbar .main-navigation { inset-block-start: calc(.65rem + var(--ax-bars-offset)); }
@media (max-width: 1279px) {
  html.ax-has-topbar :is(.site-header, .site-header.is-compact) { inset-block-start: calc(.5rem + var(--ax-bars-offset)); }
  html.ax-has-topbar .main-navigation { inset-block-start: calc(var(--nav-drawer-top) + var(--ax-bars-offset)); }
}
@media (max-width: 620px) {
  html.ax-has-topbar :is(.site-header, .site-header.is-compact) { inset-block-start: calc(.4rem + var(--ax-bars-offset)); }
  .ax-ann { font-size: .62rem; letter-spacing: .08em; }
}

/* ---- shop menu in the main navigation (same groups as the shop's Explore menu) ---- */
.ax-shopnav { position: relative; }
.ax-shopnav > summary {
  display: inline-flex; align-items: center; gap: .55rem; padding: .5rem .85rem;
  border: 1px solid rgb(255 133 65 / .32); list-style: none; cursor: pointer; color: inherit;
  font-family: "Axtlan Soles", sans-serif; font-size: .74rem; letter-spacing: .14em; text-transform: uppercase;
}
.ax-shopnav > summary::-webkit-details-marker { display: none; }
.ax-shopnav > summary::before { content: "≡"; color: var(--orange); font-size: 1.1em; }
.ax-shopnav > summary span { text-decoration: underline; text-underline-offset: .25em; }
.ax-shopnav[open] > summary, .ax-shopnav > summary:is(:hover, :focus-visible) { border-color: var(--orange); background: rgb(255 106 36 / .12); }
.ax-shopnav__panel {
  position: fixed;
  z-index: 130;
  inset-block-start: calc(5.2rem + var(--ax-bars-offset, 0px));
  inset-inline-end: max(1rem, 4vw);
  display: grid;
  grid-template-columns: repeat(4, minmax(10rem, 1fr));
  gap: 1.4rem 2rem;
  inline-size: min(64rem, 92vw);
  max-block-size: calc(100vh - 7rem);
  overflow: auto;
  padding: 1.6rem 1.8rem;
  border: 1px solid var(--line);
  background: linear-gradient(160deg, rgb(28 18 10 / .97), rgb(8 6 5 / .97));
  box-shadow: 0 2rem 4rem rgb(0 0 0 / .55);
  backdrop-filter: blur(18px);
  font-family: var(--axtlan-reading, Georgia), Georgia, serif;
  letter-spacing: normal;
  text-transform: none;
}
.ax-shopnav__group h3 {
  margin: 0 0 .7rem;
  color: var(--orange);
  font-family: "Axtlan Soles", sans-serif;
  font-size: .8rem;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.ax-shopnav__group ul { display: grid; gap: .15rem; margin: 0; padding: 0; list-style: none; }
.ax-shopnav__group a {
  display: block;
  padding: .38rem .5rem;
  border-radius: 6px;
  color: var(--paper);
  font-size: .86rem;
  text-decoration: none;
  white-space: normal;
}
.ax-shopnav__group a:is(:hover, :focus-visible) { background: rgb(255 106 36 / .14); color: #fff; }
.ax-shopnav__group a b { margin-inline-start: .35rem; color: var(--orange-hot); font-size: .75em; font-weight: 600; }
.ax-shopnav__foot {
  grid-column: 1 / -1;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: .8rem;
  padding-block-start: 1rem;
  border-block-start: 1px solid var(--line);
}
.ax-shopnav__foot > a:first-child { color: var(--orange-hot); font-size: .85rem; text-decoration: none; }
.ax-shopnav__foot small { color: var(--muted); font-size: .72rem; }
@media (max-width: 1279px) {
  .ax-shopnav__panel {
    position: static;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    inline-size: auto;
    max-block-size: none;
    margin-block: .6rem;
    padding: 1rem;
    box-shadow: none;
  }
}
@media (max-width: 620px) { .ax-shopnav__panel { grid-template-columns: minmax(0, 1fr); } }

.platform-link.platform-instagram svg { fill: currentColor; }

/* ---- deals and events strip (Shop section) ---- */
.ax-deals {
  inline-size: var(--shell);
  margin: clamp(2rem, 4vw, 3rem) auto 0;
  display: flex;
  align-items: center;
  gap: 1rem 1.4rem;
  padding: .75rem 1rem;
  border: 1px solid var(--line);
  background: linear-gradient(90deg, rgb(255 106 36 / .12), rgb(12 10 8 / .9) 40%);
}
.ax-deals__title {
  flex: none;
  color: var(--orange);
  font-family: "Axtlan Soles", sans-serif;
  font-size: .78rem;
  letter-spacing: .1em;
}
.ax-deals__list { display: flex; flex-wrap: wrap; gap: .5rem; margin: 0; padding: 0; list-style: none; min-inline-size: 0; flex: 1; }
.ax-deal a {
  display: inline-flex;
  align-items: center;
  gap: .55rem;
  padding: .35rem .75rem .35rem .4rem;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: rgb(7 6 5 / .55);
  color: var(--paper);
  font-size: .8rem;
  text-decoration: none;
  white-space: nowrap;
}
.ax-deal a:is(:hover, :focus-visible) { border-color: var(--orange); background: rgb(255 106 36 / .16); }
.ax-deal img { inline-size: 1.9rem; block-size: 1.9rem; border-radius: 50%; object-fit: cover; }
.ax-deal img:not([src]) { display: none; }
.ax-deal__label { color: var(--muted); }
.ax-deal__name { max-inline-size: 18rem; overflow: hidden; text-overflow: ellipsis; }
.ax-deal__name:empty { display: none; }
.ax-deal b { color: var(--orange-hot); }
.ax-deal time { color: var(--muted); font-size: .72rem; font-variant-numeric: tabular-nums; }
.ax-deal time:empty { display: none; }
.ax-deals__dots { display: none; gap: .3rem; }
/* rotating mode (JS): one deal at a time, fading */
.ax-deals.is-rotating .ax-deals__list { flex-wrap: nowrap; display: grid; }
.ax-deals.is-rotating .ax-deal { grid-area: 1 / 1; opacity: 0; visibility: hidden; transition: opacity .5s ease, visibility 0s .5s; }
.ax-deals.is-rotating .ax-deal.is-current { opacity: 1; visibility: visible; transition: opacity .5s ease; }
.ax-deals.is-rotating .ax-deals__dots { display: inline-flex; }
.ax-deals__dots button {
  inline-size: .55rem; block-size: .55rem; padding: 0;
  border: 1px solid var(--orange); border-radius: 50%; background: transparent; cursor: pointer;
}
.ax-deals__dots button[aria-current="true"] { background: var(--orange); }
@media (max-width: 620px) {
  .ax-deals { flex-wrap: wrap; }
  .ax-deal__name { max-inline-size: 12rem; }
}
@media (prefers-reduced-motion: reduce) {
  .ax-deals.is-rotating .ax-deal { transition: none; }
}

/* ---- footer share line + profiles (site-wide) ---- */
.ax-footer-social {
  inline-size: var(--shell);
  margin: 2rem auto 0;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding-block: 1.2rem;
  border-block-start: 1px solid var(--line);
}
.ax-footer-social .shop-share { padding: 0; background: none; flex-direction: row; flex-wrap: wrap; align-items: center; }
.ax-footer-social .shop-share-status { flex-basis: 100%; }
.ax-profiles { display: flex; gap: .5rem; }
.ax-profiles a {
  display: inline-grid; place-items: center;
  inline-size: 2.3rem; block-size: 2.3rem;
  border: 1px solid var(--line); border-radius: 50%;
  color: var(--paper);
}
.ax-profiles a:is(:hover, :focus-visible) { border-color: var(--orange); background: rgb(255 106 36 / .14); }
.ax-profiles svg { inline-size: 1.05rem; block-size: 1.05rem; fill: currentColor; }

/* ---- holiday effects (shop rotation-fx.js): fixed page canvas, side margins only ---- */
canvas.ax-fx-page { position: fixed; inset: 0; z-index: 1; inline-size: 100vw; block-size: 100vh; pointer-events: none; }
.ax-fx-measure.page-width { inline-size: var(--shell); block-size: 0; margin-inline: auto; overflow: hidden; }

body[data-theme="light"] .ax-shopnav__panel { background: #fbf4ea; }
body[data-theme="light"] :is(.ax-shopnav__group a, .ax-deal a, .ax-profiles a) { color: #1d1610; }
body[data-theme="light"] .ax-deal a { background: rgb(255 255 255 / .7); }

/* ---- YouTube bar parts = shop .ax-holiday--youtube (icon, name, note, live count widget, red Subscribe) ---- */
.ax-topbar__next { display: inline-flex; align-items: center; gap: .45rem; padding-inline-end: 1rem; border-inline-end: 1px solid var(--line); }
.ax-topbar__next b { color: var(--orange); font-family: "Axtlan Soles", sans-serif; font-size: .72rem; letter-spacing: .16em; text-transform: uppercase; }
.ax-topbar__next span { color: var(--muted); }
.ax-topbar__mark { inline-size: .62rem; block-size: .62rem; flex: none; transform: rotate(45deg); background: #ff6a24; box-shadow: 0 0 .7rem #ff6a24; }
.ax-topbar__msg { display: inline-flex; align-items: center; gap: .55rem; }
.ax-topbar__msg b { color: #ff3b30; font-family: "Axtlan Soles", sans-serif; letter-spacing: .12em; text-transform: uppercase; font-size: .76rem; }
.ax-topbar[data-kind="holiday"] .ax-topbar__msg b { color: var(--orange-hot); }
.ax-topbar__yt { display: inline-flex; color: #ff3b30; }
.ax-topbar__yt svg { inline-size: 1.2rem; block-size: 1.2rem; fill: currentColor; }
.ax-topbar__note { opacity: .85; }
.ax-topbar__ytcount { display: inline-flex; align-items: center; max-inline-size: 9.5rem; overflow: hidden; border-radius: 2px; }
.ax-topbar__ytcount:empty { display: none; }
.ax-topbar__cta {
  padding: .3rem 1rem; background: #ff3b30; color: #fff; text-decoration: none;
  font-family: "Axtlan Soles", sans-serif; font-size: .72rem; letter-spacing: .08em; text-transform: uppercase;
}
.ax-topbar__cta:is(:hover, :focus-visible) { background: #ff5a4f; color: #fff; }
@media (max-width: 1279px) { .ax-topbar.has-next .ax-topbar__note { display: none; } }
@media (max-width: 749px) { .ax-topbar__note { flex-basis: 100%; text-align: center; } .ax-topbar.has-next .ax-topbar__next { border: 0; padding: 0; flex-basis: 100%; justify-content: center; } }
body[data-theme="light"] :is(.ax-ann, .ax-topbar) { background: #f3e3cf; color: #1d1610; }

/* ---- section share button (shop share menu) ---- */
.ax-sharebtn { position: relative; padding: 0; background: none; }
.ax-sharebtn > summary { cursor: pointer; list-style: none; min-block-size: 48px; }
.ax-sharebtn > summary::-webkit-details-marker { display: none; }
.ax-sharebtn__panel {
  position: absolute; z-index: 20; inset-block-start: calc(100% + .5rem); inset-inline-start: 0;
  inline-size: min(26rem, 88vw); padding: 1rem; border: 1px solid var(--line);
  background: linear-gradient(160deg, rgb(28 18 10 / .98), rgb(8 6 5 / .98)); box-shadow: 0 1.5rem 3rem rgb(0 0 0 / .5);
}
body[data-theme="light"] .ax-sharebtn__panel { background: #fbf4ea; }

/* ---- share: the section panel stays above the video; the page share button sits in the top menu after the socials ---- */
.shop-cta { position: relative; z-index: 6; }
.ax-sharebtn__panel .shop-share-list { display: flex; flex-wrap: wrap; gap: .5rem; }
.ax-sharebtn__title { margin: 0 0 .7rem; color: var(--orange); font-family: "Axtlan Soles", sans-serif; font-size: .74rem; letter-spacing: .14em; text-transform: uppercase; }
.ax-navshare { position: relative; }
.ax-navshare > summary.platform-link { display: inline-grid; place-items: center; cursor: pointer; list-style: none; }
.ax-navshare > summary::-webkit-details-marker { display: none; }
.ax-navshare > summary svg { fill: currentColor; }
.ax-navshare[open] > summary { border-color: var(--orange); }
.ax-navshare .ax-sharebtn__panel {
  position: fixed; z-index: 130; inset-block-start: calc(5.2rem + var(--ax-bars-offset, 0px)); inset-inline: auto max(1rem, 4vw);
  inline-size: min(26rem, 92vw); text-transform: none; letter-spacing: normal; font-family: var(--axtlan-reading, Georgia), Georgia, serif;
}
@media (max-width: 1279px) { .ax-navshare .ax-sharebtn__panel { position: static; inline-size: auto; margin-block: .6rem; box-shadow: none; } }
/* the page share panel lives inside .nav-socials: undo the icon-button sizing for its links */
.ax-navshare .ax-sharebtn__panel .shop-share-list :is(a, button) {
  display: inline-flex; align-items: center; gap: .45rem; inline-size: auto; min-inline-size: 0; min-block-size: 0;
  padding: .55rem .9rem; opacity: 1; translate: none; font-size: .78rem; letter-spacing: normal; text-transform: none; white-space: nowrap;
}
.ax-navshare .ax-sharebtn__panel .shop-share-list a::after { content: none; }
.ax-navshare .ax-sharebtn__panel .shop-share-list svg { inline-size: 1rem; block-size: 1rem; fill: currentColor; }
/* share icon = same box as the other social icons (site.css .nav-socials a) */
.nav-socials .ax-navshare > summary.platform-link {
  inline-size: 1.8rem; min-block-size: 1.8rem; block-size: 1.8rem; padding: 0;
  border: 1px solid rgb(212 130 99 / .18); transition: border-color .25s ease, color .25s ease, filter .25s ease;
}
.nav-socials .ax-navshare > summary.platform-link:is(:hover, :focus-visible) { border-color: var(--orange); }
@media (max-width: 1279px) { .nav-socials .ax-navshare > summary.platform-link { inline-size: 44px; min-block-size: 44px; block-size: 44px; } }

/* ---- menu fit: the inline menu (>= 1280 px) is compacted step by step until EXPLORAR fits (shop-layer.js fitNav);
   links that still do not fit are hidden from the bar and stay in Explorar (group "Axtlan"). ---- */
.ax-shopnav__panel { grid-template-columns: repeat(5, minmax(9rem, 1fr)); inline-size: min(76rem, 94vw); }
html.ax-fit-1 .ax-shopnav > summary span { display: none; }
html.ax-fit-1 .ax-shopnav > summary { padding-inline: .6rem; }
html.ax-fit-2 .main-navigation { gap: .55rem; }
html.ax-fit-2 .main-navigation > a { letter-spacing: .06em; }
html.ax-fit-3 .locale-state-copy { display: none; }
html.ax-fit-4 .nav-socials > a.platform-link { display: none; }
.main-navigation > a[data-ax-fit-hidden] { display: none; }
@media (max-width: 1279px) { .main-navigation > a[data-ax-fit-hidden] { display: revert; } }