/** Ionic CSS Variables **/
:root {
  /** custom **/
  --custom-blue: #12BADB;
  --second-custom-blue: #00aae8;
  --custom-second-blue: #cdebfc;
  --custom-gray: #707070;
  --custom-second-gray: #fdfdfd;
  --custom-third-gray: #8a96a3;
  --custom-fourth-gray: #ededed;
  --custom-fifth-gray: #f1f2f4;
  --custom-sixth-gray: #d2d3d8;
  --custom-seventh-gray: #fafafa;
  --custom-eigth-gray: #565c65;
  --custom-ninth-gray: #e4e4e4;
  --custom-tenth-gray: #5b636c;
  --custom-eleventh-gray: #F6F6F6;
  --custom-green: #23e52b;
  --custom-purple: #4A017D;
  --custom-red: #d63737;
  --light-white: #f2f2f2;
  --pink: #e72486;
  --red: #FF0000;
  --second-red: #F4B5B5;
  --rgba-gray: rgba(112, 112, 112, 0.36);
  --second-rgba-gray: rgba(112, 112, 112, 0.21);
  --third-rgba-gray: rgba(198, 198, 198, 0.33);
  --fourth-rgba-gray: rgba(112, 112, 112, 0.17);
  --fifth-rgba-gray: rgba(237, 237, 237, 0.5);
  --sixth-rgba-gray: rgba(112, 112, 112, 0.36);
  --seventh-rgba-gray: rgba(205, 235, 252, 0.23);
  --eitgh-rgba-gray: rgba(112, 112, 112, 0.39);
  --ninth-rgba-gray: rgba(112, 112, 112, 0.26);
  --tenth-rgba-gray: rgba(112, 112, 112, 0.4);
  --eleventh-rgba-gray: rgba(112, 112, 112, 0.2);
  --rgba-black-opacity: rgba(0, 0, 0, 0.4);
  --second-rgba-black-opacity: rgba(0, 0, 0, 0.33);
  --black-text: rgba(0, 0, 0, 1);
  /** primary **/
  --ion-color-primary: #3880ff;
  --ion-color-primary-rgb: 56, 128, 255;
  --ion-color-primary-contrast: #ffffff;
  --ion-color-primary-contrast-rgb: 255, 255, 255;
  --ion-color-primary-shade: #3171e0;
  --ion-color-primary-tint: #4c8dff;
  /** secondary **/
  --ion-color-secondary: #3dc2ff;
  --ion-color-secondary-rgb: 61, 194, 255;
  --ion-color-secondary-contrast: #ffffff;
  --ion-color-secondary-contrast-rgb: 255, 255, 255;
  --ion-color-secondary-shade: #36abe0;
  --ion-color-secondary-tint: #50c8ff;
  /** tertiary **/
  --ion-color-tertiary: #5260ff;
  --ion-color-tertiary-rgb: 82, 96, 255;
  --ion-color-tertiary-contrast: #ffffff;
  --ion-color-tertiary-contrast-rgb: 255, 255, 255;
  --ion-color-tertiary-shade: #4854e0;
  --ion-color-tertiary-tint: #6370ff;
  /** success **/
  --ion-color-success: #2dd36f;
  --ion-color-success-rgb: 45, 211, 111;
  --ion-color-success-contrast: #ffffff;
  --ion-color-success-contrast-rgb: 255, 255, 255;
  --ion-color-success-shade: #28ba62;
  --ion-color-success-tint: #42d77d;
  /** warning **/
  --ion-color-warning: #ffc409;
  --ion-color-warning-rgb: 255, 196, 9;
  --ion-color-warning-contrast: #000000;
  --ion-color-warning-contrast-rgb: 0, 0, 0;
  --ion-color-warning-shade: #e0ac08;
  --ion-color-warning-tint: #ffca22;
  /** danger **/
  --ion-color-danger: #eb445a;
  --ion-color-danger-rgb: 235, 68, 90;
  --ion-color-danger-contrast: #ffffff;
  --ion-color-danger-contrast-rgb: 255, 255, 255;
  --ion-color-danger-shade: #cf3c4f;
  --ion-color-danger-tint: #ed576b;
  /** dark **/
  --ion-color-dark: #222428;
  --ion-color-dark-rgb: 34, 36, 40;
  --ion-color-dark-contrast: #ffffff;
  --ion-color-dark-contrast-rgb: 255, 255, 255;
  --ion-color-dark-shade: #1e2023;
  --ion-color-dark-tint: #383a3e;
  /** medium **/
  --ion-color-medium: #92949c;
  --ion-color-medium-rgb: 146, 148, 156;
  --ion-color-medium-contrast: #ffffff;
  --ion-color-medium-contrast-rgb: 255, 255, 255;
  --ion-color-medium-shade: #808289;
  --ion-color-medium-tint: #9d9fa6;
  /** light **/
  --ion-color-light: #f4f5f8;
  --ion-color-light-rgb: 244, 245, 248;
  --ion-color-light-contrast: #000000;
  --ion-color-light-contrast-rgb: 0, 0, 0;
  --ion-color-light-shade: #d7d8da;
  --ion-color-light-tint: #f5f6f9;
}
/*
 * Dark Colors
 * -------------------------------------------
 */
@charset "UTF-8";
/*
 * App Global CSS
 * ----------------------------------------------------------------------------
 * Put style rules here that you want to apply globally. These styles are for
 * the entire app and not just one component. Additionally, this file can be
 * used as an entry point to import other CSS/Sass files to be included in the
 * output CSS.
 * For more information on global stylesheets, visit the documentation:
 * https://ionicframework.com/docs/layout/global-stylesheets
 */
/* Core CSS required for Ionic components to work properly */
html.ios {
  --ion-default-font: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Roboto", sans-serif;
}
html.md {
  --ion-default-font: "Roboto", "Helvetica Neue", sans-serif;
}
html {
  --ion-font-family: var(--ion-default-font);
}
body {
  background: var(--ion-background-color);
}
body.backdrop-no-scroll {
  overflow: hidden;
}
html.ios ion-modal.modal-card .ion-page > ion-header > ion-toolbar:first-of-type {
  padding-top: 0px;
}
html.ios ion-modal .ion-page {
  border-radius: inherit;
}
.ion-color-primary {
  --ion-color-base: var(--ion-color-primary, #3880ff) !important;
  --ion-color-base-rgb: var(--ion-color-primary-rgb, 56, 128, 255) !important;
  --ion-color-contrast: var(--ion-color-primary-contrast, #fff) !important;
  --ion-color-contrast-rgb: var(--ion-color-primary-contrast-rgb, 255, 255, 255) !important;
  --ion-color-shade: var(--ion-color-primary-shade, #3171e0) !important;
  --ion-color-tint: var(--ion-color-primary-tint, #4c8dff) !important;
}
.ion-color-secondary {
  --ion-color-base: var(--ion-color-secondary, #3dc2ff) !important;
  --ion-color-base-rgb: var(--ion-color-secondary-rgb, 61, 194, 255) !important;
  --ion-color-contrast: var(--ion-color-secondary-contrast, #fff) !important;
  --ion-color-contrast-rgb: var(--ion-color-secondary-contrast-rgb, 255, 255, 255) !important;
  --ion-color-shade: var(--ion-color-secondary-shade, #36abe0) !important;
  --ion-color-tint: var(--ion-color-secondary-tint, #50c8ff) !important;
}
.ion-color-tertiary {
  --ion-color-base: var(--ion-color-tertiary, #5260ff) !important;
  --ion-color-base-rgb: var(--ion-color-tertiary-rgb, 82, 96, 255) !important;
  --ion-color-contrast: var(--ion-color-tertiary-contrast, #fff) !important;
  --ion-color-contrast-rgb: var(--ion-color-tertiary-contrast-rgb, 255, 255, 255) !important;
  --ion-color-shade: var(--ion-color-tertiary-shade, #4854e0) !important;
  --ion-color-tint: var(--ion-color-tertiary-tint, #6370ff) !important;
}
.ion-color-success {
  --ion-color-base: var(--ion-color-success, #2dd36f) !important;
  --ion-color-base-rgb: var(--ion-color-success-rgb, 45, 211, 111) !important;
  --ion-color-contrast: var(--ion-color-success-contrast, #fff) !important;
  --ion-color-contrast-rgb: var(--ion-color-success-contrast-rgb, 255, 255, 255) !important;
  --ion-color-shade: var(--ion-color-success-shade, #28ba62) !important;
  --ion-color-tint: var(--ion-color-success-tint, #42d77d) !important;
}
.ion-color-warning {
  --ion-color-base: var(--ion-color-warning, #ffc409) !important;
  --ion-color-base-rgb: var(--ion-color-warning-rgb, 255, 196, 9) !important;
  --ion-color-contrast: var(--ion-color-warning-contrast, #000) !important;
  --ion-color-contrast-rgb: var(--ion-color-warning-contrast-rgb, 0, 0, 0) !important;
  --ion-color-shade: var(--ion-color-warning-shade, #e0ac08) !important;
  --ion-color-tint: var(--ion-color-warning-tint, #ffca22) !important;
}
.ion-color-danger {
  --ion-color-base: var(--ion-color-danger, #eb445a) !important;
  --ion-color-base-rgb: var(--ion-color-danger-rgb, 235, 68, 90) !important;
  --ion-color-contrast: var(--ion-color-danger-contrast, #fff) !important;
  --ion-color-contrast-rgb: var(--ion-color-danger-contrast-rgb, 255, 255, 255) !important;
  --ion-color-shade: var(--ion-color-danger-shade, #cf3c4f) !important;
  --ion-color-tint: var(--ion-color-danger-tint, #ed576b) !important;
}
.ion-color-light {
  --ion-color-base: var(--ion-color-light, #f4f5f8) !important;
  --ion-color-base-rgb: var(--ion-color-light-rgb, 244, 245, 248) !important;
  --ion-color-contrast: var(--ion-color-light-contrast, #000) !important;
  --ion-color-contrast-rgb: var(--ion-color-light-contrast-rgb, 0, 0, 0) !important;
  --ion-color-shade: var(--ion-color-light-shade, #d7d8da) !important;
  --ion-color-tint: var(--ion-color-light-tint, #f5f6f9) !important;
}
.ion-color-medium {
  --ion-color-base: var(--ion-color-medium, #92949c) !important;
  --ion-color-base-rgb: var(--ion-color-medium-rgb, 146, 148, 156) !important;
  --ion-color-contrast: var(--ion-color-medium-contrast, #fff) !important;
  --ion-color-contrast-rgb: var(--ion-color-medium-contrast-rgb, 255, 255, 255) !important;
  --ion-color-shade: var(--ion-color-medium-shade, #808289) !important;
  --ion-color-tint: var(--ion-color-medium-tint, #9d9fa6) !important;
}
.ion-color-dark {
  --ion-color-base: var(--ion-color-dark, #222428) !important;
  --ion-color-base-rgb: var(--ion-color-dark-rgb, 34, 36, 40) !important;
  --ion-color-contrast: var(--ion-color-dark-contrast, #fff) !important;
  --ion-color-contrast-rgb: var(--ion-color-dark-contrast-rgb, 255, 255, 255) !important;
  --ion-color-shade: var(--ion-color-dark-shade, #1e2023) !important;
  --ion-color-tint: var(--ion-color-dark-tint, #383a3e) !important;
}
.ion-page {
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  display: flex;
  position: absolute;
  flex-direction: column;
  justify-content: space-between;
  contain: layout size style;
  overflow: hidden;
  z-index: 0;
}
.split-pane-visible > .ion-page.split-pane-main {
  position: relative;
}
ion-route,
ion-route-redirect,
ion-router,
ion-select-option,
ion-nav-controller,
ion-menu-controller,
ion-action-sheet-controller,
ion-alert-controller,
ion-loading-controller,
ion-modal-controller,
ion-picker-controller,
ion-popover-controller,
ion-toast-controller,
.ion-page-hidden,
[hidden] {
  /* stylelint-disable-next-line declaration-no-important */
  display: none !important;
}
.ion-page-invisible {
  opacity: 0;
}
.can-go-back > ion-header ion-back-button {
  display: block;
}
html.plt-ios.plt-hybrid, html.plt-ios.plt-pwa {
  --ion-statusbar-padding: 20px;
}
@supports (padding-top: 20px) {
  html {
    --ion-safe-area-top: var(--ion-statusbar-padding);
  }
}
@supports (padding-top: constant(safe-area-inset-top)) {
  html {
    --ion-safe-area-top: constant(safe-area-inset-top);
    --ion-safe-area-bottom: constant(safe-area-inset-bottom);
    --ion-safe-area-left: constant(safe-area-inset-left);
    --ion-safe-area-right: constant(safe-area-inset-right);
  }
}
@supports (padding-top: env(safe-area-inset-top)) {
  html {
    --ion-safe-area-top: env(safe-area-inset-top);
    --ion-safe-area-bottom: env(safe-area-inset-bottom);
    --ion-safe-area-left: env(safe-area-inset-left);
    --ion-safe-area-right: env(safe-area-inset-right);
  }
}
ion-card.ion-color .ion-inherit-color,
ion-card-header.ion-color .ion-inherit-color {
  color: inherit;
}
.menu-content {
  transform: translate3d(0,  0,  0);
}
.menu-content-open {
  cursor: pointer;
  touch-action: manipulation;
  pointer-events: none;
}
.ios .menu-content-reveal {
  box-shadow: -8px 0 42px rgba(0, 0, 0, 0.08);
}
[dir=rtl].ios .menu-content-reveal {
  box-shadow: 8px 0 42px rgba(0, 0, 0, 0.08);
}
.md .menu-content-reveal {
  box-shadow: 4px 0px 16px rgba(0, 0, 0, 0.18);
}
.md .menu-content-push {
  box-shadow: 4px 0px 16px rgba(0, 0, 0, 0.18);
}
/* Basic CSS for apps built with Ionic */
audio,
canvas,
progress,
video {
  vertical-align: baseline;
}
audio:not([controls]) {
  display: none;
  height: 0;
}
b,
strong {
  font-weight: bold;
}
img {
  max-width: 100%;
  border: 0;
}
svg:not(:root) {
  overflow: hidden;
}
figure {
  margin: 1em 40px;
}
hr {
  height: 1px;
  border-width: 0;
  box-sizing: content-box;
}
pre {
  overflow: auto;
}
code,
kbd,
pre,
samp {
  font-family: monospace, monospace;
  font-size: 1em;
}
label,
input,
select,
textarea {
  font-family: inherit;
  line-height: normal;
}
textarea {
  overflow: auto;
  height: auto;
  font: inherit;
  color: inherit;
}
textarea::placeholder {
  padding-left: 2px;
}
form,
input,
optgroup,
select {
  margin: 0;
  font: inherit;
  color: inherit;
}
html input[type=button],
input[type=reset],
input[type=submit] {
  cursor: pointer;
  -webkit-appearance: button;
}
a,
a div,
a span,
a ion-icon,
a ion-label,
button,
button div,
button span,
button ion-icon,
button ion-label,
.ion-tappable,
[tappable],
[tappable] div,
[tappable] span,
[tappable] ion-icon,
[tappable] ion-label,
input,
textarea {
  touch-action: manipulation;
}
a ion-label,
button ion-label {
  pointer-events: none;
}
button {
  border: 0;
  border-radius: 0;
  font-family: inherit;
  font-style: inherit;
  font-feature-settings: inherit;
  font-variant: inherit;
  line-height: 1;
  text-transform: none;
  cursor: pointer;
  -webkit-appearance: button;
}
[tappable] {
  cursor: pointer;
}
a[disabled],
button[disabled],
html input[disabled] {
  cursor: default;
}
button::-moz-focus-inner,
input::-moz-focus-inner {
  padding: 0;
  border: 0;
}
input[type=checkbox],
input[type=radio] {
  padding: 0;
  box-sizing: border-box;
}
input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
  height: auto;
}
input[type=search]::-webkit-search-cancel-button,
input[type=search]::-webkit-search-decoration {
  -webkit-appearance: none;
}
table {
  border-collapse: collapse;
  border-spacing: 0;
}
td,
th {
  padding: 0;
}
* {
  box-sizing: border-box;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  -webkit-tap-highlight-color: transparent;
  -webkit-touch-callout: none;
}
html {
  width: 100%;
  height: 100%;
  -webkit-text-size-adjust: 100%;
          text-size-adjust: 100%;
}
html:not(.hydrated) body {
  display: none;
}
html.plt-pwa {
  height: 100vh;
}
body {
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: antialiased;
  margin-left: 0;
  margin-right: 0;
  margin-top: 0;
  margin-bottom: 0;
  padding-left: 0;
  padding-right: 0;
  padding-top: 0;
  padding-bottom: 0;
  position: fixed;
  width: 100%;
  max-width: 100%;
  height: 100%;
  max-height: 100%;
  text-rendering: optimizeLegibility;
  overflow: hidden;
  touch-action: manipulation;
  -webkit-user-drag: none;
  -ms-content-zooming: none;
  word-wrap: break-word;
  overscroll-behavior-y: none;
  -webkit-text-size-adjust: none;
          text-size-adjust: none;
}
html {
  font-family: var(--ion-font-family);
}
a {
  background-color: transparent;
  color: var(--ion-color-primary, #3880ff);
}
h1,
h2,
h3,
h4,
h5,
h6 {
  margin-top: 16px;
  margin-bottom: 10px;
  font-weight: 500;
  line-height: 1.2;
}
h1 {
  margin-top: 20px;
  font-size: 26px;
}
h2 {
  margin-top: 18px;
  font-size: 24px;
}
h3 {
  font-size: 22px;
}
h4 {
  font-size: 20px;
}
h5 {
  font-size: 18px;
}
h6 {
  font-size: 16px;
}
small {
  font-size: 75%;
}
sub,
sup {
  position: relative;
  font-size: 75%;
  line-height: 0;
  vertical-align: baseline;
}
sup {
  top: -0.5em;
}
sub {
  bottom: -0.25em;
}
.ion-hide {
  display: none !important;
}
.ion-hide-up {
  display: none !important;
}
.ion-hide-down {
  display: none !important;
}
@media (min-width: 576px) {
  .ion-hide-sm-up {
    display: none !important;
  }
}
@media (max-width: 575.98px) {
  .ion-hide-sm-down {
    display: none !important;
  }
}
@media (min-width: 768px) {
  .ion-hide-md-up {
    display: none !important;
  }
}
@media (max-width: 767.98px) {
  .ion-hide-md-down {
    display: none !important;
  }
}
@media (min-width: 992px) {
  .ion-hide-lg-up {
    display: none !important;
  }
}
@media (max-width: 991.98px) {
  .ion-hide-lg-down {
    display: none !important;
  }
}
@media (min-width: 1200px) {
  .ion-hide-xl-up {
    display: none !important;
  }
}
@media (max-width: 1199.98px) {
  .ion-hide-xl-down {
    display: none !important;
  }
}
/* Optional CSS utils that can be commented out */
.ion-no-padding {
  --padding-start: 0;
  --padding-end: 0;
  --padding-top: 0;
  --padding-bottom: 0;
  padding-left: 0;
  padding-right: 0;
  padding-top: 0;
  padding-bottom: 0;
}
.ion-padding {
  --padding-start: var(--ion-padding, 16px);
  --padding-end: var(--ion-padding, 16px);
  --padding-top: var(--ion-padding, 16px);
  --padding-bottom: var(--ion-padding, 16px);
  padding-left: var(--ion-padding, 16px);
  padding-right: var(--ion-padding, 16px);
  padding-top: var(--ion-padding, 16px);
  padding-bottom: var(--ion-padding, 16px);
}
@supports (margin-inline-start: 0) or (-webkit-margin-start: 0) {
  .ion-padding {
    padding-left: unset;
    padding-right: unset;
    padding-inline-start: var(--ion-padding, 16px);
    padding-inline-end: var(--ion-padding, 16px);
  }
}
.ion-padding-top {
  --padding-top: var(--ion-padding, 16px);
  padding-top: var(--ion-padding, 16px);
}
.ion-padding-start {
  --padding-start: var(--ion-padding, 16px);
  padding-left: var(--ion-padding, 16px);
}
@supports (margin-inline-start: 0) or (-webkit-margin-start: 0) {
  .ion-padding-start {
    padding-left: unset;
    padding-inline-start: var(--ion-padding, 16px);
  }
}
.ion-padding-end {
  --padding-end: var(--ion-padding, 16px);
  padding-right: var(--ion-padding, 16px);
}
@supports (margin-inline-start: 0) or (-webkit-margin-start: 0) {
  .ion-padding-end {
    padding-right: unset;
    padding-inline-end: var(--ion-padding, 16px);
  }
}
.ion-padding-bottom {
  --padding-bottom: var(--ion-padding, 16px);
  padding-bottom: var(--ion-padding, 16px);
}
.ion-padding-vertical {
  --padding-top: var(--ion-padding, 16px);
  --padding-bottom: var(--ion-padding, 16px);
  padding-top: var(--ion-padding, 16px);
  padding-bottom: var(--ion-padding, 16px);
}
.ion-padding-horizontal {
  --padding-start: var(--ion-padding, 16px);
  --padding-end: var(--ion-padding, 16px);
  padding-left: var(--ion-padding, 16px);
  padding-right: var(--ion-padding, 16px);
}
@supports (margin-inline-start: 0) or (-webkit-margin-start: 0) {
  .ion-padding-horizontal {
    padding-left: unset;
    padding-right: unset;
    padding-inline-start: var(--ion-padding, 16px);
    padding-inline-end: var(--ion-padding, 16px);
  }
}
.ion-no-margin {
  --margin-start: 0;
  --margin-end: 0;
  --margin-top: 0;
  --margin-bottom: 0;
  margin-left: 0;
  margin-right: 0;
  margin-top: 0;
  margin-bottom: 0;
}
.ion-margin {
  --margin-start: var(--ion-margin, 16px);
  --margin-end: var(--ion-margin, 16px);
  --margin-top: var(--ion-margin, 16px);
  --margin-bottom: var(--ion-margin, 16px);
  margin-left: var(--ion-margin, 16px);
  margin-right: var(--ion-margin, 16px);
  margin-top: var(--ion-margin, 16px);
  margin-bottom: var(--ion-margin, 16px);
}
@supports (margin-inline-start: 0) or (-webkit-margin-start: 0) {
  .ion-margin {
    margin-left: unset;
    margin-right: unset;
    margin-inline-start: var(--ion-margin, 16px);
    margin-inline-end: var(--ion-margin, 16px);
  }
}
.ion-margin-top {
  --margin-top: var(--ion-margin, 16px);
  margin-top: var(--ion-margin, 16px);
}
.ion-margin-start {
  --margin-start: var(--ion-margin, 16px);
  margin-left: var(--ion-margin, 16px);
}
@supports (margin-inline-start: 0) or (-webkit-margin-start: 0) {
  .ion-margin-start {
    margin-left: unset;
    margin-inline-start: var(--ion-margin, 16px);
  }
}
.ion-margin-end {
  --margin-end: var(--ion-margin, 16px);
  margin-right: var(--ion-margin, 16px);
}
@supports (margin-inline-start: 0) or (-webkit-margin-start: 0) {
  .ion-margin-end {
    margin-right: unset;
    margin-inline-end: var(--ion-margin, 16px);
  }
}
.ion-margin-bottom {
  --margin-bottom: var(--ion-margin, 16px);
  margin-bottom: var(--ion-margin, 16px);
}
.ion-margin-vertical {
  --margin-top: var(--ion-margin, 16px);
  --margin-bottom: var(--ion-margin, 16px);
  margin-top: var(--ion-margin, 16px);
  margin-bottom: var(--ion-margin, 16px);
}
.ion-margin-horizontal {
  --margin-start: var(--ion-margin, 16px);
  --margin-end: var(--ion-margin, 16px);
  margin-left: var(--ion-margin, 16px);
  margin-right: var(--ion-margin, 16px);
}
@supports (margin-inline-start: 0) or (-webkit-margin-start: 0) {
  .ion-margin-horizontal {
    margin-left: unset;
    margin-right: unset;
    margin-inline-start: var(--ion-margin, 16px);
    margin-inline-end: var(--ion-margin, 16px);
  }
}
.ion-float-left {
  float: left !important;
}
.ion-float-right {
  float: right !important;
}
.ion-float-start {
  float: left !important;
}
[dir=rtl] .ion-float-start, :host-context([dir=rtl]) .ion-float-start {
  float: right !important;
}
.ion-float-end {
  float: right !important;
}
[dir=rtl] .ion-float-end, :host-context([dir=rtl]) .ion-float-end {
  float: left !important;
}
@media (min-width: 576px) {
  .ion-float-sm-left {
    float: left !important;
  }

  .ion-float-sm-right {
    float: right !important;
  }

  .ion-float-sm-start {
    float: left !important;
  }
  [dir=rtl] .ion-float-sm-start, :host-context([dir=rtl]) .ion-float-sm-start {
    float: right !important;
  }

  .ion-float-sm-end {
    float: right !important;
  }
  [dir=rtl] .ion-float-sm-end, :host-context([dir=rtl]) .ion-float-sm-end {
    float: left !important;
  }
}
@media (min-width: 768px) {
  .ion-float-md-left {
    float: left !important;
  }

  .ion-float-md-right {
    float: right !important;
  }

  .ion-float-md-start {
    float: left !important;
  }
  [dir=rtl] .ion-float-md-start, :host-context([dir=rtl]) .ion-float-md-start {
    float: right !important;
  }

  .ion-float-md-end {
    float: right !important;
  }
  [dir=rtl] .ion-float-md-end, :host-context([dir=rtl]) .ion-float-md-end {
    float: left !important;
  }
}
@media (min-width: 992px) {
  .ion-float-lg-left {
    float: left !important;
  }

  .ion-float-lg-right {
    float: right !important;
  }

  .ion-float-lg-start {
    float: left !important;
  }
  [dir=rtl] .ion-float-lg-start, :host-context([dir=rtl]) .ion-float-lg-start {
    float: right !important;
  }

  .ion-float-lg-end {
    float: right !important;
  }
  [dir=rtl] .ion-float-lg-end, :host-context([dir=rtl]) .ion-float-lg-end {
    float: left !important;
  }
}
@media (min-width: 1200px) {
  .ion-float-xl-left {
    float: left !important;
  }

  .ion-float-xl-right {
    float: right !important;
  }

  .ion-float-xl-start {
    float: left !important;
  }
  [dir=rtl] .ion-float-xl-start, :host-context([dir=rtl]) .ion-float-xl-start {
    float: right !important;
  }

  .ion-float-xl-end {
    float: right !important;
  }
  [dir=rtl] .ion-float-xl-end, :host-context([dir=rtl]) .ion-float-xl-end {
    float: left !important;
  }
}
.ion-text-center {
  text-align: center !important;
}
.ion-text-justify {
  text-align: justify !important;
}
.ion-text-start {
  text-align: start !important;
}
.ion-text-end {
  text-align: end !important;
}
.ion-text-left {
  text-align: left !important;
}
.ion-text-right {
  text-align: right !important;
}
.ion-text-nowrap {
  white-space: nowrap !important;
}
.ion-text-wrap {
  white-space: normal !important;
}
@media (min-width: 576px) {
  .ion-text-sm-center {
    text-align: center !important;
  }

  .ion-text-sm-justify {
    text-align: justify !important;
  }

  .ion-text-sm-start {
    text-align: start !important;
  }

  .ion-text-sm-end {
    text-align: end !important;
  }

  .ion-text-sm-left {
    text-align: left !important;
  }

  .ion-text-sm-right {
    text-align: right !important;
  }

  .ion-text-sm-nowrap {
    white-space: nowrap !important;
  }

  .ion-text-sm-wrap {
    white-space: normal !important;
  }
}
@media (min-width: 768px) {
  .ion-text-md-center {
    text-align: center !important;
  }

  .ion-text-md-justify {
    text-align: justify !important;
  }

  .ion-text-md-start {
    text-align: start !important;
  }

  .ion-text-md-end {
    text-align: end !important;
  }

  .ion-text-md-left {
    text-align: left !important;
  }

  .ion-text-md-right {
    text-align: right !important;
  }

  .ion-text-md-nowrap {
    white-space: nowrap !important;
  }

  .ion-text-md-wrap {
    white-space: normal !important;
  }
}
@media (min-width: 992px) {
  .ion-text-lg-center {
    text-align: center !important;
  }

  .ion-text-lg-justify {
    text-align: justify !important;
  }

  .ion-text-lg-start {
    text-align: start !important;
  }

  .ion-text-lg-end {
    text-align: end !important;
  }

  .ion-text-lg-left {
    text-align: left !important;
  }

  .ion-text-lg-right {
    text-align: right !important;
  }

  .ion-text-lg-nowrap {
    white-space: nowrap !important;
  }

  .ion-text-lg-wrap {
    white-space: normal !important;
  }
}
@media (min-width: 1200px) {
  .ion-text-xl-center {
    text-align: center !important;
  }

  .ion-text-xl-justify {
    text-align: justify !important;
  }

  .ion-text-xl-start {
    text-align: start !important;
  }

  .ion-text-xl-end {
    text-align: end !important;
  }

  .ion-text-xl-left {
    text-align: left !important;
  }

  .ion-text-xl-right {
    text-align: right !important;
  }

  .ion-text-xl-nowrap {
    white-space: nowrap !important;
  }

  .ion-text-xl-wrap {
    white-space: normal !important;
  }
}
.ion-text-uppercase {
  /* stylelint-disable-next-line declaration-no-important */
  text-transform: uppercase !important;
}
.ion-text-lowercase {
  /* stylelint-disable-next-line declaration-no-important */
  text-transform: lowercase !important;
}
.ion-text-capitalize {
  /* stylelint-disable-next-line declaration-no-important */
  text-transform: capitalize !important;
}
@media (min-width: 576px) {
  .ion-text-sm-uppercase {
    /* stylelint-disable-next-line declaration-no-important */
    text-transform: uppercase !important;
  }

  .ion-text-sm-lowercase {
    /* stylelint-disable-next-line declaration-no-important */
    text-transform: lowercase !important;
  }

  .ion-text-sm-capitalize {
    /* stylelint-disable-next-line declaration-no-important */
    text-transform: capitalize !important;
  }
}
@media (min-width: 768px) {
  .ion-text-md-uppercase {
    /* stylelint-disable-next-line declaration-no-important */
    text-transform: uppercase !important;
  }

  .ion-text-md-lowercase {
    /* stylelint-disable-next-line declaration-no-important */
    text-transform: lowercase !important;
  }

  .ion-text-md-capitalize {
    /* stylelint-disable-next-line declaration-no-important */
    text-transform: capitalize !important;
  }
}
@media (min-width: 992px) {
  .ion-text-lg-uppercase {
    /* stylelint-disable-next-line declaration-no-important */
    text-transform: uppercase !important;
  }

  .ion-text-lg-lowercase {
    /* stylelint-disable-next-line declaration-no-important */
    text-transform: lowercase !important;
  }

  .ion-text-lg-capitalize {
    /* stylelint-disable-next-line declaration-no-important */
    text-transform: capitalize !important;
  }
}
@media (min-width: 1200px) {
  .ion-text-xl-uppercase {
    /* stylelint-disable-next-line declaration-no-important */
    text-transform: uppercase !important;
  }

  .ion-text-xl-lowercase {
    /* stylelint-disable-next-line declaration-no-important */
    text-transform: lowercase !important;
  }

  .ion-text-xl-capitalize {
    /* stylelint-disable-next-line declaration-no-important */
    text-transform: capitalize !important;
  }
}
.ion-align-self-start {
  align-self: flex-start !important;
}
.ion-align-self-end {
  align-self: flex-end !important;
}
.ion-align-self-center {
  align-self: center !important;
}
.ion-align-self-stretch {
  align-self: stretch !important;
}
.ion-align-self-baseline {
  align-self: baseline !important;
}
.ion-align-self-auto {
  align-self: auto !important;
}
.ion-wrap {
  flex-wrap: wrap !important;
}
.ion-nowrap {
  flex-wrap: nowrap !important;
}
.ion-wrap-reverse {
  flex-wrap: wrap-reverse !important;
}
.ion-justify-content-start {
  justify-content: flex-start !important;
}
.ion-justify-content-center {
  justify-content: center !important;
}
.ion-justify-content-end {
  justify-content: flex-end !important;
}
.ion-justify-content-around {
  justify-content: space-around !important;
}
.ion-justify-content-between {
  justify-content: space-between !important;
}
.ion-justify-content-evenly {
  justify-content: space-evenly !important;
}
.ion-align-items-start {
  align-items: flex-start !important;
}
.ion-align-items-center {
  align-items: center !important;
}
.ion-align-items-end {
  align-items: flex-end !important;
}
.ion-align-items-stretch {
  align-items: stretch !important;
}
.ion-align-items-baseline {
  align-items: baseline !important;
}
@font-face {
  font-family: "SF Pro";
  src: url('sf-pro-rounded-regular.1eeaf1332ceeea5b68db.ttf') format("truetype");
  font-weight: 400;
}
@font-face {
  font-family: "SF Pro";
  src: url('sf-pro-rounded-medium.293f2af1c6fb8259492f.ttf') format("truetype");
  font-weight: 500;
}
@font-face {
  font-family: "SF Pro";
  src: url('sf-pro-rounded-semibold.c3034a60867f133da0e7.ttf') format("truetype");
  font-weight: 600;
}
@font-face {
  font-family: "SF Pro";
  src: url('sf-pro-rounded-bold.e6820bab60d6b6bcdc59.ttf') format("truetype");
  font-weight: 700;
}
:root {
  color-scheme: dark light;
}
* {
  font-family: "SF Pro", sans-serif;
}
.medium-weight {
  font-weight: 500;
}
.m-b-14 {
  margin-bottom: 14px;
}
.m-r-0_25 {
  margin-right: 0.25rem;
}
.m-r-0_5 {
  margin-right: 0.5rem;
}
.m-r-0_75 {
  margin-right: 0.75rem;
}
.m-r-1 {
  margin-right: 1rem;
}
.m-l-1 {
  margin-left: 1rem;
}
.m-t-1 {
  margin-top: 1rem;
}
.m-t-0_5 {
  margin-top: 0.5rem;
}
.m-b-0_25 {
  margin-bottom: 0.25rem;
}
.d-flex {
  display: flex;
}
.common-text {
  font-size: 0.875rem;
}
.w-100 {
  width: 100%;
}
.flex-1 {
  flex: 1;
}
textarea,
input [type=email],
[type=number],
[type=password],
[type=search],
[type=tel],
[type=text],
[type=url] {
  -webkit-appearance: none !important;
  appearance: none !important;
  outline: none;
}
.main-top-page {
  height: 3rem;
  padding: 0.5rem 1.5rem;
  font-size: 1.25rem;
  font-weight: 500;
  line-height: 23px;
  border-bottom: 1px solid var(--fourth-rgba-gray);
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.main-top-page--auth {
  border-bottom: 0;
  font-size: 18px;
}
.main-top-page .search-wrapper {
  margin-left: 10px;
}
.main-top-page .search-wrapper ui-feed-search .wrapper {
  justify-content: flex-end;
  align-items: center;
}
.main-top-page .search-wrapper ui-feed-search .wrapper .search__wrapper {
  width: 100%;
}
ion-radio::part(container) {
  position: relative;
}
.bank-select {
  background-color: var(--ion-color-primary-contrast);
  height: 35px;
}
.card-item {
  font-size: 0.875rem;
}
.card-item::part(detail-icon) {
  display: none;
}
.card-item::part(native) {
  padding-left: 0;
}
.chip {
  border-radius: 16.5px;
  background: var(--custom-fourth-gray);
  height: 33px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 15px;
  font-size: 0.875rem;
}
.chip:not(:last-child) {
  margin-right: 0.5rem;
}
.chip--active {
  background-color: var(--custom-second-blue);
}
.main-toolbar {
  height: 100px;
  --background: var(--ion-color-warning-contrast);
  display: flex;
  align-items: center;
  --padding-start: 1.5rem;
}
.main-toolbar ion-icon {
  width: 96px;
  height: 34px;
}
.user-name {
  font-size: 1.25rem;
  font-weight: 500;
  line-height: 23px;
}
.user-nickname {
  font-size: 14px;
  line-height: 23px;
  color: var(--custom-third-gray);
}
.main-button {
  display: block;
  cursor: pointer;
  background-color: var(--custom-purple);
  color: var(--ion-color-success-contrast);
  padding: 1rem 1.5rem;
  font-weight: 500;
  border-radius: 18px;
  letter-spacing: 0.03em;
  line-height: 23px;
}
.main-button--md {
  padding: 0.25rem 1.5rem;
}
.icon-back {
  width: 28px;
  height: 30px;
  margin-right: 12px;
  background-color: var(--ion-color-primary-contrast);
}
.main-container {
  padding: 1rem 1.5rem;
}
.profile-top-container {
  height: 180px;
  position: relative;
  margin-bottom: 10px;
}
.profile-top-container .back {
  position: absolute;
  top: 1rem;
  left: 12px;
  width: 28px;
  height: 16px;
}
.profile-top-container .info-line {
  height: 80px;
  background: var(--second-rgba-black-opacity);
  position: absolute;
  width: 100%;
  bottom: 0;
}
.profile-top-container .info-line__name {
  font-weight: 500;
  font-size: 20px;
  line-height: 23px;
  display: flex;
  align-items: center;
  color: var(--ion-color-tertiary-contrast);
}
.profile-top-container .info-line__name ion-icon {
  margin-left: 10px;
  width: 1rem;
  height: 1rem;
}
.profile-top-container .info-line__username {
  font-weight: 300;
  font-size: 14px;
  line-height: 23px;
  color: var(--custom-third-gray);
}
.profile-top-container .info-line__user-data {
  margin-left: 24px;
  margin-bottom: 20px;
}
.profile-top-container .info-line__avatar-wrapper {
  position: relative;
}
.profile-top-container .info-line__avatar-wrapper img {
  display: block;
  width: 105px;
  height: 105px;
  border-radius: 50%;
}
.profile-top-container .info-line .online:after {
  content: "";
  position: absolute;
  border-radius: 50%;
  right: 10px;
  bottom: 10px;
  width: 13px;
  height: 13px;
  border: 1px solid var(--ion-color-tertiary-contrast);
  background-color: var(--custom-green);
}
.post__poll ion-list {
  border-radius: 10px 10px 0 0;
  padding-bottom: 0;
  padding-top: 0;
}
button {
  font-size: 14px;
  font-weight: 500;
  border: 1px solid var(--custom-fourth-gray);
  border-radius: 16.5px;
  padding: 0.5rem 1rem;
}
button.accent {
  background: var(--ion-color-tertiary-contrast);
  color: var(--custom-blue);
}
button.accent-filled {
  background: var(--custom-blue);
  color: var(--ion-color-tertiary-contrast);
}
button.warning {
  color: var(--custom-red);
  background-color: var(--ion-color-primary-contrast);
}
button.main {
  display: block;
  background-color: var(--custom-purple);
  color: var(--ion-color-success-contrast);
  padding: 1rem 1.5rem;
  font-weight: 500;
  border-radius: 18px;
  letter-spacing: 0.03em;
  line-height: 23px;
  font-size: 1rem;
  border: 1px solid var(--custom-purple);
}
button.main--double {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
button.main--sm {
  height: 34px;
  font-size: 0.75rem;
  padding: 0 0.75rem;
}
button.default {
  border: 0;
  border-radius: 0;
  color: var(--custom-blue);
  padding: 0;
  background-color: inherit;
}
button.default--gray {
  color: var(--custom-third-gray);
}
button.post {
  color: var(--custom-third-gray);
  background: var(--ion-color-tertiary-contrast);
}
button.post--active {
  border: 1px solid var(--custom-blue);
  background-color: var(--custom-blue);
  color: var(--ion-color-tertiary-contrast);
}
button[disabled] {
  background: var(--ion-color-primary-contrast);
  border: 1px solid var(--custom-fourth-gray);
  color: var(--custom-sixth-gray);
}
.gender-select::part(icon) {
  display: none;
}
ion-toggle {
  --background: var(--custom-sixth-gray);
  --background-checked: var(--custom-second-blue);
  --handle-background-checked: var(--custom-blue);
}
ion-checkbox {
  --size: 22px;
  --background-checked: var(--custom-blue);
  --border-color-checked: var(--custom-blue);
}
ion-select {
  border: 0.25px solid var(--custom-gray);
  border-radius: 10px;
  --padding-top: 12px;
  --padding-end: 12px;
  --padding-start: 0.5rem;
  --placeholder-color: #8a96a3;
  --placeholder-opacity: 1;
}
ion-toolbar[appAllowOverflow] {
  contain: none;
}
.post-bar .search-wrapper, .feed-tool-bar .search-wrapper {
  display: flex;
  flex: 1;
  justify-content: flex-end;
  margin-left: 1rem;
}
.post-bar .search-wrapper .wrapper > ion-icon, .feed-tool-bar .search-wrapper .wrapper > ion-icon {
  margin-right: 1rem;
}
.post-bar .search-wrapper .wrapper .search__wrapper, .feed-tool-bar .search-wrapper .wrapper .search__wrapper {
  margin-top: -8px;
  width: 100%;
}
ion-segment {
  border-bottom: 1px solid var(--rgba-gray);
}
ion-segment ion-segment-button {
  --color-checked: var(--ion-color-warning-contrast);
  --indicator-color: var(--custom-gray);
}
ion-segment ion-label {
  font-weight: 500;
  font-size: 16px;
  letter-spacing: 0.02em;
  line-height: 23px;
  text-transform: capitalize;
}
/**
** POPOVER STYLES START
**/
.some-popover .popover-content {
  border-radius: 8px;
}
/**
** POPOVER STYLES END
**/
.main-alert.single-button .alert-button-group {
  justify-content: center;
}
.main-alert.single-button .alert-button-group button {
  margin-right: 0;
}
.main-alert.confirm-schedule-modal .alert-title {
  font-size: 13px;
}
.main-alert.confirm-schedule-modal .alert-message {
  font-size: 18px;
  margin: 1rem 0;
  color: var(--custom-blue);
}
.main-alert .alert-radio-label {
  font-size: 0.875rem;
  padding-left: 40px;
  padding-top: 0;
  padding-bottom: 0;
}
.main-alert .alert-message {
  font-size: 0.875rem;
  font-weight: 500;
  color: var(--ion-color-warning-contrast);
  padding-bottom: 0;
}
.main-alert [aria-checked=true].sc-ion-alert-md .alert-radio-inner {
  transform: scale3d(1, 1, 1) translate(-50%, -50%);
  left: 50%;
  top: 50%;
  width: 6px;
  height: 6px;
  background-color: var(--custom-blue);
}
.main-alert [aria-checked=true].sc-ion-alert-md .alert-radio-icon {
  border-color: var(--custom-blue);
}
.main-alert .alert-tappable {
  height: auto;
  contain: none;
}
.main-alert .alert-tappable:not(:last-child) {
  margin-bottom: 0.875rem;
}
.main-alert .alert-wrapper {
  border-radius: 10px;
}
.main-alert .alert-button-inner {
  font-weight: 500;
  font-size: 14px;
  color: var(--custom-blue);
}
.main-alert .alert-radio-group {
  border-top: 0.5px solid var(--sixth-rgba-gray);
  border-bottom: 0.5px solid var(--sixth-rgba-gray);
  padding: 0.875rem 0;
}
.main-alert .alert-button {
  text-transform: capitalize;
}
.main-alert .alert-radio-icon {
  left: 20px;
  width: 12px;
  height: 12px;
  border-width: 1px;
}
.main-alert .alert-title {
  font-size: 15px;
}
.main-alert.lg-alert {
  --max-width: 340px;
}
.main-alert.no-header .alert-head {
  display: none;
}
.main-alert.hide-radio {
  --width: 200px;
  --min-width: auto;
}
.main-alert.hide-radio .alert-radio-icon {
  display: none;
}
.main-alert.hide-radio .alert-radio-label {
  padding: 0;
}
.main-alert.hide-radio .alert-radio-group {
  padding: 1rem;
}
.main-alert.hide-radio .alert-button-inner {
  height: auto;
}
.main-alert.hide-radio .alert-button-group {
  display: none;
}
.main-modal {
  --border-radius: 10px;
}
@media screen and (min-width: 969px) {
  .main-modal {
    --max-width: 400px;
  }
}
.main-modal .inner-modal {
  padding: 1.5rem 1.5rem 1rem;
}
.delete-subscription-modal {
  --width: 80%;
}
.buy-bundle-confirm-modal {
  --width: 80%;
}
.country-selector-modal {
  --width: 80%;
}
.payout-request-modal {
  --width: 80%;
}
.add-subscription-modal {
  --width: 80%;
}
.add-subscription-modal .modal-wrapper {
  box-shadow: 0 0 30px -15px var(--custom-blue);
}
.search-modal {
  --width: 225px;
  --height: auto;
}
.search-modal .ion-page {
  position: relative;
  contain: content;
}
.search-modal .popover-content {
  border: 1px solid var(--custom-blue);
  border-radius: 10px;
}
.relative {
  position: relative;
}
.description {
  font-size: 0.875rem;
  color: var(--custom-gray);
}
.gray-icon {
  color: var(--custom-third-gray);
}
.photo-popover {
  --box-shadow: 0px 3px 6px var(--third-rgba-gray);
  --width: 210px;
  --backdrop-opacity: 0;
}
.photo-popover .popover-content {
  border-radius: 10px;
}
.modal-schedule {
  --height: 300px;
  align-items: flex-end;
  --placeholder-color: var(--custom-ninth-gray);
}
.modal-schedule .modal-wrapper {
  border-radius: 10px 10px 0 0;
}
.modal-schedule ion-datetime {
  border-radius: 16.5px;
  --padding-top: 5px;
  --padding-bottom: 5px;
  text-align: left;
  border: 1px solid var(--custom-fourth-gray);
  color: var(--custom-tenth-gray);
}
.modal-amount {
  --width: 80%;
  --border-radius: 10px;
}
.picker-prefix,
.picker-suffix,
.picker-opt.picker-opt-selected,
.picker-button.sc-ion-picker-md,
.picker-button.ion-activated.sc-ion-picker-md,
.picker-button.sc-ion-picker-ios,
.picker-button.ion-activated.sc-ion-picker-ios {
  color: var(--custom-blue);
  cursor: pointer;
}
.forgot-modal {
  --width: 80%;
}
.tip-modal {
  --width: 80%;
}
.edit-list-modal {
  --width: 80%;
}
.restrict-modal {
  --width: 80%;
}
.trial-modal {
  --width: 80%;
}
.unsubscribe-modal {
  --width: 80%;
}
.buy-subscription-modal {
  --width: 80%;
}
.chat-actions-modal {
  --width: 235px;
}
.following-options-modal {
  --width: 235px;
}
.following-options-modal .modal-wrapper {
  height: auto;
  min-height: 310px;
}
.following-options-modal .ion-overlay-wrapper {
  max-width: 400px;
}
.add-remove-modal {
  --width: 200px;
}
.bookmark-modal-sort {
  --width: 200px;
}
.chats-modal-sort {
  --width: 200px;
}
.create-new-list-modal {
  --width: 80%;
}
.add-card-modal {
  --width: 80%;
}
.option-report-alert .alert-wrapper .alert-message {
  text-align: center;
  padding: 1.5rem !important;
}
.only-message .alert-message {
  text-align: center;
  padding: 1.5rem;
}
.picker-style {
  --height: 300px;
  --border-radius: 10px 10px 0 0;
}
.picker-style .picker-button {
  cursor: pointer;
  color: var(--custom-blue);
}
.attach-media {
  --button-color: var(--custom-blue);
}
.image-background {
  width: 100%;
  height: 100%;
}
.no-pointer {
  pointer-events: none;
}
.main-toast {
  --background: var(--custom-blue);
  --border-radius: 10px;
  --color: var(--ion-color-secondary-contrast);
  font-size: 15px;
  --height: 38px;
  text-align: center;
}
.main-toast--pink {
  --background: var(--pink);
}
.users-list {
  position: absolute;
  z-index: 100;
  background-color: var(--light-white);
  padding-left: 0;
  width: 100%;
  bottom: 100%;
  left: 0;
  margin: 1px 0;
  max-height: 200px;
  overflow: auto;
}
.users-list .user {
  list-style-type: none;
  display: flex;
  align-items: center;
}
.users-list .user .avatar {
  width: 40px;
  aspect-ratio: 1;
  margin: 5px;
  border-radius: 50%;
  object-fit: cover;
}
.users-list .user .name-wrapper {
  display: flex;
  flex-direction: column;
  justify-content: center;
  margin-left: 10px;
}
.users-list .user .name-wrapper .name {
  font-size: 16px;
  font-weight: 500;
}
.users-list .user .name-wrapper .username {
  font-size: 14px;
  color: var(--custom-third-gray);
}
.highlighted-username {
  color: var(--second-custom-blue);
}
.segment-media {
  --background: var(--ion-color-primary-contrast);
  border-bottom: none;
  min-width: auto;
}
.segment-media ion-segment-button {
  --indicator-color: var(--custom-second-blue);
  --background: var(--custom-fourth-gray);
  --background-checked: var(--custom-second-blue);
  --border-width: 0;
  --border-radius: 16.5px;
  --indicator-box-shadow: 0;
  min-width: auto;
  height: 33px;
}
.segment-media ion-segment-button ion-label {
  font-size: 0.875rem;
  font-weight: 400;
}
.segment-media ion-segment-button:nth-child(2) {
  margin: 0 10px;
}
.disabled {
  color: var(--custom-third-gray) !important;
  pointer-events: none;
}
.post-actions .action-sheet-group {
  border-top-right-radius: 10px;
  border-top-left-radius: 10px;
  padding: 20px 0 !important;
}
.post-actions .post-action {
  color: var(--custom-blue);
  font-weight: 500;
  display: flex;
  justify-content: center;
  height: 35px;
}
.post-actions .post-action .action-sheet-button-inner {
  width: auto;
}
.post-actions .selected {
  font-weight: bold;
  text-decoration: underline;
}
.inner-modal {
  color: var(--black-text);
}
.message-time {
  position: relative;
  text-align: center;
  margin-bottom: 0.75rem;
}
.message-time .date-label {
  position: relative;
  z-index: 1;
  background-color: var(--ion-color-secondary-contrast);
  padding: 0 0.25rem;
  font-size: 0.875rem;
  color: var(--custom-third-gray);
}
.message-time:after {
  position: absolute;
  width: 100%;
  height: 1px;
  background-color: var(--sixth-rgba-gray);
  content: "";
  left: 0;
  top: 50%;
}
.search-wrapper {
  margin-left: 10px;
}
.search-wrapper ui-chats-search .wrapper {
  justify-content: flex-end;
  align-items: center;
}
.search-wrapper ui-chats-search .wrapper .search__wrapper {
  width: 100%;
}
.phone-label {
  font-size: 12px;
  line-height: 23px;
  text-align: left;
  color: var(--custom-blue);
}
.found-message {
  animation: smooth-blink 1200ms 3 ease-in-out;
}
@keyframes smooth-blink {
  0% {
    background: white;
  }
  50% {
    background: rgba(171, 171, 171, 0.1);
  }
  100% {
    background: white;
  }
}
.routerLink {
  text-decoration: underline;
  color: var(--ion-color-primary);
}
.routerLink:active {
  opacity: 0.7;
}
*.show-up-keyboard {
  transition: cubic-bezier(0.17, 0.59, 0.4, 0.77) 0.25s;
}
.second-part ion-segment ion-segment-button {
  --indicator-color: #12BADB;
}
app-login ui-input input {
  border-radius: 0;
}
app-register ui-input input {
  border-radius: 0;
}
.feed-title-wrapper {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
}
.feed-title-wrapper .pinned-text {
  padding-left: 10px;
}
.bundle-item {
  padding: 1rem;
  position: relative;
  color: var(--ion-color-warning-contrast);
  font-size: 0.875rem;
}
.bundle-item .icons {
  position: absolute;
  right: 1rem;
  top: 1rem;
  display: flex;
  align-items: center;
}
.bundle-item .icons ion-icon {
  width: 20px;
  height: 20px;
  margin-left: 10px;
}
.bundle-item .icons ion-icon.info {
  width: 0.875rem;
  height: 0.875rem;
}
.bundle-item:not(:last-child) {
  border-bottom: 1px solid var(--custom-sixth-gray);
}
@media screen and (min-width: 900px) {
  .app-wrapper {
    max-width: 400px;
    margin-inline: auto;
  }
}
.bundle-button {
  cursor: pointer;
  margin: 1rem auto 0;
  text-align: center;
  color: var(--ion-color-primary-contrast);
  font-size: 0.875rem;
  border-radius: 14px;
  background-color: var(--custom-purple);
  min-width: 200px;
  padding: 0.5rem;
  width: -moz-fit-content;
  width: fit-content;
}
.bundle-button--month {
  margin: 0 auto 1rem;
}
.bundle-wrapper {
  padding: 0 1.5rem;
}
.container {
  border: 1px solid var(--custom-fourth-gray);
  border-radius: 10px;
}
.bundle-container {
  margin: 2rem 0;
  border-top: 0.5px solid var(--sixth-rgba-gray);
  padding: 1rem 0 0;
  display: flex;
  flex-direction: column;
}
.bundle-container .accent-filled {
  margin: 0 auto;
}
.bundle-label {
  padding: 1rem;
  font-weight: 500;
  font-size: 0.875rem;
  border-bottom: 0.5px solid var(--custom-fourth-gray);
}
.grey-text {
  --color: var(--custom-gray);
}
.feed-stub {
  width: 100%;
  text-align: center;
  padding-top: 20%;
  font-size: 16px;
  font-weight: 600;
  color: var(--custom-gray);
}
.footer-progress-bar {
  --padding-start: 10px;
  --padding-end: 10px;
}
.footer-progress-bar .progress-bar {
  display: flex;
  align-items: center;
}
.footer-progress-bar .progress-bar .title {
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  text-align: center;
  -webkit-line-clamp: 1;
  line-clamp: 1;
  -webkit-box-orient: vertical;
  font-size: 12px;
  width: 150px;
}
.footer-progress-bar .progress-bar .progress {
  height: 5px;
  border-radius: 5px;
  margin: 0 5px;
  --background: var(transparentize(--custom-blue, 0.4));
  --progress-background: var(--custom-blue);
}
.footer-progress-bar .progress-bar .opt-button {
  max-width: 30px;
  max-height: 30px;
  min-width: 30px;
  min-height: 30px;
  --border-radius: 30px;
  --padding-start: 3px;
  --padding-end: 3px;
  --padding-bottom: 0;
  --padding-top: 0;
  padding: 3px;
  --background: transparent;
  --background-activated: transparent;
  --color: gray;
  cursor: pointer;
}
.footer-progress-bar .progress-bar .close-button {
  max-width: 25px;
  max-height: 25px;
  min-width: 25px;
  min-height: 25px;
  --border-radius: 30px;
  --padding-start: 0;
  --padding-end: 0;
  --padding-bottom: 0;
  --padding-top: 0;
  padding: 3px;
  cursor: pointer;
  --background: var(--custom-gray);
  --background-activated: var(--custom-red);
}
.progress-bar-actions .stop-action {
  color: var(--custom-red);
  font-weight: 500;
  display: flex;
  justify-content: center;
}
.progress-bar-actions .hide-action {
  color: var(--custom-gray);
  font-weight: 500;
  display: flex;
  justify-content: center;
}
img {
  user-drag: none;
  -webkit-user-drag: none;
  user-select: none;
  -moz-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
}
.cursor-pointer {
  cursor: pointer;
}
.no-bottom-border {
  border-bottom: none !important;
}
* ::-webkit-scrollbar {
  /*{ !* 1 - скроллбар *! }*/
  width: 2px;
  height: 2px;
}
* ::-webkit-scrollbar-thumb {
  /*{ !* 5 - ползунок *! }*/
  background: #d0d0d0;
  border-radius: 4px;
  cursor: pointer;
}
.empty-feed {
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  padding-top: 50px;
}
.empty-feed .title {
  font-size: 18px;
  font-weight: 600;
  color: var(--custom-gray);
}
/* Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
/* Firefox */
input[type=number] {
  -moz-appearance: textfield;
}
.no-bottom-border {
  border-bottom: none !important;
}
.blue-button {
  color: var(--custom-blue);
}