/* Mantra role presentation. Layout is owned by the component layer below. */
/* Same families for filters, random and budget category controls. */
:is(.unified-role,.random-role-btn,.mantra-role-choice-btn,.budget-role,.budget-donor,.mantra-subfilter-token).role-P{background:#F4C20D!important;color:#111!important;border-color:#D6A900!important;}
:is(.unified-role,.random-role-btn,.mantra-role-choice-btn,.budget-role,.budget-donor,.mantra-subfilter-token).role-D{background:#28C76F!important;color:#07140b!important;border-color:#20A85C!important;}
:is(.unified-role,.random-role-btn,.mantra-role-choice-btn,.budget-role,.budget-donor,.mantra-subfilter-token).role-C{background:#3F82F7!important;color:#fff!important;border-color:#2F69D1!important;}
:is(.unified-role,.random-role-btn,.mantra-role-choice-btn,.budget-role,.budget-donor,.mantra-subfilter-token).role-T{background:#8B5CF6!important;color:#fff!important;border-color:#7446D6!important;}
:is(.unified-role,.random-role-btn,.mantra-role-choice-btn,.budget-role,.budget-donor,.mantra-subfilter-token).role-A{background:#EF4444!important;color:#fff!important;border-color:#D73737!important;}

.liveasta-mantra :is(.unified-role,.random-role-btn,.mantra-role-choice-btn):not(.selected):not([aria-pressed="true"]){opacity:.72;}
.liveasta-mantra :is(.unified-role,.random-role-btn,.mantra-role-choice-btn).selected,
.liveasta-mantra :is(.unified-role,.random-role-btn,.mantra-role-choice-btn)[aria-pressed="true"]{
  opacity:1!important;
  box-shadow:inset 0 0 0 2px rgba(255,255,255,.38)!important;
}

/* Category filters: compact abbreviations with the active subroles visible below. */
.liveasta-mantra .mantra-role-filter-row{
  display:grid!important;
  grid-template-columns:repeat(6,minmax(0,1fr))!important;
  gap:7px!important;
  width:100%!important;
  align-items:stretch!important;
}
.liveasta-mantra .mantra-role-filter-row :is(.unified-role-all,.unified-role){
  min-width:0!important;
  min-height:48px!important;
  margin:0!important;
  padding:7px 5px!important;
  border-radius:10px!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  gap:2px!important;
  white-space:normal!important;
  line-height:1!important;
  user-select:none!important;
  -webkit-user-select:none!important;
  touch-action:manipulation!important;
}
.liveasta-mantra .mantra-role-filter-row .unified-role > span{
  font-size:12px!important;
  font-weight:950!important;
  letter-spacing:.35px!important;
}
.liveasta-mantra .mantra-role-filter-row .unified-role > small{
  display:block!important;
  width:100%!important;
  min-height:11px!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
  font-size:8px!important;
  font-weight:800!important;
  opacity:.86!important;
  text-transform:none!important;
}
.liveasta-mantra .mantra-role-filter-row .unified-role.partial{
  opacity:1!important;
  outline:2px dashed color-mix(in srgb,currentColor 62%,transparent)!important;
  outline-offset:-4px!important;
}
.liveasta-mantra .mantra-role-filter-row .unified-role.off{
  opacity:.42!important;
  box-shadow:none!important;
}

/* Long-press subfilter drawer. */
.liveasta-mantra .mantra-subfilter-panel{
  width:100%!important;
  margin:8px 0 2px!important;
  padding:10px!important;
  box-sizing:border-box!important;
  border:1px solid var(--theme-border)!important;
  border-radius:12px!important;
  background:var(--theme-input)!important;
  color:var(--theme-text)!important;
}
.liveasta-mantra .mantra-subfilter-head{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:10px!important;
  margin-bottom:8px!important;
}
.liveasta-mantra .mantra-subfilter-head > div{
  display:flex!important;
  flex-direction:column!important;
  align-items:flex-start!important;
  text-align:left!important;
}
.liveasta-mantra .mantra-subfilter-head b{font-size:13px!important;}
.liveasta-mantra .mantra-subfilter-head small{font-size:10px!important;color:var(--theme-muted)!important;}
.liveasta-mantra .mantra-subfilter-close{
  width:34px!important;height:34px!important;min-width:34px!important;padding:0!important;margin:0!important;
  border:1px solid var(--theme-border)!important;border-radius:9px!important;background:transparent!important;color:var(--theme-text)!important;
  font-size:20px!important;line-height:1!important;
}
.liveasta-mantra .mantra-subfilter-grid{
  display:grid!important;
  grid-template-columns:repeat(5,minmax(0,1fr))!important;
  gap:6px!important;
}
.liveasta-mantra .mantra-subfilter-token{
  min-width:0!important;
  min-height:38px!important;
  padding:7px 4px!important;
  border:1px solid transparent!important;
  border-radius:9px!important;
  font-weight:900!important;
  font-size:12px!important;
  opacity:.42!important;
}
.liveasta-mantra .mantra-subfilter-token.selected{
  opacity:1!important;
  box-shadow:inset 0 0 0 2px rgba(255,255,255,.35)!important;
}

/* Random and automatic random still use the five full category names. */
.liveasta-mantra #random-role-grid.mantra-random-grid{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:7px!important;
  width:100%!important;
}
.liveasta-mantra .mantra-auto-random-role-grid{
  display:grid!important;
  grid-template-columns:repeat(5,minmax(0,1fr))!important;
  gap:6px!important;
  width:100%!important;
}
.liveasta-mantra :is(.mantra-auto-random-role-grid,#random-role-grid.mantra-random-grid) button{
  min-width:0!important;
  white-space:normal!important;
  line-height:1.05!important;
  font-size:clamp(10px,1.4vw,13px)!important;
  padding-left:6px!important;
  padding-right:6px!important;
}

@media(max-width:560px){
  .liveasta-mantra .mantra-role-filter-row{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:6px!important;
  }
  .liveasta-mantra .mantra-role-filter-row :is(.unified-role-all,.unified-role){
    min-height:46px!important;
    border-radius:9px!important;
  }
  .liveasta-mantra .mantra-role-filter-row .unified-role > span{font-size:11px!important;}
  .liveasta-mantra .mantra-role-filter-row .unified-role > small{font-size:7.5px!important;}

  .liveasta-mantra .mantra-subfilter-grid{grid-template-columns:repeat(5,minmax(0,1fr))!important;}
  .liveasta-mantra #random-role-grid.mantra-random-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
  .liveasta-mantra .mantra-auto-random-role-grid{grid-template-columns:repeat(5,minmax(0,1fr))!important;gap:4px!important;}
  .liveasta-mantra #player-budget-rows{grid-template-columns:1fr!important;}
}


/* Compact five-category AUTO RANDOM controls. */
.liveasta-mantra #screen-room-control .mantra-auto-random-role-grid{
  display:grid!important;
  grid-template-columns:repeat(5,minmax(0,1fr))!important;
  gap:5px!important;
  width:100%!important;
}
.liveasta-mantra #screen-room-control .mantra-auto-random-role-grid .unified-role{
  min-width:0!important;
  min-height:42px!important;
  margin:0!important;
  padding:6px 3px!important;
  white-space:nowrap!important;
  font-size:11px!important;
  font-weight:950!important;
  line-height:1!important;
}
@media(max-width:560px){
  .liveasta-mantra #screen-room-control .mantra-auto-random-role-grid{gap:4px!important;}
  .liveasta-mantra #screen-room-control .mantra-auto-random-role-grid .unified-role{
    min-height:40px!important;
    padding:5px 1px!important;
    font-size:10px!important;
    border-radius:9px!important;
  }
}

/* Important declarations in a named layer take precedence over the legacy,
   unlayered !important rules. This gives the component one owner without
   duplicating IDs or increasing selector specificity for every screen. */
@layer mantra-role-layout {
  .role-badge-mantra {
    --role-size:26px;
    --role-font:10px;
    display:inline-flex!important;
    flex-flow:row wrap!important;
    align-items:center!important;
    justify-content:flex-start!important;
    align-self:center!important;
    justify-self:start!important;
    gap:3px!important;
    width:fit-content!important;
    min-width:0!important;
    max-width:100%!important;
    height:auto!important;
    min-height:var(--role-size)!important;
    max-height:none!important;
    aspect-ratio:auto!important;
    flex:0 1 auto!important;
    padding:0!important;
    margin:0!important;
    border:0!important;
    border-radius:0!important;
    background:transparent!important;
    box-shadow:none!important;
    text-shadow:none!important;
    -webkit-text-stroke:0!important;
    overflow:visible!important;
    clip-path:none!important;
    white-space:normal!important;
    line-height:1!important;
    text-indent:0!important;
    transform:none!important;
  }
  .mantra-role-token {
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    width:var(--role-size)!important;
    min-width:var(--role-size)!important;
    max-width:var(--role-size)!important;
    height:var(--role-size)!important;
    min-height:var(--role-size)!important;
    max-height:var(--role-size)!important;
    flex:0 0 var(--role-size)!important;
    box-sizing:border-box!important;
    aspect-ratio:1!important;
    border:2px solid #111!important;
    border-radius:50%!important;
    padding:0!important;
    margin:0!important;
    font-size:var(--role-font)!important;
    font-weight:900!important;
    letter-spacing:0!important;
    line-height:1!important;
    text-transform:none!important;
    text-indent:0!important;
    text-shadow:none!important;
    -webkit-text-stroke:0!important;
    box-shadow:none!important;
    overflow:visible!important;
    clip-path:none!important;
  }
  .mantra-role-family-P {background:#F4C20D!important;color:#111!important;-webkit-text-fill-color:#111!important;}
  .mantra-role-family-D {background:#28C76F!important;color:#07140b!important;-webkit-text-fill-color:#07140b!important;}
  .mantra-role-family-C {background:#3F82F7!important;color:#fff!important;-webkit-text-fill-color:#fff!important;}
  .mantra-role-family-T {background:#8B5CF6!important;color:#fff!important;-webkit-text-fill-color:#fff!important;}
  .mantra-role-family-A {background:#EF4444!important;color:#fff!important;-webkit-text-fill-color:#fff!important;}

  /* Three circles fit without shrinking; any additional roles wrap. */
  .liveasta-mantra :is(.roster-row,.roster-player-line,.player-room-roster-line,.manual-player-option) {
    display:grid!important;
    grid-template-columns:84px minmax(0,1fr) max-content!important;
    gap:8px!important;
    align-items:center!important;
    height:auto!important;
    min-height:60px!important;
    box-sizing:border-box!important;
  }
  .liveasta-mantra :is(.player-listone-row,.nomination-player-row) {
    display:grid!important;
    grid-template-columns:22px 84px minmax(0,1fr) 40px!important;
    gap:6px!important;
    height:auto!important;
    min-height:64px!important;
    align-items:center!important;
    box-sizing:border-box!important;
  }
  .liveasta-mantra .player-listone-row .player-listone-priority {grid-column:1!important;grid-row:1 / span 2!important;}
  .liveasta-mantra .player-listone-row .role-badge-mantra {grid-column:2!important;grid-row:1 / span 2!important;}
  .liveasta-mantra .player-listone-main {grid-column:3!important;grid-row:1!important;}
  .liveasta-mantra .player-listone-owner {grid-column:3!important;grid-row:2!important;max-width:100%!important;}
  .liveasta-mantra .player-listone-value {grid-column:4!important;grid-row:1 / span 2!important;}
  .liveasta-mantra :is(.player-roster-main,.player-room-roster-main,.roster-player-main,.player-listone-main,.nomination-player-main,.manual-player-copy) {
    min-width:0!important;
    padding-left:0!important;
    margin-left:0!important;
  }
  .liveasta-mantra .auctioned-row {
    display:grid!important;
    grid-template-columns:84px minmax(0,1fr) 82px!important;
    gap:4px 8px!important;
    height:auto!important;
    min-height:60px!important;
    align-items:center!important;
  }
  .liveasta-mantra .auctioned-row .role-badge-mantra {grid-column:1!important;grid-row:1 / span 2!important;}
  .liveasta-mantra .auctioned-name {grid-column:2!important;grid-row:1!important;}
  .liveasta-mantra .auctioned-team {grid-column:2!important;grid-row:2!important;}
  .liveasta-mantra .auctioned-row .restore-btn {grid-column:3!important;grid-row:1 / span 2!important;width:82px!important;min-width:0!important;}

  /* Table geometry is scoped to the player list, never other dashboard tables. */
  .liveasta-mantra #players-table :is(th,td):first-child {width:96px!important;min-width:96px!important;padding:6px!important;white-space:normal!important;}
  .liveasta-mantra #players-table th:nth-child(2) {width:auto!important;}
  .liveasta-mantra #players-table th:nth-child(3) {width:25%!important;}
  .liveasta-mantra #players-table th:nth-child(4) {width:48px!important;}
  .liveasta-mantra :is(#players-table,.control-table) td:has(.role-badge-mantra) {overflow:visible!important;text-overflow:clip!important;min-width:84px!important;height:auto!important;}

  /* Keep the role group and club on separate lines below the miniature. */
  .liveasta-mantra :is(#auction-player-meta,.ard-player-meta,.phone-player-meta,.room-roster-player-preview-meta):has(.role-badge-mantra) {
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:center!important;
    gap:5px!important;
    width:100%!important;
    height:auto!important;
    max-height:none!important;
    white-space:normal!important;
    overflow:visible!important;
  }
  .liveasta-mantra :is(#auction-player-meta,.ard-player-meta,.phone-player-meta,.room-roster-player-preview-meta):has(.role-badge-mantra) :is(.meta-dot,.phone-meta-dot,.room-roster-player-preview-dot) {display:none!important;}
  :is(#auction-player-role,#auctioneer-ready-player-role,#phone-player-role,#room-roster-player-preview-role).role-badge-mantra {justify-content:center!important;--role-size:28px;--role-font:11px;}
  .auctioneer-ui-desktop :is(#auction-player-role,#auctioneer-ready-player-role).role-badge-mantra {--role-size:32px;--role-font:12px;}

  .liveasta-mantra :is(#auction-player-club,#phone-player-club,#auctioneer-ready-player-club,#room-roster-player-preview-club) {
    max-width:100%!important;
    white-space:normal!important;
    overflow-wrap:anywhere!important;
    text-align:center!important;
  }
  @media(max-width:760px) {
    .liveasta-mantra #control-purchases-content .control-table tbody tr {
      grid-template-columns:84px minmax(0,1fr) 78px!important;
      gap:5px 7px!important;
      height:auto!important;
    }
    .liveasta-mantra #control-purchases-content .control-table td:nth-child(1) {grid-column:2!important;grid-row:1!important;}
    .liveasta-mantra #control-purchases-content .control-table td:nth-child(2) {grid-column:1!important;grid-row:1 / span 2!important;}
    .liveasta-mantra #control-purchases-content .control-table td:nth-child(3) {grid-column:2!important;grid-row:2!important;}
    .liveasta-mantra #control-purchases-content .control-table td:nth-child(4) {grid-column:3!important;grid-row:1!important;}
    .liveasta-mantra #control-purchases-content .control-table td:nth-child(5) {grid-column:3!important;grid-row:2!important;}
    .liveasta-mantra #control-purchases-content .restore-btn {width:78px!important;min-width:0!important;max-width:100%!important;}
  }
}
