/* Navigations knapper */
.webto-navi {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
  flex-wrap: wrap;
  max-width: 100%;
  padding: 1rem 0;
}
.webto-navi .webto-back,
.webto-navi .webto-next {
  flex: 1 1 48%;
  max-width: 100%;
  white-space: nowrap;
  padding: 1rem;
  font-size: 1rem;
  border: none;
  border-radius: 30px;
  text-align: center;
  cursor: pointer;
}
.webto-navi .webto-back {
  background-color: #e0e0e0 !important;
  color: #333 ;
}
.webto-navi .webto-next {
  background-color: #34a853;
  color: white;
}
.webto-navi.navi-page-3 {
  flex-wrap: inherit;
}




.site-header-upper-inner-wrap.child-is-fixed .site-main-header-wrap {
	max-width: 1350px !important;
}
.site-header-upper-inner-wrap.child-is-fixed {
	box-shadow: 0px 15px 15px -10px rgba(0, 0, 0, 0.05);
}
.rejse-featured-image {
  max-height: 200px;
  object-fit: cover;
  border-radius: 1em 1em 0 0;
}
#step-1 {
	margin-top: -2em !important;
}
.webto-deltager {
	background-color: #F8F8F8;
	border-radius: 1em;
	padding: 2em;
	margin-bottom: 2em;
}
.webto-varelse-header {
	font-size: 22px;
	font-weight: bold;
}
.custom-checkbox {
  width: 22px;
  height: 22px;
  border: 2px solid #0073aa;
  border-radius: 6px;
  background: #fff;
  transition: box-shadow 0.2s;
  box-shadow: 0 2px 6px rgba(0,0,0,0.06);
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
}

.custom-checkbox-inner {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background 0.2s;
  background: #fff;
  border-radius: 4px;
  position: relative;
}

.custom-checkbox.checked .custom-checkbox-inner {
  background: linear-gradient(135deg, #009fe3 0%, #0073aa 100%);
  animation: checkbox-pop 0.15s cubic-bezier(.4,2,.6,1) both;
}

@keyframes checkbox-pop {
  0% { transform: scale(0.8); }
  80% { transform: scale(1.1);}
  100% { transform: scale(1);}
}

/* Checkmark */
.custom-checkbox.checked .custom-checkbox-inner::after {
  content: '';
  display: block;
  width: 10px;
  height: 5px;
  border-left: 3px solid #fff;
  border-bottom: 3px solid #fff;
  transform: rotate(-45deg);
  position: absolute;
  left: 5px;
  top: 6px;
  border-radius: 1px;
  box-shadow: 0 1px 2px rgba(0,0,0,0.08);
}

.custom-checkbox:hover {
  box-shadow: 0 4px 12px rgba(0,60,100,0.10);
  border-color: #009fe3;
}

.custom-checkbox-wrapper label {
  cursor: pointer;
}





.webto-steps-wrapper {
  display: flex;
  justify-content: center; 
  align-items: center;
  gap: 20px;
}
.webto-step {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 12px 24px; 
  transition: background-color 0.2s ease, box-shadow 0.2s ease;
  border-radius: 1em;
}
.webto-step-number {
  font-size: 18px;
  font-weight: 600;
  color: #555555; 
  line-height: 1;
  margin-bottom: 4px;
  box-shadow: 0px 15px 15px -10px rgba(0, 0, 0, 0.05);
}
.webto-step-label {
  font-size: 12px;
  font-weight: 500;
  color: #777777;
  text-align: center;
  line-height: 1.2;
}
.webto-step.webto-step-active {
    background-color: #0C8476;
    box-shadow: 0px 15px 15px -10px rgba(0, 0, 0, 0.05);
    border-radius: 1em;
    border: none !important;
    padding: 2em;
}
.webto-step.webto-step-active .webto-step-number {
    color: #ffffff;
}
.webto-step.webto-step-active .webto-step-label {
    color: #ffffff;
}
button {
	width: 100% !important;
	font-size: 20px !important;
	background-color: #089f41 !important;
}
button:hover {
	background-color: #097030 !important;
}
.webto-form-group-head {
	font-size: 26px !important;
	font-weight: bold;
}
.required-marker {
	color: #c83b2d;
	margin-left: -4px;
}
#webto-formular-progress {
	border-radius: 1em !important;
	background-color: #fff;
	box-shadow: 0px 15px 15px -10px rgba(0, 0, 0, 0.05);
}


form#webto-formular {
	background: #fff;
	padding: 2em;
	border-radius: 1em;
	max-width: 100%;
	margin: 32px auto;
    box-shadow: 0px 15px 15px -10px rgba(0, 0, 0, 0.05);
}
.webto-form-field {
  margin-bottom: 22px;
}
.webto-form-field label {
  display: block;
  color: #222;
  margin-bottom: 7px;
  letter-spacing: 0.01em;
}
.webto-form-field input[type="text"],
.webto-form-field input[type="email"],
.webto-form-field input[type="number"],
.webto-form-field input[type="tel"],
.webto-form-field textarea,
.custom-select-trigger {
  padding: 12px 16px;
  border: 1px solid #d9e0ea;
  border-radius: 10px;
  background: #f7fafd;
  transition: border 0.2s;
  width: 100%;
  box-sizing: border-box;
}
.webto-form-field input:focus,
.webto-form-field textarea:focus,
.custom-select-trigger:focus {
  border-color: #44b153;
  outline: none;
  background: #fff;
}
.webto-form-field textarea {
  min-height: 90px;
  resize: vertical;
}
.custom-select-trigger {
  display: flex;
  align-items: center;
  justify-content: space-between;
  /*background: #fff;*/
  cursor: pointer;
  margin-bottom: 0;
}
.custom-select-trigger:hover,
.custom-select-trigger:focus {
  border-color: #44b153;
}
.error-message {
  color: #d03847;
  margin-top: 5px;
}
button,
input[type="submit"] {
  background: #44b153;
  color: #fff;
  border: none;
  border-radius: 14px;
  padding: 16px 0;
  cursor: pointer;
  margin-top: 22px;
  box-shadow: 0 2px 14px rgba(68,177,83,0.07);
  transition: background 0.2s;
  width: 100%;
}
button:hover,
input[type="submit"]:hover {
  background: #358e41;
}
.webto-form-field.enkeltaev, .webto-form-field.dobbeltvaev {
  margin-bottom: 16px;
}
form#webto-formular h2,
form#webto-formular h3 {
  color: #222;
  margin-bottom: 18px;
}
@media (max-width: 600px) {
  form#webto-formular {
    padding: 22px;
    max-width: 99vw;
  }
}


/* Mobile tilretninger */
@media only screen and (max-width: 767px) { 
    .mobile-html-inner {
	text-align: right !important;
    font-size: 14px !important;
}  
    .webto-step.webto-step-active {
	padding: 1em 0.2em !important;
}
    .webto-step {
	padding: 1em 0.2em !important;
}
    .step button {
	margin-top: 0px !important;
}
}