html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video {
  margin: 0;
  padding: 0;
  border: 0;
  vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
  display: block;
}
body {
  line-height: 1;
}
ol,
ul {
  list-style: none;
}
blockquote,
q {
  quotes: none;
}
blockquote:before,
blockquote:after,
q:before,
q:after {
  content: '';
  content: none;
}
table {
  border-collapse: collapse;
  border-spacing: 0;
}

a {
  text-decoration: none;
}

* {
  box-sizing: border-box;
}

button {
  appearance: none;
  -webkit-appearance: none;
  background: transparent;
  border: 0;
  padding: 0;
  cursor: pointer;
}

@font-face {
  font-family: 'WorkSans';
  font-style: normal;
  font-weight: 100 900;
  src: url('clientlib-site/resources/fonts/WorkSans-Variable.ttf') format('truetype-variations');
  font-display: swap;
}
@font-face {
  font-family: 'OpenSans';
  font-style: normal;
  font-weight: 100 900;
  src: url('clientlib-site/resources/fonts/OpenSans-Variable.ttf') format('truetype-variations');
  font-display: swap;
}


@font-face {
  font-family: 'icomoon';
  src: url('clientlib-site/resources/icons/icomoon.eot?gk6ixa');
  src: url('clientlib-site/resources/icons/icomoon.eot?gk6ixa#iefix') format('embedded-opentype'),
    url('clientlib-site/resources/icons/icomoon.ttf?gk6ixa') format('truetype'),
    url('clientlib-site/resources/icons/icomoon.woff?gk6ixa') format('woff'),
    url('clientlib-site/resources/icons/icomoon.svg?gk6ixa#icomoon') format('svg');
  font-weight: normal;
  font-style: normal;
  font-display: block;
}

[class^='icon-'],
[class*=' icon-'] {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: 'icomoon' !important;
  speak: never;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;

  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* CUSTOM ICONS */
.icon-desk-2:before {
  content: '\e900';
}
.icon-pool-filter:before {
  content: '\e901';
}
.icon-pump:before {
  content: '\e902';
}
.icon-quality:before {
  content: '\e903';
}
.icon-rush:before {
  content: '\e904';
}

/* LIBRARY ICONS */
.icon-arrow_down:before {
  content: '\e905';
}
.icon-arrow_left:before {
  content: '\e906';
}
.icon-arrow_right:before {
  content: '\e907';
}
.icon-arrow_up:before {
  content: '\e908';
}
.icon-arrow-down-to-line:before {
  content: '\e909';
}
.icon-badge-percent:before {
  content: '\e90a';
}
.icon-book-open-text:before {
  content: '\e90b';
}
.icon-bubbles:before {
  content: '\e90c';
}
.icon-calendar:before {
  content: '\e90d';
}
.icon-calendar-days:before {
  content: '\e90e';
}
.icon-camera:before {
  content: '\e90f';
}
.icon-check:before {
  content: '\e910';
}
.icon-chevron-down:before {
  content: '\e911';
}
.icon-chevron-first:before {
  content: '\e912';
}
.icon-chevron-last:before {
  content: '\e913';
}
.icon-chevron-left:before {
  content: '\e914';
}
.icon-chevron-right:before {
  content: '\e915';
}
.icon-chevron-up:before {
  content: '\e916';
}
.icon-circle_check_big:before {
  content: '\e917';
}
.icon-circle-alert:before {
  content: '\e918';
}
.icon-circle-check:before {
  content: '\e919';
}
.icon-circle-pause:before {
  content: '\e91a';
}
.icon-circle-play:before {
  content: '\e91b';
}
.icon-clock:before {
  content: '\e91c';
}
.icon-close:before {
  content: '\e91d';
}
.icon-desk:before {
  content: '\e91e';
}
.icon-ellipsis-vertical:before {
  content: '\e91f';
}
.icon-file-text:before {
  content: '\e920';
}
.icon-globe:before {
  content: '\e921';
}
.icon-group:before {
  content: '\e922';
}
.icon-heart:before {
  content: '\e923';
}
.icon-house:before {
  content: '\e924';
}
.icon-info:before {
  content: '\e925';
}
.icon-lightbulb:before {
  content: '\e926';
}
.icon-log-out:before {
  content: '\e927';
}
.icon-mail:before {
  content: '\e928';
}
.icon-map-pin:before {
  content: '\e929';
}
.icon-map-pin-house:before {
  content: '\e92a';
}
.icon-map-pinned:before {
  content: '\e92b';
}
.icon-menu:before {
  content: '\e92c';
}
.icon-minus:before {
  content: '\e92d';
}
.icon-move-left:before {
  content: '\e92e';
}
.icon-move-right:before {
  content: '\e92f';
}
.icon-move-vertical:before {
  content: '\e930';
}
.icon-package:before {
  content: '\e931';
}
.icon-package-check:before {
  content: '\e932';
}
.icon-package-plus:before {
  content: '\e933';
}
.icon-package-search:before {
  content: '\e934';
}
.icon-pencil:before {
  content: '\e935';
}
.icon-phone:before {
  content: '\e936';
}
.icon-plus:before {
  content: '\e937';
}
.icon-question:before {
  content: '\e938';
}
.icon-save:before {
  content: '\e939';
}
.icon-search:before {
  content: '\e93a';
}
.icon-shield-check:before {
  content: '\e93b';
}
.icon-shopping-cart:before {
  content: '\e93c';
}
.icon-sliders-horizontal:before {
  content: '\e93d';
}
.icon-soap-dispenser-droplet:before {
  content: '\e93e';
}
.icon-square-arrow-out-up-right:before {
  content: '\e93f';
}
.icon-square-percent:before {
  content: '\e940';
}
.icon-tag:before {
  content: '\e941';
}
.icon-trash-2:before {
  content: '\e942';
}
.icon-truck:before {
  content: '\e943';
}
.icon-user:before {
  content: '\e944';
}
.icon-wallet:before {
  content: '\e945';
}
.icon-warehouse:before {
  content: '\e946';
}
.icon-waves-ladder:before {
  content: '\e947';
}
.icon-zoom:before {
  content: '\e948';
}

/* SOCIAL NETWORKS ICONS */
.icon-facebook:before {
  content: '\e949';
}
.icon-Instagram:before {
  content: '\e94c';
}
.icon-linkedin:before {
  content: '\e94a';
}
.icon-x:before {
  content: '\e94b';
}
.icon-youtube:before {
  content: '\e94d';
}

:root {
  /* C O L O U R S  */
  /* =========================
     Base
     ========================= */
  --base-50: #EBEDF6;
  --base-50-50: #EBEDF680;
  --base-100: #C0C5DC;
  --base-200: #989EBB;
  --base-300: #5C6492;
  --base-500: #252E61;
  --base-700: #151C3F;
  --base-900: #090D1D;
  /* =========================
     Neutral
     ========================= */
  --neutral-000: #FFFFFF;
  --neutral-100: #F5F6F8;
  --neutral-300: #C4C7CF;
  --neutral-500: #858A96;
  --neutral-700: #4D5160;
  --neutral-900: #1D1F26;
  /* =========================
     Text
     ========================= */
  --text-default: #1D1F26;
  --text-grey: #4D5160;
  --text-inverse: #FFFFFF;
  --text-primary: #03C1DE;
  --text-secondary: #FFD000;
  /* B R E A K P O I N T S */
  --bp-sm: 576px;
  --bp-md: 768px;
  --bp-lg: 992px;
  --bp-xl: 1200px;
}

.fluidra-h1,
.fluidra-h2,
.fluidra-h2-bold,
.fluidra-h3,
.fluidra-h3-bold,
.fluidra-base-regular,
.fluidra-base-semibold,
.fluidra-base-bold,
.fluidra-base-link,
.fluidra-base-semibold-link,
.fluidra-small-regular,
.fluidra-small-bold,
.fluidra-small-semibold,
.fluidra-small-regular-link,
.fluidra-small-semibold-link,
.fluidra-xs-regular,
.fluidra-xs-semibold {
  color: var(--text-default);
}
.fluidra-white {
  color: var(--neutral-000);
}
.fluidra-h1 {
  font-size: 28px;
  font-weight: 700;
  line-height: 36px;
}
@media (min-width: 768px) {
  .fluidra-h1 {
    font-size: 32px;
    line-height: 38px;
  }
}
.fluidra-h2 {
  font-size: 22px;
  font-weight: 600;
  line-height: 24px;
}
@media (min-width: 768px) {
  .fluidra-h2 {
    font-size: 24px;
    line-height: 24px;
  }
}
.fluidra-h2-bold {
  font-size: 22px;
  font-weight: 700;
  line-height: 24px;
}
@media (min-width: 768px) {
  .fluidra-h2-bold {
    font-size: 24px;
    line-height: 24px;
  }
}
.fluidra-h3 {
  font-size: 18px;
  font-weight: 600;
  line-height: 24px;
}
@media (min-width: 768px) {
  .fluidra-h3 {
    font-size: 20px;
  }
}
.fluidra-h3-bold {
  font-size: 18px;
  font-weight: 700;
  line-height: 24px;
}
@media (min-width: 768px) {
  .fluidra-h3-bold {
    font-size: 20px;
  }
}
.fluidra-base-regular {
  font-size: 16px;
  font-weight: 400;
  line-height: 20px;
}
.fluidra-base-semibold {
  font-size: 16px;
  font-weight: 600;
  line-height: 18px;
}
@media (min-width: 768px) {
  .fluidra-base-semibold {
    line-height: 24px;
  }
}
.fluidra-base-bold {
  font-size: 14px;
  font-weight: 700;
  line-height: 18px;
}
@media (min-width: 768px) {
  .fluidra-base-bold {
    font-size: 16px;
    line-height: 24px;
  }
}
.fluidra-base-link {
  font-size: 14px;
  font-weight: 400;
  line-height: 18px;
  text-decoration: underline;
}
@media (min-width: 768px) {
  .fluidra-base-link {
    font-size: 16px;
    line-height: 24px;
  }
}
.fluidra-base-semibold-link {
  font-size: 14px;
  font-weight: 600;
  line-height: 24px;
  text-decoration: underline;
}
@media (min-width: 768px) {
  .fluidra-base-semibold-link {
    font-size: 16px;
    line-height: 24px;
  }
}
.fluidra-small-regular {
  font-size: 12px;
  font-weight: 400;
  line-height: 18px;
}
@media (min-width: 768px) {
  .fluidra-small-regular {
    font-size: 14px;
    line-height: 20px;
  }
}
.fluidra-small-semibold {
  font-size: 12px;
  font-weight: 600;
  line-height: 18px;
}
@media (min-width: 768px) {
  .fluidra-small-semibold {
    font-size: 14px;
    line-height: 20px;
  }
}
.fluidra-small-bold {
  font-size: 12px;
  font-weight: 700;
  line-height: 18px;
}
@media (min-width: 768px) {
  .fluidra-small-bold {
    font-size: 14px;
    line-height: 20px;
  }
}
.fluidra-small-regular-link {
  font-size: 12px;
  font-weight: 400;
  line-height: 18px;
  text-decoration: underline;
}
@media (min-width: 768px) {
  .fluidra-small-regular-link {
    font-size: 14px;
    line-height: 24px;
  }
}
.fluidra-small-semibold-link {
  font-size: 12px;
  font-weight: 600;
  line-height: 18px;
  text-decoration: underline;
}
@media (min-width: 768px) {
  .fluidra-small-semibold-link {
    font-size: 14px;
    line-height: 20px;
  }
}
.fluidra-xs-regular {
  font-size: 12px;
  font-weight: 400;
  line-height: 16px;
}
@media (min-width: 768px) {
  .fluidra-xs-regular {
    line-height: 18px;
  }
}
.fluidra-xs-semibold {
  font-size: 12px;
  font-weight: 600;
  line-height: 18px;
}

/* ====== Commons buttons styles ====== */
.cmp-button {
  width: 100%;
  height: 3rem;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  padding-right: 1rem;
  padding-left: 1rem;
  text-decoration: none;
  color: var(--neutral-000);
}
@media (min-width: 768px) {
  .cmp-button {
    width: fit-content;
  }
}
.cmp-button__icon {
  font-size: 24px;
}
.cmp-button__text {
  font-size: 14px;
  font-weight: 700;
  line-height: 18px;
}
@media (min-width: 768px) {
  .cmp-button__text {
    font-size: 16px;
    line-height: 24px;
  }
}
/* ====== commons buttons styles systems ====== */
.fluidra-button-primary .cmp-button {
  border-radius: var(--button-radio);
}
.fluidra-button-primary:not(.fluidra-button--dark) .cmp-button:disabled {
  color: var(--text-grey);
  background-color: var(--neutral-300);
}
.fluidra-button-primary.fluidra-button--dark .cmp-button:disabled {
  color: var(--text-grey);
  background-color: var(--neutral-300);
}
.fluidra-button-secondary .cmp-button {
  border-radius: var(--button-radio);
  border: 0.125rem solid;
}
.fluidra-button-secondary:not(.fluidra-button--dark) .cmp-button {
  color: var(--base-500);
}
.fluidra-button-secondary:not(.fluidra-button--dark) .cmp-button:hover {
  border-width: 0.125rem;
  outline: 0.0625rem solid;
}
.fluidra-button-secondary:not(.fluidra-button--dark) .cmp-button:disabled {
  border-color: var(--neutral-300);
  color: var(--neutral-300);
}
.fluidra-button-secondary.fluidra-button--dark .cmp-button {
  border-color: var(--neutral-000);
  color: var(--neutral-000);
}
.fluidra-button-secondary.fluidra-button--dark .cmp-button:hover {
  border-width: 0.125rem;
  outline: 0.125rem solid;
}
.fluidra-button-secondary.fluidra-button--dark .cmp-button:disabled {
  color: var(--neutral-300);
  border-color: var(--neutral-300);
}
.fluidra-button-link .cmp-button {
  padding: 0;
  height: fit-content;
}
.fluidra-button-link .cmp-button .cmp-button__text {
  font-weight: 400;
  text-decoration: underline;
}
.fluidra-button-link .cmp-button:hover .cmp-button__text,
.fluidra-button-link .cmp-button:disabled .cmp-button__text {
  text-decoration: none;
}
.fluidra-button-link:not(.fluidra-button--dark).cmp-button:disabled {
  color: var(--neutral-300);
}
.fluidra-button-link.fluidra-button--dark .cmp-button:hover {
  color: var(--neutral-000);
}
.fluidra-button-link.fluidra-button--dark .cmp-button:disabled {
  color: var(--neutral-300);
}
.fluidra-button--reverse .cmp-button {
  flex-direction: row-reverse;
}

/* C O M M O N   C A R D S  */
.service-card {
  background-color: var(--neutral-100);
  display: flex;
  flex-direction: column;
  align-items: stretch;
}
@media (min-width: 768px) {
  .service-card {
    flex-direction: row;
  }
}
.service-card__img {
  flex: 0 0 248px;
  position: relative;
  overflow: hidden;
}
@media (max-width: 768px) {
  .service-card__img {
    height: 126px;
    width: 100%;
    flex: 0 0 auto;
  }
}
.service-card__img img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.service-card__content {
  padding: 1rem;
  display: flex;
  flex-direction: column;
  gap: .5rem;
}
@media (min-width: 768px) {
  .service-card__content {
    padding: 1.75rem 2.25rem;
    gap: 1rem;
  }
}
.service-card__content-tag {
  padding: .25rem .75rem;
  color: var(--base-500);
  background-color: var(--base-50);
  mix-blend-mode: multiply;
  width: fit-content;
}
.service-card__content-link {
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
  color: var(--base-500);
}
.vertical-card {
  background-color: var(--neutral-000);
  width: 18.875rem;
  display: flex;
  flex-direction: column;
  box-shadow: 0px 4px 8px 0px rgba(37, 46, 97, 0.1);
  border-radius: var(--card-radio);
}
.vertical-card__img {
  height: 11.6875rem;
  width: 100%;
  object-fit: cover;
  border-radius: var(--card-radio);
}
.vertical-card__content {
  padding: 1rem;
  display: flex;
  flex-direction: column;
  gap: .5rem;
}
@media (max-width: 768px) {
  .vertical-card__content {
    margin-bottom: 1.5rem;
  }
}
@media (min-width: 768px) {
  .vertical-card__content {
    gap: 1rem;
  }
}
.vertical-card__content-title {
  text-decoration: underline;
}
@media (min-width: 768px) {
  .vertical-card__content-title {
    text-decoration: none;
  }
}
.vertical-card__content-tag {
  padding: .25rem .75rem;
  color: var(--base-500);
  background-color: var(--base-50);
  border-radius: var(--button-radio);
  mix-blend-mode: multiply;
  width: fit-content;
}
.vertical-card:hover {
  cursor: pointer;
  outline: 2px solid var(--base-200);
}
.vertical-card:hover .vertical-card__content-title {
  text-decoration: underline;
}
.product-card {
  border: 1px solid var(--base-50);
  box-shadow: 0px 4px 8px 0px rgba(37, 46, 97, 0.1);
  border-radius: var(--card-radio);
  background-color: var(--neutral-000);
}
.product-card__img {
  width: 100%;
  height: 11.6875rem;
  display: flex;
  justify-content: center;
}
.product-card__img-tag {
  width: auto;
  height: 1.75rem;
  border-bottom-right-radius: var(--tag-radio);
  border-bottom-left-radius: var(--tag-radio);
  padding: 0.25rem 0.5rem;
  z-index: 1;
}
.product-card__img-tag--promotion {
  background-color: var(--primary-50);
  color: var(--primary-800);
}
.product-card__img-tag--discontinued {
  background-color: var(--base-50);
  color: var(--base-500);
}
.product-card__img img {
  height: 11.6875rem;
  object-fit: contain;
  position: absolute;
}
.product-card__content {
  width: 100%;
  padding: .5rem 1rem 1rem 1rem;
}
.product-card__content-title {
  margin-bottom: .75rem;
}
.product-card__content-stock {
  padding: .25rem .375rem;
  border-radius: var(--button-radio);
  width: fit-content;
  display: flex;
  align-items: center;
  gap: .25rem;
  margin-bottom: .25rem;
}
.product-card__content-stock span {
  line-height: .875rem;
}
.product-card__content-stock:last-of-type {
  margin-bottom: .75rem;
}
.product-card__content .stock--avaliable {
  background-color: var(--success-background-50);
}
.product-card__content .stock--avaliable span {
  color: var(--success);
}
.product-card__content .stock--not-avaliable {
  background-color: var(--warning-background-50);
}
.product-card__content .stock--not-avaliable span {
  color: var(--warning);
}
.product-card__content .cmp-button {
  width: 100%;
  height: 2.5rem;
}

.scroll-bar {
  /* bar color */
  /* "thumb" color */
}
.scroll-bar::-webkit-scrollbar {
  width: 6px;
}
.scroll-bar::-webkit-scrollbar-track {
  background: var(--neutral-100);
}
.scroll-bar::-webkit-scrollbar-thumb {
  background: var(--base-300);
  border-radius: var(--button-radio);
}

.form-stepper {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  padding: 0.5rem;
  height: 3rem;
  border: 0.0625rem solid var(--base-700);
  border-radius: var(--button-radio);
  width: fit-content;
}
.form-stepper__button {
  font-size: 1.5rem;
  display: flex;
  color: var(--base-500);
  cursor: pointer;
}
@media (min-width: 768px) {
  .form-stepper__button {
    font-size: 1rem;
  }
}
.form-stepper__value {
  width: 2.375rem;
  text-align: center;
}
.form-stepper .disabled {
  color: var(--text-grey);
}
.form-radios {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.form-radios__radio {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}
.form-radios .radio {
  appearance: none;
  min-width: 1.25rem;
  height: 1.25rem;
  border: 0.0625rem solid var(--base-700);
  border-radius: 0.625rem;
  display: inline-block;
  position: relative;
  cursor: pointer;
}
.form-radios .radio:checked {
  border: 0.125rem solid var(--base-700);
  cursor: pointer;
}
.form-radios .radio:checked::after {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  width: 0.625rem;
  height: 0.625rem;
  background-color: var(--base-700);
  border-radius: 50%;
  transform: translate(-50%, -50%);
}
.form-radios .radio:hover:not(:disabled):not(:checked) {
  border: 0.125rem solid var(--base-700);
  background-color: var(--primary-100);
}
.form-radios .radio:disabled {
  border: 0.0625rem solid var(--neutral-300);
}
.form-radios .radio:disabled + .radio-label {
  color: var(--neutral-300);
}
.form-checkboxes {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.form-checkboxes__checkbox {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}
.form-checkboxes .checkbox {
  appearance: none;
  min-width: 1.25rem;
  height: 1.25rem;
  border: 0.0625rem solid var(--base-700);
  position: relative;
  cursor: pointer;
}
.form-checkboxes .checkbox:checked {
  border: 0.125rem solid var(--base-700);
  background-color: var(--base-700);
}
.form-checkboxes .checkbox:checked::after {
  content: '';
  position: absolute;
  top: 0.125rem;
  left: 0.3125rem;
  width: 0.25rem;
  height: 0.5rem;
  border-right: 0.125rem solid var(--neutral-000);
  border-bottom: 0.125rem solid var(--neutral-000);
  transform: rotate(45deg);
}
.form-checkboxes .checkbox:hover:not(:disabled):not(:checked) {
  border: 0.125rem solid var(--base-700);
  background-color: var(--primary-100);
}
.form-checkboxes .checkbox:disabled {
  border: 0.0625rem solid var(--neutral-300);
}
.form-checkboxes .checkbox:disabled + .checkbox-label {
  color: var(--neutral-300);
}
.form-input {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  position: relative;
}
.form-input__wrapper {
  display: flex;
  align-items: center;
  height: 3rem;
  gap: 0.5rem;
  border: 0.0625rem solid var(--neutral-500);
  padding: 0.875rem 1rem;
  border-radius: var(--input-radio);
}
.form-input__wrapper .input-wrapper__input {
  border: none;
  outline: none;
  background: none;
  width: 100%;
}
.form-input__wrapper .input-wrapper__input::placeholder {
  color: var(--neutral-700);
}
.form-input__wrapper .input-wrapper__input:disabled {
  background-color: var(--neutral-100);
  color: var(--neutral-300);
  cursor: not-allowed;
}
.form-input__wrapper::placeholder {
  color: var(--neutral-700);
}
.form-input__wrapper:focus {
  box-shadow: 0 0 0 3px var(--primary-800);
  border: 0.125rem solid var(--base-700);
}
.form-input__wrapper:disabled {
  background-color: var(--neutral-100);
  color: var(--neutral-300);
  cursor: not-allowed;
}
.form-input__wrapper .icon {
  color: var(--base-700);
}
.form-input__wrapper .icon-search {
  color: var(--base-500);
  font-size: 24px;
}
.form-input__wrapper:hover:not(.error):not(:has(.input-wrapper__input:disabled)):not(:focus-within) {
  border: 0.125rem solid var(--base-700);
}
.form-input__wrapper:has(.search-input:disabled) {
  background-color: var(--neutral-100);
  color: var(--neutral-300);
  cursor: not-allowed;
  border: none;
}
.form-input__wrapper:has(.input-wrapper__input:invalid) {
  border: 1px solid var(--error);
}
.form-input .required {
  color: var(--error);
}
.form-input .error {
  border: 1px solid var(--error);
}
.form-input .icon-circle-alert {
  color: var(--error);
  font-size: 24px;
}
.form-input .search-input {
  color: var(--neutral-900);
}
.form-input .form-input__helper {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.form-input .form-input__helper .color-text {
  color: var(--neutral-700);
}
.form-inputModal {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  position: relative;
}
.form-inputModal__wrapper {
  display: flex;
  align-items: center;
  height: 3rem;
  gap: 0.5rem;
  border: 0.0625rem solid var(--neutral-500);
  padding: 0.875rem 1rem;
  border-radius: var(--input-radio);
}
.form-inputModal__wrapper .input-wrapper__input {
  border: none;
  outline: none;
  background: none;
  width: 100%;
}
.form-inputModal__wrapper .input-wrapper__input::placeholder {
  color: var(--neutral-700);
}
.form-inputModal__wrapper .input-wrapper__input:disabled {
  background-color: var(--neutral-100);
  color: var(--neutral-300);
  cursor: not-allowed;
}
.form-inputModal__wrapper::placeholder {
  color: var(--neutral-700);
}
.form-inputModal__wrapper:focus {
  box-shadow: 0 0 0 3px var(--primary-800);
  border: 0.125rem solid var(--base-700);
}
.form-inputModal__wrapper:disabled {
  background-color: var(--neutral-100);
  color: var(--neutral-300);
  cursor: not-allowed;
}
.form-inputModal__wrapper .icon {
  color: var(--base-700);
}
.form-inputModal__wrapper .icon-search {
  color: var(--base-500);
  font-size: 24px;
}
.form-inputModal__wrapper:hover:not(.error):not(:has(.input-wrapper__input:disabled)):not(:focus-within) {
  border: 0.125rem solid var(--base-700);
}
.form-inputModal__wrapper:has(.search-input:disabled) {
  background-color: var(--neutral-100);
  color: var(--neutral-300);
  cursor: not-allowed;
  border: none;
}
.form-inputModal__wrapper:has(.input-wrapper__input:invalid) {
  border: 1px solid var(--error);
}
.form-inputModal .required {
  color: var(--error);
}
.form-inputModal .error {
  border: 1px solid var(--error);
}
.form-inputModal .icon-circle-alert {
  color: var(--error);
  font-size: 24px;
}
.form-inputModal .search-input {
  color: var(--neutral-900);
}
.form-inputModal .form-inputModal__helper {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.form-inputModal .form-inputModal__helper .color-text {
  color: var(--neutral-700);
}
.form-inputModal .inputModal-wrapper__input {
  border: none;
  outline: none;
  background: none;
  width: 100%;
}
.form-inputModal .inputModal-wrapper__input::placeholder {
  color: var(--neutral-700);
}
.form-inputModal .inputModal-wrapper__input:disabled {
  background-color: var(--neutral-100);
  color: var(--neutral-300);
  cursor: not-allowed;
}
.form-inputModal .search-results {
  position: absolute;
  top: 75%;
  left: 0;
  width: 100%;
  background: var(--neutral-000);
  border: 1px solid var(--base-50);
  border-radius: 6px;
  max-height: 15rem;
  overflow-y: auto;
  margin-top: 0.25rem;
  list-style: none;
  padding: 0;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
  z-index: 10;
}
.form-inputModal .search-results li {
  position: relative;
  padding: 8px 12px;
  cursor: pointer;
}
.form-inputModal .search-results li::after {
  content: '';
  position: absolute;
  left: 50%;
  bottom: 0;
  width: 95%;
  height: 1px;
  background-color: var(--neutral-300);
  transform: translateX(-50%);
}
.form-inputModal .search-results li:last-child::after {
  display: none;
}
.form-inputModal .search-results li:hover {
  background-color: var(--neutral-000);
}
.form-inputModal .search-results.hidden {
  display: none;
}
.form-select-cards {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}
.form-select-cards__option {
  display: flex;
  flex-direction: row-reverse;
  justify-content: flex-end;
  align-items: flex-start;
  gap: 0.5rem;
  border: 0.0625rem solid var(--base-100);
  padding: 1rem 2rem 1rem 1rem;
  border-radius: var(--card-radio);
  max-width: 55.3125rem;
}
.form-select-cards__option label {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
.form-select-cards__option input[type='radio'] {
  accent-color: #151c3f;
  margin-top: 6px;
  cursor: pointer;
}
.form-select-cards--active {
  border: 0.125rem solid var(--base-500);
  background-color: var(--base-50-50);
}
.form-dropdown {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  position: relative;
}
.form-dropdown__container {
  position: relative;
  cursor: pointer;
  display: flex;
  align-items: center;
  height: 3rem;
  gap: 0.5rem;
  border: 0.0625rem solid var(--neutral-500);
  padding: 0.875rem 1rem;
  border-radius: var(--input-radio);
  background-color: var(--neutral-000);
}
.form-dropdown__container .dropdown__button {
  display: flex;
  align-items: center;
  width: 100%;
  justify-content: space-between;
}
.form-dropdown__container .icon-chevron-up {
  display: none;
  color: var(--base-500);
  font-size: 24px;
}
.form-dropdown__container .icon-chevron-down {
  color: var(--base-500);
  font-size: 24px;
}
.form-dropdown__container-options {
  display: none;
  position: absolute;
  top: 100%;
  left: 0;
  width: 100%;
  background: var(--neutral-000);
  border: 1px solid var(--base-50);
  border-radius: 6px;
  max-height: 15rem;
  overflow-y: auto;
  margin-top: 0.25rem;
  list-style: none;
  padding: 0;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
  z-index: 10;
}
.form-dropdown__container-options .options-item {
  position: relative;
  padding: 12px 12px;
  cursor: pointer;
}
.form-dropdown__container-options .options-item::after {
  content: '';
  position: absolute;
  left: 50%;
  bottom: 0;
  width: calc(99.375%);
  height: 1px;
  background-color: var(--neutral-300);
  transform: translateX(-50%);
}
.form-dropdown__container-options .options-item:last-child::after {
  display: none;
}
.form-dropdown .required {
  color: var(--error);
}
.form-date__container {
  display: flex;
  gap: 0.5rem;
}
.form-date__container-start {
  display: flex;
  flex-direction: column;
}
.form-date__container-end {
  display: flex;
  flex-direction: column;
}
.form-date__container-input {
  display: flex;
  align-items: center;
  height: 3rem;
  gap: 0.5rem;
  border: 0.0625rem solid var(--neutral-500);
  border-radius: var(--input-radio);
}
.form-date__container-input .input-date {
  padding: 0.875rem 1rem;
  border: none;
  outline: none;
  background: none;
  width: 100%;
}
.form-date__container-input .input-date::placeholder {
  color: var(--neutral-700);
}
.form-date__container-input .input-date:disabled {
  background-color: var(--neutral-100);
  color: var(--neutral-300);
  cursor: not-allowed;
}
.form-date__container .icon-calendar-days {
  padding: 0.875rem 1rem;
  color: var(--base-500);
  font-size: 22px;
}