/* Minification failed. Returning unminified contents.
(3,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(11,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '&'
(20,18): run-time error CSS1039: Token not allowed after unary operator: '-info-header-height'
(28,35): run-time error CSS1039: Token not allowed after unary operator: '-grey-shade-03'
(32,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(33,18): run-time error CSS1039: Token not allowed after unary operator: '-site-header-height'
(34,28): run-time error CSS1039: Token not allowed after unary operator: '-primary-color'
(47,28): run-time error CSS1039: Token not allowed after unary operator: '-primary-color'
(60,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '&'
(147,1): run-time error CSS1035: Expected colon, found '{'
(160,28): run-time error CSS1039: Token not allowed after unary operator: '-grey-shade-03'
(170,18): run-time error CSS1039: Token not allowed after unary operator: '-info-header-height'
(174,1): run-time error CSS1035: Expected colon, found '{'
(246,18): run-time error CSS1039: Token not allowed after unary operator: '-site-header-height'
(250,1): run-time error CSS1035: Expected colon, found '{'
(303,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '>'
(401,1): run-time error CSS1035: Expected colon, found '{'
(493,14): run-time error CSS1034: 
(507,54): run-time error CSS1030: Expected identifier, found ','
(507,57): run-time error CSS1031: Expected selector, found ')'
(507,57): run-time error CSS1025: Expected comma or open brace, found ')'
(570,24): run-time error CSS1030: Expected identifier, found ','
(570,105): run-time error CSS1031: Expected selector, found ')'
(570,105): run-time error CSS1025: Expected comma or open brace, found ')'
(624,10): run-time error CSS1035: Expected colon, found '{'
(665,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(666,28): run-time error CSS1039: Token not allowed after unary operator: '-bg-color'
(668,37): run-time error CSS1039: Token not allowed after unary operator: '-bg-color'
(668,57): run-time error CSS1063: Expected calculation unit, found 'l'
(668,57): run-time error CSS1064: Expected calculation product, found 'l'
(668,57): run-time error CSS1065: Expected calculation sum, found 'l'
(668,57): run-time error CSS1034: 
(668,57): run-time error CSS1042: Expected function, found 'l'
(668,60): run-time error CSS1019: Unexpected token, found ' '
(668,60): run-time error CSS1019: Unexpected token, found ' '
(668,60): run-time error CSS1042: Expected function, found ' '
(668,60): run-time error CSS1062: Expected semicolon or closing curly-brace, found ' '
(669,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '&'
(692,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '>'
(721,1): run-time error CSS1035: Expected colon, found '{'
(740,10): run-time error CSS1035: Expected colon, found '['
 */
/*main layout*/
:root {
    --info-header-height: 36px;
}

body {
    display: flex;
    flex-direction: column;
    grid-template-rows: auto auto 1fr auto;
    min-height: 100dvh;
    &.pre-login-page

{
    grid-template-rows: auto auto 1fr auto;
}

}

.cnf-info-header-bar {
    height: var(--info-header-height);
    display: flex;
    flex-wrap: nowrap;
    position: sticky;
    z-index: 1041;
    top: 0;
    left: 0;
    background-color: #fff;
    border-bottom: 1px solid var(--grey-shade-03);
}

.cnf-application-header {
    --site-header-height: 42px;
    height: var(--site-header-height);
    background-color: var(--primary-color);
    color: #fff;
}

.cnf-content-wrapper {
    background-color: #fff;
    padding-block: 10px;
    flex-grow: 1;
}

footer.cnf-site-footer {
    /* --site-footer-height: 124px;
    height: var(--site-footer-height); */
    background-color: var(--primary-color);
    color: #fff;
}

/**layout elements*/
/**sprite images*/
.cnf-sprite-set {
    display: inline-flex;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center center;
    vertical-align: middle;
    height: 13px;
    &.phone-icon-new

{
    aspect-ratio: 741/741;
    background-image: url(/assets/img/brandingUpdate/Phone-Blue.png);
}

&.notification-icon,
&.bell-blue-icon {
    aspect-ratio: 648/741;
    background-image: url(/assets/img/brandingUpdate/Bell-Blue.png);
}

&.refresh-icon {
    aspect-ratio: 671/649;
    background-image: url(/assets/img/brandingUpdate/Rotate-Right-Blue.png);
}

&.info-icon {
    aspect-ratio: 1/1;
    background-image: url(/assets/img/brandingUpdate/Circle-Info-Blue.png);
}

&.hint-icon,
&.bulb-blue-icon {
    aspect-ratio: 671/649;
    background-image: url(/assets/img/brandingUpdate/Lightbulb-Blue.png);
}

&.envelope-icon {
    aspect-ratio: 741/556;
    background-image: url(/assets/img/brandingUpdate/Envelope-Blue.png);
}

&.comment-icon {
    aspect-ratio: 741/649;
    background-image: url(/assets/img/brandingUpdate/Comment-Blue.png);
}

&.user-icon {
    aspect-ratio: 648/741;
    background-image: url(/assets/img/brandingUpdate/User-Blue.png);
}

}
/**font awesome override*/
.fa,
.fa-brands,
.fa-regular,
.fa-solid,
.fab,
.far,
.fas {
    text-rendering: inherit;
}

/*.btn:not([data-toggle="dropdown"]) {
    border-radius: 0;
    clip-path: polygon(0 0, 100% 0, 100% 70%, 90% 100%, 0 100%);
    border: none;
    background-color: #eee;

    &.btn-primary
{
    background-color: var(--primary-color);
    color: var(--white-text-color);
}
}*/

/**extra button utilities**/
/*.btn {
    box-shadow: none !important;
}*/

/*.btn:not(.btn-sm,.btn-xs) {
        padding-block: 7px;
    }*/

.btn.btn-icon-only {
    font-size: inherit;
    background-color: transparent !important;
    border: none;
    line-height: inherit;
    outline: none !important;
    clip-path: none;
    .cnf-sprite-set

{
    height: 14px;
}

}
/** header info bar */

.cnf-user-icon--wrapper {
    aspect-ratio: 1/1;
    height: 26px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background-color: var(--grey-shade-03);
    border-radius: 100% !important;
}

.cnf-info-header-list {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: center;
    height: var(--info-header-height);
    row-gap: 2px;
    li

{
    --inline-space: 12px;
    min-height: var(--info-header-height);
    overflow: visible;
    border-style: solid;
    border-width: 0 1px 0 0;
    border-color: transparent var(--grey-shade-03) transparent var(--grey-shade-03);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding-inline: var(--inline-space);
    column-gap: 5px;
    line-height: 1;
    font-size: 14px;
    isolation: isolate;
    &:first-of-type, &.ms-auto

{
    border-left-width: 1px;
}

&.menu-seperator {
    flex-grow: 1;
    flex-shrink: 0;
}

strong {
    font-weight: 600;
}

span {
    font-size: 13px;
}

/*.btn {
    display: inline-flex;
    background-color: transparent !important;
    box-shadow: none !important;
    padding-block: 0;
    border-radius: 0;
    clip-path: none;
    height: auto;
}
*/
.cnf-sprite-set {
    height: 12px;
}



header .btn:only-child {
    align-self: stretch;
    justify-self: stretch;
    align-items: center;
    justify-content: center;
    margin-inline: calc(var(--inline-space) * -1);
    padding-inline: var(--inline-space);
}

}

li.cnf-user--info {
    cursor: pointer;
}

}

.cnf-site-nav-wrapper {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: nowrap;
    height: var(--site-header-height);
    line-height: 1;
    .cnf-project-name

{
    font-size: 28px;
    font-weight: 600;
    a

{
    color: inherit;
    cursor: pointer;
    text-decoration: none;
    &:hover, &:focus

{
    text-decoration: none;
}

}
}

.cnf-site-menu {
    display: flex;
    flex-direction: row;
    column-gap: 20px;
    font-size: 14px;
    font-weight: 500;
    color: inherit;
    > li

{
    height: var(--site-header-height);
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    > a, > button

{
    text-transform: uppercase;
    display: flex;
    border: none;
    padding: 8px 4px;
    background-color: transparent;
    color: inherit;
    text-decoration: none;
    flex-wrap: nowrap;
    gap: 6px;
}

}
}
}

li.submenu-wrapper {
    position: relative;
    > ul.cnf-site-menu-sub

{
    z-index: 1111;
    display: none;
    opacity: 0;
    animation: slideUpClose 500ms forwards;
    transition-behavior: allow-discrete;
    background-color: var(--grey-shade-01);
    color: var(--body-text-color);
    border: 1px solid var(--grey-shade-04);
    width: auto;
    position: absolute;
    inset: 100% 0 auto auto;
    overflow: hidden;
    box-shadow: 0 3px 4px -1px rgba(0,0,0,.3);
    > li

{
    padding: 0;
    display: block;
    min-height: 0;
    a, > span

{
    display: block;
    color: inherit;
    padding: 9px 6px;
    white-space: nowrap;
    font-size: 13px;
    font-weight: 500;
    text-decoration: none;
}

> span {
    cursor: default;
}

+ li {
    border-top: 1px solid var(--grey-shade-03);
}

}
}

.fa-chevron-down {
    transition: transform 400ms;
}

&.submenu-opened {
    > ul.cnf-site-menu-sub

{
    display: block;
    animation: slideDown 500ms forwards;
    &.with-arrow

{
    --border-width: 2px;
    border-top: var(--border-width) solid var(--primary-color);
    border-bottom: var(--border-width) solid var(--primary-color);
    overflow: visible;
    inset-block-start: calc(100% - 3px);
    &::before

{
    --triangle-height: 8px;
    content: '';
    position: absolute;
    top: calc((var(--triangle-height) * -1) - var(--border-width));
    right: 20px;
    width: 0;
    height: 0;
    border-width: var(--triangle-height);
    border-top-width: 0;
    border-style: solid;
    border-color: transparent;
    border-bottom-color: var(--primary-color);
}

}
}

.fa-chevron-down {
    transform: rotate(180deg);
}

}
}
/**site-footer */
.cnf-site-footer-content {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-block: 20px;
    gap: 10px;
    a

{
    color: #fff;
    text-underline-offset: 5px;
}

p {
    margin: 0;
    line-height: 1;
    color: inherit;
}

.cnf-site-info-content {
    display: flex;
    flex-direction: column;
    gap: 20px;
    .cnf-office-address

{
}

.cnf-product-note {
    font-size: 13px;
}

}

.cnf-social-link-wrap {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 15px;
    .cnf-social-links

{
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    .btn

{
    width: 42px;
    height: 30px;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--primary-color) !important;
    text-decoration: none !important;
    background-color: #fff !important;
    border-radius: 0;
    font-size: 18px;
    clip-path: polygon(0 0, 100% 0, 100% 80%, 80% 100%, 0 100%);
}

}

.cnf-site-links {
    ul

{
    color: #fff;
    display: flex;
    li

{
    padding-inline: 10px;
    & + li

{
    border-left: 1px solid #eee;
}

}

li a {
    padding: 0;
    color: #fff;
}

}
}
}
}

.submenu-trigger {
    display: inline-flex;
    align-items: center;
    gap: 3px;
}

@media (width<=767px) {
    .cnf-site-info-content
    .cnf-office-address {
        font-size: 11px;
        line-height: 1.3;
    }
}


/**overrides*/

/**kendo buttons - old version */


.k-filter-menu-container .k-button:not(.no-corner-cut,li), .k-window-content .k-button:not(.no-corner-cut,li), .k-button.k-upload-button:not(.no-corner-cut) {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    --bg-color: #ccc;
    --inner-bg-color: #fff;
    --inner-offset: 1px;
    --outline-color: currentColor;
    background-color: transparent !important;
    border-width: 0 !important;
    border-color: transparent !important;
    background-image: linear-gradient(-30deg, transparent var(--color-split-point), var(--bg-color) var(--color-split-point));
    isolation: isolate;
    position: relative;
    outline-color: var(--outline-color) !important;
    transition: background-image 2s linear;
    box-shadow: none;
    &:hover, &:focus
    {
        --bg-color: #bbb;
        background-image: linear-gradient(-30deg, transparent var(--color-split-point), hsl(from var(--bg-color) h s calc(l - 5)) var(--color-split-point));
    }

    &::before {
        content: '' !important;
        display: block;
        opacity: 1;
        position: absolute;
        inset: var(--inner-offset);
        --bg-color: var(--inner-bg-color);
        pointer-events: none;
        z-index: -1;
        background-color: transparent;
        background-image: linear-gradient(-30deg, transparent var(--color-split-point), var(--bg-color) var(--color-split-point));
    }

    &:hover::before, &:focus::before {
        --bg-color: inherit;
    }

    &.active:before {
        --bg-color: #ddd;
    }

    &.k-primary {
        --bg-color: var(--primary-color);
        --inner-bg-color: transparent;
        color: #fff;

        &:hover, &:focus {
            --bg-color: var(--primary-color);
        }
    }
}

/**buttons*/

.btn {
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap: 5px;
}
.btn:not(.btn-icon-only, .no-corner-cut, .selectpicker, .btn-link, .anim-icon, .effect-8,.tlbr-anim-icon) {
    --bg-color: #ccc;
    --inner-bg-color: transparent;
    --inner-offset: 1px;
    --outline-color: currentColor;
    background-color: transparent !important;
    border-width: 0 !important;
    border-color: transparent !important;
    background-image: linear-gradient(-30deg, transparent var(--color-split-point), var(--bg-color) var(--color-split-point));
    isolation: isolate;
    position: relative;
    outline-color: var(--outline-color) !important;
    transition: background-image 2s linear;
    box-shadow: none;
    &:hover, &:focus

{
    --bg-color: #bbb;
    background-image: linear-gradient(-30deg, transparent var(--color-split-point), hsl(from var(--bg-color) h s calc(l - 5)) var(--color-split-point));
}

&.btn-primary,
&.btn-primary-new {
    --bg-color: var(--primary-color);
    color: #fff;
    &:hover, &:focus

{
    --bg-color: var(--primary-color);
}

}
&.btn-default {
    --inner-bg-color: #fff;
    &:before {
    content: '';
    position: absolute;
    inset: var(--inner-offset);
    --bg-color: #fff;
    pointer-events: none;
    z-index: -1;
    background-image: linear-gradient(-30deg, transparent var(--color-split-point), var(--bg-color) var(--color-split-point));
}
&:hover:before, &:focus:before {
    --bg-color: inherit;
   
}
&.active:before {
    --bg-color: #ddd;
}
}
}

.custom-confirm {
    .btn {
             &.btn-primary

{
    --bg-color: #ccc !important;
    color:#333;
    &:hover, &:focus

{
    --bg-color: #bbb !important;
}
&:before {
    content: '';
    position: absolute;
    inset: 1px;
    --bg-color: #fff;
    pointer-events: none;
    z-index: -1;
    background-image: linear-gradient(-30deg, transparent var(--color-split-point), var(--bg-color) var(--color-split-point));
}

&:hover:before, &:focus:before {
    --bg-color: #bbb;
    background-image: linear-gradient(-30deg, transparent var(--color-split-point), hsl(from var(--bg-color) h s calc(l - 5)) var(--color-split-point));
}
}

&.btn-custom-primary {
    --bg-color: var(--primary-color);
    color: #fff;
    &:hover, &:focus

{
    --bg-color: var(--primary-color);
}

}
    }
}

.findProductsContainer .btn {
    --bg-color: #fff;
    background-color: var(--bg-color) !important;
    background-image: none;
    border: 1px solid hsl(from var(--bg-color) h s calc(l - 25)) !important;
    &.active

{
    --bg-color: #ddd;
}

&:hover,
&:focus {
    --bg-color:#ccc;
    background-color: var(--bg-color) !important;
    background-image: none;
}

&.btn-sm {
    height: 30px !important;
}

}


/**top-header-menu*/
.topbar-v1 .top-v1-data li.user--info-dd-wrap {
    padding-top: 1px;
    >a.dropdown-toggle

{
    display: flex;
    flex-direction: row;
    align-items: center;
    &::after

{
    position: static !important;
}

}
}

.header .navbar-brand {
    font-size: 28px;
    font-weight: 600 !important;
}

.alert.alert-design-new,
.control-group.alert-design-new {
    padding: 5px !important;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: start;
    .fa

{
    float: none;
    margin-block: 0;
}

}

.radio-inline,
.checkbox-inline {
    display: inline-flex;
    flex-direction: row;
    align-items: center;
    justify-content: start;
    padding: 0 !important;
    gap: 4px;
    font-size: 13px;
    font-weight: 500 !important;
    color: #333 !important;
    line-height: 1;
    input[type='radio'], input[type='checkbox']

{
    position: static !important;
    top: auto;
    left: auto;
    right: auto;
    bottom: auto;
    margin: 0 !important;
}
}
/**owl carousel*/
.owl-theme .owl-dots .owl-dot span {
    
    border-radius: 30px !important;
}