@use 'backend' as *;

// SERVER PROFILE
#{c(guildSettings profile bannerSelected)} {
  border: 2px solid cv('color.main');
}
#{c(guildSettings profile traitContainer)} {
  background: cv('shading.input.bg');
  border-color: cv('shading.input.border');
  &:focus-within {
    border-color: cv('color.main');
    box-shadow: 0 0 2px 0 cv('color.main');
  }
}
#{c(guildSettings profile traitEmoji)} {
  border: none;
  padding-left: 10px;
}
#{c(guildSettings profile traitInput)} {
  background: transparent;
  box-shadow: none;
  height: 32px;
  &:focus-within {
    box-shadow: none;
  }
}

// STICKERS
#{c(guildSettings stickers wrapper)} {
  &,
  &:hover {
    background: transparent;
  }
}
#{c(guildSettings stickers action)} {
  background: cv('shading.popout');
}

// MEMBERS
#{c(guildSettings members maintableContainer)} {
  background: cv('shading.card');
}

// ROLES
#{c(guildSettings roles defaultPermsContainer)} {
  background: cv('shading.card');
  border: 2px solid transparent;
  &:hover {
    background: cv('shading.card');
    border: 2px solid cv('color.main');
  }
}
#{c(guildSettings roles defaultPermsIcon)} {
  background: cv('color.main');
  color: var(--interactive-active);
}
#{c(guildSettings roles circleButton)} {
  margin-left: 10px;
}
#{c(guildSettings roles row)} {
  &:hover {
    &:not(#{c(guildSettings roles rowDisableHover)}) {
      #{c(guildSettings roles circleButton)} {
        background: cv('shading.card');
        &:hover {
          background: cv('color.main');
        }
      }
    }
  }
}
// ROLES - EDIT
#{c(guildSettings roles edit backContainer)} {
  background: transparent;
}
#{c(guildSettings roles edit header)} {
  background: transparent;
  transition: background .15s ease-in-out;
}
#{c(guildSettings roles edit headerStickyElevated)} {
  background: cv('shading.popout');
}

// ROLES - VIEW SERVER AS ROLE
#{c(guildSettings roles preview dropdown)} {
  background: cv('shading.popout');
}

// ACCESS
#{c(guildSettings access joinOptions)} {
  background: cv('shading.card');
}
#{c(guildSettings access joinOptionContent)} {
  &#{c(guildSettings access joinOptionActive)} {
    background: cv('shading.cardAlt');
  }
}

// SAFETY SETUP
#{c(guildSettings safety changelog)},
#{c(guildSettings safety checklist)},
#{c(guildSettings safety itemWrapper)} {
  background: cv('shading.card');
  border: none;
}
#{c(guildSettings safety pill)} {
  background: cv('shading.card');
  border: 1px solid cv('color.main');
}

// AUDIT LOG
#{c(guildSettings audit log)} {
  background: cv('shading.card');
  border: none;
}
#{c(guildSettings audit headerExpanded)},
#{c(guildSettings audit divider)},
#{c(guildSettings audit changeDetails)} {
  background: transparent;
}

// BANS
#{c(guildSettings bans scrollerContainer)} {
  background: cv('shading.card');
  border: none;
}

// AUTOMOD
#{c(guildSettings automod badge)} {
  border-color: transparent;
}
#{c(guildSettings automod editCard)} {
  background: cv('shading.card');
  border: none;
}
#{c(guildSettings automod contentContainer)} {
  background: cv('shading.cardAlt');
}
#{c(guildSettings automod keywordsTextArea)} {
  background: cv('shading.input.bg');
  border-color: cv('shading.input.border');
  &:focus {
    border-color: cv('color.main');
    box-shadow: 0 0 2px 0 cv('color.main');
  }
}
#{c(guildSettings automod pillContainer)},
#{c(guildSettings automod stepIcon)} {
  background: cv('shading.cardAlt');
}
#{c(guildSettings automod stepperContainer)} {
  background: transparent;
  border: none;
}
#{c(guildSettings automod regexTextArea)} {
  background: cv('shading.input.bg');
  border-color: cv('shading.input.border');
  &:focus-within {
    border-color: cv('color.main');
    box-shadow: 0 0 2px 0 cv('color.main');
  }
}

// ENABLE COMMUNITY
#{c(guildSettings community enable guildDetails)} {
  background: cv('shading.popout');
}
#{c(guildSettings community enable featureCard)} {
  background: cv('shading.card');
}
#{c(guildSettings community enable featureIcon)} {
  background: transparent;
}

// COMMUNITY OVERVIEW
#{c(guildSettings community overview upsellContainer)} {
  background: cv('shading.card');
}
#{c(guildSettings community overview upsellFooter)} {
  background: transparent;
}

// SERVER SUBSCRIPTIONS
#{c(guildSettings subs howItWorksContainer)} {
  background: transparent;
  padding: 0;
}
#{c(guildSettings subs howItWorksImageContainer)} {
  background: transparent;
}
#{c(guildSettings subs card)} {
  background: cv('shading.card');
}
#{c(guildSettings subs avatarCard)} {
  background: cv('shading.cardAlt');
}
#{c(guildSettings subs avatarConnector)} {
  border-color: cv('shading.cardAlt') !important;
}
#{c(guildSettings subs viewServerButton)} {
  background: cv('color.main');
  &:hover {
    background: cv('color.hover');
  }
}

// SERVER BOOST
#{c(guildSettings boost tierCard)} {
  border: none;
}
#{c(guildSettings boost tierHeader)},
#{c(guildSettings boost tierBody)} {
  background: cv('shading.card');
  border: none;
}

// SERVER TEMPLATE
#{c(guildSettings template descriptionBox)} {
  background: cv('shading.card');
}

// SERVER INSIGHTS
#{c(guildSettings insights developerPortal)} {
  background: transparent;
}
#{c(guildSettings insights analyticsCard)} {
  background: cv('shading.card');
}