.ik-frame-reservation-form-step-1__segment-name {
    text-transform: capitalize;
}

.ik-frame-reservation-form-step-1__segments:not(.ik-frame-reservation-form-step-1__segments--inline) {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr; 
    grid-template-rows: min-content min-content;
    grid-template-areas: 
      "a b c"
      "d d d"
}

.ik-frame-reservation-form-step-1__segments > :nth-child(1) {
    grid-area: a;
}

.ik-frame-reservation-form-step-1__segments > :nth-child(2) {
    grid-area: b;
}

.ik-frame-reservation-form-step-1__segments > :nth-child(3) {
    grid-area: c;
}

.ik-frame-reservation-form-step-1__segments > :nth-child(4) {
    grid-area: d;
}

.ik-frame-reservation-form-step-1__body {
    min-height: 250px;
    display: flex;
    flex-direction: column;
}

.ik-frame-reservation-form-step-1__loader {
    flex: 1 1 auto;
}

.ik-frame-reservation-form-step-1__service-error {
    flex: 1 1 auto;
    color: var(--error-color);
}

.ik-frame-reservation-form-step-1__segments:not(.ik-frame-reservation-form-step-1__segments--inline) .ik-frame-reservation-form-step-1__timeslot--segmented {
    min-width: 177px;
}

.ik-frame-reservation-form-step-1__wrapper {
    min-height: 100px;
    padding: 20px;
}
.ik-frame-reservation-form-timeslots__wrapper {
    min-height: 100px;
    padding: 20px;
}

.ik-frame-reservation-form-timeslots__segment-name {
    text-transform: capitalize;
}

.ik-frame-reservation-form-timeslots__segments:not(.ik-frame-reservation-form-timeslots__segments--inline) {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    grid-template-rows: min-content min-content;
    grid-template-areas:
        "a b c"
        "d d d"
}

.ik-frame-reservation-form-timeslots__segments > :nth-child(1) {
    grid-area: a;
}

.ik-frame-reservation-form-timeslots__segments > :nth-child(2) {
    grid-area: b;
}

.ik-frame-reservation-form-timeslots__segments > :nth-child(3) {
    grid-area: c;
}

.ik-frame-reservation-form-timeslots__segments > :nth-child(4) {
    grid-area: d;
}

.ik-frame-quotation-form-step-1__body {
    min-height: 250px;
    display: flex;
    flex-direction: column;
}

.ik-frame-quotation-form-step-1__loader {
    flex: 1 1 auto;
}

.ik-frame-quotation-form-step-1__service-error {
    flex: 1 1 auto;
    color: var(--error-color);
}
.ik-auto-text-size {
    text-align: left;
    justify-content: start;
    line-height: normal;
}

.ik-auto-text-size--center {
    text-align: center;
    justify-content: center;
}

.ik-auto-text-size--right {
    text-align: right;
    justify-content: end;
}

.ik-toast-wrapper {
    z-index: var(--z-index--toast);
    position: fixed;
    max-width: 100%;
    bottom: 10px;
    left: 10px;
    right: 10px;
    display: flex;
    pointer-events: none;
}

.ik-toast-wrapper--center {
    justify-content: center;
}

.ik-toast-wrapper--right {
    justify-content: flex-end;
}

.ik-toast {
    pointer-events: auto;
    max-width: 100%;
    transition: transform 100ms ease-in-out;
    -webkit-transition: transform 100ms ease-in-out;
}

.ik-toast--center {
    transform: translateY(150%);
}

.ik-toast--right {
    transform: translateX(150%);
}

.ik-toast--visible {
    transform: translateY(0);
}

.ik-toast-content {
    display: flex;
    min-height: 48px;
    max-width: 100%;
    background-color: var(--secondary-color);
    color: var(--on-secondary-color);
    border-radius: 8px;
    box-shadow: 0 0 20px 8px rgba(31, 44, 56, 0.15);
}

.ik-toast-content__icon {
    flex: 0 0 auto;
    padding: 8px 0 8px 15px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
}

.ik-toast-content__icon .ik-icon {
    flex: 0 0 auto;
}

.ik-theme--dark .ik-toast-content {
    background-color: var(--surface-color);
    color: var(--on-surface-color-1);
    box-shadow: 0 0 5px 8px rgba(0, 0, 0, 0.3);
}

.ik-toast-body {
    flex: 1 1 auto;
    padding: 15px;
    font-weight: 400;
    min-width: 0;
}

.ik-toast-actions {
    flex: 0 0 auto;
    padding: 8px;
    display: flex;
    justify-content: flex-end;
    align-items: center;
}

.ik-toast-actions > .ik-button {
    flex: 0 0 auto;
}

.ik-toast-actions > .ik-button .ik-icon {
    font-size: 18px;
}

.ik-toast--size-xs {
    width: 250px;
}

.ik-toast--size-sm {
    width: 350px;
}

.ik-toast--size-md {
    width: 550px;
}

.ik-toast--size-lg {
    width: 650px;
}

.ik-ecommerce-cart-widget {
    color: var(--on-background-color-1);
}

.ik-ecommerce-cart-widget__popover {
    z-index: calc(var(--z-index-webpage-nav) + 9) !important;
}

.ik-ecommerce-cart-widget__title {
    font-size: 14px;
    font-weight: bold;
    color: var(--primary-color);
    text-transform: uppercase;
    letter-spacing: 3px;
}

.ik-ecommerce-cart-widget__items-wrapper {
    height: 350px;
    margin: 0 -25px;
}

.ik-ecommerce-cart-widget--aside .ik-ecommerce-cart-widget__items-wrapper {
    margin: 0 -10px;
}

.ik-ecommerce-cart-widget--aside .ik-ecommerce-cart-widget__backdrop {
    position: fixed;
    top: 0;
    left: 0;
    width: calc(100vw - 280px);
    height: 100vh;
    background-color: #000;
    opacity: .5;
    z-index: calc(var(--z-index-webpage-nav) + 9);
}

.ik-ecommerce-cart-widget--aside .ik-ecommerce-cart-widget__content {
    z-index: calc(var(--z-index-webpage-nav) + 9);
    position: fixed;
    height: 100%;
    width: 280px;
    background-color: var(--background-color);
    top: 0;
    right: 0;
    transition-timing-function: ease-in-out;
    transition-property: transform;
    transition-duration: .1s;
}

/* Cart content */

.ik-ecommerce-cart-content__item {
    height: 80px;
}

.ik-ecommerce-cart-content__item-img {
    border-top-left-radius: 12px;
    border-bottom-left-radius: 12px;
}

.ik-ecommerce-cart-content__divider {
    margin: 12px 22px;
    border-bottom: 1px solid rgba(100, 136, 248, .2);
}

/* Cart summary */

.ik-ecommerce-cart-summary__subtotal {
    font-size: 13px;
    margin-bottom: 8px;
}

.ik-ecommerce-cart-summary__subtotal-text {
    color: #747474;
}

.ik-ecommerce-cart-summary__total {
    font-size: 20px;
}

.ik-ecommerce-cart-content__item-title {
    line-break: anywhere;
}

.ik-ecommerce-cart-content__item-price {
    font-size: 15px;
}

.ik-ecommerce-cart-content__item-remove-icon {
    width: 24px !important;
    height: 24px !important;
    padding: 2px !important;
    font-size: 13px !important;
    min-height: 20px !important;
}

.ik-ecommerce-cart-content__item-remove-icon > i {
    line-height: 1 !important;
}
.ik-webpage-navigation {
    z-index: var(--z-index-webpage-nav);
    position: sticky;
    top: var(--sticky-offset-top, 0);
    left: 0;
    right: 0;
    color: var(--on-background-color-1);
    background-color: var(--background-color);
    transition: all 0.4s;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 60px;
}

.ik-webpage-navigation--transparent-on-top {
    background-color: transparent;
    color: #fff;
}

.ik-webpage-navigation--scrolled-down {
    background-color: var(--background-color);
    color: var(--on-background-color-1);
    box-shadow: 0 0 30px 0 rgba(0, 0, 0, 0.166);
}

.ik-webpage-navigation__wrapper {
    width: 100%;
    max-width: var(--l-max-content-width, 1024px) !important;
    padding: 0 var(--l-content-padding, 15px);
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.ik-webpage-navigation__items {
    overflow: auto !important;
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-shrink: 0;
}

.ik-webpage-navigation__append {
    margin-left: 30px;
}

.ik-webpage-navigation__item.ik-link {
    flex: 0 0 auto;
    height: 60px;
    display: flex;
    padding: 0 20px;
    align-items: center;
    justify-content: center;
    border-bottom: 3px solid transparent;
    color: var(--on-surface-color-3);
    font-weight: var(--text-semibold);
}

.ik-app:not(.ik-app--mobile) .ik-webpage-navigation--transparent-on-top:not(.ik-webpage-navigation--scrolled-down) .ik-webpage-navigation__item {
    color: #fff;
}

.ik-theme--8 .ik-app:not(.ik-app--mobile) .ik-webpage-navigation--transparent-on-top:not(.ik-webpage-navigation--scrolled-down) .ik-webpage-navigation__items {
    --primary-color: #fff;
}

.ik-theme--8 .ik-app:not(.ik-app--mobile) .ik-webpage-navigation--transparent-on-top:not(.ik-webpage-navigation--scrolled-down) .ik-webpage-navigation__popup {
    --primary-color: #000;
}

.ik-webpage-navigation__item--active.ik-link,
.ik-webpage-navigation__item:hover.ik-link {
    border-color: var(--primary-color);
    color: var(--primary-color) !important;
}

.ik-webpage-navigation__item-more.ik-link {
    border-color: transparent !important;
}

/* mobile styles */
.ik-app--mobile .ik-webpage-navigation__items {
    position: fixed;
    height: 100vh;
    width: 256px;
    color: var(--on-background-color-1);
    background-color: var(--background-color);
    top: 0;
    left: 0;
    overflow: auto;
    transition-timing-function: ease-in-out;
    transition-property: transform;
    transition-duration: .1s;
    flex-direction: column;
}

.ik-app--mobile .ik-webpage-navigation__item.ik-link {
    border: none;
    width: 100%;
    justify-content: flex-start;
    padding: 0 25px;
    height: 52px;
}

.ik-webpage-navigation__prepend {
    flex: 1;
    min-width: 0;
}

.ik-webpage-navigation__prepend-sidebar {
    padding: 25px;
}

.ik-webpage-navigation__append-sidebar {
    padding: 25px;
}

.ik-webpage-navigation__close .ik-icon {
    font-size: 20px;
}

.ik-webpage-navigation__indicator {
    transition: transform 0.4s cubic-bezier(0.05, 0.4, 0.46, 0.96);
}

.ik-webpage-navigation__item:hover .ik-webpage-navigation__indicator {
    transform: rotate(180deg);
}

.ik-webpage-navigation__popup {
    left: auto;
    position: absolute;
    top: 100%;
    background-color: var(--background-color);
    min-width: 100px;
    border-bottom-left-radius: 8px;
    border-bottom-right-radius: 8px;
    box-shadow: 0 30px 30px 0 rgba(0, 0, 0, 0.08);
    display: none;
}

.ik-webpage-navigation__item:hover .ik-webpage-navigation__popup {
    display: block;
}

.ik-webpage-navigation__popup-accent {
    height: 3px;
    background-color: var(--primary-color-o1);
}

.ik-webpage-navigation__child-items {
    list-style: none;
    padding: 0;
    margin: 0;
}

.ik-webpage-navigation__child-item {
    width: 100%;
    display: block;
    padding: 5px;
}

.ik-webpage-navigation__child-item > .ik-link {
    padding: 10px 15px;
    display: block;
    color: var(--on-background-color-1);
}

.ik-webpage-navigation__child-item:hover > .ik-link {
    background-color: var(--primary-color-o1);
    color: var(--primary-color);
    border-radius: 8px;
}

.ik-app--mobile .ik-link.ik-webpage-navigation__item--active,
.ik-app--mobile .ik-link.ik-webpage-navigation__item:hover {
    background-color: var(--primary-color-o1);
}
.ik-portal-cta-list {
    margin-top: 30px;
}

.ik-portal-cta {
    display: flex;
    justify-content: center;
    flex-direction: column;
}

.ik-portal-cta--start {
    align-items: flex-start;
}

.ik-portal-cta--center {
    align-items: center;
}

.ik-portal-cta--end {
    align-items: flex-end;
}

.ik-portal-cta--stretch {
    align-items: stretch;
}

.ik-portal-cta__inputs {
    display: flex;
    justify-content: center;
    align-items: stretch;
    flex-direction: column;
}

.ik-portal-cta__input {
    margin-right: 10px;
    margin-bottom: 10px;
}

.ik-portal-cta__hint {
    margin-top: 15px;
}

.ik-portal-cta--inline .ik-portal-cta__inputs {
    flex-direction: row;
    align-items: center;
}

.ik-portal-cta--inline .ik-portal-cta__input {
    margin-bottom: 0;
}

.ik-portal-cta__input .form-control:not(.form-control-flat),
.ik-portal-cta__input .form-control:not(.form-control-flat):focus {
    background-color: var(--background-color);
}

.ik-p-layout-open-box--dark .ik-portal-cta__input .form-control {
    color: #fff;
}

.ik-portal-cta-list > .ik-portal-cta-list__item {
    margin-top: 10px;
}

.ik-portal-cta-list > .ik-portal-cta-list__item:first-of-type {
    margin-top: 0;
}

.ik-portal-app-label {
    font-size: var(--text-sm);
    font-weight: var(--text-semibold);
    text-transform: uppercase;
    letter-spacing: 3px;
    color: var(--primary-color);
    margin-bottom: 12px;
}
.ik-portal-graphics > img,
.ik-portal-graphics > video {
    max-width: 100%;
    max-height: 100%;
    width: 100%;
    height: auto;
}
.ik-portal-content {
    text-align: initial;
}

.ik-portal-content--m-top {
    margin-top: 32px;
}

/* portal light mode */
.ik-theme--light,
.ik-theme--light .ik-theme--static {
    --background-color: #fff;
    --on-background-color-1: #1f2c38;
    --on-background-color-2: #222B45;
    --on-background-color-2a: #465A6A;
    --on-background-color-3: #8294a2;
    --on-background-color-4: #BBC7D0;
    --on-background-color-5: #E7F2F9;

    --surface-color: #fff;
    --on-surface-color-1: #1f2c38;
    --on-surface-color-2: #222B45;
    --on-surface-color-3: #8294A2;
    --on-surface-color-4: #BBC7D0;

    --surface-lighten-color: #f4f9fb;
    --on-surface-lighten-color-1: #1f2c38;
    --on-surface-lighten-color-2: #222B45;
    --on-surface-lighten-color-3: #8294A2;
    --on-surface-lighten-color-4: #acbbc7;

    --surface-darken-color: #EBF1F6;
    --on-surface-darken-color-1: #1f2c38;
    --on-surface-darken-color-2: #222B45;
    --on-surface-darken-color-3: #8294A2;
    --on-surface-darken-color-4: #acbbc7;

    --border-color-1: #DDE3E7;
    --border-color-2: #EBF1F6;
    --marker-color-1: #1b2c39;
    --skeleton-color-1: #EBF1F6;
    --skeleton-color-2: hsla(0, 0%, 100%, .35);

    --shadow-color-1: rgba(70, 90, 106, 0.15);
    --shadow-color-2: rgba(70, 90, 106, 0.2);
    --shadow-color-3: rgba(70, 90, 106, 0.5);

    --scrollbar-color: #536d83;
    --scrollbar-track-color: rgba(0, 0, 0, 0.1);

    --tooltip-color: #333;
    --on-tooltip-color: #fff;
}

/* portal dark-contrast mode */
.ik-theme--dark {
    --background-color: #121212;
    --on-background-color-1: #ffffff;
    --on-background-color-2: #c9c9c9;
    --on-background-color-2a: #c9c9c9;
    --on-background-color-3: #c9c9c9;
    --on-background-color-4: #b6b6b6;
    --on-background-color-5: #b6b6b6;

    --surface-color: #191919;
    --on-surface-color-1: #cdc3ba;
    --on-surface-color-2: #b6aea4;
    --on-surface-color-3: #787878;
    --on-surface-color-4: #4b4b4b;

    --surface-darken-color: #222222;
    --on-surface-darken-color-1: #e0d3c7;
    --on-surface-darken-color-2: #93908b;
    --on-surface-darken-color-3: #7a736e;
    --on-surface-darken-color-4: #696969;

    --surface-lighten-color: #191919;
    --on-surface-lighten-color-1: #e0d3c7;
    --on-surface-lighten-color-2: #93908b;
    --on-surface-lighten-color-3: #7a736e;
    --on-surface-lighten-color-4: #696969;

    --border-color-1: #474747;
    --border-color-2: #363636;
    --marker-color-1: #737373;
    --skeleton-color-1: #333333;
    --skeleton-color-2: hsla(0, 0%, 100%, .03);

    --shadow-color-1: rgba(0, 0, 0, 0.5);
    --shadow-color-2: rgba(0, 0, 0, 1);
    --shadow-color-3: rgba(0, 0, 0, 1);

    --scrollbar-color: #fff;
    --scrollbar-track-color: rgba(255, 255, 255, 0.1);

    --tooltip-color: #444;
    --on-tooltip-color: #e0d3c7;
}

/* portal global styles */
h1,
h2,
h3,
h4,
h5,
h6 {
    font-weight: 600;
    line-height: normal;
    margin: 0 0 15px 0;
}

p {
    font-weight: 400;
}

/* google captcha overlay modal fix */
iframe[src*="captcha"] {
    position: fixed;
}

/* disables pointer-events on iframes */
html[data-ikol-context="creator"] * {
    pointer-events: none !important;
}

body {
    overflow-x: hidden;
}

.ik-p-app__modal-content .ik-modal-body {
    padding: 0;
}

/* typography */

/* medium font */
.ik-p-text--1 {
    font-size: 13px;
}

.ik-p-text--2 {
    font-size: 14px;
}

.ik-p-text--3 {
    font-size: 16px;
}

.ik-p-text--4 {
    font-size: 20px;
    font-weight: 400;
}

.ik-p-text--5 {
    font-size: 35px;
    font-weight: 600;
}

/* large font */
.ik-p-text--large .ik-p-text--1 {
    font-size: 14px;
}

.ik-p-text--large .ik-p-text--2 {
    font-size: 16px;
}

.ik-p-text--large .ik-p-text--3 {
    font-size: 18px;
}

.ik-p-text--large .ik-p-text--4 {
    font-size: 25px;
    font-weight: 400;
}

.ik-p-text--large .ik-p-text--5 {
    font-size: 40px;
    font-weight: 600;
}

/* small font */
.ik-p-text--small .ik-p-text--1 {
    font-size: 12px;
}

.ik-p-text--small .ik-p-text--2 {
    font-size: 13px;
}

.ik-p-text--small .ik-p-text--3 {
    font-size: 14px;
}

.ik-p-text--small .ik-p-text--4 {
    font-size: 18px;
    font-weight: 400;
}

.ik-p-text--small .ik-p-text--5 {
    font-size: 25px;
    font-weight: 600;
}

/* font colors */
.ik-p-text--1:not(.ik-p-text--size-only) {
    color: var(--on-background-color-3);
}

.ik-p-text--2:not(.ik-p-text--size-only) {
    color: var(--on-background-color-1);
}

.ik-p-text--3:not(.ik-p-text--size-only) {
    color: var(--on-background-color-2a);
}

.ik-p-text--4:not(.ik-p-text--size-only) {
    color: var(--on-background-color-1);
}

.ik-p-text--5:not(.ik-p-text--size-only) {
    color: var(--on-background-color-1);
}

vue3-body {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 100%;
    pointer-events: none;
}

