/* Boss and calendar-event chips
   One authoritative desktop ruleset, followed by one mobile ruleset. */

/* Fallback for an unresolved boss ID. Rendered schedule chips use the component below. */
.chip{
  display:flex;
  align-items:center;
  gap:8px;
  min-height:48px;
  padding:7px 11px;
  border:1px solid #4b3142;
  border-radius:15px;
  background:#1d1926;
  box-shadow:inset 0 0 0 1px #0005;
}
.chip.asc{border-color:#7244aa;background:linear-gradient(180deg,#2a1b41,#1d1926)}
.chip.normal{border-color:#6b302d;background:linear-gradient(180deg,#26151b,#1d1926)}
.chip img{width:38px;height:38px;object-fit:contain}
.chip .nm{font-size:17px;font-weight:650}
.chip.asc .nm{color:#d1b9ff}
.chip.normal .nm{color:#fff0e9}
.pvp-label{padding:3px 7px;border-radius:999px;font-size:12px}

/* Schedule items wrap by their actual content width. */
.event-row{overflow:visible!important}
.event-row .items{
  display:flex!important;
  flex-flow:row wrap!important;
  gap:10px 18px!important;
  align-items:center!important;
  justify-content:flex-start!important;
  min-width:0!important;
  max-width:100%!important;
  padding:0 0 0 34px!important;
  overflow:visible!important;
}
.event-row .items > .calendar-chip-modern,
.event-row .items > .calendar-chip-modern.guild{
  flex:0 1 auto!important;
  width:fit-content!important;
  max-width:280px!important;
  min-width:0!important;
  margin:8px 0!important;
}
.event-row .items > .event-chip-icon-only{
  flex:0 0 66px!important;
  width:66px!important;
  max-width:66px!important;
  margin:0!important;
}

/* Shared boss/full-event component. */
.event-row .calendar-chip-modern,
.event-row .calendar-chip-modern.guild,
.calendar-chip-modern,
.calendar-chip-modern.guild{
  --chip-accent:#7543eb;
  --chip-accent-soft:rgba(117,67,235,.30);
  --chip-edge:rgba(135,82,255,.92);
  --chip-body-start:28px!important;
  position:relative!important;
  isolation:isolate!important;
  display:grid!important;
  grid-template-columns:minmax(0,1fr) 32px!important;
  align-items:center!important;
  gap:7px!important;
  min-width:0!important;
  min-height:46px!important;
  height:46px!important;
  padding:5px 12px 5px 62px!important;
  border:0!important;
  outline:0!important;
  border-radius:0 24px 24px 0!important;
  background:transparent!important;
  box-shadow:none!important;
  clip-path:none!important;
  overflow:visible!important;
  cursor:pointer!important;
  transform:translateZ(0)!important;
  transition:transform .18s ease,box-shadow .18s ease,filter .18s ease!important;
  width:fit-content!important;
  max-width:280px!important;
}
.event-row .calendar-chip-modern::before,
.event-row .calendar-chip-modern.guild::before,
.calendar-chip-modern::before,
.calendar-chip-modern.guild::before{
  content:""!important;
  position:absolute!important;
  z-index:0!important;
  left:var(--chip-body-start)!important;
  right:0!important;
  top:0!important;
  bottom:0!important;
  border:1px solid var(--chip-edge)!important;
  border-left:0!important;
  border-radius:0 24px 24px 0!important;
  background:linear-gradient(90deg,rgba(28,15,55,0) 0%,rgba(28,15,55,.62) 16%,rgba(28,15,55,.94) 31%,rgba(8,6,17,.98) 72%)!important;
  box-shadow:inset 0 0 16px rgba(105,56,215,.14),0 3px 9px rgba(0,0,0,.34),0 0 10px var(--chip-accent-soft)!important;
  pointer-events:none!important;
}
.event-row .calendar-chip-modern:hover,
.event-row .calendar-chip-modern:focus-visible,
.calendar-chip-modern:hover,
.calendar-chip-modern:focus-visible{
  transform:translateY(-2px)!important;
  outline:none!important;
}
.event-row .calendar-chip-modern:hover::before,
.event-row .calendar-chip-modern:focus-visible::before,
.calendar-chip-modern:hover::before,
.calendar-chip-modern:focus-visible::before{
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.04),inset 0 0 29px rgba(111,62,226,.22),0 8px 18px rgba(0,0,0,.44),0 0 19px var(--chip-accent-soft)!important;
}

/* Purple Ascended is the default. Normal bosses use bronze. */
.calendar-chip-modern.normal{
  --chip-accent:#a9844d;
  --chip-accent-soft:rgba(169,132,77,.24);
  --chip-edge:rgba(190,154,93,.84);
}
.calendar-chip-modern.normal::before{
  background:linear-gradient(90deg,rgba(43,31,22,0) 0%,rgba(43,31,22,.64) 16%,rgba(43,31,22,.94) 31%,rgba(10,8,8,.98) 72%)!important;
}

/* Independent artwork layer. */
.calendar-chip-modern .boss-chip-art-shell,
.event-row .calendar-chip-modern .boss-chip-art-shell{
  position:absolute!important;
  z-index:3!important;
  left:-18px!important;
  top:50%!important;
  width:76px!important;
  height:76px!important;
  transform:translateY(-50%)!important;
  display:grid!important;
  place-items:center!important;
  pointer-events:none!important;
  overflow:visible!important;
  filter:drop-shadow(0 6px 8px rgba(0,0,0,.55)) drop-shadow(0 0 9px var(--chip-accent-soft))!important;
}
.calendar-chip-modern .boss-chip-art{
  display:block!important;
  width:100%!important;
  height:100%!important;
  max-width:none!important;
  object-fit:contain!important;
  object-position:center!important;
  border:0!important;
  border-radius:0!important;
  padding:0!important;
  background:transparent!important;
  box-shadow:none!important;
  filter:none!important;
}
.calendar-chip-modern .event-chip-art{transform:none!important}

/* Boss badges are anchored to the artwork box, never to the source PNG dimensions. */
.calendar-chip-modern .boss-chip-badge-stack{
  position:absolute!important;
  z-index:6!important;
  top:2px!important;
  right:-4px!important;
  display:block!important;
  width:26px!important;
  height:calc(100% - 4px)!important;
  pointer-events:none!important;
}
.calendar-chip-modern .boss-chip-badge-stack > .boss-chip-type,
.calendar-chip-modern .boss-chip-badge-stack > .arch-label{
  position:absolute!important;
  top:0!important;
  left:50%!important;
  transform:translateX(-50%)!important;
}
.calendar-chip-modern.arch .boss-chip-badge-stack > .boss-chip-type{
  top:0!important;
  left:calc(50% + 30px)!important;
  bottom:auto!important;
}

/* Live text and controls. The schedule-card selector outranks older generic schedule rules. */
.calendar-chip-modern .boss-chip-name,
.schedule-card .event-row .calendar-chip-modern .boss-chip-name{
  position:relative!important;
  z-index:2!important;
  display:block!important;
  min-width:0!important;
  max-width:none!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
  font-size:16px!important;
  font-weight:850!important;
  line-height:1!important;
  letter-spacing:-.02em!important;
  color:#d8c8ff!important;
  text-align:left!important;
  text-shadow:0 0 10px rgba(126,79,255,.34)!important;
}
.calendar-chip-modern.normal .boss-chip-name{
  color:#f0d7ad!important;
  text-shadow:0 0 9px rgba(199,155,83,.25)!important;
}
.calendar-chip-modern .boss-chip-type{
  position:relative!important;
  z-index:1!important;
  display:grid!important;
  place-items:center!important;
  width:24px!important;
  height:24px!important;
  margin:0!important;
  padding:0!important;
  border:1px solid rgba(255,255,255,.96)!important;
  border-radius:50%!important;
  background:rgba(16,10,28,.94)!important;
  box-shadow:0 0 7px rgba(255,255,255,.42),0 0 10px var(--chip-accent-soft)!important;
  opacity:1!important;
  color:inherit!important;
  font-size:16px!important;
  line-height:1!important;
  overflow:hidden!important;
  -webkit-text-stroke:0!important;
  text-shadow:0 0 5px rgba(0,0,0,.95)!important;
  filter:none!important;
}
.calendar-chip-modern .boss-chip-type-glyph{
  display:grid!important;
  place-items:center!important;
  width:auto!important;
  height:auto!important;
  transform:none!important;
}
.calendar-chip-modern .boss-chip-single-paw{
  display:block!important;
  width:15px!important;
  height:15px!important;
  object-fit:contain!important;
}
.calendar-chip-modern .chip-alert-btn{
  position:relative!important;
  z-index:4!important;
  display:grid!important;
  place-items:center!important;
  width:30px!important;
  height:30px!important;
  min-width:30px!important;
  margin:0!important;
  padding:0!important;
  border:1px solid rgba(169,145,190,.22)!important;
  border-radius:50%!important;
  background:rgba(5,4,10,.18)!important;
  box-shadow:none!important;
}
.calendar-chip-modern .chip-alert-btn:hover{
  border-color:rgba(220,199,255,.46)!important;
  background:rgba(113,69,179,.16)!important;
}
.calendar-chip-modern .arch-label{
  position:relative!important;
  z-index:2!important;
  display:grid!important;
  place-items:center!important;
  width:24px!important;
  height:24px!important;
  margin:0!important;
  padding:0!important;
  border:1px solid rgba(255,215,100,.80)!important;
  border-radius:50%!important;
  background:rgba(24,12,43,.95)!important;
  box-shadow:0 0 10px rgba(255,208,79,.50)!important;
  font-size:13px!important;
  line-height:1!important;
}
.calendar-chip-modern .arch-label-glyph{
  display:block!important;
  line-height:1!important;
  transform:translateY(-1px)!important;
}
.calendar-chip-modern .pvp-label,
.schedule-card .event-row .calendar-chip-modern > .pvp-label{
  position:absolute!important;
  z-index:5!important;
  left:62px!important;
  bottom:-7px!important;
  display:block!important;
  padding:1px 6px!important;
  border:1px solid rgba(255,255,255,.38)!important;
  border-radius:999px!important;
  color:#f7fff4!important;
  font-size:9px!important;
  font-weight:900!important;
  letter-spacing:.08em!important;
  line-height:1.35!important;
  box-shadow:0 0 9px rgba(0,0,0,.42)!important;
}
.calendar-chip-modern .guild-pvp-label{background:#5fba28!important}
.calendar-chip-modern .dominion-pvp-label{background:#3c9c8c!important}

/* PvP changes only the skin, never the geometry. */
.event-row .calendar-chip-modern.guild,
.calendar-chip-modern.guild{
  --chip-accent:#d91f3d;
  --chip-accent-soft:rgba(217,31,61,.30);
  --chip-edge:rgba(238,55,79,.88);
}
.event-row .calendar-chip-modern.guild::before,
.calendar-chip-modern.guild::before{
  background:linear-gradient(90deg,rgba(67,6,20,0) 0%,rgba(67,6,20,.64) 16%,rgba(67,6,20,.94) 31%,rgba(17,4,9,.98) 72%)!important;
  box-shadow:inset 0 0 17px rgba(188,17,43,.19),0 3px 9px rgba(0,0,0,.36),0 0 11px rgba(227,32,61,.24)!important;
}
.event-row .calendar-chip-modern.guild::after,
.calendar-chip-modern.guild::after{display:none!important;content:none!important}
.calendar-chip-modern.guild .boss-chip-name,
.schedule-card .event-row .calendar-chip-modern.guild .boss-chip-name{
  max-width:none!important;
  color:#ffd4dc!important;
  text-shadow:0 0 10px rgba(255,59,88,.36)!important;
}

/* Dominion dynamic events use their own teal family; Guild variants keep the red PvP body above. */
.event-row .calendar-chip-modern.dynamic-event:not(.guild),
.calendar-chip-modern.dynamic-event:not(.guild){
  --chip-accent:#4f8d79;
  --chip-accent-soft:rgba(79,141,121,.30);
  --chip-edge:rgba(79,141,121,.94);
}
.event-row .calendar-chip-modern.dynamic-event:not(.guild)::before,
.calendar-chip-modern.dynamic-event:not(.guild)::before{
  background:linear-gradient(90deg,rgba(20,56,47,0) 0%,rgba(20,56,47,.62) 16%,rgba(20,56,47,.94) 31%,rgba(5,18,15,.98) 72%)!important;
  box-shadow:inset 0 0 17px rgba(60,156,140,.18),0 3px 9px rgba(0,0,0,.36),0 0 11px rgba(79,141,121,.28)!important;
}
.calendar-chip-modern.dynamic-event:not(.guild) .boss-chip-name,
.schedule-card .event-row .calendar-chip-modern.dynamic-event:not(.guild) .boss-chip-name{
  color:#d8fff3!important;
  text-shadow:0 0 10px rgba(60,156,140,.34)!important;
}

/* Full-size schedule events omit the monster-type column. */
.event-row .schedule-event-chip.calendar-chip-full,
.event-row .schedule-event-chip.calendar-chip-full.guild,
.schedule-event-chip.calendar-chip-full,
.schedule-event-chip.calendar-chip-full.guild{
  grid-template-columns:minmax(0,1fr) 46px!important;
}
.schedule-card .event-row .schedule-event-chip.calendar-chip-full,
.schedule-card .event-row .schedule-event-chip.calendar-chip-full.guild{
  height:auto!important;
  max-height:none!important;
}
.schedule-event-chip.calendar-chip-full .boss-chip-art-shell,
.event-row .schedule-event-chip.calendar-chip-full .boss-chip-art-shell{
  left:-18px!important;
  width:76px!important;
  height:76px!important;
}
.schedule-event-chip.calendar-chip-full.bounded-event-artwork .boss-chip-art-shell,
.event-row .schedule-event-chip.calendar-chip-full.bounded-event-artwork .boss-chip-art-shell{
  min-width:76px!important;
  min-height:76px!important;
  max-width:76px!important;
  max-height:76px!important;
  overflow:hidden!important;
  contain:layout paint!important;
}
.schedule-event-chip.calendar-chip-full.bounded-event-artwork .event-chip-art,
.event-row .schedule-event-chip.calendar-chip-full.bounded-event-artwork .event-chip-art{
  position:absolute!important;
  inset:0!important;
  display:block!important;
  width:100%!important;
  height:100%!important;
  min-width:0!important;
  min-height:0!important;
  max-width:100%!important;
  max-height:100%!important;
  object-fit:contain!important;
  object-position:center!important;
  transform:none!important;
}
.schedule-event-chip.calendar-chip-full.dynamic-event-artwork .boss-chip-art-shell,
.event-row .schedule-event-chip.calendar-chip-full.dynamic-event-artwork .boss-chip-art-shell{
  width:66px!important;
  height:66px!important;
  min-width:66px!important;
  min-height:66px!important;
  max-width:66px!important;
  max-height:66px!important;
}
.schedule-event-chip .event-chip-name{font-weight:850!important}
/* Icon-only Whale Event and Gigantrite. */
.event-chip-icon-only,
.event-row .event-chip-icon-only{
  position:relative!important;
  display:grid!important;
  place-items:center!important;
  width:66px!important;
  height:66px!important;
  padding:0!important;
  margin:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  overflow:visible!important;
  cursor:default!important;
}
.event-chip-icon-only[role="button"]{cursor:pointer!important;}
.event-chip-icon-only .event-icon-only-img{
  display:block;
  width:100%!important;
  height:100%!important;
  object-fit:contain!important;
  filter:drop-shadow(0 6px 8px rgba(0,0,0,.55))!important;
}
.event-chip-icon-only.whale .event-icon-only-img{
  filter:drop-shadow(0 6px 8px rgba(0,0,0,.55)) drop-shadow(0 0 10px rgba(93,205,232,.24))!important;
}
.event-chip-icon-only.gigantrite .event-icon-only-img{
  filter:drop-shadow(0 6px 8px rgba(0,0,0,.55)) drop-shadow(0 0 10px rgba(155,121,230,.22))!important;
}

/* Dynamic PvP events use the same icon-only footprint as Whale and Gigantrite. */
.event-chip-icon-only.dynamic-event-compact,
.event-row .event-chip-icon-only.dynamic-event-compact{
  isolation:isolate!important;
  cursor:pointer!important;
}
.event-chip-icon-only.dynamic-event-compact .event-icon-only-img{
  position:relative!important;
  z-index:2!important;
  width:54px!important;
  height:54px!important;
  object-fit:contain!important;
}
.event-chip-icon-only.dynamic-event-compact .pvp-label{
  position:absolute!important;
  z-index:5!important;
  left:50%!important;
  bottom:-7px!important;
  transform:translateX(-50%)!important;
  display:block!important;
  min-width:max-content!important;
  padding:1px 6px!important;
  border:1px solid rgba(255,255,255,.38)!important;
  border-radius:999px!important;
  color:#f7fff4!important;
  font-size:8px!important;
  font-weight:900!important;
  letter-spacing:.07em!important;
  line-height:1.4!important;
  box-shadow:0 0 9px rgba(0,0,0,.52)!important;
}
.event-chip-icon-only.dynamic-event-compact .guild-pvp-label{background:#5fba28!important}
.event-chip-icon-only.dynamic-event-compact .dominion-pvp-label{background:#3c9c8c!important}
.event-chip-icon-only.dynamic-event-compact .chip-alert-btn{
  position:absolute!important;
  z-index:6!important;
  top:-3px!important;
  right:-3px!important;
  display:grid!important;
  place-items:center!important;
  width:22px!important;
  height:22px!important;
  min-width:22px!important;
  margin:0!important;
  padding:0!important;
  border-radius:50%!important;
}
.event-chip-icon-only.dynamic-event-compact .chip-alert-btn .bell-svg{width:13px!important;height:13px!important}

/* Mobile schedule: one chip per row with extra artwork clearance. */
@media (max-width:760px){
  .event-row .items{
    flex-flow:column nowrap!important;
    align-items:flex-start!important;
    gap:10px!important;
    padding:0 4px 0 28px!important;
  }
  .event-row .items > .calendar-chip-modern,
  .event-row .items > .calendar-chip-modern.guild{
    width:fit-content!important;
    max-width:100%!important;
    margin:12px 0!important;
  }
  .event-row .calendar-chip-modern,
  .event-row .calendar-chip-modern.guild,
  .calendar-chip-modern,
  .calendar-chip-modern.guild{
    --chip-body-start:36px!important;
    grid-template-columns:minmax(0,1fr) 34px!important;
    min-height:52px!important;
    height:52px!important;
    padding:5px 12px 5px 70px!important;
    border-radius:0 27px 27px 0!important;
  }
  .event-row .calendar-chip-modern::before,
  .event-row .calendar-chip-modern.guild::before,
  .calendar-chip-modern::before,
  .calendar-chip-modern.guild::before{
    border-radius:0 27px 27px 0!important;
  }
  .calendar-chip-modern .boss-chip-art-shell,
  .event-row .calendar-chip-modern .boss-chip-art-shell{
    left:-20px!important;
    width:86px!important;
    height:86px!important;
  }
  .schedule-event-chip.calendar-chip-full.bounded-event-artwork .boss-chip-art-shell,
  .event-row .schedule-event-chip.calendar-chip-full.bounded-event-artwork .boss-chip-art-shell{
    min-width:86px!important;
    min-height:86px!important;
    max-width:86px!important;
    max-height:86px!important;
  }
  .schedule-event-chip.calendar-chip-full.dynamic-event-artwork .boss-chip-art-shell,
  .event-row .schedule-event-chip.calendar-chip-full.dynamic-event-artwork .boss-chip-art-shell{
    width:60px!important;
    height:60px!important;
    min-width:60px!important;
    min-height:60px!important;
    max-width:60px!important;
    max-height:60px!important;
  }
  .calendar-chip-modern .boss-chip-name,
  .schedule-card .event-row .calendar-chip-modern .boss-chip-name{
    font-size:17px!important;
  }
  .calendar-chip-modern .boss-chip-badge-stack{right:-4px!important}
  .calendar-chip-modern .chip-alert-btn{
    width:32px!important;
    height:32px!important;
    min-width:32px!important;
  }
  .calendar-chip-modern .pvp-label,
  .schedule-card .event-row .calendar-chip-modern > .pvp-label{
    left:70px!important;
    bottom:-7px!important;
  }
  .event-row .schedule-event-chip.calendar-chip-full,
  .event-row .schedule-event-chip.calendar-chip-full.guild,
  .schedule-event-chip.calendar-chip-full,
  .schedule-event-chip.calendar-chip-full.guild{
    grid-template-columns:minmax(0,1fr) 44px!important;
  }
  .event-row .items > .event-chip-icon-only{
    flex-basis:60px!important;
    width:60px!important;
    max-width:60px!important;
    margin:0!important;
  }
  .event-chip-icon-only,
  .event-row .event-chip-icon-only{
    width:60px!important;
    height:60px!important;
  }
  .event-chip-icon-only.dynamic-event-compact .event-icon-only-img{
    width:49px!important;
    height:49px!important;
  }
}

@media (max-width:410px){
  .event-row .schedule-event-chip.calendar-chip-full,
  .event-row .schedule-event-chip.calendar-chip-full.guild,
  .schedule-event-chip.calendar-chip-full,
  .schedule-event-chip.calendar-chip-full.guild{
    grid-template-columns:minmax(0,1fr) 40px!important;
  }
}

.event-chip-icon-only:focus-visible{outline:2px solid rgba(216,189,132,.82)!important;outline-offset:4px!important;border-radius:10px!important;}