/* =========================
   VARIABLES - conteúdo de _vars.css
========================= */

:root
{
  /* Color Definitions */

  --white: #ffffff;
  --blue: #006dff;
  --blueS1: #08447e;
  --blueS2: #a6b3ff;
  --blue2: var(--blueS1, #002051);
  --blue3: #a6b3ff;
  --blue4: #d2d8ff;
  --blue5: #4d99ff;
  --blue6: #007bff;
  --orange: #ff5429;
  --green: #b2f39f;
  --greenS: #9fff88;
  --red-error: #f92626;
  --red-error2: #ff3d44;
  --red-error3: #ff2d55;
  --red-active1: #FFEAE5;
  --red-active2: #FF5419;
  --green-success: #039855;
  /* Text Colors */
  --text-black-100: #141414;
  --text-black-90: #424242;
  --text-black-80: #667085;
  --text-black-60: #6b6b6b;
  --text-black-40: #b2f39f;
  --text-black-20: #bdbdbd;
  --text-black-00: var(--white);
  --text-gray-00: #3C3C4F;
  --text-badge: #08447E;
  /* Category Colors */
  --category-gynecology: #f18fba;
  --category-mental: #ca5fdd;
  --category-pain: #f24d7f;
  --category-respiratory: #03cfcb;
  --category-gastric: #ace53c;
  --category-endocrinology: #ffb600;
  --category-pediatrics: #996df7;
  --gray: #B7B7C3;
  --gray-2: #CCC;
  --gray-3: #BDBDBD;
  --bg-primary: #f7f7f7;
  --bg-secondary: var(--white);
  --bg-tertiary: #e7eaf9;
  --bg-footer: var(--blue);
  --bg-lightblue: #f5f9ff;
  --bg-blue: var(--blue);
  --bg-badge: #CEFFC3;
  --bg1: #ffffff;
  --bg2: #f0f0f0;
  --bg3: #f7f7f7;
  --bg4: #f4f5ff;
  --border1: #cccccc;
  --border2: #f0f0f0;
  --button-primary: var(--greenS);
  --button-primary-1: var(--blue);
  --button-primary-2: var(--blue2);
  --button-primary-3: var(--orange);
  --button-primary-4: var(--blue5);
  --button-primary-fg: var(--text-primary);
  --button-secondary: var(--blue);
  --button-secondary-fg: var(--white);
  --button-alternative: var(--blue3);
  --text-primary: var(--blue2);
  --text-secondary: var(--blue);
  --text-header: var(--blue2);
  --text-header-2: var(--blue);
  --text-muted: #6c757d;
  --text-title: var(--orange);
  --text-complementary: var(--category-mental);
  --text-default: #3C3C4F;
  --text-default-light: rgba(60, 60, 79, 0.75);
  --text-alternative: var(--blue5);
  --text-disabled: #949494;
  --text-1: var(--blueP);
  --text-2: var(--blueS1);
  --text-3: var(--orange);
  --el-primary: var(--blue2);
  --el-primary-2: var(--blue2);
  --el-secondary: var(--blue4);
  --el-alternative: var(--blue5);
  --el-popover: var(--orange);
  --el-disabled: var(--blue5);
  --icons-primary: var(--blue);
  --icons-primary-2: var(--blue);
  --icons-secondary: var(--blue2);
  --icons-alternative: var(--orange);
  --card-border: var(--gray-2);
  --bg-live: rgba(209, 215, 255, 0.75);
  --bg-live-tag: var(--blue3);
  --fg-live-tag: var(--white);
  --fg-live-warning: var(--orange);
  --breadcrumb-color: #6c757d;
  /* Header/Footer Colors */
  --myracolors-header-bg: var(--green);
  --myracolors-header-fg: var(--text-default);
  --myracolors-header-fg-hover: var(--blue);
  --myracolors-password-bg: #f4f5ff;
  /* Background Colors*/
  --bg-register-error: #F5F9FF;
  --input-field-disabled: #F0F0F0;
}

/* =========================
   UTILS / RESET - conteúdo de _utils.css
========================= */

:root {
  --4px: 0.25rem;
  --6px: 0.375rem;
  --8px: 0.5rem;
  --10px: 0.625rem;
  --12px: 0.75rem;
  --14px: 0.875rem;
  --16px: 1rem;
  --18px: 1.125rem;
  --20px: 1.25rem;
  --22px: 1.375rem;
  --24px: 1.5rem;
  --26px: 1.625rem;
  --28px: 1.75em;
  --32px: 2rem;
  --36px: 2.25rem;
  --38px: 2.375rem;
  --40px: 2.5rem;
  --42px: 2.625rem;
  --44px: 2.75rem;
  --50px: 3.125rem;
  --52px: 3.25rem;
  --60px: 3.75rem;
  --122px: 7.625rem;
}

/*#region Margin*/
.m-12 {
  margin: var(--12px)
}

.mt-12, .my-12 {
  margin-block-start: var(--12px)
}

.mr-12, .mx-12 {
  margin-inline-end: var(--12px)
}

.mb-12, .my-12 {
  margin-block-end: var(--12px)
}

.ml-12, .mx-12 {
  margin-inline-start: var(--12px)
}

.m-16 {
  margin: var(--16px)
}

.mt-16, .my-16 {
  margin-block-start: var(--16px)
}

.mr-16, .mx-16 {
  margin-inline-end: var(--16px)
}

.mb-16, .my-16 {
  margin-block-end: var(--16px)
}

.ml-16, .mx-16 {
  margin-inline-start: var(--16px)
}

.m-24 {
  margin: var(--24px)
}

.mt-24, .my-24 {
  margin-block-start: var(--24px)
}

.mr-24, .mx-24 {
  margin-inline-end: var(--24px)
}

.mb-24, .my-24 {
  margin-block-end: var(--24px)
}

.ml-24, .mx-24 {
  margin-inline-start: var(--24px)
}

.m-32 {
  margin: var(--32px)
}

.mt-32, .my-32 {
  margin-block-start: var(--32px)
}

.mr-32, .mx-32 {
  margin-inline-end: var(--32px)
}

.mb-32, .my-32 {
  margin-block-end: var(--32px)
}

.ml-32, .mx-32 {
  margin-inline-start: var(--32px)
}

.m-42 {
  margin: var(--42px)
}

.mt-42, .my-42 {
  margin-block-start: var(--42px)
}

.mr-42, .mx-42 {
  margin-inline-end: var(--42px)
}

.mb-42, .my-42 {
  margin-block-end: var(--42px)
}

.ml-42, .mx-42 {
  margin-inline-start: var(--42px)
}

.m-52 {
  margin: var(--52px)
}

.mt-52, .my-52 {
  margin-block-start: var(--52px)
}

.mr-52, .mx-52 {
  margin-inline-end: var(--52px)
}

.mb-52, .my-52 {
  margin-block-end: var(--52px)
}

.ml-52, .mx-52 {
  margin-inline-start: var(--52px)
}
/*#endregion*/

/*#region Padding*/
.p-12 {
  padding: var(--12px) !important;
}

.pt-12, .py-12 {
  padding-block-start: var(--12px) !important;
}

.pr-12, .px-12 {
  padding-inline-end: var(--12px) !important;
}

.pb-12, .py-12 {
  padding-block-end: var(--12px) !important;
}

.pl-12, .px-12 {
  padding-inline-start: var(--12px) !important;
}

/*LG*/
@media (min-width: 992px) {
  .p-lg-10 {
    padding: var(--10px) !important;
  }

  .pt-lg-10, .py-lg-10 {
    padding-block-start: var(--10px) !important;
  }

  .pr-lg-10, .px-lg-10 {
    padding-inline-end: var(--10px) !important;
  }

  .pb-lg-10, .py-lg-10 {
    padding-block-end: var(--10px) !important;
  }

  .pl-lg-10, .px-lg-10 {
    padding-inline-start: var(--10px) !important;
  }

  .p-lg-12 {
    padding: var(--12px) !important;
  }

  .pt-lg-12, .py-lg-12 {
    padding-block-start: var(--12px) !important;
  }

  .pr-lg-12, .px-lg-12 {
    padding-inline-end: var(--12px) !important;
  }

  .pb-lg-12, .py-lg-12 {
    padding-block-end: var(--12px) !important;
  }

  .pl-lg-12, .px-lg-12 {
    padding-inline-start: var(--12px) !important;
  }

  .p-lg-14 {
    padding: var(--14px) !important;
  }

  .pt-lg-14, .py-lg-14 {
    padding-block-start: var(--14px) !important;
  }

  .pr-lg-14, .px-lg-14 {
    padding-inline-end: var(--14px) !important;
  }

  .pb-lg-14, .py-lg-14 {
    padding-block-end: var(--14px) !important;
  }

  .pl-lg-14, .px-lg-14 {
    padding-inline-start: var(--14px) !important;
  }

  .p-lg-16 {
    padding: var(--16px) !important;
  }

  .pt-lg-16, .py-lg-16 {
    padding-block-start: var(--16px) !important;
  }

  .pr-lg-16, .px-lg-16 {
    padding-inline-end: var(--16px) !important;
  }

  .pb-lg-16, .py-lg-16 {
    padding-block-end: var(--16px) !important;
  }

  .pl-lg-16, .px-lg-16 {
    padding-inline-start: var(--16px) !important;
  }

  .p-lg-24 {
    padding: var(--24px) !important;
  }

  .pt-lg-24, .py-lg-24 {
    padding-block-start: var(--24px) !important;
  }

  .pr-lg-24, .px-lg-24 {
    padding-inline-end: var(--24px) !important;
  }

  .pb-lg-24, .py-lg-24 {
    padding-block-end: var(--24px) !important;
  }

  .pl-lg-24, .px-lg-24 {
    padding-inline-start: var(--24px) !important;
  }

  .p-lg-32 {
    padding: var(--32px) !important;
  }

  .pt-lg-32, .py-lg-32 {
    padding-block-start: var(--32px) !important;
  }

  .pr-lg-32, .px-lg-32 {
    padding-inline-end: var(--32px) !important;
  }

  .pb-lg-32, .py-lg-32 {
    padding-block-end: var(--32px) !important;
  }

  .pl-lg-32, .px-lg-32 {
    padding-inline-start: var(--32px) !important;
  }

  .p-lg-42 {
    padding: var(--42px) !important;
  }

  .pt-lg-42, .py-lg-42 {
    padding-block-start: var(--42px) !important;
  }

  .pr-lg-42, .px-lg-42 {
    padding-inline-end: var(--42px) !important;
  }

  .pb-lg-42, .py-lg-42 {
    padding-block-end: var(--42px) !important;
  }

  .pl-lg-42, .px-lg-42 {
    padding-inline-start: var(--42px) !important;
  }
}
/*#endregion*/

.rounded-42 {
  border-radius: 42px !important;
}

.rounded-24 {
  border-radius: 24px !important;
}

@media (min-width:62em) {
  .m-md-42 {
    margin: var(--42px)
  }

  .mt-md-42, .my-md-42 {
    margin-block-start: var(--42px)
  }

  .mr-md-42, .mx-md-42 {
    margin-inline-end: var(--42px)
  }

  .mb-md-42, .my-md-42 {
    margin-block-end: var(--42px)
  }

  .ml-md-42, .mx-md-42 {
    margin-inline-start: var(--42px)
  }

  .m-md-12 {
    margin: var(--12px)
  }

  .mt-md-12, .my-md-12 {
    margin-block-start: var(--12px)
  }

  .mr-md-12, .mx-md-12 {
    margin-inline-end: var(--12px)
  }

  .mb-md-12, .my-md-12 {
    margin-block-end: var(--12px)
  }

  .ml-md-12, .mx-md-12 {
    margin-inline-start: var(--12px)
  }

  .rounded-md-42 {
    border-radius: 42px;
  }

  .rounded-md-24 {
    border-radius: 24px;
  }
}

.line-clamp {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: normal;
  word-break: break-word;
}

.mobile {
  display: none !important;
}

.tablet {
  display: none !important;
}

.desktop {
  display: block !important;
}

  .desktop.d-flex {
    display: flex !important;
  }

:is(a, button):hover .no-hover,
:is(a, button) .with-hover {
  display: none;
}

  :is(a, button) .no-hover,
  :is(a, button):hover .with-hover,
  :is(a, button) .with-hover:hover {
    display: inline-flex;
  }

@media all and (max-width: 62em) {
  .mobile {
    display: block !important;
  }

    .mobile.d-flex {
      display: flex !important;
    }

  .desktop.d-flex,
  .desktop {
    display: none !important;
  }
}

@media all and (max-width: 70em) {
  .tablet {
    display: block !important;
  }

    .tablet.d-flex {
      display: flex !important;
    }
}

.w-fit {
  width: fit-content !important;
}

/* =========================
   TYPOGRAPHY - conteúdo de _typography.css
========================= */

:root {
  --primary-font: Ubuntu, sans-serif;
  --secondary-font: Barlow, sans-serif;
  --regular: 400;
  --medium: 500;
  --semi-bold: 600;
  --bold: 700;
}

.font-1 {
  font-family: var(--primary-font);
}

.font-2 {
  font-family: var(--secondary-font);
}

.fw-regular {
  font-weight: var(--regular);
}

.fw-medium {
  font-weight: var(--medium);
}

.fw-semi-bold {
  font-weight: var(--semi-bold);
}

.fw-bold {
  font-weight: var(--bold);
}

.text-default {
  color: var(--text-default);
}

.text-primary {
  color: var(--text-primary) !important
}

.text-secondary {
  color: var(--text-secondary) !important
}

.text-secondary-2 {
  color: var(--blue3);
}

.text-secondary-3 {
  color: var(--blue5);
}

.text-title {
  color: var(--text-title);
}

.text-icon-alternative {
  color: var(--icons-alternative);
}

/*#region Tamanhos Fontes*/

.fs-12 {
  font-size: 0.75rem
}

.fs-14 {
  font-size: 0.875rem
}

.fs-15 {
  font-size: 0.938rem
}

.fs-16 {
  font-size: 1rem
}

.fs-18 {
  font-size: 1.125rem
}

.fs-20 {
  font-size: 1.25rem
}

.fs-22 {
  font-size: 1.375rem
}

.fs-24 {
  font-size: 1.5rem
}

.fs-26 {
  font-size: 1.625rem
}

.fs-28 {
  font-size: 1.75rem
}

.fs-30 {
  font-size: 1.875rem
}

.fs-32 {
  font-size: 2rem
}

/*LG*/
@media (min-width: 62em) {
  .fs-lg-12 {
    font-size: var(--12px) !important;
  }

  .fs-lg-14 {
    font-size: var(--14px) !important;
  }

  .fs-lg-16 {
    font-size: var(--16px) !important;
  }

  .fs-lg-18 {
    font-size: var(--18px) !important;
  }

  .fs-lg-20 {
    font-size: var(--20px) !important;
  }

  .fs-lg-22 {
    font-size: var(--22px) !important;
  }

  .fs-lg-24 {
    font-size: var(--24px) !important;
  }

  .fs-lg-26 {
    font-size: var(--26px) !important;
  }

  .fs-lg-28 {
    font-size: var(--28px) !important;
  }

  .fs-lg-30 {
    font-size: var(--30px) !important;
  }

  .fs-lg-32 {
    font-size: var(--32px) !important;
  }

  .fs-lg-34 {
    font-size: var(--34px) !important;
  }

  .fs-lg-36 {
    font-size: var(--36px) !important;
  }

  .fs-lg-38 {
    font-size: var(--38px) !important;
  }

  .fs-lg-40 {
    font-size: var(--40px) !important;
  }

  .fs-lg-42 {
    font-size: var(--42px) !important;
  }

  .fs-lg-44 {
    font-size: var(--44px) !important;
  }

  .fs-lg-46 {
    font-size: var(--46px) !important;
  }

  .fs-lg-48 {
    font-size: var(--48px) !important;
  }

  .fs-lg-50 {
    font-size: var(--50px) !important;
  }

  .fs-lg-52 {
    font-size: var(--52px) !important;
  }

  .fs-lg-54 {
    font-size: var(--54px) !important;
  }

  .fs-lg-56 {
    font-size: var(--56px) !important;
  }

  .fs-lg-58 {
    font-size: var(--58px) !important;
  }

  .fs-lg-60 {
    font-size: var(--60px) !important;
  }
}

.ellipsis {
  display: inline-block;
  white-space: nowrap;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  text-decoration: none;
}
/*#endregion*/

/* =========================
   FORMS - conteúdo de _forms.css 
========================= */

.field-validation-error {
  display: block;
  color: var(--red-error);
  text-align: left;
}

.input-validation-error {
  border-color: var(--red-error) !important;
}

  .input-validation-error:focus,
  .input-validation-error:focus-visible {
    outline-color: var(--red-error) !important;
  }

label:has(+ .date-picker-wrapper),
label:has(+ :is(input, select, textarea)) {
  font-weight: 400;
}

input[type="text"], input[type="select"], input[type="email"], input[type="password"], input[type="tel"], textarea {
  display: block;
  width: 100%;
  height: 40px;
  padding: 4px 12px;
  font-size: 16px;
  line-height: 1.5;
  color: var(--text-black-60);
  background-color: #fff;
  background-clip: padding-box;
  border: 1px solid #cccccc;
  border-radius: 4px;
  transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
}

input[type=checkbox] {
  position: relative;
  cursor: pointer;
  width: 16px;
  margin-right: 8px;
}

  input[type=checkbox]:disabled {
    cursor: not-allowed;
    opacity: 0.3 !important;
  }

  input[type=checkbox]:before {
    content: "";
    display: block;
    position: absolute;
    width: 16px;
    height: 16px;
    top: 50%;
    left: 0;
    border: 1px solid var(--gray-2);
    border-radius: 4px;
    background-color: white;
    transform: translateY(-50%);
  }

  input[type=checkbox]:checked:after {
    content: "";
    display: block;
    position: absolute;
    width: 4px;
    height: 8px;
    border: 2px solid var(--icons-primary);
    border-width: 0 1px 1px 0;
    transform: rotate(45deg) translateY(-50%);
    top: calc(50% - 3px);
    left: 3px;
  }

input[type="checkbox"] + label {
  cursor: pointer;
  color: var(--text-default);
}

.myralis-product-filter input[type="checkbox"] + label,
.myralis-search-listbox input[type="checkbox"] + label {
  padding-top: 12px;
}

input[type="checkbox"]:checked:before {
  border: 2px solid var(--icons-primary);
}

input[type="radio"] {
  position: relative;
  display: inline-block;
  width: 1px;
  margin-right: -1px;
  height: 100%;
  cursor: pointer;
  color: transparent;
  -webkit-appearance: none;
  background-color: transparent;
}

  input[type="radio"]:focus-visible {
    outline: none !important;
    border: none;
  }

  input[type="radio"] + label::before {
    display: inline-block;
    content: "\f111";
    margin-right: 4px;
    font-family: "Font Awesome 5 Free";
    font-size: 16px;
    width: 16px;
    height: 16px;
  }

  input[type="radio"]:checked + label::before {
    content: "\f192";
  }

  input[type="radio"]:focus-visible + label {
    outline-offset: 3px;
    outline: 2px solid var(--button-primary);
    border-radius: 4px;
  }

  label:has(> input[type="radio"]:focus-visible),
  label:has(> input[type="radio"]):focus-visible {
    border-radius: 4px;
    outline-offset: 3px;
    outline: 2px solid var(--button-primary) !important;
  }

  select[readonly] {
    background: #eee;
    pointer-events: none;
    touch-action: none;
  }

  .form-password {
    position: relative;
  }

  .form-password i {
    font-size: 1.5625rem;
    color: var(--icons-primary);
    position: absolute;
    z-index: 2;
    right: 20px;
    top: 60px;
    content: "";
    cursor: pointer;
    background-repeat: no-repeat;
    background-position: center;
    transition: all 0.4s ease-in-out;
    -moz-transition: all 0.4s ease-in-out;
    -webkit-transition: all 0.4s ease-in-out;
    -o-transition: all 0.4s ease-in-out;
  }

    .form-password i:hover {
      color: var(--icons-secondary);
    }

.date-wrapper {
  display: block;
  height: 40px;
  border: 1px solid #ccc;
  border-radius: 4px;
  position: relative;
}

  .date-wrapper:has(input:not([type='date']):focus) {
    border-color: #80bdff;
    box-shadow: 0 0 0 .2rem rgba(0,123,255,.25)
  }

  .date-wrapper input:not([type='date']) {
    border: none;
    height: 38px !important;
    outline-color: transparent !important;
  }

  .date-wrapper .iconoir-calendar,
  .date-wrapper input[type='date'] {
    position: absolute;
    width: 38px;
    height: 38px;
    top: 50%;
    right: 4px;
    transform: translateY(-50%);
  }

  .date-wrapper input[type='date'] {
    padding: 19px;
    font-size: 0;
    border: none;
    color: transparent;
    background: transparent;
    z-index: 2;
  }

  .date-wrapper .iconoir-calendar {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    pointer-events: none;
    cursor: pointer;
    z-index: 3;
  }

  .date-wrapper input[type="date"]::-webkit-inner-spin-button,
  .date-wrapper input[type="date"]::-webkit-calendar-picker-indicator {
    display: none;
    -webkit-appearance: none;
  }

  .date-wrapper input[type="date"]::-webkit-datetime-edit-year-field:not([aria-valuenow]),
  .date-wrapper input[type="date"]::-webkit-datetime-edit-month-field:not([aria-valuenow]),
  .date-wrapper input[type="date"]::-webkit-datetime-edit-day-field:not([aria-valuenow]) {
    color: transparent;
  }

  .date-wrapper input[type='date']:focus {
    border-color: transparent;
    outline-color: transparent !important;
    outline-offset: 0;
  }

.myralis-eye {
  background-image: url("../images/eye.svg?v=4.43");
  width: 20px;
  height: 20px;
}

.myralis-eye-slash {
  background-image: url("../images/eye-slash.svg?v=4.43");
  width: 20px;
  height: 20px;
}

/* =========================
   BUTTONS - conteúdo de _buttons.css
========================= */

button:focus {
  outline-color: transparent;
  outline-width: 0;
}

:is(button, a, input, select):focus-visible {
  border-radius: 4px;
  outline-offset: 3px;
  outline: 2px solid var(--button-primary) !important;
}

.hamburger:focus-visible {
  outline-color: var(--el-primary) !important;
}

.form-control:focus-visible {
  outline: 0 !important;
}

.btn:focus {
  box-shadow: none;
}

[class*=" button-"] {
  -webkit-transition: all .3s;
  transition: all .3s;
  cursor: pointer;
  border-radius: 8px;
  box-shadow: none;
  display: inline-block;
  min-height: var(--36px);
  font-weight: 500;
  font-family: var(--primary-font);
  font-size: var(--16px);
  line-height: 1.4;
  text-align: center;
}

:not(:is(button, a, input))[class*=" button-"]:not(:disabled):not(.disabled) {
  cursor: default;
}

.button-1 {
  outline-color: var(--button-primary);
  background-color: var(--button-primary);
  color: var(--button-primary-fg);
  padding: 6px 15px;
  /* min-width: 176px; */
}

  .button-1:focus,
  .button-1:hover {
    /*box-shadow: 0 0.5em 0.5em -0.4em var(--button-primary);
      transform: translateY(-2px);*/
    color: var(--button-primary-fg);
    font-weight: 600;
  }

:not(:is(button, a)):is(.button-1:focus, .button-1:hover):not(:disabled):not(.disabled) {
  font-weight: 500;
}

.button-1.v1 {
  outline-color: var(--button-primary-1);
  background-color: var(--button-primary-1);
  color: var(--white);
}

.button-1.v2 {
  outline-color: var(--button-primary-2);
  background-color: var(--button-primary-2);
  color: var(--white);
}

.button-1.v3 {
  outline-color: var(--button-primary-3);
  background-color: var(--button-primary-3);
  color: var(--white);
}

.button-1.success {
  outline-color: var(--button-primary);
  background-color: var(--button-primary);
}


.button-2,
.quick-view-plugin-btn,
.slider-btn,
.button-blank {
  color: var(--button-secondary-fg);
  background: var(--button-secondary);
  outline-color: var(--button-secondary);
  border: 1px solid var(--button-secondary);
  padding: 4px 12px;
  min-width: 106px;
}

  .button-2:focus,
  .button-2:hover {
    color: var(--button-secondary-fg);
    background: var(--button-secondary);
    font-weight: 600;
  }

.button-3 {
  background-color: transparent;
  color: var(--text-primary);
  padding: 6px 15px;
  min-width: 0;
  border-width: 0;
  border-color: attr(color);
}

  .button-3.v2 {
    color: var(--text-secondary);
  }

  .button-3.v3 {
    color: var(--button-primary-3);
  }

  .button-3.v4 {
    color: var(--button-primary-4);
  }

  .button-3:focus,
  .button-3:hover {
    /*transform: scale(1.02);*/
    color: var(--text-secondary);
  }

  .button-3.bordered {
    border-width: 1px;
    border-style: solid;
    border-radius: 24px;
  }


.button-icon {
  padding: 8px 9px;
}

.button-link {
  color: var(--text-secondary);
  background-color: transparent;
  padding: 0;
  width: auto;
  font-size: var(--14px);
}

  .button-link:focus,
  .button-link:hover {
    color: var(--text-primary);
  }

[class*=" button-"].w-220 {
  width: 220px;
}

[class*=" button-"].rounded {
  border-radius: 24px !important;
}

[data-target^='#modal-share'] {
  cursor: pointer;
}

#back-link {
  color: var(--blue) !important;
}

  #back-link img {
    vertical-align: middle;
  }

/* =========================
   FONTS - conteúdo de all-fonts.css
========================= */

/* Ubuntu */
@font-face {
  font-family: "Ubuntu";
  src: url("../fonts/Ubuntu-Regular.ttf") format("truetype");
  font-weight: 400;
  font-style: normal;
}

@font-face {
  font-family: "Ubuntu";
  src: url("../fonts/Ubuntu-Medium.ttf") format("truetype");
  font-weight: 500;
  font-style: normal;
}

@font-face {
  font-family: "Ubuntu";
  src: url("../fonts/Ubuntu-MediumItalic.ttf") format("truetype");
  font-weight: 500;
  font-style: italic;
}

@font-face {
  font-family: "Ubuntu";
  src: url("../fonts/Ubuntu-Bold.ttf") format("truetype");
  font-weight: 700;
  font-style: normal;
}

@font-face {
  font-family: "Ubuntu";
  src: url("../fonts/Ubuntu-BoldItalic.ttf") format("truetype");
  font-weight: 700;
  font-style: italic;
}

/* Barlow */
@font-face {
  font-family: "Barlow";
  src: url("../fonts/Barlow-Regular.ttf") format("truetype");
  font-weight: 400;
  font-style: normal;
}

@font-face {
  font-family: "Barlow";
  src: url("../fonts/Barlow-Italic.ttf") format("truetype");
  font-weight: 400;
  font-style: italic;
}

@font-face {
  font-family: "Barlow";
  src: url("../fonts/Barlow-Medium.ttf") format("truetype");
  font-weight: 500;
  font-style: normal;
}

@font-face {
  font-family: "Barlow";
  src: url("../fonts/Barlow-MediumItalic.ttf") format("truetype");
  font-weight: 500;
  font-style: italic;
}

@font-face {
  font-family: "Barlow";
  src: url("../fonts/Barlow-SemiBold.ttf") format("truetype");
  font-weight: 600;
  font-style: normal;
}

@font-face {
  font-family: "Barlow";
  src: url("../fonts/Barlow-SemiBoldItalic.ttf") format("truetype");
  font-weight: 600;
  font-style: italic;
}

@font-face {
  font-family: "Barlow";
  src: url("../fonts/Barlow-Bold.ttf") format("truetype");
  font-weight: 700;
  font-style: normal;
}

@font-face {
  font-family: "Barlow";
  src: url("../fonts/Barlow-BoldItalic.ttf") format("truetype");
  font-weight: 700;
  font-style: italic;
}