/*!***********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??clonedRuleSet-22.use[1]!./node_modules/@vue/cli-service/node_modules/vue-loader/dist/stylePostLoader.js!./node_modules/postcss-loader/dist/cjs.js??clonedRuleSet-22.use[2]!./node_modules/sass-loader/dist/cjs.js??clonedRuleSet-22.use[3]!./node_modules/vue-cli-plugin-quasar/lib/loader.scss.js!./node_modules/vue-cli-plugin-quasar/lib/loader.vue.auto-import-quasar.js??ruleSet[0].use[0]!./node_modules/@vue/cli-service/node_modules/vue-loader/dist/index.js??ruleSet[0].use[1]!./src/modules/knowledge/components/cards/workshop/CardWorkshop.vue?vue&type=style&index=0&id=4eb561af&scoped=true&lang=scss ***!
  \***********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
.card-workshop[data-v-4eb561af] {
  display: flex;
  padding: 16px;
  width: 100%;
  max-width: 498px;
  background: var(--q-neutral-0, #FFF);
  border-radius: 16px;
  border: 1px solid var(--q-neutral-30, #E5E5E5);
  gap: 12px;
}
.card-workshop .bg-icon[data-v-4eb561af] {
  display: flex;
  padding: 12px;
  justify-content: center;
  align-items: center;
  width: 48px;
  height: 48px;
  border-radius: 999px;
  background: var(--q-personal-0, #FFF5F6);
}
.card-workshop .card-type[data-v-4eb561af] {
  color: var(--q-neutral-100, #000);
  font-family: Montserrat;
  font-size: 14px;
  font-style: normal;
  font-weight: 600;
  line-height: 20px;
  /* 142.857% */
  letter-spacing: -0.25px;
}
.card-workshop .workshop-title[data-v-4eb561af] {
  color: var(--q-text-secondary, #666);
  font-family: Montserrat;
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  line-height: 20px;
  /* 142.857% */
  letter-spacing: -0.25px;
}
.container-address[data-v-4eb561af] {
  display: flex;
  justify-content: baseline;
  gap: 8px;
}
.send-to-address[data-v-4eb561af] {
  color: var(--q-personal-70, #FE4E64);
  text-align: center;
  font-family: Montserrat;
  font-size: 12px;
  font-style: normal;
  font-weight: 600;
  line-height: 16px;
  /* 133.333% */
  letter-spacing: -0.25px;
}
.workshop-description[data-v-4eb561af] {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.workshop-description-item[data-v-4eb561af] {
  display: flex;
  gap: 4px;
  align-items: center;
}
.workshop-description-item .bg-icon[data-v-4eb561af] {
  width: 33px;
  height: 33px;
}
.workshop-description-item[data-v-4eb561af] :is(strong, time, address) {
  color: var(--q-neutral-60, #808080);
  font-family: Montserrat;
  font-size: 0.75rem;
  font-style: normal;
  font-weight: 600;
  line-height: 16px;
  letter-spacing: -0.25px;
}
/*!**********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??clonedRuleSet-22.use[1]!./node_modules/@vue/cli-service/node_modules/vue-loader/dist/stylePostLoader.js!./node_modules/postcss-loader/dist/cjs.js??clonedRuleSet-22.use[2]!./node_modules/sass-loader/dist/cjs.js??clonedRuleSet-22.use[3]!./node_modules/vue-cli-plugin-quasar/lib/loader.scss.js!./node_modules/vue-cli-plugin-quasar/lib/loader.vue.auto-import-quasar.js??ruleSet[0].use[0]!./node_modules/@vue/cli-service/node_modules/vue-loader/dist/index.js??ruleSet[0].use[1]!./src/modules/knowledge/components/cards/workshop/CardStudent.vue?vue&type=style&index=0&id=96aded3c&scoped=true&lang=scss ***!
  \**********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
.card-student[data-v-96aded3c] {
  display: flex;
  align-items: center;
  min-height: 76px;
  gap: 10px;
  padding: 16px 0;
  border-bottom: 1px solid var(--q-neutral-40, #CCC);
  transition: 0.3s background-color ease-in-out;
}
.card-student[data-v-96aded3c]:hover {
  background: var(--q-bg-personal, #FFF5F6);
}
.card-student .card-student-lef[data-v-96aded3c] {
  display: flex;
  align-items: center;
}
.card-student .card-student-lef .card-avatar[data-v-96aded3c] {
  width: 32px;
  height: 32px;
  border-radius: 32px;
  overflow: hidden;
}
.card-student .card-student-right .wrapper-data[data-v-96aded3c] {
  display: flex;
  align-items: center;
  gap: 16px;
}
.card-student .card-student-right .card-student-name[data-v-96aded3c] {
  color: var(--q-neutral-80, #404040);
  font-family: Montserrat;
  font-size: 14px;
  font-style: normal;
  font-weight: 600;
  line-height: 20px;
  /* 142.857% */
  letter-spacing: -0.25px;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow-y: hidden;
}
.card-student .card-student-right .check-type[data-v-96aded3c] {
  display: flex;
  padding: 2px 12px 2px 10px;
  min-height: 20px;
  color: var(--q-success-40, #069952);
  text-align: center;
  font-family: Montserrat;
  font-size: 10px;
  font-style: normal;
  font-weight: 600;
  line-height: 16px;
  /* 160% */
  letter-spacing: -0.25px;
  border-radius: 40px;
  border: 1px solid var(--utilitrios-sucess-dark-sucess-50-dark, #70C29B);
  background: var(--q-success-0, #EBFFF5);
}
.card-student .card-student-right .card-student-groups[data-v-96aded3c] {
  color: var(--q-text-secondary, #666);
  font-family: Montserrat;
  font-size: 14px;
  font-style: normal;
  font-weight: 600;
  line-height: 20px;
  /* 142.857% */
  letter-spacing: -0.25px;
  margin-bottom: 0;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow-y: hidden;
}
@keyframes wipe-in-down-96aded3c {
from {
    clip-path: inset(0 0 100% 0);
}
to {
    clip-path: inset(0 0 0 0);
}
}
.wipe-down-enter-active[data-v-96aded3c] {
  animation: wipe-in-down-96aded3c 0.6s cubic-bezier(0.25, 1, 0.3, 1) both;
}
@keyframes wipe-out-up-96aded3c {
from {
    clip-path: inset(0 0 0 0);
}
to {
    clip-path: inset(0 0 100% 0);
}
}
.wipe-down-leave-active[data-v-96aded3c] {
  animation: wipe-out-up-96aded3c 0.6s cubic-bezier(0.25, 1, 0.3, 1) both;
}
/*!********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??clonedRuleSet-22.use[1]!./node_modules/@vue/cli-service/node_modules/vue-loader/dist/stylePostLoader.js!./node_modules/postcss-loader/dist/cjs.js??clonedRuleSet-22.use[2]!./node_modules/sass-loader/dist/cjs.js??clonedRuleSet-22.use[3]!./node_modules/vue-cli-plugin-quasar/lib/loader.scss.js!./node_modules/vue-cli-plugin-quasar/lib/loader.vue.auto-import-quasar.js??ruleSet[0].use[0]!./node_modules/@vue/cli-service/node_modules/vue-loader/dist/index.js??ruleSet[0].use[1]!./src/modules/knowledge/components/cards/workshop/CardWorkshopWithToken.vue?vue&type=style&index=0&id=dc2182de&scoped=true&lang=scss ***!
  \********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
.card-workshop[data-v-dc2182de] {
  display: flex;
  flex-direction: column;
  padding: 16px;
  width: 100%;
  background: var(--q-neutral-0, #FFF);
  border-radius: 16px;
  border: 1px solid var(--q-neutral-30, #E5E5E5);
  gap: 24px;
}
.content-first[data-v-dc2182de] {
  display: flex;
}
.content-first .bg-icon[data-v-dc2182de] {
  display: flex;
  padding: 12px;
  justify-content: center;
  align-items: center;
  width: 48px;
  height: 48px;
  border-radius: 999px;
  background: var(--q-personal-0, #FFF5F6);
}
.content-first .card-type[data-v-dc2182de] {
  color: var(--q-neutral-100, #000);
  font-family: Montserrat;
  font-size: 14px;
  font-style: normal;
  font-weight: 600;
  line-height: 20px;
  /* 142.857% */
  letter-spacing: -0.25px;
}
.content-first .workshop-title[data-v-dc2182de] {
  color: var(--q-text-secondary, #666);
  font-family: Montserrat;
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  line-height: 20px;
  /* 142.857% */
  letter-spacing: -0.25px;
}
.container-address[data-v-dc2182de] {
  display: flex;
  justify-content: baseline;
  gap: 8px;
}
.send-to-address[data-v-dc2182de] {
  color: var(--q-personal-70, #FE4E64);
  text-align: center;
  font-family: Montserrat;
  font-size: 12px;
  font-style: normal;
  font-weight: 600;
  line-height: 16px;
  /* 133.333% */
  letter-spacing: -0.25px;
}
.workshop-description[data-v-dc2182de] {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.workshop-description-item[data-v-dc2182de] {
  display: flex;
  gap: 4px;
  align-items: center;
}
.workshop-description-item .bg-icon[data-v-dc2182de] {
  width: 33px;
  height: 33px;
}
.workshop-description-item[data-v-dc2182de] :is(strong, time, address) {
  color: var(--q-neutral-60, #808080);
  font-family: Montserrat;
  font-size: 0.75rem;
  font-style: normal;
  font-weight: 600;
  line-height: 16px;
  letter-spacing: -0.25px;
}
.card-token[data-v-dc2182de] {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
  width: -moz-fit-content;
  width: fit-content;
}
.card-token-title[data-v-dc2182de] {
  color: var(--q-text-secondary, #666);
  font-family: Montserrat;
  font-size: 16px;
  font-style: normal;
  font-weight: 600;
  line-height: 24px;
  letter-spacing: -0.25px;
}
.card-token-code[data-v-dc2182de] {
  color: var(--q-neutral-80, #404040);
  font-family: Montserrat;
  font-size: 44px;
  font-style: normal;
  font-weight: 700;
  line-height: 48px;
  letter-spacing: -0.5px;
}
.card-token-description[data-v-dc2182de] {
  color: var(--q-text-secondary, #666);
  font-family: Montserrat;
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  line-height: 20px;
  letter-spacing: -0.25px;
}
.line[data-v-dc2182de] {
  height: 1px;
  width: 100%;
  border: 1px solid var(--q-neutral-30, #E5E5E5);
}
@media (min-width: 980px) {
.line[data-v-dc2182de] {
    height: 100%;
    width: 1px;
}
.content-first[data-v-dc2182de] {
    flex: 55%;
}
.card-token[data-v-dc2182de] {
    flex: 45%;
}
.card-workshop[data-v-dc2182de] {
    width: 60vw;
    flex-direction: row;
}
}
/*!******************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??clonedRuleSet-22.use[1]!./node_modules/@vue/cli-service/node_modules/vue-loader/dist/stylePostLoader.js!./node_modules/postcss-loader/dist/cjs.js??clonedRuleSet-22.use[2]!./node_modules/sass-loader/dist/cjs.js??clonedRuleSet-22.use[3]!./node_modules/vue-cli-plugin-quasar/lib/loader.scss.js!./node_modules/vue-cli-plugin-quasar/lib/loader.vue.auto-import-quasar.js??ruleSet[0].use[0]!./node_modules/@vue/cli-service/node_modules/vue-loader/dist/index.js??ruleSet[0].use[1]!./src/modules/knowledge/components/cards/workshop/CardWorkshopCheckIn.vue?vue&type=style&index=0&id=04cabfe5&scoped=true&lang=scss ***!
  \******************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
.card-workshop[data-v-04cabfe5] {
  margin-top: 60px;
}
.line[data-v-04cabfe5] {
  height: 1px;
  width: 100%;
  border: 1px solid var(--q-neutral-30, #E5E5E5);
}
.card-workshop[data-v-04cabfe5] {
  width: 500px;
  height: 500px;
  display: flex;
  flex-direction: column;
  padding: 24px;
  align-items: center;
  gap: 24px;
  border-radius: 16px;
  border: 1px solid var(--Grayscale-Grayscale-30, #E5E5E5);
  background: var(--Grayscale-Grayscale-0, #FFF);
}
.bg-icon[data-v-04cabfe5] {
  display: flex;
  padding: 12px;
  justify-content: center;
  align-items: center;
  width: 48px;
  height: 48px;
  border-radius: 999px;
  background: var(--q-personal-0, #FFF5F6);
}
.card-type[data-v-04cabfe5] {
  color: var(--q-neutral-100, #000);
  font-family: Montserrat;
  font-size: 14px;
  font-style: normal;
  font-weight: 600;
  line-height: 20px;
  /* 142.857% */
  letter-spacing: -0.25px;
}
.workshop-title[data-v-04cabfe5] {
  color: var(--q-text-secondary, #666);
  font-family: Montserrat;
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  line-height: 20px;
  /* 142.857% */
  letter-spacing: -0.25px;
}
.container-address[data-v-04cabfe5] {
  display: flex;
  justify-content: baseline;
  gap: 8px;
}
.send-to-address[data-v-04cabfe5] {
  color: var(--q-personal-70, #FE4E64);
  text-align: center;
  font-family: Montserrat;
  font-size: 12px;
  font-style: normal;
  font-weight: 600;
  line-height: 16px;
  /* 133.333% */
  letter-spacing: -0.25px;
}
.workshop-description[data-v-04cabfe5] {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.workshop-description-item[data-v-04cabfe5] {
  display: flex;
  gap: 4px;
  align-items: center;
}
.workshop-description-item .bg-icon[data-v-04cabfe5] {
  width: 33px;
  height: 33px;
}
.workshop-description-item[data-v-04cabfe5] :is(strong, time, address) {
  color: var(--q-neutral-60, #808080);
  font-family: Montserrat;
  font-size: 0.75rem;
  font-style: normal;
  font-weight: 600;
  line-height: 16px;
  letter-spacing: -0.25px;
}
/*!***********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??clonedRuleSet-22.use[1]!./node_modules/@vue/cli-service/node_modules/vue-loader/dist/stylePostLoader.js!./node_modules/postcss-loader/dist/cjs.js??clonedRuleSet-22.use[2]!./node_modules/sass-loader/dist/cjs.js??clonedRuleSet-22.use[3]!./node_modules/vue-cli-plugin-quasar/lib/loader.scss.js!./node_modules/vue-cli-plugin-quasar/lib/loader.vue.auto-import-quasar.js??ruleSet[0].use[0]!./node_modules/@vue/cli-service/node_modules/vue-loader/dist/index.js??ruleSet[0].use[1]!./src/modules/knowledge/components/cards/workshop/CardMaterial.vue?vue&type=style&index=0&id=b776d75a&lang=scss&scoped=true ***!
  \***********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
.card-material[data-v-b776d75a] {
  display: flex;
  padding: 16px 16px 0 16px;
  gap: 16px;
  background: var(--q-neutral-0, #FFF);
  height: 72px;
  box-shadow: 0px 0px 4px var(--q-shadow-primary);
}
.card-material[data-v-b776d75a]:first-child {
  border-radius: 8px 8px 0 0;
}
.card-material[data-v-b776d75a]:last-child {
  border-radius: 0 0 8px 8px;
}
.card-material + .card-material[data-v-b776d75a] {
  border-top: 1px solid #ccc;
}
.card-material .card-info[data-v-b776d75a] {
  flex: 1;
}
.card-material .card-info-title[data-v-b776d75a] {
  color: var(--q-neutral-100, #000);
  font-family: Montserrat;
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  line-height: 20px;
  letter-spacing: -0.25px;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow-y: hidden;
}
.card-material .card-info-description[data-v-b776d75a] {
  color: var(--q-text-secondary, #666);
  font-family: Montserrat;
  font-size: 12px;
  font-style: normal;
  font-weight: 500;
  line-height: 16px;
  /* 133.333% */
  letter-spacing: -0.25px;
}
/*!********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??clonedRuleSet-22.use[1]!./node_modules/@vue/cli-service/node_modules/vue-loader/dist/stylePostLoader.js!./node_modules/postcss-loader/dist/cjs.js??clonedRuleSet-22.use[2]!./node_modules/sass-loader/dist/cjs.js??clonedRuleSet-22.use[3]!./node_modules/vue-cli-plugin-quasar/lib/loader.scss.js!./node_modules/vue-cli-plugin-quasar/lib/loader.vue.auto-import-quasar.js??ruleSet[0].use[0]!./node_modules/@vue/cli-service/node_modules/vue-loader/dist/index.js??ruleSet[0].use[1]!./src/modules/company/components/cards/CardRole.vue?vue&type=style&index=0&id=57ecaac6&scoped=true&lang=scss ***!
  \********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
.card[data-v-57ecaac6] {
  width: 100%;
  min-height: 200px;
  padding: 16px;
  margin-bottom: 16px;
  cursor: pointer;
}
.card-button[data-v-57ecaac6] {
  display: none;
  visibility: hidden;
}
.card[data-v-57ecaac6] {
  border-radius: 8px;
  background: var(--q-neutral-0, #fff);
  box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.15);
}
.card[data-v-57ecaac6]:hover {
  background-color: var(--q-personal-0);
  box-shadow: 0px 8px 20px 0px rgba(0, 0, 0, 0.15);
  border: 1px solid var(--q-personal-70);
}
.card:hover .card-button[data-v-57ecaac6] {
  display: block;
  visibility: visible;
}
.card-header[data-v-57ecaac6] {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  margin-bottom: 8px;
}
.card .bg-icon[data-v-57ecaac6] {
  display: flex;
  width: 43px;
  height: 41px;
  padding: 12px 12px 13px 13px;
  justify-content: center;
  align-items: center;
  border-radius: 8px;
  background: var(--q-neutral-20, #f2f2f2);
}
.card-title[data-v-57ecaac6] {
  color: var(--q-neutral-100, #000);
  font-family: Montserrat;
  font-size: 14px;
  font-style: normal;
  font-weight: 600;
  line-height: 20px; /* 142.857% */
  letter-spacing: -0.25px;
}
.card-description[data-v-57ecaac6] {
  color: var(--q-text-secondary, #666);
  font-family: Montserrat;
  font-size: 12px;
  font-style: normal;
  font-weight: 500;
  line-height: 16px; /* 133.333% */
  letter-spacing: -0.25px;
}
.card-subdescription[data-v-57ecaac6] {
  margin-top: 16px;
  color: var(--q-text-secondary, #666);
  font-family: Montserrat;
  font-size: 10px;
  font-style: normal;
  font-weight: 600;
  line-height: 16px;
  letter-spacing: -0.25px;
}
.card-description-text[data-v-57ecaac6] {
  margin-top: 8px;
  margin-bottom: 0;
  color: var(--q-text-secondary, #666);
  font-family: Montserrat;
  font-size: 12px;
  font-style: normal;
  font-weight: 400;
  line-height: 18px;
  letter-spacing: -0.25px;
  overflow: visible;
}
/*!************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??clonedRuleSet-22.use[1]!./node_modules/@vue/cli-service/node_modules/vue-loader/dist/stylePostLoader.js!./node_modules/postcss-loader/dist/cjs.js??clonedRuleSet-22.use[2]!./node_modules/sass-loader/dist/cjs.js??clonedRuleSet-22.use[3]!./node_modules/vue-cli-plugin-quasar/lib/loader.scss.js!./node_modules/vue-cli-plugin-quasar/lib/loader.vue.auto-import-quasar.js??ruleSet[0].use[0]!./node_modules/@vue/cli-service/node_modules/vue-loader/dist/index.js??ruleSet[0].use[1]!./src/modules/company/pages/Roles/Roles.vue?vue&type=style&index=0&id=150bd950&scoped=true&lang=scss ***!
  \************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
.label-new-role[data-v-150bd950] {
  font-family: Montserrat;
  font-weight: 500;
  font-style: Medium;
  font-size: 16px;
  line-height: 24px;
  letter-spacing: -0.25px;
  color: var(--q-text-primary);
}
.header[data-v-150bd950] {
  display: flex;
  margin: 24px 16px;
  justify-content: space-between;
}
.header .go-back[data-v-150bd950] {
  color: var(--q-text-secondary);
}
.header .primary-content[data-v-150bd950] {
  display: flex;
  align-items: center;
  gap: 5px;
}
.header-title[data-v-150bd950] {
  color: var(--q-text-primary);
  font-family: Montserrat;
  font-size: 24px;
  font-style: normal;
  font-weight: 700;
  line-height: 32px; /* 133.333% */
  letter-spacing: -0.5px;
}
.header-subtitle[data-v-150bd950] {
  color: var(--q-text-secondary, #666);
  font-family: Montserrat;
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  line-height: 20px; /* 142.857% */
  letter-spacing: -0.25px;
}
.create-dropdown[data-v-150bd950] {
  height: 48px;
}
.create-dropdown__label[data-v-150bd950] {
  letter-spacing: -0.25px;
  font-family: Montserrat;
  font-style: normal;
  font-weight: 600;
  font-size: 16px;
  line-height: 20px;
  color: white;
}
.create-dropdown__menu[data-v-150bd950] {
  min-width: 230px;
  padding: 8px 0;
}
.create-dropdown__item-label[data-v-150bd950] {
  font-family: Montserrat;
  font-size: 14px;
  font-weight: 500;
  color: var(--q-text-primary);
}
.container-roles[data-v-150bd950] {
  padding: 24px;
}
.container-roles .title[data-v-150bd950] {
  color: var(--q-text-secondary, #666);
  font-family: Montserrat;
  font-size: 16px;
  font-style: normal;
  font-weight: 600;
  line-height: 24px; /* 150% */
  letter-spacing: -0.25px;
  margin-bottom: 16px;
}
.container-roles .roles[data-v-150bd950] {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
  align-content: start;
  gap: 16px;
  height: 87dvh;
  padding-bottom: 80px;
  overflow-y: auto;
}
/*!*************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??clonedRuleSet-22.use[1]!./node_modules/@vue/cli-service/node_modules/vue-loader/dist/stylePostLoader.js!./node_modules/postcss-loader/dist/cjs.js??clonedRuleSet-22.use[2]!./node_modules/sass-loader/dist/cjs.js??clonedRuleSet-22.use[3]!./node_modules/vue-cli-plugin-quasar/lib/loader.scss.js!./node_modules/vue-cli-plugin-quasar/lib/loader.vue.auto-import-quasar.js??ruleSet[0].use[0]!./node_modules/@vue/cli-service/node_modules/vue-loader/dist/index.js??ruleSet[0].use[1]!./src/modules/company/components/Expansions/PermissionsExpansion.vue?vue&type=style&index=0&id=0a9a04b3&scoped=true&lang=scss ***!
  \*************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
.expansion-item + .expansion-item[data-v-0a9a04b3] {
  margin-top: 16px;
}
.expansion-item[data-v-0a9a04b3] {
  border-radius: 16px;
  background-color: var(--q-bg-elevation);
  filter: drop-shadow(0px 0px 4px rgba(0, 0, 0, 0.15));
}
.expansion-item .expansion-title[data-v-0a9a04b3] {
  color: var(--q-text-secondary, #666);
  font-family: Montserrat;
  font-size: 0.75rem;
  font-style: normal;
  font-weight: 600;
  line-height: 16px;
  letter-spacing: -0.25px;
}
.permission-name[data-v-0a9a04b3] {
  color: var(--q-text-secondary, #666);
  font-family: Montserrat;
  font-size: 0.75rem;
  font-style: normal;
  font-weight: 500;
  line-height: 16px;
  letter-spacing: -0.25px;
}
/*!*****************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??clonedRuleSet-22.use[1]!./node_modules/@vue/cli-service/node_modules/vue-loader/dist/stylePostLoader.js!./node_modules/postcss-loader/dist/cjs.js??clonedRuleSet-22.use[2]!./node_modules/sass-loader/dist/cjs.js??clonedRuleSet-22.use[3]!./node_modules/vue-cli-plugin-quasar/lib/loader.scss.js!./node_modules/vue-cli-plugin-quasar/lib/loader.vue.auto-import-quasar.js??ruleSet[0].use[0]!./node_modules/@vue/cli-service/node_modules/vue-loader/dist/index.js??ruleSet[0].use[1]!./src/modules/company/pages/Role/Permissions.vue?vue&type=style&index=0&id=333cbf61&scoped=true&lang=scss ***!
  \*****************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
.container-permissions[data-v-333cbf61] {
  overflow-y: scroll;
  height: 77dvh;
  padding-bottom: 90px;
}
.header[data-v-333cbf61] {
  display: flex;
  justify-content: space-between;
  margin-bottom: 30px;
}
.header .label[data-v-333cbf61] {
  color: var(--q-text-secondary, #666);
  font-family: Montserrat;
  font-size: 1rem;
  font-style: normal;
  font-weight: 600;
  line-height: 24px; /* 150% */
  letter-spacing: -0.25px;
  cursor: pointer;
}
.header-title[data-v-333cbf61] {
  color: var(--q-text-primary, #1a1a1a);
  font-family: Montserrat;
  font-size: 1.25rem;
  font-style: normal;
  font-weight: 600;
  line-height: 24px; /* 120% */
  letter-spacing: -0.5px;
}
/*!*****************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??clonedRuleSet-22.use[1]!./node_modules/@vue/cli-service/node_modules/vue-loader/dist/stylePostLoader.js!./node_modules/postcss-loader/dist/cjs.js??clonedRuleSet-22.use[2]!./node_modules/sass-loader/dist/cjs.js??clonedRuleSet-22.use[3]!./node_modules/vue-cli-plugin-quasar/lib/loader.scss.js!./node_modules/vue-cli-plugin-quasar/lib/loader.vue.auto-import-quasar.js??ruleSet[0].use[0]!./node_modules/@vue/cli-service/node_modules/vue-loader/dist/index.js??ruleSet[0].use[1]!./src/modules/company/components/dialog/DialogDeleteRole.vue?vue&type=style&index=0&id=2ed323fd&scoped=true&lang=scss ***!
  \*****************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
.dialog[data-v-2ed323fd] {
  text-align: center;
  border-radius: 8px;
}
.dialog-description[data-v-2ed323fd] {
  text-align: center;
  color: var(--q-text-secondary, #666);
  font-family: Montserrat;
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  line-height: 20px; /* 142.857% */
  letter-spacing: -0.25px;
}
.dialog-title[data-v-2ed323fd] {
  color: #000;
  /* Heading/H5/Bold */
  font-family: Montserrat;
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  line-height: 24px; /* 150% */
  letter-spacing: -0.25px;
}
/*!**********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??clonedRuleSet-22.use[1]!./node_modules/@vue/cli-service/node_modules/vue-loader/dist/stylePostLoader.js!./node_modules/postcss-loader/dist/cjs.js??clonedRuleSet-22.use[2]!./node_modules/sass-loader/dist/cjs.js??clonedRuleSet-22.use[3]!./node_modules/vue-cli-plugin-quasar/lib/loader.scss.js!./node_modules/vue-cli-plugin-quasar/lib/loader.vue.auto-import-quasar.js??ruleSet[0].use[0]!./node_modules/@vue/cli-service/node_modules/vue-loader/dist/index.js??ruleSet[0].use[1]!./src/modules/company/pages/Role/Role.vue?vue&type=style&index=0&id=a755fd56&scoped=true&lang=scss ***!
  \**********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
.header[data-v-a755fd56] {
  display: flex;
  margin: 24px 16px;
  justify-content: space-between;
}
.header .go-back[data-v-a755fd56] {
  color: var(--q-text-secondary);
}
.header .primary-content[data-v-a755fd56] {
  display: flex;
  align-items: center;
}
.header .secondary-content[data-v-a755fd56] {
  display: flex;
  gap: 24px;
}
.header-title[data-v-a755fd56] {
  color: var(--q-text-primary);
  font-family: Montserrat;
  font-size: 24px;
  font-style: normal;
  font-weight: 700;
  line-height: 32px; /* 133.333% */
  letter-spacing: -0.5px;
}
.container-form[data-v-a755fd56] {
  padding: 0 24px;
  margin-top: 40px;
}
.container-form .form[data-v-a755fd56] {
  margin-bottom: 40px;
}
.container-form .form .input[data-v-a755fd56] {
  width: 95%;
}
.container-form .form .base-select[data-v-a755fd56] {
  width: 100%;
}
.container-form .form .base-select[data-v-a755fd56] .q-field__control {
  background: var(--q-neutral-0, #fff);
  border-radius: 8px;
}
.container-form .form .perfil-name[data-v-a755fd56] {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 4px;
  padding: 16px 24px;
  border-radius: 8px;
  border: 1px solid var(--q-neutral-40, #ccc);
  background: var(--q-neutral-0, #fff);
}
.container-form .form .perfil-name .name[data-v-a755fd56] {
  color: var(--q-neutral-100, #000);
  font-family: Montserrat;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 24px; /* 150% */
  letter-spacing: -0.25px;
}
.label[data-v-a755fd56] {
  margin-bottom: 4px;
  color: var(--q-tex-secundary);
  font-family: Montserrat;
  font-size: 20px;
  font-style: normal;
  font-weight: 600;
  line-height: 24px; /* 120% */
  letter-spacing: -0.5px;
}