:root {
  /* Paddings of touchscreen devices with a notch */
  --safe-area-top: env(safe-area-inset-top);
  --safe-area-right: env(safe-area-inset-right);
  --safe-area-bottom: env(safe-area-inset-bottom);
  --safe-area-left: env(safe-area-inset-left);

  /* Sizes */
  --max-width-narrow: 770px;
  --padding-no-full-width: 56px;
  --thumbnail-size: 80px;

  /* Mosaic section grid */
  --grid-row: 2;
  --grid-auto-flow: dense;

  /* Colors */
  --color-azureish-white: #D7E2FF;
  --color-begonia: #FF6E6E;
  --color-black: #0B1A26;
  --color-black-08: #0B1A2614;
  --color-green: #51C234;
  --color-red: #C23434;
  --color-red-light: #F5CFCF;
  --color-white: #FFF;
  --color-white-90: #FFFFFFE6;

  /* Shadows */
  --shadow-xs: 0px 1px 3px rgb(0 0 0 / 10%), 0px 1px 2px rgb(0 0 0 / 6%);
}

/* Base styles */
*,
*::before,
*::after {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

*:not(i),
*:not(i)::before,
*:not(i)::after {
  font-family: var(--font-body, sans-serif);
}

html {
  padding: env(safe-area-inset);
}

html:has(div[data-tid="Modal"][class*="Container-"]) {
  overflow: clip;
}

.body--scroll-locked {
  position: sticky !important;
  width: 100% !important;
}

/* Allow the image of the `text with image` section to be centered with text */
#main > section:first-child:is(.text-image) .text-image__holder,
#main > .text-image:first-child .text-image__holder {
  max-height: none;
}

/* Stretch the only section to the footer */
#main > section:last-child {
  display: flex;
  flex-direction: column;
  flex-grow: 1;
}

#main > section:last-child > [class*="__wrapper"],
#main > section:last-child > [class^="__wrapper"] {
  flex-grow: 1;
}

/* Don't stretch the only section to the bottom in the preview section app */
.preview-app #main:has(section:only-child) {
  display: block;
}

/* Main element styles */
.header--not-sticky.header--menu-opened ~ #main {
  margin-top: var(--preview-height);
}

.header--sticky:has(~ div div[data-tid="Modal"][class*="Container-"]) ~ #main {
  margin-top: var(--header-height, 0);
}

.scrolld-down .header--sticky:has(~ div div[data-tid="Modal"][class*="Container-"]) ~ #main {
  margin-top: calc(var(--header-height, 0px) - var(--top-bar-height, 0px));
}

.preview-bar__container:has(~ .header--sticky) ~ #main {
  margin-top: var(--preview-height, 0);
}

/* Preview bar styles */
.preview-bar__container {
  z-index: 10000000 !important;
}

/* Styles for iPhone with notch */
.touch[data-orientation='landscape'] .container,
.touch[data-orientation='landscape'] div[data-tid="Modal"][class*="Container-"]:has([class*="CartPicker-"]) [class*="Body-"] > [class*="Div-"],
.touch[data-orientation='landscape'] div[data-tid="Mini cart"][class*="MiniCart-"] [class*="Head-"] [class*="Title-"],
.touch[data-orientation='landscape'] div[data-tid="Mini cart"][class*="MiniCart-"] div[data-tid="Select dates"] [class*="Dates-"],
.touch[data-orientation='landscape'] div[data-tid="Mini cart"][class*="MiniCart-"] [class*="Lines-"] [class*="Line-"],
.touch[data-orientation='landscape'] div[data-tid="Mini cart"][class*="MiniCart-"] [class*="Services-"],
.touch[data-orientation='landscape'] div[data-tid="Mini cart"][class*="MiniCart-"] [class*="CheckoutTotals-"],
.touch[data-orientation='landscape'] div[data-tid="Mini cart"][class*="MiniCart-"] [class*="CheckoutButtons-"] {
  padding-left: calc(44px + var(--horizontal-padding, 16px)) !important;
  padding-right: calc(44px + var(--horizontal-padding, 16px)) !important;
}

.touch[data-orientation='landscape'] div[data-tid="Modal"][class*="Container-"]:has([class*="CartPicker-"]) button[data-tid="Close icon"] {
  right: calc(40px + var(--horizontal-padding, 16px)) !important;
}

.touch[data-orientation='landscape'] div[data-tid="Mini cart"][class*="MiniCart-"] [class*="Title-"] [class*="Close-"] {
  right: calc(28px + var(--horizontal-padding, 16px)) !important;
}

.touch[data-orientation='landscape'] div[data-tid="Mini cart"][class*="MiniCart-"] [class*="Lines-"] > [class*="Cleanstate-"] {
  margin-top: 32px !important;
}

/* Mini cart and Date picker styles */
div[data-tid="Modal"][class*="Container-"]:has([class*="DatePickerInput"] > div) [class*="DatePickerInput"] > div,
div[data-tippy-root]:has([data-tid="Mini cart"] [class*="DetailContainer-"] > [class*="Quantity-"]) [class*="QuantityButton"]:first-child {
  border-top-left-radius: var(--border-radius-rounded) !important;
  border-bottom-left-radius: var(--border-radius-rounded) !important;
}

div[data-tippy-root]:has([data-tid="Mini cart"] [class*="DetailContainer-"] > [class*="Quantity-"]) [class*="QuantityButton"]:last-child {
  border-top-right-radius: var(--border-radius-rounded) !important;
  border-bottom-right-radius: var(--border-radius-rounded) !important;
}

div[data-tippy-root]:has([class*="tippy-content"] [class*="DayPicker-wrapper"] [class*="DayPicker-NavBar"]) [class*="tippy-content"] > div > [class*="Content"] > [class*="Inner"] [class*="AvailabilityLegend"] {
  border-bottom-right-radius: var(--border-radius-rounded) !important;
  border-bottom-left-radius: var(--border-radius-rounded) !important;
}

div[data-tid="Modal"][class*="Container-"],
div[data-tid="Modal"][class*="Container-"]:has([class*="Select__control"]) [class*="Select__control"],
div[data-tid="Modal"][class*="Container-"]:has([class*="Picker-"] [class*="Period-"]) [class*="Picker-"] > div,
div[data-tid="Modal"]:has(> div[class*="Body-"] form > div > div) div[class*="Body-"] form > div > div,
div[data-tid="Modal"] div[data-tid="Start and stop location dropdown"][class*="Container-"] [class*="Select__control"],
div[data-tippy-root]:has([data-tid="Mini cart"] [data-tid*="Select dates"] > [class*="DatesBase-"] > [class*="Dates"]) [class*="DatesBase-"] > [class*="Dates"],
div[data-tippy-root]:has([class*="tippy-content"] [class*="DayPicker-wrapper"] [class*="DayPicker-NavBar"]) [class*="tippy-content"] > div > [class*="Content"] > [class*="Inner"] {
  border-radius: var(--border-radius-rounded) !important;
}

div[data-tid="Modal actions"] button {
  border-radius: var(--border-radius-dynamic) !important;
}

/* COLORS */
body {
  background: var(--background-primary, #FFF);
  color: var(--color-primary, #0B1A26);
}

/* Form elements colors */
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus
input:-webkit-autofill:active,
textarea:-webkit-autofill,
textarea:-webkit-autofill:hover
textarea:-webkit-autofill:focus,
textarea:-webkit-autofill:active {
  box-shadow: 0 0 0 1000px transparent inset !important;
  background-clip: text !important;
}

.palette-one input:-webkit-autofill,
.palette-one input:-webkit-autofill:hover,
.palette-one input:-webkit-autofill:focus
.palette-one input:-webkit-autofill:active,
.palette-one textarea:-webkit-autofill,
.palette-one textarea:-webkit-autofill:hover
.palette-one textarea:-webkit-autofill:focus,
.palette-one textarea:-webkit-autofill:active {
  color: var(--color-primary, #0B1A26) !important;
  -webkit-text-fill-color: var(--color-primary, #0B1A26) !important;
}

.palette-two input:-webkit-autofill,
.palette-two input:-webkit-autofill:hover,
.palette-two input:-webkit-autofill:focus
.palette-two input:-webkit-autofill:active,
.palette-two textarea:-webkit-autofill,
.palette-two textarea:-webkit-autofill:hover
.palette-two textarea:-webkit-autofill:focus,
.palette-two textarea:-webkit-autofill:active {
  color: var(--color-primary-2, #FFF) !important;
  -webkit-text-fill-color: var(--color-primary-2, #FFF) !important;
}

.palette-three input:-webkit-autofill,
.palette-three input:-webkit-autofill:hover,
.palette-three input:-webkit-autofill:focus
.palette-three input:-webkit-autofill:active,
.palette-three textarea:-webkit-autofill,
.palette-three textarea:-webkit-autofill:hover
.palette-three textarea:-webkit-autofill:focus,
.palette-three textarea:-webkit-autofill:active {
  color: var(--color-primary-3, #0B1A26) !important;
  -webkit-text-fill-color: var(--color-primary-3, #0B1A26) !important;
}

/* Text colors */
.fa, .far {
  color: currentcolor;
}

.palette-one .fa, .palette-one .far {
  color: var(--color-primary, #0B1A26);
}

.palette-two .fa, .palette-two .far {
  color: var(--color-primary-2, #FFF);
}

.palette-three .fa, .palette-three .far {
  color: var(--color-primary-3, #0B1A26);
}

.palette-one h1,
.palette-one h2,
.palette-one h3,
.palette-one h4,
.palette-one h5,
.palette-one h6,
.palette-one .h1,
.palette-one .h2,
.palette-one .h3,
.palette-one .h4,
.palette-one .h5,
.palette-one .h6 {
  color: var(--color-primary, #0B1A26);
}

.palette-two h1,
.palette-two h2,
.palette-two h3,
.palette-two h4,
.palette-two h5,
.palette-two h6,
.palette-two .h1,
.palette-two .h2,
.palette-two .h3,
.palette-two .h4,
.palette-two .h5,
.palette-two .h6 {
  color: var(--color-primary-2, #FFF);
}

.palette-three h1,
.palette-three h2,
.palette-three h3,
.palette-three h4,
.palette-three h5,
.palette-three h6,
.palette-three .h1,
.palette-three .h2,
.palette-three .h3,
.palette-three .h4,
.palette-three .h5,
.palette-three .h6 {
  color: var(--color-primary-3, #0B1A26);
}

.palette-one .tagline {
  color: var(--color-outline, #F4B841);
}

.palette-two .tagline {
  color: var(--color-outline-2, #F4B841);
}

.palette-three .tagline {
  color: var(--color-outline-3, #0B1A26);
}

/* Button colors */
.palette-one .button.button--primary {
  color: var(--color-accent, #0B1A26);
  background: var(--background-accent, #F4B841);
  border-color: var(--background-accent, #F4B841);
}

.palette-one .button.button--primary:hover {
  background: var(--background-accent-hover, #F4B841CC);
  border-color: var(--background-accent-hover, #F4B841CC);
}

.palette-one .button.button--primary:active {
  background: var(--background-accent-active, #F4B841BA);
  border-color: var(--background-accent-active, #F4B841BA);
}

.palette-one .button.button--secondary {
  color: var(--color-outline, #F4B841);
}

.palette-one .button.button--secondary path {
  fill: var(--color-outline, #F4B841);
}

.palette-one .button.button--secondary:hover {
  text-shadow: 0.5px 0 var(--color-outline, #F4B841);
}

.palette-one .button.button--outlined {
  color: currentcolor;
  border-color: var(--background-accent, #F4B841);
}

.palette-one .button.button--outlined:hover {
  background: var(--background-accent-secondary-hover, #F4B84152);
}

.palette-one .button.button--outlined:active {
  background: var(--background-accent-secondary-active, #F4B8418F);
}

.palette-two .button.button--primary {
  color: var(--color-accent-2, #0B1A26);
  background: var(--background-accent-2, #F4B841);
  border-color: var(--background-accent-2, #F4B841);
}

.palette-two .button.button--primary:hover {
  background: var(--background-accent-2-hover, #F4B841CC);
  border-color: var(--background-accent-2-hover, #F4B841CC);
}

.palette-two .button.button--primary:active {
  background: var(--background-accent-2-active, #F4B841BA);
  border-color: var(--background-accent-2-active, #F4B841BA);
}

.palette-two .button.button--secondary {
  color: var(--color-outline-2, #F4B841);
}

.palette-two .button.button--secondary path {
  fill: var(--color-outline-2, #F4B841);
}

.palette-two .button.button--secondary:hover {
  text-shadow: 0.5px 0 var(--color-outline-2, #F4B841);
}

.palette-two .button.button--outlined {
  color: currentcolor;
  border-color: var(--background-accent-2, #F4B841);
}

.palette-two .button.button--outlined:hover {
  background: var(--background-accent-secondary-2-hover, #F4B84152);
}

.palette-two .button.button--outlined:active {
  background: var(--background-accent-secondary-2-active, #F4B8418F);
}

.palette-three .button.button--primary {
  color: var(--color-accent-3, #FFF);
  background: var(--background-accent-3, #0B1A26);
  border-color: var(--background-accent-3, #0B1A26);
}

.palette-three .button.button--primary:hover {
  background: var(--background-accent-3-hover, #0B1A26CC);
  border-color: var(--background-accent-3-hover, #0B1A26CC);
}

.palette-three .button.button--primary:active {
  background: var(--background-accent-3-active, #0B1A26BA);
  border-color: var(--background-accent-3-active, #0B1A26BA);
}

.palette-three .button.button--secondary {
  color: var(--color-outline-3, #0B1A26);
}

.palette-three .button.button--secondary path {
  fill: var(--color-outline-3, #0B1A26);
}

.palette-three .button.button--secondary:hover {
  text-shadow: 0.5px 0 var(--color-outline-3, #0B1A26);
}

.palette-three .button.button--outlined {
  color: currentcolor;
  border-color: var(--background-accent-3, #0B1A26);
}

.palette-three .button.button--outlined:hover {
  background: var(--background-accent-secondary-3-hover, #0B1A2652);
}

.palette-three .button.button--outlined:active {
  background: var(--background-accent-secondary-3-active, #0B1A268F);
}

@media (width >= 576px) {
  /* Mini cart responsive styles */
  div[data-tippy-root]:has([data-tid="Mini cart"]) {
    top: var(--header-height) !important;
    right: var(--horizontal-padding) !important;
    transform: translate(0, 0) !important;
    transition: top var(--animation-duration, 200ms) var(--transition-function-ease-in-out);
  }

  div[data-tippy-root] div[data-tid="Mini cart"] {
    height: auto;
    max-height: calc(100vh - var(--header-height));
  }

  div[data-tid="Mini cart"] div[class*="Summary"] div[class*="Services"] {
    max-height: 84px;
  }

  body:has(.header--sticky) div[data-tippy-root]:has([data-tid="Mini cart"]) {
    position: fixed !important;
  }

  .scrolled-down:has(.header--sticky) div[data-tippy-root]:has([data-tid="Mini cart"]) {
    top: calc(var(--header-height) - var(--top-bar-height, 0)) !important;
  }

  body:has(.preview-bar__container) div[data-tippy-root]:has([data-tid="Mini cart"]) {
    top: calc(var(--header-height) + var(--preview-height, 0)) !important;
  }

  body:has(.preview-bar__container) div[data-tippy-root] [data-tid="Mini cart"] {
    max-height: calc(100vh - var(--header-height) - var(--preview-height, 0) / 2);
  }

  body:has(.preview-bar__container):has(.header--sticky) div[data-tippy-root]:has([data-tid="Mini cart"]) {
    top: calc(var(--header-height)) !important;
  }

  .scrolled-down:has(.preview-bar__container):has(.header--sticky) div[data-tippy-root]:has([data-tid="Mini cart"]) {
    top: calc(var(--header-height) - var(--top-bar-height, 0)) !important;
  }
}

@media (width >= 1100px) {
  /* Mini cart responsive styles */
  body:has(.header-menu-bottom) div[data-tippy-root]:has([data-tid="Mini cart"]) {
    top: calc(var(--header-height) - var(--menu-position)) !important;
  }

  body:has(.header-menu-bottom) div[data-tippy-root] div[data-tid="Mini cart"] {
    max-height: calc(100vh - var(--header-height) + var(--menu-position));
  }

  .scrolled-down:has(.header--sticky):has(.header-menu-bottom) div[data-tippy-root]:has([data-tid="Mini cart"]) {
    top: calc(var(--header-height) - var(--menu-position) - var(--top-bar-height, 0)) !important;
  }

  body:has(.preview-bar__container):has(.header-menu-bottom) div[data-tippy-root]:has([data-tid="Mini cart"]) {
    top: calc(var(--header-height) - var(--menu-position) + var(--preview-height, 0)) !important;
  }

  body:has(.preview-bar__container):has(.header-menu-bottom) div[data-tippy-root] [data-tid="Mini cart"] {
    max-height: calc(100vh - var(--header-height) + var(--menu-position) - var(--preview-height, 0) / 2);
  }

  body:has(.preview-bar__container):has(.header--sticky) div[data-tippy-root]:has([data-tid="Mini cart"]) {
    top: calc(var(--header-height)) !important;
  }

  body:has(.preview-bar__container):has(.header--sticky):has(.header-menu-bottom) div[data-tippy-root]:has([data-tid="Mini cart"]) {
    top: calc(var(--header-height) - var(--menu-position)) !important;
  }

  .scrolled-down:has(.preview-bar__container):has(.header--sticky) div[data-tippy-root]:has([data-tid="Mini cart"]) {
    top: calc(var(--header-height) - var(--top-bar-height, 0)) !important;
  }

  .scrolled-down:has(.preview-bar__container):has(.header--sticky):has(.header-menu-bottom) div[data-tippy-root]:has([data-tid="Mini cart"]) {
    top: calc(var(--header-height) - var(--menu-position) - var(--top-bar-height, 0)) !important;
  }
}

@media (width >= 1280px) {
  /* Mini cart responsive styles */
  div[data-tippy-root]:has([data-tid="Mini cart"]) {
    right: calc(50% - var(--max-width) / 2 + var(--horizontal-padding)) !important;
  }
}

@media (height >= 964px) {
  /* Mini cart responsive styles */
  div[data-tid="Mini cart"] div[class*="Summary"] div[class*="Services"] {
    max-height: none;
  }
}