/*!**************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??clonedRuleSet-2.use[1]!./node_modules/sass-loader/dist/cjs.js??clonedRuleSet-2.use[2]!./src/styles/app.scss ***!
  \**************************************************************************************************************************************************************/
.el-input__wrapper,
.el-textarea__inner,
.el-select__wrapper {
  background-color: rgba(255, 255, 255, 0.05);
  box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.2) inset;
}

.el-input__wrapper:hover,
.el-textarea__inner:hover,
.el-select__wrapper:hover {
  box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.4) inset;
}

.el-input__wrapper.is-focus,
.el-textarea__inner:focus,
.el-select__wrapper.is-focused {
  box-shadow: 0 0 0 1px rgb(40, 40, 207) inset !important;
}

.el-input__inner,
.el-textarea__inner,
.el-select__selected-item,
.el-select__placeholder {
  color: white;
}

.el-input__inner::placeholder,
.el-textarea__inner::placeholder,
.el-select__placeholder.is-transparent {
  color: rgba(255, 255, 255, 0.5);
}

.el-input.is-disabled .el-input__wrapper,
.el-textarea.is-disabled .el-textarea__inner,
.el-select__wrapper.is-disabled {
  background-color: rgba(255, 255, 255, 0.03);
  box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.1) inset;
}

.el-input.is-disabled .el-input__inner,
.el-textarea.is-disabled .el-textarea__inner,
.el-select__wrapper.is-disabled .el-select__placeholder {
  color: rgba(255, 255, 255, 0.3);
}

.el-select-dropdown {
  background-color: rgb(40, 40, 207);
  border-color: rgba(255, 255, 255, 0.2);
}
.el-select-dropdown .el-select-dropdown__item {
  color: white;
}
.el-select-dropdown .el-select-dropdown__item.is-hovering {
  background-color: rgba(255, 255, 255, 0.1);
}
.el-select-dropdown .el-select-dropdown__item.is-selected {
  color: white;
  font-weight: bold;
}
.el-select-dropdown .el-select-dropdown__item.is-disabled {
  color: rgba(255, 255, 255, 0.3);
}
.el-select-dropdown .el-popper__arrow::before {
  background-color: rgb(40, 40, 207);
  border-color: rgba(255, 255, 255, 0.2);
}

.el-button--primary {
  --el-button-text-color: white;
  --el-button-bg-color: rgb(86, 86, 211);
  --el-button-border-color: rgb(120, 120, 235);
  --el-button-hover-text-color: white;
  --el-button-hover-bg-color: rgb(110, 110, 230);
  --el-button-hover-border-color: rgb(120, 120, 235);
  --el-button-active-text-color: white;
  --el-button-active-bg-color: rgb(110, 110, 230);
  --el-button-active-border-color: rgb(120, 120, 235);
  --el-button-outline-color: rgb(120, 120, 235);
  --el-button-disabled-text-color: rgba(255, 255, 255, 0.3);
  --el-button-disabled-bg-color: rgba(255, 255, 255, 0.05);
  --el-button-disabled-border-color: rgba(255, 255, 255, 0.1);
}

.el-button--primary.is-plain,
.el-button--primary.is-text,
.el-button--primary.is-link {
  --el-button-text-color: rgb(120, 120, 235);
  --el-button-bg-color: transparent;
  --el-button-hover-text-color: white;
  --el-button-hover-bg-color: rgb(86, 86, 211);
  --el-button-active-text-color: white;
  --el-button-active-bg-color: rgb(110, 110, 230);
}

.el-button--primary.is-text,
.el-button--primary.is-link {
  --el-button-border-color: transparent;
  --el-button-hover-border-color: transparent;
  --el-button-active-border-color: transparent;
  --el-button-hover-bg-color: rgba(255, 255, 255, 0.08);
  --el-button-hover-text-color: rgb(110, 110, 230);
  --el-button-active-bg-color: rgba(255, 255, 255, 0.12);
}

.el-button--success {
  --el-button-text-color: white;
  --el-button-bg-color: rgb(40, 150, 70);
  --el-button-border-color: rgb(70, 190, 105);
  --el-button-hover-text-color: white;
  --el-button-hover-bg-color: rgb(55, 175, 90);
  --el-button-hover-border-color: rgb(70, 190, 105);
  --el-button-active-text-color: white;
  --el-button-active-bg-color: rgb(55, 175, 90);
  --el-button-active-border-color: rgb(70, 190, 105);
  --el-button-outline-color: rgb(70, 190, 105);
  --el-button-disabled-text-color: rgba(255, 255, 255, 0.3);
  --el-button-disabled-bg-color: rgba(255, 255, 255, 0.05);
  --el-button-disabled-border-color: rgba(255, 255, 255, 0.1);
}

.el-button--success.is-plain,
.el-button--success.is-text,
.el-button--success.is-link {
  --el-button-text-color: rgb(70, 190, 105);
  --el-button-bg-color: transparent;
  --el-button-hover-text-color: white;
  --el-button-hover-bg-color: rgb(40, 150, 70);
  --el-button-active-text-color: white;
  --el-button-active-bg-color: rgb(55, 175, 90);
}

.el-button--success.is-text,
.el-button--success.is-link {
  --el-button-border-color: transparent;
  --el-button-hover-border-color: transparent;
  --el-button-active-border-color: transparent;
  --el-button-hover-bg-color: rgba(255, 255, 255, 0.08);
  --el-button-hover-text-color: rgb(55, 175, 90);
  --el-button-active-bg-color: rgba(255, 255, 255, 0.12);
}

.el-button--warning {
  --el-button-text-color: white;
  --el-button-bg-color: rgb(226, 103, 15);
  --el-button-border-color: rgb(245, 140, 60);
  --el-button-hover-text-color: white;
  --el-button-hover-bg-color: rgb(240, 125, 40);
  --el-button-hover-border-color: rgb(245, 140, 60);
  --el-button-active-text-color: white;
  --el-button-active-bg-color: rgb(240, 125, 40);
  --el-button-active-border-color: rgb(245, 140, 60);
  --el-button-outline-color: rgb(245, 140, 60);
  --el-button-disabled-text-color: rgba(255, 255, 255, 0.3);
  --el-button-disabled-bg-color: rgba(255, 255, 255, 0.05);
  --el-button-disabled-border-color: rgba(255, 255, 255, 0.1);
}

.el-button--warning.is-plain,
.el-button--warning.is-text,
.el-button--warning.is-link {
  --el-button-text-color: rgb(245, 140, 60);
  --el-button-bg-color: transparent;
  --el-button-hover-text-color: white;
  --el-button-hover-bg-color: rgb(226, 103, 15);
  --el-button-active-text-color: white;
  --el-button-active-bg-color: rgb(240, 125, 40);
}

.el-button--warning.is-text,
.el-button--warning.is-link {
  --el-button-border-color: transparent;
  --el-button-hover-border-color: transparent;
  --el-button-active-border-color: transparent;
  --el-button-hover-bg-color: rgba(255, 255, 255, 0.08);
  --el-button-hover-text-color: rgb(240, 125, 40);
  --el-button-active-bg-color: rgba(255, 255, 255, 0.12);
}

.el-button--danger {
  --el-button-text-color: white;
  --el-button-bg-color: rgb(211, 86, 86);
  --el-button-border-color: rgb(235, 125, 125);
  --el-button-hover-text-color: white;
  --el-button-hover-bg-color: rgb(228, 108, 108);
  --el-button-hover-border-color: rgb(235, 125, 125);
  --el-button-active-text-color: white;
  --el-button-active-bg-color: rgb(228, 108, 108);
  --el-button-active-border-color: rgb(235, 125, 125);
  --el-button-outline-color: rgb(235, 125, 125);
  --el-button-disabled-text-color: rgba(255, 255, 255, 0.3);
  --el-button-disabled-bg-color: rgba(255, 255, 255, 0.05);
  --el-button-disabled-border-color: rgba(255, 255, 255, 0.1);
}

.el-button--danger.is-plain,
.el-button--danger.is-text,
.el-button--danger.is-link {
  --el-button-text-color: rgb(235, 125, 125);
  --el-button-bg-color: transparent;
  --el-button-hover-text-color: white;
  --el-button-hover-bg-color: rgb(211, 86, 86);
  --el-button-active-text-color: white;
  --el-button-active-bg-color: rgb(228, 108, 108);
}

.el-button--danger.is-text,
.el-button--danger.is-link {
  --el-button-border-color: transparent;
  --el-button-hover-border-color: transparent;
  --el-button-active-border-color: transparent;
  --el-button-hover-bg-color: rgba(255, 255, 255, 0.08);
  --el-button-hover-text-color: rgb(228, 108, 108);
  --el-button-active-bg-color: rgba(255, 255, 255, 0.12);
}

.el-button--info {
  --el-button-text-color: white;
  --el-button-bg-color: rgb(100, 105, 120);
  --el-button-border-color: rgb(140, 145, 160);
  --el-button-hover-text-color: white;
  --el-button-hover-bg-color: rgb(120, 125, 140);
  --el-button-hover-border-color: rgb(140, 145, 160);
  --el-button-active-text-color: white;
  --el-button-active-bg-color: rgb(120, 125, 140);
  --el-button-active-border-color: rgb(140, 145, 160);
  --el-button-outline-color: rgb(140, 145, 160);
  --el-button-disabled-text-color: rgba(255, 255, 255, 0.3);
  --el-button-disabled-bg-color: rgba(255, 255, 255, 0.05);
  --el-button-disabled-border-color: rgba(255, 255, 255, 0.1);
}

.el-button--info.is-plain,
.el-button--info.is-text,
.el-button--info.is-link {
  --el-button-text-color: rgb(140, 145, 160);
  --el-button-bg-color: transparent;
  --el-button-hover-text-color: white;
  --el-button-hover-bg-color: rgb(100, 105, 120);
  --el-button-active-text-color: white;
  --el-button-active-bg-color: rgb(120, 125, 140);
}

.el-button--info.is-text,
.el-button--info.is-link {
  --el-button-border-color: transparent;
  --el-button-hover-border-color: transparent;
  --el-button-active-border-color: transparent;
  --el-button-hover-bg-color: rgba(255, 255, 255, 0.08);
  --el-button-hover-text-color: rgb(120, 125, 140);
  --el-button-active-bg-color: rgba(255, 255, 255, 0.12);
}

.el-button--default,
.el-button:not([class*=el-button--]) {
  --el-button-text-color: white;
  --el-button-bg-color: rgba(255, 255, 255, 0.08);
  --el-button-border-color: rgba(255, 255, 255, 0.3);
  --el-button-hover-text-color: white;
  --el-button-hover-bg-color: rgba(255, 255, 255, 0.18);
  --el-button-hover-border-color: rgba(255, 255, 255, 0.3);
  --el-button-active-text-color: white;
  --el-button-active-bg-color: rgba(255, 255, 255, 0.18);
  --el-button-active-border-color: rgba(255, 255, 255, 0.3);
  --el-button-disabled-text-color: rgba(255, 255, 255, 0.3);
  --el-button-disabled-bg-color: rgba(255, 255, 255, 0.05);
  --el-button-disabled-border-color: rgba(255, 255, 255, 0.1);
}

.el-button.is-text:not(.is-disabled):hover {
  --el-button-hover-text-color: #222;
  color: #222;
}

.el-pagination {
  --el-pagination-bg-color: transparent;
  --el-pagination-text-color: white;
  --el-pagination-button-color: white;
  --el-pagination-button-bg-color: transparent;
  --el-pagination-button-disabled-color: rgba(255, 255, 255, 0.3);
  --el-pagination-button-disabled-bg-color: transparent;
  --el-pagination-hover-color: rgb(110, 110, 230);
  color: white;
}
.el-pagination .btn-prev, .el-pagination .btn-next {
  background-color: transparent;
}
.el-pagination .el-pager li {
  background-color: transparent;
}
.el-pagination .el-pager li.is-active {
  color: rgb(110, 110, 230);
}

.el-message.el-message {
  --el-message-bg-color: rgb(28, 28, 36);
  --el-message-border-color: rgba(255, 255, 255, 0.25);
  --el-message-text-color: white;
  --el-message-close-icon-color: rgb(170, 175, 190);
  --el-message-close-hover-color: white;
  background-color: rgb(28, 28, 36);
  border-color: rgba(255, 255, 255, 0.25);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.6);
}
.el-message.el-message.is-plain, .el-message.el-message.el-message--success, .el-message.el-message.el-message--warning, .el-message.el-message.el-message--error, .el-message.el-message.el-message--info {
  background-color: rgb(28, 28, 36);
  border-color: rgba(255, 255, 255, 0.25);
}
.el-message.el-message .el-message__content, .el-message.el-message .el-message__badge {
  color: white;
}
.el-message.el-message.el-message--success {
  border-left: 4px solid rgb(70, 190, 105);
}
.el-message.el-message.el-message--success .el-message__icon {
  color: rgb(70, 190, 105);
}
.el-message.el-message.el-message--warning {
  border-left: 4px solid rgb(245, 140, 60);
}
.el-message.el-message.el-message--warning .el-message__icon {
  color: rgb(245, 140, 60);
}
.el-message.el-message.el-message--error {
  border-left: 4px solid rgb(235, 125, 125);
}
.el-message.el-message.el-message--error .el-message__icon {
  color: rgb(235, 125, 125);
}
.el-message.el-message.el-message--info {
  border-left: 4px solid rgb(170, 175, 190);
}
.el-message.el-message.el-message--info .el-message__icon {
  color: rgb(170, 175, 190);
}

.el-overlay.is-message-box .el-message-box {
  --el-messagebox-title-color: white;
  --el-messagebox-content-color: white;
  background-color: black;
  border: 1px solid rgb(226, 103, 15);
  border-radius: 5px;
  padding: 0;
  overflow: hidden;
}
.el-overlay.is-message-box .el-message-box .el-message-box__header {
  padding: 14px 40px 14px 20px;
  background-color: rgba(255, 255, 255, 0.08);
  border-bottom: 1px solid rgb(226, 103, 15);
}
.el-overlay.is-message-box .el-message-box .el-message-box__title {
  color: white;
  font-weight: 600;
}
.el-overlay.is-message-box .el-message-box .el-message-box__headerbtn .el-message-box__close {
  color: white;
}
.el-overlay.is-message-box .el-message-box .el-message-box__content {
  padding: 16px 20px;
  color: white;
}
.el-overlay.is-message-box .el-message-box .el-message-box__message {
  color: white;
}
.el-overlay.is-message-box .el-message-box .el-message-box__status.el-message-box-icon--success {
  color: rgb(70, 190, 105);
}
.el-overlay.is-message-box .el-message-box .el-message-box__status.el-message-box-icon--warning {
  color: rgb(245, 140, 60);
}
.el-overlay.is-message-box .el-message-box .el-message-box__status.el-message-box-icon--error {
  color: rgb(235, 125, 125);
}
.el-overlay.is-message-box .el-message-box .el-message-box__status.el-message-box-icon--info {
  color: rgb(170, 175, 190);
}
.el-overlay.is-message-box .el-message-box .el-message-box__btns {
  padding: 12px 20px;
  background-color: rgba(255, 255, 255, 0.08);
  border-top: 1px solid rgb(226, 103, 15);
}

html, body {
  padding: 0;
  margin: 0;
  background-color: black;
}

.grecaptcha-badge {
  visibility: hidden;
}

.recaptcha-request-active .grecaptcha-badge {
  visibility: visible;
}

* {
  box-sizing: border-box;
}

.pre-wrap {
  white-space: pre-wrap;
}

div.center {
  display: flex;
  justify-content: center;
  align-items: center;
}

.horizontal-scroll {
  overflow-x: auto;
}

.el-button > span,
.el-tag__content,
.el-dropdown-menu__item,
.el-menu-item,
.el-menu-item,
.el-sub-menu__title {
  display: flex;
  flex-direction: row;
  align-items: center;
  column-gap: 10px;
}
.el-button > span > .material-icons,
.el-tag__content > .material-icons,
.el-dropdown-menu__item > .material-icons,
.el-menu-item > .material-icons,
.el-menu-item > .material-icons,
.el-sub-menu__title > .material-icons {
  font-size: larger;
}

.el-checkbox > .el-checkbox__label, .el-radio > .el-radio__label {
  white-space: normal;
  word-break: normal;
  overflow-wrap: anywhere;
}

.el-checkbox-group {
  display: flex;
  flex-direction: row;
  row-gap: 10px;
  column-gap: 5px;
}
.el-checkbox-group .el-checkbox {
  flex-wrap: nowrap;
}
.el-checkbox-group .el-checkbox > .el-checkbox__label {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
}

.el-alert > .el-alert__content {
  width: 100%;
  padding-top: 10px;
  padding-bottom: 10px;
}
.el-alert > .el-alert__content > .el-alert__title + .el-alert__description {
  margin-top: 10px;
}
.el-alert > .el-alert__content > .el-alert__description {
  display: flex;
  flex-direction: column;
  row-gap: 10px;
  align-items: flex-start;
  white-space: normal;
  word-break: normal;
}
.el-alert > .el-alert__content > .el-alert__description > * {
  margin: 0;
}
.el-alert > .el-alert__content > .el-alert__description:empty {
  display: none;
}
.el-alert > .el-alert__content > .el-alert__description:first-child {
  margin: 0;
}
.el-alert.is-light.el-alert--warning {
  border: thin solid var(--el-color-warning);
}
.el-alert.is-light.el-alert--warning .el-alert__description {
  color: black;
}

.el-drawer .el-drawer__header {
  background-color: gray;
  color: white;
  padding-bottom: var(--el-drawer-padding-primary);
}
.el-drawer .el-drawer__footer {
  background-color: gray;
  color: white;
}

.spin {
  animation-name: spin;
  animation-duration: 2000ms;
  animation-iteration-count: infinite;
  animation-timing-function: linear;
}

@keyframes spin {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}
/*!******************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??clonedRuleSet-2.use[1]!./node_modules/sass-loader/dist/cjs.js??clonedRuleSet-2.use[2]!./src/styles/layouts.scss ***!
  \******************************************************************************************************************************************************************/
.flex-row, .flex-row-sm, .flex-row-md, .flex-row-lg {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
}
.flex-row.nowrap, .flex-row-sm.nowrap, .flex-row-md.nowrap, .flex-row-lg.nowrap {
  flex-wrap: nowrap;
}
.flex-row.flex-inline, .flex-row-sm.flex-inline, .flex-row-md.flex-inline, .flex-row-lg.flex-inline {
  display: inline-flex;
}
.flex-row > .flex-1, .flex-row-sm > .flex-1, .flex-row-md > .flex-1, .flex-row-lg > .flex-1 {
  flex: 1;
}
.flex-row > .flex-100, .flex-row-sm > .flex-100, .flex-row-md > .flex-100, .flex-row-lg > .flex-100 {
  flex-basis: 100%;
}
.flex-row > *, .flex-row > .el-button + .el-button, .flex-row-sm > *, .flex-row-sm > .el-button + .el-button, .flex-row-md > *, .flex-row-md > .el-button + .el-button, .flex-row-lg > *, .flex-row-lg > .el-button + .el-button {
  margin: 0;
}
.flex-row > .align-start, .flex-row-sm > .align-start, .flex-row-md > .align-start, .flex-row-lg > .align-start {
  align-self: flex-start;
}
.flex-row > .align-end, .flex-row-sm > .align-end, .flex-row-md > .align-end, .flex-row-lg > .align-end {
  align-self: flex-end;
}

.flex-row {
  row-gap: 10px;
  column-gap: 10px;
}

.flex-row-sm {
  row-gap: 5px;
  column-gap: 5px;
}

.flex-row-md {
  row-gap: 10px;
  column-gap: 20px;
}

.flex-row-lg {
  row-gap: 20px;
  column-gap: 40px;
}

.flex-column, .flex-column-sm, .flex-column-md, .flex-column-lg, .flex-column-xl {
  display: flex;
  flex-direction: column;
  align-items: stretch;
}
.flex-column.flex-align-end, .flex-column-sm.flex-align-end, .flex-column-md.flex-align-end, .flex-column-lg.flex-align-end, .flex-column-xl.flex-align-end {
  align-items: flex-end;
}
.flex-column > *, .flex-column > .el-button + .el-button, .flex-column-sm > *, .flex-column-sm > .el-button + .el-button, .flex-column-md > *, .flex-column-md > .el-button + .el-button, .flex-column-lg > *, .flex-column-lg > .el-button + .el-button, .flex-column-xl > *, .flex-column-xl > .el-button + .el-button {
  margin: 0;
}

.flex-column {
  row-gap: 10px;
}

.flex-column-sm {
  row-gap: 5px;
}

.flex-column-md {
  row-gap: 20px;
}

.flex-column-lg {
  row-gap: 40px;
}

.flex-column-xl {
  row-gap: 60px;
}

.page-width-sm {
  max-width: 600px;
  margin: 0 auto;
}

.page-width-md {
  max-width: 800px;
  margin: 0 auto;
}

.page-width-lg {
  max-width: 1000px;
  margin: 0 auto;
}

.page-width-xl {
  max-width: 1200px;
  margin: 0 auto;
}
/*!****************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??clonedRuleSet-2.use[1]!./node_modules/sass-loader/dist/cjs.js??clonedRuleSet-2.use[2]!./src/styles/admin.scss ***!
  \****************************************************************************************************************************************************************/
.admin-page {
  color: white;
  font-size: 1.1rem;
}
.admin-page .no-access, .admin-page .no-items, .admin-page .total-items {
  opacity: 0.7;
}
.admin-page .admin-box {
  border: 1px solid rgba(255, 255, 255, 0.2);
  border-radius: 6px;
  padding: 12px;
  align-items: flex-start;
}
.admin-page .admin-box h3 {
  margin: 0;
}
.admin-page .admin-table-box {
  border: 1px solid rgba(255, 255, 255, 0.2);
  border-radius: 6px;
  padding: 12px;
  display: flex;
  flex-direction: column;
  row-gap: 8px;
  align-items: stretch;
}
.admin-page .admin-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  column-gap: 12px;
}
.admin-page .admin-pagination {
  justify-content: center;
  align-items: center;
  margin: 8px 0;
}
.admin-page .admin-table-wrap {
  overflow-x: auto;
}
.admin-page .admin-table {
  width: 100%;
  border-collapse: collapse;
}
.admin-page .admin-table th, .admin-page .admin-table td {
  padding: 8px 12px;
  text-align: left;
  border-bottom: 1px solid rgba(255, 255, 255, 0.15);
  white-space: nowrap;
}
.admin-page .admin-table th {
  background: rgba(255, 255, 255, 0.08);
  border-bottom: 3px solid rgba(255, 255, 255, 0.35);
}
.admin-page .admin-table .check {
  width: 1%;
}
.admin-page .admin-table .number {
  text-align: right;
}
.admin-page .admin-table .wrap {
  white-space: normal;
  min-width: 200px;
  word-break: break-word;
}
.admin-page .admin-table small {
  opacity: 0.7;
}
.admin-page .admin-section {
  margin-bottom: 24px;
}
.admin-page .admin-section-header {
  display: flex;
  align-items: center;
  column-gap: 8px;
  margin: 0 0 12px;
  font-size: 1.5rem;
  cursor: pointer;
  user-select: none;
  border-bottom: 2px solid rgba(255, 255, 255, 0.35);
  padding-bottom: 8px;
}
.admin-page .el-input, .admin-page .el-select, .admin-page .el-button, .admin-page .el-checkbox {
  font-size: 1rem;
}
.admin-page .el-button {
  --el-button-size: 36px;
}
.admin-page .admin-table small, .admin-page .total-items, .admin-page .no-items, .admin-page .no-access {
  font-size: 1rem;
}
/*!*************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??clonedRuleSet-2.use[1]!./node_modules/vue-loader/dist/stylePostLoader.js!./node_modules/sass-loader/dist/cjs.js??clonedRuleSet-2.use[2]!./node_modules/vue-loader/dist/index.js??ruleSet[1].rules[5].use[0]!./src/app.vue?vue&type=style&index=0&id=5ef48958&lang=scss ***!
  \*************************************************************************************************************************************************************************************************************************************************************************************************************************/
.pocket-app > header {
  margin: 0;
  padding: 20px;
  background-color: rgb(226, 103, 15);
  color: white;
}
.pocket-app > header > h1 {
  font-size: 2em;
}
.pocket-app > header a:link, .pocket-app > header a:visited {
  color: white;
}
.pocket-app > .body {
  color: white;
  padding: 40px 40px 80px;
  background: linear-gradient(to bottom, rgb(226, 103, 15), transparent 10px), transparent;
}
.pocket-app > .body a:link, .pocket-app > .body a:visited {
  color: white;
}
.pocket-app.is-mobile > header {
  padding: 10px;
}
.pocket-app.is-mobile > header > h1 {
  font-size: 1.5em;
}
.pocket-app.is-mobile > .body {
  padding: 20px 10px 60px;
}
/*!*******************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??clonedRuleSet-2.use[1]!./node_modules/vue-loader/dist/stylePostLoader.js!./node_modules/sass-loader/dist/cjs.js??clonedRuleSet-2.use[2]!./node_modules/vue-loader/dist/index.js??ruleSet[1].rules[5].use[0]!./src/widgets/material-icon.vue?vue&type=style&index=0&id=55e49714&lang=scss ***!
  \*******************************************************************************************************************************************************************************************************************************************************************************************************************************************/
.material-symbols-outlined {
  font-family: "Material Symbols Outlined";
  font-size: 24px;
}
.material-symbols-outlined.large {
  font-size: 48px;
}
.material-symbols-outlined.fill {
  font-variation-settings: "FILL" 1, "wght" 400, "GRAD" 0, "opsz" 48;
}
/*!**********************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??clonedRuleSet-2.use[1]!./node_modules/vue-loader/dist/stylePostLoader.js!./node_modules/sass-loader/dist/cjs.js??clonedRuleSet-2.use[2]!./node_modules/vue-loader/dist/index.js??ruleSet[1].rules[5].use[0]!./src/widgets/post.vue?vue&type=style&index=0&id=d2d2ff4e&lang=scss ***!
  \**********************************************************************************************************************************************************************************************************************************************************************************************************************************/
.top-post {
  padding: 12px;
  border-radius: 10px;
  background-color: rgba(255, 255, 255, 0.1);
  border: thin solid rgba(255, 255, 255, 0.15);
  display: flex;
  flex-direction: column;
  row-gap: 10px;
}
.top-post .top-post-header {
  align-items: center;
}
.top-post .top-post-header .top-post-author {
  flex: 1;
  font-weight: bold;
}
.top-post .top-post-header .top-post-author-link {
  color: inherit;
  text-decoration: none;
}
.top-post .top-post-header .top-post-author-link:hover {
  text-decoration: underline;
}
.top-post .top-post-header .top-post-votes {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.top-post .top-post-header .top-post-votes .vote-buttons {
  display: inline-flex;
  align-items: center;
  gap: 4px;
}
.top-post .top-post-header .top-post-votes .vote-btn {
  cursor: pointer;
  font-size: 26px;
  opacity: 0.6;
  border-radius: 999px;
}
.top-post .top-post-header .top-post-votes .vote-btn:hover {
  opacity: 0.85;
}
.top-post .top-post-header .top-post-votes .vote-btn.active {
  opacity: 1;
  color: white;
  padding: 4px;
  background-color: rgb(76, 175, 80);
}
.top-post .top-post-header .top-post-votes .vote-btn.active.downvote {
  background-color: rgb(211, 86, 86);
}
.top-post .top-post-header .top-post-score {
  padding: 2px 8px;
  border-radius: 10px;
  background-color: white;
  color: rgb(40, 40, 207);
  font-weight: bold;
}
.top-post .top-post-text {
  cursor: pointer;
  white-space: pre-wrap;
  word-break: break-word;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 5;
  line-clamp: 5;
  overflow: hidden;
}
.top-post .top-post-text.expanded {
  -webkit-line-clamp: unset;
  line-clamp: unset;
}
.top-post.clickable {
  cursor: pointer;
}
.top-post.size-small {
  padding: 8px;
  row-gap: 6px;
  font-size: 0.85em;
}
.top-post.size-small .top-post-header .top-post-score {
  padding: 2px 8px;
  border-radius: 10px;
}
.top-post.size-medium {
  padding: 12px;
  row-gap: 10px;
  font-size: 1em;
}
.top-post.size-medium .top-post-header .top-post-score {
  padding: 3px 10px;
  border-radius: 11px;
}
.top-post.size-large {
  padding: 20px;
  row-gap: 24px;
  font-size: 1.3em;
}
.top-post.size-large .top-post-header .top-post-score {
  padding: 4px 12px;
  border-radius: 12px;
}
/*!******************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??clonedRuleSet-2.use[1]!./node_modules/vue-loader/dist/stylePostLoader.js!./node_modules/sass-loader/dist/cjs.js??clonedRuleSet-2.use[2]!./node_modules/vue-loader/dist/index.js??ruleSet[1].rules[5].use[0]!./src/widgets/topic-search.vue?vue&type=style&index=0&id=4ef89882&lang=scss ***!
  \******************************************************************************************************************************************************************************************************************************************************************************************************************************************/
.topic-search-row {
  align-items: center;
  position: relative;
  width: 100%;
}
.topic-search-row .topic-search-suggestions {
  display: flex;
  flex-direction: column;
  position: absolute;
  top: 100%;
  left: 0;
  z-index: 1000;
  margin: 4px 0 0;
  padding: 6px;
  gap: 4px;
  list-style: none;
  width: 100%;
  min-width: 200px;
  max-height: 240px;
  overflow-y: auto;
  box-sizing: border-box;
  border: 1px solid rgba(255, 255, 255, 0.25);
  border-radius: 5px;
  background-color: rgb(20, 20, 28);
  color: white;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.6);
}
.topic-search-row .topic-search-suggestions li {
  padding: 8px 12px;
  border-radius: 5px;
  cursor: pointer;
}
.topic-search-row .topic-search-suggestions li:hover, .topic-search-row .topic-search-suggestions li.active {
  background-color: rgba(255, 255, 255, 0.12);
}
/*!******************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??clonedRuleSet-2.use[1]!./node_modules/vue-loader/dist/stylePostLoader.js!./node_modules/sass-loader/dist/cjs.js??clonedRuleSet-2.use[2]!./node_modules/vue-loader/dist/index.js??ruleSet[1].rules[5].use[0]!./src/widgets/topics-input.vue?vue&type=style&index=0&id=100c881a&lang=scss ***!
  \******************************************************************************************************************************************************************************************************************************************************************************************************************************************/
.topics-input .topics-input-tags {
  flex-wrap: wrap;
}
.topics-input .topics-input-tag {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 10px;
  border-radius: 10px;
  border: thin solid white;
  background-color: rgb(86, 86, 211);
  color: white;
  line-height: 1.2;
  white-space: nowrap;
}
.topics-input .topics-input-tag .remove-btn {
  cursor: pointer;
  font-size: 18px;
}
/*!******************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??clonedRuleSet-2.use[1]!./node_modules/vue-loader/dist/stylePostLoader.js!./node_modules/sass-loader/dist/cjs.js??clonedRuleSet-2.use[2]!./node_modules/vue-loader/dist/index.js??ruleSet[1].rules[5].use[0]!./src/pages/posts/add-post.vue?vue&type=style&index=0&id=738a608c&lang=scss ***!
  \******************************************************************************************************************************************************************************************************************************************************************************************************************************************/
.add-post-page {
  color: white;
}
.add-post-page .parent-post-preview {
  border-radius: 5px;
  background: rgba(255, 255, 255, 0.04);
  white-space: pre-wrap;
  word-break: break-word;
}
/*!*******************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??clonedRuleSet-2.use[1]!./node_modules/vue-loader/dist/stylePostLoader.js!./node_modules/sass-loader/dist/cjs.js??clonedRuleSet-2.use[2]!./node_modules/vue-loader/dist/index.js??ruleSet[1].rules[5].use[0]!./src/pages/dashboard/index.vue?vue&type=style&index=0&id=363a5543&lang=scss ***!
  \*******************************************************************************************************************************************************************************************************************************************************************************************************************************************/
.dashboard-page {
  color: white;
}
.dashboard-page > .horizontal-controls {
  padding: 10px;
  border-radius: 5px;
}
.dashboard-page .add-topic-form {
  background-color: rgb(86, 86, 211);
  color: white;
}
.dashboard-page .total-posts, .dashboard-page .no-topics, .dashboard-page .no-sub-posts {
  opacity: 0.7;
  font-size: 0.9em;
}
.dashboard-page .dashboard-columns {
  display: flex;
  align-items: flex-start;
  column-gap: 40px;
}
.dashboard-page .dashboard-columns > .dashboard-column-left {
  flex: 0 0 300px;
  position: sticky;
  top: 20px;
  max-height: calc(100vh - 40px);
  overflow-y: auto;
  padding: 5px;
}
.dashboard-page .dashboard-columns > .dashboard-column-right {
  flex: 1;
  min-width: 0;
  padding: 5px;
}
.dashboard-page .dashboard-columns.is-mobile {
  flex-direction: column;
  row-gap: 40px;
}
.dashboard-page .dashboard-columns.is-mobile > .dashboard-column-left {
  flex-basis: auto;
  position: static;
  max-height: none;
  overflow-y: visible;
}
/*!**************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??clonedRuleSet-2.use[1]!./node_modules/vue-loader/dist/stylePostLoader.js!./node_modules/sass-loader/dist/cjs.js??clonedRuleSet-2.use[2]!./node_modules/vue-loader/dist/index.js??ruleSet[1].rules[5].use[0]!./src/pages/user/index.vue?vue&type=style&index=0&id=4070cfdc&lang=scss ***!
  \**************************************************************************************************************************************************************************************************************************************************************************************************************************************/
.user-page {
  color: white;
}
.user-page .total-posts, .user-page .no-topics, .user-page .no-posts, .user-page .no-user {
  opacity: 0.7;
  font-size: 0.9em;
}
.user-page .user-heading small {
  opacity: 0.7;
}
.user-page .user-columns {
  display: flex;
  align-items: flex-start;
  column-gap: 40px;
}
.user-page .user-columns > .user-column-left {
  flex: 0 0 300px;
  position: sticky;
  top: 20px;
  max-height: calc(100vh - 40px);
  overflow-y: auto;
  padding: 5px;
}
.user-page .user-columns > .user-column-right {
  flex: 1;
  min-width: 0;
  padding: 5px;
}
.user-page .user-columns.is-mobile {
  flex-direction: column;
  row-gap: 40px;
}
.user-page .user-columns.is-mobile > .user-column-left {
  flex-basis: auto;
  position: static;
  max-height: none;
  overflow-y: visible;
}
/*!*********************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??clonedRuleSet-2.use[1]!./node_modules/vue-loader/dist/stylePostLoader.js!./node_modules/sass-loader/dist/cjs.js??clonedRuleSet-2.use[2]!./node_modules/vue-loader/dist/index.js??ruleSet[1].rules[5].use[0]!./src/pages/admin/users-table.vue?vue&type=style&index=0&id=c5ac1296&lang=scss ***!
  \*********************************************************************************************************************************************************************************************************************************************************************************************************************************************/
.admin-users-status {
  min-width: 160px;
}
.admin-users-search {
  min-width: 260px;
}
.admin-table .status.status-moderator {
  color: rgb(150, 150, 255);
}
.admin-table .status.status-admin {
  color: rgb(100, 210, 130);
}
.admin-table .status.status-banned {
  color: rgb(240, 100, 100);
}
.admin-table .status.status-inactive {
  opacity: 0.6;
}
/*!**********************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??clonedRuleSet-2.use[1]!./node_modules/vue-loader/dist/stylePostLoader.js!./node_modules/sass-loader/dist/cjs.js??clonedRuleSet-2.use[2]!./node_modules/vue-loader/dist/index.js??ruleSet[1].rules[5].use[0]!./src/pages/admin/topics-table.vue?vue&type=style&index=0&id=231ef7a9&lang=scss ***!
  \**********************************************************************************************************************************************************************************************************************************************************************************************************************************************/
.admin-search {
  max-width: 320px;
}
.topic-status.is-banned {
  color: rgb(240, 100, 100);
}
.topic-status.is-enabled {
  color: rgb(100, 210, 130);
}
.topic-bulk-actions {
  display: flex;
  align-items: center;
  gap: 8px;
}
.admin-table-controls {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.admin-table-controls .admin-pagination {
  flex: 0 0 auto;
  justify-content: flex-end;
  margin: 0;
}
@media (max-width: 600px) {
.admin-table-controls {
    align-items: flex-start;
    flex-direction: column;
}
.admin-table-controls .admin-pagination {
    justify-content: flex-start;
}
}
/*!**************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??clonedRuleSet-2.use[1]!./node_modules/vue-loader/dist/stylePostLoader.js!./node_modules/sass-loader/dist/cjs.js??clonedRuleSet-2.use[2]!./node_modules/vue-loader/dist/index.js??ruleSet[1].rules[5].use[0]!./src/pages/admin/user.vue?vue&type=style&index=0&id=8da7a2e2&lang=scss ***!
  \**************************************************************************************************************************************************************************************************************************************************************************************************************************************/
.admin-user-page .admin-user-columns {
  display: flex;
  align-items: flex-start;
  column-gap: 40px;
}
.admin-user-page .admin-user-columns > .admin-user-column-left {
  flex: 0 0 300px;
}
.admin-user-page .admin-user-columns > .admin-user-column-right {
  flex: 1;
  min-width: 0;
}
.admin-user-page .admin-user-columns.is-mobile {
  flex-direction: column;
  row-gap: 40px;
  width: 100%;
}
.admin-user-page .admin-user-columns.is-mobile > .admin-user-column-left,
.admin-user-page .admin-user-columns.is-mobile > .admin-user-column-right {
  flex-basis: auto;
  width: 100%;
}
.admin-user-page .admin-user-header .handle {
  opacity: 0.7;
}
.admin-user-page .admin-user-details {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 4px 16px;
  margin: 8px 0;
}
.admin-user-page .admin-user-details dt {
  opacity: 0.7;
  font-size: 0.9em;
}
.admin-user-page .admin-user-details dd {
  margin: 0;
  word-break: break-all;
}
/*!***************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??clonedRuleSet-2.use[1]!./node_modules/vue-loader/dist/stylePostLoader.js!./node_modules/sass-loader/dist/cjs.js??clonedRuleSet-2.use[2]!./node_modules/vue-loader/dist/index.js??ruleSet[1].rules[5].use[0]!./src/widgets/post-revisions-dialog.vue?vue&type=style&index=0&id=76e4bce1&lang=scss ***!
  \***************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
.post-revisions-dialog.el-dialog {
  max-width: 800px;
  padding: 0;
  border-radius: 5px;
  overflow: hidden;
  background: black;
  color: white;
  border: 1px solid rgb(226, 103, 15);
}
.post-revisions-dialog.el-dialog .el-dialog__header {
  margin: 0;
  padding: 14px 20px;
  background: rgba(255, 255, 255, 0.08);
  border-bottom: 1px solid rgb(226, 103, 15);
}
.post-revisions-dialog.el-dialog .el-dialog__title {
  color: white;
  font-weight: 600;
}
.post-revisions-dialog.el-dialog .el-dialog__headerbtn .el-dialog__close {
  color: white;
}
.post-revisions-dialog.el-dialog .el-dialog__body {
  padding: 16px 20px;
  max-height: 60vh;
  overflow-y: auto;
  color: white;
}
.post-revisions-dialog.el-dialog .el-dialog__footer {
  padding: 12px 20px;
  background: rgba(255, 255, 255, 0.08);
  border-top: 1px solid rgb(226, 103, 15);
  text-align: right;
}
.post-revisions-dialog.el-dialog .revision {
  padding: 12px;
  border: 1px solid rgba(255, 255, 255, 0.2);
  border-radius: 5px;
  background: rgba(255, 255, 255, 0.04);
}
.post-revisions-dialog.el-dialog .revision small {
  opacity: 0.7;
  font-weight: 600;
}
.post-revisions-dialog.el-dialog .revision.current {
  border-color: rgb(86, 86, 211);
  background: rgba(86, 86, 211, 0.15);
}
.post-revisions-dialog.el-dialog .revision-diff {
  white-space: pre-wrap;
  word-break: break-word;
  line-height: 1.5;
}
.post-revisions-dialog.el-dialog ins {
  background: rgb(150, 235, 160);
  color: black;
  text-decoration: none;
  border-radius: 2px;
}
.post-revisions-dialog.el-dialog del {
  background: rgb(255, 170, 170);
  color: black;
  border-radius: 2px;
}
/*!**************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??clonedRuleSet-2.use[1]!./node_modules/vue-loader/dist/stylePostLoader.js!./node_modules/sass-loader/dist/cjs.js??clonedRuleSet-2.use[2]!./node_modules/vue-loader/dist/index.js??ruleSet[1].rules[5].use[0]!./src/pages/posts/post.vue?vue&type=style&index=0&id=698b7640&lang=scss ***!
  \**************************************************************************************************************************************************************************************************************************************************************************************************************************************/
.post-page {
  color: white;
}
.post-page .add-topic-form {
  background-color: rgb(86, 86, 211);
  color: white;
}
.post-page .total-posts, .post-page .no-topics, .post-page .no-sub-posts {
  opacity: 0.7;
  font-size: 0.9em;
}
.post-page .post-card {
  border-top: thin solid white;
  border-bottom: thin solid white;
  padding: 10px 0;
}
/*!************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??clonedRuleSet-2.use[1]!./node_modules/vue-loader/dist/stylePostLoader.js!./node_modules/sass-loader/dist/cjs.js??clonedRuleSet-2.use[2]!./node_modules/vue-loader/dist/index.js??ruleSet[1].rules[5].use[0]!./src/pages/user-account/account.vue?vue&type=style&index=0&id=0d07404d&lang=scss&scoped=true ***!
  \************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
.change-password[data-v-0d07404d] {
  margin-left: 10px;
}
/*!***************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??clonedRuleSet-2.use[1]!./node_modules/vue-loader/dist/stylePostLoader.js!./node_modules/sass-loader/dist/cjs.js??clonedRuleSet-2.use[2]!./node_modules/vue-loader/dist/index.js??ruleSet[1].rules[5].use[0]!./src/pages/about/index.vue?vue&type=style&index=0&id=1d95d4fc&lang=scss ***!
  \***************************************************************************************************************************************************************************************************************************************************************************************************************************************/
.about-page {
  background-color: #033559;
  gap: 1rem;
}
/*!*********************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??clonedRuleSet-2.use[1]!./node_modules/vue-loader/dist/stylePostLoader.js!./node_modules/sass-loader/dist/cjs.js??clonedRuleSet-2.use[2]!./node_modules/vue-loader/dist/index.js??ruleSet[1].rules[5].use[0]!./src/widgets/loading-message.vue?vue&type=style&index=0&id=68380766&lang=scss ***!
  \*********************************************************************************************************************************************************************************************************************************************************************************************************************************************/
.loading-message {
  font-size: larger;
}
.loading-message.left {
  justify-content: flex-start;
}
.loading-message.center {
  justify-content: center;
}
.loading-message.right {
  justify-content: flex-end;
}
/*!*************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??clonedRuleSet-2.use[1]!./node_modules/vue-loader/dist/stylePostLoader.js!./node_modules/sass-loader/dist/cjs.js??clonedRuleSet-2.use[2]!./node_modules/vue-loader/dist/index.js??ruleSet[1].rules[5].use[0]!./src/widgets/horizontal-controls.vue?vue&type=style&index=0&id=47ae9616&lang=scss ***!
  \*************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
.horizontal-controls.filters {
  padding: 10px 14px;
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.18);
  border-radius: 6px;
}
/*!*****************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??clonedRuleSet-2.use[1]!./node_modules/vue-loader/dist/stylePostLoader.js!./node_modules/sass-loader/dist/cjs.js??clonedRuleSet-2.use[2]!./node_modules/vue-loader/dist/index.js??ruleSet[1].rules[5].use[0]!./src/widgets/form-layout.vue?vue&type=style&index=0&id=27e1292a&lang=scss ***!
  \*****************************************************************************************************************************************************************************************************************************************************************************************************************************************/
.form-layout {
  align-items: stretch;
  border: thin solid white;
  padding: 12px;
  border-radius: 5px;
}
/*!****************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??clonedRuleSet-2.use[1]!./node_modules/vue-loader/dist/stylePostLoader.js!./node_modules/sass-loader/dist/cjs.js??clonedRuleSet-2.use[2]!./node_modules/vue-loader/dist/index.js??ruleSet[1].rules[5].use[0]!./src/widgets/form-field.vue?vue&type=style&index=0&id=09e9792a&lang=scss ***!
  \****************************************************************************************************************************************************************************************************************************************************************************************************************************************/
.form-layout-form-field > .title-row, .form-layout-form-field > .tip {
  padding: 0 10px;
}
.form-layout-form-field > .form-field-body {
  padding: 12px 10px;
  border-top: thin solid white;
  border-radius: 5px;
}
.form-layout-form-field > .form-field-body > .form-value {
  font-size: larger;
}
/*!******************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??clonedRuleSet-2.use[1]!./node_modules/vue-loader/dist/stylePostLoader.js!./node_modules/sass-loader/dist/cjs.js??clonedRuleSet-2.use[2]!./node_modules/vue-loader/dist/index.js??ruleSet[1].rules[5].use[0]!./src/widgets/form-actions.vue?vue&type=style&index=0&id=8321bca6&lang=scss ***!
  \******************************************************************************************************************************************************************************************************************************************************************************************************************************************/
.form-actions {
  padding: 12px;
  border: thin solid white;
  border-radius: 5px;
}
/*!***********************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??clonedRuleSet-2.use[1]!./node_modules/vue-loader/dist/stylePostLoader.js!./node_modules/sass-loader/dist/cjs.js??clonedRuleSet-2.use[2]!./node_modules/vue-loader/dist/index.js??ruleSet[1].rules[5].use[0]!./src/widgets/topic.vue?vue&type=style&index=0&id=42c52174&lang=scss ***!
  \***********************************************************************************************************************************************************************************************************************************************************************************************************************************/
.topic {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 12px;
  border-radius: 10px;
  background-color: rgb(86, 86, 211);
  color: white;
  line-height: 1.2;
  white-space: nowrap;
}
.topic.negative {
  background-color: rgb(211, 86, 86);
}
.topic.checkable {
  cursor: pointer;
}
.topic.checked {
  outline: 2px solid white;
  outline-offset: 1px;
}
.topic .topic-author {
  font-size: 1.1em;
}
.topic .topic-checkbox {
  font-size: 1.1em;
}
.topic.size-small {
  padding: 4px 8px;
  border-radius: 999px;
  font-size: 0.85em;
  gap: 6px;
}
.topic.size-medium {
  padding: 8px 10px;
  font-size: 0.95em;
  gap: 8px;
}
.topic.size-large {
  padding: 11px 14px;
  font-size: 1.15rem;
  gap: 10px;
}
.topic .topic-name {
  display: inline-block;
  white-space: normal;
  word-break: break-word;
}
.topic .topic-count {
  font-weight: bold;
  background-color: rgba(255, 255, 255, 0.1);
  padding: 2px 6px;
  border-radius: 6px;
}
.topic .topic-votes {
  display: inline-flex;
  align-items: center;
  gap: 4px;
}
.topic .topic-votes .vote-btn {
  cursor: pointer;
  font-size: 18px;
  opacity: 0.6;
  border-radius: 999px;
}
.topic .topic-votes .vote-btn:hover {
  opacity: 0.85;
}
.topic .topic-votes .vote-btn.active {
  opacity: 1;
  color: white;
  padding: 4px;
  background-color: rgb(76, 175, 80);
}
.topic .topic-votes .vote-btn.active.downvote {
  background-color: rgb(211, 86, 86);
}