:root {
    --kang-check-icon-color: url(../icons/checked_checkbox.png);
    --kang-font: #fff;
    --kang-bg-2: linear-gradient(90deg, #FFFEF4 0%, #E8E4C9 100%);
    --kang-Font-black: #fff;
    --kang-filter-white: grayscale(100%) brightness(1000%);
    --kang-Poppins-Font: Poppins, sans-serif;
    --kang-Base-On: rgba(218, 99, 0, 1);
    --kang-Font-White: #fff;
    --kang-White: #fff;
    --kang-Card: #fff;
    --kang-padding-button: 11.5px 24px 11.5px 24px;
    --kang-padding-outline: 10.5px 24px 10.5px 24px;
    --kang-bg-color: #f5f5f5;
    --kang-bg-1: rgba(244, 244, 242, 1);
    --kang-text-color: #042c41;
    --kang-sidebar-bg: #fff;
    --kang-active-color: #f4a261;
    --kang-gray: rgba(159, 159, 159, 1);
    --kang-primary: #ff8025;
    --kang-support-orange: #ffc076;
    --kang-support-orange1: #ffc076;
    --kang-light-bg: rgba(244, 244, 242, 1);
    --kang-color-white: #fff;
    --kang-color-dark: #042c41;
    --kang-color-orange-dark: #da6300;
    --kang-color-orange-label: #ffda95;
    --kang-gradient-orange: linear-gradient(90deg, #FFA04C 0%, #CA5602 100%);
    --kang-font-size-14: 14px;
    --kang-font-size-16: 16px;
    --kang-font-size-18: 18px;
    --kang-font-size-24: 24px;
    --kang-font-size-large: 2.5rem;
    --kang-font-size-xl: 80px;
    --kang-font-size-md: 23px;
    --kang-padding-8: 8px;
    --kang-padding-16: 16px;
    --kang-padding-24: 24px;
    --kang-gap-8: 8px;
    --kang-gap-16: 16px;
    --kang-gap-24: 24px;
    --kang-gap-32: 32px;
    --kang-gap-80: 80px;
    --kang-border-radius-4: 4px;
    --kang-border-radius-8: 8px;
    --kang-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    --kang-margin-bottom-24: 1.5rem;
    --kang-margin-top-16: 16px;
    --kang-padding-top-16: 16px;
    --kang-padding-bottom-16: 16px;
    --kang-font-weight-600: 600;
    --kang-color-dark-blue: rgba(4, 44, 65, 1);
    --kang-color-gray-light: #f4f4f2;
    --kang-icon-bg: #ffe0b2;
    --kang-padding-finance: 5px 0 10px;
    --kang-no-wrap: nowrap !important;
    --kang-nowrap: nowrap;
    --kang-text-white-16: var(--kang-font-size-16) var(--kang-color-white);
    --kang-text-info: var(--kang-color-dark) var(--kang-font-size-16);
    --kang-text-label: var(--kang-color-dark) var(--kang-font-weight-600) var(--kang-font-size-16);
    --kang-number-large: var(--kang-color-orange-dark) var(--kang-font-weight-600) var(--kang-font-size-large);
    --kang-text-gray-16: var(--kang-gray) var(--kang-font-size-16) !important;
    --kang-filter-black: grayscale(100%) brightness(1000%);
    --kang-bg-form: #fff;
    --kang-font-color-form: #042C41;
    --kang-bg-form-select: #F4F4F2;
    --kang-spanborder-radio-span: 2px solid rgba(4, 44, 65, 1);
    --kang-card-novo-ticket: #dfdfde;
}

*,
::after,
::before {
    box-sizing: border-box !important;
}

body.dark-mode {
    --kang-check-icon-color: url(../icons/checked_checkbox.png);
    --kang-Base-On: #FF8025;
    --kang-color-orange-label: #B15204;
    --kang-White: rgb(0, 0, 0);
    --kang-font: #1f1f1f;
    --kang-bg-1: #2F2F2F;
    --kang-bg-2: linear-gradient(90deg, #DFDFDE 0%, #797978 100%);
    --kang-filter-black: invert(1);
    --kang-filter-white-black: grayscale(100%) brightness(1000%);
    --kang-Font-black: #1f1f1f;
    --kang-Card: #1f1f1f;
    --kang-bg-form: #1F1F1F;
    --kang-bg-color: #2f2f2f;
    --kang-text-color: #e0e0e0;
    --kang-sidebar-bg: #1f1f1f;
    --kang-active-color: #f4a261;
    --kang-gray: #bbb;
    --kang-primary: #ff8025;
    --kang-support-orange: #FFC076;
    --kang-support-orange1: #DA6300;
    --kang-light-bg: #333;
    --kang-color-white: #fff;
    --kang-color-dark: #e0e0e0;
    --kang-color-orange-dark: #FFDA95;
    --kang-gradient-orange: linear-gradient(90deg, #FFA04C 0%, #CA5602 100%);
    --kang-color-dark-blue: #bbb;
    --kang-color-gray-light: #333;
    --kang-icon-bg: #444;
    --kang-shadow: 0 4px 8px rgba(255, 255, 255, 0.1);
    --kang-font-color-form: #D3DBDF;
    --kang-bg-form-select: #2F2F2F;
    --kang-spanborder-radio-span: 2px solid #D3DBDF;
    --kang-card-novo-ticket: #2F2F2F;
}

@font-face {
    font-family: 'Poppins';
    src: url('Poppins-BlackItalic.woff2') format('woff2'),
        url('Poppins-BlackItalic.woff') format('woff');
    font-weight: 900;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Poppins';
    src: url('Poppins-ExtraBoldItalic.woff2') format('woff2'),
        url('Poppins-ExtraBoldItalic.woff') format('woff');
    font-weight: bold;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Poppins';
    src: url('Poppins-ExtraBold.woff2') format('woff2'),
        url('Poppins-ExtraBold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Poppins';
    src: url('Poppins-Black.woff2') format('woff2'),
        url('Poppins-Black.woff') format('woff');
    font-weight: 900;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Poppins';
    src: url('Poppins-Bold.woff2') format('woff2'),
        url('Poppins-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Poppins';
    src: url('Poppins-BoldItalic.woff2') format('woff2'),
        url('Poppins-BoldItalic.woff') format('woff');
    font-weight: bold;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Poppins';
    src: url('Poppins-Light.woff2') format('woff2'),
        url('Poppins-Light.woff') format('woff');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Poppins';
    src: url('Poppins-LightItalic.woff2') format('woff2'),
        url('Poppins-LightItalic.woff') format('woff');
    font-weight: 300;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Poppins';
    src: url('Poppins-ExtraLightItalic.woff2') format('woff2'),
        url('Poppins-ExtraLightItalic.woff') format('woff');
    font-weight: 200;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Poppins';
    src: url('Poppins-Italic.woff2') format('woff2'),
        url('Poppins-Italic.woff') format('woff');
    font-weight: normal;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Poppins';
    src: url('Poppins-ExtraLight.woff2') format('woff2'),
        url('Poppins-ExtraLight.woff') format('woff');
    font-weight: 200;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Poppins';
    src: url('Poppins-Medium.woff2') format('woff2'),
        url('Poppins-Medium.woff') format('woff');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Poppins';
    src: url('Poppins-Regular.woff2') format('woff2'),
        url('Poppins-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Poppins';
    src: url('Poppins-SemiBoldItalic.woff2') format('woff2'),
        url('Poppins-SemiBoldItalic.woff') format('woff');
    font-weight: 600;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Poppins';
    src: url('Poppins-ThinItalic.woff2') format('woff2'),
        url('Poppins-ThinItalic.woff') format('woff');
    font-weight: 100;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Poppins';
    src: url('Poppins-Thin.woff2') format('woff2'),
        url('Poppins-Thin.woff') format('woff');
    font-weight: 100;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Poppins';
    src: url('Poppins-MediumItalic.woff2') format('woff2'),
        url('Poppins-MediumItalic.woff') format('woff');
    font-weight: 500;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Poppins';
    src: url('Poppins-SemiBold.woff2') format('woff2'),
        url('Poppins-SemiBold.woff') format('woff');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

body {
    font-family: var(--kang-Poppins-Font);
    margin: 0;
    padding: 0;
    background-color: var(--kang-bg-color);
    color: var(--kang-text-color);
    font-size: var(--kang-font-size-14);
}

.kang-container {
    display: flex;
    height: 100vh;
}

.kang-sidebar {
    width: 60px;
    background-color: var(--kang-sidebar-bg);
    transition: width 0.3s ease;
    overflow: hidden;
    position: relative;
    z-index: 1000;
}

.kang-sidebar.kang-expanded {
    width: 250px;
}

.kang-text-decoration-none {
    text-decoration: none !important;
    color: var(--kang-text-color);
}

.kang-left-15 {
    left: 1.5rem;
}

.kang-sidebar a {
    display: flex;
    justify-content: center;
    align-items: center;
    color: var(--kang-text-color);
    text-decoration: none;
    border-radius: 5px;
    font-size: var(--kang-font-size-14);
    position: relative;
}

.kang-sidebar a:hover,
.kang-sidebar a:hover svg {
    color: var(--kang-active-color);
}

.kang-sidebar a:hover svg path,
.kang-sidebar a:hover svg circle {
    stroke: var(--kang-active-color);
}

.kang-sidebar a.kang-active {
    color: var(--kang-active-color);
}

.kang-sidebar a.kang-active svg path,
.kang-sidebar a.kang-active svg circle {
    stroke: var(--kang-active-color);
}

.kang-sidebar a svg {
    flex-shrink: 0;
}

.kang-sidebar a span {
    margin-left: 0;
    transition: opacity 0.3s ease;
}

.kang-sidebar a span {
    opacity: 0;
    width: 0;
    overflow: hidden;
}

.kang-sidebar.kang-expanded a span {
    opacity: 1;
    width: auto;
    font-size: var(--kang-font-size-18);
}

.kang-header {
    flex-grow: 1;
    padding: 0;
}

.kang-top-bar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 24px;
    position: relative;
    z-index: 10;
}

.kang-menu {
    display: flex;
    gap: 48px;
    align-items: center;
    position: relative;
}

.kang-menu-item {
    position: relative;
    color: var(--kang-text-color);
    text-decoration: none;
    display: flex;
    align-items: center;
    gap: 5px;
}


.kang-menu-item:hover svg path,
.kang-menu-item:hover svg circle {
    stroke: var(--kang-active-color);
}

.kang-menu-item svg {
    flex-shrink: 0;
    margin-right: 8px;
}

.kang-margin-right-8px {
    margin-right: 8px;
}

.kang-main-content {
    padding: 5px 20px;
    transition: margin-left 0.3s ease;
}

.kang-welcome {
    background: linear-gradient(90deg, #FFFEF4 0%, #E8E4C9 100%);
    padding: 20px;
    text-align: center;
    border-radius: 5px;
    margin: 20px 0 20px 0;
}

.kang-welcome p {
    margin: 5px 0;
    font-size: var(--kang-font-size-14);
}

.kang-welcome a {
    color: var(--kang-active-color);
    text-decoration: none;
    font-weight: bold;
}

.kang-align-center {
    text-align: center !important;
}

.kang-service-list {
    margin: 20px 0;
}

.kang-service-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 0;
    background-color: var(--kang-sidebar-bg);
    padding-bottom: 15px;
    font-size: var(--kang-font-size-14);
    border-bottom: 1px solid var(--kang-color-gray-light);
}

.kang-icon {
    width: 40px;
    display: flex;
    height: 40px;
    border-radius: 20px;
    justify-content: center;
    align-items: center;
}

.kang-icon-1 {
    background-color: var(--kang-icon-bg);
}

.kang-icon-2 {
    background-color: #e8e4c9;
}

.kang-icon-3 {
    background-color: #ffc076;
}

.kang-icon-4 {
    background-color: #f4f4f2;
}

.kang-footer {
    text-align: right;
    padding: 10px;
    color: #666;
}

/* Mobile Styles */
@media (max-width: 768px) {
    .kang-sidebar {
        position: fixed;
        transform: translateX(-100%);
        height: 100%;
    }

    .kang-sidebar.kang-expanded {
        transform: translateX(0);
    }

    .kang-brand {
        position: static;
        font-size: var(--kang-font-size-16);
    }

    .kang-menu-toggle {
        display: block;
        background: none;
        border: none;
        cursor: pointer;
        padding: 0;
        font-size: 24px;
    }

    .kang-menu-toggle svg {
        stroke: var(--kang-color-dark);
        width: 24px;
        height: 24px;
    }

    .kang-menu-toggle:hover svg {
        stroke: var(--kang-active-color);
    }

    .kang-main-content {
        margin-left: 0;
        padding-bottom: 5rem;
    }
}

/* Desktop Styles */
@media (min-width: 769px) {
    .kang-menu-toggle {
        display: none;
    }

    .kang-sidebar {
        position: fixed;
        transform: none;
        width: 60px;
        height: 100%;
    }

    .kang-sidebar.kang-expanded {
        width: 250px;
    }

    .kang-main-content {
        margin-left: 0px;
    }

    .kang-sidebar.kang-expanded ~ .kang-main-content {
        margin-left: 250px;
    }

    .kang-menu {
        display: flex;
    }
}

.kang-menu-item span {
    font-size: var(--kang-font-size-18);
}

.kang-titulo-pagina {
    font-size: var(--kang-font-size-24);
    display: flex;
    align-items: center;
    color: var(--kang-gray);
    gap: var(--kang-gap-16);
}

.kang-logo-pequena {
    display: flex;
    justify-content: center;
    padding: 20px;
}

.kang-botao-expandir {
    display: flex;
    justify-content: center;
    transform: rotate(180deg);
    margin-bottom: 5rem;
}

.kang-sidebar.kang-expanded .kang-botao-expandir {
    transform: rotate(360deg);
}

.kang-menu-lateral-icone {
    display: grid;
    gap: 40px;
}

.kang-tour {
    display: flex;
    background: var(--kang-gradient-orange);
    padding: 18px 24px 18px 24px;
    border-radius: var(--kang-border-radius-4);
    justify-content: space-between;
    font-size: var(--kang-font-size-24);
    align-items: center;
    color: var(--kang-Font-black);
}

.kang-position-fixed {
    position: fixed !important;
}

.kang-position-absolute {
    position: absolute !important;
}

.kang-position-relative {
    position: relative !important;
}

.kang-d-inline {
    display: inline !important;
}

.kang-d-inline-block {
    display: inline-block !important;
}

.kang-d-block {
    display: block !important;
}

.kang-d-flex {
    display: flex !important;
}

.kang-d-inline-flex {
    display: inline-flex !important;
}

.kang-d-grid {
    display: grid !important;
}

.kang-d-inline-grid {
    display: inline-grid !important;
}

.kang-d-none {
    display: none !important;
}

.kang-justify-content-center {
    justify-content: center !important;
}

.kang-justify-content-start {
    justify-content: start !important;
}

.kang-justify-space-between {
    justify-content: space-between !important;
}

.kang-btn {
    font-family: var(--kang-Poppins-Font);
}

.kang-btn-outline {
    color: var(--kang-gray) !important;
    border: 1px solid var(--kang-gray) !important;
    font-weight: 600 !important;
    background: none !important;
    border-radius: var(--kang-border-radius-8) !important;
    cursor: pointer;
    font-size: var(--kang-font-size-16) !important;
    padding: var(--kang-padding-outline) !important;
    text-decoration: none;

    /* display: unset !important; */
}

.kang-btn-outline:hover {
    background: #ff903d !important;
    border: 1px solid #ff903d !important;
    color: var(--kang-color-white) !important;
}

.kang-btn-primary {
    color: var(--kang-White) !important;
    border: none !important;
    font-weight: 500 !important;
    background: var(--kang-Base-On) !important;
    padding: var(--kang-padding-button) !important;
    border-radius: var(--kang-border-radius-8) !important;
    cursor: pointer;
    font-size: var(--kang-font-size-16) !important;
}

.kang-btn-white {
    color: #ff8025;
    background: #fff;
    border: none;
    font-weight: 600 !important;
    border-radius: var(--kang-border-radius-8) !important;
    cursor: pointer;
    font-size: var(--kang-font-size-16) !important;
    padding: var(--kang-padding-outline) !important;
    text-decoration: none;
}

.kang-tour .kang-d-flex {
    gap: var(--kang-gap-16);
}

.kang-card {
    background: var(--kang-Card);
    border-radius: var(--kang-border-radius-4);
    margin-bottom: 1rem;
}

.kang-card-body {
    padding: 24px;
}

.kang-nav {
    display: flex;
    flex-wrap: wrap;
    padding-left: 0;
    margin: 0;
    list-style: none;
    gap: 24px;
}

.kang-nav .kang-nav-item,
.kang-nav .kang-nav-link {
    outline: none !important;
    text-decoration: none;
    color: var(--kang-color-dark);
}

.kang-expanded a {
    gap: var(--kang-gap-16);
    display: flex;
    justify-content: flex-start;
}

.kang-expanded .kang-menu-lateral-icone {
    padding: 24px;
}

.kang-expanded .kang-botao-expandir {
    display: flex;
    justify-content: flex-start;
    padding: 0 0 0 24px;
}

.kang-expanded .kang-logo-minify {
    display: none !important;
}

.kang-expanded .kang-logo-expandida {
    display: block !important;
}

.kang-row {
    display: flex;
    flex-wrap: wrap;
    margin-left: -15px;
    margin-right: -15px;
}

.kang-gy-0 {
    row-gap: 0;
}

.kang-gy-1 {
    row-gap: var(--kang-gap-16);

    /* 16px base gutter */
}

.kang-gy-2 {
    row-gap: calc(var(--kang-gap-16) * 2);

    /* 32px */
}

.kang-gy-3 {
    row-gap: calc(var(--kang-gap-16) * 3);

    /* 48px */
}

.kang-gy-4 {
    row-gap: calc(var(--kang-gap-16) * 4);

    /* 64px */
}

.kang-gy-5 {
    row-gap: calc(var(--kang-gap-16) * 5);

    /* 80px */
}

/* Horizontal gutter classes (kang-gx-X) */
.kang-gx-0 {
    column-gap: 0;
}

.kang-gx-1 {
    column-gap: var(--kang-gap-16);

    /* 16px base gutter */
}

.kang-gx-2 {
    column-gap: calc(var(--kang-gap-16) * 2);

    /* 32px */
}

.kang-gx-3 {
    column-gap: calc(var(--kang-gap-16) * 3);

    /* 48px */
}

.kang-gx-4 {
    column-gap: calc(var(--kang-gap-16) * 4);

    /* 64px */
}

.kang-gx-5 {
    column-gap: calc(var(--kang-gap-16) * 5);

    /* 80px */
}

/* Base column classes (kang-col-1 to kang-col-12) */
.kang-col-1 {
    flex: 0 0 auto;
    width: 8.333333%;
}

.kang-col-2 {
    flex: 0 0 auto;
    width: 16.666667%;
}

.kang-col-3 {
    flex: 0 0 auto;
    width: 25%;
}

.kang-col-4 {
    flex: 0 0 auto;
    width: 33.333333%;
}

.kang-col-5 {
    flex: 0 0 auto;
    width: 41.666667%;
}

.kang-col-6 {
    flex: 0 0 auto;
    width: 50%;
}

.kang-col-7 {
    flex: 0 0 auto;
    width: 58.333333%;
}

.kang-col-8 {
    flex: 0 0 auto;
    width: 66.666667%;
}

.kang-col-9 {
    flex: 0 0 auto;
    width: 75%;
}

.kang-col-10 {
    flex: 0 0 auto;
    width: 83.333333%;
}

.kang-col-11 {
    flex: 0 0 auto;
    width: 91.666667%;
}

.kang-col-12 {
    flex: 0 0 auto;
    width: 100%;
}

/* Ensure columns stack on small screens (below sm breakpoint) */
@media (max-width: 575.98px) {
    .kang-col-1,
    .kang-col-2,
    .kang-col-3,
    .kang-col-4,
    .kang-col-5,
    .kang-col-6,
    .kang-col-7,
    .kang-col-8,
    .kang-col-9,
    .kang-col-10,
    .kang-col-11,
    .kang-col-12 {
        /* flex: 0 0 100%; */
        max-width: 100%;
    }
}

/* Column padding for gutters */
.kang-col-1,
.kang-col-2,
.kang-col-3,
.kang-col-4,
.kang-col-5,
.kang-col-6,
.kang-col-7,
.kang-col-8,
.kang-col-9,
.kang-col-10,
.kang-col-11,
.kang-col-12,
.kang-col-sm-1,
.kang-col-sm-2,
.kang-col-sm-3,
.kang-col-sm-4,
.kang-col-sm-5,
.kang-col-sm-6,
.kang-col-sm-7,
.kang-col-sm-8,
.kang-col-sm-9,
.kang-col-sm-10,
.kang-col-sm-11,
.kang-col-sm-12,
.kang-col-md-1,
.kang-col-md-2,
.kang-col-md-3,
.kang-col-md-4,
.kang-col-md-5,
.kang-col-md-6,
.kang-col-md-7,
.kang-col-md-8,
.kang-col-md-9,
.kang-col-md-10,
.kang-col-md-11,
.kang-col-md-12,
.kang-col-lg-1,
.kang-col-lg-2,
.kang-col-lg-3,
.kang-col-lg-4,
.kang-col-lg-5,
.kang-col-lg-6,
.kang-col-lg-7,
.kang-col-lg-8,
.kang-col-lg-9,
.kang-col-lg-10,
.kang-col-lg-11,
.kang-col-lg-12,
.kang-col-xl-1,
.kang-col-xl-2,
.kang-col-xl-3,
.kang-col-xl-4,
.kang-col-xl-5,
.kang-col-xl-6,
.kang-col-xl-7,
.kang-col-xl-8,
.kang-col-xl-9,
.kang-col-xl-10,
.kang-col-xl-11,
.kang-col-xl-12,
.kang-col-xxl-1,
.kang-col-xxl-2,
.kang-col-xxl-3,
.kang-col-xxl-4,
.kang-col-xxl-5,
.kang-col-xxl-6,
.kang-col-xxl-7,
.kang-col-xxl-8,
.kang-col-xxl-9,
.kang-col-xxl-10,
.kang-col-xxl-11,
.kang-col-xxl-12 {
    position: relative;
    padding-left: 15px;
    padding-right: 15px;
    box-sizing: border-box;
}

/* Small breakpoint (≥ 576px) */
@media (min-width: 576px) {
    .kang-col-sm-1 {
        flex: 0 0 auto;
        width: 8.333333%;
    }

    .kang-col-sm-2 {
        flex: 0 0 auto;
        width: 16.666667%;
    }

    .kang-col-sm-3 {
        flex: 0 0 auto;
        width: 25%;
    }

    .kang-col-sm-4 {
        flex: 0 0 auto;
        width: 33.333333%;
    }

    .kang-col-sm-5 {
        flex: 0 0 auto;
        width: 41.666667%;
    }

    .kang-col-sm-6 {
        flex: 0 0 auto;
        width: 50%;
    }

    .kang-col-sm-7 {
        flex: 0 0 auto;
        width: 58.333333%;
    }

    .kang-col-sm-8 {
        flex: 0 0 auto;
        width: 66.666667%;
    }

    .kang-col-sm-9 {
        flex: 0 0 auto;
        width: 75%;
    }

    .kang-col-sm-10 {
        flex: 0 0 auto;
        width: 83.333333%;
    }

    .kang-col-sm-11 {
        flex: 0 0 auto;
        width: 91.666667%;
    }

    .kang-col-sm-12 {
        flex: 0 0 auto;
        width: 100%;
    }
}

/* Medium breakpoint (≥ 768px) */
@media (min-width: 768px) {
    .kang-col-md-1 {
        flex: 0 0 auto;
        width: 8.333333%;
    }

    .kang-col-md-2 {
        flex: 0 0 auto;
        width: 16.666667%;
    }

    .kang-col-md-3 {
        flex: 0 0 auto;
        width: 25%;
    }

    .kang-col-md-4 {
        flex: 0 0 auto;
        width: 33.333333%;
    }

    .kang-col-md-5 {
        flex: 0 0 auto;
        width: 41.666667%;
    }

    .kang-col-md-6 {
        flex: 0 0 auto;
        width: 50%;
    }

    .kang-col-md-7 {
        flex: 0 0 auto;
        width: 58.333333%;
    }

    .kang-col-md-8 {
        flex: 0 0 auto;
        width: 66.666667%;
    }

    .kang-col-md-9 {
        flex: 0 0 auto;
        width: 75%;
    }

    .kang-col-md-10 {
        flex: 0 0 auto;
        width: 83.333333%;
    }

    .kang-col-md-11 {
        flex: 0 0 auto;
        width: 91.666667%;
    }

    .kang-col-md-12 {
        flex: 0 0 auto;
        width: 100%;
    }
}

/* Large breakpoint (≥ 992px) */
@media (min-width: 992px) {
    .kang-col-lg-1 {
        flex: 0 0 auto;
        width: 8.333333%;
    }

    .kang-col-lg-2 {
        flex: 0 0 auto;
        width: 16.666667%;
    }

    .kang-col-lg-3 {
        flex: 0 0 auto;
        width: 25%;
    }

    .kang-col-lg-4 {
        flex: 0 0 auto;
        width: 33.333333%;
    }

    .kang-col-lg-5 {
        flex: 0 0 auto;
        width: 41.666667%;
    }

    .kang-col-lg-6 {
        flex: 0 0 auto;
        width: 50%;
    }

    .kang-col-lg-7 {
        flex: 0 0 auto;
        width: 58.333333%;
    }

    .kang-col-lg-8 {
        flex: 0 0 auto;
        width: 66.666667%;
    }

    .kang-col-lg-9 {
        flex: 0 0 auto;
        width: 75%;
    }

    .kang-col-lg-10 {
        flex: 0 0 auto;
        width: 83.333333%;
    }

    .kang-col-lg-11 {
        flex: 0 0 auto;
        width: 91.666667%;
    }

    .kang-col-lg-12 {
        flex: 0 0 auto;
        width: 100%;
    }
}

/* Extra Large breakpoint (≥ 1200px) */
@media (min-width: 1200px) {
    .kang-col-xl-1 {
        flex: 0 0 auto;
        width: 8.333333%;
    }

    .kang-col-xl-2 {
        flex: 0 0 auto;
        width: 16.666667%;
    }

    .kang-col-xl-3 {
        flex: 0 0 auto;
        width: 25%;
    }

    .kang-col-xl-4 {
        flex: 0 0 auto;
        width: 33.333333%;
    }

    .kang-col-xl-5 {
        flex: 0 0 auto;
        width: 41.666667%;
    }

    .kang-col-xl-6 {
        flex: 0 0 auto;
        width: 50%;
    }

    .kang-col-xl-7 {
        flex: 0 0 auto;
        width: 58.333333%;
    }

    .kang-col-xl-8 {
        flex: 0 0 auto;
        width: 66.666667%;
    }

    .kang-col-xl-9 {
        flex: 0 0 auto;
        width: 75%;
    }

    .kang-col-xl-10 {
        flex: 0 0 auto;
        width: 83.333333%;
    }

    .kang-col-xl-11 {
        flex: 0 0 auto;
        width: 91.666667%;
    }

    .kang-col-xl-12 {
        flex: 0 0 auto;
        width: 100%;
    }
}

/* Extra Extra Large breakpoint (≥ 1400px) */
@media (min-width: 1400px) {
    .kang-col-xxl-1 {
        flex: 0 0 auto;
        width: 8.333333%;
    }

    .kang-col-xxl-2 {
        flex: 0 0 auto;
        width: 16.666667%;
    }

    .kang-col-xxl-3 {
        flex: 0 0 auto;
        width: 25%;
    }

    .kang-col-xxl-4 {
        flex: 0 0 auto;
        width: 33.333333%;
    }

    .kang-col-xxl-5 {
        flex: 0 0 auto;
        width: 41.666667%;
    }

    .kang-col-xxl-6 {
        flex: 0 0 auto;
        width: 50%;
    }

    .kang-col-xxl-7 {
        flex: 0 0 auto;
        width: 58.333333%;
    }

    .kang-col-xxl-8 {
        flex: 0 0 auto;
        width: 66.666667%;
    }

    .kang-col-xxl-9 {
        flex: 0 0 auto;
        width: 75%;
    }

    .kang-col-xxl-10 {
        flex: 0 0 auto;
        width: 83.333333%;
    }

    .kang-col-xxl-11 {
        flex: 0 0 auto;
        width: 91.666667%;
    }

    .kang-col-xxl-12 {
        flex: 0 0 auto;
        width: 100%;
    }
}

.kang-flex-grow-1 {
    flex-grow: 1 !important;
}

.kang-col-auto {
    flex: 0 0 auto;
    width: auto;
}

.kang-align-items-center {
    align-items: center !important;
}

.kang-align-items-flex-start {
    align-items: flex-start !important;
}

#kang-customAffiliates {
    padding: 2rem;
}

#kang-customAffiliates .kang-number {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    white-space: nowrap;
    gap: 5px;
    position: relative;
}

#kang-customAffiliates .kang-number strong {
    font-size: var(--kang-font-size-xl);
    line-height: 1em;
    font-weight: 700;
    color: #272727;
}

#kang-customAffiliates .kang-number span {
    font-size: var(--kang-font-size-md);
    line-height: 1em;
    font-weight: 700;
    color: #fd7e14;
    margin-top: 0.5rem;
}

#kang-customAffiliates .kang-button {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    padding-left: 60px;
}

.kang-text-right {
    text-align: right !important;
}

.kang-btn-orange-afiliados {
    color: #fff !important;
    background-color: var(--kang-primary);
    background-image: linear-gradient(90deg, #FFAD30 0%, #FF8025 100%) !important;
    border: none !important;
    border-radius: 4px;
    box-shadow: 0px 9px 15px -3px rgb(0 0 0 / 46%) !important;
    margin: 4px 20px;
    margin-top: 0.5rem;
    padding: 10px 10px 10px 10px;
    font-size: 1.1rem;
    border-radius: 50rem !important;
    font-weight: 500 !important;
    padding-left: 1.5rem !important;
    padding-right: 1.5rem !important;
}

/* menu */
.kang-dropdown {
    position: relative;
    display: inline-block;
}

.kang-dropdown-content {
    display: none;
    position: absolute;
    background-color: var(--kang-sidebar-bg);
    min-width: 200px;
    box-shadow: var(--kang-shadow);
    z-index: 1000;
    border-radius: var(--kang-border-radius-4);
    padding: var(--kang-padding-8) 0;
    right: 0;
    top: 100%;
    margin-top: 4px;
    font-family: var(--kang-Poppins-Font);
}

.kang-dropdown-content a {
    color: var(--kang-color-dark);
    padding: 5px 30px;
    text-decoration: none;
    display: block;
    font-size: var(--kang-font-size-16);
    transition: background-color 0.2s ease;
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .kang-dropdown-content {
        left: 0;
        position: absolute;
        bottom: 100%;
        top: auto;
        right: 0;
        width: 100% !important;
        box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    }

    .kang-dropdown-content a {
        font-size: 13px;
    }

    .kang-menu-item {
        position: unset;
    }
}

@media (max-width: 480px) {
    .kang-dropdown-content a {
        font-size: 13px;
    }
}

/* Ensure dropdown works with hover and click */
.kang-dropdown:hover .kang-dropdown-content,
.kang-dropdown:focus-within .kang-dropdown-content {
    display: block;
}

.kang-menu-item.kang-dropdown:hover svg path,
.kang-menu-item.kang-dropdown:hover svg circle,
.kang-menu-item.kang-dropdown:focus svg path,
.kang-menu-item.kang-dropdown:focus svg circle {
    stroke: var(--kang-active-color);
}

/* start menu */
.kang-mensagem-notificacao:hover {
    color: var(--kang-active-color) !important;
}

/* end menu */
/* start  pin */
.kang-bg-ping {
    background: var(--kang-color-gray-light);
    border-radius: var(--kang-border-radius-8);
    padding: var(--kang-padding-8);
}

.kang-pinSuporteDIV {
    background-image: url(../../assets/images/pin.png);
    width: 70%;
    float: left;
    background-repeat: no-repeat;
    height: 28px;
    border-radius: 5px;
    background-position-y: center;
}

.kang-clear_kangahoo {
    clear: both;
    width: 100%;
}

/* end  pin */
.kang-expanded .kang-botao-modo-noturno {
    left: 20px;
}

.kang-botao-modo-noturno {
    position: absolute !important;
    bottom: 20px;
    justify-self: center;
    border: 1px solid var(--kang-gray);
    border-radius: var(--kang-border-radius-8);
    padding: 3px 8px 3px 8px;
}

.kang-semibold {
    font-weight: var(--kang-font-weight-600);
}

.kang-font-14 {
    font-size: var(--kang-font-size-14);
}

.kang-font-16 {
    font-size: var(--kang-font-size-16);
}

.kang-font-18 {
    font-size: var(--kang-font-size-18);
}

.kang-font-24 {
    font-size: 24px !important;
}

.kang-14-gray {
    color: var(--kang-gray) !important;
    font-size: var(--kang-font-size-14);
}

.kang-ver-todos {
    gap: var(--kang-gap-8);
    display: flex;
    justify-content: flex-end;
    align-items: center;
}

.kang-dropdown-wide {
    width: 450px;
}

.kang-padding-0 {
    padding: 0 !important;
}

.kang-padding-24 {
    padding: var(--kang-padding-24) !important;
}

.kang-border-radius-4 {
    border-radius: var(--kang-border-radius-4) !important;
}

.kang-support-card-body {
    background-color: var(--kang-support-orange1);
    color: var(--kang-color-white);
}

.kang-padding-16 {
    padding: var(--kang-padding-16) !important;
}

.kang-grid-gap-16 {
    display: grid;
    gap: var(--kang-gap-16);
}

.kang-support-title {
    font-size: var(--kang-font-size-16) !important;
    font-weight: var(--kang-font-weight-600);
    color: #000000;
}

.kang-contatos-suporte-item {
    color: var(--kang-Font-black);
    gap: var(--kang-gap-8);
    display: flex;
    font-size: var(--kang-font-size-16);
}

#kang_chavepin {
    font-size: 1rem;
    font-weight: var(--kang-font-weight-600);
    text-align: left;
    float: left;
    padding: 2px 5px 0px;
    width: 100%;
    background-color: var(--kang-color-gray-light);
    color: var(--kang-primary);
    list-style: none !important;
    display: none;
}

.kang-btn-eye {
    float: right;
    border: none;
    background-color: transparent;
    cursor: pointer;
    padding: 1px 0 0 0;
}

.kang-gap-80 {
    gap: var(--kang-gap-80);
}

.kang-gap-32 {
    gap: var(--kang-gap-32);
}

.kang-gap-24 {
    gap: var(--kang-gap-24);
}

.kang-gap-16 {
    gap: var(--kang-gap-16);
}

.kang-gap-8 {
    gap: var(--kang-gap-8);
}

.kang-padding-top-16 {
    padding-top: var(--kang-padding-top-16) !important;
}

.kang-padding-y-16 {
    padding-top: var(--kang-padding-top-16) !important;
    padding-bottom: var(--kang-padding-bottom-16) !important;
}

.kang-no-wrap {
    flex-wrap: var(--kang-no-wrap);
}

.kang-flex-column {
    display: flex;
    flex-direction: column;
}

.kang-bg-light-gray {
    background: var(--kang-light-bg);
}

.kang-text-label {
    color: var(--kang-color-dark);
    font-weight: var(--kang-font-weight-600);
    font-size: var(--kang-font-size-16);
}

.kang-number-large {
    font-size: var(--kang-font-size-large);
    font-weight: var(--kang-font-weight-600);
    color: var(--kang-color-orange-dark);
}

.kang-support-help {
    display: flex;
    align-items: center;
    background: linear-gradient(90deg, #FFA04C 0%, #CA5602 100%);
}

.kang-flex-center {
    display: flex;
    align-items: center;
}

.kang-margin-top-16 {
    margin-top: var(--kang-margin-top-16);
}

.kang-text-white-16 {
    font-size: var(--kang-font-size-16);
    color: var(--kang-color-white);
}

.kang-text-white {
    color: var(--kang-color-white) !important;
}

.kang-nowrap {
    white-space: var(--kang-nowrap);
}

.kang-text-info {
    color: var(--kang-color-dark);
    font-size: var(--kang-font-size-16);
}

.kang-contact-bar {
    display: flex;
    align-items: center;
    background: linear-gradient(90deg, #FFA04C 0%, #CA5602 100%);
}

.kang-contact-item {
    color: var(--kang-color-white);
    gap: var(--kang-gap-8);
    display: flex;
    font-size: var(--kang-font-size-16);
}

.kang-padding-finance {
    padding: 5px 0 10px;
}

.kang-relative {
    position: relative;
}

.kang-badge-fatura {
    position: absolute;
    left: 13px;
    top: 40%;
}

.kang-flex-gap-8 {
    display: flex;
    gap: var(--kang-gap-8);
}

.kang-margin-bottom-24 {
    margin-bottom: var(--kang-margin-bottom-24);
}

.kang-margin-bottom-1rem {
    margin-bottom: 1rem;
}

.kang-flex-gap-16-center {
    gap: var(--kang-gap-16);
    display: flex;
    align-items: center;
}

.kang-w-100 {
    width: 100% !important;
}

.kang-h-100 {
    height: 100% !important;
}

.kang-text-gray-16 {
    font-size: var(--kang-font-size-16) !important;
    color: var(--kang-gray);
}

.kang-text-white-black {
    color: var(--kang-text-color);
}

.kang-text-black-white {
    color: var(--kang-font);
}

.kang-text-gray {
    color: var(--kang-gray) !important;
}

.kang-text-orange-dark {
    color: var(--kang-color-orange-dark) !important;
}

.kang-mt-05rem {
    margin-top: 0.5rem !important;
}

.kang-mb-4 {
    margin-bottom: 1rem;
}

.kang-mb-05rem {
    margin-bottom: 0.5rem;
}

.kang-mb-0 {
    margin-bottom: 0 !important;
}

.kang-mt-0 {
    margin-top: 0 !important;
}

.kang-logo-expandida {
    display: none;
}

.kang-bg-white {
    background: rgba(255, 255, 255, 1);
    border-radius: 4px;
    padding: 16px;
}

.kang-bg-gray-1 {
    background: rgba(223, 223, 222, 1) !important;
}

.kang-form-search {
    border: none;
    font-family: var(--kang-Poppins-Font);
    background: var(--kang-bg-form);
    color: var(--kang-text-color);
}

.kang-form-search:focus {
    border: none;
    outline: 0;
}

.kang-badge-orange-label {
    background: #ffda95;
    border-radius: var(--kang-border-radius-8);
    color: #042C41;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 5px 0 5px 0;
    width: 96px;
    font-size: var(--kang-font-size-14);
}

.kang-badge-orange-label.status-open {
    background: #FFC076;
}

.kang-badge-orange-label.status-closed {
    background: #F4F4F2;
}

.kang-badge-orange-label.status-active {
    background: #F4F4F2;
}

.kang-badge-orange-label.status-paid {
    background: #F4F4F2;
}

.kang-badge-orange2-label {
    background: var(--kang-support-orange);
    color: var(--kang-Font-black);
    border-radius: var(--kang-border-radius-8);
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 5px 0 5px 0;
    width: 96px;
    font-size: var(--kang-font-size-14);
}

.kang-badge-gray-label {
    background: var(--kang-color-gray-light);
    border-radius: var(--kang-border-radius-8);
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 5px 0 5px 0;
    width: 96px;
    font-size: var(--kang-font-size-14);
}

.kang-card-aviso-fatura {
    background: var(--kang-color-orange-label);
    padding: 18px 24px 18px 24px;
    justify-content: space-between;
}

.kang-card-novo-ticket {
    background: var(--kang-card-novo-ticket);
    padding: 18px 24px 18px 24px;
}

.kang-div-form-label-1 {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

/* login */
.kang-login-container {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100vh;
}

.kang-login-card {
    width: 608px;
}

@media (max-width: 660px) {
    .kang-login-card {
        width: 100%;
    }
}

.kang-container-1 {
    display: flex;
    flex-direction: column;
    align-items: center;
    background-color: var(--kang-bg-color);
    width: 100%;
}

.kang-form-control-1 {
    border: 1px solid rgba(223, 223, 222, 1);
    background: var(--kang-bg-form);
    border-radius: var(--kang-border-radius-8);
    padding: 8px 16px 8px 16px;
    font-family: var(--kang-Poppins-Font);
    font-size: var(--kang-font-size-16);
    color: var(--kang-font-color-form);
    outline: none
}

.kang-div-registration {
    width: 100%;
    max-width: 1338px;
}

/*  */
/* Collapse container styling */
.kang-collapse {
    display: none;
    width: 100%;
}

/* Collapse wrapper with clickable header */
.kang-collapse-header {
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: var(--kang-gap-8);
}

/* Rotate arrow on active/expanded state */
.kang-collapse-header.active .kang-collapse-arrow {
    transform: rotate(180deg);
    transition: transform 0.3s ease;
}

.kang-collapse-arrow {
    transition: transform 0.3s ease;
}

/* Show collapse content when active */
.kang-collapse-header.active + .kang-collapse {
    display: block;
}

/* Specific styling for the fatura page */
.kang-div-registration .kang-card-body .kang-collapse-header {
    font-size: var(--kang-font-size-16);
}

.kang-div-registration .kang-collapse {
    padding-top: var(--kang-padding-16);
}

.kang-container-geral {
    padding-left: 4rem;
    transition: padding-left 0.3s ease;
}

.kang-sidebar.kang-expanded ~ .kang-container-geral {
    padding-left: 16rem;
}

.kang-form-check {
    display: flex;
    gap: 8px;
}

/* input check personalizado start */
.kang-form-check-input {
    width: 1.5em;
    min-width: 1.25rem;
    height: 1.5em;
    vertical-align: top;
    background: var(--kang-bg-color);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    border: 2px solid rgba(159, 159, 159, 1);
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    -webkit-print-color-adjust: exact;
    color-adjust: exact;
}

.kang-form-check-input[type=checkbox] {
    border-radius: .25em;
}

.kang-form-check-input:checked[type=checkbox] {
    background-image: var(--kang-check-icon-color);
    background-size: initial;
}

/* input check personalizado end */
/* switch input start */
.kang-input_switch {
    width: 80px;
    height: 32px;
    position: relative;
    cursor: pointer;
}

.kang-input_switch input[type="checkbox"] {
    width: 67px;
    height: 28px;
    cursor: pointer;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    padding: 5px;
    background: rgba(244, 244, 242, 1);
    border: 2px solid rgba(159, 159, 159, 1);
    border-radius: 20px;
    position: relative;
    outline: 0;
    -webkit-transition: all .2s;
    transition: all .2s;
}

.kang-input_switch input[type="checkbox"]:after {
    position: absolute;
    content: "";
    width: 14px;
    height: 14px;
    border: 2px solid rgba(4, 44, 65, 1);
    z-index: 2;
    border-radius: 50%;
    -webkit-transition: all .35s;
    transition: all .35s;
}

.kang-input_switch img {
    position: absolute;
    align-self: center;
    -webkit-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
    -webkit-transition: all .35s;
    transition: all .35s;
    z-index: 1;
}

.kang-input_switch .kang-is_checked {
    width: 17px;
    left: 18%;
    -webkit-transform: translateX(190%) translateY(-30%) scale(0);
    transform: translateX(190%) translateY(-30%) scale(0);
}

.kang-input_switch .kang-is_unchecked {
    width: 17px;
    right: 22%;
    -webkit-transform: translateX(0) translateY(-30%) scale(1);
    transform: translateX(0) translateY(-30%) scale(1);
}

.kang-input_switch input[type="checkbox"]:checked {
    background: rgba(244, 244, 242, 1);
    border: 2px solid var(--Base-On, rgba(218, 99, 0, 1));
}

.kang-input_switch input[type="checkbox"]:checked:after {
    left: calc(100% - 20px);
}

.kang-input_switch input[type="checkbox"]:checked + .kang-is_checked {
    -webkit-transform: translateX(0) translateY(-30%) scale(1);
    transform: translateX(0) translateY(-30%) scale(1);
}

.kang-input_switch input[type="checkbox"]:checked ~ .kang-is_unchecked {
    -webkit-transform: translateX(-190%) translateY(-30%) scale(0);
    transform: translateX(-190%) translateY(-30%) scale(0);
}

/* switch input end */
/* radios input start */
.kang-input-radio {
    display: none;
}

.kang-custom-radio {
    border: 1px solid #fff;
    width: 28px;
    height: 28px;
    display: grid;
    place-content: center;
    border-radius: 50%;
}

.kang-custom-radio {
    transition: 0.5s ease;
    color: #fff;
    border: 2px solid rgba(159, 159, 159, 1);
}

.kang-custom-radio span {
    content: '';
    width: 23px;
    height: 23px;
    background: var(--kang-bg-color);
    border-radius: 50%;
}

input[type='radio']:checked + .kang-custom-radio {
    border: 2px solid rgba(159, 159, 159, 1);
    background: var(--kang-bg-color);
}

input[type='radio']:checked + .kang-custom-radio span {
    border: var(--kang-spanborder-radio-span);
    width: 14px;
    height: 14px;
}

/* radios input end */
.kang-autenticao-fatores {
    background: var(--kang-bg-1) !important;
    border-radius: 12px;
    padding: 18px 24px 18px 24px;
}

.kang-inputSenha {
    background-image: url("/templates/kangaroohost/assets/icons/info2.svg");
    background-repeat: no-repeat;
    background-position: right;
    background-origin: content-box;
}

/* navtab start */
.kang-nav-link {
    cursor: pointer !important;
}

.kang-tab-content {
    margin-top: var(--kang-padding-16);
}

.kang-tab-pane {
    display: none;
}

.kang-tab-pane-active {
    display: block;
}

.kang-nav-link-active {
    box-shadow: 0 -1.4px 0 var(--kang-primary) inset;
    padding-bottom: 8px;
    color: var(--kang-primary) !important;
}

/* navtab end */
.kang-filter-menu {
    display: flex
;
    flex-wrap: wrap;
    padding-left: 0;
    margin: 0;
    list-style: none;
    gap: 24px;
}

.kang-filter-item-active {
    color: var(--kang-primary);
}

.kang-cursor-pointer {
    cursor: pointer !important;
}

/* filter start */
.kang-service-item[data-status] {
    display: none;

    /* Hide all items by default */
}

.kang-service-item[data-status].kang-active {
    display: block;

    /* Show only active items */
}

.kang-ver-todos a {
    text-decoration: none;
    color: var(--kang-color-dark);
    margin: 0 var(--kang-gap-8);
}

.kang-ver-todos a.kang-active-page {
    color: var(--kang-primary);
    font-weight: var(--kang-font-weight-600);
}

/* filter end */
.kang-service-item[data-status] {
    display: none;

    /* Hide all items by default */
}

.kang-service-item[data-status].kang-active {
    display: flex;

    /* Show only active items */
}

.kang-ver-todos a {
    text-decoration: none;
    color: var(--kang-color-dark);
    margin: 0 var(--kang-gap-8);
}

.kang-ver-todos a.kang-active-page {
    color: var(--kang-primary);
    font-weight: var(--kang-font-weight-600);
}

/* conversa ticket */
.balao-ticket-cliente {
    background: var(--kang-bg-1);
    padding: 18px 24px 18px 24px;
    max-width: 90%;
    margin-left: auto;
    border-radius: var(--kang-border-radius-4) !important;
    justify-content: space-between !important;
    align-items: center !important;
    margin-bottom: 1.5rem;
}

.balao-ticket-atendente {
    background: var(--kang-color-orange-label);
    padding: 18px 24px 18px 24px;
    max-width: 90%;
    margin-right: auto;
    border-radius: var(--kang-border-radius-4) !important;
    justify-content: space-between !important;
    align-items: center !important;
    margin-bottom: 1.5rem;
}

/* conversa ticket end */
.kang-card-lista-dominios {
    display: flex;
    background: var(--kang-gradient-orange);
    padding: 24px 24px 24px 24px;
    border-radius: var(--kang-border-radius-4);
    justify-content: space-between;
    font-size: var(--kang-font-size-24);
    align-items: center;
    color: var(--kang-Font-black);
    margin-bottom: 1.5rem;
    gap: 18px;
}

.kang-card-lista-afiliados {
    display: flex;
    padding: 24px 24px 24px 24px;
    border-radius: var(--kang-border-radius-4);
    justify-content: space-between;
    font-size: var(--kang-font-size-24);
    align-items: center;
    margin-bottom: 1.5rem;
    gap: 18px;
    background: var(--kang-bg-2);
    color: #9f9f9f;
}

.kang-form-control-card-dominio {
    font-size: 20px;
    padding: 8px 250px 8px 30px;
    background: var(--kang-color-white);
}

.kang-form-control-card-afiliado {
    font-size: 20px;
    color: #9f9f9f;
    border: none;
    padding: 8px 200px 8px 30px;
}

/* mobile start */
@media (min-width: 576px) {
    .kang-d-sm-none {
        display: none !important;
    }

    .kang-d-sm-inline {
        display: inline !important;
    }

    .kang-d-sm-inline-block {
        display: inline-block !important;
    }

    .kang-d-sm-block {
        display: block !important;
    }

    .kang-d-sm-flex {
        display: flex !important;
    }

    .kang-d-sm-inline-flex {
        display: inline-flex !important;
    }

    .kang-d-sm-grid {
        display: grid !important;
    }

    .kang-d-sm-inline-grid {
        display: inline-grid !important;
    }
}

@media (min-width: 768px) {
    .kang-d-md-none {
        display: none !important;
    }

    .kang-d-md-inline {
        display: inline !important;
    }

    .kang-d-md-inline-block {
        display: inline-block !important;
    }

    .kang-d-md-block {
        display: block !important;
    }

    .kang-d-md-flex {
        display: flex !important;
    }

    .kang-d-md-inline-flex {
        display: inline-flex !important;
    }

    .kang-d-md-grid {
        display: grid !important;
    }

    .kang-d-md-inline-grid {
        display: inline-grid !important;
    }
}

@media (min-width: 992px) {
    .kang-d-lg-none {
        display: none !important;
    }

    .kang-d-lg-inline {
        display: inline !important;
    }

    .kang-d-lg-inline-block {
        display: inline-block !important;
    }

    .kang-d-lg-block {
        display: block !important;
    }

    .kang-d-lg-flex {
        display: flex !important;
    }

    .kang-d-lg-inline-flex {
        display: inline-flex !important;
    }

    .kang-d-lg-grid {
        display: grid !important;
    }

    .kang-d-lg-inline-grid {
        display: inline-grid !important;
    }
}

@media (min-width: 1200px) {
    .kang-d-xl-none {
        display: none !important;
    }

    .kang-d-xl-inline {
        display: inline !important;
    }

    .kang-d-xl-inline-block {
        display: inline-block !important;
    }

    .kang-d-xl-block {
        display: block !important;
    }

    .kang-d-xl-flex {
        display: flex !important;
    }

    .kang-d-xl-inline-flex {
        display: inline-flex !important;
    }

    .kang-d-xl-grid {
        display: grid !important;
    }

    .kang-d-xl-inline-grid {
        display: inline-grid !important;
    }
}

@media (min-width: 1400px) {
    .kang-d-xxl-none {
        display: none !important;
    }

    .kang-d-xxl-inline {
        display: inline !important;
    }

    .kang-d-xxl-inline-block {
        display: inline-block !important;
    }

    .kang-d-xxl-block {
        display: block !important;
    }

    .kang-d-xxl-flex {
        display: flex !important;
    }

    .kang-d-xxl-inline-flex {
        display: inline-flex !important;
    }

    .kang-d-xxl-grid {
        display: grid !important;
    }

    .kang-d-xxl-inline-grid {
        display: inline-grid !important;
    }
}

@media (max-width: 768px) {
    .kang-form-control-card-afiliado {
        padding: 10px !important;
    }

    .kang-gap-0-mobile {
        gap: 0 !important;
    }

    .kang-align-items-start-mobile {
        align-items: start !important;
    }

    .kang-mobile-absolute-right0 {
        position: absolute;
        right: 0;
    }

    .kang-mobile-absolute-left0 {
        position: absolute;
        left: 0;
    }

    .kang-mobile-absolute {
        position: absolute;
    }

    .kang-mobile-margin-left25rem {
        margin-left: 2.5rem !important;
    }

    .kang-container-geral {
        padding-left: 0 !important;
    }

    .kang-tour {
        display: block !important;
        font-size: 20px;
    }

    .kang-flex-colum-mobile {
        flex-direction: column !important;
    }

    div#kangSidebar {
        width: 100%;
    }

    .kang-top-bar {
        padding: 25px 24px 10px 24px !important;
    }

    .kang-mb-1rem-mobile {
        margin-bottom: 1rem;
    }

    .kang-menu {
        position: fixed;
        background: rgba(244, 244, 242, 1);
        left: 0;
        right: 0;
        bottom: 0;
        gap: 0;
        padding: 0 20px 0 20px;
        justify-content: center;
    }

    .kang-menu-item {
        flex-direction: column !important;
        gap: 0 !important;
    }

    .kang-menu-item span {
        font-size: var(--kang-font-size-14) !important;
    }

    .kang-menu-item.kang-dropdown {
        padding: 16px;
    }

    .kang-margin-left0-mobile {
        margin-left: 0 !important;
    }

    .kang-margin-bottom-1rem-mobile {
        margin-bottom: 1rem !important;
    }

    .kang-form-control-card-dominio {
        padding: 8px 16px 8px 16px !important;
    }

    .kang-encerrar-ticket {
        position: absolute;
        right: 0;
        top: 0;
    }

    .balao-ticket-cliente {
        max-width: 100% !important;
        padding: 15px !important;
    }

    .balao-ticket-atendente {
        max-width: 100% !important;
        padding: 15px !important;
    }

    .kang-font-10-mobile {
        font-size: 10px !important;
    }

    .kang-white-space-normal-mobile {
        white-space: normal !important;
    }
}

/* mobile end */
.kang-filter-white-black {
    filter: var(--kang-filter-white-black) !important;
}

.kang-filter-black {
    filter: var(--kang-filter-black) !important;
}

.kang-background-black-white1 {
    background: var(--kang-bg-1) !important;
}

.kang-font-black-white {
    color: var(--kang-font) !important;
}

select.kang-form-control-1 {
    background-image: url(/templates/kangaroohost/assets/icons/select.svg);
    padding: 8px 16px 8px 16px;
    background-repeat: no-repeat;
    background-position: right 1rem center;
    -moz-appearance: none;
    -webkit-appearance: none;
    appearance: none;
    line-height: 25px;
}

.kang-bg-buscar {
    background: var(--kang-sidebar-bg) !important;
}

.kang-white-space-break {
    white-space: break-spaces;
}

.kang-div-cartao-principal {
    border: 1px solid #ff903d;
    border-radius: 4px;
}

.kang-top-bar-registro {
    padding: 24px 0 24px 0;
}

.kang-border-bottom-1 {
    padding-bottom: 15px;
    border-bottom: 1px solid var(--kang-color-gray-light);
}

.kang-border-1 {
    border: 1px solid #DFDFDE;
}

.kang-encerrar-ticket-modal {
    background: var(--kang-card-novo-ticket);
    padding: 18px 24px 18px 24px;
}

.kang-alerta-novo {
    position: absolute;
    top: 0;
    right: 0;
}

.kang-margin-right-0 {
    margin-right: 0 !important;
}

.kang-contatos-suporte {
    padding: 24px 16px 24px 16px;
}

ul.pagination {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    align-items: center;
    list-style-type: none;
}

ul.pagination a.page-link {
    color: #042C41;
    text-decoration: none;
    margin: 0 var(--kang-gap-8);
    font-size: 16px;
}

ul.pagination li.active a.page-link {
    color: #ff8025 !important;
    font-weight: 600;
}

/* modal */
.kang-modal {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 1000;
    justify-content: center;
    align-items: center;
}

.kang-modal-content {
    background-color: var(--kang-Card);
    padding: var(--kang-padding-24);
    border-radius: var(--kang-border-radius-4);
    width: 450px;
    box-shadow: 0px 8px 16px 0px #E8E4C94D;
}

.kang-modal-body {
    margin-bottom: var(--kang-margin-16);
}

.kang-fade {
    transition: opacity .15s linear;
}

.modal-open {
    overflow: hidden;
}

.modal-open .kang-modal {
    overflow-x: hidden;
    overflow-y: auto;
}

.kang-modal-dialog {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
}

/* bg */

.kang-bg-danger {
    background-color: #dc3545 !important;
}
.kang-bg-success {
    background-color: #DA6300 !important;
}
.kang-bg-warning {
    background-color: #ffc107 !important;
}

.kang-w-hidden {
    display: none;
}

.md-editor {
    border: 1px solid #ddd;
    border-radius: 3px
}

.md-editor>.btn-toolbar {
    background-color: #fff!important
}

.md-editor>.btn-toolbar .hidden {
    display: none!important
}

.md-editor>.md-preview,.md-editor>textarea.markdown-editor {
    padding: 15px!important;
    border-top: 1px solid #ddd!important;
    border-bottom: 1px solid #ddd!important;
    background-color: #fff!important
}

div.md-editor.active {
    display: block;
    border: 1px solid #ddd;
    outline: 0;
    box-shadow: none
}

.markdown-editor-status {
    padding: 2px 10px;
    font-size: 9pt;
    color: #959694;
    text-align: right
}

.small-font {
    font-size: .9em
}

.markdown-content h1,.md-preview h1 {
    font-size: 1.6em;
    color: #333
}

.markdown-content h2,.md-preview h2 {
    font-size: 1.4em;
    color: #333
}

.markdown-content h3,.md-preview h3 {
    font-size: 1.2em;
    color: #333
}

.markdown-content h4,.md-preview h4 {
    font-size: 1.1em;
    color: #333
}

.markdown-content pre,.md-preview pre {
    padding: 15px;
    background-color: #444;
    color: #f8f8f8;
    border: 0
}

.markdown-content pre code,.md-preview pre code {
    white-space: pre;
    word-break: normal;
    word-wrap: normal
}

.markdown-content blockquote,.md-preview blockquote {
    font-size: 1em;
    padding: 10px 20px;
    margin: 0 0 20px;
    border-left: 5px solid #eee
}

.markdown-content table,.md-preview table {
    margin: 10px 0;
    background-color: #fff;
    border: 1px solid #ddd
}

.markdown-content table>thead>tr>th,.md-preview table>thead>tr>th {
    padding: 4px 10px;
    background-color: #f8f8f8;
    border: 1px solid #ddd;
    font-weight: 700;
    text-align: center
}

.markdown-content table>tbody>tr>td,.md-preview table>tbody>tr>td {
    padding: 3px 8px;
    border: 1px solid #ddd
}

.md-editor {
    display: block;
    border: 1px solid #ddd
}

.md-editor .md-footer,.md-editor>.md-header {
    display: block;
    padding: 6px 4px;
    background: #f5f5f5
}

.md-editor>.md-header {
    margin: 0
}

.md-editor>.md-preview {
    background: #fff;
    border-top: 1px dashed #ddd;
    border-bottom: 1px dashed #ddd;
    min-height: 10px;
    overflow: auto
}

.md-editor>textarea {
    font-family: Menlo,Monaco,Consolas,"Courier New",monospace;
    font-size: 14px;
    outline: 0;
    margin: 0;
    display: block;
    padding: 0;
    width: 100%;
    border: 0;
    border-top: 1px dashed #ddd;
    border-bottom: 1px dashed #ddd;
    border-radius: 0;
    box-shadow: none;
    background: #eee
}

.md-editor>textarea:focus {
    box-shadow: none;
    background: #fff
}

.md-editor.active {
    border-color: #66afe9;
    outline: 0;
    -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(102,175,233,.6);
    box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(102,175,233,.6)
}

.md-editor .md-controls {
    float: right;
    padding: 3px
}

.md-editor .md-controls .md-control {
    right: 5px;
    color: #bebebe;
    padding: 3px 3px 3px 10px
}

.md-editor .md-controls .md-control:hover {
    color: #333
}

.md-editor.md-fullscreen-mode {
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 99999;
    padding: 60px 30px 15px;
    background: #fff!important;
    border: 0!important
}

.md-editor.md-fullscreen-mode .md-footer {
    display: none
}

.md-editor.md-fullscreen-mode .md-input,.md-editor.md-fullscreen-mode .md-preview {
    margin: 0 auto!important;
    height: 100%!important;
    font-size: 20px!important;
    padding: 20px!important;
    color: #999;
    line-height: 1.6em!important;
    resize: none!important;
    box-shadow: none!important;
    background: #fff!important;
    border: 0!important
}

.md-editor.md-fullscreen-mode .md-preview {
    color: #333;
    overflow: auto
}

.md-editor.md-fullscreen-mode .md-input:focus,.md-editor.md-fullscreen-mode .md-input:hover {
    color: #333;
    background: #fff!important
}

.md-editor.md-fullscreen-mode .md-header {
    background: 0 0;
    text-align: center;
    position: fixed;
    width: 100%;
    top: 20px
}

.md-editor.md-fullscreen-mode .btn-group {
    float: none
}

.md-editor.md-fullscreen-mode .btn {
    border: 0;
    background: 0 0;
    color: #b3b3b3
}

.md-editor.md-fullscreen-mode .btn.active,.md-editor.md-fullscreen-mode .btn:active,.md-editor.md-fullscreen-mode .btn:focus,.md-editor.md-fullscreen-mode .btn:hover {
    box-shadow: none;
    color: #333
}

.md-editor.md-fullscreen-mode .md-fullscreen-controls {
    position: absolute;
    top: 20px;
    right: 20px;
    text-align: right;
    z-index: 1002;
    display: block
}

.md-editor.md-fullscreen-mode .md-fullscreen-controls a {
    color: #b3b3b3;
    clear: right;
    margin: 10px;
    width: 30px;
    height: 30px;
    text-align: center
}

.md-editor.md-fullscreen-mode .md-fullscreen-controls a:hover {
    color: #333;
    text-decoration: none
}

.md-editor.md-fullscreen-mode .md-editor {
    height: 100%!important;
    position: relative
}

.md-editor .md-fullscreen-controls {
    display: none
}

.md-nooverflow {
    overflow: hidden;
    position: fixed;
    width: 100%
}

.btn-default {
    /* color:#333; */
    background-color: #fff;
    border-color: #ccc
}

.btn-default.focus,.btn-default:focus {
    color: #333;
    background-color: #e6e6e6;
    border-color: #8c8c8c
}

.btn-default:hover {
    color: #333;
    background-color: #e6e6e6;
    border-color: #adadad
}

.btn-default.active,.btn-default:active,.open>.dropdown-toggle.btn-default {
    color: #333;
    background-color: #e6e6e6;
    background-image: none;
    border-color: #adadad
}

.btn-default.active.focus,.btn-default.active:focus,.btn-default.active:hover,.btn-default:active.focus,.btn-default:active:focus,.btn-default:active:hover,.open>.dropdown-toggle.btn-default.focus,.open>.dropdown-toggle.btn-default:focus,.open>.dropdown-toggle.btn-default:hover {
    color: #333;
    background-color: #d4d4d4;
    border-color: #8c8c8c
}

.btn-default.disabled {
    border-color: #ccc
}

.btn-default.disabled.focus,.btn-default.disabled:focus,.btn-default.disabled:hover,.btn-default[disabled].focus,.btn-default[disabled]:focus,.btn-default[disabled]:hover,fieldset[disabled] .btn-default.focus,fieldset[disabled] .btn-default:focus,fieldset[disabled] .btn-default:hover {
    background-color: #fff!important;
    border-color: #ccc!important
}

.md-editor .btn-toolbar .btn-group {
    margin-right: 6px;
}

.btn-group,.btn-group-vertical {
    position: relative;
    display: inline-flex;
    vertical-align: middle
}

.btn-group-vertical>.btn,.btn-group>.btn {
    position: relative;
    flex: 1 1 auto
}

.btn-group-vertical>.btn:hover,.btn-group>.btn:hover {
    z-index: 1
}

.btn-group-vertical>.btn.active,.btn-group-vertical>.btn:active,.btn-group-vertical>.btn:focus,.btn-group>.btn.active,.btn-group>.btn:active,.btn-group>.btn:focus {
    z-index: 1
}

button.btn-default.btn-sm.btn {
    padding: .25rem .5rem;
    font-size: .875rem;
    line-height: 1.5;
    border-radius: .2rem;
    border: 1px solid #18181821;
    padding: .375rem .75rem;
}

@media (min-width: 768px) {
    .btn-return-to-admin {
        position:fixed!important;
        top: 425px;
        right: 0;
        padding: 5px 15px!important;
        background-color: #d7d7d7!important;
        color: #777!important;
        font-size: .9rem!important;
        border-radius: 0 0 3px 3px!important;
        text-decoration: none;
        transform: rotate(90deg);
        transform-origin: top right;
        z-index: 500
    }

    .btn-return-to-admin:hover {
        background-color: #cdcdcd!important;
        color: #444!important;
        text-decoration: none
    }
}