.ham6 .line {
  fill:none;
  transition: stroke-dasharray 400ms, stroke-dashoffset 400ms;
  stroke:#262626;
  stroke-width:2.5;
  stroke-linecap:round;
}
.ham6 .top {
  stroke-dasharray: 40 172;
}
.ham6 .middle { 
  stroke-dasharray: 40 111;
}
.ham6 .bottom {
  stroke-dasharray: 40 172;
}
.ham6.active .top {
  stroke-dashoffset: -132px;
}
.ham6.active .middle {
  stroke-dashoffset: -71px;
}
.ham6.active .bottom {
  stroke-dashoffset: -132px;
}
.hamRotate.active {
  transform: rotate(45deg);
}





.loader.hide {
  transform:translateY(-100%);
}

:root {
  --animate-duration: 1s;
  --animate-delay: 1s;
  --animate-repeat: 1
 }

.nicescroll-rails-hr {
	display: none !important;
}


.fadeOutUp {
 animation-name:fadeOutUp
}

@keyframes fadeOutUp {
  0% {
   opacity:1
  }
  to {
   opacity:0;
   transform:translate3d(0,-100%,0)
  }
 }


.fadeOutUpSlow {
 animation-name:fadeOutUpSlow
}
@keyframes fadeOutUpSlow {
  0% {
   opacity:1
  }
  to {
   opacity:.2;
   transform:translate3d(0,-20%,0)
  }
 }

.fadeInDown {
 animation-name:fadeInDown
}
@keyframes fadeInDown {
  0% {
   opacity:0;
   transform:translate3d(0,-100%,0)
  }
  to {
   opacity:1;
   transform:translateZ(0)
  }
 }
@keyframes fadeInDownSlow {
 0% {
  opacity:.2;
  transform:translate3d(0,-20%,0)
 }
 to {
  opacity:1;
  transform:translateZ(0)
 }
}
.fadeInDownSlow {
 animation-name:fadeInDownSlow
}

.animated {
  animation-duration:var(--animate-duration);
  animation-fill-mode:both
 }
 .animated.infinite {
  animation-iteration-count:infinite
 }
 .animated.repeat-1 {
  animation-iteration-count:var(--animate-repeat)
 }
 .animated.repeat-2 {
  animation-iteration-count:calc(var(--animate-repeat) * 2)
 }
 .animated.repeat-3 {
  animation-iteration-count:calc(var(--animate-repeat) * 3)
 }
 .animated.delay-1s {
  animation-delay:var(--animate-delay)
 }
 .animated.delay-2s {
  animation-delay:calc(var(--animate-delay) * 2)
 }
 .animated.delay-3s {
  animation-delay:calc(var(--animate-delay) * 3)
 }
 .animated.delay-4s {
  animation-delay:calc(var(--animate-delay) * 4)
 }
 .animated.delay-5s {
  animation-delay:calc(var(--animate-delay) * 5)
 }
 .animated.faster {
  animation-duration:calc(var(--animate-duration) / 2)
 }
 .animated.fast {
  animation-duration:calc(var(--animate-duration) * .8)
 }
 .animated.slow {
  animation-duration:calc(var(--animate-duration) * 2)
 }
 .animated.slower {
  animation-duration:calc(var(--animate-duration) * 3)
 }
 @media print,(prefers-reduced-motion: reduce) {
  .animated {
   animation-duration:1ms!important;
   transition-duration:1ms!important;
   animation-iteration-count:1!important
  }
  .animated[class*=Out] {
   opacity:0
  }
 }

 @media (min-width: 1024px) {
  .aos-animate .topleft {
    width: 100%;
  }

  .aos-animate .topright {
    height: 100%;
  }

  .aos-animate .leftbot {
    height: 100%;
  }

  .aos-animate .botleft {
    width: 100%;
  }



}


.menushow .hovermenu::before {
  content: "";
  border-bottom: 5px solid #EE4630;
  width: 100%;
  position: absolute;
  top: 0px;
  left: auto;
  right: 0;
  animation: lineIn 0.2s ease-out forwards;
  display: block;
  z-index: 2;
  transform: none;
}

.mylineout::before {
  content: "";

  width: 100%;
  position: absolute;
  top: 0;
  left: 50%;
  transform: translate(-50%);
  animation: lineOut 0.2s ease-out forwards !important;
  display: block;
  z-index: 3;
}
.bg1home .svg_path {
  stroke-dasharray: 2987.79px;
  stroke-dashoffset: 2987.79px;

}
.bg1home .svg_path.anim {
  stroke-dashoffset: 0px !important;
 
}

.svg_path2 {
	stroke-dasharray: 2977.44px;
	stroke-dashoffset: 2977.44px;
}
.aos-animate .svg_path2 {
  stroke-dashoffset: 0px;
}
.svg_path3 {
	stroke-dasharray: 2987.78px;
	stroke-dashoffset: 2987.78px;
}
.aos-animate .svg_path3 {
  stroke-dashoffset: 0px;
}

@-webkit-keyframes lineOut {
  0% {
      width: 100%;
      left: auto;
      right: 0
  }

  100% {
      width: 0;
      left: auto;
      right: 0
  }
}

@keyframes lineIn {
  0% {
      width: 0;
      left: 0;
      right: auto
  }

  100% {
      width: 100%;
      left: 0;
      right: auto
  }
}




.grecaptcha-badge {
  opacity:0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}
.swiperOffer .swiper-slide .item {
  transition:0.5s all !important;
}
@media screen and (min-width: 1023px) {


}


@media screen and (max-width: 1771px) {


}
@media screen and (max-width: 1536px) {

  .hamburger-box {
 
    width: 30px;
    height: 22px;
  }

  
  .hamburger--emphatic .hamburger-inner::after {
    top: 7px;
  
  }
  .hamburger-inner, .hamburger-inner::after, .hamburger-inner::before {
    width: 30px;
  }
  .hamburger-inner::after {
    bottom: -7px;
  }

  .hamburger-inner::before {
    top: -7px;
  }

  @keyframes run {
    0% {
      bottom: 20px;
    }
  
    100% {
      bottom: 45px;
    }
  }
  
  @-webkit-keyframes run {
    0% {
      bottom: 20px;
    }
  
    100% {
      bottom: 45px;
    }
  
  }
 
}


/* .loader::before {
	content: "";
	background: #2626260a;
	backdrop-filter: blur(8px);
	position: absolute;
	width: 140px;
	height: 55px;
	z-index: 20;
	border-radius: 0 0 10px 10px;
	border: 1px solid rgba(255, 255, 255, 0.274);
	border-top: none;
	box-shadow: 0 15px 20px rgba(0, 0, 0, 0.082);
	animation: anim2 2s infinite;
	margin-top: 130px;
	border: 1px solid #333237;
}

.loader .circle {
  background: #c66390;
  border:2px solid #e73987;
  border-radius: 50%;
  width: 25px;
  height: 25px;
  z-index: -1;
  animation: anim 2s infinite linear;
  animation-delay: calc(-0.3s * var(--i));
  transform: translateY(5px);
  margin: 0.2em;
  display: flex;
  align-items: center;
  justify-content: center;
} */

@keyframes anim {
  0%,
  100% {
    transform: translateY(5px);
  }
  50% {
    transform: translateY(-65px);
  }
}

@keyframes anim2 {
  0%,
  100% {
    transform: rotate(-10deg);
  }
  50% {
    transform: rotate(10deg);
  }
}


[type="checkbox"]:checked,
[type="checkbox"]:not(:checked) {
   
    position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}
[type="radio"]:checked,
[type="radio"]:not(:checked) {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}
[type="checkbox"]:checked + label,
[type="checkbox"]:not(:checked) + label
{
    position: relative;
    padding-left: 40px;
    cursor: pointer;
    line-height: 20px;
    display: inline-block;
    color: #666;
}
[type="radio"]:checked + label,
[type="radio"]:not(:checked) + label
{
    position: relative;
    padding-left: 40px;
    cursor: pointer;
    line-height: 20px;
    display: inline-block;
    color: #666;
}
[type="checkbox"]:checked + label:before,
[type="checkbox"]:not(:checked) + label:before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    width: 20px;
    height: 20px;
    /* border: 1px solid #D9CEBF; */
    background: #fff;
    border-radius:5px;
}
[type="radio"]:checked + label:before,
[type="radio"]:not(:checked) + label:before {
  content: '';
  position: absolute;
  left: 0;
  top: 3px;
  width: 20px;
  height: 20px;
  /* border: 1px solid #D9CEBF; */
  background: #fff;
  border-radius:5px;
    
}
[type="checkbox"]:checked + label:after,
[type="checkbox"]:not(:checked) + label:after {
    content: url('../images/template/check.svg');
    width: 16px;
    height: 16px;
    /* background: #b19c7c; */
    position: absolute;
    top: 2px;
    left: 2px;
    -webkit-transition: all 0.2s ease;
    transition: all 0.2s ease;
}
.checkbox_order [type="checkbox"]:checked + label::after, .checkbox_order [type="checkbox"]:not(:checked) + label::after {
	top: 45%;
	transform: translateY(-50%);
	left: 24.5px;
}
.checkbox_order [type="checkbox"]:checked + label:before, .checkbox_order [type="checkbox"]:not(:checked) + label:before {
  top:50%;
  left:20px;
  transform:translateY(-50%);
 
}
.checkbox_withoutbg [type="checkbox"]:checked + label::after, .checkbox_withoutbg [type="checkbox"]:not(:checked) + label::after {
	top: 42%;
	transform: translateY(-50%);
	left: 4.5px;
}
.checkbox_withoutbg [type="checkbox"]:checked + label:before, .checkbox_withoutbg [type="checkbox"]:not(:checked) + label:before {
  top:50%;
  left:0px;
  transform:translateY(-50%);
 
}

[type="radio"]:checked + label:after,
[type="radio"]:not(:checked) + label:after {
  content: url('../images/template/check.svg');
  width: 16px;
  height: 16px;
  /* background: #b19c7c; */
  position: absolute;
  top: 2px;
  left: 4px;
  -webkit-transition: all 0.2s ease;
  transition: all 0.2s ease;
}

.checkbox_payment [type="radio"]:checked + label::after, .checkbox_payment [type="radio"]:not(:checked) + label::after {
	top: 46%;
	transform: translateY(-50%);
	left: 24.5px;
}
.checkbox_payment [type="radio"]:checked + label:before, .checkbox_payment [type="radio"]:not(:checked) + label:before {
  top:50%;
  left:20px;
  transform:translateY(-50%);
 
}
.checkbox_time [type="radio"]:checked + label::after, .checkbox_time [type="radio"]:not(:checked) + label::after {
	top: 46%;
	transform: translateY(-50%);
	left: 24.5px;
}
.checkbox_time [type="radio"]:checked + label:before, .checkbox_time [type="radio"]:not(:checked) + label:before {
  top:50%;
  left:20px;
  transform:translateY(-50%);
 
}
.checkbox_goal [type="radio"]:checked + label::after, .checkbox_goal [type="radio"]:not(:checked) + label::after {
	top: 45%;
	transform: translateY(-50%);
	left: 24.5px;
}
.checkbox_goal [type="radio"]:checked + label:before, .checkbox_goal [type="radio"]:not(:checked) + label:before {
  top:50%;
  left:20px;
  transform:translateY(-50%);
 
}

.checkbox_withoutbg [type="checkbox"]:checked + label:before, .checkbox_withoutbg [type="checkbox"]:not(:checked) + label:before {
background-color: #F2F2F2;
 
}
.checkbox_out [type="radio"]:checked + label:before, .checkbox_out [type="radio"]:not(:checked) + label:before {
background-color: #F2F2F2;
 
}
.checkbox_out_inside [type="radio"]:checked + label:before, .checkbox_out_inside [type="radio"]:not(:checked) + label:before {
background-color: #F2F2F2;
 
}

[type="checkbox"]:not(:checked) + label:after {
    opacity: 0;
    -webkit-transform: scale(0);
    transform: scale(0);
}
[type="checkbox"]:checked + label:after {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1);
}
[type="radio"]:not(:checked) + label:after {
    opacity: 0;
    -webkit-transform: scale(0);
    transform: scale(0);
}
[type="radio"]:checked + label:after {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1);
}
.lightpick__day:not(.is-disabled):hover {
  background-image:none !important;
  color:white;
  border-radius:0.75rem;
}
.lightpick__day.is-start-date, .lightpick__day.is-end-date, .lightpick__day.is-start-date:hover, .lightpick__day.is-end-date:hover {
	background-image: none !important;
	background-color: #6D9C14;
	color: white !important;
	border-radius: 0.75rem;
}
.lightpick__day.is-start-date.is-in-range:hover, .lightpick__day.is-end-date.is-in-range.is-flipped:hover {
border-top-right-radius: 0;
border-bottom-right-radius: 0;
border-top-left-radius: 0.75rem;
border-bottom-left-radius: 0.75rem;
}
.lightpick__day.is-today {
  background-image:none;
  position: relative;

}
.lightpick__day.is-today::before {
  content:"";
  position: absolute;
  bottom:5px;
  width: 5px;
  height: 5px;
  border-radius:50%;
  background:#EB3788;

}
@media screen and (max-width: 1280px) {

  .checkbox_order [type="checkbox"]:checked + label::after, .checkbox_order [type="checkbox"]:not(:checked) + label::after {
    top: 46%;
    left: 12.5px;
  }
  .checkbox_order [type="checkbox"]:checked + label:before, .checkbox_order [type="checkbox"]:not(:checked) + label:before {
 
    left:11px;
    
   
  }
  .checkbox_withoutbg [type="checkbox"]:checked + label::after, .checkbox_withoutbg [type="checkbox"]:not(:checked) + label::after {
    top: 43%;
    left: 1.5px;
  }
  .checkbox_withoutbg [type="checkbox"]:checked + label:before, .checkbox_withoutbg [type="checkbox"]:not(:checked) + label:before {
 
    /* left:0px; */
    
   
  }


  [type="checkbox"]:checked + label:before,
[type="checkbox"]:not(:checked) + label:before {
   
    width: 16px;
    height: 16px;
   
}
[type="radio"]:checked + label:before,
[type="radio"]:not(:checked) + label:before {

  width: 16px;
  height: 16px;
 
    
}


.checkbox_payment [type="radio"]:checked + label::after, .checkbox_payment [type="radio"]:not(:checked) + label::after {
	
  top: 40%;
  left: 14.5px;
}
.checkbox_payment [type="radio"]:checked + label:before, .checkbox_payment [type="radio"]:not(:checked) + label:before {
 
  left:13px;
  
 
}
.checkbox_time [type="radio"]:checked + label::after, .checkbox_time [type="radio"]:not(:checked) + label::after {
	
  top: 40%;
  left: 14.5px;
}
.checkbox_time [type="radio"]:checked + label:before, .checkbox_time [type="radio"]:not(:checked) + label:before {
 
  left:13px;
  
 
}
.checkbox_goal [type="radio"]:checked + label::after, .checkbox_goal [type="radio"]:not(:checked) + label::after {
	
  top: 40%;
  left: 14.5px;
}
.checkbox_goal [type="radio"]:checked + label:before, .checkbox_goal [type="radio"]:not(:checked) + label:before {
 
  left:13px;
  
}

[type="radio"]:checked + label::after, [type="radio"]:not(:checked) + label::after {
	width: 10px;
	height: 10px;
  transform:scale(0.8);
	top: 2px;
	left: 2px;

}


}


.account_tab img {
  filter:brightness(0) saturate(100%) invert(47%) sepia(6%) saturate(545%) hue-rotate(206deg) brightness(91%) contrast(87%);
}
.account_tab.active img {
  filter:brightness(0) saturate(100%) invert(0%) sepia(97%) saturate(13%) hue-rotate(122deg) brightness(101%) contrast(102%);
}

.MuiSvgIcon-root {
	fill: currentColor;
	width: 1em;
	height: 1em;
	display: inline-block;
	font-size: 1.5rem;
	transition: fill 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
	flex-shrink: 0;
	-moz-user-select: none;
}



.toggle_calendar .lightpick {
  width: 100%;
  box-shadow: none;
  z-index: 15;
}

.lightpick .lightpick__months {
  background-color: white;
  display: flex;
  justify-content: space-between;
  max-width: calc(100% - 40px);
  margin-left: auto;
  margin-right: auto;
  gap: 5px;
}

@media (min-width: 1024px) {
  .lightpick .lightpick__months {
      max-width: 100%;
  }
}

@media (min-width: 1280px) {
 .toggle_calendar .lightpick .lightpick__months {
      max-width: calc(100% - 80px);
  }
}

.lightpick .lightpick__toolbar {
  justify-content: space-between;
  width: 100%;
}

.lightpick .lightpick__toolbar button {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background-color: #262626;
  color:white;
}

.lightpick .lightpick__day {
  width: 36px;
  height: 36px;
  margin-bottom: 12px;
  font-family: 'ManropeSemiBold', sans-serif;
  font-size: 13px;
  color: #262626;
  cursor: pointer;
}

@media (min-width: 1280px) {
  .lightpick .lightpick__day {
      width: 45px;
      height: 45px;
  }
}

.lightpick .lightpick__day.is-in-range {
  background-color: #6D9C14;
  color: white;
}

.lightpick__day.is-start-date.is-in-range,
.lightpick__day.is-end-date.is-in-range.is-flipped {
  background-color: #6D9C14;
  border-top-left-radius: 12px;
  border-bottom-left-radius: 12px;
}

.lightpick__day.is-end-date.is-in-range,
.lightpick__day.is-start-date.is-in-range.is-flipped {
  border-top-right-radius: 12px;
  border-bottom-right-radius: 12px;
  background-color: #6D9C14;
}

.lightpick__day.is-in-range:hover {
  background: none;
}

.lightpick__day:not(.is-disabled):hover {
  background-color: #6D9C14;
}

.lightpick__day.is-end-date.is-in-range:hover {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}

.lightpick__day-of-the-week {
  font-size: 10px;
  font-family: 'ManropeRegular', sans-serif;
  color: #BFBFBF;
  margin-bottom: 20px;
  font-weight: normal !important;
}

.lightpick__month {
  width: 258px;
  margin-left: auto;
  margin-right: auto;
}



.ui-widget.ui-widget-content {
  width: 100% !important;
  border:none;
}
.ui-datepicker th {
  font-size: 10px;
  font-family: 'ManropeRegular', sans-serif;
  color: #BFBFBF;
  margin-bottom: 20px;
  font-weight: normal !important;
  text-align: center;
}
.ui-datepicker .ui-datepicker-title {
  text-align: center;
  font-size: 16px;
  font-family: 'ManropeBold', sans-serif;
  font-weight: normal !important;
  color: #262626;
}

.ui-datepicker td {
  width: 45px;
  height: 45px;
  margin-bottom: 12px;
  font-family: 'ManropeSemiBold', sans-serif;
  font-size: 13px;
  cursor: pointer;
  font-size: 13px;
  text-align: center;
  background:transparent !important;
}
.ui-datepicker td a {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: white !important;
  border: none !important;
  color: #262626 !important;
}
.ui-datepicker td span.ui-state-default {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: white !important;
  border: none !important;
  color: #262626 !important;
}

.ui-state-highlight, .ui-widget-content .ui-state-highlight, .ui-widget-header .ui-state-highlight {
  border: none !important;
  /* background: #6D9C14 !important; */
}
.ui-datepicker td a:hover {
   background: #6c9c1457 !important;
  color:white !important;
  border-radius:8px;
}
.ui-datepicker td.ui-state-highlight a:hover {
   background: #6D9C14 !important;
}
.ui-state-highlight a, .ui-widget-content .ui-state-highlight a, .ui-widget-header .ui-state-highlight a {
  background: #6D9C14 !important;
  color:white !important;
  border-radius:8px;
}


.ui-state-highlight span.ui-state-default, .ui-widget-content .ui-state-highlight span.ui-state-default, .ui-widget-header .ui-state-highlight span.ui-state-default {
  background: #6D9C14 !important;
}

.ui-datepicker .ui-datepicker-prev, .ui-datepicker .ui-datepicker-next {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background-color: #262626;
  color: white;
  display: flex;
  outline: none;
  border: none;
  justify-content: center;
  align-items: center;
  cursor: pointer !important;
  top:-2px;
}

.ui-datepicker .ui-datepicker-prev span, .ui-datepicker .ui-datepicker-next span {
	display: block;
	position: absolute;
	left: 50%;
	margin-left: -8px;
	top: 50%;
	margin-top: -8px;
	/* text-indent: 0; */
	background: none;
	background-repeat: no-repeat;
	background-position: center;
}

.ui-datepicker-next .ui-icon {
	background-image: url("../images/template/arrow-right.svg") !important;
}
.ui-datepicker-prev .ui-icon {
	background-image: url("../images/template/arrow-left.svg") !important;
  transform:rotate(180deg);
}

.ui-datepicker .ui-datepicker-header {
	padding: 4px 0;
	background: none;
	border: none;
	margin-bottom: 25px;
}
.lightpick .lightpick__toolbar button img {
  pointer-events: none;
}

@media (min-width: 1280px) {
  .lightpick__month {
      width: 320px;
  }
}

@media (min-width: 640px) {
  .lightpick__month {
      margin-left: 0;
  }
}

.lightpick__select.lightpick__select-years {
  display: none;
}

.lightpick__select.lightpick__select-months {
  text-align: center;
  font-size: 16px;
  font-family: 'ManropeBold', sans-serif;
  font-weight: normal !important;
  color: #262626;
}

.lightpick__month-title {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  top: 0;
}

@media (min-width: 640px) {
  .lightpick__month-title {
      top: 4px;
  }
 .toggle_calendar .lightpick__month-title {
      top: -40px;
  }
}

.lightpick__month-title-bar {
  position: relative;
}

.lightpick__days-of-the-week {
  padding-top: 24px;
}

.lightpick__reset-action {
  height: 50px;
  padding-left: 24px;
  padding-right: 24px;
  width: fit-content;
  max-width: 100%;
  border-radius: 50px;
  font-family: 'ManropeExtraBold', sans-serif;
  font-size: 16px;
  color: #262626;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  border: 1px solid #707070 !important;
  cursor: pointer;
  margin-left: auto;
  margin-right: auto;
  margin-top: 24px;
  transition: all 0.2s;
}

.lightpick__reset-action:hover {
  background-color: #262626;
  color: white;
}

.lightpick__apply-action {
  display: none;
}

.lightpick__footer-message {
  display: none;
}

.group_roundedcircle:hover .bgcircle {
	background-color: #eb3788;
	transition: background-color .5s, opacity .5s linear;
}
.group_roundedcircle:hover img {
  filter: brightness(10000%) saturate(0%);

}
.rounded-circle::after {
	box-shadow: 0 0 0 2px #eb3788;
	content: "";
	pointer-events: none;
	position: absolute;
	width: 100%;
	height: 100%;
	border-radius: 50%;
	-webkit-box-sizing: content-box;
	-moz-box-sizing: content-box;
	box-sizing: content-box;
	top: -10px;
	left: -10px;
	padding: 10px;
	transition: transform 0.2s, opacity 0.2s;
	transform: scale(.8);
	opacity: 0;
}
.group_roundedcircle:hover .rounded-circle::after {
	transform: scale(1);
	opacity: 1;
}

.lightpick__tooltip {
  display: none;
}

[x-cloak] { display: none; }


@media (max-width: 640px) {
  .lightpick .lightpick__months {
   
    max-width: 100%;
   
  }
}
@media (max-width: 450px) {
  .lightpick .lightpick__day {
    width: 32px;
    height: 32px;
   
  }
}

/* usuń natywny wygląd i narysuj własny */
input[type="radio"].custom-radio {
  -webkit-appearance: none;
  appearance: none;
  width: 20px;
  height: 20px;
  border: 2px solid #cbd5e1; /* gray-300 */
  border-radius: 50%;
  display: inline-block;
  position: relative;
  vertical-align: middle;
  background: white;
}

/* obrys/kolor gdy checked */
input[type="radio"].custom-radio:checked {
  border-color: #f03291;
  background: #ff4da6;
}