.nav__item.selected {
  background-color: var(--Primary10);
  color: var(--Primary);
  transition: all .4s ease-in-out;
  pointer-events: none;
}

@media screen and (width <= 768px) {
  .nav__item.selected {
    pointer-events:all;
  }
}

.gifts-section {
  position: relative;
  display: flex;
  padding: var(--Space-60, 60px) var(--Space-8, 8px);
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: var(--Space-20, 20px);
  border-radius: 20px;
  background: var(--Primary, #FF4646);
  width: 100%;

}

.bg-garland {
  position: absolute;
  top:0;
  width: 100%;
  height: 200px;
  position: absolute;
  background: url("../assets/images/bg-garland.png");
  background-repeat: no-repeat;
  background-size:100%;
  background-position:top;
}

.gifts-container {
  display: flex;
  max-width: 1276px;
  padding: var(--Space-0, 0px);
  flex-direction: column;
  align-items: center;
  gap: var(--Space-20, 20px);
  width: 100%;
}

.text-container {
  display: flex;
max-width: 426px;
padding: var(--Space-0, 0px);
flex-direction: column;
justify-content: center;
align-items: center;
gap: var(--Space-12, 12px);
align-self: center;
color: var(--Static-White, #FFF);
}

.tab__items {
  display: flex;
  padding: var(--Space-0, 0px);
  align-items: center;
  gap: var(--Space-8, 8px);
  color: var(--Static-White, #FFF);
}

.tab__item {
  display: flex;
  padding: var(--Space-12, 12px) var(--Space-20, 20px);
  justify-content: center;
  align-items: center;
  gap: var(--Space-0, 0px);
  border-radius: 12px;
  border: 0;
  pointer-events: all;
  cursor: pointer;
  transition: all .2s ease-in-out;
}

@media screen and (width <= 600px) {
  .tab__items {
    gap: var(--Space-0, 0px);
  }
  .tab__item {
    padding: var(--Space-12, 12px) var(--Space-8, 8px);
  }
}

.tab__item.checked {
  background: var(--Static-White-20, rgba(255, 255, 255, 0.20));
  pointer-events: none;
}

@media (pointer: fine) and (hover:hover) {
  .tab__item:hover {
    background-color: var(--Static-White-20, rgba(255, 255, 255, 0.20));
    transition: all .4s ease-in-out;
  }
}

.cards-container {
  display: flex;
  padding: var(--Space-0, 0px);
  justify-content: center;
  align-items: flex-start;
  align-content: flex-start;
  gap: var(--Space-12, 12px);
  align-self: stretch;
  flex-wrap: wrap;
}

input {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}