.form-check-label {
    font-size: 14px;
}

a.disabled {
  pointer-events: disabled;
}

.cpf-layout-no-nav {
  padding-top: 0px;
}

.cpf-inline-code {
  font-family: var(--bs-font-monospace);
  font-style: normal;
  font-size: 0.85em;
  padding: 1px 2px 1px 2px;
  border: 1px solid var(--cpf-border);
  border-radius: 2px;
}

.cpf-code-textarea {
  font-family: var(--bs-font-monospace);
  font-size: 0.8em;
  white-space: pre;
  overflow-wrap: normal;
  overflow-x: scroll;
}

.cpf-nav {
  background-color: #ececea;
  color: var(--cpf-text_dark);
  border-right: 1px solid #deded9;
  height: 100%;
  transition: height 0.15s ease-in-out;
  width:260px;
}

.nav-pills .nav-link.active {
  background-color: #dcdddb !important;
}

.nav-pills {
    --cpf-nav-pills-border-radius: 0 5rem 5rem 0;

    & .nav-link.active {
        box-shadow: -2rem 0 0 #dcdddb;
    }
}

.cpf-nav-preview {
  border: 1px solid var(--cpf-border);
  border-radius: 4px;
  width: 100%;
}

.cpf-user-dropdown-toggle::after {
  content: none;
}  

#cpf-element-nav{
  .nav-link:focus{
      margin-left: -15px;
      padding-left: 30px; 
  }
}



.cpf-page {
    padding: 24px;
    width: 100%;
    height: 100%;
    overflow-y: scroll;
    box-sizing: border-box;
    position: relative;
}

.cpf-admin-form-wrapper {
  max-width: var(--bs-breakpoint-lg);
}

.event-details {
    max-width:600px;
}

@media screen and (max-width: 765px) {
    #cpf-navbar-collapse {
        position: absolute;
        z-index:99;
        height:100%;
    }
}

#cpf-element-tag-edit-form {
    display: block;
}

turbo-frame {
    display: flex;
} 

.cpf-icon-small {
    font-size: 16px;
}

.cpf-icon-header{
    font-size:28px;
}

.cpf-icon-medium {
    font-size: 36px;
}

.cpf-icon-large {
    font-size: 70px;
}

.cpf-block, .cpf-block-small, .cpf-block-large {
    background-color: var(--cpf-bg_light);
    border: 1px solid var(--cpf-border);
    border-radius: var(--cpf-border-radius-xl);
}

.cpf-block {
    height: 322px;
}

.cpf-block-small {
    height: 161px;
}

.cpf-block-large {
    height: 346px;
}

.cpf-border{
    border: 1px solid var(--cpf-border);
}

.navbar-top {
    border-bottom: 1px solid var(--cpf-border);
    background-color: var(--cpf-bg_light);
}

html {
    min-height: --webkit-fill-available;
}

main {
    display: flex;
    flex-wrap: nowrap;
    flex-grow: 1;
    overflow-x: auto;
    overflow-y: hidden;
}

.cpf-table thead > tr {
    font-weight: bold;
}

.cpf-table thead th.cpf-sticky-table-head {
    position: sticky;
    top: 0;
    z-index: 80;
    background-color: white;
    border-bottom: inherit;
    box-shadow: inset 0 -1px 0 var(--cpf-border);
}

.text-disabled{
    font-size: 13px;
    height: 38px;
    line-height: 38px;
    color: var(--cpf-text_light);
    font-weight: normal;
}

.cpf-icon-dark {
    color: var(--cpf-dark)!important;
}

.cpf-icon-mid {
    color: var(--cpf-mid)!important;
}

.cpf-icon-light {
color: var(--cpf-light)!important;
}

.cpf-icon-white {
    color: var(--cpf-white)!important;
}

.cpf-icon-primary {
    color: var(--cpf-primary)!important;
}

.cpf-icon-secondary {
    color: var(--cpf-secondary)!important;
}

.cpf-icon-success {
    color: var(--cpf-success)!important;
}

.cpf-icon-info {
    color: var(--cpf-info)!important;
}

.cpf-icon-warning {
    color: var(--cpf-warning)!important;
}

.cpf-icon-critical {
    color: var(--cpf-danger) !important;
}

.cpf-spinner {
    width: 40px;
    height: 40px;
}

.recharts-surface>*:focus{
    outline:none !important;
}

.recharts-surface>*:hover{
    outline:none !important;
}

.paginate-container{
    border-top:1px solid var(--cpf-border);
}

.cpf-full-width-table-container {
    background-color:var(--cpf-white); 
    position:absolute; 
    left:0px; 
    right:0px; 
    padding:40px; 
    border-top:1px solid var(--cpf-border);
    border-bottom:1px solid var(--cpf-border);
    overflow-x: scroll;
}

#cpf-customer-table td {
    white-space: nowrap;
}   

#cpf-element-device-history-graph {
    width: 100%;
    height: 100%;
}

.cpf-devices-created-since-row {
    font-size: 12px;
    width: 100%;
    border-bottom: 1px solid var(--cpf-border);
    padding-top: 2px;
    padding-bottom: 2px;
    margin-bottom: 20px;
}

#cpf-element-devices-created-since {
    width: 100%;
    display: block;
}

#cpf-device-properties-tab-pane{
    height: 100%;
    position: relative;
    overflow: auto;
}

.cpf-page-device-details{
    overflow-y:hidden !important; 
}

.history-graph{
    height:255px;
}

.form-comment{
    height:100px;
}

.cpf-standard-form {
    max-width: 600px;
}

.device-property-form {
    max-width: 600px;
}   

.tab-content{
    height:100%; 
    border-left:1px solid var(--cpf-border); 
    border-right:1px solid var(--cpf-border);
    border-bottom:1px solid var(--cpf-border);
    background-color: var(--cpf-bg_light);
}

.details-save{
    bottom:30px !important;
    background-color: var(--cpf-bg_mid) !important;
    border: 1px solid var(--cpf-border) !important;
}

.full-width-table-container{
    border-top: 1px solid var(--cpf-border); 
    box-sizing: border-box; 
    background-color: var(--cpf-bg_light);
}

input[type="color"] {
    -webkit-appearance: none;
    border: none;
    padding: 0px;
    cursor:pointer;
}

input[type="color"]::-webkit-color-swatch-wrapper {
    padding: 0;
}

input[type="color"]::-webkit-color-swatch {
    border: none;
}

.font-preview{
    background-color: var(--cpf-bg_light); 
    border:1px solid var(--cpf-border);
    border-radius: 4px;
    color: var(--cpf-text_dark);
}

#validationPreview{
    display:none;
    color: var(--cpf-danger);
}

.summary-count-sm{
    flex-basis:50%;
    margin-bottom:-3px;
    font-size:22px;
    font-weight:bold;
}

.summary-count-lg{
    flex-basis:50%; 
    margin-bottom:-5px; 
    font-size:28px; 
    font-weight:bold;
}

.summary-label{
    flex-basis:50%; 
    font-size:14px; 
    white-space:no-wrap;
}

#los-root #dashboard-content {
    & .los-dashboard-title {
        display: none;
    }

    & #duration-resolution-dropdown,
    & #dashboard-time-dropdown {
        color: var(--cpf-text_mid) !important;
    }

    & #dashboard-time-dropdown {
        background-color: var(--cpf-white) !important;
        border-radius: 0.25rem;
    }
}

#device_notes_count {
    text-align: right;
}

.page-error{
    margin-top:100px;
}

h1 {
    color: var(--cpf-text_dark);
}

form {
    & label {
        font-size: 14px;
        font-weight: 600;
        margin-bottom: 0.25rem;
    }
}

.nav-tabs {
    --bs-nav-tabs-border-radius: var(--cpf-border-radius-lg);
}

.g-4,.gx-4 {
    --bs-gutter-x: 1.3rem
}

.g-4,.gy-4 {
    --bs-gutter-y: 1.3rem;
}

@media screen and (max-width: 765px) {
    .cpf-page {
        padding: 12px;
    }

    h2 {
        font-size: 18px;
    }
}

#cpf-element-announcement-banner {
    flex-grow:1;
    flex-direction:column;
}

.announcement-close {
    position: absolute;
    right: 0;
    margin-right: 19px;
    top: 50%;
    transform: translateY(-50%);
}

.main-announcement-content a{
    color: white;
    text-decoration: underline;
  }
.main-announcement-content a:hover:not(.btn):not(.nav-link) {
    color: white !important;
    filter: brightness(0.9);
}
#cpf-element-customers-table {
  height: 100%;
}
#cpf-element-dashboard, #cpf-element-data-explorer {
    width: 100%;
    display:block;
}

#cpf-element-data-explorer {
    & .tl-data-explorer-visualization {
        padding-top: 20px;
        border-top: 1px solid var(--cpf-border);
        @media (min-width: 1200px) {
            height: calc(100vh - 20rem);
            border-top: none;
            padding-top: 0;
        }
    }
}
#cpf-element-device-list {
  height: 100%;
}


#cpf-element-events-table {
  height: 100%;
}
 .cpf-element-image-upload-preview {
    width: 130px;
    height: 130px;
    border: 1px solid var(--cpf-border);
    background: var(--cpf-bg_light);
    position: relative;
}
.sites-nav-item {
    width: 100%;
}

a.sites-container div {
    float: left;
}

a.sites-container:after {
    font-family: 'Material Symbols Outlined';
    display: inline-block;
    display: inline-block;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-size: 25px;
    content: "arrow_right";
    transform: rotate(90deg) ;
    transition: all linear 0.25s;
    margin-top: -5px;
    float: right;
  }

a.sites-container.collapsed:after {
    transform: rotate(0deg);
}

.masen-site-items {
    padding-left: 8px;
}
#cpf-element-sites-table {
  height: 100%;
}
#cpf-element-users-table {
  height: 100%;
}
.badgeContainer {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
}

.badgeLabel {
    background: var(--cpf-bg_mid);
    border-radius: var(--cpf-border-radius);
    border: 1px solid var(--cpf-border);
    padding: 2px 4px;
    margin: 4px;
    font-size: calc(var(--cpf-body-font-size) * 0.8);
}

.pull-right {
    float: right;
    margin-right: 0px;
}

.right-padding {
    margin-right: 20px;
}

.custom-popover{
    background: white;
    padding: 5px;
    margin: 5px;
}

.hide {
    display: none;
}

#cpf-element-event-rules-table {
  height: 100%;
}
#map { 
}
/* Scrollbar */
:root {
    --scrollbar: rgba(0, 0, 0, .2);
    --scrollbar-active: rgba(0, 0, 0, .4);
    --scrollbar-track: rgba(0, 0, 0, .05)
}

:root.body--dark {
    --scrollbar: rgba(255, 255, 255, .2);
    --scrollbar-active: rgba(255, 255, 255, .25);
    --scrollbar-track: rgba(255, 255, 255, .05)
}

:root ::-webkit-scrollbar {
    width: .75rem;
    height: .75rem
}

:root ::-webkit-scrollbar-thumb {
    border: .125rem solid rgba(0,0,0,0);
    background-clip: padding-box;
    background-color: var(--scrollbar);
    border-radius: .75rem;
    min-height: 2rem
}

:root ::-webkit-scrollbar-thumb:active {
    background-color: var(--scrollbar-active)
}

:root ::-webkit-scrollbar-track {
    background-position: center
}

:root ::-webkit-scrollbar-track:vertical {
    background-image: linear-gradient(transparent 50%,var(--scrollbar-track) 50%);
    background-size: .5rem .0625rem;
    background-repeat: repeat-y
}

:root ::-webkit-scrollbar-track:horizontal {
    background-image: linear-gradient(to right,transparent 50%,var(--scrollbar-track) 50%);
    background-size: .0625rem .5rem;
    background-repeat: repeat-x
}

:root ::-webkit-scrollbar-corner {
    background: #0000
}

:root .scrollbar {
    max-height: 100%;
    overflow-y: auto
}

:root .scrollbar-overlay {
    overflow-y: overlay
}
/* End Scrollbar */

:root {
  --cpf-company_name: Masen;
  --cpf-title_template: {{this}} | Masen;
  --cpf-primary: #77c1cf;
  --cpf-secondary: #e8e8e3;
  --cpf-success: #25ca6d;
  --cpf-info: #5f76f7;
  --cpf-warning: #ffba1a;
  --cpf-danger: #ff554d;
  --cpf-text_dark: #0c0a09;
  --cpf-text_mid: #504c49;
  --cpf-text_light: #a7a0aa;
  --cpf-text_white: #ffffff;
  --cpf-bg_dark: #f5f5f4;
  --cpf-bg_mid: #fafafa;
  --cpf-bg_light: #ffffff;
  --cpf-border: #deded9;
  --cpf-font_family: Manrope;
  --cpf-tos: https://www.kochinc.com/terms-of-use;
  --cpf-privacy_policy: https://privacypolicy.kochinc.com;
  --cpf-generic_contact_us: https://masen.pro/contact;
  --cpf-logo_large: logo_large_1703083521470.png;
  --cpf-logo_small: logo_small_1703083521470.png;

  --bs-body-bg: transparent;
  --bs-border-color: var(--cpf-border);
  --bs-body-color: var(--cpf-text_dark);
  --cpf-border-color: var(--cpf-border);
  --cpf-bg-light: var(--cpf-bg_light);
  --cpf-bg-mid: var(--cpf-bg_mid);
  --cpf-body-color: var(--cpf-text_dark);
  --cpf-mid: var(--cpf-text_mid);
  --cpf-light: var(--cpf-text_mid);
  --cpf-font-sans-serif: 'Manrope','Open Sans', 'Helvetica Neue', 'Helvetica', 'Arial', sans-serif;
  --bs-border-radius: .5rem;
  --bg-hsl-color: 60, 5%, 96%;
  --cpf-link-hover-color: var(--cpf-link-color);
  
}

body {
  display: flex;
  flex-direction: column;
  height: 100vh;
  overflow-x: hidden;
  background: hsl(var(--bg-hsl-color));
}

body.cpf-layout-no-nav {
  --bg-color-overlay: hsla(var(--bg-hsl-color), 0.2);
  background: linear-gradient(var(--bg-color-overlay), var(--bg-color-overlay)), url("https://files.onlosant.com/66421dcf34aa0b63a5e3bb70/bg-login.svg"), hsl(var(--bg-hsl-color));
  background-size: cover;
  background-position: top center;
  background-repeat: no-repeat;
}

.cpf-logo-large {
  width: min(60%, 228px);
  aspect-ratio: 7 / 1;
  margin: auto;
  background: url('https://files.onlosant.com/66421dcf34aa0b63a5e3bb70/logo_large_1703083521470.png');
  background-repeat: no-repeat;
  background-size: contain;
  background-position: top center;
}

.form-control {
  border-radius: var(--bs-border-radius);
}

.form-control::placeholder {
  color:var(--cpf-text_mid) !important;
  opacity:0.5 !important;
}


.cpf-border-primary {
  border: 1px solid var(--cpf-primary);
}

.alert-primary {
  background-color: color-mix(in srgb, var(--cpf-primary) 20%, var(--cpf-bg_light)) !important;
  color: var(--cpf-text_dark) !important;
  border-color: color-mix(in srgb, var(--cpf-primary) 60%, var(--cpf-bg_light)) !important;
}

.btn-primary {
  --bs-btn-padding-x: 1rem;
  --bs-btn-font-size: 0.875rem;
  --bs-btn-font-weight: 500;
  background-color: var(--cpf-primary) !important;
  color: var(--cpf-text_dark) !important;
  border-radius: var(--bs-border-radius-pill);
}

.btn-primary:hover {
  filter: brightness(0.9);
  border-color: var(--cpf-primary) !important;
}

.btn-primary:active {
  filter: brightness(0.9);
  border-color: var(--cpf-primary) !important;
}

.btn-primary:disabled {
  background-color: var(--cpf-body-bg);
  opacity: 0.5;
  cursor: not-allowed;
}

.text-primary {
  color: var(--cpf-primary) !important;
}

.bg-primary {
  background-color: var(--cpf-primary) !important;
}

.btn-outline-primary {
  --bs-btn-color: var(--cpf-primary);
  --bs-btn-active-bg: var(--cpf-primary);
}


.cpf-border-secondary {
  border: 1px solid var(--cpf-secondary);
}

.alert-secondary {
  background-color: color-mix(in srgb, var(--cpf-secondary) 20%, var(--cpf-bg_light)) !important;
  color: var(--cpf-text_dark) !important;
  border-color: color-mix(in srgb, var(--cpf-secondary) 60%, var(--cpf-bg_light)) !important;
}

.btn-secondary {
  --bs-btn-padding-x: 1rem;
  --bs-btn-font-size: 0.875rem;
  --bs-btn-font-weight: 500;
  background-color: var(--cpf-secondary) !important;
  color: var(--cpf-text_dark) !important;
  border-radius: var(--bs-border-radius-pill);
}

.btn-secondary:hover {
  filter: brightness(0.9);
  border-color: var(--cpf-secondary) !important;
}

.btn-secondary:active {
  filter: brightness(0.9);
  border-color: var(--cpf-secondary) !important;
}

.btn-secondary:disabled {
  background-color: var(--cpf-body-bg);
  opacity: 0.5;
  cursor: not-allowed;
}

.text-secondary {
  color: var(--cpf-secondary) !important;
}

.bg-secondary {
  background-color: var(--cpf-secondary) !important;
}

.btn-outline-secondary {
  --bs-btn-color: var(--cpf-secondary);
  --bs-btn-active-bg: var(--cpf-secondary);
}


.cpf-border-success {
  border: 1px solid var(--cpf-success);
}

.alert-success {
  background-color: color-mix(in srgb, var(--cpf-success) 20%, var(--cpf-bg_light)) !important;
  color: var(--cpf-text_dark) !important;
  border-color: color-mix(in srgb, var(--cpf-success) 60%, var(--cpf-bg_light)) !important;
}

.btn-success {
  --bs-btn-padding-x: 1rem;
  --bs-btn-font-size: 0.875rem;
  --bs-btn-font-weight: 500;
  background-color: var(--cpf-success) !important;
  color: var(--cpf-text_dark) !important;
  border-radius: var(--bs-border-radius-pill);
}

.btn-success:hover {
  filter: brightness(0.9);
  border-color: var(--cpf-success) !important;
}

.btn-success:active {
  filter: brightness(0.9);
  border-color: var(--cpf-success) !important;
}

.btn-success:disabled {
  background-color: var(--cpf-body-bg);
  opacity: 0.5;
  cursor: not-allowed;
}

.text-success {
  color: var(--cpf-success) !important;
}

.bg-success {
  background-color: var(--cpf-success) !important;
}

.btn-outline-success {
  --bs-btn-color: var(--cpf-success);
  --bs-btn-active-bg: var(--cpf-success);
}


.cpf-border-info {
  border: 1px solid var(--cpf-info);
}

.alert-info {
  background-color: color-mix(in srgb, var(--cpf-info) 20%, var(--cpf-bg_light)) !important;
  color: var(--cpf-text_dark) !important;
  border-color: color-mix(in srgb, var(--cpf-info) 60%, var(--cpf-bg_light)) !important;
}

.btn-info {
  --bs-btn-padding-x: 1rem;
  --bs-btn-font-size: 0.875rem;
  --bs-btn-font-weight: 500;
  background-color: var(--cpf-info) !important;
  color: var(--cpf-text_dark) !important;
  border-radius: var(--bs-border-radius-pill);
}

.btn-info:hover {
  filter: brightness(0.9);
  border-color: var(--cpf-info) !important;
}

.btn-info:active {
  filter: brightness(0.9);
  border-color: var(--cpf-info) !important;
}

.btn-info:disabled {
  background-color: var(--cpf-body-bg);
  opacity: 0.5;
  cursor: not-allowed;
}

.text-info {
  color: var(--cpf-info) !important;
}

.bg-info {
  background-color: var(--cpf-info) !important;
}

.btn-outline-info {
  --bs-btn-color: var(--cpf-info);
  --bs-btn-active-bg: var(--cpf-info);
}


.cpf-border-warning {
  border: 1px solid var(--cpf-warning);
}

.alert-warning {
  background-color: color-mix(in srgb, var(--cpf-warning) 20%, var(--cpf-bg_light)) !important;
  color: var(--cpf-text_dark) !important;
  border-color: color-mix(in srgb, var(--cpf-warning) 60%, var(--cpf-bg_light)) !important;
}

.btn-warning {
  --bs-btn-padding-x: 1rem;
  --bs-btn-font-size: 0.875rem;
  --bs-btn-font-weight: 500;
  background-color: var(--cpf-warning) !important;
  color: var(--cpf-text_dark) !important;
  border-radius: var(--bs-border-radius-pill);
}

.btn-warning:hover {
  filter: brightness(0.9);
  border-color: var(--cpf-warning) !important;
}

.btn-warning:active {
  filter: brightness(0.9);
  border-color: var(--cpf-warning) !important;
}

.btn-warning:disabled {
  background-color: var(--cpf-body-bg);
  opacity: 0.5;
  cursor: not-allowed;
}

.text-warning {
  color: var(--cpf-warning) !important;
}

.bg-warning {
  background-color: var(--cpf-warning) !important;
}

.btn-outline-warning {
  --bs-btn-color: var(--cpf-warning);
  --bs-btn-active-bg: var(--cpf-warning);
}


.cpf-border-danger {
  border: 1px solid var(--cpf-danger);
}

.alert-danger {
  background-color: color-mix(in srgb, var(--cpf-danger) 20%, var(--cpf-bg_light)) !important;
  color: var(--cpf-text_dark) !important;
  border-color: color-mix(in srgb, var(--cpf-danger) 60%, var(--cpf-bg_light)) !important;
}

.btn-danger {
  --bs-btn-padding-x: 1rem;
  --bs-btn-font-size: 0.875rem;
  --bs-btn-font-weight: 500;
  background-color: var(--cpf-danger) !important;
  color: var(--cpf-text_dark) !important;
  border-radius: var(--bs-border-radius-pill);
}

.btn-danger:hover {
  filter: brightness(0.9);
  border-color: var(--cpf-danger) !important;
}

.btn-danger:active {
  filter: brightness(0.9);
  border-color: var(--cpf-danger) !important;
}

.btn-danger:disabled {
  background-color: var(--cpf-body-bg);
  opacity: 0.5;
  cursor: not-allowed;
}

.text-danger {
  color: var(--cpf-danger) !important;
}

.bg-danger {
  background-color: var(--cpf-danger) !important;
}

.btn-outline-danger {
  --bs-btn-color: var(--cpf-danger);
  --bs-btn-active-bg: var(--cpf-danger);
}


.btn-group label {
  font-size: 14px;
  font-weight: 500;
}

label {
  color: var(--cpf-text-dark);
}

a:hover:not(.btn):not(.nav-link) {
  filter: brightness(0.9) !important;
}

a:hover .btn {
  filter: brightness(0.9) !important;
}

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

.cpf-text-light {
  color: var(--cpf-text_light);
}

.cpf-text-mid {
  color: var(--cpf-text_mid);
}

.cpf-text-dark {
  color: var(--cpf-text_dark);
}

.cpf-bg-light {
  background-color: var(--cpf-bg_light);
}

.cpf-bg-mid {
  background-color: var(--cpf-bg_mid);
}

.cpf-bg-dark {
  background-color: var(--cpf-bg_dark);
}

.form-select {
  background-color: var(--cpf-bg_light) !important;
}

.form-control:disabled {
  background-color: var(--cpf-body-bg);
  opacity: 0.5;
  cursor: not-allowed;
}

.form-select:disabled {
  background-color: var(--cpf-body-bg);
  opacity: 0.5;
  cursor: not-allowed;
}

.form-control:focus {
  background-color: var(--cpf-bg_light) !important;
}

.form-select:focus {
  background-color: var(--cpf-bg_light) !important;
}

.form-check-input {
  background-color: var(--cpf-bg_light) !important;
}

.form-check-input:checked {
  background-color: var(--cpf-primary) !important;
  border-color: var(--cpf-primary) !important;
}

.card-body {
  background-color: var(--cpf-bg_light) !important;
}

hr {
  border-top: 1px solid var(--cpf-border) !important;
  opacity: 1 !important;
}

.bg-light {
  background-color: var(--cpf-bg_light) !important;
}

.nav-link {
  color: var(--cpf-text_dark) !important;
  cursor: pointer;
}

.was-validated .form-control:invalid {
  border-color: var(--cpf-danger) !important;
}

.was-validated .form-control:valid {
  border-color: var(--cpf-success) !important;
}

.was-validated .form-select:invalid {
  border-color: var(--cpf-danger) !important;
}

.was-validated .form-select:valid {
  border-color: var(--cpf-success) !important;
}

.text-muted {
  color: var(--cpf-text_mid) !important;
}

.card {
  
}

.card-body {
  border-radius: 0 0 var(--bs-card-inner-border-radius) var(--bs-card-inner-border-radius);
}

.card-header {
  border-radius: var(--bs-card-inner-border-radius) var(--bs-card-inner-border-radius) 0 0;
}

.modal-content {
  background-color: var(--cpf-bg_light) !important;
  border-color: var(--cpf-border) !important;
}

.form-text {
  color: var(--cpf-text_mid) !important;
}

.dropdown-menu {
  border-radius: var(--bs-dropdown-border-radius);
}

.dropdown-menu::-webkit-scrollbar {
    background-color: var(--cpf-bg-light);
    border-radius: 0 var(--bs-dropdown-border-radius) var(--bs-dropdown-border-radius) 0;
}

.breadcrumb {
  --bs-breadcrumb-margin-bottom: 0.25rem;
}

.nav-tabs {
  --bs-nav-tabs-link-hover-border-color: var(--bs-border-color);
}