p[data-v-cd834e8c] {
  margin: 0;
  padding: 0;
}
div[data-v-cd834e8c] {
  --dark-grayish-blue: #515365;
  --dark-gray: #333333DE;
  --deep-reddish-purple: #601848;
  --vivid-red: #DC1A1A;
  --semi-transparent-gray: #7070703B;
  --font-medium: 500;
  --font-bold: 700;
  --font-normal: 400;
}
.modal-body[data-v-cd834e8c] {
  height: 500px !important;
}
.modal-dialog.modal-transition-xs .modal-body[data-v-cd834e8c] {
  height: auto !important;
}
.restriction-profile-addition[data-v-cd834e8c] {
  height: 100%;
  text-align: left;
}
.restriction-profile-addition > h2[data-v-cd834e8c] {
  margin-bottom: 12px;
  color: var(--dark-grayish-blue);
  font-size: 24px;
}
.profile-addition-form[data-v-cd834e8c] {
  height: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 40px;
}
.profile-addition-form > div[data-v-cd834e8c] {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  padding-bottom: 80px;
  width: 50%;
}
.profile-addition-form > img[data-v-cd834e8c] {
  width: 50%;
  -webkit-transform: scale(1.05);
          transform: scale(1.05);
}
.profile-name-input > label[data-v-cd834e8c] {
  font-weight: var(--font-medium);
  font-size: 13px;
  color: var(--dark-gray);
  margin-bottom: 4px;
}
.gui-selection > p[data-v-cd834e8c] {
  font-weight: var(--font-medium);
  margin-bottom: 8px;
  font-size: 13px;
  color: var(--dark-gray);
}
.gui-selection > div[data-v-cd834e8c] {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  gap: 8px;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
.addition-message > span[data-v-cd834e8c] {
  display: block;
  color: var(--deep-reddish-purple);
  font-weight: var(--font-medium);
}
.addition-message > span.invalid[data-v-cd834e8c] {
  color: var(--vivid-red)
}
.addition-message ~ .a-btn[data-v-cd834e8c] {
  width: 208px;
}
.addition-message ~ .a-btn.btn-invalid[data-v-cd834e8c] {
  width: 15rem;
}
@-webkit-keyframes modal-lg-to-modal-sm-cd834e8c {
from {
    max-width: 900px;
}
to {
    max-width: 550px;
}
}
@keyframes modal-lg-to-modal-sm-cd834e8c {
from {
    max-width: 900px;
}
to {
    max-width: 550px;
}
}
.modal-transition-sm[data-v-cd834e8c] {
  -webkit-animation: modal-lg-to-modal-sm-cd834e8c .5s ease forwards;
          animation: modal-lg-to-modal-sm-cd834e8c .5s ease forwards;
}
@-webkit-keyframes modal-sm-to-modal-lg-cd834e8c {
from {
    max-width: 550px;
}
to {
    max-width: 900px;
}
}
@keyframes modal-sm-to-modal-lg-cd834e8c {
from {
    max-width: 550px;
}
to {
    max-width: 900px;
}
}
.modal-transition-lg[data-v-cd834e8c] {
  -webkit-animation: modal-sm-to-modal-lg-cd834e8c .5s ease forwards;
          animation: modal-sm-to-modal-lg-cd834e8c .5s ease forwards;
}
@-webkit-keyframes modal-lg-to-xs-cd834e8c {
from { max-width: 900px;
}
to { max-width: 550px;
}
}
@keyframes modal-lg-to-xs-cd834e8c {
from { max-width: 900px;
}
to { max-width: 550px;
}
}
.modal-transition-xs[data-v-cd834e8c] {
  -webkit-animation: modal-lg-to-xs-cd834e8c .5s ease forwards;
          animation: modal-lg-to-xs-cd834e8c .5s ease forwards;
}
.preview-default-profile[data-v-cd834e8c] {
  height: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 24px;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  text-align: left;
}
.preview-default-profile > .header[data-v-cd834e8c] {
  margin-bottom: 8px;
  border-bottom: 1px;
  border-color: var(--semi-transparent-gray);
  width: 100%;
  padding-bottom: 8px;
}
.preview-default-profile > .header > h2[data-v-cd834e8c] {
  font-weight: var(--font-bold);
  font-size: 20px;
  color: var(--dark-grayish-blue);
}
.preview-default-profile > .profile-name[data-v-cd834e8c] {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 12px;
}
.preview-default-profile > .profile-name > div[data-v-cd834e8c] {
  min-width: 250px;
}
.preview-default-profile > .profile-name > div > p[data-v-cd834e8c] {
  font-size: 14px;
  font-weight: var(--font-medium);
  color: var(--dark-gray);
  margin-bottom: 8px;
}
.preview-default-profile > .selected-guis[data-v-cd834e8c] {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 6px;
  padding-bottom: 12px;
}
.preview-default-profile > .selected-guis > p[data-v-cd834e8c] {
  font-size: 14px;
  color: var(--dark-gray);
  margin-bottom: 8px;
  font-weight: var(--font-medium);
}
.preview-default-profile > .selected-guis div[data-v-cd834e8c] {
  width: 100%;
  padding-block: 12px;
  padding-left: 24px;
  border-radius: 8px;
  background-color: #60184817;
}
.preview-default-profile > .selected-guis div > p[data-v-cd834e8c] {
  position: relative;
  margin-bottom: 0;
  margin-left: 14px;
}
.preview-default-profile > .selected-guis div > p[data-v-cd834e8c]::before {
  content: '•';
  position: absolute;
  left: -1.5rem;
  top: 50%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  color: black;
  font-size: 3rem;
  line-height: 2.5rem;
}
.preview-default-profile .a-btn[data-v-cd834e8c] {
  width: 100%;
}
.features-selection[data-v-cd834e8c] {
  height: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 20px;
  text-align: left;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
}
.features-selection > div[data-v-cd834e8c]:first-child {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 8px;
  width: 100%;
  overflow: auto;
}
.features-selection > div[data-v-cd834e8c]:last-child {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  gap: 16px;
}
.pages-selection[data-v-cd834e8c] {
  width: 55%;
  height: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 16px;
  padding: 16px;
  background-color: #AEACAD26;
}
.pages-selection .header[data-v-cd834e8c] {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 10px
}
.pages-selection .header img[data-v-cd834e8c] {
  width: 35px;
  margin-left: 8px;
}
.pages-selection .header > div[data-v-cd834e8c] {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
.pages-selection h2[data-v-cd834e8c] {
  font-weight: var(--font-medium);
  color: var(--dark-grayish-blue);
  font-size: 16px;
}
.pages-selection p[data-v-cd834e8c] {
  color: var(--dark-gray);
  font-size: 14px;
}
.pages-selection .pages[data-v-cd834e8c] {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 4px;
  overflow-y: auto;
  overflow-x: hidden
}
.pages-selection .pages > div[data-v-cd834e8c] {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 12px;
  background-color: white;
  padding-block: 10px;
  padding-left: 16px;
  border-radius: 8px;
  -webkit-transition: color .5s ease;
  transition: color .5s ease;
  font-weight: var(--font-normal);
  cursor: pointer;
}
.pages-selection .pages > div[data-v-cd834e8c]:hover {
  background-color: #60184826;
  color: #601848;
  font-weight: var(--font-medium);
}
.pages-selection .pages > div.active[data-v-cd834e8c] {
  background-color: #60184826;
}
.classnames-selection[data-v-cd834e8c] {
  width: 45%;
  height: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 16px;
  padding: 16px;
}
.classnames-selection > .header > h2[data-v-cd834e8c] {
  color: var(--dark-grayish-blue);
  font-size: 16px;
  font-weight: var(--font-medium);
}
.classnames-selection > .header > p[data-v-cd834e8c] {
  color: var(--dark-gray);
  font-size: 12px;
}
.classnames-selection > .header > p > span[data-v-cd834e8c] {
  color:  var(--deep-reddish-purple);
  font-weight: var(--font-medium);
}
.classnames-selection > .search-feature[data-v-cd834e8c] {
  margin-top: -4px;
}
.classnames-selection > .a-checkbox[data-v-cd834e8c] {
  margin-left: 6px;
}
.classnames-selection .classnames[data-v-cd834e8c] {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 4px;
  overflow: auto;
}
.classnames-selection .classnames > div[data-v-cd834e8c] {
  padding: 6px;
  border-radius: 4px;
  -webkit-transition: .3s ease;
  transition: .3s ease;
}
.classnames-selection .classnames > div[data-v-cd834e8c]:hover {
  background-color: #60184826;
}
.users-selection[data-v-cd834e8c] {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  text-align: left;
  height: 100%;
}
.users-selection[data-v-cd834e8c] > :first-child {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 12px;
  width: 100%;
  overflow: auto;
}
.users-selection[data-v-cd834e8c] > :last-child {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  gap: 12px;
  position: relative;
  bottom: -32px;
}
.roles-selection[data-v-cd834e8c] {
  width: 45%;
  padding: 16px;
  background: #AEACAD26;
  height: 100%;
}
.roles-selection .header[data-v-cd834e8c] {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 12px;
  margin-bottom: 20px;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.roles-selection .roles[data-v-cd834e8c] {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 4px;
}
.roles-selection .roles img[data-v-cd834e8c] {
  width: 28px;
  height: 28px;
}
.roles-selection .roles > div[data-v-cd834e8c] {
  cursor: pointer;
  -webkit-transition: .3s ease;
  transition: .3s ease;
}
.roles-selection .roles > div[data-v-cd834e8c]:hover {
  background-color: #60184826;
}
.roles-selection .roles > div[data-v-cd834e8c] {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding-inline: 12px;
  padding-block: 8px;
  gap: 8px;
  background: white;
  border-radius: 8px;
}
.roles-selection .roles > div > div[data-v-cd834e8c] {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  width: 100%;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.names-selection[data-v-cd834e8c] {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 5px;
  height: 100%;
  width: 55%;
}
.names-selection .header > div[data-v-cd834e8c] {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding: 9px;
  gap:  12px;
  border-color: var(--deep-reddish-purple);
  border-width: 1px;
  border-style: solid;
  border-radius: 8px;
  font-size: 12px;
}
.names-selection .unselect-names[data-v-cd834e8c] {
  margin-left: auto;
  width: 110px;
  font-size: 10px;
  margin-bottom: 4px;
}
.names-selection .names[data-v-cd834e8c] {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  overflow: auto;
  gap: 2px;
  overflow-x: hidden;
  overflow-y: auto;
}
.names-selection .names div[data-v-cd834e8c] {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding: 6px 12px;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  border-bottom: 1px solid var(--semi-transparent-gray);
  -webkit-transition: .3s ease;
  transition: .3s ease;
  border-radius: 4px;
  cursor: pointer;
}
.names-selection .names div[data-v-cd834e8c]:hover {
  background-color: #60184817;
}
.names-selection .names .selected[data-v-cd834e8c] {
  background-color: #60184817;
  position: relative;
}
.names-selection .names .selected[data-v-cd834e8c]::after {
  content: '';
  background-image: url('/static/svg/default-restriction-profile/check.svg');
  position: absolute;
  width: 40px;
  height: 40px;
  top: 9px;
  right: -5px;
  background-repeat: no-repeat;
}
.names-selection .names img[data-v-cd834e8c] {
  width: 20px;
  margin-right: 12px;
}
.duplicate-detected[data-v-cd834e8c] {
  text-align: left;
}
.duplicate-detected h2[data-v-cd834e8c] {
  font-size: 18px;
  font-weight: var(--font-bold);
  letter-spacing: 0.32px;
  color: #515365;
}
.duplicate-detected .warning-body[data-v-cd834e8c] {
  padding: 10px 40px;
  background-color: #FF4E003B;
  border-radius: 2px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  border-left: 4px solid red;
  max-height: 300px;
  overflow-y: auto;
}
.duplicate-detected .warning-body > div[data-v-cd834e8c]:first-child {
  color: #B90B0F;
  padding-bottom: 16px;
}
.duplicate-detected .warning-body > div:first-child i[data-v-cd834e8c] {
  font-size: 14px;
  color: rgb(185, 11, 15);
  position: absolute;
  left: -26px;
  top: 4px;
}
.duplicate-detected .detected-user[data-v-cd834e8c] {
  font-size: 14px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  color: #601848;
  padding: 5px 0;
}
.detected-user span[data-v-cd834e8c]:first-child {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 14px;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.detected-user span:first-child > img[data-v-cd834e8c] {
  width: 16px;
}
.detected-user .restriction-profile-chip[data-v-cd834e8c] {
  font-size: 10px;
  font-weight: 600;
  padding: 2px 7px;
  background-color: #CCB4C4;
  border-radius: 4px;
  color: #601848;
}
.duplicate-detected > div[data-v-cd834e8c]:last-child {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  gap: 12px;
  margin-top: 12px;
}
.text-red[data-v-cd834e8c] {
  color: red;
}
.profile-addition-form .error-message[data-v-cd834e8c] {
  font-size: 12px;
  font-weight: 600;
  margin-top: -12px;
  margin-left: 4px;
  color: red;
}
.capitalize[data-v-cd834e8c] {
  text-transform: capitalize;
}