/*
 Theme Name:     Hundstad Gard Theme
 Description:    Custom theme developed by Fullkorn Design
 Author:         Fullkorn Design
 Author URI:     https://fullkorndesign.no
 Template:       Divi
 Version:        1.0.0
*/
 
 
/* =Theme customization starts here
------------------------------------------------------- */
 
 
#footer-bottom {
  display: none;
}

/* Loading of the fonts prioritiesed in the order */
@font-face {
  font-family: 'FacultyGlyphic';
  src: url('/wp-content/uploads/FacultyGlyphic-Regular.woff2') format('woff2'),
       url('/wp-content/uploads/FacultyGlyphic-Regular.woff') format('woff');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}


/*MOBILE MENU START*/

/* Keep logo and icon above menu */
.et_pb_menu__logo,
.mobile_menu_bar {
  position: relative;
  z-index: 10001;
}

/* Prevent animation on the icon wrapper itself */
.mobile_menu_bar {
  transform: none !important;
  transition: none !important;
}

/* Closed icon */
.mobile_menu_bar:before {
  content: '\61';
  display: inline-block;
  transform: rotate(0deg);
  transform-origin: center;
  transition: transform 0.75s cubic-bezier(.22,.61,.36,1);
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
}

/* Open icon */
.mobile_nav.opened .mobile_menu_bar:before {
  content: '\4d';
  transform: rotate(90deg);
}

/* Full-screen mobile menu */
.et_mobile_menu {
  position: fixed !important;
  inset: 0 !important;
  display: block !important;
  width: 100vw !important;
  height: 100dvh !important;
  box-sizing: border-box !important;
  overflow: hidden !important;
  z-index: 9999;
  margin: 0 !important;
  padding: 0 !important;
  visibility: hidden;
  pointer-events: none;
  transform: scaleY(0);
  transform-origin: top center;
  transition:
    transform 0.75s cubic-bezier(.22,.61,.36,1),
    visibility 0s linear 0.75s;
  will-change: transform;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
}

/* Open state */
.mobile_nav.opened .et_mobile_menu {
  visibility: visible;
  pointer-events: auto;
  overflow-y: auto !important;
  transform: scaleY(1);
  transition:
    transform 0.75s cubic-bezier(.22,.61,.36,1),
    visibility 0s linear 0s;
}

/* Push menu items down */
.et_mobile_menu > li:first-child {
  margin-top: 175px !important;
}

/* Top-level items appear after the panel starts opening */
.et_mobile_menu > li {
  opacity: 0;
  transform: translateY(-18px);
  transition:
    opacity 0.35s ease,
    transform 0.45s cubic-bezier(.22,.61,.36,1);
}

.mobile_nav.opened .et_mobile_menu > li {
  opacity: 1;
  transform: translateY(0);
}

.mobile_nav.opened .et_mobile_menu > li:nth-child(1) { transition-delay: 0.28s; }
.mobile_nav.opened .et_mobile_menu > li:nth-child(2) { transition-delay: 0.36s; }
.mobile_nav.opened .et_mobile_menu > li:nth-child(3) { transition-delay: 0.44s; }
.mobile_nav.opened .et_mobile_menu > li:nth-child(4) { transition-delay: 0.52s; }
.mobile_nav.opened .et_mobile_menu > li:nth-child(5) { transition-delay: 0.60s; }
.mobile_nav.opened .et_mobile_menu > li:nth-child(6) { transition-delay: 0.68s; }

/* Menu typography */
.et_mobile_menu li {
  margin-bottom: 10px;
}

.et_mobile_menu li a {
  font-size: 24px !important;
  line-height: 1.4em;
  padding: 12px 24px 12px 40px !important;
  font-weight: 300 !important;
}

/* Mobile submenu */
@media (max-width: 980px) {
  #main-header .et_mobile_menu li.menu-item-has-children,
  #main-header .et_mobile_menu li.page_item_has_children,
  .et_pb_menu .et_mobile_menu li.menu-item-has-children,
  .et_pb_menu .et_mobile_menu li.page_item_has_children,
  .et_pb_fullwidth_menu .et_mobile_menu li.menu-item-has-children,
  .et_pb_fullwidth_menu .et_mobile_menu li.page_item_has_children {
    position: relative;
  }

  #main-header .et_mobile_menu li.menu-item-has-children > a,
  #main-header .et_mobile_menu li.page_item_has_children > a,
  .et_pb_menu .et_mobile_menu li.menu-item-has-children > a,
  .et_pb_menu .et_mobile_menu li.page_item_has_children > a,
  .et_pb_fullwidth_menu .et_mobile_menu li.menu-item-has-children > a,
  .et_pb_fullwidth_menu .et_mobile_menu li.page_item_has_children > a {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    background: transparent !important;
    padding: 12px 64px 12px 40px !important;
    position: relative;
  }

  /* Invisible click area next to the parent text */
  #main-header .et_mobile_menu li.menu-item-has-children > .submenu-toggle,
  #main-header .et_mobile_menu li.page_item_has_children > .submenu-toggle,
  .et_pb_menu .et_mobile_menu li.menu-item-has-children > .submenu-toggle,
  .et_pb_menu .et_mobile_menu li.page_item_has_children > .submenu-toggle,
  .et_pb_fullwidth_menu .et_mobile_menu li.menu-item-has-children > .submenu-toggle,
  .et_pb_fullwidth_menu .et_mobile_menu li.page_item_has_children > .submenu-toggle {
    position: absolute;
    top: 0;
    left: calc(40px + 9.7em);
    width: 20px;
    height: 56px;
    z-index: 10002;
    cursor: pointer;
    border: 0;
    padding: 0;
    background: transparent;
  }

  /* Draw the arrow on the parent link so it stays in place */
  #main-header .et_mobile_menu li.menu-item-has-children > a::after,
  #main-header .et_mobile_menu li.page_item_has_children > a::after,
  .et_pb_menu .et_mobile_menu li.menu-item-has-children > a::after,
  .et_pb_menu .et_mobile_menu li.page_item_has_children > a::after,
  .et_pb_fullwidth_menu .et_mobile_menu li.menu-item-has-children > a::after,
  .et_pb_fullwidth_menu .et_mobile_menu li.page_item_has_children > a::after {
    content: '';
    position: absolute;
    left: calc(40px + 9.7em);
    top: 50%;
    width: 7px;
    height: 7px;
    border-right: 2px solid #F7FFDC;
    border-bottom: 2px solid #F7FFDC;
    transform: translateY(-50%) rotate(45deg);
    transform-origin: center;
    transition: transform 0.25s ease;
    pointer-events: none;
  }

  /* Rotate only, without shifting down */
  #main-header .et_mobile_menu li.open-sub > a::after,
  .et_pb_menu .et_mobile_menu li.open-sub > a::after,
  .et_pb_fullwidth_menu .et_mobile_menu li.open-sub > a::after {
    transform: translateY(-50%) rotate(225deg);
  }

  #main-header .et_mobile_menu li.menu-item-has-children > ul.sub-menu,
  #main-header .et_mobile_menu li.page_item_has_children > ul.children,
  .et_pb_menu .et_mobile_menu li.menu-item-has-children > ul.sub-menu,
  .et_pb_menu .et_mobile_menu li.page_item_has_children > ul.children,
  .et_pb_fullwidth_menu .et_mobile_menu li.menu-item-has-children > ul.sub-menu,
  .et_pb_fullwidth_menu .et_mobile_menu li.page_item_has_children > ul.children {
    display: block !important;
    max-height: 0;
    opacity: 0;
    visibility: hidden;
    overflow: hidden;
    margin: 0 !important;
    padding: 0 !important;
    pointer-events: none;
    transform: translateY(-8px);
    transition:
      max-height 0.4s cubic-bezier(.22,.61,.36,1),
      opacity 0.25s ease,
      transform 0.35s cubic-bezier(.22,.61,.36,1),
      visibility 0s linear 0.4s;
    will-change: max-height, opacity, transform;
  }

  #main-header .et_mobile_menu li.open-sub > ul.sub-menu,
  #main-header .et_mobile_menu li.open-sub > ul.children,
  .et_pb_menu .et_mobile_menu li.open-sub > ul.sub-menu,
  .et_pb_menu .et_mobile_menu li.open-sub > ul.children,
  .et_pb_fullwidth_menu .et_mobile_menu li.open-sub > ul.sub-menu,
  .et_pb_fullwidth_menu .et_mobile_menu li.open-sub > ul.children {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateY(0);
    transition:
      max-height 0.4s cubic-bezier(.22,.61,.36,1),
      opacity 0.25s ease,
      transform 0.35s cubic-bezier(.22,.61,.36,1),
      visibility 0s linear 0s;
  }

  #main-header .et_mobile_menu li > ul.sub-menu > li,
  #main-header .et_mobile_menu li > ul.children > li,
  .et_pb_menu .et_mobile_menu li > ul.sub-menu > li,
  .et_pb_menu .et_mobile_menu li > ul.children > li,
  .et_pb_fullwidth_menu .et_mobile_menu li > ul.sub-menu > li,
  .et_pb_fullwidth_menu .et_mobile_menu li > ul.children > li {
    margin-left: 0 !important;
    padding-left: 0 !important;
    opacity: 0;
    transform: translateY(-6px);
    transition:
      opacity 0.25s ease,
      transform 0.35s cubic-bezier(.22,.61,.36,1);
  }

  #main-header .et_mobile_menu li.open-sub > ul.sub-menu > li,
  #main-header .et_mobile_menu li.open-sub > ul.children > li,
  .et_pb_menu .et_mobile_menu li.open-sub > ul.sub-menu > li,
  .et_pb_menu .et_mobile_menu li.open-sub > ul.children > li,
  .et_pb_fullwidth_menu .et_mobile_menu li.open-sub > ul.sub-menu > li,
  .et_pb_fullwidth_menu .et_mobile_menu li.open-sub > ul.children > li {
    opacity: 1;
    transform: translateY(0);
  }

  #main-header .et_mobile_menu li > ul.sub-menu,
#main-header .et_mobile_menu li > ul.children,
.et_pb_menu .et_mobile_menu li > ul.sub-menu,
.et_pb_menu .et_mobile_menu li > ul.children,
.et_pb_fullwidth_menu .et_mobile_menu li > ul.sub-menu,
.et_pb_fullwidth_menu .et_mobile_menu li > ul.children {
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box;
}

#main-header .et_mobile_menu li > ul.sub-menu li a,
#main-header .et_mobile_menu li > ul.children li a,
.et_pb_menu .et_mobile_menu li > ul.sub-menu li a,
.et_pb_menu .et_mobile_menu li > ul.children li a,
.et_pb_fullwidth_menu .et_mobile_menu li > ul.sub-menu li a,
.et_pb_fullwidth_menu .et_mobile_menu li > ul.children li a {
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box;
  padding: 12px 20px 12px 56px !important;
  white-space: normal;
}

}

/*HOVER MENU DESKTOP ITEMS ANIA DIVI LOVER START */

/* Change the width of the MENU dropdown container */
.dl-menu ul.sub-menu {
    width: 300px;
}

/* Change the width of the links inside the dropdown */
.dl-menu ul.sub-menu li,
.dl-menu ul.sub-menu li a {
    width: 100%;
}

/* Position the second level dropdown correctly */
.dl-menu .nav li li ul {
    left: 300px;
}
.dl-menu .nav li.et-reverse-direction-nav li ul {
    left:auto;
    right:300px;
}

/* Extend dropdown links full-width */
.dl-menu .nav li li {
    padding: 0;
    min-width: 100%;
}
.dl-menu .nav li li a {
    min-width: 100%;
}

/* Change the dropdown links hover effect */
/* Match Divi default gentle desktop hover on dropdown children */
.dl-menu.et_pb_module.et_pb_menu .nav li li a {
    transition: opacity .2s ease-in-out, background-color .2s ease-in-out;
}

.dl-menu.et_pb_module.et_pb_menu .nav li li a:hover {
    background-color: rgba(0,0,0,.03) !important;
    opacity: .7;
}

/* Remove the dropdown border and inner spacing */
.dl-menu.et_pb_menu .et-menu-nav ul.sub-menu {
    padding: 0;
    border-top: 0;
}

/* Move the first-level dropdown to the left */
.dl-menu ul.nav > li > ul.sub-menu {
    transform: translateX(-9px);
}

/* Add rounded corners to the dropdown container */
.dl-menu.et_pb_menu .et-menu-nav ul.sub-menu {
    border-radius: 5px;
}

/* Add rounded corners to the first dropdown item */
.dl-menu ul.sub-menu li:first-child a {
    border-radius: 5px 5px 0 0;
}

/* Add rounded corners to the last dropdown item */
.dl-menu ul.sub-menu li:last-child a {
    border-radius: 0 0 5px 5px;
}

/* Change the default dropdown animation */
.dl-menu ul.nav > li > ul.sub-menu {
    transform:translateY(10px);
    transition: all .3s ease-in-out;
}
.dl-menu ul.nav > li:hover > ul.sub-menu {
    transform:translateY(0);
}

/*HOVER MENU DESKTOP ITEMS ANIA DIVI LOVER END  */

/*MOBILE MENU END*/








/*PLACES HEADER OVER TOP OF HERO IMAGE*/

#main-header {
  background: transparent !important;
  box-shadow: none;
  position: absolute;
  width: 100%;
}

.et-l--header {
  position: absolute;
  width: 100%;
  z-index: 999;
}




/* FOOTER MOBILE STACK */

@media (max-width: 765px) {
  .footer-mobile-stack {
    display: flex !important;
    flex-direction: column !important;
  }

  .footer-mobile-stack > :nth-child(2) { order: 1 !important; }
  .footer-mobile-stack > :nth-child(3) { order: 2 !important; }
  .footer-mobile-stack > :nth-child(1) { order: 3 !important; }
}

.et_pb_scroll_top.et-pb-icon {
    color: #F7FFDC !important;
}

/*email and phone icon protruding to left desktop*/

.contact-line {
    position: relative;
    display: block;
    margin-bottom: 6px;
}


.contact-icon {
    position: absolute;
    left: -29px;
    top: 25%;
    transform: translateY(-50%);
}

/* underline modifications*/

.border-underline a{border-bottom:1px solid #F7FFDC } /*beige*/

.border-underline2 a{border-bottom:1px solid #CAFA94  } /* light green*/

.border-underline3 a{border-bottom:1px solid #314632  } /* dark green*/

.border-underline4 a{border-bottom:1px solid #FFF97B  } /* yellow*/



/* contact icons wiggle*/

#contact .contact-icon {
  position: absolute;
  left: -29px;
  top: 25%;
  display: inline-block;
  transform: translateY(-50%);
  transform-origin: center;
  will-change: transform;
}

#contact .contact-icon.is-wiggling {
  animation: contactIconWiggle 0.75s ease-in-out 1;
}

@keyframes contactIconWiggle {
  0%, 100% { transform: translateY(-50%) translateX(0) rotate(0deg); }
  20% { transform: translateY(-50%) translateX(-6px) rotate(-10deg); }
  40% { transform: translateY(-50%) translateX(8px) rotate(10deg); }
  60% { transform: translateY(-50%) translateX(-6px) rotate(-8deg); }
  80% { transform: translateY(-50%) translateX(4px) rotate(4deg); }
}

html {
  scroll-behavior: smooth;
}









/* PRODUCT CAROUSEL START */

.product-carousel {
  --pc-far-w: 96px;
  --pc-near-w: 128px;
  --pc-center-w: 160px;
  --pc-stage-h: calc(var(--pc-center-w) * 13 / 9);
  --placeholder-zoom: 3.4;

  width: 100%;
  max-width: 980px;
  margin: 0 auto;
  padding: 0 56px;
  box-sizing: border-box;
  position: relative;
}

.product-carousel,
.product-carousel .et_pb_group_carousel_container {
  max-width: 100%;
  overflow-x: clip;
}

.product-carousel .et_pb_group_carousel_container {
  overflow-y: hidden;
  min-height: calc(var(--pc-stage-h) + 12px);
}

.product-carousel .et_pb_group_carousel_track {
  display: flex;
  align-items: center;
}

.product-carousel .et_pb_group_carousel_slide {
  flex: 0 0 20%;
  min-width: 20%;
  min-height: calc(var(--pc-stage-h) + 12px);
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: visible;
}

.product-carousel .et_pb_group_carousel_slide > .et_pb_group,
.product-carousel .et_pb_group_carousel_slide_active > .et_pb_group {
  width: 100%;
  min-height: calc(var(--pc-stage-h) + 12px);
  transform: none !important;
  justify-content: center !important;
  align-items: center;
}

.product-carousel .et_pb_group_carousel_slide .et_pb_image,
.product-carousel .et_pb_group_carousel_slide .et_pb_image_wrap {
  margin: 0 auto;
  max-width: none !important;
}

.product-carousel .et_pb_group_carousel_slide .et_pb_image_wrap {
  width: var(--pc-far-w) !important;
  aspect-ratio: 9 / 13;
  overflow: hidden;
  border-radius: 2px;
  position: relative;
  transition: width 0.5s ease-in-out, transform 0.5s ease-in-out;
  will-change: width, transform;
  backface-visibility: hidden;
}

.product-carousel .et_pb_group_carousel_slide.is-near-left .et_pb_image_wrap,
.product-carousel .et_pb_group_carousel_slide.is-near-right .et_pb_image_wrap {
  width: var(--pc-near-w) !important;
}

.product-carousel .et_pb_group_carousel_slide.is-center .et_pb_image_wrap {
  width: var(--pc-center-w) !important;
}

.product-carousel .et_pb_group_carousel_slide img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover;
  object-position: center;
  display: block;
}

.product-carousel .et_pb_group_carousel_slide img[src*="image-placeholder-vertical.jpg"] {
  transform: scale(var(--placeholder-zoom));
  transform-origin: center;
}

.product-carousel.is-repainting .et_pb_group_carousel_slide .et_pb_image_wrap,
.product-carousel.et_pb_group_carousel_no_transitions .et_pb_group_carousel_slide .et_pb_image_wrap {
  transition: none !important;
}

/* Wide desktop */

@media (min-width: 1201px) {
  .product-carousel {
    width: min(1335px, 100%);
    max-width: calc(100vw - 40px);
    margin: 0 auto;

    --pc-far-w: 124px;
    --pc-near-w: 163px;
    --pc-center-w: 205px;
    --pc-stage-h: calc(var(--pc-center-w) * 13 / 9);
  }

  .product-carousel .et_pb_group_carousel_arrow_prev,
  .product-carousel .et_pb_group_carousel_arrow_next {
    top: 50%;
    z-index: 10;
  }

  .product-carousel .et_pb_group_carousel_arrow_prev {
    left: 34px !important;
    transform: translate3d(0, -50%, 0);
  }

  .product-carousel .et_pb_group_carousel_arrow_next {
    right: 34px !important;
    transform: translate3d(0, -50%, 0);
  }

  .product-carousel .et_pb_group_carousel_slide.is-far-left .et_pb_image_wrap {
    transform: translate3d(78px, 0, 0);
  }

  .product-carousel .et_pb_group_carousel_slide.is-near-left .et_pb_image_wrap {
    transform: translate3d(21px, 0, 0);
  }

  .product-carousel .et_pb_group_carousel_slide.is-center .et_pb_image_wrap {
    transform: translate3d(0, 0, 0);
  }

  .product-carousel .et_pb_group_carousel_slide.is-near-right .et_pb_image_wrap {
    transform: translate3d(-21px, 0, 0);
  }

  .product-carousel .et_pb_group_carousel_slide.is-far-right .et_pb_image_wrap {
    transform: translate3d(-78px, 0, 0);
  }
}

@media (min-width: 981px) and (max-width: 1200px) {
  .product-carousel {
    width: min(1195px, 100%);
    max-width: calc(100vw - 40px);
    margin: 0 auto;

    --pc-far-w: 101px;
    --pc-near-w: 136px;
    --pc-center-w: 170px;
    --pc-stage-h: calc(var(--pc-center-w) * 13 / 9);
  }

  .product-carousel .et_pb_group_carousel_arrow_prev,
  .product-carousel .et_pb_group_carousel_arrow_next {
    top: 50%;
    z-index: 10;
  }

  .product-carousel .et_pb_group_carousel_arrow_prev {
    left: 34px !important;
    transform: translate3d(0, -50%, 0);
  }

  .product-carousel .et_pb_group_carousel_arrow_next {
    right: 34px !important;
    transform: translate3d(0, -50%, 0);
  }

  .product-carousel .et_pb_group_carousel_slide.is-far-left .et_pb_image_wrap {
    transform: translate3d(60px, 0, 0);
  }

  .product-carousel .et_pb_group_carousel_slide.is-near-left .et_pb_image_wrap {
    transform: translate3d(16px, 0, 0);
  }

  .product-carousel .et_pb_group_carousel_slide.is-center .et_pb_image_wrap {
    transform: translate3d(0, 0, 0);
  }

  .product-carousel .et_pb_group_carousel_slide.is-near-right .et_pb_image_wrap {
    transform: translate3d(-16px, 0, 0);
  }

  .product-carousel .et_pb_group_carousel_slide.is-far-right .et_pb_image_wrap {
    transform: translate3d(-60px, 0, 0);
  }
}



/* Tablet */

@media (min-width: 768px) and (max-width: 980px) {
  .product-carousel {
    --pc-far-w: 78px;
    --pc-near-w: 104px;
    --pc-center-w: 128px;
    --pc-stage-h: calc(var(--pc-center-w) * 13 / 9);

    max-width: 100%;
    padding: 0 28px;
  }

  .product-carousel .et_pb_group_carousel_slide {
    flex: 0 0 25%;
    min-width: 25%;
  }

  .product-carousel .et_pb_group_carousel_arrow_prev {
    left: 2px;
  }

  .product-carousel .et_pb_group_carousel_arrow_next {
    right: 2px;
  }
}

/* Mobile */

@media (max-width: 767px) {
  .product-carousel {
    --pc-far-w: 56px;
    --pc-near-w: 78px;
    --pc-center-w: 100px;
    --pc-stage-h: calc(var(--pc-center-w) * 13 / 9);

    max-width: 100%;
    padding: 0 4px;
  }

  .product-carousel .et_pb_group_carousel_container {
    overflow: visible;
  }

  .product-carousel .et_pb_group_carousel_slide {
    flex: 0 0 33.3333%;
    min-width: 33.3333%;
  }

  .product-carousel .et_pb_group_carousel_arrow_prev,
  .product-carousel .et_pb_group_carousel_arrow_next {
    top: 50%;
    z-index: 10;
  }

  .product-carousel .et_pb_group_carousel_arrow_prev {
    left: 2px !important;
    transform: translate3d(0, -50%, 0);
  }

  .product-carousel .et_pb_group_carousel_arrow_next {
    right: 2px !important;
    transform: translate3d(0, -50%, 0);
  }

.product-carousel .et_pb_group_carousel_slide.is-far-left .et_pb_image_wrap {
  transform: translate3d(240px, 0, 0);
}

.product-carousel .et_pb_group_carousel_slide.is-near-left .et_pb_image_wrap {
  transform: translate3d(19px, 0, 0);
}

.product-carousel .et_pb_group_carousel_slide.is-center .et_pb_image_wrap {
  transform: translate3d(0, 0, 0);
}

.product-carousel .et_pb_group_carousel_slide.is-near-right .et_pb_image_wrap {
  transform: translate3d(-19px, 0, 0);
}

.product-carousel .et_pb_group_carousel_slide.is-far-right .et_pb_image_wrap {
  transform: translate3d(-40px, 0, 0);
}


}

/* Custom arrows */

.product-carousel .et_pb_group_carousel_arrow_prev,
.product-carousel .et_pb_group_carousel_arrow_next {
  color: transparent !important;
  font-size: 0 !important;
  line-height: 0 !important;
  text-indent: -9999px;
  overflow: hidden;
  width: 35px;
  height: 35px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

.product-carousel .et_pb_group_carousel_arrow_prev::before,
.product-carousel .et_pb_group_carousel_arrow_prev::after,
.product-carousel .et_pb_group_carousel_arrow_next::before,
.product-carousel .et_pb_group_carousel_arrow_next::after {
  content: none !important;
  display: none !important;
}

.product-carousel .et_pb_group_carousel_arrow_prev *,
.product-carousel .et_pb_group_carousel_arrow_next * {
  display: none !important;
}

/* Mobile + tablet default arrows */
.product-carousel .et_pb_group_carousel_arrow_prev {
  background-image: url("https://hundstadgaard.no/wp-content/uploads/2026/03/Pil-venstre.svg");
}

.product-carousel .et_pb_group_carousel_arrow_next {
  background-image: url("https://hundstadgaard.no/wp-content/uploads/2026/03/Pil-hoyre.svg");
}

/* Desktop arrow swap */
@media (min-width: 981px) {
  .product-carousel .et_pb_group_carousel_arrow_prev {
    background-image: url("https://hundstadgaard.no/wp-content/uploads/2026/03/Pil-venstre-datamaskin.svg");
  }

  .product-carousel .et_pb_group_carousel_arrow_next {
    background-image: url("https://hundstadgaard.no/wp-content/uploads/2026/03/Pil-hoyre-datamaskin.svg");
  }
}



/* PRODUCT CAROUSEL END */




/* FOCUS INDICATOR*/

a:focus-visible,
button:focus-visible,
.et_pb_button:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible,
.product-carousel .et_pb_group_carousel_arrow_prev:focus-visible,
.product-carousel .et_pb_group_carousel_arrow_next:focus-visible {
  outline: none;
  box-shadow:
    0 0 0 2px #314632,
    0 0 0 4px #CAFA94;
  border-radius: 999px;
}




/* Headlines lines with class: headline-with-lines js and css*/


/* decorative headline lines */

.headline-with-lines {
  --headline-edge-offset: 20px;
  --headline-line-gap: 20px;
  --headline-line-opacity: 1;
  --headline-line-thickness: 2px;
  --headline-line-color: currentColor;
  --headline-line-top: 50%;
  --headline-line-left-start: 0px;
  --headline-line-left-width: 0px;
  --headline-line-right-start: 0px;
  --headline-line-right-width: 0px;
  position: relative;
  overflow: visible !important;
}

.headline-with-lines::before,
.headline-with-lines::after {
  content: "";
  position: absolute;
  top: var(--headline-line-top);
  height: 0;
  border-top: var(--headline-line-thickness) solid var(--headline-line-color);
  opacity: var(--headline-line-opacity);
  pointer-events: none;
  transform: translateY(-50%);
}

.headline-with-lines::before {
  left: var(--headline-line-left-start);
  width: var(--headline-line-left-width);
}

.headline-with-lines::after {
  left: var(--headline-line-right-start);
  width: var(--headline-line-right-width);
}

.headline-with-lines .et_pb_text_inner,
.headline-with-lines .et_pb_heading_container {
  position: relative;
  z-index: 1;
}

.headline-with-lines .et_pb_module_header,
.headline-with-lines .et_pb_text_inner > h1,
.headline-with-lines .et_pb_text_inner > h2,
.headline-with-lines .et_pb_text_inner > h3,
.headline-with-lines .et_pb_text_inner > h4,
.headline-with-lines .et_pb_text_inner > h5,
.headline-with-lines .et_pb_text_inner > h6,
h1.headline-with-lines,
h2.headline-with-lines,
h3.headline-with-lines,
h4.headline-with-lines,
h5.headline-with-lines,
h6.headline-with-lines {
  position: relative;
  z-index: 1;
}

@media (max-width: 767px) {
  .headline-with-lines {
    --headline-line-gap: 16px;
    --headline-edge-offset: 16px;
  }
}






/* Colapses row with 3 columns under each otehr at 1100 px width */

@media only screen and (max-width: 1100px) {
  .stack-at-1100.et_pb_row,
  .stack-at-1100.et_pb_row_inner {
    flex-wrap: wrap !important;
  }

  .stack-at-1100 > .et_pb_column {
    width: 100% !important;
    margin-right: 0 !important;
    margin-bottom: 16px !important;
  }

  .stack-at-1100 > .et_pb_column:last-child {
    margin-bottom: 0 !important;
  }
}



/* spacing three home page ctas equaly */

.hero-cta-group {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  justify-content: flex-start;
  align-items: center;
}

.hero-cta-group .et_pb_button_module_wrapper {
  margin: 0 !important;
}

.hero-cta-group .et_pb_button {
  white-space: nowrap;
}

.testimonial-carousel .et_pb_group_carousel_arrow {
  width: 44px;
  height: 44px;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  display: flex;
  align-items: center;
  justify-content: center;
}




/* custom arrows carousel */

.et_pb_group_carousel_5 .et_pb_group_carousel_arrow_prev,
.et_pb_group_carousel_5 .et_pb_group_carousel_arrow_next {
  display: block !important;
  width: 35px !important;
  height: 35px !important;
  min-width: 35px !important;
  min-height: 35px !important;
  color: transparent !important;
  font-size: 0 !important;
  line-height: 0 !important;
  text-indent: -9999px;
  overflow: hidden;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: contain !important;
  background-color: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

.et_pb_group_carousel_5 .et_pb_group_carousel_arrow_prev::before,
.et_pb_group_carousel_5 .et_pb_group_carousel_arrow_prev::after,
.et_pb_group_carousel_5 .et_pb_group_carousel_arrow_next::before,
.et_pb_group_carousel_5 .et_pb_group_carousel_arrow_next::after {
  content: none !important;
  display: none !important;
}

.et_pb_group_carousel_5 .et_pb_group_carousel_arrow_prev *,
.et_pb_group_carousel_5 .et_pb_group_carousel_arrow_next * {
  display: none !important;
}

.et_pb_group_carousel_5 .et_pb_group_carousel_arrow_prev {
  background-image: url("https://hundstadgaard.no/wp-content/uploads/2026/03/Venstrepil-mork-gronn.svg") !important;
}

.et_pb_group_carousel_5 .et_pb_group_carousel_arrow_next {
  background-image: url("https://hundstadgaard.no/wp-content/uploads/2026/03/Hoyrepil-mork-gronn.svg") !important;
}















/* GRAVITY FORMS START */


/* === BRAND COLORS + BASE FORM TEXT === */
/* Shared brand colors and main text color for the whole Gravity Form */
body #gform_wrapper_1 {
  --gf-brand-turquoise: #8CF7D4;
  --gf-form-beige: #F7FFDC;
  color: var(--gf-form-beige);
}


/* === GLOBAL FORM TEXT === */
/* Standard labels, legends, descriptions, HTML fields, links, and form controls */
body #gform_wrapper_1 .gfield_label,
body #gform_wrapper_1 legend,
body #gform_wrapper_1 .gsection_title,
body #gform_wrapper_1 input,
body #gform_wrapper_1 select,
body #gform_wrapper_1 textarea,
body #gform_wrapper_1 .gfield_description,
body #gform_wrapper_1 .gf-helper-note,
body #gform_wrapper_1 .gfield_html,
body #gform_wrapper_1 a {
  color: var(--gf-form-beige);
}

body #gform_wrapper_1 input::placeholder,
body #gform_wrapper_1 textarea::placeholder {
  color: var(--gf-form-beige);
  opacity: 1;
}


/* === REGISTRATION LINK === */
/* Keeps the helper link beige with a visible underline */
body #gform_wrapper_1 .gf-helper-link {
  color: var(--gf-form-beige) !important;
  text-decoration: none !important;
  border-bottom: 1px solid currentColor;
  display: inline-block;
  line-height: 1.2;
}


/* === REUSABLE CHECKBOX FIELD === */
/* Checkbox sits close to the label and stays vertically centered */
body #gform_wrapper_1 .gf-toggle-checkbox {
  position: relative;
  min-height: 24px;
}

body #gform_wrapper_1 .gf-toggle-checkbox .gfield_label {
  display: inline-block;
  margin: 0;
  min-width: 52px;
  line-height: 24px;
  white-space: nowrap;
  padding-left: 32px; 
}

body #gform_wrapper_1 .gf-toggle-checkbox .ginput_container_checkbox {
  position: absolute;
  top: 50%;
  left: 0px;
  transform: translateY(-113%);
  margin-top: 0;
}

body #gform_wrapper_1 .gf-toggle-checkbox .gfield_checkbox,
body #gform_wrapper_1 .gf-toggle-checkbox .gchoice {
  display: flex;
  align-items: center;
}

body #gform_wrapper_1 .gf-toggle-checkbox input[type="checkbox"] {
  margin: 0;
}


/* === PRODUCT COLUMN === */
/* Image + product name */
body #gform_wrapper_1 .gf-row-product-main .gf-product-main {
  display: grid;
  grid-template-columns: 40px minmax(0, 1fr);
  column-gap: 12px;
  align-items: start;
}

body #gform_wrapper_1 .gf-row-product-main .gf-product-media {
  line-height: 0;
}

body #gform_wrapper_1 .gf-row-product-main .gf-product-media img {
  display: block;
  width: 40px;
  height: 40px;
  object-fit: cover;
}

body #gform_wrapper_1 .gf-row-product-main .gf-product-name {
  font-weight: 600;
  line-height: 1.2;
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: normal;
  max-width: 12ch;
  align-self: start;
}



/* === META COLUMN === */
/* Weight + price */
body #gform_wrapper_1 .gf-row-meta {
  text-align: left !important;
}

body #gform_wrapper_1 .gf-row-meta .gf-product-meta-wrap {
  display: grid;
  grid-template-columns: minmax(0, 72px) minmax(0, 46px);
  column-gap: 37px;
  align-items: start;
  justify-content: start;
}

body #gform_wrapper_1 .gf-row-meta .gf-product-meta,
body #gform_wrapper_1 .gf-row-meta .gf-product-price {
  line-height: 1.2;
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: normal;
}



/* === QUANTITY FIELD === */
/* Native Gravity Forms quantity with dark background and beige arrow */
body #gform_wrapper_1 .gf-row-qty {
  --gf-icon-ctrl-select: url("data:image/svg+xml,%3Csvg width='10' height='6' viewBox='0 0 10 6' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M0.292893 0.292893C0.683417 -0.097631 1.31658 -0.097631 1.70711 0.292893L5 3.58579L8.29289 0.292893C8.68342 -0.0976311 9.31658 -0.0976311 9.70711 0.292893C10.0976 0.683417 10.0976 1.31658 9.70711 1.70711L5.70711 5.70711C5.31658 6.09763 4.68342 6.09763 4.29289 5.70711L0.292893 1.70711C-0.0976311 1.31658 -0.0976311 0.683418 0.292893 0.292893Z' fill='%23F7FFDC'/%3E%3C/svg%3E");
  display: flex;
  justify-content: center;
  position: relative;
  left: 0;
}

body #gform_wrapper_1 .gf-row-qty .ginput_container {
  width: auto;
  margin-top: 0;
}

body #gform_wrapper_1 .gf-row-qty .gfield_label {
  text-align: center;
}

body #gform_wrapper_1 .gf-row-qty input,
body #gform_wrapper_1 .gf-row-qty select {
  background-color: #314632 !important;
  border-color: #314632 !important;
  color: var(--gf-form-beige) !important;
}

body #gform_wrapper_1 .gf-row-qty select {
  background-image: var(--gf-icon-ctrl-select) !important;
  background-repeat: no-repeat;
  background-position: right 12px center;
  position: relative;
  top: -10px;
}


/* === TURQUOISE HEADERS === */
/* Labels above the four visible columns */
body #gform_wrapper_1 .gf-row-product-header .gf-product-header-main {
  color: var(--gf-brand-turquoise) !important;
  font-size: 12px;
  line-height: 1.2;
  white-space: nowrap;
}

body #gform_wrapper_1 .gf-row-meta-header {
  text-align: left !important;
}

body #gform_wrapper_1 .gf-row-meta-header .gf-product-header-meta {
  display: grid;
  grid-template-columns: 72px 90px;
  column-gap: 37px;
  justify-content: start;
  color: var(--gf-brand-turquoise) !important;
  font-size: 12px;
  line-height: 1.2;
  white-space: nowrap;
}

body #gform_wrapper_1 .gf-row-meta-header .gf-product-header-meta-label,
body #gform_wrapper_1 .gf-row-meta-header .gf-product-header-price-label {
  color: var(--gf-brand-turquoise) !important;
  white-space: nowrap;
}

body #gform_wrapper_1 .gf-row-meta-header .gf-product-header-price-label {
  position: relative;
  left: 0;
}

body #gform_wrapper_1 .gf-row-qty-header {
  text-align: center !important;
}

body #gform_wrapper_1 .gf-row-qty-header .gf-product-header-qty {
  display: block;
  color: var(--gf-brand-turquoise) !important;
  font-size: 12px;
  line-height: 1.2;
  text-align: center;
}

body #gform_wrapper_1 .gf-row-note-header .gf-product-header-note {
  color: var(--gf-brand-turquoise) !important;
  font-size: 12px;
  line-height: 1.2;
}


/* === MOBILE: FIRST LINE = PRODUCT + META === */
/* Applies to all copied rows through shared classes */
@media (max-width: 767px) {
  body #gform_wrapper_1 .gf-row-product-main,
  body #gform_wrapper_1 .gf-row-meta {
    grid-column: span 6 !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    align-self: start;
  }

  body #gform_wrapper_1 .gf-row-product-main .gf-product-main {
    grid-template-columns: 40px minmax(0, 1fr);
    padding-top: 45px;
  }

  body #gform_wrapper_1 .gf-row-product-main .gf-product-name {
    min-width: 0;
    white-space: normal;
    overflow-wrap: anywhere;
    word-break: break-word;
  }

  body #gform_wrapper_1 .gf-row-meta {
    padding-bottom: 8px !important;
  }

  body #gform_wrapper_1 .gf-row-meta .gf-product-meta-wrap {
    display: grid;
    grid-template-columns: minmax(0, 72px) minmax(0, 62px);
    column-gap: 14px;
    justify-content: start;
    align-items: start;
    padding-top: 45px;
  }

  body #gform_wrapper_1 .gf-row-meta .gf-product-meta,
  body #gform_wrapper_1 .gf-row-meta .gf-product-price {
    min-width: 0;
    display: block;
    overflow: visible;
    line-height: 1.35;
    white-space: normal;
    overflow-wrap: normal;
    word-break: normal;
  }
}

/* === MOBILE: QUANTITY === */
/* Quantity stays on its own row, right-aligned */
@media (max-width: 767px) {
  body #gform_wrapper_1 .gf-row-qty {
    grid-column: span 12 !important;
    justify-content: flex-end;
    left: -6px;
    margin-top: 15px !important;
    padding-bottom: 26px !important;
  }

  body #gform_wrapper_1 .gf-row-qty .ginput_container {
    width: auto;
    margin-top: 0;
  }

  body #gform_wrapper_1 .gf-row-qty select {
    top: -10px;
    margin-left: 0;
    margin-right: 0;
  }
}

/* === MOBILE: NOTES === */
/* Notes stay below quantity */
@media (max-width: 767px) {
  body #gform_wrapper_1 .gf-row-note {
    grid-column: span 12 !important;
    margin-top: 0 !important;
  }

  body #gform_wrapper_1 #gform_fields_1 {
    row-gap: 8px !important;
  }
}


/* === MOBILE: HIDE TURQUOISE PRODUCT HEADERS === */
@media (max-width: 767px) {
  body #gform_wrapper_1 .gf-row-product-header,
  body #gform_wrapper_1 .gf-row-meta-header,
  body #gform_wrapper_1 .gf-row-qty-header,
  body #gform_wrapper_1 .gf-row-note-header {
    display: none !important;
  }
}


/* === HIDDEN PRODUCT ROWS: REMOVE HIDDEN FIELDS FROM THE 4-COLUMN GRID === */
/* Keeps copied rows aligned when Gravity Forms fields are hidden in the frontend */
body #gform_wrapper_1 .gf-row-product-main.gfield_visibility_hidden,
body #gform_wrapper_1 .gf-row-meta.gfield_visibility_hidden,
body #gform_wrapper_1 .gf-row-qty.gfield_visibility_hidden,
body #gform_wrapper_1 .gf-row-note.gfield_visibility_hidden,
body #gform_wrapper_1 .gf-row-product-header.gfield_visibility_hidden,
body #gform_wrapper_1 .gf-row-meta-header.gfield_visibility_hidden,
body #gform_wrapper_1 .gf-row-qty-header.gfield_visibility_hidden,
body #gform_wrapper_1 .gf-row-note-header.gfield_visibility_hidden {
  display: none !important;
  margin: 0 !important;
  padding: 0 !important;
}



/* === SECTION TOGGLE: PLACE CHECKBOX TO THE LEFT OF THE SECTION TITLE === */
/* Use on a Section field followed immediately by its checkbox field */
body #gform_wrapper_1 .gf-section-toggle-title {
  grid-column: 1 / -1 !important;
  margin-bottom: 0 !important;
  padding-left: 32px;
  position: relative;
}

body #gform_wrapper_1 .gf-section-toggle-title .gsection_title {
  margin-bottom: 0 !important;
}

body #gform_wrapper_1 .gf-section-toggle-title + .gf-section-toggle-checkbox {
  grid-column: 1 / -1 !important;
  width: 0 !important;
  height: 0 !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  position: relative;
  z-index: 2;
}

body #gform_wrapper_1 .gf-section-toggle-title + .gf-section-toggle-checkbox .gfield_label {
  display: none !important;
}

body #gform_wrapper_1 .gf-section-toggle-title + .gf-section-toggle-checkbox .ginput_container_checkbox {
  position: relative !important;
  top: -80px;
  left: 0;
  transform: none !important;
  margin: 0 !important;
}

body #gform_wrapper_1 .gf-section-toggle-title + .gf-section-toggle-checkbox .gfield_checkbox,
body #gform_wrapper_1 .gf-section-toggle-title + .gf-section-toggle-checkbox .gchoice {
  display: flex;
  align-items: center;
}

body #gform_wrapper_1 .gf-section-toggle-title + .gf-section-toggle-checkbox input[type="checkbox"] {
  margin: 0;
}

/* === MOBILE ONLY: KEEP THE SECTION CHECKBOX LEFT OF THE TITLE === */
/* Positions the checkbox to the left of the section title on phones */
@media (max-width: 767px) {
  body #gform_wrapper_1 .gf-section-toggle-title {
    grid-column: 1 / -1 !important;
    padding-left: 28px;
  }

  body #gform_wrapper_1 .gf-section-toggle-title + .gf-section-toggle-checkbox {
    grid-column: 1 / -1 !important;
    width: 0 !important;
    height: 0 !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
  }

  body #gform_wrapper_1 .gf-section-toggle-title + .gf-section-toggle-checkbox .ginput_container_checkbox {
    position: relative !important;
    top: -47px;
    left: 0;
    transform: none !important;
    margin: 0 !important;
  }
}

/* === CATEGORY CHECKBOX: ALIGN NORMAL TOGGLES WITH THE SECTION TOGGLE === */
/* Moves Potet-style checkbox fields slightly left to match the section title/checkbox line above */
body #gform_wrapper_1 .gf-toggle-checkbox:not(.gf-section-toggle-checkbox) {
  margin-left: 25px;
}

/* === CATEGORY CHECKBOX LABEL SIZE === */
/* Sets Potet-style checkbox labels to 22px */
body #gform_wrapper_1 .gf-toggle-checkbox:not(.gf-section-toggle-checkbox) .gfield_label {
  font-size: 18px;
}

/* === TOGGLE CHECKBOXES: HIDE THE INLINE CHOICE LABEL === */
/* We use the field label as the visible text, so the inner choice label should stay hidden */
body #gform_wrapper_1 .gf-section-toggle-checkbox .gform-field-label--type-inline,
body #gform_wrapper_1 .gf-toggle-checkbox .gform-field-label--type-inline {
  display: none !important;
}


/* === SECTION TOGGLE: NUDGE THE GRØNNSAKER CHECKBOX BACK LEFT === */
/* Re-aligns the main group checkbox with Potet and Røtter after hiding the inline label */
body #gform_wrapper_1 .gf-section-toggle-title + .gf-section-toggle-checkbox .ginput_container_checkbox {
  left: 0;
}



/* === MAIN FORM SECTION TITLES === */
/* Reusable centered beige H3 headings for top-level form sections */
body #gform_wrapper_1 .gf-main-section-heading {
  margin: 56px 0 28px;
  color: var(--gf-form-beige);
  font-size: 34px;
  line-height: 1.7;
  text-align: center;
  font-weight: 400;
  padding-bottom: 60px;
}

@media (max-width: 767px) {
  body #gform_wrapper_1 .gf-main-section-heading {
    margin: 40px 0 22px;
    font-size: 28px;
	padding-bottom: 50px;
  }
}

/* === END OF VEGETABLE GROUP === */
/* Adds space below the last visible vegetable subgroup */
body #gform_wrapper_1 .gf-end-of-veg-group {
  margin-bottom: 56px !important;
}

/* === PRODUCT SECTION TITLES + SUBGROUP LABELS === */
/* Main category titles stay green, subgroup labels return to beige */
body #gform_wrapper_1 .gf-semantic-h4 .gsection_title {
  color: #CAFA94 !important;
}

body #gform_wrapper_1 .gf-toggle-checkbox:not(.gf-section-toggle-checkbox) .gfield_label {
  color: var(--gf-form-beige) !important;
}




/* === CHECKBOXES: DARK GREEN FILL WITH BEIGE STROKE === */
/* Styles both main-group and subgroup checkboxes */
body #gform_wrapper_1 input[type="checkbox"] {
  appearance: none;
  -webkit-appearance: none;
  width: 20px;
  height: 20px;
  background: #314632;
  border: 1.5px solid var(--gf-form-beige);
  border-radius: 2px;
  display: inline-grid;
  place-content: center;
  cursor: pointer;
}

body #gform_wrapper_1 input[type="checkbox"]::before {
  content: "";
  width: 10px;
  height: 10px;
  transform: scale(0);
  transition: transform 120ms ease-in-out;
  background: var(--gf-form-beige);
  clip-path: polygon(14% 44%, 0 65%, 50% 100%, 100% 16%, 80% 0, 43% 62%);
}

body #gform_wrapper_1 input[type="checkbox"]:checked::before {
  transform: scale(1);
}


/* === DELIVERY SUBHEADING === */
/* Makes Metoder match the green H4 subgroup headings */
body #gform_wrapper_1 .gf-delivery-subheading {
  margin: 0;
  color: #CAFA94 !important;
  font-size: 22px;
  line-height: 1.2;
  font-weight: 400;
}


/* === DELIVERY EXPLANATORY TEXT === */
/* Beige helper text to the right of Metoder */
body #gform_wrapper_1 .gf-delivery-note,
body #gform_wrapper_1 .gf-delivery-note p {
  color: var(--gf-form-beige);
  font-size: 16px;
  line-height: 1.35;
  margin: 0 0 18px;
}

body #gform_wrapper_1 .gf-delivery-note p:last-child {
  margin-bottom: 0;
}







/* === DELIVERY SHIPPING FIELD === */
/* Styles the shipping methods as: method, guide line, price, selector */
body #gform_wrapper_1 .gf-delivery-shipping,
body #gform_wrapper_1 #field_1_184 {
  max-width: 760px;
}

/* Hide the native legend visually, but keep it for accessibility */
body #gform_wrapper_1 .gf-delivery-shipping > .gfield_label,
body #gform_wrapper_1 #field_1_184 > .gfield_label {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

/* Real H4 inserted by PHP */
body #gform_wrapper_1 .gf-delivery-shipping-heading {
  margin: 0 0 18px;
}


body #gform_wrapper_1 .gf-delivery-shipping .ginput_container_radio,
body #gform_wrapper_1 #field_1_184 .ginput_container_radio {
  margin-top: 0;
}

body #gform_wrapper_1 .gf-delivery-shipping .gfield_radio,
body #gform_wrapper_1 #field_1_184 .gfield_radio {
  display: grid;
  row-gap: 14px;
}

body #gform_wrapper_1 .gf-delivery-shipping .gchoice,
body #gform_wrapper_1 #field_1_184 .gchoice {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto 22px;
  column-gap: 14px;
  align-items: center;
}

/* Hide the live label text visually; Gravity Forms can still mutate it */
body #gform_wrapper_1 .gf-delivery-shipping .gchoice label,
body #gform_wrapper_1 #field_1_184 .gchoice label {
  grid-column: 1;
  grid-row: 1;
  min-width: 0;
  margin: 0;
  color: transparent !important;
  font-size: 0;
  display: flex;
  align-items: center;
  gap: 14px;
}

/* Render the visible method names ourselves */
body #gform_wrapper_1 .gf-delivery-shipping .gchoice label::before,
body #gform_wrapper_1 #field_1_184 .gchoice label::before {
  color: var(--gf-form-beige);
  font-size: 16px;
  line-height: 1.2;
  white-space: nowrap;
}

body #gform_wrapper_1 .gf-delivery-shipping .gchoice_1_184_0 label::before,
body #gform_wrapper_1 #field_1_184 .gchoice_1_184_0 label::before {
  content: "Hent på gård";
}

body #gform_wrapper_1 .gf-delivery-shipping .gchoice_1_184_1 label::before,
body #gform_wrapper_1 #field_1_184 .gchoice_1_184_1 label::before {
  content: "Møt oss på neste REKO-ring Harstad";
}

body #gform_wrapper_1 .gf-delivery-shipping .gchoice_1_184_2 label::before,
body #gform_wrapper_1 #field_1_184 .gchoice_1_184_2 label::before {
  content: "Hentepunkt Røde Kors Borkenes";
}

body #gform_wrapper_1 .gf-delivery-shipping .gchoice_1_184_3 label::before,
body #gform_wrapper_1 #field_1_184 .gchoice_1_184_3 label::before {
  content: "Hentepunkt Kinsarvik Sjøkanten Senter";
}

body #gform_wrapper_1 .gf-delivery-shipping .gchoice_1_184_4 label::before,
body #gform_wrapper_1 #field_1_184 .gchoice_1_184_4 label::before {
  content: "Tilleggslevering for abonnementskunder";
}

/* Guide line */
body #gform_wrapper_1 .gf-delivery-shipping .gchoice label::after,
body #gform_wrapper_1 #field_1_184 .gchoice label::after {
  content: "";
  flex: 1 1 auto;
  min-width: 28px;
  border-bottom: 1px solid var(--gf-form-beige);
  opacity: 0.9;
}

/* Price column */
body #gform_wrapper_1 .gf-delivery-shipping .gchoice::after,
body #gform_wrapper_1 #field_1_184 .gchoice::after {
  grid-column: 2;
  grid-row: 1;
  color: var(--gf-form-beige);
  white-space: nowrap;
}

body #gform_wrapper_1 .gf-delivery-shipping .gchoice_1_184_0::after,
body #gform_wrapper_1 #field_1_184 .gchoice_1_184_0::after {
  content: "0kr";
}

body #gform_wrapper_1 .gf-delivery-shipping .gchoice_1_184_1::after,
body #gform_wrapper_1 #field_1_184 .gchoice_1_184_1::after {
  content: "0kr";
}

body #gform_wrapper_1 .gf-delivery-shipping .gchoice_1_184_2::after,
body #gform_wrapper_1 #field_1_184 .gchoice_1_184_2::after {
  content: "39kr";
}

body #gform_wrapper_1 .gf-delivery-shipping .gchoice_1_184_3::after,
body #gform_wrapper_1 #field_1_184 .gchoice_1_184_3::after {
  content: "39kr";
}

body #gform_wrapper_1 .gf-delivery-shipping .gchoice_1_184_4::after,
body #gform_wrapper_1 #field_1_184 .gchoice_1_184_4::after {
  content: "0kr";
}



/* Selector on the right */
body #gform_wrapper_1 .gf-delivery-shipping .gchoice input[type="radio"],
body #gform_wrapper_1 #field_1_184 .gchoice input[type="radio"] {
  grid-column: 3;
  grid-row: 1;
  justify-self: end;
  align-self: center;
  margin: 0;
  appearance: none;
  -webkit-appearance: none;
  width: 16px;
  height: 16px;
  background: #314632;
  border: 1.5px solid var(--gf-form-beige);
  border-radius: 50%;
  display: inline-grid;
  place-content: center;
  cursor: pointer;
}

body #gform_wrapper_1 .gf-delivery-shipping .gchoice input[type="radio"]::before,
body #gform_wrapper_1 #field_1_184 .gchoice input[type="radio"]::before {
  content: "";
  width: 8px;
  height: 8px;
  transform: scale(0);
  border-radius: 50%;
  background: var(--gf-form-beige);
}

body #gform_wrapper_1 .gf-delivery-shipping .gchoice input[type="radio"]:checked::before,
body #gform_wrapper_1 #field_1_184 .gchoice input[type="radio"]:checked::before {
  transform: scale(1);
}

@media (max-width: 767px) {
  body #gform_wrapper_1 .gf-delivery-shipping .gfield_label,
  body #gform_wrapper_1 #field_1_184 .gfield_label {
    font-size: 20px;
  }

  body #gform_wrapper_1 .gf-delivery-shipping .gchoice,
  body #gform_wrapper_1 #field_1_184 .gchoice {
    column-gap: 10px;
  }

  body #gform_wrapper_1 .gf-delivery-shipping .gchoice label,
  body #gform_wrapper_1 #field_1_184 .gchoice label {
    gap: 10px;
  }

  body #gform_wrapper_1 .gf-delivery-shipping .gchoice label::before,
  body #gform_wrapper_1 #field_1_184 .gchoice label::before {
    font-size: 16px;
  }
}



/* === DELIVERY SHIPPING FIELD: MOBILE === */
/* Simplifies the shipping rows on phones so the method, price, and selector stay aligned */
@media (max-width: 767px) {
  body #gform_wrapper_1 .gf-delivery-shipping .gchoice,
  body #gform_wrapper_1 #field_1_184 .gchoice {
    grid-template-columns: minmax(0, 1fr) auto 20px;
    column-gap: 8px;
    align-items: start;
  }

  body #gform_wrapper_1 .gf-delivery-shipping .gchoice label,
  body #gform_wrapper_1 #field_1_184 .gchoice label {
    gap: 0;
    align-items: flex-start;
  }

  body #gform_wrapper_1 .gf-delivery-shipping .gchoice label::before,
  body #gform_wrapper_1 #field_1_184 .gchoice label::before {
    font-size: 16px;
    line-height: 1.3;
    white-space: normal;
  }

  body #gform_wrapper_1 .gf-delivery-shipping .gchoice label::after,
  body #gform_wrapper_1 #field_1_184 .gchoice label::after {
    display: none;
  }

  body #gform_wrapper_1 .gf-delivery-shipping .gchoice::after,
  body #gform_wrapper_1 #field_1_184 .gchoice::after {
    font-size: 16px;
    align-self: start;
    padding-top: 1px;
  }

  body #gform_wrapper_1 .gf-delivery-shipping .gchoice input[type="radio"],
  body #gform_wrapper_1 #field_1_184 .gchoice input[type="radio"] {
    width: 15px;
    height: 15px;
    align-self: start;
    margin-top: 2px;
  }

  body #gform_wrapper_1 .gf-delivery-shipping .gchoice input[type="radio"]::before,
  body #gform_wrapper_1 #field_1_184 .gchoice input[type="radio"]::before {
    width: 7px;
    height: 7px;
  }
}

/* === SHIPPING FIELD: MORE SPACE ABOVE METODER === */
/* Adds breathing room above the shipping module */
body #gform_wrapper_1 .gf-delivery-shipping,
body #gform_wrapper_1 #field_1_184 {
  margin-top: 30px;
  padding-top: 20px;
}


/* === DATE FIELD === */
/* Green H4 label, dark green input, and extra space above the field */
body #gform_wrapper_1 #field_1_185 {
  padding-top: 70px;
}

body #gform_wrapper_1 #field_1_185 .gfield_label {
  display: block !important;
  margin: 0 0 18px !important;
  color: #CAFA94 !important;
  font-size: 22px;
  line-height: 1.2;
  font-weight: 400;
}

body #gform_wrapper_1 #field_1_185 input,
body #gform_wrapper_1 #field_1_185 .datepicker {
  background-color: #314632 !important;
  border: 1px solid #314632 !important;
  color: var(--gf-form-beige) !important;
}

body #gform_wrapper_1 #field_1_185 input::placeholder,
body #gform_wrapper_1 #field_1_185 .datepicker::placeholder {
  color: var(--gf-form-beige) !important;
  opacity: 1;
}


body #gform_wrapper_1 #field_1_185 input::placeholder,
body #gform_wrapper_1 #field_1_185 .datepicker::placeholder {
  color: var(--gf-form-beige) !important;
  opacity: 1;
  font-size: 16px;
}

/* === DATE FIELD: LEFT-ALIGN PLACEHOLDER === */
/* Keeps the date text starting flush left inside the dark field */
body #gform_wrapper_1 #field_1_185 input,
body #gform_wrapper_1 #field_1_185 .datepicker {
  text-align: left !important;
  padding-left: 0 !important;
}


body #gform_wrapper_1 .gf-required-note {
  color: var(--gf-form-beige);
  font-size: 16px;
  line-height: 1.3;
  margin: 0;
}

body #gform_wrapper_1 .gf-required-asterisk {
  color: var(--gf-form-beige);
}



/* === CUSTOMER FIELDS: DARK GREEN INPUTS === */
/* Makes text, email, phone, and address inputs dark green */
body #gform_wrapper_1 input[type="text"],
body #gform_wrapper_1 input[type="email"],
body #gform_wrapper_1 input[type="tel"],
body #gform_wrapper_1 textarea,
body #gform_wrapper_1 select {
  background-color: #314632 !important;
  border: 1px solid var(--gf-form-beige) !important;
  color: var(--gf-form-beige) !important;
}

body #gform_wrapper_1 input::placeholder,
body #gform_wrapper_1 textarea::placeholder {
  color: var(--gf-form-beige);
  opacity: 1;
}

/* === ADDRESS SUBLABELS: H4 LOOK === */
/* Makes address sublabels match the green H4-style customer headings */
/* Hide native address sublabels, keep for accessibility */
body #gform_wrapper_1 #input_1_191_3_label,
body #gform_wrapper_1 #input_1_191_5_label {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}


/* Put each address subfield in a vertical stack so the label sits above the input */
body #gform_wrapper_1 .gf-customer-address .ginput_full,
body #gform_wrapper_1 .gf-customer-address .ginput_left,
body #gform_wrapper_1 .gf-customer-address .ginput_right {
  display: flex;
  flex-direction: column;
}

/* Optional: hide Address Line 2 if you do not need it */
body #gform_wrapper_1 .gf-customer-address .address_line_2,
body #gform_wrapper_1 .gf-customer-address .address_line_2 + label {
  display: none !important;
}


/* === CUSTOMER FIELD HEADINGS === */
/* Real H4 headings above customer fields */
body #gform_wrapper_1 .gf-field-heading {
  margin: 0 0 12px;
  color: #CAFA94 !important;
  font-size: 22px;
  line-height: 1.2;
  font-weight: 400;
}

/* === CUSTOMER SECTION: SPACE ABOVE FIELD HEADINGS === */
body #gform_wrapper_1 #field_1_188,
body #gform_wrapper_1 #field_1_189,
body #gform_wrapper_1 #field_1_190,
body #gform_wrapper_1 #field_1_191 {
  padding-top: 35px;
}



/* === CUSTOMER INPUTS: TIGHTER GAP UNDER GREEN HEADINGS === */
/* Makes Navn, Tlf, and E-post sit closer to their fields like Adresse/Postnummer */
body #gform_wrapper_1 .gf-customer-field {
  margin-top: 0 !important;
}

body #gform_wrapper_1 .gf-customer-field .ginput_container {
  margin-top: 0 !important;
}

body #gform_wrapper_1 #field_1_188,
body #gform_wrapper_1 #field_1_189,
body #gform_wrapper_1 #field_1_190 {
  margin-top: -50px !important;
}

@media (max-width: 767px) {
  body #gform_wrapper_1 #field_1_188,
  body #gform_wrapper_1 #field_1_189,
  body #gform_wrapper_1 #field_1_190 {
    margin-top: -18px !important;
  }
}



body #gform_wrapper_1 .gf-delivery-shipping-heading {
  font-family: "Faculty Glyphic", Helvetica, Arial, Lucida, sans-serif;
  font-size: 18px;
  line-height: 1.7em;
  color: #CAFA94 !important;
}

body #gform_wrapper_1 .gf-delivery-shipping-heading,
body #gform_wrapper_1 .gf-delivery-date-heading,
body #gform_wrapper_1 .gf-customer-native-heading,
body #gform_wrapper_1 .gf-address-native-heading {
  font-family: "Faculty Glyphic", Helvetica, Arial, Lucida, sans-serif;
  font-size: 18px;
  line-height: 1.7em;
  font-weight: 400;
  color: #CAFA94 !important;
  margin: 0 0 12px;
}



/* Hide native labels only when the field is NOT in error */
body #gform_wrapper_1 .gf-customer-field:not(.gfield_error) > .gfield_label,
body #gform_wrapper_1 .gf-delivery-shipping:not(.gfield_error) > .gfield_label,
body #gform_wrapper_1 #field_1_184:not(.gfield_error) > .gfield_label,
body #gform_wrapper_1 #field_1_185:not(.gfield_error) > .gfield_label {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}


body #gform_wrapper_1 .gf-privacy-consent {
  color: var(--gf-form-beige);
  margin: 0;
}

body #gform_wrapper_1 .gf-privacy-consent a {
  color: var(--gf-form-beige) !important;
  text-decoration: none !important;
  border-bottom: 1px solid currentColor;
  padding-bottom: 2px;
}

/* === CONSENT ROW: BRING TEXT CLOSER TO THE CHECKBOX === */
body #gform_wrapper_1 #field_1_197 {
  grid-column: span 1 !important;
  margin: 0 !important;
  align-self: start;
}

body #gform_wrapper_1 #field_1_197 .ginput_container_consent {
  margin-top: 0 !important;
}

body #gform_wrapper_1 #field_1_198 {
  grid-column: span 11 !important;
  margin-left: -28px !important;
}


body #gform_wrapper_1 #field_1_198 .gf-privacy-consent {
  margin: 0 !important;
}

@media (max-width: 767px) {
  body #gform_wrapper_1 #field_1_198 {
    margin-left: 5px !important;
  }
}

/* === CONSENT ROWS: KEEP TEXT CLOSE TO THE CHECKBOX === */
body #gform_wrapper_1 #field_1_197,
body #gform_wrapper_1 #field_1_199 {
  grid-column: span 1 !important;
  margin: 0 !important;
  align-self: start;
  padding-top: 30px;
}

body #gform_wrapper_1 #field_1_197 .ginput_container_consent,
body #gform_wrapper_1 #field_1_199 .ginput_container_consent {
  position: relative;
  display: inline-block;
  margin-top: 0 !important;
}

body #gform_wrapper_1 #field_1_198,
body #gform_wrapper_1 #field_1_200 {
  grid-column: span 11 !important;
  margin: 0 !important;
  padding-top: 30px;
  padding-left: 0 !important;
  margin-left: -28px !important;
}

body #gform_wrapper_1 #field_1_198 .gf-privacy-consent,
body #gform_wrapper_1 #field_1_200 .gf-newsletter-note {
  margin: 0 !important;
}

@media (max-width: 767px) {
  body #gform_wrapper_1 #field_1_198,
  body #gform_wrapper_1 #field_1_200 {
    margin-left: 5px !important;
  }
}

/* === CONSENT CHECKBOX: REQUIRED ASTERISK === */
/* Adds a visual asterisk above the required privacy consent checkbox */
body #gform_wrapper_1 #field_1_197,
body #gform_wrapper_1 #field_1_197 .ginput_container_consent {
  position: relative !important;
  overflow: visible !important;
}

body #gform_wrapper_1 #field_1_197::before {
  content: none !important;
}

body #gform_wrapper_1 #field_1_197 .ginput_container_consent::before {
  content: "*";
  position: absolute;
  top: -18px;
  left: 0;
  color: #CAFA94 !important;
  font-size: 16px;
  line-height: 1;
  z-index: 999;
  display: block;
}



/* === METODER: REQUIRED ASTERISK === */
/* Adds a visual asterisk at the top-left of the visible H4 heading */
body #gform_wrapper_1 .gf-delivery-shipping-heading {
  position: relative;
  display: inline-block;
}

body #gform_wrapper_1 .gf-delivery-shipping-heading::before {
  content: "*";
  position: absolute;
  top: 6px;
  left: -11px;
  color: #CAFA94;
  font-size: 16px;
  line-height: 1;
}

/* === SUBMIT BUTTON === */
/* Dark green button with beige border and a lower, flatter shape */
body #gform_wrapper_1 .gform_footer input[type="submit"],
body #gform_wrapper_1 .gform_page_footer input[type="submit"],
body #gform_wrapper_1 .gform_button {
  background-color: #314632 !important;
  color: var(--gf-form-beige) !important;
  border: 1px solid var(--gf-form-beige) !important;
  border-radius: 4px !important;
  box-shadow: none !important;
  height: auto !important;
  min-height: 0 !important;
  line-height: 1.2 !important;
  padding: 4px 22px !important;
}


/* === SUBMIT BUTTON: DIVI-LIKE HOVER ARROW === */
body #gform_wrapper_1 .gform_footer input[type="submit"],
body #gform_wrapper_1 .gform_page_footer input[type="submit"],
body #gform_wrapper_1 .gform_button {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 10 10' fill='none'%3E%3Cpath d='M3 1.5L7 5L3 8.5' stroke='%23F7FFDC' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: right 12px center !important;
  background-size: 0 10px !important;
  transition: padding 0.2s ease, background-size 0.2s ease, transform 0.2s ease;
}

body #gform_wrapper_1 .gform_footer input[type="submit"]:hover,
body #gform_wrapper_1 .gform_page_footer input[type="submit"]:hover,
body #gform_wrapper_1 .gform_button:hover {
  padding-right: 34px !important;
  background-size: 10px 10px !important;
  transform: scale(1.02);
}

body #gform_wrapper_1 .gform_footer,
body #gform_wrapper_1 .gform_page_footer {
  margin-top: 60px !important;
}



/* === TOTAL FIELD === */
/* Gives the total room to breathe and makes it read like a summary, not an editable input. */
body #gform_wrapper_1 .gfield--type-total {
  margin-top: 28px;
}

body #gform_wrapper_1 .gfield--type-total .gfield_label {
  margin-bottom: 10px !important;
}

body #gform_wrapper_1 .gfield--type-total .ginput_container_total input,
body #gform_wrapper_1 .gfield--type-total input.ginput_total {
  width: auto !important;
  min-width: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--gf-form-beige) !important;
  font-size: 16px !important;
  line-height: 1.1 !important;
}

body #gform_wrapper_1 .gf-total-heading {
  font-family: "Faculty Glyphic", Helvetica, Arial, Lucida, sans-serif;
  font-size: 18px;
  line-height: 1.7em;
  font-weight: 400;
  color: #CAFA94 !important;
  margin: 0 0 12px !important;
}



body #gform_wrapper_1 .gfield--type-total {
  margin-top: 90px !important;
}

body #gform_wrapper_1 .gfield--type-total {
  border-top: 1px solid var(--gf-form-beige);
  padding-top: 18px;
  margin-top: 28px;
}



/* On validation error, reveal the label container but hide the label text */
body #gform_wrapper_1 .gfield_error > .gfield_label {
  position: static !important;
  width: auto !important;
  height: auto !important;
  padding: 0 !important;
  margin: 8px 0 0 !important;
  overflow: visible !important;
  clip: auto !important;
  white-space: normal !important;
  border: 0 !important;
  display: block !important;
  color: transparent !important;
  font-size: 0 !important;
  line-height: 0 !important;
}

/* Keep the native "(Required)" hidden, but output your own message */
body #gform_wrapper_1 .gfield_error > .gfield_label .gfield_required_text {
  display: inline !important;
  color: transparent !important;
  font-size: 0 !important;
  line-height: 0 !important;
}

body #gform_wrapper_1 .gfield_error > .gfield_label .gfield_required_text::after {
  content: "Obligatorisk felt";
  color: #f4b6b6;
  font-size: 14px;
  line-height: 1.4;
}



/* === REQUIRED + VALIDATION FIX === */
/* Paste this at the very end of your Gravity Forms CSS */

/* Keep native labels hidden, even on error */
body #gform_wrapper_1 .gf-customer-field > .gfield_label,
body #gform_wrapper_1 .gf-delivery-shipping > .gfield_label,
body #gform_wrapper_1 #field_1_184 > .gfield_label,
body #gform_wrapper_1 #field_1_185 > .gfield_label,
body #gform_wrapper_1 .gfield_error > .gfield_label {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
  display: block !important;
  color: inherit !important;
  font-size: inherit !important;
  line-height: inherit !important;
}

/* Never show the native Gravity Forms "(Required)" text */
body #gform_wrapper_1 .gfield_required_text,
body #gform_wrapper_1 .gfield_consent_label .gfield_required_text {
  display: none !important;
}

/* Cancel the earlier pseudo-message hack */
body #gform_wrapper_1 .gfield_error > .gfield_label .gfield_required_text::after {
  content: none !important;
}

/* Show the real Gravity Forms field validation messages */
body #gform_wrapper_1 .gfield_validation_message,
body #gform_wrapper_1 .gfield_error .validation_message {
  display: block !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  color: #FF970E !important;
  font-size: 14px !important;
  line-height: 1.4 !important;
  margin-top: 8px !important;
  padding: 0 !important;
}

/* Top validation summary */
body #gform_wrapper_1 .gform_validation_errors,
body #gform_wrapper_1 .validation_error {
  background: rgba(244, 182, 182, 0.08) !important;
  border: 1px solid rgba(244, 182, 182, 0.45) !important;
  color: #FF970E !important;
  box-shadow: none !important;
}

/* Highlight invalid fields */
body #gform_wrapper_1 .gfield_error input[type="text"],
body #gform_wrapper_1 .gfield_error input[type="email"],
body #gform_wrapper_1 .gfield_error input[type="tel"],
body #gform_wrapper_1 .gfield_error textarea,
body #gform_wrapper_1 .gfield_error select,
body #gform_wrapper_1 .gfield_error input[type="checkbox"],
body #gform_wrapper_1 .gfield_error input[type="radio"] {
  border-color: #FF970E !important;
}

/* Tint your custom headings when that field has an error */
body #gform_wrapper_1 .gfield_error .gf-delivery-shipping-heading,
body #gform_wrapper_1 .gfield_error .gf-delivery-date-heading,
body #gform_wrapper_1 .gfield_error .gf-customer-native-heading,
body #gform_wrapper_1 .gfield_error .gf-address-native-heading,
body #gform_wrapper_1 .gfield_error .gf-total-heading {
  color: #FF970E !important;
}




/* === VALIDATION SUMMARY: ORANGE NORWEGIAN ERROR BOX === */
/* Styles the top Gravity Forms validation message in orange, removes inner stroke/background,
   and removes the temporary focus outline shown after failed submission. */
body #gform_wrapper_1 .validation_error,
body #gform_wrapper_1 .gform_validation_errors {
  background: rgba(255, 151, 14, 0.08) !important;
  border: 1px solid #FF970E !important;
  color: #FF970E !important;
  box-shadow: none !important;
  outline: none !important;
}

body #gform_wrapper_1 .validation_error a,
body #gform_wrapper_1 .gform_validation_errors a,
body #gform_wrapper_1 .validation_error h2,
body #gform_wrapper_1 .gform_validation_errors h2,
body #gform_wrapper_1 .validation_error li,
body #gform_wrapper_1 .gform_validation_errors li,
body #gform_wrapper_1 .gform-icon,
body #gform_wrapper_1 .gform_validation_errors > h2 {
  color: #FF970E !important;
  fill: #FF970E !important;
}

body #gform_wrapper_1 .gform_validation_errors > h2,
body #gform_wrapper_1 .validation_error {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  outline: none !important;
}

body #gform_wrapper_1 .gform_validation_errors:focus,
body #gform_wrapper_1 .gform_validation_errors > h2:focus,
body #gform_wrapper_1 .validation_error:focus,
body #gform_wrapper_1 .gform_validation_errors:focus-visible,
body #gform_wrapper_1 .gform_validation_errors > h2:focus-visible,
body #gform_wrapper_1 .validation_error:focus-visible {
  outline: none !important;
  box-shadow: none !important;
}




/* === MOBILE: CONSENT ERROR MESSAGE ABOVE CHECKBOX, KEEP CHECKBOX TOP-ALIGNED === */
/* Reserves equal space above both the checkbox column and the consent-text column,
   so the validation message can sit above while the checkbox still aligns with the top of the beige text. */
@media (max-width: 767px) {
  body #gform_wrapper_1 #field_1_197.gfield_error,
  body #gform_wrapper_1 #field_1_199.gfield_error,
  body #gform_wrapper_1 #field_1_197.gfield_error + #field_1_198,
  body #gform_wrapper_1 #field_1_199.gfield_error + #field_1_200 {
    padding-top: 30px;
  }

  body #gform_wrapper_1 #field_1_197.gfield_error,
  body #gform_wrapper_1 #field_1_199.gfield_error {
    position: relative;
  }

  body #gform_wrapper_1 #field_1_197 .gfield_validation_message,
  body #gform_wrapper_1 #field_1_197 .validation_message,
  body #gform_wrapper_1 #field_1_199 .gfield_validation_message,
  body #gform_wrapper_1 #field_1_199 .validation_message {
    position: absolute;
    top: 0;
    left: 0;
    width: 220px;
    max-width: calc(100vw - 72px);
    margin: 0 !important;
    line-height: 1.55 !important;
  }
}



/* === CONFIRMATION MESSAGE === */
/* Styles the thank-you text and the order summary heading after successful submission */
body #gform_confirmation_wrapper_1 .gform_confirmation_message,
body #gform_confirmation_wrapper_1 .gform_confirmation_message p {
  color: var(--gf-form-beige) !important;
  font-size: 20px;
  line-height: 1.6;
}

body #gform_confirmation_wrapper_1 .gform_confirmation_message h3 {
  color: #CAFA94 !important;
  font-family: "Faculty Glyphic", Helvetica, Arial, Lucida, sans-serif;
  font-size: 22px;
  line-height: 1.3;
  font-weight: 400;
  margin: 28px 0 12px;
}


/* === GRØNNSAKER > POTET: HARD OVERRIDE FOR EMPTY SPACER FIELD === */
body #gform_wrapper_1 #field_1_104 {
  display: none !important;
}

/* === CONFIRMATION MESSAGE: BEIGE ARIAL BODY TEXT === */
/* Styles only the thank-you paragraphs after submit, without recoloring the order table text. */
body #gform_confirmation_wrapper_1 .gform_confirmation_message > p {
  color: #F7FFDC !important;
  font-family: Arial, Helvetica, sans-serif !important;
  font-size: 18px !important;
  line-height: 1.6 !important;
  font-weight: 400 !important;
}

body #gform_confirmation_wrapper_1 .gform_confirmation_message h3 {
  color: #CAFA94 !important;
}


body #gform_confirmation_wrapper_1 {
  scroll-margin-top: 180px;
}


/* Hide the visible divider/padding on the blank product wrapper section */
body #gform_wrapper_1 .gf-product-block-start.gfield--type-section {
  display: none !important;
}




/* === MOBILE: KEEP MAIN GROUP CHECKBOXES FULLY VISIBLE === */
@media (max-width: 767px) {
  body #gform_wrapper_1 .gf-section-toggle-title {
    padding-left: 40px !important;
  }

  body #gform_wrapper_1 .gf-section-toggle-title + .gf-section-toggle-checkbox .ginput_container_checkbox {
    top: -47px;
    left: 11px !important;
    margin: 0 !important;
  }

  #Bestillingsskjema {
    overflow: visible !important;
  }
}



/* === HIDDEN PRODUCT WRAPPERS: REMOVE THEM FROM THE GRID === */
/* The hidden product field should still submit, but its wrapper should not reserve layout space */
body #gform_wrapper_1 .gfield_hidden_product,
body #gform_wrapper_1 .gfield.gform_hidden.gfield--type-product {
  display: none !important;
  margin: 0 !important;
  padding: 0 !important;
  min-height: 0 !important;
  border: 0 !important;
}



/* === DESKTOP: EVEN SPACING AROUND GROUP HELPER NOTES === */
/* Keeps the note under Potet and similar groups equally spaced above and below */
@media (min-width: 768px) {
  body #gform_wrapper_1 .gf-product-block-start + .gfield_html {
    margin-top: 10px !important;
    margin-bottom: 10px !important;
  }

  body #gform_wrapper_1 .gf-product-block-start + .gfield_html .gf-helper-note,
  body #gform_wrapper_1 .gf-product-block-start + .gfield_html .gf-helper-note p,
  body #gform_wrapper_1 .gf-product-block-start + .gfield_html p.gf-helper-note {
    margin: 0 !important;
  }
}


/* === DESKTOP: REMOVE GAP ABOVE PRODUCT GROUP NOTES === */
@media (min-width: 768px) {
  body #gform_wrapper_1 .gf-product-block-start.gfield--type-section {
    display: none !important;
  }

  body #gform_wrapper_1 .gf-product-block-start + .gfield_html,
  body #gform_wrapper_1 #field_1_47,
  body #gform_wrapper_1 #field_1_211,
  body #gform_wrapper_1 #field_1_221,
  body #gform_wrapper_1 #field_1_256,
  body #gform_wrapper_1 #field_1_244 {
    margin-top: -28px !important;
    margin-bottom: 10px !important;
  }

  body #gform_wrapper_1 .gf-helper-note,
  body #gform_wrapper_1 p.gf-helper-note {
    margin: 0 !important;
  }
}



/* === DESKTOP: SPACE AFTER EXPANDED PRODUCT GROUPS === */
/* Adds space before the next main group only when the group above is opened */
@media (min-width: 768px) {
  body #gform_wrapper_1 #gform_fields_1:has(#choice_1_206_1:checked) #field_1_204,
  body #gform_wrapper_1 #gform_fields_1:has(#choice_1_100_1:checked) #field_1_205,
  body #gform_wrapper_1 #gform_fields_1:has(#choice_1_170_1:checked) #field_1_171,
  body #gform_wrapper_1 #gform_fields_1:has(#choice_1_172_1:checked) #field_1_174,
  body #gform_wrapper_1 #gform_fields_1:has(#choice_1_173_1:checked) #field_1_176 {
    margin-top: 56px !important;
  }
}


/* === MOBILE: SPACE AFTER NOTE-ONLY PRODUCT GROUPS === */
/* Adds breathing room after group notes before the next main group title */
@media (max-width: 767px) {
  body #gform_wrapper_1 #field_1_47,
  body #gform_wrapper_1 #field_1_211,
  body #gform_wrapper_1 #field_1_256 {
    margin-bottom: 38px !important;
  }
}



/* === MOBILE: PRODUCT NOTES POSITION === */
/* Pulls notes closer to the product above, while adding breathing room before the next product */
@media (max-width: 767px) {
  body #gform_wrapper_1 .gf-row-note {
    margin-top: -35px !important;
    margin-bottom: 35px !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    line-height: 1.35;
  }
}


/* === ORDER FORM PRODUCT IMAGE ZOOM === */

body #gform_wrapper_1,
body #gform_wrapper_1 #gform_fields_1,
body #gform_wrapper_1 .gfield,
body #gform_wrapper_1 .gf-row-product-main,
body #gform_wrapper_1 .gf-product-main,
body #gform_wrapper_1 .gf-product-media {
  overflow: visible !important;
}

body #gform_wrapper_1 .gf-row-product-main {
  position: relative !important;
  z-index: 1 !important;
}

body #gform_wrapper_1 .gf-row-product-main:hover,
body #gform_wrapper_1 .gf-row-product-main.is-zoomed {
  z-index: 999999 !important;
}

body #gform_wrapper_1 .gf-product-main,
body #gform_wrapper_1 .gf-product-media {
  position: relative !important;
}

body #gform_wrapper_1 .gf-product-media img {
  display: block !important;
  width: 40px !important;
  height: 40px !important;
  max-width: none !important;
  object-fit: cover !important;
  position: relative !important;
  z-index: 10 !important;
  transform: scale(1) !important;
  transform-origin: left top !important;
  transition: transform 0.18s ease, box-shadow 0.18s ease !important;
  cursor: zoom-in;
}

body #gform_wrapper_1 .gf-row-product-main:hover .gf-product-media img,
body #gform_wrapper_1 .gf-row-product-main.is-zoomed .gf-product-media img {
  transform: scale(4) !important;
  z-index: 999999 !important;
  box-shadow: 0 10px 28px rgba(0,0,0,.35) !important;
  cursor: zoom-out;
}

/* On touch devices, disable sticky hover and use JS toggle only */
@media (hover: none), (pointer: coarse) {
  body #gform_wrapper_1 .gf-row-product-main:hover .gf-product-media img {
    transform: scale(1) !important;
    box-shadow: none !important;
  }

  body #gform_wrapper_1 .gf-row-product-main.is-zoomed .gf-product-media img {
    transform: scale(4) !important;
    z-index: 999999 !important;
    box-shadow: 0 10px 28px rgba(0,0,0,.35) !important;
  }
}


@media (max-width: 767px) {
  .product-carousel.et_pb_group_carousel.et_pb_group_carousel_slides_5 .et_pb_group_carousel_slide {
    flex: 0 0 33.3333% !important;
    min-width: 33.3333% !important;
  }
}

@media (min-width: 768px) and (max-width: 980px) {
  .product-carousel.et_pb_group_carousel.et_pb_group_carousel_slides_5 .et_pb_group_carousel_slide {
    flex: 0 0 25% !important;
    min-width: 25% !important;
  }
}


/* GRAVITY FORMS END */




























/* Let customer review cards grow with their text */
@media only screen and (max-width: 767px) {
  .et_pb_module.et_pb_group_carousel_5 .et_pb_group_29,
  .et_pb_module.et_pb_group_carousel_5 .et_pb_group_30,
  .et_pb_module.et_pb_group_carousel_5 .et_pb_group_31 {
    height: auto !important;
    min-height: 442px;
    overflow: visible !important;
    padding-bottom: 40px !important;
  }

 
	
	
	
	/*testimonial carousel to stop image being cropped */
	
	.testimonial-carousel .et_pb_group_carousel_slide > .et_pb_group > .et_pb_text {
    height: auto !important;
    min-height: 0 !important;
    overflow: visible !important;
    padding: 44px 34px 38px !important;
    box-sizing: border-box;
  }

  .testimonial-carousel .et_pb_text_inner,
  .testimonial-carousel .et_pb_text_inner p {
    overflow: visible !important;
  }

  .testimonial-carousel .et_pb_text_inner p {
    padding-bottom: 1em;
  }

  .testimonial-carousel .et_pb_text_inner p:last-child {
    padding-bottom: 0;
  }
}


@media only screen and (min-width: 768px) {
  .testimonial-carousel .et_pb_group_carousel_slide > .et_pb_group > .et_pb_image {
    transform: translateX(50px) translateY(-97px) !important;
  }
}


@media only screen and (min-width: 768px) {
  .testimonial-carousel {
    contain: layout !important;
    overflow: visible !important;
  }

  .testimonial-carousel .et_pb_group_carousel_container {
    overflow: visible !important;
    clip-path: inset(-140px 0 0 0) !important;
    -webkit-clip-path: inset(-140px 0 0 0) !important;
  }

  .testimonial-photo {
    z-index: 5;
    transform: translateX(50px) translateY(-97px) !important;
  }
}

/* Customer review text frame: auto height on mobile */
@media only screen and (max-width: 767px) {
  .testimonial-carousel .et_pb_group_carousel_slide > .et_pb_group {
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
  }

  .testimonial-carousel .et_pb_group_carousel_slide > .et_pb_group > .et_pb_text {
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: visible !important;
    box-sizing: border-box;
    padding: 44px 34px 38px !important;
  }

  .testimonial-carousel .et_pb_group_carousel_slide > .et_pb_group > .et_pb_text .et_pb_text_inner,
  .testimonial-carousel .et_pb_group_carousel_slide > .et_pb_group > .et_pb_text p {
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
  }
}





/*bring the logo to left on desctop and haburger menu to right side on mobile */

/* Stable header alignment after Divi update */
.et-l--header .dl-menu.et_pb_menu {
  width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

.et-l--header .dl-menu.et_pb_menu .et_pb_menu_inner_container {
  width: 100% !important;
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  flex-wrap: nowrap !important;
}

.et-l--header .dl-menu .et_pb_menu__logo-wrap {
  flex: 0 0 auto !important;
  margin-right: auto !important;
}

.et-l--header .dl-menu .et_pb_menu__wrap {
  flex: 0 0 auto !important;
  margin-left: auto !important;
  justify-content: flex-end !important;
}

/* Stable header alignment after Divi update */
.et-l--header .dl-menu.et_pb_menu {
  width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

.et-l--header .dl-menu.et_pb_menu .et_pb_menu_inner_container {
  width: 100% !important;
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  flex-wrap: nowrap !important;
}

.et-l--header .dl-menu .et_pb_menu__logo-wrap {
  flex: 0 0 auto !important;
  margin-right: auto !important;
}

/* === GLOBAL HEADER: LOGO LEFT PADDING === */
.et-l--header .dl-menu .et_pb_menu__logo-wrap {
  padding-left: 10px !important;
}


.et-l--header .dl-menu .et_pb_menu__wrap {
  flex: 0 0 auto !important;
  margin-left: auto !important;
  justify-content: flex-end !important;
}


/* === COLLAPSE HIDDEN GROUPS === */
/* Removes leftover grid rows when a whole product group is hidden in Gravity Forms */
body #gform_wrapper_1 .gfield.gfield_visibility_hidden {
  display: none !important;
  margin: 0 !important;
  padding: 0 !important;
  min-height: 0 !important;
  border: 0 !important;
}

/* If a hidden group title is followed by its checkbox, collapse that too */
body #gform_wrapper_1 .gf-section-toggle-title.gfield_visibility_hidden + .gf-section-toggle-checkbox {
  display: none !important;
  margin: 0 !important;
  padding: 0 !important;
  min-height: 0 !important;
  border: 0 !important;
}



/* Prevent tiny horizontal page movement on mobile */
@media (max-width: 767px) {
  html,
  body {
    width: 100%;
    max-width: 100%;
    overflow-x: hidden !important;
  }

  #page-container,
  #et-main-area,
  .et-l,
  .et_builder_inner_content,
  .et_pb_section,
  .et_pb_row {
    max-width: 100%;
    overflow-x: clip;
  }

  .product-carousel,
  .product-carousel .et_pb_group_carousel_container,
  .testimonial-carousel,
  .testimonial-carousel .et_pb_group_carousel_container {
    max-width: 100% !important;
    overflow-x: clip !important;
  }
}


@media only screen and (max-width: 767px) {
  h2,
  .et_pb_text h2 {
    font-size: 30px !important;
    line-height: 1.6em !important;
  }
}

@media only screen and (max-width: 767px) {
  h3,
  .et_pb_text h3 {
    font-size: 18px !important;
    line-height: 1.6em !important;
  }
}

/* Mobile bordered text cards: keeps card borders inside the phone screen across the site. */
@media (max-width: 767px) {
  .preset--module--divi-text--r7ya4tjujo,
  .preset--module--divi-text--97aj2v3444 {
    width: 100% !important;
    max-width: calc(100vw - 48px) !important;
    box-sizing: border-box !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }
}


/* show the pusshed wiggle contact icons on mobile */
@media (max-width: 767px) {
  #contact .contact-line {
    padding-left: 30px;
  }

  #contact .contact-icon {
    left: 5px;
  }
}


/* fixing the font not loading 404 issue */
@font-face {
  font-family: 'Faculty Glyphic';
  src: url('https://hundstadgaard.no/wp-content/uploads/2026/03/FacultyGlyphic-Regular.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}


/* Gravity Forms confirmation message spacing */
body #gform_confirmation_wrapper_1 .gform_confirmation_message h3 {
  line-height: 1.65 !important;
  margin: 0 0 24px !important;
}

body #gform_confirmation_wrapper_1 .gform_confirmation_message h3 br {
  display: block !important;
  content: "" !important;
  margin-bottom: 16px !important;
}










































































































/* === TEST FORM 4 COPY OF GRAVITY FORMS CSS ===
   Paste this after the existing Gravity Forms CSS while testing the duplicated form. */

/* GRAVITY FORMS START */


/* === BRAND COLORS + BASE FORM TEXT === */
/* Shared brand colors and main text color for the whole Gravity Form */
body #gform_wrapper_4 {
  --gf-brand-turquoise: #8CF7D4;
  --gf-form-beige: #F7FFDC;
  color: var(--gf-form-beige);
}


/* === GLOBAL FORM TEXT === */
/* Standard labels, legends, descriptions, HTML fields, links, and form controls */
body #gform_wrapper_4 .gfield_label,
body #gform_wrapper_4 legend,
body #gform_wrapper_4 .gsection_title,
body #gform_wrapper_4 input,
body #gform_wrapper_4 select,
body #gform_wrapper_4 textarea,
body #gform_wrapper_4 .gfield_description,
body #gform_wrapper_4 .gf-helper-note,
body #gform_wrapper_4 .gfield_html,
body #gform_wrapper_4 a {
  color: var(--gf-form-beige);
}

body #gform_wrapper_4 input::placeholder,
body #gform_wrapper_4 textarea::placeholder {
  color: var(--gf-form-beige);
  opacity: 1;
}


/* === REGISTRATION LINK === */
/* Keeps the helper link beige with a visible underline */
body #gform_wrapper_4 .gf-helper-link {
  color: var(--gf-form-beige) !important;
  text-decoration: none !important;
  border-bottom: 1px solid currentColor;
  display: inline-block;
  line-height: 1.2;
}


/* === REUSABLE CHECKBOX FIELD === */
/* Checkbox sits close to the label and stays vertically centered */
body #gform_wrapper_4 .gf-toggle-checkbox {
  position: relative;
  min-height: 24px;
}

body #gform_wrapper_4 .gf-toggle-checkbox .gfield_label {
  display: inline-block;
  margin: 0;
  min-width: 52px;
  line-height: 24px;
  white-space: nowrap;
  padding-left: 32px; 
}

body #gform_wrapper_4 .gf-toggle-checkbox .ginput_container_checkbox {
  position: absolute;
  top: 50%;
  left: 0px;
  transform: translateY(-113%);
  margin-top: 0;
}

body #gform_wrapper_4 .gf-toggle-checkbox .gfield_checkbox,
body #gform_wrapper_4 .gf-toggle-checkbox .gchoice {
  display: flex;
  align-items: center;
}

body #gform_wrapper_4 .gf-toggle-checkbox input[type="checkbox"] {
  margin: 0;
}


/* === PRODUCT COLUMN === */
/* Image + product name */
body #gform_wrapper_4 .gf-row-product-main .gf-product-main {
  display: grid;
  grid-template-columns: 40px minmax(0, 1fr);
  column-gap: 12px;
  align-items: start;
}

body #gform_wrapper_4 .gf-row-product-main .gf-product-media {
  line-height: 0;
}

body #gform_wrapper_4 .gf-row-product-main .gf-product-media img {
  display: block;
  width: 40px;
  height: 40px;
  object-fit: cover;
}

body #gform_wrapper_4 .gf-row-product-main .gf-product-name {
  font-weight: 600;
  line-height: 1.2;
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: normal;
  max-width: 12ch;
  align-self: start;
}



/* === META COLUMN === */
/* Weight + price */
body #gform_wrapper_4 .gf-row-meta {
  text-align: left !important;
}

body #gform_wrapper_4 .gf-row-meta .gf-product-meta-wrap {
  display: grid;
  grid-template-columns: minmax(0, 72px) minmax(0, 46px);
  column-gap: 37px;
  align-items: start;
  justify-content: start;
}

body #gform_wrapper_4 .gf-row-meta .gf-product-meta,
body #gform_wrapper_4 .gf-row-meta .gf-product-price {
  line-height: 1.2;
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: normal;
}



/* === QUANTITY FIELD === */
/* Native Gravity Forms quantity with dark background and beige arrow */
body #gform_wrapper_4 .gf-row-qty {
  --gf-icon-ctrl-select: url("data:image/svg+xml,%3Csvg width='10' height='6' viewBox='0 0 10 6' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M0.292893 0.292893C0.683417 -0.097631 1.31658 -0.097631 1.70711 0.292893L5 3.58579L8.29289 0.292893C8.68342 -0.0976311 9.31658 -0.0976311 9.70711 0.292893C10.0976 0.683417 10.0976 1.31658 9.70711 1.70711L5.70711 5.70711C5.31658 6.09763 4.68342 6.09763 4.29289 5.70711L0.292893 1.70711C-0.0976311 1.31658 -0.0976311 0.683418 0.292893 0.292893Z' fill='%23F7FFDC'/%3E%3C/svg%3E");
  display: flex;
  justify-content: center;
  position: relative;
  left: 0;
}

body #gform_wrapper_4 .gf-row-qty .ginput_container {
  width: auto;
  margin-top: 0;
}

body #gform_wrapper_4 .gf-row-qty .gfield_label {
  text-align: center;
}

body #gform_wrapper_4 .gf-row-qty input,
body #gform_wrapper_4 .gf-row-qty select {
  background-color: #314632 !important;
  border-color: #314632 !important;
  color: var(--gf-form-beige) !important;
}

body #gform_wrapper_4 .gf-row-qty select {
  background-image: var(--gf-icon-ctrl-select) !important;
  background-repeat: no-repeat;
  background-position: right 12px center;
  position: relative;
  top: -10px;
}


/* === TURQUOISE HEADERS === */
/* Labels above the four visible columns */
body #gform_wrapper_4 .gf-row-product-header .gf-product-header-main {
  color: var(--gf-brand-turquoise) !important;
  font-size: 12px;
  line-height: 1.2;
  white-space: nowrap;
}

body #gform_wrapper_4 .gf-row-meta-header {
  text-align: left !important;
}

body #gform_wrapper_4 .gf-row-meta-header .gf-product-header-meta {
  display: grid;
  grid-template-columns: 72px 90px;
  column-gap: 37px;
  justify-content: start;
  color: var(--gf-brand-turquoise) !important;
  font-size: 12px;
  line-height: 1.2;
  white-space: nowrap;
}

body #gform_wrapper_4 .gf-row-meta-header .gf-product-header-meta-label,
body #gform_wrapper_4 .gf-row-meta-header .gf-product-header-price-label {
  color: var(--gf-brand-turquoise) !important;
  white-space: nowrap;
}

body #gform_wrapper_4 .gf-row-meta-header .gf-product-header-price-label {
  position: relative;
  left: 0;
}

body #gform_wrapper_4 .gf-row-qty-header {
  text-align: center !important;
}

body #gform_wrapper_4 .gf-row-qty-header .gf-product-header-qty {
  display: block;
  color: var(--gf-brand-turquoise) !important;
  font-size: 12px;
  line-height: 1.2;
  text-align: center;
}

body #gform_wrapper_4 .gf-row-note-header .gf-product-header-note {
  color: var(--gf-brand-turquoise) !important;
  font-size: 12px;
  line-height: 1.2;
}


/* === MOBILE: FIRST LINE = PRODUCT + META === */
/* Applies to all copied rows through shared classes */
@media (max-width: 767px) {
  body #gform_wrapper_4 .gf-row-product-main,
  body #gform_wrapper_4 .gf-row-meta {
    grid-column: span 6 !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    align-self: start;
  }

  body #gform_wrapper_4 .gf-row-product-main .gf-product-main {
    grid-template-columns: 40px minmax(0, 1fr);
    padding-top: 45px;
  }

  body #gform_wrapper_4 .gf-row-product-main .gf-product-name {
    min-width: 0;
    white-space: normal;
    overflow-wrap: anywhere;
    word-break: break-word;
  }

  body #gform_wrapper_4 .gf-row-meta {
    padding-bottom: 8px !important;
  }

  body #gform_wrapper_4 .gf-row-meta .gf-product-meta-wrap {
    display: grid;
    grid-template-columns: minmax(0, 72px) minmax(0, 62px);
    column-gap: 14px;
    justify-content: start;
    align-items: start;
    padding-top: 45px;
  }

  body #gform_wrapper_4 .gf-row-meta .gf-product-meta,
  body #gform_wrapper_4 .gf-row-meta .gf-product-price {
    min-width: 0;
    display: block;
    overflow: visible;
    line-height: 1.35;
    white-space: normal;
    overflow-wrap: normal;
    word-break: normal;
  }
}

/* === MOBILE: QUANTITY === */
/* Quantity stays on its own row, right-aligned */
@media (max-width: 767px) {
  body #gform_wrapper_4 .gf-row-qty {
    grid-column: span 12 !important;
    justify-content: flex-end;
    left: -6px;
    margin-top: 15px !important;
    padding-bottom: 26px !important;
  }

  body #gform_wrapper_4 .gf-row-qty .ginput_container {
    width: auto;
    margin-top: 0;
  }

  body #gform_wrapper_4 .gf-row-qty select {
    top: -10px;
    margin-left: 0;
    margin-right: 0;
  }
}

/* === MOBILE: NOTES === */
/* Notes stay below quantity */
@media (max-width: 767px) {
  body #gform_wrapper_4 .gf-row-note {
    grid-column: span 12 !important;
    margin-top: 0 !important;
  }

  body #gform_wrapper_4 #gform_fields_4 {
    row-gap: 8px !important;
  }
}


/* === MOBILE: HIDE TURQUOISE PRODUCT HEADERS === */
@media (max-width: 767px) {
  body #gform_wrapper_4 .gf-row-product-header,
  body #gform_wrapper_4 .gf-row-meta-header,
  body #gform_wrapper_4 .gf-row-qty-header,
  body #gform_wrapper_4 .gf-row-note-header {
    display: none !important;
  }
}


/* === HIDDEN PRODUCT ROWS: REMOVE HIDDEN FIELDS FROM THE 4-COLUMN GRID === */
/* Keeps copied rows aligned when Gravity Forms fields are hidden in the frontend */
body #gform_wrapper_4 .gf-row-product-main.gfield_visibility_hidden,
body #gform_wrapper_4 .gf-row-meta.gfield_visibility_hidden,
body #gform_wrapper_4 .gf-row-qty.gfield_visibility_hidden,
body #gform_wrapper_4 .gf-row-note.gfield_visibility_hidden,
body #gform_wrapper_4 .gf-row-product-header.gfield_visibility_hidden,
body #gform_wrapper_4 .gf-row-meta-header.gfield_visibility_hidden,
body #gform_wrapper_4 .gf-row-qty-header.gfield_visibility_hidden,
body #gform_wrapper_4 .gf-row-note-header.gfield_visibility_hidden {
  display: none !important;
  margin: 0 !important;
  padding: 0 !important;
}



/* === SECTION TOGGLE: PLACE CHECKBOX TO THE LEFT OF THE SECTION TITLE === */
/* Use on a Section field followed immediately by its checkbox field */
body #gform_wrapper_4 .gf-section-toggle-title {
  grid-column: 1 / -1 !important;
  margin-bottom: 0 !important;
  padding-left: 32px;
  position: relative;
}

body #gform_wrapper_4 .gf-section-toggle-title .gsection_title {
  margin-bottom: 0 !important;
}

body #gform_wrapper_4 .gf-section-toggle-title + .gf-section-toggle-checkbox {
  grid-column: 1 / -1 !important;
  width: 0 !important;
  height: 0 !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  position: relative;
  z-index: 2;
}

body #gform_wrapper_4 .gf-section-toggle-title + .gf-section-toggle-checkbox .gfield_label {
  display: none !important;
}

body #gform_wrapper_4 .gf-section-toggle-title + .gf-section-toggle-checkbox .ginput_container_checkbox {
  position: relative !important;
  top: -80px;
  left: 0;
  transform: none !important;
  margin: 0 !important;
}

body #gform_wrapper_4 .gf-section-toggle-title + .gf-section-toggle-checkbox .gfield_checkbox,
body #gform_wrapper_4 .gf-section-toggle-title + .gf-section-toggle-checkbox .gchoice {
  display: flex;
  align-items: center;
}

body #gform_wrapper_4 .gf-section-toggle-title + .gf-section-toggle-checkbox input[type="checkbox"] {
  margin: 0;
}

/* === MOBILE ONLY: KEEP THE SECTION CHECKBOX LEFT OF THE TITLE === */
/* Positions the checkbox to the left of the section title on phones */
@media (max-width: 767px) {
  body #gform_wrapper_4 .gf-section-toggle-title {
    grid-column: 1 / -1 !important;
    padding-left: 28px;
  }

  body #gform_wrapper_4 .gf-section-toggle-title + .gf-section-toggle-checkbox {
    grid-column: 1 / -1 !important;
    width: 0 !important;
    height: 0 !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
  }

  body #gform_wrapper_4 .gf-section-toggle-title + .gf-section-toggle-checkbox .ginput_container_checkbox {
    position: relative !important;
    top: -47px;
    left: 0;
    transform: none !important;
    margin: 0 !important;
  }
}

/* === CATEGORY CHECKBOX: ALIGN NORMAL TOGGLES WITH THE SECTION TOGGLE === */
/* Moves Potet-style checkbox fields slightly left to match the section title/checkbox line above */
body #gform_wrapper_4 .gf-toggle-checkbox:not(.gf-section-toggle-checkbox) {
  margin-left: 25px;
}

/* === CATEGORY CHECKBOX LABEL SIZE === */
/* Sets Potet-style checkbox labels to 22px */
body #gform_wrapper_4 .gf-toggle-checkbox:not(.gf-section-toggle-checkbox) .gfield_label {
  font-size: 18px;
}

/* === TOGGLE CHECKBOXES: HIDE THE INLINE CHOICE LABEL === */
/* We use the field label as the visible text, so the inner choice label should stay hidden */
body #gform_wrapper_4 .gf-section-toggle-checkbox .gform-field-label--type-inline,
body #gform_wrapper_4 .gf-toggle-checkbox .gform-field-label--type-inline {
  display: none !important;
}


/* === SECTION TOGGLE: NUDGE THE GRØNNSAKER CHECKBOX BACK LEFT === */
/* Re-aligns the main group checkbox with Potet and Røtter after hiding the inline label */
body #gform_wrapper_4 .gf-section-toggle-title + .gf-section-toggle-checkbox .ginput_container_checkbox {
  left: 0;
}



/* === MAIN FORM SECTION TITLES === */
/* Reusable centered beige H3 headings for top-level form sections */
body #gform_wrapper_4 .gf-main-section-heading {
  margin: 56px 0 28px;
  color: var(--gf-form-beige);
  font-size: 34px;
  line-height: 1.7;
  text-align: center;
  font-weight: 400;
  padding-bottom: 60px;
}

@media (max-width: 767px) {
  body #gform_wrapper_4 .gf-main-section-heading {
    margin: 40px 0 22px;
    font-size: 28px;
	padding-bottom: 50px;
  }
}

/* === END OF VEGETABLE GROUP === */
/* Adds space below the last visible vegetable subgroup */
body #gform_wrapper_4 .gf-end-of-veg-group {
  margin-bottom: 56px !important;
}

/* === PRODUCT SECTION TITLES + SUBGROUP LABELS === */
/* Main category titles stay green, subgroup labels return to beige */
body #gform_wrapper_4 .gf-semantic-h4 .gsection_title {
  color: #CAFA94 !important;
}

body #gform_wrapper_4 .gf-toggle-checkbox:not(.gf-section-toggle-checkbox) .gfield_label {
  color: var(--gf-form-beige) !important;
}




/* === CHECKBOXES: DARK GREEN FILL WITH BEIGE STROKE === */
/* Styles both main-group and subgroup checkboxes */
body #gform_wrapper_4 input[type="checkbox"] {
  appearance: none;
  -webkit-appearance: none;
  width: 20px;
  height: 20px;
  background: #314632;
  border: 1.5px solid var(--gf-form-beige);
  border-radius: 2px;
  display: inline-grid;
  place-content: center;
  cursor: pointer;
}

body #gform_wrapper_4 input[type="checkbox"]::before {
  content: "";
  width: 10px;
  height: 10px;
  transform: scale(0);
  transition: transFORM 420ms ease-in-out;
  background: var(--gf-form-beige);
  clip-path: polygon(14% 44%, 0 65%, 50% 100%, 100% 16%, 80% 0, 43% 62%);
}

body #gform_wrapper_4 input[type="checkbox"]:checked::before {
  transform: scale(1);
}


/* === DELIVERY SUBHEADING === */
/* Makes Metoder match the green H4 subgroup headings */
body #gform_wrapper_4 .gf-delivery-subheading {
  margin: 0;
  color: #CAFA94 !important;
  font-size: 22px;
  line-height: 1.2;
  font-weight: 400;
}


/* === DELIVERY EXPLANATORY TEXT === */
/* Beige helper text to the right of Metoder */
body #gform_wrapper_4 .gf-delivery-note,
body #gform_wrapper_4 .gf-delivery-note p {
  color: var(--gf-form-beige);
  font-size: 16px;
  line-height: 1.35;
  margin: 0 0 18px;
}

body #gform_wrapper_4 .gf-delivery-note p:last-child {
  margin-bottom: 0;
}







/* === DELIVERY SHIPPING FIELD === */
/* Styles the shipping methods as: method, guide line, price, selector */
body #gform_wrapper_4 .gf-delivery-shipping,
body #gform_wrapper_4 #field_4_184 {
  max-width: 760px;
}

/* Hide the native legend visually, but keep it for accessibility */
body #gform_wrapper_4 .gf-delivery-shipping > .gfield_label,
body #gform_wrapper_4 #field_4_184 > .gfield_label {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

/* Real H4 inserted by PHP */
body #gform_wrapper_4 .gf-delivery-shipping-heading {
  margin: 0 0 18px;
}


body #gform_wrapper_4 .gf-delivery-shipping .ginput_container_radio,
body #gform_wrapper_4 #field_4_184 .ginput_container_radio {
  margin-top: 0;
}

body #gform_wrapper_4 .gf-delivery-shipping .gfield_radio,
body #gform_wrapper_4 #field_4_184 .gfield_radio {
  display: grid;
  row-gap: 14px;
}

body #gform_wrapper_4 .gf-delivery-shipping .gchoice,
body #gform_wrapper_4 #field_4_184 .gchoice {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto 22px;
  column-gap: 14px;
  align-items: center;
}

/* Hide the live label text visually; Gravity Forms can still mutate it */
body #gform_wrapper_4 .gf-delivery-shipping .gchoice label,
body #gform_wrapper_4 #field_4_184 .gchoice label {
  grid-column: 1;
  grid-row: 1;
  min-width: 0;
  margin: 0;
  color: transparent !important;
  font-size: 0;
  display: flex;
  align-items: center;
  gap: 14px;
}

/* Render the visible method names ourselves */
body #gform_wrapper_4 .gf-delivery-shipping .gchoice label::before,
body #gform_wrapper_4 #field_4_184 .gchoice label::before {
  color: var(--gf-form-beige);
  font-size: 16px;
  line-height: 1.2;
  white-space: nowrap;
}

body #gform_wrapper_4 .gf-delivery-shipping .gchoice_4_184_0 label::before,
body #gform_wrapper_4 #field_4_184 .gchoice_4_184_0 label::before {
  content: "Hent på gård";
}

body #gform_wrapper_4 .gf-delivery-shipping .gchoice_4_184_1 label::before,
body #gform_wrapper_4 #field_4_184 .gchoice_4_184_1 label::before {
  content: "Møt oss på neste REKO-ring Harstad";
}

body #gform_wrapper_4 .gf-delivery-shipping .gchoice_4_184_2 label::before,
body #gform_wrapper_4 #field_4_184 .gchoice_4_184_2 label::before {
  content: "Hentepunkt Røde Kors Borkenes";
}

body #gform_wrapper_4 .gf-delivery-shipping .gchoice_4_184_3 label::before,
body #gform_wrapper_4 #field_4_184 .gchoice_4_184_3 label::before {
  content: "Hentepunkt Kinsarvik Sjøkanten Senter";
}

body #gform_wrapper_4 .gf-delivery-shipping .gchoice_4_184_4 label::before,
body #gform_wrapper_4 #field_4_184 .gchoice_4_184_4 label::before {
  content: "Tilleggslevering for abonnementskunder";
}

/* Guide line */
body #gform_wrapper_4 .gf-delivery-shipping .gchoice label::after,
body #gform_wrapper_4 #field_4_184 .gchoice label::after {
  content: "";
  flex: 1 1 auto;
  min-width: 28px;
  border-bottom: 1px solid var(--gf-form-beige);
  opacity: 0.9;
}

/* Price column */
body #gform_wrapper_4 .gf-delivery-shipping .gchoice::after,
body #gform_wrapper_4 #field_4_184 .gchoice::after {
  grid-column: 2;
  grid-row: 1;
  color: var(--gf-form-beige);
  white-space: nowrap;
}

body #gform_wrapper_4 .gf-delivery-shipping .gchoice_4_184_0::after,
body #gform_wrapper_4 #field_4_184 .gchoice_4_184_0::after {
  content: "0kr";
}

body #gform_wrapper_4 .gf-delivery-shipping .gchoice_4_184_1::after,
body #gform_wrapper_4 #field_4_184 .gchoice_4_184_1::after {
  content: "0kr";
}

body #gform_wrapper_4 .gf-delivery-shipping .gchoice_4_184_2::after,
body #gform_wrapper_4 #field_4_184 .gchoice_4_184_2::after {
  content: "39kr";
}

body #gform_wrapper_4 .gf-delivery-shipping .gchoice_4_184_3::after,
body #gform_wrapper_4 #field_4_184 .gchoice_4_184_3::after {
  content: "39kr";
}

body #gform_wrapper_4 .gf-delivery-shipping .gchoice_4_184_4::after,
body #gform_wrapper_4 #field_4_184 .gchoice_4_184_4::after {
  content: "0kr";
}



/* Selector on the right */
body #gform_wrapper_4 .gf-delivery-shipping .gchoice input[type="radio"],
body #gform_wrapper_4 #field_4_184 .gchoice input[type="radio"] {
  grid-column: 3;
  grid-row: 1;
  justify-self: end;
  align-self: center;
  margin: 0;
  appearance: none;
  -webkit-appearance: none;
  width: 16px;
  height: 16px;
  background: #314632;
  border: 1.5px solid var(--gf-form-beige);
  border-radius: 50%;
  display: inline-grid;
  place-content: center;
  cursor: pointer;
}

body #gform_wrapper_4 .gf-delivery-shipping .gchoice input[type="radio"]::before,
body #gform_wrapper_4 #field_4_184 .gchoice input[type="radio"]::before {
  content: "";
  width: 8px;
  height: 8px;
  transform: scale(0);
  border-radius: 50%;
  background: var(--gf-form-beige);
}

body #gform_wrapper_4 .gf-delivery-shipping .gchoice input[type="radio"]:checked::before,
body #gform_wrapper_4 #field_4_184 .gchoice input[type="radio"]:checked::before {
  transform: scale(1);
}

@media (max-width: 767px) {
  body #gform_wrapper_4 .gf-delivery-shipping .gfield_label,
  body #gform_wrapper_4 #field_4_184 .gfield_label {
    font-size: 20px;
  }

  body #gform_wrapper_4 .gf-delivery-shipping .gchoice,
  body #gform_wrapper_4 #field_4_184 .gchoice {
    column-gap: 10px;
  }

  body #gform_wrapper_4 .gf-delivery-shipping .gchoice label,
  body #gform_wrapper_4 #field_4_184 .gchoice label {
    gap: 10px;
  }

  body #gform_wrapper_4 .gf-delivery-shipping .gchoice label::before,
  body #gform_wrapper_4 #field_4_184 .gchoice label::before {
    font-size: 16px;
  }
}



/* === DELIVERY SHIPPING FIELD: MOBILE === */
/* Simplifies the shipping rows on phones so the method, price, and selector stay aligned */
@media (max-width: 767px) {
  body #gform_wrapper_4 .gf-delivery-shipping .gchoice,
  body #gform_wrapper_4 #field_4_184 .gchoice {
    grid-template-columns: minmax(0, 1fr) auto 20px;
    column-gap: 8px;
    align-items: start;
  }

  body #gform_wrapper_4 .gf-delivery-shipping .gchoice label,
  body #gform_wrapper_4 #field_4_184 .gchoice label {
    gap: 0;
    align-items: flex-start;
  }

  body #gform_wrapper_4 .gf-delivery-shipping .gchoice label::before,
  body #gform_wrapper_4 #field_4_184 .gchoice label::before {
    font-size: 16px;
    line-height: 1.3;
    white-space: normal;
  }

  body #gform_wrapper_4 .gf-delivery-shipping .gchoice label::after,
  body #gform_wrapper_4 #field_4_184 .gchoice label::after {
    display: none;
  }

  body #gform_wrapper_4 .gf-delivery-shipping .gchoice::after,
  body #gform_wrapper_4 #field_4_184 .gchoice::after {
    font-size: 16px;
    align-self: start;
    padding-top: 1px;
  }

  body #gform_wrapper_4 .gf-delivery-shipping .gchoice input[type="radio"],
  body #gform_wrapper_4 #field_4_184 .gchoice input[type="radio"] {
    width: 15px;
    height: 15px;
    align-self: start;
    margin-top: 2px;
  }

  body #gform_wrapper_4 .gf-delivery-shipping .gchoice input[type="radio"]::before,
  body #gform_wrapper_4 #field_4_184 .gchoice input[type="radio"]::before {
    width: 7px;
    height: 7px;
  }
}

/* === SHIPPING FIELD: MORE SPACE ABOVE METODER === */
/* Adds breathing room above the shipping module */
body #gform_wrapper_4 .gf-delivery-shipping,
body #gform_wrapper_4 #field_4_184 {
  margin-top: 30px;
  padding-top: 20px;
}


/* === DATE FIELD === */
/* Green H4 label, dark green input, and extra space above the field */
body #gform_wrapper_4 #field_4_185 {
  padding-top: 70px;
}

body #gform_wrapper_4 #field_4_185 .gfield_label {
  display: block !important;
  margin: 0 0 18px !important;
  color: #CAFA94 !important;
  font-size: 22px;
  line-height: 1.2;
  font-weight: 400;
}

body #gform_wrapper_4 #field_4_185 input,
body #gform_wrapper_4 #field_4_185 .datepicker {
  background-color: #314632 !important;
  border: 1px solid #314632 !important;
  color: var(--gf-form-beige) !important;
}

body #gform_wrapper_4 #field_4_185 input::placeholder,
body #gform_wrapper_4 #field_4_185 .datepicker::placeholder {
  color: var(--gf-form-beige) !important;
  opacity: 1;
}


body #gform_wrapper_4 #field_4_185 input::placeholder,
body #gform_wrapper_4 #field_4_185 .datepicker::placeholder {
  color: var(--gf-form-beige) !important;
  opacity: 1;
  font-size: 16px;
}

/* === DATE FIELD: LEFT-ALIGN PLACEHOLDER === */
/* Keeps the date text starting flush left inside the dark field */
body #gform_wrapper_4 #field_4_185 input,
body #gform_wrapper_4 #field_4_185 .datepicker {
  text-align: left !important;
  padding-left: 0 !important;
}


body #gform_wrapper_4 .gf-required-note {
  color: var(--gf-form-beige);
  font-size: 16px;
  line-height: 1.3;
  margin: 0;
}

body #gform_wrapper_4 .gf-required-asterisk {
  color: var(--gf-form-beige);
}



/* === CUSTOMER FIELDS: DARK GREEN INPUTS === */
/* Makes text, email, phone, and address inputs dark green */
body #gform_wrapper_4 input[type="text"],
body #gform_wrapper_4 input[type="email"],
body #gform_wrapper_4 input[type="tel"],
body #gform_wrapper_4 textarea,
body #gform_wrapper_4 select {
  background-color: #314632 !important;
  border: 1px solid var(--gf-form-beige) !important;
  color: var(--gf-form-beige) !important;
}

body #gform_wrapper_4 input::placeholder,
body #gform_wrapper_4 textarea::placeholder {
  color: var(--gf-form-beige);
  opacity: 1;
}

/* === ADDRESS SUBLABELS: H4 LOOK === */
/* Makes address sublabels match the green H4-style customer headings */
/* Hide native address sublabels, keep for accessibility */
body #gform_wrapper_4 #input_4_191_3_label,
body #gform_wrapper_4 #input_4_191_5_label {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}


/* Put each address subfield in a vertical stack so the label sits above the input */
body #gform_wrapper_4 .gf-customer-address .ginput_full,
body #gform_wrapper_4 .gf-customer-address .ginput_left,
body #gform_wrapper_4 .gf-customer-address .ginput_right {
  display: flex;
  flex-direction: column;
}

/* Optional: hide Address Line 2 if you do not need it */
body #gform_wrapper_4 .gf-customer-address .address_line_2,
body #gform_wrapper_4 .gf-customer-address .address_line_2 + label {
  display: none !important;
}


/* === CUSTOMER FIELD HEADINGS === */
/* Real H4 headings above customer fields */
body #gform_wrapper_4 .gf-field-heading {
  margin: 0 0 12px;
  color: #CAFA94 !important;
  font-size: 22px;
  line-height: 1.2;
  font-weight: 400;
}

/* === CUSTOMER SECTION: SPACE ABOVE FIELD HEADINGS === */
body #gform_wrapper_4 #field_4_188,
body #gform_wrapper_4 #field_4_189,
body #gform_wrapper_4 #field_4_190,
body #gform_wrapper_4 #field_4_191 {
  padding-top: 35px;
}



/* === CUSTOMER INPUTS: TIGHTER GAP UNDER GREEN HEADINGS === */
/* Makes Navn, Tlf, and E-post sit closer to their fields like Adresse/Postnummer */
body #gform_wrapper_4 .gf-customer-field {
  margin-top: 0 !important;
}

body #gform_wrapper_4 .gf-customer-field .ginput_container {
  margin-top: 0 !important;
}

body #gform_wrapper_4 #field_4_188,
body #gform_wrapper_4 #field_4_189,
body #gform_wrapper_4 #field_4_190 {
  margin-top: -50px !important;
}

@media (max-width: 767px) {
  body #gform_wrapper_4 #field_4_188,
  body #gform_wrapper_4 #field_4_189,
  body #gform_wrapper_4 #field_4_190 {
    margin-top: -18px !important;
  }
}



body #gform_wrapper_4 .gf-delivery-shipping-heading {
  font-family: "Faculty Glyphic", Helvetica, Arial, Lucida, sans-serif;
  font-size: 18px;
  line-height: 1.7em;
  color: #CAFA94 !important;
}

body #gform_wrapper_4 .gf-delivery-shipping-heading,
body #gform_wrapper_4 .gf-delivery-date-heading,
body #gform_wrapper_4 .gf-customer-native-heading,
body #gform_wrapper_4 .gf-address-native-heading {
  font-family: "Faculty Glyphic", Helvetica, Arial, Lucida, sans-serif;
  font-size: 18px;
  line-height: 1.7em;
  font-weight: 400;
  color: #CAFA94 !important;
  margin: 0 0 12px;
}



/* Hide native labels only when the field is NOT in error */
body #gform_wrapper_4 .gf-customer-field:not(.gfield_error) > .gfield_label,
body #gform_wrapper_4 .gf-delivery-shipping:not(.gfield_error) > .gfield_label,
body #gform_wrapper_4 #field_4_184:not(.gfield_error) > .gfield_label,
body #gform_wrapper_4 #field_4_185:not(.gfield_error) > .gfield_label {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}


body #gform_wrapper_4 .gf-privacy-consent {
  color: var(--gf-form-beige);
  margin: 0;
}

body #gform_wrapper_4 .gf-privacy-consent a {
  color: var(--gf-form-beige) !important;
  text-decoration: none !important;
  border-bottom: 1px solid currentColor;
  padding-bottom: 2px;
}

/* === CONSENT ROW: BRING TEXT CLOSER TO THE CHECKBOX === */
body #gform_wrapper_4 #field_4_197 {
  grid-column: span 1 !important;
  margin: 0 !important;
  align-self: start;
}

body #gform_wrapper_4 #field_4_197 .ginput_container_consent {
  margin-top: 0 !important;
}

body #gform_wrapper_4 #field_4_198 {
  grid-column: span 11 !important;
  margin-left: -28px !important;
}


body #gform_wrapper_4 #field_4_198 .gf-privacy-consent {
  margin: 0 !important;
}

@media (max-width: 767px) {
  body #gform_wrapper_4 #field_4_198 {
    margin-left: 5px !important;
  }
}

/* === CONSENT ROWS: KEEP TEXT CLOSE TO THE CHECKBOX === */
body #gform_wrapper_4 #field_4_197,
body #gform_wrapper_4 #field_4_199 {
  grid-column: span 1 !important;
  margin: 0 !important;
  align-self: start;
  padding-top: 30px;
}

body #gform_wrapper_4 #field_4_197 .ginput_container_consent,
body #gform_wrapper_4 #field_4_199 .ginput_container_consent {
  position: relative;
  display: inline-block;
  margin-top: 0 !important;
}

body #gform_wrapper_4 #field_4_198,
body #gform_wrapper_4 #field_4_200 {
  grid-column: span 11 !important;
  margin: 0 !important;
  padding-top: 30px;
  padding-left: 0 !important;
  margin-left: -28px !important;
}

body #gform_wrapper_4 #field_4_198 .gf-privacy-consent,
body #gform_wrapper_4 #field_4_200 .gf-newsletter-note {
  margin: 0 !important;
}

@media (max-width: 767px) {
  body #gform_wrapper_4 #field_4_198,
  body #gform_wrapper_4 #field_4_200 {
    margin-left: 5px !important;
  }
}

/* === CONSENT CHECKBOX: REQUIRED ASTERISK === */
/* Adds a visual asterisk above the required privacy consent checkbox */
body #gform_wrapper_4 #field_4_197,
body #gform_wrapper_4 #field_4_197 .ginput_container_consent {
  position: relative !important;
  overflow: visible !important;
}

body #gform_wrapper_4 #field_4_197::before {
  content: none !important;
}

body #gform_wrapper_4 #field_4_197 .ginput_container_consent::before {
  content: "*";
  position: absolute;
  top: -18px;
  left: 0;
  color: #CAFA94 !important;
  font-size: 16px;
  line-height: 1;
  z-index: 999;
  display: block;
}



/* === METODER: REQUIRED ASTERISK === */
/* Adds a visual asterisk at the top-left of the visible H4 heading */
body #gform_wrapper_4 .gf-delivery-shipping-heading {
  position: relative;
  display: inline-block;
}

body #gform_wrapper_4 .gf-delivery-shipping-heading::before {
  content: "*";
  position: absolute;
  top: 6px;
  left: -11px;
  color: #CAFA94;
  font-size: 16px;
  line-height: 1;
}

/* === SUBMIT BUTTON === */
/* Dark green button with beige border and a lower, flatter shape */
body #gform_wrapper_4 .gform_footer input[type="submit"],
body #gform_wrapper_4 .gform_page_footer input[type="submit"],
body #gform_wrapper_4 .gform_button {
  background-color: #314632 !important;
  color: var(--gf-form-beige) !important;
  border: 1px solid var(--gf-form-beige) !important;
  border-radius: 4px !important;
  box-shadow: none !important;
  height: auto !important;
  min-height: 0 !important;
  line-height: 1.2 !important;
  padding: 4px 22px !important;
}


/* === SUBMIT BUTTON: DIVI-LIKE HOVER ARROW === */
body #gform_wrapper_4 .gform_footer input[type="submit"],
body #gform_wrapper_4 .gform_page_footer input[type="submit"],
body #gform_wrapper_4 .gform_button {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 10 10' fill='none'%3E%3Cpath d='M3 1.5L7 5L3 8.5' stroke='%23F7FFDC' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: right 12px center !important;
  background-size: 0 10px !important;
  transition: padding 0.2s ease, background-size 0.2s ease, transform 0.2s ease;
}

body #gform_wrapper_4 .gform_footer input[type="submit"]:hover,
body #gform_wrapper_4 .gform_page_footer input[type="submit"]:hover,
body #gform_wrapper_4 .gform_button:hover {
  padding-right: 34px !important;
  background-size: 10px 10px !important;
  transform: scale(1.02);
}

body #gform_wrapper_4 .gform_footer,
body #gform_wrapper_4 .gform_page_footer {
  margin-top: 60px !important;
}



/* === TOTAL FIELD === */
/* Gives the total room to breathe and makes it read like a summary, not an editable input. */
body #gform_wrapper_4 .gfield--type-total {
  margin-top: 28px;
}

body #gform_wrapper_4 .gfield--type-total .gfield_label {
  margin-bottom: 10px !important;
}

body #gform_wrapper_4 .gfield--type-total .ginput_container_total input,
body #gform_wrapper_4 .gfield--type-total input.ginput_total {
  width: auto !important;
  min-width: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--gf-form-beige) !important;
  font-size: 16px !important;
  line-height: 1.1 !important;
}

body #gform_wrapper_4 .gf-total-heading {
  font-family: "Faculty Glyphic", Helvetica, Arial, Lucida, sans-serif;
  font-size: 18px;
  line-height: 1.7em;
  font-weight: 400;
  color: #CAFA94 !important;
  margin: 0 0 12px !important;
}



body #gform_wrapper_4 .gfield--type-total {
  margin-top: 90px !important;
}

body #gform_wrapper_4 .gfield--type-total {
  border-top: 1px solid var(--gf-form-beige);
  padding-top: 18px;
  margin-top: 28px;
}



/* On validation error, reveal the label container but hide the label text */
body #gform_wrapper_4 .gfield_error > .gfield_label {
  position: static !important;
  width: auto !important;
  height: auto !important;
  padding: 0 !important;
  margin: 8px 0 0 !important;
  overflow: visible !important;
  clip: auto !important;
  white-space: normal !important;
  border: 0 !important;
  display: block !important;
  color: transparent !important;
  font-size: 0 !important;
  line-height: 0 !important;
}

/* Keep the native "(Required)" hidden, but output your own message */
body #gform_wrapper_4 .gfield_error > .gfield_label .gfield_required_text {
  display: inline !important;
  color: transparent !important;
  font-size: 0 !important;
  line-height: 0 !important;
}

body #gform_wrapper_4 .gfield_error > .gfield_label .gfield_required_text::after {
  content: "Obligatorisk felt";
  color: #f4b6b6;
  font-size: 14px;
  line-height: 1.4;
}



/* === REQUIRED + VALIDATION FIX === */
/* Paste this at the very end of your Gravity Forms CSS */

/* Keep native labels hidden, even on error */
body #gform_wrapper_4 .gf-customer-field > .gfield_label,
body #gform_wrapper_4 .gf-delivery-shipping > .gfield_label,
body #gform_wrapper_4 #field_4_184 > .gfield_label,
body #gform_wrapper_4 #field_4_185 > .gfield_label,
body #gform_wrapper_4 .gfield_error > .gfield_label {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
  display: block !important;
  color: inherit !important;
  font-size: inherit !important;
  line-height: inherit !important;
}

/* Never show the native Gravity Forms "(Required)" text */
body #gform_wrapper_4 .gfield_required_text,
body #gform_wrapper_4 .gfield_consent_label .gfield_required_text {
  display: none !important;
}

/* Cancel the earlier pseudo-message hack */
body #gform_wrapper_4 .gfield_error > .gfield_label .gfield_required_text::after {
  content: none !important;
}

/* Show the real Gravity Forms field validation messages */
body #gform_wrapper_4 .gfield_validation_message,
body #gform_wrapper_4 .gfield_error .validation_message {
  display: block !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  color: #FF970E !important;
  font-size: 14px !important;
  line-height: 1.4 !important;
  margin-top: 8px !important;
  padding: 0 !important;
}

/* Top validation summary */
body #gform_wrapper_4 .gform_validation_errors,
body #gform_wrapper_4 .validation_error {
  background: rgba(244, 182, 182, 0.08) !important;
  border: 1px solid rgba(244, 182, 182, 0.45) !important;
  color: #FF970E !important;
  box-shadow: none !important;
}

/* Highlight invalid fields */
body #gform_wrapper_4 .gfield_error input[type="text"],
body #gform_wrapper_4 .gfield_error input[type="email"],
body #gform_wrapper_4 .gfield_error input[type="tel"],
body #gform_wrapper_4 .gfield_error textarea,
body #gform_wrapper_4 .gfield_error select,
body #gform_wrapper_4 .gfield_error input[type="checkbox"],
body #gform_wrapper_4 .gfield_error input[type="radio"] {
  border-color: #FF970E !important;
}

/* Tint your custom headings when that field has an error */
body #gform_wrapper_4 .gfield_error .gf-delivery-shipping-heading,
body #gform_wrapper_4 .gfield_error .gf-delivery-date-heading,
body #gform_wrapper_4 .gfield_error .gf-customer-native-heading,
body #gform_wrapper_4 .gfield_error .gf-address-native-heading,
body #gform_wrapper_4 .gfield_error .gf-total-heading {
  color: #FF970E !important;
}




/* === VALIDATION SUMMARY: ORANGE NORWEGIAN ERROR BOX === */
/* Styles the top Gravity Forms validation message in orange, removes inner stroke/background,
   and removes the temporary focus outline shown after failed submission. */
body #gform_wrapper_4 .validation_error,
body #gform_wrapper_4 .gform_validation_errors {
  background: rgba(255, 151, 14, 0.08) !important;
  border: 1px solid #FF970E !important;
  color: #FF970E !important;
  box-shadow: none !important;
  outline: none !important;
}

body #gform_wrapper_4 .validation_error a,
body #gform_wrapper_4 .gform_validation_errors a,
body #gform_wrapper_4 .validation_error h2,
body #gform_wrapper_4 .gform_validation_errors h2,
body #gform_wrapper_4 .validation_error li,
body #gform_wrapper_4 .gform_validation_errors li,
body #gform_wrapper_4 .gform-icon,
body #gform_wrapper_4 .gform_validation_errors > h2 {
  color: #FF970E !important;
  fill: #FF970E !important;
}

body #gform_wrapper_4 .gform_validation_errors > h2,
body #gform_wrapper_4 .validation_error {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  outline: none !important;
}

body #gform_wrapper_4 .gform_validation_errors:focus,
body #gform_wrapper_4 .gform_validation_errors > h2:focus,
body #gform_wrapper_4 .validation_error:focus,
body #gform_wrapper_4 .gform_validation_errors:focus-visible,
body #gform_wrapper_4 .gform_validation_errors > h2:focus-visible,
body #gform_wrapper_4 .validation_error:focus-visible {
  outline: none !important;
  box-shadow: none !important;
}




/* === MOBILE: CONSENT ERROR MESSAGE ABOVE CHECKBOX, KEEP CHECKBOX TOP-ALIGNED === */
/* Reserves equal space above both the checkbox column and the consent-text column,
   so the validation message can sit above while the checkbox still aligns with the top of the beige text. */
@media (max-width: 767px) {
  body #gform_wrapper_4 #field_4_197.gfield_error,
  body #gform_wrapper_4 #field_4_199.gfield_error,
  body #gform_wrapper_4 #field_4_197.gfield_error + #field_4_198,
  body #gform_wrapper_4 #field_4_199.gfield_error + #field_4_200 {
    padding-top: 30px;
  }

  body #gform_wrapper_4 #field_4_197.gfield_error,
  body #gform_wrapper_4 #field_4_199.gfield_error {
    position: relative;
  }

  body #gform_wrapper_4 #field_4_197 .gfield_validation_message,
  body #gform_wrapper_4 #field_4_197 .validation_message,
  body #gform_wrapper_4 #field_4_199 .gfield_validation_message,
  body #gform_wrapper_4 #field_4_199 .validation_message {
    position: absolute;
    top: 0;
    left: 0;
    width: 220px;
    max-width: calc(100vw - 72px);
    margin: 0 !important;
    line-height: 1.55 !important;
  }
}



/* === CONFIRMATION MESSAGE === */
/* Styles the thank-you text and the order summary heading after successful submission */
body #gform_confirmation_wrapper_4 .gform_confirmation_message,
body #gform_confirmation_wrapper_4 .gform_confirmation_message p {
  color: var(--gf-form-beige) !important;
  font-size: 20px;
  line-height: 1.6;
}

body #gform_confirmation_wrapper_4 .gform_confirmation_message h3 {
  color: #CAFA94 !important;
  font-family: "Faculty Glyphic", Helvetica, Arial, Lucida, sans-serif;
  font-size: 22px;
  line-height: 1.3;
  font-weight: 400;
  margin: 28px 0 12px;
}


/* === GRØNNSAKER > POTET: HARD OVERRIDE FOR EMPTY SPACER FIELD === */
body #gform_wrapper_4 #field_4_104 {
  display: none !important;
}

/* === CONFIRMATION MESSAGE: BEIGE ARIAL BODY TEXT === */
/* Styles only the thank-you paragraphs after submit, without recoloring the order table text. */
body #gform_confirmation_wrapper_4 .gform_confirmation_message > p {
  color: #F7FFDC !important;
  font-family: Arial, Helvetica, sans-serif !important;
  font-size: 18px !important;
  line-height: 1.6 !important;
  font-weight: 400 !important;
}

body #gform_confirmation_wrapper_4 .gform_confirmation_message h3 {
  color: #CAFA94 !important;
}


body #gform_confirmation_wrapper_4 {
  scroll-margin-top: 180px;
}


/* Hide the visible divider/padding on the blank product wrapper section */
body #gform_wrapper_4 .gf-product-block-start.gfield--type-section {
  display: none !important;
}




/* === MOBILE: KEEP MAIN GROUP CHECKBOXES FULLY VISIBLE === */
@media (max-width: 767px) {
  body #gform_wrapper_4 .gf-section-toggle-title {
    padding-left: 40px !important;
  }

  body #gform_wrapper_4 .gf-section-toggle-title + .gf-section-toggle-checkbox .ginput_container_checkbox {
    top: -47px;
    left: 11px !important;
    margin: 0 !important;
  }

  #Bestillingsskjema {
    overflow: visible !important;
  }
}



/* === HIDDEN PRODUCT WRAPPERS: REMOVE THEM FROM THE GRID === */
/* The hidden product field should still submit, but its wrapper should not reserve layout space */
body #gform_wrapper_4 .gfield_hidden_product,
body #gform_wrapper_4 .gfield.gform_hidden.gfield--type-product {
  display: none !important;
  margin: 0 !important;
  padding: 0 !important;
  min-height: 0 !important;
  border: 0 !important;
}



/* === DESKTOP: EVEN SPACING AROUND GROUP HELPER NOTES === */
/* Keeps the note under Potet and similar groups equally spaced above and below */
@media (min-width: 768px) {
  body #gform_wrapper_4 .gf-product-block-start + .gfield_html {
    margin-top: 10px !important;
    margin-bottom: 10px !important;
  }

  body #gform_wrapper_4 .gf-product-block-start + .gfield_html .gf-helper-note,
  body #gform_wrapper_4 .gf-product-block-start + .gfield_html .gf-helper-note p,
  body #gform_wrapper_4 .gf-product-block-start + .gfield_html p.gf-helper-note {
    margin: 0 !important;
  }
}


/* === DESKTOP: REMOVE GAP ABOVE PRODUCT GROUP NOTES === */
@media (min-width: 768px) {
  body #gform_wrapper_4 .gf-product-block-start.gfield--type-section {
    display: none !important;
  }

  body #gform_wrapper_4 .gf-product-block-start + .gfield_html,
  body #gform_wrapper_4 #field_4_47,
  body #gform_wrapper_4 #field_4_211,
  body #gform_wrapper_4 #field_4_221,
  body #gform_wrapper_4 #field_4_256,
  body #gform_wrapper_4 #field_4_244 {
    margin-top: -28px !important;
    margin-bottom: 10px !important;
  }

  body #gform_wrapper_4 .gf-helper-note,
  body #gform_wrapper_4 p.gf-helper-note {
    margin: 0 !important;
  }
}



/* === DESKTOP: SPACE AFTER EXPANDED PRODUCT GROUPS === */
/* Adds space before the next main group only when the group above is opened */
@media (min-width: 768px) {
  body #gform_wrapper_4 #gform_fields_4:has(#choice_4_206_1:checked) #field_4_204,
  body #gform_wrapper_4 #gform_fields_4:has(#choice_4_100_1:checked) #field_4_205,
  body #gform_wrapper_4 #gform_fields_4:has(#choice_4_170_1:checked) #field_4_171,
  body #gform_wrapper_4 #gform_fields_4:has(#choice_4_172_1:checked) #field_4_174,
  body #gform_wrapper_4 #gform_fields_4:has(#choice_4_173_1:checked) #field_4_176 {
    margin-top: 56px !important;
  }
}


/* === MOBILE: SPACE AFTER NOTE-ONLY PRODUCT GROUPS === */
/* Adds breathing room after group notes before the next main group title */
@media (max-width: 767px) {
  body #gform_wrapper_4 #field_4_47,
  body #gform_wrapper_4 #field_4_211,
  body #gform_wrapper_4 #field_4_256 {
    margin-bottom: 38px !important;
  }
}



/* === MOBILE: PRODUCT NOTES POSITION === */
/* Pulls notes closer to the product above, while adding breathing room before the next product */
@media (max-width: 767px) {
  body #gform_wrapper_4 .gf-row-note {
    margin-top: -35px !important;
    margin-bottom: 35px !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    line-height: 1.35;
  }
}


/* === ORDER FORM PRODUCT IMAGE ZOOM === */

body #gform_wrapper_4,
body #gform_wrapper_4 #gform_fields_4,
body #gform_wrapper_4 .gfield,
body #gform_wrapper_4 .gf-row-product-main,
body #gform_wrapper_4 .gf-product-main,
body #gform_wrapper_4 .gf-product-media {
  overflow: visible !important;
}

body #gform_wrapper_4 .gf-row-product-main {
  position: relative !important;
  z-index: 1 !important;
}

body #gform_wrapper_4 .gf-row-product-main:hover,
body #gform_wrapper_4 .gf-row-product-main.is-zoomed {
  z-index: 999999 !important;
}

body #gform_wrapper_4 .gf-product-main,
body #gform_wrapper_4 .gf-product-media {
  position: relative !important;
}

body #gform_wrapper_4 .gf-product-media img {
  display: block !important;
  width: 40px !important;
  height: 40px !important;
  max-width: none !important;
  object-fit: cover !important;
  position: relative !important;
  z-index: 10 !important;
  transform: scale(1) !important;
  transform-origin: left top !important;
  transition: transform 0.18s ease, box-shadow 0.18s ease !important;
  cursor: zoom-in;
}

body #gform_wrapper_4 .gf-row-product-main:hover .gf-product-media img,
body #gform_wrapper_4 .gf-row-product-main.is-zoomed .gf-product-media img {
  transform: scale(4) !important;
  z-index: 999999 !important;
  box-shadow: 0 10px 28px rgba(0,0,0,.35) !important;
  cursor: zoom-out;
}

/* On touch devices, disable sticky hover and use JS toggle only */
@media (hover: none), (pointer: coarse) {
  body #gform_wrapper_4 .gf-row-product-main:hover .gf-product-media img {
    transform: scale(1) !important;
    box-shadow: none !important;
  }

  body #gform_wrapper_4 .gf-row-product-main.is-zoomed .gf-product-media img {
    transform: scale(4) !important;
    z-index: 999999 !important;
    box-shadow: 0 10px 28px rgba(0,0,0,.35) !important;
  }
}


@media (max-width: 767px) {
  .product-carousel.et_pb_group_carousel.et_pb_group_carousel_slides_5 .et_pb_group_carousel_slide {
    flex: 0 0 33.3333% !important;
    min-width: 33.3333% !important;
  }
}

@media (min-width: 768px) and (max-width: 980px) {
  .product-carousel.et_pb_group_carousel.et_pb_group_carousel_slides_5 .et_pb_group_carousel_slide {
    flex: 0 0 25% !important;
    min-width: 25% !important;
  }
}


/* Test form 4: keep all quantity dropdowns the same width */
body #gform_wrapper_4 .gf-row-qty select {
  width: 110px !important;
  min-width: 110px !important;
  box-sizing: border-box !important;
  padding-right: 32px !important;
}

/* Gravity Forms shipping method labels: encoding-safe Norwegian characters.
   Paste at the very bottom of the child theme style.css. */

body #gform_wrapper_1 .gf-delivery-shipping .gchoice_1_184_0 label::before,
body #gform_wrapper_1 #field_1_184 .gchoice_1_184_0 label::before,
body #gform_wrapper_4 .gf-delivery-shipping .gchoice_4_184_0 label::before,
body #gform_wrapper_4 #field_4_184 .gchoice_4_184_0 label::before {
  content: "Hent p\0000E5\000020g\0000E5rd" !important;
}

body #gform_wrapper_1 .gf-delivery-shipping .gchoice_1_184_1 label::before,
body #gform_wrapper_1 #field_1_184 .gchoice_1_184_1 label::before,
body #gform_wrapper_4 .gf-delivery-shipping .gchoice_4_184_1 label::before,
body #gform_wrapper_4 #field_4_184 .gchoice_4_184_1 label::before {
  content: "M\0000F8t oss p\0000E5\000020neste REKO-ring Harstad" !important;
}

body #gform_wrapper_1 .gf-delivery-shipping .gchoice_1_184_2 label::before,
body #gform_wrapper_1 #field_1_184 .gchoice_1_184_2 label::before,
body #gform_wrapper_4 .gf-delivery-shipping .gchoice_4_184_2 label::before,
body #gform_wrapper_4 #field_4_184 .gchoice_4_184_2 label::before {
  content: "Hentepunkt R\0000F8de Kors Borkenes" !important;
}

body #gform_wrapper_1 .gf-delivery-shipping .gchoice_1_184_3 label::before,
body #gform_wrapper_1 #field_1_184 .gchoice_1_184_3 label::before,
body #gform_wrapper_4 .gf-delivery-shipping .gchoice_4_184_3 label::before,
body #gform_wrapper_4 #field_4_184 .gchoice_4_184_3 label::before {
  content: "Hentepunkt Kinsarvik Sj\0000F8kanten Senter" !important;
}

body #gform_wrapper_1 .gf-delivery-shipping .gchoice_1_184_4 label::before,
body #gform_wrapper_1 #field_1_184 .gchoice_1_184_4 label::before,
body #gform_wrapper_4 .gf-delivery-shipping .gchoice_4_184_4 label::before,
body #gform_wrapper_4 #field_4_184 .gchoice_4_184_4 label::before {
  content: "Tilleggslevering for abonnementskunder" !important;
}


/* Test form 4: add mobile spacing after open Potet subgroups before Egg */
@media (max-width: 767px) {
  body #gform_wrapper_4 #gform_fields_4:has(#choice_4_100_1:checked) #field_4_205 {
    margin-top: 80px !important;
  }
}






























































/* === TEST FORM 5 COPY OF GRAVITY FORMS CSS ===
   Paste this after the existing Gravity Forms CSS while testing the duplicated form. */

/* GRAVITY FORMS START */


/* === BRAND COLORS + BASE FORM TEXT === */
/* Shared brand colors and main text color for the whole Gravity Form */
body #gform_wrapper_5 {
  --gf-brand-turquoise: #8CF7D4;
  --gf-form-beige: #F7FFDC;
  color: var(--gf-form-beige);
}


/* === GLOBAL FORM TEXT === */
/* Standard labels, legends, descriptions, HTML fields, links, and form controls */
body #gform_wrapper_5 .gfield_label,
body #gform_wrapper_5 legend,
body #gform_wrapper_5 .gsection_title,
body #gform_wrapper_5 input,
body #gform_wrapper_5 select,
body #gform_wrapper_5 textarea,
body #gform_wrapper_5 .gfield_description,
body #gform_wrapper_5 .gf-helper-note,
body #gform_wrapper_5 .gfield_html,
body #gform_wrapper_5 a {
  color: var(--gf-form-beige);
}

body #gform_wrapper_5 input::placeholder,
body #gform_wrapper_5 textarea::placeholder {
  color: var(--gf-form-beige);
  opacity: 1;
}


/* === REGISTRATION LINK === */
/* Keeps the helper link beige with a visible underline */
body #gform_wrapper_5 .gf-helper-link {
  color: var(--gf-form-beige) !important;
  text-decoration: none !important;
  border-bottom: 1px solid currentColor;
  display: inline-block;
  line-height: 1.2;
}


/* === REUSABLE CHECKBOX FIELD === */
/* Checkbox sits close to the label and stays vertically centered */
body #gform_wrapper_5 .gf-toggle-checkbox {
  position: relative;
  min-height: 24px;
}

body #gform_wrapper_5 .gf-toggle-checkbox .gfield_label {
  display: inline-block;
  margin: 0;
  min-width: 52px;
  line-height: 24px;
  white-space: nowrap;
  padding-left: 32px; 
}

body #gform_wrapper_5 .gf-toggle-checkbox .ginput_container_checkbox {
  position: absolute;
  top: 50%;
  left: 0px;
  transform: translateY(-113%);
  margin-top: 0;
}

body #gform_wrapper_5 .gf-toggle-checkbox .gfield_checkbox,
body #gform_wrapper_5 .gf-toggle-checkbox .gchoice {
  display: flex;
  align-items: center;
}

body #gform_wrapper_5 .gf-toggle-checkbox input[type="checkbox"] {
  margin: 0;
}


/* === PRODUCT COLUMN === */
/* Image + product name */
body #gform_wrapper_5 .gf-row-product-main .gf-product-main {
  display: grid;
  grid-template-columns: 40px minmax(0, 1fr);
  column-gap: 12px;
  align-items: start;
}

body #gform_wrapper_5 .gf-row-product-main .gf-product-media {
  line-height: 0;
}

body #gform_wrapper_5 .gf-row-product-main .gf-product-media img {
  display: block;
  width: 40px;
  height: 40px;
  object-fit: cover;
}

body #gform_wrapper_5 .gf-row-product-main .gf-product-name {
  font-weight: 600;
  line-height: 1.2;
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: normal;
  max-width: 12ch;
  align-self: start;
}



/* === META COLUMN === */
/* Weight + price */
body #gform_wrapper_5 .gf-row-meta {
  text-align: left !important;
}

body #gform_wrapper_5 .gf-row-meta .gf-product-meta-wrap {
  display: grid;
  grid-template-columns: minmax(0, 72px) minmax(0, 46px);
  column-gap: 37px;
  align-items: start;
  justify-content: start;
}

body #gform_wrapper_5 .gf-row-meta .gf-product-meta,
body #gform_wrapper_5 .gf-row-meta .gf-product-price {
  line-height: 1.2;
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: normal;
}



/* === QUANTITY FIELD === */
/* Native Gravity Forms quantity with dark background and beige arrow */
body #gform_wrapper_5 .gf-row-qty {
  --gf-icon-ctrl-select: url("data:image/svg+xml,%3Csvg width='10' height='6' viewBox='0 0 10 6' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M0.292893 0.292893C0.683417 -0.097631 1.31658 -0.097631 1.70711 0.292893L5 3.58579L8.29289 0.292893C8.68342 -0.0976311 9.31658 -0.0976311 9.70711 0.292893C10.0976 0.683417 10.0976 1.31658 9.70711 1.70711L5.70711 5.70711C5.31658 6.09763 4.68342 6.09763 4.29289 5.70711L0.292893 1.70711C-0.0976311 1.31658 -0.0976311 0.683418 0.292893 0.292893Z' fill='%23F7FFDC'/%3E%3C/svg%3E");
  display: flex;
  justify-content: center;
  position: relative;
  left: 0;
}

body #gform_wrapper_5 .gf-row-qty .ginput_container {
  width: auto;
  margin-top: 0;
}

body #gform_wrapper_5 .gf-row-qty .gfield_label {
  text-align: center;
}

body #gform_wrapper_5 .gf-row-qty input,
body #gform_wrapper_5 .gf-row-qty select {
  background-color: #314632 !important;
  border-color: #314632 !important;
  color: var(--gf-form-beige) !important;
}

body #gform_wrapper_5 .gf-row-qty select {
  background-image: var(--gf-icon-ctrl-select) !important;
  background-repeat: no-repeat;
  background-position: right 12px center;
  position: relative;
  top: -10px;
}


/* === TURQUOISE HEADERS === */
/* Labels above the four visible columns */
body #gform_wrapper_5 .gf-row-product-header .gf-product-header-main {
  color: var(--gf-brand-turquoise) !important;
  font-size: 12px;
  line-height: 1.2;
  white-space: nowrap;
}

body #gform_wrapper_5 .gf-row-meta-header {
  text-align: left !important;
}

body #gform_wrapper_5 .gf-row-meta-header .gf-product-header-meta {
  display: grid;
  grid-template-columns: 72px 90px;
  column-gap: 37px;
  justify-content: start;
  color: var(--gf-brand-turquoise) !important;
  font-size: 12px;
  line-height: 1.2;
  white-space: nowrap;
}

body #gform_wrapper_5 .gf-row-meta-header .gf-product-header-meta-label,
body #gform_wrapper_5 .gf-row-meta-header .gf-product-header-price-label {
  color: var(--gf-brand-turquoise) !important;
  white-space: nowrap;
}

body #gform_wrapper_5 .gf-row-meta-header .gf-product-header-price-label {
  position: relative;
  left: 0;
}

body #gform_wrapper_5 .gf-row-qty-header {
  text-align: center !important;
}

body #gform_wrapper_5 .gf-row-qty-header .gf-product-header-qty {
  display: block;
  color: var(--gf-brand-turquoise) !important;
  font-size: 12px;
  line-height: 1.2;
  text-align: center;
}

body #gform_wrapper_5 .gf-row-note-header .gf-product-header-note {
  color: var(--gf-brand-turquoise) !important;
  font-size: 12px;
  line-height: 1.2;
}


/* === MOBILE: FIRST LINE = PRODUCT + META === */
/* Applies to all copied rows through shared classes */
@media (max-width: 767px) {
  body #gform_wrapper_5 .gf-row-product-main,
  body #gform_wrapper_5 .gf-row-meta {
    grid-column: span 6 !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    align-self: start;
  }

  body #gform_wrapper_5 .gf-row-product-main .gf-product-main {
    grid-template-columns: 40px minmax(0, 1fr);
    padding-top: 45px;
  }

  body #gform_wrapper_5 .gf-row-product-main .gf-product-name {
    min-width: 0;
    white-space: normal;
    overflow-wrap: anywhere;
    word-break: break-word;
  }

  body #gform_wrapper_5 .gf-row-meta {
    padding-bottom: 8px !important;
  }

  body #gform_wrapper_5 .gf-row-meta .gf-product-meta-wrap {
    display: grid;
    grid-template-columns: minmax(0, 72px) minmax(0, 62px);
    column-gap: 14px;
    justify-content: start;
    align-items: start;
    padding-top: 45px;
  }

  body #gform_wrapper_5 .gf-row-meta .gf-product-meta,
  body #gform_wrapper_5 .gf-row-meta .gf-product-price {
    min-width: 0;
    display: block;
    overflow: visible;
    line-height: 1.35;
    white-space: normal;
    overflow-wrap: normal;
    word-break: normal;
  }
}

/* === MOBILE: QUANTITY === */
/* Quantity stays on its own row, right-aligned */
@media (max-width: 767px) {
  body #gform_wrapper_5 .gf-row-qty {
    grid-column: span 12 !important;
    justify-content: flex-end;
    left: -6px;
    margin-top: 15px !important;
    padding-bottom: 26px !important;
  }

  body #gform_wrapper_5 .gf-row-qty .ginput_container {
    width: auto;
    margin-top: 0;
  }

  body #gform_wrapper_5 .gf-row-qty select {
    top: -10px;
    margin-left: 0;
    margin-right: 0;
  }
}

/* === MOBILE: NOTES === */
/* Notes stay below quantity */
@media (max-width: 767px) {
  body #gform_wrapper_5 .gf-row-note {
    grid-column: span 12 !important;
    margin-top: 0 !important;
  }

  body #gform_wrapper_5 #gform_fields_5 {
    row-gap: 8px !important;
  }
}


/* === MOBILE: HIDE TURQUOISE PRODUCT HEADERS === */
@media (max-width: 767px) {
  body #gform_wrapper_5 .gf-row-product-header,
  body #gform_wrapper_5 .gf-row-meta-header,
  body #gform_wrapper_5 .gf-row-qty-header,
  body #gform_wrapper_5 .gf-row-note-header {
    display: none !important;
  }
}


/* === HIDDEN PRODUCT ROWS: REMOVE HIDDEN FIELDS FROM THE 4-COLUMN GRID === */
/* Keeps copied rows aligned when Gravity Forms fields are hidden in the frontend */
body #gform_wrapper_5 .gf-row-product-main.gfield_visibility_hidden,
body #gform_wrapper_5 .gf-row-meta.gfield_visibility_hidden,
body #gform_wrapper_5 .gf-row-qty.gfield_visibility_hidden,
body #gform_wrapper_5 .gf-row-note.gfield_visibility_hidden,
body #gform_wrapper_5 .gf-row-product-header.gfield_visibility_hidden,
body #gform_wrapper_5 .gf-row-meta-header.gfield_visibility_hidden,
body #gform_wrapper_5 .gf-row-qty-header.gfield_visibility_hidden,
body #gform_wrapper_5 .gf-row-note-header.gfield_visibility_hidden {
  display: none !important;
  margin: 0 !important;
  padding: 0 !important;
}



/* === SECTION TOGGLE: PLACE CHECKBOX TO THE LEFT OF THE SECTION TITLE === */
/* Use on a Section field followed immediately by its checkbox field */
body #gform_wrapper_5 .gf-section-toggle-title {
  grid-column: 1 / -1 !important;
  margin-bottom: 0 !important;
  padding-left: 32px;
  position: relative;
}

body #gform_wrapper_5 .gf-section-toggle-title .gsection_title {
  margin-bottom: 0 !important;
}

body #gform_wrapper_5 .gf-section-toggle-title + .gf-section-toggle-checkbox {
  grid-column: 1 / -1 !important;
  width: 0 !important;
  height: 0 !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  position: relative;
  z-index: 2;
}

body #gform_wrapper_5 .gf-section-toggle-title + .gf-section-toggle-checkbox .gfield_label {
  display: none !important;
}

body #gform_wrapper_5 .gf-section-toggle-title + .gf-section-toggle-checkbox .ginput_container_checkbox {
  position: relative !important;
  top: -80px;
  left: 0;
  transform: none !important;
  margin: 0 !important;
}

body #gform_wrapper_5 .gf-section-toggle-title + .gf-section-toggle-checkbox .gfield_checkbox,
body #gform_wrapper_5 .gf-section-toggle-title + .gf-section-toggle-checkbox .gchoice {
  display: flex;
  align-items: center;
}

body #gform_wrapper_5 .gf-section-toggle-title + .gf-section-toggle-checkbox input[type="checkbox"] {
  margin: 0;
}

/* === MOBILE ONLY: KEEP THE SECTION CHECKBOX LEFT OF THE TITLE === */
/* Positions the checkbox to the left of the section title on phones */
@media (max-width: 767px) {
  body #gform_wrapper_5 .gf-section-toggle-title {
    grid-column: 1 / -1 !important;
    padding-left: 28px;
  }

  body #gform_wrapper_5 .gf-section-toggle-title + .gf-section-toggle-checkbox {
    grid-column: 1 / -1 !important;
    width: 0 !important;
    height: 0 !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
  }

  body #gform_wrapper_5 .gf-section-toggle-title + .gf-section-toggle-checkbox .ginput_container_checkbox {
    position: relative !important;
    top: -47px;
    left: 0;
    transform: none !important;
    margin: 0 !important;
  }
}

/* === CATEGORY CHECKBOX: ALIGN NORMAL TOGGLES WITH THE SECTION TOGGLE === */
/* Moves Potet-style checkbox fields slightly left to match the section title/checkbox line above */
body #gform_wrapper_5 .gf-toggle-checkbox:not(.gf-section-toggle-checkbox) {
  margin-left: 25px;
}

/* === CATEGORY CHECKBOX LABEL SIZE === */
/* Sets Potet-style checkbox labels to 22px */
body #gform_wrapper_5 .gf-toggle-checkbox:not(.gf-section-toggle-checkbox) .gfield_label {
  font-size: 18px;
}

/* === TOGGLE CHECKBOXES: HIDE THE INLINE CHOICE LABEL === */
/* We use the field label as the visible text, so the inner choice label should stay hidden */
body #gform_wrapper_5 .gf-section-toggle-checkbox .gform-field-label--type-inline,
body #gform_wrapper_5 .gf-toggle-checkbox .gform-field-label--type-inline {
  display: none !important;
}


/* === SECTION TOGGLE: NUDGE THE GRONNSAKER CHECKBOX BACK LEFT === */
/* Re-aligns the main group checkbox with Potet and Rotter after hiding the inline label */
body #gform_wrapper_5 .gf-section-toggle-title + .gf-section-toggle-checkbox .ginput_container_checkbox {
  left: 0;
}



/* === MAIN FORM SECTION TITLES === */
/* Reusable centered beige H3 headings for top-level form sections */
body #gform_wrapper_5 .gf-main-section-heading {
  margin: 56px 0 28px;
  color: var(--gf-form-beige);
  font-size: 34px;
  line-height: 1.7;
  text-align: center;
  font-weight: 400;
  padding-bottom: 60px;
}

@media (max-width: 767px) {
  body #gform_wrapper_5 .gf-main-section-heading {
    margin: 40px 0 22px;
    font-size: 28px;
	padding-bottom: 50px;
  }
}

/* === END OF VEGETABLE GROUP === */
/* Adds space below the last visible vegetable subgroup */
body #gform_wrapper_5 .gf-end-of-veg-group {
  margin-bottom: 56px !important;
}

/* === PRODUCT SECTION TITLES + SUBGROUP LABELS === */
/* Main category titles stay green, subgroup labels return to beige */
body #gform_wrapper_5 .gf-semantic-h4 .gsection_title {
  color: #CAFA94 !important;
}

body #gform_wrapper_5 .gf-toggle-checkbox:not(.gf-section-toggle-checkbox) .gfield_label {
  color: var(--gf-form-beige) !important;
}




/* === CHECKBOXES: DARK GREEN FILL WITH BEIGE STROKE === */
/* Styles both main-group and subgroup checkboxes */
body #gform_wrapper_5 input[type="checkbox"] {
  appearance: none;
  -webkit-appearance: none;
  width: 20px;
  height: 20px;
  background: #314632;
  border: 1.5px solid var(--gf-form-beige);
  border-radius: 2px;
  display: inline-grid;
  place-content: center;
  cursor: pointer;
}

body #gform_wrapper_5 input[type="checkbox"]::before {
  content: "";
  width: 10px;
  height: 10px;
  transform: scale(0);
  transition: transform 80ms ease-in-out;
  background: var(--gf-form-beige);
  clip-path: polygon(14% 44%, 0 65%, 50% 100%, 100% 16%, 80% 0, 43% 62%);
}

body #gform_wrapper_5 input[type="checkbox"]:checked::before {
  transform: scale(1);
}


/* === DELIVERY SUBHEADING === */
/* Makes Metoder match the green H4 subgroup headings */
body #gform_wrapper_5 .gf-delivery-subheading {
  margin: 0;
  color: #CAFA94 !important;
  font-size: 22px;
  line-height: 1.2;
  font-weight: 400;
}


/* === DELIVERY EXPLANATORY TEXT === */
/* Beige helper text to the right of Metoder */
body #gform_wrapper_5 .gf-delivery-note,
body #gform_wrapper_5 .gf-delivery-note p {
  color: var(--gf-form-beige);
  font-size: 16px;
  line-height: 1.35;
  margin: 0 0 18px;
}

body #gform_wrapper_5 .gf-delivery-note p:last-child {
  margin-bottom: 0;
}







/* === DELIVERY SHIPPING FIELD === */
/* Styles the shipping methods as: method, guide line, price, selector */
body #gform_wrapper_5 .gf-delivery-shipping,
body #gform_wrapper_5 #field_5_184 {
  max-width: 760px;
}

/* Hide the native legend visually, but keep it for accessibility */
body #gform_wrapper_5 .gf-delivery-shipping > .gfield_label,
body #gform_wrapper_5 #field_5_184 > .gfield_label {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

/* Real H4 inserted by PHP */
body #gform_wrapper_5 .gf-delivery-shipping-heading {
  margin: 0 0 18px;
}


body #gform_wrapper_5 .gf-delivery-shipping .ginput_container_radio,
body #gform_wrapper_5 #field_5_184 .ginput_container_radio {
  margin-top: 0;
}

body #gform_wrapper_5 .gf-delivery-shipping .gfield_radio,
body #gform_wrapper_5 #field_5_184 .gfield_radio {
  display: grid;
  row-gap: 14px;
}

body #gform_wrapper_5 .gf-delivery-shipping .gchoice,
body #gform_wrapper_5 #field_5_184 .gchoice {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto 22px;
  column-gap: 14px;
  align-items: center;
}

/* Hide the live label text visually; Gravity Forms can still mutate it */
body #gform_wrapper_5 .gf-delivery-shipping .gchoice label,
body #gform_wrapper_5 #field_5_184 .gchoice label {
  grid-column: 1;
  grid-row: 1;
  min-width: 0;
  margin: 0;
  color: transparent !important;
  font-size: 0;
  display: flex;
  align-items: center;
  gap: 14px;
}

/* Render the visible method names ourselves */
body #gform_wrapper_5 .gf-delivery-shipping .gchoice label::before,
body #gform_wrapper_5 #field_5_184 .gchoice label::before {
  color: var(--gf-form-beige);
  font-size: 16px;
  line-height: 1.2;
  white-space: nowrap;
}

body #gform_wrapper_5 .gf-delivery-shipping .gchoice_5_184_0 label::before,
body #gform_wrapper_5 #field_5_184 .gchoice_5_184_0 label::before {
  content: "Hent p\0000E5\000020g\0000E5rd";
}

body #gform_wrapper_5 .gf-delivery-shipping .gchoice_5_184_1 label::before,
body #gform_wrapper_5 #field_5_184 .gchoice_5_184_1 label::before {
  content: "M\0000F8t oss p\0000E5\000020neste REKO-ring Harstad";
}

body #gform_wrapper_5 .gf-delivery-shipping .gchoice_5_184_2 label::before,
body #gform_wrapper_5 #field_5_184 .gchoice_5_184_2 label::before {
  content: "Hentepunkt R\0000F8de Kors Borkenes";
}

body #gform_wrapper_5 .gf-delivery-shipping .gchoice_5_184_3 label::before,
body #gform_wrapper_5 #field_5_184 .gchoice_5_184_3 label::before {
  content: "Hentepunkt Kinsarvik Sj\0000F8kanten Senter";
}

body #gform_wrapper_5 .gf-delivery-shipping .gchoice_5_184_4 label::before,
body #gform_wrapper_5 #field_5_184 .gchoice_5_184_4 label::before {
  content: "Tilleggslevering for abonnementskunder";
}

/* Guide line */
body #gform_wrapper_5 .gf-delivery-shipping .gchoice label::after,
body #gform_wrapper_5 #field_5_184 .gchoice label::after {
  content: "";
  flex: 1 1 auto;
  min-width: 28px;
  border-bottom: 1px solid var(--gf-form-beige);
  opacity: 0.9;
}

/* Price column */
body #gform_wrapper_5 .gf-delivery-shipping .gchoice::after,
body #gform_wrapper_5 #field_5_184 .gchoice::after {
  grid-column: 2;
  grid-row: 1;
  color: var(--gf-form-beige);
  white-space: nowrap;
}

body #gform_wrapper_5 .gf-delivery-shipping .gchoice_5_184_0::after,
body #gform_wrapper_5 #field_5_184 .gchoice_5_184_0::after {
  content: "0kr";
}

body #gform_wrapper_5 .gf-delivery-shipping .gchoice_5_184_1::after,
body #gform_wrapper_5 #field_5_184 .gchoice_5_184_1::after {
  content: "0kr";
}

body #gform_wrapper_5 .gf-delivery-shipping .gchoice_5_184_2::after,
body #gform_wrapper_5 #field_5_184 .gchoice_5_184_2::after {
  content: "39kr";
}

body #gform_wrapper_5 .gf-delivery-shipping .gchoice_5_184_3::after,
body #gform_wrapper_5 #field_5_184 .gchoice_5_184_3::after {
  content: "39kr";
}

body #gform_wrapper_5 .gf-delivery-shipping .gchoice_5_184_4::after,
body #gform_wrapper_5 #field_5_184 .gchoice_5_184_4::after {
  content: "0kr";
}



/* Selector on the right */
body #gform_wrapper_5 .gf-delivery-shipping .gchoice input[type="radio"],
body #gform_wrapper_5 #field_5_184 .gchoice input[type="radio"] {
  grid-column: 3;
  grid-row: 1;
  justify-self: end;
  align-self: center;
  margin: 0;
  appearance: none;
  -webkit-appearance: none;
  width: 16px;
  height: 16px;
  background: #314632;
  border: 1.5px solid var(--gf-form-beige);
  border-radius: 50%;
  display: inline-grid;
  place-content: center;
  cursor: pointer;
}

body #gform_wrapper_5 .gf-delivery-shipping .gchoice input[type="radio"]::before,
body #gform_wrapper_5 #field_5_184 .gchoice input[type="radio"]::before {
  content: "";
  width: 8px;
  height: 8px;
  transform: scale(0);
  border-radius: 50%;
  background: var(--gf-form-beige);
}

body #gform_wrapper_5 .gf-delivery-shipping .gchoice input[type="radio"]:checked::before,
body #gform_wrapper_5 #field_5_184 .gchoice input[type="radio"]:checked::before {
  transform: scale(1);
}

@media (max-width: 767px) {
  body #gform_wrapper_5 .gf-delivery-shipping .gfield_label,
  body #gform_wrapper_5 #field_5_184 .gfield_label {
    font-size: 20px;
  }

  body #gform_wrapper_5 .gf-delivery-shipping .gchoice,
  body #gform_wrapper_5 #field_5_184 .gchoice {
    column-gap: 10px;
  }

  body #gform_wrapper_5 .gf-delivery-shipping .gchoice label,
  body #gform_wrapper_5 #field_5_184 .gchoice label {
    gap: 10px;
  }

  body #gform_wrapper_5 .gf-delivery-shipping .gchoice label::before,
  body #gform_wrapper_5 #field_5_184 .gchoice label::before {
    font-size: 16px;
  }
}



/* === DELIVERY SHIPPING FIELD: MOBILE === */
/* Simplifies the shipping rows on phones so the method, price, and selector stay aligned */
@media (max-width: 767px) {
  body #gform_wrapper_5 .gf-delivery-shipping .gchoice,
  body #gform_wrapper_5 #field_5_184 .gchoice {
    grid-template-columns: minmax(0, 1fr) auto 20px;
    column-gap: 8px;
    align-items: start;
  }

  body #gform_wrapper_5 .gf-delivery-shipping .gchoice label,
  body #gform_wrapper_5 #field_5_184 .gchoice label {
    gap: 0;
    align-items: flex-start;
  }

  body #gform_wrapper_5 .gf-delivery-shipping .gchoice label::before,
  body #gform_wrapper_5 #field_5_184 .gchoice label::before {
    font-size: 16px;
    line-height: 1.3;
    white-space: normal;
  }

  body #gform_wrapper_5 .gf-delivery-shipping .gchoice label::after,
  body #gform_wrapper_5 #field_5_184 .gchoice label::after {
    display: none;
  }

  body #gform_wrapper_5 .gf-delivery-shipping .gchoice::after,
  body #gform_wrapper_5 #field_5_184 .gchoice::after {
    font-size: 16px;
    align-self: start;
    padding-top: 1px;
  }

  body #gform_wrapper_5 .gf-delivery-shipping .gchoice input[type="radio"],
  body #gform_wrapper_5 #field_5_184 .gchoice input[type="radio"] {
    width: 15px;
    height: 15px;
    align-self: start;
    margin-top: 2px;
  }

  body #gform_wrapper_5 .gf-delivery-shipping .gchoice input[type="radio"]::before,
  body #gform_wrapper_5 #field_5_184 .gchoice input[type="radio"]::before {
    width: 7px;
    height: 7px;
  }
}

/* === SHIPPING FIELD: MORE SPACE ABOVE METODER === */
/* Adds breathing room above the shipping module */
body #gform_wrapper_5 .gf-delivery-shipping,
body #gform_wrapper_5 #field_5_184 {
  margin-top: 30px;
  padding-top: 20px;
}


/* === DATE FIELD === */
/* Green H4 label, dark green input, and extra space above the field */
body #gform_wrapper_5 #field_5_185 {
  padding-top: 70px;
}

body #gform_wrapper_5 #field_5_185 .gfield_label {
  display: block !important;
  margin: 0 0 18px !important;
  color: #CAFA94 !important;
  font-size: 22px;
  line-height: 1.2;
  font-weight: 400;
}

body #gform_wrapper_5 #field_5_185 input,
body #gform_wrapper_5 #field_5_185 .datepicker {
  background-color: #314632 !important;
  border: 1px solid #314632 !important;
  color: var(--gf-form-beige) !important;
}

body #gform_wrapper_5 #field_5_185 input::placeholder,
body #gform_wrapper_5 #field_5_185 .datepicker::placeholder {
  color: var(--gf-form-beige) !important;
  opacity: 1;
}


body #gform_wrapper_5 #field_5_185 input::placeholder,
body #gform_wrapper_5 #field_5_185 .datepicker::placeholder {
  color: var(--gf-form-beige) !important;
  opacity: 1;
  font-size: 16px;
}

/* === DATE FIELD: LEFT-ALIGN PLACEHOLDER === */
/* Keeps the date text starting flush left inside the dark field */
body #gform_wrapper_5 #field_5_185 input,
body #gform_wrapper_5 #field_5_185 .datepicker {
  text-align: left !important;
  padding-left: 0 !important;
}


body #gform_wrapper_5 .gf-required-note {
  color: var(--gf-form-beige);
  font-size: 16px;
  line-height: 1.3;
  margin: 0;
}

body #gform_wrapper_5 .gf-required-asterisk {
  color: var(--gf-form-beige);
}



/* === CUSTOMER FIELDS: DARK GREEN INPUTS === */
/* Makes text, email, phone, and address inputs dark green */
body #gform_wrapper_5 input[type="text"],
body #gform_wrapper_5 input[type="email"],
body #gform_wrapper_5 input[type="tel"],
body #gform_wrapper_5 textarea,
body #gform_wrapper_5 select {
  background-color: #314632 !important;
  border: 1px solid var(--gf-form-beige) !important;
  color: var(--gf-form-beige) !important;
}

body #gform_wrapper_5 input::placeholder,
body #gform_wrapper_5 textarea::placeholder {
  color: var(--gf-form-beige);
  opacity: 1;
}

/* === ADDRESS SUBLABELS: H4 LOOK === */
/* Makes address sublabels match the green H4-style customer headings */
/* Hide native address sublabels, keep for accessibility */
body #gform_wrapper_5 #input_5_191_3_label,
body #gform_wrapper_5 #input_5_191_5_label {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}


/* Put each address subfield in a vertical stack so the label sits above the input */
body #gform_wrapper_5 .gf-customer-address .ginput_full,
body #gform_wrapper_5 .gf-customer-address .ginput_left,
body #gform_wrapper_5 .gf-customer-address .ginput_right {
  display: flex;
  flex-direction: column;
}

/* Optional: hide Address Line 2 if you do not need it */
body #gform_wrapper_5 .gf-customer-address .address_line_2,
body #gform_wrapper_5 .gf-customer-address .address_line_2 + label {
  display: none !important;
}


/* === CUSTOMER FIELD HEADINGS === */
/* Real H4 headings above customer fields */
body #gform_wrapper_5 .gf-field-heading {
  margin: 0 0 12px;
  color: #CAFA94 !important;
  font-size: 22px;
  line-height: 1.2;
  font-weight: 400;
}

/* === CUSTOMER SECTION: SPACE ABOVE FIELD HEADINGS === */
body #gform_wrapper_5 #field_5_188,
body #gform_wrapper_5 #field_5_189,
body #gform_wrapper_5 #field_5_190,
body #gform_wrapper_5 #field_5_191 {
  padding-top: 35px;
}



/* === CUSTOMER INPUTS: TIGHTER GAP UNDER GREEN HEADINGS === */
/* Makes Navn, Tlf, and E-post sit closer to their fields like Adresse/Postnummer */
body #gform_wrapper_5 .gf-customer-field {
  margin-top: 0 !important;
}

body #gform_wrapper_5 .gf-customer-field .ginput_container {
  margin-top: 0 !important;
}

body #gform_wrapper_5 #field_5_188,
body #gform_wrapper_5 #field_5_189,
body #gform_wrapper_5 #field_5_190 {
  margin-top: -50px !important;
}

@media (max-width: 767px) {
  body #gform_wrapper_5 #field_5_188,
  body #gform_wrapper_5 #field_5_189,
  body #gform_wrapper_5 #field_5_190 {
    margin-top: -18px !important;
  }
}



body #gform_wrapper_5 .gf-delivery-shipping-heading {
  font-family: "Faculty Glyphic", Helvetica, Arial, Lucida, sans-serif;
  font-size: 18px;
  line-height: 1.7em;
  color: #CAFA94 !important;
}

body #gform_wrapper_5 .gf-delivery-shipping-heading,
body #gform_wrapper_5 .gf-delivery-date-heading,
body #gform_wrapper_5 .gf-customer-native-heading,
body #gform_wrapper_5 .gf-address-native-heading {
  font-family: "Faculty Glyphic", Helvetica, Arial, Lucida, sans-serif;
  font-size: 18px;
  line-height: 1.7em;
  font-weight: 400;
  color: #CAFA94 !important;
  margin: 0 0 12px;
}



/* Hide native labels only when the field is NOT in error */
body #gform_wrapper_5 .gf-customer-field:not(.gfield_error) > .gfield_label,
body #gform_wrapper_5 .gf-delivery-shipping:not(.gfield_error) > .gfield_label,
body #gform_wrapper_5 #field_5_184:not(.gfield_error) > .gfield_label,
body #gform_wrapper_5 #field_5_185:not(.gfield_error) > .gfield_label {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}


body #gform_wrapper_5 .gf-privacy-consent {
  color: var(--gf-form-beige);
  margin: 0;
}

body #gform_wrapper_5 .gf-privacy-consent a {
  color: var(--gf-form-beige) !important;
  text-decoration: none !important;
  border-bottom: 1px solid currentColor;
  padding-bottom: 2px;
}

/* === CONSENT ROW: BRING TEXT CLOSER TO THE CHECKBOX === */
body #gform_wrapper_5 #field_5_197 {
  grid-column: span 1 !important;
  margin: 0 !important;
  align-self: start;
}

body #gform_wrapper_5 #field_5_197 .ginput_container_consent {
  margin-top: 0 !important;
}

body #gform_wrapper_5 #field_5_198 {
  grid-column: span 11 !important;
  margin-left: -28px !important;
}


body #gform_wrapper_5 #field_5_198 .gf-privacy-consent {
  margin: 0 !important;
}

@media (max-width: 767px) {
  body #gform_wrapper_5 #field_5_198 {
    margin-left: 5px !important;
  }
}

/* === CONSENT ROWS: KEEP TEXT CLOSE TO THE CHECKBOX === */
body #gform_wrapper_5 #field_5_197,
body #gform_wrapper_5 #field_5_199 {
  grid-column: span 1 !important;
  margin: 0 !important;
  align-self: start;
  padding-top: 30px;
}

body #gform_wrapper_5 #field_5_197 .ginput_container_consent,
body #gform_wrapper_5 #field_5_199 .ginput_container_consent {
  position: relative;
  display: inline-block;
  margin-top: 0 !important;
}

body #gform_wrapper_5 #field_5_198,
body #gform_wrapper_5 #field_5_200 {
  grid-column: span 11 !important;
  margin: 0 !important;
  padding-top: 30px;
  padding-left: 0 !important;
  margin-left: -28px !important;
}

body #gform_wrapper_5 #field_5_198 .gf-privacy-consent,
body #gform_wrapper_5 #field_5_200 .gf-newsletter-note {
  margin: 0 !important;
}

@media (max-width: 767px) {
  body #gform_wrapper_5 #field_5_198,
  body #gform_wrapper_5 #field_5_200 {
    margin-left: 5px !important;
  }
}

/* === CONSENT CHECKBOX: REQUIRED ASTERISK === */
/* Adds a visual asterisk above the required privacy consent checkbox */
body #gform_wrapper_5 #field_5_197,
body #gform_wrapper_5 #field_5_197 .ginput_container_consent {
  position: relative !important;
  overflow: visible !important;
}

body #gform_wrapper_5 #field_5_197::before {
  content: none !important;
}

body #gform_wrapper_5 #field_5_197 .ginput_container_consent::before {
  content: "*";
  position: absolute;
  top: -18px;
  left: 0;
  color: #CAFA94 !important;
  font-size: 16px;
  line-height: 1;
  z-index: 999;
  display: block;
}



/* === METODER: REQUIRED ASTERISK === */
/* Adds a visual asterisk at the top-left of the visible H4 heading */
body #gform_wrapper_5 .gf-delivery-shipping-heading {
  position: relative;
  display: inline-block;
}

body #gform_wrapper_5 .gf-delivery-shipping-heading::before {
  content: "*";
  position: absolute;
  top: 6px;
  left: -11px;
  color: #CAFA94;
  font-size: 16px;
  line-height: 1;
}

/* === SUBMIT BUTTON === */
/* Dark green button with beige border and a lower, flatter shape */
body #gform_wrapper_5 .gform_footer input[type="submit"],
body #gform_wrapper_5 .gform_page_footer input[type="submit"],
body #gform_wrapper_5 .gform_button {
  background-color: #314632 !important;
  color: var(--gf-form-beige) !important;
  border: 1px solid var(--gf-form-beige) !important;
  border-radius: 4px !important;
  box-shadow: none !important;
  height: auto !important;
  min-height: 0 !important;
  line-height: 1.2 !important;
  padding: 4px 22px !important;
}


/* === SUBMIT BUTTON: DIVI-LIKE HOVER ARROW === */
body #gform_wrapper_5 .gform_footer input[type="submit"],
body #gform_wrapper_5 .gform_page_footer input[type="submit"],
body #gform_wrapper_5 .gform_button {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 10 10' fill='none'%3E%3Cpath d='M3 1.5L7 5L3 8.5' stroke='%23F7FFDC' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: right 12px center !important;
  background-size: 0 10px !important;
  transition: padding 0.2s ease, background-size 0.2s ease, transform 0.2s ease;
}

body #gform_wrapper_5 .gform_footer input[type="submit"]:hover,
body #gform_wrapper_5 .gform_page_footer input[type="submit"]:hover,
body #gform_wrapper_5 .gform_button:hover {
  padding-right: 34px !important;
  background-size: 10px 10px !important;
  transform: scale(1.02);
}

body #gform_wrapper_5 .gform_footer,
body #gform_wrapper_5 .gform_page_footer {
  margin-top: 60px !important;
}



/* === TOTAL FIELD === */
/* Gives the total room to breathe and makes it read like a summary, not an editable input. */
body #gform_wrapper_5 .gfield--type-total {
  margin-top: 28px;
}

body #gform_wrapper_5 .gfield--type-total .gfield_label {
  margin-bottom: 10px !important;
}

body #gform_wrapper_5 .gfield--type-total .ginput_container_total input,
body #gform_wrapper_5 .gfield--type-total input.ginput_total {
  width: auto !important;
  min-width: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--gf-form-beige) !important;
  font-size: 16px !important;
  line-height: 1.1 !important;
}

body #gform_wrapper_5 .gf-total-heading {
  font-family: "Faculty Glyphic", Helvetica, Arial, Lucida, sans-serif;
  font-size: 18px;
  line-height: 1.7em;
  font-weight: 400;
  color: #CAFA94 !important;
  margin: 0 0 12px !important;
}



body #gform_wrapper_5 .gfield--type-total {
  margin-top: 90px !important;
}

body #gform_wrapper_5 .gfield--type-total {
  border-top: 1px solid var(--gf-form-beige);
  padding-top: 18px;
  margin-top: 28px;
}



/* On validation error, reveal the label container but hide the label text */
body #gform_wrapper_5 .gfield_error > .gfield_label {
  position: static !important;
  width: auto !important;
  height: auto !important;
  padding: 0 !important;
  margin: 8px 0 0 !important;
  overflow: visible !important;
  clip: auto !important;
  white-space: normal !important;
  border: 0 !important;
  display: block !important;
  color: transparent !important;
  font-size: 0 !important;
  line-height: 0 !important;
}

/* Keep the native "(Required)" hidden, but output your own message */
body #gform_wrapper_5 .gfield_error > .gfield_label .gfield_required_text {
  display: inline !important;
  color: transparent !important;
  font-size: 0 !important;
  line-height: 0 !important;
}

body #gform_wrapper_5 .gfield_error > .gfield_label .gfield_required_text::after {
  content: "Obligatorisk felt";
  color: #f4b6b6;
  font-size: 14px;
  line-height: 1.4;
}



/* === REQUIRED + VALIDATION FIX === */
/* Paste this at the very end of your Gravity Forms CSS */

/* Keep native labels hidden, even on error */
body #gform_wrapper_5 .gf-customer-field > .gfield_label,
body #gform_wrapper_5 .gf-delivery-shipping > .gfield_label,
body #gform_wrapper_5 #field_5_184 > .gfield_label,
body #gform_wrapper_5 #field_5_185 > .gfield_label,
body #gform_wrapper_5 .gfield_error > .gfield_label {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
  display: block !important;
  color: inherit !important;
  font-size: inherit !important;
  line-height: inherit !important;
}

/* Never show the native Gravity Forms "(Required)" text */
body #gform_wrapper_5 .gfield_required_text,
body #gform_wrapper_5 .gfield_consent_label .gfield_required_text {
  display: none !important;
}

/* Cancel the earlier pseudo-message hack */
body #gform_wrapper_5 .gfield_error > .gfield_label .gfield_required_text::after {
  content: none !important;
}

/* Show the real Gravity Forms field validation messages */
body #gform_wrapper_5 .gfield_validation_message,
body #gform_wrapper_5 .gfield_error .validation_message {
  display: block !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  color: #FF970E !important;
  font-size: 14px !important;
  line-height: 1.4 !important;
  margin-top: 8px !important;
  padding: 0 !important;
}

/* Top validation summary */
body #gform_wrapper_5 .gform_validation_errors,
body #gform_wrapper_5 .validation_error {
  background: rgba(244, 182, 182, 0.08) !important;
  border: 1px solid rgba(244, 182, 182, 0.45) !important;
  color: #FF970E !important;
  box-shadow: none !important;
}

/* Highlight invalid fields */
body #gform_wrapper_5 .gfield_error input[type="text"],
body #gform_wrapper_5 .gfield_error input[type="email"],
body #gform_wrapper_5 .gfield_error input[type="tel"],
body #gform_wrapper_5 .gfield_error textarea,
body #gform_wrapper_5 .gfield_error select,
body #gform_wrapper_5 .gfield_error input[type="checkbox"],
body #gform_wrapper_5 .gfield_error input[type="radio"] {
  border-color: #FF970E !important;
}

/* Tint your custom headings when that field has an error */
body #gform_wrapper_5 .gfield_error .gf-delivery-shipping-heading,
body #gform_wrapper_5 .gfield_error .gf-delivery-date-heading,
body #gform_wrapper_5 .gfield_error .gf-customer-native-heading,
body #gform_wrapper_5 .gfield_error .gf-address-native-heading,
body #gform_wrapper_5 .gfield_error .gf-total-heading {
  color: #FF970E !important;
}




/* === VALIDATION SUMMARY: ORANGE NORWEGIAN ERROR BOX === */
/* Styles the top Gravity Forms validation message in orange, removes inner stroke/background,
   and removes the temporary focus outline shown after failed submission. */
body #gform_wrapper_5 .validation_error,
body #gform_wrapper_5 .gform_validation_errors {
  background: rgba(255, 151, 14, 0.08) !important;
  border: 1px solid #FF970E !important;
  color: #FF970E !important;
  box-shadow: none !important;
  outline: none !important;
}

body #gform_wrapper_5 .validation_error a,
body #gform_wrapper_5 .gform_validation_errors a,
body #gform_wrapper_5 .validation_error h2,
body #gform_wrapper_5 .gform_validation_errors h2,
body #gform_wrapper_5 .validation_error li,
body #gform_wrapper_5 .gform_validation_errors li,
body #gform_wrapper_5 .gform-icon,
body #gform_wrapper_5 .gform_validation_errors > h2 {
  color: #FF970E !important;
  fill: #FF970E !important;
}

body #gform_wrapper_5 .gform_validation_errors > h2,
body #gform_wrapper_5 .validation_error {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  outline: none !important;
}

body #gform_wrapper_5 .gform_validation_errors:focus,
body #gform_wrapper_5 .gform_validation_errors > h2:focus,
body #gform_wrapper_5 .validation_error:focus,
body #gform_wrapper_5 .gform_validation_errors:focus-visible,
body #gform_wrapper_5 .gform_validation_errors > h2:focus-visible,
body #gform_wrapper_5 .validation_error:focus-visible {
  outline: none !important;
  box-shadow: none !important;
}




/* === MOBILE: CONSENT ERROR MESSAGE ABOVE CHECKBOX, KEEP CHECKBOX TOP-ALIGNED === */
/* Reserves equal space above both the checkbox column and the consent-text column,
   so the validation message can sit above while the checkbox still aligns with the top of the beige text. */
@media (max-width: 767px) {
  body #gform_wrapper_5 #field_5_197.gfield_error,
  body #gform_wrapper_5 #field_5_199.gfield_error,
  body #gform_wrapper_5 #field_5_197.gfield_error + #field_5_198,
  body #gform_wrapper_5 #field_5_199.gfield_error + #field_5_200 {
    padding-top: 30px;
  }

  body #gform_wrapper_5 #field_5_197.gfield_error,
  body #gform_wrapper_5 #field_5_199.gfield_error {
    position: relative;
  }

  body #gform_wrapper_5 #field_5_197 .gfield_validation_message,
  body #gform_wrapper_5 #field_5_197 .validation_message,
  body #gform_wrapper_5 #field_5_199 .gfield_validation_message,
  body #gform_wrapper_5 #field_5_199 .validation_message {
    position: absolute;
    top: 0;
    left: 0;
    width: 220px;
    max-width: calc(100vw - 72px);
    margin: 0 !important;
    line-height: 1.55 !important;
  }
}



/* === CONFIRMATION MESSAGE === */
/* Styles the thank-you text and the order summary heading after successful submission */
body #gform_confirmation_wrapper_5 .gform_confirmation_message,
body #gform_confirmation_wrapper_5 .gform_confirmation_message p {
  color: var(--gf-form-beige) !important;
  font-size: 20px;
  line-height: 1.6;
}

body #gform_confirmation_wrapper_5 .gform_confirmation_message h3 {
  color: #CAFA94 !important;
  font-family: "Faculty Glyphic", Helvetica, Arial, Lucida, sans-serif;
  font-size: 22px;
  line-height: 1.3;
  font-weight: 400;
  margin: 28px 0 12px;
}


/* === GRONNSAKER > POTET: HARD OVERRIDE FOR EMPTY SPACER FIELD === */
body #gform_wrapper_5 #field_5_104 {
  display: none !important;
}

/* === CONFIRMATION MESSAGE: BEIGE ARIAL BODY TEXT === */
/* Styles only the thank-you paragraphs after submit, without recoloring the order table text. */
body #gform_confirmation_wrapper_5 .gform_confirmation_message > p {
  color: #F7FFDC !important;
  font-family: Arial, Helvetica, sans-serif !important;
  font-size: 18px !important;
  line-height: 1.6 !important;
  font-weight: 400 !important;
}

body #gform_confirmation_wrapper_5 .gform_confirmation_message h3 {
  color: #CAFA94 !important;
}


body #gform_confirmation_wrapper_5 {
  scroll-margin-top: 180px;
}


/* Hide the visible divider/padding on the blank product wrapper section */
body #gform_wrapper_5 .gf-product-block-start.gfield--type-section {
  display: none !important;
}




/* === MOBILE: KEEP MAIN GROUP CHECKBOXES FULLY VISIBLE === */
@media (max-width: 767px) {
  body #gform_wrapper_5 .gf-section-toggle-title {
    padding-left: 40px !important;
  }

  body #gform_wrapper_5 .gf-section-toggle-title + .gf-section-toggle-checkbox .ginput_container_checkbox {
    top: -47px;
    left: 11px !important;
    margin: 0 !important;
  }

  #Bestillingsskjema {
    overflow: visible !important;
  }
}



/* === HIDDEN PRODUCT WRAPPERS: REMOVE THEM FROM THE GRID === */
/* The hidden product field should still submit, but its wrapper should not reserve layout space */
body #gform_wrapper_5 .gfield_hidden_product,
body #gform_wrapper_5 .gfield.gform_hidden.gfield--type-product {
  display: none !important;
  margin: 0 !important;
  padding: 0 !important;
  min-height: 0 !important;
  border: 0 !important;
}



/* === DESKTOP: EVEN SPACING AROUND GROUP HELPER NOTES === */
/* Keeps the note under Potet and similar groups equally spaced above and below */
@media (min-width: 768px) {
  body #gform_wrapper_5 .gf-product-block-start + .gfield_html {
    margin-top: 10px !important;
    margin-bottom: 10px !important;
  }

  body #gform_wrapper_5 .gf-product-block-start + .gfield_html .gf-helper-note,
  body #gform_wrapper_5 .gf-product-block-start + .gfield_html .gf-helper-note p,
  body #gform_wrapper_5 .gf-product-block-start + .gfield_html p.gf-helper-note {
    margin: 0 !important;
  }
}


/* === DESKTOP: REMOVE GAP ABOVE PRODUCT GROUP NOTES === */
@media (min-width: 768px) {
  body #gform_wrapper_5 .gf-product-block-start.gfield--type-section {
    display: none !important;
  }

  body #gform_wrapper_5 .gf-product-block-start + .gfield_html,
  body #gform_wrapper_5 #field_5_47,
  body #gform_wrapper_5 #field_5_211,
  body #gform_wrapper_5 #field_5_221,
  body #gform_wrapper_5 #field_5_256,
  body #gform_wrapper_5 #field_5_244 {
    margin-top: -28px !important;
    margin-bottom: 10px !important;
  }

  body #gform_wrapper_5 .gf-helper-note,
  body #gform_wrapper_5 p.gf-helper-note {
    margin: 0 !important;
  }
}



/* === DESKTOP: SPACE AFTER EXPANDED PRODUCT GROUPS === */
/* Adds space before the next main group only when the group above is opened */
@media (min-width: 768px) {
  body #gform_wrapper_5 #gform_fields_5:has(#choice_5_206_1:checked) #field_5_204,
  body #gform_wrapper_5 #gform_fields_5:has(#choice_5_100_1:checked) #field_5_205,
  body #gform_wrapper_5 #gform_fields_5:has(#choice_5_170_1:checked) #field_5_171,
  body #gform_wrapper_5 #gform_fields_5:has(#choice_5_172_1:checked) #field_5_174,
  body #gform_wrapper_5 #gform_fields_5:has(#choice_5_173_1:checked) #field_5_176 {
    margin-top: 56px !important;
  }
}


/* === MOBILE: SPACE AFTER NOTE-ONLY PRODUCT GROUPS === */
/* Adds breathing room after group notes before the next main group title */
@media (max-width: 767px) {
  body #gform_wrapper_5 #field_5_47,
  body #gform_wrapper_5 #field_5_211,
  body #gform_wrapper_5 #field_5_256 {
    margin-bottom: 38px !important;
  }
}



/* === MOBILE: PRODUCT NOTES POSITION === */
/* Pulls notes closer to the product above, while adding breathing room before the next product */
@media (max-width: 767px) {
  body #gform_wrapper_5 .gf-row-note {
    margin-top: -35px !important;
    margin-bottom: 35px !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    line-height: 1.35;
  }
}


/* === ORDER FORM PRODUCT IMAGE ZOOM === */

body #gform_wrapper_5,
body #gform_wrapper_5 #gform_fields_5,
body #gform_wrapper_5 .gfield,
body #gform_wrapper_5 .gf-row-product-main,
body #gform_wrapper_5 .gf-product-main,
body #gform_wrapper_5 .gf-product-media {
  overflow: visible !important;
}

body #gform_wrapper_5 .gf-row-product-main {
  position: relative !important;
  z-index: 1 !important;
}

body #gform_wrapper_5 .gf-row-product-main:hover,
body #gform_wrapper_5 .gf-row-product-main.is-zoomed {
  z-index: 999999 !important;
}

body #gform_wrapper_5 .gf-product-main,
body #gform_wrapper_5 .gf-product-media {
  position: relative !important;
}

body #gform_wrapper_5 .gf-product-media img {
  display: block !important;
  width: 40px !important;
  height: 40px !important;
  max-width: none !important;
  object-fit: cover !important;
  position: relative !important;
  z-index: 10 !important;
  transform: scale(1) !important;
  transform-origin: left top !important;
  transition: transform 0.18s ease, box-shadow 0.18s ease !important;
  cursor: zoom-in;
}

body #gform_wrapper_5 .gf-row-product-main:hover .gf-product-media img,
body #gform_wrapper_5 .gf-row-product-main.is-zoomed .gf-product-media img {
  transform: scale(4) !important;
  z-index: 999999 !important;
  box-shadow: 0 10px 28px rgba(0,0,0,.35) !important;
  cursor: zoom-out;
}

/* On touch devices, disable sticky hover and use JS toggle only */
@media (hover: none), (pointer: coarse) {
  body #gform_wrapper_5 .gf-row-product-main:hover .gf-product-media img {
    transform: scale(1) !important;
    box-shadow: none !important;
  }

  body #gform_wrapper_5 .gf-row-product-main.is-zoomed .gf-product-media img {
    transform: scale(4) !important;
    z-index: 999999 !important;
    box-shadow: 0 10px 28px rgba(0,0,0,.35) !important;
  }
}


@media (max-width: 767px) {
  .product-carousel.et_pb_group_carousel.et_pb_group_carousel_slides_5 .et_pb_group_carousel_slide {
    flex: 0 0 33.3333% !important;
    min-width: 33.3333% !important;
  }
}

@media (min-width: 768px) and (max-width: 980px) {
  .product-carousel.et_pb_group_carousel.et_pb_group_carousel_slides_5 .et_pb_group_carousel_slide {
    flex: 0 0 25% !important;
    min-width: 25% !important;
  }
}

/* Test form 5: keep all quantity dropdowns the same width */
body #gform_wrapper_5 .gf-row-qty select {
  width: 110px !important;
  min-width: 110px !important;
  box-sizing: border-box !important;
  padding-right: 32px !important;
}

/* Test form 5: encoding-safe Norwegian method labels */
body #gform_wrapper_5 .gf-delivery-shipping .gchoice_5_184_0 label::before,
body #gform_wrapper_5 #field_5_184 .gchoice_5_184_0 label::before {
  content: "Hent p\0000E5\000020g\0000E5rd" !important;
}

body #gform_wrapper_5 .gf-delivery-shipping .gchoice_5_184_1 label::before,
body #gform_wrapper_5 #field_5_184 .gchoice_5_184_1 label::before {
  content: "M\0000F8t oss p\0000E5\000020neste REKO-ring Harstad" !important;
}

body #gform_wrapper_5 .gf-delivery-shipping .gchoice_5_184_2 label::before,
body #gform_wrapper_5 #field_5_184 .gchoice_5_184_2 label::before {
  content: "Hentepunkt R\0000F8de Kors Borkenes" !important;
}

body #gform_wrapper_5 .gf-delivery-shipping .gchoice_5_184_3 label::before,
body #gform_wrapper_5 #field_5_184 .gchoice_5_184_3 label::before {
  content: "Hentepunkt Kinsarvik Sj\0000F8kanten Senter" !important;
}

body #gform_wrapper_5 .gf-delivery-shipping .gchoice_5_184_4 label::before,
body #gform_wrapper_5 #field_5_184 .gchoice_5_184_4 label::before {
  content: "Tilleggslevering for abonnementskunder" !important;
}

/* Test form 5: structural speed display logic for the two largest groups.
   Gravity Forms no longer has to calculate these rows; CSS/JS only controls visibility. */
body #gform_wrapper_5 input[type="checkbox"]::before {
  transition: transform 80ms ease-in-out !important;
}

body #gform_wrapper_5 #gform_fields_5 .hg-speed-gronnsaker-item,
body #gform_wrapper_5 #gform_fields_5 .hg-speed-potet-when-open,
body #gform_wrapper_5 #gform_fields_5 .hg-speed-potet-item {
  display: none !important;
}

body #gform_wrapper_5 #gform_fields_5.hg-speed-ready.hg-speed-gronnsaker-open .hg-speed-gronnsaker-item,
body #gform_wrapper_5 #gform_fields_5:has(#choice_5_206_1:checked) .hg-speed-gronnsaker-item {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
}

body #gform_wrapper_5 #gform_fields_5.hg-speed-ready.hg-speed-gronnsaker-open .hg-speed-gronnsaker-item.gf-row-qty,
body #gform_wrapper_5 #gform_fields_5:has(#choice_5_206_1:checked) .hg-speed-gronnsaker-item.gf-row-qty {
  display: flex !important;
  visibility: visible !important;
  opacity: 1 !important;
}

body #gform_wrapper_5 #gform_fields_5.hg-speed-ready.hg-speed-potet-open .hg-speed-potet-when-open,
body #gform_wrapper_5 #gform_fields_5:has(#choice_5_100_1:checked) .hg-speed-potet-when-open {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
}

body #gform_wrapper_5 #gform_fields_5.hg-speed-ready.hg-speed-potet-open .hg-speed-potet-when-open.gf-row-qty,
body #gform_wrapper_5 #gform_fields_5:has(#choice_5_100_1:checked) .hg-speed-potet-when-open.gf-row-qty {
  display: flex !important;
  visibility: visible !important;
  opacity: 1 !important;
}


body #gform_wrapper_5 #gform_fields_5.hg-speed-ready.hg-speed-potet-open..hg-speed-potet-nypotet-open .hg-speed-potet-nypotet-item,
body #gform_wrapper_5 #gform_fields_5:has(#choice_5_100_1:checked):has(#choice_5_385_1:checked) .hg-speed-potet-nypotet-item {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
}

body #gform_wrapper_5 #gform_fields_5.hg-speed-ready.hg-speed-potet-open..hg-speed-potet-nypotet-open .hg-speed-potet-nypotet-item.gf-row-qty,
body #gform_wrapper_5 #gform_fields_5:has(#choice_5_100_1:checked):has(#choice_5_385_1:checked) .hg-speed-potet-nypotet-item.gf-row-qty {
  display: flex !important;
  visibility: visible !important;
  opacity: 1 !important;
}

body #gform_wrapper_5 #gform_fields_5.hg-speed-ready.hg-speed-potet-open..hg-speed-potet-mandel-open .hg-speed-potet-mandel-item,
body #gform_wrapper_5 #gform_fields_5:has(#choice_5_100_1:checked):has(#choice_5_396_1:checked) .hg-speed-potet-mandel-item {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
}

body #gform_wrapper_5 #gform_fields_5.hg-speed-ready.hg-speed-potet-open..hg-speed-potet-mandel-open .hg-speed-potet-mandel-item.gf-row-qty,
body #gform_wrapper_5 #gform_fields_5:has(#choice_5_100_1:checked):has(#choice_5_396_1:checked) .hg-speed-potet-mandel-item.gf-row-qty {
  display: flex !important;
  visibility: visible !important;
  opacity: 1 !important;
}

body #gform_wrapper_5 #gform_fields_5.hg-speed-ready.hg-speed-potet-open..hg-speed-potet-gulloye-open .hg-speed-potet-gulloye-item,
body #gform_wrapper_5 #gform_fields_5:has(#choice_5_100_1:checked):has(#choice_5_422_1:checked) .hg-speed-potet-gulloye-item {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
}

body #gform_wrapper_5 #gform_fields_5.hg-speed-ready.hg-speed-potet-open..hg-speed-potet-gulloye-open .hg-speed-potet-gulloye-item.gf-row-qty,
body #gform_wrapper_5 #gform_fields_5:has(#choice_5_100_1:checked):has(#choice_5_422_1:checked) .hg-speed-potet-gulloye-item.gf-row-qty {
  display: flex !important;
  visibility: visible !important;
  opacity: 1 !important;
}

body #gform_wrapper_5 #gform_fields_5.hg-speed-ready.hg-speed-potet-open..hg-speed-potet-van-gogh-open .hg-speed-potet-van-gogh-item,
body #gform_wrapper_5 #gform_fields_5:has(#choice_5_100_1:checked):has(#choice_5_448_1:checked) .hg-speed-potet-van-gogh-item {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
}

body #gform_wrapper_5 #gform_fields_5.hg-speed-ready.hg-speed-potet-open..hg-speed-potet-van-gogh-open .hg-speed-potet-van-gogh-item.gf-row-qty,
body #gform_wrapper_5 #gform_fields_5:has(#choice_5_100_1:checked):has(#choice_5_448_1:checked) .hg-speed-potet-van-gogh-item.gf-row-qty {
  display: flex !important;
  visibility: visible !important;
  opacity: 1 !important;
}

body #gform_wrapper_5 #gform_fields_5.hg-speed-ready.hg-speed-potet-open..hg-speed-potet-nansen-open .hg-speed-potet-nansen-item,
body #gform_wrapper_5 #gform_fields_5:has(#choice_5_100_1:checked):has(#choice_5_474_1:checked) .hg-speed-potet-nansen-item {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
}

body #gform_wrapper_5 #gform_fields_5.hg-speed-ready.hg-speed-potet-open..hg-speed-potet-nansen-open .hg-speed-potet-nansen-item.gf-row-qty,
body #gform_wrapper_5 #gform_fields_5:has(#choice_5_100_1:checked):has(#choice_5_474_1:checked) .hg-speed-potet-nansen-item.gf-row-qty {
  display: flex !important;
  visibility: visible !important;
  opacity: 1 !important;
}

body #gform_wrapper_5 #gform_fields_5.hg-speed-ready.hg-speed-potet-open..hg-speed-potet-knallfiffi-open .hg-speed-potet-knallfiffi-item,
body #gform_wrapper_5 #gform_fields_5:has(#choice_5_100_1:checked):has(#choice_5_500_1:checked) .hg-speed-potet-knallfiffi-item {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
}

body #gform_wrapper_5 #gform_fields_5.hg-speed-ready.hg-speed-potet-open..hg-speed-potet-knallfiffi-open .hg-speed-potet-knallfiffi-item.gf-row-qty,
body #gform_wrapper_5 #gform_fields_5:has(#choice_5_100_1:checked):has(#choice_5_500_1:checked) .hg-speed-potet-knallfiffi-item.gf-row-qty {
  display: flex !important;
  visibility: visible !important;
  opacity: 1 !important;
}


/* Test form 5: add mobile spacing after open Potet subgroups before Egg */
@media (max-width: 767px) {
  body #gform_wrapper_5 #gform_fields_5:has(#choice_5_100_1:checked) #field_5_205,
  body #gform_wrapper_5 #gform_fields_5.hg-speed-potet-open #field_5_205 {
    margin-top: 80px !important;
  }
}

/* GRAVITY FORMS END */






/* GRAVITY FORMS END */