@charset "UTF-8";
:root {
  /* Tipografía */
  --font-body: "Poppins", Arial, sans-serif;
  /*Color*/
  --color-blue-02: #021555;
  --color-blue-97: #97ccad;
  --color-red-ed: #ED1C24;
  --color-gray-e1: #e1e1e1;
  --color-gray-e6: #E6E7E8;
  --color-gray-79: #79818c;
  --color-gray-62: #626973;
  --color-gray-f1: #f1f2f2;
  --color-gray-f5: #f5f5f5;
  --color-gray-fa: #FAFBFD;
  --color-gray-ef: #EFEFEF;
  --color-gray-99: #999999;
  --color-gray-bc: #BCBEC0;
  --color-green-9d: #9DDD2C;
  --color-black-0d: #0d0d0d;
  --color-white-ff: #ffffff;
  --color-white-f1: #f1f1f1;
  --gradient-blue-moz: -moz-linear-gradient(
    90deg,
    rgba(17, 54, 130, 1) 0%,
    rgba(2, 21, 85, 1) 56%
  );
  --gradient-blue-webkit: -webkit-linear-gradient(
    90deg,
    rgba(17, 54, 130, 1) 0%,
    rgba(2, 21, 85, 1) 56%
  );
  --gradient-blue-02: linear-gradient(
    90deg,
    rgba(17, 54, 130, 1) 0%,
    rgba(2, 21, 85, 1) 56%
  );
  --gradient-white-ff: linear-gradient(
    90deg,
    rgba(255, 255, 255, 1) 0%,
    rgba(255, 255, 255, 1) 56%
  );
  --bg-black-screen: rgba(0, 0, 0, 0.5);
}

body {
  font-family: var(--font-body);
  font-size: clamp(0.735rem, 1vw, 1rem);
  color: var(--color-gray-62);
  margin: 0;
  padding: 0;
  line-height: 120%;
  font-weight: 400;
  height: 100vh;
  min-height: -webkit-fit-content;
  min-height: -moz-fit-content;
  min-height: fit-content;
}

main {
  display: grid;
  align-content: baseline;
}

h1,
h2,
h3,
h4,
h5 {
  margin: 0;
  font-weight: 700;
  color: var(--color-black-0d);
  text-align: left;
}

picture {
  width: 100%;
  display: flex;
}

img {
  width: 100%;
  height: auto;
  display: block;
}

p {
  margin: 0 0 1.25rem;
}

mark {
  background: none;
  color: var(--color-text);
}

ul,
ol {
  margin: 0;
  padding: 0;
  list-style: none;
}

a {
  text-decoration: none;
  color: var(--color-blue-97);
  text-decoration: underline;
}

button {
  outline: 0;
  border: 0;
  -moz-appearance: none;
  -webkit-appearance: none;
  appearance: none;
  background: none;
  margin: 0;
  padding: 0;
  font-family: var(--font-body);
  cursor: pointer;
}

fieldset {
  border: 0;
  padding: 0;
  margin: 0;
  width: 100%;
}

input {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  margin: 0;
  padding: 0;
  background: none;
  border: none;
  outline: none;
  font-family: var(--font-body);
  color: var(--color-blue-02);
  pointer-events: initial;
  font-weight: 400 !important;
  /* &:read-only {
    cursor: default;
    pointer-events: none;
  } */
}

input[type=range] {
  /* &:disabled {
    cursor: default;
    pointer-events: none;
  } */
}

select {
  font-family: var(--font-body);
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  margin: 0;
  padding: 0;
  background: none;
  border: none;
  outline: none;
}

table {
  width: 100%;
  border-collapse: collapse;
}

textarea {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  width: 100%;
  padding: 0.625rem 2.5rem 0.625rem 1.25rem;
  box-sizing: border-box;
  min-height: 100px;
  border: 1pt solid var(--color-gray-f1);
  outline: 0;
  font-family: var(--font-body);
  border-radius: 0.625rem;
  color: var(--color-blue-02);
  font-size: clamp(0.735rem, 1vw, 1rem);
}
textarea::placeholder {
  color: var(--color-gray-e1);
  font-size: clamp(0.735rem, 1vw, 1rem);
}

small {
  font-size: clamp(0.5rem, 1vw, 0.75rem);
}

.container {
  width: min(90%, 400px);
  margin: 0 auto;
  transition: width 0.3s ease;
}

.color-blue-02 {
  color: var(--color-blue-02) !important;
}
.color-blue-97 {
  color: var(--color-blue-97) !important;
}
.color-black-0d {
  color: var(--color-black-0d) !important;
}
.color-white-ff {
  color: var(--color-white-ff) !important;
}
.color-red-ed {
  color: var(--color-red-ed) !important;
}

.weight-light {
  font-weight: 300 !important;
}
.weight-book {
  font-weight: 400 !important;
}
.weight-semibold {
  font-weight: 600 !important;
}
.weight-bold {
  font-weight: 700 !important;
}

.align-left {
  text-align: left !important;
}
.align-center {
  text-align: center !important;
}
.align-right {
  text-align: right !important;
}

.display-flex {
  display: flex;
}
.display-grid {
  display: grid;
}
.display-block {
  display: block;
}

.justify-items--start {
  justify-items: flex-start !important;
}
.justify-items--end {
  justify-items: flex-end !important;
}
.justify-content--start {
  justify-content: flex-start !important;
}
.justify-content--spacebetween {
  justify-content: space-between !important;
}
.justify-content--end {
  justify-content: flex-end !important;
}

.text-small {
  font-size: clamp(0.62rem, 1vw, 0.835rem);
}

.btn {
  width: 100%;
  border-radius: 3px;
  box-sizing: border-box;
  display: flex;
  gap: 0.625rem;
  justify-content: center;
  align-items: center;
  cursor: pointer;
  text-transform: uppercase;
  font-weight: 700;
  font-size: clamp(0.75rem, 1vw, 1rem);
  transition: all 0.3s ease;
  position: relative;
  /* &:disabled {
    pointer-events: none;
  } */
}
.btn:after {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}
.btn-filled--blue-02 {
  background: var(--color-blue-02);
  background: var(--gradient-moz-blue-02);
  background: var(--gradient-webkit-blue-02);
  background: var(--gradient-blue-02);
  color: var(--color-white-ff);
  font-weight: 600;
  padding: 0.625rem 1.5rem;
  border-radius: 0.5rem;
}
.btn-filled--blue-02:disabled {
  background: var(--color-gray-e1) !important;
}
.btn-add {
  cursor: pointer;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.625rem;
  padding: 1.25rem;
  border: 1px solid var(--color-gray-79);
  border-radius: 0.313rem;
  transition: all 0.3s ease;
}
.btn-add .icon {
  width: 12px;
  display: flex;
  aspect-ratio: 1/1;
}
.btn-add p {
  color: var(--color-blue-02);
  font-weight: 600;
}
.btn-add:hover {
  background: var(--color-blue-97);
}
.btn-more {
  display: grid;
  gap: 0.25rem;
  cursor: pointer;
}
.btn-more .dot {
  aspect-ratio: 1/1;
  display: block;
  width: 0.313rem;
  background: var(--color-gray-79);
  border-radius: 50%;
  transition: all 0.3s ease;
}
.btn-more:hover .dot {
  background-color: var(--color-blue-02);
}
.btn-outline--black-0d {
  border: 1pt solid var(--color-black-0d);
  border-radius: 0.5rem;
  padding: 0.625rem 1.5rem;
}
.btn-outline--black-0d:disabled {
  color: var(--color-gray-e6);
  border-color: var(--color-gray-e1) !important;
}
.btn-outline--black-0d:disabled .icon {
  opacity: 0.1;
}
.btn-outline--gray-e1 {
  color: var(--color-gray-62);
  border: 1pt solid var(--color-gray-e1);
  border-radius: 0.5rem;
  padding: 0.625rem 1.5rem;
}
.btn-outline--gray-e1:disabled {
  color: var(--color-gray-e6);
  border-color: var(--color-gray-e1) !important;
}
.btn-outline--gray-e1:disabled .icon {
  opacity: 0.1;
}
.btn-share {
  position: relative;
}
.btn-share::after {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  z-index: 1;
}
.btn .icon {
  width: min(30%, 0.625rem);
}

.share {
  display: flex;
  aspect-ratio: 1/1;
  display: flex;
  width: 45px;
  box-sizing: border-box;
  position: relative;
}
.share .btn {
  box-sizing: border-box;
  padding: 0;
}
.share .btn .share-icon {
  width: min(30%, 0.625rem);
  min-width: 1.25rem;
  margin-left: 5px;
}
.share .btn:hover .tooltip {
  opacity: 1;
  z-index: 1;
  transform: translateX(-50%) translateY(0);
  bottom: 110%;
}
.share .submenu {
  position: absolute;
  right: 0;
  opacity: 0;
  top: 101%;
  display: grid;
  grid-template-rows: 0fr;
  padding: 0 1.25rem;
  background: var(--color-white-ff);
  border-radius: 0.625rem;
  width: 260px;
  box-sizing: border-box;
  z-index: 0 !important;
}
.share .submenu .submenu-content {
  overflow: hidden;
}
.share .submenu .submenu-content p {
  text-align: left;
  margin-bottom: 0;
}
.share .submenu .submenu-content .list .list-item {
  width: auto;
}
.share .submenu .submenu-content .list .list-item a {
  width: auto;
  position: relative;
  display: flex;
  gap: 0.625rem;
  cursor: pointer;
  text-decoration: none;
}
.share .submenu .submenu-content .list .list-item a::after {
  content: "";
  position: absolute;
  z-index: 1;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
}
.share .submenu .submenu-content .list .list-item a span {
  transition: all 0.3s ease;
}
.share .submenu .submenu-content .list .list-item a:hover span {
  color: var(--color-blue-97) !important;
  text-decoration: underline;
}
.share .submenu .submenu-content .list .list-item .icon {
  width: 0.938rem;
}
.share.active .submenu {
  grid-template-rows: 1fr;
  opacity: 1;
  z-index: 1;
  border: 1pt solid var(--color-gray-e1);
  padding: 0.625rem 1rem;
  box-shadow: 0 0 10px 0 var(--color-gray-e6);
  z-index: 100 !important;
}
.share.active .submenu .submenu-content {
  overflow: initial;
}
.share.active .submenu .submenu-content p {
  padding: 0 !important;
}
.share .btn:disabled {
  filter: grayscale(1);
  opacity: 0.5;
  pointer-events: none;
}

.link {
  text-decoration: none;
  font-weight: 400;
}
.link--red {
  color: var(--color-red);
  text-align: center;
  display: inline-block;
}
.link--red-line {
  text-decoration: underline !important;
}
.link--icon {
  display: flex;
  align-items: center;
  gap: 0.313rem;
  color: var(--color-red);
}
.link--icon span {
  text-decoration: underline;
}
.link--icon .icon {
  width: min(50%, 0.313rem);
}

.list {
  list-style: none;
  padding: 0;
  margin: 0;
}
.list > .list__element {
  margin: 0 0 1rem;
}
.list > .list__element p {
  margin-bottom: 0;
}
.list--circle .list__element {
  display: flex;
  align-items: flex-start;
  position: relative;
  gap: 0.625rem;
  margin: 0 0 0.625rem;
}
.list--circle .list__element p {
  line-height: 150%;
  margin: 0;
}
.list--circle .list__element::before {
  content: "";
  margin-top: 6px;
  box-shadow: inset 0 0 0 3px var(--color-yellow);
  display: flex;
  aspect-ratio: 1/1;
  border-radius: 50%;
  min-width: 0.625rem;
  width: 0.625rem;
}
.list--circle-purple .list__element::before {
  box-shadow: inset 0 0 0 2px var(--color-red);
}
.list--decimal {
  list-style: decimal;
  padding-left: 30px;
  list-style: none;
  padding-left: 0;
}
.list--decimal-gray .list__element {
  margin: 0 0 0.625rem;
}
.list--decimal-gray .list__element p {
  margin: 0;
  font-weight: 500;
  font-size: calmp(9.835rem, 1vw, 1rem);
}
.list--decimal-blue {
  counter-reset: step-number;
}
.list--decimal-blue .list__element {
  display: flex;
  gap: 0.313rem;
}
.list--decimal-blue .list__element p {
  margin: 0;
  font-weight: 500;
  font-size: calmp(9.835rem, 1vw, 1rem);
}
.list--decimal-blue .list__element::before {
  counter-increment: step-number;
  content: counter(step-number) " ";
  font-weight: 800;
  color: var(--color-blue);
}
.list--decimalCircle {
  padding-left: 30px;
  counter-reset: step-number;
  padding-left: 0;
}
.list--decimalCircle > .list__element {
  display: flex;
  text-align: left;
  gap: 1rem;
  margin: 0 0 1rem;
}
.list--decimalCircle > .list__element::before {
  counter-increment: step-number;
  content: counter(step-number);
  font-weight: 800;
  background: var(--color-blue);
  color: var(--color-white);
  min-width: 1.25rem;
  width: 1.25rem;
  height: 1.25rem;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: clamp(0.65rem, 1vw, 0.835rem);
}
.list--decimalCircle > .list__element p {
  margin: 0;
}
.list--disc .list__element {
  display: flex;
  position: relative;
  gap: 0.625rem;
}
.list--disc .list__element p {
  margin: 0;
  display: inline-block;
  color: var(--color-gray-text);
}
.list--disc .list__element::before {
  content: "";
  display: inline-block;
  border-radius: 50%;
  min-width: 0.5rem;
  width: 0.5rem;
  height: 0.5rem;
  background: var(--color-yellow);
  margin-top: 4px;
}
.list--circle .list__element {
  position: relative;
}
.list--circle .list__element p {
  display: inline-block;
  color: var(--color-text);
  font-weight: 400;
}
.list--circle .list__element::before {
  content: "";
  display: inline-block;
  border-radius: 50%;
  min-width: 0.5rem;
  width: 0.5rem;
  height: 0.5rem;
  box-shadow: inset 0 0 0 1pt var(--color-yellow);
  background: none;
}
.list-steps {
  counter-reset: step-number;
}
.list-steps .list__element {
  margin: 0 auto 4rem;
}
.list-steps .list__element:last-child {
  margin: 0 auto;
}
.list-steps .list__element .element-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  aspect-ratio: 1/1;
  border-radius: 0.625rem;
  width: min(60%, 120px);
  position: relative;
  margin: 0 auto 0.625rem;
  background: var(--bg-gray04);
}
.list-steps .list__element .element-icon::before {
  counter-increment: step-number;
  content: counter(step-number);
  color: var(--color-white);
  font-weight: 800;
  position: absolute;
  top: 0;
  background: var(--color-red);
  display: flex;
  justify-content: center;
  align-items: center;
  aspect-ratio: 1/1;
  border-radius: 50%;
  min-width: 30px;
  width: 30px;
  transform: translateY(-50%);
}
.list-steps .list__element .element-icon picture {
  width: min(40%, 64px);
  aspect-ratio: 1/1;
  display: flex;
}
.list-steps .list__element .element-text {
  text-align: center;
  font-weight: 600;
  color: var(--color-gray);
  font-size: clamp(0.62rem, 1vw, 1rem);
}
.list-steps .list__element .element-text p {
  line-height: 130%;
}
.list-cards {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}
.list-cards .list__element {
  margin: 0 auto;
}
.list--letter {
  counter-reset: step-number;
  position: relative;
}
.list--letter .list__element {
  display: flex;
  gap: 0.625rem;
  margin: 0 0 0.625rem;
}
.list--letter .list__element p {
  margin: 0;
}
.list--letter .list__element::before {
  counter-increment: step-number;
  content: counter(step-number, lower-alpha) ")";
  color: var(--color-blue);
}
.list--letter .list__element:last-child {
  margin-bottom: 0;
}
.list-words {
  padding: 1.25rem 0;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.625rem;
}
.list-words .list-item {
  width: 100%;
  box-sizing: border-box;
}

.form {
  display: grid;
  gap: 1rem;
  width: 100%;
}
.form fieldset {
  display: grid;
  gap: 1rem;
}
.form fieldset.fieldset-check {
  gap: 1.25rem 4rem;
}
.form fieldset.fieldset-1col {
  grid-template-columns: 1fr !important;
}
.form-history {
  gap: 2rem;
}
.form-history .container {
  display: grid;
  gap: 1.25rem;
}
.form-history .container fieldset {
  gap: 1.25rem min(5%, 4rem);
}
.form.new-date fieldset .display-grid {
  gap: 1.25rem;
  grid-template-rows: auto 1fr;
}
.form.new-date fieldset .display-grid > fieldset {
  width: 100% !important;
  grid-template-columns: 1fr;
}
.form.new-date fieldset .display-grid .field-textarea {
  height: 100%;
  display: grid;
  grid-template-rows: auto 1fr;
}
.form.new-date fieldset .display-grid .field-textarea textarea {
  height: 100%;
}
.form-editPres fieldset.group-objetives {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem !important;
}
.form-editPres fieldset.group-objetives .field {
  width: 100%;
}
.form-editPres fieldset.group-objetives .field:nth-child(3) {
  width: calc(50% - 0.5rem);
}
.form-editPres fieldset.group-objetives .field:nth-child(3) label {
  margin-bottom: auto;
}
.form-editPres fieldset.group-objetives .field:nth-child(4) {
  width: calc(50% - 0.5rem);
}
.form-editPres fieldset.group-objetives .field-slider .input-percent::after {
  min-width: 22px;
  right: 25px;
}

.field {
  width: 100%;
  box-sizing: border-box;
}
.field label {
  display: flex;
  align-items: center;
  gap: 0.625rem;
  margin-bottom: 0.313rem;
}
.field label .icon {
  width: min(100%, 22px);
}
.field label .icon:hover {
  color: var(--color-blue-02);
}
.field > .input {
  margin-top: auto;
}
.field-checkbox {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.625rem;
}
.field-checkbox label {
  margin-bottom: 0;
}
.field-edit {
  width: 100%;
  display: grid;
  padding: 0.625rem;
  align-items: center;
  box-sizing: border-box;
  grid-template-columns: auto 1fr;
  border-radius: 0.313rem;
  justify-items: end;
  border: 1pt solid var(--color-gray-f1);
}
.field-edit .display-flex {
  gap: 0.313rem;
  align-items: center;
}
.field-edit .title {
  margin: 0;
  font-size: clamp(0.835rem, 1vw, 1rem) !important;
  white-space: nowrap;
}
.field-edit p {
  width: 100%;
  margin: 0;
  font-size: clamp(0.938rem, 1vw, 1.125rem) !important;
}
.field-edit p .number {
  padding: 0;
  transition: all 0.3s ease;
}
.field-edit p .number[contenteditable] {
  outline: 1pt solid var(--color-blue-02);
  padding: 0 0.625rem;
}
.field-edit .icon {
  display: flex;
  aspect-ratio: 1/1;
  width: 0.835rem;
  color: var(--color-blue-97);
  cursor: pointer;
  transition: all 0.3s ease;
}
.field-text {
  display: flex;
  flex-direction: column;
}
.field-text .input {
  margin-top: auto;
}
.field-text .input:hover {
  color: var(--color-blue-97) !important;
}
.field-select {
  position: relative;
}
.field-select .select {
  width: 100%;
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0.625rem;
  padding: 0.625rem 1.25rem;
  border-radius: 0.625rem;
  box-sizing: border-box;
  margin-top: auto;
  border: 1pt solid var(--color-gray-f1);
  cursor: pointer;
}
.field-select .select.focus {
  border-color: var(--color-blue-97);
  box-shadow: 0 0 5px var(--color-blue-97);
}
.field-select .select::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
}
.field-select .select .icon {
  display: flex;
  align-items: center;
}
.field-select .select .icon-arrow {
  width: 1rem;
  min-width: 1rem;
}
.field-select .select .icon-extra {
  width: 25px;
}
.field-select .select input {
  width: inherit;
  box-sizing: border-box;
  cursor: pointer;
  background: none;
  font-weight: 600;
  color: var(--color-gray-62);
  line-height: 100%;
}
.field-select .select.select-max {
  width: 100%;
}
.field-select .select.select-max input {
  padding: 1.25rem;
}
.field-select .select.open ~ .select-list {
  grid-template-rows: 1fr;
  z-index: 2;
}
.field-select .select.open ~ .select-list .list {
  height: auto;
  max-height: 210px;
  overflow: auto;
  opacity: 1;
  border-color: var(--colo-gray-e1);
  background: var(--color-white-ff);
  box-shadow: 0 0 5px 0 var(--color-gray-e6);
}
.field-select .select-list {
  position: absolute;
  top: 105%;
  left: 0;
  display: grid;
  grid-template-rows: 0fr;
  width: 100%;
  transition: all 0.3s ease;
}
.field-select .select-list .list {
  width: 100%;
  border: 1px solid transparent;
  border-radius: 0.313rem;
  overflow: hidden;
  transition: all 0.3s ease;
  margin: 0 !important;
  max-height: 200px;
}
.field-select .select-list .list .list-option {
  position: relative;
  padding: 0.625rem 0.938rem;
  transition: all 0.3s ease;
  cursor: pointer;
}
.field-select .select-list .list .list-option::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
}
.field-select .select-list .list .list-option:hover {
  background: var(--color-blue-02);
  color: var(--color-blue-97);
}
.field-select.select-filter {
  width: 100%;
}
.field-select.select-filter .select {
  min-height: 100%;
}
.field-slider {
  border-radius: 0.625rem;
  transition: all 0.3s ease;
}
.field-slider .input input[type=text] {
  border-color: var(--color-gray-e1) !important;
  pointer-events: none;
}
.field-slider .input-label {
  display: grid;
  grid-template-columns: 30% auto;
  align-items: center;
  justify-content: space-between;
  gap: 0.625rem;
}
.field-slider .input-label label {
  margin-bottom: 0;
}
.field-slider .input-label input[type=text] {
  width: min(70%, 120px);
  padding: 0.625rem 1.25rem;
  font-size: clamp(0.855rem, 1vw, 1rem);
}
.field-slider .input-label .input-check {
  margin-left: auto;
}
.field-slider .input-slide input[type=range] {
  pointer-events: none;
}
.field-slider .input-slide input[type=range]::-webkit-slider-thumb {
  background: var(--color-gray-e1);
}
.field-slider .input-slide input[type=range]::-moz-range-thumb {
  background: var(--color-gray-e1);
}
.field-radio .inputs-list {
  width: auto;
  display: flex;
  gap: 1.5rem;
}
.field-radio .inputs-list .field {
  width: auto;
}
.field-time {
  display: grid;
}
.field-percent {
  display: grid;
  align-items: center;
}
.field-percent label {
  font-size: clamp(0.75rem, 1vw, 1rem);
}
.field-accordion > .label-expand {
  cursor: pointer;
  border-bottom: 1pt solid var(--color-gray-e6);
  padding: 0.625rem 0;
  position: relative;
}
.field-accordion > .label-expand::after {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  z-index: 1;
  top: 0;
  left: 0;
}
.field-accordion > .wrapper {
  width: 100% !important;
  display: grid;
  grid-template-rows: 0fr;
  transition: all 0.3s ease;
}
.field-accordion > .wrapper > div {
  overflow: hidden;
  opacity: 0;
  padding: 0;
  transition: all 0.3s ease;
}
.field-accordion .expand {
  aspect-ratio: 1/1;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 0.938rem;
  height: 0.938rem;
  position: relative;
  margin-left: auto;
}
.field-accordion .expand::after {
  content: "";
  width: 100%;
  height: 3px;
  background: var(--color-blue-02);
}
.field-accordion .expand::before {
  content: "";
  height: 100%;
  width: 3px;
  position: absolute;
  background: var(--color-blue-02);
  transition: all 0.3s ease;
}
.field-accordion.active .expand::before {
  transform: rotate(90deg);
}
.field-accordion.active > .wrapper {
  grid-template-rows: 1fr;
  padding: 1.25rem 0;
}
.field-accordion.active > .wrapper > div {
  overflow: initial;
  opacity: 1;
}
.field-calendar {
  display: grid;
  /* .litepicker {
    width: 100%;
    height: 100%;
    position: relative;

    .container__main {
      min-height: 100%;

      .container__months {
        width: 100%;
        min-height: 100%;
        max-height: 300px;

        .month-item {
          display: grid;
          width: 100%;

          .month-item-header {
            .month-item-name {
              cursor: pointer;
              font-size: clamp(0.735rem, 1vw, 1rem);
            }

            .month-item-year {
              border: none;
              font-size: clamp(0.735rem, 1vw, 1rem);
            }
          }

          .month-item-weekdays-row {
            width: 100%;

            > div {
              font-size: clamp(0.735rem, 1vw, 1rem);
            }
          }

          .container__days {
            width: 100%;
            display: grid;
            grid-template-columns: repeat(7, 1fr);

            > div {
              margin: 0 auto;
              aspect-ratio: 1/1;
              display: flex;
              align-items: center;
              justify-content: center;
              padding: 0;
              font-weight: 600;
              color: var(--color-blue-02);
              font-size: clamp(0.735rem, 2vw, 1rem);

              &.day-item {
                cursor: pointer;

                &:hover {
                  box-shadow: inset 0 0 0 1px var(--color-blue-02);
                }
              }

              &.is-start-date {
                background: var(--color-blue-97);
                color: var(--color-white-ff);
              }

              &.is-end-date {
                background: var(--color-blue-97);
                color: var(--color-white-ff);
              }

              &.is-locked {
                opacity: 0.2;
                pointer-events: none;
              }

              &.no-available {
                cursor: not-allowed;
                opacity: 0.5;
                border: 1pt solid var(--color-red-ed);
              }
            }
          }
        }
      }
    }

    .container__tootilp {
      position: absolute;
      top: 100%;
    }
  } */
}
.field-calendar .input-date {
  display: flex;
  align-items: center;
  position: relative;
}
.field-calendar .input-date input {
  position: relative;
  width: 100%;
  display: flex;
  gap: 0.313rem;
  box-sizing: border-box;
  padding: 0.625rem 1.25rem;
  border: 1pt solid var(--color-gray-f1);
  border-radius: 0.625rem;
  transition: all 0.3s ease;
  cursor: pointer;
}
.field-calendar .input-date .icon {
  position: absolute;
  width: min(100%, 1.25rem);
  right: 1.25rem;
}
.field-add .input .icon {
  width: 0.938rem;
}
.field-incdec .input {
  display: flex;
}
.field-incdec .input .actions {
  display: flex;
  margin: 0 !important;
  gap: 0 !important;
  border-radius: 0.313rem;
  background: var(--color-white-ff);
  border: 1px solid var(--color-gray-f1);
  z-index: 1;
}
.field-incdec .input .actions .box-icon {
  min-height: 100%;
  display: flex;
  align-items: center;
  cursor: pointer;
  padding: 0 13px;
  box-sizing: border-box;
  pointer-events: initial;
}
.field-incdec .input .actions .box-icon:first-child {
  border-right: 1px solid var(--color-gray-f1);
}
.field-incdec .input .actions .icon {
  aspect-ratio: 1/1;
  width: 8px !important;
  color: var(--color-blue-02);
}
.field-incdec .input input {
  font-size: clamp(0.735rem, 1vw, 0.735rem);
  color: var(--color-blue-02);
  font-weight: 500 !important;
  border: none;
  text-align: right;
  border-radius: 0.313rem;
  background: var(--color-white-ff);
}
.field-incdec.disabled .icon-reload {
  display: initial;
}
.field-incdec.disabled .reload-color {
  display: none;
}
.field-incdec.disabled .input .actions .box-icon {
  cursor: initial;
  pointer-events: none;
}
.field-incdec.disabled .input .actions .box-icon .icon {
  color: var(--color-gray-f1);
}
.field-incdec.disabled .input input {
  pointer-events: none;
  background: var(--color-gray-f1);
}
.field-reload {
  position: relative;
}
.field-reload > .icon-reload {
  width: min(100%, 25px);
  color: var(--color-blue-02);
  display: none;
  cursor: pointer;
}
.field-reload > .icon-reload.reload-color {
  display: initial;
  cursor: pointer;
  pointer-events: initial;
}
.field-reload > .input {
  display: flex;
  align-items: initial;
}
.field-reload > .input .actions {
  display: flex;
  margin: 0 !important;
  gap: 0 !important;
  border-radius: 0.313rem;
  background: var(--color-white-ff);
  border: 1px solid var(--color-gray-f1);
  z-index: 1;
}
.field-reload > .input .actions .box-icon {
  min-height: 100%;
  display: flex;
  align-items: center;
  padding: 0 13px;
  aspect-ratio: 1/1;
  width: min(100%, 2.5rem);
  pointer-events: initial;
  position: relative;
  overflow: hidden;
  cursor: pointer;
}
.field-reload > .input .actions .box-icon::after {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  z-index: 1;
  top: 0;
  left: 0;
  cursor: pointer;
}
.field-reload > .input .actions .icon {
  width: 9px !important;
  aspect-ratio: initial;
  height: auto;
  position: relative;
  margin: 0;
  right: 0;
  left: 0;
  min-width: initial;
  max-width: initial;
  color: var(--color-blue-02);
}
.field-reload > .input input {
  background: var(--color-white-ff);
  border-radius: 0 0.313rem 0.313rem 0 !important;
  font-weight: 500 !important;
  margin-left: -10px;
  font-size: clamp(0.5rem, 1vw, 0.735rem) !important;
  text-align: right;
}
.field-reload .droplist {
  width: 100%;
  position: absolute;
  display: grid;
  grid-template-rows: 0fr;
  z-index: 1;
  width: 100%;
  top: 105%;
  left: 0;
  border: 1px solid transparent;
  transition: all 0.3s ease;
}
.field-reload .droplist .wrapper {
  overflow: hidden;
}
.field-reload .droplist .wrapper .content {
  opacity: 0;
  transition: opacity 0.3s ease;
}
.field-reload .droplist .wrapper .content .list {
  max-height: 157px;
  overflow-y: auto;
}
.field-reload.disabled .icon-reload {
  display: initial;
  pointer-events: none;
}
.field-reload.disabled .icon-reload.reload-color {
  display: none;
}
.field-reload.disabled .input .actions .box-icon {
  pointer-events: none;
  cursor: initial;
}
.field-reload.disabled .input .actions .icon {
  color: #e6e7e8;
}
.field-reload.disabled .input input {
  background: var(--color-gray-f1);
  pointer-events: none;
}
.field-reload.active .droplist {
  border: 1px solid var(--color-gray-f1);
  background: var(--color-white-ff);
  border-radius: 0.313rem;
  grid-template-rows: 1fr;
}
.field-reload.active .droplist .wrapper {
  box-sizing: border-box;
  overflow: initial;
  display: grid;
  padding: 0;
}
.field-reload.active .droplist .wrapper .content {
  opacity: 1;
}
.field-reload.active .droplist .wrapper .field-search {
  padding: 0.625rem 0.625rem 0 !important;
  border: none;
}
.field-reload.active .droplist .wrapper .field-search .input input {
  pointer-events: initial;
}
.field-reload.active .droplist .wrapper .list-options {
  padding: 0.625rem;
}
.field-reload.active .droplist .wrapper .list-options .list-item {
  padding: 0.625rem;
  position: relative;
  cursor: pointer;
}
.field-reload.active .droplist .wrapper .list-options .list-item::after {
  position: absolute;
  content: "";
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  z-index: 1;
}
.field-reload.active .droplist .wrapper .list-options .list-item p {
  color: var(--color-blue-02);
}
.field-reload.active .droplist .wrapper .list-options .list-item:hover {
  background: var(--color-blue-02);
}
.field-reload.active .droplist .wrapper .list-options .list-item:hover p {
  color: var(--color-white-ff);
}
.field-search {
  width: 100%;
  border: 1pt solid var(--color-gray-f1);
  border-radius: 0.313rem;
  padding: 0.313rem;
}
.field-search .input {
  display: grid;
  align-items: center;
  position: relative;
}
.field-search .input .icon {
  width: 0.625rem;
  position: absolute;
  right: 0.625rem;
}
.field-search .input input {
  padding: 0.313rem !important;
  width: 100%;
  height: 100%;
  border-radius: 0 !important;
  background: none !important;
  font-size: 0.835rem;
  color: var(--color-blue-02);
}
.field-code label {
  font-weight: 700;
}
.field-code .list-input {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 0.625rem;
}
.field-code .list-input .input input {
  padding: 0.313rem;
  font-size: clamp(1.5rem, 1vw, 2rem);
  text-align: center;
}
.field-gender {
  position: relative;
  display: grid;
}
.field-gender label {
  justify-content: center;
  width: 100%;
}
.field-gender .gender-options {
  width: 100%;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1.25rem;
}
.field-gender .gender-options .input-option {
  width: 100%;
  position: relative;
  isolation: isolate;
}
.field-gender .gender-options .input-option input[type=radio] {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 1;
  cursor: pointer;
}
.field-gender .gender-options .input-option .box {
  padding: 0.938rem 0.625rem;
  box-sizing: border-box;
  border-radius: 0.625rem;
  border: 1px solid transparent;
  background: transparent;
  background: var(--color-gray-f1);
  width: 100%;
  height: 100%;
  top: 0;
  display: flex;
  align-items: center;
  left: 0;
  z-index: -1;
  transition: all 0.3s ease;
}
.field-gender .gender-options .input-option .box label {
  font-size: clamp(0.938rem, 1vw, 1.125rem);
  transition: all 0.3s ease;
  margin: 0;
  color: var(--color-black-0d);
  font-weight: 700;
}
.field-gender .gender-options .input-option input:checked ~ .box {
  background: var(--color-white-ff);
  border-color: var(--color-blue-97);
  box-shadow: 0 0 5px var(--color-blue-97);
}
.field-gender .gender-options .input-option input:checked ~ .box label {
  color: var(--color-blue-02);
}
.field-objetive label {
  justify-content: center;
}
.field-objetive .options-list {
  display: grid;
}
.field-objetive .options-list.grid {
  grid-template-columns: 1fr 1fr;
  grid-template-rows: repeat(3, 1fr);
  gap: 1.25rem;
}
.field-objetive .options-list .input-option {
  box-sizing: border-box;
  width: 100%;
  aspect-ratio: 400/150px;
  position: relative;
}
.field-objetive .options-list .input-option input[type=radio] {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 1;
  cursor: pointer;
  opacity: 0;
}
.field-objetive .options-list .input-option .box {
  display: grid;
  height: 100%;
  box-sizing: border-box;
  gap: 0.625rem;
  padding: 1.25rem;
  border-radius: 0.625rem;
  background: var(--color-gray-f1);
  border: 1px solid transparent;
  transition: all 0.3s ease;
}
.field-objetive .options-list .input-option .box .icon {
  width: min(80%, 2rem);
  margin: 0 auto;
  transition: all 0.3s ease;
  color: var(--color-blue-97);
}
.field-objetive .options-list .input-option .box .box-title {
  text-align: center;
  font-size: clamp(0.75rem, 1vw, 0.835rem);
  transition: all 0.3s ease;
}
.field-objetive .options-list .input-option input:checked ~ .box {
  background: var(--color-white-ff);
  border-color: var(--color-blue-97);
  box-shadow: 0 0 5px var(--color-blue-97);
}
.field-objetive .options-list .input-option input:checked ~ .box .icon {
  color: var(--color-blue-97);
}
.field-objetive .options-list .input-option input:checked ~ .box .box-title {
  color: var(--color-blue-02);
}
.field-percent {
  justify-content: space-between;
}
.field-percent > label {
  opacity: 0;
}
.field-percent > .input {
  display: grid;
  grid-template-columns: 40% auto;
  align-items: center;
  gap: 0.625rem;
}
.field-percent .input-label > label {
  margin: 0;
}

.field[data-view=false] {
  display: none;
}

.response-list .list {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0.625rem;
}

.input {
  isolation: isolate;
}
.input input[type=text],
.input input[type=email],
.input input[type=number],
.input input[type=password],
.input input[type=tel] {
  width: 100%;
  box-sizing: border-box;
  padding: 0.625rem 1.25rem;
  border: 1pt solid var(--color-gray-f1);
  border-radius: 0.625rem;
  transition: all 0.3s ease;
}
.input input[type=text]:focus,
.input input[type=email]:focus,
.input input[type=number]:focus,
.input input[type=password]:focus,
.input input[type=tel]:focus {
  border-color: var(--color-blue-97);
  box-shadow: 0 0 5px var(--color-blue-97);
}
.input input[type=text]::placeholder,
.input input[type=email]::placeholder,
.input input[type=number]::placeholder,
.input input[type=password]::placeholder,
.input input[type=tel]::placeholder {
  color: var(--color-gray-e1);
}
.input-check {
  position: relative;
  aspect-ratio: 1/1;
  border-radius: 50%;
  width: 1rem;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: center;
}
.input-check input[type=checkbox],
.input-check input[type=radio] {
  opacity: 0;
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
  cursor: pointer;
  pointer-events: initial;
}
.input-check input[type=checkbox]:checked ~ .box,
.input-check input[type=radio]:checked ~ .box {
  box-shadow: inset 0 0 50px var(--color-blue-97);
  border-color: var(--color-blue-97);
}
.input-check .box {
  inset: 0%;
  width: 100%;
  height: 100%;
  position: absolute;
  border-radius: 50%;
  overflow: hidden;
  margin: 0;
  box-sizing: border-box;
  border: 1pt solid var(--color-gray-e1);
  transition: all 0.3s ease;
}
.input-check-red input[type=checkbox]:checked ~ .box {
  box-shadow: inset 0 0 50px var(--color-red-ed);
  border-color: var(--color-red-ed);
}
.input-check-red .box {
  border-color: var(--color-red-ed);
  transition: all 0.3s ease;
}
.input-check.square {
  width: 28px;
}
.input-check.square .box {
  width: 28px;
  height: 28px;
  border-radius: 0.313rem !important;
}
.input-check.round .box {
  border-radius: 50% !important;
  display: flex;
  align-items: center;
  justify-content: center;
}
.input-check.round .box::after {
  content: url(../img/icons/done-w.svg);
  width: 60%;
  margin-top: 4px;
  height: auto;
  display: block;
  z-index: 1;
  pointer-events: none;
}
.input-select {
  display: flex;
  position: relative;
  align-items: center;
}
.input-select label {
  margin-bottom: 0.313rem;
}
.input-select select {
  width: 100%;
  border: 1px solid var(--border-input);
  border-radius: 0.313rem;
  color: var(--color-text);
  padding: 0.313rem 0.688rem;
  font-size: clamp(0.735rem, 1vw, 1rem);
}
.input-select select option {
  background: var(--color-white);
  color: var(-clr-text);
}
.input-select .icon {
  position: absolute;
  width: 0.625rem;
  z-index: -1;
  right: 0.688rem;
}
.input-text {
  position: relative;
  display: flex;
  align-items: center;
  width: 100%;
}
.input-text .icon {
  position: absolute;
  display: flex;
  aspect-ratio: 1/1;
  width: 1.25rem;
  height: 1.25rem;
  right: 1.25rem;
  color: var(--color-gray-f1);
  cursor: pointer;
}
.input-text .icon:hover {
  color: var(--color-blue-97) !important;
}
.input-text.days {
  gap: 0.313rem;
  margin-top: auto;
}
.input-text.days input[type=number] {
  width: min(100%, 120px);
}
.input-text.days .icon-success {
  position: initial !important;
}
.input-textarea {
  position: relative;
  display: flex;
  align-items: center;
  width: 100%;
}
.input-textarea .icon {
  position: absolute;
  display: flex;
  aspect-ratio: 1/1;
  width: 1.25rem;
  height: 1.25rem;
  right: 1.25rem;
  top: 0.625rem;
  color: var(--color-gray-f1);
}
.input-textarea textarea,
.input-textarea input {
  width: 100%;
  min-height: 100px;
  font-size: clamp(0.735rem, 1vw, 1rem);
}
.input-pass {
  position: relative;
  display: flex;
  align-items: center;
  width: 100%;
}
.input-pass .icon {
  cursor: pointer;
  position: absolute;
  display: flex;
  aspect-ratio: 1/1;
  width: 1.25rem;
  height: 1.25rem;
  right: 1.25rem;
  color: var(--color-gray-f1);
  z-index: 1;
  transition: all 0.3s ease;
}
.input-pass .icon:hover {
  color: var(--color-blue-97);
}
.input-pass .icon.active {
  color: var(--color-blue-97);
}
.input-slide {
  width: 100%;
}
.input-slide input[type=range] {
  -webkit-appearance: none;
  appearance: none;
  width: 100%;
  cursor: pointer;
  outline: none;
  border-radius: 15px;
  height: 15px;
  margin-top: 0.625rem;
  background: var(--color-white-ff);
}
.input-slide input[type=range]::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  height: 20px;
  width: 20px;
  background-color: var(--color-blue-02);
  border-radius: 50%;
  border: none;
  transition: 0.2s ease-in-out;
}
.input-slide input[type=range]::-moz-range-thumb {
  height: 20px;
  width: 20px;
  background-color: var(--color-blue-02);
  border-radius: 50%;
  border: none;
  transition: 0.2s ease-in-out;
}
.input-percent {
  width: min(100%, 180px);
  display: grid;
  grid-template-columns: 1.25rem 1fr 1.25rem;
  align-items: center;
  justify-content: end;
  gap: 0.313rem;
  position: relative;
  justify-self: flex-end;
}
.input-percent .value-container {
  display: flex;
  position: relative;
}
.input-percent .value-container .units {
  position: absolute;
  border-left: 1px solid var(--color-gray-f1);
  background: var(--color-white-ff);
  right: 1px;
  top: 1px;
  height: calc(100% - 2px);
  display: flex;
  align-items: center;
  padding: 0 0.938rem;
  box-sizing: border-box;
  border-radius: 0 0.625rem 0.625rem 0;
}
.input-percent input {
  border: 1px solid var(--color-gray-f1);
  border-radius: 0.625rem !important;
  box-sizing: border-box;
  text-align: left;
  pointer-events: initial !important;
  /* &:focus {
    box-shadow: none !important;
    border-color: var(--color-gray-f1) !important;
  } */
}
.input-percent .icon {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  aspect-ratio: 1/1;
  color: var(--color-blue-02);
  cursor: pointer;
  transition: all 0.3s ease;
}
.input-percent .icon .svg {
  width: min(100%, 1.25rem);
}
.input-percent .icon:hover {
  color: var(--color-blue-97);
}
.input-percent .icon.active {
  pointer-events: initial;
}
.input-percent.grams::after {
  content: "g";
}
.input-percent.cal::after {
  display: none;
}
.input-percent.cal .percent-range {
  text-align: center !important;
}
.input-percent.basal::after {
  content: "Basal";
}
.input-percent.diet::after {
  content: "Dieta";
}
.input-measure {
  display: flex;
  align-items: center;
  gap: 0.313rem;
  position: relative;
}
.input-measure input {
  border: 1px solid var(--color-gray-f1);
  border-radius: 0.625rem;
  overflow: hidden;
  justify-self: flex-end;
  padding: 0.625rem 1.25rem;
}
.input-measure span {
  position: absolute;
  right: 1.25rem;
}
.input-measure .icon {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  aspect-ratio: 1/1;
  color: var(--color-blue-02);
  cursor: pointer;
}
.input-measure .icon .svg {
  width: min(100%, 1.25rem);
}
.input-measure .icon:hover {
  background: var(--color-blue-97);
  color: var(--color-white-ff);
}
.input-measure .icon.active {
  pointer-events: initial;
}
.input-measure.grams::after {
  content: "g";
}
.input-measure.cal::after {
  display: none;
}
.input-measure.cal .percent-range {
  text-align: center !important;
}
.input-measure.basal::after {
  content: "Basal";
}
.input-measure.diet::after {
  content: "Dieta";
}
.input-calendar {
  display: grid;
  gap: 1.25rem;
}
.input-days {
  display: flex;
  align-items: center;
  gap: 0.625rem;
}
.input-days input {
  border: 1px solid var(--color-gray-f1);
  border-radius: 0.625rem;
  padding: 0.625rem 1.25rem;
}
.input-days .controls {
  display: grid;
}
.input-days .controls .arrow {
  position: initial;
}
.input-days .controls .arrow.increment {
  transform: rotate(-180deg);
}

@media screen and (min-width: 1340px) {
  .input-percent.diet::after {
    width: 32px;
  }
}
.filter-order {
  width: 100%;
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0.625rem;
  padding: 0.938rem;
  border-radius: 0.625rem;
  box-sizing: border-box;
  border: 1pt solid var(--color-gray-e1);
}
.filter-order p {
  border: none;
  padding: 0;
  border-radius: 0;
  width: inherit;
  box-sizing: border-box;
  cursor: pointer;
  margin: 0;
  background: none;
  font-weight: 600;
  color: var(--color-gray-62);
  font-size: clamp(0.835rem, 1vw, 1rem);
  line-height: 100%;
}
.filter-order .icon-list {
  width: min(100%, 1rem);
  display: flex;
  flex-direction: column;
  gap: 0.313rem;
}
.filter-order .icon-list .icon {
  cursor: pointer;
  width: 100%;
}

.bg-gray-f1 {
  background: var(--color-gray-f1);
}
.bg-blue-02 {
  background: var(--color-blue-02);
}
.bg-blue-97 {
  background: var(--color-blue-97);
}

.mg--tb-40 {
  margin: 2.5rem auto;
}
.mg--lr-40 {
  margin: auto 2.5rem;
}
.mg--tb-60 {
  margin: 3.755rem auto;
}
.mg--lr-60 {
  margin: auto 3.75rem;
}

.divider--icon {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.938rem;
  width: min(80%, 390px);
  margin: 0 auto;
}
.divider--icon .line {
  width: 34px;
  height: 2px;
  margin: 0;
  background: var(--color-red);
  border: 0;
}
.divider--icon .icon {
  width: min(80%, 67px);
}
.divider--red {
  background: var(--color-red);
  height: 2px;
  width: 60px;
  margin: 0;
}
.divider--text {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1.25rem;
  width: 50%;
  margin: 0 auto 2.5rem;
}
.divider--text .title {
  white-space: nowrap;
  margin: 0 !important;
}
.divider--text .divider {
  width: 30px;
  height: 2px;
  margin: 0;
  background: var(--color-red-s);
  border: 0;
}

.uppercase {
  text-transform: uppercase;
}

.lowercase {
  text-transform: initial !important;
}

.title {
  margin: 0;
  line-height: 110%;
  font-size: clamp(1.5rem, 1vw, 2.5rem);
  font-weight: 700;
}
.title-big {
  font-size: clamp(2rem, 2.5vw, 3.4rem);
}

.subtitle {
  margin: 0;
  line-height: 110%;
  font-size: clamp(1.6rem, 1vw, 2.5rem);
}
.subtitle-small {
  font-size: clamp(0.72rem, 1vw, 0.938rem);
  font-weight: 600;
}

.intro {
  font-size: clamp(0.835rem, 1vw, 1.65rem);
}

.footer {
  position: absolute;
  bottom: 0;
}

.showUp {
  animation: showUp 0.3s ease;
  animation-fill-mode: forwards;
}

.hide {
  animation: hide 0.3s ease;
  animation-fill-mode: forwards;
}

.module {
  border-radius: 0.938rem;
  border: 1pt solid var(--color-gray-e1);
  background: var(--color-white-ff);
  box-sizing: border-box;
  display: grid;
}
.module-prescription .module-header {
  padding: 25px 30px;
  display: flex;
  gap: 0.625rem;
  flex-direction: column;
  justify-content: space-between;
  box-sizing: border-box;
}
.module-prescription .module-header .header-title {
  width: 100%;
  display: none;
  flex-direction: column;
  align-items: start;
}
.module-prescription .module-header .header-title p {
  text-align: left;
  margin-bottom: 0;
}
.module-prescription .module-menu {
  padding: 35px 1.25rem;
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  justify-content: center;
  align-items: center;
  gap: 1rem;
  border-top: 1pt solid var(--color-gray-e1);
}
.module-prescription .module-menu .card-menu {
  gap: 0.5rem;
  padding: 0.625rem;
}
.module-prescription .module-menu .card-menu .icon {
  width: min(40%, 60px);
}
.module-prescription .module-menu .card-menu p {
  line-height: 110%;
}
.module-prescription .module-body {
  width: 100%;
  margin: 0 auto;
}
.module-prescription .module-body .tab {
  display: grid;
  grid-template-rows: 0fr;
  transition: all 0.3s ease;
}
.module-prescription .module-body .tab .tab-content {
  overflow: hidden;
  opacity: 0;
}
.module-prescription .module-body .tab .tab-header {
  width: 85%;
  padding: 2rem 0;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
}
.module-prescription .module-body .tab .tab-header .col-left {
  display: flex;
  align-items: center;
  gap: 1.25rem;
}
.module-prescription .module-body .tab .tab-header .col-left p {
  margin: 0;
}
.module-prescription .module-body .tab .tab-header .col-left .actions {
  display: flex;
  align-items: center;
  gap: 0.625rem;
}
.module-prescription .module-body .tab .tab-header .col-left .actions .icon {
  aspect-ratio: 1/1;
  width: 1.25rem;
  height: 1.25rem;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  color: var(--color-blue-02);
  transition: all 0.3s ease;
}
.module-prescription .module-body .tab .tab-header .col-left .actions .icon:hover {
  color: var(--color-blue-97);
}
.module-prescription .module-body .tab .tab-header .col-left .actions .icon.active {
  color: var(--color-blue-97);
}
.module-prescription .module-body .tab .tab-header .col-left .actions .icon img {
  max-height: 100%;
  object-fit: contain;
  object-position: center;
}
.module-prescription .module-body .tab .tab-header .col-right {
  display: flex;
  gap: 0.625rem;
}
.module-prescription .module-body .tab .tab-header .col-right > .btn {
  white-space: nowrap;
}
.module-prescription .module-body .tab .tab-header .col-right > .btn .icon {
  width: 1.25rem;
}
.module-prescription .module-body .tab .tab-body .form .divider {
  outline: none;
  width: 100%;
  height: 1pt;
  background: var(--color-gray-e1);
  border: none;
  margin: 2rem 0 0;
}
.module-prescription .module-body .tab .tab-body .form fieldset {
  width: 85%;
  margin: 0 auto;
  gap: 1rem 3rem;
}
.module-prescription .module-body .tab .tab-body .form fieldset.group-food {
  display: flex;
  flex-direction: column;
  justify-content: center;
  grid-template-columns: auto;
  padding: 52px 0;
}
.module-prescription .module-body .tab .tab-body .form fieldset.group-food .btn {
  width: auto;
  margin: 0 auto;
}
.module-prescription .module-body .tab .tab-body .form fieldset.group-food .groups-list {
  display: flex;
  width: 100%;
  gap: 1.25rem;
  justify-content: center;
  margin: 0 auto;
}
.module-prescription .module-body .tab .tab-body .form fieldset.group-food .groups-list .card {
  width: min(100%, 170px);
}
.module-prescription .module-body .tab .tab-body .form fieldset.group-prescription {
  grid-template-columns: 1fr;
  gap: 1.5rem;
}
.module-prescription .module-body .tab .tab-body .form fieldset.group-prescription .btn {
  width: auto;
}
.module-prescription .module-body .tab .tab-body .form fieldset.group-prescription > .field-accordion .wrapper > div fieldset .field-add {
  width: 100%;
}
.module-prescription .module-body .tab .tab-body .form fieldset .field .input .icon-success,
.module-prescription .module-body .tab .tab-body .form fieldset .field .select .icon-success {
  display: none;
  width: 1.25rem;
}
.module-prescription .module-body .tab .tab-body .form fieldset .field .input.done .icon-arrow,
.module-prescription .module-body .tab .tab-body .form fieldset .field .select.done .icon-arrow {
  display: none;
}
.module-prescription .module-body .tab .tab-body .form fieldset .field .input.done .icon-success,
.module-prescription .module-body .tab .tab-body .form fieldset .field .select.done .icon-success {
  display: flex;
}
.module-prescription .module-body .tab .tab-body .form fieldset .field .select {
  pointer-events: initial;
}
.module-prescription .module-body .tab .tab-body .form fieldset .field .select input {
  pointer-events: initial;
}
.module-prescription .module-body .tab .tab-body .form fieldset .field .select.done {
  pointer-events: none;
}
.module-prescription .module-body .tab .tab-body .form fieldset .field .select.done input {
  pointer-events: none;
}
.module-prescription .module-body .tab .tab-body .form > div {
  padding: 2rem 0;
}
.module-prescription .module-body .tab .tab-body .form .title-field {
  width: 85%;
  margin: 0 auto 1.25rem;
}
.module-prescription .module-body .tab.active {
  border-top: 1pt solid var(--color-gray-e1);
  grid-template-rows: 1fr;
}
.module-prescription .module-body .tab.active .tab-content {
  overflow: initial;
  opacity: 1;
}
.module-prescription .module-body .tab-recipt .tab-content .tab-body {
  padding: 0 0 2rem;
}
.module-prescription .module-body .tab-recipt .tab-content .tab-body .btn {
  width: min(100%, 185px);
  margin-left: auto;
}
.module-prescription .module-body .tab-recipt .tab-content .tab-body .form .fieldset-footer {
  grid-template-columns: 1fr;
  justify-content: flex-end;
}
.module-mydata .module-header {
  padding: 25px 30px;
  display: flex;
  justify-content: space-between;
  border-bottom: 1pt solid var(--color-gray-e1);
}
.module-mydata .module-header .header-title {
  width: auto;
  display: flex;
  align-items: center;
  gap: 0.625rem;
}
.module-mydata .module-header p {
  margin-bottom: 0;
}
.module-mydata .module-body {
  width: 100%;
  margin: 0 auto;
  padding: 25px 30px;
  box-sizing: border-box;
}
.module-bank .module-header {
  padding: 25px 30px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: none;
}
.module-bank .module-header .header-title {
  width: auto;
  display: flex;
  align-items: center;
  gap: 0.625rem;
  margin-bottom: 0;
}
.module-bank .module-header p {
  margin-bottom: 0;
}
.module-bank .module-header .right .icon {
  cursor: pointer;
  width: 1.25rem;
  transition: all 0.3s ease;
}
.module-bank .module-body {
  width: 100%;
  margin: 0 auto;
  box-sizing: border-box;
  display: grid;
  grid-template-rows: 0fr;
  padding: 0 30px;
  transition: all 0.3s ease;
}
.module-bank .module-body .form {
  overflow: hidden;
  opacity: 0;
  transition: all 0.3s ease;
}
.module-bank.active .module-header {
  border-bottom: 1pt solid var(--color-gray-e1);
}
.module-bank.active .module-header .right .icon {
  transform: rotate(180deg);
}
.module-bank.active .module-body {
  grid-template-rows: 1fr;
  padding: 25px 30px;
}
.module-bank.active .module-body .form {
  opacity: 1;
}
.module-orders {
  background: none;
  border: none;
  border-radius: 0;
}
.module-orders .content .table-accordion {
  display: grid;
}
.module-note {
  padding: 1.25rem 30px;
  display: grid;
  gap: 2rem;
}
.module-note .module-header {
  display: flex;
  gap: 0.938rem;
}
.module-note .module-header .icon {
  width: min(100%, 56px);
}
.module-note .module-header h3 {
  line-height: 120%;
}
.module-note .module-body {
  display: grid;
  gap: 0.625rem;
}
.module-note .module-body .field {
  width: 100%;
}
.module-note .module-body .field-textarea .input-textarea textarea {
  min-height: 180px;
}
.module-note .module-body .btn {
  margin-left: auto;
  width: min(100%, 230px);
}
.module-listNotes {
  overflow: hidden;
}
.module-listNotes .table-accordion {
  border: none !important;
}
.module-boards {
  background: var(--color-white-ff);
  border-radius: 0.938rem;
  overflow: hidden;
  margin-bottom: 2rem;
  border: 1pt solid var(--color-gray-e1);
}
.module-boards .module-header {
  padding: 1.5rem 1.25rem;
  border-bottom: 1pt solid var(--color-gray-e1);
}
.module-boards .module-body {
  padding: 1.5rem 1.25rem;
  display: grid;
  grid-template-columns: auto auto;
  gap: 1.25rem;
}
.module-boards .module-body .board {
  border-radius: 0.938rem;
  padding: 0.625rem;
  background: var(--color-blue-97);
  display: grid;
  box-sizing: border-box;
  grid-template-rows: auto 1fr;
}
.module-boards .module-body .board .board-header .title {
  padding: 0.938rem 0.625rem;
  font-weight: 600;
  font-size: clamp(0.75rem, 1vw, 1.125rem);
  color: var(--color-blue-02);
}
.module-boards .module-body .board .board-body {
  background: var(--color-white-ff);
  padding: 0.938rem 1rem;
  border-radius: 0.938rem;
  height: 100%;
  box-sizing: border-box;
}
.module-boards .module-body .board .board-body .body-title {
  font-size: clamp(0.75rem, 1vw, 1.125rem);
  color: var(--color-black-0d);
  /* margin-bottom: 3rem; */
}
.module-boards .module-body .board .board-body .body-info {
  display: flex;
  flex-direction: column;
  gap: 0.938rem;
  justify-content: space-between;
}
.module-boards .module-body .board .board-body .body-info .body-stats {
  display: flex;
  gap: 0.313rem;
}
.module-boards .module-body .board .board-body .body-info .body-stats .number {
  font-size: clamp(1.5rem, 2vw, 2.5rem);
  font-weight: 600;
  color: var(--color-blue-02);
  line-height: initial;
}
.module-boards .module-body .board .board-body .body-info .body-stats .percent {
  display: flex;
  align-items: center;
  gap: 0.313rem;
  color: var(--color-green-9d);
  line-height: initial;
}
.module-boards .module-body .board .board-body .body-info .body-stats .percent .icon {
  aspect-ratio: 1/1;
  display: flex;
  width: 0.625rem;
}
.module-boards .module-body .board .board-body .body-info .body-stats .percent.negative {
  color: var(--color-red-ed);
}
.module-boards .module-body .board .board-body .body-info > .icon {
  width: min(50%, 40px);
}
.module-boards .module-body .board-clients {
  grid-area: 1/1;
}
.module-boards .module-body .board-services {
  grid-area: 1/2;
}
.module-boards .module-body .board-account {
  grid-area: 2/1/2/3;
}
.module-boards .module-body .board-account .board-body .body-info {
  flex-direction: row;
}
.module.pick, .module.signup, .module.log {
  border: none;
  border-radius: 0;
}

.header-measures {
  width: auto;
  justify-content: space-between;
  align-items: baseline;
  display: flex;
  gap: 3rem;
}
.header-measures .measure-list {
  width: 100%;
  display: grid;
  grid-template-columns: 1fr 1fr;
  /* flex-direction: column; */
  gap: 1.5rem;
}
.header-measures .measure-list .measure {
  display: grid;
  grid-template-columns: auto auto;
  justify-content: start;
  align-items: center;
  gap: 0 0.625rem;
  /* &:last-child {
    justify-content: end;
  } */
}
.header-measures .measure-list .measure p {
  white-space: nowrap;
  margin-bottom: 0;
}
.header-measures .measure-list .measure p.measure-title {
  font-weight: 600;
  color: var(--color-blue-02);
  grid-area: 1/2;
}
.header-measures .measure-list .measure p.number {
  font-weight: 300;
  color: var(--color-blue-97);
  grid-area: 2/2;
}
.header-measures .measure-list .measure p span {
  transition: all 0.3s ease;
  box-sizing: border-box;
  display: inline-block;
}
.header-measures .measure-list .measure p span[contenteditable] {
  border: 1pt solid var(--color-blue-02);
  padding: 0.2rem 0.313rem;
}
.header-measures .measure-list .measure p span[contenteditable]:focus {
  outline: none;
}
.header-measures .measure-list .measure .icon {
  width: 30px;
  justify-content: center;
}
.header-measures .measure-list .measure:nth-child(1) .icon img {
  width: 17px;
}
.header-measures .measure-list .measure:nth-child(2) .icon img {
  width: 30px;
}
.header-measures .measure-list .measure:nth-child(3) .icon img {
  width: 23px;
}
.header-measures .icon-edit {
  width: 1.5rem;
  margin-left: auto;
  cursor: pointer;
}

@media screen and (min-width: 414px) {
  .module-prescription .module-header .header-title {
    flex-direction: row;
    gap: 0.625rem;
  }
  .header-measures .measure-list {
    display: grid;
    grid-template-columns: 1fr 1fr;
  }
}
@media screen and (min-width: 714px) {
  .header-measures .measure-list {
    grid-template-columns: 1fr 1fr 1fr auto;
  }
  .header-measures .measure-list .measure > div {
    display: flex;
    gap: 0.313rem;
  }
  .module-prescription .module-menu {
    display: flex;
    flex-direction: row;
  }
  .module-prescription .module-menu .card-menu {
    gap: 1.25rem;
    padding: 1.25rem;
  }
  .module-prescription .module-menu .card-menu p {
    font-size: clamp(0.938rem, 1vw, 1rem);
  }
  .module-prescription .module-body .groups-list {
    min-width: 450px;
  }
  .module-prescription .module-body .tab .tab-body .group-objetives {
    gap: 1rem 4rem !important;
  }
  .module-boards .module-body {
    grid-template-columns: 1fr 1fr 1fr;
  }
  .module-boards .module-body .board {
    display: flex;
    flex-direction: column;
    grid-area: initial !important;
    align-items: inherit;
  }
  .module-boards .module-body .board .board-header {
    height: 35%;
  }
  .module-boards .module-body .board .board-header .title {
    padding: 0.938rem 1rem;
  }
  .module-boards .module-body .board .board-body .body-info {
    flex-direction: column !important;
  }
}
@media screen and (min-width: 1024px) {
  .module-prescription .module-header {
    flex-direction: row;
    align-items: center;
  }
  .module-prescription .module-header .header-title {
    display: flex;
  }
  .module-prescription .module-body .groups-list .card {
    width: min(100%, 220px) !important;
  }
  .module-boards .module-header {
    padding: 1.5rem 2.5rem;
  }
  .module-boards .module-body {
    padding: 1.5rem 2.5rem;
    grid-template-columns: 1fr 1fr 1fr;
  }
  .module-boards .module-body .board .board-header {
    height: auto;
  }
  .module-boards .module-body .board .board-body p {
    margin-bottom: 3rem;
  }
  .module-boards .module-body .board .board-body .body-info {
    flex-direction: row !important;
  }
}
.card-menu {
  background: var(--color-gray-f1);
  border-radius: 0.625rem;
  overflow: hidden;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  gap: 1.25rem;
  aspect-ratio: 1/1;
  padding: 1.25rem;
  width: min(100%, 170px);
  position: relative;
  box-shadow: 0 0 10px 0 transparent;
  transition: all 0.3s ease;
  box-sizing: border-box;
}
.card-menu::after {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  z-index: 1;
  cursor: pointer;
}
.card-menu .icon {
  display: flex;
  aspect-ratio: 1/1;
  width: min(50%, 60px);
}
.card-menu p {
  margin-bottom: 0;
  text-align: center;
  font-size: clamp(0.5rem, 1vw, 1rem);
}
.card-menu:hover {
  background: var(--color-white-ff);
  box-shadow: 0 0 10px 0 var(--color-blue-97);
}
.card-menu.active {
  background: var(--color-white-ff);
  box-shadow: 0 0 10px 0 var(--color-blue-97);
}
.card-group {
  display: flex;
  flex-direction: column;
  align-content: space-between;
  background: var(--color-gray-fa);
  border-radius: 0.625rem;
  gap: 0.313rem;
  overflow: hidden;
  position: relative;
  padding: 0.625rem 1rem;
  box-sizing: border-box;
  justify-content: center;
  align-items: center;
}
.card-group .icon {
  right: 0.625rem;
  top: 0.625rem;
  aspect-ratio: 1/1;
  width: auto;
  height: 1rem;
  margin: 0 auto;
}
.card-group input {
  box-sizing: border-box;
}
.card-group .stat {
  width: 100%;
  font-weight: 700;
  color: var(--color-blue-97);
  text-align: center;
  margin-bottom: 0;
  font-size: clamp(1.35rem, 2vw, 1.5rem);
}
.card-group .stat-percent {
  color: var(--color-blue-02);
  font-size: clamp(0.835rem, 2vw, 1rem) !important;
}
.card-group .group {
  color: var(--color-blue-97);
  font-weight: 700;
  margin: auto 0 0;
  width: 100%;
  text-align: left;
  text-align: center;
  bottom: 0.313rem;
}
.card-group .input-grams {
  width: min(100%, 130px);
  margin: 0 auto;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 0.313rem 0;
}
.card-group .input-grams .input input {
  font-size: clamp(0.855rem, 1vw, 1rem);
}
.card-group .input-grams .input::after {
  right: 0;
}
.card-group .input-grams .stat {
  margin-bottom: 0 !important;
}
.card-group .input-grams .stat[contenteditable] {
  padding: 0.313rem;
}
.card-group .input-grams .badge {
  font-size: clamp(0.85rem, 2vw, 1.5rem);
  font-weight: 600;
}
.card-group .input-content {
  width: min(100%, 130px);
  margin: 0 auto;
  padding: 0.313rem 0;
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
}
.card-group .input-content .input input {
  font-size: clamp(0.855rem, 1vw, 1rem);
}
.card-group .input-content .input::after {
  right: 0;
}
.card-group .input-content input {
  margin-bottom: 0 !important;
}
.card-group .input-content .stat {
  width: fit-content;
  margin-bottom: 0 !important;
}
.card-group .input-content .stat[contenteditable] {
  padding: 0.313rem;
}
.card-group .input-content .badge {
  display: block;
  font-size: clamp(0.835rem, 2vw, 1rem);
  color: var(--color-blue-02);
  font-weight: 600;
}
.card-group:last-child .icon img {
  width: 1.25rem;
}
.card-word {
  border: 1pt solid var(--color-gray-e6);
  border-radius: 0.625rem;
  padding: 0.625rem 1.25rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.625rem;
}
.card-word .word {
  font-size: clamp(0.625rem, 1vw, 0.837rem);
}
.card-word .icon {
  cursor: pointer;
  width: 0.625rem;
  position: relative;
  min-width: 0.625rem;
}

@media screen and (min-width: 714px) {
  .form fieldset {
    display: grid !important;
    grid-template-columns: 1fr 1fr;
  }
  .form fieldset > .field {
    width: 100% !important;
  }
  .response-list .list {
    grid-template-columns: 1fr 1fr;
  }
  .response-list .list .list-item {
    display: grid;
    grid-template-columns: auto 28px;
  }
  .response-list .list .list-item .input-check {
    min-width: 28px;
    margin: 0;
  }
  /* .list {
    &-words {
      grid-template-columns: repeat(3, 1fr);
    }
  } */
}
@media screen and (min-width: 1024px) {
  .container {
    width: min(85%, 650px);
  }
  .list-words {
    grid-template-columns: repeat(4, 1fr);
  }
  .field-add {
    width: calc(50% - 0.313rem);
  }
}
@media screen and (min-width: 1240px) {
  .container {
    width: min(90%, 1024px);
  }
  .form-register {
    max-width: 1460px;
  }
  .form .group-register {
    grid-template-columns: 1fr 1fr 1fr;
  }
  .form-extend fieldset {
    grid-template-columns: 1fr 1fr 1fr;
  }
}
@media screen and (min-width: 1440px) {
  .list-words {
    grid-template-columns: repeat(5, 1fr);
  }
  .field-add {
    width: calc(40% - 0.313rem);
  }
}
@media screen and (min-width: 1920px) {
  .list-words {
    grid-template-columns: repeat(6, 1fr);
  }
  .field-add {
    width: 33%;
  }
}
@keyframes showUp {
  0% {
    opacity: 0;
    margin-top: 4rem;
  }
  100% {
    opacity: 1;
    margin-top: 0rem;
  }
}
@keyframes hide {
  0% {
    opacity: 1;
    margin-bottom: 0rem;
  }
  100% {
    opacity: 0;
    margin-bottom: 4rem;
  }
}
.edit-form {
  position: relative;
}
.edit-form::after {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 1;
}
.edit-form:hover .tooltip {
  opacity: 1;
  z-index: 1;
  transform: translateX(-50%) translateY(0);
  bottom: 110%;
}
.edit-form:hover svg {
  color: var(--color-blue-97) !important;
}
.edit-form.active svg {
  color: var(--color-blue-97) !important;
}

.icon-delete {
  position: relative;
}
.icon-delete::after {
  content: "";
  position: absolute;
  z-index: 1;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
}
.icon-delete:hover .tooltip {
  opacity: 1;
  z-index: 1;
  transform: translateX(-50%) translateY(0);
  bottom: 110%;
}

.nogap {
  gap: 0 !important;
}

.tooltip {
  display: block;
  position: absolute;
  bottom: 0;
  width: auto;
  opacity: 0;
  z-index: -10;
  font-weight: 600;
  background: var(--color-blue-02);
  color: var(--color-white-ff);
  padding: 0.313rem;
  text-align: center;
  border-radius: 0.313rem;
  font-size: 0.75rem;
  transform: translateX(-50%) translateY(50%);
  left: 50%;
  transition: all 0.3s ease-in;
  text-transform: none;
}

@media screen and (min-width: 1440px) {
  .form.new-date fieldset .display-grid > fieldset {
    grid-template-columns: 1fr 1fr;
  }
}
.input-flex {
  flex-direction: row;
  align-items: center;
  display: flex;
  gap: 0.625rem;
}

.macros-table {
  width: 100%;
  margin: auto;
  background: #fff;
  border-radius: 20px;
  overflow-x: auto;
  /* Scroll solo horizontal */
  overflow-y: hidden;
  border: 1px solid var(--color-gray-e6);
}
.macros-table .row {
  display: flex;
  flex-direction: column-reverse;
  align-items: center;
  justify-content: space-between;
  padding: 20px;
}
.macros-table .br0 {
  border-right: 0;
}
.macros-table .macros1 {
  font-weight: 400;
  display: flex;
  gap: 10px;
  font-size: clamp(0.735rem, 1vw, 0.938rem);
}
.macros-table .macros1 span {
  font-weight: 700;
}
.macros-table .macros1 .green {
  color: #97ccad;
}
.macros-table .macros2 {
  display: flex;
  justify-content: flex-end;
}
.macros-table .macros2 button {
  max-height: 30px;
  font-weight: 600;
}
.macros-table .macros2 button svg {
  width: 13px;
  height: 15px;
}
.macros-table .macros2 button .alimentos-icon {
  width: 14px;
}
.macros-table .actions {
  display: flex;
  align-items: center;
  gap: 0.625rem;
  margin-left: 15px;
}
.macros-table .actions .icon {
  aspect-ratio: 1/1;
  width: 1.25rem;
  height: 1.25rem;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  color: #bcbec0;
  transition: all 0.3s ease;
}
.macros-table .actions .icon.active {
  color: var(--color-blue-02);
}
.macros-table .actions .edit-form {
  position: relative;
}
.macros-table .actions .icon-delete {
  position: relative;
}
.macros-table .macros-header {
  text-align: start;
  color: var(--color-blue-02);
  width: 100%;
}
.macros-table table {
  width: 100%;
  border-collapse: collapse;
  text-align: center;
  font-size: clamp(0.735rem, 1vw, 0.938rem);
}
.macros-table table thead th {
  background: #fafbfd;
  padding: 7px;
  font-weight: 700;
  border: 1px solid var(--color-gray-f1);
  width: 18%;
  color: var(--color-blue-02);
  min-width: 265px;
  max-width: 265px;
}
.macros-table table thead th small {
  font-weight: 400;
  margin-left: 5%;
  font-size: clamp(0.735rem, 1vw, 1rem);
  color: var(--color-gray-62);
}
.macros-table table thead .firstTh {
  min-width: 100px;
  width: 10%;
  height: 52.4px;
  box-sizing: border-box;
  position: sticky;
  left: -2px;
}
.macros-table table tbody td {
  padding: 10px;
  border: 1px solid var(--color-gray-f1);
}
.macros-table table tbody td:first-child {
  font-weight: 700;
  color: #113581;
  text-align: left;
  padding-left: 20px;
  background: #fafbfd;
  position: sticky;
  left: -2px;
}
.macros-table table .img-random {
  width: 15px;
  background: white;
  height: 100%;
  border-radius: 0px 3px 3px 0px;
  padding: 0px 10px;
  color: var(--color-gray-e6);
}
.macros-table table .img-random .prev-svg {
  width: 8px;
}
.macros-table table .img-random svg.active {
  color: var(--color-blue-02);
}
.macros-table table .img-random .img-random-on {
  display: none;
}
.macros-table table .input-alimento1 {
  display: flex;
  height: 30px;
}
.macros-table table .input-alimento1 .img-random2 {
  width: 25px;
}
.macros-table .control {
  background: #f5f6f9;
  border-radius: 4px;
  padding: 0px;
  display: inline-flex;
  align-items: center;
  color: #113581;
  font-weight: bold;
  justify-content: space-between;
  width: 100%;
  border: 1px solid var(--color-gray-f1);
  height: 30px;
}
.macros-table .control .mas-menos {
  display: flex;
  height: 100%;
  align-items: center;
}
.macros-table .control .mas-menos span {
  border-right: 1px solid var(--color-gray-f1);
  color: var(--color-gray-f1);
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  border-bottom-left-radius: 3px;
  border-top-left-radius: 12px;
}
.macros-table .control .mas-menos span.active {
  color: var(--color-blue-02);
}
.macros-table .control .number {
  text-align: end;
  padding-right: 9px;
  background: transparent;
  font-weight: 700 !important;
  font-size: clamp(0.735rem, 1vw, 1rem);
}
.macros-table .control span {
  background: #fff;
  width: 50%;
}
.macros-table .firstTH {
  width: 10%;
  min-width: 100px;
  height: 50.8px;
  max-height: 50.8px;
  box-sizing: border-box;
}
.macros-table .BW {
  background: white;
}
.macros-table .bg {
  background: #fafbfd;
}

.scroll-buttons {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  margin-top: 10px;
}
.scroll-buttons .btn {
  width: 70px !important;
}
.scroll-buttons .btn-filled--blue-02:disabled {
  background: white !important;
  color: var(--color-gray-e6);
  border: 1px solid var(--color-gray-e6);
}
.scroll-buttons .btn .icon {
  width: 0.625rem;
  height: 15.7px;
}
.scroll-buttons .btn .icon-right {
  transform: rotate(180deg);
}

.increment-smae .icon {
  width: 10px;
  height: 10px;
}

.decrement-smae .icon {
  width: 10px;
  height: 10px;
}

#actions-smae-mobile-fila1 {
  display: none;
}

#actions-smae-mobile-fila2 {
  display: none;
}

#actions-smae-mobile-fila3 {
  display: none;
}

#actions-smae-mobile-fila4 {
  display: none;
}

#actions-smae-mobile-fila5 {
  display: none;
}

#actions-alimentos-mobile-fila1 {
  display: none;
}

#actions-alimentos-mobile-fila2 {
  display: none;
}

#actions-alimentos-mobile-fila3 {
  display: none;
}

#actions-alimentos-mobile-fila4 {
  display: none;
}

#actions-alimentos-mobile-fila5 {
  display: none;
}

.control1 {
  display: flex;
  align-items: center;
  gap: 40px;
}

.macros2 {
  border-bottom: 1px solid var(--color-gray-e6);
  margin-bottom: 15px;
  padding-bottom: 15px;
  width: 100%;
  justify-content: center;
}

.displayFlex {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 52.4px;
  box-sizing: border-box;
}

.macros-table table tbody td {
  padding: 10px;
  border: 1px solid var(--color-gray-f1);
  position: relative;
}

.alimento-table-container td[data-label]::before {
  margin-bottom: 7px;
}

.macros-table table .input-alimento1 .img-random2 {
  width: 25px;
  height: 31.6px;
  position: absolute;
  right: 4px;
  top: 0;
}

.scroll-buttons {
  display: blockc !important;
}

.macros-table .macros2 {
  justify-content: center;
}

@media screen and (min-width: 1024px) {
  .macros-table .row {
    display: flex;
    align-items: center;
    flex-direction: row;
  }
  .macros-table .row .macros1 {
    width: 100%;
    align-items: center;
  }
  .macros-table .row .macros1 span {
    text-align: center;
  }
  .macros-table .row .macros2 {
    width: 100%;
    border: none;
    padding: 0;
    margin: 0;
  }
  .field-reload {
    max-height: 40px;
  }
  .field-incdec {
    max-height: 40px;
  }
}
#actions-smae .icon {
  pointer-events: none;
  position: relative;
}
#actions-smae .icon::after {
  position: absolute;
  content: "";
  z-index: 100;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  cursor: pointer;
}
#actions-smae .icon svg {
  pointer-events: none;
}
#actions-smae .icon.active {
  pointer-events: initial;
  cursor: pointer;
}
#actions-smae .icon.active svg {
  color: var(--color-blue-02);
}

.action {
  cursor: pointer;
}

.loader {
  position: absolute;
  width: 100%;
  height: 100%;
  z-index: 100;
  background: var(--color-white-ff);
  display: grid;
  opacity: 1;
  align-content: center;
  transition: opacity 0.5s linear;
  animation: hide 1s ease forwards;
  animation-delay: 3s;
}
.loader .logo {
  width: min(40%, 150px);
  margin: 0 auto;
  animation: loader 2s ease-in infinite;
}
.loader p {
  display: flex;
  gap: 0.313rem;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  color: var(--color-blue-97);
  font-weight: 700;
  margin: 0;
  line-height: 100%;
}
.loader p .dots {
  display: flex;
  gap: 0.313rem;
}
.loader p .dot {
  margin-top: 10px;
  border-radius: 20px;
  aspect-ratio: 1/1;
  width: 20px;
  height: 20px;
  background: var(--color-blue-97);
  animation: dots 0.8s ease infinite;
}
.loader p .dot:nth-child(2) {
  animation-delay: 0.1s;
}
.loader p .dot:nth-child(3) {
  animation-delay: 0.2s;
}
.loader p .dot:nth-child(4) {
  animation-delay: 0.3s;
}
.loader p .dot:nth-child(5) {
  animation-delay: 0.4s;
}
.loader p .dot:nth-child(6) {
  animation-delay: 0.5s;
}
.loader.hide {
  opacity: 0;
}

@media screen and (min-width: 1024px) {
  .loader {
    justify-content: start;
  }
  .loader .logo {
    margin: 0 0 0.625rem;
  }
  .loader p {
    align-items: start;
    font-size: 2rem !important;
  }
  .loader p .dots {
    justify-content: start;
  }
}
@keyframes loader {
  0% {
    transform: scale(0.8);
  }
  10% {
    transform: scale(1);
  }
  20% {
    transform: scale(0.8);
  }
  80% {
    transform: scale(0.8);
  }
  90% {
    transform: scale(1);
  }
  100% {
    transform: scale(0.8);
  }
}
@keyframes hideLoader {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
    z-index: -1;
  }
}
@keyframes congrats {
  0% {
    transform: rotate(-15deg);
  }
  50% {
    transform: rotate(15deg);
  }
  100% {
    transform: rotate(0);
  }
}
.card-board {
  width: min(100%, 450px);
  margin: 0;
  display: grid;
  gap: 0.938rem;
  padding: 1.25rem;
  align-items: center;
  box-sizing: border-box;
  border-radius: 0.625rem;
  grid-template-columns: 1fr auto;
  background: var(--gradient-blue-02);
}
.card-board .card-info {
  width: inherit;
  color: var(--color-blue-97);
}
.card-board .card-info .card-title {
  margin: 0 0 0.625rem;
  line-height: 130%;
  font-size: clamp(0.8rem, 1.3vw, 1.05rem);
}
.card-board .card-info .card-params {
  margin-bottom: 0.625rem;
  display: flex;
  gap: 0.2rem;
}
.card-board .card-info .card-params .divider {
  min-height: 100%;
  width: 1px;
  background: var(--color-blue-97);
  border: none;
  margin: 0;
}
.card-board .card-info .card-params .param {
  color: var(--color-white-ff);
  font-weight: 600;
  font-size: clamp(0.62rem, 1vw, 0.938rem);
}
.card-board .card-icon {
  width: 1.5rem;
  margin-left: auto;
}
.card-board .card-icon .icon {
  display: block;
}
.card-food {
  display: grid;
  align-content: baseline;
  justify-content: center;
  gap: 0.625rem;
  border: 1pt solid var(--color-blue-97);
  padding: 0.625rem;
  box-sizing: border-box;
  border-radius: 0.313rem;
  box-shadow: 0 0 5px 0 rgba(235, 235, 235, 0.1);
}
.card-food .card-img {
  width: 40px;
  height: 40px;
  margin: 0 auto;
  border-radius: 50%;
  overflow: hidden;
  aspect-ratio: 1/1;
  background: var(--color-gray-e6);
}
.card-food .card-info {
  margin: 0 auto;
  text-align: center;
  display: grid;
}
.card-food .card-info .name {
  font-weight: 700;
  color: var(--color-blue-02);
}
.card-food .card-info .measure {
  margin-top: auto;
}

.accordion {
  padding: 1.25rem 0;
  color: var(--color-gray-5b);
  display: grid;
  gap: 0.938rem;
}
.accordion .accordion-item {
  margin: 0;
  transition: all 0.3s ease-in;
  border-bottom: 1px solid var(--color-gray-e6);
}
.accordion .accordion-item .item-btn {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 0.938rem 1.25rem;
  position: relative;
  flex-direction: row;
  cursor: pointer;
  background: var(--color-gray-f1);
  border-radius: 0.625rem;
  transition: all 0.3s ease;
  /* &:hover {
    background: var(--color-blue-02);
    p {
      color: var(--color-white-ff);
    }
    .expand {
      .icon {
        color: var(--color-white-ff);
      }
    }
  } */
}
.accordion .accordion-item .item-btn .icon {
  display: flex;
  aspect-ratio: 1/1;
  width: min(40%, 1.25rem);
  color: var(--color-blue-97);
}
.accordion .accordion-item .item-btn p {
  width: 90%;
  margin: 0;
  font-weight: 400;
  font-size: clamp(0.75rem, 1vw, 1.25rem);
  transition: all 0.3s ease;
}
.accordion .accordion-item .item-btn .expand {
  width: 0.938rem;
  display: flex;
  aspect-ratio: 1/1;
  margin-left: auto;
  transition: all 0.3s ease;
}
.accordion .accordion-item .item-btn .expand .icon {
  width: 100%;
  color: var(--color-blue-02);
}
.accordion .accordion-item .item-btn .expand .icon-arrow {
  transform: rotate(180deg);
  transition: all 0.3s ease;
}
.accordion .accordion-item .item-btn .expand .icon-done {
  display: none;
}
.accordion .accordion-item .item-content {
  display: grid;
  grid-template-rows: 0fr;
  padding: 0;
  transition: all 0.3s ease-in;
}
.accordion .accordion-item .item-content > div {
  overflow: hidden;
}
.accordion .accordion-item .item-content > div .list > .list {
  padding-left: 1.25rem;
}
.accordion .accordion-item .item-content > div > p {
  color: #544f62;
  padding: 0 1.25rem;
}
.accordion .accordion-item .item-content > div > p.color-red {
  color: var(--color-red-eb);
}
.accordion .accordion-item .item-content > div .order-list {
  margin: 1.4rem 0;
}
.accordion .accordion-item .item-content > div .order-list > .list-item {
  width: 100%;
  margin-left: -0.625rem;
  display: flex;
  align-items: start;
  gap: 0.625rem;
  padding: 0.625rem;
  border-bottom: 1pt solid var(--color-gray-f1);
}
.accordion .accordion-item .item-content > div .order-list > .list-item:last-child {
  border-bottom: none;
}
.accordion .accordion-item .item-content > div .order-list > .list-item .icon {
  color: var(--color-blue-97);
  display: flex;
  aspect-ratio: 1/1.2;
  width: 1.25rem;
  min-width: 1.25rem;
}
.accordion .accordion-item .item-content > div .order-list > .list-item .item-info .title {
  font-size: clamp(0.75rem, 1vw, 1rem);
  font-weight: 600;
  color: var(--color-black-0d);
  margin-bottom: 0.21rem;
}
.accordion .accordion-item .item-content > div .order-list > .list-item .item-info .list {
  gap: 0.313rem;
}
.accordion .accordion-item .item-content > div .order-list > .list-item .item-info .list .list-item {
  border-bottom: none;
  padding: 0;
}
.accordion .accordion-item .item-content > div .order-list > .list-item .item-info .list .list-item p {
  color: var(--color-blue-02);
  text-align: left;
  font-size: clamp(0.5rem, 1vw, 1rem);
  margin: 0;
}
.accordion .accordion-item .item-content > div .order-list > .list-item .icon-arrow {
  margin-left: auto;
}
.accordion .accordion-item.open .item-btn .expand .icon-arrow {
  transform: rotate(0);
}
.accordion .accordion-item.open .item-content {
  grid-template-rows: 1fr;
  opacity: 1;
  padding: 0.625rem 0;
}
.accordion-macros .accordion-item {
  border-bottom: none;
  position: relative;
}
.accordion-macros .accordion-item .item-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-bottom: 1pt solid var(--color-gray-e6);
  padding: 0.313rem 0;
  position: relative;
  cursor: pointer;
}
.accordion-macros .accordion-item .item-header::after {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  z-index: 1;
}
.accordion-macros .accordion-item .item-header p {
  display: flex;
  gap: 0.625rem;
}
.accordion-macros .accordion-item .item-header .icon {
  width: 1.25rem;
  transition: all 0.3s ease;
}
.accordion-macros .accordion-item .item-body {
  display: grid;
  grid-template-rows: 0fr;
  transition: all 0.3s ease;
}
.accordion-macros .accordion-item .item-body > div {
  overflow: hidden;
  opacity: 0;
  transition: all 0.3s ease;
}
.accordion-macros .accordion-item .item-body > div .list {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.625rem;
}
.accordion-macros .accordion-item.open .item-header .icon-arrow {
  transform: rotate(-180deg);
}
.accordion-macros .accordion-item.open .item-body {
  grid-template-rows: 1fr;
}
.accordion-macros .accordion-item.open .item-body > div {
  opacity: 1;
  padding: 1.25rem 0;
}
.accordion .open[overflow] .item-content > div {
  overflow: initial;
}

.search-bar {
  width: min(100%, 500px);
}
.search-bar .input {
  width: 100%;
  position: relative;
  display: flex;
  gap: 0.625rem;
  align-items: center;
  padding: 0.625rem 0.938rem;
  border-radius: 0.625rem;
  border: 1pt solid var(--color-gray-f1);
  box-sizing: border-box;
}
.search-bar .input input[type=text] {
  border: none;
  padding: 0;
  border-radius: 0;
  font-size: clamp(0.835rem, 1vw, 1rem);
}
.search-bar .input input[type=text]::placeholder {
  color: var(--color-gray-e1);
}
.search-bar .input .icon {
  cursor: pointer;
  width: min(50%, 1.25rem);
  max-height: 1.25rem;
  aspect-ratio: 1/1;
  color: var(--color-black-0d);
  transition: all 0.3s ease;
}
.search-bar .input .icon:hover {
  color: var(--color-blue-97);
}

.filters {
  display: flex;
  flex-direction: column;
  gap: 0.625rem;
}
.filters-notifications .col {
  display: flex;
}
.filters-notifications .col-left {
  gap: 0.625rem;
  flex-direction: column;
}
.filters-notifications .col-right {
  flex-direction: row;
  align-items: center;
  gap: 1.25rem;
}
.filters-notifications .col-right .icon {
  width: 26px;
  cursor: pointer;
  position: relative;
}
.filters-notifications .col-right .icon.notification {
  position: relative;
}
.filters-notifications .col-right .icon.notification::after {
  content: "";
  width: 0.313rem;
  height: 0.313rem;
  background: var(--color-blue-97);
  border-radius: 50%;
  position: absolute;
  top: 7px;
  right: 1px;
  box-shadow: 0 0 0 2px var(--color-white-ff);
}
.filters-notifications .col-right .icon .notifications {
  position: absolute;
  top: 120%;
  right: 0;
  width: 210px;
  background: var(--color-white-ff);
  border-radius: 0.625rem;
  overflow: hidden;
  display: grid;
  opacity: 0;
  grid-template-rows: 0fr;
}
.filters-notifications .col-right .icon .notifications .list {
  overflow: hidden;
}
.filters-notifications .col-right .icon .notifications .list .list-item {
  padding: 0.313rem 0.625rem;
  border-bottom: 1px solid var(--color-gray-fa);
}
.filters-notifications .col-right .icon .notifications .list .list-item:last-child {
  border-bottom: none;
}
.filters-notifications .col-right .icon .notifications .list .list-item p {
  margin-bottom: 0;
}
.filters-notifications .col-right .icon.active .notifications {
  opacity: 1;
  grid-template-rows: 1fr;
  box-shadow: 0 0 5px 0 var(--color-gray-e1);
}
.filters-notifications .col-right .icon.active .notifications .list {
  max-height: 150px;
  overflow-y: auto;
}
.filters-notifications .col-right .btn {
  max-width: 430px;
}
.filters .search-bar {
  width: min(100%, 500px);
}
.filters .divider {
  width: 1pt;
  height: min(100%, 30px);
  min-height: 30px;
  border: none;
  background: var(--color-gray-e1);
  display: none;
}
.filters .filter-order {
  width: 100%;
  box-sizing: border-box;
  padding: 0.625rem 1.25rem !important;
}

.table-accordion {
  width: 100%;
  border: 1pt solid var(--color-gray-e1);
  background: var(--color-white-ff);
  border-radius: 0.625rem;
  box-sizing: border-box;
}
.table-accordion .table-header {
  width: max(100%, 650px);
}
.table-accordion .table-header .row {
  display: flex;
  border-bottom: 1pt solid var(--color-gray-e1);
}
.table-accordion .table-header .row-title > div {
  width: 100%;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  gap: 0.625rem;
  padding: 0.938rem 1.25rem;
}
.table-accordion .table-header .row-title > div .icon {
  width: 24px;
  min-width: 24px;
}
.table-accordion .table-header .row-colheaders {
  display: grid;
  grid-template-columns: min(max(12%, 122px), 169px) 1fr 1fr 1fr min(max(5%, 1rem), 80px);
  background: var(--color-gray-fa);
}
.table-accordion .table-header .row-colheaders p {
  padding: 0.938rem 1.25rem;
  box-sizing: border-box;
  white-space: nowrap;
  width: 100%;
  display: table-cell;
}
.table-accordion .table-header .row-colheaders p:first-child {
  text-align: center;
}
.table-accordion .table-body {
  width: max(100%, 650px);
}
.table-accordion .table-body .row {
  border-bottom: 1pt solid var(--color-gray-e1);
}
.table-accordion .table-body .row .row-info {
  display: grid;
  grid-template-columns: min(max(12%, 122px), 169px) 1fr 1fr 1fr min(max(5%, 1rem), 80px);
  grid-template-rows: auto auto;
  position: relative;
  transition: all 0.3s ease;
}
.table-accordion .table-body .row .row-info::after {
  content: "";
  position: absolute;
  inset: 0;
  top: 0;
  left: 0;
  z-index: 1;
  cursor: pointer;
}
.table-accordion .table-body .row .row-info p {
  width: 100%;
  padding: 0.625rem 1.25rem;
  box-sizing: border-box;
  transition: all 0.3s ease;
}
.table-accordion .table-body .row .row-info p:first-child {
  text-align: center;
}
.table-accordion .table-body .row .row-info p:nth-child(4) {
  color: var(--color-blue-97);
  font-weight: 700;
}
.table-accordion .table-body .row .row-info .icon {
  width: 1rem;
  transition: all 0.3s ease;
}
.table-accordion .table-body .row .row-info:hover {
  background: var(--color-gray-ef);
}
.table-accordion .table-body .row .row-detail {
  display: grid;
  grid-template-rows: 0fr;
  transition: all 0.3s ease;
}
.table-accordion .table-body .row .row-detail .content {
  overflow: hidden;
  display: grid;
  grid-template-columns: min(max(12%, 122px), 169px) 1fr 1fr 1fr min(max(5%, 1rem), 80px);
}
.table-accordion .table-body .row .row-detail .content > div {
  width: 100%;
  box-sizing: border-box;
  padding: 0.938rem 1.25rem;
}
.table-accordion .table-body .row .row-detail .content > div .info-title {
  margin-bottom: 0.13rem;
}
.table-accordion .table-body .row .row-detail .content > div .info {
  color: var(--color-gray-99);
  font-weight: 300;
}
.table-accordion .table-body .row .row-detail .content > div .list-food {
  display: grid;
  grid-template-columns: 1fr 1fr;
}
.table-accordion .table-body .row .row-detail .content > div .list-actions {
  display: flex;
  gap: 0.313rem;
}
.table-accordion .table-body .row .row-detail .content > div .list-actions .list-item:nth-child(1) {
  width: 27px;
}
.table-accordion .table-body .row .row-detail .content > div .list-actions .list-item:nth-child(2) {
  width: 17.7px;
}
.table-accordion .table-body .row .row-detail .content > div .list-actions .icon {
  width: 100%;
  cursor: pointer;
}
.table-accordion .table-body .row .row-detail .content > div.actions {
  display: flex;
  align-items: flex-start;
  gap: 0.313rem;
}
.table-accordion .table-body .row .row-detail .content > div.actions .info-title {
  color: var(--color-blue-02);
  margin-bottom: 0;
}
.table-accordion .table-body .row:last-child .row-info {
  border-bottom: none;
}
.table-accordion .table-body .row.active .row-info {
  background: var(--color-gray-ef);
}
.table-accordion .table-body .row.active .row-info p {
  font-weight: 700;
  color: var(--color-blue-02);
}
.table-accordion .table-body .row.active .row-info .icon-arrow {
  transform: rotate(180deg);
}
.table-accordion .table-body .row.active .row-detail {
  grid-template-rows: 1fr;
}
.table-accordion .table-body .row.active .row-detail .content {
  overflow: initial !important;
}
.table-accordion p {
  margin: 0;
}
.table-accordion.table-history {
  width: max(100%, 750px) !important;
}
.table-accordion.table-history .table-header {
  width: 100%;
}
.table-accordion.table-history .table-header .row p {
  font-weight: 600;
}
.table-accordion.table-history .table-header .row-colheaders {
  border-radius: 0.625rem 0.625rem 0 0;
  grid-template-columns: min(max(12%, 122px), 169px) 15% auto 45px 45px 60px;
}
.table-accordion.table-history .table-header .row-colheaders p:nth-child(3) {
  padding: 0.938rem 0;
}
.table-accordion.table-history .table-header .row-colheaders p:nth-child(4) {
  padding: 0;
}
.table-accordion.table-history .table-body {
  width: 100%;
}
.table-accordion.table-history .table-body .row:last-child {
  border-bottom: none;
}
.table-accordion.table-history .table-body .row .row-info {
  align-items: center;
  grid-template-columns: min(max(12%, 122px), 169px) 15% auto 45px 45px 60px;
}
.table-accordion.table-history .table-body .row .row-info .icon-link {
  cursor: pointer;
}
.table-accordion.table-history .table-body .row .row-info .icon-link img {
  width: min(100%, 1.125rem);
  margin: 0 auto;
}
.table-accordion.table-history .table-body .row .row-info .share {
  padding: 0;
}
.table-accordion.table-history .table-body .row .row-info .share .btn-share {
  background: none;
  border-radius: 0;
}
.table-accordion.table-history .table-body .row .row-info .share .btn-share .share-icon {
  width: min(100%, 0.625rem);
  margin-left: 0;
}
.table-accordion.table-history .table-body .row .row-info .macs .macs-list {
  width: 100%;
  display: flex;
  justify-content: space-between;
  gap: 0.938rem;
}
.table-accordion.table-history .table-body .row .row-info .macs .macs-list .list-item {
  display: flex;
  gap: 0.313rem;
}
.table-accordion.table-history .table-body .row .row-info .macs .macs-list .list-item .mac-title {
  font-weight: 600;
  font-size: clamp(0.5rem, 1vw, 0.75rem);
  color: var(--color-blue-02);
}
.table-accordion.table-history .table-body .row .row-info .macs .macs-list .list-item .param {
  color: var(--color-blue-97);
  font-weight: 600;
  font-size: clamp(0.5rem, 1vw, 0.75rem);
}
.table-accordion.table-history .table-body .row .row-info > .icon {
  padding: 0 1.25rem;
}
.table-accordion.table-history .table-body .row .row-info::after {
  width: 56px;
  left: auto;
  right: 0;
  height: 100%;
  position: absolute;
}
.table-accordion.table-history .table-body .row .row-info::before {
  content: "";
  width: calc(100% - 150px);
  left: 0;
  height: 100%;
  z-index: 1;
  cursor: pointer;
  position: absolute;
}
.table-accordion.table-history .table-body .row .row-detail .content {
  grid-template-columns: 1fr;
}
.table-accordion.table-history .table-body .row .row-detail .content > div {
  padding: 0.938rem 1.25rem 4rem;
}
.table-accordion.table-history .table-body .row .row-detail .content > div .tab-header {
  width: 95.5%;
  padding-top: 0;
}
.table-accordion.table-history .table-body .row .row-detail .content > div .tab-header .btn-share .icon {
  min-width: 0.938rem;
}
.table-accordion.table-history .table-body .row .row-detail .content > div .form {
  width: 95.5%;
  margin: 0 auto;
}
.table-accordion.table-history .table-body .row .row-detail .content > div .form fieldset {
  width: 100%;
}
.table-accordion.table-notes .table-header {
  width: 100%;
}
.table-accordion.table-notes .table-header .row p {
  font-weight: 600;
}
.table-accordion.table-notes .table-header .row-colheaders {
  grid-template-columns: min(max(15%, 150px), 169px) 35% auto 60px;
}
.table-accordion.table-notes .table-body {
  width: 100%;
}
.table-accordion.table-notes .table-body .row::after {
  width: 100%;
  left: auto;
  right: 0;
  height: 100%;
  position: absolute;
}
.table-accordion.table-notes .table-body .row .row-info {
  align-items: center;
  grid-template-columns: min(max(15%, 150px), 169px) 35% auto 60px;
}
.table-accordion.table-notes .table-body .row .row-info .icon-link {
  cursor: pointer;
}
.table-accordion.table-notes .table-body .row .row-info .icon-link img {
  width: min(100%, 1.25rem);
  margin: 0 auto;
}
.table-accordion.table-notes .table-body .row .row-info .share {
  padding: 0;
}
.table-accordion.table-notes .table-body .row .row-info .share .btn-share {
  background: none;
  border-radius: 0;
}
.table-accordion.table-notes .table-body .row .row-info .share .btn-share .share-icon {
  width: min(100%, 0.625rem);
  margin-left: 0;
}
.table-accordion.table-notes .table-body .row .row-detail .content {
  grid-template-columns: 1fr;
  transition: all 0.3s ease;
}
.table-accordion.table-notes .table-body .row .row-detail .content > div {
  padding: 0.938rem 1.25rem 4rem;
}
.table-accordion.table-notes .table-body .row .row-detail .content > div .tab-header {
  width: 95.5%;
  padding-top: 0;
}
.table-accordion.table-notes .table-body .row .row-detail .content > div .tab-header .btn-share .icon {
  min-width: 0.938rem;
}
.table-accordion.table-notes .table-body .row .row-detail .content > div .form {
  width: 95.5%;
  margin: 0 auto;
}
.table-accordion.table-notes .table-body .row .row-detail .content > div .form fieldset {
  width: 100%;
}
.table-accordion.table-notes .table-body .row .row-detail .content > div {
  width: 95.5%;
  margin: 0 auto;
  padding: 0.938rem 0 4rem;
}
.table-accordion.table-responsive {
  width: 100% !important;
  min-width: initial !important;
}
.table-accordion.table-responsive .table-header {
  display: grid;
  grid-template-rows: 0fr;
}
.table-accordion.table-responsive .table-header .row {
  border: none;
  overflow: hidden;
}
.table-accordion.table-responsive .table-body .row .row-info {
  display: flex;
  flex-wrap: wrap;
}
.table-accordion.table-responsive .table-body .row .row-info::before {
  width: 100%;
  height: calc(100% - 46px);
  top: 0;
}
.table-accordion.table-responsive .table-body .row .row-info::after {
  width: 65%;
  height: 100%;
  top: 0;
}
.table-accordion.table-responsive .table-body .row .row-info p {
  width: 50%;
  text-align: left;
}
.table-accordion.table-responsive .table-body .row .row-info p::before {
  content: attr(data-label);
  display: block;
  font-weight: 600;
  margin: 0 0 0.313rem;
}
.table-accordion.table-responsive .table-body .row .row-info .macs {
  width: 100%;
  padding: 0.625rem 1.25rem;
  box-sizing: border-box;
}
.table-accordion.table-responsive .table-body .row .row-info .macs::before {
  content: attr(data-label);
  display: block;
  font-weight: 600;
  margin: 0 0 0.313rem;
}
.table-accordion.table-responsive .table-body .row .row-info .macs .macs-list .list-item {
  flex-direction: column;
  gap: 0;
}
.table-accordion.table-responsive .table-body .row .row-info .icon-link {
  width: 46px;
}
.table-accordion.table-responsive .table-body .row .row-info .share {
  width: 46px;
}
.table-accordion.table-responsive .table-body .row .row-info .share .submenu {
  left: 0;
  right: inherit;
  width: 200px;
  z-index: 10;
}
.table-accordion.table-responsive .table-body .row .row-info .share .submenu .submenu-content p {
  width: 100%;
  padding: 0;
}
.table-accordion.table-responsive .table-body .row .row-info .icon-arrow {
  margin-left: auto;
}
.table-accordion.table-responsive .table-body .row .row-detail .content > div .tab-header {
  width: 100% !important;
}
.table-accordion.table-responsive .table-body .row .row-detail .content > div .tab-header .col {
  justify-content: space-between;
}
.table-accordion.table-responsive .table-body .row .row-detail .content > div .tab-body .form {
  width: 100% !important;
}
.table-accordion.table-responsive .table-body .row .row-detail .content > div .tab-body .form .group-food {
  padding: 1.25rem 0;
}
.table-accordion.table-responsive .table-body .row .row-detail .content > div .tab-body .form .group-food .groups-list {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 0.313rem !important;
}
.table-accordion.table-responsive .table-body .row .row-detail .content > div .tab-body .form .group-food .groups-list .card {
  width: 100%;
  min-height: 90px;
}
.table-accordion.table-responsive .table-body .row .row-detail .content > div .tab-body .form .group-food .groups-list .card .stat {
  border: 1pt solid var(--color-blue-02);
  font-size: clamp(0.85rem, 2vw, 1.5rem);
  transition: all 0.3s ease;
  margin-bottom: 0.313rem;
  font-weight: 600 !important;
}
.table-accordion.table-responsive .table-body .row .row-detail .content > div .tab-body .form .group-food .groups-list .card .stat:read-only {
  padding: 0;
  border: none;
}
.table-accordion.table-responsive .table-body .row .row-detail .content > div .tab-body .form .input-textarea textarea::-webkit-scrollbar {
  width: 0.313rem;
}
.table-accordion.table-responsive .table-body .row .row-detail .content > div .tab-body .form .input-textarea textarea::-webkit-scrollbar-track {
  -webkit-box-shadow: inset 0 0 6px rgba(235, 235, 235, 0.1);
}
.table-accordion.table-responsive .table-body .row .row-detail .content > div .tab-body .form .input-textarea textarea::-webkit-scrollbar-thumb {
  background-color: var(--color-gray-f1);
  border-radius: 20px;
}
.table-accordion.recipts .table-body .new .row-detail .content > div .tab-header .col-left .actions {
  display: none;
}
.table-accordion.recipts .table-body .new .row-detail .content > div .tab-header .col-right {
  display: none;
}

.table-footer {
  width: 100%;
  padding: 2rem 1.25rem;
  box-sizing: border-box;
}
.table-footer .content {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 0.938rem;
  align-items: center;
  position: sticky;
  right: 0;
}
.table-footer .content .pagination {
  width: 100%;
  margin-left: auto;
}
.table-footer .content .pagination p {
  text-align: right;
  white-space: nowrap;
  margin-bottom: 0;
}
.table-footer .content .btn {
  width: min(max(20%, 100px), 155px);
}
.table-footer .content .btn .icon {
  min-width: 0.625rem;
}

.table-dates {
  overflow: hidden;
}
.table-dates thead {
  display: none;
}
.table-dates thead tr {
  background: var(--color-gray-f5);
}
.table-dates thead tr th {
  border-radius: none;
  padding: 0.625rem;
  text-align: left;
}
.table-dates thead tr th:first-child {
  text-align: center;
}
.table-dates tbody tr {
  display: flex;
  flex-wrap: wrap;
  border-bottom: 1pt solid var(--color-gray-e6);
}
.table-dates tbody tr td {
  text-align: left;
  padding: 0.625rem;
  width: 50%;
  box-sizing: border-box;
}
.table-dates tbody tr td::before {
  content: attr(data-label);
  display: block;
  font-weight: 600;
  color: var(--color-blue-02);
}
.table-dates tbody tr td:first-child {
  width: 100%;
  text-align: left;
}
.table-dates tbody tr td:nth-child(2) {
  width: 100%;
}
.table-dates tbody tr td .status::after {
  content: "";
  display: block;
  width: 100%;
}
.table-dates tbody tr td .status.done::after {
  content: "Cita concluida";
  color: var(--color-green-9d);
}
.table-dates tbody tr td .status.cancel::after {
  content: "Cancelada";
  color: var(--color-red-ed);
}
.table-dates tbody tr td .status.next::after {
  content: "Próxima";
  color: var(--color-blue-97);
}
.table-dates tbody tr:last-child {
  border-bottom: none;
}
.table-dates tbody tr:last-child td {
  border-bottom: none;
}

@media screen and (min-width: 414px) {
  .table-accordion.table-responsive .table-body .row .row-detail .content > div .tab-body .form-editPres fieldset.group-food .groups-list {
    grid-template-columns: 1fr 1fr !important;
  }
}
@media screen and (min-width: 714px) {
  .table-dates thead {
    display: table-row-group;
  }
  .table-dates tbody tr {
    display: table-row;
  }
  .table-dates tbody tr:last-child {
    border-bottom: none;
  }
  .table-dates tbody tr td {
    width: auto !important;
  }
  .table-dates tbody tr td::before {
    display: none;
  }
  .table-dates tbody tr td:first-child {
    text-align: center;
  }
}
.tab-diet .diet-menu {
  width: 100%;
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 0.625rem;
}
.tab-diet .diet-menu .menu-option {
  width: 100%;
  text-align: center;
  box-sizing: border-box;
  padding: 0.625rem 0.938rem;
  border: 1px solid var(--color-gray-e6);
  border-radius: 0.625rem;
  cursor: pointer;
  position: relative;
}
.tab-diet .diet-menu .menu-option::after {
  content: "";
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  position: absolute;
  z-index: 1;
}
.tab-diet .diet-menu .menu-option.active {
  border-color: var(--color-blue-97);
  box-shadow: 0 0 5px 0 var(--color-blue-97);
}
.tab-diet .diet-content .content {
  display: grid;
  grid-template-rows: 0fr;
  transition: all 0.3s ease;
}
.tab-diet .diet-content .content > .wrapper {
  overflow: hidden;
  opacity: 0;
  padding: 0 !important;
  transition: all 0.3s ease;
}
.tab-diet .diet-content .content > .wrapper .food-content .title {
  color: var(--color-blue-02);
  font-size: clamp(1.25rem, 1vw, 1.5rem);
}
.tab-diet .diet-content .content > .wrapper .food-content .food-day {
  padding: 1.25rem 0;
  display: grid;
  gap: 1.25rem;
}
.tab-diet .diet-content .content > .wrapper .food-content .food-day .food-step {
  display: grid;
  border: 1pt solid var(--color-gray-e6);
  padding: 1.25rem;
  border-radius: 0.625rem;
}
.tab-diet .diet-content .content > .wrapper .food-content .food-day .food-step .subtitle {
  font-size: clamp(0.835rem, 1vw, 1.125rem);
}
.tab-diet .diet-content .content > .wrapper .food-content .food-day .food-step .divider {
  width: 100%;
  background: var(--color-gray-e6);
  border: none;
  height: 1pt;
  margin: 0;
}
.tab-diet .diet-content .content > .wrapper .food-content .food-day .food-step .step-option {
  display: grid;
  gap: 0.625rem;
  padding: 1.25rem 0;
}
.tab-diet .diet-content .content > .wrapper .food-content .food-day .food-step .step-option:last-child {
  border: none;
  padding-bottom: 0;
}
.tab-diet .diet-content .content > .wrapper .food-content .food-day .food-step .step-option .option-header {
  display: flex;
  align-items: start;
  justify-content: space-between;
  gap: 1.25rem;
}
.tab-diet .diet-content .content > .wrapper .food-content .food-day .food-step .step-option .option-header .option-title {
  line-height: 150%;
}
.tab-diet .diet-content .content > .wrapper .food-content .food-day .food-step .step-option .option-header .icon {
  cursor: pointer;
  width: 1rem;
  position: relative;
}
.tab-diet .diet-content .content > .wrapper .food-content .food-day .food-step .step-option .option-header .icon::after {
  content: "";
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  position: absolute;
  z-index: 1;
}
.tab-diet .diet-content .content > .wrapper .food-content .food-day .food-step .step-option .option-header .icon:hover .tooltip {
  opacity: 1;
  z-index: 1;
  transform: translateX(-50%) translateY(0);
  bottom: 110%;
}
.tab-diet .diet-content .content > .wrapper .food-content .food-day .food-step .step-option .list-ingredients {
  padding-left: 0.625rem;
}
.tab-diet .diet-content .content > .wrapper .food-content .food-day .food-step .step-option .list-ingredients .list-item {
  margin-bottom: 0.625rem;
}
.tab-diet .diet-content .content > .wrapper .food-content .food-day .food-step .step-option .list-ingredients .list-item:last-child {
  margin-bottom: 0;
}
.tab-diet .diet-content .content > .wrapper .food-content .food-day .food-step .step-option span {
  transition: all 0.3s ease;
}
.tab-diet .diet-content .content > .wrapper .food-content .food-day .food-step .step-option span[contenteditable] {
  border-bottom: 1pt solid var(--color-blue-02);
  box-sizing: border-box;
}
.tab-diet .diet-content .content > .wrapper .food-content .food-day .food-step .step-option span[contenteditable]:focus {
  outline: none;
}
.tab-diet .diet-content .content.active {
  grid-template-rows: 1fr;
}
.tab-diet .diet-content .content.active > .wrapper {
  overflow: initial;
  opacity: 1;
  padding: 2rem 0 !important;
}

@media screen and (min-width: 414px) {
  .table-footer {
    padding: 2rem 1.5rem;
  }
  .table-footer .content {
    flex-wrap: nowrap;
  }
  .filters .col-left {
    flex-direction: row;
  }
  .filters .col-left .select-filter {
    width: min(100%, 300px);
  }
  .filters .col-left .filter-order {
    width: min(100%, 155px);
  }
  .filters .col-left .filter-order .icon {
    width: 1rem;
  }
}
@media screen and (min-width: 514px) {
  .table-accordion.table-responsive .table-body .row .row-detail .content > div .tab-header {
    width: 100% !important;
  }
  .table-accordion.table-responsive .table-body .row .row-detail .content > div .tab-header .col {
    justify-content: space-between;
  }
  .table-accordion.table-responsive .table-body .row .row-detail .content > div .tab-body .form {
    width: 100% !important;
  }
  .table-accordion.table-responsive .table-body .row .row-detail .content > div .tab-body .form .group-food {
    padding: 1.25rem 0;
  }
}
@media screen and (min-width: 714px) {
  .table-accordion.table-responsive .table-header {
    grid-template-rows: 1fr;
  }
  .table-accordion.table-responsive .table-header .row {
    grid-template-columns: min(max(12%, 100px), 169px) 15% auto 45px 45px;
  }
  .table-accordion.table-responsive .table-header .row p {
    padding: 0.625rem 0.625rem !important;
  }
  .table-accordion.table-responsive .table-header .row p:nth-child(3) {
    width: 100%;
    padding: 0.625rem 0.313rem !important;
  }
  .table-accordion.table-responsive .table-body .row .row-info {
    display: grid;
    grid-template-columns: min(max(12%, 100px), 169px) 15% auto 45px 45px;
  }
  .table-accordion.table-responsive .table-body .row .row-info::before {
    width: calc(100% - 90px);
    height: 100%;
    top: 0;
  }
  .table-accordion.table-responsive .table-body .row .row-info::after {
    width: 30px;
    height: 100%;
    top: 0;
  }
  .table-accordion.table-responsive .table-body .row .row-info p {
    width: 100%;
    padding: 0.625rem 0.625rem !important;
  }
  .table-accordion.table-responsive .table-body .row .row-info p::before {
    display: none;
  }
  .table-accordion.table-responsive .table-body .row .row-info p.id {
    text-align: center;
  }
  .table-accordion.table-responsive .table-body .row .row-info .macs {
    width: 100%;
    padding: 0.625rem 0.313rem;
  }
  .table-accordion.table-responsive .table-body .row .row-info .macs::before {
    display: none;
  }
  .table-accordion.table-responsive .table-body .row .row-info .macs .macs-list .list-item {
    flex-direction: column;
  }
  .table-accordion.table-responsive .table-body .row .row-info .icon-link {
    width: 100%;
  }
  .table-accordion.table-responsive .table-body .row .row-info .share {
    width: 100%;
  }
  .table-accordion.table-responsive .table-body .row .row-info .share .submenu {
    left: initial;
    right: 0;
    z-index: 10;
  }
  .table-accordion.table-responsive .table-body .row .row-info .share .submenu .submenu-content p {
    padding: 0 !important;
    margin: 0 0 0.313rem;
  }
  .table-accordion.table-responsive .table-body .row .row-info .icon-arrow {
    margin: auto;
    padding: 0;
  }
  .table-accordion.table-responsive .table-body .row .row-detail .content > div .tab-header {
    width: 100% !important;
  }
  .table-accordion.table-responsive .table-body .row .row-detail .content > div .tab-header .col {
    justify-content: space-between;
  }
  .table-accordion.table-responsive .table-body .row .row-detail .content > div .tab-body .form {
    width: 100% !important;
  }
  .table-accordion.table-responsive .table-body .row .row-detail .content > div .tab-body .form .group-food {
    padding: 1.25rem 0;
  }
  .table-accordion.table-responsive .table-body .row .row-detail .content > div .tab-body .form .group-food .groups-list {
    justify-content: center;
    grid-template-columns: 1fr 1fr 1fr 1fr !important;
  }
}
@media screen and (min-width: 1024px) {
  .tab-diet .diet-content .content > .wrapper .food-content .food-day .food-step .list-options {
    display: flex;
    gap: 1.25rem;
    width: 100%;
  }
  .tab-diet .diet-content .content > .wrapper .food-content .food-day .food-step .list-options .divider {
    width: 1pt;
    height: 100%;
  }
  .tab-diet .diet-content .content > .wrapper .food-content .food-day .food-step .list-options .step-option {
    width: 100%;
  }
  .table-accordion.table-responsive .table-header .row p {
    padding: 0.625rem 1.25rem !important;
  }
  .table-accordion.table-responsive .table-header .row p:nth-child(3) {
    width: 100%;
    padding: 0.625rem 0.313rem !important;
  }
  .table-accordion.table-responsive .table-body .row .row-info {
    display: grid;
    grid-template-columns: min(max(12%, 100px), 169px) 15% auto 45px 60px;
  }
  .table-accordion.table-responsive .table-body .row .row-info::before {
    width: calc(100% - 105px);
  }
  .table-accordion.table-responsive .table-body .row .row-info::after {
    width: 60px;
  }
  .table-accordion.table-responsive .table-body .row .row-info p {
    padding: 0.625rem 1.25rem !important;
  }
  .table-accordion.table-responsive .table-body .row .row-info .macs .macs-list .list-item {
    flex-direction: row;
    gap: 0.313rem;
  }
  .table-accordion.table-responsive .table-body .row .row-detail .content > div .tab-header {
    width: 95.5% !important;
  }
  .table-accordion.table-responsive .table-body .row .row-detail .content > div .tab-body .form {
    width: 95.5% !important;
  }
  .table-accordion.table-responsive .table-body .row .row-detail .content > div .tab-body .form .group-food {
    padding: 52px 0;
  }
  .table-accordion.table-responsive .table-body .row .row-detail .content > div .tab-body .form .group-food .groups-list {
    display: flex !important;
    justify-content: center !important;
    grid-template-columns: 1fr 1fr 1fr 1fr !important;
  }
}
.patient-info {
  border-top: 1pt solid var(--color-gray-e1);
  border-bottom: 1pt solid var(--color-gray-e1);
  position: relative;
}
.patient-info .container {
  display: flex;
  flex-direction: column;
  gap: 0.625rem;
  justify-content: space-between;
  align-items: center;
}
.patient-info .container .grid-info {
  width: 100%;
  display: grid;
  gap: 0 0.313rem;
}
.patient-info .container .grid-info .info {
  display: flex;
  align-items: center;
  gap: 0.625rem;
  width: 100%;
  padding: 0.625rem 0;
  box-sizing: border-box;
  transition: all 0.3s ease;
}
.patient-info .container .grid-info .info-section {
  width: 100%;
  position: relative;
  padding: 1rem 0;
  border-right: none !important;
}
.patient-info .container .grid-info .info-section .name {
  color: var(--color-white-ff);
}
.patient-info .container .grid-info .info-section::after {
  content: "";
  position: absolute;
  height: 100%;
  width: 100vh;
  right: 0;
  background: var(--color-blue-97);
  z-index: -1;
}
.patient-info .container .grid-info .info-name {
  width: 100%;
}
.patient-info .container .grid-info .info-name .name {
  color: var(--color-blue-02);
  font-weight: 600;
}
.patient-info .container .grid-info .info .icon {
  width: 25px;
}
.patient-info .container .actions {
  padding: 1rem 0;
  width: 100%;
}
.patient-info .container .actions .btn {
  width: min(max(50%, 120px), 230px);
  margin-left: auto;
}
.patient-info .container .actions .btn .icon {
  width: 0.625rem;
}
.patient-info .container p {
  margin-bottom: 0;
}
.patient-info.col2 .container .grid-info {
  /* grid-template-columns: 1fr 1fr; */
}
.patient-info.col2 .container .grid-info .info-name {
  grid-area: 2/1;
}
.patient-info.col2 .container .grid-info .info-date {
  grid-area: 3/1;
  flex-wrap: wrap;
}
.patient-info.col2 .container .grid-info .info-date p:first-child {
  width: 100%;
}
.patient-info.col2 .container .grid-info .info-state {
  grid-area: 3/2;
  flex-wrap: wrap;
}
.patient-info.col2 .container .grid-info .info-state p:first-child {
  width: 100%;
}

.quest {
  display: grid;
  padding: 0 1.25rem !important;
  grid-template-columns: 1fr;
  gap: 1.5rem;
}
.quest .quest-item > .field > label {
  font-weight: 700;
  margin-bottom: 0.625rem;
  color: var(--color-blue-97);
}
.quest .quest-item > .field-select .select.open ~ .select-list .list {
  padding: 0.313rem;
  box-sizing: border-box;
  border-color: var(--color-gray-f1);
}
.quest .quest-item > .field-select .select-list .list {
  display: grid;
  gap: 0.313rem;
}
.quest .quest-item > .field-select .select-list .list .list-option {
  border-radius: 0.313rem;
  background: var(--color-gray-f1);
  border: 1pt solid transparent;
  box-shadow: 0 0 5px 0 transparent;
  transition: all 0.3s ease;
}
.quest .quest-item > .field-select .select-list .list .list-option:hover {
  border: 1pt solid var(--color-blue-97);
  box-shadow: 0 0 5px 0 var(--color-blue-97);
  background: none;
}
.quest .quest-item > .field .response-list .list .list-item .field {
  display: grid;
  grid-template-columns: auto 28px;
}

@media screen and (min-width: 360px) {
  .patient-info .container .grid-info {
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
  }
  .patient-info .container .grid-info .info {
    width: 100%;
    justify-content: center;
  }
  .patient-info .container .grid-info .info-name {
    width: 100%;
  }
  .patient-info.col2 .container .grid-info .info-date {
    flex-wrap: nowrap;
  }
  .patient-info.col2 .container .grid-info .info-date p:first-child {
    width: auto;
  }
  .patient-info.col2 .container .grid-info .info-state {
    flex-wrap: nowrap;
  }
  .patient-info.col2 .container .grid-info .info-state p:first-child {
    width: auto;
  }
}
@media screen and (min-width: 440px) {
  .filters .col {
    flex-direction: row;
    justify-content: flex-start;
  }
  .filters .divider {
    display: block;
    align-self: center;
    margin: 0;
  }
  .patient-info .container .grid-info {
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
  }
  .patient-info .container .grid-info .info {
    width: 100%;
    justify-content: center;
  }
  .patient-info .container .grid-info .info-name {
    width: 100%;
  }
}
@media screen and (min-width: 714px) {
  /* .quest {
    grid-template-columns: 1fr 1fr;
  } */
  .accordion-macros .accordion-item .item-body > div .list {
    grid-template-columns: 1fr 1fr 1fr 1fr !important;
  }
}
@media screen and (min-width: 1024px) {
  .filters {
    justify-content: space-between;
    align-items: center;
    flex-direction: row;
  }
  .accordion-macros .accordion-item .item-body > div .list {
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr !important;
  }
  .card-board {
    grid-template-columns: 1fr;
    position: relative;
  }
  .card-board .card-info .card-params {
    display: flex;
    flex-direction: column;
  }
  .card-board .card-icon {
    margin-left: 0;
    position: absolute;
    right: 1.25rem;
    bottom: 1.25rem;
  }
}
@media screen and (min-width: 1024px) {
  .patient-info .container {
    flex-direction: row;
    justify-content: space-between;
  }
  .patient-info .container .grid-info {
    width: 100%;
    order: 1;
    display: grid;
    grid-template-columns: auto auto auto auto;
    gap: 0;
  }
  .patient-info .container .grid-info .info {
    width: auto;
    border-right: 1pt solid var(--color-gray-e1);
    padding: 30px 14px;
    justify-content: center;
  }
  .patient-info .container .grid-info .info-name {
    width: auto;
  }
  .patient-info .container .grid-info .info:first-child {
    padding-left: 0px;
  }
  .patient-info .container .grid-info .info:last-child {
    padding-right: 0px;
  }
  .patient-info .container .actions {
    width: min(100%, 230px);
    order: 2;
    margin-left: auto;
  }
  .patient-info .container .actions .btn {
    width: 100%;
  }
  .patient-info.col2 .container .grid-info {
    grid-template-columns: auto auto auto auto;
  }
  .patient-info.col2 .container .grid-info .info-name {
    grid-area: initial;
  }
  .patient-info.col2 .container .grid-info .info-date {
    grid-area: initial;
  }
  .patient-info.col2 .container .grid-info .info-state {
    grid-area: initial;
  }
}
@media screen and (min-width: 1340px) {
  .accordion-macros .accordion-item .item-body > div .list {
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr !important;
  }
  .patient-info .container {
    flex-direction: row;
    justify-content: space-between;
  }
  .patient-info .container .grid-info {
    order: 1;
    width: auto;
  }
  .patient-info .container .grid-info .info {
    padding: 30px 48px;
  }
  .patient-info .container .grid-info .info:last-child {
    padding-right: 48px;
  }
  .patient-info .container .actions {
    order: 2;
  }
}
@media screen and (min-width: 1940px) {
  .accordion-macros .accordion-item .item-body > div .list {
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr !important;
  }
}
@media screen and (min-width: 2440px) {
  .accordion-macros .accordion-item .item-body > div .list {
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr !important;
  }
}
/* Switch  */
.switch {
  display: flex;
  background: white;
  border: 1px solid var(--color-gray-e6);
  width: min(90%, 242px);
  border-radius: 0.313rem;
  padding: 3px;
  position: relative;
  isolation: isolate;
}
.switch::after {
  content: "";
  position: absolute;
  width: 50%;
  height: calc(100% - 6px);
  top: 3px;
  left: 3px;
  padding: 0;
  border-radius: 0.313rem;
  background: var(--gradient-blue-02);
  transition: all 0.3s ease-in;
  z-index: -1;
}
.switch .btn {
  width: 100% !important;
  background: none;
  border: none;
  position: relative;
  font-size: clamp(0.5rem, 1vw, 0.625rem) !important;
  padding: 7px 10px;
}
.switch .btn::after {
  content: "";
  z-index: 1;
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
}
.switch .btn:first-child {
  color: var(--color-white-ff);
}
.switch .btn:last-child {
  color: var(--color-gray-e6);
}
.switch.right::after {
  left: 50%;
}
.switch.right .btn:first-child {
  color: var(--color-gray-e6);
}
.switch.right .btn:last-child {
  color: var(--color-white-ff);
}

.list-arrows {
  margin: 0 auto;
  display: flex;
  gap: 1.25rem;
}
.list-arrows .btn {
  width: min(100%, 70px);
}
.list-arrows .btn img {
  width: 0.5rem;
}

@media screen and (min-width: 1024px) {
  .list-arrows.remove {
    display: none;
  }
}
.actions-col .box-icon {
  cursor: pointer;
  pointer-events: none;
}
.actions-col .box-icon svg {
  pointer-events: none;
}
.actions-col .box-icon.active {
  cursor: pointer;
  pointer-events: initial;
}
.actions-col .box-icon.active svg {
  color: var(--color-blue-02);
}

.breadcrumb {
  display: flex;
  gap: 0.625rem;
  width: min(100%, 400px);
  margin: 0 auto;
}
.breadcrumb .bar {
  width: 100%;
  height: 5px;
  background: var(--color-gray-e1);
  border-radius: 10px;
  position: relative;
  overflow: hidden;
}
.breadcrumb .bar::after {
  content: "";
  width: 0;
  height: 100%;
  left: 0;
  top: 0;
  position: absolute;
  transition: width 0.5s ease;
}
.breadcrumb .bar.current::after {
  width: 100%;
  background: var(--color-gray-99);
}
.breadcrumb .bar.active::after {
  background: var(--color-blue-97);
  width: 100%;
}
.breadcrumb .bar:last-child {
  display: none;
}

.month-item-header {
  display: flex;
  gap: 0.625rem;
}
.month-item-header > div {
  display: flex;
  gap: 0.625rem;
}
.month-item-header > div select {
  width: 100%;
  box-sizing: border-box;
  appearance: auto;
  border: 1px solid var(--color-gray-f1);
  border-radius: 0.313rem;
  padding: 0.313rem !important;
}

/* Barra de navegación */
.header {
  width: 100%;
  height: auto;
  position: sticky;
  background: var(--color-white-ff);
  z-index: 10;
  animation: showPicture 1.5s;
  padding: 1.25rem 0;
  top: 0;
}
.header .container {
  display: flex;
  align-items: center;
  justify-content: space-between;
  box-sizing: border-box;
}
.header .container .logo {
  width: min(70%, 130px);
  cursor: pointer;
}
.header .container .mobile-menu {
  width: min(50%, 1920px);
  margin: 0;
  display: flex;
  gap: 1.25rem;
  align-items: center;
  justify-content: flex-end;
  /* Menu hamburguesa */
}
.header .container .mobile-menu .icon {
  width: 0.735rem;
  margin-left: auto;
  display: block;
  cursor: pointer;
}
.header .container .mobile-menu #toggle {
  display: grid;
  width: 35px;
  height: 20px;
  margin: 0;
  position: relative;
  /* Cuando se activa */
}
.header .container .mobile-menu #toggle::after {
  content: "";
  inset: 0;
  position: absolute;
  z-index: 1;
}
.header .container .mobile-menu #toggle span {
  width: 100%;
  height: 4px;
  margin-left: auto;
  position: relative;
  display: block;
  border-radius: 50px;
  background: var(--color-gray-79);
  transition: all 0.3s ease;
}
.header .container .mobile-menu #toggle:hover span {
  background: var(--color-blue-02);
}
.header .container .mobile-menu #toggle.active + #menu {
  opacity: 1;
  visibility: visible;
}
.header .container .navbar {
  display: grid;
  grid-template-rows: 1fr;
  position: absolute;
  text-align: left;
  width: 0;
  overflow: hidden;
  min-height: 100vh;
  left: 100%;
  top: 0;
  background: var(--bg-gray);
  opacity: 0;
  transition: all 0.3s ease;
}
.header .container .navbar .content {
  width: min(max(70%, 250px), 300px);
  margin: 0 0 0 auto;
  background: var(--color-gray-f1);
  border-left: 4px solid var(--color-blue-97);
}
.header .container .navbar .content .navbar-list {
  overflow: hidden;
  padding: 0;
  background: var(--bg-gray);
  border-top: 1pt solid var(--color-white-ff);
  margin: 0 0 1.25rem;
}
.header .container .navbar .content .navbar-list .list__element {
  padding: 0;
  box-sizing: border-box;
}
.header .container .navbar .content .navbar-list .list__element a {
  width: 100%;
  display: flex;
  text-decoration: none;
  align-items: center;
  gap: 0.938rem;
  font-weight: 400;
  padding: 0.835rem 1.5rem;
  box-sizing: border-box;
  transition: all 0.3s ease;
}
.header .container .navbar .content .navbar-list .list__element a .icon {
  color: var(--color-blue-97);
  display: flex;
  aspect-ratio: 1/1;
  width: 1rem;
  transition: all 0.2s ease;
}
.header .container .navbar .content .navbar-list .list__element a span {
  font-size: 1rem;
  color: var(--color-gray-62);
  transition: all 0.2s ease;
}
.header .container .navbar .content .navbar-list .list__element:hover a {
  background: var(--color-blue-97);
}
.header .container .navbar .content .navbar-list .list__element:hover a .icon {
  color: var(--color-blue-02);
}
.header .container .navbar .content .navbar-list .list__element:hover a span {
  color: var(--color-blue-02);
  font-weight: 700;
}
.header .container .navbar .content .navbar-list .list__element.active a {
  color: var(--clr-red);
}
.header .container .navbar .content .content-header {
  position: relative;
  padding: 3rem 1.5rem 0.938rem;
}
.header .container .navbar .content .content-header .title {
  text-align: right;
  font-size: 1.25rem;
}
.header .container .navbar .content .content-header .subtitle {
  text-align: right;
  font-size: 1.25rem;
}
.header .container .navbar .content .content-header .icon {
  position: absolute;
  width: 1.5rem;
  top: 2rem;
  cursor: pointer;
}
.header .container .navbar.active-menu {
  grid-template-rows: 1fr;
  height: auto;
  opacity: 1;
  width: 100%;
  top: 0;
  left: 0;
  min-height: 100vh;
  z-index: 1;
  background: rgba(0, 0, 0, 0.5);
}

.modal {
  position: fixed;
  overflow: auto;
  display: none;
  inset: 0;
  min-height: min-content;
  background: var(--bg-black-screen);
  padding: 2rem 1rem;
  z-index: 10;
  align-items: center;
  opacity: 0;
}
.modal .modal-content {
  background: var(--color-white-ff);
  position: relative;
  min-height: auto;
  max-height: min-content;
  margin: 0 auto;
  display: none;
  padding: 2rem;
  isolation: isolate;
  box-sizing: border-box;
  border-radius: 0.938rem;
}
.modal .modal-content .close-icon {
  position: absolute;
  top: 0.938rem;
  right: 0.938rem;
  width: 1.25rem;
  cursor: pointer;
}
.modal .modal-content.recover {
  width: min(95%, 520px);
}
.modal .modal-content.recover .content .title {
  font-size: clamp(1.8rem, 1vw, 2.25rem);
  margin: 0;
  text-align: left;
  width: 100%;
}
.modal .modal-content.recover .content p {
  margin: 0 0 1.25rem;
}
.modal .modal-content.add-cc, .modal .modal-content.edit-cc {
  width: min(90%, 450px);
}
.modal .modal-content.add-cc .content-header .title, .modal .modal-content.edit-cc .content-header .title {
  text-align: center;
  color: var(--color-blue-02);
  font-size: clamp(1.2rem, 1vw, 1.5rem);
}
.modal .modal-content.add-cc .content-body .form, .modal .modal-content.edit-cc .content-body .form {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}
.modal .modal-content.add-cc .content-body .form .field, .modal .modal-content.edit-cc .content-body .form .field {
  width: 100%;
}
.modal .modal-content.add-cc .content-body .form .field input, .modal .modal-content.edit-cc .content-body .form .field input {
  width: 100%;
  box-sizing: border-box;
  padding: 0.625rem;
  border: 1pt solid var(--color-gray-e1);
  border-radius: 0.313rem;
}
.modal .modal-content.add-cc .content-body .form.vigency.hide, .modal .modal-content.edit-cc .content-body .form.vigency.hide {
  display: none;
}
.modal .modal-content.add-cc .content-body .form.list-radio.hide, .modal .modal-content.edit-cc .content-body .form.list-radio.hide {
  display: none;
}
.modal .modal-content.add-cc .content-body .form .field.hide, .modal .modal-content.edit-cc .content-body .form .field.hide {
  display: none;
}
.modal .modal-content.add-cc .template-content, .modal .modal-content.edit-cc .template-content {
  display: grid;
  grid-template-rows: 0fr;
  transition: all 0.3s ease;
  margin: 0;
}
.modal .modal-content.add-cc .template-content .template, .modal .modal-content.edit-cc .template-content .template {
  overflow: hidden;
}
.modal .modal-content.add-cc .template-content.show, .modal .modal-content.edit-cc .template-content.show {
  grid-template-rows: 1fr;
  margin: 1.25rem 0;
}
.modal .modal-content.add-cc .more-images, .modal .modal-content.edit-cc .more-images {
  display: none;
}
.modal .modal-content.add-cc .more-images.show, .modal .modal-content.edit-cc .more-images.show {
  display: flex;
}
.modal .modal-content.add-cc .files-multiple,
.modal .modal-content.add-cc .video-files, .modal .modal-content.edit-cc .files-multiple,
.modal .modal-content.edit-cc .video-files {
  display: none;
}
.modal .modal-content.add-cc .files-multiple.show,
.modal .modal-content.add-cc .video-files.show, .modal .modal-content.edit-cc .files-multiple.show,
.modal .modal-content.edit-cc .video-files.show {
  display: block;
}
.modal .modal-content.delete-cc, .modal .modal-content.deleteCoupon-cc, .modal .modal-content.deleteGoal-cc {
  width: min(90%, 450px);
}
.modal .modal-content.delete-cc .content-header, .modal .modal-content.deleteCoupon-cc .content-header, .modal .modal-content.deleteGoal-cc .content-header {
  align-items: center;
}
.modal .modal-content.delete-cc .content-header .title, .modal .modal-content.deleteCoupon-cc .content-header .title, .modal .modal-content.deleteGoal-cc .content-header .title {
  text-align: center;
  font-size: clamp(1.2rem, 1vw, 1.5rem);
}
.modal .modal-content.delete-cc .content-body p, .modal .modal-content.deleteCoupon-cc .content-body p, .modal .modal-content.deleteGoal-cc .content-body p {
  font-size: clamp(0.75rem, 1vw, 0.938rem);
  text-align: center;
  margin: 0 auto 1.25rem;
}
.modal .modal-content.delete-cc .content-body p br, .modal .modal-content.deleteCoupon-cc .content-body p br, .modal .modal-content.deleteGoal-cc .content-body p br {
  display: none;
}
.modal .modal-content.delete-cc.all, .modal .modal-content.deleteCoupon-cc.all, .modal .modal-content.deleteGoal-cc.all {
  width: min(90%, 520px);
}
.modal .modal-content.saved-cc {
  width: min(80%, 890px);
}
.modal .modal-content.saved-cc .content-header {
  align-items: center;
}
.modal .modal-content.saved-cc .content-header .title {
  text-align: center;
  font-size: clamp(1.2rem, 1vw, 1.5rem);
}
.modal .modal-content.saved-cc .content-body p {
  font-size: clamp(0.75rem, 1vw, 0.938rem);
  text-align: center;
  margin: 0 auto 1.25rem;
}
.modal .modal-content.saved-cc .content-body p br {
  display: none;
}
.modal .modal-content.saved-cc.all {
  width: min(90%, 520px);
}
.modal .modal-content .content {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}
.modal .modal-content .content-header {
  display: flex;
  flex-direction: column;
  gap: 2.5rem;
}
.modal .modal-content .content-header .icon {
  width: min(80%, 3.75rem);
}
.modal .modal-content .content-header .title {
  text-align: left;
}
.modal .modal-content .content-body .subtitle {
  text-align: center;
  font-size: clamp(1rem, 1vw, 1.3rem);
  margin: 0 auto 1.25rem;
}
.modal .modal-content .content-body .form {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}
.modal .modal-content .content-body .form .ck-content {
  min-height: 150px;
}
.modal .modal-content .content-body .form .field--file .input {
  margin-bottom: 0.313rem;
}
.modal .modal-content .content-body .form .field--file > p {
  margin-bottom: 0.313rem;
}
.modal .modal-content .content-body .body-actions {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1.25rem;
  margin: 0 0 1.25rem;
}
.modal .modal-content .content-body .body-actions .btn {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
}
.modal .modal-content .content-body .wrapper {
  width: 100%;
  padding-bottom: 1.25rem;
  max-height: 314px;
}
.modal .modal-content .content-footer .footer-actions {
  display: flex;
  flex-direction: column;
  gap: 0.313rem;
}
.modal .modal-content .content-footer .footer-actions .btn {
  width: 100%;
}
.modal .modal-content.macros-cc .content-body .form fieldset {
  grid-template-columns: 1fr !important;
}
.modal .modal-content.macros-cc .content-body .form fieldset .field {
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
}
.modal .modal-content.macros-cc .content-body .form fieldset .field label {
  margin-bottom: 0;
  font-size: clamp(0.735rem, 1vw, 1rem);
}
.modal .modal-content.macros-cc .content-body .form fieldset .field .input {
  width: 80px;
}
.modal .modal-content.macros-cc .content-body .form fieldset .field .input input {
  padding: 0.5rem 0.625rem;
  font-size: clamp(0.735rem, 1vw, 1rem);
}
.modal .modal-content.macros-cc .content-body .form fieldset .field .input input::placeholder {
  font-size: clamp(0.735rem, 1vw, 1rem);
}
.modal .modal-content.macros-cc .content-body .form fieldset .field .input::after {
  right: 0;
}
.modal .modal-content.macros-cc .content-body .form fieldset .field-select {
  flex-direction: column;
  justify-content: start;
  align-items: start;
  gap: 0.313rem;
}
.modal .modal-content.macros-cc .content-body .form fieldset .field-select .select input {
  font-size: clamp(0.735rem, 1vw, 1rem);
}
.modal .modal-content.macros-cc .content-body .form fieldset .field-select .select-list .list-option span {
  font-size: clamp(0.735rem, 1vw, 1rem);
}
.modal .modal-content.macros-cc .content-footer {
  display: grid;
}
.modal .modal-content.macros-cc .content-footer .btn {
  box-sizing: border-box;
  width: 100% !important;
}
.modal .modal-content[open] {
  display: block;
}

.modal[open] {
  display: grid;
  height: 100%;
  transition: all 1s ease;
}

.animation-showUp {
  opacity: 1;
  animation: showUp 0.5s ease;
}
.animation-hideUp {
  opacity: 1;
  animation: hideUp 0.5s ease;
  animation-fill-mode: forwards;
}

@keyframes showUp {
  from {
    transform: translateY(-4rem);
  }
  to {
    transform: translate(0);
  }
}
@keyframes hideUp {
  from {
    opacity: 1;
    transform: translate(0);
  }
  to {
    opacity: 0;
    transform: translateY(-4rem);
  }
}
@media screen and (min-width: 514px) {
  .main .hero .container .subtitle-cc br {
    display: none;
  }
  .main .hero .container .hero-actions {
    width: 100%;
    flex-direction: row;
    gap: 1.25rem;
  }
  .main-dashboard .adminFilter .container .moduleGrid .row {
    width: min(100%, 450px);
    grid-template-columns: 1fr 1fr;
    justify-items: center;
    align-items: center;
    margin: 0 auto 1.25rem;
  }
  .main-dashboard .adminFilter .container .moduleGrid .row .module {
    width: 100%;
  }
  .modal .modal-content {
    padding: 2.5rem;
  }
  .modal .modal-content.add-cc .content-body .form .row, .modal .modal-content.edit-cc .content-body .form .row {
    flex-direction: row;
  }
  .modal .modal-content.recover .content .form .form-actions {
    flex-direction: row;
    gap: 1.25rem;
  }
  .modal .modal-content.recover .content .form .form-actions .btn {
    width: 100%;
  }
  .modal .modal-content.delete-cc .content-body p br {
    display: initial;
  }
  .modal .modal-content.advance-rc .content-body .list-advance .list__element .element-content .table-content .row-filter .filters-inputs {
    flex-direction: row;
  }
  .modal .modal-content.advance-rc .content-body .list-advance .list__element .element-content .table-content .row-pag .showResults {
    flex-direction: row;
  }
  .modal .modal-content.edit-usr, .modal .modal-content.add-usr {
    width: min(90%, 600px);
  }
  .modal .modal-content.edit-usr .content-body .form .permits .list--permits, .modal .modal-content.add-usr .content-body .form .permits .list--permits {
    justify-content: space-between;
    grid-template-columns: 1fr 1fr;
    gap: 0.625rem1 0.25rem;
  }
  .modal .modal-content.addGoal-cc .content-body .form, .modal .modal-content.editGoal-cc .content-body .form {
    flex-direction: row;
  }
  .modal .modal-content.addGoal-cc .content-body .form .field, .modal .modal-content.editGoal-cc .content-body .form .field {
    width: 100%;
  }
  .modal .modal-content.bonus-rc .content-body .info-bonus {
    grid-template-columns: 1fr 1fr;
  }
  .modal .modal-content .content-body .body-actions {
    flex-direction: row;
    justify-content: flex-end;
  }
  .modal .modal-content .content-footer .footer-actions {
    flex-direction: row;
    justify-content: center;
    gap: 1.25rem;
  }
  .modal .modal-content .content-footer .footer-actions .btn {
    width: min(100%, 250px);
  }
  .modal .modal-content.macros-cc .content-footer .footer-actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
  }
}
@media screen and (min-width: 714px) {
  .home .menu .list-menu {
    justify-content: start;
    grid-template-columns: auto auto auto;
  }
  .home .menu .list-menu .card {
    margin: 0 !important;
  }
  .home .bg-menu picture {
    width: min(90%, 750px);
  }
  .main-dashboard .adminFilter .container {
    width: min(90%, 1320px);
  }
  .main-dashboard .adminFilter .container .list--filter .form {
    grid-template-columns: 1fr 1fr;
  }
  .main-dashboard .adminFilter .container .list--filter .form .field {
    width: min(100%, 350px);
    margin: 0 auto;
  }
  .modal .modal-content.addGoal-cc .content-body .form .field, .modal .modal-content.editGoal-cc .content-body .form .field {
    width: 100%;
    display: flex;
    align-items: center;
    gap: 0.625rem;
  }
  .modal .modal-content.addGoal-cc .content-body .form .field label, .modal .modal-content.editGoal-cc .content-body .form .field label {
    margin: 0;
    text-wrap: nowrap;
  }
  .modal .modal-content.addGoal-cc .content-body .form .field .input, .modal .modal-content.editGoal-cc .content-body .form .field .input {
    width: inherit;
  }
  .modal .modal-content.addCoupon-cc, .modal .modal-content.editCoupon-cc {
    width: min(90%, 700px);
  }
  .modal .modal-content.addCoupon-cc .content-body .form, .modal .modal-content.editCoupon-cc .content-body .form {
    display: grid;
    grid-template-columns: 1fr 1fr;
  }
}
@media screen and (min-width: 768px) {
  .main .uploads .container .list {
    flex-direction: row;
    width: min(100%, 680px);
    margin: 2.5rem auto 2.5rem;
    gap: 0.524rem;
  }
  .main .uploads .container .list .list__element {
    width: min(100%, 400px);
  }
  .main .uploads .container .list .list__element .element-text {
    text-wrap: nowrap;
  }
  .main .records .container .records-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.25rem;
  }
  .main .records .container .records-header .field {
    margin: 0;
  }
  .main .records .container .records-header .header-actions {
    display: flex;
    gap: 1.25rem;
  }
  .main .records .container .records-header .header-actions .btn {
    margin: 0;
  }
  .main .records .container .records-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.25rem;
  }
  .main .records .container .records-footer .showResults {
    margin: 0;
    flex-direction: row;
  }
  .main .records .container .records-footer .pagination {
    margin: 0;
  }
  .main-admin-users .records-header .header-actions .btn {
    white-space: nowrap;
  }
  .modal .modal-content.edit-cc .content .content-body .form .permits .list--permits {
    overflow: auto;
    max-height: 100px;
    flex-wrap: wrap;
    flex-direction: initial;
  }
  .modal .modal-content.edit-cc .content .content-body .form .permits .list--permits .list__element {
    width: calc(50% - 0.3125rem);
  }
}
@media screen and (min-width: 914px) {
  .modal .modal-content.advance-rc {
    width: min(80%, 910px);
  }
  .modal .modal-content.advance-rc .content-body .list-advance .list__element .element-content .table-content .row-filter {
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
  }
  .modal .modal-content.advance-rc .content-body .list-advance .list__element .element-content .table-content .row-filter .filters-inputs {
    width: 100%;
  }
  .modal .modal-content.advance-rc .content-body .list-advance .list__element .element-content .table-content .row-filter .filters-inputs .field {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    margin: 0;
  }
  .modal .modal-content.advance-rc .content-body .list-advance .list__element .element-content .table-content .row-filter .filters-inputs .field label {
    text-align: left;
    margin: 0;
  }
  .modal .modal-content.advance-rc .content-body .list-advance .list__element .element-content .table-content .row-filter .filters-inputs .field .input {
    width: min(80%, 170px);
  }
  .modal .modal-content.advance-rc .content-body .list-advance .list__element .element-content .table-content .row-filter .btn {
    margin: 0 !important;
  }
  .modal .modal-content.advance-rc .content-body .list-advance .list__element .element-content .table-content .row-pag {
    flex-direction: row;
    justify-content: space-between;
    gap: 1.25rem;
    border-top: none;
  }
  .modal .modal-content.advance-rc .content-body .list-advance .list__element .element-content .table-content .row-pag .showResults {
    width: auto;
    margin: 0 !important;
  }
  .modal .modal-content.advance-rc .content-body .list-advance .list__element .element-content .table-content .row-pag .pagination {
    width: auto;
  }
  .modal .modal-content.advance-rc .content-footer .footer-actions .btn {
    width: 100%;
  }
  .modal .modal-content.edit-cc {
    width: min(100%, 600px);
    transition: all 0.2s ease;
  }
  .modal .modal-content.edit-cc .content > .content-body {
    display: flex;
    gap: 1.25rem;
  }
  .modal .modal-content.edit-cc .content > .content-body .form {
    width: 100%;
  }
  .modal .modal-content.edit-cc .content > .content-body .template-content {
    margin: 0;
    grid-template-rows: 1fr;
    grid-template-columns: 0fr;
  }
  .modal .modal-content.edit-cc .content > .content-body .template-content .template {
    position: sticky;
    top: 2rem;
  }
  .modal .modal-content.edit-cc .content > .content-body .template-content.show {
    grid-template-columns: 1fr;
    width: 100%;
    align-items: baseline;
  }
  .modal .modal-content.edit-cc.bigger {
    width: min(100%, 1200px);
  }
  .modal .modal-content .content-body .body-actions {
    flex-direction: row;
    justify-content: flex-end;
  }
  .modal .modal-content .content-footer .footer-actions {
    flex-direction: row;
    justify-content: center;
    gap: 1.25rem;
  }
  .modal .modal-content .content-footer .footer-actions .btn {
    width: min(100%, 250px);
  }
}
.login .create {
  padding: 2rem 0;
}
.login .create .container .col .title {
  text-align: center;
  color: var(--color-blue-02);
  font-weight: 700;
  margin: 0 auto;
  font-size: clamp(1.3rem, 2vw, 2rem);
}
.login .create .container .col .subtitle {
  font-size: clamp(1.25rem, 1vw, 1.5rem);
}
.login .create .container .col > p,
.login .create .container .col a {
  margin: 0;
  font-size: clamp(0.835rem, 1vw, 1.125rem);
  text-align: center;
}
.login .create .container .col .desc {
  margin-top: 0.625rem;
  line-height: 120%;
}
.login .create .container .col .form {
  margin: 2rem 0;
}
.login .create .container .col .form fieldset {
  gap: 0.313rem;
}
.login .create .container .col .form fieldset label {
  font-size: clamp(0.835rem, 1vw, 1.125rem);
}
.login .create .container .col .form fieldset .small {
  font-size: clamp(0.735rem, 1vw, 1rem);
  text-align: left;
}
.login .create .container .col .logs {
  display: grid;
  grid-template-rows: 1fr auto 1fr;
  gap: 0.625rem;
  margin: 2rem auto;
}
.login .create .container .col .logs .btn .icon {
  width: 1.25rem;
}
.login .create .container .col .logs .divider {
  display: flex;
  gap: 0.625rem;
}
.login .create .container .col .logs .divider hr {
  opacity: 0.3;
  width: 100%;
  height: 1px;
  border: none;
  background: var(--color-black-0d);
}
.login .create .container .col .logs .divider span {
  font-weight: 600;
  color: var(--color-black-0d);
}
.login .validate .container .title {
  text-align: center;
  color: var(--color-blue-02);
  font-weight: 700;
  margin: 0 auto 0.625rem;
  font-size: clamp(1.3rem, 2vw, 2rem);
}
.login .validate .container p {
  text-align: center;
}
.login .validate .container p.phone {
  font-weight: 700;
  font-size: clamp(0.938rem, 1vw, 1.125rem);
}
.login .validate .container .form fieldset .field {
  margin: 2rem 0;
}
.login .validate .container .form fieldset .field label {
  justify-content: center;
}
.login .validate .container .alert {
  margin: 1rem 0;
}
.login .profile .container {
  padding-bottom: 3rem;
}
.login .profile .container .breadcrumb {
  margin: 0 auto 1.25rem;
}
.login .profile .container .title {
  text-align: center;
  color: var(--color-blue-02);
  font-weight: 700;
  margin: 0 auto 0.625rem;
  font-size: clamp(1.3rem, 2vw, 2rem);
}
.login .profile .container p {
  text-align: center;
  font-size: clamp(0.835rem, 1vw, 1.125rem);
}
.login .profile .container .form {
  position: relative;
  opacity: 0;
  transition: all 0.3s ease;
}
.login .profile .container .form label {
  font-size: clamp(0.8rem, 1vw, 1.125rem);
}
.login .profile .container .form .field-gender {
  margin-bottom: 1.25rem;
}
.login .profile .container .form .field-gender > label {
  justify-content: start;
}
.login .profile .container .form.show {
  opacity: 1;
}
.login .profile .container .form .icon-success {
  width: min(100%, 80px);
  margin: 0 auto 0.625rem;
  animation: congrats 0.5s ease;
  animation-delay: 3.5s;
}
.login .profile .container .form .row {
  display: grid;
  gap: 1.25rem;
}
.login .profile .container .form[data-step="4"] .title,
.login .profile .container .form[data-step="5"] .title {
  font-size: clamp(2rem, 1vw, 2.5rem);
}
.login .profile .container .form[data-step="4"] .title br,
.login .profile .container .form[data-step="5"] .title br {
  display: none;
}
.login .profile .container .form[data-step="4"] p,
.login .profile .container .form[data-step="5"] p {
  font-size: clamp(1.25rem, 1vw, 1.75rem);
  line-height: 130%;
}
.login .profile .container .form[data-step="3"] .field-gender {
  margin-bottom: 0;
}
.login .profile .container .form[data-step="3"] .field-gender .gender-options {
  gap: 1.25rem;
  grid-template-columns: 1fr;
}
.login .profile .container .form[data-step="3"] .field-days .oculto {
  opacity: 0;
}
.login .profile .container .form[data-step="3"] .field-days .grid {
  display: grid;
  grid-template-columns: 40% auto;
  align-items: center;
  gap: 1.25rem;
}
.login .profile .container .form[data-step="3"] .field-days .grid .input {
  width: min(100%, 180px);
  justify-self: end;
  box-sizing: border-box;
}
.login .profile .container .form[data-step="3"] .field-days .grid > label {
  margin: 0;
}
.login .profile .container .form[data-step="3"] .field.membresi {
  margin-top: 1.25rem;
}
.login .profile .container .form[data-step="3"] .field.membresi .select-list {
  width: calc(33.3333333333% - 0.938rem);
  right: 0;
  margin: 0 0 0 auto;
}
.login .profile .container .form[data-step="3"] .row {
  display: grid;
  gap: 1.25rem;
  grid-template-columns: 1fr 1fr;
}
.login .profile .container .form[data-step="3"] .row.row-code {
  grid-template-columns: 1fr;
}
.login .profile .container .form[data-step="3"] .row:last-child {
  grid-template-columns: 1fr;
}
.login .profile .container .form[data-view=false] {
  display: none;
}
.login .profile .container .form[data-view=true] {
  display: grid;
}
.login section[data-view=false] {
  display: none;
}
.login section[data-view=true] {
  display: initial;
  opacity: 0;
}
.login .section.show {
  opacity: 1;
}

@media screen and (min-width: 714px) {
  .login .form fieldset {
    display: grid;
    grid-template-columns: 1fr;
  }
}
.animation-hideLeft {
  animation: hideLeft 0.5s ease;
  animation-fill-mode: forwards;
}
.animation-hideRight {
  animation: hideRight 0.5s ease;
  animation-fill-mode: forwards;
}
.animation-showLeft {
  animation: showLeft 0.5s ease;
  animation-fill-mode: forwards;
}
.animation-showRight {
  animation: showRight 0.5s ease;
  animation-fill-mode: forwards;
}

@keyframes dots {
  0% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(10px);
  }
  100% {
    transform: translateY(0);
  }
}
@keyframes hideLeft {
  0% {
    margin-left: 0;
    opacity: 1;
  }
  100% {
    opacity: 0;
    margin-left: -3rem;
  }
}
@keyframes hideRight {
  0% {
    margin-left: 0;
    opacity: 1;
  }
  100% {
    opacity: 0;
    margin-left: 3rem;
  }
}
@keyframes showLeft {
  0% {
    margin-left: 3rem;
    opacity: 0;
  }
  100% {
    margin-left: 0;
    opacity: 1;
  }
}
@keyframes showRight {
  0% {
    margin-left: -3rem;
    opacity: 0;
  }
  100% {
    margin-left: 0;
    opacity: 1;
  }
}
@media screen and (min-width: 1024px) {
  .login {
    align-items: center;
  }
  .login .create .container {
    width: min(80%, 650px);
    display: flex;
    gap: 2rem;
  }
  .login .create .container .col:first-child {
    width: 40%;
  }
  .login .create .container .col:first-child .title {
    text-align: left;
  }
  .login .create .container .col:first-child .subtitle {
    text-align: left;
  }
  .login .create .container .col:first-child p {
    text-align: left;
  }
  .login .create .container .col:last-child {
    width: 60%;
  }
  .login .create .container .col:last-child .form {
    margin-top: 0;
  }
  .login .validate .container {
    display: flex;
    gap: 2rem;
  }
  .login .validate .container .col:first-child {
    width: 40%;
  }
  .login .validate .container .col:first-child .title {
    text-align: left;
  }
  .login .validate .container .col:first-child p {
    text-align: left;
  }
  .login .validate .container .col:last-child {
    width: 60%;
  }
  .login .validate .container .col:last-child .field-code {
    margin-top: 0;
  }
  .login .profile .container .breadcrumb {
    margin: 0 auto 1.25rem;
  }
  .login .profile .container .title {
    width: 100%;
    text-align: left;
  }
  .login .profile .container .form p {
    text-align: left;
  }
  .login .profile .container .form fieldset {
    grid-template-columns: 1fr 1fr 1fr;
    gap: 1.25rem;
  }
  .login .profile .container .form fieldset .field-gender {
    display: grid;
    gap: 1.25rem;
    grid-template-columns: repeat(3, 1fr);
    grid-area: 1/span 3;
  }
  .login .profile .container .form fieldset .field-gender > label {
    justify-content: left;
  }
  .login .profile .container .form fieldset .field-gender .gender-options {
    grid-area: span 2;
    grid-template-columns: 1fr 1fr;
    gap: 1.25rem;
    grid-area: auto/span 2;
  }
  .login .profile .container .form fieldset .field-objetive {
    grid-area: 2/span 3;
    margin-bottom: 1.25rem;
  }
  .login .profile .container .form fieldset .field-objetive > label {
    justify-content: left;
  }
  .login .profile .container .form fieldset .field-objetive .options-list {
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: repeat(2, 1fr);
    gap: 1.25rem;
    /* .input-option {
      &:nth-child(4),
      &:nth-child(5) {
        transform: translateX(calc(50% + 0.625rem));
        transform: translateX(calc(50% + 0.625rem));
      }
    } */
  }
  .login .profile .container .form fieldset .row {
    grid-area: auto/span 3;
    grid-template-columns: repeat(3, 1fr);
  }
  .login .profile .container .form .icon-success {
    margin: 0 0 0.625rem;
  }
  .login .profile .container .form:nth-child(4) .title br, .login .profile .container .form:nth-child(5) .title br {
    display: initial;
  }
  .login .profile .container .form .row.reverse .btn:first-child {
    order: 2;
  }
  .login .profile .container .form .row.reverse .btn:last-child {
    order: 1;
  }
  .login .profile .container .form[data-step="3"] > p {
    width: 100%;
    text-align: left;
    margin: 0 auto;
  }
  .login .profile .container .form[data-step="3"] fieldset {
    margin: 0 auto;
  }
  .login .profile .container .form[data-step="3"] fieldset .row {
    grid-template-columns: 1fr 1fr 1fr;
    grid-area: auto/span 3;
  }
  .login .profile .container .form[data-step="3"] fieldset .row.row-code .membresi {
    gap: 1.25rem;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
  }
  .login .profile .container .form[data-step="3"] fieldset .row.row-code .membresi label {
    grid-area: auto/span 2;
    margin: 0;
  }
  .login .profile .container .form[data-step="3"] fieldset .row.row-code .code {
    margin-top: 1.25rem;
    display: grid;
    align-items: center;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.25rem;
  }
  .login .profile .container .form[data-step="3"] fieldset .row.row-code .code label {
    grid-area: auto/span 2;
    margin: 0;
  }
  .login .profile .container .form[data-step="3"] fieldset .row.row-code .code[data-view=false] {
    display: none !important;
  }
  .login .profile .container .form[data-step="3"] fieldset .row:last-child {
    grid-template-columns: repeat(3, 1fr);
  }
  .login .profile .container .form[data-step="3"] fieldset .field-gender {
    grid-template-columns: 1fr;
    grid-area: 2/span 3;
    gap: 0;
  }
  .login .profile .container .form[data-step="3"] fieldset .field-gender .gender-options {
    grid-template-columns: repeat(3, 1fr);
  }
  .login .profile .container .form[data-step="3"] fieldset .field-gender .gender-options .input-option {
    transform: none;
  }
  .login .profile .container .form[data-step="3"] fieldset .field-percent {
    grid-area: auto/span 3;
  }
  .login .profile .container .form[data-step="3"] fieldset .field-percent > .input {
    gap: 1.25rem;
    width: 100%;
    grid-template-columns: 1fr 1fr 1fr;
  }
  .login .profile .container .form[data-step="3"] fieldset .field-percent > .input label {
    grid-area: auto/span 2;
  }
  .login .profile .container .form[data-step="3"] fieldset .field-percent .input-percent {
    width: 100%;
  }
  .login .profile .container .form[data-step="3"] fieldset .field-days {
    grid-area: auto/span 3;
  }
  .login .profile .container .form[data-step="3"] fieldset .field-days .grid {
    grid-template-columns: 1fr 1fr 1fr;
    gap: 1.25rem;
  }
  .login .profile .container .form[data-step="3"] fieldset .field-days .grid label {
    grid-area: auto/span 2;
  }
  .login .profile .container .form[data-step="3"] fieldset .field-days .grid .input {
    width: 100%;
    box-sizing: border-box;
  }
}
@media screen and (min-width: 1240px) {
  .login {
    align-items: center;
  }
  .login .create .container,
  .login .validate .container {
    width: min(80%, 768px);
  }
}
.table-container {
  border-radius: 8px;
  border: 1px solid var(--color-gray-e1);
  width: 100%;
  background: var(--color-white-ff);
  display: grid;
}
.table-container .table-header {
  padding: 0 1.25rem;
  box-sizing: border-box;
}
.table-container .table-header .title-header {
  margin-bottom: 0;
}
.table-container .custom-table {
  width: 100%;
  min-width: 650px;
  border-collapse: collapse;
}
.table-container .custom-table thead {
  font-weight: 600;
}
.table-container .custom-table thead tr {
  position: relative;
}
.table-container .custom-table thead tr th:last-child {
  position: sticky;
  right: 0;
  background: #f5f5f5;
}
.table-container .custom-table tbody tr {
  position: relative;
}
.table-container .custom-table tbody tr td:last-child {
  position: sticky;
  right: 0;
  background: var(--color-white-ff);
}
.table-container .custom-table .action {
  position: relative;
}
.table-container .custom-table .action::after {
  content: "";
  z-index: 1;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  cursor: pointer;
}
.table-container .custom-table .historial-icon {
  width: fit-content;
  display: flex;
  align-items: baseline;
  justify-content: center;
  color: var(--color-blue-02);
  position: relative;
}
.table-container .custom-table .historial-icon:hover {
  color: var(--color-black-0d);
}
.table-container .custom-table .historial-icon svg {
  width: 23px;
  fill: var(--color-blue-02);
}
.table-container .custom-table .historial-icon .add {
  width: 27px;
  transform: translateY(3px);
  margin-left: 5px;
}
.table-container .custom-table .historial-icon .delete {
  width: 17px;
}
.table-container .custom-table th,
.table-container .custom-table td {
  text-align: left;
  padding: 12px;
  border-bottom: 1px solid var(--color-gray-e1);
}
.table-container .custom-table th:nth-child(1),
.table-container .custom-table td:nth-child(1) {
  border-right: 1px solid var(--color-gray-e1);
}
.table-container .custom-table th {
  background-color: #f5f5f5;
}
.table-container .custom-table tbody tr:hover {
  background-color: #efefef;
  color: var(--color-blue-02);
}
.table-container .custom-table tbody tr:hover td:last-child {
  background-color: #efefef;
}
.table-container .custom-table .highlight {
  background-color: #e8f4ff;
  font-weight: bold;
}
.table-container .custom-table td .status {
  font-weight: 600;
}
.table-container .custom-table td .status.active {
  color: var(--color-green-9d);
}
.table-container .custom-table td .status.inactive {
  color: var(--color-red-ed);
}
.table-container .center {
  text-align: center !important;
}