/* <copyright file="conexgo-components.css" company="Laxson Solutions">
 * Laxson Solutions Development Team
 *
 * Description:
 * Defines reusable component styling shared across the Conexgo application.
 * </copyright> */

/* Historical source boundaries are retained for reviewability. */

@import url("open-iconic/font/css/open-iconic-bootstrap.min.css");

/*
 * Conexgo dialog foundation.
 * This file styles the MudBlazor dialog shell and explicit Conexgo classes.
 * It does not infer business structure from row position or child order.
 */

:root {
    --cx-dialog-navy: #2c4c6c;
    --cx-dialog-navy-hover: #244563;
    --cx-dialog-text: #253858;
    --cx-dialog-muted: #667585;
    --cx-dialog-border: #d6e0ea;
    --cx-dialog-control-border: #cbd7e2;
    --cx-dialog-body: #f7f9fb;
    --cx-dialog-footer: #f4f7fa;
    --cx-dialog-primary: #31597f;
    --cx-dialog-primary-soft: #eaf1f7;
    --cx-dialog-success: #5f8667;
    --cx-dialog-success-hover: #4f7558;
    --cx-dialog-danger: #a44952;
    --cx-dialog-danger-soft: #fff5f5;
}

.mud-overlay.mud-overlay-dialog {
    background: rgba(24, 38, 56, .42) !important;
    backdrop-filter: none !important;
}

.mud-dialog {
    max-width: calc(100vw - 32px) !important;
    max-height: calc(100dvh - 32px) !important;
    min-height: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    overflow: hidden !important;
    border: 1px solid #9fb2c6 !important;
    border-radius: 14px !important;
    background: #fff !important;
    box-shadow: 0 22px 56px rgba(23, 43, 77, .18), 0 5px 14px rgba(23, 43, 77, .08) !important;
    animation: none !important;
    transform: none !important;
}

.mud-dialog .mud-dialog-title,
.mud-dialog .dialog-background-title {
    min-height: 58px !important;
    min-width: 0 !important;
    padding: 12px 18px !important;
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    flex: 0 0 auto !important;
    border: 0 !important;
    border-bottom: 1px solid rgba(255, 255, 255, .14) !important;
    border-radius: 13px 13px 0 0 !important;
    background: var(--cx-dialog-navy) !important;
    color: #fff !important;
    font-size: 18px !important;
    font-weight: 700 !important;
    line-height: 1.25 !important;
    overflow-wrap: anywhere !important;
}

.mud-dialog .mud-dialog-title .mud-icon-button-root,
.mud-dialog .mud-dialog-title .mud-button-root {
    width: 36px !important;
    height: 36px !important;
    min-width: 36px !important;
    min-height: 36px !important;
    margin-left: auto !important;
    padding: 0 !important;
    display: inline-grid !important;
    place-items: center !important;
    border: 0 !important;
    border-radius: 9px !important;
    background: transparent !important;
    color: rgba(255, 255, 255, .95) !important;
    box-shadow: none !important;
}

.mud-dialog .mud-dialog-title .mud-icon-button-root:hover,
.mud-dialog .mud-dialog-title .mud-button-root:hover {
    background: rgba(255, 255, 255, .12) !important;
}

.mud-dialog .mud-dialog-content,
.mud-dialog .dialog-background-surface.mud-dialog-content {
    min-height: 0 !important;
    padding: clamp(12px, 1.15vw, 18px) !important;
    flex: 1 1 auto !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    overscroll-behavior: contain;
    background: var(--cx-dialog-body) !important;
    color: var(--cx-dialog-text) !important;
    font-size: 13.5px !important;
    line-height: 1.45 !important;
    scrollbar-width: thin;
    scrollbar-color: #b7c4d0 transparent;
}

.mud-dialog .mud-dialog-content::-webkit-scrollbar {
    width: 8px;
}

.mud-dialog .mud-dialog-content::-webkit-scrollbar-track {
    background: transparent;
}

.mud-dialog .mud-dialog-content::-webkit-scrollbar-thumb {
    border: 2px solid transparent;
    border-radius: 999px;
    background: #b7c4d0;
    background-clip: padding-box;
}

/* Visual treatment only; component-local CSS owns the business layout. */
.cx-dialog-root .form-label,
.cx-dialog-root .control-label,
.cx-dialog-root .col-form-label,
.cx-dialog-root label[aspfor] {
    margin-bottom: 5px !important;
    color: #2c4c6c !important;
    font-size: 12.5px !important;
    font-weight: 700 !important;
    line-height: 1.35 !important;
}

.cx-dialog-root .form-control,
.cx-dialog-root .form-select,
.cx-dialog-root input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),
.cx-dialog-root select,
.cx-dialog-root textarea {
    min-height: 38px !important;
    border: 1px solid var(--cx-dialog-control-border) !important;
    border-radius: 8px !important;
    background: #fff !important;
    color: var(--cx-dialog-text) !important;
    font-size: 13.5px !important;
    line-height: 1.4 !important;
    box-shadow: 0 1px 2px rgba(23, 43, 77, .025) !important;
}

.cx-dialog-root .form-control:hover,
.cx-dialog-root .form-select:hover,
.cx-dialog-root input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]):hover,
.cx-dialog-root select:hover,
.cx-dialog-root textarea:hover {
    border-color: #b6c6d5 !important;
}

.cx-dialog-root .form-control:focus,
.cx-dialog-root .form-select:focus,
.cx-dialog-root input:focus,
.cx-dialog-root select:focus,
.cx-dialog-root textarea:focus {
    border-color: #6f8eac !important;
    outline: 0 !important;
    box-shadow: 0 0 0 3px rgba(61, 98, 135, .12) !important;
}

.cx-dialog-root .form-control:disabled,
.cx-dialog-root .form-select:disabled,
.cx-dialog-root input:disabled,
.cx-dialog-root select:disabled,
.cx-dialog-root textarea:disabled,
.cx-dialog-root .form-control[readonly] {
    border-color: #dbe3ea !important;
    background: #f1f4f7 !important;
    color: #667585 !important;
    opacity: 1 !important;
}

.cx-dialog-root .form-text,
.cx-dialog-root small,
.cx-dialog-root .text-muted,
.cx-dialog-root .validation-message {
    color: var(--cx-dialog-muted) !important;
    font-size: 12.5px !important;
    line-height: 1.45 !important;
}

.cx-dialog-root .form-control-plaintext,
.cx-dialog-root .static-value,
.cx-dialog-root .readonly-value,
.cx-dialog-root .conexgo-dialog-static-value,
.cx-dialog-root .cx-r1-readonly-value {
    color: var(--cx-dialog-text) !important;
    font-size: 13.5px !important;
    line-height: 1.45 !important;
}

.mud-dialog .mud-dialog-actions,
.mud-dialog .dialog-background-surface.mud-dialog-actions,
.mud-dialog .cx-dialog-actions {
    min-height: 56px !important;
    padding: 8px 12px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 8px !important;
    flex: 0 0 auto !important;
    flex-wrap: nowrap !important;
    border-top: 1px solid #dbe3eb !important;
    background: var(--cx-dialog-footer) !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
}

.mud-dialog .mud-dialog-actions > *,
.mud-dialog .cx-dialog-actions > * {
    flex: 0 0 auto !important;
}

.mud-dialog .mud-dialog-actions .mud-button-label,
.mud-dialog .cx-dialog-actions .mud-button-label {
    width: 100%;
    min-width: 0;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    line-height: 1 !important;
}

.mud-dialog .mud-dialog-actions .mud-button-root,
.mud-dialog .mud-dialog-actions .btn,
.mud-dialog .cx-dialog-action {
    min-height: 36px !important;
    padding: 0 12px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 7px !important;
    border-radius: 7px !important;
    font-size: 12.5px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    white-space: nowrap !important;
    box-shadow: none !important;
    transition: transform .15s ease, background-color .15s ease, border-color .15s ease, box-shadow .15s ease !important;
}

.mud-dialog .mud-dialog-actions .mud-button-root:hover,
.mud-dialog .mud-dialog-actions .btn:hover,
.mud-dialog .cx-dialog-action:hover {
    transform: translateY(-1px);
    box-shadow: 0 4px 10px rgba(31, 62, 91, .12) !important;
}

.mud-dialog .mud-dialog-actions i,
.mud-dialog .cx-dialog-action i {
    margin: 0 !important;
    font-size: 13px !important;
    line-height: 1 !important;
}

.mud-dialog .conexgo-dialog-save,
.mud-dialog .cx-dialog-action--save {
    border-color: var(--cx-dialog-success) !important;
    background: var(--cx-dialog-success) !important;
    color: #ffffff !important;
}

.mud-dialog .conexgo-dialog-save:hover,
.mud-dialog .cx-dialog-action--save:hover {
    border-color: var(--cx-dialog-success-hover) !important;
    background: var(--cx-dialog-success-hover) !important;
}

.mud-dialog .conexgo-dialog-save-close,
.mud-dialog .cx-dialog-action--save-close {
    border-color: #294f72 !important;
    background: linear-gradient(135deg, #37698f 0%, #2b5579 100%) !important;
    color: #ffffff !important;
    box-shadow: 0 3px 9px rgba(31, 61, 89, .14) !important;}

.mud-dialog .conexgo-dialog-cancel,
.mud-dialog .cx-dialog-action--cancel {
    border-color: #c6d1dc !important;
    background: #fff !important;
    color: #566575 !important;
}

.mud-dialog .conexgo-dialog-delete,
.mud-dialog .cx-dialog-action--delete {
    margin-left: 0 !important;
    border-color: #efd9dc !important;
    background: var(--cx-dialog-danger-soft) !important;
    color: var(--cx-dialog-danger) !important;
}

.mud-dialog .conexgo-dialog-preview,
.mud-dialog .cx-dialog-action--preview {
    border-color: #c6d1dc !important;
    background: #fff !important;
    color: #566575 !important;
}

.mud-dialog .conexgo-dialog-publish,
.mud-dialog .cx-dialog-action--publish,
.mud-dialog .conexgo-dialog-send,
.mud-dialog .cx-dialog-action--send {
    border-color: #617aa2 !important;
    background: #617aa2 !important;
    color: #fff !important;
}

.mud-dialog.cx-dialog-root .cx-dialog-action {
    transition: filter .15s ease, transform .15s ease, box-shadow .15s ease, border-color .15s ease !important;
}

.mud-dialog.cx-dialog-root .cx-dialog-action:is(:hover, :focus-visible, :active) {
    filter: brightness(.94) !important;
    transform: translateY(-1px) !important;
}

.mud-dialog.cx-dialog-root .cx-dialog-action :is(.mud-button-label, i, svg, .mud-icon-root) {
    color: inherit !important;
}

.mud-dialog.cx-dialog-root :is(.cx-dialog-action--save, .cx-dialog-action--save-close, .cx-dialog-action--publish, .cx-dialog-action--send, .cx-dialog-action--acknowledge, .cx-dialog-action--subscribe, .cx-dialog-action--reset, .conexgo-dialog-suspend, .conexgo-dialog-notice, .conexgo-dialog-activate, .conexgo-dialog-apply-now):is(:hover, :focus-visible, :active) {
    color: #ffffff !important;
}

.mud-dialog.cx-dialog-root :is(.cx-dialog-action--cancel, .cx-dialog-action--preview):is(:hover, :focus-visible, :active) {
    color: #566575 !important;
}

.mud-dialog.cx-dialog-root :is(.cx-dialog-action--delete, .cx-dialog-action--unsubscribe):is(:hover, :focus-visible, :active) {
    color: var(--cx-dialog-danger) !important;
}

.mud-dialog .mud-button-root:disabled,
.mud-dialog .mud-button-root.mud-disabled,
.mud-dialog .btn:disabled,
.mud-dialog .btn.disabled {
    transform: none !important;
    box-shadow: none !important;
    cursor: not-allowed !important;
    opacity: .58 !important;
}

/* Explicit confirmation component. */
.cx-confirm-dialog {
    width: min(540px, calc(100vw - 24px)) !important;
    max-width: min(540px, calc(100vw - 24px)) !important;
}

/* Explicit account block notice dialog may use a wider canvas. */
.account-blocknotice-dialog {
    width: min(1080px, calc(100vw - 32px)) !important;
    max-width: min(1080px, calc(100vw - 32px)) !important;
}

@media (max-width: 767.98px) {
    .mud-dialog {
        width: calc(100vw - 16px) !important;
        max-width: calc(100vw - 16px) !important;
        max-height: calc(100dvh - 16px) !important;
        border-radius: 12px !important;
    }

    .mud-dialog .mud-dialog-title,
    .mud-dialog .dialog-background-title {
        min-height: 58px !important;
        padding: 12px 14px !important;
        gap: 10px !important;
        border-radius: 11px 11px 0 0 !important;
        font-size: 19px !important;
    }

    .mud-dialog .mud-dialog-content,
    .mud-dialog .dialog-background-surface.mud-dialog-content {
        padding: 14px !important;
        font-size: 14.5px !important;
    }

    .mud-dialog .mud-dialog-actions,
    .mud-dialog .dialog-background-surface.mud-dialog-actions,
    .mud-dialog .cx-dialog-actions {
        min-height: 68px !important;
        padding: 12px !important;
        gap: 8px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: flex-end !important;
        flex-wrap: nowrap !important;
        overflow-x: auto !important;
        overflow-y: hidden !important;
        scrollbar-width: thin;
    }

    .mud-dialog .mud-dialog-actions .mud-button-root,
    .mud-dialog .mud-dialog-actions .btn,
    .mud-dialog .cx-dialog-action {
        width: 44px !important;
        min-width: 44px !important;
        max-width: 44px !important;
        height: 44px !important;
        min-height: 44px !important;
        padding: 0 !important;
        flex: 0 0 44px !important;
        font-size: 0 !important;
        overflow: hidden !important;
    }

    .mud-dialog .mud-dialog-actions .mud-button-label,
    .mud-dialog .cx-dialog-actions .mud-button-label {
        width: 100% !important;
        height: 100% !important;
        gap: 0 !important;
    }

    .mud-dialog .mud-dialog-actions i,
    .mud-dialog .mud-dialog-actions svg,
    .mud-dialog .cx-dialog-action i,
    .mud-dialog .cx-dialog-action svg {
        width: 18px !important;
        height: 18px !important;
        margin: 0 !important;
        display: inline-grid !important;
        place-items: center !important;
        font-size: 16px !important;
        line-height: 1 !important;
    }
}

/* R5.4 - consistent section feedback inside every Conexgo dialog. */
@media (hover: hover) {
    .cx-dialog-root .cx-r1-section,
    .cx-dialog-root .cx-modal-group-v21,
    .cx-dialog-root .alert-email-form,
    .cx-dialog-root .alert-sms-form {
        transition: border-color .16s ease, box-shadow .16s ease, background-color .16s ease;
    }

    .cx-dialog-root .cx-r1-section:hover,
    .cx-dialog-root .cx-modal-group-v21:hover,
    .cx-dialog-root .alert-email-form:hover,
    .cx-dialog-root .alert-sms-form:hover {
        border-color: #b6c9d9 !important;
        box-shadow: 0 6px 16px rgba(44, 76, 108, .07);
    }
}

/* R5.6 - shared modal section system.
 * All section spacing, title, icon and description values live here so that
 * every Conexgo MudBlazor form uses the same visual rhythm.
 */
:root {
    --cx-modal-section-gap: 18px;
    --cx-modal-section-gap-mobile: 16px;
    --cx-modal-section-padding-x: 22px;
    --cx-modal-section-padding-y: 20px;
    --cx-modal-section-radius: 12px;
    --cx-modal-section-icon-size: 42px;
    --cx-modal-section-title-size: 1.08rem;
    --cx-modal-section-description-size: .93rem;
}

/* Every migrated modal uses these explicit section classes. */
.mud-dialog .cx-modal-layout-v21 .cx-r1-section,
.mud-dialog .cx-modal-layout-v21 fieldset.cx-modal-group-v21 {
    min-width: 0 !important;
    margin-right: 0 !important;
    margin-left: 0 !important;
    padding: var(--cx-modal-section-padding-y) var(--cx-modal-section-padding-x) calc(var(--cx-modal-section-padding-y) + 2px) !important;
    border: 1.6px solid #6f8da5 !important;
    border-radius: var(--cx-modal-section-radius) !important;
    background: #ffffff !important;
    box-shadow: 0 1px 3px rgba(44, 76, 108, .045) !important;
}

/* The gap is applied to the sections themselves, not to unrelated form rows. */
.mud-dialog .cx-modal-layout-v21 .cx-r1-section + .cx-r1-section,
.mud-dialog .cx-modal-layout-v21 fieldset.cx-modal-group-v21 + fieldset.cx-modal-group-v21,
.mud-dialog .cx-modal-layout-v21 form.cx-dialog-v17-form > .cx-r1-section + .cx-r1-section,
.mud-dialog .cx-modal-layout-v21 form.cx-dialog-v17-form > fieldset.cx-modal-group-v21 + fieldset.cx-modal-group-v21 {
    margin-top: var(--cx-modal-section-gap) !important;
}

.mud-dialog .cx-r1-section-title {
    width: auto !important;
    max-width: 100% !important;
    min-width: 0 !important;
    float: none !important;
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    margin: 0 0 8px !important;
    padding: 0 !important;
    color: #244563 !important;
    font-size: var(--cx-modal-section-title-size) !important;
    font-weight: 850 !important;
    line-height: 1.35 !important;
}

.mud-dialog .cx-r1-section-icon {
    width: var(--cx-modal-section-icon-size) !important;
    height: var(--cx-modal-section-icon-size) !important;
    min-width: var(--cx-modal-section-icon-size) !important;
    flex: 0 0 var(--cx-modal-section-icon-size) !important;
    display: inline-grid !important;
    place-items: center !important;
    border-radius: 10px !important;
    background: #e7f0f7 !important;
    color: #315f8a !important;
    font-size: 1.05rem !important;
    line-height: 1 !important;
}

.mud-dialog .cx-r1-section-icon > i,
.mud-dialog .cx-r1-section-icon > svg {
    margin: 0 !important;
    line-height: 1 !important;
}

.mud-dialog .cx-r1-section-description {
    min-width: 0 !important;
    display: flex !important;
    align-items: center !important;
    flex-wrap: nowrap !important;
    gap: 8px !important;
    margin: 0 0 18px !important;
    padding: 0 !important;
    color: #607284 !important;
    font-size: var(--cx-modal-section-description-size) !important;
    line-height: 1.45 !important;
}

.mud-dialog .cx-r1-section-description > i {
    margin: 0 !important;
    flex: 0 0 auto !important;
    color: #527493 !important;
    font-size: .84rem !important;
    line-height: 1 !important;
}

.mud-dialog .cx-r1-section-description > span {
    min-width: 0 !important;
    display: block !important;
    overflow: hidden !important;
    white-space: nowrap !important;
    text-overflow: ellipsis !important;
}

/* Shared field rows keep labels and controls aligned across every modal. */
.mud-dialog .cx-r1-form-row {
    min-width: 0 !important;
    align-items: start !important;
}

@media (max-width: 767.98px) {
    .mud-dialog .cx-modal-layout-v21 .cx-r1-section,
    .mud-dialog .cx-modal-layout-v21 fieldset.cx-modal-group-v21 {
        padding: 16px !important;
    }

    .mud-dialog .cx-modal-layout-v21 .cx-r1-section + .cx-r1-section,
    .mud-dialog .cx-modal-layout-v21 fieldset.cx-modal-group-v21 + fieldset.cx-modal-group-v21,
    .mud-dialog .cx-modal-layout-v21 form.cx-dialog-v17-form > .cx-r1-section + .cx-r1-section,
    .mud-dialog .cx-modal-layout-v21 form.cx-dialog-v17-form > fieldset.cx-modal-group-v21 + fieldset.cx-modal-group-v21 {
        margin-top: var(--cx-modal-section-gap-mobile) !important;
    }

    .mud-dialog .cx-r1-section-title {
        gap: 10px !important;
        font-size: 1rem !important;
    }

    .mud-dialog .cx-r1-section-icon {
        width: 38px !important;
        height: 38px !important;
        min-width: 38px !important;
        flex-basis: 38px !important;
        font-size: 1rem !important;
    }

    .mud-dialog .cx-r1-section-description {
        align-items: flex-start !important;
        margin-bottom: 14px !important;
        font-size: .88rem !important;
    }

    .mud-dialog .cx-r1-section-description > i {
        margin-top: .2rem !important;
    }

    .mud-dialog .cx-r1-section-description > span {
        overflow: visible !important;
        white-space: normal !important;
        text-overflow: clip !important;
    }
}

/* R5.8 - consolidated Device_Config modal system.
 * Reference: Device_SOSButton.razor.
 * Scope is explicit: only dialogs carrying .cx-device-config-dialog.
 */
:root {
    --cx-device-modal-section-gap: 14px;
    --cx-device-modal-section-gap-mobile: 12px;
    --cx-device-modal-content-width: 1180px;
    --cx-device-modal-control-width: 940px;
    --cx-device-modal-label-width: 220px;
    --cx-device-modal-row-gap: 12px;
    --cx-device-modal-column-gap: 14px;
}

.cx-device-config-dialog .cx-device-config-layout,
.cx-device-config-dialog .cx-device-config-form,
.cx-device-config-dialog form.cx-dialog-v17-form {
    width: 100%;
    min-width: 0;
    display: grid;
    gap: var(--cx-device-modal-section-gap) !important;
}

.cx-device-config-dialog .cx-device-config-layout > *,
.cx-device-config-dialog .cx-device-config-form > *,
.cx-device-config-dialog form.cx-dialog-v17-form > * {
    margin-top: 0;
    margin-bottom: 0;
}

.cx-device-config-dialog .cx-device-config-conditional-section {
    min-width: 0;
    gap: var(--cx-device-modal-section-gap);
}

.cx-device-config-dialog .cx-device-config-section,
.cx-device-config-dialog .cx-r1-section {
    width: 100%;
    min-width: 0;
    margin: 0 !important;
    padding: 15px 18px 17px !important;
    border: 1.6px solid #6f8da5 !important;
    border-radius: 10px !important;
    background: #ffffff !important;
    box-shadow: 0 1px 4px rgba(35, 60, 85, .05) !important;
}

.cx-device-config-dialog .cx-device-config-section-title,
.cx-device-config-dialog .cx-r1-section-title {
    max-width: 100% !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 9px !important;
    margin: 0 0 5px !important;
    padding: 0 !important;
    color: #244563 !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    line-height: 1.35 !important;
}

.cx-device-config-dialog .cx-device-config-section-icon,
.cx-device-config-dialog .cx-r1-section-icon {
    width: 32px !important;
    height: 32px !important;
    min-width: 32px !important;
    display: inline-grid !important;
    place-items: center !important;
    border-radius: 8px !important;
    background: #edf3f8 !important;
    color: #315f8a !important;
    font-size: 13px !important;
}

.cx-device-config-dialog .cx-device-config-section-description,
.cx-device-config-dialog .cx-r1-section-description {
    min-width: 0;
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    margin: 0 0 14px !important;
    color: #607284 !important;
    font-size: 12.5px !important;
    line-height: 1.45 !important;
}

.cx-device-config-dialog .cx-r1-section-description > i,
.cx-device-config-dialog .cx-device-config-section-description > i {
    flex: 0 0 auto;
    margin: 0 !important;
    color: #557a9b !important;
}

.cx-device-config-dialog .cx-r1-section-description > span,
.cx-device-config-dialog .cx-device-config-section-description > span {
    min-width: 0;
}

.cx-device-config-dialog .cx-r1-form-row,
.cx-device-config-dialog .cx-device-config-form-row {
    width: min(100%, var(--cx-device-modal-content-width));
    min-width: 0;
    margin: 0 auto var(--cx-device-modal-row-gap) !important;
    padding: 0 !important;
    display: grid !important;
    grid-template-columns: minmax(170px, var(--cx-device-modal-label-width)) minmax(0, var(--cx-device-modal-control-width));
    justify-content: center;
    align-items: start !important;
    gap: 8px var(--cx-device-modal-column-gap) !important;
}

.cx-device-config-dialog .cx-r1-form-row:last-child {
    margin-bottom: 0 !important;
}

.cx-device-config-dialog .cx-r1-form-row > [class*="col-"] {
    width: auto !important;
    max-width: none !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
}

.cx-device-config-dialog .cx-r1-form-row > .form-label:first-child {
    grid-column: 1;
    padding-top: 11px !important;
    text-align: right !important;
}

.cx-device-config-dialog .cx-r1-form-row > [class*="col-"]:not(.form-label:first-child) {
    grid-column: 2;
}

.cx-device-config-dialog .cx-r1-form-row > .col-md-12,
.cx-device-config-dialog .cx-r1-form-row > .col-lg-12,
.cx-device-config-dialog .cx-r1-form-row > .conexgo-last-updated-card {
    grid-column: 1 / -1 !important;
}

.cx-device-config-dialog .cx-r1-form-row > [class*="col-"]:empty {
    display: none !important;
}

.cx-device-config-dialog .cx-r1-form-row > [class*="col-"]:empty + * {
    grid-column: 1 / -1 !important;
}

.cx-device-config-dialog .form-label > label:not(.custom-switch),
.cx-device-config-dialog label[aspfor],
.cx-device-config-dialog .cx-device-config-field > label,
.cx-device-config-dialog .cx-device-config-setting-copy > label,
.cx-device-config-dialog .cx-device-config-days-label {
    color: #52677a !important;
    font-size: .76rem !important;
    font-weight: 800 !important;
    letter-spacing: .045em !important;
    line-height: 1.35 !important;
    text-transform: uppercase !important;
}

.cx-device-config-dialog .form-label > label:not(.custom-switch)::after,
.cx-device-config-dialog label[aspfor]::after,
.cx-device-config-dialog .cx-device-config-field > label::after,
.cx-device-config-dialog .cx-device-config-setting-copy > label::after {
    content: ":";
}

.cx-device-config-dialog input.form-control,
.cx-device-config-dialog select.form-control,
.cx-device-config-dialog .cx-native-control:not(textarea),
.cx-device-config-dialog .mud-input-control {
    width: 100% !important;
    min-width: 0 !important;
    max-width: var(--cx-device-modal-control-width) !important;
    border-color: #cfd9e3 !important;
    border-radius: 9px !important;
    box-shadow: none !important;
}

.cx-device-config-dialog textarea.form-control,
.cx-device-config-dialog textarea.cx-native-control,
.cx-device-config-dialog .cx-dialog-textarea {
    width: 100%;
    min-width: 0;
    max-width: var(--cx-device-modal-control-width);
    border-color: #cfd9e3 !important;
    border-radius: 9px !important;
    box-shadow: none !important;
}

.cx-device-config-dialog textarea.form-control,
.cx-device-config-dialog .cx-dialog-textarea,
.cx-device-config-dialog textarea.cx-native-control {
    height: 132px;
    min-height: 84px !important;
    max-height: none !important;
    resize: both !important;
    overflow: auto !important;
}

.cx-device-config-switch-stack {
    width: min(100%, var(--cx-device-modal-content-width));
    margin: 0 auto;
    display: grid;
    gap: 12px;
}

.cx-device-config-switch-card {
    width: min(100%, var(--cx-device-modal-content-width));
    min-width: 0;
    min-height: 68px;
    margin: 0 auto;
    padding: 14px 16px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 16px;
    border: 1px solid #d8e2ec;
    border-radius: 10px;
    background: #f7f9fc;
}

.cx-device-config-setting-copy {
    min-width: 0;
    display: grid;
    gap: 4px;
}

.cx-device-config-setting-copy > span {
    color: #667585;
    font-size: .88rem;
    line-height: 1.45;
}

.cx-device-config-switch-control {
    margin: 0 !important;
}

.cx-device-config-field-grid {
    width: min(100%, var(--cx-device-modal-content-width));
    margin: 18px auto 0;
    display: grid;
    grid-template-columns: minmax(0, var(--cx-device-modal-control-width));
    justify-content: center;
    gap: 16px;
}

.cx-device-config-field-grid--two {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.cx-device-config-field {
    min-width: 0;
    display: grid;
    gap: 7px;
}

.cx-device-config-field > small {
    color: #667585;
    font-size: .82rem;
    line-height: 1.45;
}

.cx-device-config-unit-control {
    max-width: 420px;
}

.cx-device-config-recipient-stack {
    width: min(100%, 900px);
    margin: 0 auto;
    display: grid;
    gap: 18px;
}

.cx-device-config-last-updated,
.cx-device-config-readonly-card,
.cx-device-config-status-card {
    width: min(100%, var(--cx-device-modal-content-width));
    min-width: 0;
    margin: 0 auto;
    padding: 14px 16px;
    border: 1px solid #d6e0ea;
    border-left: 4px solid #3e6a99;
    border-radius: 9px;
    background: #f2f7fb;
    color: #526170;
}

.cx-device-config-last-updated {
    display: grid;
    grid-template-columns: 34px minmax(0, 1fr);
    align-items: start;
    gap: 11px;
}

.cx-device-config-last-updated-icon {
    width: 32px;
    height: 32px;
    display: grid;
    place-items: center;
    border-radius: 8px;
    background: #e2edf6;
    color: #315f8a;
}

.cx-device-config-last-updated-label {
    color: #2c4c6c;
    font-size: .78rem;
    font-weight: 800;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.cx-device-config-last-updated-value {
    margin-top: 3px;
    color: #344054;
    font-size: .9rem;
    font-weight: 650;
}

.cx-device-config-last-updated-by {
    margin-top: 2px;
    color: #667585;
    font-size: .84rem;
}

.cx-device-config-status-card {
    display: flex;
    align-items: center;
    gap: 10px;
}

.cx-device-config-status-card--warning {
    border-left-color: #d69b41;
    background: #fff8ea;
    color: #8a5a14;
}

.cx-device-config-choice-grid {
    width: min(100%, var(--cx-device-modal-content-width));
    margin: 0 auto;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.cx-device-config-choice-grid--single {
    grid-template-columns: minmax(0, 1fr);
}

.cx-device-config-choice-card {
    position: relative;
    min-width: 0;
    min-height: 64px;
    padding: 14px 16px 14px 48px;
    display: flex;
    align-items: center;
    border: 1px solid #d5e0e9;
    border-radius: 10px;
    background: #f8fafc;
    cursor: pointer;
    transition: transform .16s ease, border-color .16s ease, background-color .16s ease, box-shadow .16s ease;
}

.cx-device-config-choice-card:hover {
    transform: translateY(-1px);
    border-color: #9fb7cb;
    background: #eef5fa;
    box-shadow: 0 5px 12px rgba(44, 76, 108, .08);
}

.cx-device-config-choice-card > input {
    position: absolute;
    width: 1px;
    height: 1px;
    opacity: 0;
}

.cx-device-config-choice-indicator {
    position: absolute;
    left: 16px;
    top: 50%;
    width: 20px;
    height: 20px;
    transform: translateY(-50%);
    border: 2px solid #9aabba;
    border-radius: 50%;
    background: #ffffff;
    box-shadow: inset 0 0 0 4px #ffffff;
}

.cx-device-config-choice-card > input:checked + .cx-device-config-choice-indicator {
    border-color: #315f8a;
    background: #315f8a;
}

.cx-device-config-choice-copy {
    min-width: 0;
    color: #344054;
    font-size: .92rem;
}

.cx-device-config-suboption-panel {
    margin: -2px 0 4px 24px;
    padding: 14px;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    border-left: 3px solid #9ab2c7;
    border-radius: 0 9px 9px 0;
    background: #f6f9fc;
}

.cx-device-config-check-card {
    position: relative;
    min-height: 40px;
    padding: 9px 11px 9px 40px;
    display: flex;
    align-items: center;
    border: 1px solid #d8e2ec;
    border-radius: 8px;
    background: #ffffff;
    cursor: pointer;
}

.cx-device-config-check-card > input {
    position: absolute;
    width: 1px;
    height: 1px;
    opacity: 0;
}

.cx-device-config-check-indicator {
    position: absolute;
    left: 11px;
    width: 20px;
    height: 20px;
    display: grid;
    place-items: center;
    border: 1px solid #a8b8c7;
    border-radius: 6px;
    background: #ffffff;
    color: transparent;
    font-size: 11px;
}

.cx-device-config-check-card > input:checked + .cx-device-config-check-indicator {
    border-color: #315f8a;
    background: #315f8a;
    color: #ffffff;
}

.cx-device-config-days-label {
    width: min(100%, var(--cx-device-modal-content-width));
    margin: 18px auto 9px;
}

.cx-device-config-day-grid {
    width: min(100%, var(--cx-device-modal-content-width));
    margin: 0 auto;
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    gap: 8px;
}

.cx-device-config-day-card {
    position: relative;
    min-height: 58px;
    padding: 10px 8px 10px 34px;
    display: flex;
    align-items: center;
    border: 1px solid #d8e2ec;
    border-radius: 9px;
    background: #f8fafc;
    color: #344054;
    font-size: .78rem;
    font-weight: 700;
    cursor: pointer;
}

.cx-device-config-day-card > input {
    position: absolute;
    width: 1px;
    height: 1px;
    opacity: 0;
}

.cx-device-config-day-check {
    position: absolute;
    left: 9px;
    width: 18px;
    height: 18px;
    display: grid;
    place-items: center;
    border: 1px solid #a8b8c7;
    border-radius: 5px;
    background: #ffffff;
    color: transparent;
    font-size: 10px;
}

.cx-device-config-day-card > input:checked + .cx-device-config-day-check {
    border-color: #315f8a;
    background: #315f8a;
    color: #ffffff;
}

.cx-device-config-dialog .cx-r1-sos-layout form {
    gap: var(--cx-device-modal-section-gap) !important;
}

.cx-device-config-dialog .cx-r1-sos-switch-row {
    width: min(100%, var(--cx-device-modal-content-width));
    margin: 0 auto;
    padding: 14px 16px;
    display: grid;
    grid-template-columns: minmax(170px, 220px) auto minmax(0, 1fr);
    align-items: center;
    gap: 16px;
    border: 1px solid #d8e2ec;
    border-radius: 10px;
    background: #f7f9fc;
}

.cx-device-config-dialog .cx-r2-sos-number-columns,
.cx-device-config-dialog .cx-r1-sos-number-row {
    width: min(100%, var(--cx-device-modal-content-width));
    margin-left: auto;
    margin-right: auto;
    display: grid;
    grid-template-columns: minmax(180px, 220px) minmax(220px, .9fr) minmax(300px, 1.4fr);
    align-items: center;
    gap: 12px 16px;
}

.cx-device-config-dialog .cx-r2-sos-number-columns {
    margin-bottom: 10px;
    padding: 0 0 9px;
    border-bottom: 1px solid #e0e7ee;
    color: #52677a;
    font-size: .74rem;
    font-weight: 800;
    letter-spacing: .045em;
    text-transform: uppercase;
}

.cx-device-config-dialog .cx-r1-sos-number-row {
    margin-bottom: 12px;
}

.cx-device-config-dialog .cx-r1-sos-number-row:last-child {
    margin-bottom: 0;
}

.cx-device-config-dialog .cx-r1-sos-number-row > label {
    text-align: right;
}

.cx-device-config-dialog .cx-r1-sos-last-updated {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 3px !important;
}

@media (min-width: 992px) {
    .cx-device-config-dialog .cx-r1-section-description > span,
    .cx-device-config-dialog .cx-device-config-section-description > span {
        white-space: nowrap;
    }
}

@media (max-width: 1100px) {
    .cx-device-config-day-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}

@media (max-width: 767.98px) {
    .cx-device-config-dialog .cx-device-config-layout,
    .cx-device-config-dialog .cx-modal-layout-v21,
    .cx-device-config-dialog form.cx-dialog-v17-form,
    .cx-device-config-dialog .cx-device-config-form {
        gap: var(--cx-device-modal-section-gap-mobile) !important;
    }

    .cx-device-config-dialog .cx-device-config-section,
    .cx-device-config-dialog .cx-r1-section {
        padding: 16px !important;
    }

    .cx-device-config-dialog .cx-device-config-section-title,
    .cx-device-config-dialog .cx-r1-section-title {
        font-size: 1rem !important;
    }

    .cx-device-config-dialog .cx-device-config-section-icon,
    .cx-device-config-dialog .cx-r1-section-icon {
        width: 38px !important;
        height: 38px !important;
        min-width: 38px !important;
    }

    .cx-device-config-dialog .cx-r1-section-description > span,
    .cx-device-config-dialog .cx-device-config-section-description > span {
        white-space: normal;
    }

    .cx-device-config-dialog .cx-r1-form-row,
    .cx-device-config-dialog .cx-device-config-form-row {
        grid-template-columns: minmax(0, 1fr);
        gap: 6px;
        margin-bottom: 16px !important;
    }

    .cx-device-config-dialog .cx-r1-form-row > .form-label:first-child,
    .cx-device-config-dialog .cx-r1-form-row > [class*="col-"]:not(.form-label:first-child) {
        grid-column: 1 !important;
        grid-row: auto !important;
        padding-top: 0 !important;
        text-align: left !important;
    }

    .cx-device-config-switch-card {
        grid-template-columns: minmax(0, 1fr) auto;
        padding: 13px;
    }

    .cx-device-config-field-grid--two,
    .cx-device-config-choice-grid,
    .cx-device-config-suboption-panel,
    .cx-device-config-day-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .cx-device-config-suboption-panel {
        margin-left: 0;
    }

    .cx-device-config-dialog .cx-r1-sos-switch-row {
        grid-template-columns: minmax(0, 1fr) auto;
    }

    .cx-device-config-dialog .cx-r1-sos-switch-description {
        grid-column: 1 / -1;
    }

    .cx-device-config-dialog .cx-r2-sos-number-columns {
        display: none;
    }

    .cx-device-config-dialog .cx-r1-sos-number-row {
        grid-template-columns: minmax(0, 1fr);
        padding-bottom: 14px;
        border-bottom: 1px solid #e4eaf0;
    }

    .cx-device-config-dialog .cx-r1-sos-number-row > label {
        text-align: left;
    }
}

/* R5.9 - release consistency layer. Explicit classes only. */
.cx-standard-form-dialog {
    width: min(1560px, calc(100vw - 20px)) !important;
    max-width: min(1560px, calc(100vw - 20px)) !important;
}

.cx-standard-form-dialog .cx-modal-layout-v21 {
    width: min(100%, 1160px) !important;
    margin: 0 auto !important;
}

.cx-standard-form-dialog form.cx-dialog-v17-form {
    min-width: 0 !important;
    margin: 0 !important;
    display: grid !important;
    gap: 0 !important;
}

.cx-standard-form-dialog .cx-r1-section {
    padding: 20px 22px 22px !important;
}

.cx-standard-form-dialog .cx-r1-form-row {
    width: min(100%, 1050px) !important;
    margin: 0 auto 12px !important;
    display: grid !important;
    grid-template-columns: minmax(170px, 210px) minmax(0, 1fr) !important;
    justify-content: center !important;
    align-items: start !important;
    gap: 7px 18px !important;
}

.cx-standard-form-dialog .cx-r1-form-row:last-child { margin-bottom: 0 !important; }

.cx-standard-form-dialog .cx-r1-form-row > [class*="col-"] {
    width: auto !important;
    max-width: none !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
}

.cx-standard-form-dialog .cx-r1-form-row > .form-label:first-child {
    padding-top: 10px !important;
    text-align: right !important;
}

.cx-standard-form-dialog .cx-r1-form-row > [class*="col-"]:not(.form-label:first-child) {
    grid-column: 2;
}

.cx-standard-form-dialog .cx-r1-section-description > span {
    overflow: visible !important;
    white-space: normal !important;
    text-overflow: clip !important;
}

.cx-standard-form-dialog input.form-control,
.cx-standard-form-dialog select.form-control {
    width: 100% !important;
    max-width: 100% !important;
}

.cx-standard-form-dialog textarea.form-control {
    width: 100%;
    max-width: 100%;
}

/* Broad but explicit normalization for every migrated Conexgo form row.
 * Complex Device Config dialogs keep their dedicated R5.8 grid.
 */
.cx-dialog-root:not(.cx-device-config-dialog) form.cx-dialog-v17-form {
    width: min(100%, 1120px) !important;
    margin-right: auto !important;
    margin-left: auto !important;
}

.cx-dialog-root:not(.cx-device-config-dialog) .cx-r1-form-row {
    width: min(100%, 1050px) !important;
    margin-right: auto !important;
    margin-left: auto !important;
}

/* Stable footer order for full forms. Confirmation dialogs keep their own two-button order. */
.cx-dialog-root:not(.cx-confirm-dialog) .cx-dialog-action--save { order: 10; }
.cx-dialog-root:not(.cx-confirm-dialog) .cx-dialog-action--save-close { order: 20; }
.cx-dialog-root:not(.cx-confirm-dialog) .cx-dialog-action--publish,
.cx-dialog-root:not(.cx-confirm-dialog) .cx-dialog-action--send,
.cx-dialog-root:not(.cx-confirm-dialog) .cx-dialog-action--acknowledge,
.cx-dialog-root:not(.cx-confirm-dialog) .cx-dialog-action--preview,
.cx-dialog-root:not(.cx-confirm-dialog) .cx-dialog-action--subscribe,
.cx-dialog-root:not(.cx-confirm-dialog) .cx-dialog-action--reset { order: 30; }
.cx-dialog-root:not(.cx-confirm-dialog) .cx-dialog-action--cancel { order: 80; }
.cx-dialog-root:not(.cx-confirm-dialog) .cx-dialog-action--delete,
.cx-dialog-root:not(.cx-confirm-dialog) .cx-dialog-action--unsubscribe { order: 90; }

@media (hover: hover) {
    .cx-dialog-root .cx-r1-section:hover,
    .cx-dialog-root .cx-modal-group-v21:hover,
    .cx-dialog-root .alert-email-form:hover,
    .cx-dialog-root .alert-sms-form:hover {
        border-color: #6f8da5 !important;
        background: #ffffff !important;
        box-shadow: 0 1px 4px rgba(35, 60, 85, .05) !important;
    }
}

@media (max-width: 767.98px) {
    .cx-standard-form-dialog {
        width: calc(100vw - 16px) !important;
        max-width: calc(100vw - 16px) !important;
    }

    .cx-standard-form-dialog .cx-r1-form-row {
        grid-template-columns: minmax(0, 1fr) !important;
        gap: 5px !important;
        margin-bottom: 14px !important;
    }

    .cx-standard-form-dialog .cx-r1-form-row > .form-label:first-child,
    .cx-standard-form-dialog .cx-r1-form-row > [class*="col-"]:not(.form-label:first-child) {
        grid-column: 1 !important;
        padding-top: 0 !important;
        text-align: left !important;
    }
}

/* CONEXGO R5.10 - Device Geofence tabs and Online Service consistency */
.device-geofence-dialog .device-geofence-tabs {
    width: min(100%, var(--cx-device-modal-content-width, 1120px));
    margin: 2px auto 20px;
    padding: 0 8px;
    display: flex;
    align-items: flex-end;
    gap: 6px;
    flex-wrap: nowrap;
    overflow-x: auto;
    overflow-y: hidden;
    border-bottom: 1px solid #d7e1ea;
    scrollbar-width: thin;
}

.device-geofence-dialog .device-geofence-tab.nav-link {
    min-width: 0;
    min-height: 52px;
    margin: 0 0 -1px;
    padding: 10px 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    flex: 0 0 auto;
    border: 1px solid transparent;
    border-bottom-color: #d7e1ea;
    border-radius: 10px 10px 0 0;
    background: transparent;
    color: #617184;
    font: inherit;
    font-size: .86rem;
    font-weight: 700;
    line-height: 1.2;
    text-decoration: none;
    white-space: nowrap;
    cursor: pointer;
    transition: background-color .16s ease, border-color .16s ease, color .16s ease, box-shadow .16s ease;
}

.device-geofence-dialog .device-geofence-tab.nav-link:hover:not(:disabled),
.device-geofence-dialog .device-geofence-tab.nav-link:focus-visible {
    border-color: #c8d7e4 #c8d7e4 #d7e1ea;
    background: #f6f8fb;
    color: #2c4c6c;
    outline: none;
}

.device-geofence-dialog .device-geofence-tab.nav-link.active,
.device-geofence-dialog .device-geofence-tab-active {
    border-color: #d7e1ea #d7e1ea #ffffff;
    background: #ffffff;
    color: #2c4c6c;
    box-shadow: inset 0 3px 0 #3e6a99;
}

.device-geofence-dialog .device-geofence-tab-number {
    color: #3e6a99;
    font-weight: 800;
}

.device-geofence-dialog .device-geofence-tab-name {
    max-width: 150px;
    overflow: hidden;
    text-overflow: ellipsis;
}

.device-geofence-dialog .device-geofence-tab-status {
    width: 22px;
    height: 22px;
    display: inline-grid;
    place-items: center;
    border-radius: 999px;
    font-size: 10px;
}

.device-geofence-dialog .device-geofence-tab-status-enabled {
    background: #e9f5ed;
    color: #347a4c;
}

.device-geofence-dialog .device-geofence-tab-status-disabled {
    background: #fbecef;
    color: #b14c59;
}

.cx-device-online-service .cx-device-config-field-grid--two {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

@media (max-width: 767.98px) {
    .device-geofence-dialog .device-geofence-tabs {
        margin-bottom: 16px;
        padding: 0 2px;
        gap: 4px;
    }

    .device-geofence-dialog .device-geofence-tab.nav-link {
        min-height: 46px;
        padding: 8px 10px;
        font-size: .8rem;
    }

    .device-geofence-dialog .device-geofence-tab-name {
        max-width: 105px;
    }

    .cx-device-online-service .cx-device-config-field-grid--two {
        grid-template-columns: minmax(0, 1fr);
    }
}

/* R6.7 - readable tables inside all Conexgo dialogs. */
.cx-dialog-root table th,
.cx-dialog-root table td,
.mud-dialog table th,
.mud-dialog table td {
    font-size: 14px !important;
    line-height: 1.5 !important;
}

@media (hover: hover) {
    .cx-dialog-root table tbody tr,
    .mud-dialog table tbody tr {
        transition: background-color .16s ease, box-shadow .16s ease;
    }

    .cx-dialog-root table tbody tr:hover > *,
    .mud-dialog table tbody tr:hover > * {
        background-color: #f3f7fa !important;
    }

    .cx-dialog-root table tbody tr:hover,
    .mud-dialog table tbody tr:hover {
        box-shadow: none !important;
    }
}

/* CONEXGO R6.2 — explicit centering and content integrity for migrated dialogs. */
.mud-dialog-container {
    padding: 16px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.mud-dialog.cx-dialog-root {
    margin: auto !important;
    height: auto !important;
    min-height: 0 !important;
}

.mud-dialog.cx-dialog-root > .mud-dialog-content,
.mud-dialog.cx-dialog-root > .dialog-background-surface.mud-dialog-content {
    width: 100% !important;
    min-width: 0 !important;
}

.mud-dialog.cx-dialog-root .cx-modal-layout-v21,
.mud-dialog.cx-dialog-root .cx-r1-section,
.mud-dialog.cx-dialog-root .cx-modal-group-v21 {
    min-width: 0 !important;
}

@media (max-width: 767.98px) {
    .mud-dialog-container {
        padding: 7px !important;
    }

    .mud-dialog.cx-dialog-root {
        width: calc(100vw - 14px) !important;
        max-width: calc(100vw - 14px) !important;
        max-height: calc(100dvh - 14px) !important;
    }
}

/* Keep only scoped modal rules. Do not globally restyle legacy Blazored forms. */
.mud-dialog .conexgo-title-icon-terms::before {
    content: "\f56c" !important;
}

.mud-dialog .conexgo-title-icon-geofence::before {
    content: "\f5ee" !important;
}

.mud-dialog .conexgo-title-icon-terms::before,
.mud-dialog .conexgo-title-icon-geofence::before {
    font-family: "Font Awesome 6 Free", "Font Awesome 5 Free", FontAwesome !important;
    font-weight: 900 !important;
}

/* Terms follows the same compact private-form envelope as Device_AddEdit. */
.cx-terms-dialog {
    width: min(1080px, calc(100vw - 32px)) !important;
    max-width: min(1080px, calc(100vw - 32px)) !important;
    max-height: min(86vh, 900px) !important;
    margin: auto !important;
}

.cx-terms-dialog .cx-terms-layout {
    width: 100% !important;
    max-width: none !important;
    margin: 0 auto !important;
}

.cx-terms-dialog .cx-terms-section {
    padding: 20px 22px 22px !important;
}

.cx-terms-dialog .cx-terms-document {
    max-height: min(54vh, 560px);
    margin-top: 14px;
    padding: 18px 20px;
    overflow-y: auto;
    overflow-x: hidden;
    border: 1px solid #d8e2eb;
    border-radius: 8px;
    background: #ffffff;
    color: var(--cx-dialog-text, #253858);
    line-height: 1.55;
    scrollbar-width: thin;
    scrollbar-color: #b7c4d0 transparent;
}

.cx-terms-dialog .cx-terms-document > :first-child {
    margin-top: 0 !important;
}

.cx-terms-dialog .cx-terms-document > :last-child {
    margin-bottom: 0 !important;
}

.cx-terms-dialog .cx-terms-document h1,
.cx-terms-dialog .cx-terms-document h2,
.cx-terms-dialog .cx-terms-document h3,
.cx-terms-dialog .cx-terms-document h4 {
    margin-top: 1.1em;
    margin-bottom: .5em;
    color: #2c4c6c;
    font-weight: 700;
    line-height: 1.25;
}

.cx-terms-dialog .cx-terms-document h1 {
    font-size: 1.55rem;
}

.cx-terms-dialog .cx-terms-document h2 {
    font-size: 1.25rem;
}

.cx-terms-dialog .cx-terms-document p,
.cx-terms-dialog .cx-terms-document li {
    font-size: .94rem;
    line-height: 1.6;
}

.cx-terms-dialog .cx-terms-loading {
    min-height: 200px;
    display: grid;
    place-items: center;
}

.cx-terms-dialog .cx-terms-error {
    min-height: 120px;
    margin-top: 14px;
    padding: 16px;
    display: flex;
    align-items: flex-start;
    gap: 10px;
    border: 1px solid #e7c8cb;
    border-radius: 8px;
    background: #fff7f8;
    color: #8b3f47;
}

/* Geofence stays specialized; only the common shell/button language is shared. */
.cx-r1-device-geofence.cx-standard-form-dialog .device-geofence-tabs {
    border-color: #dbe4ec !important;
}

.cx-r1-device-geofence.cx-standard-form-dialog .device-geofence-dialog-actions {
    gap: 10px !important;
}

@media (max-width: 767.98px) {
    .cx-terms-dialog {
        width: calc(100vw - 14px) !important;
        max-width: calc(100vw - 14px) !important;
        max-height: calc(100dvh - 14px) !important;
    }

    .cx-terms-dialog .cx-terms-section {
        padding: 14px !important;
    }

    .cx-terms-dialog .cx-terms-document {
        max-height: 50vh;
        padding: 15px;
    }
}

.cx-device-config-dialog .cx-r1-section.is-call-center-managed,
.cx-device-config-dialog .cx-r1-sos-numbers.is-call-center-managed {
    border-color: #7891a4 !important;
    background: #edf1f4 !important;
    box-shadow: none !important;
}

.cx-device-config-dialog .cx-r1-section.is-call-center-managed input:disabled,
.cx-device-config-dialog .cx-r1-sos-numbers.is-call-center-managed input:disabled {
    border-color: #c4ccd4 !important;
    background: #e4e8ec !important;
    color: #5c6873 !important;
    opacity: 1 !important;
}

.cx-device-config-dialog .cx-call-center-managed-notice {
    width: min(100%, var(--cx-device-modal-content-width));
    margin: 0 auto 13px !important;
    padding: 9px 11px !important;
    border: 1px solid #c5cfd8 !important;
    border-left: 3px solid #6f8190 !important;
    border-radius: 7px !important;
    background: #e5e9ed !important;
    color: #4c5c69 !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    line-height: 1.38 !important;
}

/* Legacy Blazored password/timezone dialogs use the same fieldset language as Terms. */
.cx-legacy-fieldset-modal {
    width: 100%;
    min-width: 0;
    color: #253858;
}

.cx-legacy-fieldset-modal .cx-modal-layout-v21 {
    width: 100%;
    display: grid;
    gap: 12px;
}

.cx-legacy-fieldset-modal .cx-r1-section {
    min-width: 0;
    margin: 0;
    padding: 15px 17px 17px;
    border: 1.5px solid #879fb1;
    border-radius: 9px;
    background: #fff;
    box-shadow: 0 1px 3px rgba(44, 76, 108, .04);
}

.cx-legacy-fieldset-modal .cx-r1-section-title {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin: 0 0 5px;
    padding: 0 6px;
    color: #2c4c6c;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.3;
}

.cx-legacy-fieldset-modal .cx-r1-section-icon {
    width: 30px;
    height: 30px;
    min-width: 30px;
    display: inline-grid;
    place-items: center;
    border-radius: 7px;
    background: #edf3f8;
    color: #315f8a;
    font-size: 12px;
}

.cx-legacy-fieldset-modal .cx-r1-section-description {
    margin: 0 0 13px;
    display: flex;
    align-items: flex-start;
    gap: 7px;
    color: #617386;
    font-size: 12.5px;
    line-height: 1.4;
}

.cx-legacy-fieldset-modal .cx-legacy-note {
    margin: 0 0 14px;
    padding: 9px 11px;
    display: flex;
    gap: 7px;
    border: 1px solid #d6e0e8;
    border-left: 3px solid #557a9b;
    border-radius: 7px;
    background: #f7fafc;
    color: #52677a;
    font-size: 12px;
    line-height: 1.4;
}

.cx-legacy-fieldset-modal .cx-legacy-form-row {
    display: grid;
    grid-template-columns: minmax(145px, 190px) minmax(0, 1fr);
    align-items: center;
    gap: 8px 14px;
    margin: 0 0 12px;
}

.cx-legacy-fieldset-modal .cx-legacy-form-label {
    margin: 0;
    color: #42566c;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.3;
    text-align: right;
}

.cx-legacy-fieldset-modal .form-control,
.cx-legacy-fieldset-modal .cx-control-field {
    width: 100% !important;
    max-width: 100% !important;
    min-height: 38px !important;
    font-size: 13px !important;
}

.cx-legacy-fieldset-modal .cx-legacy-fieldset-actions {
    margin-top: 12px;
    display: flex;
    justify-content: flex-end;
}

.cx-legacy-fieldset-modal .cx-legacy-fieldset-actions .mud-button-root {
    min-height: 36px !important;
    padding: 7px 13px !important;
    font-size: 12.5px !important;
    font-weight: 650 !important;
}

.cx-legacy-timezone-modal .cx-legacy-timezone-help {
    margin-top: 7px;
    color: #687787;
    font-size: 11.5px;
    line-height: 1.4;
}

/* Alert answer and notification view are information-heavy: keep them readable, not oversized. */
.mud-dialog.cx-r1-alert-answer {
    width: min(920px, calc(100vw - 32px)) !important;
    max-width: min(920px, calc(100vw - 32px)) !important;
    max-height: min(88dvh, 820px) !important;
}

.mud-dialog.cx-r1-alert-answer .mud-dialog-content {
    padding: 14px 16px !important;
}

.mud-dialog.cx-r1-alert-answer .cx-r1-section {
    padding: 14px 16px 16px !important;
}

.mud-dialog.cx-r1-alert-answer .cx-r1-section-title {
    font-size: 14px !important;
    font-weight: 700 !important;
}

.mud-dialog.cx-r1-alert-answer .cx-r1-section-icon {
    width: 30px !important;
    height: 30px !important;
    min-width: 30px !important;
    font-size: 12px !important;
}

.mud-dialog.cx-notification-view-dialog {
    width: min(840px, calc(100vw - 32px)) !important;
    max-width: min(840px, calc(100vw - 32px)) !important;
}

.mud-dialog.cx-notification-view-dialog .mud-dialog-content {
    padding: 14px 16px !important;
}

@media (max-width: 767.98px) {
    .cx-legacy-fieldset-modal .cx-legacy-form-row {
        grid-template-columns: minmax(0, 1fr);
        gap: 5px;
    }

    .cx-legacy-fieldset-modal .cx-legacy-form-label {
        text-align: left;
    }

    .mud-dialog.cx-r1-alert-answer,
    .mud-dialog.cx-notification-view-dialog {
        width: calc(100vw - 12px) !important;
        max-width: calc(100vw - 12px) !important;
    }
}

.mud-dialog.cx-dialog-root :is(
    .cx-r1-section,
    fieldset.cx-modal-group-v21,
    .cx-device-config-section,
    .alert-email-form,
    .alert-sms-form
) {
    border: 1.6px solid #6f8da5 !important;
    background: #ffffff !important;
    box-shadow: 0 1px 4px rgba(35, 60, 85, .05) !important;
}

.mud-dialog.cx-dialog-root :is(
    .cx-r1-section,
    fieldset.cx-modal-group-v21,
    .cx-device-config-section,
    .alert-email-form,
    .alert-sms-form
):is(:hover, :focus-within) {
    border-color: #6f8da5 !important;
    background: #ffffff !important;
    box-shadow: 0 1px 4px rgba(35, 60, 85, .05) !important;
}

/*
   Final alignment for the two compact rows at the bottom of Training_AddEdit.
   Goals:
   - same control start as every other field;
   - full-width Sort Order input for visual consistency;
   - one-line visibility label on desktop;
   - exact vertical centering of labels, number field and switch;
   - no special 23/77 grid override.
*/
html body.cx-design-system .cx-training-dialog
.cx-training-order-row,
html body.cx-design-system .cx-training-dialog
.cx-training-active-row {
    min-height: 52px !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    align-items: center !important;
}

html body.cx-design-system .cx-training-dialog
.cx-training-order-row + .cx-training-active-row {
    margin-top: 4px !important;
}

html body.cx-design-system .cx-training-dialog
.cx-training-bottom-label {
    min-height: 52px !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    align-self: center !important;
}

html body.cx-design-system .cx-training-dialog
.cx-training-bottom-label > label {
    margin: 0 !important;
    padding: 0 !important;
    line-height: 1.2 !important;
    text-align: right !important;
}

html body.cx-design-system .cx-training-dialog
.cx-training-visibility-label > label {
    white-space: nowrap !important;
}

html body.cx-design-system .cx-training-dialog
.cx-training-bottom-control {
    min-height: 52px !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    display: flex !important;
    align-items: center !important;
}

html body.cx-design-system .cx-training-dialog
.cx-training-order-row .cx-training-order-input {
    width: 100% !important;
    max-width: none !important;
    min-height: 40px !important;
    margin: 0 !important;
}

html body.cx-design-system .cx-training-dialog
.cx-training-switch-control {
    justify-content: flex-start !important;
}

html body.cx-design-system .cx-training-dialog
.cx-training-switch-control .cx-switch--training,
html body.cx-design-system .cx-training-dialog
.cx-training-switch-control .cx-switch {
    margin: 0 !important;
    align-self: center !important;
}

/* On narrower dialogs, allow the long visibility label to wrap naturally. */
@media (max-width: 900px) {
    html body.cx-design-system .cx-training-dialog
    .cx-training-visibility-label > label {
        white-space: normal !important;
    }
}

/* CONEXGO R2 — safe MudBlazor title icons.
   Explicit opt-in title classes only; no automatic DOM or business-layout inference. */

html body .mud-dialog .mud-dialog-title[class*="cx-modal-title-"],
html body .mud-dialog .dialog-background-title[class*="cx-modal-title-"] {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    min-width: 0 !important;
}

html body .mud-dialog .mud-dialog-title[class*="cx-modal-title-"]::before,
html body .mud-dialog .dialog-background-title[class*="cx-modal-title-"]::before {
    width: 30px !important;
    height: 30px !important;
    min-width: 30px !important;
    margin: 0 !important;
    display: inline-grid !important;
    place-items: center !important;
    flex: 0 0 30px !important;
    border: 1px solid rgba(255,255,255,.18) !important;
    border-radius: 8px !important;
    background: rgba(255,255,255,.10) !important;
    color: inherit !important;
    font-family: "Font Awesome 6 Free", "Font Awesome 5 Free", FontAwesome !important;
    font-size: 14px !important;
    font-style: normal !important;
    font-weight: 900 !important;
    line-height: 1 !important;
    text-rendering: auto !important;
    -webkit-font-smoothing: antialiased !important;
}

html body .mud-dialog .mud-dialog-title.cx-modal-title-account::before,
html body .mud-dialog .dialog-background-title.cx-modal-title-account::before { content: "\f007" !important; }

html body .mud-dialog .mud-dialog-title.cx-modal-title-account-fall::before,
html body .mud-dialog .dialog-background-title.cx-modal-title-account-fall::before { content: "\f21e" !important; }

html body .mud-dialog .mud-dialog-title.cx-modal-title-account-sos::before,
html body .mud-dialog .dialog-background-title.cx-modal-title-account-sos::before { content: "\f132" !important; }

html body .mud-dialog .mud-dialog-title.cx-modal-title-alert-answer::before,
html body .mud-dialog .dialog-background-title.cx-modal-title-alert-answer::before { content: "\f075" !important; }

html body .mud-dialog .mud-dialog-title.cx-modal-title-alert-view::before,
html body .mud-dialog .dialog-background-title.cx-modal-title-alert-view::before { content: "\f06e" !important; }

html body .mud-dialog .mud-dialog-title.cx-modal-title-battery::before,
html body .mud-dialog .dialog-background-title.cx-modal-title-battery::before { content: "\f243" !important; }

html body .mud-dialog .mud-dialog-title.cx-modal-title-blocked-account::before,
html body .mud-dialog .dialog-background-title.cx-modal-title-blocked-account::before { content: "\f502" !important; }

html body .mud-dialog .mud-dialog-title.cx-modal-title-callcenter::before,
html body .mud-dialog .dialog-background-title.cx-modal-title-callcenter::before { content: "\f590" !important; }

html body .mud-dialog .mud-dialog-title.cx-modal-title-checkin::before,
html body .mud-dialog .dialog-background-title.cx-modal-title-checkin::before { content: "\f0ae" !important; }

html body .mud-dialog .mud-dialog-title.cx-modal-title-contacts::before,
html body .mud-dialog .dialog-background-title.cx-modal-title-contacts::before { content: "\f2b9" !important; }

html body .mud-dialog .mud-dialog-title.cx-modal-title-country::before,
html body .mud-dialog .dialog-background-title.cx-modal-title-country::before { content: "\f57d" !important; }

html body .mud-dialog .mud-dialog-title.cx-modal-title-delete-account::before,
html body .mud-dialog .dialog-background-title.cx-modal-title-delete-account::before { content: "\f2ed" !important; }

html body .mud-dialog .mud-dialog-title.cx-modal-title-device::before,
html body .mud-dialog .dialog-background-title.cx-modal-title-device::before { content: "\f3cd" !important; }

html body .mud-dialog .mud-dialog-title.cx-modal-title-device-callcenter::before,
html body .mud-dialog .dialog-background-title.cx-modal-title-device-callcenter::before { content: "\f2a0" !important; }

html body .mud-dialog .mud-dialog-title.cx-modal-title-device-model::before,
html body .mud-dialog .dialog-background-title.cx-modal-title-device-model::before { content: "\f2db" !important; }

html body .mud-dialog .mud-dialog-title.cx-modal-title-document-delete::before,
html body .mud-dialog .dialog-background-title.cx-modal-title-document-delete::before { content: "\f2ed" !important; }

html body .mud-dialog .mud-dialog-title.cx-modal-title-document-edit::before,
html body .mud-dialog .dialog-background-title.cx-modal-title-document-edit::before { content: "\f044" !important; }

html body .mud-dialog .mud-dialog-title.cx-modal-title-document-view::before,
html body .mud-dialog .dialog-background-title.cx-modal-title-document-view::before { content: "\f06e" !important; }

html body .mud-dialog .mud-dialog-title.cx-modal-title-dot::before,
html body .mud-dialog .dialog-background-title.cx-modal-title-dot::before { content: "\f7c0" !important; }

html body .mud-dialog .mud-dialog-title.cx-modal-title-fall::before,
html body .mud-dialog .dialog-background-title.cx-modal-title-fall::before { content: "\f21e" !important; }

html body .mud-dialog .mud-dialog-title.cx-modal-title-geofence::before,
html body .mud-dialog .dialog-background-title.cx-modal-title-geofence::before { content: "\f5ee" !important; }

html body .mud-dialog .mud-dialog-title.cx-modal-title-group::before,
html body .mud-dialog .dialog-background-title.cx-modal-title-group::before { content: "\f0c0" !important; }

html body .mud-dialog .mud-dialog-title.cx-modal-title-language::before,
html body .mud-dialog .dialog-background-title.cx-modal-title-language::before { content: "\f1ab" !important; }

html body .mud-dialog .mud-dialog-title.cx-modal-title-location::before,
html body .mud-dialog .dialog-background-title.cx-modal-title-location::before { content: "\f3c5" !important; }

html body .mud-dialog .mud-dialog-title.cx-modal-title-manage-devices::before,
html body .mud-dialog .dialog-background-title.cx-modal-title-manage-devices::before { content: "\f03a" !important; }

html body .mud-dialog .mud-dialog-title.cx-modal-title-message::before,
html body .mud-dialog .dialog-background-title.cx-modal-title-message::before { content: "\f1d8" !important; }

html body .mud-dialog .mud-dialog-title.cx-modal-title-notification-edit::before,
html body .mud-dialog .dialog-background-title.cx-modal-title-notification-edit::before { content: "\f0a1" !important; }

html body .mud-dialog .mud-dialog-title.cx-modal-title-notification-view::before,
html body .mud-dialog .dialog-background-title.cx-modal-title-notification-view::before { content: "\f06e" !important; }

html body .mud-dialog .mud-dialog-title.cx-modal-title-offline::before,
html body .mud-dialog .dialog-background-title.cx-modal-title-offline::before { content: "\f05e" !important; }

html body .mud-dialog .mud-dialog-title.cx-modal-title-password-reset::before,
html body .mud-dialog .dialog-background-title.cx-modal-title-password-reset::before { content: "\f084" !important; }

html body .mud-dialog .mud-dialog-title.cx-modal-title-phone-events::before,
html body .mud-dialog .dialog-background-title.cx-modal-title-phone-events::before { content: "\f095" !important; }

html body .mud-dialog .mud-dialog-title.cx-modal-title-push-notification::before,
html body .mud-dialog .dialog-background-title.cx-modal-title-push-notification::before { content: "\f1d8" !important; }

html body .mud-dialog .mud-dialog-title.cx-modal-title-region::before,
html body .mud-dialog .dialog-background-title.cx-modal-title-region::before { content: "\f57d" !important; }

html body .mud-dialog .mud-dialog-title.cx-modal-title-report-preview::before,
html body .mud-dialog .dialog-background-title.cx-modal-title-report-preview::before { content: "\f201" !important; }

html body .mud-dialog .mud-dialog-title.cx-modal-title-report-subscribe::before,
html body .mud-dialog .dialog-background-title.cx-modal-title-report-subscribe::before { content: "\f274" !important; }

html body .mud-dialog .mud-dialog-title.cx-modal-title-ringtone::before,
html body .mud-dialog .dialog-background-title.cx-modal-title-ringtone::before { content: "\f028" !important; }

html body .mud-dialog .mud-dialog-title.cx-modal-title-sms::before,
html body .mud-dialog .dialog-background-title.cx-modal-title-sms::before { content: "\f075" !important; }

html body .mud-dialog .mud-dialog-title.cx-modal-title-sos::before,
html body .mud-dialog .dialog-background-title.cx-modal-title-sos::before { content: "\f132" !important; }

html body .mud-dialog .mud-dialog-title.cx-modal-title-speed::before,
html body .mud-dialog .dialog-background-title.cx-modal-title-speed::before { content: "\f625" !important; }

@media (max-width: 575.98px) {
    html body .mud-dialog .mud-dialog-title[class*="cx-modal-title-"]::before,
    html body .mud-dialog .dialog-background-title[class*="cx-modal-title-"]::before {
        width: 28px !important;
        height: 28px !important;
        min-width: 28px !important;
        flex-basis: 28px !important;
        font-size: 13px !important;
    }
}

/*
 * Conexgo responsive shell — consolidated.
 * Scope: top bar, sidebar, PagedList cards, dashboard and very small screens.
 * Page headers, dialogs, forms and device configuration are owned by explicit
 * component classes in conexgo-ui-foundation.css and local Razor styles.
 */

:root {
    --conexgo-mobile-header-bottom: 146px;
    --conexgo-mobile-gutter: 10px;
    --conexgo-action-size: 34px;
    --conexgo-control-radius: 8px;
}

/* ------------------------------------------------------------------
   Mobile shell and top bar
   ------------------------------------------------------------------ */
@media (max-width: 991.98px) {
    html body .app-header.app-header-modern {
        position: sticky !important;
        top: 0 !important;
        z-index: 1200 !important;
    }

    html body .app-content,
    html body .app-content .side-app {
        margin-top: 0 !important;
    }

    html body .app-header-modern .main-container {
        padding: 5px 8px !important;
    }

    html body .app-header-modern .app-header-main-row {
        row-gap: 2px !important;
    }

    html body .app-header-modern .app-header-left-zone {
        grid-template-columns: 38px minmax(0, 1fr) auto !important;
        gap: 6px !important;
    }

    html body .app-header-modern .app-sidebar__toggle {
        width: 38px !important;
        height: 38px !important;
        min-width: 38px !important;
        min-height: 38px !important;
        padding: 0 !important;
        display: inline-grid !important;
        place-items: center !important;
        line-height: 0 !important;
    }

    html body .app-header-modern .app-sidebar__toggle::before,
    html body .app-header-modern .app-sidebar__toggle::after {
        display: none !important;
        content: none !important;
    }

    html body .app-header-modern .app-sidebar__toggle > i {
        width: 100% !important;
        height: 100% !important;
        margin: 0 !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        font-size: 16px !important;
        line-height: 1 !important;
        transform: none !important;
    }

    html body .app-header-modern .app-header-brand-link {
        height: 38px !important;
        padding: 2px 4px !important;
    }

    html body .app-header-modern .header-brand-img {
        max-width: 108px !important;
        max-height: 29px !important;
    }

    html body .app-header-modern .topbar-version-pill {
        height: 38px !important;
        min-width: 88px !important;
        max-width: 104px !important;
        padding: 0 9px !important;
        gap: 6px !important;
        border-radius: 10px !important;
    }

    html body .app-header-modern .topbar-version-icon {
        width: 18px !important;
        min-width: 18px !important;
        font-size: 12px !important;
    }

    html body .app-header-modern .topbar-version-value {
        font-size: 9.5pt !important;
    }

    html body .app-header-modern .app-header-center-zone,
    html body .app-header-modern .app-header-right-zone {
        padding-top: 2px !important;
    }

    html body .app-header-modern .app-header-center-zone .nt-clock-card {
        min-height: 36px !important;
        height: 36px !important;
        border-radius: 10px !important;
    }

    html body .app-header-modern .app-header-right-zone,
    html body .app-header-modern .responsive-navbar {
        min-height: 38px !important;
    }

    html body .app-header-modern .responsive-navbar,
    html body .app-header-modern .app-header-action-zone,
    html body .app-header-modern .app-header-user-zone {
        gap: 6px !important;
        flex-wrap: nowrap !important;
    }

    html body .app-header-modern .nav-link.icon,
    html body .app-header-modern .notifications > .nav-link,
    html body .app-header-modern .message > .nav-link,
    html body .app-header-modern .profile-1 > .nav-link {
        width: 38px !important;
        height: 38px !important;
        min-width: 38px !important;
        min-height: 38px !important;
        padding: 0 !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        border-radius: 999px !important;
        line-height: 1 !important;
    }

    html body .app-header-modern .nav-link.icon > i,
    html body .app-header-modern .notifications > .nav-link > i,
    html body .app-header-modern .message > .nav-link > i {
        margin: 0 !important;
        padding: 0 !important;
        font-size: 15px !important;
        line-height: 1 !important;
    }

    html body .app-header-modern .profile-1 .profile-user {
        width: 38px !important;
        height: 38px !important;
        margin: 0 !important;
    }

    /* Header dropdowns behave like compact sheets below the top bar. */
    html body .app-header-modern .conexgo-header-dropdown-menu.show {
        position: fixed !important;
        top: calc(var(--conexgo-mobile-header-bottom) + 6px) !important;
        right: 10px !important;
        left: 10px !important;
        bottom: auto !important;
        width: auto !important;
        min-width: 0 !important;
        max-width: none !important;
        max-height: calc(100dvh - var(--conexgo-mobile-header-bottom) - 18px) !important;
        margin: 0 !important;
        overflow-x: hidden !important;
        overflow-y: auto !important;
        transform: none !important;
        border-radius: 12px !important;
        box-shadow: 0 18px 44px rgba(20, 37, 57, .22) !important;
        z-index: 1000010 !important;
        overscroll-behavior: contain;
    }

    html body .app-header-modern .conexgo-header-notifications .conexgo-header-dropdown-menu.show,
    html body .app-header-modern .conexgo-header-alerts .conexgo-header-dropdown-menu.show {
        max-width: 420px !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }

    html body .app-header-modern .conexgo-header-profile .conexgo-header-dropdown-menu.show,
    html body .app-header-modern .conexgo-header-language .conexgo-header-dropdown-menu.show,
    html body .app-header-modern .conexgo-header-servers .conexgo-header-dropdown-menu.show {
        max-width: 320px !important;
        margin-left: auto !important;
        margin-right: 0 !important;
    }

    html body .app-header-modern .conexgo-header-dropdown-menu .dropdown-item {
        min-height: 42px !important;
        font-size: 13px !important;
        line-height: 1.35 !important;
        white-space: normal !important;
        overflow-wrap: anywhere !important;
    }

    html body .app-header-modern .conexgo-header-dropdown-menu
        :is(.notifications-menu, .message-menu, .message-menu-scroll) {
        max-height: calc(100dvh - var(--conexgo-mobile-header-bottom) - 150px) !important;
    }
}

/* ------------------------------------------------------------------
   Sidebar
   ------------------------------------------------------------------ */
@media (max-width: 991.98px) {
    html body .app .app-sidebar-modern,
    html body .app.sidenav-toggled .app-sidebar-modern,
    html body .app.sidenav-toggled .app-sidebar-modern:hover {
        width: min(304px, calc(100vw - 48px)) !important;
        min-width: min(304px, calc(100vw - 48px)) !important;
        max-width: min(304px, calc(100vw - 48px)) !important;
    }

    html body .app-sidebar-modern .side-header {
        min-height: 60px !important;
        height: 60px !important;
        flex-basis: 60px !important;
        padding: 8px 9px 8px 12px !important;
    }

    html body .app-sidebar-modern .header-brand1 {
        min-height: 40px !important;
        height: 40px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: flex-start !important;
    }

    html body .app-sidebar-modern .header-brand1 .header-brand-img {
        display: none !important;
    }

    html body .app-sidebar-modern .header-brand1 .light-logo1 {
        display: block !important;
        width: auto !important;
        height: auto !important;
        max-width: 142px !important;
        max-height: 36px !important;
        opacity: 1 !important;
        visibility: visible !important;
        transform: none !important;
    }

    html body .app-sidebar-modern .app-sidebar-mobile-close {
        width: 36px !important;
        height: 36px !important;
        min-width: 36px !important;
        min-height: 36px !important;
        padding: 0 !important;
        display: inline-grid !important;
        place-items: center !important;
        line-height: 0 !important;
    }

    html body .app-sidebar-modern .app-sidebar-mobile-close::before,
    html body .app-sidebar-modern .app-sidebar-mobile-close::after {
        display: none !important;
        content: none !important;
    }

    html body .app-sidebar-modern .app-sidebar-mobile-close > i {
        width: 100% !important;
        height: 100% !important;
        margin: 0 !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        font-size: 16px !important;
        line-height: 1 !important;
        transform: none !important;
    }

    html body .app-sidebar-modern .main-sidemenu {
        padding-top: 6px !important;
    }

    html body .app-sidebar-modern .side-menu__item {
        min-height: 48px !important;
        padding: 6px 8px !important;
        gap: 9px !important;
    }

    html body .app-sidebar-modern .side-menu__icon {
        width: 38px !important;
        min-width: 38px !important;
        height: 38px !important;
        flex-basis: 38px !important;
        font-size: 15px !important;
        border-radius: 9px !important;
    }

    html body .app-sidebar-modern .side-menu__label {
        font-size: 13px !important;
        line-height: 1.25 !important;
    }

    html body .app-sidebar-modern .sub-category h3 {
        padding: 8px 11px !important;
        font-size: 11px !important;
    }
}

/* ------------------------------------------------------------------
   PagedList and responsive table cards
   ------------------------------------------------------------------ */
@media (max-width: 767.98px) {
    html body .conexgo-pagedlist-toolbar {
        gap: 10px !important;
    }

    html body .conexgo-pagedlist-filters,
    html body .conexgo-pagedlist-pagination {
        width: 100% !important;
    }

    html body .conexgo-pagedlist-pagination .pagination {
        justify-content: center !important;
    }

    html body .conexgo-pagedlist-mobile-cards,
    html body table.conexgo-responsive-table-cards {
        width: 100% !important;
        min-width: 0 !important;
        table-layout: fixed !important;
        border: 0 !important;
        background: transparent !important;
    }

    html body .conexgo-pagedlist-mobile-cards thead,
    html body table.conexgo-responsive-table-cards thead {
        position: absolute !important;
        width: 1px !important;
        height: 1px !important;
        margin: -1px !important;
        overflow: hidden !important;
        clip: rect(0, 0, 0, 0) !important;
        white-space: nowrap !important;
    }

    html body .conexgo-pagedlist-mobile-cards tbody,
    html body .conexgo-pagedlist-mobile-cards tbody tr,
    html body table.conexgo-responsive-table-cards tbody,
    html body table.conexgo-responsive-table-cards tbody tr {
        width: 100% !important;
        min-width: 0 !important;
        display: block !important;
    }

    html body .conexgo-pagedlist-mobile-cards tbody tr,
    html body table.conexgo-responsive-table-cards tbody tr {
        margin: 0 0 10px !important;
        overflow: hidden !important;
        border: 1px solid #dde5ee !important;
        border-radius: 10px !important;
        background: #ffffff !important;
        box-shadow: 0 2px 8px rgba(44, 76, 108, .06) !important;
    }

    html body .conexgo-pagedlist-mobile-cards tbody td:not(.d-none),
    html body table.conexgo-responsive-table-cards tbody td {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        padding: 9px 11px !important;
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
        gap: 5px !important;
        border: 0 !important;
        border-bottom: 1px solid #edf1f5 !important;
        background: transparent !important;
        color: #344054 !important;
        font-size: 12.5px !important;
        line-height: 1.35 !important;
        text-align: left !important;
        white-space: normal !important;
        overflow-wrap: anywhere !important;
        box-sizing: border-box !important;
    }

    html body .conexgo-pagedlist-mobile-cards tbody td:last-child,
    html body table.conexgo-responsive-table-cards tbody td:last-child {
        border-bottom: 0 !important;
    }

    html body .conexgo-pagedlist-mobile-cards tbody td:not(.d-none)::before,
    html body table.conexgo-responsive-table-cards tbody td::before {
        content: attr(data-label);
        width: 100% !important;
        display: block !important;
        color: #2c4c6c !important;
        font-size: 10.5px !important;
        font-weight: 800 !important;
        line-height: 1.2 !important;
        text-transform: uppercase !important;
        letter-spacing: .02em !important;
    }

    html body .conexgo-pagedlist-mobile-cards tbody td:empty,
    html body table.conexgo-responsive-table-cards tbody td:empty {
        display: none !important;
    }

    html body .conexgo-pagedlist-mobile-cards tbody td > *,
    html body table.conexgo-responsive-table-cards tbody td > * {
        min-width: 0 !important;
        max-width: 100% !important;
    }

    html body .conexgo-pagedlist-mobile-cards tbody td
        :is(.form-control, .form-select, select, input, textarea, .input-group, .dropdown, .btn-group),
    html body table.conexgo-responsive-table-cards tbody td
        :is(.form-control, .form-select, select, input, textarea, .input-group, .dropdown, .btn-group) {
        width: 100% !important;
        max-width: 100% !important;
    }

    html body .conexgo-pagedlist-mobile-cards tbody td .btn-list,
    html body .conexgo-pagedlist-mobile-cards tbody td.bstable-actions .btn-list,
    html body table.conexgo-responsive-table-cards tbody td .btn-list {
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
        display: flex !important;
        align-items: center !important;
        justify-content: flex-end !important;
        flex-wrap: wrap !important;
        gap: 6px !important;
        box-sizing: border-box !important;
        overflow: visible !important;
    }

    html body .conexgo-pagedlist-mobile-cards tbody td .btn-list .btn,
    html body table.conexgo-responsive-table-cards tbody td .btn-list .btn {
        width: 34px !important;
        height: 34px !important;
        min-width: 34px !important;
        min-height: 34px !important;
        padding: 0 !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        border-radius: 8px !important;
        line-height: 1 !important;
    }

    html body .cx-list-table-shell,
    html body .conexgo-responsive-table-shell {
        overflow: visible !important;
    }
}

/* Detail tables used inside dialogs. */
@media (max-width: 575.98px) {
    html body :is(.alert-answer-table, .alert-view-table) {
        width: 100% !important;
        table-layout: fixed !important;
    }

    html body :is(.alert-answer-table, .alert-view-table) tr {
        display: grid !important;
        grid-template-columns: minmax(92px, 34%) minmax(0, 1fr) !important;
        gap: 8px !important;
        padding: 8px 0 !important;
        border-bottom: 1px solid #edf1f5 !important;
    }

    html body :is(.alert-answer-table, .alert-view-table) th,
    html body :is(.alert-answer-table, .alert-view-table) td {
        width: auto !important;
        min-width: 0 !important;
        padding: 0 !important;
        border: 0 !important;
        overflow-wrap: anywhere !important;
        white-space: normal !important;
    }
}

/* ------------------------------------------------------------------
   Dashboard
   ------------------------------------------------------------------ */
@media (max-width: 1199.98px) {
    html body .conexgo-dashboard-mobile-shortcuts {
        display: none !important;
    }

    html body .conexgo-dashboard-smart-grid {
        position: static !important;
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 14px !important;
        overflow: visible !important;
    }

    html body .conexgo-dashboard-smart-grid > .conexgo-dashboard-smart-item {
        position: relative !important;
        inset: auto !important;
        width: 100% !important;
        min-width: 0 !important;
        height: auto !important;
        margin: 0 !important;
        visibility: visible !important;
        transform: none !important;
    }

    html body .conexgo-dashboard-smart-item > .conexgo-dashboard-resizable-card,
    html body .conexgo-dashboard-configuration-card {
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        resize: none !important;
        overflow: hidden !important;
    }

    html body .conexgo-dashboard-resizable-card > .card-body,
    html body .conexgo-dashboard-configuration-card > .card-body,
    html body .conexgo-dashboard-card-body-auto,
    html body .conexgo-dashboard-resizable-list {
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        overflow: visible !important;
        flex: 0 1 auto !important;
    }

    html body .conexgo-dashboard-resize-meta {
        display: none !important;
    }

    html body .conexgo-dashboard-ranked-item {
        width: 100% !important;
        min-width: 0 !important;
        min-height: 0 !important;
        height: auto !important;
        padding: 12px !important;
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
        align-items: start !important;
        justify-content: start !important;
        gap: 9px !important;
    }

    html body .conexgo-dashboard-ranked-meter {
        width: 100% !important;
        max-width: none !important;
        min-width: 0 !important;
        flex: 0 0 auto !important;
    }
}

@media (max-width: 575.98px) {
    html body .conexgo-dashboard-resizable-card > .card-header,
    html body .conexgo-dashboard-configuration-card > .card-header {
        padding: 9px 11px !important;
    }

    html body .conexgo-dashboard-card-header h4 {
        font-size: 15px !important;
        line-height: 1.2 !important;
    }

    html body .conexgo-dashboard-card-action {
        width: 30px !important;
        min-width: 30px !important;
        height: 30px !important;
        padding: 0 !important;
    }

    html body .conexgo-dashboard-resizable-card > .card-body,
    html body .conexgo-dashboard-configuration-card > .card-body {
        padding: 11px !important;
    }

    html body .conexgo-dashboard-filter-grid,
    html body .conexgo-dashboard-config-add-row,
    html body .conexgo-dashboard-config-actions,
    html body .conexgo-dashboard-visibility-panel {
        grid-template-columns: minmax(0, 1fr) !important;
    }
}

/* ------------------------------------------------------------------
   Small-screen finishing
   ------------------------------------------------------------------ */
@media (max-width: 359.98px) {
    :root {
        --conexgo-action-size: 33px;
        --conexgo-mobile-gutter: 7px;
    }

    html body .app-header-modern .header-brand-img {
        max-width: 84px !important;
    }

    html body .app-header-modern .topbar-version-pill {
        min-width: 82px !important;
        max-width: 92px !important;
        padding: 0 7px !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    html body *,
    html body *::before,
    html body *::after {
        scroll-behavior: auto !important;
    }
}

/*
 * Conexgo UI foundation — consolidated responsive rules.
 * Explicit semantic classes only. No :has(), nth-child business inference,
 * MutationObserver, or DOM reclassification.
 */

:root {
    --cx-navy: #2c4c6c;
    --cx-navy-strong: #244563;
    --cx-blue: #3e6a99;
    --cx-blue-hover: #31597f;
    --cx-green: #6b8f71;
    --cx-green-hover: #56765d;
    --cx-danger: #a44952;
    --cx-border: #d6e0ea;
    --cx-surface: #ffffff;
    --cx-soft: #f4f7fa;
    --cx-text: #253858;
    --cx-muted: #647487;
}

/* ---------- Page heading and action groups ---------- */
.cx-list-page-header,
.cx-page-header.cx-list-page-header,
.conexgo-list-page-header,
.cx-secondary-page-header,
.cx-log-list-page-header,
.device-page-header,
.conexgo-group-page-header {
    width: 100%;
    min-width: 0;
}

.cx-list-page-header-row,
.conexgo-list-page-header-row,
.device-page-header-layout {
    width: 100%;
    min-width: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}

.cx-page-title-zone,
.device-page-title-zone {
    min-width: 0;
    flex: 1 1 auto;
}

.cx-page-actions,
.cx-secondary-page-actions,
.conexgo-list-page-actions,
.cx-log-list-page-actions,
.device-page-actions,
.conexgo-group-page-actions {
    min-width: 0;
    margin-left: auto;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 8px !important;
    flex-wrap: wrap;
}

.cx-page-action {
    min-width: 40px;
    min-height: 40px;
    height: 40px;
    padding: 0 15px;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px;
    border: 1px solid transparent;
    border-radius: 8px;
    color: #fff !important;
    font-weight: 750;
    line-height: 1;
    white-space: nowrap;
    box-shadow: 0 2px 5px rgba(31, 62, 91, .08);
    transition: transform .16s ease, background-color .16s ease, border-color .16s ease, box-shadow .16s ease;
}

.cx-page-action > i,
.cx-page-action > span[class*="fa"],
.cx-page-action > span[class*="fe"] {
    width: 18px;
    height: 18px;
    margin: 0 !important;
    display: inline-grid !important;
    place-items: center !important;
    flex: 0 0 18px;
    font-size: 15px;
    line-height: 1;
}

.cx-page-action:hover,
.cx-page-action:focus-visible {
    transform: translateY(-1px);
    box-shadow: 0 5px 12px rgba(31, 62, 91, .15);
}

.cx-page-action:active {
    transform: translateY(0);
}

.cx-page-action--primary,
.cx-page-action--csv {
    border-color: var(--cx-blue) !important;
    background: var(--cx-blue) !important;
}

.cx-page-action--primary:hover,
.cx-page-action--primary:focus-visible,
.cx-page-action--csv:hover,
.cx-page-action--csv:focus-visible {
    border-color: var(--cx-blue-hover) !important;
    background: var(--cx-blue-hover) !important;
}

.cx-page-action--excel {
    border-color: var(--cx-green) !important;
    background: var(--cx-green) !important;
}

.cx-page-action--excel:hover,
.cx-page-action--excel:focus-visible {
    border-color: var(--cx-green-hover) !important;
    background: var(--cx-green-hover) !important;
}

/* ---------- Shared list toolbar ---------- */
.cx-list-toolbar,
.account-list-toolbar,
.alert-list-toolbar,
.notification-list-toolbar,
.report-list-toolbar,
.cx-log-list-toolbar,
.country-list-toolbar,
.device-model-list-toolbar,
.group-list-toolbar,
.state-prov-list-toolbar,
.string-resource-list-toolbar,
.device-card-header {
    width: 100%;
    min-width: 0;
    margin: 0;
    padding: 12px 14px !important;
    border: 0 !important;
    border-radius: 9px 9px 0 0 !important;
    background: var(--cx-navy) !important;
    color: #fff;
}

.cx-list-toolbar-row,
.account-list-toolbar-row,
.alert-list-toolbar-row,
.notification-list-toolbar-row,
.report-list-toolbar-row,
.country-list-toolbar-row,
.device-model-list-toolbar-row,
.group-list-toolbar-row,
.state-prov-list-toolbar-row,
.string-resource-list-toolbar-row,
.device-card-header-row {
    width: 100%;
    min-width: 0;
    margin: 0 !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(280px, 480px) !important;
    align-items: center;
    gap: 10px;
}

.cx-list-back-slot,
.cx-list-toolbar-back,
.account-list-toolbar-back,
.alert-list-toolbar-back,
.report-list-back-slot,
.country-list-toolbar-back,
.device-model-list-toolbar-back,
.group-list-toolbar-back,
.state-prov-list-toolbar-back,
.string-resource-list-toolbar-back,
.device-card-back {
    display: none !important;
}

.cx-list-search,
.cx-list-toolbar-search,
.account-list-toolbar-search,
.alert-list-search,
.notification-list-search,
.report-list-search,
.country-list-toolbar-search,
.device-model-list-toolbar-search,
.group-list-toolbar-search,
.state-prov-list-toolbar-search,
.string-resource-list-toolbar-search,
.device-card-search {
    width: min(100%, 480px) !important;
    min-width: 0;
    margin-left: auto !important;
    grid-column: 2 !important;
    justify-self: end;
}

.cx-list-search .dataTables_filter,
.cx-list-search .dataTables_filter > label,
.cx-list-toolbar-search .dataTables_filter,
.cx-list-toolbar-search .dataTables_filter > label,
.account-list-toolbar-search .dataTables_filter,
.account-list-toolbar-search .dataTables_filter > label,
.alert-list-search .dataTables_filter,
.alert-list-search .dataTables_filter > label,
.notification-list-search .dataTables_filter,
.notification-list-search .dataTables_filter > label,
.report-list-search .dataTables_filter,
.report-list-search .dataTables_filter > label,
.country-list-toolbar-search .dataTables_filter,
.country-list-toolbar-search .dataTables_filter > label,
.device-model-list-toolbar-search .dataTables_filter,
.device-model-list-toolbar-search .dataTables_filter > label,
.group-list-toolbar-search .dataTables_filter,
.group-list-toolbar-search .dataTables_filter > label,
.state-prov-list-toolbar-search .dataTables_filter,
.state-prov-list-toolbar-search .dataTables_filter > label,
.string-resource-list-toolbar-search .dataTables_filter,
.string-resource-list-toolbar-search .dataTables_filter > label,
.device-card-search .dataTables_filter,
.device-card-search .dataTables_filter > label {
    width: 100% !important;
    margin: 0 !important;
    display: block !important;
    text-align: right !important;
}

.notification-list-toolbar-row {
    grid-template-columns: minmax(0, 1fr) minmax(280px, 480px) !important;
}

.notification-list-toolbar-left {
    min-width: 0;
    display: flex !important;
    align-items: center;
    gap: 10px;
}

.notification-list-back-slot {
    display: none !important;
}

.notification-list-ack {
    min-height: 40px;
    height: 40px;
    padding: 0 14px;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px;
    border: 1px solid #8b9bac !important;
    border-radius: 8px;
    background: #8b9bac !important;
    color: #fff !important;
    font-weight: 750;
    line-height: 1;
    transition: transform .16s ease, background-color .16s ease, box-shadow .16s ease;
}

.notification-list-ack > i {
    margin: 0 !important;
    line-height: 1;
}

.notification-list-ack:hover,
.notification-list-ack:focus-visible {
    transform: translateY(-1px);
    border-color: #748698 !important;
    background: #748698 !important;
    box-shadow: 0 5px 12px rgba(31, 62, 91, .15);
}

/* ---------- Mobile back control ---------- */
.cx-responsive-back-button {
    width: 40px !important;
    height: 40px !important;
    min-width: 40px !important;
    min-height: 40px !important;
    margin: 0 !important;
    padding: 0 !important;
    display: none !important;
    place-items: center !important;
    border: 1px solid rgba(255, 255, 255, .38) !important;
    border-radius: 999px !important;
    background: var(--cx-blue-hover) !important;
    color: #fff !important;
    box-shadow: 0 4px 10px rgba(18, 47, 76, .25) !important;
    line-height: 1 !important;
    transition: transform .16s ease, background-color .16s ease, box-shadow .16s ease !important;
}

.cx-responsive-back-button > i {
    width: 100%;
    height: 100%;
    margin: 0 !important;
    display: grid !important;
    place-items: center !important;
    font-size: 15px !important;
    line-height: 1 !important;
}

.cx-responsive-back-button:hover,
.cx-responsive-back-button:focus-visible {
    background: var(--cx-navy-strong) !important;
    transform: translateY(-1px);
    box-shadow: 0 6px 14px rgba(18, 47, 76, .32) !important;
}

/* ---------- Modal semantic sections ---------- */
.cx-dialog-root .cx-modal-layout-v21 {
    width: 100%;
    min-width: 0;
    display: grid;
    gap: 24px !important;
}

.cx-dialog-root .cx-r1-section,
.cx-dialog-root .report-subscribe-section {
    min-width: 0;
    margin: 0 !important;
    padding: 18px 20px 20px !important;
    border: 1px solid var(--cx-border) !important;
    border-radius: 13px !important;
    background: var(--cx-surface) !important;
    box-shadow: 0 4px 14px rgba(35, 60, 85, .045) !important;
}

.cx-dialog-root .cx-r1-section + .cx-r1-section,
.cx-dialog-root .report-subscribe-section + .report-subscribe-section {
    margin-top: 0 !important;
}

.cx-dialog-root .cx-r1-section-title,
.cx-dialog-root .report-subscribe-section-title {
    max-width: 100%;
    margin: 0 0 6px !important;
    padding: 0 !important;
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    color: var(--cx-navy) !important;
    font-size: 18px !important;
    font-weight: 850 !important;
    line-height: 1.3 !important;
    letter-spacing: 0 !important;
}

.cx-dialog-root .cx-r1-section-icon,
.cx-dialog-root .report-subscribe-section-icon {
    width: 42px !important;
    height: 42px !important;
    min-width: 42px !important;
    margin: 0 !important;
    display: inline-grid !important;
    place-items: center !important;
    flex: 0 0 42px !important;
    border: 1px solid #d9e5ef !important;
    border-radius: 11px !important;
    background: #eaf2f8 !important;
    color: #315f8a !important;
    font-size: 17px !important;
    line-height: 1 !important;
}

.cx-dialog-root .cx-r1-section-icon > i,
.cx-dialog-root .report-subscribe-section-icon > i {
    margin: 0 !important;
    font-size: inherit !important;
    line-height: 1 !important;
}

.cx-dialog-root .cx-r1-section-description,
.cx-dialog-root .report-subscribe-section-description {
    margin: 0 0 18px !important;
    display: flex !important;
    align-items: flex-start !important;
    gap: 8px !important;
    color: var(--cx-muted) !important;
    font-size: 15px !important;
    line-height: 1.5 !important;
}

.cx-dialog-root .cx-r1-section-description > i {
    margin-top: 4px !important;
    color: #527493 !important;
    font-size: 13px !important;
}

.cx-dialog-root .cx-r1-form-row {
    margin-bottom: 16px !important;
}

.cx-dialog-root .cx-r1-form-row:last-child {
    margin-bottom: 0 !important;
}

.cx-dialog-root textarea.form-control,
.cx-dialog-root textarea.cx-dialog-textarea,
.cx-dialog-root .cx-dialog-textarea {
    width: 100%;
    min-height: 84px !important;
    max-height: none !important;
    resize: both !important;
    overflow: auto !important;
    box-sizing: border-box !important;
}

/* Do not set height with !important: the browser resize handle must own inline height. */
.cx-dialog-root textarea:not([style*="height"]),
.cx-dialog-root .cx-dialog-textarea:not([style*="height"]) {
    height: 132px;
}

/* ---------- Responsive ---------- */
@media (max-width: 991.98px) {
    .cx-list-page-header-row,
    .conexgo-list-page-header-row,
    .device-page-header-layout {
        align-items: flex-start;
    }
}

@media (max-width: 767.98px) {
    .cx-list-page-header-row,
    .conexgo-list-page-header-row,
    .device-page-header-layout {
        flex-direction: column;
        align-items: stretch !important;
        gap: 10px;
    }

    .cx-page-actions,
    .cx-secondary-page-actions,
    .conexgo-list-page-actions,
    .cx-log-list-page-actions,
    .device-page-actions,
    .conexgo-group-page-actions {
        width: 100%;
        margin-left: 0;
        justify-content: flex-end !important;
        gap: 8px !important;
    }

    .cx-page-action {
        width: 40px !important;
        min-width: 40px !important;
        max-width: 40px !important;
        height: 40px !important;
        padding: 0 !important;
        border-radius: 8px !important;
        overflow: hidden;
    }

    .cx-page-action > span:not([class*="fa"]):not([class*="fe"]) {
        display: none !important;
    }

    .cx-page-action > i,
    .cx-page-action > span[class*="fa"],
    .cx-page-action > span[class*="fe"] {
        width: 100% !important;
        height: 100% !important;
        flex: 0 0 100% !important;
        display: grid !important;
        place-items: center !important;
    }

    .cx-list-toolbar,
    .account-list-toolbar,
    .alert-list-toolbar,
    .notification-list-toolbar,
    .report-list-toolbar,
    .cx-log-list-toolbar,
    .country-list-toolbar,
    .device-model-list-toolbar,
    .group-list-toolbar,
    .state-prov-list-toolbar,
    .string-resource-list-toolbar,
    .device-card-header {
        padding: 10px !important;
    }

    .cx-list-toolbar-row,
    .account-list-toolbar-row,
    .alert-list-toolbar-row,
    .notification-list-toolbar-row,
    .report-list-toolbar-row,
    .country-list-toolbar-row,
    .device-model-list-toolbar-row,
    .group-list-toolbar-row,
    .state-prov-list-toolbar-row,
    .string-resource-list-toolbar-row,
    .device-card-header-row {
        grid-template-columns: 40px minmax(0, 1fr) !important;
        gap: 8px !important;
    }

    .cx-list-back-slot,
    .cx-list-toolbar-back,
    .account-list-toolbar-back,
    .alert-list-toolbar-back,
    .report-list-back-slot,
    .country-list-toolbar-back,
    .device-model-list-toolbar-back,
    .group-list-toolbar-back,
    .state-prov-list-toolbar-back,
    .string-resource-list-toolbar-back,
    .device-card-back {
        display: flex !important;
        align-items: center;
        justify-content: center;
        grid-column: 1;
    }

    .cx-list-search,
    .cx-list-toolbar-search,
    .account-list-toolbar-search,
    .alert-list-search,
    .notification-list-search,
    .report-list-search,
    .country-list-toolbar-search,
    .device-model-list-toolbar-search,
    .group-list-toolbar-search,
    .state-prov-list-toolbar-search,
    .string-resource-list-toolbar-search,
    .device-card-search {
        width: 100% !important;
        margin: 0 !important;
        grid-column: 2 !important;
        justify-self: stretch !important;
    }

    .notification-list-toolbar-row {
        grid-template-columns: 88px minmax(0, 1fr) !important;
    }

    .notification-list-toolbar-left {
        width: 88px;
        min-width: 88px;
        display: grid !important;
        grid-template-columns: 40px 40px;
        align-items: center;
        gap: 8px;
    }

    .notification-list-back-slot {
        width: 40px;
        min-width: 40px;
        display: flex !important;
        align-items: center;
        justify-content: center;
    }

    .notification-list-toolbar-left .cx-responsive-back-button {
        display: grid !important;
    }

    .notification-list-ack {
        width: 40px !important;
        min-width: 40px !important;
        max-width: 40px !important;
        height: 40px !important;
        padding: 0 !important;
        border-radius: 8px !important;
        overflow: hidden;
    }

    .notification-list-ack > span {
        display: none !important;
    }

    .notification-list-ack > i {
        width: 100%;
        height: 100%;
        display: grid;
        place-items: center;
    }

    .cx-responsive-back-button {
        display: inline-grid !important;
    }

    .cx-dialog-root .cx-modal-layout-v21 {
        gap: 16px !important;
    }

    .cx-dialog-root .cx-r1-section,
    .cx-dialog-root .report-subscribe-section {
        padding: 15px !important;
    }

    .cx-dialog-root .cx-r1-section-title,
    .cx-dialog-root .report-subscribe-section-title {
        gap: 10px !important;
        font-size: 17px !important;
    }

    .cx-dialog-root .cx-r1-section-icon,
    .cx-dialog-root .report-subscribe-section-icon {
        width: 38px !important;
        height: 38px !important;
        min-width: 38px !important;
        flex-basis: 38px !important;
        font-size: 15px !important;
    }

    .cx-dialog-root .cx-r1-section-description,
    .cx-dialog-root .report-subscribe-section-description {
        margin-bottom: 14px !important;
        font-size: 14px !important;
    }
}

/* ---------- Explicit secondary page headers ---------- */
.cx-page-header-with-mobile-back,
.cx-settings-page-header {
    min-width: 0;
}

.cx-page-header-mobile-back {
    display: none !important;
}

.cx-page-header-copy {
    min-width: 0;
}

/* ---------- Final mobile alignment safeguards ---------- */
@media (max-width: 767.98px) {
    .cx-list-page-header .cx-list-page-header-row,
    .cx-list-page-header .conexgo-list-page-header-row,
    .cx-list-page-header .device-page-header-layout {
        width: 100% !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
        justify-content: flex-start !important;
    }

    .cx-list-page-header .cx-page-actions,
    .cx-list-page-header .cx-secondary-page-actions,
    .cx-list-page-header .conexgo-list-page-actions,
    .cx-list-page-header .cx-log-list-page-actions,
    .cx-list-page-header .device-page-actions,
    .cx-list-page-header .conexgo-group-page-actions {
        width: 100% !important;
        max-width: none !important;
        margin: 0 !important;
        padding: 0 !important;
        display: flex !important;
        align-items: center !important;
        justify-content: flex-end !important;
        flex-wrap: nowrap !important;
        gap: 8px !important;
    }

    .cx-list-page-header .cx-page-actions > .d-inline-flex,
    .cx-list-page-header .conexgo-list-page-actions > .d-inline-flex,
    .cx-list-page-header .device-page-downloads {
        width: auto !important;
        margin: 0 !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        flex-wrap: nowrap !important;
        gap: 8px !important;
    }

    .cx-list-page-header .cx-page-action,
    .cx-list-page-header .device-page-action,
    .cx-list-page-header .device-page-downloads .btn,
    .cx-list-page-header .conexgo-alert-download-button {
        width: 40px !important;
        min-width: 40px !important;
        max-width: 40px !important;
        height: 40px !important;
        min-height: 40px !important;
        padding: 0 !important;
        display: inline-grid !important;
        place-items: center !important;
        flex: 0 0 40px !important;
        border-radius: 8px !important;
        line-height: 1 !important;
    }

    .cx-list-page-header .cx-page-action > i,
    .cx-list-page-header .device-page-action > i,
    .cx-list-page-header .device-page-downloads .btn > i,
    .cx-list-page-header .conexgo-alert-download-button > i {
        width: 100% !important;
        height: 100% !important;
        margin: 0 !important;
        display: grid !important;
        place-items: center !important;
        line-height: 1 !important;
    }

    .cx-list-page-header .cx-page-action > span:not([class*="fa"]):not([class*="fe"]),
    .cx-list-page-header .device-page-action > span:not([class*="fa"]):not([class*="fe"]),
    .cx-list-page-header .device-page-downloads .btn > span:not([class*="fa"]):not([class*="fe"]),
    .cx-list-page-header .conexgo-alert-download-button > span:not([class*="fa"]):not([class*="fe"]) {
        display: none !important;
    }

    .cx-page-header-with-mobile-back,
    .cx-settings-page-header {
        width: 100%;
        display: grid !important;
        grid-template-columns: 40px minmax(0, 1fr);
        align-items: start;
        gap: 10px;
    }

    .cx-page-header-with-mobile-back > .cx-page-header-mobile-back,
    .cx-settings-page-header > .cx-page-header-mobile-back {
        display: inline-grid !important;
        margin-top: 1px !important;
    }
}

/* R5.4 - shared soft hover for data rows. */
@media (hover: hover) {
    table.dataTable tbody tr,
    .table-hover tbody tr,
    .mud-table-body .mud-table-row {
        transition: background-color .16s ease, box-shadow .16s ease;
    }

    table.dataTable tbody tr:hover > td,
    table.dataTable tbody tr:hover > th,
    .table-hover tbody tr:hover > td,
    .table-hover tbody tr:hover > th,
    .mud-table-body .mud-table-row:hover .mud-table-cell {
        background-color: #f6f8fb !important;
    }

    table.dataTable tbody tr:hover,
    .table-hover tbody tr:hover,
    .mud-table-body .mud-table-row:hover {
        box-shadow: none !important;
    }
}

/* R5.9 - use the same hover family as the sidebar links. */
@media (hover: hover) {
    .account-list-card-body table tbody tr:hover > td,
    .account-list-card-body table tbody tr:hover > th,
    .cx-list-table-shell table tbody tr:hover > td,
    .cx-list-table-shell table tbody tr:hover > th {
        background: #f6f8fb !important;
        border-color: #e3e8ef !important;
    }
}

.alert-filter-inline {
    justify-content: flex-start !important;
}

/* R6.7 - consistent readable table typography and soft Conexgo row hover. */
.cx-list-table-shell table tbody td,
.card-body table tbody td,
table.dataTable tbody td,
.table tbody td {
    font-size: 14px;
    line-height: 1.5;
}

@media (hover: hover) {
    .cx-list-table-shell table tbody tr,
    .card-body table tbody tr,
    table.dataTable tbody tr,
    .table tbody tr,
    .mud-table-body .mud-table-row {
        transition: background-color .16s ease, box-shadow .16s ease;
    }

    .cx-list-table-shell table tbody tr:hover > *,
    .card-body table tbody tr:hover > *,
    table.dataTable tbody tr:hover > *,
    .table tbody tr:hover > *,
    .mud-table-body .mud-table-row:hover .mud-table-cell {
        background-color: #f3f7fa !important;
    }

    .cx-list-table-shell table tbody tr:hover,
    .card-body table tbody tr:hover,
    table.dataTable tbody tr:hover,
    .table tbody tr:hover,
    .mud-table-body .mud-table-row:hover {
        box-shadow: none !important;
    }
}

/* R6.9 - readable data-log hover details. */
.cx-design-system a.tip {
    position: relative;
    color: inherit !important;
    text-decoration: none !important;
}

.cx-design-system a.tip > span {
    position: absolute !important;
    z-index: 2500 !important;
    top: calc(100% + 8px) !important;
    left: 0 !important;
    width: min(420px, 78vw) !important;
    max-height: 280px !important;
    margin: 0 !important;
    padding: 12px 14px !important;
    overflow: auto !important;
    color: #26384b !important;
    -webkit-text-fill-color: #26384b !important;
    background: #ffffff !important;
    border: 1px solid #d4dee8 !important;
    border-radius: 10px !important;
    box-shadow: 0 12px 30px rgba(35, 60, 85, .16) !important;
    font-size: 13px !important;
    line-height: 1.5 !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
    opacity: 0 !important;
    visibility: hidden !important;
    transform: translateY(-4px) !important;
    transition: opacity .16s ease, transform .16s ease, visibility .16s ease !important;
    pointer-events: none !important;
}

.cx-design-system a.tip:hover > span,
.cx-design-system a.tip:focus-visible > span {
    display: block !important;
    opacity: 1 !important;
    visibility: visible !important;
    transform: translateY(0) !important;
}

@media (max-width: 767.98px) {
    .cx-design-system a.tip > span {
        position: fixed !important;
        top: auto !important;
        right: 16px !important;
        bottom: 16px !important;
        left: 16px !important;
        width: auto !important;
        max-height: 42vh !important;
    }
}

/* R7 — table readability and telemetry popovers. */
.cx-design-system .cx-list-table-shell table tbody td,
.cx-design-system .card-body table tbody td,
.cx-design-system table.dataTable tbody td,
.cx-design-system .table tbody td,
.cx-design-system .mud-table-body .mud-table-cell {
    color: var(--cx-text);
    font-size: 14px;
    line-height: 1.5;
}

@media (hover: hover) {
    .cx-design-system .cx-list-table-shell table tbody tr:hover > *,
    .cx-design-system .card-body table tbody tr:hover > *,
    .cx-design-system table.dataTable tbody tr:hover > *,
    .cx-design-system .table tbody tr:hover > *,
    .cx-design-system .mud-table-body .mud-table-row:hover .mud-table-cell {
        color: var(--cx-text) !important;
        background-color: #f3f7fa !important;
        -webkit-text-fill-color: currentColor;
    }
}

.cx-design-system .cx-data-log-trigger {
    display: inline;
    color: inherit;
    text-decoration: none;
    cursor: help;
    outline: none;
}

.cx-design-system .cx-data-log-trigger:focus-visible {
    border-radius: 4px;
    box-shadow: 0 0 0 3px rgba(62, 106, 153, .16);
}

.cx-design-system .cx-data-log-trigger > .cx-data-log-details {
    display: none !important;
}

.cx-rich-popover-surface {
    position: fixed;
    z-index: 10050;
    display: block;
    width: min(520px, calc(100vw - 24px));
    max-height: min(520px, calc(100vh - 24px));
    padding: 14px 16px;
    overflow: auto;
    color: #2b4564;
    -webkit-text-fill-color: #2b4564;
    background: #ffffff;
    border: 1px solid #cad7e3;
    border-radius: 10px;
    box-shadow: 0 14px 34px rgba(35, 60, 85, .18);
    font-size: 13px;
    line-height: 1.55;
    white-space: normal;
    overflow-wrap: anywhere;
    opacity: 0;
    visibility: hidden;
    transform: translateY(-3px) scale(.995);
    transform-origin: top left;
    pointer-events: none;
    transition: opacity .14s ease, transform .14s ease, visibility .14s ease;
}

.cx-rich-popover-surface.is-visible {
    opacity: 1;
    visibility: visible;
    transform: translateY(0) scale(1);
    pointer-events: auto;
}

.cx-rich-popover-surface,
.cx-rich-popover-surface * {
    color: #2b4564 !important;
    -webkit-text-fill-color: #2b4564 !important;
}

.cx-rich-popover-surface b,
.cx-rich-popover-surface strong {
    color: #294d70 !important;
    font-weight: 750;
}

@media (max-width: 767.98px) {
    .cx-rich-popover-surface {
        right: 12px !important;
        bottom: 12px !important;
        left: 12px !important;
        top: auto !important;
        width: auto;
        max-height: 46vh;
    }
}

/*
 * Conexgo Explicit Control System R6.10 - simple controls
 * Shared visual foundation for explicit Blazor controls.
 * No DOM cloning, no native select/date/time overlay, no browser picker dependency.
 */

.cx-design-system {
    --cx-control-primary-900: #24425f;
    --cx-control-primary-800: #2c4c6c;
    --cx-control-primary-700: #35628c;
    --cx-control-primary-600: #3e6a99;
    --cx-control-primary-100: #eaf1f7;
    --cx-control-primary-050: #f5f8fb;
    --cx-control-border: #d5dfe9;
    --cx-control-border-hover: #bdcad7;
    --cx-control-text: #263b52;
    --cx-control-muted: #66778a;
    --cx-control-surface: #ffffff;
    --cx-control-disabled: #f3f6f8;
    --cx-control-success: #6b9671;
    --cx-control-danger: #b24d59;
    --cx-control-warning: #ad7b35;
    --cx-control-radius: 10px;
    --cx-control-radius-popover: 14px;
    --cx-control-height: 46px;
    --cx-control-height-compact: 40px;
    --cx-control-focus: 0 0 0 2px rgba(62, 106, 153, .085);
    --cx-control-shadow: 0 14px 34px rgba(36, 66, 95, .13);
    --cx-control-ease: cubic-bezier(.2, .72, .26, 1);
}

/* --------------------------------------------------------------------------
   Shared fields
   -------------------------------------------------------------------------- */
.cx-design-system .cx-control-field {
    width: 100%;
    min-width: 0;
    display: grid;
    gap: 6px;
}

.cx-design-system .cx-control-label {
    margin: 0;
    color: var(--cx-control-text);
    font-size: .82rem;
    font-weight: 760;
    line-height: 1.35;
}

.cx-design-system .cx-control-help {
    margin-top: 1px;
    color: var(--cx-control-muted);
    font-size: .76rem;
    line-height: 1.42;
}

.cx-design-system .cx-control,
.cx-design-system .cx-control .mud-input-control,
.cx-design-system .cx-control .mud-input-control-input-container,
.cx-design-system .cx-control .mud-input {
    width: 100%;
    min-width: 0;
}

.cx-design-system .cx-control .mud-input-root,
.cx-design-system .cx-control .mud-input-slot {
    min-height: var(--cx-control-height);
    color: var(--cx-control-text);
    font-size: .94rem;
    font-weight: 560;
    line-height: 1.35;
}

.cx-design-system .cx-control--compact .mud-input-root,
.cx-design-system .cx-control--compact .mud-input-slot {
    min-height: var(--cx-control-height-compact);
    font-size: .88rem;
}

.cx-design-system .cx-control .mud-input-outlined-border {
    border-color: var(--cx-control-border) !important;
    border-radius: var(--cx-control-radius) !important;
    transition: border-color .16s var(--cx-control-ease),
                box-shadow .16s var(--cx-control-ease),
                background-color .16s var(--cx-control-ease);
}

.cx-design-system .cx-control .mud-input:hover:not(.mud-disabled) .mud-input-outlined-border {
    border-color: var(--cx-control-border-hover) !important;
}

.cx-design-system .cx-control .mud-input:focus-within .mud-input-outlined-border,
.cx-design-system .cx-control .mud-input.mud-input-focused .mud-input-outlined-border {
    border-color: var(--cx-control-primary-600) !important;
    box-shadow: var(--cx-control-focus) !important;
}

.cx-design-system .cx-control .mud-input-adornment {
    color: var(--cx-control-primary-700);
}

.cx-design-system .cx-control .mud-icon-button {
    width: 34px;
    height: 34px;
    margin-inline: 3px;
    border-radius: 9px;
    color: var(--cx-control-primary-700);
    transition: background-color .14s var(--cx-control-ease), color .14s var(--cx-control-ease), transform .14s var(--cx-control-ease);
}

.cx-design-system .cx-control .mud-icon-button:hover:not(.mud-disabled) {
    background: var(--cx-control-primary-050);
    color: var(--cx-control-primary-900);
    transform: translateY(-.5px);
}

.cx-design-system .cx-control .mud-input.mud-disabled,
.cx-design-system .cx-control .mud-input.mud-readonly {
    background: var(--cx-control-disabled);
    border-radius: var(--cx-control-radius);
    opacity: 1;
}

.cx-design-system .cx-control .mud-input.mud-disabled .mud-input-slot,
.cx-design-system .cx-control .mud-input.mud-readonly .mud-input-slot {
    color: #718093;
    -webkit-text-fill-color: #718093;
}

/* Existing non-Mud fields still use the same interaction language. */
.cx-design-system :is(input.form-control, textarea.form-control, select.form-control, select.form-select):not([type="checkbox"]):not([type="radio"]) {
    border-color: var(--cx-control-border);
    border-radius: var(--cx-control-radius);
    box-shadow: none;
    transition: border-color .16s var(--cx-control-ease), box-shadow .16s var(--cx-control-ease), background-color .16s var(--cx-control-ease);
}

.cx-design-system :is(input.form-control, textarea.form-control, select.form-control, select.form-select):not([type="checkbox"]):not([type="radio"]):hover:not(:disabled) {
    border-color: var(--cx-control-border-hover);
}

.cx-design-system :is(input.form-control, textarea.form-control, select.form-control, select.form-select):not([type="checkbox"]):not([type="radio"]):focus {
    border-color: var(--cx-control-primary-600);
    box-shadow: var(--cx-control-focus);
    outline: 0;
}

.cx-design-system textarea.form-control {
    min-height: 84px;
    max-height: none;
    resize: vertical;
}

/* --------------------------------------------------------------------------
   Select popovers
   -------------------------------------------------------------------------- */
.cx-design-system .cx-control-select .mud-select-input {
    padding-inline: 14px 42px !important;
}

.cx-design-system .cx-control-select-popover,
.cx-design-system .mud-popover.cx-control-select-popover {
    margin-top: 5px;
    padding: 6px;
    overflow: hidden;
    border: 1px solid #dce4ec;
    border-radius: var(--cx-control-radius-popover) !important;
    background: var(--cx-control-surface);
    box-shadow: var(--cx-control-shadow) !important;
    animation: cx-control-popover-in .16s var(--cx-control-ease) both;
}

.cx-design-system .cx-control-select-popover .mud-list {
    padding: 0;
}

.cx-design-system .cx-control-select-popover .mud-list-item {
    min-height: 42px;
    margin: 2px 0;
    padding: 8px 12px;
    border-radius: 10px;
    color: var(--cx-control-text);
    font-size: .9rem;
    line-height: 1.35;
    transition: background-color .12s var(--cx-control-ease), color .12s var(--cx-control-ease), transform .12s var(--cx-control-ease);
}

.cx-design-system .cx-control-select-popover .mud-list-item:hover,
.cx-design-system .cx-control-select-popover .mud-list-item:focus-visible {
    background: #f5f8fb;
    color: var(--cx-control-primary-900);
    transform: translateX(1px);
}

.cx-design-system .cx-control-select-popover .mud-list-item-selected,
.cx-design-system .cx-control-select-popover .mud-selected-item {
    background: #eaf1f7 !important;
    color: var(--cx-control-primary-800) !important;
    font-weight: 720;
}

.cx-design-system .cx-control-select-popover .mud-list-item-selected::after,
.cx-design-system .cx-control-select-popover .mud-selected-item::after {
    content: "\2713";
    margin-left: auto;
    color: var(--cx-control-primary-700);
    font-weight: 900;
}

/* --------------------------------------------------------------------------
   Date and time pickers
   -------------------------------------------------------------------------- */
.cx-design-system .cx-control-time .mud-input-slot,
.cx-design-system .cx-control-day .mud-input-slot {
    padding-inline: 14px 4px !important;
}

.cx-design-system .cx-control-datetime-grid {
    width: 100%;
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(0, 1.2fr) minmax(150px, .8fr);
    gap: 10px;
}

.cx-design-system .mud-picker-popover {
    overflow: hidden;
    border: 1px solid #dce4ec;
    border-radius: 16px !important;
    background: #fff;
    box-shadow: var(--cx-control-shadow) !important;
    animation: cx-control-popover-in .16s var(--cx-control-ease) both;
}

.cx-design-system .mud-picker {
    color: var(--cx-control-text);
    background: #fff;
}

.cx-design-system .mud-picker-toolbar {
    background: var(--cx-control-primary-800) !important;
    color: #fff !important;
}

.cx-design-system .mud-picker-calendar-header-transition,
.cx-design-system .mud-picker-calendar-header {
    color: var(--cx-control-primary-900);
    font-weight: 780;
}

.cx-design-system .mud-picker-calendar-header .mud-icon-button,
.cx-design-system .mud-picker .mud-icon-button {
    border-radius: 9px;
    color: var(--cx-control-primary-700);
    transition: background-color .12s var(--cx-control-ease), color .12s var(--cx-control-ease), transform .12s var(--cx-control-ease);
}

.cx-design-system .mud-picker-calendar-header .mud-icon-button:hover,
.cx-design-system .mud-picker .mud-icon-button:hover {
    background: var(--cx-control-primary-050);
    color: var(--cx-control-primary-900);
    transform: none;
}

.cx-design-system .mud-day {
    border-radius: 10px;
    transition: background-color .12s var(--cx-control-ease), color .12s var(--cx-control-ease), box-shadow .12s var(--cx-control-ease);
}

.cx-design-system .mud-day:hover:not(.mud-disabled):not(.mud-selected):not(.mud-button-filled-primary) {
    background: var(--cx-control-primary-050);
    color: var(--cx-control-primary-800);
}

.cx-design-system .mud-day.mud-selected,
.cx-design-system .mud-picker .mud-button-filled-primary {
    background: var(--cx-control-primary-600) !important;
    color: #fff !important;
    box-shadow: 0 5px 12px rgba(62, 106, 153, .18) !important;
}

.cx-design-system .mud-day.mud-current {
    box-shadow: inset 0 0 0 1px var(--cx-control-primary-600);
    color: var(--cx-control-primary-700);
    font-weight: 780;
}

.cx-design-system .mud-timepicker-hour,
.cx-design-system .mud-timepicker-minute,
.cx-design-system .mud-picker .mud-picker-stick {
    color: var(--cx-control-primary-700);
}

.cx-design-system .mud-picker .mud-picker-stick-dot,
.cx-design-system .mud-picker .mud-picker-stick {
    background-color: var(--cx-control-primary-600) !important;
}

/* --------------------------------------------------------------------------
   PagedList layout using the same explicit controls
   -------------------------------------------------------------------------- */
.cx-design-system .cx-paged-list .conexgo-pagedlist-toolbar {
    align-items: end;
}

.cx-design-system .cx-paged-list .conexgo-pagedlist-filters {
    align-items: end;
}

.cx-design-system .cx-paged-list .conexgo-pagedlist-field {
    gap: 6px;
}

.cx-design-system .cx-paged-list .conexgo-pagedlist-field-label {
    color: #667085;
    font-size: .78rem;
    font-weight: 760;
}

.cx-design-system .cx-paged-list .conexgo-pagedlist-size-select {
    width: 116px;
    min-width: 116px;
}

.cx-design-system .cx-paged-list .conexgo-pagedlist-range-select {
    width: 205px;
    min-width: 205px;
}

.cx-design-system .cx-paged-list .conexgo-pagedlist-custom {
    margin: 0 0 14px;
    padding: 18px;
    border: 1px solid #dce4ec;
    border-top: 3px solid var(--cx-control-success);
    border-radius: 12px;
    background: #f9fbfc;
}

.cx-design-system .cx-paged-list .conexgo-pagedlist-custom-fields {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 32px minmax(0, 1fr) auto;
    align-items: end;
    gap: 14px;
}

.cx-design-system .cx-paged-list .conexgo-pagedlist-custom-group {
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(180px, 1.35fr) minmax(130px, .65fr);
    align-items: end;
    gap: 12px;
}

.cx-design-system .cx-paged-list .conexgo-pagedlist-date-input,
.cx-design-system .cx-paged-list .conexgo-pagedlist-time-input {
    width: 100%;
    min-width: 0;
}

.cx-design-system .cx-paged-list .conexgo-pagedlist-custom-separator {
    height: var(--cx-control-height-compact);
    display: grid;
    place-items: center;
    color: #8391a0;
}

.cx-design-system .cx-paged-list .conexgo-pagedlist-apply {
    min-width: 120px;
    height: var(--cx-control-height-compact);
    padding: 0 18px;
    border: 1px solid var(--cx-control-primary-800);
    border-radius: 10px;
    background: var(--cx-control-primary-800);
    color: #fff;
    font-weight: 740;
    transition: background-color .14s var(--cx-control-ease), border-color .14s var(--cx-control-ease), transform .14s var(--cx-control-ease), box-shadow .14s var(--cx-control-ease);
}

.cx-design-system .cx-paged-list .conexgo-pagedlist-apply:hover {
    border-color: var(--cx-control-primary-900);
    background: var(--cx-control-primary-900);
    box-shadow: 0 5px 12px rgba(44, 76, 108, .12);
    transform: translateY(-.5px);
}

/* Page-specific widths without page-specific visual systems. */
.cx-design-system .cx-control--dashboard-filter,
.cx-design-system .cx-control--history,
.cx-design-system .cx-control--filter,
.cx-design-system .cx-control--form,
.cx-design-system .cx-control--report,
.cx-design-system .cx-control--timezone,
.cx-design-system .cx-control--admin,
.cx-design-system .cx-control--device-location,
.cx-design-system .cx-control--priority,
.cx-design-system .cx-control--language-picker,
.cx-design-system .cx-control--header-language {
    width: 100%;
}

/* --------------------------------------------------------------------------
   Checkboxes, radios, buttons and toasts retained from the shared system
   -------------------------------------------------------------------------- */
.cx-design-system input[type="checkbox"]:not(.custom-switch-input),
.cx-design-system input[type="radio"]:not(.custom-switch-input) {
    accent-color: var(--cx-control-primary-600);
}

.cx-design-system .btn,
.cx-design-system .mud-button-root,
.cx-design-system .cx-dialog-action {
    transition: background-color .15s var(--cx-control-ease), border-color .15s var(--cx-control-ease), color .15s var(--cx-control-ease), box-shadow .15s var(--cx-control-ease), transform .15s var(--cx-control-ease) !important;
}

.cx-design-system .btn:hover:not(:disabled),
.cx-design-system .mud-button-root:hover:not(.mud-disabled),
.cx-design-system .cx-dialog-action:hover:not(:disabled) {
    transform: translateY(-.5px);
}

.cx-design-system .btn:active:not(:disabled),
.cx-design-system .mud-button-root:active:not(.mud-disabled) {
    transform: none;
}

.cx-design-system .blazored-toast-container {
    width: min(390px, calc(100vw - 24px));
    padding: 12px;
}

.cx-design-system .conexgo-toast {
    position: relative;
    min-height: 76px;
    margin-bottom: 12px;
    padding: 17px 52px 17px 72px !important;
    display: flex !important;
    align-items: center !important;
    border: 1px solid #dce4ec !important;
    border-radius: 14px !important;
    background: #fff !important;
    color: var(--cx-control-text) !important;
    box-shadow: 0 16px 38px rgba(36, 66, 95, .16) !important;
    animation: cx-toast-in .22s var(--cx-control-ease) both;
}

.cx-design-system .conexgo-toast::before {
    content: "";
    position: absolute;
    inset: 0 auto 0 0;
    width: 6px;
    border-radius: 14px 0 0 14px;
    background: var(--cx-control-primary-600);
}

.cx-design-system .conexgo-toast .blazored-toast-icon {
    position: absolute !important;
    left: 18px !important;
    top: 50% !important;
    width: 38px !important;
    height: 38px !important;
    margin: 0 !important;
    display: grid !important;
    place-items: center !important;
    border-radius: 999px !important;
    transform: translateY(-50%) !important;
    background: var(--cx-control-primary-100) !important;
    color: var(--cx-control-primary-700) !important;
}

.cx-design-system .conexgo-toast .blazored-toast-message {
    margin: 0 !important;
    padding: 0 !important;
    color: var(--cx-control-text) !important;
    font-size: .91rem !important;
    font-weight: 700 !important;
    line-height: 1.42 !important;
}

.cx-design-system .conexgo-toast .blazored-toast-close {
    position: absolute !important;
    top: 13px !important;
    right: 13px !important;
    width: 30px !important;
    height: 30px !important;
    border: 1px solid var(--cx-control-border) !important;
    border-radius: 999px !important;
    display: grid !important;
    place-items: center !important;
    background: #fff !important;
    color: #8291a1 !important;
}

.cx-design-system .conexgo-toast-success::before { background: #689470; }
.cx-design-system .conexgo-toast-success .blazored-toast-icon { background: #edf6ef !important; color: #4f8259 !important; }
.cx-design-system .conexgo-toast-error::before { background: var(--cx-control-danger); }
.cx-design-system .conexgo-toast-error .blazored-toast-icon { background: #fbeff1 !important; color: var(--cx-control-danger) !important; }
.cx-design-system .conexgo-toast-warning::before { background: var(--cx-control-warning); }
.cx-design-system .conexgo-toast-warning .blazored-toast-icon { background: #fbf4e9 !important; color: var(--cx-control-warning) !important; }

@keyframes cx-control-popover-in {
    from { opacity: 0; transform: translateY(-3px) scale(.992); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes cx-toast-in {
    from { opacity: 0; transform: translateX(12px); }
    to { opacity: 1; transform: translateX(0); }
}

@media (max-width: 991.98px) {
    .cx-design-system .cx-paged-list .conexgo-pagedlist-custom-fields {
        grid-template-columns: minmax(0, 1fr);
    }

    .cx-design-system .cx-paged-list .conexgo-pagedlist-custom-separator {
        height: 18px;
        transform: rotate(90deg);
    }

    .cx-design-system .cx-paged-list .conexgo-pagedlist-apply {
        width: 100%;
    }
}

@media (max-width: 767.98px) {
    .cx-design-system .cx-control-datetime-grid,
    .cx-design-system .cx-paged-list .conexgo-pagedlist-custom-group {
        grid-template-columns: minmax(0, 1fr);
    }

    .cx-design-system .cx-paged-list .conexgo-pagedlist-size-select,
    .cx-design-system .cx-paged-list .conexgo-pagedlist-range-select {
        width: 100%;
        min-width: 0;
    }

    .cx-design-system .mud-picker-popover {
        max-width: calc(100vw - 24px) !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    .cx-design-system *,
    .cx-design-system *::before,
    .cx-design-system *::after {
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .01ms !important;
        scroll-behavior: auto !important;
    }
}

/* --------------------------------------------------------------------------
   Explicit boolean controls
   -------------------------------------------------------------------------- */
.cx-design-system .cx-checkbox,
.cx-design-system .cx-switch {
    min-width: 0;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    margin: 0;
    color: var(--cx-control-text);
    cursor: pointer;
    user-select: none;
}

.cx-design-system .cx-checkbox > .cx-boolean-native,
.cx-design-system .cx-switch > .cx-boolean-native {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    opacity: 0;
    pointer-events: none;
}

.cx-design-system .cx-checkbox-box {
    width: 21px;
    height: 21px;
    flex: 0 0 21px;
    display: grid;
    place-items: center;
    border: 1.5px solid var(--cx-control-border-hover);
    border-radius: 6px;
    background: #fff;
    color: #fff;
    transition: border-color .14s var(--cx-control-ease), background-color .14s var(--cx-control-ease), box-shadow .14s var(--cx-control-ease);
}

.cx-design-system .cx-checkbox-box i {
    font-size: 10px;
    line-height: 1;
    transform: scale(.7);
    opacity: 0;
    transition: transform .14s var(--cx-control-ease), opacity .14s var(--cx-control-ease);
}

.cx-design-system .cx-checkbox:hover .cx-checkbox-box {
    border-color: #9fb2c5;
    background: #fbfcfd;
}

.cx-design-system .cx-checkbox > .cx-boolean-native:checked + .cx-checkbox-box {
    border-color: var(--cx-control-primary-600);
    background: var(--cx-control-primary-600);
}

.cx-design-system .cx-checkbox > .cx-boolean-native:checked + .cx-checkbox-box i {
    transform: scale(1);
    opacity: 1;
}

.cx-design-system .cx-checkbox > .cx-boolean-native:focus-visible + .cx-checkbox-box,
.cx-design-system .cx-switch > .cx-boolean-native:focus-visible + .cx-switch-track {
    box-shadow: var(--cx-control-focus);
}

.cx-design-system .cx-checkbox-label,
.cx-design-system .cx-switch-label {
    min-width: 0;
    color: var(--cx-control-text);
    font-size: .88rem;
    font-weight: 680;
    line-height: 1.35;
}

.cx-design-system .cx-switch-track {
    position: relative;
    width: 46px;
    height: 26px;
    flex: 0 0 46px;
    border: 1px solid #c5d0db;
    border-radius: 999px;
    background: #e7edf2;
    transition: border-color .16s var(--cx-control-ease), background-color .16s var(--cx-control-ease), box-shadow .16s var(--cx-control-ease);
}

.cx-design-system .cx-switch-thumb {
    position: absolute;
    top: 3px;
    left: 3px;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 1px 4px rgba(36, 66, 95, .18);
    transition: transform .18s var(--cx-control-ease);
}

.cx-design-system .cx-switch:hover .cx-switch-track {
    border-color: #acbccb;
    background: #e1e8ee;
}

.cx-design-system .cx-switch > .cx-boolean-native:checked + .cx-switch-track {
    border-color: var(--cx-control-primary-700);
    background: var(--cx-control-primary-700);
}

.cx-design-system .cx-switch > .cx-boolean-native:checked + .cx-switch-track .cx-switch-thumb {
    transform: translateX(20px);
}

.cx-design-system .cx-switch-copy {
    min-width: 0;
    display: grid;
    gap: 2px;
}

.cx-design-system .cx-switch-help,
.cx-design-system .cx-boolean-help {
    color: var(--cx-control-muted);
    font-size: .78rem;
    line-height: 1.42;
}

.cx-design-system .cx-switch--compact {
    gap: 0;
}

.cx-design-system .cx-switch--compact .cx-switch-copy {
    display: none;
}

.cx-design-system .cx-checkbox > .cx-boolean-native:disabled + .cx-checkbox-box,
.cx-design-system .cx-switch > .cx-boolean-native:disabled + .cx-switch-track {
    opacity: .62;
    cursor: not-allowed;
}

.cx-design-system .conexgo-dashboard-visibility-option {
    width: 100%;
    justify-content: space-between;
}

.cx-design-system .conexgo-dashboard-visibility-option .cx-checkbox-label {
    order: -1;
}

/* Global fallback for legacy boolean inputs that have not yet been migrated. */
.cx-design-system input[type="checkbox"]:not(.custom-switch-input):not(.cx-boolean-native),
.cx-design-system input[type="radio"]:not(.custom-switch-input):not(.cx-boolean-native) {
    width: 20px;
    height: 20px;
    margin: 0;
    display: inline-grid;
    place-content: center;
    border: 1.5px solid var(--cx-control-border-hover);
    background: #fff;
    appearance: none;
    -webkit-appearance: none;
    cursor: pointer;
    vertical-align: middle;
    transition: border-color .14s var(--cx-control-ease), background-color .14s var(--cx-control-ease), box-shadow .14s var(--cx-control-ease);
}

.cx-design-system input[type="checkbox"]:not(.custom-switch-input):not(.cx-boolean-native) {
    border-radius: 6px;
}

.cx-design-system input[type="radio"]:not(.custom-switch-input):not(.cx-boolean-native) {
    border-radius: 50%;
}

.cx-design-system input[type="checkbox"]:not(.custom-switch-input):not(.cx-boolean-native)::before {
    content: "";
    width: 9px;
    height: 5px;
    border-left: 2px solid #fff;
    border-bottom: 2px solid #fff;
    opacity: 0;
    transform: translateY(-1px) rotate(-45deg) scale(.75);
    transition: opacity .12s var(--cx-control-ease), transform .12s var(--cx-control-ease);
}

.cx-design-system input[type="radio"]:not(.custom-switch-input):not(.cx-boolean-native)::before {
    content: "";
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #fff;
    opacity: 0;
    transform: scale(.65);
    transition: opacity .12s var(--cx-control-ease), transform .12s var(--cx-control-ease);
}

.cx-design-system input[type="checkbox"]:not(.custom-switch-input):not(.cx-boolean-native):checked,
.cx-design-system input[type="radio"]:not(.custom-switch-input):not(.cx-boolean-native):checked {
    border-color: var(--cx-control-primary-600);
    background: var(--cx-control-primary-600);
}

.cx-design-system input[type="checkbox"]:not(.custom-switch-input):not(.cx-boolean-native):checked::before,
.cx-design-system input[type="radio"]:not(.custom-switch-input):not(.cx-boolean-native):checked::before {
    opacity: 1;
    transform: translateY(-1px) rotate(-45deg) scale(1);
}

.cx-design-system input[type="radio"]:not(.custom-switch-input):not(.cx-boolean-native):checked::before {
    transform: scale(1);
}

.cx-design-system input[type="checkbox"]:not(.custom-switch-input):not(.cx-boolean-native):hover:not(:disabled),
.cx-design-system input[type="radio"]:not(.custom-switch-input):not(.cx-boolean-native):hover:not(:disabled) {
    border-color: #9fb2c5;
    background-color: #fbfcfd;
}

.cx-design-system input[type="checkbox"]:not(.custom-switch-input):not(.cx-boolean-native):checked:hover:not(:disabled),
.cx-design-system input[type="radio"]:not(.custom-switch-input):not(.cx-boolean-native):checked:hover:not(:disabled) {
    border-color: var(--cx-control-primary-700);
    background-color: var(--cx-control-primary-700);
}

.cx-design-system input[type="checkbox"]:not(.custom-switch-input):not(.cx-boolean-native):focus-visible,
.cx-design-system input[type="radio"]:not(.custom-switch-input):not(.cx-boolean-native):focus-visible {
    outline: 0;
    box-shadow: var(--cx-control-focus);
}

/* ==========================================================================
   CONEXGO GLOBAL FORM CONTROL FOUNDATION R7
   --------------------------------------------------------------------------
   Authoritative shared layer for the entire portal.

   Select rule:
   - CxSelect and CxTimePicker render native Bootstrap form-select controls.
   - The arrow below is the Bootstrap 5.1 form-select SVG, not an injected icon.
   - No duplicate MudBlazor adornment, pseudo-element or JavaScript wrapper.
   ========================================================================== */

.cx-design-system {
    --cx-r7-control-height: 44px;
    --cx-r7-control-radius: 10px;
    --cx-r7-border: #cfdbe6;
    --cx-r7-border-hover: #aebfd0;
    --cx-r7-surface: #ffffff;
    --cx-r7-surface-subtle: #f7f9fc;
    --cx-r7-text: #243a52;
    --cx-r7-muted: #66788b;
    --cx-r7-primary: #3e6a99;
    --cx-r7-primary-dark: #2c4c6c;
    --cx-r7-success: #6b9671;
    --cx-r7-focus-ring: 0 0 0 3px rgba(62, 106, 153, .115);
    --cx-r7-shadow-soft: 0 4px 12px rgba(36, 66, 95, .055);
    --cx-r7-shadow-focus: 0 8px 20px rgba(36, 66, 95, .09);
    --cx-r7-ease: cubic-bezier(.2, .72, .26, 1);
}

/* Shared field structure */
.cx-design-system .cx-control-field {
    width: 100%;
    min-width: 0;
    display: grid;
    align-content: end;
    gap: 7px;
}

.cx-design-system .cx-control-label,
.cx-design-system .conexgo-pagedlist-field-label,
.cx-design-system .device-filter-label {
    margin: 0;
    color: #39526c;
    font-size: 12px;
    font-weight: 760;
    line-height: 1.25;
}

.cx-design-system .cx-control-help {
    margin: 0;
    color: var(--cx-r7-muted);
    font-size: 12px;
    line-height: 1.42;
}

.cx-design-system .cx-native-select-shell {
    position: relative;
    width: 100%;
    min-width: 0;
}

/* Bootstrap-native selects: exact Bootstrap 5.1 arrow and geometry */
.cx-design-system select.form-select:not([multiple]):not([size]),
.cx-design-system .cx-native-select {
    width: 100% !important;
    min-width: 0 !important;
    height: var(--cx-r7-control-height) !important;
    min-height: var(--cx-r7-control-height) !important;
    max-height: var(--cx-r7-control-height) !important;
    padding: 0 2.75rem 0 .875rem !important;
    display: block !important;
    overflow: hidden;
    border: 1px solid var(--cx-r7-border) !important;
    border-radius: var(--cx-r7-control-radius) !important;
    background-color: var(--cx-r7-surface) !important;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23596f85' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e") !important;
    background-repeat: no-repeat !important;
    background-position: right .875rem center !important;
    background-size: 16px 12px !important;
    color: var(--cx-r7-text) !important;
    font-family: inherit;
    font-size: 14px !important;
    font-weight: 650 !important;
    line-height: 1.25 !important;
    text-overflow: ellipsis;
    white-space: nowrap;
    appearance: none !important;
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    cursor: pointer;
    box-shadow: var(--cx-r7-shadow-soft) !important;
    transition:
        border-color .16s var(--cx-r7-ease),
        background-color .16s var(--cx-r7-ease),
        box-shadow .16s var(--cx-r7-ease),
        transform .16s var(--cx-r7-ease) !important;
}

.cx-design-system select.form-select:not([multiple]):not([size]):hover:not(:disabled),
.cx-design-system .cx-native-select:hover:not(:disabled) {
    border-color: var(--cx-r7-border-hover) !important;
    background-color: #fbfdff !important;
    box-shadow: 0 6px 16px rgba(36, 66, 95, .075) !important;
}

.cx-design-system select.form-select:not([multiple]):not([size]):focus,
.cx-design-system .cx-native-select:focus {
    border-color: var(--cx-r7-primary) !important;
    outline: 0 !important;
    background-color: #ffffff !important;
    box-shadow:
        var(--cx-r7-focus-ring),
        var(--cx-r7-shadow-focus) !important;
}

.cx-design-system select.form-select:not([multiple]):not([size]):active:not(:disabled),
.cx-design-system .cx-native-select:active:not(:disabled) {
    transform: translateY(.5px);
}

.cx-design-system select.form-select:not([multiple]):not([size]):disabled,
.cx-design-system .cx-native-select:disabled {
    border-color: #dce4ec !important;
    background-color: #f1f4f7 !important;
    color: #788797 !important;
    cursor: not-allowed;
    box-shadow: none !important;
    opacity: 1;
}

.cx-design-system .cx-native-select.is-invalid,
.cx-design-system .cx-native-select:invalid:not(:focus):not(:placeholder-shown) {
    border-color: #b24d59 !important;
}

.cx-design-system .cx-native-select.is-invalid:focus {
    box-shadow:
        0 0 0 3px rgba(178, 77, 89, .12),
        var(--cx-r7-shadow-focus) !important;
}

.cx-design-system .cx-control--compact {
    --cx-r7-control-height: 44px;
}

.cx-design-system .cx-control--header-language {
    --cx-r7-control-height: 38px;
    font-size: 12.5px !important;
}

.cx-design-system .cx-control--language-picker {
    --cx-r7-control-height: 40px;
    font-size: 13px !important;
}

/* Time: Bootstrap arrow on the right, dedicated clock icon on the left */
.cx-design-system .cx-time-select-shell {
    position: relative;
}

.cx-design-system .cx-time-leading-icon {
    position: absolute;
    z-index: 2;
    left: 13px;
    top: 50%;
    width: 22px;
    height: 22px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #55718d;
    font-size: 14px;
    pointer-events: none;
    transform: translateY(-50%);
    transition:
        color .16s var(--cx-r7-ease),
        transform .16s var(--cx-r7-ease);
}

.cx-design-system .cx-time-select {
    padding-left: 42px !important;
    font-variant-numeric: tabular-nums;
}

.cx-design-system .cx-time-select-shell:hover .cx-time-leading-icon,
.cx-design-system .cx-time-select-shell:focus-within .cx-time-leading-icon {
    color: var(--cx-r7-primary-dark);
    transform: translateY(-50%) scale(1.04);
}

/* Shared Cx checkbox */
.cx-design-system .cx-checkbox,
.cx-design-system .cx-switch {
    position: relative;
    min-width: 0;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: var(--cx-r7-text);
    cursor: pointer;
    user-select: none;
}

.cx-design-system .cx-boolean-native {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}

.cx-design-system .cx-checkbox-box {
    width: 20px !important;
    min-width: 20px !important;
    height: 20px !important;
    flex: 0 0 20px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border: 1.5px solid #aebfce !important;
    border-radius: 6px !important;
    background: #ffffff !important;
    color: #ffffff !important;
    box-shadow: none !important;
    transition:
        border-color .14s var(--cx-r7-ease),
        background-color .14s var(--cx-r7-ease),
        box-shadow .14s var(--cx-r7-ease),
        transform .14s var(--cx-r7-ease) !important;
}

.cx-design-system .cx-checkbox-box i {
    font-size: 11px;
    opacity: 0;
    transform: scale(.72);
    transition:
        opacity .12s var(--cx-r7-ease),
        transform .12s var(--cx-r7-ease);
}

.cx-design-system .cx-checkbox:hover .cx-checkbox-box {
    border-color: #8fa7bc !important;
    transform: translateY(-.5px);
}

.cx-design-system .cx-checkbox > .cx-boolean-native:checked + .cx-checkbox-box {
    border-color: var(--cx-r7-primary) !important;
    background: var(--cx-r7-primary) !important;
    box-shadow: 0 4px 10px rgba(62, 106, 153, .18) !important;
}

.cx-design-system .cx-checkbox > .cx-boolean-native:checked + .cx-checkbox-box i {
    opacity: 1;
    transform: scale(1);
}

.cx-design-system .cx-checkbox > .cx-boolean-native:focus-visible + .cx-checkbox-box,
.cx-design-system .cx-switch > .cx-boolean-native:focus-visible + .cx-switch-track {
    box-shadow: var(--cx-r7-focus-ring) !important;
}

.cx-design-system .cx-checkbox-label,
.cx-design-system .cx-switch-label {
    color: var(--cx-r7-text);
    font-size: 14px;
    font-weight: 650;
    line-height: 1.35;
}

/* Shared Cx switch */
.cx-design-system .cx-switch-track {
    position: relative;
    width: 42px !important;
    min-width: 42px !important;
    height: 24px !important;
    flex: 0 0 42px !important;
    border: 1px solid #b7c5d2 !important;
    border-radius: 999px !important;
    background: #dfe6ec !important;
    box-shadow: inset 0 1px 2px rgba(36, 66, 95, .08);
    transition:
        border-color .16s var(--cx-r7-ease),
        background-color .16s var(--cx-r7-ease),
        box-shadow .16s var(--cx-r7-ease) !important;
}

.cx-design-system .cx-switch-thumb {
    position: absolute;
    left: 3px;
    top: 3px;
    width: 16px !important;
    height: 16px !important;
    border-radius: 50%;
    background: #ffffff;
    box-shadow: 0 2px 5px rgba(36, 66, 95, .22);
    transform: translateX(0);
    transition: transform .18s var(--cx-r7-ease) !important;
}

.cx-design-system .cx-switch:hover .cx-switch-track {
    border-color: #9eb0c0 !important;
}

.cx-design-system .cx-switch > .cx-boolean-native:checked + .cx-switch-track {
    border-color: var(--cx-r7-primary) !important;
    background: var(--cx-r7-primary) !important;
    box-shadow: inset 0 1px 2px rgba(36, 66, 95, .08), 0 4px 10px rgba(62, 106, 153, .14);
}

.cx-design-system .cx-switch > .cx-boolean-native:checked + .cx-switch-track .cx-switch-thumb {
    transform: translateX(18px) !important;
}

.cx-design-system .cx-switch-copy {
    min-width: 0;
    display: grid;
    gap: 2px;
}

.cx-design-system .cx-switch-help {
    color: var(--cx-r7-muted);
    font-size: 12px;
    line-height: 1.35;
}

/* Legacy native checkbox/radio fallback */
.cx-design-system input[type="checkbox"]:not(.cx-boolean-native):not(.custom-switch-input),
.cx-design-system input[type="radio"]:not(.cx-boolean-native):not(.custom-switch-input) {
    width: 20px !important;
    min-width: 20px !important;
    height: 20px !important;
    min-height: 20px !important;
    margin: 0 !important;
    flex: 0 0 20px !important;
    display: inline-grid !important;
    place-content: center !important;
    border: 1.5px solid #aebfce !important;
    background-color: #ffffff !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
    appearance: none !important;
    -webkit-appearance: none !important;
    cursor: pointer;
    box-shadow: none !important;
    vertical-align: middle;
    transition:
        border-color .14s var(--cx-r7-ease),
        background-color .14s var(--cx-r7-ease),
        box-shadow .14s var(--cx-r7-ease),
        transform .14s var(--cx-r7-ease) !important;
}

.cx-design-system input[type="checkbox"]:not(.cx-boolean-native):not(.custom-switch-input) {
    border-radius: 6px !important;
}

.cx-design-system input[type="radio"]:not(.cx-boolean-native):not(.custom-switch-input) {
    border-radius: 50% !important;
}

.cx-design-system input[type="checkbox"]:not(.cx-boolean-native):not(.custom-switch-input)::before,
.cx-design-system input[type="radio"]:not(.cx-boolean-native):not(.custom-switch-input)::before {
    display: none !important;
    content: none !important;
}

.cx-design-system input[type="checkbox"]:not(.cx-boolean-native):not(.custom-switch-input):checked {
    border-color: var(--cx-r7-primary) !important;
    background-color: var(--cx-r7-primary) !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='2.2' d='m3.2 8.3 3 3 6.6-7'/%3E%3C/svg%3E") !important;
    background-size: 13px 13px !important;
}

.cx-design-system input[type="radio"]:not(.cx-boolean-native):not(.custom-switch-input):checked {
    border-color: var(--cx-r7-primary) !important;
    background-color: var(--cx-r7-primary) !important;
    background-image: radial-gradient(circle, #fff 0 35%, transparent 39%) !important;
}

.cx-design-system input[type="checkbox"]:not(.cx-boolean-native):not(.custom-switch-input):hover:not(:disabled),
.cx-design-system input[type="radio"]:not(.cx-boolean-native):not(.custom-switch-input):hover:not(:disabled) {
    border-color: #8fa7bc !important;
    transform: translateY(-.5px);
}

.cx-design-system input[type="checkbox"]:not(.cx-boolean-native):not(.custom-switch-input):focus-visible,
.cx-design-system input[type="radio"]:not(.cx-boolean-native):not(.custom-switch-input):focus-visible {
    outline: 0 !important;
    box-shadow: var(--cx-r7-focus-ring) !important;
}

/* Bootstrap form-switch restoration after the legacy checkbox fallback */
.cx-design-system .form-switch .form-check-input {
    width: 42px !important;
    min-width: 42px !important;
    height: 24px !important;
    min-height: 24px !important;
    border-radius: 999px !important;
    background-position: left center !important;
    background-size: contain !important;
}

.cx-design-system .form-switch .form-check-input:checked {
    background-position: right center !important;
}

/* PagedList: professional toolbar and date range */
.cx-design-system .cx-paged-list .conexgo-pagedlist-toolbar {
    width: 100% !important;
    min-width: 0;
    margin: 0 0 16px !important;
    display: grid !important;
    grid-template-columns: minmax(0, auto) minmax(0, 1fr) !important;
    align-items: end !important;
    gap: 16px 24px !important;
}

.cx-design-system .cx-paged-list .conexgo-pagedlist-filters {
    min-width: 0;
    display: flex !important;
    align-items: end !important;
    flex-wrap: wrap !important;
    gap: 14px !important;
}

.cx-design-system .cx-paged-list .conexgo-pagedlist-field {
    min-width: 0;
    display: grid !important;
    align-content: end !important;
    gap: 7px !important;
}

.cx-design-system .cx-paged-list .conexgo-pagedlist-field-label--icon {
    min-height: 24px;
    display: inline-flex;
    align-items: center;
    gap: 7px;
}

.cx-design-system .cx-paged-list .conexgo-pagedlist-label-icon {
    width: 24px;
    height: 24px;
    min-width: 24px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #dbe5ee;
    border-radius: 7px;
    background: #ffffff;
    color: #4f7396;
    font-size: 11px;
    box-shadow: 0 2px 7px rgba(36, 66, 95, .045);
}

.cx-design-system .cx-paged-list .conexgo-pagedlist-size-select {
    width: 150px !important;
    min-width: 150px !important;
}

.cx-design-system .cx-paged-list .conexgo-pagedlist-range-select {
    width: 270px !important;
    min-width: 240px !important;
}

.cx-design-system .cx-paged-list .conexgo-pagedlist-pagination {
    min-width: 0;
    justify-self: end;
    align-self: end;
    margin: 0 !important;
}

.cx-design-system .cx-paged-list .conexgo-pagedlist-pagination .pagination {
    display: flex !important;
    align-items: center !important;
    flex-wrap: nowrap !important;
    gap: 7px !important;
    margin: 0 !important;
}

.cx-design-system .cx-paged-list .conexgo-pagedlist-pagination .page-link {
    min-width: 42px !important;
    height: 42px !important;
    padding: 0 11px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border: 1px solid #d2dde7 !important;
    border-radius: 9px !important;
    background: #ffffff !important;
    color: #315575 !important;
    font-size: 13px !important;
    font-weight: 720 !important;
    box-shadow: 0 3px 9px rgba(36, 66, 95, .04) !important;
    transition:
        border-color .14s var(--cx-r7-ease),
        background-color .14s var(--cx-r7-ease),
        color .14s var(--cx-r7-ease),
        box-shadow .14s var(--cx-r7-ease),
        transform .14s var(--cx-r7-ease) !important;
}

.cx-design-system .cx-paged-list .conexgo-pagedlist-pagination .page-link:hover {
    border-color: #9eb4c7 !important;
    background: #f5f8fb !important;
    color: var(--cx-r7-primary-dark) !important;
    box-shadow: 0 6px 14px rgba(36, 66, 95, .08) !important;
    transform: translateY(-1px);
}

.cx-design-system .cx-paged-list .conexgo-pagedlist-pagination .page-item.disabled .page-link {
    border-color: #e3e9ef !important;
    background: #f7f9fb !important;
    color: #a8b4c0 !important;
    box-shadow: none !important;
    transform: none !important;
}

.cx-design-system .cx-paged-list .conexgo-pagedlist-page-status .page-link {
    min-width: 116px !important;
    border-color: var(--cx-r7-primary-dark) !important;
    background: var(--cx-r7-primary-dark) !important;
    color: #ffffff !important;
    cursor: default;
    box-shadow: 0 6px 14px rgba(44, 76, 108, .14) !important;
    transform: none !important;
}

.cx-design-system .cx-paged-list .conexgo-pagedlist-custom {
    position: relative;
    margin: 0 0 18px !important;
    padding: 18px !important;
    overflow: visible;
    border: 1px solid #d8e2eb !important;
    border-top: 0 !important;
    border-radius: 13px !important;
    background:
        radial-gradient(circle at 100% 0, rgba(62, 106, 153, .055), transparent 34%),
        linear-gradient(180deg, #fbfcfe 0%, #f7f9fc 100%) !important;
    box-shadow: 0 6px 18px rgba(36, 66, 95, .045);
}

.cx-design-system .cx-paged-list .conexgo-pagedlist-custom::before {
    content: "";
    position: absolute;
    inset: 0 auto 0 0;
    width: 3px;
    border-radius: 13px 0 0 13px;
    background: linear-gradient(180deg, var(--cx-r7-primary) 0%, var(--cx-r7-success) 100%);
}

.cx-design-system .cx-paged-list .conexgo-pagedlist-custom-fields {
    width: 100% !important;
    min-width: 0;
    display: grid !important;
    grid-template-columns: minmax(360px, 1fr) 34px minmax(360px, 1fr) minmax(140px, auto) !important;
    align-items: end !important;
    gap: 16px !important;
}

.cx-design-system .cx-paged-list .conexgo-pagedlist-custom-group {
    min-width: 0;
    display: grid !important;
    grid-template-columns: minmax(220px, 1fr) minmax(160px, 180px) !important;
    align-items: end !important;
    gap: 13px !important;
}

.cx-design-system .cx-paged-list .conexgo-pagedlist-date-input,
.cx-design-system .cx-paged-list .conexgo-pagedlist-time-input {
    width: 100% !important;
    min-width: 0 !important;
}

.cx-design-system .cx-paged-list .conexgo-pagedlist-custom-separator {
    height: var(--cx-r7-control-height) !important;
    min-height: var(--cx-r7-control-height) !important;
    padding: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    color: #6f8295 !important;
    font-size: 13px;
}

.cx-design-system .cx-paged-list .conexgo-pagedlist-custom-separator i {
    width: 30px;
    height: 30px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #dce5ed;
    border-radius: 999px;
    background: #ffffff;
    box-shadow: 0 3px 9px rgba(36, 66, 95, .05);
}

.cx-design-system .cx-paged-list .conexgo-pagedlist-apply {
    min-width: 140px !important;
    height: var(--cx-r7-control-height) !important;
    min-height: var(--cx-r7-control-height) !important;
    padding: 0 18px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px;
    border: 1px solid var(--cx-r7-primary-dark) !important;
    border-radius: 10px !important;
    background: var(--cx-r7-primary-dark) !important;
    color: #ffffff !important;
    font-size: 13px !important;
    font-weight: 760 !important;
    white-space: nowrap;
    box-shadow: 0 6px 14px rgba(44, 76, 108, .13) !important;
    transition:
        border-color .15s var(--cx-r7-ease),
        background-color .15s var(--cx-r7-ease),
        box-shadow .15s var(--cx-r7-ease),
        transform .15s var(--cx-r7-ease) !important;
}

.cx-design-system .cx-paged-list .conexgo-pagedlist-apply:hover,
.cx-design-system .cx-paged-list .conexgo-pagedlist-apply:focus-visible {
    border-color: #213d58 !important;
    background: #213d58 !important;
    box-shadow: 0 9px 20px rgba(44, 76, 108, .18) !important;
    transform: translateY(-1px);
}

.cx-design-system .cx-paged-list .conexgo-pagedlist-apply:focus-visible {
    outline: 0;
    box-shadow:
        var(--cx-r7-focus-ring),
        0 9px 20px rgba(44, 76, 108, .18) !important;
}

/* Devices page filter panel */
.cx-design-system .device-filter-panel--professional {
    position: relative;
    padding: 16px 18px 18px !important;
    overflow: hidden;
    border-top: 1px solid #e4eaf0;
    border-bottom: 1px solid #dce4ec;
    background:
        radial-gradient(circle at 100% 0, rgba(62, 106, 153, .05), transparent 34%),
        linear-gradient(180deg, #fbfcfe 0%, #f7f9fc 100%) !important;
}

.cx-design-system .device-filter-panel--professional::before {
    content: "";
    position: absolute;
    inset: 0 auto 0 0;
    width: 3px;
    background: linear-gradient(180deg, var(--cx-r7-primary) 0%, var(--cx-r7-success) 100%);
}

.cx-design-system .device-filter-toolbar {
    min-width: 0;
    margin-bottom: 14px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
}

.cx-design-system .device-filter-summary {
    min-width: 0;
    min-height: 36px;
    padding: 0 !important;
    display: flex !important;
    align-items: center !important;
    color: var(--cx-r7-muted);
    font-size: 12.5px;
}

.cx-design-system .device-filter-count,
.cx-design-system .device-filter-updating {
    min-width: 0;
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.cx-design-system .device-filter-count strong {
    min-width: 30px;
    height: 30px;
    padding: 0 8px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #d7e2eb;
    border-radius: 999px;
    background: #ffffff;
    color: var(--cx-r7-primary-dark);
    font-size: 12px;
    font-weight: 820;
    box-shadow: 0 3px 9px rgba(36, 66, 95, .05);
}

.cx-design-system .device-filter-updating {
    color: var(--cx-r7-primary-dark);
    font-weight: 720;
}

.cx-design-system .device-filter-updating-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--cx-r7-primary);
    animation: cx-r7-pulse 1.2s ease-out infinite;
}

.cx-design-system .device-filter-reset {
    min-height: 38px;
    padding: 0 13px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    border: 1px solid #cbd8e3;
    border-radius: 9px;
    background: #ffffff;
    color: #315575;
    font-size: 12px;
    font-weight: 750;
    white-space: nowrap;
    box-shadow: 0 3px 10px rgba(36, 66, 95, .045);
    transition:
        border-color .15s var(--cx-r7-ease),
        background-color .15s var(--cx-r7-ease),
        box-shadow .15s var(--cx-r7-ease),
        transform .15s var(--cx-r7-ease) !important;
}

.cx-design-system .device-filter-reset:hover:not(:disabled),
.cx-design-system .device-filter-reset:focus-visible:not(:disabled) {
    border-color: #96adc1;
    background: #fdfefe;
    color: #24425f;
    box-shadow: 0 7px 16px rgba(36, 66, 95, .09);
    transform: translateY(-1px);
}

.cx-design-system .device-filter-reset:focus-visible {
    outline: 0;
    box-shadow:
        var(--cx-r7-focus-ring),
        0 7px 16px rgba(36, 66, 95, .09);
}

.cx-design-system .device-filter-reset:disabled {
    opacity: .62;
    cursor: not-allowed;
}

.cx-design-system .device-filter-reset i {
    transition: transform .2s var(--cx-r7-ease);
}

.cx-design-system .device-filter-reset:hover:not(:disabled) i {
    transform: rotate(-24deg);
}

.cx-design-system .device-filter-grid {
    width: 100%;
    min-width: 0;
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    align-items: end;
    gap: 14px;
}

.cx-design-system .device-filter-field {
    min-width: 0;
    display: grid;
    align-content: end;
    gap: 8px;
    animation: cx-r7-field-in .2s var(--cx-r7-ease) both;
}

.cx-design-system .device-filter-field:nth-child(2) { animation-delay: 18ms; }
.cx-design-system .device-filter-field:nth-child(3) { animation-delay: 36ms; }
.cx-design-system .device-filter-field:nth-child(4) { animation-delay: 54ms; }
.cx-design-system .device-filter-field:nth-child(5) { animation-delay: 72ms; }
.cx-design-system .device-filter-field:nth-child(6) { animation-delay: 90ms; }

.cx-design-system .device-filter-label {
    min-height: 26px;
    display: flex;
    align-items: center;
    gap: 7px;
}

.cx-design-system .device-filter-label > span:last-child {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.cx-design-system .device-filter-label-icon {
    width: 25px;
    height: 25px;
    min-width: 25px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #dae5ee;
    border-radius: 7px;
    background: #ffffff;
    color: #4f7396;
    font-size: 10.5px;
    box-shadow: 0 2px 7px rgba(36, 66, 95, .045);
    transition:
        border-color .15s var(--cx-r7-ease),
        background-color .15s var(--cx-r7-ease),
        color .15s var(--cx-r7-ease),
        transform .15s var(--cx-r7-ease);
}

.cx-design-system .device-filter-field:hover .device-filter-label-icon,
.cx-design-system .device-filter-field:focus-within .device-filter-label-icon {
    border-color: #b7cadb;
    background: #edf4fa;
    color: var(--cx-r7-primary-dark);
    transform: translateY(-1px);
}

.cx-design-system .device-filter-control {
    width: 100%;
    min-width: 0;
}

/* Global control animation */
@keyframes cx-r7-popover-in {
    from {
        opacity: 0;
        transform: translateY(-4px) scale(.992);
    }

    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

@keyframes cx-r7-field-in {
    from {
        opacity: 0;
        transform: translateY(4px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes cx-r7-pulse {
    0% {
        box-shadow: 0 0 0 0 rgba(62, 106, 153, .24);
    }

    70% {
        box-shadow: 0 0 0 7px rgba(62, 106, 153, 0);
    }

    100% {
        box-shadow: 0 0 0 0 rgba(62, 106, 153, 0);
    }
}

@media (max-width: 1399.98px) {
    .cx-design-system .device-filter-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .cx-design-system .cx-paged-list .conexgo-pagedlist-custom-fields {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
    }

    .cx-design-system .cx-paged-list .conexgo-pagedlist-custom-separator {
        display: none !important;
    }

    .cx-design-system .cx-paged-list .conexgo-pagedlist-apply {
        width: 100% !important;
        grid-column: 1 / -1 !important;
    }
}

@media (max-width: 991.98px) {
    .cx-design-system .cx-paged-list .conexgo-pagedlist-toolbar {
        grid-template-columns: minmax(0, 1fr) !important;
    }

    .cx-design-system .cx-paged-list .conexgo-pagedlist-pagination {
        justify-self: start;
    }

    .cx-design-system .device-filter-panel--professional {
        padding: 15px 14px 16px !important;
    }

    .cx-design-system .device-filter-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 13px;
    }
}

@media (max-width: 767.98px) {
    .cx-design-system .cx-control-datetime-grid,
    .cx-design-system .cx-paged-list .conexgo-pagedlist-custom-fields,
    .cx-design-system .cx-paged-list .conexgo-pagedlist-custom-group {
        grid-template-columns: minmax(0, 1fr) !important;
    }

    .cx-design-system .cx-paged-list .conexgo-pagedlist-filters {
        width: 100%;
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    .cx-design-system .cx-paged-list .conexgo-pagedlist-size-select,
    .cx-design-system .cx-paged-list .conexgo-pagedlist-range-select {
        width: 100% !important;
        min-width: 0 !important;
    }

    .cx-design-system .cx-paged-list .conexgo-pagedlist-pagination {
        width: 100%;
        overflow-x: auto;
        padding-bottom: 2px;
    }

    .cx-design-system .cx-paged-list .conexgo-pagedlist-pagination .pagination {
        width: max-content;
        min-width: 100%;
        justify-content: center;
    }
}

@media (max-width: 575.98px) {
    .cx-design-system .device-filter-toolbar {
        align-items: stretch;
        flex-direction: column;
        gap: 10px;
    }

    .cx-design-system .device-filter-reset {
        width: 100%;
        min-height: 42px;
    }

    .cx-design-system .device-filter-grid,
    .cx-design-system .cx-paged-list .conexgo-pagedlist-filters {
        grid-template-columns: minmax(0, 1fr) !important;
    }

    .cx-design-system .cx-paged-list .conexgo-pagedlist-custom {
        padding: 14px !important;
    }

    .cx-design-system .cx-paged-list .conexgo-pagedlist-pagination .page-link {
        min-width: 38px !important;
        height: 38px !important;
        padding: 0 8px !important;
    }

    .cx-design-system .cx-paged-list .conexgo-pagedlist-page-status .page-link {
        min-width: 96px !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    .cx-design-system .device-filter-field,
    .cx-design-system .device-filter-updating-dot,
    .cx-design-system .mud-picker-popover {
        animation: none !important;
    }

    .cx-design-system *,
    .cx-design-system *::before,
    .cx-design-system *::after {
        scroll-behavior: auto !important;
        transition-duration: .01ms !important;
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
    }
}

/* ==========================================================================
   CONEXGO CUSTOM CONTROL EXPERIENCE R8
   Practicora-inspired custom select/time interaction:
   - no native browser select menu;
   - portalled popover with internal scroll;
   - keyboard navigation, selected check and visible hover;
   - professional pagination motion.
   ========================================================================== */

.cx-design-system .cx-custom-select-root {
    position: relative;
    isolation: isolate;
}

.cx-design-system .cx-custom-select-option-source {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    overflow: hidden !important;
    clip: rect(0 0 0 0) !important;
    clip-path: inset(50%) !important;
    white-space: nowrap !important;
    pointer-events: none !important;
}

.cx-design-system .cx-custom-select-trigger {
    width: 100%;
    min-width: 0;
    height: var(--cx-r7-control-height, 44px);
    min-height: var(--cx-r7-control-height, 44px);
    padding: 0 8px 0 14px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 34px;
    align-items: center;
    gap: 8px;
    overflow: hidden;
    border: 1px solid var(--cx-r7-border);
    border-radius: var(--cx-r7-control-radius);
    background: linear-gradient(180deg, #ffffff 0%, #fbfcfe 100%);
    color: var(--cx-r7-text);
    font: inherit;
    font-size: 14px;
    font-weight: 660;
    line-height: 1.25;
    text-align: left;
    cursor: pointer;
    box-shadow: var(--cx-r7-shadow-soft);
    transition:
        border-color .16s var(--cx-r7-ease),
        background-color .16s var(--cx-r7-ease),
        box-shadow .16s var(--cx-r7-ease),
        transform .16s var(--cx-r7-ease);
}

.cx-design-system .cx-custom-select-trigger--with-icon {
    grid-template-columns: 28px minmax(0, 1fr) 34px;
    padding-left: 10px;
}

.cx-design-system .cx-custom-select-trigger:hover:not(:disabled) {
    border-color: #9eb3c7;
    background: #ffffff;
    box-shadow: 0 7px 18px rgba(36, 66, 95, .085);
    transform: translateY(-1px);
}

.cx-design-system .cx-custom-select-trigger:focus-visible,
.cx-design-system .cx-custom-select-trigger.is-open {
    border-color: var(--cx-r7-primary);
    outline: 0;
    background: #ffffff;
    box-shadow:
        var(--cx-r7-focus-ring),
        var(--cx-r7-shadow-focus);
}

.cx-design-system .cx-custom-select-trigger.is-open {
    transform: translateY(-1px);
}

.cx-design-system .cx-custom-select-trigger:active:not(:disabled) {
    transform: translateY(0);
}

.cx-design-system .cx-custom-select-trigger:disabled {
    border-color: #dce4ec;
    background: #f1f4f7;
    color: #788797;
    cursor: not-allowed;
    box-shadow: none;
    opacity: 1;
}

.cx-design-system .cx-custom-select-trigger.is-invalid {
    border-color: #b24d59;
}

.cx-design-system .cx-custom-select-trigger.is-invalid:focus-visible,
.cx-design-system .cx-custom-select-trigger.is-invalid.is-open {
    box-shadow:
        0 0 0 3px rgba(178, 77, 89, .12),
        var(--cx-r7-shadow-focus);
}

.cx-design-system .cx-custom-select-leading-icon {
    width: 28px;
    height: 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    background: #eef4f9;
    color: #3e6a99;
    font-size: 13px;
    transition:
        background-color .16s var(--cx-r7-ease),
        color .16s var(--cx-r7-ease),
        transform .16s var(--cx-r7-ease);
}

.cx-design-system .cx-custom-select-trigger:hover .cx-custom-select-leading-icon,
.cx-design-system .cx-custom-select-trigger.is-open .cx-custom-select-leading-icon {
    background: #e4eef7;
    color: #2c4c6c;
    transform: scale(1.04);
}

.cx-design-system .cx-custom-select-value {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-variant-numeric: tabular-nums;
}

.cx-design-system .cx-custom-select-value.is-placeholder,
.cx-design-system .cx-custom-select-placeholder {
    color: #8090a0;
    font-weight: 560;
}

.cx-design-system .cx-custom-select-chevron {
    width: 34px;
    height: 32px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-left: 1px solid #e3eaf1;
    border-radius: 8px;
    color: #526d87;
    font-size: 12px;
    transition:
        background-color .16s var(--cx-r7-ease),
        color .16s var(--cx-r7-ease),
        transform .2s var(--cx-r7-ease);
}

.cx-design-system .cx-custom-select-trigger:hover .cx-custom-select-chevron {
    background: #f1f6fa;
    color: #2c4c6c;
}

.cx-design-system .cx-custom-select-trigger.is-open .cx-custom-select-chevron {
    background: #eaf2f8;
    color: #2c4c6c;
}

.cx-design-system .cx-custom-select-trigger.is-open .cx-custom-select-chevron i {
    transform: rotate(180deg);
}

.cx-design-system .cx-custom-select-chevron i {
    transition: transform .2s var(--cx-r7-ease);
}

.cx-design-system .mud-popover.cx-custom-select-popover,
.cx-design-system .cx-custom-select-popover {
    z-index: 1400 !important;
    margin-top: 7px;
    overflow: visible !important;
    background: transparent !important;
    box-shadow: none !important;
}

.cx-design-system .cx-custom-select-menu {
    width: 100%;
    min-width: 100%;
    padding: 7px;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    touch-action: pan-y;
    border: 1px solid #d7e1ea;
    border-radius: 13px;
    background:
        radial-gradient(circle at 100% 0, rgba(62, 106, 153, .055), transparent 34%),
        #ffffff;
    box-shadow:
        0 18px 40px rgba(36, 66, 95, .16),
        0 4px 12px rgba(36, 66, 95, .08);
    animation: cx-r8-popover-in .17s var(--cx-r7-ease) both;
    scrollbar-width: thin;
    scrollbar-color: #9fb2c5 transparent;
}

.cx-design-system .cx-custom-select-menu::-webkit-scrollbar {
    width: 8px;
}

.cx-design-system .cx-custom-select-menu::-webkit-scrollbar-track {
    background: transparent;
}

.cx-design-system .cx-custom-select-menu::-webkit-scrollbar-thumb {
    border: 2px solid transparent;
    border-radius: 999px;
    background: #9fb2c5;
    background-clip: padding-box;
}

.cx-design-system .cx-custom-select-option {
    width: 100%;
    min-width: 0;
    min-height: 42px;
    margin: 1px 0;
    padding: 8px 10px 8px 12px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 28px;
    align-items: center;
    gap: 10px;
    border: 0;
    border-radius: 9px;
    background: transparent;
    color: #29435d;
    font: inherit;
    font-size: 14px;
    font-weight: 570;
    line-height: 1.3;
    text-align: left;
    cursor: pointer;
    transition:
        background-color .12s var(--cx-r7-ease),
        color .12s var(--cx-r7-ease),
        transform .12s var(--cx-r7-ease);
}

.cx-design-system .cx-custom-select-option:hover:not(:disabled),
.cx-design-system .cx-custom-select-option.is-active:not(:disabled) {
    background: #f0f5f9;
    color: #213d58;
    transform: translateX(2px);
}

.cx-design-system .cx-custom-select-option.is-selected {
    background: #e5eff7;
    color: #244d73;
    font-weight: 760;
}

.cx-design-system .cx-custom-select-option.is-selected:hover,
.cx-design-system .cx-custom-select-option.is-selected.is-active {
    background: #dceaf5;
}

.cx-design-system .cx-custom-select-option:focus-visible {
    outline: 0;
    background: #edf4f9;
    box-shadow: inset 0 0 0 2px rgba(62, 106, 153, .22);
}

.cx-design-system .cx-custom-select-option:disabled,
.cx-design-system .cx-custom-select-option.is-disabled {
    color: #9aa6b2;
    cursor: not-allowed;
    opacity: .68;
}

.cx-design-system .cx-custom-select-option-label {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.cx-design-system .cx-custom-select-option-check {
    width: 28px;
    height: 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    background: transparent;
    color: #3e6a99;
    font-size: 11px;
    opacity: 0;
    transform: scale(.72);
    transition:
        opacity .12s var(--cx-r7-ease),
        transform .12s var(--cx-r7-ease),
        background-color .12s var(--cx-r7-ease);
}

.cx-design-system .cx-custom-select-option.is-selected .cx-custom-select-option-check {
    background: rgba(62, 106, 153, .1);
    opacity: 1;
    transform: scale(1);
}

.cx-design-system .cx-custom-select-option--clear {
    margin-bottom: 5px;
    border-bottom: 1px solid #edf1f5;
    border-radius: 9px 9px 4px 4px;
    color: #66788b;
}

.cx-design-system .cx-custom-select-empty {
    padding: 14px 12px;
    color: #7b8a99;
    font-size: 13px;
    text-align: center;
}

.cx-design-system .cx-custom-time-menu .cx-custom-select-option-label {
    font-variant-numeric: tabular-nums;
    letter-spacing: .01em;
}

.cx-design-system .cx-control-time .cx-custom-select-value {
    font-variant-numeric: tabular-nums;
}

/* Restore professional pagination feedback and preserve disabled clarity. */
.cx-design-system .cx-paged-list .conexgo-pagedlist-pagination .page-link {
    position: relative;
    overflow: hidden;
    transition:
        border-color .16s var(--cx-r7-ease),
        background-color .16s var(--cx-r7-ease),
        color .16s var(--cx-r7-ease),
        box-shadow .16s var(--cx-r7-ease),
        transform .16s var(--cx-r7-ease);
}

.cx-design-system .cx-paged-list .conexgo-pagedlist-pagination
.page-item:not(.disabled):not(.conexgo-pagedlist-page-status) .page-link:hover {
    border-color: #7f9bb5;
    background: #edf4f9;
    color: #244d73;
    box-shadow: 0 7px 16px rgba(44, 76, 108, .11);
    transform: translateY(-2px);
}

.cx-design-system .cx-paged-list .conexgo-pagedlist-pagination
.page-item:not(.disabled):not(.conexgo-pagedlist-page-status) .page-link:focus-visible {
    border-color: var(--cx-r7-primary);
    outline: 0;
    background: #ffffff;
    box-shadow:
        0 0 0 3px rgba(62, 106, 153, .12),
        0 7px 16px rgba(44, 76, 108, .1);
    transform: translateY(-1px);
}

.cx-design-system .cx-paged-list .conexgo-pagedlist-pagination
.page-item:not(.disabled):not(.conexgo-pagedlist-page-status) .page-link:active {
    transform: translateY(0) scale(.97);
}

.cx-design-system .cx-paged-list .conexgo-pagedlist-pagination
.page-item:not(.disabled):not(.conexgo-pagedlist-page-status) .page-link i {
    transition: transform .16s var(--cx-r7-ease);
}

.cx-design-system .cx-paged-list .conexgo-pagedlist-pagination
.page-item:not(.disabled):not(.conexgo-pagedlist-page-status) .page-link:hover i {
    transform: scale(1.08);
}

.cx-design-system .cx-paged-list .conexgo-pagedlist-pagination
.conexgo-pagedlist-page-status .page-link {
    box-shadow: 0 8px 18px rgba(44, 76, 108, .13);
}

.cx-design-system .cx-paged-list .conexgo-pagedlist-pagination
.page-item.disabled .page-link {
    pointer-events: none;
    box-shadow: none;
    transform: none;
}

@keyframes cx-r8-popover-in {
    from {
        opacity: 0;
        transform: translateY(-5px) scale(.985);
    }

    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

@media (max-width: 575.98px) {
    .cx-design-system .cx-custom-select-menu {
        border-radius: 12px;
    }

    .cx-design-system .cx-custom-select-option {
        min-height: 44px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .cx-design-system .cx-custom-select-menu {
        animation: none !important;
    }

    .cx-design-system .cx-custom-select-trigger,
    .cx-design-system .cx-custom-select-chevron,
    .cx-design-system .cx-custom-select-chevron i,
    .cx-design-system .cx-custom-select-option,
    .cx-design-system .cx-custom-select-option-check,
    .cx-design-system .cx-paged-list .conexgo-pagedlist-pagination .page-link {
        transition-duration: .01ms !important;
    }
}

/* ==========================================================================
   CONEXGO PROFESSIONAL POLISH R8.1
   Softer reusable controls, compact pagination and aligned Device Config forms.
   ========================================================================== */

/* Custom selects: keep the custom menu, remove cheap-looking movement. */
.cx-design-system .cx-custom-select-trigger {
    transition:
        border-color .18s cubic-bezier(.2, .72, .26, 1),
        background-color .18s cubic-bezier(.2, .72, .26, 1),
        box-shadow .18s cubic-bezier(.2, .72, .26, 1) !important;
}

.cx-design-system .cx-custom-select-trigger:hover:not(:disabled) {
    border-color: #aebfce;
    background: #fff;
    box-shadow: 0 4px 12px rgba(36, 66, 95, .05);
    transform: none;
}

.cx-design-system .cx-custom-select-trigger:focus-visible,
.cx-design-system .cx-custom-select-trigger.is-open {
    background: #fff;
    box-shadow:
        0 0 0 3px rgba(62, 106, 153, .085),
        0 5px 14px rgba(36, 66, 95, .055);
    transform: none;
}

.cx-design-system .cx-custom-select-trigger:hover .cx-custom-select-leading-icon,
.cx-design-system .cx-custom-select-trigger.is-open .cx-custom-select-leading-icon {
    background: #eaf2f8;
    transform: none;
}

.cx-design-system .cx-custom-select-menu {
    border-color: #d9e3eb;
    box-shadow:
        0 14px 30px rgba(36, 66, 95, .115),
        0 3px 9px rgba(36, 66, 95, .05);
    animation-duration: .19s;
}

.cx-design-system .cx-custom-select-option {
    transition:
        background-color .16s cubic-bezier(.2, .72, .26, 1),
        color .16s cubic-bezier(.2, .72, .26, 1) !important;
}

.cx-design-system .cx-custom-select-option:hover:not(:disabled),
.cx-design-system .cx-custom-select-option.is-active:not(:disabled) {
    background: #f4f7fa;
    color: #29445e;
    transform: none;
}

.cx-design-system .cx-custom-select-option.is-selected {
    background: #eaf2f8;
    color: #294f72;
}

.cx-design-system .cx-custom-select-option.is-selected:hover,
.cx-design-system .cx-custom-select-option.is-selected.is-active {
    background: #e4eef6;
}

.cx-design-system .cx-custom-select-option.is-selected .cx-custom-select-option-check {
    background: rgba(62, 106, 153, .07);
}

.cx-design-system .device-filter-field:hover .device-filter-icon,
.cx-design-system .device-filter-field:focus-within .device-filter-icon,
.cx-design-system .device-filter-reset:hover:not(:disabled),
.cx-design-system input[type="checkbox"]:not(.cx-boolean-native):not(.custom-switch-input):hover:not(:disabled),
.cx-design-system input[type="radio"]:not(.cx-boolean-native):not(.custom-switch-input):hover:not(:disabled) {
    transform: none !important;
}

/* Pagination: less empty space, no exaggerated lift, subtle directional feedback. */
.cx-design-system .cx-paged-list .conexgo-pagedlist-toolbar {
    min-height: 0 !important;
    margin: 0 0 12px !important;
    padding: 2px 0 4px !important;
    align-items: center !important;
    gap: 12px 18px !important;
}

.cx-design-system .cx-paged-list .conexgo-pagedlist-pagination {
    align-self: center !important;
}

.cx-design-system .cx-paged-list .conexgo-pagedlist-pagination .pagination {
    gap: 6px !important;
}

.cx-design-system .cx-paged-list .conexgo-pagedlist-pagination .page-link {
    min-width: 40px !important;
    height: 40px !important;
    padding: 0 9px !important;
    border-color: #d4dfe8 !important;
    border-radius: 9px !important;
    background: #fff !important;
    color: #315575 !important;
    box-shadow: none !important;
    cursor: pointer;
    transition:
        border-color .18s cubic-bezier(.2, .72, .26, 1),
        background-color .18s cubic-bezier(.2, .72, .26, 1),
        color .18s cubic-bezier(.2, .72, .26, 1),
        box-shadow .18s cubic-bezier(.2, .72, .26, 1) !important;
}

.cx-design-system .cx-paged-list .conexgo-pagedlist-pagination
.page-item:not(.disabled):not(.conexgo-pagedlist-page-status) .page-link:hover {
    border-color: #afc0cf !important;
    background: #f5f8fa !important;
    color: #284e70 !important;
    box-shadow: 0 3px 10px rgba(36, 66, 95, .05) !important;
    transform: none !important;
}

.cx-design-system .cx-paged-list .conexgo-pagedlist-pagination
.page-item:not(.disabled):not(.conexgo-pagedlist-page-status) .page-link:focus-visible {
    border-color: #6689a8 !important;
    outline: 0;
    background: #fff !important;
    box-shadow: 0 0 0 3px rgba(62, 106, 153, .085) !important;
    transform: none !important;
}

.cx-design-system .cx-paged-list .conexgo-pagedlist-pagination
.page-item:not(.disabled):not(.conexgo-pagedlist-page-status) .page-link:active {
    background: #eef3f7 !important;
    box-shadow: none !important;
    transform: none !important;
}

.cx-design-system .cx-paged-list .conexgo-pagedlist-pagination
.page-item:not(.disabled):not(.conexgo-pagedlist-page-status) .page-link i {
    transition: transform .18s cubic-bezier(.2, .72, .26, 1) !important;
}

.cx-design-system .cx-paged-list .conexgo-pagedlist-pagination
.page-item:not(.disabled):not(.conexgo-pagedlist-page-status)
.page-link:hover .fa-chevron-left,
.cx-design-system .cx-paged-list .conexgo-pagedlist-pagination
.page-item:not(.disabled):not(.conexgo-pagedlist-page-status)
.page-link:hover .fa-angles-left {
    transform: translateX(-1px) !important;
}

.cx-design-system .cx-paged-list .conexgo-pagedlist-pagination
.page-item:not(.disabled):not(.conexgo-pagedlist-page-status)
.page-link:hover .fa-chevron-right,
.cx-design-system .cx-paged-list .conexgo-pagedlist-pagination
.page-item:not(.disabled):not(.conexgo-pagedlist-page-status)
.page-link:hover .fa-angles-right {
    transform: translateX(1px) !important;
}

.cx-design-system .cx-paged-list .conexgo-pagedlist-page-status .page-link {
    min-width: 106px !important;
    border-color: #315879 !important;
    background: #315879 !important;
    color: #fff !important;
    cursor: default;
    box-shadow: 0 3px 10px rgba(44, 76, 108, .08) !important;
}

.cx-design-system .cx-paged-list .conexgo-pagedlist-pagination
.page-item.disabled .page-link {
    border-color: #e2e8ee !important;
    background: #f7f9fb !important;
    color: #adb8c3 !important;
    cursor: default;
    box-shadow: none !important;
}

/* All Device Config dialogs: one coherent input foundation. */
.cx-design-system .cx-device-config-dialog .form-control,
.cx-design-system .cx-device-config-dialog .form-select,
.cx-design-system .cx-device-config-dialog input:not([type="checkbox"]):not([type="radio"]),
.cx-design-system .cx-device-config-dialog textarea {
    border-color: #cfdae4;
    border-radius: 10px;
    background-color: #fff;
    color: #29435d;
    box-shadow: none;
    transition:
        border-color .18s cubic-bezier(.2, .72, .26, 1),
        background-color .18s cubic-bezier(.2, .72, .26, 1),
        box-shadow .18s cubic-bezier(.2, .72, .26, 1);
}

.cx-design-system .cx-device-config-dialog .form-control:hover:not(:disabled),
.cx-design-system .cx-device-config-dialog .form-select:hover:not(:disabled),
.cx-design-system .cx-device-config-dialog input:not([type="checkbox"]):not([type="radio"]):hover:not(:disabled),
.cx-design-system .cx-device-config-dialog textarea:hover:not(:disabled) {
    border-color: #afc0cf;
}

.cx-design-system .cx-device-config-dialog .form-control:focus,
.cx-design-system .cx-device-config-dialog .form-select:focus,
.cx-design-system .cx-device-config-dialog input:not([type="checkbox"]):not([type="radio"]):focus,
.cx-design-system .cx-device-config-dialog textarea:focus {
    border-color: #6689a8;
    outline: 0;
    background-color: #fff;
    box-shadow: 0 0 0 3px rgba(62, 106, 153, .085);
}

/* B-DOTS: component classes already exist; align them as a real form. */
.cx-design-system .cx-r1-device-dot .cx-modal-group-v21--device-dot {
    min-width: 0;
    margin: 0;
    padding: 0;
    border: 0;
}

.cx-design-system .cx-r1-device-dot .cx-device-config-section-description {
    margin: 0 0 18px;
    padding: 12px 14px;
    display: flex;
    align-items: flex-start;
    gap: 9px;
    border: 1px solid #dce6ef;
    border-radius: 10px;
    background: #f7fafc;
    color: #526a81;
    font-size: 13px;
    line-height: 1.55;
}

.cx-design-system .cx-r1-device-dot .device-dot-form {
    width: 100%;
    min-width: 0;
    display: grid;
    gap: 18px !important;
}

.cx-design-system .cx-r1-device-dot .device-dot-summary,
.cx-design-system .cx-r1-device-dot .device-dot-section {
    min-width: 0;
    padding: 16px;
    border: 1px solid #d9e4ed;
    border-radius: 12px;
    background: #fff;
    box-shadow: 0 4px 14px rgba(36, 66, 95, .04);
}

.cx-design-system .cx-r1-device-dot .device-dot-summary {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr);
    align-items: start;
    gap: 13px;
}

.cx-design-system .cx-r1-device-dot .device-dot-summary-icon {
    width: 42px;
    height: 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #d7e3ed;
    border-radius: 11px;
    background: #edf4f9;
    color: #315879;
}

.cx-design-system .cx-r1-device-dot .device-dot-summary-content,
.cx-design-system .cx-r1-device-dot .device-dot-section {
    display: grid;
    gap: 13px;
}

.cx-design-system .cx-r1-device-dot .device-dot-summary-title-row,
.cx-design-system .cx-r1-device-dot .device-dot-section-heading {
    min-width: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
}

.cx-design-system .cx-r1-device-dot .device-dot-summary-title,
.cx-design-system .cx-r1-device-dot .device-dot-section-heading > div {
    color: #29455f;
    font-size: 14px;
    font-weight: 780;
}

.cx-design-system .cx-r1-device-dot .device-dot-summary-description {
    color: #536b82;
    font-size: 13.5px;
    line-height: 1.58;
}

.cx-design-system .cx-r1-device-dot .device-dot-status {
    min-height: 30px;
    padding: 0 10px;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    border: 1px solid transparent;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 760;
}

.cx-design-system .cx-r1-device-dot .device-dot-status-enabled {
    border-color: #bdd9c4;
    background: #edf8f0;
    color: #2f6940;
}

.cx-design-system .cx-r1-device-dot .device-dot-status-disabled {
    border-color: #e4c9cd;
    background: #fbf1f2;
    color: #8a3e49;
}

.cx-design-system .cx-r1-device-dot .device-dot-section-heading > div {
    display: inline-flex;
    align-items: center;
    gap: 9px;
}

.cx-design-system .cx-r1-device-dot .device-dot-section-heading > div > i {
    width: 30px;
    height: 30px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    background: #eef4f9;
    color: #3e6a99;
}

/* B-DOTS device cards: keep each beacon compact, readable and responsive. */
.cx-design-system .cx-r1-device-dot .device-dot-count {
    min-width: 28px;
    height: 28px;
    padding: 0 9px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #d5e1ea;
    border-radius: 999px;
    background: #f5f8fb;
    color: #315879;
    font-size: 12px;
    font-weight: 780;
    font-variant-numeric: tabular-nums;
}

.cx-design-system .cx-r1-device-dot .device-dot-grid {
    min-width: 0;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 360px));
    align-items: stretch;
    justify-content: start;
    gap: 14px;
}

.cx-design-system .cx-r1-device-dot .device-dot-card {
    min-width: 0;
    min-height: 156px;
    padding: 14px;
    display: grid;
    grid-template-columns: 96px minmax(0, 1fr);
    grid-template-rows: auto 1fr;
    grid-template-areas:
        "status details"
        "status action";
    gap: 12px 16px;
    overflow: hidden;
    border: 1px solid #d8e3ec;
    border-radius: 12px;
    background: #fbfcfd;
    box-shadow: none;
}

.cx-design-system .cx-r1-device-dot .device-dot-card-status {
    grid-area: status;
    min-width: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    align-self: start;
    gap: 10px;
}

.cx-design-system .cx-r1-device-dot .device-dot-image {
    width: 84px;
    height: 84px;
    max-width: 100%;
    display: block;
    object-fit: contain;
}

.cx-design-system .cx-r1-device-dot .device-dot-connection {
    max-width: 100%;
    min-height: 28px;
    padding: 0 9px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    border: 1px solid transparent;
    border-radius: 999px;
    font-size: 11.5px;
    font-weight: 760;
    line-height: 1;
    white-space: nowrap;
}

.cx-design-system .cx-r1-device-dot .device-dot-connected {
    border-color: #bdd9c4;
    background: #edf8f0;
    color: #2f6940;
}

.cx-design-system .cx-r1-device-dot .device-dot-disconnected {
    border-color: #e1c8cc;
    background: #fbf1f2;
    color: #8a3e49;
}

.cx-design-system .cx-r1-device-dot .device-dot-card-details {
    grid-area: details;
    min-width: 0;
    padding-top: 2px;
    display: grid;
    align-content: start;
    justify-items: start;
    gap: 10px;
}

.cx-design-system .cx-r1-device-dot .device-dot-name {
    max-width: 100%;
    overflow: hidden;
    color: #29455f;
    font-size: 15px;
    font-weight: 780;
    line-height: 1.3;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.cx-design-system .cx-r1-device-dot .device-dot-battery {
    min-height: 30px;
    padding: 0 9px;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    border: 1px solid #dce5ec;
    border-radius: 8px;
    background: #fff;
    color: #4d657c;
    font-size: 12px;
    font-weight: 720;
    font-variant-numeric: tabular-nums;
}

.cx-design-system .cx-r1-device-dot .device-dot-battery > i {
    color: #4f789d;
}

.cx-design-system .cx-r1-device-dot .device-dot-card-action {
    grid-area: action;
    min-width: 0;
    display: flex;
    align-items: flex-end;
    align-self: end;
}

.cx-design-system .cx-r1-device-dot .device-dot-locate-button {
    width: auto;
    min-width: 0;
    min-height: 36px;
    padding: 0 12px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    border: 1px solid #cbd9e4;
    border-radius: 9px;
    background: #fff;
    color: #315879;
    font: inherit;
    font-size: 12px;
    font-weight: 760;
    line-height: 1.2;
    cursor: pointer;
}

.cx-design-system .cx-r1-device-dot .device-dot-locate-button:hover:not(:disabled) {
    border-color: #aebfcd;
    background: #f5f8fb;
    color: #294f70;
}

.cx-design-system .cx-r1-device-dot .device-dot-locate-button:focus-visible {
    outline: 0;
    border-color: #6689a8;
    box-shadow: 0 0 0 3px rgba(62, 106, 153, .085) !important;
}

.cx-design-system .cx-r1-device-dot .device-dot-locate-button:disabled {
    cursor: not-allowed;
    opacity: .58;
}

.cx-design-system .cx-r1-device-dot .device-dot-locate-button > img {
    width: 17px;
    height: 17px;
    display: block;
    object-fit: contain;
}

.cx-design-system .cx-r1-device-dot .device-dot-unavailable {
    width: 36px;
    height: 36px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #e1e7ec;
    border-radius: 9px;
    background: #f7f9fb;
    color: #8a98a6;
    font-size: 13px;
}

@media (max-width: 767.98px) {
    .cx-design-system .cx-r1-device-dot .device-dot-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .cx-design-system .cx-r1-device-dot .device-dot-card {
        width: 100%;
        max-width: 520px;
        grid-template-columns: 92px minmax(0, 1fr);
    }
}

@media (max-width: 479.98px) {
    .cx-design-system .cx-r1-device-dot .device-dot-card {
        padding: 12px;
        grid-template-columns: 82px minmax(0, 1fr);
        gap: 10px 12px;
    }

    .cx-design-system .cx-r1-device-dot .device-dot-image {
        width: 72px;
        height: 72px;
    }

    .cx-design-system .cx-r1-device-dot .device-dot-connection {
        padding: 0 7px;
        font-size: 10.75px;
    }
}

.cx-design-system .cx-r1-device-dot .device-dot-battery-field-grid {
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(220px, 300px) minmax(0, 1fr);
    align-items: start;
    gap: 14px 18px;
}

.cx-design-system .cx-r1-device-dot .device-dot-battery-input-wrap {
    position: relative;
    min-width: 0;
    width: 100%;
}

.cx-design-system .cx-r1-device-dot .device-dot-battery-input {
    width: 100%;
    min-width: 0;
    height: 46px;
    padding-right: 52px;
    font-variant-numeric: tabular-nums;
}

.cx-design-system .cx-r1-device-dot .device-dot-battery-suffix {
    position: absolute;
    top: 1px;
    right: 1px;
    width: 46px;
    height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-left: 1px solid #e1e8ee;
    border-radius: 0 9px 9px 0;
    background: #f5f8fa;
    color: #526b82;
    font-size: 13px;
    font-weight: 760;
    pointer-events: none;
}

.cx-design-system .cx-r1-device-dot .device-dot-battery-description {
    min-height: 46px;
    padding: 11px 13px;
    display: flex;
    align-items: center;
    border-left: 3px solid #86a3bd;
    border-radius: 7px;
    background: #f7fafc;
    color: #5b7186;
    font-size: 12.75px;
    line-height: 1.5;
}

.cx-design-system .cx-r1-device-dot .device-dot-recipients {
    min-width: 0;
    display: grid;
    gap: 14px;
}

.cx-design-system .cx-r1-device-dot .device-dot-card,
.cx-design-system .cx-r1-device-dot .device-dot-locate-button {
    transition:
        border-color .18s cubic-bezier(.2, .72, .26, 1),
        background-color .18s cubic-bezier(.2, .72, .26, 1),
        box-shadow .18s cubic-bezier(.2, .72, .26, 1) !important;
}

.cx-design-system .cx-r1-device-dot .device-dot-card:hover,
.cx-design-system .cx-r1-device-dot .device-dot-locate-button:hover:not(:disabled) {
    transform: none !important;
    box-shadow: 0 4px 12px rgba(36, 66, 95, .05) !important;
}

@keyframes cx-r8-popover-in {
    from {
        opacity: 0;
        transform: translateY(-3px) scale(.995);
    }

    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

@media (max-width: 767.98px) {
    .cx-design-system .cx-r1-device-dot .device-dot-battery-field-grid {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (prefers-reduced-motion: reduce) {
    .cx-design-system .cx-custom-select-trigger,
    .cx-design-system .cx-custom-select-option,
    .cx-design-system .cx-paged-list .conexgo-pagedlist-pagination .page-link,
    .cx-design-system .cx-device-config-dialog .form-control,
    .cx-design-system .cx-device-config-dialog input,
    .cx-design-system .cx-device-config-dialog textarea {
        transition-duration: .01ms !important;
    }
}

/* ==========================================================================
   CONEXGO COLLAPSIBLE FILTERS + RESPONSIVE ERGONOMICS R8.2
   Shared disclosure for every ResponsiveFilterPanel, compact adaptive grids
   and one restrained focus treatment across lists and forms.
   ========================================================================== */

.cx-design-system {
    --cx-r82-focus-border: #6b8ba7;
    --cx-r82-focus-ring: 0 0 0 3px rgba(62, 106, 153, .075);
    --cx-r82-focus-shadow: 0 4px 12px rgba(36, 66, 95, .045);
}

/* Shared filter disclosure: used by Devices, Alerts and future pages. */
.cx-filter-disclosure {
    width: 100%;
    min-width: 0;
    margin: 0 0 12px;
    overflow: visible;
    border: 1px solid #dbe4ec;
    border-radius: 12px;
    background: #ffffff;
    box-shadow: 0 3px 12px rgba(36, 66, 95, .035);
}

.cx-filter-disclosure-toggle {
    width: 100%;
    min-width: 0;
    min-height: 50px;
    padding: 9px 12px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    border: 0;
    border-radius: 11px;
    background: #ffffff;
    color: #29445e;
    font: inherit;
    text-align: left;
    cursor: pointer;
    transition:
        background-color .18s cubic-bezier(.2, .72, .26, 1),
        color .18s cubic-bezier(.2, .72, .26, 1),
        box-shadow .18s cubic-bezier(.2, .72, .26, 1);
}

.cx-filter-disclosure-toggle:hover:not(:disabled) {
    background: #f7f9fb;
}

.cx-filter-disclosure-toggle:focus-visible {
    outline: 0;
    box-shadow: inset var(--cx-r82-focus-ring);
}

.cx-filter-disclosure-toggle:disabled {
    cursor: not-allowed;
    opacity: .62;
}

.cx-filter-disclosure-heading {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 10px;
}

.cx-filter-disclosure-icon {
    width: 31px;
    height: 31px;
    min-width: 31px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #dbe5ed;
    border-radius: 9px;
    background: #eef4f8;
    color: #416b91;
    font-size: 12px;
}

.cx-filter-disclosure-title {
    min-width: 0;
    overflow: hidden;
    color: #2d4963;
    font-size: 13px;
    font-weight: 780;
    line-height: 1.3;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.cx-filter-disclosure-badge {
    min-width: 28px;
    height: 26px;
    padding: 0 8px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #d7e2eb;
    border-radius: 999px;
    background: #f7fafc;
    color: #315879;
    font-size: 11.5px;
    font-weight: 800;
    font-variant-numeric: tabular-nums;
}

.cx-filter-disclosure-chevron {
    width: 32px;
    height: 32px;
    min-width: 32px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 9px;
    color: #526f89;
    font-size: 12px;
    transition:
        background-color .18s cubic-bezier(.2, .72, .26, 1),
        color .18s cubic-bezier(.2, .72, .26, 1);
}

.cx-filter-disclosure-toggle:hover:not(:disabled)
.cx-filter-disclosure-chevron {
    background: #edf3f7;
    color: #315879;
}

.cx-filter-disclosure-chevron i {
    transition: transform .2s cubic-bezier(.2, .72, .26, 1);
}

.cx-filter-disclosure[data-expanded="true"]
.cx-filter-disclosure-toggle {
    border-radius: 11px 11px 0 0;
    background: #fbfcfd;
    box-shadow: inset 0 -1px 0 #e3eaf0;
}

.cx-filter-disclosure[data-expanded="true"]
.cx-filter-disclosure-chevron {
    background: #eaf2f7;
    color: #315879;
}

.cx-filter-disclosure[data-expanded="true"]
.cx-filter-disclosure-chevron i {
    transform: rotate(180deg);
}

.cx-filter-disclosure-region {
    display: grid;
    grid-template-rows: 0fr;
    opacity: 0;
    visibility: hidden;
    transition:
        grid-template-rows .22s cubic-bezier(.2, .72, .26, 1),
        opacity .16s ease,
        visibility 0s linear .22s;
}

.cx-filter-disclosure[data-expanded="true"]
.cx-filter-disclosure-region {
    grid-template-rows: 1fr;
    opacity: 1;
    visibility: visible;
    transition:
        grid-template-rows .22s cubic-bezier(.2, .72, .26, 1),
        opacity .18s ease .03s,
        visibility 0s;
}

.cx-filter-disclosure-inner {
    min-width: 0;
    min-height: 0;
    overflow: hidden;
}

/* Device filters: compact and truly adaptive when the shared panel is open. */
.cx-filter-disclosure-inner > .device-filter-panel--professional {
    padding: 11px 12px 13px !important;
    border: 0 !important;
    background: #ffffff !important;
}

.cx-filter-disclosure-inner > .device-filter-panel--professional::before {
    display: none !important;
}

.cx-filter-disclosure-inner .device-filter-toolbar {
    min-height: 0;
    margin: 0 0 9px;
    justify-content: flex-end;
    gap: 10px;
}

.cx-filter-disclosure-inner .device-filter-summary {
    display: none !important;
}

.cx-filter-disclosure-inner .device-filter-reset {
    min-height: 34px;
    padding: 0 11px;
    border-radius: 8px;
    font-size: 11.5px;
    box-shadow: none;
}

.cx-filter-disclosure-inner .device-filter-reset:hover:not(:disabled),
.cx-filter-disclosure-inner .device-filter-reset:focus-visible:not(:disabled) {
    border-color: #b2c3d1;
    background: #f6f8fa;
    box-shadow: var(--cx-r82-focus-shadow);
    transform: none;
}

.cx-filter-disclosure-inner .device-filter-grid {
    grid-template-columns: repeat(6, minmax(0, 1fr));
    align-items: end;
    gap: 10px;
}

.cx-filter-disclosure-inner .device-filter-field {
    gap: 5px;
    animation: none !important;
}

.cx-filter-disclosure-inner .device-filter-label {
    min-height: 24px;
    gap: 6px;
    font-size: 11.5px;
}

.cx-filter-disclosure-inner .device-filter-label-icon {
    width: 24px;
    height: 24px;
    min-width: 24px;
    border-radius: 7px;
    box-shadow: none;
    transform: none !important;
}

.cx-filter-disclosure-inner .device-filter-field:hover
.device-filter-label-icon,
.cx-filter-disclosure-inner .device-filter-field:focus-within
.device-filter-label-icon {
    border-color: #c3d2df;
    background: #eef4f8;
    transform: none !important;
}

.cx-filter-disclosure-inner .device-filter-control
.cx-custom-select-trigger {
    height: 42px;
    min-height: 42px;
    border-radius: 9px;
}

/* Alert filters: no oversized row, responsive chips with clean wrapping. */
.cx-filter-disclosure-inner > .alert-filter-panel {
    margin: 0 !important;
    padding: 11px 12px 13px;
}

.cx-filter-disclosure-inner .alert-filter-inline {
    width: 100%;
    display: flex !important;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px 16px;
}

.cx-filter-disclosure-inner .alert-filter-inline > label {
    min-height: 34px;
    margin: 0 !important;
    padding: 5px 9px;
    display: inline-flex !important;
    align-items: center;
    gap: 7px;
    border: 1px solid transparent;
    border-radius: 9px;
    background: transparent;
    transition:
        border-color .18s cubic-bezier(.2, .72, .26, 1),
        background-color .18s cubic-bezier(.2, .72, .26, 1);
}

.cx-filter-disclosure-inner .alert-filter-inline > label:hover {
    border-color: #d8e2ea;
    background: #f7f9fb;
}

/* One softer, consistent focus color across all pages. */
.cx-design-system .cx-custom-select-trigger:focus-visible,
.cx-design-system .cx-custom-select-trigger.is-open,
.cx-design-system .form-control:focus,
.cx-design-system .form-select:focus,
.cx-design-system input:not([type="checkbox"]):not([type="radio"]):focus,
.cx-design-system textarea:focus {
    border-color: var(--cx-r82-focus-border) !important;
    outline: 0 !important;
    box-shadow:
        var(--cx-r82-focus-ring),
        var(--cx-r82-focus-shadow) !important;
}

.cx-design-system button:focus-visible,
.cx-design-system a:focus-visible,
.cx-design-system [role="button"]:focus-visible {
    outline: 0;
}

.cx-design-system .cx-paged-list
.conexgo-pagedlist-pagination
.page-item:not(.disabled):not(.conexgo-pagedlist-page-status)
.page-link:focus-visible {
    border-color: var(--cx-r82-focus-border) !important;
    box-shadow: var(--cx-r82-focus-ring) !important;
}

/* PagedList itself remains compact on every list page. */
.cx-design-system .cx-paged-list .conexgo-pagedlist-toolbar {
    gap: 10px 14px !important;
    margin-bottom: 10px !important;
}

.cx-design-system .cx-paged-list .conexgo-pagedlist-filters {
    gap: 10px !important;
}

.cx-design-system .cx-paged-list
.conexgo-pagedlist-pagination .pagination {
    gap: 5px !important;
}

@media (max-width: 1499.98px) {
    .cx-filter-disclosure-inner .device-filter-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 991.98px) {
    .cx-filter-disclosure {
        margin-bottom: 10px;
    }

    .cx-filter-disclosure-toggle {
        min-height: 48px;
        padding: 8px 10px;
    }

    .cx-filter-disclosure-inner .device-filter-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .cx-design-system .cx-paged-list .conexgo-pagedlist-toolbar {
        align-items: stretch !important;
    }

    .cx-design-system .cx-paged-list
    .conexgo-pagedlist-pagination {
        justify-self: stretch !important;
    }
}

@media (max-width: 639.98px) {
    .cx-filter-disclosure-title {
        font-size: 12.5px;
    }

    .cx-filter-disclosure-inner > .device-filter-panel--professional,
    .cx-filter-disclosure-inner > .alert-filter-panel {
        padding: 10px !important;
    }

    .cx-filter-disclosure-inner .device-filter-toolbar {
        align-items: stretch;
        margin-bottom: 8px;
    }

    .cx-filter-disclosure-inner .device-filter-reset {
        width: 100%;
        min-height: 38px;
    }

    .cx-filter-disclosure-inner .device-filter-grid {
        grid-template-columns: minmax(0, 1fr);
        gap: 9px;
    }

    .cx-filter-disclosure-inner .alert-filter-inline {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 7px;
    }

    .cx-filter-disclosure-inner .alert-filter-inline > label {
        min-width: 0;
    }

    .cx-design-system .cx-paged-list
    .conexgo-pagedlist-filters {
        grid-template-columns: minmax(0, 1fr) !important;
    }
}

@media (max-width: 399.98px) {
    .cx-filter-disclosure-inner .alert-filter-inline {
        grid-template-columns: minmax(0, 1fr);
    }

    .cx-filter-disclosure-heading {
        gap: 8px;
    }

    .cx-filter-disclosure-icon {
        width: 29px;
        height: 29px;
        min-width: 29px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .cx-filter-disclosure-region,
    .cx-filter-disclosure-chevron i,
    .cx-filter-disclosure-toggle,
    .cx-filter-disclosure-inner * {
        transition-duration: .01ms !important;
        animation: none !important;
    }
}
/* ==========================================================================
   CONEXGO MODAL CUSTOM SELECT OVERLAY R8.3
   MudPopover content is portalled outside the modal content tree. These rules
   are intentionally global so the dropdown remains styled and above MudDialog.
   ========================================================================== */

.mud-popover.cx-custom-select-popover,
.mud-popover.cx-custom-select-popover--overlay,
.cx-custom-select-popover,
.cx-custom-select-popover--overlay {
    z-index: 3200 !important;
    margin-top: 6px;
    overflow: visible !important;
    background: transparent !important;
    box-shadow: none !important;
    pointer-events: auto !important;
}

.mud-popover.cx-custom-select-popover .cx-custom-select-menu,
.mud-popover.cx-custom-select-popover--overlay .cx-custom-select-menu,
.cx-custom-select-popover .cx-custom-select-menu,
.cx-custom-select-popover--overlay .cx-custom-select-menu {
    width: 100%;
    min-width: 100%;
    max-width: min(560px, calc(100vw - 24px));
    max-height: min(320px, calc(100vh - 32px)) !important;
    padding: 7px;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    touch-action: pan-y;
    border: 1px solid #d8e2ea;
    border-radius: 12px;
    background: #ffffff;
    box-shadow:
        0 14px 30px rgba(36, 66, 95, .12),
        0 3px 9px rgba(36, 66, 95, .05);
    scrollbar-width: thin;
    scrollbar-color: #a8b8c7 transparent;
}

.mud-popover.cx-custom-select-popover .cx-custom-select-option,
.mud-popover.cx-custom-select-popover--overlay .cx-custom-select-option,
.cx-custom-select-popover .cx-custom-select-option,
.cx-custom-select-popover--overlay .cx-custom-select-option {
    width: 100%;
    min-width: 0;
}

.cx-design-system .cx-custom-select-trigger:focus-visible,
.cx-design-system .cx-custom-select-trigger.is-open {
    border-color: #7894ad !important;
    outline: 0 !important;
    background: #ffffff;
    box-shadow:
        0 0 0 2px rgba(62, 106, 153, .065),
        0 3px 9px rgba(36, 66, 95, .04) !important;
    transform: none !important;
}

.cx-design-system .cx-custom-select-trigger.is-open
.cx-custom-select-chevron {
    background: #edf3f7;
    color: #315879;
}

@media (max-width: 575.98px) {
    .mud-popover.cx-custom-select-popover .cx-custom-select-menu,
    .mud-popover.cx-custom-select-popover--overlay .cx-custom-select-menu,
    .cx-custom-select-popover .cx-custom-select-menu,
    .cx-custom-select-popover--overlay .cx-custom-select-menu {
        max-width: calc(100vw - 16px);
        max-height: min(280px, calc(100vh - 24px)) !important;
        border-radius: 11px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .mud-popover.cx-custom-select-popover .cx-custom-select-menu,
    .mud-popover.cx-custom-select-popover--overlay .cx-custom-select-menu,
    .cx-custom-select-popover .cx-custom-select-menu,
    .cx-custom-select-popover--overlay .cx-custom-select-menu {
        animation: none !important;
    }
}

/* ==========================================================================
   CONEXGO MODAL SELECT VISIBILITY R8.4 CORRECTED
   Keeps the same custom selects everywhere. Only the portalled dropdown layer
   is raised and styled globally so it remains visible above modal dialogs.
   ========================================================================== */

.mud-popover-provider.cx-popover-provider--select-visible,
.mud-popover-provider:has(
    .cx-custom-select-popover--overlay.mud-popover-open
) {
    z-index: 5200 !important;
}

.mud-popover.cx-custom-select-popover,
.mud-popover.cx-custom-select-popover--overlay,
.mud-popover.cx-custom-select-popover--elevated {
    z-index: 5200 !important;
    overflow: visible !important;
    background: transparent !important;
    box-shadow: none !important;
    pointer-events: auto !important;
}

.mud-popover.cx-custom-select-popover.mud-popover-open,
.mud-popover.cx-custom-select-popover--overlay.mud-popover-open,
.mud-popover.cx-custom-select-popover--elevated.mud-popover-open {
    visibility: visible !important;
    pointer-events: auto !important;
}

.cx-custom-select-menu[data-cx-select-owner] {
    width: 100%;
    min-width: 100%;
    max-width: min(560px, calc(100vw - 24px));
    max-height: min(320px, calc(100vh - 32px)) !important;
    padding: 7px;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    touch-action: pan-y;
    border: 1px solid #d8e2ea;
    border-radius: 12px;
    background: #ffffff;
    box-shadow:
        0 14px 30px rgba(36, 66, 95, .12),
        0 3px 9px rgba(36, 66, 95, .05);
    scrollbar-width: thin;
    scrollbar-color: #a8b8c7 transparent;
}

.cx-custom-select-menu[data-cx-select-owner]
.cx-custom-select-option {
    width: 100%;
    min-width: 0;
}

.cx-design-system .cx-custom-select-trigger:focus-visible,
.cx-design-system .cx-custom-select-trigger.is-open {
    border-color: #7894ad !important;
    outline: 0 !important;
    background: #ffffff;
    box-shadow:
        0 0 0 2px rgba(62, 106, 153, .065),
        0 3px 9px rgba(36, 66, 95, .04) !important;
    transform: none !important;
}

@media (max-width: 575.98px) {
    .cx-custom-select-menu[data-cx-select-owner] {
        max-width: calc(100vw - 16px);
        max-height: min(280px, calc(100vh - 24px)) !important;
        border-radius: 11px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .cx-custom-select-menu[data-cx-select-owner] {
        animation: none !important;
    }
}

/* ==========================================================================
   CONEXGO TOP-LAYER CUSTOM SELECT R8.5
   The same custom select is used on normal pages and in dialogs. The dropdown
   uses the browser top layer, so modal overflow and z-index cannot hide it.
   ========================================================================== */

.cx-custom-select-menu--top-layer[popover] {
    position: fixed;
    inset: auto;
    margin: 0;
    padding: 7px;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    touch-action: pan-y;
    border: 1px solid #d8e2ea;
    border-radius: 12px;
    background: #ffffff;
    color: #29435d;
    box-shadow:
        0 16px 34px rgba(36, 66, 95, .14),
        0 4px 10px rgba(36, 66, 95, .055);
    scrollbar-width: thin;
    scrollbar-color: #a8b8c7 transparent;
    z-index: 2147483000;
}

.cx-custom-select-menu--top-layer[popover]::backdrop {
    background: transparent;
    pointer-events: none;
}

.cx-custom-select-menu--top-layer[popover]:popover-open {
    display: block;
    visibility: visible;
    animation: cx-r85-select-open
        .16s cubic-bezier(.2, .72, .26, 1)
        both;
}

.cx-custom-select-menu--top-layer
.cx-custom-select-option {
    width: 100%;
    min-width: 0;
}

.cx-custom-select-menu--fallback-open {
    display: block !important;
    z-index: 2147483000 !important;
}

.cx-custom-select-value,
.cx-custom-select-option-label {
    display: flex;
    align-items: center;
    gap: 8px;
}

.cx-custom-select-value > i,
.cx-custom-select-option-label > i {
    width: 17px;
    min-width: 17px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #416b91;
    font-size: 13px;
    line-height: 1;
}

.cx-custom-select-option.is-selected
.cx-custom-select-option-label > i {
    color: #2f5f88;
}

.cx-design-system .cx-custom-select-trigger:focus-visible,
.cx-design-system .cx-custom-select-trigger.is-open {
    border-color: #7894ad !important;
    outline: 0 !important;
    background: #ffffff;
    box-shadow:
        0 0 0 2px rgba(62, 106, 153, .065),
        0 3px 9px rgba(36, 66, 95, .04) !important;
    transform: none !important;
}

@keyframes cx-r85-select-open {
    from {
        opacity: 0;
        transform: translateY(-3px) scale(.995);
    }

    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

@media (max-width: 575.98px) {
    .cx-custom-select-menu--top-layer[popover] {
        padding: 6px;
        border-radius: 11px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .cx-custom-select-menu--top-layer[popover] {
        animation: none !important;
    }
}

:root {
    --cx-form-dialog-max-width: 1280px;
    --cx-form-inner-max-width: 1120px;
}

.mud-dialog:has(.form-horizontal),
.mud-dialog:has(.conexgo-device-addedit-form) {
    width: min(
        calc(100vw - 40px),
        var(--cx-form-dialog-max-width)
    ) !important;
    max-width: var(--cx-form-dialog-max-width) !important;
    max-height: min(90vh, 900px) !important;
    border-radius: 15px !important;
}

.mud-dialog:has(.form-horizontal) .mud-dialog-content,
.mud-dialog .conexgo-device-addedit-content {
    padding: 18px 22px !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
}

.mud-dialog:has(.form-horizontal) .form-horizontal,
.conexgo-device-addedit-form {
    width: 100%;
    max-width: var(--cx-form-inner-max-width);
    margin-inline: auto;
}

.mud-dialog:has(.form-horizontal) .form-horizontal > .row,
.conexgo-device-addedit-form > .row {
    margin-right: 0;
    margin-bottom: 10px;
    margin-left: 0;
    align-items: center;
}

.mud-dialog:has(.form-horizontal) .form-horizontal > .row > [class*="col-"],
.conexgo-device-addedit-form > .row > [class*="col-"] {
    min-width: 0;
}

.mud-dialog:has(.form-horizontal) .form-label,
.conexgo-device-addedit-form .form-label {
    min-height: 42px;
    margin: 0;
    padding-top: 0 !important;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    color: #3c5268;
    font-size: 12px;
    font-weight: 780;
    line-height: 1.25;
    text-align: right !important;
}

.conexgo-readonly-value,
.mud-dialog .form-horizontal > .row >
.col-md-9:not(:has(
    input,
    textarea,
    select,
    button,
    .cx-control,
    .mud-input-control,
    .custom-switch
)) {
    min-height: 42px;
    margin-top: 0 !important;
    padding: 0 13px !important;
    display: flex;
    align-items: center;
    gap: 10px;
    overflow-wrap: anywhere;
    border: 1px solid #dbe4ec;
    border-radius: 9px;
    background: #f4f7f9;
    color: #304a62;
    font-size: 13px;
    line-height: 1.35;
}

.mud-dialog .form-control[readonly],
.mud-dialog .form-control:disabled,
.mud-dialog input[readonly],
.mud-dialog input:disabled,
.mud-dialog textarea[readonly],
.mud-dialog textarea:disabled {
    min-height: 42px;
    padding-right: 13px !important;
    padding-left: 13px !important;
    border-color: #dbe4ec !important;
    background: #f4f7f9 !important;
    color: #304a62 !important;
    opacity: 1 !important;
}

.conexgo-device-addedit-form .form-control,
.conexgo-device-addedit-form .form-select,
.conexgo-device-addedit-form .cx-custom-select-trigger {
    min-height: 42px;
}

.conexgo-device-addedit-form textarea.form-control {
    min-height: 110px !important;
    height: 156px;
    max-height: none !important;
    resize: both !important;
    overflow: auto !important;
    overscroll-behavior: contain;
}

.mud-dialog .conexgo-device-addedit-actions {
    padding: 12px 18px !important;
}

@media (max-width: 991.98px) {
    :root {
        --cx-form-dialog-max-width: 900px;
        --cx-form-inner-max-width: 820px;
    }
}

@media (max-width: 767.98px) {
    .mud-dialog:has(.form-horizontal),
    .mud-dialog:has(.conexgo-device-addedit-form) {
        width: calc(100vw - 12px) !important;
        max-width: calc(100vw - 12px) !important;
        max-height: calc(100vh - 12px) !important;
        border-radius: 12px !important;
    }

    .mud-dialog:has(.form-horizontal) .mud-dialog-content,
    .mud-dialog .conexgo-device-addedit-content {
        padding: 14px !important;
    }

    .mud-dialog:has(.form-horizontal) .form-label,
    .conexgo-device-addedit-form .form-label {
        min-height: auto;
        margin-bottom: 6px;
        justify-content: flex-start;
        text-align: left !important;
    }

    .conexgo-readonly-value,
    .mud-dialog .form-horizontal > .row >
    .col-md-9:not(:has(
        input,
        textarea,
        select,
        button,
        .cx-control,
        .mud-input-control,
        .custom-switch
    )) {
        width: 100%;
        min-height: 42px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .mud-dialog:has(.form-horizontal) *,
    .conexgo-device-addedit-form * {
        transition-duration: .01ms !important;
        animation: none !important;
    }
}

/* Responsive alignment for tablets, wide screens and header overlays. */
@media (min-width: 768px) and (max-width: 1199.98px) {
    .main-content.app-content .main-container.container-fluid {
        padding-inline: clamp(14px, 2vw, 24px) !important;
    }
    .page-title { font-size: clamp(1.35rem, 1.15rem + .55vw, 1.7rem) !important; }
    .btn:not(.btn-sm):not(.btn-icon),
    .mud-button-root:not(.mud-icon-button) {
        min-height: 40px;
        font-size: .88rem;
    }
    .conexgo-header-dropdown-menu {
        max-width: min(440px, calc(100vw - 24px)) !important;
    }
    .responsive-filter-panel,
    .conexgo-filter-panel,
    .device-filter-panel {
        width: 100% !important;
    }
}

@media (min-width: 1600px) {
    .main-content.app-content .main-container.container-fluid {
        max-width: 1780px;
        margin-inline: auto !important;
        padding-inline: clamp(24px, 2.3vw, 46px) !important;
    }
    .page-title { font-size: clamp(1.55rem, 1.3rem + .4vw, 1.95rem) !important; }
    .card-header h2,
    .card-header h3 { font-size: clamp(1.12rem, 1rem + .25vw, 1.35rem); }
    .form-control,
    .cx-select-control,
    .mud-input-control { font-size: .95rem; }
}

@media (max-width: 767.98px) {
    .conexgo-header-dropdown-menu,
    .conexgo-servers-dropdown,
    .conexgo-language-dropdown,
    .conexgo-alert-dropdown,
    .conexgo-notification-dropdown {
        position: fixed !important;
        top: 70px !important;
        left: 8px !important;
        right: 8px !important;
        width: auto !important;
        min-width: 0 !important;
        max-width: none !important;
        max-height: calc(100dvh - 154px) !important;
        overflow-y: auto !important;
        transform: none !important;
        border-radius: 12px !important;
    }
    .conexgo-alert-dropdown { top: 54px !important; }
    .responsive-filter-panel,
    .conexgo-filter-panel,
    .device-filter-panel,
    .conexgo-list-filter-panel {
        width: 100% !important;
        max-width: none !important;
        padding: 12px !important;
    }
    .responsive-filter-panel .row,
    .conexgo-filter-panel .row,
    .device-filter-panel .row {
        margin-inline: 0 !important;
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
        gap: 10px !important;
    }
    .responsive-filter-panel [class*="col-"],
    .conexgo-filter-panel [class*="col-"],
    .device-filter-panel [class*="col-"] {
        width: 100% !important;
        max-width: none !important;
        padding-inline: 0 !important;
    }
    .responsive-filter-panel .form-control,
    .responsive-filter-panel select,
    .conexgo-filter-panel .form-control,
    .device-filter-panel .form-control,
    .device-filter-panel select {
        width: 100% !important;
        max-width: none !important;
    }
    .side-app { min-height: auto !important; }
    .main-content.app-content { min-height: auto !important; }
    .conexgo-page-content { padding-bottom: 6px; }
}

/* Underline useful links inside table data cells only. Dropdowns, buttons and navigation remain clean. */
.table tbody td a:not(.dropdown-item):not(.btn),
.table tbody td a:not(.dropdown-item):not(.btn):hover,
.table tbody td a:not(.dropdown-item):not(.btn):focus-visible {
    text-decoration: underline;
    text-underline-offset: 2px;
}
.table tbody td a:not(.dropdown-item):not(.btn):hover,
.table tbody td a:not(.dropdown-item):not(.btn):focus-visible {
    color: #1f4f78 !important;
}
.table .dropdown-menu a,
.table .dropdown-menu a:hover,
.table .dropdown-menu a:focus-visible {
    text-decoration: none !important;
}

.cx-map-empty-state {
    min-height: 360px;
    display: grid;
    place-items: center;
    padding: 24px;
    color: #6e7f91;
    font-size: .95rem;
    text-align: center;
    background: #f8fafc;
}
@media (max-width: 767.98px) {
    .cx-map-empty-state { min-height: 260px; }
}

/* CONEXGO MOBILE PAGE HEADER ALIGNMENT R4 */
@media (max-width: 767.98px) {
    .page-header.cx-page-header-with-mobile-back,
    .cx-settings-page-header.cx-page-header-with-mobile-back,
    .cx-page-header-with-mobile-back {
        display: grid !important;
        grid-template-columns: 44px minmax(0, 1fr) !important;
        grid-template-rows: auto !important;
        column-gap: 10px !important;
        row-gap: 0 !important;
        align-items: start !important;
        width: 100% !important;
        min-width: 0 !important;
        min-height: 0 !important;
        margin: 0 0 12px !important;
        padding: 8px 0 10px !important;
    }

    .cx-page-header-with-mobile-back > .cx-page-header-mobile-back {
        grid-column: 1 !important;
        grid-row: 1 !important;
        align-self: start !important;
        justify-self: start !important;
        margin: 0 !important;
    }

    .cx-page-header-with-mobile-back > .cx-page-header-copy {
        grid-column: 2 !important;
        grid-row: 1 !important;
        min-width: 0 !important;
        width: 100% !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: flex-start !important;
        justify-content: flex-start !important;
        gap: 4px !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    .cx-page-header-with-mobile-back .cx-page-header-copy > .page-title,
    .cx-page-header-with-mobile-back .page-title {
        width: 100% !important;
        min-width: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        font-size: 1.05rem !important;
        line-height: 1.25 !important;
        text-align: left !important;
        white-space: normal !important;
    }

    .cx-page-header-with-mobile-back .cx-page-header-copy > .breadcrumb,
    .cx-page-header-with-mobile-back .breadcrumb {
        width: 100% !important;
        min-width: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        display: flex !important;
        flex-wrap: wrap !important;
        align-items: center !important;
        justify-content: flex-start !important;
        gap: 0 !important;
        font-size: .75rem !important;
        line-height: 1.35 !important;
        overflow-wrap: anywhere !important;
    }

    .cx-page-header-with-mobile-back .breadcrumb-item,
    .cx-page-header-with-mobile-back .breadcrumb-item a {
        font-size: inherit !important;
        line-height: inherit !important;
    }
}

/* CONEXGO R6 MOBILE BACK HEADER STANDARD */
@media (max-width: 767.98px) {
    .page-header.cx-page-header-with-mobile-back, .cx-page-header-with-mobile-back {
        width: 100% !important; min-width: 0 !important; min-height: 0 !important;
        margin: 0 0 14px !important; padding: 10px 0 12px !important;
        display: flex !important; align-items: flex-start !important; justify-content: flex-start !important;
        flex-wrap: nowrap !important; gap: 11px !important; background: transparent !important;
    }
    .cx-page-header-with-mobile-back .cx-page-header-mobile-back {
        width: 42px !important; min-width: 42px !important; height: 42px !important; min-height: 42px !important;
        flex: 0 0 42px !important; margin: 0 !important; padding: 0 !important;
        display: inline-grid !important; place-items: center !important; align-self: flex-start !important;
        border-radius: 999px !important;
    }
    .cx-page-header-with-mobile-back .cx-page-header-mobile-back > a,
    .cx-page-header-with-mobile-back .cx-page-header-mobile-back > button,
    .cx-page-header-with-mobile-back a.cx-page-header-mobile-back,
    .cx-page-header-with-mobile-back button.cx-page-header-mobile-back {
        width: 42px !important; min-width: 42px !important; height: 42px !important; min-height: 42px !important;
        padding: 0 !important; display: inline-grid !important; place-items: center !important; border-radius: 999px !important;
    }
    .cx-page-header-with-mobile-back .cx-page-header-copy {
        min-width: 0 !important; width: calc(100% - 53px) !important; margin: 0 !important; padding: 0 !important;
        display: grid !important; grid-template-columns: minmax(0,1fr) !important; grid-auto-flow: row !important;
        align-items: start !important; justify-items: start !important; gap: 5px !important;
    }
    .cx-page-header-with-mobile-back .cx-page-header-copy > .page-title,
    .cx-page-header-with-mobile-back .page-title {
        width: 100% !important; min-width: 0 !important; margin: 0 !important; padding: 0 !important;
        display: block !important; color: #15233b !important; font-size: 1.05rem !important; font-weight: 800 !important;
        line-height: 1.25 !important; text-align: left !important; white-space: normal !important;
    }
    .cx-page-header-with-mobile-back .cx-page-header-copy > .breadcrumb,
    .cx-page-header-with-mobile-back .breadcrumb {
        width: 100% !important; min-width: 0 !important; margin: 0 !important; padding: 0 !important;
        display: flex !important; flex-wrap: wrap !important; align-items: center !important; justify-content: flex-start !important;
        gap: 0 !important; font-size: .76rem !important; line-height: 1.35 !important; text-align: left !important;
    }
}

html body .cx-custom-select-trigger {
    min-height: 42px !important;
    height: 42px !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 30px !important;
    align-items: center !important;
    gap: 6px !important;
    padding: 0 5px 0 12px !important;
    border: 1px solid #c9d7e3 !important;
    border-radius: 10px !important;
    background: #ffffff !important;
    color: #173b62 !important;
    box-shadow: 0 1px 2px rgba(22, 55, 87, .035) !important;
    transform: none !important;
    transition: border-color .14s ease, box-shadow .14s ease, background-color .14s ease !important;
}

html body .cx-custom-select-trigger:has(.cx-custom-select-leading-icon) {
    grid-template-columns: 26px minmax(0, 1fr) 30px !important;
    padding-left: 8px !important;
}

html body .cx-custom-select-trigger:hover:not(:disabled) {
    border-color: #91a9bd !important;
    background: #ffffff !important;
    box-shadow: 0 2px 5px rgba(22, 55, 87, .06) !important;
    transform: none !important;
}

html body .cx-custom-select-trigger:focus-visible,
html body .cx-custom-select-trigger[data-cx-open="True"],
html body .cx-custom-select-trigger[data-cx-open="true"] {
    border-color: #6f8faa !important;
    outline: none !important;
    box-shadow: 0 0 0 3px rgba(62, 106, 153, .12) !important;
}

html body .cx-custom-select-value,
html body .cx-custom-select-option-label {
    min-width: 0 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

html body .cx-custom-select-leading-icon {
    width: 26px !important;
    height: 30px !important;
    display: inline-grid !important;
    place-items: center !important;
    color: #557898 !important;
}

html body .cx-custom-select-chevron {
    width: 30px !important;
    min-width: 30px !important;
    height: 30px !important;
    display: inline-grid !important;
    place-items: center !important;
    align-self: center !important;
    justify-self: end !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 7px !important;
    background: #f3f7fa !important;
    color: #3e6386 !important;
}

html body .cx-custom-select-trigger:hover:not(:disabled) .cx-custom-select-chevron {
    background: #eaf1f6 !important;
}

html body .cx-custom-select-menu--top-layer[popover],
html body .cx-custom-select-menu[data-cx-select-owner] {
    padding: 5px !important;
    border: 1px solid #cbd8e3 !important;
    border-radius: 10px !important;
    background: #ffffff !important;
    box-shadow: 0 12px 30px rgba(18, 49, 78, .15), 0 2px 8px rgba(18, 49, 78, .07) !important;
    overflow-x: hidden !important;
    scrollbar-width: thin !important;
    scrollbar-color: #a9bac8 transparent !important;
}

html body .cx-custom-select-menu--top-layer[popover] .cx-custom-select-option,
html body .cx-custom-select-menu[data-cx-select-owner] .cx-custom-select-option {
    width: 100% !important;
    min-height: 38px !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 24px !important;
    align-items: center !important;
    gap: 8px !important;
    padding: 7px 8px 7px 10px !important;
    border: 0 !important;
    border-radius: 7px !important;
    background: transparent !important;
    color: #214467 !important;
    font-size: 13.5px !important;
    font-weight: 600 !important;
    line-height: 1.25 !important;
    text-align: left !important;
    transform: none !important;
}

html body .cx-custom-select-menu--top-layer[popover] .cx-custom-select-option:hover:not(:disabled),
html body .cx-custom-select-menu[data-cx-select-owner] .cx-custom-select-option:hover:not(:disabled),
html body .cx-custom-select-menu--top-layer[popover] .cx-custom-select-option.is-active,
html body .cx-custom-select-menu[data-cx-select-owner] .cx-custom-select-option.is-active {
    background: #f1f6f9 !important;
    color: #173b62 !important;
    transform: none !important;
}

html body .cx-custom-select-menu--top-layer[popover] .cx-custom-select-option[aria-selected="true"],
html body .cx-custom-select-menu[data-cx-select-owner] .cx-custom-select-option[aria-selected="true"] {
    background: #e8f1f7 !important;
    color: #173b62 !important;
    box-shadow: inset 3px 0 0 #3e6a99 !important;
}

html body .cx-custom-select-menu--top-layer[popover] .cx-custom-select-option[aria-selected="true"]:hover,
html body .cx-custom-select-menu[data-cx-select-owner] .cx-custom-select-option[aria-selected="true"]:hover {
    background: #dfebf4 !important;
}

html body .cx-custom-select-option-check {
    width: 24px !important;
    height: 24px !important;
    display: inline-grid !important;
    place-items: center !important;
    color: #3e6a99 !important;
}

@media (max-width: 767.98px) {
    html body .cx-custom-select-trigger {
        min-height: 44px !important;
        height: 44px !important;
    }
}

html body.cx-design-system .cx-tooltip-surface {
    position: fixed !important;
    z-index: 2147483000 !important;
    width: max-content !important;
    max-width: min(360px, calc(100vw - 24px)) !important;
    padding: 8px 10px !important;
    border: 1px solid rgba(208, 224, 235, .20) !important;
    border-radius: 8px !important;
    background: #203f5a !important;
    color: #ffffff !important;
    box-shadow: 0 10px 28px rgba(15, 40, 62, .24) !important;
    font-family: "IBM Plex Sans", "Segoe UI", Arial, sans-serif !important;
    font-size: 12px !important;
    font-weight: 560 !important;
    line-height: 1.4 !important;
    letter-spacing: .002em !important;
    text-align: left !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
    pointer-events: none !important;
    opacity: 0 !important;
    visibility: hidden !important;
    transform: translateY(2px) scale(.985) !important;
    transform-origin: center bottom !important;
    transition:
        opacity .12s ease,
        transform .12s ease,
        visibility 0s linear .12s !important;
}

html body.cx-design-system .cx-tooltip-surface.is-visible {
    opacity: 1 !important;
    visibility: visible !important;
    transform: translateY(0) scale(1) !important;
    transition:
        opacity .12s ease,
        transform .12s ease,
        visibility 0s linear 0s !important;
}

@media (prefers-reduced-motion: reduce) {
    html body.cx-design-system .cx-tooltip-surface,
    html body.cx-design-system .cx-tooltip-surface.is-visible {
        transition: none !important;
        transform: none !important;
    }
}

html body.cx-design-system .cx-tooltip-surface {
    border-color: rgba(255,255,255,.16) !important;
    background: #2c5575 !important;
    color: #ffffff !important;
    box-shadow: 0 8px 22px rgba(31, 66, 94, .22) !important;
}

/* Shared Conexgo interface refinements. */
.cx-design-system {
    --cx-blue-900: #243f5c;
    --cx-blue-800: #2c4c6c;
    --cx-blue-700: #3e6a99;
    --cx-blue-100: #eaf2f8;
    --cx-surface: #ffffff;
    --cx-surface-soft: #f6f9fc;
    --cx-border: #d7e2ec;
    --cx-text: #2b4058;
    --cx-muted: #66798d;
    --cx-radius-lg: 16px;
    --cx-shadow: 0 14px 34px rgba(35, 65, 94, .10);
}

.cx-design-system #conexgo-page-content .custom-card,
.cx-design-system #conexgo-page-content .card.custom-card {
    border-color: var(--cx-border);
    border-radius: 14px;
    box-shadow: 0 10px 28px rgba(35, 65, 94, .07);
}

.cx-design-system .cx-r1-section,
.cx-design-system .conexgo-simple-modal,
.cx-design-system .cx-password-dialog,
.cx-design-system .cx-modal-group-v21 {
    border-color: var(--cx-border);
}

.cx-design-system .cx-r1-section-title,
.cx-design-system .conexgo-simple-title,
.cx-design-system .cx-modal-group-v21 legend {
    color: var(--cx-blue-800);
}

.cx-design-system .cx-recipient-add,
.cx-design-system .cx-icon-add-button {
    width: 40px !important;
    height: 40px !important;
    min-width: 40px !important;
    min-height: 40px !important;
    padding: 0 !important;
    border-radius: 50% !important;
    display: inline-grid !important;
    place-items: center !important;
}

.cx-design-system .cx-dialog-textarea,
.cx-design-system textarea.cx-direct-large-textarea {
    width: 100%;
    max-width: 100%;
    min-height: 130px;
    max-height: none;
    resize: both !important;
    overflow: auto !important;
}

.cx-design-system .cx-rich-popover-surface,
.cx-design-system .cx-data-log-popover-surface {
    max-width: min(680px, calc(100vw - 24px));
    max-height: min(72vh, 720px);
    overflow: auto;
    overscroll-behavior: contain;
    border: 1px solid #cbd9e6;
    border-radius: 14px;
    background: #fff;
    box-shadow: 0 18px 48px rgba(28, 55, 82, .20);
}

.cx-design-system .conexgo-not-found {
    width: min(820px, calc(100% - 32px));
    min-height: 0;
    margin: clamp(24px, 7vh, 64px) auto;
    padding: clamp(28px, 4vw, 44px);
    display: grid;
    grid-template-columns: minmax(0, 1fr) 190px;
    align-items: center;
    gap: clamp(24px, 5vw, 52px);
    text-align: left;
    border: 1px solid var(--cx-border);
    border-radius: 22px;
    background:
        radial-gradient(circle at 84% 18%, rgba(62, 106, 153, .11), transparent 34%),
        #ffffff;
    box-shadow: 0 16px 38px rgba(35, 65, 94, .10);
}

.cx-design-system .conexgo-not-found__copy {
    min-width: 0;
}

.cx-design-system .conexgo-not-found__visual {
    position: relative;
    width: 190px;
    min-height: 170px;
    display: grid;
    place-items: center;
    color: var(--cx-blue-800);
}

.cx-design-system .conexgo-not-found__visual span {
    font-size: clamp(5.4rem, 12vw, 8rem);
    font-weight: 850;
    line-height: .8;
    letter-spacing: -.08em;
    opacity: .10;
}

.cx-design-system .conexgo-not-found__visual i {
    position: absolute;
    width: 62px;
    height: 62px;
    display: grid;
    place-items: center;
    border: 1px solid #ccdae6;
    border-radius: 17px;
    background: #ffffff;
    box-shadow: 0 12px 28px rgba(44, 76, 108, .15);
    font-size: 1.4rem;
}

.cx-design-system .conexgo-not-found__eyebrow {
    margin: 0 0 9px;
    color: var(--cx-blue-700);
    font-size: .75rem;
    font-weight: 820;
    letter-spacing: .13em;
    text-transform: uppercase;
}

.cx-design-system .conexgo-not-found h1 {
    margin: 0 0 12px;
    color: var(--cx-blue-900);
    font-size: clamp(2rem, 5vw, 3.15rem);
    line-height: 1.05;
}

.cx-design-system .conexgo-not-found p {
    max-width: 540px;
    margin: 0;
    color: var(--cx-muted);
    line-height: 1.58;
}

.cx-design-system .conexgo-not-found__lead {
    font-size: 1rem;
}

.cx-design-system .conexgo-not-found__secondary {
    margin-top: 5px !important;
    font-size: .88rem;
}

.cx-design-system .conexgo-not-found__actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 24px;
}

.cx-design-system .conexgo-not-found__actions .btn {
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    padding: 9px 17px;
    border-radius: 11px;
    font-weight: 750;
}

.cx-design-system .conexgo-not-found__primary {
    border-color: var(--cx-blue-700);
    background: var(--cx-blue-700);
    color: #ffffff;
}

.cx-design-system .conexgo-not-found__primary:hover,
.cx-design-system .conexgo-not-found__primary:focus-visible {
    border-color: var(--cx-blue-800);
    background: var(--cx-blue-800);
    color: #ffffff;
}

.cx-design-system .conexgo-not-found__secondary-action {
    border: 1px solid #cbd8e4;
    background: #ffffff;
    color: var(--cx-blue-800);
}

.cx-design-system .conexgo-not-found__secondary-action:hover,
.cx-design-system .conexgo-not-found__secondary-action:focus-visible {
    border-color: #aebfd0;
    background: #f6f9fc;
    color: var(--cx-blue-900);
}

@media (max-width: 767.98px) {
    .cx-design-system .conexgo-not-found {
        width: calc(100% - 20px);
        margin: 14px auto;
        padding: 28px 20px;
        grid-template-columns: minmax(0, 1fr);
        gap: 18px;
        text-align: center;
        border-radius: 18px;
    }

    .cx-design-system .conexgo-not-found__visual {
        width: 100%;
        min-height: 110px;
        grid-row: 1;
    }

    .cx-design-system .conexgo-not-found__copy {
        grid-row: 2;
    }

    .cx-design-system .conexgo-not-found p {
        margin-inline: auto;
    }

    .cx-design-system .conexgo-not-found__actions {
        justify-content: center;
    }
}

@media (max-width: 479.98px) {
    .cx-design-system .conexgo-not-found__actions,
    .cx-design-system .conexgo-not-found__actions .btn {
        width: 100%;
    }
}

.cx-design-system .conexgo-enterprise-footer {
    background:
        linear-gradient(180deg, rgba(255,255,255,.62), rgba(241,246,250,.92)),
        #f4f8fb !important;
}

.cx-design-system .conexgo-enterprise-footer__inner {
    max-width: 1680px;
    margin-inline: auto;
}

.cx-design-system .conexgo-enterprise-footer__brand-text {
    display: grid;
    gap: 1px;
}

.cx-design-system .conexgo-enterprise-footer__brand-subtitle {
    color: #7a8b9d;
    font-size: 10px;
    font-weight: 600;
    letter-spacing: .04em;
}

@media (prefers-reduced-motion: reduce) {
    .cx-design-system *,
    .cx-design-system *::before,
    .cx-design-system *::after {
        scroll-behavior: auto !important;
    }
}

.cx-design-system .cx-safe-editform-loading {
    width: 100%;
    min-height: 150px;
    display: grid;
    place-items: center;
    padding: 28px;
    border: 1px solid var(--cx-border);
    border-radius: 14px;
    background:
        linear-gradient(135deg, rgba(234, 242, 248, .72), rgba(255, 255, 255, .96)),
        #ffffff;
}

.cx-design-system .cx-safe-editform-loading__spinner {
    width: 34px;
    height: 34px;
    border: 3px solid #d9e5ef;
    border-top-color: var(--cx-blue-700);
    border-radius: 50%;
    animation: cxSafeEditFormSpin .72s linear infinite;
}

@keyframes cxSafeEditFormSpin {
    to { transform: rotate(360deg); }
}

.cx-design-system .cx-status-page {
    width: min(820px, calc(100% - 32px));
    min-height: 300px;
    margin: clamp(24px, 7vh, 70px) auto;
    padding: clamp(28px, 4vw, 44px);
    display: grid;
    grid-template-columns: 84px minmax(0, 1fr);
    align-items: start;
    gap: clamp(20px, 4vw, 34px);
    border: 1px solid var(--cx-border);
    border-radius: 20px;
    background:
        radial-gradient(circle at 86% 14%, rgba(62, 106, 153, .10), transparent 34%),
        #ffffff;
    box-shadow: var(--cx-shadow);
}

.cx-design-system .cx-status-page__visual {
    width: 84px;
    min-height: 84px;
    display: grid;
    place-items: start center;
}

.cx-design-system .cx-status-page__icon {
    width: 68px;
    height: 68px;
    display: grid;
    place-items: center;
    border: 1px solid #cad9e6;
    border-radius: 18px;
    background: var(--cx-blue-100);
    color: var(--cx-blue-800);
    box-shadow: 0 10px 24px rgba(44, 76, 108, .10);
    font-size: 1.45rem;
}

.cx-design-system .cx-status-page--error .cx-status-page__icon {
    border-color: #e7c8c4;
    background: #fff4f2;
    color: #a34840;
}

.cx-design-system .cx-status-page__icon--loading i {
    animation: cxStatusPulse 1.2s ease-in-out infinite;
}

@keyframes cxStatusPulse {
    0%, 100% { opacity: .45; transform: scale(.96); }
    50% { opacity: 1; transform: scale(1.05); }
}

.cx-design-system .cx-status-page__content {
    min-width: 0;
}

.cx-design-system .cx-status-page__eyebrow {
    margin: 2px 0 8px;
    color: var(--cx-blue-700);
    font-size: .75rem;
    font-weight: 800;
    letter-spacing: .13em;
    text-transform: uppercase;
}

.cx-design-system .cx-status-page h1 {
    margin: 0 0 12px;
    color: var(--cx-blue-900);
    font-size: clamp(1.75rem, 1.3rem + 1.6vw, 2.5rem);
    line-height: 1.08;
}

.cx-design-system .cx-status-page__lead {
    max-width: 62ch;
    margin: 0;
    color: var(--cx-muted);
    font-size: .96rem;
    line-height: 1.62;
}

.cx-design-system .cx-status-page__context {
    max-width: 100%;
    margin: 18px 0 0;
    padding: 11px 13px;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 7px;
    border: 1px solid #dce6ee;
    border-radius: 10px;
    background: #f7fafc;
    color: #61778b;
    font-size: .82rem;
}

.cx-design-system .cx-status-page__context code {
    max-width: 100%;
    overflow-wrap: anywhere;
    color: var(--cx-blue-800);
}

.cx-design-system .cx-status-page__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 24px;
}

.cx-design-system .cx-status-page__actions .btn {
    min-height: 44px;
    padding: 9px 17px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    border-radius: 10px;
    font-weight: 750;
}

.cx-design-system .cx-status-page__primary {
    border: 1px solid var(--cx-blue-700);
    background: var(--cx-blue-700);
    color: #ffffff;
}

.cx-design-system .cx-status-page__primary:hover,
.cx-design-system .cx-status-page__primary:focus-visible {
    border-color: var(--cx-blue-800);
    background: var(--cx-blue-800);
    color: #ffffff;
}

.cx-design-system .cx-status-page__secondary {
    border: 1px solid #c8d6e2;
    background: #ffffff;
    color: var(--cx-blue-800);
}

.cx-design-system .cx-status-page__secondary:hover,
.cx-design-system .cx-status-page__secondary:focus-visible {
    border-color: #aebfd0;
    background: #f5f8fb;
    color: var(--cx-blue-900);
}

/* Header panels must remain above page content and only one is kept open by
   conexgo-private-scripts.js. These constraints protect very narrow layouts. */
.cx-design-system .app-header-modern .conexgo-header-dropdown-menu.show {
    z-index: 1095 !important;
}

@media (max-width: 767.98px) {
    .cx-design-system .cx-status-page {
        width: calc(100% - 20px);
        min-height: 0;
        margin: 14px auto;
        padding: 26px 20px;
        grid-template-columns: minmax(0, 1fr);
        gap: 16px;
        text-align: center;
        border-radius: 17px;
    }

    .cx-design-system .cx-status-page__visual {
        width: 100%;
        min-height: 64px;
        place-items: center;
    }

    .cx-design-system .cx-status-page__icon {
        width: 58px;
        height: 58px;
        border-radius: 16px;
        font-size: 1.25rem;
    }

    .cx-design-system .cx-status-page__lead {
        margin-inline: auto;
    }

    .cx-design-system .cx-status-page__context {
        justify-content: center;
        text-align: left;
    }

    .cx-design-system .cx-status-page__actions {
        justify-content: center;
    }
}

@media (max-width: 479.98px) {
    .cx-design-system .cx-status-page__actions,
    .cx-design-system .cx-status-page__actions .btn {
        width: 100%;
    }

    .cx-design-system .cx-safe-editform-loading {
        min-height: 120px;
        padding: 20px;
        border-radius: 12px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .cx-design-system .cx-safe-editform-loading__spinner,
    .cx-design-system .cx-status-page__icon--loading i {
        animation: none !important;
    }
}

/*
 * CONEXGO R16.1 — custom Conexgo calendar.
 * The date control uses MudBlazor's inline popover calendar, never the browser's
 * native date picker. The visible value remains the real MudBlazor input value.
 */

.cx-design-system .cx-control-field.cx-date-picker-v16-1,
.cx-design-system .cx-control-field.cx-time-picker-v16,
.cx-design-system .cx-control-field.cx-datetime-picker-v16 {
    width: 100%;
    min-width: 0;
    display: grid;
    gap: 6px;
}

.cx-design-system .cx-control-label {
    margin: 0;
    color: #52677a;
    font-size: .78rem;
    font-weight: 750;
    line-height: 1.25;
}

/* ------------------------------------------------------------------
   Conexgo date field
   ------------------------------------------------------------------ */

.cx-design-system .cx-date-picker-v16-1,
.cx-design-system .cx-date-picker-v16-1 .cx-date-picker-shell,
.cx-design-system .cx-date-picker-v16-1 .mud-picker,
.cx-design-system .cx-date-picker-v16-1 .mud-input-control,
.cx-design-system .cx-date-picker-v16-1 .mud-input-control-input-container {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
}

.cx-design-system .cx-date-picker-v16-1 .cx-date-picker-shell {
    position: relative;
}

.cx-design-system .cx-date-picker-v16-1 .mud-input {
    width: 100% !important;
    min-width: 0 !important;
    min-height: 44px !important;
    display: flex !important;
    align-items: center !important;
    overflow: hidden !important;
    border-radius: 10px !important;
    background: #ffffff !important;
    color: #223b56 !important;
    box-sizing: border-box !important;
}

.cx-design-system .cx-date-picker-v16-1 .mud-input-outlined-border {
    border-color: #cbd8e4 !important;
    border-radius: 10px !important;
    background: transparent !important;
    box-shadow: 0 1px 2px rgba(44, 76, 108, .035) !important;
    transition:
        border-color .16s ease,
        box-shadow .16s ease,
        background-color .16s ease !important;
}

.cx-design-system .cx-date-picker-v16-1 .mud-input:hover:not(.mud-disabled) {
    background: #fbfdff !important;
    color: #223b56 !important;
}

.cx-design-system .cx-date-picker-v16-1 .mud-input:hover:not(.mud-disabled) .mud-input-outlined-border {
    border-color: #9fb6ca !important;
    background: transparent !important;
}

.cx-design-system .cx-date-picker-v16-1 .mud-input:focus-within,
.cx-design-system .cx-date-picker-v16-1 .mud-input.mud-input-focused {
    background: #ffffff !important;
    color: #223b56 !important;
}

.cx-design-system .cx-date-picker-v16-1 .mud-input:focus-within .mud-input-outlined-border,
.cx-design-system .cx-date-picker-v16-1 .mud-input.mud-input-focused .mud-input-outlined-border {
    border-color: #3e6a99 !important;
    box-shadow: 0 0 0 3px rgba(62, 106, 153, .12) !important;
}

/* Keep the real date visible in every interactive state. */
.cx-design-system .cx-date-picker-v16-1 input.mud-input-root,
.cx-design-system .cx-date-picker-v16-1 input.mud-input-slot,
.cx-design-system .cx-date-picker-v16-1 input.mud-input-root:hover,
.cx-design-system .cx-date-picker-v16-1 input.mud-input-slot:hover,
.cx-design-system .cx-date-picker-v16-1 input.mud-input-root:focus,
.cx-design-system .cx-date-picker-v16-1 input.mud-input-slot:focus,
.cx-design-system .cx-date-picker-v16-1 input.mud-input-root:active,
.cx-design-system .cx-date-picker-v16-1 input.mud-input-slot:active,
.cx-design-system .cx-date-picker-v16-1 .mud-input:hover input,
.cx-design-system .cx-date-picker-v16-1 .mud-input:focus-within input,
.cx-design-system .cx-date-picker-v16-1 .mud-input.mud-input-focused input {
    flex: 1 1 auto !important;
    width: 1% !important;
    min-width: 0 !important;
    max-width: none !important;
    height: 42px !important;
    min-height: 42px !important;
    margin: 0 !important;
    padding: 0 12px 0 16px !important;
    overflow: hidden !important;
    text-overflow: clip !important;
    white-space: nowrap !important;
    color: #223b56 !important;
    -webkit-text-fill-color: #223b56 !important;
    caret-color: #223b56 !important;
    background: transparent !important;
    opacity: 1 !important;
    visibility: visible !important;
    direction: ltr !important;
    text-align: left !important;
    font-family: inherit !important;
    font-size: .92rem !important;
    font-weight: 700 !important;
    font-variant-numeric: tabular-nums !important;
    letter-spacing: 0 !important;
    line-height: 42px !important;
    box-sizing: border-box !important;
}

.cx-design-system .cx-date-picker-v16-1 input::placeholder {
    color: #8a99a8 !important;
    -webkit-text-fill-color: #8a99a8 !important;
    opacity: 1 !important;
    font-weight: 500 !important;
}

.cx-design-system .cx-date-picker-v16-1 .mud-input.mud-disabled input,
.cx-design-system .cx-date-picker-v16-1 .mud-input.mud-readonly input {
    color: #66788a !important;
    -webkit-text-fill-color: #66788a !important;
    opacity: 1 !important;
}

.cx-design-system .cx-date-picker-v16-1 .mud-input-adornment-end {
    position: static !important;
    inset: auto !important;
    flex: 0 0 44px !important;
    width: 44px !important;
    min-width: 44px !important;
    max-width: 44px !important;
    height: 38px !important;
    min-height: 38px !important;
    margin: 0 3px 0 0 !important;
    padding: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    transform: none !important;
    border: 0 !important;
    border-left: 1px solid #e2eaf1 !important;
    border-radius: 8px !important;
    background: #edf4f8 !important;
    color: #315f88 !important;
    box-sizing: border-box !important;
}

.cx-design-system .cx-date-picker-v16-1 .mud-input-adornment-end .mud-icon-button,
.cx-design-system .cx-date-picker-v16-1 .mud-input-adornment-end .mud-button-root {
    width: 38px !important;
    min-width: 38px !important;
    height: 36px !important;
    min-height: 36px !important;
    margin: 0 !important;
    padding: 0 !important;
    display: inline-grid !important;
    place-items: center !important;
    border-radius: 7px !important;
    background: transparent !important;
    color: #315f88 !important;
}

.cx-design-system .cx-date-picker-v16-1 .mud-input-adornment-end:hover,
.cx-design-system .cx-date-picker-v16-1 .mud-input-adornment-end:focus-within {
    background: #e2edf5 !important;
    color: #24435f !important;
}

.cx-design-system .cx-date-picker-v16-1 .mud-input-underline::before,
.cx-design-system .cx-date-picker-v16-1 .mud-input-underline::after {
    display: none !important;
}

/* ------------------------------------------------------------------
   Conexgo custom calendar popover
   ------------------------------------------------------------------ */

.mud-popover.mud-picker-popover {
    width: auto !important;
    min-width: 310px !important;
    max-width: calc(100vw - 20px) !important;
    max-height: calc(100dvh - 20px) !important;
    overflow: hidden !important;
    overscroll-behavior: contain;
    border: 1px solid #d5e1eb !important;
    border-radius: 14px !important;
    background: #ffffff !important;
    box-shadow: 0 18px 42px rgba(36, 66, 95, .20) !important;
    box-sizing: border-box !important;
    z-index: 1900 !important;
}

.mud-picker-popover .mud-picker {
    width: 310px !important;
    min-width: 310px !important;
    max-width: calc(100vw - 20px) !important;
    color: #243f5a !important;
    background: #ffffff !important;
    box-sizing: border-box !important;
}

.mud-picker-popover .mud-picker-calendar-container {
    max-width: 100% !important;
    padding: 10px 12px 13px !important;
    background: #ffffff !important;
    box-sizing: border-box !important;
}

.mud-picker-popover .mud-picker-calendar-header {
    min-height: 44px !important;
    padding: 4px 2px 8px !important;
    color: #223b55 !important;
    font-weight: 800 !important;
}

.mud-picker-popover .mud-picker-calendar-header-transition {
    overflow: visible !important;
    color: #223b55 !important;
    font-size: 15px !important;
    font-weight: 800 !important;
    text-align: center !important;
    white-space: nowrap !important;
}

.mud-picker-popover .mud-picker-calendar-header .mud-icon-button {
    color: #315f88 !important;
    border-radius: 8px !important;
}

.mud-picker-popover .mud-picker-calendar-header .mud-icon-button:hover {
    background: #edf4f8 !important;
    color: #24435f !important;
}

.mud-picker-popover .mud-picker-calendar-weekday {
    color: #718296 !important;
    font-size: .76rem !important;
    font-weight: 750 !important;
}

.mud-picker-popover .mud-day {
    border-radius: 9px !important;
    color: #315879 !important;
    font-size: 14px !important;
    font-weight: 600 !important;
}

.mud-picker-popover .mud-day:hover:not(.mud-disabled):not(.mud-selected):not(.mud-button-filled-primary) {
    background: #edf4f8 !important;
    color: #24435f !important;
}

.mud-picker-popover .mud-day.mud-selected,
.mud-picker-popover .mud-day.mud-button-filled-primary,
.mud-picker-popover .mud-day:is(.mud-selected, .mud-button-filled-primary):is(:hover, :focus, :focus-visible, :active) {
    background: #3e6a99 !important;
    background-color: #3e6a99 !important;
    color: #ffffff !important;
    box-shadow: 0 5px 13px rgba(62, 106, 153, .22) !important;
    transform: none !important;
}

.mud-picker-popover .mud-day.mud-current {
    border-color: #6f94b5 !important;
}

/* ------------------------------------------------------------------
   Existing Conexgo time control
   ------------------------------------------------------------------ */

.cx-design-system .cx-time-picker-v16 .cx-native-picker-shell {
    position: relative;
    width: 100%;
    min-width: 0;
    height: 44px;
    display: flex;
    align-items: center;
    isolation: isolate;
    overflow: hidden;
    border: 1px solid #cbd8e4;
    border-radius: 10px;
    background: #ffffff;
    color: #223b56;
    box-shadow: 0 1px 2px rgba(44, 76, 108, .035);
    transition:
        border-color .16s ease,
        box-shadow .16s ease,
        background-color .16s ease;
}

.cx-design-system .cx-time-picker-v16 .cx-native-picker-shell:hover {
    border-color: #aebfd0;
    background: #ffffff;
    color: #223b56;
}

.cx-design-system .cx-time-picker-v16 .cx-native-picker-shell:focus-within {
    border-color: #3e6a99;
    background: #ffffff;
    color: #223b56;
    box-shadow: 0 0 0 3px rgba(62, 106, 153, .12);
}

.cx-design-system .cx-time-picker-v16 .cx-native-picker-shell.is-disabled,
.cx-design-system .cx-time-picker-v16 .cx-native-picker-shell.is-readonly {
    border-color: #dce4eb;
    background: #f4f7fa;
    color: #7b8b9b;
    box-shadow: none;
}

.cx-design-system .cx-time-picker-v16 .cx-native-picker-display {
    position: relative;
    z-index: 1;
    width: 100%;
    min-width: 0;
    height: 42px;
    margin: 0;
    padding: 0 48px;
    display: flex;
    align-items: center;
    border: 0;
    outline: 0;
    overflow: hidden;
    background: transparent !important;
    color: #223b56 !important;
    -webkit-text-fill-color: #223b56 !important;
    opacity: 1 !important;
    font: inherit;
    font-size: .92rem;
    font-weight: 650;
    line-height: 1.2;
    text-overflow: ellipsis;
    white-space: nowrap;
    pointer-events: none;
}

.cx-design-system .cx-time-picker-v16 .cx-native-picker-display.is-placeholder {
    color: #8a99a8 !important;
    -webkit-text-fill-color: #8a99a8 !important;
    font-weight: 500;
}

.cx-design-system .cx-time-picker-v16 .cx-native-picker-shell:hover .cx-native-picker-display,
.cx-design-system .cx-time-picker-v16 .cx-native-picker-shell:focus-within .cx-native-picker-display,
.cx-design-system .cx-time-picker-v16 .cx-native-picker-shell:active .cx-native-picker-display {
    color: #223b56 !important;
    -webkit-text-fill-color: #223b56 !important;
    opacity: 1 !important;
}

.cx-design-system .cx-time-picker-v16 .cx-native-picker-input {
    position: absolute;
    inset: 0;
    z-index: 3;
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    border: 0;
    opacity: 0;
    color: transparent;
    -webkit-text-fill-color: transparent;
    cursor: pointer;
    appearance: auto;
    -webkit-appearance: auto;
}

.cx-design-system .cx-time-picker-v16 .cx-native-picker-input:disabled {
    cursor: not-allowed;
}

.cx-design-system .cx-time-picker-v16 .cx-native-picker-chevron,
.cx-design-system .cx-time-picker-v16 .cx-native-picker-leading-icon {
    position: absolute;
    z-index: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #315f88;
    pointer-events: none;
}

.cx-design-system .cx-time-picker-v16 .cx-native-picker-leading-icon {
    left: 7px;
    width: 32px;
    height: 32px;
    border-radius: 8px;
    background: #edf4f8;
    font-size: .95rem;
}

.cx-design-system .cx-time-picker-v16 .cx-native-picker-chevron {
    right: 7px;
    width: 30px;
    height: 30px;
    font-size: .78rem;
}

.cx-design-system .cx-time-picker-v16 .cx-native-picker-clear {
    position: absolute;
    top: 7px;
    right: 42px;
    z-index: 4;
    width: 30px;
    height: 30px;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 0;
    border-radius: 7px;
    background: transparent;
    color: #718296;
    cursor: pointer;
}

.cx-design-system .cx-time-picker-v16 .cx-native-picker-clear:hover,
.cx-design-system .cx-time-picker-v16 .cx-native-picker-clear:focus-visible {
    background: #e8eef4;
    color: #2c4c6c;
    outline: 0;
}

.cx-design-system .cx-time-picker-v16 .cx-native-picker-shell.is-clearable .cx-native-picker-display {
    padding-right: 82px;
}

.cx-design-system .cx-control-help {
    color: #718092;
    font-size: .76rem;
    line-height: 1.35;
}

/* ------------------------------------------------------------------
   DateTime and shared custom ranges
   ------------------------------------------------------------------ */

.cx-design-system .cx-control-datetime-grid {
    width: 100%;
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(160px, 1.2fr) minmax(130px, .8fr);
    gap: 10px;
}

.cx-design-system .cx-control-datetime-grid > * {
    min-width: 0;
}

.cx-design-system .cx-paged-list .cx-pagedlist-date-range-v16 {
    width: 100%;
    min-width: 0;
    margin: 0 0 14px;
    padding: 12px;
    overflow: visible;
    border: 1px solid #d7e2eb;
    border-radius: 12px;
    background: #f8fbfd;
    box-shadow: 0 4px 14px rgba(44, 76, 108, .045);
}

.cx-design-system .cx-paged-list .cx-pagedlist-date-range-v16 .conexgo-pagedlist-custom-fields {
    width: 100%;
    min-width: 0;
    display: grid;
    grid-template-columns:
        minmax(170px, 1fr)
        minmax(128px, .66fr)
        34px
        minmax(170px, 1fr)
        minmax(128px, .66fr)
        minmax(118px, auto);
    align-items: end;
    gap: 10px;
}

.cx-design-system .cx-paged-list .cx-pagedlist-date-range-v16 .conexgo-pagedlist-custom-group {
    display: contents;
}

.cx-design-system .cx-paged-list .cx-pagedlist-date-range-v16 .conexgo-pagedlist-custom-separator {
    width: 34px;
    height: 44px;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    align-self: end;
    border: 1px solid #d5e0e9;
    border-radius: 50%;
    background: #ffffff;
    color: #55718b;
}

.cx-design-system .cx-paged-list .cx-pagedlist-date-range-v16 .conexgo-pagedlist-apply {
    min-width: 118px;
    height: 44px;
    padding: 0 16px;
    border: 1px solid #2c4c6c;
    border-radius: 10px;
    background: #2c4c6c;
    color: #ffffff;
    font-size: .9rem;
    font-weight: 700;
    white-space: nowrap;
}

.cx-design-system .cx-paged-list .cx-pagedlist-date-range-v16 .conexgo-pagedlist-apply:hover,
.cx-design-system .cx-paged-list .cx-pagedlist-date-range-v16 .conexgo-pagedlist-apply:focus-visible {
    border-color: #243f5a;
    background: #243f5a;
    color: #ffffff;
    box-shadow: 0 4px 12px rgba(44, 76, 108, .14);
}

.cx-design-system .conexgo-history-custom-range-v16 {
    width: 100%;
    min-width: 0;
    display: grid;
    grid-template-columns:
        minmax(170px, 1fr)
        minmax(128px, .7fr)
        minmax(170px, 1fr)
        minmax(128px, .7fr)
        minmax(110px, auto);
    align-items: end;
    gap: 10px;
}

@media (max-width: 1100px) {
    .cx-design-system .cx-paged-list .cx-pagedlist-date-range-v16 .conexgo-pagedlist-custom-fields,
    .cx-design-system .conexgo-history-custom-range-v16 {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .cx-design-system .cx-paged-list .cx-pagedlist-date-range-v16 .conexgo-pagedlist-custom-separator {
        display: none;
    }

    .cx-design-system .cx-paged-list .cx-pagedlist-date-range-v16 .conexgo-pagedlist-apply,
    .cx-design-system .conexgo-history-custom-range-v16 .conexgo-history-apply {
        width: 100%;
        grid-column: 1 / -1;
    }
}

@media (max-width: 575.98px) {
    .cx-design-system .cx-control-datetime-grid,
    .cx-design-system .cx-paged-list .cx-pagedlist-date-range-v16 .conexgo-pagedlist-custom-fields,
    .cx-design-system .conexgo-history-custom-range-v16 {
        grid-template-columns: minmax(0, 1fr);
    }

    .cx-design-system .cx-paged-list .cx-pagedlist-date-range-v16 {
        padding: 10px;
    }

    .cx-design-system .cx-date-picker-v16-1 input.mud-input-root,
    .cx-design-system .cx-date-picker-v16-1 input.mud-input-slot {
        height: 40px !important;
        min-height: 40px !important;
        padding-left: 12px !important;
        padding-right: 7px !important;
        font-size: 13.5px !important;
        line-height: 40px !important;
    }

    .cx-design-system .cx-date-picker-v16-1 .mud-input-adornment-end {
        flex-basis: 40px !important;
        width: 40px !important;
        min-width: 40px !important;
        max-width: 40px !important;
    }

    .mud-popover.mud-picker-popover,
    .mud-picker-popover .mud-picker {
        width: min(310px, calc(100vw - 14px)) !important;
        min-width: min(310px, calc(100vw - 14px)) !important;
        max-width: calc(100vw - 14px) !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    .cx-design-system .cx-date-picker-v16-1 *,
    .cx-design-system .cx-time-picker-v16 *,
    .mud-picker-popover * {
        transition: none !important;
        animation: none !important;
    }
}

.cx-design-system .cx-control-field.cx-time-picker-v17-9,
.cx-design-system .cx-time-picker-v17-9,
.cx-design-system .cx-time-picker-v17-9 .cx-time-select-shell {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
}

.cx-design-system .cx-control-field.cx-time-picker-v17-9 {
    display: grid !important;
    gap: 6px !important;
}

.cx-design-system .cx-time-picker-v17-9 .cx-time-select-shell {
    position: relative !important;
    min-height: 44px !important;
    display: grid !important;
    grid-template-columns: 42px minmax(0, 1fr) 38px !important;
    align-items: center !important;
    overflow: hidden !important;
    border: 1px solid #cbd8e4 !important;
    border-radius: 10px !important;
    background: #ffffff !important;
    color: #223b56 !important;
    box-shadow: 0 1px 2px rgba(44, 76, 108, .035) !important;
    transition: border-color .16s ease, box-shadow .16s ease, background-color .16s ease !important;
}

.cx-design-system .cx-time-picker-v17-9 .cx-time-select-shell:hover:not(.is-disabled) {
    border-color: #9fb6ca !important;
    background: #fbfdff !important;
}

.cx-design-system .cx-time-picker-v17-9 .cx-time-select-shell:focus-within {
    border-color: #3e6a99 !important;
    background: #ffffff !important;
    box-shadow: 0 0 0 3px rgba(62, 106, 153, .12) !important;
}

.cx-design-system .cx-time-picker-v17-9 .cx-time-select-leading,
.cx-design-system .cx-time-picker-v17-9 .cx-time-select-chevron {
    height: 100% !important;
    min-height: 42px !important;
    display: inline-grid !important;
    place-items: center !important;
    color: #315f88 !important;
    pointer-events: none !important;
}

.cx-design-system .cx-time-picker-v17-9 .cx-time-select-leading {
    border-right: 1px solid #e2eaf1 !important;
    background: #f5f9fc !important;
}

.cx-design-system .cx-time-picker-v17-9 .cx-time-select-chevron {
    border-left: 1px solid #e2eaf1 !important;
    background: #edf4f8 !important;
    font-size: .75rem !important;
}

.cx-design-system .cx-time-picker-v17-9 select.cx-conexgo-time-select {
    grid-column: 2 / 4 !important;
    grid-row: 1 !important;
    z-index: 1 !important;
    width: 100% !important;
    min-width: 0 !important;
    height: 42px !important;
    min-height: 42px !important;
    margin: 0 !important;
    padding: 0 46px 0 14px !important;
    border: 0 !important;
    border-radius: 0 !important;
    outline: 0 !important;
    appearance: none !important;
    -webkit-appearance: none !important;
    background: transparent !important;
    color: #223b56 !important;
    font-family: inherit !important;
    font-size: .92rem !important;
    font-weight: 700 !important;
    font-variant-numeric: tabular-nums !important;
    line-height: 1.25 !important;
    cursor: pointer !important;
    box-shadow: none !important;
}

.cx-design-system .cx-time-picker-v17-9 .cx-time-select-chevron {
    grid-column: 3 !important;
    grid-row: 1 !important;
    z-index: 2 !important;
}

.cx-design-system .cx-time-picker-v17-9 .cx-time-select-leading {
    grid-column: 1 !important;
    grid-row: 1 !important;
}

.cx-design-system .cx-time-picker-v17-9 select.cx-conexgo-time-select:disabled {
    cursor: not-allowed !important;
    color: #687b8d !important;
    opacity: 1 !important;
}

.cx-design-system .cx-time-picker-v17-9 .cx-time-select-shell.is-disabled,
.cx-design-system .cx-time-picker-v17-9 .cx-time-select-shell.is-readonly {
    border-color: #dbe3ea !important;
    background: #f4f7f9 !important;
    color: #687b8d !important;
    box-shadow: none !important;
}

.cx-design-system .cx-time-picker-v17-9 .cx-time-select-shell.is-disabled .cx-time-select-leading,
.cx-design-system .cx-time-picker-v17-9 .cx-time-select-shell.is-disabled .cx-time-select-chevron,
.cx-design-system .cx-time-picker-v17-9 .cx-time-select-shell.is-readonly .cx-time-select-leading,
.cx-design-system .cx-time-picker-v17-9 .cx-time-select-shell.is-readonly .cx-time-select-chevron {
    background: #eef2f5 !important;
    color: #8190a0 !important;
}

.cx-design-system .cx-time-picker-v17-9 select.cx-conexgo-time-select option {
    color: #223b56 !important;
    background: #ffffff !important;
    font-weight: 600 !important;
}

@media (max-width: 575.98px) {
    .cx-design-system .cx-time-picker-v17-9 .cx-time-select-shell {
        grid-template-columns: 40px minmax(0, 1fr) 36px !important;
    }

    .cx-design-system .cx-time-picker-v17-9 select.cx-conexgo-time-select {
        padding-right: 42px !important;
        font-size: .9rem !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    .cx-design-system .cx-time-picker-v17-9 *,
    .cx-design-system .cx-time-picker-v17-9 .cx-time-select-shell {
        transition: none !important;
        animation: none !important;
    }
}

/* #region PublicMainLayout.razor */
/**************************************** PublicMainLayout.razor ************************************************************************/
/* CONEXGO BACK-TO-TOP HARMONIZED START */
a#back-to-top.conexgo-back-to-top {
    position: fixed !important;
    right: 20px !important;
    bottom: 20px !important;
    z-index: 1200 !important;
    display: none;
    align-items: center !important;
    justify-content: center !important;
    width: 44px !important;
    height: 44px !important;
    min-width: 44px !important;
    min-height: 44px !important;
    padding: 0 !important;
    margin: 0 !important;
    color: #ffffff !important;
    background: #2c4c6c !important;
    border: 1px solid rgba(255, 255, 255, 0.18) !important;
    border-radius: 8px !important;
    box-sizing: border-box !important;
    text-align: center !important;
    text-decoration: none !important;
    box-shadow: 0 2px 7px rgba(44, 76, 108, 0.22) !important;
    transition: background-color 0.15s ease, border-color 0.15s ease, transform 0.15s ease, box-shadow 0.15s ease !important;
}

a#back-to-top.conexgo-back-to-top[style*="display: inline"],
a#back-to-top.conexgo-back-to-top[style*="display: block"],
a#back-to-top.conexgo-back-to-top[style*="display: inline-block"] {
    display: inline-flex !important;
}

a#back-to-top.conexgo-back-to-top i {
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
    color: #ffffff !important;
    font-size: 16px !important;
    line-height: 1 !important;
}

a#back-to-top.conexgo-back-to-top:hover {
    color: #ffffff !important;
    background: #3d6287 !important;
    border-color: #3d6287 !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 3px 9px rgba(44, 76, 108, 0.26) !important;
}

a#back-to-top.conexgo-back-to-top:focus-visible {
    outline: 3px solid rgba(61, 98, 135, 0.25) !important;
    outline-offset: 3px !important;
}

a#back-to-top.conexgo-back-to-top:active {
    transform: translateY(0) !important;
}

@media (max-width: 576px) {
    a#back-to-top.conexgo-back-to-top {
        right: 14px !important;
        bottom: 14px !important;
        width: 42px !important;
        height: 42px !important;
        min-width: 42px !important;
        min-height: 42px !important;
    }

        a#back-to-top.conexgo-back-to-top i {
            font-size: 15px !important;
        }
}
/* CONEXGO BACK-TO-TOP HARMONIZED END */
/* #endregion PublicMainLayout.razor */

/* #region PrivateMainLayout.razor */
/**************************************** PrivateMainLayout.razor ************************************************************************/
.conexgo-enterprise-footer {
    margin-top: 24px;
    padding: 0 !important;
    border-top: 1px solid #dfe6ed;
    background: #f7f9fb;
    color: #536477;
}

.conexgo-enterprise-footer__inner {
    min-height: 72px;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 18px;
    padding: 14px clamp(16px, 3vw, 38px);
}

.conexgo-enterprise-footer__brand {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    color: #2c4c6c;
    font-weight: 800;
}

.conexgo-enterprise-footer__mark,
.conexgo-enterprise-footer__top {
    width: 36px;
    height: 36px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #d6e0e9;
    border-radius: 10px;
    background: #ffffff;
    color: #315879;
}

.conexgo-enterprise-footer__copy {
    min-width: 0;
    text-align: center;
    font-size: 9pt;
}

.conexgo-enterprise-footer__top {
    text-decoration: none;
    transition: background-color .18s ease, border-color .18s ease, transform .18s ease;
}

    .conexgo-enterprise-footer__top:hover,
    .conexgo-enterprise-footer__top:focus-visible {
        border-color: #b9cada;
        background: #edf4f9;
        transform: translateY(-1px);
    }

@media (max-width: 575.98px) {
    .conexgo-enterprise-footer__inner {
        grid-template-columns: 1fr auto;
        gap: 8px 12px;
        padding-bottom: calc(88px + env(safe-area-inset-bottom, 0px));
    }

    .conexgo-enterprise-footer__copy {
        grid-column: 1 / -1;
        grid-row: 2;
        text-align: left;
    }
}

a#back-to-top.conexgo-back-to-top {
    position: fixed !important;
    right: 20px !important;
    bottom: 20px !important;
    z-index: 1200 !important;
    display: none;
    align-items: center !important;
    justify-content: center !important;
    width: 44px !important;
    height: 44px !important;
    min-width: 44px !important;
    min-height: 44px !important;
    padding: 0 !important;
    margin: 0 !important;
    color: #ffffff !important;
    background: #2c4c6c !important;
    border: 1px solid rgba(255, 255, 255, 0.18) !important;
    border-radius: 8px !important;
    box-sizing: border-box !important;
    text-align: center !important;
    text-decoration: none !important;
    box-shadow: 0 2px 7px rgba(44, 76, 108, 0.22) !important;
    transition: background-color 0.15s ease, border-color 0.15s ease, transform 0.15s ease, box-shadow 0.15s ease !important;
}

    a#back-to-top.conexgo-back-to-top[style*="display: inline"],
    a#back-to-top.conexgo-back-to-top[style*="display: block"],
    a#back-to-top.conexgo-back-to-top[style*="display: inline-block"] {
        display: inline-flex !important;
    }

    a#back-to-top.conexgo-back-to-top i {
        display: block !important;
        margin: 0 !important;
        padding: 0 !important;
        color: #ffffff !important;
        font-size: 16px !important;
        line-height: 1 !important;
    }

    a#back-to-top.conexgo-back-to-top:hover {
        color: #ffffff !important;
        background: #3d6287 !important;
        border-color: #3d6287 !important;
        transform: translateY(-1px) !important;
        box-shadow: 0 3px 9px rgba(44, 76, 108, 0.26) !important;
    }

    a#back-to-top.conexgo-back-to-top:focus-visible {
        outline: 3px solid rgba(61, 98, 135, 0.25) !important;
        outline-offset: 3px !important;
    }

    a#back-to-top.conexgo-back-to-top:active {
        transform: translateY(0) !important;
    }

@media (max-width: 576px) {
    a#back-to-top.conexgo-back-to-top {
        right: 14px !important;
        bottom: 14px !important;
        width: 42px !important;
        height: 42px !important;
        min-width: 42px !important;
        min-height: 42px !important;
    }

        a#back-to-top.conexgo-back-to-top i {
            font-size: 15px !important;
        }
}

.conexgo-mobile-quick-nav {
    display: none;
}

@media (max-width: 767.98px) {
    .main-content.app-content {
        padding-bottom: calc(78px + env(safe-area-inset-bottom, 0px)) !important;
    }

        .main-content.app-content .side-app,
        .main-content.app-content .main-container.container-fluid {
            width: 100% !important;
            max-width: none !important;
            margin-inline: 0 !important;
            padding-inline: 8px !important;
        }

    .footer {
        padding-bottom: calc(76px + env(safe-area-inset-bottom, 0px)) !important;
    }

    .conexgo-mobile-quick-nav {
        position: fixed;
        left: 8px;
        right: 8px;
        bottom: calc(8px + env(safe-area-inset-bottom, 0px));
        z-index: 1190;
        min-height: 60px;
        display: grid;
        grid-template-columns: repeat(4, minmax(0, 1fr));
        gap: 4px;
        padding: 6px;
        border: 1px solid rgba(44, 76, 108, .16);
        border-radius: 14px;
        background: rgba(255, 255, 255, .96);
        box-shadow: 0 14px 34px rgba(35, 60, 85, .18);
        backdrop-filter: blur(14px);
    }

    .conexgo-mobile-quick-nav__item {
        min-width: 0;
        min-height: 48px;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 4px;
        padding: 5px 3px;
        border-radius: 10px;
        color: #3d5873;
        text-decoration: none;
        font-size: 8px;
        font-weight: 800;
        line-height: 1.1;
        transition: background-color .16s ease, color .16s ease, transform .16s ease;
    }

        .conexgo-mobile-quick-nav__item i {
            font-size: 16px;
        }

        .conexgo-mobile-quick-nav__item:hover,
        .conexgo-mobile-quick-nav__item:focus-visible {
            background: #eaf2f8;
            color: #24435f;
            transform: translateY(-1px);
        }

    a#back-to-top.conexgo-back-to-top {
        bottom: calc(82px + env(safe-area-inset-bottom, 0px)) !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    .conexgo-mobile-quick-nav__item {
        transition: none !important;
    }
}

#conexgo-page-content {
    min-width: 0;
}

    #conexgo-page-content .page-header {
        width: 100%;
        min-width: 0;
        display: flex;
        align-items: flex-start;
        justify-content: space-between;
        gap: 12px 18px;
        margin-bottom: 14px;
    }

        #conexgo-page-content .page-header > :first-child {
            min-width: 0;
            flex: 1 1 auto;
        }

        #conexgo-page-content .page-header > :last-child:not(:first-child) {
            min-width: 0;
            flex: 0 1 auto;
        }

    #conexgo-page-content .page-title {
        max-width: 100%;
        margin: 0 0 4px;
        font-size: clamp(1.25rem, 1.08rem + .48vw, 1.65rem);
        line-height: 1.18;
        overflow-wrap: anywhere;
    }

    #conexgo-page-content .breadcrumb {
        max-width: 100%;
        margin-bottom: 0;
        display: flex;
        flex-wrap: wrap;
        gap: 3px 0;
        line-height: 1.35;
    }

@media (max-width: 767.98px) {
    #conexgo-page-content .page-header {
        flex-wrap: wrap;
        gap: 9px;
        margin-bottom: 11px;
    }

        #conexgo-page-content .page-header > :last-child:not(:first-child) {
            width: 100%;
            display: flex;
            justify-content: flex-end;
        }

    #conexgo-page-content .page-title {
        font-size: 1.28rem;
    }
}

#blazor-error-ui {
    inset: auto 14px 14px 14px !important;
    width: auto !important;
    min-height: 58px;
    padding: 11px 14px !important;
    display: none;
    align-items: center;
    gap: 10px;
    border: 1px solid #dca3a3;
    border-left: 5px solid #b94f4f;
    border-radius: 12px;
    background: #fff7f7 !important;
    color: #723d3d !important;
    box-shadow: 0 16px 36px rgba(65, 32, 32, .18);
    font-size: .9rem;
    line-height: 1.35;
    z-index: 5000;
}

    #blazor-error-ui .cx-blazor-error-icon {
        width: 36px;
        height: 36px;
        flex: 0 0 36px;
        display: grid;
        place-items: center;
        border-radius: 10px;
        background: #fbe3e3;
        color: #a53f3f;
    }

    #blazor-error-ui .cx-blazor-error-message {
        flex: 1 1 auto;
    }

    #blazor-error-ui .reload {
        min-height: 36px;
        display: inline-flex;
        align-items: center;
        padding: 0 13px;
        border-radius: 8px;
        background: #a74343;
        color: #fff !important;
        font-weight: 800;
        text-decoration: none !important;
    }

    #blazor-error-ui .dismiss {
        width: 36px;
        height: 36px;
        display: grid;
        place-items: center;
        border: 1px solid #e1bcbc;
        border-radius: 8px;
        background: #fff;
        color: #874747;
    }

html[lang^="fr"] #blazor-error-ui .cx-blazor-error-message--en,
html[lang^="fr"] #blazor-error-ui .cx-blazor-error-reload--en {
    display: none;
}

html:not([lang^="fr"]) #blazor-error-ui .cx-blazor-error-message--fr,
html:not([lang^="fr"]) #blazor-error-ui .cx-blazor-error-reload--fr {
    display: none;
}

@media (max-width: 767.98px) {
    .conexgo-mobile-quick-nav.cx-mobile-links-3 {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .conexgo-mobile-quick-nav.cx-mobile-links-4 {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }

    .conexgo-enterprise-footer {
        margin-top: 12px;
    }

    .conexgo-enterprise-footer__inner {
        min-height: 58px;
        grid-template-columns: minmax(0, 1fr);
        gap: 5px;
        padding: 10px 14px calc(76px + env(safe-area-inset-bottom, 0px));
    }

    .conexgo-enterprise-footer__brand {
        gap: 7px;
    }

    .conexgo-enterprise-footer__mark {
        width: 30px;
        height: 30px;
        border-radius: 8px;
    }

    .conexgo-enterprise-footer__brand-subtitle {
        display: none;
    }

    .conexgo-enterprise-footer__copy {
        grid-column: auto;
        grid-row: auto;
        text-align: left;
        font-size: .72rem;
    }

    #blazor-error-ui {
        left: 8px !important;
        right: 8px !important;
        bottom: calc(78px + env(safe-area-inset-bottom, 0px)) !important;
        padding: 10px !important;
        gap: 8px;
        font-size: .78rem;
    }

        #blazor-error-ui .reload {
            min-height: 34px;
            padding-inline: 10px;
        }

        #blazor-error-ui .cx-blazor-error-icon {
            width: 32px;
            height: 32px;
            flex-basis: 32px;
        }

        #blazor-error-ui .dismiss {
            width: 32px;
            height: 32px;
        }
}
/* #endregion PrivateMainLayout.razor */

/*********** NAVIGATION *******************/
/* #region NavMenu.razor */
/**************************************** NavMenu.razor ************************************************************************/
.app-sidebar-shell {
    z-index: 10;
}

.app-sidebar-modern {
    background: #ffffff;
    border-right: 1px solid #e3e8ef;
    box-shadow: 2px 0 12px rgba(44, 76, 108, 0.05);
    transition: width .55s cubic-bezier(.4, 0, .2, 1), min-width .55s cubic-bezier(.4, 0, .2, 1), max-width .55s cubic-bezier(.4, 0, .2, 1), box-shadow .4s ease;
}

    .app-sidebar-modern .side-header {
        min-height: 76px;
        padding: 12px 16px;
        display: flex;
        align-items: center;
        justify-content: center;
        background: #ffffff;
        border-bottom: 1px solid #edf1f5;
        transition: padding .44s cubic-bezier(.4, 0, .2, 1), min-height .44s cubic-bezier(.4, 0, .2, 1);
    }

    .app-sidebar-modern .header-brand1 {
        width: 100%;
        min-height: 46px;
        display: flex;
        align-items: center;
        justify-content: center;
        text-decoration: none;
        overflow: hidden;
    }

    .app-sidebar-modern .header-brand-img {
        width: auto !important;
        height: auto !important;
        max-height: 44px;
        max-width: 165px;
        object-fit: contain !important;
        flex-shrink: 0;
        transition: max-width .44s cubic-bezier(.4, 0, .2, 1), max-height .44s cubic-bezier(.4, 0, .2, 1), transform .44s cubic-bezier(.4, 0, .2, 1), opacity .32s ease;
    }

    .app-sidebar-modern .main-sidemenu {
        padding: 10px 8px 18px 8px;
        transition: padding .44s cubic-bezier(.4, 0, .2, 1);
    }

    .app-sidebar-modern .side-menu {
        margin: 0;
        padding: 0;
    }

    .app-sidebar-modern .sub-category {
        margin: 14px 0 8px 0;
        padding: 0;
        background: #2c4c6c;
        border-left: 4px solid #89c540;
    }

        .app-sidebar-modern .sub-category:first-child {
            margin-top: 4px;
        }

        .app-sidebar-modern .sub-category h3 {
            margin: 0;
            padding: 10px 14px;
            color: #ffffff !important;
            font-size: 10.2pt;
            font-weight: 700;
            letter-spacing: .04em;
            text-transform: uppercase;
            line-height: 1.25;
            opacity: 1 !important;
        }

    .app-sidebar-modern .slide {
        margin: 4px 0;
    }

    .app-sidebar-modern .side-menu__item {
        min-height: 54px;
        padding: 9px 10px;
        display: flex;
        align-items: center;
        gap: 12px;
        color: #2f3d4f !important;
        border: 1px solid transparent;
        border-radius: 10px;
        background: transparent;
        text-decoration: none;
        font-size: 10.6pt;
        font-weight: 650;
        line-height: 1.25;
        transition: background-color .18s ease, border-color .18s ease, color .18s ease, padding .44s cubic-bezier(.4, 0, .2, 1), min-height .44s cubic-bezier(.4, 0, .2, 1), gap .44s cubic-bezier(.4, 0, .2, 1);
    }

        .app-sidebar-modern .side-menu__item:hover,
        .app-sidebar-modern .side-menu__item:focus {
            color: #2c4c6c !important;
            background: #f6f8fb;
            border-color: #e3e8ef;
            text-decoration: none;
        }

    .app-sidebar-modern .side-menu__icon {
        width: 44px;
        min-width: 44px;
        height: 44px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        border-radius: 11px;
        color: #2c4c6c !important;
        background: #eef3f7;
        font-size: 17pt !important;
        line-height: 1;
        transition: width .44s cubic-bezier(.4, 0, .2, 1), min-width .44s cubic-bezier(.4, 0, .2, 1), height .44s cubic-bezier(.4, 0, .2, 1), border-radius .44s cubic-bezier(.4, 0, .2, 1), font-size .44s cubic-bezier(.4, 0, .2, 1), background-color .18s ease, color .18s ease;
    }

    .app-sidebar-modern .side-menu__item:hover .side-menu__icon,
    .app-sidebar-modern .side-menu__item:focus .side-menu__icon {
        background: #e7eff6;
        color: #2c4c6c !important;
    }

    .app-sidebar-modern .side-menu__label {
        flex: 1;
        min-width: 0;
        color: inherit !important;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        transition: opacity .32s ease, transform .44s cubic-bezier(.4, 0, .2, 1), max-width .5s cubic-bezier(.4, 0, .2, 1), visibility .32s ease;
    }

    .app-sidebar-modern .angle {
        margin-left: auto;
        color: #6c757d !important;
        font-size: 12.5pt;
        transition: opacity .32s ease, visibility .32s ease, width .44s cubic-bezier(.4, 0, .2, 1), margin .44s cubic-bezier(.4, 0, .2, 1);
    }

    .app-sidebar-modern .slide-menu {
        margin: 5px 0 8px 20px;
        padding: 6px 0 6px 11px;
        background: #f8f9fa;
        border-left: 2px solid #e3e8ef;
        border-radius: 8px;
    }

    .app-sidebar-modern .side-menu-label1 {
        display: none;
    }

    .app-sidebar-modern .slide-item {
        display: block;
        padding: 8px 10px;
        color: #36485c !important;
        border-radius: 7px;
        font-size: 10pt;
        font-weight: 600;
        text-decoration: none;
        transition: background-color .18s ease, color .18s ease;
    }

        .app-sidebar-modern .slide-item:hover,
        .app-sidebar-modern .slide-item:focus {
            color: #2c4c6c !important;
            background: #ffffff;
            text-decoration: none;
        }

    .app-sidebar-modern .slide-left,
    .app-sidebar-modern .slide-right {
        width: 32px;
        height: 32px;
        margin: 4px auto;
        display: flex;
        align-items: center;
        justify-content: center;
        border: 1px solid #e3e8ef;
        border-radius: 8px;
        background: #ffffff;
    }

        .app-sidebar-modern .slide-left svg,
        .app-sidebar-modern .slide-right svg {
            width: 20px;
            height: 20px;
            fill: #2c4c6c;
        }

/* Collapsed sidebar */
.app.sidenav-toggled .app-sidebar-modern,
.sidenav-toggled .app-sidebar-modern {
    overflow: hidden !important;
    transition: width .55s cubic-bezier(.4, 0, .2, 1), min-width .55s cubic-bezier(.4, 0, .2, 1), max-width .55s cubic-bezier(.4, 0, .2, 1), box-shadow .4s ease !important;
}

    .app.sidenav-toggled .app-sidebar-modern .side-header,
    .sidenav-toggled .app-sidebar-modern .side-header {
        min-height: 72px !important;
        padding: 12px 6px !important;
        transition: padding .44s cubic-bezier(.4, 0, .2, 1), min-height .44s cubic-bezier(.4, 0, .2, 1) !important;
    }

    .app.sidenav-toggled .app-sidebar-modern .header-brand1,
    .sidenav-toggled .app-sidebar-modern .header-brand1 {
        min-height: 46px !important;
        justify-content: center !important;
    }

    .app.sidenav-toggled .app-sidebar-modern:not(:hover) .header-brand-img,
    .sidenav-toggled .app-sidebar-modern:not(:hover) .header-brand-img {
        width: auto !important;
        height: auto !important;
        max-width: 48px !important;
        max-height: 42px !important;
        object-fit: contain !important;
        transform: scale(.98) !important;
        opacity: .96 !important;
    }

    .app.sidenav-toggled .app-sidebar-modern .main-sidemenu,
    .sidenav-toggled .app-sidebar-modern .main-sidemenu {
        padding: 10px 7px 18px 7px !important;
        transition: padding .44s cubic-bezier(.4, 0, .2, 1) !important;
    }

    .app.sidenav-toggled .app-sidebar-modern .side-menu__item,
    .sidenav-toggled .app-sidebar-modern .side-menu__item {
        min-height: 60px !important;
        padding: 8px 0 !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 0 !important;
        overflow: hidden !important;
        transition: min-height .44s cubic-bezier(.4, 0, .2, 1), padding .44s cubic-bezier(.4, 0, .2, 1), gap .44s cubic-bezier(.4, 0, .2, 1), background-color .18s ease, border-color .18s ease !important;
    }

    .app.sidenav-toggled .app-sidebar-modern .side-menu__icon,
    .sidenav-toggled .app-sidebar-modern .side-menu__icon {
        width: 50px !important;
        min-width: 50px !important;
        height: 50px !important;
        margin: 0 !important;
        padding: 0 !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        border-radius: 14px !important;
        background: #eef3f7 !important;
        color: #2c4c6c !important;
        font-size: 18pt !important;
        line-height: 1 !important;
        transition: width .44s cubic-bezier(.4, 0, .2, 1), min-width .44s cubic-bezier(.4, 0, .2, 1), height .44s cubic-bezier(.4, 0, .2, 1), border-radius .44s cubic-bezier(.4, 0, .2, 1), font-size .44s cubic-bezier(.4, 0, .2, 1), background-color .18s ease, color .18s ease !important;
    }

    .app.sidenav-toggled .app-sidebar-modern .side-menu__item:hover .side-menu__icon,
    .sidenav-toggled .app-sidebar-modern .side-menu__item:hover .side-menu__icon,
    .app.sidenav-toggled .app-sidebar-modern .side-menu__item:focus .side-menu__icon,
    .sidenav-toggled .app-sidebar-modern .side-menu__item:focus .side-menu__icon {
        background: #e3edf5 !important;
        color: #2c4c6c !important;
    }

    .app.sidenav-toggled .app-sidebar-modern:not(:hover) .side-menu__label,
    .sidenav-toggled .app-sidebar-modern:not(:hover) .side-menu__label {
        display: inline-block !important;
        max-width: 0 !important;
        opacity: 0 !important;
        visibility: hidden !important;
        transform: translateX(-2px) !important;
        white-space: nowrap !important;
        overflow: hidden !important;
        transition: opacity .40s ease, transform .52s cubic-bezier(.22, 1, .36, 1), max-width .56s cubic-bezier(.22, 1, .36, 1), visibility .40s ease !important;
    }

    .app.sidenav-toggled .app-sidebar-modern:not(:hover) .angle,
    .sidenav-toggled .app-sidebar-modern:not(:hover) .angle {
        opacity: 0 !important;
        visibility: hidden !important;
        width: 0 !important;
        margin: 0 !important;
        overflow: hidden !important;
        transition: opacity .32s ease, width .44s cubic-bezier(.4, 0, .2, 1), margin .44s cubic-bezier(.4, 0, .2, 1), visibility .32s ease !important;
    }

    .app.sidenav-toggled .app-sidebar-modern:not(:hover) .sub-category,
    .sidenav-toggled .app-sidebar-modern:not(:hover) .sub-category {
        max-height: 0 !important;
        margin-top: 0 !important;
        margin-bottom: 0 !important;
        opacity: 0 !important;
        overflow: hidden !important;
        border-left-width: 0 !important;
        transition: max-height .44s cubic-bezier(.4, 0, .2, 1), margin .44s cubic-bezier(.4, 0, .2, 1), opacity .32s ease !important;
    }

    /* Collapsed sidebar hover */
    .app.sidenav-toggled .app-sidebar-modern:hover,
    .sidenav-toggled .app-sidebar-modern:hover {
        width: 250px !important;
        min-width: 250px !important;
        max-width: 250px !important;
        overflow: hidden !important;
        box-shadow: 6px 0 18px rgba(44, 76, 108, 0.08) !important;
        transition: width .55s cubic-bezier(.4, 0, .2, 1), min-width .55s cubic-bezier(.4, 0, .2, 1), max-width .55s cubic-bezier(.4, 0, .2, 1), box-shadow .4s ease !important;
    }

        .app.sidenav-toggled .app-sidebar-modern:hover .side-header,
        .sidenav-toggled .app-sidebar-modern:hover .side-header {
            min-height: 76px !important;
            padding: 12px 16px !important;
            justify-content: center !important;
        }

        .app.sidenav-toggled .app-sidebar-modern:hover .header-brand-img,
        .sidenav-toggled .app-sidebar-modern:hover .header-brand-img {
            width: auto !important;
            height: auto !important;
            max-height: 44px !important;
            max-width: 165px !important;
            object-fit: contain !important;
            transform: scale(1) !important;
            opacity: 1 !important;
        }

        .app.sidenav-toggled .app-sidebar-modern:hover .main-sidemenu,
        .sidenav-toggled .app-sidebar-modern:hover .main-sidemenu {
            padding: 10px 8px 18px 8px !important;
        }

        .app.sidenav-toggled .app-sidebar-modern:hover .sub-category,
        .sidenav-toggled .app-sidebar-modern:hover .sub-category {
            max-height: 42px !important;
            margin: 14px 0 8px 0 !important;
            padding: 0 !important;
            display: block !important;
            opacity: 1 !important;
            overflow: hidden !important;
            background: #2c4c6c !important;
            border-left: 4px solid #89c540 !important;
            transition-delay: .04s !important;
        }

            .app.sidenav-toggled .app-sidebar-modern:hover .sub-category h3,
            .sidenav-toggled .app-sidebar-modern:hover .sub-category h3 {
                margin: 0 !important;
                padding: 10px 14px !important;
                color: #ffffff !important;
                font-size: 10.2pt !important;
                font-weight: 700 !important;
                letter-spacing: .04em !important;
                text-transform: uppercase !important;
                line-height: 1.25 !important;
                opacity: 1 !important;
            }

        .app.sidenav-toggled .app-sidebar-modern:hover .side-menu__item,
        .sidenav-toggled .app-sidebar-modern:hover .side-menu__item {
            min-height: 54px !important;
            padding: 9px 10px !important;
            justify-content: flex-start !important;
            gap: 12px !important;
            border-radius: 10px !important;
            overflow: hidden !important;
        }

        .app.sidenav-toggled .app-sidebar-modern:hover .side-menu__icon,
        .sidenav-toggled .app-sidebar-modern:hover .side-menu__icon {
            width: 44px !important;
            min-width: 44px !important;
            height: 44px !important;
            border-radius: 11px !important;
            font-size: 17pt !important;
        }

        .app.sidenav-toggled .app-sidebar-modern:hover .side-menu__label,
        .sidenav-toggled .app-sidebar-modern:hover .side-menu__label {
            display: inline-block !important;
            flex: 1 !important;
            min-width: 0 !important;
            max-width: 170px !important;
            opacity: 1 !important;
            visibility: visible !important;
            transform: translateX(0) !important;
            color: inherit !important;
            font-size: 10.6pt !important;
            font-weight: 650 !important;
            white-space: nowrap !important;
            overflow: hidden !important;
            text-overflow: ellipsis !important;
            transition-delay: .08s !important;
        }

        .app.sidenav-toggled .app-sidebar-modern:hover .angle,
        .sidenav-toggled .app-sidebar-modern:hover .angle {
            display: inline-flex !important;
            opacity: 1 !important;
            visibility: visible !important;
            width: auto !important;
            margin-left: auto !important;
            color: #6c757d !important;
            font-size: 12.5pt !important;
        }

        .app.sidenav-toggled .app-sidebar-modern:hover .slide-menu,
        .sidenav-toggled .app-sidebar-modern:hover .slide-menu {
            margin: 5px 0 8px 20px !important;
            padding: 6px 0 6px 11px !important;
            background: #f8f9fa !important;
            border-left: 2px solid #e3e8ef !important;
            border-radius: 8px !important;
        }

        .app.sidenav-toggled .app-sidebar-modern:hover .slide-item,
        .sidenav-toggled .app-sidebar-modern:hover .slide-item {
            display: block !important;
            padding: 8px 10px !important;
            color: #36485c !important;
            border-radius: 7px !important;
            font-size: 10pt !important;
            font-weight: 600 !important;
            text-decoration: none !important;
        }
/* Uniformisation visuelle des icônes du sidebar */
.app-sidebar-modern .side-menu__icon {
    width: 46px !important;
    min-width: 46px !important;
    height: 46px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 17pt !important;
    line-height: 1 !important;
}

    .app-sidebar-modern .side-menu__icon::before {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 22px !important;
        height: 22px !important;
        font-size: 17pt !important;
        line-height: 1 !important;
    }

    /* Les icônes téléphone paraissent toujours trop petites, donc on les agrandit légèrement */
    .app-sidebar-modern .side-menu__icon.fa-mobile::before,
    .app-sidebar-modern .side-menu__icon.fa-mobile-screen-button::before {
        font-size: 19pt !important;
    }

    /* Les triangles paraissent naturellement plus gros, donc on les réduit un peu */
    .app-sidebar-modern .side-menu__icon.fa-exclamation-triangle::before,
    .app-sidebar-modern .side-menu__icon.fa-triangle-exclamation::before {
        font-size: 16pt !important;
    }

    /* Les cloches paraissent aussi plus lourdes visuellement */
    .app-sidebar-modern .side-menu__icon.fa-bell::before {
        font-size: 16pt !important;
    }

/* Mode sidebar fermé */
.app.sidenav-toggled .app-sidebar-modern .side-menu__icon,
.sidenav-toggled .app-sidebar-modern .side-menu__icon {
    width: 50px !important;
    min-width: 50px !important;
    height: 50px !important;
    font-size: 18pt !important;
}

    .app.sidenav-toggled .app-sidebar-modern .side-menu__icon::before,
    .sidenav-toggled .app-sidebar-modern .side-menu__icon::before {
        width: 24px !important;
        height: 24px !important;
        font-size: 18pt !important;
    }

/* Lisibilité renforcée du menu sans modifier sa structure */
.app-sidebar-modern .side-menu__item,
.app-sidebar-modern .side-menu__label {
    font-size: 11.5pt !important;
    line-height: 1.3 !important;
}

.app-sidebar-modern .side-menu__item {
    min-height: 56px;
}

.app-sidebar-modern .sub-category h3 {
    font-size: 10.8pt !important;
    line-height: 1.3 !important;
}

.app-sidebar-modern .slide-item {
    font-size: 10.9pt !important;
    line-height: 1.35 !important;
}

.app.sidenav-toggled .app-sidebar-modern:hover .side-menu__label,
.sidenav-toggled .app-sidebar-modern:hover .side-menu__label {
    max-width: 178px !important;
    font-size: 11.5pt !important;
    line-height: 1.3 !important;
}

.app.sidenav-toggled .app-sidebar-modern:hover .sub-category h3,
.sidenav-toggled .app-sidebar-modern:hover .sub-category h3 {
    font-size: 10.8pt !important;
    line-height: 1.3 !important;
}

.app.sidenav-toggled .app-sidebar-modern:hover .slide-item,
.sidenav-toggled .app-sidebar-modern:hover .slide-item {
    font-size: 10.9pt !important;
    line-height: 1.35 !important;
}
/* =========================================================
   RESPONSIVE SIDEBAR — PANNEAU MOBILE FIABLE
   Le mode compact/hover reste strictement réservé au bureau.
   ========================================================= */

@media (min-width: 992px) and (max-width: 1280px) {
    .app-sidebar-modern .side-header {
        min-height: 70px;
        padding: 10px 12px;
    }

    .app-sidebar-modern .header-brand-img {
        max-width: 148px;
        max-height: 40px;
    }

    .app-sidebar-modern .main-sidemenu {
        padding: 9px 7px 16px;
    }

    .app-sidebar-modern .side-menu__item {
        min-height: 52px;
        padding: 8px 9px;
        gap: 10px;
    }

    .app-sidebar-modern .side-menu__icon {
        width: 43px !important;
        min-width: 43px !important;
        height: 43px !important;
        font-size: 16.5pt !important;
    }

    .app-sidebar-modern .side-menu__item,
    .app-sidebar-modern .side-menu__label {
        font-size: 10.8pt !important;
    }
}

.app-sidebar-mobile-close {
    display: none;
}

@media (max-width: 991.98px) {
    .app-sidebar-shell {
        position: static !important;
        width: 0 !important;
        height: 0 !important;
        z-index: auto !important;
    }

    .app .app-sidebar__overlay {
        position: fixed !important;
        inset: 0 !important;
        z-index: 1000000 !important;
        display: block !important;
        background: rgba(25, 42, 61, .34) !important;
        opacity: 0 !important;
        visibility: hidden !important;
        pointer-events: none !important;
        transition: opacity .2s ease, visibility .2s ease !important;
    }

    .app.sidenav-toggled .app-sidebar__overlay {
        opacity: 1 !important;
        visibility: visible !important;
        pointer-events: auto !important;
    }

    .app .app-sidebar-modern,
    .app.sidenav-toggled .app-sidebar-modern,
    .app.sidenav-toggled .app-sidebar-modern:hover {
        position: fixed !important;
        top: 0 !important;
        right: auto !important;
        bottom: 0 !important;
        left: 0 !important;
        z-index: 1000001 !important;
        width: min(300px, calc(100vw - 52px)) !important;
        min-width: min(300px, calc(100vw - 52px)) !important;
        max-width: min(300px, calc(100vw - 52px)) !important;
        height: 100vh !important;
        height: 100dvh !important;
        max-height: 100vh !important;
        max-height: 100dvh !important;
        display: flex !important;
        flex-direction: column !important;
        overflow: hidden !important;
        background: #ffffff !important;
        border-right: 1px solid #dce4ed !important;
        box-shadow: 10px 0 28px rgba(25, 42, 61, .18) !important;
        transform: translateX(-100%) !important;
        transition: transform .22s ease !important;
    }

        .app.sidenav-toggled .app-sidebar-modern,
        .app.sidenav-toggled .app-sidebar-modern:hover {
            transform: translateX(0) !important;
        }

    .app.sidenav-toggled {
        overflow: hidden !important;
    }

        .app .app-sidebar-modern .side-header,
        .app.sidenav-toggled .app-sidebar-modern .side-header,
        .app.sidenav-toggled .app-sidebar-modern:hover .side-header {
            position: relative !important;
            inset: auto !important;
            z-index: 1 !important;
            width: 100% !important;
            min-height: 66px !important;
            height: 66px !important;
            flex: 0 0 66px !important;
            padding: 9px 10px 9px 14px !important;
            display: flex !important;
            align-items: center !important;
            justify-content: space-between !important;
            background: #ffffff !important;
            border-bottom: 1px solid #e5eaf1 !important;
        }

        .app .app-sidebar-modern .header-brand1,
        .app.sidenav-toggled .app-sidebar-modern .header-brand1 {
            width: auto !important;
            min-width: 0 !important;
            min-height: 42px !important;
            height: 42px !important;
            flex: 1 1 auto !important;
            display: flex !important;
            align-items: center !important;
            justify-content: flex-start !important;
            overflow: hidden !important;
        }

        .app .app-sidebar-modern .header-brand-img,
        .app.sidenav-toggled .app-sidebar-modern .header-brand-img,
        .app.sidenav-toggled .app-sidebar-modern:hover .header-brand-img {
            width: auto !important;
            height: auto !important;
            max-width: 150px !important;
            max-height: 38px !important;
            margin: 0 !important;
            object-fit: contain !important;
            transform: none !important;
            opacity: 1 !important;
        }

    .app-sidebar-mobile-close {
        width: 38px;
        min-width: 38px;
        height: 38px;
        margin-left: 8px;
        padding: 0;
        display: inline-grid;
        place-items: center;
        line-height: 0;
        color: #2c4c6c;
        background: #f4f7fa;
        border: 1px solid #dce4ed;
        border-radius: 10px;
        box-shadow: none;
    }

        .app-sidebar-mobile-close > i {
            width: 100%;
            height: 100%;
            margin: 0;
            padding: 0;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            font-size: 15px;
            line-height: 1;
            transform: none;
        }

        .app-sidebar-mobile-close:hover,
        .app-sidebar-mobile-close:focus {
            color: #2c4c6c;
            background: #eaf0f5;
            border-color: #ccd8e3;
        }

    .app .app-sidebar-modern .main-sidemenu,
    .app.sidenav-toggled .app-sidebar-modern .main-sidemenu,
    .app.sidenav-toggled .app-sidebar-modern:hover .main-sidemenu {
        width: 100% !important;
        min-width: 0 !important;
        min-height: 0 !important;
        height: auto !important;
        max-height: none !important;
        flex: 1 1 auto !important;
        padding: 8px 8px calc(18px + env(safe-area-inset-bottom)) 8px !important;
        overflow-x: hidden !important;
        overflow-y: auto !important;
        overscroll-behavior: contain;
        -webkit-overflow-scrolling: touch;
    }

    .app .app-sidebar-modern .side-menu,
    .app.sidenav-toggled .app-sidebar-modern .side-menu {
        width: 100% !important;
        min-width: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    .app .app-sidebar-modern .sub-category,
    .app.sidenav-toggled .app-sidebar-modern .sub-category,
    .app.sidenav-toggled .app-sidebar-modern:not(:hover) .sub-category,
    .app.sidenav-toggled .app-sidebar-modern:hover .sub-category {
        width: 100% !important;
        max-height: none !important;
        margin: 12px 0 7px !important;
        padding: 0 !important;
        display: block !important;
        opacity: 1 !important;
        visibility: visible !important;
        overflow: hidden !important;
        background: #2c4c6c !important;
        border-left: 4px solid #89c540 !important;
    }

        .app .app-sidebar-modern .sub-category:first-child,
        .app.sidenav-toggled .app-sidebar-modern .sub-category:first-child {
            margin-top: 3px !important;
        }

        .app .app-sidebar-modern .sub-category h3,
        .app.sidenav-toggled .app-sidebar-modern .sub-category h3 {
            margin: 0 !important;
            padding: 9px 12px !important;
            color: #ffffff !important;
            font-size: 10pt !important;
            font-weight: 700 !important;
            line-height: 1.25 !important;
            letter-spacing: .04em !important;
            opacity: 1 !important;
        }

    .app .app-sidebar-modern .slide,
    .app.sidenav-toggled .app-sidebar-modern .slide {
        width: 100% !important;
        margin: 3px 0 !important;
    }

    .app .app-sidebar-modern .side-menu__item,
    .app.sidenav-toggled .app-sidebar-modern .side-menu__item,
    .app.sidenav-toggled .app-sidebar-modern:hover .side-menu__item {
        width: 100% !important;
        min-width: 0 !important;
        min-height: 52px !important;
        padding: 7px 9px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: flex-start !important;
        gap: 10px !important;
        border-radius: 10px !important;
        overflow: hidden !important;
    }

    .app .app-sidebar-modern .side-menu__icon,
    .app.sidenav-toggled .app-sidebar-modern .side-menu__icon,
    .app.sidenav-toggled .app-sidebar-modern:hover .side-menu__icon {
        width: 42px !important;
        min-width: 42px !important;
        height: 42px !important;
        margin: 0 !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        border-radius: 10px !important;
        font-size: 16.5pt !important;
        flex: 0 0 42px !important;
    }

        .app .app-sidebar-modern .side-menu__icon::before,
        .app.sidenav-toggled .app-sidebar-modern .side-menu__icon::before {
            width: 21px !important;
            height: 21px !important;
            font-size: 16.5pt !important;
        }

    .app .app-sidebar-modern .side-menu__label,
    .app.sidenav-toggled .app-sidebar-modern .side-menu__label,
    .app.sidenav-toggled .app-sidebar-modern:not(:hover) .side-menu__label,
    .app.sidenav-toggled .app-sidebar-modern:hover .side-menu__label {
        display: block !important;
        flex: 1 1 auto !important;
        min-width: 0 !important;
        max-width: none !important;
        color: inherit !important;
        font-size: 10.8pt !important;
        font-weight: 650 !important;
        line-height: 1.3 !important;
        opacity: 1 !important;
        visibility: visible !important;
        transform: none !important;
        white-space: normal !important;
        overflow: visible !important;
        text-overflow: initial !important;
        overflow-wrap: anywhere;
    }

    .app .app-sidebar-modern .angle,
    .app.sidenav-toggled .app-sidebar-modern .angle,
    .app.sidenav-toggled .app-sidebar-modern:not(:hover) .angle,
    .app.sidenav-toggled .app-sidebar-modern:hover .angle {
        width: auto !important;
        min-width: 16px !important;
        margin: 0 0 0 auto !important;
        display: inline-flex !important;
        opacity: 1 !important;
        visibility: visible !important;
        overflow: visible !important;
        flex: 0 0 auto !important;
    }

    .app .app-sidebar-modern .slide-menu,
    .app.sidenav-toggled .app-sidebar-modern .slide-menu {
        width: auto !important;
        margin: 5px 0 8px 14px !important;
        padding: 5px 0 5px 10px !important;
        overflow: hidden !important;
    }

    .app .app-sidebar-modern .slide-item,
    .app.sidenav-toggled .app-sidebar-modern .slide-item {
        min-height: 40px !important;
        padding: 8px 9px !important;
        display: flex !important;
        align-items: center !important;
        font-size: 10.4pt !important;
        line-height: 1.3 !important;
        white-space: normal !important;
        overflow-wrap: anywhere;
    }

    .app .app-sidebar-modern .slide-left,
    .app .app-sidebar-modern .slide-right {
        display: none !important;
    }
}

@media (max-width: 420px) {
    .app .app-sidebar-modern,
    .app.sidenav-toggled .app-sidebar-modern,
    .app.sidenav-toggled .app-sidebar-modern:hover {
        width: min(300px, calc(100vw - 44px)) !important;
        min-width: min(300px, calc(100vw - 44px)) !important;
        max-width: min(300px, calc(100vw - 44px)) !important;
    }

        .app .app-sidebar-modern .side-header,
        .app.sidenav-toggled .app-sidebar-modern .side-header {
            min-height: 62px !important;
            height: 62px !important;
            flex-basis: 62px !important;
            padding: 8px 8px 8px 12px !important;
        }

        .app .app-sidebar-modern .header-brand-img,
        .app.sidenav-toggled .app-sidebar-modern .header-brand-img {
            max-width: 138px !important;
            max-height: 35px !important;
        }

        .app .app-sidebar-modern .side-menu__item,
        .app.sidenav-toggled .app-sidebar-modern .side-menu__item {
            min-height: 50px !important;
            padding: 6px 8px !important;
        }

        .app .app-sidebar-modern .side-menu__icon,
        .app.sidenav-toggled .app-sidebar-modern .side-menu__icon {
            width: 40px !important;
            min-width: 40px !important;
            height: 40px !important;
            flex-basis: 40px !important;
            font-size: 16pt !important;
        }

        .app .app-sidebar-modern .side-menu__label,
        .app.sidenav-toggled .app-sidebar-modern .side-menu__label {
            font-size: 10.5pt !important;
        }
}

.app-sidebar-modern .conexgo-sidebar-section-toggle {
    width: 100%;
    min-height: 42px;
    margin: 0;
    padding: 9px 12px 9px 14px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    border: 0;
    background: transparent;
    color: #ffffff;
    font: inherit;
    cursor: pointer;
    text-align: left;
}

.app-sidebar-modern .conexgo-sidebar-section-title {
    min-width: 0;
    color: #ffffff;
    font-size: 10.2pt;
    font-weight: 700;
    letter-spacing: .04em;
    line-height: 1.25;
    text-transform: uppercase;
}

.app-sidebar-modern .conexgo-sidebar-section-chevron {
    width: 22px;
    height: 22px;
    min-width: 22px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: rgba(255, 255, 255, .92);
    font-size: 10pt;
    transform: rotate(0deg);
    transition: transform .34s cubic-bezier(.22, 1, .36, 1);
}

    .app-sidebar-modern .conexgo-sidebar-section-chevron.is-open {
        transform: rotate(180deg);
    }

.app-sidebar-modern .conexgo-sidebar-section-item {
    max-height: 78px;
    opacity: 1;
    overflow: visible;
    transform: translateY(0);
    clip-path: inset(0 0 0 0);
    visibility: visible;
    transition:
        max-height .36s cubic-bezier(.22, 1, .36, 1),
        margin .36s cubic-bezier(.22, 1, .36, 1),
        opacity .28s ease .09s,
        transform .36s cubic-bezier(.22, 1, .36, 1),
        clip-path .34s cubic-bezier(.22, 1, .36, 1),
        visibility 0s linear 0s;
}

.app-sidebar-modern .conexgo-sidebar-section-item:has(.slide-menu, .sub-slide-menu, .sub-slide-menu2) {
    max-height: 520px;
}

    .app-sidebar-modern .conexgo-sidebar-section-item.is-closed {
        min-height: 0 !important;
        max-height: 0 !important;
        margin-top: 0 !important;
        margin-bottom: 0 !important;
        opacity: 0;
        overflow: hidden !important;
        pointer-events: none;
        transform: translateY(-2px);
        clip-path: inset(0 0 100% 0);
        visibility: hidden;
        transition:
            max-height .36s cubic-bezier(.22, 1, .36, 1),
            margin .36s cubic-bezier(.22, 1, .36, 1),
            opacity .24s ease,
            transform .36s cubic-bezier(.22, 1, .36, 1),
            clip-path .34s cubic-bezier(.22, 1, .36, 1),
            visibility 0s linear .36s;
    }

.app-sidebar-modern .conexgo-sidebar-section-toggle:hover,
.app-sidebar-modern .conexgo-sidebar-section-toggle:focus-visible {
    background: transparent;
    outline: none;
    box-shadow: none;
}

.app.sidenav-toggled .app-sidebar-modern:not(:hover) .conexgo-sidebar-section-toggle,
.sidenav-toggled .app-sidebar-modern:not(:hover) .conexgo-sidebar-section-toggle {
    opacity: 0;
    pointer-events: none;
}

@media (max-width: 991.98px) {
    .app-sidebar-modern .conexgo-sidebar-section-toggle {
        min-height: 44px;
        padding: 9px 12px;
    }

    .app-sidebar-modern .conexgo-sidebar-section-title {
        font-size: 10pt;
    }
}

@media (prefers-reduced-motion: reduce) {
    .app .app-sidebar__overlay,
    .app .app-sidebar-modern,
    .app-sidebar-modern .conexgo-sidebar-section-chevron,
    .app-sidebar-modern .conexgo-sidebar-section-item {
        transition: none !important;
    }
}
/* Persistent navigation state and reliable sidebar scrolling. */
.app-sidebar-modern {
    height: 100dvh;
    max-height: 100dvh;
}

    .app-sidebar-modern .main-sidemenu {
        height: calc(100dvh - 76px);
        max-height: calc(100dvh - 76px);
        overflow-x: hidden !important;
        overflow-y: auto !important;
        overscroll-behavior: contain;
        scrollbar-gutter: stable;
        -webkit-overflow-scrolling: touch;
    }

    .app-sidebar-modern .side-menu__item.is-active,
    .app-sidebar-modern .side-menu__item.is-active-parent,
    .app-sidebar-modern .slide-item.is-active {
        color: #244f77 !important;
        background: #e7f0f8 !important;
        border-color: #b6cadb !important;
        box-shadow: inset 4px 0 0 #3e6a99;
    }

        .app-sidebar-modern .side-menu__item.is-active .side-menu__icon,
        .app-sidebar-modern .side-menu__item.is-active-parent .side-menu__icon {
            color: #ffffff !important;
            background: #3e6a99 !important;
        }

    .app-sidebar-modern .slide-item.is-active {
        font-weight: 800;
    }

    .app-sidebar-modern .side-menu__item.is-active .angle,
    .app-sidebar-modern .side-menu__item.is-active-parent .angle {
        color: #315879 !important;
    }

@media (max-width: 991.98px) {
    .app-sidebar-modern {
        height: 100dvh;
        max-height: 100dvh;
    }

        .app-sidebar-modern .main-sidemenu {
            height: calc(100dvh - 76px) !important;
            max-height: calc(100dvh - 76px) !important;
        }
}

/* Active navigation feedback. */
.app-sidebar-modern .side-menu__item.is-active,
.app-sidebar-modern .side-menu__item.is-active-parent,
.app-sidebar-modern .slide-item.is-active {
    color: #315b7e !important;
    background: #f1f6fa !important;
    border-color: #d5e1eb !important;
    box-shadow: inset 3px 0 0 #6d91b0 !important;
}

    .app-sidebar-modern .side-menu__item.is-active .side-menu__icon,
    .app-sidebar-modern .side-menu__item.is-active-parent .side-menu__icon {
        color: #315f86 !important;
        background: #dfeaf3 !important;
    }

.app-sidebar-modern .slide-item.is-active {
    font-weight: 700 !important;
}

@media (prefers-reduced-motion: no-preference) {
    .app-sidebar-modern .side-menu__item:hover .side-menu__icon,
    .app-sidebar-modern .side-menu__item:focus-visible .side-menu__icon {
        animation: conexgoSidebarIconSoftBounce .38s cubic-bezier(.22, 1, .36, 1) both;
    }
}

@keyframes conexgoSidebarIconSoftBounce {
    0% {
        transform: translateY(0) scale(1);
    }

    45% {
        transform: translateY(-2px) scale(1.025);
    }

    72% {
        transform: translateY(1px) scale(.995);
    }

    100% {
        transform: translateY(0) scale(1);
    }
}

/* Keep active navigation clear without a left accent line. */
.app-sidebar-modern .side-menu__item.is-active,
.app-sidebar-modern .side-menu__item.is-active-parent,
.app-sidebar-modern .slide-item.is-active {
    box-shadow: none !important;
}

@media (max-width: 767.98px) {
    .cx-app-sidebar .conexgo-sidebar-section-toggle {
        min-height: 52px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        gap: 10px !important;
        padding: 0 16px !important;
        background: #2c4c6c !important;
        color: #fff !important;
        border-left: 4px solid #89c540 !important;
    }

    .cx-app-sidebar .conexgo-sidebar-section-title {
        display: block !important;
        min-width: 0;
        color: #fff !important;
        opacity: 1 !important;
        font-size: .78rem !important;
        font-weight: 850 !important;
        letter-spacing: .08em !important;
        text-transform: uppercase;
    }

    .cx-app-sidebar .conexgo-sidebar-section-chevron {
        width: 24px !important;
        min-width: 24px !important;
        display: inline-grid !important;
        place-items: center !important;
        color: #fff !important;
        opacity: 1 !important;
        visibility: visible !important;
        font-size: .86rem !important;
    }

    .cx-app-sidebar.cx-sidebar-mobile-limited .side-menu > .sub-category:not(:first-child),
    .cx-app-sidebar.cx-sidebar-mobile-limited .side-menu > .conexgo-sidebar-section-item:not(.cx-mobile-allowed-limited),
    .cx-app-sidebar.cx-sidebar-mobile-limited .cx-mobile-hide-limited {
        display: none !important;
    }

    .cx-app-sidebar.cx-sidebar-mobile-limited .side-menu > .sub-category:first-child {
        display: none !important;
    }

    .cx-app-sidebar.cx-sidebar-mobile-limited .main-sidemenu {
        padding-top: 10px;
    }
}

/* CONEXGO R6: no responsive sidebar for restricted roles */
@media (max-width: 1199.98px) {
    .app-sidebar-shell.cx-sidebar-mobile-limited {
        display: none !important;
        visibility: hidden !important;
        pointer-events: none !important;
    }

        .app-sidebar-shell.cx-sidebar-mobile-limited + .main-content {
            width: 100% !important;
            margin-inline-start: 0 !important;
            margin-left: 0 !important;
        }
}

.app-sidebar-modern #slide-left,
.app-sidebar-modern #slide-right,
.app-sidebar-modern .slide-left,
.app-sidebar-modern .slide-right {
    display: none !important;
}

@media (max-width: 991.98px) {
    .app.sidenav-toggled #back-to-top {
        opacity: 0 !important;
        visibility: hidden !important;
        pointer-events: none !important;
    }

    .app .app-sidebar-modern .main-sidemenu,
    .app.sidenav-toggled .app-sidebar-modern .main-sidemenu {
        scrollbar-width: thin;
        scrollbar-color: #b8c4cf transparent;
    }

    .app .app-sidebar-modern .main-sidemenu::-webkit-scrollbar,
    .app.sidenav-toggled .app-sidebar-modern .main-sidemenu::-webkit-scrollbar {
        width: 6px;
    }

    .app .app-sidebar-modern .main-sidemenu::-webkit-scrollbar-thumb,
    .app.sidenav-toggled .app-sidebar-modern .main-sidemenu::-webkit-scrollbar-thumb {
        background: #b8c4cf;
        border-radius: 999px;
    }
}

/* #endregion NavMenu.razor */

/*********** HEADER *******************/
/* #region NavHeader.razor */
/**************************************** NavHeader.razor ************************************************************************/
.app-header-modern {
    min-height: 74px;
    background: #ffffff;
    border-bottom: 1px solid #e3e8ef;
    box-shadow: 0 3px 12px rgba(44, 76, 108, 0.06);
    z-index: 95;
}

    .app-header-modern .main-container {
        padding: 10px 18px;
    }

    .app-header-modern .app-header-main-row {
        min-height: 52px;
        width: 100%;
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
        grid-template-areas: "left center right";
        align-items: center;
        column-gap: 18px;
    }

    .app-header-modern .app-header-left-zone {
        grid-area: left;
        min-width: 0;
        display: flex;
        align-items: center;
        justify-content: flex-start;
        gap: 14px;
    }

    .app-header-modern .app-header-center-zone {
        grid-area: center;
        min-width: 0;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .app-header-modern .app-header-right-zone {
        grid-area: right;
        min-width: 0;
        display: flex;
        align-items: center;
        justify-content: flex-end;
    }

    .app-header-modern .app-sidebar__toggle {
        width: 42px;
        height: 42px;
        min-width: 42px;
        border: 1px solid #e3e8ef;
        border-radius: 10px;
        background: #f8f9fa;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        box-shadow: none;
    }

        .app-header-modern .app-sidebar__toggle:hover,
        .app-header-modern .app-sidebar__toggle:focus {
            background: #eef3f7;
            border-color: #d5dee8;
        }

        /* Explicit Font Awesome toggle: removes the legacy Feather pseudo-icon. */
        .app-header-modern .app-sidebar__toggle::before,
        .app-header-modern .app-sidebar__toggle::after {
            display: none !important;
            content: none !important;
        }

    .app-header-modern .app-sidebar-toggle-icon {
        width: 100%;
        height: 100%;
        margin: 0;
        padding: 0;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        color: #2c4c6c;
        font-size: 16px;
        line-height: 1;
        transform: none;
    }

    .app-header-modern .app-header-brand-link {
        display: none;
        width: 0;
        height: 0;
        overflow: hidden;
        text-decoration: none;
    }

    .app-header-modern .header-brand-img {
        max-height: 36px;
        max-width: 132px;
        object-fit: contain;
    }

    .app-header-modern .responsive-navbar {
        min-height: 46px;
        display: flex;
        align-items: center;
        justify-content: flex-end;
        gap: 10px;
        background: transparent;
        border: none;
        border-radius: 0;
        padding: 0 !important;
        box-shadow: none;
        flex-wrap: nowrap;
        min-width: 0;
    }

    .app-header-modern .app-header-action-zone {
        display: flex;
        align-items: center;
        gap: 9px;
        flex-wrap: nowrap;
        min-width: 0;
    }

    .app-header-modern .app-header-user-zone {
        display: flex;
        align-items: center;
        gap: 9px;
        padding-left: 12px;
        margin-left: 4px;
        border-left: 1px solid #e3e8ef;
        flex-wrap: nowrap;
        flex: 0 0 auto;
    }

    .app-header-modern .dropdown,
    .app-header-modern .nav-item {
        display: inline-flex;
        align-items: center;
    }

    .app-header-modern .notifications,
    .app-header-modern .profile-1,
    .app-header-modern .conexgo-server-nav,
    .app-header-modern .conexgo-nav-server {
        float: none !important;
        margin: 0 !important;
    }

    .app-header-modern .topbar-version-pill,
    .app-header-modern .nt-clock-card {
        flex: 0 0 auto;
    }

@media (max-width: 1600px) {
    .app-header-modern .main-container {
        padding: 10px 16px;
    }

    .app-header-modern .app-header-main-row {
        column-gap: 14px;
    }

    .app-header-modern .app-header-left-zone {
        gap: 12px;
    }

    .app-header-modern .responsive-navbar {
        gap: 8px;
    }

    .app-header-modern .app-header-action-zone {
        gap: 7px;
    }

    .app-header-modern .app-header-user-zone {
        gap: 7px;
        padding-left: 10px;
    }
}

@media (max-width: 1440px) {
    .app-header-modern .app-header-main-row {
        grid-template-columns: minmax(0, auto) minmax(260px, 1fr) minmax(0, auto);
        column-gap: 10px;
    }

    .app-header-modern .app-header-left-zone {
        gap: 10px;
    }

    .app-header-modern .app-header-action-zone {
        gap: 6px;
    }

    .app-header-modern .app-header-user-zone {
        gap: 6px;
        padding-left: 8px;
        margin-left: 2px;
    }

    .app-header-modern .profile-1 span.d-none.d-lg-block {
        display: none !important;
    }

    .app-header-modern .app-header-center-zone {
        min-width: 0;
    }

        .app-header-modern .app-header-center-zone .nt-clock-card {
            width: 100%;
            max-width: 340px;
            min-width: 0;
        }
}

@media (max-width: 1240px) {
    .app-header-modern {
        min-height: auto;
    }

        .app-header-modern .app-header-main-row {
            grid-template-columns: auto minmax(0, 1fr);
            grid-template-areas:
                "left center"
                "right right";
            column-gap: 14px;
            row-gap: 9px;
        }

        .app-header-modern .app-header-left-zone {
            width: auto;
            justify-content: flex-start;
        }

        .app-header-modern .app-header-center-zone {
            width: 100%;
            justify-content: flex-end;
        }

            .app-header-modern .app-header-center-zone .nt-clock-card {
                width: 100%;
                max-width: 360px;
                min-width: 0;
            }

        .app-header-modern .app-header-right-zone {
            width: 100%;
            justify-content: center;
            padding-top: 9px;
            border-top: 1px solid #edf1f5;
        }

        .app-header-modern .responsive-navbar {
            width: 100%;
            min-width: 0;
            justify-content: center;
            flex-wrap: wrap;
            row-gap: 8px;
        }

        .app-header-modern .app-header-action-zone {
            flex-wrap: wrap;
            justify-content: center;
        }

        .app-header-modern .app-header-user-zone {
            flex-wrap: nowrap;
            justify-content: center;
        }

            .app-header-modern .app-header-action-zone > *,
            .app-header-modern .app-header-user-zone > * {
                max-width: 100%;
            }
}

@media (max-width: 991.98px) {
    .app-header-modern {
        min-height: auto;
    }

        .app-header-modern .main-container {
            padding: 6px 10px;
        }

        .app-header-modern .app-header-main-row {
            min-height: 0;
            grid-template-columns: minmax(0, 1fr);
            grid-template-areas:
                "left"
                "center"
                "right";
            row-gap: 4px;
        }

        .app-header-modern .app-header-left-zone {
            width: 100%;
            min-width: 0;
            display: grid;
            grid-template-columns: 42px minmax(0, 1fr) auto;
            align-items: center;
            gap: 8px;
        }

        .app-header-modern .app-sidebar__toggle {
            grid-column: 1;
            width: 40px;
            min-width: 40px;
            height: 40px;
            right: auto;
            padding: 0;
        }

        .app-header-modern .app-header-brand-link {
            grid-column: 2;
            width: 100%;
            min-width: 0;
            height: 40px;
            padding: 3px 5px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            overflow: hidden;
        }

        .app-header-modern .header-brand-img {
            width: auto;
            max-width: 118px;
            max-height: 31px;
            object-fit: contain;
        }

        .app-header-modern .app-header-left-zone > .topbar-version-pill {
            grid-column: 3;
            justify-self: end;
        }

        .app-header-modern .app-header-center-zone {
            width: 100%;
            min-width: 0;
            padding-top: 4px;
            justify-content: center;
            border-top: 1px solid #edf1f5;
        }

            .app-header-modern .app-header-center-zone .nt-clock-card {
                width: min(100%, 520px);
                min-width: 0;
                max-width: 520px;
            }

        .app-header-modern .app-header-right-zone {
            width: 100%;
            min-width: 0;
            min-height: 38px;
            padding-top: 2px;
            justify-content: center;
            border-top: 1px solid #edf1f5;
        }

        .app-header-modern .responsive-navbar {
            width: 100%;
            min-width: 0;
            min-height: 42px;
            padding: 0 !important;
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: center;
            flex-wrap: wrap;
            gap: 6px;
        }

        .app-header-modern .app-header-action-zone,
        .app-header-modern .app-header-user-zone {
            width: auto;
            min-width: 0;
            margin: 0;
            padding: 0;
            display: flex;
            align-items: center;
            justify-content: center;
            flex-wrap: wrap;
            gap: 6px;
            border: 0;
        }

            .app-header-modern .app-header-action-zone > .d-none.d-lg-block {
                display: inline-flex !important;
            }

        .app-header-modern .notifications,
        .app-header-modern .profile-1,
        .app-header-modern .conexgo-server-nav,
        .app-header-modern .conexgo-nav-server,
        .app-header-modern .dropdown,
        .app-header-modern .nav-item {
            max-width: 100%;
            float: none !important;
            margin: 0 !important;
        }

        .app-header-modern .responsive-navbar,
        .app-header-modern .app-header-action-zone,
        .app-header-modern .app-header-user-zone {
            flex-wrap: nowrap !important;
        }

        .app-header-modern .nav-link.icon,
        .app-header-modern .notifications > .nav-link,
        .app-header-modern .message > .nav-link,
        .app-header-modern .profile-1 > .nav-link {
            width: 36px !important;
            height: 36px !important;
            min-width: 36px !important;
            min-height: 36px !important;
            padding: 0 !important;
            display: inline-flex !important;
            align-items: center !important;
            justify-content: center !important;
            border-radius: 999px !important;
            line-height: 1 !important;
        }

            .app-header-modern .nav-link.icon > i,
            .app-header-modern .notifications > .nav-link > i,
            .app-header-modern .message > .nav-link > i {
                margin: 0 !important;
                padding: 0 !important;
                font-size: 14px !important;
                line-height: 1 !important;
            }

        .app-header-modern .profile-1 > .nav-link {
            overflow: hidden !important;
            border: 1px solid #dce5ed !important;
            background: #f8fafc !important;
            box-shadow: 0 3px 10px rgba(44, 76, 108, .10) !important;
            transition: background-color .16s ease, border-color .16s ease, box-shadow .16s ease, transform .16s ease !important;
        }

            .app-header-modern .profile-1 > .nav-link:hover,
            .app-header-modern .profile-1 > .nav-link:focus-visible {
                background: #eaf2f8 !important;
                border-color: #b9ccdc !important;
                box-shadow: 0 5px 14px rgba(44, 76, 108, .15) !important;
                transform: translateY(-1px);
            }

        .app-header-modern .profile-1 .profile-user {
            width: 36px !important;
            height: 36px !important;
            margin: 0 !important;
            border: 0 !important;
            border-radius: 999px !important;
            object-fit: cover !important;
            box-shadow: none !important;
            background: transparent !important;
        }
}

@media (max-width: 575.98px) {
    .app-header-modern .main-container {
        padding: 7px 8px;
    }

    .app-header-modern .app-header-main-row {
        row-gap: 5px;
    }

    .app-header-modern .app-header-left-zone {
        grid-template-columns: 40px minmax(0, 1fr) auto;
        gap: 6px;
    }

    .app-header-modern .app-sidebar__toggle {
        width: 38px;
        min-width: 38px;
        height: 38px;
        border-radius: 9px;
    }

    .app-header-modern .app-header-brand-link {
        height: 38px;
        padding: 2px 3px;
    }

    .app-header-modern .header-brand-img {
        max-width: 96px;
        max-height: 28px;
    }

    .app-header-modern .app-header-left-zone > .topbar-version-pill {
        min-width: 90px;
        max-width: 104px;
        padding-left: 8px;
        padding-right: 8px;
    }

    .app-header-modern .app-header-center-zone,
    .app-header-modern .app-header-right-zone {
        padding-top: 5px;
    }

    .app-header-modern .responsive-navbar,
    .app-header-modern .app-header-action-zone,
    .app-header-modern .app-header-user-zone {
        gap: 5px;
    }
}

@media (max-width: 350px) {
    .app-header-modern .main-container {
        padding-left: 5px;
        padding-right: 5px;
    }

    .app-header-modern .app-header-left-zone {
        grid-template-columns: 38px minmax(0, 1fr) auto;
        gap: 4px;
    }

    .app-header-modern .header-brand-img {
        max-width: 76px;
        max-height: 25px;
    }

    .app-header-modern .app-header-left-zone > .topbar-version-pill {
        min-width: 84px;
        max-width: 94px;
        padding-left: 6px;
        padding-right: 6px;
    }
}

/* R5.9 - every role uses the same compact action alignment. */
.app-header-modern .app-header-action-zone > *,
.app-header-modern .app-header-user-zone > * {
    flex: 0 0 auto;
    margin: 0 !important;
    float: none !important;
}

.app-header-modern .conexgo-header-notifications {
    align-self: center;
}

/* R5 navbar interaction polish: local to the top header. */
.app-header-modern .app-header-action-zone .nav-link,
.app-header-modern .app-header-user-zone .nav-link,
.app-header-modern .app-sidebar__toggle {
    transition: transform .18s ease, background-color .18s ease, border-color .18s ease, box-shadow .18s ease, color .18s ease;
}

    .app-header-modern .app-header-action-zone .nav-link:hover,
    .app-header-modern .app-header-action-zone .nav-link:focus-visible,
    .app-header-modern .app-header-user-zone .nav-link:hover,
    .app-header-modern .app-header-user-zone .nav-link:focus-visible,
    .app-header-modern .app-sidebar__toggle:hover,
    .app-header-modern .app-sidebar__toggle:focus-visible {
        transform: translateY(-1px);
        box-shadow: 0 5px 13px rgba(44, 76, 108, .11);
        outline: none;
    }

.app-header-modern .dropdown.show > .nav-link {
    background: #edf4f8 !important;
    border-color: #c9d7e3 !important;
    box-shadow: 0 5px 13px rgba(44, 76, 108, .11);
}

.app-header-modern .app-sidebar__toggle:hover .app-sidebar-toggle-icon,
.app-header-modern .app-sidebar__toggle:focus-visible .app-sidebar-toggle-icon {
    transform: scale(1.06);
}

.app-header-modern .app-sidebar-toggle-icon {
    transition: transform .18s ease;
}

.app-header-modern .nt-clock-card,
.app-header-modern .topbar-version-pill,
.app-header-modern .conexgo-server-nav > .nav-link,
.app-header-modern .conexgo-nav-server > .nav-link {
    transition: transform .18s ease, background-color .18s ease, border-color .18s ease, box-shadow .18s ease !important;
}

    .app-header-modern .nt-clock-card:hover,
    .app-header-modern .nt-clock-card:focus-within,
    .app-header-modern .topbar-version-pill:hover,
    .app-header-modern .conexgo-server-nav > .nav-link:hover,
    .app-header-modern .conexgo-nav-server > .nav-link:hover {
        transform: translateY(-1px);
        border-color: #cbd8e4 !important;
        background-color: #f8fbfd !important;
        box-shadow: 0 6px 15px rgba(44, 76, 108, .10) !important;
    }

.app-header-modern .badge,
.app-header-modern .pulse {
    transition: transform .18s ease, box-shadow .18s ease !important;
}

.app-header-modern .nav-link:hover .badge,
.app-header-modern .nav-link:focus-visible .badge {
    transform: translateY(-1px) scale(1.05);
    box-shadow: 0 3px 8px rgba(44, 76, 108, .16);
}

@media (prefers-reduced-motion: reduce) {
    .app-header-modern .app-header-action-zone .nav-link,
    .app-header-modern .app-header-user-zone .nav-link,
    .app-header-modern .app-sidebar__toggle,
    .app-header-modern .app-sidebar-toggle-icon,
    .app-header-modern .nt-clock-card,
    .app-header-modern .topbar-version-pill,
    .app-header-modern .conexgo-server-nav > .nav-link,
    .app-header-modern .conexgo-nav-server > .nav-link,
    .app-header-modern .badge,
    .app-header-modern .pulse {
        transition: none !important;
        transform: none !important;
    }
}

/* CONEXGO R6.2 — sober header actions and live-event feedback. */
.app-header-modern .app-header-action-zone .nav-link,
.app-header-modern .app-header-user-zone .nav-link,
.app-header-modern .conexgo-header-action {
    transition: background-color .18s ease, border-color .18s ease, color .18s ease, transform .18s ease, box-shadow .18s ease;
}

    .app-header-modern .app-header-action-zone .nav-link:hover,
    .app-header-modern .app-header-user-zone .nav-link:hover,
    .app-header-modern .conexgo-header-action:hover {
        transform: translateY(-1px);
        box-shadow: 0 5px 14px rgba(44, 76, 108, .09);
    }

.app-header-modern .conexgo-notification-trigger > .conexgo-notification-bell,
.app-header-modern .conexgo-header-language > .nav-link > .fa-globe {
    color: #315879 !important;
}

.app-header-modern .badge,
.app-header-modern [class*="badge"] {
    transition: transform .2s ease, filter .2s ease;
}

    .app-header-modern .badge:not(:empty),
    .app-header-modern [class*="badge"]:not(:empty) {
        animation: conexgoHeaderBadgePulse .38s cubic-bezier(.2,.75,.25,1);
    }

@keyframes conexgoHeaderBadgePulse {
    0% {
        transform: scale(.72);
    }

    65% {
        transform: scale(1.12);
    }

    100% {
        transform: scale(1);
    }
}

@media (prefers-reduced-motion: reduce) {
    .app-header-modern .app-header-action-zone .nav-link,
    .app-header-modern .app-header-user-zone .nav-link,
    .app-header-modern .conexgo-header-action,
    .app-header-modern .badge,
    .app-header-modern [class*="badge"] {
        animation: none !important;
        transition: none !important;
    }
}
/* Final header restraint: no vertical movement; consistent compact actions. */
.app-header-modern .app-header-action-zone .nav-link,
.app-header-modern .app-header-user-zone .nav-link,
.app-header-modern .conexgo-header-action,
.app-header-modern .nt-clock-card,
.app-header-modern .topbar-version-pill,
.app-header-modern .conexgo-server-nav > .nav-link,
.app-header-modern .conexgo-nav-server > .nav-link {
    transform: none !important;
    transition: background-color .18s ease, border-color .18s ease, color .18s ease, box-shadow .18s ease !important;
}

    .app-header-modern .app-header-action-zone .nav-link:hover,
    .app-header-modern .app-header-action-zone .nav-link:focus-visible,
    .app-header-modern .app-header-user-zone .nav-link:hover,
    .app-header-modern .app-header-user-zone .nav-link:focus-visible,
    .app-header-modern .conexgo-header-action:hover,
    .app-header-modern .nt-clock-card:hover,
    .app-header-modern .nt-clock-card:focus-within,
    .app-header-modern .topbar-version-pill:hover {
        transform: none !important;
        background-color: #f5f9fc !important;
        border-color: #cbd8e4 !important;
        box-shadow: 0 4px 11px rgba(44, 76, 108, .07) !important;
    }

.app-header-modern .app-header-action-zone {
    align-items: center !important;
    gap: 8px !important;
}

.app-header-modern .app-header-user-zone {
    align-items: center !important;
    gap: 8px !important;
}
/* R4: small one-shot icon bounce, without continuous movement. */
@media (prefers-reduced-motion: no-preference) {
    .app-header-modern .app-header-action-zone .nav-link:hover i:not(.fa-bounce),
    .app-header-modern .app-header-action-zone .nav-link:focus-visible i:not(.fa-bounce),
    .app-header-modern .app-header-user-zone .nav-link:hover i:not(.fa-bounce),
    .app-header-modern .app-header-user-zone .nav-link:focus-visible i:not(.fa-bounce),
    .app-header-modern .app-sidebar__toggle:hover .app-sidebar-toggle-icon,
    .app-header-modern .app-sidebar__toggle:focus-visible .app-sidebar-toggle-icon {
        animation: conexgoHeaderIconSoftBounce .36s cubic-bezier(.22, 1, .36, 1) both !important;
    }
}

@keyframes conexgoHeaderIconSoftBounce {
    0% {
        transform: translateY(0) scale(1);
    }

    44% {
        transform: translateY(-2px) scale(1.035);
    }

    72% {
        transform: translateY(1px) scale(.995);
    }

    100% {
        transform: translateY(0) scale(1);
    }
}
/* CONEXGO R6: restricted roles use bottom navigation on responsive screens */
@media (max-width: 1199.98px) {
    .app-header-modern .cx-restricted-mobile-sidebar-toggle {
        display: none !important;
    }
}
/* #endregion NavHeader.razor */

/* #region Version.razor */
/**************************************** Version.razor ************************************************************************/
.topbar-version-pill {
    --env-color: #365B87;
    height: 42px;
    min-width: 132px;
    padding: 0 15px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    background: #F8FAFC;
    border: 1px solid #E0E6ED;
    border-radius: 12px;
    box-shadow: 0 1px 2px rgba(44, 76, 108, .05);
    color: #2c4c6c;
    line-height: 1;
    white-space: nowrap;
}

.topbar-version-icon {
    width: 20px;
    min-width: 20px;
    height: 22px;
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #3E6A99;
    font-size: 11pt;
}

.topbar-version-status {
    width: 6px;
    height: 6px;
    position: absolute;
    right: -1px;
    bottom: 2px;
    display: block;
    border-radius: 999px;
    background: var(--env-color);
    border: 1px solid #F8FAFC;
}

.topbar-version-status-dev::after {
    content: "";
    position: absolute;
    inset: -3px;
    border: 1px solid var(--env-color);
    border-radius: 999px;
    opacity: 0;
    animation: topbar-version-status-pulse 2.8s ease-out infinite;
}

.topbar-version-content {
    min-width: 0;
    display: inline-flex;
    align-items: baseline;
    gap: 5px;
}

.topbar-version-label {
    color: #718096;
    font-size: 7.6pt;
    font-weight: 700;
    letter-spacing: .35px;
    text-transform: uppercase;
}

.topbar-version-value {
    color: #2c4c6c;
    font-size: 10pt;
    font-weight: 800;
    letter-spacing: .1px;
    font-variant-numeric: tabular-nums;
}

@keyframes topbar-version-status-pulse {
    0% {
        transform: scale(.8);
        opacity: 0;
    }

    25% {
        opacity: .28;
    }

    75% {
        transform: scale(1.7);
        opacity: 0;
    }

    100% {
        transform: scale(1.7);
        opacity: 0;
    }
}

@media (max-width: 1400px) {
    .topbar-version-pill {
        height: 40px;
        min-width: 122px;
        padding: 0 13px;
        gap: 8px;
    }

    .topbar-version-value {
        font-size: 9.5pt;
    }
}

@media (max-width: 1100px) {
    .topbar-version-pill {
        height: 38px;
        min-width: 102px;
        padding: 0 11px;
    }

    .topbar-version-label {
        display: none;
    }

    .topbar-version-value {
        font-size: 9.2pt;
    }
}

@media (max-width: 575.98px) {
    .topbar-version-pill {
        height: 38px;
        min-width: 88px;
        padding: 0 9px;
        gap: 6px;
        border-radius: 10px;
    }

    .topbar-version-icon {
        width: 18px;
        min-width: 18px;
        font-size: 12px;
    }

    .topbar-version-value {
        font-size: 9.5pt;
    }
}

@media (prefers-reduced-motion: reduce) {
    .topbar-version-status-dev::after {
        animation: none;
    }
}
/* #endregion Version.razor */

/* #region Clock.razor */
/**************************************** Clock.razor ************************************************************************/
.nt-clock-card {
    height: 42px;
    min-width: 340px;
    max-width: 100%;
    margin: 0;
    padding: 0 17px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 15px;
    background: #F8FAFC;
    border: 1px solid #E0E6ED;
    border-radius: 12px;
    box-shadow: 0 1px 2px rgba(44, 76, 108, .05);
    color: #2c4c6c;
    line-height: 1;
    overflow: hidden;
    white-space: nowrap;
}

.nt-clock-list {
    min-width: 0;
    margin: 0;
    padding: 0;
    display: inline-flex;
    align-items: center;
    list-style: none;
}

.nt-date {
    min-width: 0;
    gap: 9px;
    flex: 0 1 auto;
}

.nt-date-icon,
.nt-time-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #3E6A99;
    font-size: 11pt;
    line-height: 1;
    flex: 0 0 auto;
}

.nt-date-text {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #4D6580;
    font-size: 9.4pt;
    font-weight: 700;
    letter-spacing: .05px;
}

.nt-date-short {
    display: none;
}

.nt-clock {
    position: relative;
    gap: 1px;
    padding-left: 15px;
    flex: 0 0 auto;
    border-left: 1px solid #D7DEE7;
    color: #2c4c6c;
    font-size: 10.2pt;
    font-weight: 800;
    letter-spacing: .1px;
    font-variant-numeric: tabular-nums;
}

.nt-time-icon {
    margin-right: 7px;
    font-size: 10.5pt;
}

.nt-clock-value {
    min-width: 18px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.nt-clock-separator {
    width: 5px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #6D8197;
    animation: nt-clock-separator-pulse 1.1s ease-in-out infinite;
}

.nt-clock-separator-secondary {
    animation-delay: .12s;
}

.nt-seconds {
    color: #58718D;
    font-weight: 750;
}

.nt-meridiem {
    margin-left: 6px;
    color: #3E6A99;
    font-size: 7.5pt;
    font-weight: 800;
    letter-spacing: .25px;
    text-transform: uppercase;
}

@keyframes nt-clock-separator-pulse {
    0%, 100% {
        opacity: .42;
    }

    50% {
        opacity: 1;
    }
}

@media (max-width: 1400px) {
    .nt-clock-card {
        height: 40px;
        min-width: 305px;
        padding: 0 15px;
        gap: 12px;
    }

    .nt-date-text {
        font-size: 9pt;
    }

    .nt-clock {
        padding-left: 12px;
        font-size: 9.8pt;
    }
}

@media (max-width: 1250px) {
    .nt-clock-card {
        min-width: 280px;
    }
}

@media (max-width: 1100px) {
    .nt-clock-card {
        height: 38px;
        min-width: 225px;
        padding: 0 13px;
        gap: 9px;
    }

    .nt-date-full {
        display: none;
    }

    .nt-date-short {
        display: inline-block;
    }

    .nt-date-text {
        font-size: 8.6pt;
    }

    .nt-date-icon,
    .nt-time-icon {
        font-size: 9.5pt;
    }

    .nt-clock {
        padding-left: 9px;
        font-size: 9.2pt;
    }

    .nt-time-icon {
        margin-right: 5px;
    }

    .nt-meridiem {
        margin-left: 4px;
        font-size: 7pt;
    }
}

@media (max-width: 575.98px) {
    .nt-clock-card {
        width: auto;
        min-width: 0;
        height: 38px;
        padding: 0 12px;
    }

    .nt-date-icon {
        display: none;
    }

    .nt-date {
        gap: 0;
    }

    .nt-clock-value {
        min-width: 16px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .nt-clock-separator {
        animation: none;
    }
}
/* #endregion Clock.razor */

/* #region ConexgoServers.razor */
/**************************************** ConexgoServers.razor ************************************************************************/
/* Keep server hover feedback aligned with the Operator control rhythm. */
.conexgo-header-servers .conexgo-server-group,
.conexgo-header-servers .conexgo-server-service {
    transform: none;
    transition:
        background-color .24s cubic-bezier(.22, 1, .36, 1),
        border-color .24s cubic-bezier(.22, 1, .36, 1),
        box-shadow .24s cubic-bezier(.22, 1, .36, 1);
}

    .conexgo-header-servers .conexgo-server-group:hover {
        background: #eef4f8 !important;
        border-color: #c4d4e1 !important;
        box-shadow: 0 3px 9px rgba(44, 76, 108, .06) !important;
        transform: none;
    }

    .conexgo-header-servers .conexgo-server-service:hover {
        background: #eef4f8 !important;
        border-color: #c4d4e1 !important;
        box-shadow: inset 2px 0 0 rgba(44, 76, 108, .07) !important;
        transform: none;
    }

    .conexgo-header-servers .conexgo-server-service.is-offline:hover {
        background: #fff6f6 !important;
    }

@media (prefers-reduced-motion: reduce) {
    .conexgo-header-servers .conexgo-server-group,
    .conexgo-header-servers .conexgo-server-service {
        transition: none !important;
        transform: none !important;
    }
}
/* #endregion ConexgoServers.razor */

/* #region OperatorStatus.razor */
/**************************************** OperatorStatus.razor ************************************************************************/
.cx-header-status-shell {
    position: relative;
    display: inline-flex;
    align-items: center;
}

.cx-header-status-control {
    min-width: 78px;
    height: 38px;
    padding: 0 9px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    border: 1px solid #dbe4ec;
    border-radius: 999px;
    background: #f8fafc;
    color: #315879;
    box-shadow: none;
    transition: background-color .18s ease, border-color .18s ease, box-shadow .18s ease;
}

    .cx-header-status-control:hover,
    .cx-header-status-control:focus-within {
        border-color: #c4d4e1;
        background: #eef4f8;
        box-shadow: 0 4px 11px rgba(44, 76, 108, .08);
    }

.cx-header-status-icon {
    width: 16px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 11pt;
}

.cx-header-status-switch {
    margin: 0 !important;
    display: inline-flex;
    align-items: center;
}

    .cx-header-status-switch .custom-switch-indicator {
        margin: 0 !important;
    }

.cx-header-status-dot {
    width: 6px;
    height: 6px;
    border-radius: 999px;
    background: #9aa8b5;
}

    .cx-header-status-dot.is-active {
        background: #63906f;
    }

    .cx-header-status-dot.is-inactive {
        background: #b85d68;
    }

.cx-header-status-result {
    position: absolute;
    z-index: 10045;
    top: calc(100% + 13px);
    right: 0;
    width: min(360px, calc(100vw - 24px));
    min-height: 82px;
    padding: 13px 42px 13px 13px;
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr);
    align-items: center;
    gap: 11px;
    border: 1px solid #d7e2ea;
    border-radius: 11px;
    background: #ffffff;
    box-shadow: 0 16px 34px rgba(30, 55, 80, .18);
    animation: cx-header-status-result-in .18s ease both;
}

    .cx-header-status-result::before {
        content: "";
        position: absolute;
        top: -7px;
        right: 32px;
        width: 13px;
        height: 13px;
        border-left: 1px solid #d7e2ea;
        border-top: 1px solid #d7e2ea;
        background: #ffffff;
        transform: rotate(45deg);
    }

    .cx-header-status-result.is-enabled {
        border-left: 4px solid #63906f;
    }

    .cx-header-status-result.is-disabled {
        border-left: 4px solid #b85d68;
    }

.cx-header-status-result-icon {
    width: 38px;
    height: 38px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    background: #edf3f8;
    color: #315979;
}

.cx-header-status-result-copy {
    min-width: 0;
    display: grid;
    gap: 3px;
    color: #53677a;
    font-size: 12px;
    line-height: 1.35;
}

    .cx-header-status-result-copy strong {
        color: #2c4c6c;
        font-size: 13px;
        font-weight: 850;
    }

.cx-header-status-result-close {
    position: absolute;
    top: 8px;
    right: 8px;
    width: 28px;
    height: 28px;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 0;
    border-radius: 7px;
    background: transparent;
    color: #687b8d;
}

    .cx-header-status-result-close:hover {
        background: #eef3f7;
        color: #2c4c6c;
    }

@keyframes cx-header-status-result-in {
    from {
        opacity: 0;
        transform: translateY(-5px) scale(.98);
    }

    to {
        opacity: 1;
        transform: none;
    }
}

@media (max-width: 575.98px) {
    .cx-header-status-result {
        position: fixed;
        top: 78px;
        right: 12px;
        left: 12px;
        width: auto;
    }

        .cx-header-status-result::before {
            display: none;
        }
}

@media (prefers-reduced-motion: reduce) {
    .cx-header-status-result {
        animation: none !important;
    }
}
/* #endregion OperatorStatus.razor */

/* #region AlertQueue.razor */
/**************************************** AlertQueue.razor ************************************************************************/
.conexgo-header-alerts {
    flex: 0 0 auto;
    margin: 0 !important;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
}

    .conexgo-header-alerts .conexgo-alert-trigger {
        width: 36px;
        height: 36px;
        min-width: 36px;
        min-height: 36px;
        padding: 0 !important;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        border: 1px solid #e2e8ef;
        border-radius: 999px;
        background: #f8fafc;
        color: #315879;
        position: relative;
        transition: transform .18s ease, background-color .18s ease, border-color .18s ease, box-shadow .18s ease;
    }

        .conexgo-header-alerts .conexgo-alert-trigger:hover,
        .conexgo-header-alerts .conexgo-alert-trigger:focus-visible,
        .conexgo-header-alerts.show .conexgo-alert-trigger {
            background: #eef4f8;
            border-color: #cbd8e4;
            box-shadow: 0 4px 11px rgba(44, 76, 108, .11);
            transform: translateY(-1px);
            outline: none;
        }

    .conexgo-header-alerts .conexgo-alert-icon {
        font-size: 14px;
        line-height: 1;
    }

    /* Align alert and notification counters. */
    .conexgo-header-alerts .alertqueue-badge {
        position: absolute;
        top: -6px;
        right: -5px;
        z-index: 2;
        min-width: 19px;
        height: 19px;
        padding: 0 5px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        border: 2px solid #ffffff;
        border-radius: 999px;
        color: #ffffff;
        font-size: 7.5pt;
        font-weight: 800;
        line-height: 1;
        text-align: center;
        animation: conexgoAlertBadgeIn .28s cubic-bezier(.22, 1, .36, 1) both;
    }

.conexgo-alert-dropdown {
    width: 400px !important;
    max-width: calc(100vw - 24px) !important;
    padding: 0 !important;
    overflow: hidden !important;
    border: 1px solid #dfe7ef !important;
    border-radius: 13px !important;
    background: #ffffff !important;
    box-shadow: 0 16px 38px rgba(15, 23, 42, .16) !important;
}

.conexgo-alert-dropdown-header {
    padding: 12px 13px;
    border-bottom: 1px solid rgba(255,255,255,.12);
    background: #2c4c6c;
    color: #ffffff;
}

.conexgo-alert-dropdown-title-icon {
    width: 34px;
    min-width: 34px;
    height: 34px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(255,255,255,.16);
    border-radius: 10px;
    background: rgba(255,255,255,.11);
}

.conexgo-alert-dropdown-title {
    font-size: 10.4pt;
    font-weight: 760;
    line-height: 1.15;
}

.conexgo-alert-dropdown-count {
    margin-top: 2px;
    font-size: 8.1pt;
    line-height: 1.2;
    opacity: .82;
}

.conexgo-alert-header-button {
    min-height: 32px;
    padding: 0 10px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(255,255,255,.28);
    border-radius: 8px;
    background: rgba(255,255,255,.11);
    color: #ffffff;
    box-shadow: none;
    font-size: 8.3pt;
    font-weight: 720;
    white-space: nowrap;
    cursor: pointer;
    font-family: inherit;
    transition: background-color .16s ease, border-color .16s ease;
}

    .conexgo-alert-header-button:hover,
    .conexgo-alert-header-button:focus-visible {
        border-color: rgba(255,255,255,.48);
        background: rgba(255,255,255,.18);
        color: #ffffff;
        outline: none;
    }

    .conexgo-alert-header-button.is-close {
        width: 32px;
        min-width: 32px;
        padding: 0;
    }

.conexgo-alert-list {
    max-height: min(470px, calc(100dvh - 180px));
    padding: 8px;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    background: #f6f8fb;
    scrollbar-width: thin;
    scrollbar-color: #b8c5d1 transparent;
}

    .conexgo-alert-list::-webkit-scrollbar {
        width: 7px;
    }

    .conexgo-alert-list::-webkit-scrollbar-thumb {
        border: 2px solid transparent;
        border-radius: 999px;
        background: #b8c5d1;
        background-clip: padding-box;
    }

.conexgo-header-alerts .conexgo-alert-card {
    width: 100%;
    height: auto !important;
    min-height: 0 !important;
    margin: 0 0 8px;
    padding: 0 !important;
    display: block;
    overflow: hidden;
    box-sizing: border-box;
    /* Keep the alert accent visible on every side. */
    border: 2px solid var(--conexgo-alert-accent, #6f91ad);
    border-radius: 11px;
    background: #ffffff;
    color: inherit;
    white-space: normal;
    box-shadow: 0 2px 7px rgba(44, 76, 108, .045);
    transition: border-color .16s ease, background-color .16s ease, box-shadow .16s ease, transform .16s ease;
}

    .conexgo-header-alerts .conexgo-alert-card:last-of-type {
        margin-bottom: 0;
    }

    .conexgo-header-alerts .conexgo-alert-card:hover,
    .conexgo-header-alerts .conexgo-alert-card:focus-within {
        border-color: var(--conexgo-alert-accent, #6f91ad);
        background: #fbfdff;
        box-shadow: 0 5px 14px rgba(44, 76, 108, .08);
        transform: translateY(-1px);
    }

.conexgo-alert-card-content {
    width: 100%;
    min-height: 0;
    padding: 11px 12px;
    display: grid;
    grid-template-columns: 36px minmax(0, 1fr);
    gap: 10px;
    align-items: start;
}

.conexgo-alert-card-icon {
    width: 36px;
    height: 36px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #e1e8ef;
    border-radius: 10px;
    background: #f6f8fb;
    color: var(--conexgo-alert-accent, #6f91ad) !important;
    font-size: 12px !important;
}

.conexgo-alert-card-main {
    min-width: 0;
}

.conexgo-alert-card-heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 9px;
}

.conexgo-alert-card-title {
    min-width: 0;
    color: #2c4c6c;
    font-size: 9.4pt;
    font-weight: 800;
    line-height: 1.25;
    overflow-wrap: anywhere;
}

.conexgo-alert-card-device {
    margin-top: 2px;
    overflow: hidden;
    color: #1f2937;
    font-size: 8.7pt;
    font-weight: 700;
    line-height: 1.25;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.conexgo-alert-card-time {
    margin-top: 3px;
    color: #718096;
    font-size: 8.2pt;
    line-height: 1.25;
}

.conexgo-alert-language-pill {
    min-width: 40px;
    padding: 2px 7px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    border: 1px solid var(--conexgo-alert-accent, #6f91ad);
    border-radius: 999px;
    background: #ffffff;
    color: var(--conexgo-alert-accent, #6f91ad) !important;
    font-size: 7.3pt !important;
    font-weight: 800;
    line-height: 1.2;
    white-space: nowrap;
}

.conexgo-alert-card-footer {
    min-width: 0;
    margin-top: 9px;
    padding-top: 8px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    border-top: 1px solid #edf1f5;
}

.conexgo-alert-assignment {
    min-width: 0;
    color: #718096;
    font-size: 8.1pt;
    line-height: 1.25;
}

    .conexgo-alert-assignment b {
        display: block;
        margin-top: 1px;
        overflow: hidden;
        color: #2c4c6c;
        font-weight: 760;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

.conexgo-alert-card-actions {
    margin-left: auto;
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    gap: 6px;
    flex: 0 0 auto;
}

.conexgo-alert-card-button {
    min-height: 30px;
    padding: 0 9px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    border-radius: 7px;
    box-shadow: none;
    font-size: 8.1pt;
    font-weight: 720;
    line-height: 1;
    white-space: nowrap;
    cursor: pointer;
    font-family: inherit;
}

    .conexgo-alert-card-button span {
        color: inherit !important;
        font-size: inherit !important;
    }

    .conexgo-alert-card-button.is-primary {
        border: 1px solid #6b9f43;
        background: #6b9f43;
        color: #ffffff;
    }

    .conexgo-alert-card-button.is-secondary {
        border: 1px solid #d9e2ea;
        background: #ffffff;
        color: #2c4c6c;
    }

.conexgo-alert-empty {
    padding: 28px 18px;
    text-align: center;
    background: #ffffff;
    border-radius: 10px;
}

.conexgo-alert-empty-icon {
    width: 42px;
    height: 42px;
    margin: 0 auto 9px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #e1e7ed;
    border-radius: 50%;
    background: #f6f8fa;
    color: #6c757d;
}

.conexgo-alert-see-all {
    min-height: 42px !important;
    padding: 10px 12px !important;
    display: flex !important;
    align-items: center;
    justify-content: center;
    border-top: 1px solid #e5ebf1 !important;
    background: #ffffff !important;
    color: #2c4c6c !important;
    font-size: 8.8pt !important;
    font-weight: 760 !important;
    text-align: center;
}

    .conexgo-alert-see-all:hover,
    .conexgo-alert-see-all:focus-visible {
        background: #f2f6f9 !important;
        color: #24435f !important;
    }

@keyframes conexgoAlertBadgeIn {
    from {
        opacity: 0;
        transform: scale(.76);
    }

    to {
        opacity: 1;
        transform: scale(1);
    }
}

@media (max-width: 575.98px) {
    .conexgo-alert-dropdown {
        right: 0 !important;
        left: auto !important;
        width: min(400px, calc(100vw - 20px)) !important;
        max-height: calc(100dvh - 126px) !important;
    }

    .conexgo-alert-list {
        max-height: calc(100dvh - 238px);
        padding: 7px;
    }

    .conexgo-alert-card-content {
        grid-template-columns: 32px minmax(0, 1fr);
        gap: 8px;
        padding: 10px;
    }

    .conexgo-alert-card-icon {
        width: 32px;
        height: 32px;
        border-radius: 9px;
    }

    .conexgo-alert-card-footer {
        align-items: flex-start;
        flex-direction: column;
    }

    .conexgo-alert-card-actions {
        width: 100%;
        margin-left: 0;
    }

    .conexgo-alert-card-button {
        flex: 1 1 auto;
    }
}

@media (prefers-reduced-motion: reduce) {
    .conexgo-header-alerts .conexgo-alert-trigger,
    .conexgo-header-alerts .conexgo-alert-icon,
    .conexgo-header-alerts .alertqueue-badge,
    .conexgo-header-alerts .conexgo-alert-card {
        animation: none !important;
        transition: none !important;
    }
}

/* Keep the alert queue compact and anchored. */
html body .app-header-modern .conexgo-header-alerts {
    position: relative !important;
}

    html body .app-header-modern .conexgo-header-alerts .conexgo-alert-dropdown {
        top: calc(100% + 8px) !important;
        right: 0 !important;
        bottom: auto !important;
        left: auto !important;
        width: min(372px, calc(100vw - 24px)) !important;
        max-width: min(372px, calc(100vw - 24px)) !important;
        max-height: min(520px, calc(100dvh - 96px)) !important;
        margin: 0 !important;
        transform: none !important;
    }

        html body .app-header-modern .conexgo-header-alerts .conexgo-alert-dropdown.show {
            display: flex !important;
            flex-direction: column;
        }

    html body .app-header-modern .conexgo-header-alerts .conexgo-alert-dropdown-header,
    html body .app-header-modern .conexgo-header-alerts .conexgo-alert-see-all {
        flex: 0 0 auto;
    }

    html body .app-header-modern .conexgo-header-alerts .conexgo-alert-list {
        min-height: 0 !important;
        max-height: min(360px, calc(100dvh - 210px)) !important;
        flex: 1 1 auto;
        padding: 7px !important;
        overflow-x: hidden !important;
        overflow-y: auto !important;
    }

    html body .app-header-modern .conexgo-header-alerts .conexgo-alert-card {
        margin-bottom: 7px;
        border-radius: 10px;
    }

    html body .app-header-modern .conexgo-header-alerts .conexgo-alert-card-content {
        grid-template-columns: 32px minmax(0, 1fr);
        gap: 9px;
        padding: 9px 10px;
    }

    html body .app-header-modern .conexgo-header-alerts .conexgo-alert-card-icon {
        width: 32px;
        height: 32px;
        border-radius: 9px;
    }

    html body .app-header-modern .conexgo-header-alerts .conexgo-alert-card-footer {
        margin-top: 7px;
        padding-top: 7px;
    }

    html body .app-header-modern .conexgo-header-alerts .conexgo-alert-see-all {
        min-height: 40px !important;
        padding: 9px 12px !important;
    }

@media (max-width: 575.98px) {
    html body .app-header-modern .conexgo-header-alerts .conexgo-alert-dropdown {
        position: fixed !important;
        top: 68px !important;
        right: 10px !important;
        bottom: auto !important;
        left: 10px !important;
        width: auto !important;
        max-width: none !important;
        max-height: calc(100dvh - 84px) !important;
    }

    html body .app-header-modern .conexgo-header-alerts .conexgo-alert-list {
        max-height: calc(100dvh - 196px) !important;
    }
}

/* Use a complete border around each alert card. */
.conexgo-header-alerts .conexgo-alert-card {
    border: 2px solid var(--conexgo-alert-accent, #6f91ad) !important;
    border-left-width: 2px !important;
}

    .conexgo-header-alerts .conexgo-alert-card:hover,
    .conexgo-header-alerts .conexgo-alert-card:focus-within {
        border-color: var(--conexgo-alert-accent, #6f91ad) !important;
        box-shadow: 0 5px 14px rgba(44, 76, 108, .08) !important;
    }
/* #endregion AlertQueue.razor */

/* #region Notification.razor */
/**************************************** Notification.razor ************************************************************************/
.conexgo-header-notifications {
    flex: 0 0 auto;
    float: none !important;
    margin: 0 !important;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
}

    .conexgo-header-notifications > .nav-link {
        flex: 0 0 auto;
        margin: 0 !important;
    }

    .conexgo-header-notifications .conexgo-notification-trigger {
        transition: transform .18s ease, background-color .18s ease, border-color .18s ease, box-shadow .18s ease;
    }

        .conexgo-header-notifications .conexgo-notification-trigger:hover,
        .conexgo-header-notifications .conexgo-notification-trigger:focus-visible,
        .conexgo-header-notifications .conexgo-notification-trigger:active,
        .conexgo-header-notifications.show .conexgo-notification-trigger {
            background: #f8fbfd !important;
            border-color: #cbd8e4 !important;
            color: #2f5a7c !important;
            box-shadow: 0 3px 9px rgba(44, 76, 108, .08) !important;
            transform: none !important;
            outline: none;
        }

        .conexgo-header-notifications .conexgo-notification-trigger.is-empty:hover,
        .conexgo-header-notifications .conexgo-notification-trigger.is-empty:focus-visible,
        .conexgo-header-notifications .conexgo-notification-trigger.is-empty:active,
        .conexgo-header-notifications.show .conexgo-notification-trigger.is-empty {
            background: #f4f6f8 !important;
            border-color: #dfe5e9 !important;
            color: #8c98a2 !important;
            box-shadow: 0 2px 7px rgba(44, 76, 108, .05) !important;
        }

    .conexgo-header-notifications .conexgo-notification-bell {
        transform-origin: 50% 12%;
        transition: transform .18s ease, color .18s ease;
    }

    .conexgo-header-notifications .conexgo-notification-trigger:hover .conexgo-notification-bell,
    .conexgo-header-notifications .conexgo-notification-trigger:focus-visible .conexgo-notification-bell {
        transform: rotate(-8deg);
    }

    .conexgo-header-notifications .conexgo-notification-trigger.has-notifications .conexgo-notification-bell {
        animation: conexgoNotificationBellAttention .72s cubic-bezier(.22, 1, .36, 1) 2;
    }

    .conexgo-header-notifications .conexgo-notification-badge {
        animation: conexgoNotificationBadgeIn .28s cubic-bezier(.22, 1, .36, 1) both;
    }

.conexgo-notification-dropdown .dropdown-item {
    transition: background-color .16s ease, color .16s ease, transform .16s ease;
}

    .conexgo-notification-dropdown .dropdown-item:hover,
    .conexgo-notification-dropdown .dropdown-item:focus-visible {
        background: #f2f7fa;
        color: #24435f;
        transform: none;
        outline: none;
    }

@keyframes conexgoNotificationBellAttention {
    0%, 100% {
        transform: rotate(0deg);
    }

    35% {
        transform: rotate(-8deg);
    }

    70% {
        transform: rotate(7deg);
    }
}

@keyframes conexgoNotificationBadgeIn {
    from {
        opacity: 0;
        transform: scale(.76);
    }

    to {
        opacity: 1;
        transform: scale(1);
    }
}

@media (prefers-reduced-motion: reduce) {
    .conexgo-header-notifications .conexgo-notification-trigger,
    .conexgo-header-notifications .conexgo-notification-bell,
    .conexgo-header-notifications .conexgo-notification-badge,
    .conexgo-notification-dropdown .dropdown-item {
        animation: none !important;
        transition: none !important;
    }
}

@media (max-width: 991.98px) {
    .conexgo-header-notifications {
        width: 36px;
        min-width: 36px;
        height: 36px;
    }

    .conexgo-notification-dropdown {
        right: 0 !important;
        left: auto !important;
        width: min(360px, calc(100vw - 20px)) !important;
    }
}
/* #endregion Notification.razor */

/* #region ChangePassword.razor */
/**************************************** ChangePassword.razor ************************************************************************/
.cx-password-dialog {
    width: min(100%, 760px);
    margin: 0 auto;
    color: #263b53;
}

.cx-password-dialog__form {
    display: grid;
    gap: 20px;
}

.cx-password-dialog__hero {
    display: grid;
    grid-template-columns: 54px minmax(0, 1fr);
    align-items: center;
    gap: 16px;
    padding: 22px;
    border-radius: 16px;
    background: linear-gradient(135deg, #2c4c6c, #3d6287);
    color: #fff;
    box-shadow: 0 14px 32px rgba(35, 65, 94, .18);
}

.cx-password-dialog__hero-icon {
    width: 54px;
    height: 54px;
    display: grid;
    place-items: center;
    border: 1px solid rgba(255,255,255,.24);
    border-radius: 15px;
    background: rgba(255,255,255,.1);
    font-size: 1.2rem;
}

.cx-password-dialog__hero h2 {
    margin: 0 0 4px;
    color: inherit;
    font-size: clamp(1.1rem, 3vw, 1.45rem);
}

.cx-password-dialog__hero p,
.cx-password-dialog__guidance {
    margin: 0;
    line-height: 1.55;
}

.cx-password-dialog__guidance {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 15px 17px;
    border: 1px solid #d9e4ed;
    border-radius: 13px;
    background: #f6f9fc;
    color: #5c6f83;
}

.cx-password-dialog__fields {
    display: grid;
    gap: 16px;
    padding: 4px 24px 8px;
}

.cx-password-dialog__field {
    display: grid;
    gap: 7px;
}

    .cx-password-dialog__field label {
        color: #2c4c6c;
        font-weight: 750;
    }

.cx-password-dialog__control {
    position: relative;
}

    .cx-password-dialog__control > i {
        position: absolute;
        left: 16px;
        top: 50%;
        translate: 0 -50%;
        color: #7390aa;
        pointer-events: none;
    }

    .cx-password-dialog__control .form-control {
        min-height: 52px;
        padding-left: 46px;
        border: 1px solid #cfdce8;
        border-radius: 12px;
        background: #fff;
    }

        .cx-password-dialog__control .form-control:focus {
            border-color: #5f84a5;
            box-shadow: 0 0 0 4px rgba(62, 106, 153, .12);
        }

.cx-password-dialog__footer {
    display: flex;
    justify-content: flex-end;
    padding: 18px 24px 0;
    border-top: 1px solid #e1e8ef;
}

    .cx-password-dialog__footer .btn {
        min-width: 168px;
        min-height: 48px;
        border-radius: 12px;
        background: #2f587c;
        border-color: #2f587c;
        color: #fff;
        font-weight: 750;
    }

@media (max-width: 575.98px) {
    .cx-password-dialog__hero {
        grid-template-columns: 44px minmax(0, 1fr);
        padding: 17px;
    }

    .cx-password-dialog__hero-icon {
        width: 44px;
        height: 44px;
    }

    .cx-password-dialog__fields,
    .cx-password-dialog__footer {
        padding-inline: 0;
    }

        .cx-password-dialog__footer .btn {
            width: 100%;
        }
}
/* #endregion ChangePassword.razor */

/*********** MAIN MENU *******************/
/* #region Index.razor */
/**************************************** Index.razor ************************************************************************/
.conexgo-dashboard-resizable-card {
    resize: vertical;
    overflow: hidden;
    position: relative;
    display: flex;
    flex-direction: column;
}

    .conexgo-dashboard-resizable-card > .card-header {
        flex: 0 0 auto;
        cursor: pointer;
    }

    .conexgo-dashboard-resizable-card > .card-body {
        flex: 1 1 auto;
        min-height: 0;
        overflow: hidden;
    }

    .conexgo-dashboard-resizable-card::after {
        content: "";
        position: absolute;
        right: 5px;
        bottom: 5px;
        width: 14px;
        height: 14px;
        pointer-events: none;
        opacity: .75;
        background: linear-gradient(135deg, transparent 0 42%, rgba(44,76,108,.32) 43% 49%, transparent 50% 58%, rgba(44,76,108,.32) 59% 65%, transparent 66%);
    }

.conexgo-dashboard-resizable-list {
    background: #fff;
    overflow: hidden;
    min-height: 0;
    flex: 1 1 auto;
}

.conexgo-dashboard-resize-meta {
    color: #6c757d;
    font-size: 8.5pt;
    padding-top: 10px;
    border-top: 1px solid #edf0f2;
    flex: 0 0 auto;
}

.conexgo-dashboard-card-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    min-width: 0;
    width: 100%;
}

    .conexgo-dashboard-card-header h4 {
        flex: 1 1 auto;
        min-width: 0;
        overflow: visible;
        text-overflow: clip;
        white-space: normal;
        line-height: 1.2;
    }

.conexgo-dashboard-card-action {
    border: 1px solid rgba(255,255,255,.45);
    background: rgba(255,255,255,.08);
    color: white;
    border-radius: 4px;
    min-width: 30px;
    height: 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 8px;
    cursor: pointer;
    flex: 0 0 auto;
    line-height: 1;
    margin-left: auto;
}

.conexgo-dashboard-card-header .conexgo-dashboard-card-action {
    margin-left: auto;
}

.conexgo-dashboard-card-action:hover {
    background: rgba(255,255,255,.18);
    color: white;
}

.conexgo-dashboard-compact-panel .card-header {
    cursor: pointer;
}

.conexgo-dashboard-loading-overlay {
    position: relative;
}

    .conexgo-dashboard-loading-overlay::before {
        content: "";
        position: absolute;
        inset: 0;
        background: rgba(255,255,255,.62);
        z-index: 2;
        pointer-events: none;
    }

.conexgo-dashboard-minimized-card {
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    resize: none !important;
    overflow: hidden !important;
}

    .conexgo-dashboard-minimized-card::after {
        display: none !important;
    }

.conexgo-dashboard-filter-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
    align-items: end;
}

    .conexgo-dashboard-filter-grid .form-control,
    .conexgo-dashboard-filter-grid .form-select {
        width: 100%;
        min-width: 0;
    }

.conexgo-dashboard-card-body-auto {
    min-height: 0;
}

    .conexgo-dashboard-card-body-auto .conexgo-dashboard-resizable-list {
        flex: 0 1 auto;
    }

.conexgo-dashboard-soft-button {
    background: #ffffff;
    border: 1px solid #d9e2ec;
    color: #2c4c6c;
}

    .conexgo-dashboard-soft-button:hover {
        background: #f4f6f7;
        color: #2c4c6c;
    }

.conexgo-dashboard-config-button-content {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    white-space: nowrap;
}

.conexgo-dashboard-configuration-card {
    resize: none !important;
}

    .conexgo-dashboard-configuration-card::after {
        display: none !important;
    }

    .conexgo-dashboard-configuration-card > .card-body {
        padding: 18px !important;
        overflow: visible !important;
        background: #ffffff;
    }

.conexgo-dashboard-config-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) minmax(300px, .9fr);
    gap: 14px;
    align-items: stretch;
}

.conexgo-dashboard-config-section {
    min-width: 0;
    padding: 15px;
    background: #f8fafc;
    border: 1px solid #e1e7ef;
    border-radius: 10px;
}

.conexgo-dashboard-config-section-header {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin-bottom: 13px;
    min-width: 0;
}

.conexgo-dashboard-config-section-icon {
    width: 34px;
    min-width: 34px;
    height: 34px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #d8e2ec;
    border-radius: 9px;
    background: #ffffff;
    color: #2c4c6c;
    font-size: 11pt;
}

.conexgo-dashboard-config-section-copy {
    min-width: 0;
    flex: 1 1 auto;
}

.conexgo-dashboard-config-section-title {
    margin: 0;
    color: #2c4c6c;
    font-size: 10.5pt;
    font-weight: 750;
    line-height: 1.25;
}

.conexgo-dashboard-config-section-description {
    margin-top: 3px;
    color: #6c757d;
    font-size: 8.8pt;
    line-height: 1.35;
}

.conexgo-dashboard-config-add-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 10px;
    align-items: center;
}

.conexgo-dashboard-config-select {
    width: 100%;
    min-width: 0;
    height: 42px;
    background: #ffffff;
    border-color: #d7e0ea;
    color: #28304f;
    font-size: 9.6pt;
}

.conexgo-dashboard-config-primary-button,
.conexgo-dashboard-config-action {
    min-height: 35px;
    border-radius: 8px;
    font-size: 9.4pt;
    font-weight: 650;
}

.conexgo-dashboard-config-primary-button {
    min-width: 90px;
    padding: 0 12px;
    background: #2c4c6c;
    border-color: #2c4c6c;
    color: #ffffff;
}

    .conexgo-dashboard-config-primary-button:hover,
    .conexgo-dashboard-config-primary-button:focus {
        background: #243f5a;
        border-color: #243f5a;
        color: #ffffff;
    }

    .conexgo-dashboard-config-primary-button:disabled {
        opacity: .55;
        cursor: not-allowed;
    }

.conexgo-dashboard-config-actions {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 9px;
}

.conexgo-dashboard-config-action {
    width: 100%;
    padding: 0 11px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    white-space: nowrap;
}

.conexgo-dashboard-config-action-refresh {
    background: #6b8f71;
    border: 1px solid #6b8f71;
    color: #ffffff;
}

    .conexgo-dashboard-config-action-refresh:hover,
    .conexgo-dashboard-config-action-refresh:focus {
        background: #5f8065;
        border-color: #5f8065;
        color: #ffffff;
    }

.conexgo-dashboard-config-action-secondary {
    background: #ffffff;
    border: 1px solid #d7e0ea;
    color: #2c4c6c;
}

    .conexgo-dashboard-config-action-secondary:hover,
    .conexgo-dashboard-config-action-secondary:focus {
        background: #f2f6f9;
        border-color: #cbd7e3;
        color: #2c4c6c;
    }

.conexgo-dashboard-visibility-section {
    margin-top: 14px;
    padding: 15px;
    background: #ffffff;
    border: 1px solid #e1e7ef;
    border-radius: 10px;
}

.conexgo-dashboard-visibility-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 12px;
}

.conexgo-dashboard-visibility-count {
    flex: 0 0 auto;
    padding: 4px 9px;
    border: 1px solid #dbe4ed;
    border-radius: 999px;
    background: #f8fafc;
    color: #2c4c6c;
    font-size: 8.5pt;
    font-weight: 700;
    white-space: nowrap;
}

.conexgo-dashboard-visibility-panel {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 9px;
    width: 100%;
}

    .conexgo-dashboard-visibility-panel label {
        min-width: 0;
        min-height: 48px;
        margin: 0;
        padding: 10px 11px;
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 10px;
        background: #f8fafc;
        border: 1px solid #e1e7ef;
        border-radius: 8px;
        color: #36485c;
        cursor: pointer;
        transition: background-color .16s ease, border-color .16s ease, box-shadow .16s ease;
    }

        .conexgo-dashboard-visibility-panel label:hover {
            background: #ffffff;
            border-color: #cbd8e5;
            box-shadow: 0 2px 5px rgba(44, 76, 108, .06);
        }

        .conexgo-dashboard-visibility-panel label:has(input[type="checkbox"]:checked) {
            background: #f3f7fb;
            border-color: #b8cadd;
        }

.conexgo-dashboard-visibility-label {
    min-width: 0;
    overflow: hidden;
    color: inherit;
    font-size: 9.3pt;
    font-weight: 650;
    line-height: 1.25;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.conexgo-dashboard-visibility-panel input[type="checkbox"] {
    width: 17px;
    min-width: 17px;
    height: 17px;
    margin: 0;
    flex: 0 0 17px;
    accent-color: #3e6a99;
    cursor: pointer;
}

    .conexgo-dashboard-visibility-panel input[type="checkbox"]:disabled {
        cursor: default;
        opacity: .6;
    }

@media (max-width: 1399.98px) {
    .conexgo-dashboard-config-layout {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 1199.98px) {
    .conexgo-dashboard-visibility-panel {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 767.98px) {
    .conexgo-dashboard-configuration-card > .card-body {
        padding: 14px !important;
    }

    .conexgo-dashboard-config-actions {
        grid-template-columns: 1fr;
    }

    .conexgo-dashboard-visibility-panel {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 575.98px) {
    .conexgo-dashboard-config-add-row {
        grid-template-columns: 1fr;
    }

    .conexgo-dashboard-config-primary-button {
        width: 100%;
    }

    .conexgo-dashboard-visibility-heading {
        align-items: flex-start;
    }

    .conexgo-dashboard-visibility-panel {
        grid-template-columns: 1fr;
    }
}

.conexgo-dashboard-smart-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-auto-rows: 8px;
    grid-auto-flow: dense;
    gap: 16px;
    align-items: start;
}

.conexgo-dashboard-smart-item {
    min-width: 0;
}

    .conexgo-dashboard-smart-item > .card {
        width: 100%;
        margin-top: 0 !important;
        margin-bottom: 0 !important;
    }

@media (max-width: 1199.98px) {
    .conexgo-dashboard-smart-grid {
        grid-template-columns: 1fr;
    }

    .conexgo-dashboard-filter-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 575.98px) {
    .conexgo-dashboard-filter-grid {
        grid-template-columns: 1fr;
    }
}

/* Collapse discret, propre, sans animation agressive */
.conexgo-dashboard-resizable-card {
    transition: box-shadow .16s ease, border-color .16s ease;
}

    .conexgo-dashboard-resizable-card:not(.conexgo-dashboard-minimized-card):hover {
        box-shadow: 0 2px 6px rgba(0, 0, 0, .07) !important;
    }

    .conexgo-dashboard-resizable-card > .card-header {
        transition: filter .14s ease, box-shadow .14s ease, border-radius .14s ease;
    }

        .conexgo-dashboard-resizable-card > .card-header:hover {
            filter: brightness(1.025);
        }

.conexgo-dashboard-minimized-card {
    box-shadow: 0 1px 3px rgba(0, 0, 0, .05) !important;
}

    .conexgo-dashboard-minimized-card > .card-header {
        border-radius: 6px !important;
    }

.conexgo-dashboard-card-action {
    transition: background-color .14s ease, border-color .14s ease, opacity .14s ease;
}

    .conexgo-dashboard-card-action:hover {
        background: rgba(255, 255, 255, .15);
        border-color: rgba(255, 255, 255, .55);
    }

    .conexgo-dashboard-card-action i {
        transition: opacity .14s ease;
    }

    .conexgo-dashboard-card-action:hover i {
        opacity: .9;
    }

/* Important : ne pas animer la grille, sinon le recalcul donne un effet bizarre */
.conexgo-dashboard-smart-item,
.conexgo-dashboard-smart-item > .card {
    transition: none !important;
}

@media (prefers-reduced-motion: reduce) {
    .conexgo-dashboard-resizable-card,
    .conexgo-dashboard-resizable-card > .card-header,
    .conexgo-dashboard-card-action,
    .conexgo-dashboard-card-action i {
        transition: none !important;
    }
}

/* Masonry restauré : les cartes occupent automatiquement les espaces libres */
.conexgo-dashboard-smart-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-auto-rows: 8px;
    grid-auto-flow: dense;
    gap: 16px;
    align-items: start;
}

.conexgo-dashboard-smart-item {
    min-width: 0;
}

    .conexgo-dashboard-smart-item > .card {
        width: 100%;
        margin-top: 0 !important;
        margin-bottom: 0 !important;
    }

.conexgo-dashboard-resizable-card {
    transition: box-shadow .16s ease, border-color .16s ease;
    will-change: auto;
}

    .conexgo-dashboard-resizable-card > .card-body {
        animation: none;
    }

.conexgo-dashboard-card-action i {
    transition: transform .18s ease, opacity .14s ease;
}

.conexgo-dashboard-card-action:hover i {
    opacity: .9;
}

.conexgo-dashboard-configuration-card > .card-body {
    overflow-y: auto;
    overflow-x: hidden;
}

.conexgo-dashboard-empty-state {
    min-height: 150px;
    padding: 26px 18px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 8px;
    text-align: center;
    color: #6c757d;
}

    .conexgo-dashboard-empty-state.compact {
        min-height: 96px;
        padding: 18px 14px;
    }

.conexgo-dashboard-empty-icon {
    width: 42px;
    height: 42px;
    border-radius: 999px;
    background: #EEF2F7;
    border: 1px solid #D9E2EC;
    color: #2c4c6c;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 13pt;
    margin-bottom: 2px;
}

.conexgo-dashboard-empty-title {
    color: #2c4c6c;
    font-size: 10pt;
    font-weight: 750;
    line-height: 1.25;
}

.conexgo-dashboard-empty-description {
    color: #6c757d;
    font-size: 9pt;
    line-height: 1.35;
    max-width: 360px;
}

.conexgo-dashboard-summary-empty-note {
    margin-top: 8px;
    color: #8a95a3;
    font-size: 8.8pt;
}

@media (max-width: 1199.98px) {
    .conexgo-dashboard-smart-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 575.98px) {
    .conexgo-dashboard-empty-state {
        min-height: 120px;
        padding: 20px 14px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .conexgo-dashboard-resizable-card,
    .conexgo-dashboard-resizable-card > .card-body,
    .conexgo-dashboard-card-action i {
        transition: none !important;
        animation: none !important;
    }
}

/* Layout stable : deux colonnes indépendantes, sans calcul Masonry JavaScript. */
.conexgo-dashboard-smart-grid {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    grid-auto-rows: auto !important;
    grid-auto-flow: row !important;
    gap: 16px !important;
    align-items: start !important;
}

.conexgo-dashboard-smart-column {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 16px;
    align-self: start;
}

    .conexgo-dashboard-smart-column > .conexgo-dashboard-smart-item {
        width: 100%;
        min-width: 0;
        grid-row: auto !important;
        margin: 0 !important;
    }

        .conexgo-dashboard-smart-column > .conexgo-dashboard-smart-item > .card {
            width: 100%;
            margin: 0 !important;
        }

@media (max-width: 1199.98px) {
    .conexgo-dashboard-smart-grid {
        grid-template-columns: 1fr !important;
    }
}

/*
       Layout adaptatif sans espaces artificiels : toutes les cartes, y compris les
       cartes de résumé, sont positionnées dans la colonne actuellement la plus courte.
       Le JavaScript ne change jamais leur contenu ni leur hauteur : il calcule seulement
       leur position, ce qui évite les superpositions et les grandes zones vides.
    */
.conexgo-dashboard-smart-grid {
    position: relative !important;
    display: block !important;
    width: 100% !important;
    min-height: 1px;
    margin-left: 0 !important;
    margin-right: 0 !important;
    overflow: visible !important;
}

    .conexgo-dashboard-smart-grid > .conexgo-dashboard-smart-item {
        position: absolute !important;
        top: 0;
        left: 0;
        width: 100%;
        min-width: 0;
        margin: 0 !important;
        padding: 0 !important;
        visibility: hidden;
        transition: none !important;
        will-change: left, top, width;
    }

        .conexgo-dashboard-smart-grid > .conexgo-dashboard-smart-item[data-masonry-positioned="true"] {
            visibility: visible;
        }

        .conexgo-dashboard-smart-grid > .conexgo-dashboard-smart-item > .card {
            width: 100% !important;
            margin: 0 !important;
        }

/* Une colonne sur tablette/mobile, deux colonnes sur les écrans de bureau. */
@media (max-width: 1199.98px) {
    .conexgo-dashboard-smart-grid > .conexgo-dashboard-smart-item {
        width: 100%;
    }
}

@media (max-width: 1199.98px) {
    .conexgo-dashboard-mobile-shortcuts {
        display: none !important;
    }

    .conexgo-dashboard-smart-grid {
        position: static !important;
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 14px !important;
        overflow: visible !important;
    }

        .conexgo-dashboard-smart-grid > .conexgo-dashboard-smart-item {
            position: relative !important;
            inset: auto !important;
            top: auto !important;
            right: auto !important;
            bottom: auto !important;
            left: auto !important;
            width: 100% !important;
            min-width: 0 !important;
            height: auto !important;
            margin: 0 !important;
            visibility: visible !important;
            transform: none !important;
            will-change: auto !important;
        }

    .conexgo-dashboard-smart-item > .conexgo-dashboard-resizable-card,
    .conexgo-dashboard-configuration-card {
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        resize: none !important;
        overflow: hidden !important;
    }

    .conexgo-dashboard-resizable-card::after {
        display: none !important;
    }

    .conexgo-dashboard-resizable-card > .card-body,
    .conexgo-dashboard-configuration-card > .card-body,
    .conexgo-dashboard-card-body-auto,
    .conexgo-dashboard-resizable-list {
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        overflow: visible !important;
    }

    .conexgo-dashboard-config-layout {
        grid-template-columns: minmax(0, 1fr) !important;
    }

    .conexgo-dashboard-visibility-panel {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 575.98px) {
    .conexgo-dashboard-card-header {
        align-items: center !important;
        gap: 8px !important;
    }

        .conexgo-dashboard-card-header h4 {
            font-size: 13pt !important;
            line-height: 1.2 !important;
        }

    .conexgo-dashboard-resizable-card > .card-header,
    .conexgo-dashboard-configuration-card > .card-header {
        padding: 10px 12px !important;
    }

    .conexgo-dashboard-resizable-card > .card-body,
    .conexgo-dashboard-configuration-card > .card-body {
        padding: 12px !important;
    }

    .conexgo-dashboard-filter-grid,
    .conexgo-dashboard-config-add-row,
    .conexgo-dashboard-config-actions,
    .conexgo-dashboard-visibility-panel {
        grid-template-columns: minmax(0, 1fr) !important;
    }

    .conexgo-dashboard-config-action,
    .conexgo-dashboard-config-primary-button {
        width: 100% !important;
    }
}

/* Closed dashboard cards use the historical light-blue state. */
.conexgo-dashboard-resizable-card.conexgo-dashboard-minimized-card > .card-header {
    background-color: #eaf2f8 !important;
    border-color: #d5e3ee !important;
    color: #2c4c6c !important;
    filter: none !important;
}

    .conexgo-dashboard-resizable-card.conexgo-dashboard-minimized-card > .card-header:hover {
        background-color: #e2edf5 !important;
        filter: none !important;
    }

    .conexgo-dashboard-resizable-card.conexgo-dashboard-minimized-card > .card-header .conexgo-dashboard-card-header h4 {
        color: #2c4c6c !important;
    }

    .conexgo-dashboard-resizable-card.conexgo-dashboard-minimized-card > .card-header .conexgo-dashboard-card-action {
        background: rgba(44, 76, 108, .06);
        border-color: rgba(44, 76, 108, .28);
        color: #2c4c6c;
    }

        .conexgo-dashboard-resizable-card.conexgo-dashboard-minimized-card > .card-header .conexgo-dashboard-card-action:hover {
            background: rgba(44, 76, 108, .12);
            border-color: rgba(44, 76, 108, .42);
            color: #24435f;
        }

/* Stable dashboard chevron: the glyph stays mounted and only rotates. */
.conexgo-dashboard-card-action .conexgo-dashboard-chevron {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transform: rotate(0deg);
    transform-origin: center;
    transition: transform .28s cubic-bezier(.22, 1, .36, 1), opacity .16s ease;
    will-change: transform;
}

    .conexgo-dashboard-card-action .conexgo-dashboard-chevron.is-expanded {
        transform: rotate(180deg);
    }

@media (prefers-reduced-motion: reduce) {
    .conexgo-dashboard-card-action .conexgo-dashboard-chevron {
        transition: none !important;
    }
}

.cx-dashboard-page .conexgo-dashboard-config-section,
.cx-dashboard-page .conexgo-dashboard-visibility-section {
    transition: background-color .2s ease, border-color .2s ease, box-shadow .2s ease;
}

    .cx-dashboard-page .conexgo-dashboard-config-section:hover,
    .cx-dashboard-page .conexgo-dashboard-visibility-section:hover {
        border-color: #c8d6e4;
        background: #fbfdff;
        box-shadow: 0 6px 18px rgba(44, 76, 108, .07);
    }

.conexgo-dashboard-config-section-header,
.conexgo-dashboard-visibility-heading {
    position: relative;
}

.conexgo-dashboard-config-section-toggle {
    width: 38px;
    min-width: 38px;
    height: 38px;
    margin-left: auto;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid transparent;
    border-radius: 9px;
    background: transparent;
    color: #2c4c6c;
    transition: background-color .18s ease, border-color .18s ease, transform .18s ease;
}

    .conexgo-dashboard-config-section-toggle:hover,
    .conexgo-dashboard-config-section-toggle:focus-visible {
        border-color: #d3dfe9;
        background: #edf4f9;
    }

    .conexgo-dashboard-config-section-toggle i {
        transition: transform .22s cubic-bezier(.2,.75,.25,1);
    }

    .conexgo-dashboard-config-section-toggle.is-open i {
        transform: rotate(180deg);
    }

.conexgo-dashboard-config-collapse {
    display: grid;
    grid-template-rows: 0fr;
    opacity: 0;
    transform: translateY(-3px);
    transition: grid-template-rows .24s cubic-bezier(.2,.75,.25,1), opacity .18s ease, transform .22s ease;
}

    .conexgo-dashboard-config-collapse.is-open {
        grid-template-rows: 1fr;
        opacity: 1;
        transform: translateY(0);
    }

    .conexgo-dashboard-config-collapse > .conexgo-dashboard-config-collapse-inner {
        min-height: 0;
        overflow: hidden;
    }

.conexgo-dashboard-config-section.is-collapsed .conexgo-dashboard-config-section-header,
.conexgo-dashboard-visibility-section.is-collapsed .conexgo-dashboard-visibility-heading {
    margin-bottom: 0;
}

/* Natural masonry without absolute positioning, ResizeObserver or saved blank heights. */
#conexgoDashboardSmartGrid.conexgo-dashboard-smart-grid {
    position: static !important;
    display: block !important;
    column-count: 1;
    column-gap: 16px;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    overflow: visible !important;
}

#conexgoDashboardSmartGrid > .conexgo-dashboard-smart-item {
    position: static !important;
    inset: auto !important;
    width: 100% !important;
    margin: 0 0 16px !important;
    padding: 0 !important;
    display: inline-block !important;
    break-inside: avoid;
    visibility: visible !important;
    transform: none !important;
    transition: transform .2s ease, filter .2s ease !important;
    vertical-align: top;
}

    #conexgoDashboardSmartGrid > .conexgo-dashboard-smart-item > .card {
        overflow: hidden;
        transition: border-color .22s ease, box-shadow .22s ease, background-color .22s ease !important;
    }

        #conexgoDashboardSmartGrid > .conexgo-dashboard-smart-item > .card:hover {
            border-color: #c7d5e3 !important;
            box-shadow: 0 5px 15px rgba(44, 76, 108, .07) !important;
            transform: none !important;
        }

        #conexgoDashboardSmartGrid > .conexgo-dashboard-smart-item > .card:not(.conexgo-dashboard-minimized-card) > .card-body {
            animation: conexgoDashboardBodyEnter .22s cubic-bezier(.2,.75,.25,1);
            transform-origin: top center;
        }

@keyframes conexgoDashboardBodyEnter {
    from {
        opacity: 0;
        transform: translateY(-5px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

#conexgoDashboardSmartGrid .card-body,
#conexgoDashboardSmartGrid .conexgo-dashboard-card-body-auto,
#conexgoDashboardSmartGrid .conexgo-dashboard-resizable-list {
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
}

#conexgoDashboardSmartGrid .conexgo-dashboard-resizable-card::after {
    display: none !important;
}

.conexgo-dashboard-card-content-shell {
    display: grid;
    grid-template-rows: 0fr;
    opacity: 0;
    transition: grid-template-rows .24s cubic-bezier(.2,.75,.25,1), opacity .18s ease;
}

    .conexgo-dashboard-card-content-shell.is-open {
        grid-template-rows: 1fr;
        opacity: 1;
    }

    .conexgo-dashboard-card-content-shell > .conexgo-dashboard-card-content-inner {
        min-height: 0;
        overflow: hidden;
    }

.conexgo-device-overview-card .card-body {
    padding: 16px 18px 18px !important;
}

.conexgo-device-overview-toolbar {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 14px;
    margin-bottom: 16px;
}

.conexgo-device-overview-period {
    width: min(260px, 100%);
}

.conexgo-device-overview-metrics {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.conexgo-device-overview-metric {
    min-width: 0;
    padding: 14px;
    border: 1px solid #dce5ee;
    border-radius: 11px;
    background: #f8fbfd;
    transition: background-color .18s ease, border-color .18s ease, transform .18s ease;
}

    .conexgo-device-overview-metric:hover {
        border-color: #b8ccdc;
        background: #ffffff;
        transform: translateY(-1px);
    }

.conexgo-device-overview-metric-label {
    color: #667585;
    font-size: 8.5pt;
    font-weight: 750;
    letter-spacing: .02em;
    text-transform: uppercase;
}

.conexgo-device-overview-metric-value {
    margin-top: 4px;
    color: #315879;
    font-size: 25pt;
    font-weight: 780;
    line-height: 1;
}

.conexgo-device-overview-metric-note {
    margin-top: 6px;
    color: #6f7d8b;
    font-size: 8.8pt;
}

.conexgo-device-overview-progress {
    height: 7px;
    margin-top: 10px;
    overflow: hidden;
    border-radius: 999px;
    background: #e9eef4;
}

    .conexgo-device-overview-progress > span {
        display: block;
        height: 100%;
        border-radius: inherit;
        background: #3e6a99;
        transition: width .28s ease;
    }

.conexgo-device-overview-models {
    margin-top: 12px;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 9px;
}

.conexgo-device-overview-model {
    min-width: 0;
    padding: 10px 11px;
    border: 1px solid #e1e7ef;
    border-radius: 9px;
    background: #ffffff;
    transition: border-color .18s ease, background-color .18s ease;
}

    .conexgo-device-overview-model:hover {
        border-color: #c2d3e1;
        background: #f8fbfd;
    }

    .conexgo-device-overview-model strong,
    .conexgo-device-overview-model span {
        display: block;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .conexgo-device-overview-model strong {
        color: #2c4c6c;
        font-size: 9pt;
    }

    .conexgo-device-overview-model span {
        margin-top: 3px;
        color: #6f7d8b;
        font-size: 8.4pt;
    }

.conexgo-dashboard-card-filter-row {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 12px;
    padding-bottom: 12px;
    border-bottom: 1px solid #e7edf3;
}

    .conexgo-dashboard-card-filter-row > div:first-child {
        min-width: 0;
    }

    .conexgo-dashboard-card-filter-row .cx-select {
        width: min(230px, 100%);
    }

.conexgo-dashboard-active-users-list {
    display: grid;
    gap: 9px;
}

.conexgo-dashboard-active-user {
    display: grid;
    grid-template-columns: 46px minmax(0, 1fr);
    gap: 12px;
    align-items: center;
    padding: 9px 10px;
    border: 1px solid transparent;
    border-radius: 11px;
    transition: background-color .18s ease, border-color .18s ease, transform .18s ease;
}

    .conexgo-dashboard-active-user:hover {
        border-color: #dce5ee;
        background: #f8fbfd;
        transform: translateY(-1px);
    }

.conexgo-dashboard-active-user-avatar {
    width: 44px;
    height: 44px;
    padding: 3px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    background: #eef3f7;
    border: 1px solid #dce5ee;
    overflow: hidden;
}

    .conexgo-dashboard-active-user-avatar img {
        width: 100%;
        height: 100%;
        border-radius: 999px;
        object-fit: cover;
    }

.conexgo-device-status-table tbody tr {
    transition: background-color .18s ease, transform .18s ease, box-shadow .18s ease;
}

    .conexgo-device-status-table tbody tr:hover {
        background: #f3f8fc !important;
        box-shadow: none !important;
    }

.conexgo-device-status-table td,
.conexgo-device-status-table th {
    vertical-align: middle;
}

@media (max-width: 1199.98px) {
    #conexgoDashboardSmartGrid.conexgo-dashboard-smart-grid {
        column-count: 1;
    }
}

@media (max-width: 767.98px) {
    .conexgo-device-overview-toolbar {
        align-items: stretch;
        flex-direction: column;
    }

    .conexgo-device-overview-period {
        width: 100%;
    }

    .conexgo-device-overview-models {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 575.98px) {
    .conexgo-dashboard-config-section,
    .conexgo-dashboard-visibility-section {
        padding: 12px !important;
    }

    .conexgo-dashboard-config-section-header,
    .conexgo-dashboard-visibility-heading {
        gap: 8px;
    }

    .conexgo-device-overview-metrics {
        grid-template-columns: 1fr;
    }

    .conexgo-dashboard-active-user {
        grid-template-columns: 40px minmax(0, 1fr);
        padding: 8px;
    }

    .conexgo-dashboard-active-user-avatar {
        width: 38px;
        height: 38px;
    }
}

.cx-dashboard-page .conexgo-dashboard-config-section:hover,
.cx-dashboard-page .conexgo-dashboard-visibility-section:hover {
    background: #fafcff;
    border-color: #d2dee9;
    box-shadow: 0 2px 8px rgba(44, 76, 108, .045);
}

#conexgoDashboardSmartGrid > .conexgo-dashboard-smart-item {
    transition: none !important;
}

    #conexgoDashboardSmartGrid > .conexgo-dashboard-smart-item > .card:hover {
        transform: none !important;
        border-color: #cfdae5 !important;
        box-shadow: 0 3px 10px rgba(44, 76, 108, .055) !important;
    }

.conexgo-dashboard-resizable-card > .card-header:hover {
    filter: brightness(1.01);
}

.conexgo-device-overview-metric:hover,
.conexgo-dashboard-active-user:hover {
    transform: none !important;
    box-shadow: none !important;
}

.conexgo-device-overview-model:hover {
    background: #fafcff;
}

#conexgoDashboardSmartGrid > .conexgo-dashboard-smart-item > .card > .card-body,
.conexgo-dashboard-configuration-card > .card-body {
    max-height: 2400px;
    opacity: 1;
    transform: translateY(0);
    transition: max-height .2s cubic-bezier(.4,0,.2,1), opacity .15s ease, transform .18s ease, padding .2s ease, margin .2s ease;
    transform-origin: top center;
}

#conexgoDashboardSmartGrid > .conexgo-dashboard-smart-item > .card.conexgo-dashboard-card-closing > .card-body,
.conexgo-dashboard-configuration-card.conexgo-dashboard-card-closing > .card-body {
    max-height: 0 !important;
    min-height: 0 !important;
    opacity: 0;
    transform: translateY(-4px);
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    overflow: hidden !important;
}

@media (prefers-reduced-motion: reduce) {
    .conexgo-dashboard-config-section,
    .conexgo-dashboard-visibility-section,
    .conexgo-dashboard-config-section-toggle,
    .conexgo-dashboard-config-section-toggle i,
    .conexgo-dashboard-config-collapse,
    #conexgoDashboardSmartGrid > .conexgo-dashboard-smart-item,
    #conexgoDashboardSmartGrid > .conexgo-dashboard-smart-item > .card,
    .conexgo-device-overview-metric,
    .conexgo-dashboard-active-user,
    .conexgo-device-status-table tbody tr {
        transition: none !important;
    }
}

.cx-dashboard-page .conexgo-dashboard-resizable-card,
.cx-dashboard-page .conexgo-dashboard-configuration-card {
    transition: min-height .22s cubic-bezier(.2, .72, .26, 1), height .22s cubic-bezier(.2, .72, .26, 1), border-color .18s ease, background-color .18s ease, box-shadow .18s ease !important;
    will-change: height;
}

    .cx-dashboard-page .conexgo-dashboard-resizable-card > .card-header,
    .cx-dashboard-page .conexgo-dashboard-configuration-card > .card-header {
        transition: background-color .2s ease, color .2s ease, border-color .2s ease, box-shadow .2s ease !important;
    }

    .cx-dashboard-page .conexgo-dashboard-resizable-card > .card-body,
    .cx-dashboard-page .conexgo-dashboard-configuration-card > .card-body {
        transform-origin: top center;
        animation: conexgo-dashboard-body-enter .2s cubic-bezier(.2, .72, .26, 1) both;
    }

.cx-dashboard-page .conexgo-dashboard-card-action {
    transition: background-color .16s ease, border-color .16s ease, color .16s ease, transform .16s ease !important;
}

.cx-dashboard-page .conexgo-dashboard-minimized-card {
    box-shadow: 0 4px 12px rgba(44, 76, 108, .06) !important;
}

@keyframes conexgo-dashboard-body-enter {
    from {
        opacity: 0;
        transform: translateY(-6px) scaleY(.985);
    }

    to {
        opacity: 1;
        transform: translateY(0) scaleY(1);
    }
}

@media (max-width: 575.98px) {
    .cx-dashboard-page {
        width: calc(100% + 16px) !important;
        max-width: none !important;
        margin-inline: -8px !important;
        padding-inline: 0 !important;
    }

        .cx-dashboard-page > .row,
        .cx-dashboard-page .mobile-margin,
        .cx-dashboard-page .conexgo-dashboard-smart-grid {
            width: 100% !important;
            max-width: none !important;
            margin-inline: 0 !important;
            padding-inline: 0 !important;
        }

        .cx-dashboard-page [class*="col-"] {
            min-width: 0;
        }

        .cx-dashboard-page .conexgo-dashboard-smart-grid {
            display: flex !important;
            flex-direction: column !important;
            gap: 10px !important;
        }

        .cx-dashboard-page .conexgo-dashboard-smart-item,
        .cx-dashboard-page .conexgo-dashboard-smart-item > .card,
        .cx-dashboard-page .conexgo-dashboard-configuration-card {
            position: relative !important;
            inset: auto !important;
            width: 100% !important;
            max-width: none !important;
            min-width: 0 !important;
            margin: 0 !important;
            transform: none !important;
        }

        .cx-dashboard-page .conexgo-dashboard-resizable-card,
        .cx-dashboard-page .conexgo-dashboard-configuration-card {
            border-radius: 10px !important;
            overflow: hidden !important;
        }

            .cx-dashboard-page .conexgo-dashboard-resizable-card > .card-header,
            .cx-dashboard-page .conexgo-dashboard-configuration-card > .card-header {
                min-height: 48px !important;
                padding: 10px 12px !important;
            }

            .cx-dashboard-page .conexgo-dashboard-resizable-card > .card-body,
            .cx-dashboard-page .conexgo-dashboard-configuration-card > .card-body {
                padding-inline: 12px !important;
            }

        .cx-dashboard-page .conexgo-dashboard-card-header h4,
        .cx-dashboard-page .conexgo-dashboard-compact-panel h4 {
            min-width: 0 !important;
            font-size: 11px !important;
            line-height: 1.25 !important;
            overflow-wrap: anywhere;
        }
}

@media (prefers-reduced-motion: reduce) {
    .cx-dashboard-page .conexgo-dashboard-resizable-card,
    .cx-dashboard-page .conexgo-dashboard-configuration-card,
    .cx-dashboard-page .conexgo-dashboard-resizable-card > .card-header,
    .cx-dashboard-page .conexgo-dashboard-configuration-card > .card-header,
    .cx-dashboard-page .conexgo-dashboard-card-action,
    .cx-dashboard-page .conexgo-dashboard-resizable-card > .card-body,
    .cx-dashboard-page .conexgo-dashboard-configuration-card > .card-body {
        transition: none !important;
        animation: none !important;
    }
}

/* Targeted dashboard stabilization: sidebar-like easing, no masonry delay, restrained hover. */
.cx-dashboard-page .conexgo-dashboard-card-action .conexgo-dashboard-chevron,
.cx-dashboard-page .conexgo-dashboard-config-section-toggle i {
    transition: transform .34s cubic-bezier(.22, 1, .36, 1), color .22s ease !important;
}

.cx-dashboard-page .conexgo-dashboard-card-content-shell,
.cx-dashboard-page .conexgo-dashboard-config-collapse {
    transition: grid-template-rows .34s cubic-bezier(.22, 1, .36, 1), opacity .22s ease, transform .34s cubic-bezier(.22, 1, .36, 1) !important;
}

.cx-dashboard-page .conexgo-dashboard-card-content-shell {
    transform: translateY(-3px);
}

    .cx-dashboard-page .conexgo-dashboard-card-content-shell.is-open {
        transform: translateY(0);
    }

.cx-dashboard-page .conexgo-dashboard-resizable-card > .card-header,
.cx-dashboard-page .conexgo-dashboard-configuration-card > .card-header {
    transition: background-color .34s cubic-bezier(.22, 1, .36, 1), border-color .24s ease, color .24s ease !important;
}

.cx-dashboard-page #conexgoDashboardSmartGrid > .conexgo-dashboard-smart-item {
    animation: cxDashboardCardReveal .22s ease both;
    transition: none !important;
}

    .cx-dashboard-page #conexgoDashboardSmartGrid > .conexgo-dashboard-smart-item > .card:hover {
        transform: none !important;
    }

@keyframes cxDashboardCardReveal {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@media (min-width: 1200px) {
    .cx-dashboard-page #conexgoDashboardSmartGrid > .conexgo-dashboard-smart-item > .conexgo-dashboard-resizable-card:not(.conexgo-dashboard-minimized-card) {
        resize: vertical !important;
        overflow: auto !important;
    }

        .cx-dashboard-page #conexgoDashboardSmartGrid > .conexgo-dashboard-smart-item > .conexgo-dashboard-resizable-card:not(.conexgo-dashboard-minimized-card)::after {
            display: block !important;
            opacity: .48;
        }
}

@media (max-width: 1199.98px) {
    .cx-dashboard-page #conexgoDashboardSmartGrid > .conexgo-dashboard-smart-item > .conexgo-dashboard-resizable-card {
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        resize: none !important;
        overflow: hidden !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    .cx-dashboard-page #conexgoDashboardSmartGrid > .conexgo-dashboard-smart-item,
    .cx-dashboard-page .conexgo-dashboard-card-content-shell,
    .cx-dashboard-page .conexgo-dashboard-config-collapse,
    .cx-dashboard-page .conexgo-dashboard-card-action .conexgo-dashboard-chevron,
    .cx-dashboard-page .conexgo-dashboard-config-section-toggle i {
        animation: none !important;
        transition: none !important;
    }
}

.cx-dashboard-page .conexgo-dashboard-resizable-card,
.cx-dashboard-page .conexgo-dashboard-configuration-card {
    transition: height .22s cubic-bezier(.22, 1, .36, 1), min-height .22s cubic-bezier(.22, 1, .36, 1), max-height .22s cubic-bezier(.22, 1, .36, 1), border-color .18s ease, box-shadow .18s ease !important;
}

    .cx-dashboard-page .conexgo-dashboard-resizable-card.conexgo-dashboard-card-closing,
    .cx-dashboard-page .conexgo-dashboard-configuration-card.conexgo-dashboard-card-closing {
        height: 62px !important;
        min-height: 62px !important;
        max-height: 62px !important;
        overflow: hidden !important;
    }

        .cx-dashboard-page .conexgo-dashboard-resizable-card.conexgo-dashboard-card-closing > .card-body,
        .cx-dashboard-page .conexgo-dashboard-configuration-card.conexgo-dashboard-card-closing > .card-body {
            max-height: 0 !important;
            min-height: 0 !important;
            opacity: 0 !important;
            transform: translateY(-4px) !important;
            padding-top: 0 !important;
            padding-bottom: 0 !important;
            margin-top: 0 !important;
            margin-bottom: 0 !important;
            overflow: hidden !important;
            transition: max-height .22s cubic-bezier(.22, 1, .36, 1), opacity .15s ease, transform .2s cubic-bezier(.22, 1, .36, 1), padding .22s ease, margin .22s ease !important;
        }

.cx-dashboard-page [data-dashboard-key="topAlertDevices"] > .card,
.cx-dashboard-page [data-dashboard-key="offlineDevices"] > .card {
    transition: height .22s cubic-bezier(.22, 1, .36, 1), min-height .22s cubic-bezier(.22, 1, .36, 1), max-height .22s cubic-bezier(.22, 1, .36, 1), border-color .18s ease, box-shadow .18s ease !important;
}

    .cx-dashboard-page [data-dashboard-key="topAlertDevices"] > .card:hover,
    .cx-dashboard-page [data-dashboard-key="offlineDevices"] > .card:hover {
        border-color: #b8cad9 !important;
        box-shadow: 0 7px 18px rgba(44, 76, 108, .10) !important;
    }

.cx-dashboard-page #conexgoDashboardSmartGrid .conexgo-dashboard-ranked-item,
.cx-dashboard-page #conexgoDashboardSmartGrid .cx-dashboard-offline-item {
    border-inline-start: 0 !important;
    border-left: 0 !important;
    border-radius: 8px;
    box-shadow: none !important;
    outline: 0 !important;
    transition: background-color .16s ease !important;
}

    .cx-dashboard-page #conexgoDashboardSmartGrid .conexgo-dashboard-ranked-item:hover,
    .cx-dashboard-page #conexgoDashboardSmartGrid .conexgo-dashboard-ranked-item:focus-within,
    .cx-dashboard-page #conexgoDashboardSmartGrid .cx-dashboard-offline-item:hover,
    .cx-dashboard-page #conexgoDashboardSmartGrid .cx-dashboard-offline-item:focus-within {
        border-inline-start: 0 !important;
        border-left: 0 !important;
        background: #f3f7fb !important;
        box-shadow: none !important;
        outline: 0 !important;
        transform: none !important;
    }

@media (prefers-reduced-motion: reduce) {
    .cx-dashboard-page .conexgo-dashboard-resizable-card,
    .cx-dashboard-page .conexgo-dashboard-configuration-card,
    .cx-dashboard-page .conexgo-dashboard-ranked-item,
    .cx-dashboard-page .cx-dashboard-offline-item {
        transition: none !important;
    }
}

.conexgo-dashboard-configuration-row {
    width: 100% !important;
    margin: 10px 0 0 !important;
    padding: 0 !important;
}

    .conexgo-dashboard-configuration-row > .col-12 {
        min-width: 0;
        padding-inline: 0 !important;
    }

#conexgoDashboardSmartGrid.conexgo-dashboard-content-grid {
    position: static !important;
    inset: auto !important;
    display: block !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 12px 0 0 !important;
    padding: 0 !important;
    overflow: visible !important;
    column-count: 2;
    column-gap: 16px;
    column-fill: balance;
}

    #conexgoDashboardSmartGrid.conexgo-dashboard-content-grid > .conexgo-dashboard-smart-item {
        position: static !important;
        inset: auto !important;
        display: inline-block !important;
        width: 100% !important;
        min-width: 0 !important;
        height: auto !important;
        margin: 0 0 16px !important;
        padding: 0 !important;
        visibility: visible !important;
        transform: none !important;
        vertical-align: top;
        break-inside: avoid;
        page-break-inside: avoid;
        animation: none !important;
        transition: none !important;
    }

        #conexgoDashboardSmartGrid.conexgo-dashboard-content-grid > .conexgo-dashboard-smart-item > .card {
            position: relative;
            width: 100% !important;
            margin: 0 !important;
            transform: none !important;
            isolation: isolate;
        }

#conexgoDashboardSmartGrid .card-header,
#conexgoDashboardSmartGrid .card-body,
#conexgoDashboardSmartGrid a,
#conexgoDashboardSmartGrid button,
#conexgoDashboardSmartGrid input,
#conexgoDashboardSmartGrid select {
    position: relative;
    pointer-events: auto;
}

#conexgoDashboardSmartGrid .card-header {
    z-index: 3;
    cursor: pointer;
    user-select: none;
}

#conexgoDashboardSmartGrid .card-body {
    z-index: 1;
}

.conexgo-dashboard-config-collapse:not(.is-open) {
    visibility: hidden;
    pointer-events: none;
}

.conexgo-dashboard-config-collapse.is-open {
    visibility: visible;
    pointer-events: auto;
}

.conexgo-dashboard-config-collapse,
.conexgo-dashboard-card-content-shell {
    will-change: grid-template-rows, opacity, transform;
}

#conexgoDashboardSmartGrid .conexgo-dashboard-resizable-card > .card-body,
.conexgo-dashboard-configuration-card > .card-body {
    transform-origin: top center;
}

@media (max-width: 1199.98px) {
    #conexgoDashboardSmartGrid.conexgo-dashboard-content-grid {
        column-count: 1;
        column-gap: 0;
    }

        #conexgoDashboardSmartGrid.conexgo-dashboard-content-grid > .conexgo-dashboard-smart-item {
            display: block !important;
            margin-bottom: 12px !important;
        }
}

@media (max-width: 575.98px) {
    .conexgo-dashboard-configuration-row,
    #conexgoDashboardSmartGrid.conexgo-dashboard-content-grid,
    .cx-dashboard-page {
        width: 100% !important;
        max-width: 100% !important;
        margin-inline: 0 !important;
        padding-inline: 0 !important;
    }

    .conexgo-dashboard-configuration-row {
        margin-top: 6px !important;
    }

    #conexgoDashboardSmartGrid.conexgo-dashboard-content-grid {
        margin-top: 10px !important;
        padding-bottom: calc(74px + env(safe-area-inset-bottom)) !important;
    }

    .conexgo-dashboard-configuration-row > .col-12 {
        padding-inline: 0 !important;
    }

    #conexgoDashboardSmartGrid .conexgo-dashboard-resizable-card,
    #conexgoDashboardSmartGrid .conexgo-dashboard-configuration-card {
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        resize: none !important;
        overflow: hidden !important;
    }

    #conexgoDashboardSmartGrid .conexgo-dashboard-card-header h4,
    .conexgo-dashboard-configuration-row .conexgo-dashboard-card-header h4 {
        font-size: 11.5px !important;
        line-height: 1.25 !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    .conexgo-dashboard-config-collapse,
    .conexgo-dashboard-card-content-shell,
    #conexgoDashboardSmartGrid .conexgo-dashboard-resizable-card,
    #conexgoDashboardSmartGrid .conexgo-dashboard-resizable-card > .card-body {
        transition: none !important;
        animation: none !important;
    }
}

#conexgoDashboardSmartGrid.conexgo-dashboard-content-grid > .conexgo-dashboard-smart-item > .conexgo-dashboard-resizable-card,
.conexgo-dashboard-configuration-row .conexgo-dashboard-configuration-card {
    transition: height .32s cubic-bezier(.22, 1, .36, 1), min-height .32s cubic-bezier(.22, 1, .36, 1), max-height .32s cubic-bezier(.22, 1, .36, 1), border-color .18s ease, box-shadow .18s ease !important;
    transform-origin: top center;
}

    #conexgoDashboardSmartGrid.conexgo-dashboard-content-grid > .conexgo-dashboard-smart-item > .conexgo-dashboard-resizable-card.conexgo-dashboard-minimized-card,
    #conexgoDashboardSmartGrid.conexgo-dashboard-content-grid > .conexgo-dashboard-smart-item > .conexgo-dashboard-resizable-card.conexgo-dashboard-card-closing,
    .conexgo-dashboard-configuration-row .conexgo-dashboard-configuration-card.conexgo-dashboard-minimized-card,
    .conexgo-dashboard-configuration-row .conexgo-dashboard-configuration-card.conexgo-dashboard-card-closing {
        height: 62px !important;
        min-height: 62px !important;
        max-height: 62px !important;
        overflow: hidden !important;
    }

        #conexgoDashboardSmartGrid.conexgo-dashboard-content-grid > .conexgo-dashboard-smart-item > .conexgo-dashboard-resizable-card.conexgo-dashboard-card-closing > .card-body,
        .conexgo-dashboard-configuration-row .conexgo-dashboard-configuration-card.conexgo-dashboard-card-closing > .card-body {
            max-height: 0 !important;
            min-height: 0 !important;
            opacity: 0 !important;
            transform: translateY(-6px) scaleY(.985) !important;
            padding-top: 0 !important;
            padding-bottom: 0 !important;
            margin-top: 0 !important;
            margin-bottom: 0 !important;
            overflow: hidden !important;
            transition: max-height .32s cubic-bezier(.22, 1, .36, 1), opacity .2s ease, transform .3s cubic-bezier(.22, 1, .36, 1), padding .32s cubic-bezier(.22, 1, .36, 1), margin .32s cubic-bezier(.22, 1, .36, 1) !important;
        }

    #conexgoDashboardSmartGrid.conexgo-dashboard-content-grid > .conexgo-dashboard-smart-item > .conexgo-dashboard-resizable-card:not(.conexgo-dashboard-minimized-card):not(.conexgo-dashboard-card-closing) > .card-body,
    .conexgo-dashboard-configuration-row .conexgo-dashboard-configuration-card:not(.conexgo-dashboard-minimized-card):not(.conexgo-dashboard-card-closing) > .card-body {
        animation: cxDashboardCardBodyOpen .3s cubic-bezier(.22, 1, .36, 1) both !important;
        transform-origin: top center;
    }

#conexgoDashboardSmartGrid .conexgo-dashboard-card-action .conexgo-dashboard-chevron,
.conexgo-dashboard-configuration-row .conexgo-dashboard-card-action .conexgo-dashboard-chevron {
    transition: transform .32s cubic-bezier(.22, 1, .36, 1), opacity .18s ease !important;
}

@keyframes cxDashboardCardBodyOpen {
    from {
        opacity: 0;
        transform: translateY(-6px) scaleY(.985);
        clip-path: inset(0 0 12% 0);
    }

    to {
        opacity: 1;
        transform: translateY(0) scaleY(1);
        clip-path: inset(0);
    }
}

@supports (interpolate-size: allow-keywords) {
    #conexgoDashboardSmartGrid .conexgo-dashboard-resizable-card,
    .conexgo-dashboard-configuration-row .conexgo-dashboard-configuration-card {
        interpolate-size: allow-keywords;
    }
}

@media (prefers-reduced-motion: reduce) {
    #conexgoDashboardSmartGrid .conexgo-dashboard-resizable-card,
    #conexgoDashboardSmartGrid .conexgo-dashboard-resizable-card > .card-body,
    #conexgoDashboardSmartGrid .conexgo-dashboard-card-action .conexgo-dashboard-chevron,
    .conexgo-dashboard-configuration-row .conexgo-dashboard-configuration-card,
    .conexgo-dashboard-configuration-row .conexgo-dashboard-configuration-card > .card-body,
    .conexgo-dashboard-configuration-row .conexgo-dashboard-card-action .conexgo-dashboard-chevron {
        transition: none !important;
        animation: none !important;
    }
}

.cx-dashboard-page [data-dashboard-key="latestAlerts"] > .card,
.cx-dashboard-page [data-dashboard-key="topAlertDevices"] > .card {
    container-type: inline-size;
}

.cx-dashboard-page [data-dashboard-key="topAlertDevices"] .conexgo-dashboard-top-alert-filters {
    grid-template-columns: repeat(2, minmax(180px, 1fr)) !important;
    gap: 12px !important;
}

    .cx-dashboard-page [data-dashboard-key="topAlertDevices"] .conexgo-dashboard-top-alert-filters > div,
    .cx-dashboard-page [data-dashboard-key="topAlertDevices"] .cx-control--dashboard-filter {
        width: 100% !important;
        min-width: 0 !important;
    }

.cx-dashboard-page [data-dashboard-key="latestAlerts"] .conexgo-dashboard-latest-summary {
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(112px, .55fr) minmax(200px, 1.45fr);
    gap: 16px;
    align-items: center;
    border-bottom: 1px solid #edf0f2;
    background: #ffffff;
    flex: 0 0 auto;
}

.cx-dashboard-page [data-dashboard-key="latestAlerts"] .conexgo-dashboard-latest-total,
.cx-dashboard-page [data-dashboard-key="latestAlerts"] .conexgo-dashboard-latest-breakdown {
    min-width: 0;
}

.cx-dashboard-page [data-dashboard-key="latestAlerts"] .conexgo-dashboard-latest-breakdown {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 16px;
    row-gap: 4px;
    text-align: left;
}

.cx-dashboard-page [data-dashboard-key="latestAlerts"] .conexgo-dashboard-latest-breakdown-item {
    min-width: 0;
    overflow: hidden;
    color: #6c757d;
    font-size: 9pt;
    line-height: 1.3;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.cx-dashboard-page [data-dashboard-key="latestAlerts"] .conexgo-dashboard-latest-item {
    min-width: 0;
    display: grid;
    grid-template-columns: 12px minmax(0, 1fr);
    gap: 14px;
    align-items: start;
    border-bottom: 1px solid #edf0f2;
}

.cx-dashboard-page [data-dashboard-key="latestAlerts"] .conexgo-dashboard-latest-dot {
    width: 12px;
    height: 12px;
    margin-top: 5px;
    border-radius: 50%;
}

.cx-dashboard-page [data-dashboard-key="latestAlerts"] .conexgo-dashboard-latest-item-content {
    min-width: 0;
}

.cx-dashboard-page [data-dashboard-key="latestAlerts"] .conexgo-dashboard-latest-mainline {
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 12px;
    align-items: start;
}

.cx-dashboard-page [data-dashboard-key="latestAlerts"] .conexgo-dashboard-latest-title {
    min-width: 0;
    overflow: hidden;
    color: #2c4c6c;
    font-size: 10pt;
    line-height: 1.3;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.cx-dashboard-page [data-dashboard-key="latestAlerts"] .conexgo-dashboard-latest-time {
    color: #6c757d;
    font-size: 8.5pt;
    line-height: 1.3;
    text-align: right;
    white-space: nowrap;
}

.cx-dashboard-page [data-dashboard-key="latestAlerts"] .conexgo-dashboard-latest-device {
    min-width: 0;
    overflow: hidden;
    color: #6c757d;
    font-size: 9pt;
    line-height: 1.35;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.cx-dashboard-page [data-dashboard-key="topAlertDevices"] .conexgo-dashboard-ranked-item {
    min-width: 0;
    display: grid !important;
    grid-template-columns: minmax(160px, 1fr) minmax(180px, 230px);
    gap: 16px;
    align-items: center;
    border-bottom: 1px solid #edf0f2;
}

.cx-dashboard-page [data-dashboard-key="topAlertDevices"] .conexgo-dashboard-ranked-copy,
.cx-dashboard-page [data-dashboard-key="topAlertDevices"] .conexgo-dashboard-ranked-meter {
    min-width: 0;
}

.cx-dashboard-page [data-dashboard-key="topAlertDevices"] .conexgo-dashboard-ranked-title,
.cx-dashboard-page [data-dashboard-key="topAlertDevices"] .conexgo-dashboard-ranked-subtitle {
    min-width: 0;
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.cx-dashboard-page [data-dashboard-key="topAlertDevices"] .conexgo-dashboard-ranked-title {
    color: #2c4c6c;
    font-weight: 700;
    text-decoration: none;
}

.cx-dashboard-page [data-dashboard-key="topAlertDevices"] .conexgo-dashboard-ranked-subtitle {
    color: #6c757d;
    font-size: 9pt;
}

.cx-dashboard-page [data-dashboard-key="topAlertDevices"] .conexgo-dashboard-ranked-meter {
    width: 100% !important;
    max-width: 230px !important;
    justify-self: end;
}

@container (max-width: 560px) {
    .conexgo-dashboard-latest-summary {
        grid-template-columns: minmax(0, 1fr) !important;
        align-items: start !important;
    }

    .conexgo-dashboard-latest-breakdown {
        grid-template-columns: minmax(0, 1fr) !important;
    }

    .conexgo-dashboard-latest-mainline {
        grid-template-columns: minmax(0, 1fr) !important;
        gap: 3px !important;
    }

    .conexgo-dashboard-latest-time {
        text-align: left !important;
        white-space: normal !important;
    }

    .conexgo-dashboard-ranked-item {
        grid-template-columns: minmax(0, 1fr) !important;
        gap: 10px !important;
    }

    .conexgo-dashboard-ranked-meter {
        max-width: none !important;
        justify-self: stretch !important;
    }
}

@container (max-width: 460px) {
    .conexgo-dashboard-top-alert-filters {
        grid-template-columns: minmax(0, 1fr) !important;
    }
}

@media (max-width: 767.98px) {
    .cx-dashboard-page [data-dashboard-key="topAlertDevices"] .conexgo-dashboard-top-alert-filters,
    .cx-dashboard-page [data-dashboard-key="latestAlerts"] .conexgo-dashboard-latest-summary,
    .cx-dashboard-page [data-dashboard-key="latestAlerts"] .conexgo-dashboard-latest-mainline,
    .cx-dashboard-page [data-dashboard-key="topAlertDevices"] .conexgo-dashboard-ranked-item {
        grid-template-columns: minmax(0, 1fr) !important;
    }

    .cx-dashboard-page [data-dashboard-key="topAlertDevices"] .conexgo-dashboard-ranked-meter {
        max-width: none !important;
        justify-self: stretch !important;
    }

    .cx-dashboard-page [data-dashboard-key="latestAlerts"] .conexgo-dashboard-latest-time {
        text-align: left !important;
        white-space: normal !important;
    }
}

.cx-dashboard-page [data-dashboard-key="deviceStatus"] .conexgo-dashboard-table-card-body {
    overflow-x: hidden !important;
    overflow-y: auto !important;
    overscroll-behavior: contain;
}

.cx-dashboard-page [data-dashboard-key="deviceStatus"] .conexgo-dashboard-table-scroll {
    width: 100%;
    max-width: 100%;
    overflow-x: auto !important;
    overflow-y: visible !important;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
    scrollbar-color: #b9c8d6 transparent;
}

    .cx-dashboard-page [data-dashboard-key="deviceStatus"] .conexgo-dashboard-table-scroll > table {
        width: max-content !important;
        min-width: 100% !important;
        margin-bottom: 0 !important;
    }

.cx-dashboard-page [data-dashboard-key="alertTrend"] {
    container-type: inline-size;
}

    .cx-dashboard-page [data-dashboard-key="alertTrend"] .conexgo-dashboard-alert-trend-filters {
        grid-template-columns: repeat(2, minmax(200px, 1fr)) !important;
        gap: 12px !important;
    }

        .cx-dashboard-page [data-dashboard-key="alertTrend"] .conexgo-dashboard-alert-trend-filters > div,
        .cx-dashboard-page [data-dashboard-key="alertTrend"] .conexgo-dashboard-alert-trend-filters .cx-control--dashboard-filter {
            width: 100% !important;
            min-width: 0 !important;
        }

@container (max-width: 520px) {
    .conexgo-dashboard-alert-trend-filters {
        grid-template-columns: minmax(0, 1fr) !important;
    }
}

@media (max-width: 767.98px) {
    .cx-dashboard-page [data-dashboard-key="alertTrend"] .conexgo-dashboard-alert-trend-filters {
        grid-template-columns: minmax(0, 1fr) !important;
    }
}

.cx-dashboard-page .conexgo-dashboard-config-header-button {
    width: 100%;
    min-width: 0;
    padding: 0;
    border: 0;
    background: transparent;
    color: inherit;
    text-align: left;
    cursor: pointer;
}

    .cx-dashboard-page .conexgo-dashboard-config-header-button:hover .conexgo-dashboard-config-section-title,
    .cx-dashboard-page .conexgo-dashboard-config-header-button:focus-visible .conexgo-dashboard-config-section-title {
        color: #315f86;
    }

    .cx-dashboard-page .conexgo-dashboard-config-header-button:focus-visible {
        border-radius: 8px;
        outline: 3px solid rgba(62, 106, 153, .16);
        outline-offset: 4px;
    }

    .cx-dashboard-page .conexgo-dashboard-config-header-button .conexgo-dashboard-config-section-copy {
        display: block;
    }

    .cx-dashboard-page .conexgo-dashboard-config-header-button .conexgo-dashboard-config-section-title,
    .cx-dashboard-page .conexgo-dashboard-config-header-button .conexgo-dashboard-config-section-description {
        display: block;
    }

.cx-dashboard-page [data-dashboard-key="deviceStatus"] .conexgo-dashboard-table-card-body {
    overflow-x: hidden !important;
    overflow-y: auto !important;
    overscroll-behavior: contain;
}

.cx-dashboard-page [data-dashboard-key="deviceStatus"] .conexgo-dashboard-table-scroll {
    width: 100%;
    max-width: 100%;
    overflow-x: auto !important;
    overflow-y: visible !important;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
}

    .cx-dashboard-page [data-dashboard-key="deviceStatus"] .conexgo-dashboard-table-scroll > table {
        width: max-content !important;
        min-width: 100% !important;
        margin-bottom: 0 !important;
    }

.cx-dashboard-page [data-dashboard-key="alertTrend"] {
    container-type: inline-size;
}

    .cx-dashboard-page [data-dashboard-key="alertTrend"] .conexgo-dashboard-alert-trend-filters {
        grid-template-columns: repeat(2, minmax(190px, 1fr)) !important;
        gap: 12px !important;
    }

        .cx-dashboard-page [data-dashboard-key="alertTrend"] .conexgo-dashboard-alert-trend-filters > div,
        .cx-dashboard-page [data-dashboard-key="alertTrend"] .conexgo-dashboard-alert-trend-filters .cx-control--dashboard-filter {
            width: 100% !important;
            min-width: 0 !important;
        }

.cx-dashboard-page [data-dashboard-key="totalDevices"] {
    container-type: inline-size;
}

    .cx-dashboard-page [data-dashboard-key="totalDevices"] .conexgo-device-overview-toolbar {
        min-width: 0;
    }

        .cx-dashboard-page [data-dashboard-key="totalDevices"] .conexgo-device-overview-toolbar > :first-child {
            min-width: 0;
            flex: 1 1 300px;
        }

    .cx-dashboard-page [data-dashboard-key="totalDevices"] .conexgo-device-overview-period {
        flex: 0 1 250px;
        min-width: 210px;
        max-width: 100%;
    }

@container (max-width: 560px) {
    .conexgo-device-overview-toolbar {
        align-items: stretch !important;
        flex-direction: column !important;
    }

    .conexgo-device-overview-period {
        width: 100% !important;
        min-width: 0 !important;
        flex-basis: auto !important;
    }
}

@container (max-width: 520px) {
    .conexgo-dashboard-alert-trend-filters {
        grid-template-columns: minmax(0, 1fr) !important;
    }
}

@media (max-width: 767.98px) {
    .cx-dashboard-page [data-dashboard-key="alertTrend"] .conexgo-dashboard-alert-trend-filters {
        grid-template-columns: minmax(0, 1fr) !important;
    }
}

.cx-dashboard-page .conexgo-dashboard-config-icon-button {
    width: 48px !important;
    min-width: 48px !important;
    height: 48px !important;
    padding: 0 !important;
    display: inline-grid !important;
    place-items: center;
    border-radius: 12px !important;
}

    .cx-dashboard-page .conexgo-dashboard-config-icon-button .fa {
        margin: 0 !important;
    }

.cx-dashboard-page .conexgo-dashboard-no-data-card:not(.conexgo-dashboard-minimized-card) {
    height: auto !important;
    min-height: 180px !important;
    max-height: 320px !important;
    resize: none !important;
}

.cx-dashboard-page .conexgo-dashboard-no-data-card .conexgo-dashboard-empty-state.compact {
    min-height: 112px !important;
    padding-block: 18px !important;
}

.cx-dashboard-page .conexgo-dashboard-no-data-card .conexgo-dashboard-filter-grid {
    width: 100% !important;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 210px), 1fr)) !important;
}

.cx-dashboard-page .conexgo-dashboard-no-data-card > .card-body {
    min-height: 0 !important;
    padding-bottom: 18px !important;
}

@media (max-width: 767.98px) {
    .cx-dashboard-page .conexgo-dashboard-content-grid {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
        column-count: initial !important;
        column-gap: 0 !important;
        gap: 12px !important;
    }

    .cx-dashboard-page .conexgo-dashboard-smart-item {
        width: 100% !important;
        margin: 0 !important;
        break-inside: auto !important;
    }

    .cx-dashboard-page .conexgo-dashboard-resizable-card {
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        resize: none !important;
        overflow: hidden !important;
    }

        .cx-dashboard-page .conexgo-dashboard-resizable-card > .card-body {
            height: auto !important;
            min-height: 0 !important;
            max-height: none !important;
        }

        .cx-dashboard-page .conexgo-dashboard-resizable-card:not(.conexgo-dashboard-minimized-card):not(.conexgo-dashboard-card-closing) {
            height: auto !important;
            max-height: none !important;
        }

    .cx-dashboard-page .conexgo-dashboard-minimized-card,
    .cx-dashboard-page .conexgo-dashboard-card-closing {
        height: 56px !important;
        min-height: 56px !important;
        max-height: 56px !important;
    }

    .cx-dashboard-page .conexgo-dashboard-card-header h4,
    .cx-dashboard-page .conexgo-dashboard-card-header .card-title {
        font-size: clamp(.93rem, 4vw, 1.08rem) !important;
        line-height: 1.2 !important;
    }

    .cx-dashboard-page .conexgo-dashboard-config-add-row {
        grid-template-columns: minmax(0, 1fr) 48px !important;
    }
}

@media (min-width: 768px) and (max-width: 1199.98px) {
    .cx-dashboard-page .conexgo-dashboard-content-grid {
        column-count: 1 !important;
        column-gap: 0 !important;
    }

    .cx-dashboard-page .conexgo-dashboard-smart-item {
        width: 100% !important;
        max-width: 100% !important;
        margin-bottom: 14px !important;
    }

    .cx-dashboard-page .conexgo-dashboard-filter-grid,
    .cx-dashboard-page .conexgo-dashboard-alert-trend-filters {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (min-width: 1600px) {
    .cx-dashboard-page .conexgo-dashboard-content-grid {
        column-gap: 20px !important;
    }

    .cx-dashboard-page .card-header {
        min-height: 62px;
    }

        .cx-dashboard-page .card-header h2,
        .cx-dashboard-page .card-header h3 {
            font-size: 1.25rem !important;
        }
}

.cx-dashboard-page .conexgo-dashboard-no-data-card:not(.conexgo-dashboard-minimized-card) {
    min-height: 150px !important;
    max-height: 270px !important;
}

.cx-dashboard-page .conexgo-dashboard-no-data-card .conexgo-dashboard-empty-state.compact {
    min-height: 90px !important;
    padding-block: 14px !important;
}

.cx-dashboard-page .conexgo-dashboard-resizable-card > .card-body {
    scrollbar-gutter: stable;
}

@media (max-width: 767.98px) {
    .cx-dashboard-page .conexgo-dashboard-no-data-card:not(.conexgo-dashboard-minimized-card) {
        min-height: 132px !important;
        max-height: 220px !important;
    }
}

/* CONEXGO DEVICE OVERVIEW DATA VISIBILITY FIX R4 */
.cx-dashboard-page [data-dashboard-key="totalDevices"] .conexgo-device-overview-card > .card-body {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    overflow: visible !important;
}

.cx-dashboard-page [data-dashboard-key="totalDevices"] .conexgo-device-overview-toolbar {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(210px, 250px) !important;
    align-items: end !important;
    gap: 14px !important;
    width: 100% !important;
    min-width: 0 !important;
    visibility: visible !important;
    opacity: 1 !important;
}

.cx-dashboard-page [data-dashboard-key="totalDevices"] .conexgo-device-overview-copy,
.cx-dashboard-page [data-dashboard-key="totalDevices"] .conexgo-device-overview-period,
.cx-dashboard-page [data-dashboard-key="totalDevices"] .conexgo-device-overview-metrics,
.cx-dashboard-page [data-dashboard-key="totalDevices"] .conexgo-device-overview-models,
.cx-dashboard-page [data-dashboard-key="totalDevices"] .conexgo-device-overview-metric,
.cx-dashboard-page [data-dashboard-key="totalDevices"] .conexgo-device-overview-model {
    visibility: visible !important;
    opacity: 1 !important;
}

.cx-dashboard-page [data-dashboard-key="totalDevices"] .conexgo-device-overview-period {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
}

    .cx-dashboard-page [data-dashboard-key="totalDevices"] .conexgo-device-overview-period .form-select {
        display: block !important;
        width: 100% !important;
        min-height: 42px !important;
    }

.cx-dashboard-page [data-dashboard-key="totalDevices"] .conexgo-device-overview-metrics {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 12px !important;
    width: 100% !important;
}

.cx-dashboard-page [data-dashboard-key="totalDevices"] .conexgo-device-overview-models {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 9px !important;
    width: 100% !important;
}

/* CONEXGO R6.2: preserve the two device metrics side by side. */
@container (max-width: 560px) {
    .cx-dashboard-page [data-dashboard-key="totalDevices"] .conexgo-device-overview-toolbar {
        grid-template-columns: minmax(0, 1fr) !important;
        align-items: stretch !important;
    }

    .cx-dashboard-page [data-dashboard-key="totalDevices"] .conexgo-device-overview-period {
        width: 100% !important;
        min-width: 0 !important;
        max-width: none !important;
    }

    .cx-dashboard-page [data-dashboard-key="totalDevices"] .conexgo-device-overview-metrics {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    .cx-dashboard-page [data-dashboard-key="totalDevices"] .conexgo-device-overview-models {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    }
}

@container (max-width: 420px) {
    .cx-dashboard-page [data-dashboard-key="totalDevices"] .conexgo-device-overview-metrics,
    .cx-dashboard-page [data-dashboard-key="totalDevices"] .conexgo-device-overview-models {
        grid-template-columns: minmax(0, 1fr) !important;
    }
}

.cx-dashboard-page #conexgoDashboardSmartGrid .conexgo-dashboard-ranked-title {
    text-decoration: underline;
    text-underline-offset: 2px;
}

    .cx-dashboard-page #conexgoDashboardSmartGrid .conexgo-dashboard-ranked-title:hover {
        color: #203e5d !important;
        text-decoration: underline !important;
    }

/* CONEXGO R10 DEVICE OVERVIEW FILTER PARITY */
.cx-dashboard-page [data-dashboard-key="totalDevices"] .conexgo-device-overview-toolbar {
    display: flex !important;
    flex-direction: row !important;
    align-items: flex-end !important;
    justify-content: space-between !important;
    gap: 12px !important;
    margin-bottom: 12px !important;
    padding: 0 0 12px !important;
    border-bottom: 1px solid #e7edf3 !important;
}

.cx-dashboard-page [data-dashboard-key="totalDevices"] .conexgo-device-overview-copy {
    min-width: 0 !important;
    flex: 1 1 auto !important;
}

.cx-dashboard-page [data-dashboard-key="totalDevices"] .conexgo-device-overview-period {
    width: clamp(160px, 42%, 230px) !important;
    min-width: 0 !important;
    max-width: 230px !important;
    flex: 0 0 clamp(160px, 42%, 230px) !important;
}

    .cx-dashboard-page [data-dashboard-key="totalDevices"] .conexgo-device-overview-period .cx-select,
    .cx-dashboard-page [data-dashboard-key="totalDevices"] .conexgo-device-overview-period .cx-control--dashboard-filter {
        width: 100% !important;
        min-width: 0 !important;
    }

@container (max-width: 319px) {
    .cx-dashboard-page [data-dashboard-key="totalDevices"] .conexgo-device-overview-toolbar {
        flex-direction: column !important;
        align-items: stretch !important;
    }

    .cx-dashboard-page [data-dashboard-key="totalDevices"] .conexgo-device-overview-period {
        width: 100% !important;
        max-width: none !important;
        flex-basis: auto !important;
    }
}
/* CONEXGO R13 — restore the complete dashboard hover without a left accent. */
.cx-dashboard-page #conexgoDashboardSmartGrid .conexgo-dashboard-ranked-item,
.cx-dashboard-page #conexgoDashboardSmartGrid .cx-dashboard-offline-item,
.cx-dashboard-page .conexgo-device-status-table tbody tr {
    border-inline-start: 0 !important;
    border-left: 0 !important;
    transition: background-color .16s ease, box-shadow .16s ease, transform .16s ease !important;
}

    .cx-dashboard-page #conexgoDashboardSmartGrid .conexgo-dashboard-ranked-item:hover,
    .cx-dashboard-page #conexgoDashboardSmartGrid .conexgo-dashboard-ranked-item:focus-within,
    .cx-dashboard-page #conexgoDashboardSmartGrid .cx-dashboard-offline-item:hover,
    .cx-dashboard-page #conexgoDashboardSmartGrid .cx-dashboard-offline-item:focus-within,
    .cx-dashboard-page .conexgo-device-status-table tbody tr:hover,
    .cx-dashboard-page .conexgo-device-status-table tbody tr:focus-within {
        border-inline-start: 0 !important;
        border-left: 0 !important;
        background: #f6f9fc !important;
        box-shadow: 0 4px 12px rgba(44, 76, 108, .085) !important;
        outline: 0 !important;
        transform: translateY(-1px) !important;
    }

@media (prefers-reduced-motion: reduce) {
    .cx-dashboard-page #conexgoDashboardSmartGrid .conexgo-dashboard-ranked-item,
    .cx-dashboard-page #conexgoDashboardSmartGrid .cx-dashboard-offline-item,
    .cx-dashboard-page .conexgo-device-status-table tbody tr {
        transition: none !important;
    }
}
/* #endregion Index.razor */

/*********** DEVICE *******************/
/* #region Device_List.razor */
/**************************************** Device_List.razor ************************************************************************/
.device-list-action-group {
    min-height: 46px;
    width: 100%;
}

.device-list-name-button,
.device-list-action-toggle {
    min-height: 46px !important;
}

.device-list-name-button {
    padding-inline: 12px !important;
}

.device-list-action-toggle {
    flex-basis: 48px !important;
}
/* Underline only real links inside table data columns, never dropdown actions. */
.conexgo-pagedlist-table tbody td a:not(.dropdown-item):not(.btn),
.conexgo-pagedlist-table tbody td a:not(.dropdown-item):not(.btn):hover,
.conexgo-pagedlist-table tbody td a:not(.dropdown-item):not(.btn):focus-visible {
    text-decoration: underline !important;
    text-underline-offset: 2px;
}

    .conexgo-pagedlist-table tbody td a:not(.dropdown-item):not(.btn):hover,
    .conexgo-pagedlist-table tbody td a:not(.dropdown-item):not(.btn):focus-visible {
        color: #1f4f78 !important;
    }

.device-list-action-menu .dropdown-item,
.device-list-action-menu .dropdown-item:hover,
.device-list-action-menu .dropdown-item:focus-visible {
    text-decoration: none !important;
}

@media (max-width: 767.98px) {
    .device-list-action-group {
        width: 100% !important;
        max-width: none !important;
        min-height: 48px;
    }

    .device-list-name-button {
        min-height: 48px !important;
        font-size: .86rem !important;
    }

    .device-list-action-toggle {
        width: 50px !important;
        min-width: 50px !important;
        flex-basis: 50px !important;
    }

    .device-list-name-button img {
        width: 26px;
        height: 26px;
        flex-basis: 26px;
    }
}

@media (min-width: 768px) and (max-width: 1199.98px) {
    .device-list-action-group {
        min-width: 250px;
    }
}

.device-list-action-group {
    position: relative;
    z-index: 1065;
}

.device-list-action-menu,
.device-list-action-menu.show {
    z-index: 1090;
}

/* CONEXGO DEVICE ACTION MENU VIEWPORT FIX R4 */
@media (max-width: 991.98px) {
    .device-list-action-group {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
    }

    .device-list-action-menu,
    .device-list-action-menu.show {
        position: fixed !important;
        inset: auto 12px calc(78px + env(safe-area-inset-bottom, 0px)) 12px !important;
        width: auto !important;
        min-width: 0 !important;
        max-width: 420px !important;
        max-height: min(58vh, 480px) !important;
        margin-inline: auto !important;
        box-sizing: border-box !important;
        transform: none !important;
        overflow-x: hidden !important;
        overflow-y: auto !important;
        z-index: 1800 !important;
    }
}

@media (max-width: 575.98px) {
    .device-list-action-menu,
    .device-list-action-menu.show {
        inset-inline: 8px !important;
        max-width: calc(100vw - 16px) !important;
    }
}

/* CONEXGO DEVICE RESPONSIVE STACKING R7 */
/*
       Every row previously created the same stacking context.
       A dropdown inside an earlier row could therefore be painted below
       the controls of the following rows.
    */
.device-list-action-group {
    position: relative !important;
    z-index: auto !important;
    isolation: auto !important;
}

.conexgo-pagedlist-table tbody tr {
    position: relative;
    z-index: 0;
}

    .conexgo-pagedlist-table tbody tr:has(.device-list-action-menu.show) {
        z-index: 2400 !important;
    }

.conexgo-pagedlist-table tbody td:has(.device-list-action-menu.show) {
    position: relative !important;
    z-index: 2410 !important;
}

.device-list-action-group:has(.device-list-action-menu.show) {
    z-index: 2420 !important;
}

.device-list-action-menu,
.device-list-action-menu.show {
    z-index: 2430 !important;
}

@media (min-width: 992px) {
    .device-list-data-row,
    .device-list-data-row > div,
    .device-list-data-row .table-responsive,
    .device-list-data-row .conexgo-pagedlist-table-region,
    .device-list-data-row .conexgo-pagedlist-table-column {
        overflow: visible !important;
    }

    .device-list-action-menu,
    .device-list-action-menu.show {
        width: min(320px, calc(100vw - 32px)) !important;
        max-height: min(72vh, 620px) !important;
        overflow-x: hidden !important;
        overflow-y: auto !important;
    }
}

.device-list-data-row {
    margin-bottom: 0 !important;
}

.device-list-meta {
    min-width: 0;
    margin: 8px 4px 0 !important;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 4px 9px;
    color: #52667a;
    font-size: .76rem;
    line-height: 1.35;
}

    .device-list-meta > span {
        min-width: 0;
        padding-left: 0 !important;
        overflow-wrap: anywhere;
    }

@media (max-width: 991.98px) {
    .device-list-data-row {
        padding-bottom: calc(92px + env(safe-area-inset-bottom, 0px)) !important;
    }

        .device-list-data-row,
        .device-list-data-row > div,
        .device-list-data-row .table-responsive,
        .device-list-data-row .conexgo-pagedlist-table-region,
        .device-list-data-row .conexgo-pagedlist-table-column {
            width: 100% !important;
            min-width: 0 !important;
            overflow: visible !important;
        }

            .device-list-data-row .conexgo-pagedlist-native-mobile {
                width: 100% !important;
                min-width: 0 !important;
                display: block !important;
                border: 0 !important;
                background: transparent !important;
            }

                .device-list-data-row .conexgo-pagedlist-native-mobile thead {
                    position: absolute !important;
                    width: 1px !important;
                    height: 1px !important;
                    padding: 0 !important;
                    margin: -1px !important;
                    overflow: hidden !important;
                    clip: rect(0, 0, 0, 0) !important;
                    white-space: nowrap !important;
                    border: 0 !important;
                }

                .device-list-data-row .conexgo-pagedlist-native-mobile tbody {
                    width: 100% !important;
                    min-width: 0 !important;
                    display: grid !important;
                    grid-template-columns: minmax(0, 1fr) !important;
                    gap: 10px !important;
                }

                    .device-list-data-row .conexgo-pagedlist-native-mobile tbody tr {
                        width: 100% !important;
                        min-width: 0 !important;
                        margin: 0 !important;
                        display: block !important;
                        overflow: visible !important;
                        border: 1px solid #dbe5ee !important;
                        border-radius: 12px !important;
                        background: #ffffff !important;
                        box-shadow: 0 4px 14px rgba(44, 76, 108, .065);
                    }

                        .device-list-data-row .conexgo-pagedlist-native-mobile tbody tr:hover {
                            border-color: #b9cee0 !important;
                            box-shadow: 0 6px 18px rgba(44, 76, 108, .10);
                        }

                    .device-list-data-row .conexgo-pagedlist-native-mobile tbody td:not(.d-none) {
                        width: 100% !important;
                        min-width: 0 !important;
                        padding: 10px !important;
                        display: block !important;
                        overflow: visible !important;
                        border: 0 !important;
                        background: transparent !important;
                    }

    .device-list-action-group {
        width: 100% !important;
        min-width: 0 !important;
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) 44px !important;
        align-items: stretch !important;
    }

    .device-list-name-button {
        width: 100% !important;
        min-width: 0 !important;
        min-height: 44px !important;
        padding: 7px 10px !important;
        gap: 7px !important;
        border-radius: 8px 0 0 8px !important;
        font-size: .82rem !important;
    }

        .device-list-name-button img {
            width: 24px !important;
            height: 24px !important;
            flex-basis: 24px !important;
        }

    .device-list-action-toggle {
        width: 44px !important;
        min-width: 44px !important;
        min-height: 44px !important;
        padding: 0 !important;
        border-radius: 0 8px 8px 0 !important;
    }

    .device-list-meta {
        margin: 7px 2px 0 !important;
        font-size: .70rem !important;
        gap: 3px 7px !important;
    }

    .device-mobile-status {
        width: 100% !important;
        min-width: 0 !important;
        margin-top: 8px !important;
        padding-top: 8px !important;
        display: grid !important;
        grid-template-columns: minmax(86px, 1fr) minmax(0, auto) !important;
        align-items: center !important;
        gap: 7px !important;
        border-top: 1px solid #e6edf3 !important;
    }

    .device-mobile-status-pill {
        width: 100% !important;
        min-width: 0 !important;
        min-height: 25px !important;
        padding: 5px 8px !important;
        border-radius: 6px !important;
        font-size: .69rem !important;
    }

    .device-mobile-status-icons {
        min-width: 0 !important;
        display: grid !important;
        grid-template-columns: repeat(4, 24px) !important;
        align-items: center !important;
        justify-content: end !important;
        gap: 3px !important;
    }

    .device-status-icon,
    .device-mobile-battery,
    .device-mobile-battery > .fa-stack-1x {
        width: 24px !important;
        height: 24px !important;
        min-width: 24px !important;
        line-height: 24px !important;
    }

    .device-list-action-menu,
    .device-list-action-menu.show {
        position: fixed !important;
        inset: auto 10px calc(76px + env(safe-area-inset-bottom, 0px)) 10px !important;
        width: auto !important;
        min-width: 0 !important;
        max-width: 440px !important;
        max-height: min(58dvh, 500px) !important;
        margin-inline: auto !important;
        padding: 9px !important;
        box-sizing: border-box !important;
        transform: none !important;
        overflow-x: hidden !important;
        overflow-y: auto !important;
        border-radius: 12px !important;
        z-index: 2600 !important;
    }

        .device-list-action-menu .dropdown-item {
            min-height: 42px !important;
            padding: 9px 10px !important;
        }
}

@media (min-width: 600px) and (max-width: 991.98px) {
    .device-list-data-row .conexgo-pagedlist-native-mobile tbody {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 379.98px) {
    .device-mobile-status {
        grid-template-columns: minmax(0, 1fr) !important;
    }

    .device-mobile-status-icons {
        justify-content: start !important;
    }

    .device-list-name-button {
        font-size: .76rem !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    .device-list-data-row .conexgo-pagedlist-native-mobile tbody tr {
        transition: none !important;
    }
}

/* CONEXGO R15 — action menus overlay the table and never change row height. */
.device-list-action-group {
    position: relative !important;
    z-index: auto !important;
    overflow: visible !important;
}

.conexgo-pagedlist-table tbody tr:has(.device-list-action-menu.show) {
    position: relative !important;
    z-index: 2450 !important;
}

.conexgo-pagedlist-table tbody td:has(.device-list-action-menu.show) {
    position: relative !important;
    z-index: 2460 !important;
    overflow: visible !important;
}

@media (min-width: 992px) {
    .device-list-data-row,
    .device-list-data-row > div,
    .device-list-data-row .table-responsive,
    .device-list-data-row .conexgo-pagedlist-table-region,
    .device-list-data-row .conexgo-pagedlist-table-column,
    .device-list-data-row .conexgo-pagedlist-table tbody,
    .device-list-data-row .conexgo-pagedlist-table tr,
    .device-list-data-row .conexgo-pagedlist-table td {
        overflow: visible !important;
    }

    .device-list-action-menu,
    .device-list-action-menu.show {
        width: min(300px, calc(100vw - 36px)) !important;
        max-height: min(46vh, 420px) !important;
        margin: 0 !important;
        overflow-x: hidden !important;
        overflow-y: auto !important;
        overscroll-behavior: contain;
        scrollbar-width: thin;
        z-index: 2470 !important;
    }
}

@media (max-width: 991.98px) {
    .device-list-action-menu,
    .device-list-action-menu.show {
        position: fixed !important;
        top: auto !important;
        right: 12px !important;
        bottom: calc(74px + env(safe-area-inset-bottom, 0px)) !important;
        left: 12px !important;
        inset: auto 12px calc(74px + env(safe-area-inset-bottom, 0px)) 12px !important;
        width: min(420px, calc(100vw - 24px)) !important;
        max-height: min(58dvh, 500px) !important;
        margin-inline: auto !important;
        transform: none !important;
        overflow-x: hidden !important;
        overflow-y: auto !important;
        z-index: 2700 !important;
    }
}
/* #endregion Device_List.razor */

/* #region Device_AddEdit.razor */
/**************************************** Device_AddEdit.razor ************************************************************************/
.cx-r1-device-addedit .cx-r1-device-created-row {
    align-items: center;
    margin-bottom: .8rem;
}

/* Keep read-only values aligned with editable fields. */
.cx-r1-device-addedit .cx-r1-readonly-value {
    min-height: 42px;
    padding: .55rem .75rem !important;
    padding-left: 1rem !important;
    display: flex;
    align-items: center;
    text-align: left !important;
    border: 1px solid #d8e1e9;
    border-radius: 8px;
    background: #f5f7f9;
    color: #526170;
    overflow-wrap: anywhere;
}

.cx-r1-device-addedit .cx-r1-device-switch-row {
    grid-template-columns: minmax(175px, 225px) 52px minmax(0, 1fr);
    align-items: center;
}

    .cx-r1-device-addedit .cx-r1-device-switch-row > .form-label {
        padding-top: 0;
    }

.cx-r1-device-addedit .cx-r1-device-switch-control {
    min-height: 42px;
    padding: 0 !important;
    display: flex;
    align-items: center;
}

.cx-r1-device-addedit .cx-r1-device-switch-description {
    padding: 0 !important;
    color: #667585;
    font-size: .84rem;
    line-height: 1.45;
}

.cx-r1-device-addedit .cx-r1-form-row > :last-child:not(.form-label) {
    overflow-wrap: anywhere;
}

@media (max-width: 767.98px) {
    .cx-r1-device-addedit .cx-r1-device-switch-row {
        grid-template-columns: 52px minmax(0, 1fr);
    }

        .cx-r1-device-addedit .cx-r1-device-switch-row > .form-label {
            grid-column: 1 / -1;
        }
}

/* Keep the form visually contained inside the dialog. */
.cx-r1-device-addedit {
    width: min(1080px, calc(100vw - 32px)) !important;
    max-width: min(1080px, calc(100vw - 32px)) !important;
    max-height: min(86vh, 900px) !important;
    margin: auto !important;
}

    .cx-r1-device-addedit .conexgo-device-addedit-content {
        padding: 18px 20px !important;
        overflow-x: hidden !important;
    }

    .cx-r1-device-addedit .cx-modal-layout-v21,
    .cx-r1-device-addedit .conexgo-device-addedit-form,
    .cx-r1-device-addedit .cx-r1-section {
        width: 100% !important;
        max-width: none !important;
    }

    .cx-r1-device-addedit .cx-r1-form-row {
        width: 100% !important;
        max-width: 920px !important;
    }

@media (max-width: 767.98px) {
    .cx-r1-device-addedit {
        width: calc(100vw - 14px) !important;
        max-width: calc(100vw - 14px) !important;
        max-height: calc(100dvh - 14px) !important;
    }

        .cx-r1-device-addedit .conexgo-device-addedit-content {
            padding: 12px !important;
        }
}

/* Allow safe vertical resizing for long text fields. */
.cx-r1-device-addedit .cx-direct-large-textarea {
    width: 100%;
    min-width: 0 !important;
    height: 148px;
    min-height: 92px !important;
    max-height: none !important;
    resize: both !important;
    overflow: auto !important;
    box-sizing: border-box !important;
}

.cx-r1-device-addedit .cx-r1-form-row > div:last-child {
    min-width: 0;
    max-width: 100%;
    overflow: visible;
}

.cx-r1-device-addedit .conexgo-device-addedit-content {
    scroll-padding-bottom: 96px;
}

@media (max-width: 767.98px) {
    .cx-r1-device-addedit .cx-direct-large-textarea {
        height: 132px;
        min-height: 88px !important;
        max-height: none !important;
    }
}

/* CONEXGO R6: browser-controlled textarea resizing */
.cx-r1-device-addedit textarea.cx-direct-large-textarea {
    resize: both !important;
    overflow: auto !important;
}
/* #endregion Device_AddEdit.razor */

/* #region Device_Map.razor */
/**************************************** Device_Map.razor ************************************************************************/
.device-map-card {
    overflow: hidden;
    border: 1px solid #dfe4ea;
    border-radius: 6px;
    background: #ffffff;
    box-shadow: 0 1px 3px rgba(23, 43, 77, .05);
}

    .device-map-card > .card-body {
        padding: 0;
    }

/* En-tête Conexgo : même bleu que les autres cartes de l'application. */
.device-map-inner-header {
    margin: 0;
    padding: 13px 16px;
    background: #2c4c6c;
    border: 0;
    border-bottom: 1px solid #243f5a;
    border-radius: 6px 6px 0 0;
}

.device-map-header-layout {
    width: 100%;
    min-width: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}

.device-map-identity {
    min-width: 0;
    display: flex;
    align-items: center;
    flex: 1 1 auto;
}

.device-map-back {
    margin-right: 12px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    color: #ffffff;
    text-decoration: none;
}

    .device-map-back:hover,
    .device-map-back:focus {
        color: #ffffff;
        opacity: .86;
    }

.device-map-avatar,
.device-map-avatar-placeholder {
    width: 40px;
    height: 40px;
    min-width: 40px;
    margin-right: 11px;
    border-radius: 50%;
    background: rgba(255, 255, 255, .12);
    border: 1px solid rgba(255, 255, 255, .36);
}

.device-map-avatar {
    display: block;
    object-fit: cover;
}

.device-map-avatar-placeholder {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #ffffff;
    font-size: 16pt;
}

.device-map-name-block {
    min-width: 0;
}

.device-map-name-row {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 8px;
}

.device-map-name {
    min-width: 0;
    display: block;
    overflow: hidden;
    color: #ffffff;
    font-size: 14pt;
    font-weight: 700;
    line-height: 1.2;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.device-map-info {
    flex: 0 0 auto;
    color: rgba(255, 255, 255, .92);
    font-size: 10.5pt;
    cursor: help;
}

.device-map-meta {
    display: block;
    margin-top: 3px;
    overflow: hidden;
    color: rgba(255, 255, 255, .76);
    font-size: 8.3pt;
    line-height: 1.25;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.device-map-location-strip {
    min-height: 42px;
    margin: 0;
    padding: 9px 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    background: #ffffff;
    border: 0;
    border-bottom: 1px solid #dfe4ea;
    border-radius: 0;
    color: #243b63;
    font-size: 10pt;
    line-height: 1.3;
    text-align: center;
}

    .device-map-location-strip i {
        color: #5f7188;
        font-size: 10pt;
        flex: 0 0 auto;
    }

.device-map-settings {
    margin: 0;
    overflow: hidden;
}

    /* Barre de statuts inspirée de Device_List : icônes nues, séparateurs fins. */
    .device-map-settings .conexgo-device-setting-toolbar,
    .device-map-settings .setting-header {
        width: calc(100% - 64px) !important;
        min-height: 48px !important;
        margin: 0 !important;
        float: left !important;
        background: #dddddd !important;
        border: 0 !important;
        border-bottom: 1px solid #c8cdd3 !important;
        border-radius: 0 !important;
    }

        .device-map-settings .conexgo-device-setting-toolbar > section,
        .device-map-settings .setting-header > section {
            width: 100% !important;
            min-width: 0 !important;
        }

        .device-map-settings .conexgo-device-setting-toolbar .dashboard,
        .device-map-settings .setting-header .dashboard {
            width: 100% !important;
            min-height: 48px !important;
            margin: 0 !important;
            padding: 0 10px !important;
            display: flex !important;
            align-items: center !important;
            gap: 0 !important;
            overflow-x: auto;
            list-style: none !important;
        }

            .device-map-settings .conexgo-device-setting-toolbar .dashboard > li,
            .device-map-settings .setting-header .dashboard > li {
                min-height: 36px !important;
                height: 36px !important;
                margin: 0 !important;
                padding: 0 13px !important;
                display: inline-flex !important;
                align-items: center !important;
                justify-content: center !important;
                border: 0 !important;
                border-left: 1px solid #b8bdc3 !important;
                background: transparent !important;
                color: #9aa5b1;
                flex: 0 0 auto !important;
            }

                .device-map-settings .conexgo-device-setting-toolbar .dashboard > li:first-child,
                .device-map-settings .setting-header .dashboard > li:first-child {
                    border-left: 0 !important;
                    padding-left: 8px !important;
                }

    .device-map-settings .conexgo-device-status-item {
        position: relative;
        min-width: 56px !important;
        height: 36px !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        cursor: default;
    }

        .device-map-settings .conexgo-device-status-item .fa-stack,
        .device-map-settings .setting-header .fa-stack {
            width: 30px !important;
            height: 30px !important;
            line-height: 30px !important;
        }

    .device-map-settings #battery {
        font-size: 19pt !important;
    }

    .device-map-settings #battery_charging {
        font-size: 9pt !important;
    }

    .device-map-settings .conexgo-device-cellular {
        min-width: 54px !important;
    }

        .device-map-settings .conexgo-device-cellular .signal,
        .device-map-settings .setting-header #sig {
            transform: scale(1.08) !important;
            transform-origin: center !important;
        }

    /* Les couleurs dynamiques fournies par Device_Map restent prioritaires. */
    .device-map-settings .conexgo-device-gps-icon,
    .device-map-settings .conexgo-device-connectivity-icon {
        width: 30px !important;
        height: 30px !important;
        min-width: 30px !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        border: 0 !important;
        border-radius: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
        filter: none !important;
        text-shadow: none !important;
        line-height: 1 !important;
    }

        .device-map-settings .conexgo-device-gps-icon,
        .device-map-settings .conexgo-device-connectivity-icon,
        .device-map-settings .conexgo-device-connectivity-icon i {
            color: inherit !important;
        }

            .device-map-settings .conexgo-device-gps-icon,
            .device-map-settings .conexgo-device-connectivity-icon i {
                font-size: 18pt !important;
                line-height: 1 !important;
                vertical-align: middle !important;
                transform: none !important;
                filter: none !important;
                text-shadow: none !important;
            }

    .device-map-settings .conexgo-device-connectivity-dot {
        display: none !important;
    }

    .device-map-settings .conexgo-device-history-item {
        min-width: 220px !important;
        flex: 0 1 300px !important;
        justify-content: flex-start !important;
        gap: 0 !important;
        padding-right: 8px !important;
    }

    .device-map-settings .conexgo-device-history-icon {
        display: none !important;
    }

    .device-map-settings .conexgo-device-history-select,
    .device-map-settings .setting-header select {
        width: 100% !important;
        min-width: 165px !important;
        height: 36px !important;
        margin: 0 !important;
        padding: 5px 34px 5px 11px !important;
        border: 1px solid #aeb8c4 !important;
        border-radius: 6px !important;
        background-color: #ffffff !important;
        color: #253858 !important;
        font-size: 9pt !important;
        font-weight: 500 !important;
        line-height: 1.2 !important;
        box-shadow: none !important;
    }

        .device-map-settings .conexgo-device-history-select:focus,
        .device-map-settings .setting-header select:focus {
            border-color: #3e6a99 !important;
            box-shadow: 0 0 0 2px rgba(62, 106, 153, .12) !important;
        }

    .device-map-settings .setting-header-config {
        width: 64px !important;
        min-height: 48px !important;
        margin: 0 !important;
        float: right !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        background: #dddddd !important;
        border: 0 !important;
        border-left: 1px solid #c2c7cc !important;
        border-bottom: 1px solid #c8cdd3 !important;
        border-radius: 0 !important;
    }

        .device-map-settings .setting-header-config .dashboard {
            width: 100% !important;
            height: 48px !important;
            min-height: 48px !important;
            margin: 0 !important;
            padding: 0 !important;
            display: flex !important;
            align-items: center !important;
            justify-content: center !important;
        }

        .device-map-settings .setting-header-config .dashboard-item {
            width: 100% !important;
            min-height: 48px !important;
            margin: 0 !important;
            padding: 0 !important;
            display: flex !important;
            align-items: center !important;
            justify-content: center !important;
            border: 0 !important;
        }

        .device-map-settings .setting-header-config a {
            width: 100% !important;
            height: 48px !important;
            padding: 0 !important;
            display: flex !important;
            align-items: center !important;
            justify-content: center !important;
            color: #243b63 !important;
            line-height: 1 !important;
            text-decoration: none !important;
        }

            .device-map-settings .setting-header-config a:hover,
            .device-map-settings .setting-header-config a:focus {
                color: #243b63 !important;
                opacity: .86;
            }

            .device-map-settings .setting-header-config a > :is(i, svg, .svg-inline--fa) {
                padding: 0 !important;
                color: #ffffff !important;
                fill: currentColor !important;
                font-size: 21pt !important;
                line-height: 1 !important;
            }

            .device-map-settings .setting-header-config a span,
            .device-map-settings .setting-header-config a br {
                display: none !important;
            }

    /*
     * Device_Setting owns the history grid and the date/time geometry.
     * Device_Map only supplies the surrounding surface so the shared controls
     * stay identical on the map and on list pages.
     */
    .device-map-settings > .setting_header:not(#map-controller) {
        clear: both;
        margin: 0 !important;
        padding: 0 !important;
        overflow: visible !important;
        background: #f8fafc !important;
        border: 0 !important;
        border-bottom: 1px solid #dfe5ec !important;
    }

        .device-map-settings > .setting_header:not(#map-controller) > section {
            width: 100% !important;
            min-width: 0 !important;
            padding: 14px 16px 16px !important;
            overflow: visible !important;
            box-sizing: border-box !important;
        }

    .device-map-settings .conexgo-history-form,
    .device-map-settings .conexgo-history-form > *,
    .device-map-settings .conexgo-history-date,
    .device-map-settings .conexgo-history-time,
    .device-map-settings .conexgo-history-action {
        min-width: 0 !important;
    }

    .device-map-settings .conexgo-history-go {
        min-height: 44px !important;
    }

    /*
     * Device_Setting still uses #waitIndicator for the existing JavaScript.
     * Keep it in the DOM without adding a second line below the action.
     */
    .device-map-settings #waitIndicator {
        position: absolute !important;
        width: 1px !important;
        height: 1px !important;
        margin: 0 !important;
        overflow: hidden !important;
        opacity: 0 !important;
        pointer-events: none !important;
    }

    .device-map-settings #map-controller {
        clear: both;
        border-top: 0 !important;
        border-bottom: 1px solid #c8cdd3 !important;
    }

.device-map-canvas-shell {
    position: relative;
    clear: both;
    margin: 0;
    overflow: hidden;
    border: 1px solid #d7dde4;
    border-top: 0;
    border-radius: 0 0 6px 6px;
    background: #f8f9fa;
}

#map-canvas {
    width: 100%;
    height: clamp(430px, 68vh, 720px);
    min-height: 430px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #6c757d;
}

.device-map-loading-overlay {
    position: absolute;
    inset: 0;
    z-index: 8;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 24px;
    background: rgba(247, 249, 252, .88);
    backdrop-filter: blur(1.5px);
}

.device-map-canvas-shell.is-loading .device-map-loading-overlay {
    display: flex;
}

.device-map-loading-card {
    width: min(360px, calc(100% - 28px));
    min-height: 218px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 13px;
    padding: 30px 26px;
    border: 1px solid #d7e0e9;
    border-radius: 11px;
    background: #ffffff;
    box-shadow: 0 3px 12px rgba(44, 76, 108, .10);
    color: #2c4c6c;
    text-align: center;
}

.device-map-loading-spinner {
    width: 58px;
    height: 58px;
    display: block;
    border: 6px solid #e8edf2;
    border-top-color: #2c4c6c;
    border-radius: 50%;
    animation: device-map-loading-spin .85s linear infinite;
}

.device-map-loading-title {
    margin-top: 4px;
    color: #2c4c6c;
    font-size: 12pt;
    font-weight: 800;
    line-height: 1.25;
}

.device-map-loading-description {
    max-width: 270px;
    color: #7a8492;
    font-size: 10pt;
    line-height: 1.55;
}

@keyframes device-map-loading-spin {
    to {
        transform: rotate(360deg);
    }
}

@media (max-width: 991.98px) {
    .device-map-settings .conexgo-device-setting-toolbar,
    .device-map-settings .setting-header {
        width: 100% !important;
        float: none !important;
    }

    .device-map-settings .setting-header-config {
        display: none !important;
    }

    .device-map-settings .conexgo-device-setting-toolbar .dashboard,
    .device-map-settings .setting-header .dashboard {
        justify-content: flex-start !important;
    }

    #map-canvas {
        height: 62vh;
        min-height: 390px;
    }
}

@media (max-width: 575.98px) {
    .device-map-inner-header {
        padding: 11px 12px;
    }

    .device-map-avatar,
    .device-map-avatar-placeholder {
        width: 36px;
        height: 36px;
        min-width: 36px;
        margin-right: 8px;
    }

    .device-map-name {
        font-size: 12.5pt;
    }

    .device-map-meta {
        max-width: calc(100vw - 96px);
        font-size: 7.8pt;
    }

    .device-map-location-strip {
        padding: 8px 10px;
        font-size: 9pt;
    }

    .device-map-settings .conexgo-device-setting-toolbar,
    .device-map-settings .setting-header {
        min-height: 0 !important;
        overflow: visible !important;
    }

        .device-map-settings .conexgo-device-setting-toolbar .dashboard,
        .device-map-settings .setting-header .dashboard {
            min-height: 0 !important;
            padding: 0 !important;
            display: grid !important;
            grid-template-columns: repeat(5, minmax(0, 1fr));
            align-items: stretch !important;
            gap: 0 !important;
            overflow: visible !important;
        }

            .device-map-settings .conexgo-device-setting-toolbar .dashboard > li,
            .device-map-settings .setting-header .dashboard > li {
                width: auto !important;
                min-width: 0 !important;
                min-height: 42px !important;
                height: 42px !important;
                padding: 0 !important;
                border-left: 1px solid #c8cdd3 !important;
            }

                .device-map-settings .conexgo-device-setting-toolbar .dashboard > li:first-child,
                .device-map-settings .setting-header .dashboard > li:first-child {
                    border-left: 0 !important;
                    padding-left: 0 !important;
                }

    .device-map-settings .conexgo-device-status-item,
    .device-map-settings .conexgo-device-cellular {
        width: 100% !important;
        min-width: 0 !important;
        height: 42px !important;
    }

    .device-map-settings .conexgo-device-history-item {
        grid-column: 1 / -1;
        width: 100% !important;
        min-width: 0 !important;
        height: auto !important;
        min-height: 46px !important;
        padding: 5px 8px !important;
        border-top: 1px solid #c8cdd3 !important;
        border-left: 0 !important;
    }

    .device-map-settings .conexgo-device-history-select,
    .device-map-settings .setting-header select {
        width: 100% !important;
        min-width: 0 !important;
        height: 36px !important;
    }

    .device-map-location-strip span {
        min-width: 0;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .device-map-settings > .setting_header:not(#map-controller) > section {
        padding: 12px !important;
    }

    #map-canvas {
        height: 58vh;
        min-height: 360px;
    }

    .device-map-loading-overlay {
        padding: 14px;
    }

    .device-map-loading-card {
        min-height: 190px;
        padding: 24px 18px;
    }

    .device-map-loading-spinner {
        width: 50px;
        height: 50px;
        border-width: 5px;
    }
}
/* #endregion Device_Map.razor */

/* #region Device_Setting.razor */
/**************************************** Device_Setting.razor ************************************************************************/
.conexgo-device-setting-toolbar {
    width: calc(100% - 64px);
    min-height: 48px;
    float: left;
    display: flex;
    align-items: center;
    background: #dddddd;
    border: 1px solid #d2d6dc;
    border-right: 0;
}

    .conexgo-device-setting-toolbar > section {
        width: 100%;
        min-width: 0;
    }

    .conexgo-device-setting-toolbar .dashboard {
        width: 100%;
        min-height: 46px;
        margin: 0;
        padding: 5px 8px !important;
        display: flex;
        align-items: center;
        gap: 0;
        list-style: none;
        overflow-x: auto;
    }

        .conexgo-device-setting-toolbar .dashboard > li {
            min-height: 34px;
            height: 34px;
            margin: 0 !important;
            padding: 0 13px !important;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            border-left: 1px solid #c0c6cd;
            background: transparent;
            flex: 0 0 auto;
        }

            .conexgo-device-setting-toolbar .dashboard > li:first-child {
                border-left: 0;
                padding-left: 8px !important;
            }

.conexgo-device-status-item {
    position: relative;
    min-width: 56px;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    cursor: default;
}

    .conexgo-device-status-item .fa-stack {
        width: 31px;
        height: 31px;
        line-height: 31px;
    }

.conexgo-device-battery-icon {
    font-size: 19pt !important;
    line-height: 31px !important;
}

.conexgo-device-battery-charge {
    font-size: 8pt !important;
    line-height: 31px !important;
    color: #ffffff;
    text-shadow: 0 1px 1px rgba(0, 0, 0, .35);
}

.conexgo-device-cellular {
    min-width: 56px;
}

    .conexgo-device-cellular .signal {
        height: 27px;
        display: inline-flex;
        align-items: flex-end;
        gap: 3px;
    }

        .conexgo-device-cellular .signal .bar {
            width: 5px;
            border-radius: 2px 2px 0 0;
            background: #aeb6c0;
            opacity: .55;
            transition: background-color .15s ease, opacity .15s ease;
        }

            .conexgo-device-cellular .signal .bar:nth-child(1) {
                height: 7px;
            }

            .conexgo-device-cellular .signal .bar:nth-child(2) {
                height: 11px;
            }

            .conexgo-device-cellular .signal .bar:nth-child(3) {
                height: 15px;
            }

            .conexgo-device-cellular .signal .bar:nth-child(4) {
                height: 20px;
            }

            .conexgo-device-cellular .signal .bar:nth-child(5) {
                height: 25px;
            }

            .conexgo-device-cellular .signal .bar.active {
                background: var(--cellular-color, #d7a900);
                opacity: 1;
            }

.conexgo-device-simple-icon {
    width: 31px;
    height: 31px;
    min-width: 31px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    font-size: 18pt;
    line-height: 1;
    vertical-align: middle;
    transform: none;
}

    .conexgo-device-simple-icon > i {
        display: block;
        line-height: 1;
    }

.conexgo-device-history-item {
    min-width: 215px;
    flex: 0 1 300px !important;
    justify-content: flex-start !important;
    padding-right: 8px !important;
}

.conexgo-device-history-select {
    width: 100% !important;
    min-width: 165px;
    height: 36px !important;
    margin: 0 !important;
    padding: 5px 34px 5px 11px !important;
    border: 1px solid #aeb8c4 !important;
    border-radius: 6px !important;
    background-color: #ffffff !important;
    color: #253858 !important;
    font-size: 9pt !important;
    font-weight: 500 !important;
    line-height: 1.2 !important;
    box-shadow: none !important;
    cursor: pointer;
}

    .conexgo-device-history-select:focus {
        border-color: #3e6a99 !important;
        box-shadow: 0 0 0 2px rgba(62, 106, 153, .12) !important;
    }

.setting-header-config {
    width: 64px !important;
    min-height: 48px !important;
    float: right !important;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #dddddd !important;
    border: 1px solid #d2d6dc !important;
}

    .setting-header-config .dashboard {
        width: 100%;
        height: 46px !important;
        margin: 0 !important;
        padding: 0 !important;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .setting-header-config .dashboard-item {
        width: 100%;
        min-height: 46px;
        margin: 0 !important;
        padding: 0 !important;
        display: flex;
        align-items: center;
        justify-content: center;
        border-left: 0 !important;
    }

    .setting-header-config a {
        width: 100%;
        height: 46px;
        display: flex;
        align-items: center;
        justify-content: center;
        color: #243b63 !important;
        text-decoration: none;
    }

        .setting-header-config a:hover,
        .setting-header-config a:focus {
            color: #3d6287 !important;
        }

        .setting-header-config a i {
            padding: 0 !important;
            font-size: 21pt !important;
            line-height: 1 !important;
        }

        .setting-header-config a span,
        .setting-header-config a br {
            display: none;
        }

.conexgo-history-panel {
    clear: both;
    margin: 0;
    border-bottom: 1px solid #dfe5ec;
    background: #f8fafc;
}

    .conexgo-history-panel > section {
        padding: 12px 16px 14px;
        overflow: visible;
    }

.conexgo-history-form {
    width: 100%;
    min-width: 0;
    margin: 0;
    display: grid;
    grid-template-columns: minmax(190px, 260px) minmax(190px, 280px) minmax(116px, 150px);
    align-items: end;
    justify-content: start;
    gap: 10px 12px;
}

    .conexgo-history-form.is-custom {
        grid-template-columns: minmax(170px, 1fr) minmax(128px, .72fr) minmax(170px, 1fr) minmax(128px, .72fr) minmax(116px, auto);
    }

    .conexgo-history-form > * {
        width: 100% !important;
        min-width: 0 !important;
        max-width: none !important;
        margin: 0 !important;
        padding: 0 !important;
    }

.conexgo-history-line-break {
    display: none !important;
}

.conexgo-history-display {
    grid-column: 1;
    grid-row: 1;
}

.conexgo-history-period {
    grid-column: 2;
    grid-row: 1;
}

.conexgo-history-form:not(.is-custom) .conexgo-history-action {
    grid-column: 3;
    grid-row: 1;
}

.conexgo-history-form.is-custom .conexgo-history-display {
    grid-column: 1 / 3;
}

.conexgo-history-form.is-custom .conexgo-history-period {
    grid-column: 3 / 5;
}

.conexgo-history-form.is-custom .conexgo-history-start-date {
    grid-column: 1;
    grid-row: 2;
}

.conexgo-history-form.is-custom .conexgo-history-start-time {
    grid-column: 2;
    grid-row: 2;
}

.conexgo-history-form.is-custom .conexgo-history-end-date {
    grid-column: 3;
    grid-row: 2;
}

.conexgo-history-form.is-custom .conexgo-history-end-time {
    grid-column: 4;
    grid-row: 2;
}

.conexgo-history-form.is-custom .conexgo-history-action {
    grid-column: 5;
    grid-row: 2;
}

.conexgo-history-label {
    min-height: 18px;
    margin: 0 0 5px;
    display: flex;
    align-items: center;
    color: #5f7184;
    font-size: .76rem;
    font-weight: 750;
    line-height: 1.2;
}

.conexgo-history-control,
.conexgo-history-date,
.conexgo-history-time,
.conexgo-history-date .cx-control-field,
.conexgo-history-time .cx-control-field {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
}

.conexgo-history-go {
    width: 100%;
    min-width: 0;
    height: 44px;
    padding: 0 16px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    border: 1px solid #315879;
    border-radius: 10px;
    background: #315879;
    color: #ffffff;
    font-size: .86rem;
    font-weight: 720;
    white-space: nowrap;
    box-shadow: none;
    transition: background-color .16s ease, border-color .16s ease, box-shadow .16s ease;
}

    .conexgo-history-go:hover,
    .conexgo-history-go:focus-visible {
        border-color: #24435f;
        background: #24435f;
        color: #ffffff;
        box-shadow: 0 5px 12px rgba(44, 76, 108, .14);
    }

.conexgo-history-wait {
    width: 18px;
    height: 18px;
    margin-left: 8px;
    vertical-align: middle;
}

@media (max-width: 1100px) {
    .conexgo-history-form,
    .conexgo-history-form.is-custom {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

        .conexgo-history-display,
        .conexgo-history-period,
        .conexgo-history-form.is-custom .conexgo-history-display,
        .conexgo-history-form.is-custom .conexgo-history-period,
        .conexgo-history-form.is-custom .conexgo-history-start-date,
        .conexgo-history-form.is-custom .conexgo-history-start-time,
        .conexgo-history-form.is-custom .conexgo-history-end-date,
        .conexgo-history-form.is-custom .conexgo-history-end-time {
            grid-column: auto;
            grid-row: auto;
        }

        .conexgo-history-form:not(.is-custom) .conexgo-history-action,
        .conexgo-history-form.is-custom .conexgo-history-action {
            grid-column: 1 / -1;
            grid-row: auto;
            width: min(190px, 100%) !important;
            justify-self: end;
        }
}

@media (max-width: 575.98px) {
    .conexgo-history-panel > section {
        padding: 10px;
    }

    .conexgo-history-form,
    .conexgo-history-form.is-custom {
        grid-template-columns: minmax(0, 1fr);
    }

        .conexgo-history-form:not(.is-custom) .conexgo-history-action,
        .conexgo-history-form.is-custom .conexgo-history-action {
            grid-column: 1;
            width: 100% !important;
            justify-self: stretch;
        }
}

#map-controller {
    clear: both;
    border-top: 0 !important;
    border-bottom: 1px solid #c8cdd3 !important;
}

@media (max-width: 991.98px) {
    .conexgo-device-setting-toolbar {
        width: calc(100% - 46px);
        min-width: 0;
        float: left;
        border-right: 0;
    }

    .setting-header-config {
        width: 46px !important;
        min-width: 46px !important;
        min-height: 48px !important;
        float: right !important;
        display: block !important;
    }

        .setting-header-config .dashboard,
        .setting-header-config .dashboard-item,
        .setting-header-config a {
            width: 100% !important;
            height: 48px !important;
            min-height: 48px !important;
        }

            .setting-header-config a i {
                font-size: 17pt !important;
            }

    .conexgo-device-history-item {
        min-width: 0;
    }
}

@media (max-width: 575.98px) {
    .conexgo-device-setting-toolbar {
        min-height: 96px;
    }

        .conexgo-device-setting-toolbar .dashboard {
            min-height: 96px;
            padding: 0 !important;
            display: grid;
            grid-template-columns: repeat(5, minmax(0, 1fr));
            align-items: center;
            overflow: visible;
        }

            .conexgo-device-setting-toolbar .dashboard > li {
                width: 100%;
                min-width: 0;
                min-height: 48px;
                height: 48px;
                padding: 0 !important;
                border-left: 1px solid #cfd5dc;
            }

                .conexgo-device-setting-toolbar .dashboard > li:first-child {
                    padding-left: 0 !important;
                    border-left: 0;
                }

        .conexgo-device-setting-toolbar .conexgo-device-status-item,
        .conexgo-device-setting-toolbar .conexgo-device-cellular {
            min-width: 0;
        }

    .conexgo-device-history-item {
        grid-column: 1 / -1;
        width: 100%;
        min-width: 0;
        height: auto !important;
        min-height: 48px !important;
        padding: 6px 8px !important;
        display: flex !important;
        align-items: center !important;
        border-top: 1px solid #cfd5dc;
        border-left: 0 !important;
    }

    .conexgo-device-history-select {
        width: 100% !important;
        min-width: 0 !important;
        height: 36px !important;
    }

    .setting-header-config {
        min-height: 48px !important;
    }

    .conexgo-history-panel > section {
        padding: 12px;
    }
}
/* #endregion Device_Setting.razor */

/* #region Device_Message.razor */
/**************************************** Device_Message.razor ************************************************************************/
/* CONEXGO MESSAGE FORM RESIZE R9 */

.cx-r1-device-message {
    width: min(1040px, calc(100vw - 32px)) !important;
    max-width: min(1040px, calc(100vw - 32px)) !important;
    max-height: min(88dvh, 900px) !important;
    margin: auto !important;
}

    .cx-r1-device-message .device-message-content {
        padding: 18px 20px !important;
        overflow-x: hidden !important;
        overflow-y: auto !important;
        scroll-padding-bottom: 96px;
    }

    .cx-r1-device-message .cx-device-config-layout,
    .cx-r1-device-message .cx-r1-section {
        width: 100% !important;
        max-width: none !important;
        min-width: 0 !important;
    }

    .cx-r1-device-message .cx-r1-section {
        padding: 18px !important;
    }

.device-message-form {
    width: 100%;
    min-width: 0;
    display: grid;
    gap: 16px;
}

.device-message-summary-grid {
    width: 100%;
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(250px, .85fr) minmax(300px, 1.15fr);
    align-items: end;
    gap: 14px;
}

.device-message-device {
    min-width: 0;
    min-height: 76px;
    padding: 13px 15px;
    display: flex;
    align-items: center;
    gap: 12px;
    border: 1px solid #d7e2eb;
    border-radius: 11px;
    background: #f7fafc;
}

.device-message-device-icon {
    width: 42px;
    height: 42px;
    flex: 0 0 42px;
    display: inline-grid;
    place-items: center;
    border: 1px solid #d4e1eb;
    border-radius: 10px;
    background: #edf4f9;
    color: #315f86;
}

.device-message-device-copy {
    min-width: 0;
}

.device-message-device-label {
    margin-bottom: 3px;
    color: #68798a;
    font-size: .73rem;
    font-weight: 800;
    letter-spacing: .045em;
    line-height: 1.2;
    text-transform: uppercase;
}

.device-message-device-name {
    min-width: 0;
    color: #2c4c6c;
    font-size: .98rem;
    font-weight: 800;
    line-height: 1.35;
    overflow-wrap: anywhere;
}

.device-message-type-field,
.device-message-body-field {
    min-width: 0;
    display: grid;
    gap: 7px;
}

    .device-message-type-field > label,
    .device-message-body-field > label {
        margin: 0;
        color: #405a72;
        font-size: .79rem;
        font-weight: 800;
    }

.cx-r1-device-message .cx-device-message-textarea {
    display: block !important;
    width: 100%;
    min-width: 0 !important;
    min-height: 104px !important;
    max-height: none !important;
    padding: 12px 13px !important;
    box-sizing: border-box !important;
    resize: both !important;
    overflow-x: auto !important;
    overflow-y: auto !important;
    border: 1px solid #cedae5 !important;
    border-radius: 10px !important;
    background: #ffffff !important;
    line-height: 1.5;
}

    .cx-r1-device-message .cx-device-message-textarea:hover {
        border-color: #a9bfd2 !important;
        background: #fbfdff !important;
    }

    .cx-r1-device-message .cx-device-message-textarea:focus {
        border-color: #6f93b1 !important;
        box-shadow: 0 0 0 3px rgba(61, 98, 135, .12) !important;
        outline: none !important;
    }

.cx-r1-device-message .device-message-actions {
    gap: 9px !important;
}

@media (max-width: 767.98px) {

    .cx-r1-device-message {
        width: calc(100vw - 12px) !important;
        max-width: calc(100vw - 12px) !important;
        max-height: calc(100dvh - 12px) !important;
    }

        .cx-r1-device-message .device-message-content {
            padding: 12px !important;
        }

        .cx-r1-device-message .cx-r1-section {
            padding: 14px !important;
        }

    .device-message-summary-grid {
        grid-template-columns: minmax(0, 1fr);
        align-items: stretch;
    }

    .device-message-device {
        min-height: 68px;
    }

    .cx-r1-device-message .cx-device-message-textarea {
        min-height: 120px !important;
    }
}

@media (max-width: 420px) {

    .cx-r1-device-message .device-message-actions {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
    }

        .cx-r1-device-message .device-message-actions > * {
            width: 100% !important;
        }
}

@media (prefers-reduced-motion: reduce) {

    .cx-r1-device-message .cx-device-message-textarea {
        transition: none !important;
    }
}
/* #endregion Device_Message.razor */

/* #region Device_Config.razor */
/**************************************** Device_Config.razor ************************************************************************/
.device-config-card {
    overflow: visible;
    border: 1px solid #d9e2ea;
    border-radius: 10px;
    background: #ffffff;
    box-shadow: 0 8px 24px rgba(23, 43, 77, .07);
}

.device-config-card-body {
    padding: 1rem;
}

.device-config-page-header {
    min-width: 0;
}

.device-config-page-actions {
    margin-left: auto;
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
}

.device-config-download-button {
    min-height: 40px;
    height: 40px;
    display: inline-grid;
    grid-auto-flow: column;
    place-items: center;
    align-content: center;
    justify-content: center;
    gap: 7px;
    padding: 0 14px;
    border: 1px solid #3e6a99;
    border-radius: 7px;
    background: #3e6a99;
    color: #ffffff;
    font-size: 13px;
    font-weight: 700;
    line-height: 1;
    box-shadow: none;
}

    .device-config-download-button i {
        width: 16px;
        height: 16px;
        margin: 0;
        display: inline-grid;
        place-items: center;
        font-size: 15px;
        line-height: 1;
    }

.device-config-main-header {
    padding: .75rem 1rem;
    border-radius: 8px;
    background: #2c4c6c;
}

.device-config-main-header-row {
    width: 100%;
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 12px;
}

.device-config-identity {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 9px;
}

.device-config-back {
    width: 34px;
    height: 34px;
    min-width: 34px;
    display: inline-grid;
    place-items: center;
    border-radius: 50%;
    background: #ffffff;
    color: #2c4c6c;
    text-decoration: none;
    box-shadow: 0 1px 3px rgba(23, 43, 77, .18);
}

    .device-config-back i {
        margin: 0;
        font-size: 17px;
        line-height: 1;
    }

.device-config-avatar {
    width: 34px;
    height: 34px;
    min-width: 34px;
    border-radius: 50%;
    object-fit: cover;
    background: #ffffff;
}

.device-config-identity-copy {
    min-width: 0;
    display: grid;
    gap: 2px;
}

.device-config-device-name {
    min-width: 0;
    color: #ffffff;
    font-size: 17px;
    font-weight: 800;
    line-height: 1.2;
    overflow-wrap: anywhere;
}

.device-config-device-meta {
    min-width: 0;
    color: #d6e0e9;
    font-size: 11.5px;
    line-height: 1.35;
    overflow-wrap: anywhere;
}

.device-config-toolbar {
    display: flex;
    align-items: stretch;
    justify-content: flex-end;
    gap: .5rem;
    flex-wrap: wrap;
}

.device-config-toolbar-button,
.device-config-toolbar-link {
    min-width: 78px;
    min-height: 48px;
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: .25rem;
    padding: .45rem .6rem;
    border: 1px solid rgba(255, 255, 255, .28);
    border-radius: 9px;
    background: rgba(255, 255, 255, .08);
    color: #ffffff;
    text-align: center;
    text-decoration: none;
    cursor: pointer;
}

    .device-config-toolbar-button:focus-visible,
    .device-config-toolbar-link:focus-visible {
        outline: 3px solid rgba(255, 255, 255, .34);
        outline-offset: 2px;
    }

    .device-config-toolbar-button svg,
    .device-config-toolbar-link i {
        width: 18px;
        height: 18px;
        font-size: 17px;
    }

    .device-config-toolbar-button span,
    .device-config-toolbar-link span {
        font-size: 8pt;
        line-height: 1.15;
    }

.device-config-section-header {
    min-height: 48px;
    border: 1px solid #d7e0e8;
    box-shadow: 0 1px 2px rgba(23, 43, 77, .04);
}

    .device-config-section-header.is-access-enabled {
        border-color: #7f9f87 !important;
        background: #d7e5d9 !important;
    }

    .device-config-section-header.is-access-disabled {
        border-color: #b98585 !important;
        background: #ead4d4 !important;
    }

    .device-config-section-header.is-access-neutral {
        border-color: #d7e0e8 !important;
        background: #f3f6f8 !important;
    }

.device-config-section-content {
    border-color: #dce4eb !important;
    background: #ffffff !important;
    box-shadow: 0 3px 10px rgba(23, 43, 77, .035);
}

.device-config-access-toggle {
    min-width: 0;
    display: flex;
    align-items: center;
    justify-content: flex-start;
}

.device-config-section--schedule .device-config-col-feature {
    grid-column: 1 / 3;
}

.device-config-col-schedule {
    grid-column: 3 / 6;
    min-width: 0;
}

.device-config-section-content .device-config-col-schedule {
    color: #3d4f61;
    font-size: 9pt;
    overflow-wrap: anywhere;
}

.device-config-section--schedule.device-config-section-content .device-config-col-value {
    grid-column: 3;
}

.device-config-section--schedule.device-config-section-content .device-config-col-schedule {
    grid-column: 4 / 6;
}

.device-config-section--schedule.device-config-section-content .device-config-col-updated {
    grid-column: 6;
}

.device-config-section--geofence .device-config-col-value--geofence {
    grid-column: 3;
}

.device-config-section--ringtone .device-config-col-value--wide {
    grid-column: 3 / 6;
}

.device-config-edit-button {
    width: 44px;
    height: 44px;
    min-width: 44px;
    min-height: 44px;
    padding: 0;
    display: inline-grid;
    place-items: center;
    border: 0;
    border-radius: 8px;
    background: transparent;
    color: #3d6287;
    box-shadow: none;
    cursor: pointer;
}

    .device-config-edit-button > i {
        margin: 0;
        font-size: 21px;
        line-height: 1;
        pointer-events: none;
    }

.device-config-collapse-button {
    width: 34px;
    height: 34px;
    min-width: 34px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    border: 1px solid #b9c8d4;
    border-radius: 9px;
    background: rgba(255, 255, 255, .88);
    color: #2c4c6c;
    box-shadow: 0 1px 2px rgba(34, 58, 82, .08);
    cursor: pointer;
}

    .device-config-collapse-button:focus-visible {
        outline: 3px solid rgba(61, 98, 135, .22);
        outline-offset: 2px;
    }

    .device-config-collapse-button svg {
        width: 16px;
        height: 16px;
    }

    .device-config-collapse-button.is-expanded svg {
        transform: rotate(180deg);
    }

.device-config-sections-shell {
    width: 100%;
    min-width: 0;
    overflow: visible;
}

.device-config-section-header,
.device-config-section-content {
    width: 100%;
    min-width: 0;
    display: grid !important;
    grid-template-columns: minmax(150px, 1.25fr) 42px minmax(155px, 1.25fr) minmax(92px, .72fr) minmax(92px, .72fr) minmax(138px, .88fr) 42px;
    align-items: center;
    gap: .5rem;
    overflow: visible;
}

.device-config-section-header {
    padding: .65rem .8rem !important;
}

.device-config-section-content {
    padding: .8rem !important;
}

.device-config-col-feature {
    grid-column: 1 / 4;
    min-width: 0;
    color: #2c4c6c;
    font-size: 11pt;
    font-weight: 700;
    overflow-wrap: anywhere;
}

.device-config-column-heading {
    color: #596879;
    font-size: 8.5pt;
    font-weight: 800;
    letter-spacing: .035em;
    text-transform: uppercase;
}

.device-config-col-email {
    grid-column: 4;
    min-width: 0;
}

.device-config-col-sms {
    grid-column: 5;
    min-width: 0;
}

.device-config-col-updated {
    grid-column: 6;
    min-width: 0;
}

.device-config-col-toggle {
    grid-column: 7;
    min-width: 42px;
    display: flex;
    justify-content: flex-end;
    position: relative;
    z-index: 2;
}

.device-config-col-customer {
    grid-column: 1;
    min-width: 0;
    display: block;
}

.device-config-col-edit {
    grid-column: 2;
    min-width: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

.device-config-col-edit--standalone {
    grid-column: 1 / 3;
    justify-content: flex-end;
}

.device-config-col-value {
    grid-column: 3;
    min-width: 0;
    color: #3d4f61;
    font-size: 9pt;
    overflow-wrap: anywhere;
}

.device-config-section-content .device-config-col-email,
.device-config-section-content .device-config-col-sms,
.device-config-section-content .device-config-col-updated {
    color: #3d4f61;
    font-size: 9pt;
    overflow-wrap: anywhere;
}

/* Soft interaction feedback. */
.device-config-download-button,
.device-config-toolbar-button,
.device-config-toolbar-link,
.device-config-collapse-button,
.device-config-section-header,
.device-config-section-content,
.device-config-edit-button {
    transition: transform .16s ease, background-color .16s ease, border-color .16s ease, box-shadow .16s ease, color .16s ease;
}

    .device-config-download-button:hover,
    .device-config-download-button:focus-visible {
        transform: translateY(-1px);
        border-color: #31597f !important;
        background: #31597f !important;
        color: #ffffff !important;
        box-shadow: 0 6px 14px rgba(31, 62, 91, .18) !important;
    }

    .device-config-toolbar-button:hover,
    .device-config-toolbar-link:hover {
        transform: translateY(-1px);
        border-color: rgba(255, 255, 255, .52);
        background: rgba(255, 255, 255, .17);
        box-shadow: 0 6px 14px rgba(13, 31, 49, .18);
        color: #ffffff;
    }

    .device-config-collapse-button:hover {
        transform: translateY(-1px);
        border-color: #7899b8;
        background: #edf3f8;
        color: #244563;
        box-shadow: 0 4px 10px rgba(44, 76, 108, .14);
    }

    .device-config-section-header:hover {
        border-color: #8faac2 !important;
        box-shadow: 0 5px 13px rgba(44, 76, 108, .10);
    }

    .device-config-section-content:hover {
        border-color: #b8c9d8 !important;
        background: #f8fbfe !important;
        box-shadow: 0 6px 16px rgba(44, 76, 108, .08);
    }

    .device-config-edit-button:hover,
    .device-config-edit-button:focus-visible {
        transform: translateY(-1px) scale(1.04);
        background: rgba(61, 98, 135, .08);
        color: #244563;
        box-shadow: none;
    }

    .device-config-edit-button:focus-visible {
        outline: 3px solid rgba(61, 98, 135, .20);
        outline-offset: 2px;
    }

@media (max-width: 1280px) and (min-width: 768px) {
    .device-config-section-header,
    .device-config-section-content {
        grid-template-columns: minmax(130px, 1.15fr) 40px minmax(135px, 1.15fr) minmax(82px, .7fr) minmax(82px, .7fr) minmax(122px, .82fr) 40px;
        gap: .35rem;
    }

    .device-config-section-header {
        padding-left: .65rem !important;
        padding-right: .5rem !important;
    }
}

@media (max-width: 767.98px) {
    .device-config-section-header {
        grid-template-columns: minmax(0, 1fr) 38px;
    }

        .device-config-section-header .device-config-col-feature {
            grid-column: 1;
        }

        .device-config-section-header .device-config-col-toggle {
            grid-column: 2;
        }

        .device-config-section-header .device-config-column-heading {
            display: none;
        }

    .device-config-section-content {
        grid-template-columns: 38px minmax(0, 1fr);
        gap: .55rem .7rem;
        align-items: start;
    }

    .device-config-col-customer {
        grid-column: 1 / -1;
        padding-bottom: .65rem;
        border-bottom: 1px solid #e4eaf0;
    }

    .device-config-col-edit, .device-config-col-edit--standalone {
        grid-column: 1;
        grid-row: 2;
        align-self: start;
        justify-content: center;
    }

    .device-config-col-value {
        grid-column: 2;
        grid-row: 2;
        min-height: 38px;
        display: flex;
        align-items: center;
    }

    .device-config-section-content .device-config-col-email,
    .device-config-section-content .device-config-col-sms,
    .device-config-section-content .device-config-col-updated {
        grid-column: 1 / -1;
        display: grid;
        grid-template-columns: 92px minmax(0, 1fr);
        gap: .6rem;
        padding-top: .55rem;
        border-top: 1px solid #e6ebf0;
    }

        .device-config-section-content .device-config-col-email::before,
        .device-config-section-content .device-config-col-sms::before,
        .device-config-section-content .device-config-col-updated::before,
        .device-config-section-content .device-config-col-schedule::before {
            content: attr(data-label);
            color: #52677a;
            font-size: .7rem;
            font-weight: 800;
            letter-spacing: .04em;
            text-transform: uppercase;
        }

    .device-config-section-content .device-config-col-schedule {
        grid-column: 1 / -1;
        display: grid;
        grid-template-columns: 92px minmax(0, 1fr);
        gap: .6rem;
        padding-top: .55rem;
        border-top: 1px solid #e6ebf0;
    }

    .device-config-section--schedule.device-config-section-content .device-config-col-value,
    .device-config-section--ringtone.device-config-section-content .device-config-col-value--wide,
    .device-config-section--geofence.device-config-section-content .device-config-col-value--geofence {
        grid-column: 2;
        grid-row: 2;
    }

    .device-config-section-content .device-config-col-toggle {
        display: none;
    }
}

@media (max-width: 991.98px) {
    .device-config-main-header-row {
        align-items: start;
    }

    .device-config-toolbar {
        justify-content: flex-end;
    }
}

@media (max-width: 767.98px) {
    .device-config-card-body {
        padding: .7rem;
    }

    .device-config-main-header {
        padding: .65rem;
    }

    .device-config-main-header-row {
        grid-template-columns: minmax(0, 1fr) auto;
        gap: 8px;
    }

    .device-config-identity {
        gap: 7px;
    }

    .device-config-back,
    .device-config-avatar {
        width: 32px;
        height: 32px;
        min-width: 32px;
    }

    .device-config-device-name {
        font-size: 15.5px;
    }

    .device-config-device-meta {
        display: none;
    }

    .device-config-toolbar {
        width: auto;
        display: inline-flex;
        flex-wrap: nowrap;
        gap: 5px;
    }

    .device-config-toolbar-button,
    .device-config-toolbar-link {
        width: 34px;
        height: 34px;
        min-width: 34px;
        min-height: 34px;
        padding: 0;
        display: inline-grid;
        place-items: center;
        gap: 0;
    }

        .device-config-toolbar-button span,
        .device-config-toolbar-link span {
            position: absolute;
            width: 1px;
            height: 1px;
            margin: -1px;
            overflow: hidden;
            clip: rect(0, 0, 0, 0);
            white-space: nowrap;
            border: 0;
        }

    .device-config-download-button {
        width: 36px;
        height: 36px;
        min-width: 36px;
        min-height: 36px;
        padding: 0;
        gap: 0;
        font-size: 0;
    }

        .device-config-download-button span {
            position: absolute;
            width: 1px;
            height: 1px;
            margin: -1px;
            overflow: hidden;
            clip: rect(0, 0, 0, 0);
            white-space: nowrap;
            border: 0;
        }

    .device-config-section-header {
        min-height: 46px;
        padding-left: .75rem !important;
        padding-right: .6rem !important;
    }

    .device-config-section-content {
        padding-left: .75rem !important;
        padding-right: .75rem !important;
    }
}
/* #endregion Device_Config.razor */

/* #region Device_Config_Permissions.razor */
/**************************************** Device_Config_Permissions.razor ************************************************************************/
.not-loggedin-pill {
    --env-color: #365B87;
    height: 42px;
    min-width: 132px;
    padding: 0 15px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    background: #F8FAFC;
    border: 1px solid #E0E6ED;
    border-radius: 12px;
    box-shadow: 0 1px 2px rgba(44, 76, 108, .05);
    color: #2c4c6c;
    line-height: 1;
    white-space: nowrap;
}

.device-permissions-wrapper {
    margin-top: .5rem;
}

.device-permissions-header {
    min-height: 48px;
    margin: 0;
    padding: .65rem .85rem;
    border: 1px solid #cfd9e3;
    border-radius: 8px;
    background: #edf2f6;
    color: #2c4c6c;
}

    .device-permissions-header.is-expanded {
        border-bottom-color: #d9e2ea;
        border-radius: 8px 8px 0 0;
        background: #e8eef4;
    }

.device-permissions-title {
    display: flex;
    align-items: center;
    gap: .7rem;
    min-width: 0;
    font-size: 11pt;
    font-weight: 700;
}

.device-permissions-title-icon {
    width: 32px;
    height: 32px;
    min-width: 32px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #c7d4df;
    border-radius: 9px;
    background: #ffffff;
    color: #2c4c6c;
    font-size: 14px;
}

    .device-permissions-title-icon svg {
        width: 18px;
        height: 18px;
    }

.device-collapse-button {
    width: 34px;
    height: 34px;
    min-width: 34px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    border: 1px solid #bfcdd9;
    border-radius: 9px;
    background: #ffffff;
    color: #2c4c6c;
    box-shadow: 0 1px 2px rgba(34, 58, 82, .08);
    cursor: pointer;
}

    .device-collapse-button:focus-visible {
        outline: 3px solid rgba(61, 98, 135, .22);
        outline-offset: 2px;
    }

    .device-collapse-button svg {
        width: 16px;
        height: 16px;
    }

    .device-collapse-button.is-expanded svg {
        transform: rotate(180deg);
    }

.device-permissions-content {
    margin: 0;
    padding: .95rem;
    border: 1px solid #d9e2ea;
    border-top: 0;
    border-radius: 0 0 8px 8px;
    background: #ffffff;
}

    .device-permissions-content .permissions {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        gap: .85rem;
    }

    .device-permissions-content .permission-item {
        min-width: 72px;
        min-height: 72px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: .45rem;
        padding: .65rem;
        border: 1px solid #e0e6ec;
        border-radius: 10px;
        background: #f8fafc;
    }

        .device-permissions-content .permission-item img {
            width: 34px;
            height: 34px;
            object-fit: contain;
        }

        .device-permissions-content .permission-item .check {
            font-size: 18px;
        }

.permission-status-ok {
    color: #356b43 !important;
}

.permission-status-error {
    color: #8f3f3f !important;
}

.device-permissions-query-button {
    min-width: 118px;
    min-height: 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .55rem;
    padding: .55rem .85rem;
    border: 1px solid #2c4c6c;
    border-radius: 9px;
    background: #2c4c6c;
    color: #ffffff;
    font-size: 13px;
    font-weight: 700;
    cursor: pointer;
}

    .device-permissions-query-button svg {
        width: 17px;
        height: 17px;
    }

.device-permissions-header,
.device-permissions-content .permission-item,
.device-collapse-button,
.device-permissions-query-button {
    transition: transform .16s ease, background-color .16s ease, border-color .16s ease, box-shadow .16s ease, color .16s ease;
}

    .device-permissions-header:hover {
        border-color: #9db2c5;
        background: #e8f0f6;
        box-shadow: 0 4px 11px rgba(44, 76, 108, .08);
    }

    .device-permissions-content .permission-item:hover {
        transform: translateY(-2px);
        border-color: #a9bfd2;
        background: #eef5fa;
        box-shadow: 0 6px 13px rgba(44, 76, 108, .10);
    }

    .device-collapse-button:hover,
    .device-permissions-query-button:hover:not(:disabled) {
        transform: translateY(-1px);
        border-color: #31597f;
        background: #31597f;
        color: #ffffff;
        box-shadow: 0 5px 12px rgba(31, 62, 91, .16);
    }

    .device-permissions-query-button:disabled {
        cursor: wait;
        opacity: 1;
    }

    .device-permissions-query-button.is-loading {
        border-color: #aebdcb;
        background: #eef3f7;
        color: #2c4c6c;
    }

        .device-permissions-query-button.is-loading i {
            width: 17px;
            font-size: 15px;
            line-height: 1;
        }

@media (max-width: 767.98px) {
    .device-permissions-header {
        padding: .6rem .45rem .6rem .7rem;
    }

    .device-permissions-r1 .device-permissions-header > .col-auto.ms-auto {
        margin-left: auto !important;
        padding-right: 0 !important;
    }

    .device-permissions-r1 .device-collapse-button {
        margin-right: 0 !important;
    }

    .device-permissions-content {
        padding: .75rem;
    }

        .device-permissions-content .permissions {
            gap: .6rem;
        }

        .device-permissions-content .permission-item {
            min-width: 64px;
            min-height: 64px;
            padding: .5rem;
        }

    .device-permissions-query-button {
        width: 100%;
        margin-top: .75rem;
    }
}

.device-permissions-r1 {
    contain: layout style;
}

    .device-permissions-r1 .device-permissions-header {
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto;
        align-items: center;
        gap: .75rem;
    }

    .device-permissions-r1 .device-permissions-content .permissions {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(92px, 1fr));
        align-items: stretch;
        justify-content: stretch;
    }

    .device-permissions-r1 .device-permissions-content .permission-item {
        min-width: 0;
        width: 100%;
    }

@media (max-width: 575.98px) {
    .device-permissions-r1 .device-permissions-content .permissions {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .device-permissions-r1 .device-permissions-query-button {
        width: 100%;
    }
}
/* #endregion Device_Config_Permissions.razor */

/* #region Device_SOSButton.razor */
/**************************************** Device_SOSButton.razor ************************************************************************/
.cx-r1-device-sosbutton .cx-r1-sos-layout form {
    display: grid;
    gap: .75rem;
}

.cx-r1-device-sosbutton .cx-r1-sos-switch-row {
    display: grid;
    grid-template-columns: minmax(150px, 190px) auto minmax(0, 1fr);
    align-items: center;
    gap: .65rem 1rem;
}

.cx-r1-device-sosbutton .cx-r1-sos-switch-label label,
.cx-r1-device-sosbutton .cx-r1-sos-number-row > label {
    color: #52677a;
    font-size: .72rem;
    font-weight: 800;
    letter-spacing: .045em;
    line-height: 1.35;
    text-transform: uppercase;
    text-align: right;
}

    .cx-r1-device-sosbutton .cx-r1-sos-switch-label label::after,
    .cx-r1-device-sosbutton .cx-r1-sos-number-row > label::after {
        content: ":";
    }

.cx-r1-device-sosbutton .cx-r1-sos-switch-description {
    color: #667585;
    font-size: .84rem;
    line-height: 1.45;
}

.cx-r1-device-sosbutton .cx-r1-sos-number-row {
    display: grid;
    grid-template-columns: minmax(150px, 185px) minmax(220px, .9fr) minmax(320px, 1.55fr);
    align-items: center;
    gap: .65rem 1rem;
    margin-bottom: .75rem;
}

    .cx-r1-device-sosbutton .cx-r1-sos-number-row:last-child {
        margin-bottom: 0;
    }

.cx-r1-device-sosbutton .cx-r1-sos-last-updated {
    display: grid;
    gap: .2rem;
    padding: .8rem .95rem;
    border: 1px solid #d7e1ea;
    border-radius: 10px;
    background: #f2f8fb;
    color: #526170;
    font-size: .82rem;
}

.cx-r1-device-sosbutton .alert-email-form,
.cx-r1-device-sosbutton .alert-sms-form {
    margin-top: .85rem;
}

@media (max-width: 767.98px) {
    .cx-r1-device-sosbutton .cx-r1-sos-switch-row,
    .cx-r1-device-sosbutton .cx-r2-sos-number-columns {
        display: none;
    }

    .cx-r1-device-sosbutton .cx-r1-sos-number-row {
        grid-template-columns: minmax(0, 1fr);
        gap: .4rem;
    }

        .cx-r1-device-sosbutton .cx-r1-sos-switch-label label,
        .cx-r1-device-sosbutton .cx-r1-sos-number-row > label {
            text-align: left;
        }

    .cx-r1-device-sosbutton .cx-r1-sos-number-row {
        padding-bottom: .75rem;
        border-bottom: 1px solid #e4eaf0;
    }

        .cx-r1-device-sosbutton .cx-r1-sos-number-row:last-child {
            padding-bottom: 0;
            border-bottom: 0;
        }
}
/* #endregion Device_SOSButton.razor */

/* #region Device_LowBattery.razor */
/**************************************** Device_LowBattery.razor ************************************************************************/
/* CONEXGO-R2-COMPLEX-MODAL-SPACING */
.device-lowbattery-form {
    gap: 22px;
}

@media (max-width: 767.98px) {
    .device-lowbattery-form {
        gap: 16px;
    }
}
/* #endregion Device_LowBattery.razor */

/* #region Device_Geofence.razor */
/**************************************** Device_Geofence.razor ************************************************************************/
.cx-r1-device-geofence .device-geofence-tabs {
    margin: 4px 0 18px;
    padding: 5px;
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 7px;
    overflow-x: auto;
    border: 1px solid #dbe4ec;
    border-radius: 12px;
    background: #f6f9fb;
    scrollbar-width: thin;
    scrollbar-color: #a7b7c6 transparent;
}

.cx-r1-device-geofence .device-geofence-tab {
    min-width: 138px;
    min-height: 58px;
    padding: 8px 10px;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 7px;
    border: 1px solid transparent !important;
    border-radius: 9px 9px 7px 7px !important;
    background: transparent;
    color: #50657b;
    font-weight: 700;
    text-align: left;
    transition: background-color .16s ease, border-color .16s ease, color .16s ease, box-shadow .16s ease, transform .16s ease;
}

    .cx-r1-device-geofence .device-geofence-tab:hover:not(:disabled),
    .cx-r1-device-geofence .device-geofence-tab:focus-visible {
        border-color: #c5d4e1 !important;
        background: #ffffff;
        color: #2c4c6c;
        transform: translateY(-1px);
        outline: none;
    }

    .cx-r1-device-geofence .device-geofence-tab.active {
        border-color: #3e6a99 !important;
        background: #ffffff !important;
        color: #2c4c6c !important;
        box-shadow: inset 0 3px 0 #3e6a99, 0 4px 12px rgba(44, 76, 108, .10);
    }

.cx-r1-device-geofence .device-geofence-tab-number {
    color: #3e6a99;
    font-weight: 850;
}

.cx-r1-device-geofence .device-geofence-tab-name {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.cx-r1-device-geofence .device-geofence-tab-status {
    width: 26px;
    height: 26px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    font-size: 11px;
}

.cx-r1-device-geofence .device-geofence-tab-status-enabled {
    background: #eaf6ee;
    color: #3c8055;
}

.cx-r1-device-geofence .device-geofence-tab-status-disabled {
    background: #fff0f2;
    color: #b44c5b;
}

@media (max-width: 767.98px) {
    .cx-r1-device-geofence .device-geofence-tabs {
        grid-template-columns: repeat(5, 150px);
        scroll-snap-type: x proximity;
    }

    .cx-r1-device-geofence .device-geofence-tab {
        scroll-snap-align: start;
    }
}

@media (prefers-reduced-motion: reduce) {
    .cx-r1-device-geofence .device-geofence-tab {
        transition: none !important;
    }
}
/* CONEXGO-R2-COMPLEX-MODAL-SPACING */
.device-geofence-form {
    gap: 22px;
}

@media (max-width: 767.98px) {
    .device-geofence-form {
        gap: 16px;
    }
}
/* #endregion Device_Geofence.razor */

/* #region Geofence.razor */
/**************************************** Geofence.razor ************************************************************************/
.device-geofence-form {
    width: 100%;
    min-width: 0;
}

.device-geofence-configuration-card,
.device-geofence-recipients-card {
    width: 100%;
    min-width: 0;
    padding: 18px;
    border: 1px solid #d8e2ec;
    border-radius: 11px;
    background: #ffffff;
    box-shadow: 0 3px 12px rgba(44, 76, 108, .05);
}

.device-geofence-recipients-card {
    margin-top: 18px;
}

.device-geofence-card-header {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    margin-bottom: 17px;
}

.device-geofence-card-icon {
    width: 42px;
    height: 42px;
    min-width: 42px;
    display: inline-grid;
    place-items: center;
    border-radius: 10px;
    background: #eaf2f8;
    color: #315f8a;
    font-size: 17px;
}

.device-geofence-card-copy {
    min-width: 0;
    display: grid;
    gap: 3px;
}

    .device-geofence-card-copy > strong {
        color: #244563;
        font-size: 16px;
        line-height: 1.35;
        font-weight: 800;
    }

    .device-geofence-card-copy > span {
        color: #667585;
        font-size: 13.5px;
        line-height: 1.5;
    }

.cx-native-switch {
    position: relative;
    width: 52px;
    height: 30px;
    margin: 0 11px 0 0;
    display: inline-flex;
    flex: 0 0 52px;
    cursor: pointer;
}

    .cx-native-switch > input {
        position: absolute;
        width: 1px;
        height: 1px;
        opacity: 0;
        pointer-events: none;
    }

.cx-native-switch-track {
    position: relative;
    width: 52px;
    height: 30px;
    display: block;
    border: 1px solid #9eafbf;
    border-radius: 999px;
    background: #c9d4de;
    box-shadow: inset 0 1px 2px rgba(31, 62, 91, .10);
    transition: background-color .16s ease, border-color .16s ease, box-shadow .16s ease;
}

    .cx-native-switch-track::after {
        content: "";
        position: absolute;
        top: 3px;
        left: 3px;
        width: 22px;
        height: 22px;
        border-radius: 50%;
        background: #ffffff;
        box-shadow: 0 2px 5px rgba(31, 62, 91, .22);
        transition: transform .16s ease;
    }

.cx-native-switch > input:checked + .cx-native-switch-track {
    border-color: #315f8a;
    background: #315f8a;
}

    .cx-native-switch > input:checked + .cx-native-switch-track::after {
        transform: translateX(22px);
    }

.cx-native-switch > input:focus-visible + .cx-native-switch-track {
    box-shadow: 0 0 0 3px rgba(61, 98, 135, .18);
}

.cx-native-switch > input:disabled + .cx-native-switch-track {
    cursor: not-allowed;
    opacity: .58;
}

.cx-native-radio-card {
    position: relative;
    min-width: 0;
    display: block;
    cursor: pointer;
}

    .cx-native-radio-card > input {
        position: absolute;
        width: 1px;
        height: 1px;
        opacity: 0;
        pointer-events: none;
    }

    .cx-native-radio-card .device-geofence-radio-content {
        min-height: 78px;
        padding: 13px 15px 13px 48px;
        border: 1px solid #d5e0e9;
        border-radius: 10px;
        background: #f8fafc;
        transition: transform .16s ease, background-color .16s ease, border-color .16s ease, box-shadow .16s ease;
    }

        .cx-native-radio-card .device-geofence-radio-content::before {
            content: "";
            position: absolute;
            top: 50%;
            left: 16px;
            width: 20px;
            height: 20px;
            transform: translateY(-50%);
            border: 2px solid #9aabba;
            border-radius: 50%;
            background: #ffffff;
            box-shadow: inset 0 0 0 4px #ffffff;
        }

    .cx-native-radio-card:hover .device-geofence-radio-content {
        transform: translateY(-1px);
        border-color: #9fb7cb;
        background: #eef5fa;
        box-shadow: 0 5px 12px rgba(44, 76, 108, .08);
    }

    .cx-native-radio-card > input:checked + .device-geofence-radio-content {
        border-color: #3e6a99;
        background: #eaf2f8;
        box-shadow: 0 0 0 2px rgba(62, 106, 153, .10);
    }

        .cx-native-radio-card > input:checked + .device-geofence-radio-content::before {
            border-color: #315f8a;
            background: #315f8a;
            box-shadow: inset 0 0 0 4px #ffffff;
        }

.device-geofence-topbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 16px;
}

.device-geofence-switch-card {
    min-width: 220px;
    min-height: 46px;
    display: flex;
    align-items: center;
    padding: 8px 12px;
    border: 1px solid #dce4ed;
    border-radius: 8px;
    background: #f7f9fc;
}

.device-geofence-switch-label {
    color: #2c4c6c;
    font-size: 13px;
    font-weight: 800;
    line-height: 1.3;
}

.device-geofence-preview-button {
    min-height: 38px !important;
    padding: 7px 12px !important;
    border-color: #9eb2c5 !important;
    border-radius: 8px !important;
    background: #ffffff !important;
    color: #2c4c6c !important;
    font-size: 12.5px !important;
    font-weight: 800 !important;
    box-shadow: none !important;
    transition: background-color .15s ease, border-color .15s ease, color .15s ease !important;
}

    .device-geofence-preview-button:hover {
        border-color: #3d6287 !important;
        background: #edf3f8 !important;
    }

.device-geofence-preview-button {
    display: inline-grid !important;
    grid-auto-flow: column !important;
    place-items: center !important;
    gap: 8px !important;
    line-height: 1 !important;
}

    .device-geofence-preview-button i {
        margin: 0;
        line-height: 1;
    }

.device-geofence-configuration-layout {
    width: 100%;
    min-width: 0;
    display: flex;
    align-items: flex-start;
    gap: 16px;
}

.device-geofence-configuration-layout-with-preview {
    flex-direction: row;
}

.device-geofence-configuration-layout-without-preview {
    display: block;
}

.device-geofence-fields-column {
    min-width: 320px;
    flex: 1 1 0;
}

.device-geofence-fields-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(230px, .34fr);
    gap: 15px 16px;
}

.device-geofence-field {
    min-width: 0;
    display: grid;
    gap: 5px;
}

    .device-geofence-field > label {
        color: #2c4c6c;
        font-size: 12.5px;
        font-weight: 750;
        line-height: 1.3;
    }

    .device-geofence-field > small {
        color: #667085;
        font-size: 12px;
        line-height: 1.4;
    }

.device-geofence-field-full {
    grid-column: 1 / -1;
}

.device-geofence-map-card {
    position: relative;
    min-width: 0;
    overflow: hidden;
    border: 1px solid #d8e2ec;
    border-radius: 9px;
    background: #ffffff;
    box-shadow: 0 1px 3px rgba(44, 76, 108, .06);
}

.device-geofence-map-resizable {
    width: clamp(340px, 42%, 620px);
    min-width: 300px;
    max-width: calc(100% - 336px);
    height: 420px;
    min-height: 260px;
    max-height: 680px;
    flex: 0 0 auto;
    resize: both;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

    .device-geofence-map-resizable::after {
        content: "";
        position: absolute;
        right: 6px;
        bottom: 6px;
        width: 14px;
        height: 14px;
        pointer-events: none;
        opacity: .72;
        background: linear-gradient( 135deg, transparent 0 42%, rgba(44, 76, 108, .34) 43% 49%, transparent 50% 58%, rgba(44, 76, 108, .34) 59% 65%, transparent 66% );
    }

.device-geofence-map-header {
    min-height: 42px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 9px 12px;
    border-bottom: 1px solid #d8e2ec;
    background: #f3f6f9;
    color: #2c4c6c;
    font-size: 13px;
    font-weight: 800;
}

    .device-geofence-map-header > div {
        display: inline-flex;
        align-items: center;
        gap: 8px;
    }

    .device-geofence-map-header i {
        color: #3d6287;
    }

.device-geofence-map-close {
    border: 1px solid #d2dce5;
    background: #ffffff;
    color: #667085;
}

    .device-geofence-map-close:hover,
    .device-geofence-map-close:focus-visible {
        border-color: #9fb1c2;
        background: #edf3f8;
        color: #2c4c6c;
    }

.device-geofence-map-preview {
    width: 100%;
    min-height: 0;
    flex: 1 1 auto;
    background: #f5f7f9;
}

.device-geofence-direction {
    margin-top: 16px;
    padding: 14px;
    border: 1px solid #dce4ed;
    border-radius: 9px;
    background: #ffffff;
}

.device-geofence-section-label {
    margin-bottom: 9px;
    color: #2c4c6c;
    font-size: 13.5px;
    font-weight: 800;
}

.device-geofence-radio-group {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: stretch;
    gap: 10px;
}

.device-geofence-radio-content {
    display: grid;
    gap: 2px;
    padding: 3px 0;
}

.device-geofence-radio-title {
    color: #344054;
    font-size: 13.5px;
    font-weight: 750;
}

.device-geofence-radio-description {
    color: #667085;
    font-size: 12.5px;
    line-height: 1.45;
}

.device-geofence-recipients {
    margin-top: 16px;
}

.device-geofence-last-updated {
    margin-top: 16px;
    padding: 10px 12px;
    border: 1px solid #d6e0ea;
    border-left: 3px solid #7899b8;
    border-radius: 7px;
    background: #f4f7fa;
}

.device-geofence-last-updated-label {
    color: #2c4c6c;
    font-size: 12.5px;
    font-weight: 800;
}

.device-geofence-last-updated-value {
    margin-top: 2px;
    color: #344054;
    font-size: 12.5px;
    font-weight: 650;
}

.device-geofence-last-updated-by {
    margin-top: 2px;
    color: #667085;
    font-size: 12px;
}

@media (max-width: 991.98px) {
    .device-geofence-configuration-layout-with-preview {
        flex-direction: column;
    }

    .device-geofence-fields-column {
        width: 100%;
        min-width: 0;
    }

    .device-geofence-map-resizable {
        width: 100%;
        min-width: 0;
        max-width: 100%;
        height: 340px;
        min-height: 240px;
        max-height: 560px;
        resize: vertical;
    }
}

@media (max-width: 767.98px) {
    .device-geofence-topbar {
        align-items: stretch;
        flex-direction: column;
    }

    .device-geofence-switch-card {
        width: 100%;
        min-width: 0;
    }

    .device-geofence-preview-button {
        width: auto !important;
        align-self: flex-end;
    }

    .device-geofence-fields-grid {
        grid-template-columns: 1fr;
    }

    .device-geofence-field-full {
        grid-column: auto;
    }

    .device-geofence-radio-group {
        display: grid;
        gap: 6px;
    }

    .device-geofence-map-resizable {
        height: 300px;
        min-height: 220px;
        max-height: 500px;
    }
}
/* #endregion Geofence.razor */

/* #region Device_DOT.razor */
/**************************************** Device_DOT.razor ************************************************************************/
/* CONEXGO-R2-COMPLEX-MODAL-SPACING */
.device-dot-form {
    gap: 22px;
}

@media (max-width: 767.98px) {
    .device-dot-form {
        gap: 16px;
    }
}
/* #endregion Device_DOT.razor */

/* #region Device_SMS.razor */
/**************************************** Device_SMS.razor ************************************************************************/
/* CONEXGO-R2-COMPLEX-MODAL-SPACING */
.device-message-form {
    gap: 22px;
}

@media (max-width: 767.98px) {
    .device-message-form {
        gap: 16px;
    }
}
/* #endregion Device_SMS.razor */

/*********** GROUPS *******************/
/* #region Group_List.razor */
/**************************************** Group_List.razor ************************************************************************/
.conexgo-group-page-header,
.conexgo-group-page-actions {
    min-width: 0;
}

.conexgo-group-actions {
    display: inline-flex;
    align-items: center;
    justify-content: flex-start;
    flex-wrap: wrap;
    gap: 6px;
}

    .conexgo-group-actions .btn {
        float: none !important;
        display: inline-flex;
        align-items: center;
        justify-content: center;
    }

@media (max-width: 991.98px) {
    .conexgo-group-page-header {
        align-items: flex-start;
        flex-wrap: wrap;
        gap: 12px;
    }

    .conexgo-group-page-actions {
        width: 100%;
        display: flex;
        justify-content: flex-end;
        text-align: right !important;
    }

    .conexgo-group-add-container {
        display: flex !important;
        width: auto;
        padding: 0;
        justify-content: flex-end;
        text-align: right !important;
    }
}

.conexgo-group-page-header {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 18px;
}

.conexgo-group-page-actions,
.conexgo-group-add-container {
    margin-left: auto;
    display: flex !important;
    justify-content: flex-end;
    text-align: right !important;
}

@media (max-width: 575.98px) {
    .group-list-toolbar-row {
        grid-template-columns: minmax(0, 1fr) !important;
    }

    .group-list-toolbar-back {
        grid-column: 1 !important;
        grid-row: 1;
        justify-content: flex-end;
    }

    .group-list-toolbar-search {
        grid-column: 1 !important;
        grid-row: 2;
    }

    .group-list-toolbar-back .btn,
    .group-list-toolbar-back button,
    .group-list-toolbar-back a {
        width: 42px;
        height: 42px;
        border-radius: 12px;
    }
}

.group-list-card {
    overflow: hidden;
}

.group-list-toolbar {
    min-height: 72px;
    margin: 0 !important;
    padding: 12px 16px;
    display: flex;
    align-items: center;
    border: 0;
    border-radius: 0;
    background: #2c4c6c;
}

.group-list-toolbar-row {
    width: 100%;
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(280px, 480px);
    align-items: center;
    gap: 12px;
}

.group-list-toolbar-back {
    min-width: 0;
    display: flex;
    align-items: center;
}

.group-list-toolbar-search {
    width: 100%;
    min-width: 0;
    grid-column: 2;
}

    .group-list-toolbar-search .dataTables_filter,
    .group-list-toolbar-search .dataTables_filter > label {
        width: 100%;
        margin: 0;
        display: block;
        text-align: right;
    }

.group-list-sorting {
    min-height: 40px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    color: #ffffff;
}

.group-list-card-body {
    padding-top: 1rem;
}

@media (max-width: 991.98px) {
    .group-list-toolbar {
        min-height: 62px;
        padding: 10px 12px;
    }

    .group-list-toolbar-row {
        grid-template-columns: auto minmax(0, 1fr);
        gap: 10px;
    }

    .group-list-toolbar-search {
        grid-column: 2;
    }
}

@media (max-width: 575.98px) {
    .group-list-toolbar {
        padding: 9px 10px;
    }
}
/* #endregion Group_List.razor */

/* #region Group_AddEditName.razor */
/**************************************** Group_AddEditName.razor ************************************************************************/
/* CONEXGO-MODAL-DEVICE-CONFIG-REBUILD-R1: local to this component */
.cx-r1-group-addeditname .cx-modal-layout-v21 {
    width: 100%;
    display: grid;
    gap: 22px;
}

.cx-r1-group-addeditname .cx-r1-section {
    min-width: 0;
    margin: 0;
    padding: .85rem .95rem .95rem;
    border: 1px solid #d7e1ea;
    border-radius: 12px;
    background: #ffffff;
    box-shadow: 0 4px 14px rgba(35, 60, 85, .045);
}

.cx-r1-group-addeditname .cx-r1-section-title {
    max-width: calc(100% - 1rem);
    display: inline-flex;
    align-items: center;
    gap: .55rem;
    margin: 0 0 .15rem;
    padding: 0 .45rem;
    color: #2c4c6c;
    font-size: .92rem;
    font-weight: 800;
    line-height: 1.35;
}

.cx-r1-group-addeditname .cx-r1-section-icon {
    width: 28px;
    height: 28px;
    min-width: 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    background: #edf3f8;
    color: #3d6287;
    font-size: .78rem;
}

.cx-r1-group-addeditname .cx-r1-section-description {
    display: flex;
    align-items: flex-start;
    gap: .45rem;
    margin: .1rem 0 .75rem;
    color: #687787;
    font-size: .82rem;
    line-height: 1.5;
}

    .cx-r1-group-addeditname .cx-r1-section-description > i {
        margin-top: .22rem;
        color: #6d88a2;
        font-size: .72rem;
    }

.cx-r1-group-addeditname .cx-r1-form-row {
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(175px, 225px) minmax(0, 1fr);
    align-items: start;
    gap: .45rem .9rem;
    margin: 0 0 .75rem;
}

    .cx-r1-group-addeditname .cx-r1-form-row:last-child {
        margin-bottom: 0;
    }

    .cx-r1-group-addeditname .cx-r1-form-row > [class*="col-"] {
        width: auto;
        max-width: none;
        min-width: 0;
        margin: 0;
        padding: 0;
    }

    .cx-r1-group-addeditname .cx-r1-form-row > .form-label {
        padding-top: .62rem;
        text-align: right !important;
    }

.cx-r1-group-addeditname .form-label > label:not(.custom-switch),
.cx-r1-group-addeditname label[aspfor] {
    color: #52677a;
    font-size: .72rem;
    font-weight: 800;
    letter-spacing: .045em;
    line-height: 1.35;
    text-transform: uppercase;
}

    .cx-r1-group-addeditname .form-label > label:not(.custom-switch)::after,
    .cx-r1-group-addeditname label[aspfor]::after {
        content: ":";
    }

.cx-r1-group-addeditname input.form-control,
.cx-r1-group-addeditname select.form-control,
.cx-r1-group-addeditname textarea.form-control {
    width: 100%;
    min-width: 0;
    border-color: #cfd9e3;
    border-radius: 8px;
    box-shadow: none;
}

.cx-r1-group-addeditname textarea.form-control,
.cx-r1-group-addeditname .cx-dialog-textarea {
    width: 100%;
    height: 132px;
    min-height: 84px !important;
    max-height: none !important;
    resize: both !important;
    overflow: auto !important;
}

.cx-r1-group-addeditname input:disabled,
.cx-r1-group-addeditname select:disabled,
.cx-r1-group-addeditname textarea:disabled {
    background: #f3f6f8;
    color: #526170;
    opacity: 1;
}

@media (max-width: 767.98px) {
    .cx-r1-group-addeditname .cx-r1-section {
        padding: .85rem;
    }

    .cx-r1-group-addeditname .cx-r1-form-row {
        grid-template-columns: minmax(0, 1fr);
        gap: .35rem;
        margin-bottom: .85rem;
    }

        .cx-r1-group-addeditname .cx-r1-form-row > .form-label {
            padding-top: 0;
            text-align: left !important;
        }

    .cx-r1-group-addeditname .cx-r1-section-description {
        margin-bottom: .8rem;
    }
}
/* CONEXGO-R2-MANUAL-FIELDSET-SPACING */
.cx-r1-group-addeditname .cx-modal-layout-v21,
.cx-r1-group-addeditname form.cx-dialog-v17-form {
    display: grid;
    gap: 22px;
}

.cx-r1-group-addeditname .cx-r1-section + .cx-r1-section,
.cx-r1-group-addeditname fieldset + fieldset {
    margin-top: 0;
}

@media (max-width: 767.98px) {
    .cx-r1-group-addeditname .cx-modal-layout-v21,
    .cx-r1-group-addeditname form.cx-dialog-v17-form {
        gap: 16px;
    }
}
/* #endregion Group_AddEditName.razor */
/*********** ALERTS *******************/
/* #region Alert_List.razor */
/**************************************** Alert_List.razor ************************************************************************/
.alert-filter-panel {
    background: #f8fafc;
    border-bottom: 1px solid #e5eaf1;
}

.alert-filter-inline {
    float: none !important;
    width: 100%;
    max-width: 100%;
    min-height: 46px;
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: flex-start;
    gap: 18px;
    padding: 10px 16px;
    white-space: nowrap;
    overflow: visible;
    font-size: 15px;
    font-weight: 500;
    color: #28304f;
}

    .alert-filter-inline label {
        display: inline-flex;
        align-items: center;
        gap: 7px;
        margin: 0;
        padding: 0;
        white-space: nowrap;
        flex: 0 0 auto;
    }

    .alert-filter-inline input[type="checkbox"] {
        width: 16px;
        height: 16px;
        margin: 0;
        flex: 0 0 auto;
        cursor: pointer;
    }

@media (max-width: 1200px) {
    .alert-filter-inline {
        gap: 12px;
        font-size: 14px;
        padding-inline: 10px;
    }

        .alert-filter-inline label {
            gap: 5px;
        }

        .alert-filter-inline input[type="checkbox"] {
            width: 15px;
            height: 15px;
        }
}

@media (max-width: 992px) {
    .alert-filter-inline {
        gap: 8px;
        font-size: 13px;
    }

        .alert-filter-inline input[type="checkbox"] {
            width: 14px;
            height: 14px;
        }
}

.conexgo-list-page-header-row,
.conexgo-list-page-actions {
    min-width: 0;
}

@media (min-width: 992px) {
    .conexgo-list-page-header-row {
        width: 100%;
        justify-content: space-between;
    }

    .conexgo-list-page-actions {
        width: auto;
        margin-left: auto;
        justify-content: flex-end;
    }

    .conexgo-alert-download-row,
    .conexgo-alert-download-row > [class*="col-"],
    .conexgo-alert-download-row .dataTables_length,
    .conexgo-alert-download-row .dataTables_filter,
    .conexgo-alert-download-row .d-inline-flex {
        width: auto;
        min-width: 0;
        max-width: none;
        margin: 0 !important;
        padding: 0 !important;
    }
}

@media (max-width: 991.98px) {
    .conexgo-list-page-header {
        display: block !important;
        margin-bottom: 14px;
    }

    .conexgo-list-page-header-row {
        align-items: flex-start !important;
        flex-wrap: wrap;
        gap: 12px;
    }

    .conexgo-list-page-actions {
        width: auto !important;
        min-width: 0 !important;
        max-width: none !important;
        min-height: 36px !important;
        margin-left: auto !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: flex-end !important;
        flex-wrap: nowrap !important;
        visibility: visible !important;
        opacity: 1 !important;
        overflow: visible !important;
    }

    .conexgo-alert-desktop-title {
        display: block;
        min-width: 0;
    }

    .conexgo-alert-mobile-duplicate-title,
    .conexgo-alert-mobile-duplicate-back {
        display: none !important;
    }

    .conexgo-alert-download-row {
        width: auto !important;
        min-width: 0 !important;
        max-width: none !important;
        margin: 0 !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: flex-end !important;
        flex-wrap: nowrap !important;
        gap: 6px !important;
        visibility: visible !important;
        opacity: 1 !important;
        overflow: visible !important;
    }

    .alert-filter-panel {
        display: flex !important;
        margin-inline: 0;
    }

    .alert-filter-inline {
        justify-content: flex-start;
        flex-wrap: wrap;
        white-space: normal;
        overflow: visible;
        gap: 10px 14px;
    }
}

.conexgo-alert-download-row {
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    margin: 0;
}

.conexgo-alert-download-button {
    min-height: 40px;
    padding: 0 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    border-radius: 7px;
    font-weight: 700;
    line-height: 1;
    white-space: nowrap;
}

    .conexgo-alert-download-button i {
        margin: 0;
        font-size: 14px;
        line-height: 1;
    }

@media (max-width: 575.98px) {
    .conexgo-alert-download-row {
        gap: 6px;
    }

    .conexgo-alert-download-button {
        width: 36px;
        height: 36px;
        min-width: 36px;
        min-height: 36px;
        max-width: 36px;
        padding: 0;
        display: inline-grid;
        place-items: center;
        gap: 0;
        line-height: 0;
        overflow: hidden;
    }

        .conexgo-alert-download-button span {
            position: absolute;
            width: 1px;
            height: 1px;
            margin: -1px;
            overflow: hidden;
            clip: rect(0, 0, 0, 0);
            white-space: nowrap;
            border: 0;
        }

        .conexgo-alert-download-button i {
            font-size: 15px;
        }

    .conexgo-list-page-actions .d-inline-flex {
        width: auto;
        margin-left: 0 !important;
        flex-wrap: nowrap !important;
        gap: 6px !important;
    }

    .conexgo-list-page-actions .btn {
        flex: 0 0 36px;
        min-width: 36px;
        max-width: 36px;
        white-space: nowrap;
    }
}

.alert-list-card {
    overflow: hidden;
}

.alert-list-toolbar {
    width: 100%;
    margin: 0;
    padding: 12px 14px;
    border: 0;
    border-radius: 8px 8px 0 0;
    background: #2c4c6c;
}

.alert-list-toolbar-row {
    width: 100%;
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(280px, 480px);
    align-items: center;
    gap: 12px;
}

.alert-list-back-slot {
    min-width: 0;
    display: none;
    align-items: center;
}

.alert-list-toolbar-filters {
    min-width: 0;
    grid-column: 1;
}

    .alert-list-toolbar-filters .conexgo-responsive-filter-panel,
    .alert-list-toolbar-filters .conexgo-responsive-filter-content {
        min-width: 0;
    }

    .alert-list-toolbar-filters .alert-filter-panel {
        margin: 0 !important;
        border: 0;
        background: transparent;
    }

    .alert-list-toolbar-filters .alert-filter-inline {
        min-height: 40px;
        padding: 0;
        justify-content: flex-start;
        gap: 10px 14px;
        color: #ffffff;
        font-size: 13px;
    }

        .alert-list-toolbar-filters .alert-filter-inline label {
            color: #ffffff;
        }

.alert-list-search {
    width: 100%;
    min-width: 0;
    grid-column: 2;
}

    .alert-list-search .dataTables_filter,
    .alert-list-search .dataTables_filter > label {
        width: 100%;
        margin: 0;
        display: block;
        text-align: right;
    }

.alert-list-card-body {
    padding-top: 0;
}

@media (max-width: 767.98px) {
    .alert-list-toolbar {
        padding: 10px;
    }

    .alert-list-toolbar-row {
        grid-template-columns: 40px minmax(0, 1fr);
        grid-template-rows: auto auto;
        gap: 9px;
    }

    .alert-list-back-slot {
        display: flex !important;
        grid-column: 1;
        grid-row: 1;
    }

    .alert-list-search {
        grid-column: 2 !important;
        grid-row: 1;
    }

    .alert-list-toolbar-filters {
        grid-column: 1 / -1;
        grid-row: 2;
    }

        .alert-list-toolbar-filters .conexgo-responsive-filter-toggle {
            border-radius: 8px;
        }

        .alert-list-toolbar-filters .conexgo-responsive-filter-content.is-open {
            margin-top: 8px;
            border-radius: 8px;
            background: #ffffff;
            overflow: hidden;
        }

        .alert-list-toolbar-filters .alert-filter-panel {
            background: #ffffff;
        }

        .alert-list-toolbar-filters .alert-filter-inline,
        .alert-list-toolbar-filters .alert-filter-inline label {
            color: #28304f;
        }
}
/* Use the available width on small screens. */
@media (max-width: 575.98px) {
    .conexgo-list-page-header,
    .alert-list-card,
    .alert-list-card-body,
    .alert-list-card-body > .row,
    .alert-list-card-body .dataTables_wrapper,
    .alert-list-card-body .cx-paged-list,
    .alert-list-card-body .conexgo-pagedlist-mobile-cards {
        width: 100% !important;
        max-width: none !important;
        min-width: 0 !important;
        margin-inline: 0 !important;
    }

    .alert-list-card {
        border-radius: 10px !important;
    }

    .alert-list-card-body {
        padding: 0 0 calc(92px + env(safe-area-inset-bottom, 0px)) !important;
        overflow: visible !important;
    }

        .alert-list-card-body .conexgo-pagedlist-mobile-card,
        .alert-list-card-body .cx-mobile-card,
        .alert-list-card-body table tbody tr {
            width: 100% !important;
            max-width: none !important;
            min-width: 0 !important;
            margin-inline: 0 !important;
            box-sizing: border-box !important;
        }

        .alert-list-card-body table,
        .alert-list-card-body tbody {
            width: 100% !important;
            max-width: 100% !important;
        }

    .alert-list-toolbar {
        border-radius: 10px 10px 0 0 !important;
    }
}

.conexgo-alert-init-error {
    width: min(560px, calc(100% - 32px));
    margin: 48px auto;
    padding: 20px;
    display: flex;
    align-items: flex-start;
    gap: 14px;
    border: 1px solid #e2c8c8;
    border-radius: 12px;
    background: #fff;
    box-shadow: 0 10px 28px rgba(15, 23, 42, .08);
}

.conexgo-alert-init-error-icon {
    width: 40px;
    height: 40px;
    flex: 0 0 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: #fcecec;
    color: #9d3d3d;
}

.conexgo-alert-init-error-content {
    min-width: 0;
    flex: 1 1 auto;
}

.conexgo-alert-init-error-text {
    margin-bottom: 12px;
    color: #5f6b7a;
    font-size: 9pt;
    line-height: 1.45;
    overflow-wrap: anywhere;
}

@media (max-width: 575.98px) {
    .conexgo-alert-init-error {
        margin: 24px auto;
        padding: 16px;
    }
}

/* #endregion Alert_List.razor */

/* #region Alert_View.razor */
/**************************************** Alert_View.razor ************************************************************************/
.alert-view-sheet {
    color: #2f3d52;
}

.alert-view-topline {
    display: block;
    margin-bottom: 12px;
}

.alert-view-status {
    display: none;
}

.alert-view-summary {
    flex: 1;
    min-width: 0;
    border: 3px solid var(--alert-color);
    border-radius: 9px;
    background: #ffffff;
    box-shadow: 0 1px 3px rgba(23, 43, 77, .07);
    padding: 11px 13px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.alert-view-summary-main {
    min-width: 0;
}

.alert-view-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: var(--alert-color);
    color: #ffffff;
    border-radius: 999px;
    padding: 3px 10px;
    font-size: 14px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .3px;
    margin-bottom: 6px;
}

.alert-view-device-title {
    font-size: 14.5pt;
    font-weight: 800;
    color: #2c4c6c;
    line-height: 1.25;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.alert-view-account-subtitle {
    margin-top: 2px;
    font-size: 14px;
    color: #596779;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.alert-view-time-block {
    min-width: fit-content;
    text-align: right;
    color: #495057;
    font-size: 14px;
    line-height: 1.35;
}

.alert-view-time-label {
    font-weight: 800;
    color: #2c4c6c;
}

.alert-view-table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    border: 1px solid #dfe6ee;
    border-radius: 10px;
    overflow: hidden;
    background: #ffffff;
    margin-bottom: 10px;
    font-size: 14px;
    line-height: 1.5;
}

    .alert-view-table tr:not(:last-child) td,
    .alert-view-table tr:not(:last-child) th {
        border-bottom: 1px solid #edf1f5;
    }

    .alert-view-table th {
        width: 132px;
        padding: 9px 10px;
        background: #f8fafc;
        color: #2c4c6c;
        font-size: 14px;
        font-weight: 800;
        vertical-align: top;
        white-space: nowrap;
    }

    .alert-view-table td {
        padding: 9px 11px;
        color: #253858;
        font-weight: 500;
        line-height: 1.5;
        vertical-align: top;
    }

@media (hover: hover) {
    .alert-view-table tbody tr {
        transition: background-color .16s ease, box-shadow .16s ease;
    }

        .alert-view-table tbody tr:hover > th,
        .alert-view-table tbody tr:hover > td {
            background: #f3f7fa !important;
        }

        .alert-view-table tbody tr:hover {
            box-shadow: none !important;
        }
}

.alert-view-inline-list {
    display: flex;
    align-items: flex-start;
    gap: 18px;
    flex-wrap: wrap;
}

.alert-view-field {
    min-width: 120px;
    display: inline-flex;
    align-items: baseline;
    gap: 5px;
    line-height: 1.5;
}

.alert-view-field-label {
    color: #2c4c6c;
    font-weight: 800;
    white-space: nowrap;
}

.alert-view-field-value {
    color: #253858;
    font-weight: 500;
    word-break: break-word;
}

.alert-view-comments {
    max-height: 92px;
    overflow-y: auto;
    line-height: 1.55;
}

.alert-view-count-badge {
    min-width: 18px;
    height: 18px;
    padding: 0 6px;
    border-radius: 999px;
    background: #e74c3c;
    color: #ffffff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    font-weight: 900;
    line-height: 1;
}

.alert-view-panel {
    border-radius: 10px;
    padding: 12px;
    margin-bottom: 10px;
    line-height: 1.65;
    font-size: 14px;
}

.alert-view-panel-danger {
    border: 2px solid #f1c4be;
    background: #fdecea;
    color: #922b21;
}

.alert-view-panel-info {
    border: 1px solid #c6dcef;
    background: #eaf2fa;
    color: #495057;
}

.alert-view-panel-title {
    display: flex;
    align-items: center;
    gap: 7px;
    margin-bottom: 7px;
    font-size: 14.5px;
    font-weight: 800;
}

.alert-view-panel-danger .alert-view-panel-title {
    color: #c0392b;
}

.alert-view-panel-info .alert-view-panel-title {
    color: #2c4c6c;
}

.alert-view-comments-section {
    margin-bottom: 10px;
    overflow: hidden;
    border: 1px solid #d9e2ec;
    border-radius: 10px;
    background: #ffffff;
}

.alert-view-comments-toggle {
    width: 100%;
    min-height: 46px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 14px;
    border: 0;
    background: #f8fafc;
    color: #2c4c6c;
    font-size: 14px;
    font-weight: 800;
    line-height: 1.2;
    text-align: left;
    cursor: pointer;
}

    .alert-view-comments-toggle:hover,
    .alert-view-comments-toggle:focus {
        background: #f1f5f9;
        color: #2c4c6c;
    }

    .alert-view-comments-toggle:focus-visible {
        outline: 3px solid rgba(61, 98, 135, .20);
        outline-offset: -3px;
    }

.alert-view-comments-toggle-main,
.alert-view-comments-toggle-meta {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.alert-view-comments-toggle-main {
    min-width: 0;
}

    .alert-view-comments-toggle-main > span {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

.alert-view-comments-toggle-meta {
    flex: 0 0 auto;
}

.alert-view-comments-chevron {
    color: #5f7188;
    font-size: 12px;
    transition: transform .18s ease;
}

.alert-view-comments-section.is-expanded .alert-view-comments-chevron {
    transform: rotate(180deg);
}

.alert-view-comments-collapse {
    display: grid;
    grid-template-rows: 0fr;
    opacity: 0;
    transition: grid-template-rows .22s ease, opacity .18s ease;
}

.alert-view-comments-collapse-inner {
    min-height: 0;
    overflow: hidden;
}

.alert-view-comments-section.is-expanded .alert-view-comments-collapse {
    grid-template-rows: 1fr;
    opacity: 1;
}

.alert-view-comments-body {
    padding: 12px 16px;
    border-top: 1px solid #e4eaf0;
    background: #ffffff;
    color: #353f5c;
}

.alert-view-comment-panel-content {
    max-height: 150px;
    overflow-y: auto;
    line-height: 1.7;
    font-size: 14px;
}

.alert-view-comments-empty {
    color: #6c757d;
    font-size: 14px;
}

.alert-view-map-wrap {
    border: 1px solid #dfe6ee;
    border-radius: 10px;
    overflow: hidden;
    background: #f8f9fa;
}

.alert-view-map-toolbar {
    min-height: 38px;
    padding: 8px 11px;
    background: #ffffff;
    border-bottom: 1px solid #edf1f5;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.alert-view-map-title {
    display: flex;
    align-items: center;
    gap: 7px;
    color: #2c4c6c;
    font-size: 14px;
    font-weight: 800;
}

.alert-view-map-meta {
    color: #6c757d;
    font-size: 14px;
    white-space: nowrap;
}

    .alert-view-map-meta:empty {
        display: none !important;
    }

.alert-view-map-canvas {
    width: 100%;
    height: 430px;
    min-height: 320px;
    position: relative;
    background: #f8f9fa;
    color: #6c757d;
}

.alert-view-map-status {
    min-height: 430px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
    color: #6c757d;
    text-align: center;
}

    .alert-view-map-status.is-error {
        color: #9c3e46;
    }

.alert-view-footer-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin-top: 9px;
    margin-bottom: 14px;
    padding-top: 9px;
    border-top: 1px solid #edf1f5;
    scroll-margin-bottom: 110px;
}

/* Keep map status and metadata visible inside the dialog. */
.cx-r1-alert-view .cx-dialog-v17-content {
    padding-bottom: 26px !important;
    scroll-padding-bottom: 110px;
}

.alert-view-chip {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    background: #f1f3f5;
    color: #6c757d;
    border-radius: 999px;
    padding: 4px 10px;
    font-size: 14px;
    font-weight: 700;
}

.alert-view-empty {
    border: 1px dashed #d9e2ec;
    border-radius: 10px;
    padding: 22px;
    background: #f8f9fa;
    color: #6c757d;
    text-align: center;
    font-size: 14.5px;
}

@media (max-width: 767.98px) {
    .alert-view-summary {
        align-items: flex-start;
        flex-direction: column;
    }

    .alert-view-time-block {
        text-align: left;
        width: 100%;
    }

    .alert-view-table,
    .alert-view-table tbody,
    .alert-view-table tr,
    .alert-view-table th,
    .alert-view-table td {
        display: block;
        width: 100%;
    }

        .alert-view-table th {
            border-bottom: 1px solid #edf1f5;
        }

    .alert-view-inline-list {
        gap: 8px;
        flex-direction: column;
    }

    .alert-view-field {
        width: 100%;
    }

    .alert-view-map-toolbar {
        align-items: flex-start;
        flex-direction: column;
    }

    .alert-view-map-canvas,
    .alert-view-map-status {
        height: 320px;
        min-height: 320px;
    }
}

/* CX-MODAL-TITLE-ICON:BEGIN */
/* CX-MODAL-TITLE-ICON:END */
/* Component-specific modal layout. */
.cx-r1-alert-view .cx-modal-layout-v21 {
    width: 100%;
    display: grid;
    gap: 22px;
}

.cx-r1-alert-view .cx-r1-section {
    min-width: 0;
    margin: 0;
    padding: .85rem .95rem .95rem;
    border: 1px solid #d7e1ea;
    border-radius: 12px;
    background: #ffffff;
    box-shadow: 0 4px 14px rgba(35, 60, 85, .045);
}

.cx-r1-alert-view .cx-r1-section-title {
    max-width: calc(100% - 1rem);
    display: inline-flex;
    align-items: center;
    gap: .55rem;
    margin: 0 0 .15rem;
    padding: 0 .45rem;
    color: #2c4c6c;
    font-size: .92rem;
    font-weight: 800;
    line-height: 1.35;
}

.cx-r1-alert-view .cx-r1-section-icon {
    width: 28px;
    height: 28px;
    min-width: 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    background: #edf3f8;
    color: #3d6287;
    font-size: .78rem;
}

.cx-r1-alert-view .cx-r1-section-description {
    display: flex;
    align-items: flex-start;
    gap: .45rem;
    margin: .1rem 0 .75rem;
    color: #687787;
    font-size: .82rem;
    line-height: 1.5;
}

    .cx-r1-alert-view .cx-r1-section-description > i {
        margin-top: .22rem;
        color: #6d88a2;
        font-size: .72rem;
    }

.cx-r1-alert-view .cx-r1-form-row {
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(175px, 225px) minmax(0, 1fr);
    align-items: start;
    gap: .45rem .9rem;
    margin: 0 0 .75rem;
}

    .cx-r1-alert-view .cx-r1-form-row:last-child {
        margin-bottom: 0;
    }

    .cx-r1-alert-view .cx-r1-form-row > [class*="col-"] {
        width: auto;
        max-width: none;
        min-width: 0;
        margin: 0;
        padding: 0;
    }

    .cx-r1-alert-view .cx-r1-form-row > .form-label {
        padding-top: .62rem;
        text-align: right !important;
    }

.cx-r1-alert-view .form-label > label:not(.custom-switch),
.cx-r1-alert-view label[aspfor] {
    color: #52677a;
    font-size: .72rem;
    font-weight: 800;
    letter-spacing: .045em;
    line-height: 1.35;
    text-transform: uppercase;
}

    .cx-r1-alert-view .form-label > label:not(.custom-switch)::after,
    .cx-r1-alert-view label[aspfor]::after {
        content: ":";
    }

.cx-r1-alert-view input.form-control,
.cx-r1-alert-view select.form-control,
.cx-r1-alert-view textarea.form-control {
    width: 100%;
    min-width: 0;
    border-color: #cfd9e3;
    border-radius: 8px;
    box-shadow: none;
}

.cx-r1-alert-view textarea.form-control,
.cx-r1-alert-view .cx-dialog-textarea {
    width: 100%;
    height: 132px;
    min-height: 84px !important;
    max-height: none !important;
    resize: both !important;
    overflow: auto !important;
}

.cx-r1-alert-view input:disabled,
.cx-r1-alert-view select:disabled,
.cx-r1-alert-view textarea:disabled {
    background: #f3f6f8;
    color: #526170;
    opacity: 1;
}

@media (max-width: 767.98px) {
    .cx-r1-alert-view .cx-r1-section {
        padding: .85rem;
    }

    .cx-r1-alert-view .cx-r1-form-row {
        grid-template-columns: minmax(0, 1fr);
        gap: .35rem;
        margin-bottom: .85rem;
    }

        .cx-r1-alert-view .cx-r1-form-row > .form-label {
            padding-top: 0;
            text-align: left !important;
        }

    .cx-r1-alert-view .cx-r1-section-description {
        margin-bottom: .8rem;
    }
}
/* Fieldset spacing. */
.cx-r1-alert-view .cx-modal-layout-v21,
.cx-r1-alert-view form.cx-dialog-v17-form {
    display: grid;
    gap: 22px;
}

.cx-r1-alert-view .cx-r1-section + .cx-r1-section,
.cx-r1-alert-view fieldset + fieldset {
    margin-top: 0;
}

@media (max-width: 767.98px) {
    .cx-r1-alert-view .cx-modal-layout-v21,
    .cx-r1-alert-view form.cx-dialog-v17-form {
        gap: 16px;
    }
}
/* #endregion Alert_View.razor */

/* #region Alert_Answer.razor */
/**************************************** Alert_Answer.razor ************************************************************************/
.alert-answer-sheet {
    color: #2f3d52;
}

.alert-answer-topline {
    display: block;
    margin-bottom: 12px;
}

.alert-answer-status {
    display: none;
}

.alert-answer-summary {
    flex: 1;
    min-width: 0;
    padding: 9px 11px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 11px;
    border: 2px solid var(--alert-color);
    border-radius: 7px;
    background: #ffffff;
    box-shadow: 0 1px 3px rgba(23, 43, 77, .07);
}

.alert-answer-summary-main {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 11px;
}

.alert-answer-device-image {
    width: 36px;
    height: 36px;
    min-width: 36px;
    border: 1px solid #dfe6ee;
    border-radius: 8px;
    background: #f6f8fa;
    object-fit: contain;
    padding: 3px;
}

.alert-answer-summary-copy {
    min-width: 0;
}

.alert-answer-badge {
    width: fit-content;
    max-width: 100%;
    margin-bottom: 4px;
    padding: 2px 8px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    overflow: hidden;
    border-radius: 999px;
    background: var(--alert-color);
    color: #ffffff;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .3px;
    line-height: 1.2;
    text-overflow: ellipsis;
    text-transform: uppercase;
    white-space: nowrap;
}

.alert-answer-device-title {
    overflow: hidden;
    color: #2c4c6c;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.25;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.alert-answer-account-subtitle {
    margin-top: 2px;
    overflow: hidden;
    color: #6c757d;
    font-size: 11.5px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.alert-answer-time-block {
    min-width: fit-content;
    color: #495057;
    font-size: 11.5px;
    line-height: 1.35;
    text-align: right;
}

.alert-answer-time-label {
    color: #2c4c6c;
    font-weight: 800;
}

.alert-answer-table {
    width: 100%;
    margin-bottom: 10px;
    overflow: hidden;
    border: 1px solid #b8c7d6;
    border-collapse: separate;
    border-radius: 10px;
    border-spacing: 0;
    background: #ffffff;
    font-size: 12px;
    line-height: 1.4;
}

    .alert-answer-table tr:not(:last-child) th,
    .alert-answer-table tr:not(:last-child) td {
        border-bottom: 1px solid #d7e0e8;
    }

    .alert-answer-table th {
        width: 116px;
        padding: 7px 9px;
        background: #f8fafc;
        color: #2c4c6c;
        font-size: 11.5px;
        font-weight: 700;
        vertical-align: top;
        white-space: nowrap;
    }

    .alert-answer-table td {
        padding: 7px 9px;
        color: #253858;
        font-weight: 400;
        line-height: 1.5;
        vertical-align: top;
    }

.alert-answer-inline-list {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    flex-wrap: wrap;
}

.alert-answer-field {
    min-width: 120px;
    display: inline-flex;
    align-items: baseline;
    gap: 5px;
    line-height: 1.5;
}

.alert-answer-field-label {
    color: #2c4c6c;
    font-weight: 700;
    white-space: nowrap;
}

.alert-answer-field-value {
    color: #253858;
    font-weight: 500;
    overflow-wrap: anywhere;
}

.alert-answer-comment-card {
    margin-bottom: 10px;
    overflow: hidden;
    border: 1px solid #b8c7d6;
    border-radius: 10px;
    background: #ffffff;
}

.alert-answer-comment-header {
    min-height: 36px;
    padding: 7px 10px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    border-bottom: 1px solid #cbd6e0;
    background: #f8fafc;
}

.alert-answer-comment-title {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 7px;
    color: #2c4c6c;
    font-size: 11px;
    font-weight: 700;
}

.alert-answer-comment-header-actions {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.alert-answer-comment-collapse-button {
    width: 30px;
    height: 30px;
    min-width: 30px;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #cedae5;
    border-radius: 8px;
    background: #ffffff;
    color: #315879;
    box-shadow: none;
    cursor: pointer;
    transition: background-color .18s ease, border-color .18s ease, color .18s ease;
}

    .alert-answer-comment-collapse-button:hover,
    .alert-answer-comment-collapse-button:focus-visible {
        border-color: #adc1d2;
        background: #eef5fa;
        color: #244b6e;
        outline: none;
    }

    .alert-answer-comment-collapse-button i {
        transition: transform .26s cubic-bezier(.22, 1, .36, 1);
    }

    .alert-answer-comment-collapse-button.is-open i {
        transform: rotate(180deg);
    }

.alert-answer-comment-collapse {
    display: grid;
    grid-template-rows: 0fr;
    opacity: 0;
    visibility: hidden;
    transition: grid-template-rows .28s cubic-bezier(.22, 1, .36, 1), opacity .18s ease, visibility 0s linear .28s;
}

    .alert-answer-comment-collapse.is-open {
        grid-template-rows: 1fr;
        opacity: 1;
        visibility: visible;
        transition: grid-template-rows .28s cubic-bezier(.22, 1, .36, 1), opacity .2s ease, visibility 0s linear 0s;
    }

.alert-answer-comment-collapse-inner {
    min-height: 0;
    overflow: hidden;
}

.alert-answer-count {
    min-width: 19px;
    height: 19px;
    padding: 0 6px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    background: #e74c3c;
    color: #ffffff;
    font-size: 12.5px;
    font-weight: 900;
    line-height: 1;
}

.alert-answer-comment-history {
    max-height: 118px;
    padding: 10px 12px;
    overflow-y: auto;
    border-bottom: 1px solid #d7e0e8;
    color: #353f5c;
    font-size: 12.5px;
    line-height: 1.6;
}

.alert-answer-comment-empty {
    color: #8a95a3;
    font-style: italic;
}

.alert-answer-comment-editor {
    padding: 10px 12px 12px;
    background: #ffffff;
}

.alert-answer-textarea {
    min-height: 74px;
    resize: vertical;
    border: 1px solid #d5dde6;
    border-radius: 8px;
    background: #ffffff;
    color: #2f3d52;
    font-size: 12.5px;
    box-shadow: none;
}

    .alert-answer-textarea:focus {
        border-color: #8498ad;
        box-shadow: 0 0 0 2px rgba(61, 98, 135, .10);
    }

/* Operator next-action cue. The comment remains a pending operator step
   while it is being typed and becomes complete only after a successful save.
   Keep the cue noticeable without turning the whole alert dialog into a warning state. */
.alert-answer-comment-card.is-action-required {
    border-color: #d8bd54;
    background: #fff8cf;
    box-shadow: 0 0 0 3px rgba(205, 168, 51, .10);
}

.alert-answer-comment-card.is-action-required .alert-answer-comment-header {
    border-bottom-color: #dfcc7b;
    background: #fff2b8;
    box-shadow: inset 4px 0 0 #d2aa25;
}

.alert-answer-next-action {
    width: 22px;
    height: 22px;
    min-width: 22px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid transparent;
    border-radius: 999px;
    font-size: 10px;
    line-height: 1;
}

.alert-answer-next-action.is-pending {
    width: 26px;
    height: 26px;
    min-width: 26px;
    margin-left: 2px;
    border-color: #cfa92d;
    background: #ffe18a;
    color: #684c00;
    box-shadow: 0 2px 7px rgba(143, 107, 0, .16);
    font-size: 11px;
    animation: alert-answer-next-action-nudge 1.05s ease-in-out 3;
}

.alert-answer-next-action.is-complete {
    border-color: #bfd8c2;
    background: #eef7ef;
    color: #397848;
}

.alert-answer-comment-card.is-action-required .alert-answer-comment-editor {
    background: #fff8cf;
}

.alert-answer-comment-card.is-action-required .alert-answer-textarea {
    border-color: #d4b546;
    background: #fffbe7;
    box-shadow: inset 4px 0 0 rgba(199, 160, 31, .30);
}

.alert-answer-comment-card.is-action-required .alert-answer-textarea::placeholder {
    color: #75673e;
    opacity: .78;
}

.alert-answer-comment-card.is-action-required .alert-answer-textarea:focus {
    border-color: #c19b18;
    background: #fffdf1;
    box-shadow: 0 0 0 3px rgba(199, 168, 61, .16), inset 4px 0 0 rgba(190, 147, 12, .34);
}

@keyframes alert-answer-next-action-nudge {
    0%, 100% {
        transform: translateY(0);
    }

    35% {
        transform: translateY(3px);
    }

    70% {
        transform: translateY(-1px);
    }
}

.alert-answer-action-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    margin-bottom: 10px;
}

.alert-answer-toggle {
    padding: 7px 12px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    border: 1px solid transparent;
    border-radius: 8px;
    font-size: 11px;
    font-weight: 700;
    line-height: 1;
    box-shadow: none;
    transition: background-color .15s ease, border-color .15s ease, color .15s ease;
}

.alert-answer-toggle-danger {
    border-color: #f1c4be;
    background: #fdecea;
    color: #c0392b;
}

    .alert-answer-toggle-danger.active {
        border-color: #c0392b;
        background: #c0392b;
        color: #ffffff;
    }

.alert-answer-toggle-info {
    border-color: #c6dcef;
    background: #eaf2fa;
    color: #2c4c6c;
}

    .alert-answer-toggle-info.active {
        border-color: #2c4c6c;
        background: #2c4c6c;
        color: #ffffff;
    }

.alert-answer-panel {
    margin-bottom: 10px;
    padding: 12px;
    border-radius: 10px;
    font-size: 12.5px;
    line-height: 1.65;
}

.alert-answer-panel-danger {
    border: 2px solid #f1c4be;
    background: #fdecea;
    color: #922b21;
}

.alert-answer-panel-info {
    border: 1px solid #c6dcef;
    background: #eaf2fa;
    color: #495057;
}

.alert-answer-panel-title {
    margin-bottom: 7px;
    display: flex;
    align-items: center;
    gap: 7px;
    font-size: 13.5px;
    font-weight: 800;
}

.alert-answer-panel-danger .alert-answer-panel-title {
    color: #c0392b;
}

.alert-answer-panel-info .alert-answer-panel-title {
    color: #2c4c6c;
}

.alert-answer-map-wrap {
    overflow: hidden;
    border: 1px solid #b8c7d6;
    border-radius: 10px;
    background: #f8f9fa;
}

.alert-answer-map-toolbar {
    min-height: 38px;
    padding: 8px 11px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    border-bottom: 1px solid #edf1f5;
    background: #ffffff;
}

.alert-answer-map-title {
    display: flex;
    align-items: center;
    gap: 7px;
    color: #2c4c6c;
    font-size: 11px;
    font-weight: 700;
}

.alert-answer-map-meta {
    color: #6c757d;
    font-size: 12.5px;
    white-space: nowrap;
}

.alert-answer-map-canvas {
    width: 100%;
    height: 310px;
    min-height: 240px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #f8f9fa;
    color: #6c757d;
}

.alert-answer-footer-chips {
    margin-top: 9px;
    padding-top: 9px;
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    border-top: 1px solid #edf1f5;
}

.alert-answer-chip {
    padding: 4px 10px;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    border-radius: 999px;
    background: #f1f3f5;
    color: #6c757d;
    font-size: 12.5px;
    font-weight: 700;
}

@media (prefers-reduced-motion: reduce) {
    .alert-answer-comment-collapse,
    .alert-answer-comment-collapse-button i {
        transition: none !important;
    }

    .alert-answer-next-action.is-pending {
        animation: none !important;
    }
}

@media (max-width: 767.98px) {
    .alert-answer-summary {
        align-items: flex-start;
        flex-direction: column;
    }

    .alert-answer-time-block {
        width: 100%;
        text-align: left;
    }

    .alert-answer-table,
    .alert-answer-table tbody,
    .alert-answer-table tr,
    .alert-answer-table th,
    .alert-answer-table td {
        width: 100%;
        display: block;
    }

        .alert-answer-table th {
            border-bottom: 1px solid #edf1f5;
        }

    .alert-answer-inline-list {
        gap: 8px;
        flex-direction: column;
    }

    .alert-answer-field {
        width: 100%;
    }

    .alert-answer-map-toolbar {
        align-items: flex-start;
        flex-direction: column;
    }

    .alert-answer-map-canvas {
        height: 280px;
    }
}

@media (max-width: 479.98px) {
    .alert-answer-summary-main {
        align-items: flex-start;
    }

    .alert-answer-device-image {
        width: 38px;
        height: 38px;
        min-width: 38px;
    }

    .alert-answer-action-row,
    .alert-answer-toggle {
        width: 100%;
    }

    .alert-answer-toggle {
        justify-content: center;
    }
}

/* CX-MODAL-TITLE-ICON:BEGIN */
/* CX-MODAL-TITLE-ICON:END */

/* CONEXGO-MODAL-DEVICE-CONFIG-REBUILD-R1: local to this component */
.cx-r1-alert-answer .cx-modal-layout-v21 {
    width: 100%;
    display: grid;
    gap: 22px;
}

.cx-r1-alert-answer .cx-r1-section {
    min-width: 0;
    margin: 0;
    padding: .85rem .95rem .95rem;
    border: 1px solid #b7c6d5;
    border-radius: 12px;
    background: #ffffff;
    box-shadow: 0 3px 10px rgba(35, 60, 85, .04);
}

.cx-r1-alert-answer .cx-r1-section-title {
    max-width: calc(100% - 1rem);
    display: inline-flex;
    align-items: center;
    gap: .55rem;
    margin: 0 0 .15rem;
    padding: 0 .45rem;
    color: #2c4c6c;
    font-size: .92rem;
    font-weight: 800;
    line-height: 1.35;
}

.cx-r1-alert-answer .cx-r1-section-icon {
    width: 28px;
    height: 28px;
    min-width: 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    background: #edf3f8;
    color: #3d6287;
    font-size: .78rem;
}

.cx-r1-alert-answer .cx-r1-section-description {
    display: flex;
    align-items: flex-start;
    gap: .45rem;
    margin: .1rem 0 .75rem;
    color: #687787;
    font-size: .82rem;
    line-height: 1.5;
}

    .cx-r1-alert-answer .cx-r1-section-description > i {
        margin-top: .22rem;
        color: #6d88a2;
        font-size: .72rem;
    }

.cx-r1-alert-answer .cx-r1-form-row {
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(175px, 225px) minmax(0, 1fr);
    align-items: start;
    gap: .45rem .9rem;
    margin: 0 0 .75rem;
}

    .cx-r1-alert-answer .cx-r1-form-row:last-child {
        margin-bottom: 0;
    }

    .cx-r1-alert-answer .cx-r1-form-row > [class*="col-"] {
        width: auto;
        max-width: none;
        min-width: 0;
        margin: 0;
        padding: 0;
    }

    .cx-r1-alert-answer .cx-r1-form-row > .form-label {
        padding-top: .62rem;
        text-align: right !important;
    }

.cx-r1-alert-answer .form-label > label:not(.custom-switch),
.cx-r1-alert-answer label[aspfor] {
    color: #52677a;
    font-size: .72rem;
    font-weight: 800;
    letter-spacing: .045em;
    line-height: 1.35;
    text-transform: uppercase;
}

    .cx-r1-alert-answer .form-label > label:not(.custom-switch)::after,
    .cx-r1-alert-answer label[aspfor]::after {
        content: ":";
    }

.cx-r1-alert-answer input.form-control,
.cx-r1-alert-answer select.form-control,
.cx-r1-alert-answer textarea.form-control {
    width: 100%;
    min-width: 0;
    border-color: #cfd9e3;
    border-radius: 8px;
    box-shadow: none;
}

.cx-r1-alert-answer textarea.form-control,
.cx-r1-alert-answer .cx-dialog-textarea {
    width: 100%;
    height: 132px;
    min-height: 84px !important;
    max-height: none !important;
    resize: both !important;
    overflow: auto !important;
}

.cx-r1-alert-answer input:disabled,
.cx-r1-alert-answer select:disabled,
.cx-r1-alert-answer textarea:disabled {
    background: #f3f6f8;
    color: #526170;
    opacity: 1;
}

@media (max-width: 767.98px) {
    .cx-r1-alert-answer .cx-r1-section {
        padding: .85rem;
    }

    .cx-r1-alert-answer .cx-r1-form-row {
        grid-template-columns: minmax(0, 1fr);
        gap: .35rem;
        margin-bottom: .85rem;
    }

        .cx-r1-alert-answer .cx-r1-form-row > .form-label {
            padding-top: 0;
            text-align: left !important;
        }

    .cx-r1-alert-answer .cx-r1-section-description {
        margin-bottom: .8rem;
    }
}
/* CONEXGO-R2-MANUAL-FIELDSET-SPACING */
.cx-r1-alert-answer .cx-modal-layout-v21,
.cx-r1-alert-answer form.cx-dialog-v17-form {
    display: grid;
    gap: 22px;
}

.cx-r1-alert-answer .cx-r1-section + .cx-r1-section,
.cx-r1-alert-answer fieldset + fieldset {
    margin-top: 0;
}

@media (max-width: 767.98px) {
    .cx-r1-alert-answer .cx-modal-layout-v21,
    .cx-r1-alert-answer form.cx-dialog-v17-form {
        gap: 16px;
    }
}
/* #endregion Alert_Answer.razor */

/* #region AlertEmail.razor */
/**************************************** AlertEmail.razor ************************************************************************/
.alert-email-form {
    width: 100%;
    margin-top: 16px;
    padding: 18px;
    border: 1px solid #dce4ed;
    border-radius: 10px;
    background: #ffffff;
}

.alert-email-header {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 16px;
}

.alert-email-header-icon {
    width: 40px;
    height: 40px;
    min-width: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: #edf3f8;
    color: #3d6287;
    font-size: 16px;
}

.alert-email-header-content {
    min-width: 0;
}

.alert-email-title {
    color: #2c4c6c;
    font-size: 15px;
    line-height: 1.35;
    font-weight: 800;
}

.alert-email-description {
    margin-top: 3px;
    color: #667085;
    font-size: 13.5px;
    line-height: 1.5;
}

.alert-email-entry-row {
    width: min(100%, 860px);
    margin-inline: auto;
    display: grid;
    grid-template-columns: minmax(240px, 800px) 40px;
    align-items: end;
    gap: 12px;
}

.alert-email-field {
    min-width: 0;
}

    .alert-email-field label {
        color: #2c4c6c;
        font-size: 12.5px;
        font-weight: 750;
        line-height: 1.3;
    }

.alert-email-add-button {
    width: 40px;
    height: 40px;
    min-width: 40px;
    min-height: 40px;
    padding: 0;
    display: inline-grid;
    place-items: center;
    align-self: end;
    border: 1px solid #3d6287;
    border-radius: 50%;
    background: #3d6287;
    color: #ffffff;
    box-shadow: none;
    transition: transform .16s ease, background-color .16s ease, border-color .16s ease, box-shadow .16s ease;
}

    .alert-email-add-button > i {
        width: 18px;
        height: 18px;
        margin: 0;
        display: inline-grid;
        place-items: center;
        font-size: 17px;
        line-height: 1;
    }

    .alert-email-add-button:hover,
    .alert-email-add-button:focus-visible {
        border-color: #345879;
        background: #345879;
        color: #ffffff;
        transform: translateY(-1px);
        box-shadow: 0 5px 12px rgba(44, 76, 108, .16);
    }

.alert-email-list-row {
    width: min(100%, 860px);
    margin: 15px auto 0;
    display: grid;
    grid-template-columns: 120px minmax(0, 1fr);
    gap: 12px;
    align-items: start;
}

.alert-email-list-label {
    padding-top: 7px;
    color: #2c4c6c;
    font-size: 14px;
    line-height: 1.4;
    font-weight: 800;
    text-align: right;
}

.alert-email-list {
    min-width: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.alert-email-chip {
    min-height: 36px;
    max-width: 100%;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 5px 5px 5px 10px;
    border: 1px solid #d5dfe8;
    border-radius: 999px;
    background: #f7f9fc;
    color: #344b66;
    font-size: 13.5px;
    line-height: 1.35;
    font-weight: 650;
}

    .alert-email-chip > span {
        overflow-wrap: anywhere;
    }

    .alert-email-chip > i {
        color: #557a9d;
    }

.alert-email-remove-button {
    width: 26px;
    height: 26px;
    min-width: 26px;
    min-height: 26px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: #f7e7e9;
    color: #c5525f;
    box-shadow: none;
}

    .alert-email-remove-button:hover,
    .alert-email-remove-button:focus-visible {
        background: #f2d8dc;
        color: #a93e4b;
    }

.alert-email-empty {
    min-height: 36px;
    display: flex;
    align-items: center;
    color: #7a8795;
    font-size: 13.5px;
}

@media (max-width: 767.98px) {
    .alert-email-entry-row {
        width: 100%;
        grid-template-columns: minmax(0, 1fr) 48px;
    }

    .alert-email-list-row {
        grid-template-columns: 1fr;
    }

    .alert-email-list-label {
        padding-top: 0;
        text-align: left;
    }

    .alert-email-add-button {
        width: 40px;
        justify-self: end;
    }
}
/* #endregion AlertEmail.razor */

/* #region AlertSMS.razor */
/**************************************** AlertSMS.razor ************************************************************************/
.alert-sms-form {
    width: 100%;
    margin-top: 16px;
    padding: 18px;
    border: 1px solid #dce4ed;
    border-radius: 10px;
    background: #ffffff;
}

.alert-sms-header {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 16px;
}

.alert-sms-header-icon {
    width: 40px;
    height: 40px;
    min-width: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: #edf3f8;
    color: #3d6287;
    font-size: 16px;
}

.alert-sms-header-content {
    min-width: 0;
}

.alert-sms-title {
    color: #2c4c6c;
    font-size: 15px;
    line-height: 1.35;
    font-weight: 800;
}

.alert-sms-description {
    margin-top: 3px;
    color: #667085;
    font-size: 13.5px;
    line-height: 1.5;
}

.alert-sms-entry-row {
    width: min(100%, 860px);
    margin-inline: auto;
    display: grid;
    grid-template-columns: minmax(240px, 800px) 40px;
    align-items: end;
    gap: 12px;
}

.alert-sms-field {
    min-width: 0;
}

    .alert-sms-field label {
        color: #2c4c6c;
        font-size: 12.5px;
        font-weight: 750;
        line-height: 1.3;
    }

.alert-sms-add-button {
    width: 40px;
    height: 40px;
    min-width: 40px;
    min-height: 40px;
    padding: 0;
    display: inline-grid;
    place-items: center;
    align-self: end;
    border: 1px solid #3d6287;
    border-radius: 50%;
    background: #3d6287;
    color: #ffffff;
    box-shadow: none;
    transition: transform .16s ease, background-color .16s ease, border-color .16s ease, box-shadow .16s ease;
}

    .alert-sms-add-button > i {
        width: 18px;
        height: 18px;
        margin: 0;
        display: inline-grid;
        place-items: center;
        font-size: 17px;
        line-height: 1;
    }

    .alert-sms-add-button:hover,
    .alert-sms-add-button:focus-visible {
        border-color: #345879;
        background: #345879;
        color: #ffffff;
        transform: translateY(-1px);
        box-shadow: 0 5px 12px rgba(44, 76, 108, .16);
    }

.alert-sms-format {
    width: min(100%, 860px);
    margin: 8px auto 0;
    display: flex;
    align-items: flex-start;
    gap: 7px;
    color: #667085;
    font-size: 12.5px;
    line-height: 1.45;
}

    .alert-sms-format > i {
        margin-top: 2px;
        color: #557a9d;
    }

.alert-sms-list-row {
    width: min(100%, 860px);
    margin: 15px auto 0;
    display: grid;
    grid-template-columns: 120px minmax(0, 1fr);
    gap: 12px;
    align-items: start;
}

.alert-sms-list-label {
    padding-top: 7px;
    color: #2c4c6c;
    font-size: 14px;
    line-height: 1.4;
    font-weight: 800;
    text-align: right;
}

.alert-sms-list {
    min-width: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.alert-sms-chip {
    min-height: 36px;
    max-width: 100%;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 5px 5px 5px 10px;
    border: 1px solid #d5dfe8;
    border-radius: 999px;
    background: #f7f9fc;
    color: #344b66;
    font-size: 13.5px;
    line-height: 1.35;
    font-weight: 650;
}

    .alert-sms-chip > span {
        overflow-wrap: anywhere;
    }

    .alert-sms-chip > i {
        color: #557a9d;
    }

.alert-sms-remove-button {
    width: 26px;
    height: 26px;
    min-width: 26px;
    min-height: 26px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: #f7e7e9;
    color: #c5525f;
    box-shadow: none;
}

    .alert-sms-remove-button:hover,
    .alert-sms-remove-button:focus-visible {
        background: #f2d8dc;
        color: #a93e4b;
    }

.alert-sms-empty {
    min-height: 36px;
    display: flex;
    align-items: center;
    color: #7a8795;
    font-size: 13.5px;
}

@media (max-width: 767.98px) {
    .alert-sms-entry-row {
        width: 100%;
        grid-template-columns: minmax(0, 1fr) 48px;
    }

    .alert-sms-list-row {
        grid-template-columns: 1fr;
    }

    .alert-sms-list-label {
        padding-top: 0;
        text-align: left;
    }

    .alert-sms-add-button {
        width: 40px;
        justify-self: end;
    }
}
/* #endregion AlertSMS.razor */

/*********** NOTIFICATION *******************/
/* #region Notification_List.razor */
/**************************************** Notification_List.razor ************************************************************************/
.cx-notification-page-header .cx-list-page-header-row {
    gap: 18px;
}

.cx-notification-page-header .cx-page-actions,
.cx-notification-page-header .cx-page-actions > div {
    min-width: 0;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 10px !important;
    flex-wrap: nowrap !important;
}

.cx-notification-page-header .cx-page-action {
    min-height: 42px;
    white-space: nowrap !important;
}

.notification-list-card {
    overflow: visible;
}

.notification-list-toolbar {
    padding: 12px 16px !important;
    background: #2c4c6c !important;
    border-bottom: 1px solid #243f5a !important;
}

.notification-list-toolbar-row {
    width: 100%;
    min-width: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
}

.notification-list-toolbar-left {
    flex: 0 0 auto;
    min-width: 0;
    display: flex;
    align-items: center;
    justify-content: flex-start;
}

.notification-list-search {
    width: min(100%, 470px);
    min-width: 300px;
    margin-left: auto;
}

    .notification-list-search .dataTables_filter,
    .notification-list-search label {
        width: 100%;
        margin: 0 !important;
    }

.notification-list-ack {
    min-height: 42px;
    padding: 0 16px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    border: 1px solid rgba(255, 255, 255, .72);
    border-radius: 9px;
    background: #ffffff;
    color: #2c4c6c;
    font-weight: 750;
    white-space: nowrap;
    box-shadow: 0 3px 10px rgba(20, 43, 65, .12);
}

    .notification-list-ack:hover,
    .notification-list-ack:focus-visible {
        border-color: #ffffff;
        background: #f2f6f9;
        color: #243f5a;
    }

.notification-list-card-body {
    padding-top: 14px !important;
}

.cx-notification-filter-panel {
    margin-bottom: 14px;
    overflow: visible;
}

    .cx-notification-filter-panel .cx-filter-disclosure-inner {
        overflow: visible;
    }

.cx-notification-filter-grid {
    width: 100%;
    min-width: 0;
    padding: 12px;
    display: grid;
    grid-template-columns: repeat(5, minmax(150px, 1fr));
    align-items: end;
    gap: 10px;
    background: #f8fafc;
}

.cx-notification-filter-field {
    min-width: 0;
}

    .cx-notification-filter-field > label {
        min-height: 18px;
        margin: 0 0 5px;
        display: flex;
        align-items: center;
        color: #52677a;
        font-size: .76rem;
        font-weight: 750;
        line-height: 1.2;
    }

    .cx-notification-filter-field .cx-control,
    .cx-notification-filter-field .cx-control-root,
    .cx-notification-filter-field .cx-control-field,
    .cx-notification-filter-field .cx-native-picker-shell {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
    }

.cx-notification-filter-actions {
    grid-column: 1 / -1;
    min-width: 0;
    padding-top: 10px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 9px;
    border-top: 1px solid #e2e9ef;
}

.cx-notification-filter-summary {
    min-width: 0;
    margin-right: auto;
    color: #60758a;
    font-size: .78rem;
    line-height: 1.35;
    overflow-wrap: anywhere;
}

.cx-notification-filter-actions .btn {
    min-height: 40px;
    padding: 0 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    border-radius: 9px;
    white-space: nowrap;
}

.cx-notification-filter-reset {
    min-width: 126px;
}

.cx-notification-filter-apply {
    min-width: 112px;
}

.conexgo-notification-row-actions {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: nowrap;
    gap: 6px;
}

    .conexgo-notification-row-actions .btn {
        width: 36px;
        min-width: 36px;
        height: 34px;
        padding: 0 !important;
        display: inline-flex !important;
        align-items: center;
        justify-content: center;
    }

@media (max-width: 1399.98px) {
    .cx-notification-filter-grid {
        grid-template-columns: repeat(3, minmax(170px, 1fr));
    }
}

@media (max-width: 1199.98px) {
    .cx-notification-page-header .cx-list-page-header-row {
        align-items: flex-start !important;
    }

    .cx-notification-page-header .cx-page-actions,
    .cx-notification-page-header .cx-page-actions > div {
        flex-wrap: wrap !important;
    }
}

@media (max-width: 991.98px) {
    .notification-list-toolbar-row {
        align-items: stretch;
        flex-direction: column;
    }

    .notification-list-toolbar-left,
    .notification-list-search,
    .notification-list-ack {
        width: 100%;
        min-width: 0;
    }

    .cx-notification-filter-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 767.98px) {
    .cx-notification-page-header .cx-list-page-header-row {
        flex-direction: column !important;
        align-items: stretch !important;
    }

    .cx-notification-page-header .cx-page-actions,
    .cx-notification-page-header .cx-page-actions > div {
        width: 100%;
    }

    .cx-notification-page-header .cx-page-action {
        flex: 1 1 180px;
    }

    .cx-notification-filter-actions {
        align-items: stretch;
        flex-wrap: wrap;
    }

    .cx-notification-filter-summary {
        width: 100%;
        margin-right: 0;
    }
}

@media (max-width: 575.98px) {
    .cx-notification-filter-grid {
        grid-template-columns: minmax(0, 1fr);
        padding: 10px;
    }

    .cx-notification-filter-actions .btn {
        width: 100%;
    }

    .conexgo-notification-row-actions {
        flex-wrap: wrap;
    }
}
/* #endregion Notification_List.razor */

/* #region Notification_AddEdit.razor */
/**************************************** Notification_AddEdit.razor ************************************************************************/
/* CONEXGO-MODAL-DEVICE-CONFIG-REBUILD-R1: local to this component */
.cx-r1-notification-addedit .cx-modal-layout-v21 {
    width: 100%;
    display: grid;
    gap: 22px;
}

.cx-r1-notification-addedit .cx-r1-section {
    min-width: 0;
    margin: 0;
    padding: .85rem .95rem .95rem;
    border: 1px solid #d7e1ea;
    border-radius: 12px;
    background: #ffffff;
    box-shadow: 0 4px 14px rgba(35, 60, 85, .045);
}

.cx-r1-notification-addedit .cx-r1-section-title {
    max-width: calc(100% - 1rem);
    display: inline-flex;
    align-items: center;
    gap: .55rem;
    margin: 0 0 .15rem;
    padding: 0 .45rem;
    color: #2c4c6c;
    font-size: 1.08rem;
    font-weight: 850;
    line-height: 1.35;
}

.cx-r1-notification-addedit .cx-r1-section-icon {
    width: 38px;
    height: 38px;
    min-width: 38px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: #e5eef6;
    color: #31597f;
    font-size: 1.05rem;
}

.cx-r1-notification-addedit .cx-r1-section-description {
    display: flex;
    align-items: flex-start;
    gap: .45rem;
    margin: .1rem 0 .75rem;
    color: #5d6f80;
    font-size: .93rem;
    line-height: 1.5;
}

    .cx-r1-notification-addedit .cx-r1-section-description > i {
        margin-top: .22rem;
        color: #527493;
        font-size: .82rem;
    }

.cx-r1-notification-addedit .cx-r1-form-row {
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(185px, 220px) minmax(0, 940px);
    justify-content: center;
    align-items: start;
    gap: .45rem .9rem;
    margin: 0 0 .75rem;
}

    .cx-r1-notification-addedit .cx-r1-form-row:last-child {
        margin-bottom: 0;
    }

    .cx-r1-notification-addedit .cx-r1-form-row > [class*="col-"] {
        width: auto;
        max-width: none;
        min-width: 0;
        margin: 0;
        padding: 0;
    }

    .cx-r1-notification-addedit .cx-r1-form-row > .form-label {
        padding-top: .62rem;
        text-align: right !important;
    }

.cx-r1-notification-addedit .form-label > label:not(.custom-switch),
.cx-r1-notification-addedit label[aspfor] {
    color: #52677a;
    font-size: .72rem;
    font-weight: 800;
    letter-spacing: .045em;
    line-height: 1.35;
    text-transform: uppercase;
}

    .cx-r1-notification-addedit .form-label > label:not(.custom-switch)::after,
    .cx-r1-notification-addedit label[aspfor]::after {
        content: ":";
    }

.cx-r1-notification-addedit input.form-control,
.cx-r1-notification-addedit select.form-control,
.cx-r1-notification-addedit textarea.form-control {
    width: 100%;
    min-width: 0;
    border-color: #cfd9e3;
    border-radius: 8px;
    box-shadow: none;
}

.cx-r1-notification-addedit textarea.form-control,
.cx-r1-notification-addedit .cx-dialog-textarea {
    width: 100%;
    min-height: 140px !important;
    max-height: none !important;
    resize: both !important;
    overflow: auto !important;
}

.cx-r1-notification-addedit input:disabled,
.cx-r1-notification-addedit select:disabled,
.cx-r1-notification-addedit textarea:disabled {
    background: #f3f6f8;
    color: #526170;
    opacity: 1;
}

@media (max-width: 767.98px) {
    .cx-r1-notification-addedit .cx-r1-section {
        padding: .85rem;
    }

    .cx-r1-notification-addedit .cx-r1-form-row {
        grid-template-columns: minmax(0, 1fr);
        gap: .35rem;
        margin-bottom: .85rem;
    }

        .cx-r1-notification-addedit .cx-r1-form-row > .form-label {
            padding-top: 0;
            text-align: left !important;
        }

    .cx-r1-notification-addedit .cx-r1-section-title {
        font-size: 1rem;
    }

    .cx-r1-notification-addedit .cx-r1-section-icon {
        width: 36px;
        height: 36px;
        min-width: 36px;
        font-size: 1rem;
    }

    .cx-r1-notification-addedit .cx-r1-section-description {
        margin-bottom: .8rem;
        font-size: .88rem;
    }
}

.cx-r1-notification-addedit .notification-message-textarea {
    height: 150px;
    min-height: 100px !important;
    max-height: none !important;
    resize: both !important;
}

.cx-r1-notification-addedit .cx-r1-priority-section {
    padding-bottom: 1rem;
}

.cx-r1-notification-addedit .notification-priority-field {
    width: min(100%, 940px);
    margin: .5rem auto 0;
}

    .cx-r1-notification-addedit .notification-priority-field .form-select {
        min-height: 52px;
        padding-inline: 1rem 2.75rem;
        cursor: pointer;
    }
/* #endregion Notification_AddEdit.razor */

/* #region Notification_View.razor */
/**************************************** Notification_View.razor ************************************************************************/
/* Component-specific modal layout. */
.cx-r1-notification-view .cx-modal-layout-v21 {
    width: 100%;
    display: grid;
    gap: 14px;
}

.cx-r1-notification-view .cx-r1-section {
    min-width: 0;
    margin: 0;
    padding: .72rem .82rem .82rem;
    border: 1px solid #d7e1ea;
    border-radius: 9px;
    background: #ffffff;
    box-shadow: 0 4px 14px rgba(35, 60, 85, .045);
}

.cx-r1-notification-view .cx-r1-section-title {
    max-width: calc(100% - 1rem);
    display: inline-flex;
    align-items: center;
    gap: .55rem;
    margin: 0 0 .15rem;
    padding: 0 .45rem;
    color: #2c4c6c;
    font-size: .92rem;
    font-weight: 800;
    line-height: 1.35;
}

.cx-r1-notification-view .cx-r1-section-icon {
    width: 28px;
    height: 28px;
    min-width: 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    background: #edf3f8;
    color: #3d6287;
    font-size: .78rem;
}

.cx-r1-notification-view .cx-r1-section-description {
    display: flex;
    align-items: flex-start;
    gap: .45rem;
    margin: .1rem 0 .75rem;
    color: #687787;
    font-size: .82rem;
    line-height: 1.5;
}

    .cx-r1-notification-view .cx-r1-section-description > i {
        margin-top: .22rem;
        color: #6d88a2;
        font-size: .72rem;
    }

.cx-r1-notification-view .cx-r1-form-row {
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(175px, 225px) minmax(0, 1fr);
    align-items: start;
    gap: .45rem .9rem;
    margin: 0 0 .75rem;
}

    .cx-r1-notification-view .cx-r1-form-row:last-child {
        margin-bottom: 0;
    }

    .cx-r1-notification-view .cx-r1-form-row > [class*="col-"] {
        width: auto;
        max-width: none;
        min-width: 0;
        margin: 0;
        padding: 0;
    }

    .cx-r1-notification-view .cx-r1-form-row > .form-label {
        padding-top: .62rem;
        text-align: right !important;
    }

.cx-r1-notification-view .form-label > label:not(.custom-switch),
.cx-r1-notification-view label[aspfor] {
    color: #52677a;
    font-size: .72rem;
    font-weight: 800;
    letter-spacing: .045em;
    line-height: 1.35;
    text-transform: uppercase;
}

    .cx-r1-notification-view .form-label > label:not(.custom-switch)::after,
    .cx-r1-notification-view label[aspfor]::after {
        content: ":";
    }

.cx-r1-notification-view input.form-control,
.cx-r1-notification-view select.form-control,
.cx-r1-notification-view textarea.form-control {
    width: 100%;
    min-width: 0;
    border-color: #cfd9e3;
    border-radius: 8px;
    box-shadow: none;
}

.cx-r1-notification-view textarea.form-control,
.cx-r1-notification-view .cx-dialog-textarea {
    width: 100%;
    height: auto;
    min-height: 92px !important;
    max-height: min(52vh, 520px) !important;
    resize: both !important;
    overflow: auto !important;
}

.cx-r1-notification-view input:disabled,
.cx-r1-notification-view select:disabled,
.cx-r1-notification-view textarea:disabled {
    background: #f3f6f8;
    color: #526170;
    opacity: 1;
}

@media (max-width: 767.98px) {
    .cx-r1-notification-view .cx-r1-section {
        padding: .85rem;
    }

    .cx-r1-notification-view .cx-r1-form-row {
        grid-template-columns: minmax(0, 1fr);
        gap: .35rem;
        margin-bottom: .85rem;
    }

        .cx-r1-notification-view .cx-r1-form-row > .form-label {
            padding-top: 0;
            text-align: left !important;
        }

    .cx-r1-notification-view .cx-r1-section-description {
        margin-bottom: .8rem;
    }
}

.notification-view-layout {
    width: min(100%, 1040px);
    margin: 0 auto;
}

.notification-view-form {
    width: min(100%, 920px);
    margin: 0 auto;
    display: grid;
    gap: 18px;
    color: #2d3148;
}

.notification-view-block {
    min-width: 0;
    display: grid;
    gap: 8px;
}

.notification-view-block-label {
    color: #52677a;
    font-size: .76rem;
    font-weight: 800;
    letter-spacing: .045em;
    line-height: 1.35;
    text-transform: uppercase;
}

.notification-view-priority-card {
    min-height: 70px;
    padding: 14px 16px;
    background: #ffffff;
    border: 1px solid #e3e8ef;
    border-left: 5px solid #2c4c6c;
    border-radius: 10px;
    display: flex;
    align-items: center;
    gap: 13px;
}

.notification-view-priority-icon {
    width: 42px;
    height: 42px;
    border-radius: 999px;
    display: grid;
    place-items: center;
    font-size: 16px;
    flex: 0 0 42px;
}

.notification-view-priority-title {
    color: #2d3148;
    font-size: 1rem;
    font-weight: 800;
    line-height: 1.25;
}

.notification-view-priority-subtitle {
    margin-top: 2px;
    color: #6c757d;
    font-size: .82rem;
    font-weight: 600;
}

.notification-view-title-box,
.notification-view-message-box {
    min-width: 0;
    padding: 13px 15px;
    border: 1px solid #dbe3eb;
    border-radius: 10px;
    overflow-wrap: anywhere;
}

.notification-view-title-box {
    min-height: 48px;
    display: flex;
    align-items: center;
    background: #f6f8fb;
    color: #2d3148;
    font-size: 1rem;
    font-weight: 800;
    line-height: 1.4;
}

.notification-view-message-box {
    min-height: 132px;
    max-height: 330px;
    overflow-y: auto;
    background: #ffffff;
    color: #2d3148;
    font-size: .94rem;
    line-height: 1.65;
}

.notification-view-acknowledged {
    min-height: 42px;
    width: fit-content;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 9px 13px;
    background: #f0f8f2;
    border: 1px solid #d4ead9;
    border-radius: 9px;
    color: #3f7a52;
    font-size: .9rem;
    font-weight: 800;
}

.notification-view-loading {
    min-height: 180px;
    display: grid;
    place-items: center;
    align-content: center;
    gap: 12px;
    color: #2c4c6c;
    font-weight: 700;
}

.notification-view-spinner {
    width: 40px;
    height: 40px;
    border: 4px solid #edf0f2;
    border-top-color: #2c4c6c;
    border-radius: 50%;
    animation: notification-view-spin .8s linear infinite;
}

@keyframes notification-view-spin {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }
}

@media (max-width: 767.98px) {
    .notification-view-form {
        gap: 14px;
    }

    .notification-view-title-box {
        font-size: .93rem;
    }

    .notification-view-message-box {
        min-height: 108px;
    }
}

/* CX-MODAL-TITLE-ICON:BEGIN */
/* CX-MODAL-TITLE-ICON:END */
/* Fieldset spacing. */
.cx-r1-notification-view .cx-modal-layout-v21,
.cx-r1-notification-view form.cx-dialog-v17-form {
    display: grid;
    gap: 14px;
}

.cx-r1-notification-view .cx-r1-section + .cx-r1-section,
.cx-r1-notification-view fieldset + fieldset {
    margin-top: 0;
}

@media (max-width: 767.98px) {
    .cx-r1-notification-view .cx-modal-layout-v21,
    .cx-r1-notification-view form.cx-dialog-v17-form {
        gap: 16px;
    }
}

/* Modal spacing. */
.notification-view-form {
    gap: 14px;
}

@media (max-width: 767.98px) {
    .notification-view-form {
        gap: 16px;
    }
}

.cx-notification-view-dialog {
    width: min(900px, calc(100vw - 24px)) !important;
    max-width: min(900px, calc(100vw - 24px)) !important;
    max-height: calc(100vh - 24px) !important;
}

    .cx-notification-view-dialog .mud-dialog-content {
        min-height: 0;
        overflow-y: auto;
        scrollbar-gutter: stable;
    }

    .cx-notification-view-dialog .notification-view-message-box {
        resize: vertical;
        min-height: 150px;
        max-height: 48vh;
        scrollbar-gutter: stable;
    }

@media (max-width: 575.98px) {
    .cx-notification-view-dialog {
        width: calc(100vw - 12px) !important;
        max-width: calc(100vw - 12px) !important;
    }
}

/* Keep notification details compact and readable. */
.cx-notification-view-dialog .cx-dialog-v17-content {
    padding: 16px 18px !important;
}

.cx-notification-view-dialog .cx-r1-section {
    padding: 12px 14px 14px !important;
}

.cx-notification-view-dialog .notification-view-form {
    width: min(100%, 780px) !important;
    gap: 13px !important;
}

.cx-notification-view-dialog .notification-view-priority-card {
    min-height: 58px !important;
    padding: 10px 12px !important;
}

.cx-notification-view-dialog .notification-view-title-box {
    min-height: 42px !important;
    padding: 10px 12px !important;
    font-size: .94rem !important;
}

.cx-notification-view-dialog .notification-view-message-box {
    min-height: 92px !important;
    max-height: 38vh !important;
    padding: 12px !important;
    resize: vertical !important;
    overflow: auto !important;
    line-height: 1.55 !important;
}

.cx-notification-view-dialog .notification-view-block-label {
    font-size: .7rem !important;
}

@media (max-width: 575.98px) {
    .cx-notification-view-dialog .cx-dialog-v17-content {
        padding: 10px !important;
    }

    .cx-notification-view-dialog .cx-r1-section {
        padding: 10px !important;
    }

    .cx-notification-view-dialog .notification-view-form {
        gap: 11px !important;
    }
}
/* #endregion Notification_View.razor */

/*********** ACCOUNT *******************/
/* #region Account_List.razor */
/**************************************** Account_List.razor ************************************************************************/
/* Page-specific list toolbar. */
.account-list-card {
    overflow: hidden;
}

.account-list-toolbar {
    min-height: 72px;
    margin: 0 !important;
    padding: 12px 16px;
    display: flex;
    align-items: center;
    border: 0;
    border-radius: 0;
    background: #2c4c6c;
}

.account-list-toolbar-row {
    width: 100%;
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(280px, 480px);
    align-items: center;
    gap: 12px;
}

.account-list-toolbar-back {
    min-width: 0;
    display: flex;
    align-items: center;
}

.account-list-toolbar-search {
    width: 100%;
    min-width: 0;
    grid-column: 2;
}

    .account-list-toolbar-search .dataTables_filter,
    .account-list-toolbar-search .dataTables_filter > label {
        width: 100%;
        margin: 0;
        display: block;
        text-align: right;
    }

.account-list-sorting {
    min-height: 40px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    color: #ffffff;
}

.account-list-card-body {
    padding-top: 1rem;
}

.account-list-table-shell {
    overflow-x: auto;
    scrollbar-gutter: stable;
}

    .account-list-table-shell table {
        width: 100%;
        min-width: 1120px;
        table-layout: fixed;
    }

.account-list-row > td {
    min-width: 0;
    vertical-align: top;
    overflow-wrap: anywhere;
    word-break: normal;
}

.account-list-cell-name {
    width: 285px;
}

.account-list-cell-contact {
    width: 285px;
    line-height: 1.48;
}

.account-list-cell-devices {
    width: 235px;
}

.account-list-cell-comment {
    width: 220px;
    white-space: normal;
}

.account-list-cell-documents {
    width: 190px;
}

.account-list-email-link, .account-list-device-link {
    color: #245fa5;
    text-decoration: none;
    text-underline-offset: 2px;
    overflow-wrap: anywhere;
}

.account-list-email-link:hover,
.account-list-email-link:focus-visible,
.account-list-device-link:hover,
.account-list-device-link:focus-visible {
    color: #174f88;
    text-decoration: underline;
}

.account-list-device-links {
    max-height: 190px;
    display: grid;
    gap: 5px;
    align-content: start;
    padding-right: 5px;
    overflow-x: hidden;
    overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-color: #a9b8c5 transparent;
}

.account-list-document-card {
    min-width: 0;
    padding: 9px;
    margin-bottom: 8px;
    border: 1px solid #dce4eb;
    border-radius: 9px;
    background: #f8fafc;
    white-space: normal;
    transition: border-color .16s ease, background-color .16s ease, box-shadow .16s ease;
}

    .account-list-document-card:hover {
        border-color: #b9cad9;
        background: #f4f8fb;
        box-shadow: 0 4px 10px rgba(44, 76, 108, .07);
    }

    .account-list-document-card span {
        overflow-wrap: anywhere;
    }

.account-list-document-card__title {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 7px;
    color: #2c4c6c;
    font-size: 9pt;
    font-weight: 800;
    line-height: 1.3;
}

    .account-list-document-card__title > span {
        min-width: 0;
    }

.account-list-document-card__actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 5px;
    margin-top: 8px;
}

.account-list-document-action {
    width: 30px;
    height: 30px;
    display: inline-grid;
    place-items: center;
    border: 1px solid #d5e0e9;
    border-radius: 7px;
    background: #ffffff;
    color: #315778;
    transition: background-color .14s ease, border-color .14s ease, transform .14s ease;
}

    .account-list-document-action:hover,
    .account-list-document-action:focus-visible {
        border-color: #9db3c6;
        background: #eaf2f8;
        transform: translateY(-1px);
        outline: none;
    }

.account-list-document-action--danger {
    color: #a44952;
}

.account-list-document-add {
    width: 34px;
    height: 34px;
    min-width: 34px;
    min-height: 34px;
    display: inline-grid;
    place-items: center;
    margin-top: 2px;
    border: 1px solid #91ae9a;
    border-radius: 8px;
    background: #f3faf5;
    color: #4f7958;
    font-size: 10pt;
    font-weight: 800;
}

    .account-list-document-add:hover,
    .account-list-document-add:focus-visible {
        background: #eaf6ed;
        border-color: #6f9678;
        outline: none;
    }

@media (max-width: 991.98px) {
    .account-list-toolbar {
        min-height: 62px;
        padding: 10px 12px;
    }

    .account-list-toolbar-row {
        grid-template-columns: auto minmax(0, 1fr);
        gap: 10px;
    }

    .account-list-toolbar-search {
        grid-column: 2;
    }
}

@media (max-width: 575.98px) {
    .account-list-toolbar {
        padding: 9px 10px;
    }
}
/* #endregion Account_List.razor */

/* #region Account_AddEdit.razor */
/**************************************** Account_AddEdit.razor ************************************************************************/
/* CONEXGO-MODAL-DEVICE-CONFIG-REBUILD-R1: local to this component */
.cx-r1-account-addedit .cx-modal-layout-v21 {
    width: 100%;
    display: grid;
    gap: 22px;
}

.cx-r1-account-addedit .cx-r1-section {
    min-width: 0;
    margin: 0;
    padding: .85rem .95rem .95rem;
    border: 1px solid #d7e1ea;
    border-radius: 12px;
    background: #ffffff;
    box-shadow: 0 4px 14px rgba(35, 60, 85, .045);
}

.cx-r1-account-addedit .cx-r1-section-title {
    max-width: calc(100% - 1rem);
    display: inline-flex;
    align-items: center;
    gap: .55rem;
    margin: 0 0 .15rem;
    padding: 0 .45rem;
    color: #2c4c6c;
    font-size: .92rem;
    font-weight: 800;
    line-height: 1.35;
}

.cx-r1-account-addedit .cx-r1-section-icon {
    width: 28px;
    height: 28px;
    min-width: 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    background: #edf3f8;
    color: #3d6287;
    font-size: .78rem;
}

.cx-r1-account-addedit .cx-r1-section-description {
    display: flex;
    align-items: flex-start;
    gap: .45rem;
    margin: .1rem 0 .75rem;
    color: #687787;
    font-size: .82rem;
    line-height: 1.5;
}

    .cx-r1-account-addedit .cx-r1-section-description > i {
        margin-top: .22rem;
        color: #6d88a2;
        font-size: .72rem;
    }

.cx-r1-account-addedit .cx-r1-form-row {
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(180px, 215px) minmax(0, 1fr);
    align-items: start;
    gap: .5rem 1.15rem;
    margin: 0 0 .75rem;
}

    .cx-r1-account-addedit .cx-r1-form-row:last-child {
        margin-bottom: 0;
    }

    .cx-r1-account-addedit .cx-r1-form-row > [class*="col-"] {
        width: auto;
        max-width: none;
        min-width: 0;
        margin: 0;
        padding: 0;
    }

    .cx-r1-account-addedit .cx-r1-form-row > .form-label {
        padding-top: .62rem;
        text-align: right !important;
    }

.cx-r1-account-addedit .form-label > label:not(.custom-switch),
.cx-r1-account-addedit label[aspfor] {
    color: #52677a;
    font-size: .72rem;
    font-weight: 800;
    letter-spacing: .045em;
    line-height: 1.35;
    text-transform: uppercase;
}

    .cx-r1-account-addedit .form-label > label:not(.custom-switch)::after,
    .cx-r1-account-addedit label[aspfor]::after {
        content: ":";
    }

.cx-r1-account-addedit input.form-control,
.cx-r1-account-addedit select.form-control,
.cx-r1-account-addedit textarea.form-control {
    width: 100%;
    min-width: 0;
    border-color: #cfd9e3;
    border-radius: 8px;
    box-shadow: none;
}

.cx-r1-account-addedit .cx-r1-section {
    width: min(100%, 1120px);
    margin-inline: auto;
}

.cx-r1-account-addedit .cx-readonly-value {
    min-height: 42px;
    display: flex;
    align-items: center;
    padding: 9px 12px;
    border: 1px solid #d7e1ea;
    border-radius: 9px;
    background: #f8fafc;
    color: #2c4c6c;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
}

.cx-r1-account-addedit textarea.form-control,
.cx-r1-account-addedit .cx-dialog-textarea {
    width: 100%;
    height: 132px;
    min-height: 84px !important;
    max-height: none !important;
    resize: both !important;
    overflow: auto !important;
}

.cx-r1-account-addedit input:disabled,
.cx-r1-account-addedit select:disabled,
.cx-r1-account-addedit textarea:disabled {
    background: #f3f6f8;
    color: #526170;
    opacity: 1;
}

@media (max-width: 767.98px) {
    .cx-r1-account-addedit .cx-r1-section {
        padding: .85rem;
    }

    .cx-r1-account-addedit .cx-r1-form-row {
        grid-template-columns: minmax(0, 1fr);
        gap: .35rem;
        margin-bottom: .85rem;
    }

        .cx-r1-account-addedit .cx-r1-form-row > .form-label {
            padding-top: 0;
            text-align: left !important;
        }

    .cx-r1-account-addedit .cx-r1-section-description {
        margin-bottom: .8rem;
    }
}

/* Final account-form alignment: no clipped labels and compact read-only rows. */
.cx-r1-account-addedit .cx-r1-form-row {
    grid-template-columns: minmax(150px, 185px) minmax(0, 1fr) !important;
    align-items: center !important;
    gap: .55rem 1rem !important;
}

    .cx-r1-account-addedit .cx-r1-form-row > .form-label {
        min-width: 0;
        padding-top: 0 !important;
        overflow: visible;
    }

        .cx-r1-account-addedit .cx-r1-form-row > .form-label label {
            display: block;
            max-width: 100%;
            white-space: normal;
            overflow-wrap: anywhere;
        }

.cx-r1-account-addedit .cx-r1-form-row--readonly .cx-readonly-value {
    min-height: 44px;
    gap: 7px;
    background: #f8fbfd;
}

    .cx-r1-account-addedit .cx-r1-form-row--readonly .cx-readonly-value i {
        width: 30px;
        height: 30px;
        margin: 0 !important;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        border-radius: 8px;
        background: #edf3f8;
        color: #315879;
    }

@media (max-width: 1100px) {
    .cx-r1-account-addedit .cx-r1-form-row {
        grid-template-columns: minmax(0, 1fr) !important;
        align-items: stretch !important;
        gap: .35rem !important;
    }

        .cx-r1-account-addedit .cx-r1-form-row > .form-label {
            text-align: left !important;
        }
}
/*
     * Palette locale des actions avancées du compte.
     * Ces règles sont placées dans le composant pour ne plus être écrasées
     * par les couleurs MudBlazor ou par un CSS global chargé plus tard.
     */

.account-action-suspend,
.account-action-notice,
.account-action-activate,
.account-action-apply-now,
.account-action-delete {
    min-height: 46px !important;
    border-radius: 9px !important;
    box-shadow: none !important;
    font-weight: 800 !important;
    transition: background-color .15s ease, border-color .15s ease, color .15s ease, box-shadow .15s ease !important;
}

    .account-action-suspend:hover,
    .account-action-notice:hover,
    .account-action-activate:hover,
    .account-action-apply-now:hover,
    .account-action-delete:hover {
        transform: none !important;
        box-shadow: 0 3px 9px rgba(44, 76, 108, .10) !important;
    }

/* Suspendre : ambre chaud, mais moins orange et moins éclatant. */
.account-action-suspend {
    border-color: #b8792c !important;
    background: #b8792c !important;
    color: #ffffff !important;
}

    .account-action-suspend:hover {
        border-color: #a66b24 !important;
        background: #a66b24 !important;
        color: #ffffff !important;
    }

/* Préavis client : bleu Conexgo. */
.account-action-notice {
    border-color: #3d6287 !important;
    background: #3d6287 !important;
    color: #ffffff !important;
}

    .account-action-notice:hover {
        border-color: #345675 !important;
        background: #345675 !important;
        color: #ffffff !important;
    }

/* Réactiver : vert doux cohérent avec les actions positives. */
.account-action-activate {
    border-color: #6b8f71 !important;
    background: #6b8f71 !important;
    color: #ffffff !important;
}

    .account-action-activate:hover {
        border-color: #5d7f64 !important;
        background: #5d7f64 !important;
        color: #ffffff !important;
    }

/* Appliquer maintenant : rouge brique atténué, pas rouge vif. */
.account-action-apply-now {
    border-color: #b45f66 !important;
    background: #b45f66 !important;
    color: #ffffff !important;
}

    .account-action-apply-now:hover {
        border-color: #a45158 !important;
        background: #a45158 !important;
        color: #ffffff !important;
    }

/* Supprimer : danger léger au lieu d’un gros bouton rouge rempli. */
.account-action-delete {
    border-color: #dab0b5 !important;
    background: #fff7f8 !important;
    color: #a44952 !important;
}

    .account-action-delete:hover {
        border-color: #ca9da3 !important;
        background: #fceff1 !important;
        color: #913d46 !important;
    }

    .account-action-suspend .mud-button-label,
    .account-action-notice .mud-button-label,
    .account-action-activate .mud-button-label,
    .account-action-apply-now .mud-button-label,
    .account-action-delete .mud-button-label {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 8px !important;
    }

    .account-action-suspend i,
    .account-action-notice i,
    .account-action-activate i,
    .account-action-apply-now i,
    .account-action-delete i {
        margin: 0 !important;
    }

@media (max-width: 767.98px) {
    .account-action-suspend,
    .account-action-notice,
    .account-action-activate,
    .account-action-apply-now,
    .account-action-delete {
        flex: 1 1 calc(50% - 8px) !important;
    }
}

@media (max-width: 575.98px) {
    .account-action-suspend,
    .account-action-notice,
    .account-action-activate,
    .account-action-apply-now,
    .account-action-delete {
        width: 100% !important;
        min-width: 100% !important;
        flex: 1 1 100% !important;
    }
}

/* CX-MODAL-TITLE-ICON:BEGIN */
/* CX-MODAL-TITLE-ICON:END */
/* CONEXGO-R2-MANUAL-FIELDSET-SPACING */
.cx-r1-account-addedit .cx-modal-layout-v21,
.cx-r1-account-addedit form.cx-dialog-v17-form {
    display: grid;
    gap: 22px;
}

.cx-r1-account-addedit .cx-r1-section + .cx-r1-section,
.cx-r1-account-addedit fieldset + fieldset {
    margin-top: 0;
}

@media (max-width: 767.98px) {
    .cx-r1-account-addedit .cx-modal-layout-v21,
    .cx-r1-account-addedit form.cx-dialog-v17-form {
        gap: 16px;
    }
}

.cx-r1-account-addedit .cx-r1-form-row--readonly .cx-readonly-value,
.cx-r1-account-addedit input[readonly],
.cx-r1-account-addedit input:disabled {
    min-height: 44px !important;
    padding: 9px 12px !important;
    border-radius: 9px !important;
    background: #f8fbfd !important;
}

@media (min-width: 768px) and (max-width: 1199.98px) {
    .cx-r1-account-addedit .cx-r1-section {
        width: min(100%, 980px) !important;
    }

    .cx-r1-account-addedit .cx-r1-form-row {
        grid-template-columns: minmax(145px, 180px) minmax(0, 1fr) !important;
        gap: .5rem .9rem !important;
    }
}
/* #endregion Account_AddEdit.razor */

/* #region Account_Email.razor */
/**************************************** Account_Email.razor ************************************************************************/
/* CONEXGO R8 ACCOUNT EMAIL MUDDIALOG */
.cx-r8-account-email .cx-modal-layout-v21 {
    width: 100%;
    display: grid;
    gap: 20px;
}

.cx-r8-account-email .cx-r8-email-section {
    width: min(100%, 1080px);
    min-width: 0;
    margin: 0 auto;
    padding: .9rem 1rem 1rem;
    border: 1px solid #d7e1ea;
    border-radius: 12px;
    background: #ffffff;
    box-shadow: 0 4px 14px rgba(35, 60, 85, .045);
}

.cx-r8-account-email .cx-r8-section-title {
    max-width: calc(100% - 1rem);
    display: inline-flex;
    align-items: center;
    gap: .55rem;
    margin: 0 0 .15rem;
    padding: 0 .45rem;
    color: #2c4c6c;
    font-size: .92rem;
    font-weight: 800;
    line-height: 1.35;
}

.cx-r8-account-email .cx-r8-section-icon {
    width: 28px;
    height: 28px;
    min-width: 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    background: #edf3f8;
    color: #3d6287;
    font-size: .78rem;
}

.cx-r8-account-email .cx-r8-section-description {
    display: flex;
    align-items: flex-start;
    gap: .45rem;
    margin: .1rem 0 .9rem;
    color: #687787;
    font-size: .82rem;
    line-height: 1.5;
}

    .cx-r8-account-email .cx-r8-section-description > i {
        margin-top: .22rem;
        color: #6d88a2;
        font-size: .72rem;
    }

.cx-r8-account-email .cx-r8-email-tabs {
    margin-bottom: 16px;
    padding: 6px;
    display: flex;
    gap: 8px;
    overflow-x: auto;
    border: 1px solid #dce5ed;
    border-radius: 10px;
    background: #f7fafc;
    scrollbar-width: thin;
}

.cx-r8-account-email .cx-r8-email-tab {
    min-height: 42px;
    padding: 0 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    border: 1px solid transparent;
    border-radius: 8px;
    background: transparent;
    color: #34516f;
    font-weight: 750;
    white-space: nowrap;
    transition: background-color .16s ease, border-color .16s ease, color .16s ease;
}

    .cx-r8-account-email .cx-r8-email-tab.active {
        border-color: #2c4c6c;
        background: #2c4c6c;
        color: #ffffff;
    }

    .cx-r8-account-email .cx-r8-email-tab:not(.active):hover,
    .cx-r8-account-email .cx-r8-email-tab:not(.active):focus-visible {
        border-color: #d7e2eb;
        background: #edf4f9;
        outline: none;
    }

.cx-r8-account-email .cx-r8-form-row {
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(145px, 180px) minmax(0, 1fr);
    align-items: start;
    gap: .5rem 1rem;
    margin: 0 0 .8rem;
}

    .cx-r8-account-email .cx-r8-form-row > [class*="col-"] {
        width: auto;
        max-width: none;
        min-width: 0;
        margin: 0;
        padding: 0;
    }

    .cx-r8-account-email .cx-r8-form-row > .form-label {
        padding-top: .72rem;
        text-align: right !important;
    }

        .cx-r8-account-email .cx-r8-form-row > .form-label label {
            display: block;
            color: #52677a;
            font-size: .74rem;
            font-weight: 800;
            letter-spacing: .035em;
            line-height: 1.35;
            text-transform: uppercase;
            white-space: normal;
            overflow-wrap: anywhere;
        }

            .cx-r8-account-email .cx-r8-form-row > .form-label label::after {
                content: ":";
            }

.cx-r8-account-email .form-control,
.cx-r8-account-email .cx-control {
    width: 100%;
    min-width: 0;
    min-height: 46px;
    border: 1px solid #cfd9e3;
    border-radius: 8px;
    background: #ffffff;
    box-shadow: none;
    transition: border-color .16s ease, box-shadow .16s ease, background-color .16s ease;
}

    .cx-r8-account-email .form-control:hover,
    .cx-r8-account-email .cx-control:hover {
        border-color: #a9bfd2;
        background: #fbfdff;
    }

    .cx-r8-account-email .form-control:focus,
    .cx-r8-account-email .cx-control:focus-within {
        border-color: #6f93b1;
        box-shadow: 0 0 0 3px rgba(61, 98, 135, .12);
        outline: none;
    }

.cx-r8-account-email textarea.form-control {
    height: 210px;
    min-height: 130px;
    max-height: min(48dvh, 460px);
    resize: vertical;
    overflow: auto;
}

.cx-r8-account-email .cx-r8-history-table {
    max-width: 100%;
    overflow: auto;
    border: 1px solid #dce5ed;
    border-radius: 10px;
    scrollbar-gutter: stable;
}

    .cx-r8-account-email .cx-r8-history-table table {
        min-width: 680px;
        margin-bottom: 0;
        table-layout: fixed;
        white-space: normal !important;
    }

    .cx-r8-account-email .cx-r8-history-table th,
    .cx-r8-account-email .cx-r8-history-table td {
        overflow-wrap: anywhere;
        vertical-align: top;
    }

.cx-r8-account-email .cx-r8-email-tab-content {
    min-width: 0;
}

.cx-r8-account-email .cx-r8-email-history-preview {
    display: block;
    margin-top: 4px;
    color: #607286;
    font-size: .78rem;
    line-height: 1.5;
    white-space: pre-wrap;
}

.cx-r8-account-email .cx-standard-action-row {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    flex-wrap: wrap;
}

@media (max-width: 767.98px) {
    .cx-r8-account-email .cx-r8-email-section {
        padding: .85rem;
    }

    .cx-r8-account-email .cx-r8-email-tabs {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .cx-r8-account-email .cx-r8-email-tab {
        width: 100%;
    }

    .cx-r8-account-email .cx-r8-form-row {
        grid-template-columns: minmax(0, 1fr);
        gap: .35rem;
        margin-bottom: .85rem;
    }

        .cx-r8-account-email .cx-r8-form-row > .form-label {
            padding-top: 0;
            text-align: left !important;
        }

    .cx-r8-account-email .cx-standard-action-row > * {
        flex: 1 1 calc(50% - 8px);
    }
}

@media (max-width: 420px) {
    .cx-r8-account-email .cx-r8-email-tabs {
        grid-template-columns: minmax(0, 1fr);
    }

    .cx-r8-account-email .cx-standard-action-row > * {
        width: 100%;
        min-width: 100%;
        flex-basis: 100%;
    }
}

@media (prefers-reduced-motion: reduce) {
    .cx-r8-account-email .cx-r8-email-tab,
    .cx-r8-account-email .form-control,
    .cx-r8-account-email .cx-control {
        transition: none !important;
    }
}
/* #endregion Account_Email.razor */

/* #region Account_Document.razor */
/**************************************** Account_Document.razor ************************************************************************/
.conexgo-list-page-header-row,
.conexgo-list-page-actions {
    min-width: 0;
}

.conexgo-account-documents-table td {
    vertical-align: middle;
    overflow-wrap: anywhere;
    word-break: normal;
}

.conexgo-account-document-name {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    min-width: 0;
    color: #2c4c6c;
    font-weight: 750;
}

.conexgo-account-document-primary {
    width: 100%;
    min-width: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.conexgo-account-document-menu-toggle {
    width: 36px;
    height: 36px;
    flex: 0 0 36px;
    display: inline-grid;
    place-items: center;
    border: 1px solid #d4dfe8;
    border-radius: 9px;
    background: #ffffff;
    color: #2c4c6c;
    transition: background-color .16s ease, border-color .16s ease, transform .16s ease;
}

    .conexgo-account-document-menu-toggle:hover,
    .conexgo-account-document-menu-toggle:focus-visible {
        border-color: #9db3c6;
        background: #eaf2f8;
        transform: translateY(-1px);
        outline: none;
    }

.conexgo-account-document-menu {
    min-width: 190px;
    padding: 7px;
    border: 1px solid #d7e1ea;
    border-radius: 10px;
    box-shadow: 0 14px 30px rgba(35, 60, 85, .16);
}

    .conexgo-account-document-menu .dropdown-item {
        min-height: 38px;
        display: flex;
        align-items: center;
        gap: 9px;
        border: 0;
        border-radius: 7px;
        background: transparent;
    }

        .conexgo-account-document-menu .dropdown-item:hover,
        .conexgo-account-document-menu .dropdown-item:focus-visible {
            background: #eaf2f8;
        }

.conexgo-account-document-name i {
    width: 34px;
    height: 34px;
    flex: 0 0 34px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    background: #edf3f8;
    color: #3d6287;
}

.conexgo-account-document-actions {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    flex-wrap: wrap;
}

.conexgo-account-document-action {
    width: 38px;
    height: 38px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #d4dfe8;
    border-radius: 9px;
    background: #ffffff;
    color: #2c4c6c;
    cursor: pointer;
    transition: background-color .16s ease, border-color .16s ease, color .16s ease, transform .16s ease, box-shadow .16s ease;
}

    .conexgo-account-document-action:hover,
    .conexgo-account-document-action:focus-visible {
        border-color: #9db3c6;
        background: #eaf2f8;
        color: #24435f;
        box-shadow: 0 4px 10px rgba(44, 76, 108, .10);
        transform: translateY(-1px);
        outline: none;
    }

@media (max-width: 575.98px) {
    .conexgo-account-documents-table,
    .conexgo-account-documents-table tbody,
    .conexgo-account-documents-table tr,
    .conexgo-account-documents-table td {
        display: block;
        width: 100%;
    }

        .conexgo-account-documents-table thead {
            display: none;
        }

        .conexgo-account-documents-table tr {
            margin-bottom: 12px;
            padding: 13px;
            border: 1px solid #dce5ed;
            border-radius: 10px;
            background: #ffffff;
            box-shadow: 0 3px 10px rgba(44, 76, 108, .05);
        }

        .conexgo-account-documents-table td {
            padding: 7px 0 !important;
            border: 0 !important;
            text-align: left !important;
        }

    .conexgo-account-document-actions {
        justify-content: flex-start;
    }
}

@media (prefers-reduced-motion: reduce) {
    .conexgo-account-document-action {
        transition: none !important;
    }
}

@media (max-width: 767.98px) {
    .conexgo-list-page-header {
        display: block !important;
        margin-bottom: 14px;
    }

    .conexgo-list-page-header-row {
        align-items: flex-start !important;
        flex-wrap: wrap;
        gap: 12px;
    }

    .conexgo-list-page-actions {
        width: 100%;
        justify-content: flex-start;
        flex-wrap: wrap;
    }
}

@media (max-width: 575.98px) {
    .conexgo-list-page-actions .btn {
        max-width: 100%;
        white-space: normal;
    }
}
/* #endregion Account_Document.razor */

/* #region Account_ManageCallCenterDevices.razor */
/**************************************** Account_ManageCallCenterDevices.razor ************************************************************************/
/* ======================================================================
   CONEXGO R1 - Account Manage Devices / Call Center Devices
   Shared dialog layout
   ====================================================================== */

/* ---------- Call Center Devices ---------- */

.cx-r1-account-managecallcenterdevices .cx-modal-layout-v21,
.cx-r1-account-managecallcenterdevices form.cx-dialog-v17-form {
    width: 100%;
    display: grid;
    gap: 22px;
}

.cx-r1-account-managecallcenterdevices .cx-r1-section + .cx-r1-section,
.cx-r1-account-managecallcenterdevices fieldset + fieldset {
    margin-top: 0;
}

.cx-r1-account-managecallcenterdevices .cx-r1-section {
    min-width: 0;
    margin: 0;
    padding: .85rem .95rem .95rem;
    border: 1px solid #d7e1ea;
    border-radius: 12px;
    background: #fff;
    box-shadow: 0 4px 14px rgba(35,60,85,.045);
}

.cx-r1-account-managecallcenterdevices .cx-r1-section-title {
    max-width: calc(100% - 1rem);
    display: inline-flex;
    align-items: center;
    gap: .55rem;
    margin: 0 0 .15rem;
    padding: 0 .45rem;
    color: #2c4c6c;
    font-size: .92rem;
    font-weight: 800;
    line-height: 1.35;
}

.cx-r1-account-managecallcenterdevices .cx-r1-section-icon {
    width: 28px;
    height: 28px;
    min-width: 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    background: #edf3f8;
    color: #3d6287;
    font-size: .78rem;
}

.cx-r1-account-managecallcenterdevices .cx-r1-section-description {
    display: flex;
    align-items: flex-start;
    gap: .45rem;
    margin: .1rem 0 .75rem;
    color: #687787;
    font-size: .82rem;
    line-height: 1.5;
}

    .cx-r1-account-managecallcenterdevices .cx-r1-section-description > i {
        margin-top: .22rem;
        color: #6d88a2;
        font-size: .72rem;
    }

.cx-r1-account-managecallcenterdevices .cx-r1-form-row {
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(175px,225px) minmax(0,1fr);
    align-items: start;
    gap: .45rem .9rem;
    margin: 0 0 .75rem;
}

    .cx-r1-account-managecallcenterdevices .cx-r1-form-row:last-child {
        margin-bottom: 0;
    }

    .cx-r1-account-managecallcenterdevices .cx-r1-form-row > [class*="col-"] {
        width: auto;
        max-width: none;
        min-width: 0;
        margin: 0;
        padding: 0;
    }

    .cx-r1-account-managecallcenterdevices .cx-r1-form-row > .form-label {
        padding-top: .62rem;
        text-align: right !important;
    }

.cx-r1-account-managecallcenterdevices .form-label > label:not(.custom-switch),
.cx-r1-account-managecallcenterdevices label[aspfor] {
    color: #52677a;
    font-size: .72rem;
    font-weight: 800;
    letter-spacing: .045em;
    line-height: 1.35;
    text-transform: uppercase;
}

    .cx-r1-account-managecallcenterdevices .form-label > label:not(.custom-switch)::after,
    .cx-r1-account-managecallcenterdevices label[aspfor]::after {
        content: ":";
    }

.cx-r1-account-managecallcenterdevices input.form-control,
.cx-r1-account-managecallcenterdevices select.form-control,
.cx-r1-account-managecallcenterdevices textarea.form-control {
    width: 100%;
    min-width: 0;
    border-color: #cfd9e3;
    border-radius: 8px;
    box-shadow: none;
}

.cx-r1-account-managecallcenterdevices textarea.form-control,
.cx-r1-account-managecallcenterdevices .cx-dialog-textarea {
    width: 100%;
    height: 132px;
    min-height: 84px !important;
    max-height: none !important;
    resize: both !important;
    overflow: auto !important;
}

.cx-r1-account-managecallcenterdevices input:disabled,
.cx-r1-account-managecallcenterdevices select:disabled,
.cx-r1-account-managecallcenterdevices textarea:disabled {
    background: #f3f6f8;
    color: #526170;
    opacity: 1;
}

@media (max-width:767.98px) {

    .cx-r1-account-managecallcenterdevices .cx-modal-layout-v21,
    .cx-r1-account-managecallcenterdevices form.cx-dialog-v17-form {
        gap: 16px;
    }

    .cx-r1-account-managecallcenterdevices .cx-r1-section {
        padding: .85rem;
    }

    .cx-r1-account-managecallcenterdevices .cx-r1-form-row {
        grid-template-columns: minmax(0,1fr);
        gap: .35rem;
        margin-bottom: .85rem;
    }

        .cx-r1-account-managecallcenterdevices .cx-r1-form-row > .form-label {
            padding-top: 0;
            text-align: left !important;
        }

    .cx-r1-account-managecallcenterdevices .cx-r1-section-description {
        margin-bottom: .8rem;
    }
}

/* ---------- Manage Devices ---------- */

.cx-r1-account-managedevices .cx-modal-layout-v21,
.cx-r1-account-managedevices form.cx-dialog-v17-form {
    width: 100%;
    display: grid;
    gap: 22px;
}

.cx-r1-account-managedevices .cx-r1-section + .cx-r1-section,
.cx-r1-account-managedevices fieldset + fieldset {
    margin-top: 0;
}

.cx-r1-account-managedevices .cx-r1-section {
    min-width: 0;
    margin: 0;
    padding: .85rem .95rem .95rem;
    border: 1px solid #d7e1ea;
    border-radius: 12px;
    background: #fff;
    box-shadow: 0 4px 14px rgba(35,60,85,.045);
}

.cx-r1-account-managedevices .cx-r1-section-title {
    max-width: calc(100% - 1rem);
    display: inline-flex;
    align-items: center;
    gap: .55rem;
    margin: 0 0 .15rem;
    padding: 0 .45rem;
    color: #2c4c6c;
    font-size: .92rem;
    font-weight: 800;
    line-height: 1.35;
}

.cx-r1-account-managedevices .cx-r1-section-icon {
    width: 28px;
    height: 28px;
    min-width: 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    background: #edf3f8;
    color: #3d6287;
    font-size: .78rem;
}

.cx-r1-account-managedevices .cx-r1-section-description {
    display: flex;
    align-items: flex-start;
    gap: .45rem;
    margin: .1rem 0 .75rem;
    color: #687787;
    font-size: .82rem;
    line-height: 1.5;
}

    .cx-r1-account-managedevices .cx-r1-section-description > i {
        margin-top: .22rem;
        color: #6d88a2;
        font-size: .72rem;
    }

.cx-r1-account-managedevices .cx-r1-form-row {
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(175px,225px) minmax(0,1fr);
    align-items: start;
    gap: .45rem .9rem;
    margin: 0 0 .75rem;
}

    .cx-r1-account-managedevices .cx-r1-form-row:last-child {
        margin-bottom: 0;
    }

    .cx-r1-account-managedevices .cx-r1-form-row > [class*="col-"] {
        width: auto;
        max-width: none;
        min-width: 0;
        margin: 0;
        padding: 0;
    }

    .cx-r1-account-managedevices .cx-r1-form-row > .form-label {
        padding-top: .62rem;
        text-align: right !important;
    }

.cx-r1-account-managedevices .form-label > label:not(.custom-switch),
.cx-r1-account-managedevices label[aspfor] {
    color: #52677a;
    font-size: .72rem;
    font-weight: 800;
    letter-spacing: .045em;
    line-height: 1.35;
    text-transform: uppercase;
}

    .cx-r1-account-managedevices .form-label > label:not(.custom-switch)::after,
    .cx-r1-account-managedevices label[aspfor]::after {
        content: ":";
    }

.cx-r1-account-managedevices input.form-control,
.cx-r1-account-managedevices select.form-control,
.cx-r1-account-managedevices textarea.form-control {
    width: 100%;
    min-width: 0;
    border-color: #cfd9e3;
    border-radius: 8px;
    box-shadow: none;
}

.cx-r1-account-managedevices textarea.form-control,
.cx-r1-account-managedevices .cx-dialog-textarea {
    width: 100%;
    height: 132px;
    min-height: 84px !important;
    max-height: none !important;
    resize: both !important;
    overflow: auto !important;
}

.cx-r1-account-managedevices input:disabled,
.cx-r1-account-managedevices select:disabled,
.cx-r1-account-managedevices textarea:disabled {
    background: #f3f6f8;
    color: #526170;
    opacity: 1;
}

@media (max-width:767.98px) {

    .cx-r1-account-managedevices .cx-modal-layout-v21,
    .cx-r1-account-managedevices form.cx-dialog-v17-form {
        gap: 16px;
    }

    .cx-r1-account-managedevices .cx-r1-section {
        padding: .85rem;
    }

    .cx-r1-account-managedevices .cx-r1-form-row {
        grid-template-columns: minmax(0,1fr);
        gap: .35rem;
        margin-bottom: .85rem;
    }

        .cx-r1-account-managedevices .cx-r1-form-row > .form-label {
            padding-top: 0;
            text-align: left !important;
        }

    .cx-r1-account-managedevices .cx-r1-section-description {
        margin-bottom: .8rem;
    }
}
/* #endregion Account_ManageCallCenterDevices.razor */

/* #region Account_Detail.razor */
/**************************************** Account_Detail.razor ************************************************************************/
.conexgo-profile-icon-select {
    width: 100%;
    min-width: 0;
}

.conexgo-profile-icon-option-content {
    min-width: 0;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: #2c4c6c;
    font-weight: 750;
}

    .conexgo-profile-icon-option-content img,
    .conexgo-profile-icon-none {
        width: 34px;
        height: 34px;
        flex: 0 0 34px;
        border-radius: 999px;
        object-fit: cover;
        background: #ffffff;
    }

.conexgo-profile-icon-none {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #eef3f7;
    color: #64778a;
}
/* #endregion Account_Detail.razor */

/* #region Account_PasswordReset.razor */
/**************************************** Account_PasswordReset.razor ************************************************************************/
.account-password-reset-button-icon {
    margin-right: .5rem;
    font-size: .95rem;
    line-height: 1;
}

/* CX-MODAL-TITLE-ICON:BEGIN */
/* CX-MODAL-TITLE-ICON:END */
/* CONEXGO-MODAL-DEVICE-CONFIG-REBUILD-R1: local to this component */
.cx-r1-account-passwordreset .cx-modal-layout-v21 {
    width: 100%;
    display: grid;
    gap: 22px;
}

.cx-r1-account-passwordreset .cx-r1-section {
    min-width: 0;
    margin: 0;
    padding: .85rem .95rem .95rem;
    border: 1px solid #d7e1ea;
    border-radius: 12px;
    background: #ffffff;
    box-shadow: 0 4px 14px rgba(35, 60, 85, .045);
}

.cx-r1-account-passwordreset .cx-r1-section-title {
    max-width: calc(100% - 1rem);
    display: inline-flex;
    align-items: center;
    gap: .55rem;
    margin: 0 0 .15rem;
    padding: 0 .45rem;
    color: #2c4c6c;
    font-size: .92rem;
    font-weight: 800;
    line-height: 1.35;
}

.cx-r1-account-passwordreset .cx-r1-section-icon {
    width: 28px;
    height: 28px;
    min-width: 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    background: #edf3f8;
    color: #3d6287;
    font-size: .78rem;
}

.cx-r1-account-passwordreset .cx-r1-section-description {
    display: flex;
    align-items: flex-start;
    gap: .45rem;
    margin: .1rem 0 .75rem;
    color: #687787;
    font-size: .82rem;
    line-height: 1.5;
}

    .cx-r1-account-passwordreset .cx-r1-section-description > i {
        margin-top: .22rem;
        color: #6d88a2;
        font-size: .72rem;
    }

.cx-r1-account-passwordreset .cx-r1-form-row {
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(175px, 225px) minmax(0, 1fr);
    align-items: start;
    gap: .45rem .9rem;
    margin: 0 0 .75rem;
}

    .cx-r1-account-passwordreset .cx-r1-form-row:last-child {
        margin-bottom: 0;
    }

    .cx-r1-account-passwordreset .cx-r1-form-row > [class*="col-"] {
        width: auto;
        max-width: none;
        min-width: 0;
        margin: 0;
        padding: 0;
    }

    .cx-r1-account-passwordreset .cx-r1-form-row > .form-label {
        padding-top: .62rem;
        text-align: right !important;
    }

.cx-r1-account-passwordreset .form-label > label:not(.custom-switch),
.cx-r1-account-passwordreset label[aspfor] {
    color: #52677a;
    font-size: .72rem;
    font-weight: 800;
    letter-spacing: .045em;
    line-height: 1.35;
    text-transform: uppercase;
}

    .cx-r1-account-passwordreset .form-label > label:not(.custom-switch)::after,
    .cx-r1-account-passwordreset label[aspfor]::after {
        content: ":";
    }

.cx-r1-account-passwordreset input.form-control,
.cx-r1-account-passwordreset select.form-control,
.cx-r1-account-passwordreset textarea.form-control {
    width: 100%;
    min-width: 0;
    border-color: #cfd9e3;
    border-radius: 8px;
    box-shadow: none;
}

.cx-r1-account-passwordreset textarea.form-control,
.cx-r1-account-passwordreset .cx-dialog-textarea {
    width: 100%;
    height: auto;
    min-height: 112px !important;
    max-height: min(52vh, 520px) !important;
    resize: both !important;
    overflow: auto !important;
}

.cx-r1-account-passwordreset input:disabled,
.cx-r1-account-passwordreset select:disabled,
.cx-r1-account-passwordreset textarea:disabled {
    background: #f3f6f8;
    color: #526170;
    opacity: 1;
}

@media (max-width: 767.98px) {
    .cx-r1-account-passwordreset .cx-r1-section {
        padding: .85rem;
    }

    .cx-r1-account-passwordreset .cx-r1-form-row {
        grid-template-columns: minmax(0, 1fr);
        gap: .35rem;
        margin-bottom: .85rem;
    }

        .cx-r1-account-passwordreset .cx-r1-form-row > .form-label {
            padding-top: 0;
            text-align: left !important;
        }

    .cx-r1-account-passwordreset .cx-r1-section-description {
        margin-bottom: .8rem;
    }
}

.cx-compact-action-dialog {
    width: min(900px, calc(100vw - 32px)) !important;
    max-width: min(900px, calc(100vw - 32px)) !important;
}

.account-password-reset-summary {
    width: min(100%, 720px);
    margin: 0 auto;
    padding: 16px;
    display: grid;
    grid-template-columns: 44px minmax(0, 1fr);
    align-items: start;
    gap: 14px;
    border: 1px solid #dbe3eb;
    border-radius: 11px;
    background: #f8fafc;
}

.account-password-reset-account-icon {
    width: 44px;
    height: 44px;
    display: grid;
    place-items: center;
    border-radius: 10px;
    background: #e7eff6;
    color: #2c4c6c;
    font-size: 18px;
}

.account-password-reset-account-name {
    color: #244563;
    font-size: 1rem;
    font-weight: 800;
}

.account-password-reset-address {
    margin-top: 5px;
    color: #667585;
    font-size: .86rem;
    line-height: 1.45;
}

.account-password-reset-email {
    margin-top: 9px;
    display: flex;
    align-items: center;
    gap: 8px;
    color: #526170;
}

.account-password-reset-warning {
    width: min(100%, 720px);
    margin: 14px auto 0;
    padding: 12px 14px;
    display: flex;
    align-items: flex-start;
    gap: 10px;
    border: 1px solid #efc8cc;
    border-radius: 10px;
    background: #fff7f7;
    color: #98444c;
    font-size: .9rem;
    line-height: 1.5;
}

    .account-password-reset-warning > i {
        margin-top: 3px;
    }

/* CONEXGO-R2-MANUAL-FIELDSET-SPACING */
.cx-r1-account-passwordreset .cx-modal-layout-v21,
.cx-r1-account-passwordreset form.cx-dialog-v17-form {
    display: grid;
    gap: 22px;
}

.cx-r1-account-passwordreset .cx-r1-section + .cx-r1-section,
.cx-r1-account-passwordreset fieldset + fieldset {
    margin-top: 0;
}

@media (max-width: 767.98px) {
    .cx-r1-account-passwordreset .cx-modal-layout-v21,
    .cx-r1-account-passwordreset form.cx-dialog-v17-form {
        gap: 16px;
    }
}
/* #endregion Account_PasswordReset.razor */

/* #region Account_BlockNotice.razor */
/**************************************** Account_BlockNotice.razor ************************************************************************/
/* CONEXGO-MODAL-DEVICE-CONFIG-REBUILD-R1: local to this component */
.cx-r1-account-blocknotice .cx-modal-layout-v21 {
    width: 100%;
    display: grid;
    gap: 22px;
}

.cx-r1-account-blocknotice .cx-r1-section {
    min-width: 0;
    margin: 0;
    padding: .85rem .95rem .95rem;
    border: 1px solid #d7e1ea;
    border-radius: 12px;
    background: #ffffff;
    box-shadow: 0 4px 14px rgba(35, 60, 85, .045);
}

.cx-r1-account-blocknotice .cx-r1-section-title {
    max-width: calc(100% - 1rem);
    display: inline-flex;
    align-items: center;
    gap: .55rem;
    margin: 0 0 .15rem;
    padding: 0 .45rem;
    color: #2c4c6c;
    font-size: .92rem;
    font-weight: 800;
    line-height: 1.35;
}

.cx-r1-account-blocknotice .cx-r1-section-icon {
    width: 28px;
    height: 28px;
    min-width: 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    background: #edf3f8;
    color: #3d6287;
    font-size: .78rem;
}

.cx-r1-account-blocknotice .cx-r1-section-description {
    display: flex;
    align-items: flex-start;
    gap: .45rem;
    margin: .1rem 0 .75rem;
    color: #687787;
    font-size: .82rem;
    line-height: 1.5;
}

    .cx-r1-account-blocknotice .cx-r1-section-description > i {
        margin-top: .22rem;
        color: #6d88a2;
        font-size: .72rem;
    }

.cx-r1-account-blocknotice .cx-r1-form-row {
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(175px, 225px) minmax(0, 1fr);
    align-items: start;
    gap: .45rem .9rem;
    margin: 0 0 .75rem;
}

    .cx-r1-account-blocknotice .cx-r1-form-row:last-child {
        margin-bottom: 0;
    }

    .cx-r1-account-blocknotice .cx-r1-form-row > [class*="col-"] {
        width: auto;
        max-width: none;
        min-width: 0;
        margin: 0;
        padding: 0;
    }

    .cx-r1-account-blocknotice .cx-r1-form-row > .form-label {
        padding-top: .62rem;
        text-align: right !important;
    }

.cx-r1-account-blocknotice .form-label > label:not(.custom-switch),
.cx-r1-account-blocknotice label[aspfor] {
    color: #52677a;
    font-size: .72rem;
    font-weight: 800;
    letter-spacing: .045em;
    line-height: 1.35;
    text-transform: uppercase;
}

    .cx-r1-account-blocknotice .form-label > label:not(.custom-switch)::after,
    .cx-r1-account-blocknotice label[aspfor]::after {
        content: ":";
    }

.cx-r1-account-blocknotice input.form-control,
.cx-r1-account-blocknotice select.form-control,
.cx-r1-account-blocknotice textarea.form-control {
    width: 100%;
    min-width: 0;
    border-color: #cfd9e3;
    border-radius: 8px;
    box-shadow: none;
}

.cx-r1-account-blocknotice textarea.form-control,
.cx-r1-account-blocknotice .cx-dialog-textarea {
    width: 100%;
    height: 132px;
    min-height: 84px !important;
    max-height: none !important;
    resize: both !important;
    overflow: auto !important;
}

.cx-r1-account-blocknotice input:disabled,
.cx-r1-account-blocknotice select:disabled,
.cx-r1-account-blocknotice textarea:disabled {
    background: #f3f6f8;
    color: #526170;
    opacity: 1;
}

.cx-r1-account-blocknotice .cx-r1-form-row--with-help {
    grid-template-columns: minmax(175px, 225px) minmax(220px, 320px) minmax(0, 1fr);
}

    .cx-r1-account-blocknotice .cx-r1-form-row--with-help .cx-field-help {
        min-width: 0;
        padding-top: .55rem;
        color: #657485;
        font-size: .8rem;
        line-height: 1.45;
    }

.cx-r1-account-blocknotice .cx-r1-recipient-card {
    min-height: 44px;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 9px 12px;
    border: 1px solid #d7e1ea;
    border-radius: 9px;
    background: #f8fafc;
    color: #2c4c6c;
    font-weight: 750;
}

    .cx-r1-account-blocknotice .cx-r1-recipient-card i {
        color: #3d6287;
    }

.cx-r1-account-blocknotice .cx-r1-preview-card {
    min-width: 0;
    padding: 14px 16px;
    border: 1px solid #d7e1ea;
    border-radius: 10px;
    background: #ffffff;
    box-shadow: 0 4px 12px rgba(44, 76, 108, .05);
}

@media (max-width: 767.98px) {
    .cx-r1-account-blocknotice .cx-r1-section {
        padding: .85rem;
    }

    .cx-r1-account-blocknotice .cx-r1-form-row {
        grid-template-columns: minmax(0, 1fr);
        gap: .35rem;
        margin-bottom: .85rem;
    }

        .cx-r1-account-blocknotice .cx-r1-form-row > .form-label {
            padding-top: 0;
            text-align: left !important;
        }

    .cx-r1-account-blocknotice .cx-r1-form-row--with-help {
        grid-template-columns: minmax(0, 1fr);
    }

        .cx-r1-account-blocknotice .cx-r1-form-row--with-help .cx-field-help {
            padding-top: 0;
        }

    .cx-r1-account-blocknotice .cx-r1-section-description {
        margin-bottom: .8rem;
    }
}

.account-blocknotice-dialog {
    width: min(980px, calc(100vw - 28px)) !important;
    max-width: min(980px, calc(100vw - 28px)) !important;
}

.account-blocknotice-history-section {
    width: 100%;
    margin-top: 22px;
}

.account-blocknotice-history-heading {
    margin-bottom: 10px;
}

.account-blocknotice-history-title {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #2c4c6c;
    font-size: 15px;
    line-height: 1.35;
    font-weight: 800;
}

    .account-blocknotice-history-title > i {
        color: #3d6287;
    }

.account-blocknotice-history-count {
    min-width: 25px;
    height: 25px;
    padding: 0 8px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    background: #e8eef5;
    color: #2c4c6c;
    font-size: 12.5px;
    font-weight: 800;
}

.account-blocknotice-history-table-wrapper {
    width: 100%;
    overflow-x: auto;
    border: 1px solid #d7e0e9;
    border-radius: 10px;
    background: #ffffff;
}

.account-blocknotice-history-table {
    width: 100% !important;
    min-width: 760px;
    background: #ffffff !important;
}

    .account-blocknotice-history-table .mud-table-container {
        width: 100% !important;
        overflow: visible !important;
        border: 0 !important;
        border-radius: 0 !important;
    }

    .account-blocknotice-history-table .mud-table-root {
        width: 100% !important;
        table-layout: fixed;
    }

    .account-blocknotice-history-table .mud-table-head .mud-table-cell {
        padding: 11px 13px !important;
        border-bottom: 1px solid #cbd7e2 !important;
        background: #eef3f7 !important;
        color: #2c4c6c !important;
        font-size: 13px !important;
        line-height: 1.35 !important;
        font-weight: 800 !important;
        white-space: normal !important;
        vertical-align: middle !important;
    }

    .account-blocknotice-history-table .mud-table-body .mud-table-cell {
        padding: 12px 13px !important;
        border-bottom: 1px solid #e5ebf0 !important;
        color: #344054 !important;
        font-size: 13.5px !important;
        line-height: 1.45 !important;
        vertical-align: middle !important;
        overflow-wrap: anywhere;
    }

    .account-blocknotice-history-table .mud-table-body .mud-table-row:hover .mud-table-cell {
        background: #edf3f8 !important;
    }

.account-blocknotice-reason {
    color: #253858;
    font-weight: 650;
}

.account-blocknotice-date {
    color: #445164;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

.account-blocknotice-status {
    min-height: 28px;
    padding: 5px 9px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid transparent;
    border-radius: 999px;
    font-size: 12.5px;
    line-height: 1;
    font-weight: 800;
    white-space: nowrap;
}

.account-blocknotice-status-draft {
    border-color: #cfd7e0;
    background: #f3f5f7;
    color: #596574;
}

.account-blocknotice-status-sent {
    border-color: #aebfd2;
    background: #eef4f9;
    color: #345675;
}

.account-blocknotice-status-acknowledged {
    border-color: #9ec3a5;
    background: #eef7ef;
    color: #4f7155;
}

.account-blocknotice-status-cancelled,
.account-blocknotice-status-expired {
    border-color: #d9b8bc;
    background: #fff4f5;
    color: #9a4650;
}

.account-blocknotice-status-applied {
    border-color: #9fc0a5;
    background: #ebf5ed;
    color: #456b4c;
}

@media (max-width: 767.98px) {
    .account-blocknotice-dialog {
        width: calc(100vw - 12px) !important;
        max-width: calc(100vw - 12px) !important;
    }

    .account-blocknotice-form > .row {
        margin-left: 0 !important;
        margin-right: 0 !important;
        row-gap: 5px;
    }

        .account-blocknotice-form > .row + .row {
            margin-top: 12px !important;
        }

        .account-blocknotice-form > .row > [class*="col-md-"] {
            width: 100%;
            max-width: 100%;
            padding-left: 0 !important;
            padding-right: 0 !important;
            text-align: left !important;
        }

            .account-blocknotice-form > .row > [class*="col-md-"]:empty {
                display: none;
            }

    .account-blocknotice-form .form-label {
        min-height: 0;
        padding-top: 0 !important;
        padding-bottom: 0 !important;
        text-align: left !important;
        color: #2c4c6c;
        font-weight: 750;
    }

    .account-blocknotice-form
    :is(.form-control, .form-select, input, select):not(textarea) {
        width: 100% !important;
        max-width: 100% !important;
        min-height: 42px;
        font-size: 16px !important;
    }

    .account-blocknotice-form textarea.form-control {
        width: 100%;
        max-width: 100%;
        min-height: 130px;
        height: 132px;
        resize: both;
        overflow: auto;
        font-size: 16px !important;
    }

    .account-blocknotice-form .custom-switch {
        min-height: 40px;
        display: inline-flex;
        align-items: center;
    }

    .account-blocknotice-history-section {
        margin-top: 18px;
    }

    .account-blocknotice-history-table-wrapper {
        overflow: visible;
        border: 0;
        border-radius: 0;
        background: transparent;
    }

    .account-blocknotice-history-table {
        min-width: 0;
        background: transparent !important;
    }

        .account-blocknotice-history-table .mud-table-container {
            overflow: visible !important;
            background: transparent !important;
        }

        .account-blocknotice-history-table .mud-table-root,
        .account-blocknotice-history-table .mud-table-body {
            width: 100% !important;
            display: block;
        }

        .account-blocknotice-history-table .mud-table-head {
            display: none;
        }

        .account-blocknotice-history-table .mud-table-body .mud-table-row {
            width: 100%;
            margin-bottom: 10px;
            display: grid;
            grid-template-columns: minmax(0, 1fr);
            overflow: hidden;
            border: 1px solid #d7e0e9;
            border-radius: 10px;
            background: #ffffff;
            box-shadow: 0 2px 8px rgba(44, 76, 108, .06);
        }

        .account-blocknotice-history-table .mud-table-body .mud-table-cell,
        .account-blocknotice-history-table .mud-table-body .mud-table-cell:last-child {
            border-bottom: 0 !important;
        }

            .account-blocknotice-history-table .mud-table-body .mud-table-cell::before {
                content: attr(data-label);
                color: #2c4c6c;
                font-size: 12px;
                line-height: 1.35;
                font-weight: 800;
                overflow-wrap: anywhere;
            }

    .account-blocknotice-date {
        white-space: normal;
    }
}

@media (max-width: 575.98px) {
    .account-blocknotice-history-table .mud-table-body .mud-table-cell {
        grid-template-columns: minmax(0, 1fr);
        gap: 4px;
    }
}

/* CX-MODAL-TITLE-ICON:BEGIN */
/* CX-MODAL-TITLE-ICON:END */
/* CONEXGO-R2-MANUAL-FIELDSET-SPACING */
.cx-r1-account-blocknotice .cx-modal-layout-v21,
.cx-r1-account-blocknotice form.cx-dialog-v17-form {
    display: grid;
    gap: 22px;
}

.cx-r1-account-blocknotice .cx-r1-section + .cx-r1-section,
.cx-r1-account-blocknotice fieldset + fieldset {
    margin-top: 0;
}

@media (max-width: 767.98px) {
    .cx-r1-account-blocknotice .cx-modal-layout-v21,
    .cx-r1-account-blocknotice form.cx-dialog-v17-form {
        gap: 16px;
    }
}

.mud-dialog.cx-r1-account-blocknotice,
.cx-r1-account-blocknotice {
    width: min(980px, calc(100vw - 28px)) !important;
    max-width: min(980px, calc(100vw - 28px)) !important;
    max-height: calc(100vh - 28px) !important;
    overflow: hidden !important;
}

    .cx-r1-account-blocknotice .cx-dialog-v17-content {
        min-height: 0 !important;
        overflow-y: auto !important;
        overflow-x: hidden !important;
        scrollbar-gutter: stable !important;
    }

    .cx-r1-account-blocknotice .cx-dialog-v17-actions {
        position: relative !important;
        z-index: 3 !important;
        border-top: 1px solid #d8e2ec !important;
        background: #f8fafc !important;
    }

@media (max-width: 767.98px) {
    .mud-dialog.cx-r1-account-blocknotice,
    .cx-r1-account-blocknotice {
        width: calc(100vw - 14px) !important;
        max-width: calc(100vw - 14px) !important;
        max-height: calc(100vh - 14px) !important;
    }

        .cx-r1-account-blocknotice .cx-dialog-v17-content {
            padding: 10px !important;
        }
}
/* #endregion Account_BlockNotice.razor */

/* #region Account_Config.razor */
/**************************************** Account_Config.razor ************************************************************************/
.account-config-card {
    overflow: hidden;
    border: 1px solid #d9e2ea;
    border-radius: 10px;
    background: #ffffff;
    box-shadow: 0 8px 24px rgba(23, 43, 77, .07);
}

.account-config-card-body {
    padding: 1rem;
}

.account-config-main-header {
    padding: .75rem 1rem;
    border-radius: 8px;
    background: #2c4c6c;
}

.account-config-toolbar {
    display: flex;
    align-items: stretch;
    justify-content: flex-end;
    gap: .5rem;
    flex-wrap: wrap;
}

.account-config-toolbar-button {
    min-width: 78px;
    min-height: 48px;
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: .25rem;
    padding: .45rem .6rem;
    border: 1px solid rgba(255, 255, 255, .28);
    border-radius: 9px;
    background: rgba(255, 255, 255, .08);
    color: #ffffff;
    text-align: center;
    text-decoration: none;
    cursor: pointer;
}

    .account-config-toolbar-button:focus-visible {
        outline: 3px solid rgba(255, 255, 255, .34);
        outline-offset: 2px;
    }

    .account-config-toolbar-button svg {
        width: 18px;
        height: 18px;
    }

    .account-config-toolbar-button span {
        font-size: 8pt;
        line-height: 1.15;
    }

.account-config-section-header {
    min-height: 48px;
    border: 1px solid #d7e0e8;
    background: #f3f6f8;
    box-shadow: 0 1px 2px rgba(23, 43, 77, .04);
}

    .account-config-section-header > div:first-child {
        letter-spacing: .005em;
    }

.account-config-section-title {
    font-size: 11pt;
    font-weight: 600;
    color: #2c4c6c;
}

.account-config-column-label {
    font-size: 9pt;
    color: #666;
    font-weight: 600;
}

.account-config-section-content {
    border: 1px solid #dee2e6;
    border-top: none;
    border-radius: 0 0 8px 8px;
    border-color: #dce4eb !important;
    background: #ffffff !important;
    box-shadow: 0 3px 10px rgba(23, 43, 77, .035);
}

    .account-config-section-content .fa-pencil {
        color: #3d6287 !important;
    }

.account-config-collapse-button {
    width: 34px;
    height: 34px;
    min-width: 34px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    border: 1px solid #b9c8d4;
    border-radius: 9px;
    background: rgba(255, 255, 255, .88);
    color: #2c4c6c;
    box-shadow: 0 1px 2px rgba(34, 58, 82, .08);
    cursor: pointer;
}

    .account-config-collapse-button:focus-visible {
        outline: 3px solid rgba(61, 98, 135, .22);
        outline-offset: 2px;
    }

    .account-config-collapse-button svg {
        width: 16px;
        height: 16px;
    }

    .account-config-collapse-button.is-expanded svg {
        transform: rotate(180deg);
    }

@media (max-width: 991.98px) {
    .account-config-main-header > .row {
        row-gap: .75rem;
    }

    .account-config-toolbar {
        justify-content: flex-start;
    }
}

@media (max-width: 767.98px) {
    .account-config-card-body {
        padding: .7rem;
    }

    .account-config-main-header {
        padding: .7rem;
    }

    .account-config-toolbar {
        width: 100%;
        display: flex;
        align-items: center;
        justify-content: flex-end;
        flex-wrap: nowrap;
        gap: .4rem;
    }

    .account-config-toolbar-button {
        width: 36px;
        height: 36px;
        min-width: 36px;
        min-height: 36px;
        padding: 0;
        flex: 0 0 36px;
    }

        .account-config-toolbar-button span {
            position: absolute;
            width: 1px;
            height: 1px;
            padding: 0;
            margin: -1px;
            overflow: hidden;
            clip: rect(0, 0, 0, 0);
            white-space: nowrap;
            border: 0;
        }

    .account-config-section-header {
        min-height: 46px;
        padding-left: .75rem !important;
        padding-right: .6rem !important;
    }

    .account-config-section-content {
        padding-left: .75rem !important;
        padding-right: .75rem !important;
    }
}

@media (min-width: 992px) {
    html body.cx-design-system .account-config-card .table-responsive,
    html body.cx-design-system .account-config-card #basic_datatable_wrapper,
    html body.cx-design-system .account-config-card .r18-197-s055,
    html body.cx-design-system .account-config-card .r18-197-s055 > [class*="col-"] {
        overflow: visible !important;
    }

    html body.cx-design-system .account-config-card .account-config-section-header,
    html body.cx-design-system .account-config-card .account-config-section-content {
        position: relative !important;
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        display: grid !important;
        grid-template-columns:
            44px
            minmax(130px, .90fr)
            minmax(82px, .48fr)
            minmax(220px, 1.52fr)
            minmax(145px, .92fr)
            minmax(250px, 1.62fr) !important;
        column-gap: 10px !important;
        align-items: center !important;
        box-sizing: border-box !important;
    }

    html body.cx-design-system .account-config-card .account-config-section-header {
        min-height: 68px !important;
        padding: 13px 12px 13px 18px !important;
        border-color: #b8cfdf !important;
        background: #e9f2f8 !important;
        color: #244b6b !important;
        cursor: pointer !important;
        overflow: visible !important;
    }

    html body.cx-design-system .account-config-card .account-config-section-content {
        min-height: 112px !important;
        padding: 16px 18px !important;
        align-items: start !important;
        border-color: #d5e0e7 !important;
        border-radius: 0 0 10px 10px !important;
        background: #fff !important;
        overflow: hidden !important;
    }

    html body.cx-design-system .account-config-card .account-config-section-header.is-expanded {
        border-radius: 10px 10px 0 0 !important;
    }

    html body.cx-design-system .account-config-card .account-config-section-header > [class*="col-"],
    html body.cx-design-system .account-config-card .account-config-section-content > [class*="col-"] {
        width: auto !important;
        max-width: none !important;
        min-width: 0 !important;
        flex: none !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    html body.cx-design-system .account-config-card .account-config-section-title {
        grid-column: 1 / 4 !important;
        min-width: 0 !important;
        color: #244b6b !important;
        font-size: 1rem !important;
        font-weight: 750 !important;
    }

    html body.cx-design-system .account-config-card .account-config-column-label {
        min-width: 0 !important;
        color: #244b6b !important;
        font-size: .82rem !important;
        font-weight: 800 !important;
        letter-spacing: .025em !important;
        text-transform: uppercase !important;
    }

    html body.cx-design-system .account-config-card .account-config-section-header .account-config-col-email {
        grid-column: 4 !important;
    }

    html body.cx-design-system .account-config-card .account-config-section-header .account-config-col-sms {
        grid-column: 5 !important;
    }

    html body.cx-design-system .account-config-card .account-config-section-header .account-config-col-updated {
        grid-column: 6 !important;
        min-width: 0 !important;
        padding-left: 18px !important;
        padding-right: 8px !important;
    }

    html body.cx-design-system .account-config-card .account-config-section-header > .cx-account-config-edge-toggle {
        position: absolute !important;
        top: 50% !important;
        right: -26px !important;
        left: auto !important;
        width: 44px !important;
        min-width: 44px !important;
        max-width: 44px !important;
        height: 44px !important;
        min-height: 44px !important;
        margin: 0 !important;
        padding: 0 !important;
        display: grid !important;
        place-items: center !important;
        transform: translateY(-50%) !important;
        overflow: visible !important;
        z-index: 10 !important;
        pointer-events: auto !important;
        border: 0 !important;
        background: transparent !important;
    }

    html body.cx-design-system .account-config-card .account-config-section-header > .cx-account-config-edge-toggle .account-config-collapse-button {
        position: static !important;
        inset: auto !important;
        width: 42px !important;
        min-width: 42px !important;
        height: 42px !important;
        min-height: 42px !important;
        margin: 0 !important;
        padding: 0 !important;
        border-color: #b8cad8 !important;
        border-radius: 11px !important;
        background: #f8fbfd !important;
        color: #315c80 !important;
        box-shadow: 0 3px 10px rgba(36, 69, 96, .10) !important;
    }

    html body.cx-design-system .account-config-card .account-config-section-header > .cx-account-config-edge-toggle .account-config-collapse-button:is(:hover, :focus-visible) {
        background: #fff !important;
        border-color: #6f94b3 !important;
        box-shadow: 0 5px 14px rgba(36, 69, 96, .16) !important;
    }

    html body.cx-design-system .account-config-card .account-config-section-content .account-config-col-edit {
        grid-column: 1 !important;
        display: flex !important;
        justify-content: center !important;
        align-items: flex-start !important;
        padding-top: 2px !important;
    }

    html body.cx-design-system .account-config-card .account-config-section-content .account-config-col-value {
        grid-column: 2 / 4 !important;
        min-width: 0 !important;
    }

    html body.cx-design-system .account-config-card .account-config-section-content .account-config-col-email {
        grid-column: 4 !important;
    }

    html body.cx-design-system .account-config-card .account-config-section-content .account-config-col-sms {
        grid-column: 5 !important;
    }

    html body.cx-design-system .account-config-card .account-config-section-content .account-config-col-updated {
        grid-column: 6 !important;
        padding-left: 18px !important;
    }

    html body.cx-design-system .account-config-card .account-config-section-content :is(
        .account-config-col-email,
        .account-config-col-sms,
        .account-config-col-updated
    ) {
        min-width: 0 !important;
        max-width: 100% !important;
        align-self: start !important;
        text-align: left !important;
        line-height: 1.45 !important;
        white-space: normal !important;
        overflow-wrap: anywhere !important;
        word-break: normal !important;
    }

    html body.cx-design-system .account-config-card .account-config-section-content .account-config-col-toggle {
        display: none !important;
    }
}

@media (max-width: 991.98px) {
    html body.cx-design-system .account-config-card .account-config-section-header {
        position: relative !important;
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
        gap: 0 !important;
        align-items: center !important;
        min-height: 58px !important;
        padding: 12px 68px 12px 15px !important;
        border-color: #9fbca7 !important;
        background: #dce9df !important;
        overflow: visible !important;
    }

    html body.cx-design-system .account-config-card .account-config-section-header :is(
        .account-config-col-email,
        .account-config-col-sms,
        .account-config-col-updated
    ) {
        display: none !important;
    }

    html body.cx-design-system .account-config-card .account-config-section-header .account-config-col-feature {
        grid-column: 1 !important;
        width: 100% !important;
        max-width: none !important;
        padding-right: 0 !important;
    }

    html body.cx-design-system .account-config-card .account-config-section-header > .cx-account-config-edge-toggle {
        position: absolute !important;
        top: 50% !important;
        right: 10px !important;
        left: auto !important;
        width: 44px !important;
        min-width: 44px !important;
        max-width: 44px !important;
        height: 44px !important;
        min-height: 44px !important;
        margin: 0 !important;
        padding: 0 !important;
        display: grid !important;
        place-items: center !important;
        transform: translateY(-50%) !important;
        border: 0 !important;
        background: transparent !important;
        z-index: 3 !important;
    }

    html body.cx-design-system .account-config-card .account-config-section-header > .cx-account-config-edge-toggle .account-config-collapse-button {
        width: 42px !important;
        min-width: 42px !important;
        height: 42px !important;
        min-height: 42px !important;
        margin: 0 !important;
    }

    html body.cx-design-system .account-config-card .account-config-section-content {
        display: grid !important;
        grid-template-columns: 44px minmax(0, 1fr) !important;
        gap: 10px 12px !important;
        align-items: start !important;
        padding: 14px !important;
    }

    html body.cx-design-system .account-config-card .account-config-section-content .account-config-col-edit {
        grid-column: 1 !important;
        grid-row: 1 !important;
    }

    html body.cx-design-system .account-config-card .account-config-section-content .account-config-col-value {
        grid-column: 2 !important;
        grid-row: 1 !important;
    }

    html body.cx-design-system .account-config-card .account-config-section-content :is(
        .account-config-col-email,
        .account-config-col-sms,
        .account-config-col-updated
    ) {
        grid-column: 1 / -1 !important;
        display: grid !important;
        grid-template-columns: 112px minmax(0, 1fr) !important;
        gap: 10px !important;
        padding-top: 9px !important;
        border-top: 1px solid #e3eaef !important;
        white-space: normal !important;
        overflow-wrap: anywhere !important;
    }

    html body.cx-design-system .account-config-card .account-config-section-content :is(
        .account-config-col-email,
        .account-config-col-sms,
        .account-config-col-updated
    )::before {
        content: attr(data-label) !important;
        color: #52677a !important;
        font-size: .72rem !important;
        font-weight: 800 !important;
        letter-spacing: .035em !important;
        text-transform: uppercase !important;
    }

    html body.cx-design-system .account-config-card .account-config-section-content .account-config-col-toggle {
        display: none !important;
    }
}

.cx-r1-account-delete .cx-modal-layout-v21 {
    width: 100%;
    display: grid;
    gap: 22px;
}

.cx-r1-account-delete .cx-r1-section {
    min-width: 0;
    margin: 0;
    padding: .85rem .95rem .95rem;
    border: 1px solid #d7e1ea;
    border-radius: 12px;
    background: #ffffff;
    box-shadow: 0 4px 14px rgba(35, 60, 85, .045);
}

.cx-r1-account-delete .cx-r1-section-title {
    max-width: calc(100% - 1rem);
    display: inline-flex;
    align-items: center;
    gap: .55rem;
    margin: 0 0 .15rem;
    padding: 0 .45rem;
    color: #2c4c6c;
    font-size: .92rem;
    font-weight: 800;
    line-height: 1.35;
}

.cx-r1-account-delete .cx-r1-section-icon {
    width: 28px;
    height: 28px;
    min-width: 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    background: #edf3f8;
    color: #3d6287;
    font-size: .78rem;
}

.cx-r1-account-delete .cx-r1-section-description {
    display: flex;
    align-items: flex-start;
    gap: .45rem;
    margin: .1rem 0 .75rem;
    color: #687787;
    font-size: .82rem;
    line-height: 1.5;
}

    .cx-r1-account-delete .cx-r1-section-description > i {
        margin-top: .22rem;
        color: #6d88a2;
        font-size: .72rem;
    }

.cx-r1-account-delete .cx-r1-form-row {
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(175px, 225px) minmax(0, 1fr);
    align-items: start;
    gap: .45rem .9rem;
    margin: 0 0 .75rem;
}

    .cx-r1-account-delete .cx-r1-form-row:last-child {
        margin-bottom: 0;
    }

    .cx-r1-account-delete .cx-r1-form-row > [class*="col-"] {
        width: auto;
        max-width: none;
        min-width: 0;
        margin: 0;
        padding: 0;
    }

    .cx-r1-account-delete .cx-r1-form-row > .form-label {
        padding-top: .62rem;
        text-align: right !important;
    }

.cx-r1-account-delete .form-label > label:not(.custom-switch),
.cx-r1-account-delete label[aspfor] {
    color: #52677a;
    font-size: .72rem;
    font-weight: 800;
    letter-spacing: .045em;
    line-height: 1.35;
    text-transform: uppercase;
}

    .cx-r1-account-delete .form-label > label:not(.custom-switch)::after,
    .cx-r1-account-delete label[aspfor]::after {
        content: ":";
    }

.cx-r1-account-delete input.form-control,
.cx-r1-account-delete select.form-control,
.cx-r1-account-delete textarea.form-control {
    width: 100%;
    min-width: 0;
    border-color: #cfd9e3;
    border-radius: 8px;
    box-shadow: none;
}

.cx-r1-account-delete textarea.form-control,
.cx-r1-account-delete .cx-dialog-textarea {
    width: 100%;
    height: 132px;
    min-height: 84px !important;
    max-height: none !important;
    resize: both !important;
    overflow: auto !important;
}

.cx-r1-account-delete input:disabled,
.cx-r1-account-delete select:disabled,
.cx-r1-account-delete textarea:disabled {
    background: #f3f6f8;
    color: #526170;
    opacity: 1;
}

@media (max-width: 767.98px) {
    .cx-r1-account-delete .cx-r1-section {
        padding: .85rem;
    }

    .cx-r1-account-delete .cx-r1-form-row {
        grid-template-columns: minmax(0, 1fr);
        gap: .35rem;
        margin-bottom: .85rem;
    }

        .cx-r1-account-delete .cx-r1-form-row > .form-label {
            padding-top: 0;
            text-align: left !important;
        }

    .cx-r1-account-delete .cx-r1-section-description {
        margin-bottom: .8rem;
    }
}

.cx-r1-account-delete .cx-modal-layout-v21,
.cx-r1-account-delete form.cx-dialog-v17-form {
    display: grid;
    gap: 22px;
}

.cx-r1-account-delete .cx-r1-section + .cx-r1-section,
.cx-r1-account-delete fieldset + fieldset {
    margin-top: 0;
}

@media (max-width: 767.98px) {
    .cx-r1-account-delete .cx-modal-layout-v21,
    .cx-r1-account-delete form.cx-dialog-v17-form {
        gap: 16px;
    }
}

.cx-r1-account-fallalert .cx-modal-layout-v21 {
    width: 100%;
    display: grid;
    gap: 22px;
}

.cx-r1-account-fallalert .cx-r1-section {
    min-width: 0;
    margin: 0;
    padding: .85rem .95rem .95rem;
    border: 1px solid #d7e1ea;
    border-radius: 12px;
    background: #ffffff;
    box-shadow: 0 4px 14px rgba(35, 60, 85, .045);
}

.cx-r1-account-fallalert .cx-r1-section-title {
    max-width: calc(100% - 1rem);
    display: inline-flex;
    align-items: center;
    gap: .55rem;
    margin: 0 0 .15rem;
    padding: 0 .45rem;
    color: #2c4c6c;
    font-size: .92rem;
    font-weight: 800;
    line-height: 1.35;
}

.cx-r1-account-fallalert .cx-r1-section-icon {
    width: 28px;
    height: 28px;
    min-width: 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    background: #edf3f8;
    color: #3d6287;
    font-size: .78rem;
}

.cx-r1-account-fallalert .cx-r1-section-description {
    display: flex;
    align-items: flex-start;
    gap: .45rem;
    margin: .1rem 0 .75rem;
    color: #687787;
    font-size: .82rem;
    line-height: 1.5;
}

    .cx-r1-account-fallalert .cx-r1-section-description > i {
        margin-top: .22rem;
        color: #6d88a2;
        font-size: .72rem;
    }

.cx-r1-account-fallalert .cx-r1-form-row {
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(175px, 225px) minmax(0, 1fr);
    align-items: start;
    gap: .45rem .9rem;
    margin: 0 0 .75rem;
}

    .cx-r1-account-fallalert .cx-r1-form-row:last-child {
        margin-bottom: 0;
    }

    .cx-r1-account-fallalert .cx-r1-form-row > [class*="col-"] {
        width: auto;
        max-width: none;
        min-width: 0;
        margin: 0;
        padding: 0;
    }

    .cx-r1-account-fallalert .cx-r1-form-row > .form-label {
        padding-top: .62rem;
        text-align: right !important;
    }

.cx-r1-account-fallalert .form-label > label:not(.custom-switch),
.cx-r1-account-fallalert label[aspfor] {
    color: #52677a;
    font-size: .72rem;
    font-weight: 800;
    letter-spacing: .045em;
    line-height: 1.35;
    text-transform: uppercase;
}

    .cx-r1-account-fallalert .form-label > label:not(.custom-switch)::after,
    .cx-r1-account-fallalert label[aspfor]::after {
        content: ":";
    }

.cx-r1-account-fallalert input.form-control,
.cx-r1-account-fallalert select.form-control,
.cx-r1-account-fallalert textarea.form-control {
    width: 100%;
    min-width: 0;
    border-color: #cfd9e3;
    border-radius: 8px;
    box-shadow: none;
}

.cx-r1-account-fallalert textarea.form-control,
.cx-r1-account-fallalert .cx-dialog-textarea {
    width: 100%;
    height: 132px;
    min-height: 84px !important;
    max-height: none !important;
    resize: both !important;
    overflow: auto !important;
}

.cx-r1-account-fallalert input:disabled,
.cx-r1-account-fallalert select:disabled,
.cx-r1-account-fallalert textarea:disabled {
    background: #f3f6f8;
    color: #526170;
    opacity: 1;
}

@media (max-width: 767.98px) {
    .cx-r1-account-fallalert .cx-r1-section {
        padding: .85rem;
    }

    .cx-r1-account-fallalert .cx-r1-form-row {
        grid-template-columns: minmax(0, 1fr);
        gap: .35rem;
        margin-bottom: .85rem;
    }

        .cx-r1-account-fallalert .cx-r1-form-row > .form-label {
            padding-top: 0;
            text-align: left !important;
        }

    .cx-r1-account-fallalert .cx-r1-section-description {
        margin-bottom: .8rem;
    }
}

.account-fallalert-content {
    max-height: min(76vh, 780px);
    padding: 20px 22px !important;
    overflow-y: auto;
}

.account-fallalert-loading {
    min-height: 180px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 12px;
    color: #667085;
    font-size: 13.5px;
    font-weight: 650;
}

.account-fallalert-updated-card {
    margin-top: 16px;
    padding: 13px 14px;
    display: flex;
    align-items: center;
    gap: 11px;
    border: 1px solid #d8e2ec;
    border-left: 3px solid #3d6287;
    border-radius: 8px;
    background: #f7f9fc;
}

.account-fallalert-updated-icon {
    width: 34px;
    height: 34px;
    min-width: 34px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    background: #e7eef6;
    color: #3d6287;
}

.account-fallalert-updated-label {
    color: #2c4c6c;
    font-size: 13px;
    line-height: 1.35;
    font-weight: 800;
}

.account-fallalert-updated-value {
    margin-top: 2px;
    color: #344054;
    font-size: 13.5px;
    line-height: 1.45;
    font-weight: 650;
}

.account-fallalert-updated-by {
    margin-top: 2px;
    color: #667085;
    font-size: 12.5px;
    line-height: 1.4;
}

.account-fallalert-actions {
    padding: 14px 20px 16px !important;
}

.account-fallalert-action {
    min-height: 42px !important;
    padding: 8px 14px !important;
    border-radius: 8px !important;
    font-size: 13px !important;
    font-weight: 800 !important;
    box-shadow: none !important;
}

    .account-fallalert-action .mud-button-label {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 8px !important;
    }

.account-fallalert-save {
    border-color: #7899b8 !important;
    background: #ffffff !important;
    color: #2c4c6c !important;
}

.account-fallalert-save-close {
    border-color: #2c4c6c !important;
    background: #2c4c6c !important;
    color: #ffffff !important;
}

.account-fallalert-cancel {
    border-color: #c8d1db !important;
    background: #ffffff !important;
    color: #596574 !important;
}

@media (max-width: 575.98px) {
    .account-fallalert-content {
        padding: 13px !important;
    }

    .account-fallalert-action {
        width: 100% !important;
        min-width: 100% !important;
    }
}

.cx-r1-account-fallalert .cx-modal-layout-v21,
.cx-r1-account-fallalert form.cx-dialog-v17-form {
    display: grid;
    gap: 22px;
}

.cx-r1-account-fallalert .cx-r1-section + .cx-r1-section,
.cx-r1-account-fallalert fieldset + fieldset {
    margin-top: 0;
}

@media (max-width: 767.98px) {
    .cx-r1-account-fallalert .cx-modal-layout-v21,
    .cx-r1-account-fallalert form.cx-dialog-v17-form {
        gap: 16px;
    }
}

.conexgo-account-profile {
    overflow: visible;
    border: 1px solid #dfe6ed;
    border-radius: 10px;
    background: #ffffff;
    box-shadow: 0 4px 16px rgba(44, 76, 108, .07);
}

    .conexgo-account-profile > .card-header {
        min-height: 62px;
        display: flex;
        align-items: center;
        border-radius: 10px 10px 0 0;
    }

    .conexgo-account-profile > .card-body {
        padding: 22px 24px 26px;
    }

    .conexgo-account-profile .conexgo-profile-tabs {
        display: flex;
        flex-wrap: wrap;
        gap: 8px;
        padding: 6px;
        border: 1px solid #dde6ee;
        border-radius: 9px;
        background: #f7fafc;
    }

        .conexgo-account-profile .conexgo-profile-tabs > li > a {
            min-height: 42px;
            display: inline-flex;
            align-items: center;
            gap: 7px;
            padding: 0 14px;
            border: 1px solid transparent;
            border-radius: 7px;
            color: #36516f;
            font-weight: 700;
            transition: background-color .18s ease, border-color .18s ease, color .18s ease, transform .18s ease;
        }

            .conexgo-account-profile .conexgo-profile-tabs > li > a:hover,
            .conexgo-account-profile .conexgo-profile-tabs > li > a:focus-visible {
                background: #edf4f8;
                border-color: #d2dfe9;
                color: #24435f;
                transform: translateY(-1px);
                outline: none;
            }

            .conexgo-account-profile .conexgo-profile-tabs > li > a.active {
                background: #2c4c6c;
                border-color: #2c4c6c;
                color: #ffffff;
                box-shadow: 0 3px 9px rgba(44, 76, 108, .18);
            }

    .conexgo-account-profile .tabs-menu-body {
        margin-top: 16px;
        padding: 0;
        border: 0;
    }

    .conexgo-account-profile .form-horizontal {
        width: min(100%, 840px);
        margin-inline: auto;
    }

        .conexgo-account-profile .form-horizontal > .row {
            min-width: 0;
            display: grid;
            grid-template-columns: 190px minmax(0, 1fr);
            align-items: center;
            gap: 14px;
            margin: 0 0 13px;
        }

            .conexgo-account-profile .form-horizontal > .row > [class*="col-"] {
                width: auto;
                max-width: none;
                min-width: 0;
                margin: 0;
                padding: 0;
            }

    .conexgo-account-profile .form-label {
        color: #263b57;
        font-weight: 700;
    }

    .conexgo-account-profile .form-control,
    .conexgo-account-profile .cx-custom-select-trigger {
        min-height: 44px;
        border-radius: 8px;
        border-color: #cfdbe6;
        background: #ffffff;
    }

        .conexgo-account-profile .form-control:focus,
        .conexgo-account-profile .cx-custom-select-trigger:focus-visible,
        .conexgo-account-profile .cx-custom-select-trigger.is-open {
            border-color: #3e6a99;
            box-shadow: 0 0 0 3px rgba(62, 106, 153, .13);
        }

@media (max-width: 767.98px) {
    .conexgo-account-profile > .card-body {
        padding: 16px 14px 20px;
    }

    .conexgo-account-profile .conexgo-profile-tabs {
        display: grid;
        grid-template-columns: 1fr;
    }

        .conexgo-account-profile .conexgo-profile-tabs > li,
        .conexgo-account-profile .conexgo-profile-tabs > li > a {
            width: 100%;
        }

    .conexgo-account-profile .form-horizontal > .row {
        grid-template-columns: minmax(0, 1fr);
        gap: 6px;
        margin-bottom: 15px;
    }

    .conexgo-account-profile .form-label {
        margin-bottom: 0;
        text-align: left !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    .conexgo-account-profile .conexgo-profile-tabs > li > a {
        transition: none !important;
    }
}

.cx-r1-account-sosbutton .cx-modal-layout-v21 {
    width: 100%;
    display: grid;
    gap: 22px;
}

.cx-r1-account-sosbutton .cx-r1-section {
    min-width: 0;
    margin: 0;
    padding: .85rem .95rem .95rem;
    border: 1px solid #d7e1ea;
    border-radius: 12px;
    background: #ffffff;
    box-shadow: 0 4px 14px rgba(35, 60, 85, .045);
}

.cx-r1-account-sosbutton .cx-r1-section-title {
    max-width: calc(100% - 1rem);
    display: inline-flex;
    align-items: center;
    gap: .55rem;
    margin: 0 0 .15rem;
    padding: 0 .45rem;
    color: #2c4c6c;
    font-size: .92rem;
    font-weight: 800;
    line-height: 1.35;
}

.cx-r1-account-sosbutton .cx-r1-section-icon {
    width: 28px;
    height: 28px;
    min-width: 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    background: #edf3f8;
    color: #3d6287;
    font-size: .78rem;
}

.cx-r1-account-sosbutton .cx-r1-section-description {
    display: flex;
    align-items: flex-start;
    gap: .45rem;
    margin: .1rem 0 .75rem;
    color: #687787;
    font-size: .82rem;
    line-height: 1.5;
}

    .cx-r1-account-sosbutton .cx-r1-section-description > i {
        margin-top: .22rem;
        color: #6d88a2;
        font-size: .72rem;
    }

.cx-r1-account-sosbutton .cx-r1-form-row {
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(175px, 225px) minmax(0, 1fr);
    align-items: start;
    gap: .45rem .9rem;
    margin: 0 0 .75rem;
}

    .cx-r1-account-sosbutton .cx-r1-form-row:last-child {
        margin-bottom: 0;
    }

    .cx-r1-account-sosbutton .cx-r1-form-row > [class*="col-"] {
        width: auto;
        max-width: none;
        min-width: 0;
        margin: 0;
        padding: 0;
    }

    .cx-r1-account-sosbutton .cx-r1-form-row > .form-label {
        padding-top: .62rem;
        text-align: right !important;
    }

.cx-r1-account-sosbutton .form-label > label:not(.custom-switch),
.cx-r1-account-sosbutton label[aspfor] {
    color: #52677a;
    font-size: .72rem;
    font-weight: 800;
    letter-spacing: .045em;
    line-height: 1.35;
    text-transform: uppercase;
}

    .cx-r1-account-sosbutton .form-label > label:not(.custom-switch)::after,
    .cx-r1-account-sosbutton label[aspfor]::after {
        content: ":";
    }

.cx-r1-account-sosbutton input.form-control,
.cx-r1-account-sosbutton select.form-control,
.cx-r1-account-sosbutton textarea.form-control {
    width: 100%;
    min-width: 0;
    border-color: #cfd9e3;
    border-radius: 8px;
    box-shadow: none;
}

.cx-r1-account-sosbutton textarea.form-control,
.cx-r1-account-sosbutton .cx-dialog-textarea {
    width: 100%;
    height: 132px;
    min-height: 84px !important;
    max-height: none !important;
    resize: both !important;
    overflow: auto !important;
}

.cx-r1-account-sosbutton input:disabled,
.cx-r1-account-sosbutton select:disabled,
.cx-r1-account-sosbutton textarea:disabled {
    background: #f3f6f8;
    color: #526170;
    opacity: 1;
}

@media (max-width: 767.98px) {
    .cx-r1-account-sosbutton .cx-r1-section {
        padding: .85rem;
    }

    .cx-r1-account-sosbutton .cx-r1-form-row {
        grid-template-columns: minmax(0, 1fr);
        gap: .35rem;
        margin-bottom: .85rem;
    }

        .cx-r1-account-sosbutton .cx-r1-form-row > .form-label {
            padding-top: 0;
            text-align: left !important;
        }

    .cx-r1-account-sosbutton .cx-r1-section-description {
        margin-bottom: .8rem;
    }
}

.cx-r1-account-sosbutton .cx-modal-layout-v21,
.cx-r1-account-sosbutton form.cx-dialog-v17-form {
    display: grid;
    gap: 22px;
}

.cx-r1-account-sosbutton .cx-r1-section + .cx-r1-section,
.cx-r1-account-sosbutton fieldset + fieldset {
    margin-top: 0;
}

@media (max-width: 767.98px) {
    .cx-r1-account-sosbutton .cx-modal-layout-v21,
    .cx-r1-account-sosbutton form.cx-dialog-v17-form {
        gap: 16px;
    }
}

.cx-r1-document-addedit .cx-modal-layout-v21 {
    width: 100%;
    display: grid;
    gap: 22px;
}

.cx-r1-document-addedit .cx-r1-section {
    min-width: 0;
    margin: 0;
    padding: .85rem .95rem .95rem;
    border: 1px solid #d7e1ea;
    border-radius: 12px;
    background: #ffffff;
    box-shadow: 0 4px 14px rgba(35, 60, 85, .045);
}

.cx-r1-document-addedit .cx-r1-section-title {
    max-width: calc(100% - 1rem);
    display: inline-flex;
    align-items: center;
    gap: .55rem;
    margin: 0 0 .15rem;
    padding: 0 .45rem;
    color: #2c4c6c;
    font-size: .92rem;
    font-weight: 800;
    line-height: 1.35;
}

.cx-r1-document-addedit .cx-r1-section-icon {
    width: 28px;
    height: 28px;
    min-width: 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    background: #edf3f8;
    color: #3d6287;
    font-size: .78rem;
}

.cx-r1-document-addedit .cx-r1-section-description {
    display: flex;
    align-items: flex-start;
    gap: .45rem;
    margin: .1rem 0 .75rem;
    color: #687787;
    font-size: .82rem;
    line-height: 1.5;
}

    .cx-r1-document-addedit .cx-r1-section-description > i {
        margin-top: .22rem;
        color: #6d88a2;
        font-size: .72rem;
    }

.cx-r1-document-addedit .cx-r1-form-row {
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(175px, 225px) minmax(0, 1fr);
    align-items: start;
    gap: .45rem .9rem;
    margin: 0 0 .75rem;
}

    .cx-r1-document-addedit .cx-r1-form-row:last-child {
        margin-bottom: 0;
    }

    .cx-r1-document-addedit .cx-r1-form-row > [class*="col-"] {
        width: auto;
        max-width: none;
        min-width: 0;
        margin: 0;
        padding: 0;
    }

    .cx-r1-document-addedit .cx-r1-form-row > .form-label {
        padding-top: .62rem;
        text-align: right !important;
    }

.cx-r1-document-addedit .form-label > label:not(.custom-switch),
.cx-r1-document-addedit label[aspfor] {
    color: #52677a;
    font-size: .72rem;
    font-weight: 800;
    letter-spacing: .045em;
    line-height: 1.35;
    text-transform: uppercase;
}

    .cx-r1-document-addedit .form-label > label:not(.custom-switch)::after,
    .cx-r1-document-addedit label[aspfor]::after {
        content: ":";
    }

.cx-r1-document-addedit input.form-control,
.cx-r1-document-addedit select.form-control,
.cx-r1-document-addedit textarea.form-control {
    width: 100%;
    min-width: 0;
    border-color: #cfd9e3;
    border-radius: 8px;
    box-shadow: none;
}

.cx-r1-document-addedit textarea.form-control,
.cx-r1-document-addedit .cx-dialog-textarea {
    width: 100%;
    height: 132px;
    min-height: 84px !important;
    max-height: none !important;
    resize: both !important;
    overflow: auto !important;
}

.cx-r1-document-addedit input:disabled,
.cx-r1-document-addedit select:disabled,
.cx-r1-document-addedit textarea:disabled {
    background: #f3f6f8;
    color: #526170;
    opacity: 1;
}

@media (max-width: 767.98px) {
    .cx-r1-document-addedit .cx-r1-section {
        padding: .85rem;
    }

    .cx-r1-document-addedit .cx-r1-form-row {
        grid-template-columns: minmax(0, 1fr);
        gap: .35rem;
        margin-bottom: .85rem;
    }

        .cx-r1-document-addedit .cx-r1-form-row > .form-label {
            padding-top: 0;
            text-align: left !important;
        }

    .cx-r1-document-addedit .cx-r1-section-description {
        margin-bottom: .8rem;
    }
}

.cx-r1-document-addedit .cx-modal-layout-v21,
.cx-r1-document-addedit form.cx-dialog-v17-form {
    display: grid;
    gap: 22px;
}

.cx-r1-document-addedit .cx-r1-section + .cx-r1-section,
.cx-r1-document-addedit fieldset + fieldset {
    margin-top: 0;
}

@media (max-width: 767.98px) {
    .cx-r1-document-addedit .cx-modal-layout-v21,
    .cx-r1-document-addedit form.cx-dialog-v17-form {
        gap: 16px;
    }
}

.cx-r1-document-delete .cx-modal-layout-v21 {
    width: 100%;
    display: grid;
    gap: 22px;
}

.cx-r1-document-delete .cx-r1-section {
    min-width: 0;
    margin: 0;
    padding: .85rem .95rem .95rem;
    border: 1px solid #d7e1ea;
    border-radius: 12px;
    background: #ffffff;
    box-shadow: 0 4px 14px rgba(35, 60, 85, .045);
}

.cx-r1-document-delete .cx-r1-section-title {
    max-width: calc(100% - 1rem);
    display: inline-flex;
    align-items: center;
    gap: .55rem;
    margin: 0 0 .15rem;
    padding: 0 .45rem;
    color: #2c4c6c;
    font-size: .92rem;
    font-weight: 800;
    line-height: 1.35;
}

.cx-r1-document-delete .cx-r1-section-icon {
    width: 28px;
    height: 28px;
    min-width: 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    background: #edf3f8;
    color: #3d6287;
    font-size: .78rem;
}

.cx-r1-document-delete .cx-r1-section-description {
    display: flex;
    align-items: flex-start;
    gap: .45rem;
    margin: .1rem 0 .75rem;
    color: #687787;
    font-size: .82rem;
    line-height: 1.5;
}

    .cx-r1-document-delete .cx-r1-section-description > i {
        margin-top: .22rem;
        color: #6d88a2;
        font-size: .72rem;
    }

.cx-r1-document-delete .cx-r1-form-row {
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(175px, 225px) minmax(0, 1fr);
    align-items: start;
    gap: .45rem .9rem;
    margin: 0 0 .75rem;
}

    .cx-r1-document-delete .cx-r1-form-row:last-child {
        margin-bottom: 0;
    }

    .cx-r1-document-delete .cx-r1-form-row > [class*="col-"] {
        width: auto;
        max-width: none;
        min-width: 0;
        margin: 0;
        padding: 0;
    }

    .cx-r1-document-delete .cx-r1-form-row > .form-label {
        padding-top: .62rem;
        text-align: right !important;
    }

.cx-r1-document-delete .form-label > label:not(.custom-switch),
.cx-r1-document-delete label[aspfor] {
    color: #52677a;
    font-size: .72rem;
    font-weight: 800;
    letter-spacing: .045em;
    line-height: 1.35;
    text-transform: uppercase;
}

    .cx-r1-document-delete .form-label > label:not(.custom-switch)::after,
    .cx-r1-document-delete label[aspfor]::after {
        content: ":";
    }

.cx-r1-document-delete input.form-control,
.cx-r1-document-delete select.form-control,
.cx-r1-document-delete textarea.form-control {
    width: 100%;
    min-width: 0;
    border-color: #cfd9e3;
    border-radius: 8px;
    box-shadow: none;
}

.cx-r1-document-delete textarea.form-control,
.cx-r1-document-delete .cx-dialog-textarea {
    width: 100%;
    height: 132px;
    min-height: 84px !important;
    max-height: none !important;
    resize: both !important;
    overflow: auto !important;
}

.cx-r1-document-delete input:disabled,
.cx-r1-document-delete select:disabled,
.cx-r1-document-delete textarea:disabled {
    background: #f3f6f8;
    color: #526170;
    opacity: 1;
}

@media (max-width: 767.98px) {
    .cx-r1-document-delete .cx-r1-section {
        padding: .85rem;
    }

    .cx-r1-document-delete .cx-r1-form-row {
        grid-template-columns: minmax(0, 1fr);
        gap: .35rem;
        margin-bottom: .85rem;
    }

        .cx-r1-document-delete .cx-r1-form-row > .form-label {
            padding-top: 0;
            text-align: left !important;
        }

    .cx-r1-document-delete .cx-r1-section-description {
        margin-bottom: .8rem;
    }
}

.cx-r1-document-delete .cx-modal-layout-v21,
.cx-r1-document-delete form.cx-dialog-v17-form {
    display: grid;
    gap: 22px;
}

.cx-r1-document-delete .cx-r1-section + .cx-r1-section,
.cx-r1-document-delete fieldset + fieldset {
    margin-top: 0;
}

@media (max-width: 767.98px) {
    .cx-r1-document-delete .cx-modal-layout-v21,
    .cx-r1-document-delete form.cx-dialog-v17-form {
        gap: 16px;
    }
}

.cx-r1-document-view .cx-modal-layout-v21 {
    width: 100%;
    display: grid;
    gap: 22px;
}

.cx-r1-document-view .cx-r1-section {
    min-width: 0;
    margin: 0;
    padding: .85rem .95rem .95rem;
    border: 1px solid #d7e1ea;
    border-radius: 12px;
    background: #ffffff;
    box-shadow: 0 4px 14px rgba(35, 60, 85, .045);
}

.cx-r1-document-view .cx-r1-section-title {
    max-width: calc(100% - 1rem);
    display: inline-flex;
    align-items: center;
    gap: .55rem;
    margin: 0 0 .15rem;
    padding: 0 .45rem;
    color: #2c4c6c;
    font-size: .92rem;
    font-weight: 800;
    line-height: 1.35;
}

.cx-r1-document-view .cx-r1-section-icon {
    width: 28px;
    height: 28px;
    min-width: 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    background: #edf3f8;
    color: #3d6287;
    font-size: .78rem;
}

.cx-r1-document-view .cx-r1-section-description {
    display: flex;
    align-items: flex-start;
    gap: .45rem;
    margin: .1rem 0 .75rem;
    color: #687787;
    font-size: .82rem;
    line-height: 1.5;
}

    .cx-r1-document-view .cx-r1-section-description > i {
        margin-top: .22rem;
        color: #6d88a2;
        font-size: .72rem;
    }

.cx-r1-document-view .cx-r1-form-row {
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(175px, 225px) minmax(0, 1fr);
    align-items: start;
    gap: .45rem .9rem;
    margin: 0 0 .75rem;
}

    .cx-r1-document-view .cx-r1-form-row:last-child {
        margin-bottom: 0;
    }

    .cx-r1-document-view .cx-r1-form-row > [class*="col-"] {
        width: auto;
        max-width: none;
        min-width: 0;
        margin: 0;
        padding: 0;
    }

    .cx-r1-document-view .cx-r1-form-row > .form-label {
        padding-top: .62rem;
        text-align: right !important;
    }

.cx-r1-document-view .form-label > label:not(.custom-switch),
.cx-r1-document-view label[aspfor] {
    color: #52677a;
    font-size: .72rem;
    font-weight: 800;
    letter-spacing: .045em;
    line-height: 1.35;
    text-transform: uppercase;
}

    .cx-r1-document-view .form-label > label:not(.custom-switch)::after,
    .cx-r1-document-view label[aspfor]::after {
        content: ":";
    }

.cx-r1-document-view input.form-control,
.cx-r1-document-view select.form-control,
.cx-r1-document-view textarea.form-control {
    width: 100%;
    min-width: 0;
    border-color: #cfd9e3;
    border-radius: 8px;
    box-shadow: none;
}

.cx-r1-document-view textarea.form-control,
.cx-r1-document-view .cx-dialog-textarea {
    width: 100%;
    height: 132px;
    min-height: 84px !important;
    max-height: none !important;
    resize: both !important;
    overflow: auto !important;
}

.cx-r1-document-view input:disabled,
.cx-r1-document-view select:disabled,
.cx-r1-document-view textarea:disabled {
    background: #f3f6f8;
    color: #526170;
    opacity: 1;
}

@media (max-width: 767.98px) {
    .cx-r1-document-view .cx-r1-section {
        padding: .85rem;
    }

    .cx-r1-document-view .cx-r1-form-row {
        grid-template-columns: minmax(0, 1fr);
        gap: .35rem;
        margin-bottom: .85rem;
    }

        .cx-r1-document-view .cx-r1-form-row > .form-label {
            padding-top: 0;
            text-align: left !important;
        }

    .cx-r1-document-view .cx-r1-section-description {
        margin-bottom: .8rem;
    }
}

.cx-r1-document-view .cx-modal-layout-v21,
.cx-r1-document-view form.cx-dialog-v17-form {
    display: grid;
    gap: 22px;
}

.cx-r1-document-view .cx-r1-section + .cx-r1-section,
.cx-r1-document-view fieldset + fieldset {
    margin-top: 0;
}

@media (max-width: 767.98px) {
    .cx-r1-document-view .cx-modal-layout-v21,
    .cx-r1-document-view form.cx-dialog-v17-form {
        gap: 16px;
    }
}

.cx-r1-document-view {
    width: min(1080px, calc(100vw - 24px)) !important;
    max-width: min(1080px, calc(100vw - 24px)) !important;
    max-height: calc(100vh - 24px) !important;
}

    .cx-r1-document-view .mud-dialog-content {
        min-height: 0;
        overflow: auto;
        scrollbar-gutter: stable;
    }

    .cx-r1-document-view .conexgo-document-resize-shell {
        width: 100%;
        height: 54vh;
        min-width: 320px;
        min-height: 320px;
        max-width: 100%;
        max-height: 76vh;
        resize: both;
        overflow: hidden;
        border: 1px solid #b9c8d6;
        border-radius: 8px;
        background: #ffffff;
    }

    .cx-r1-document-view .conexgo-document-viewer {
        width: 100% !important;
        height: 100% !important;
        min-width: 0;
        min-height: 0;
        border: 0;
        background: #ffffff;
    }

@media (max-width: 575.98px) {
    .cx-r1-document-view {
        width: calc(100vw - 12px) !important;
        max-width: calc(100vw - 12px) !important;
    }

        .cx-r1-document-view .conexgo-document-resize-shell {
            min-width: 0;
            min-height: 260px;
            height: 48vh;
            resize: vertical;
        }
}

.cx-dialog--document-view {
    width: min(1480px, calc(100vw - 28px)) !important;
    max-width: min(1480px, calc(100vw - 28px)) !important;
}

    .cx-dialog--document-view .mud-dialog-content {
        padding: 14px 16px !important;
    }

    .cx-dialog--document-view .cx-r1-section {
        max-width: none !important;
    }

    .cx-dialog--document-view .conexgo-document-resize-shell {
        width: 100% !important;
        height: min(72vh, 920px) !important;
        min-height: 520px !important;
        resize: none !important;
        overflow: hidden !important;
        border: 1px solid #cfdbe5;
        border-radius: 10px;
        background: #eef2f6;
    }

    .cx-dialog--document-view .conexgo-document-viewer {
        width: 100% !important;
        height: 100% !important;
        min-height: 100% !important;
        display: block;
        border: 0;
    }

    .cx-dialog--document-view .cx-r1-form-row {
        grid-template-columns: minmax(0, 1fr) !important;
    }

.cx-document-download {
    --cx-document-download-accent: var(--mud-palette-primary, #594ae2);
    min-height: 40px;
    display: inline-flex !important;
    align-items: center;
    border-color: var(--cx-document-download-accent) !important;
    background: #ffffff !important;
    color: var(--cx-document-download-accent) !important;
    text-decoration: none !important;
}

    .cx-document-download .mud-button-label {
        display: inline-flex;
        align-items: center;
        gap: 8px;
    }

    .cx-document-download:is(:hover, :focus, :focus-visible, :active) {
        border-color: var(--cx-document-download-accent) !important;
        background: rgba(89, 74, 226, .08) !important;
        color: var(--cx-document-download-accent) !important;
        box-shadow: 0 4px 10px rgba(89, 74, 226, .12) !important;
        filter: none !important;
        transform: none !important;
    }

    .cx-document-download:is(:hover, :focus, :focus-visible, :active)
    :is(.mud-button-label, i, span, svg, .mud-icon-root) {
        color: inherit !important;
    }

@media (max-width: 767.98px) {
    .cx-dialog--document-view {
        width: calc(100vw - 12px) !important;
        max-width: calc(100vw - 12px) !important;
    }

        .cx-dialog--document-view .mud-dialog-content {
            padding: 8px !important;
        }

        .cx-dialog--document-view .conexgo-document-resize-shell {
            height: 68dvh !important;
            min-height: 360px !important;
        }

        .cx-dialog--document-view .conexgo-document-view-title {
            font-size: 1.15rem !important;
        }
}

.report-list-card {
    overflow: hidden;
}

.report-list-toolbar {
    width: 100%;
    min-width: 0;
    margin: 0;
    padding: 12px 14px;
    border: 0;
    border-radius: 8px 8px 0 0;
    background: #2c4c6c;
}

.report-list-toolbar-row {
    width: 100%;
    min-width: 0;
    margin: 0;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(280px, 480px);
    align-items: center;
    gap: 12px;
}

.report-list-back-slot {
    min-width: 0;
    display: flex;
    align-items: center;
}

.report-list-search {
    width: 100%;
    min-width: 0;
    grid-column: 2;
}

    .report-list-search .dataTables_filter,
    .report-list-search .dataTables_filter > label {
        width: 100%;
        margin: 0;
        display: block;
        text-align: right;
    }

.report-list-card-body {
    padding-top: 1rem;
}

@media (max-width: 991.98px) {
    .report-list-toolbar {
        padding: 10px;
    }

    .report-list-toolbar-row {
        grid-template-columns: auto minmax(0, 1fr);
        gap: 9px;
    }

    .report-list-search {
        grid-column: 2;
    }
}

.cx-report-subscribe-dialog {
    width: min(1120px, calc(100vw - 32px)) !important;
    max-width: min(1120px, calc(100vw - 32px)) !important;
}

    .cx-report-subscribe-dialog .mud-dialog-content {
        max-height: min(68dvh, 720px);
        padding: 12px 14px !important;
        overflow-y: auto;
        overscroll-behavior: contain;
        scrollbar-gutter: stable;
    }

    .cx-report-subscribe-dialog .report-subscribe-form {
        width: 100%;
        display: grid !important;
        gap: 12px !important;
    }

    .cx-report-subscribe-dialog .report-subscribe-section {
        padding: 14px 16px 16px !important;
    }

    .cx-report-subscribe-dialog .report-subscribe-schedule-grid {
        display: grid;
        grid-template-columns: repeat(3, minmax(180px, 1fr));
        align-items: end;
        gap: 14px;
    }

    .cx-report-subscribe-dialog .report-subscribe-field {
        min-width: 0;
    }

        .cx-report-subscribe-dialog .report-subscribe-field > label,
        .cx-report-subscribe-dialog .report-subscribe-label {
            min-height: 18px;
            margin: 0 0 6px;
            display: flex;
            align-items: center;
            color: #52677a;
            font-size: .74rem;
            font-weight: 800;
            letter-spacing: .035em;
            line-height: 1.35;
            text-transform: uppercase;
        }

        .cx-report-subscribe-dialog .report-subscribe-field .cx-control-field,
        .cx-report-subscribe-dialog .report-subscribe-field .cx-control,
        .cx-report-subscribe-dialog .report-subscribe-field input {
            width: 100% !important;
            min-width: 0 !important;
            max-width: 100% !important;
        }

    .cx-report-subscribe-dialog .report-subscribe-validation {
        margin-top: 12px;
        padding: 10px 12px;
        display: flex;
        align-items: flex-start;
        gap: 8px;
        border: 1px solid #e7b8bd;
        border-radius: 9px;
        background: #fff7f8;
        color: #a44952;
        font-size: .78rem;
        line-height: 1.45;
    }

    .cx-report-subscribe-dialog .report-subscribe-next-send {
        margin-top: 16px;
        padding: 13px 14px;
        display: grid;
        grid-template-columns: 40px minmax(0, 1fr);
        align-items: center;
        gap: 12px;
        border: 1px solid #cbdbe8;
        border-radius: 10px;
        background: #f5f9fc;
    }

    .cx-report-subscribe-dialog .report-subscribe-next-send-icon {
        width: 40px;
        height: 40px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        border-radius: 10px;
        background: #e6f0f7;
        color: #315879;
    }

    .cx-report-subscribe-dialog .report-subscribe-next-send-label {
        color: #607386;
        font-size: .71rem;
        font-weight: 800;
        letter-spacing: .035em;
        text-transform: uppercase;
    }

    .cx-report-subscribe-dialog .report-subscribe-next-send-value {
        margin-top: 2px;
        color: #2c4c6c;
        font-size: .92rem;
        font-weight: 800;
    }

    .cx-report-subscribe-dialog .report-subscribe-next-send-summary {
        margin-top: 3px;
        color: #687787;
        font-size: .77rem;
        line-height: 1.45;
    }

    .cx-report-subscribe-dialog .report-subscribe-recipient-entry {
        display: grid;
        grid-template-columns: minmax(0, 1fr) 46px;
        grid-template-areas:
            "label label"
            "input add";
        align-items: end;
        gap: 8px 10px;
    }

        .cx-report-subscribe-dialog .report-subscribe-recipient-entry > label {
            grid-area: label;
        }

    .cx-report-subscribe-dialog .report-subscribe-input {
        grid-area: input;
        min-height: 38px;
        border-color: #cfd9e3;
        border-radius: 9px;
    }

    .cx-report-subscribe-dialog .report-subscribe-add-icon {
        grid-area: add;
        width: 40px;
        min-width: 40px;
        height: 38px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        border: 1px solid #3e6a99;
        border-radius: 9px;
        background: #3e6a99;
        color: #ffffff;
    }

        .cx-report-subscribe-dialog .report-subscribe-add-icon:hover,
        .cx-report-subscribe-dialog .report-subscribe-add-icon:focus-visible {
            border-color: #315879;
            background: #315879;
            color: #ffffff;
        }

        .cx-report-subscribe-dialog .report-subscribe-add-icon:disabled {
            border-color: #c8d2dc;
            background: #e8edf2;
            color: #8b98a7;
            cursor: not-allowed;
        }

    .cx-report-subscribe-dialog .report-subscribe-recipient-list-row {
        margin-top: 16px;
        display: grid;
        gap: 8px;
    }

    .cx-report-subscribe-dialog .report-subscribe-recipient-list-label {
        color: #52677a;
        font-size: .74rem;
        font-weight: 800;
        letter-spacing: .03em;
        text-transform: uppercase;
    }

    .cx-report-subscribe-dialog .report-subscribe-email-list {
        display: flex;
        align-items: flex-start;
        flex-wrap: wrap;
        gap: 8px;
    }

    .cx-report-subscribe-dialog .report-subscribe-email-chip {
        max-width: 100%;
        min-height: 34px;
        padding: 5px 7px 5px 10px;
        display: inline-flex;
        align-items: center;
        gap: 7px;
        border: 1px solid #cfdae5;
        border-radius: 999px;
        background: #f4f8fb;
        color: #344b66;
        font-size: .77rem;
    }

        .cx-report-subscribe-dialog .report-subscribe-email-chip > span {
            max-width: min(430px, 55vw);
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }

    .cx-report-subscribe-dialog .report-subscribe-remove-button {
        width: 25px;
        height: 25px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        padding: 0;
        border: 0;
        border-radius: 50%;
        background: transparent;
        color: #7b8896;
    }

        .cx-report-subscribe-dialog .report-subscribe-remove-button:hover,
        .cx-report-subscribe-dialog .report-subscribe-remove-button:focus-visible {
            background: #e3eaf1;
            color: #a44952;
        }

    .cx-report-subscribe-dialog .report-subscribe-empty {
        min-height: 48px;
        padding: 12px 14px;
        display: flex;
        align-items: center;
        border: 1px dashed #cfd9e3;
        border-radius: 9px;
        background: #fafcfd;
        color: #768596;
        font-size: .79rem;
    }

    .cx-report-subscribe-dialog .report-subscribe-active {
        margin-top: 14px;
        padding: 10px 12px;
        display: flex;
        align-items: center;
        gap: 8px;
        border: 1px solid #b9d8bf;
        border-radius: 9px;
        background: #f1faf3;
        color: #397246;
        font-size: .79rem;
        font-weight: 750;
    }

    .cx-report-subscribe-dialog .report-subscribe-footer {
        width: 100%;
        display: flex;
        align-items: center;
        justify-content: flex-end;
        gap: 9px;
        flex-wrap: wrap;
    }

    .cx-report-subscribe-dialog .report-subscribe-action {
        min-height: 36px !important;
        padding: 7px 12px !important;
    }

    .cx-report-subscribe-dialog .report-subscribe-loading {
        min-height: 300px;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-direction: column;
        gap: 12px;
    }

    .cx-report-subscribe-dialog .report-subscribe-loading-text {
        color: #667085;
        font-size: .82rem;
        font-weight: 700;
    }

@media (max-width: 991.98px) {
    .cx-report-subscribe-dialog .report-subscribe-schedule-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 767.98px) {
    .cx-report-subscribe-dialog {
        width: calc(100vw - 14px) !important;
        max-width: calc(100vw - 14px) !important;
    }

        .cx-report-subscribe-dialog .mud-dialog-content {
            padding: 10px !important;
        }

        .cx-report-subscribe-dialog .report-subscribe-section {
            padding: 14px !important;
        }

        .cx-report-subscribe-dialog .report-subscribe-schedule-grid {
            grid-template-columns: minmax(0, 1fr);
        }

        .cx-report-subscribe-dialog .report-subscribe-email-chip > span {
            max-width: calc(100vw - 145px);
        }

        .cx-report-subscribe-dialog .report-subscribe-footer {
            align-items: stretch;
            flex-direction: column;
        }

        .cx-report-subscribe-dialog .report-subscribe-action {
            width: 100%;
        }
}

.cx-report-preview-dialog {
    width: min(1560px, calc(100vw - 20px)) !important;
    max-width: min(1560px, calc(100vw - 20px)) !important;
}

    .cx-report-preview-dialog .mud-dialog-content {
        padding: 20px 22px !important;
    }

    .cx-report-preview-dialog .cx-report-preview-section {
        padding: 20px 22px 22px !important;
    }

    .cx-report-preview-dialog .report-preview-summary {
        margin: 0 0 16px;
        padding: 14px 16px;
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto;
        align-items: center;
        gap: 16px;
        border: 1px solid #d7e1ea;
        border-radius: 11px;
        background: #f8fbfd;
    }

    .cx-report-preview-dialog .report-preview-summary-main {
        min-width: 0;
    }

    .cx-report-preview-dialog .report-preview-badge {
        width: fit-content;
        margin-bottom: 7px;
        padding: 5px 10px;
        display: inline-flex;
        align-items: center;
        gap: 7px;
        border-radius: 999px;
        background: #2c4c6c;
        color: #ffffff;
        font-size: .72rem;
        font-weight: 800;
        letter-spacing: .045em;
        text-transform: uppercase;
    }

    .cx-report-preview-dialog .report-preview-summary-title {
        color: #2c4c6c;
        font-size: 1rem;
        font-weight: 800;
        line-height: 1.35;
    }

    .cx-report-preview-dialog .report-preview-summary-text {
        margin-top: 4px;
        color: #687787;
        font-size: .83rem;
        line-height: 1.5;
    }

    .cx-report-preview-dialog .report-preview-summary-icon {
        width: 46px;
        height: 46px;
        min-width: 46px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        border: 1px solid #c9d8e6;
        border-radius: 11px;
        background: #edf3f8;
        color: #315879;
        font-size: 1.05rem;
    }

    .cx-report-preview-dialog .report-preview-panel {
        overflow: hidden;
        border: 1px solid #d7e1ea;
        border-radius: 11px;
        background: #ffffff;
    }

    .cx-report-preview-dialog .report-preview-toolbar {
        min-height: 46px;
        padding: 10px 14px;
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
        border-bottom: 1px solid #e4eaf0;
        background: #f6f8fb;
    }

    .cx-report-preview-dialog .report-preview-toolbar-title {
        min-width: 0;
        display: inline-flex;
        align-items: center;
        gap: 8px;
        color: #2c4c6c;
        font-size: .82rem;
        font-weight: 800;
    }

    .cx-report-preview-dialog .report-preview-toolbar-meta {
        color: #6c7b8b;
        font-size: .76rem;
        white-space: nowrap;
    }

    .cx-report-preview-dialog .report-preview-scroll {
        min-height: 390px;
        max-height: calc(100dvh - 330px);
        padding: 16px;
        overflow: auto;
        scrollbar-gutter: stable both-edges;
        overscroll-behavior: contain;
        background: #ffffff;
        color: #253858;
        font-size: .82rem;
        line-height: 1.55;
    }

    .cx-report-preview-dialog .report-preview-rendered-content {
        width: 100%;
        min-width: 0;
        max-width: 100%;
        overflow-x: auto;
        overscroll-behavior: contain;
    }

        .cx-report-preview-dialog .report-preview-rendered-content :is( div, section, article, main, header, footer, figure) {
            max-width: 100% !important;
            box-sizing: border-box !important;
        }

        .cx-report-preview-dialog .report-preview-rendered-content :is( img, svg, canvas) {
            max-width: 100% !important;
            height: auto !important;
            object-fit: contain !important;
        }

        .cx-report-preview-dialog .report-preview-rendered-content table {
            width: max-content !important;
            min-width: 100% !important;
            max-width: none !important;
            margin: 0 !important;
            border-collapse: separate !important;
            border-spacing: 0 !important;
            table-layout: auto !important;
            border: 1px solid #dfe6ee !important;
            color: #253858 !important;
            font-size: .78rem !important;
        }

        .cx-report-preview-dialog .report-preview-rendered-content th {
            padding: 10px 11px !important;
            border-bottom: 1px solid #d6e0e9 !important;
            background: #eef3f7 !important;
            color: #2c4c6c !important;
            font-weight: 800 !important;
            white-space: nowrap;
            vertical-align: middle !important;
        }

        .cx-report-preview-dialog .report-preview-rendered-content td {
            padding: 10px 11px !important;
            border-bottom: 1px solid #edf1f5 !important;
            background: #ffffff !important;
            color: #344054 !important;
            vertical-align: middle !important;
        }

        .cx-report-preview-dialog .report-preview-rendered-content tbody tr:hover td {
            background: #f3f7fa !important;
        }

    .cx-report-preview-dialog .report-preview-loading {
        min-height: 330px;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-direction: column;
        gap: 12px;
    }

    .cx-report-preview-dialog .report-preview-loading-text {
        color: #667085;
        font-size: .82rem;
        font-weight: 700;
    }

    .cx-report-preview-dialog .report-preview-error {
        padding: 24px;
        border: 1px solid #e4b9be;
        border-radius: 11px;
        background: #fff7f8;
        color: #a44952;
        text-align: center;
        font-size: .82rem;
        line-height: 1.5;
    }

        .cx-report-preview-dialog .report-preview-error i {
            display: block;
            margin-bottom: 9px;
            font-size: 1.25rem;
        }

    .cx-report-preview-dialog .report-preview-close-button {
        min-height: 40px !important;
        padding: 8px 15px !important;
    }

@media (max-width: 767.98px) {
    .cx-report-preview-dialog {
        width: calc(100vw - 14px) !important;
        max-width: calc(100vw - 14px) !important;
    }

        .cx-report-preview-dialog .mud-dialog-content {
            padding: 10px !important;
        }

        .cx-report-preview-dialog .cx-report-preview-section {
            padding: 14px !important;
        }

        .cx-report-preview-dialog .report-preview-summary {
            grid-template-columns: minmax(0, 1fr);
        }

        .cx-report-preview-dialog .report-preview-summary-icon {
            display: none;
        }

        .cx-report-preview-dialog .report-preview-toolbar {
            align-items: flex-start;
            flex-direction: column;
        }

        .cx-report-preview-dialog .report-preview-toolbar-meta {
            white-space: normal;
        }

        .cx-report-preview-dialog .report-preview-scroll {
            min-height: 320px;
            max-height: 62dvh;
            padding: 10px;
        }

        .cx-report-preview-dialog .report-preview-rendered-content th,
        .cx-report-preview-dialog .report-preview-rendered-content td {
            padding: 8px !important;
            font-size: .72rem !important;
        }
}

.cx-log-list-page-header {
    margin-bottom: 14px;
}

.cx-log-list-page-actions {
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 8px;
}

.cx-log-list-card {
    overflow: hidden;
}

.cx-log-list-toolbar {
    width: 100%;
    margin: 0;
    padding: 12px 14px;
    border: 0;
    border-radius: 8px 8px 0 0;
    background: #2c4c6c !important;
}

    .cx-log-list-toolbar > .row {
        width: 100%;
        margin: 0;
        display: grid;
        grid-template-columns: minmax(0, 1fr) minmax(280px, 480px);
        align-items: center;
        gap: 12px;
    }

        .cx-log-list-toolbar > .row > [class*="col-"] {
            width: auto;
            max-width: none;
            min-width: 0;
            margin: 0;
            padding: 0;
        }

    .cx-log-list-toolbar .dataTables_filter,
    .cx-log-list-toolbar .dataTables_filter > label {
        width: 100%;
        margin: 0;
        display: block;
        text-align: right;
    }

@media (max-width: 767.98px) {
    .cx-log-list-page-header {
        align-items: flex-start;
        gap: 10px;
    }

    .cx-log-list-page-actions {
        width: auto;
        margin-left: auto;
        flex-wrap: nowrap;
    }

        .cx-log-list-page-actions .cx-page-action {
            width: 40px;
            min-width: 40px;
            padding: 0;
            font-size: 0;
        }

            .cx-log-list-page-actions .cx-page-action > i {
                font-size: 15px;
            }

    .cx-log-list-toolbar {
        padding: 10px;
    }

        .cx-log-list-toolbar > .row {
            grid-template-columns: 38px minmax(0, 1fr);
            gap: 9px;
        }
}

.cx-log-list-page-header {
    margin-bottom: 14px;
}

.cx-log-list-page-actions {
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 8px;
}

.cx-log-list-card {
    overflow: hidden;
}

.cx-data-log-filter-panel {
    margin-bottom: 16px;
    padding: 14px;
    border: 1px solid #dce6ef;
    border-radius: 10px;
    background: #f8fbfd;
}

.cx-data-log-filter-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 12px;
}

.cx-data-log-filter-title {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    color: #294d70;
    font-weight: 800;
}

.cx-data-log-filter-icon {
    width: 34px;
    height: 34px;
    display: inline-grid;
    place-items: center;
    border: 1px solid #d5e2ed;
    border-radius: 9px;
    background: #eef5fa;
    color: #3e6a99;
}

.cx-data-log-filter-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
}

.cx-data-log-filter-field {
    min-width: 0;
}

    .cx-data-log-filter-field > label {
        display: block;
        margin-bottom: 5px;
        color: #3d5873;
        font-size: .82rem;
        font-weight: 750;
    }

.cx-data-log-reset-button {
    min-height: 38px;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 7px 11px;
    border: 1px solid #cfdce8;
    border-radius: 9px;
    background: #fff;
    color: #315779;
    font-weight: 700;
}

    .cx-data-log-reset-button:hover {
        border-color: #9db6cb;
        background: #edf5fb;
        color: #203f5d;
    }

.cx-log-list-toolbar {
    width: 100%;
    margin: 0;
    padding: 12px 14px;
    border: 0;
    border-radius: 8px 8px 0 0;
    background: #2c4c6c !important;
}

    .cx-log-list-toolbar > .row {
        width: 100%;
        margin: 0;
        display: grid;
        grid-template-columns: minmax(0, 1fr) minmax(280px, 480px);
        align-items: center;
        gap: 12px;
    }

        .cx-log-list-toolbar > .row > [class*="col-"] {
            width: auto;
            max-width: none;
            min-width: 0;
            margin: 0;
            padding: 0;
        }

    .cx-log-list-toolbar .dataTables_filter,
    .cx-log-list-toolbar .dataTables_filter > label {
        width: 100%;
        margin: 0;
        display: block;
        text-align: right;
    }

@media (max-width: 767.98px) {
    .cx-log-list-page-header {
        align-items: flex-start;
        gap: 10px;
    }

    .cx-log-list-page-actions {
        width: auto;
        margin-left: auto;
        flex-wrap: nowrap;
    }

        .cx-log-list-page-actions .cx-page-action {
            width: 40px;
            min-width: 40px;
            padding: 0;
            font-size: 0;
        }

            .cx-log-list-page-actions .cx-page-action > i {
                font-size: 15px;
            }

    .cx-log-list-toolbar {
        padding: 10px;
    }

    .cx-data-log-filter-heading {
        align-items: flex-start;
    }

    .cx-data-log-filter-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .cx-data-log-reset-button {
        width: 40px;
        min-width: 40px;
        padding: 0;
        justify-content: center;
    }

        .cx-data-log-reset-button > span {
            display: none;
        }

    .cx-log-list-toolbar > .row {
        grid-template-columns: 38px minmax(0, 1fr);
        gap: 9px;
    }
}

.cx-log-list-card .table-responsive {
    max-width: 100%;
    overflow-x: auto;
    overflow-y: visible;
    -webkit-overflow-scrolling: touch;
}

.cx-log-list-card table.dataTable {
    width: 100% !important;
    min-width: 760px;
    table-layout: fixed;
}

.cx-log-list-card table.dataTable th,
.cx-log-list-card table.dataTable td {
    min-width: 0;
    max-width: 100%;
    overflow: hidden;
    vertical-align: middle;
}

.cx-log-list-card table.dataTable .table-header > div {
    min-width: 0;
    max-width: 100%;
}

.cx-log-list-card table.dataTable .table-header > div > div:first-child {
    min-width: 0;
    max-width: 100%;
    overflow: hidden;
}

.cx-log-list-card table.dataTable .table-header > div > div:first-child > span:first-child {
    display: block !important;
    min-width: 0;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
}

.cx-log-list-card table.dataTable td.wrapped {
    overflow-wrap: anywhere;
    word-break: break-word;
}

.cx-log-list-card--audit table.dataTable th:nth-child(1),
.cx-log-list-card--audit table.dataTable td:nth-child(1) { width: 22%; }
.cx-log-list-card--audit table.dataTable th:nth-child(2),
.cx-log-list-card--audit table.dataTable td:nth-child(2) { width: 78%; }

.cx-log-list-card--data.cx-log-list-card--with-device table.dataTable { min-width: 980px; }
.cx-log-list-card--data.cx-log-list-card--with-device table.dataTable th:nth-child(1),
.cx-log-list-card--data.cx-log-list-card--with-device table.dataTable td:nth-child(1) { width: 16%; }
.cx-log-list-card--data.cx-log-list-card--with-device table.dataTable th:nth-child(2),
.cx-log-list-card--data.cx-log-list-card--with-device table.dataTable td:nth-child(2) { width: 52%; }
.cx-log-list-card--data.cx-log-list-card--with-device table.dataTable th:nth-child(3),
.cx-log-list-card--data.cx-log-list-card--with-device table.dataTable td:nth-child(3) { width: 18%; }
.cx-log-list-card--data.cx-log-list-card--with-device table.dataTable th:nth-child(4),
.cx-log-list-card--data.cx-log-list-card--with-device table.dataTable td:nth-child(4) { width: 14%; }

.cx-log-list-card--data.cx-log-list-card--without-device table.dataTable { min-width: 800px; }
.cx-log-list-card--data.cx-log-list-card--without-device table.dataTable th:nth-child(1),
.cx-log-list-card--data.cx-log-list-card--without-device table.dataTable td:nth-child(1) { width: 18%; }
.cx-log-list-card--data.cx-log-list-card--without-device table.dataTable th:nth-child(2),
.cx-log-list-card--data.cx-log-list-card--without-device table.dataTable td:nth-child(2) { width: 66%; }
.cx-log-list-card--data.cx-log-list-card--without-device table.dataTable th:nth-child(3),
.cx-log-list-card--data.cx-log-list-card--without-device table.dataTable td:nth-child(3) { width: 16%; }

.cx-log-list-card--error table.dataTable { min-width: 1080px; }
.cx-log-list-card--error table.dataTable th:nth-child(1),
.cx-log-list-card--error table.dataTable td:nth-child(1) { width: 15%; }
.cx-log-list-card--error table.dataTable th:nth-child(2),
.cx-log-list-card--error table.dataTable td:nth-child(2) { width: 15%; }
.cx-log-list-card--error table.dataTable th:nth-child(3),
.cx-log-list-card--error table.dataTable td:nth-child(3) { width: 32%; }
.cx-log-list-card--error table.dataTable th:nth-child(4),
.cx-log-list-card--error table.dataTable td:nth-child(4) { width: 38%; }

.cx-log-list-card--location table.dataTable th:nth-child(1),
.cx-log-list-card--location table.dataTable td:nth-child(1) { width: 22%; }
.cx-log-list-card--location table.dataTable th:nth-child(2),
.cx-log-list-card--location table.dataTable td:nth-child(2) { width: 78%; }

.cx-log-list-card--session table.dataTable th:nth-child(1),
.cx-log-list-card--session table.dataTable td:nth-child(1) { width: 30%; }
.cx-log-list-card--session table.dataTable th:nth-child(2),
.cx-log-list-card--session table.dataTable td:nth-child(2) { width: 32%; }
.cx-log-list-card--session table.dataTable th:nth-child(3),
.cx-log-list-card--session table.dataTable td:nth-child(3) { width: 38%; }

.cx-log-list-card--sms.cx-log-list-card--with-device table.dataTable { min-width: 900px; }
.cx-log-list-card--sms.cx-log-list-card--with-device table.dataTable th:nth-child(1),
.cx-log-list-card--sms.cx-log-list-card--with-device table.dataTable td:nth-child(1) { width: 16%; }
.cx-log-list-card--sms.cx-log-list-card--with-device table.dataTable th:nth-child(2),
.cx-log-list-card--sms.cx-log-list-card--with-device table.dataTable td:nth-child(2) { width: 50%; }
.cx-log-list-card--sms.cx-log-list-card--with-device table.dataTable th:nth-child(3),
.cx-log-list-card--sms.cx-log-list-card--with-device table.dataTable td:nth-child(3) { width: 20%; }
.cx-log-list-card--sms.cx-log-list-card--with-device table.dataTable th:nth-child(4),
.cx-log-list-card--sms.cx-log-list-card--with-device table.dataTable td:nth-child(4) { width: 14%; }

.cx-log-list-card--sms.cx-log-list-card--without-device table.dataTable th:nth-child(1),
.cx-log-list-card--sms.cx-log-list-card--without-device table.dataTable td:nth-child(1) { width: 18%; }
.cx-log-list-card--sms.cx-log-list-card--without-device table.dataTable th:nth-child(2),
.cx-log-list-card--sms.cx-log-list-card--without-device table.dataTable td:nth-child(2) { width: 66%; }
.cx-log-list-card--sms.cx-log-list-card--without-device table.dataTable th:nth-child(3),
.cx-log-list-card--sms.cx-log-list-card--without-device table.dataTable td:nth-child(3) { width: 16%; }

.cx-log-list-card--voice.cx-log-list-card--with-device table.dataTable { min-width: 960px; }
.cx-log-list-card--voice.cx-log-list-card--with-device table.dataTable th:nth-child(1),
.cx-log-list-card--voice.cx-log-list-card--with-device table.dataTable td:nth-child(1) { width: 17%; }
.cx-log-list-card--voice.cx-log-list-card--with-device table.dataTable th:nth-child(2),
.cx-log-list-card--voice.cx-log-list-card--with-device table.dataTable td:nth-child(2) { width: 18%; }
.cx-log-list-card--voice.cx-log-list-card--with-device table.dataTable th:nth-child(3),
.cx-log-list-card--voice.cx-log-list-card--with-device table.dataTable td:nth-child(3) { width: 18%; }
.cx-log-list-card--voice.cx-log-list-card--with-device table.dataTable th:nth-child(4),
.cx-log-list-card--voice.cx-log-list-card--with-device table.dataTable td:nth-child(4) { width: 17%; }
.cx-log-list-card--voice.cx-log-list-card--with-device table.dataTable th:nth-child(5),
.cx-log-list-card--voice.cx-log-list-card--with-device table.dataTable td:nth-child(5) { width: 30%; }

.cx-log-list-card--voice.cx-log-list-card--without-device table.dataTable th:nth-child(1),
.cx-log-list-card--voice.cx-log-list-card--without-device table.dataTable td:nth-child(1) { width: 22%; }
.cx-log-list-card--voice.cx-log-list-card--without-device table.dataTable th:nth-child(2),
.cx-log-list-card--voice.cx-log-list-card--without-device table.dataTable td:nth-child(2) { width: 27%; }
.cx-log-list-card--voice.cx-log-list-card--without-device table.dataTable th:nth-child(3),
.cx-log-list-card--voice.cx-log-list-card--without-device table.dataTable td:nth-child(3) { width: 27%; }
.cx-log-list-card--voice.cx-log-list-card--without-device table.dataTable th:nth-child(4),
.cx-log-list-card--voice.cx-log-list-card--without-device table.dataTable td:nth-child(4) { width: 24%; }

.cx-log-list-card .cx-data-log-trigger {
    display: block;
    max-width: 100%;
    overflow: hidden;
    color: inherit;
    text-overflow: ellipsis;
    white-space: nowrap;
    cursor: help;
    outline: none;
}

    .cx-log-list-card .cx-data-log-trigger:focus-visible {
        border-radius: 4px;
        box-shadow: 0 0 0 3px rgba(62, 106, 153, .16);
    }

.cx-log-list-card .cx-data-log-details {
    display: none !important;
}

.cx-data-log-popover-content {
    display: grid;
    gap: 12px;
}

.cx-data-log-popover-prefix {
    padding-bottom: 8px;
    border-bottom: 1px solid #e2e9f0;
    color: #294d70;
    font-weight: 800;
    overflow-wrap: anywhere;
}

.cx-data-log-section {
    border: 1px solid #dfe7ef;
    border-radius: 9px;
    overflow: hidden;
    background: #ffffff;
}

.cx-data-log-section-title {
    margin: 0;
    padding: 8px 10px;
    background: #edf4f9;
    color: #294d70;
    font-size: .78rem;
    font-weight: 800;
    letter-spacing: .025em;
    text-transform: uppercase;
}

.cx-data-log-section-body {
    padding: 7px 10px;
}

.cx-data-log-popover-row {
    display: grid;
    grid-template-columns: minmax(145px, .85fr) minmax(0, 1.15fr);
    gap: 10px;
    padding: 5px 0;
    border-bottom: 1px solid #eef2f6;
}

    .cx-data-log-popover-row:last-child {
        border-bottom: 0;
    }

.cx-data-log-popover-key {
    color: #294d70;
    font-weight: 750;
    overflow-wrap: anywhere;
}

.cx-data-log-popover-value,
.cx-data-log-raw-details {
    color: #435c74;
    overflow-wrap: anywhere;
    white-space: pre-wrap;
}

.cx-data-log-element {
    margin-top: 8px;
    border: 1px solid #e3eaf1;
    border-radius: 8px;
    background: #fbfdff;
}

    .cx-data-log-element > summary,
    .cx-data-log-raw-toggle > summary {
        padding: 8px 10px;
        color: #315b7e;
        font-weight: 750;
        cursor: pointer;
    }

.cx-data-log-element-body {
    padding: 0 10px 8px;
}

.cx-data-log-raw-toggle pre {
    max-height: 240px;
    margin: 0;
    padding: 10px;
    overflow: auto;
    background: #f7f9fb;
    color: #31485f;
    font-size: .74rem;
    line-height: 1.45;
    white-space: pre-wrap;
    word-break: break-word;
}

@media (max-width: 767.98px) {
    .cx-data-log-popover-row {
        grid-template-columns: minmax(0, 1fr);
        gap: 2px;
    }
}

.cx-log-list-page-header {
    margin-bottom: 14px;
}

.cx-log-list-page-actions {
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 8px;
}

.cx-log-list-card {
    overflow: hidden;
}

.cx-log-list-toolbar {
    width: 100%;
    margin: 0;
    padding: 12px 14px;
    border: 0;
    border-radius: 8px 8px 0 0;
    background: #2c4c6c !important;
}

    .cx-log-list-toolbar > .row {
        width: 100%;
        margin: 0;
        display: grid;
        grid-template-columns: minmax(0, 1fr) minmax(280px, 480px);
        align-items: center;
        gap: 12px;
    }

        .cx-log-list-toolbar > .row > [class*="col-"] {
            width: auto;
            max-width: none;
            min-width: 0;
            margin: 0;
            padding: 0;
        }

    .cx-log-list-toolbar .dataTables_filter,
    .cx-log-list-toolbar .dataTables_filter > label {
        width: 100%;
        margin: 0;
        display: block;
        text-align: right;
    }

@media (max-width: 767.98px) {
    .cx-log-list-page-header {
        align-items: flex-start;
        gap: 10px;
    }

    .cx-log-list-page-actions {
        width: auto;
        margin-left: auto;
        flex-wrap: nowrap;
    }

        .cx-log-list-page-actions .cx-page-action {
            width: 40px;
            min-width: 40px;
            padding: 0;
            font-size: 0;
        }

            .cx-log-list-page-actions .cx-page-action > i {
                font-size: 15px;
            }

    .cx-log-list-toolbar {
        padding: 10px;
    }

        .cx-log-list-toolbar > .row {
            grid-template-columns: 38px minmax(0, 1fr);
            gap: 9px;
        }
}

.cx-log-list-page-header {
    margin-bottom: 14px;
}

.cx-log-list-page-actions {
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 8px;
}

.cx-log-list-card {
    overflow: hidden;
}

.cx-log-list-toolbar {
    width: 100%;
    margin: 0;
    padding: 12px 14px;
    border: 0;
    border-radius: 8px 8px 0 0;
    background: #2c4c6c !important;
}

    .cx-log-list-toolbar > .row {
        width: 100%;
        margin: 0;
        display: grid;
        grid-template-columns: minmax(0, 1fr) minmax(280px, 480px);
        align-items: center;
        gap: 12px;
    }

        .cx-log-list-toolbar > .row > [class*="col-"] {
            width: auto;
            max-width: none;
            min-width: 0;
            margin: 0;
            padding: 0;
        }

    .cx-log-list-toolbar .dataTables_filter,
    .cx-log-list-toolbar .dataTables_filter > label {
        width: 100%;
        margin: 0;
        display: block;
        text-align: right;
    }

@media (max-width: 767.98px) {
    .cx-log-list-page-header {
        align-items: flex-start;
        gap: 10px;
    }

    .cx-log-list-page-actions {
        width: auto;
        margin-left: auto;
        flex-wrap: nowrap;
    }

        .cx-log-list-page-actions .cx-page-action {
            width: 40px;
            min-width: 40px;
            padding: 0;
            font-size: 0;
        }

            .cx-log-list-page-actions .cx-page-action > i {
                font-size: 15px;
            }

    .cx-log-list-toolbar {
        padding: 10px;
    }

        .cx-log-list-toolbar > .row {
            grid-template-columns: 38px minmax(0, 1fr);
            gap: 9px;
        }
}

.cx-log-list-page-header {
    margin-bottom: 14px;
}

.cx-log-list-page-actions {
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 8px;
}

.cx-log-list-card {
    overflow: hidden;
}

.cx-log-list-toolbar {
    width: 100%;
    margin: 0;
    padding: 12px 14px;
    border: 0;
    border-radius: 8px 8px 0 0;
    background: #2c4c6c !important;
}

    .cx-log-list-toolbar > .row {
        width: 100%;
        margin: 0;
        display: grid;
        grid-template-columns: minmax(0, 1fr) minmax(280px, 480px);
        align-items: center;
        gap: 12px;
    }

        .cx-log-list-toolbar > .row > [class*="col-"] {
            width: auto;
            max-width: none;
            min-width: 0;
            margin: 0;
            padding: 0;
        }

    .cx-log-list-toolbar .dataTables_filter,
    .cx-log-list-toolbar .dataTables_filter > label {
        width: 100%;
        margin: 0;
        display: block;
        text-align: right;
    }

@media (max-width: 767.98px) {
    .cx-log-list-page-header {
        align-items: flex-start;
        gap: 10px;
    }

    .cx-log-list-page-actions {
        width: auto;
        margin-left: auto;
        flex-wrap: nowrap;
    }

        .cx-log-list-page-actions .cx-page-action {
            width: 40px;
            min-width: 40px;
            padding: 0;
            font-size: 0;
        }

            .cx-log-list-page-actions .cx-page-action > i {
                font-size: 15px;
            }

    .cx-log-list-toolbar {
        padding: 10px;
    }

        .cx-log-list-toolbar > .row {
            grid-template-columns: 38px minmax(0, 1fr);
            gap: 9px;
        }
}

.cx-log-list-page-header {
    margin-bottom: 14px;
}

.cx-log-list-page-actions {
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 8px;
}

.cx-log-list-card {
    overflow: hidden;
}

.cx-log-list-toolbar {
    width: 100%;
    margin: 0;
    padding: 12px 14px;
    border: 0;
    border-radius: 8px 8px 0 0;
    background: #2c4c6c !important;
}

    .cx-log-list-toolbar > .row {
        width: 100%;
        margin: 0;
        display: grid;
        grid-template-columns: minmax(0, 1fr) minmax(280px, 480px);
        align-items: center;
        gap: 12px;
    }

        .cx-log-list-toolbar > .row > [class*="col-"] {
            width: auto;
            max-width: none;
            min-width: 0;
            margin: 0;
            padding: 0;
        }

    .cx-log-list-toolbar .dataTables_filter,
    .cx-log-list-toolbar .dataTables_filter > label {
        width: 100%;
        margin: 0;
        display: block;
        text-align: right;
    }

@media (max-width: 767.98px) {
    .cx-log-list-page-header {
        align-items: flex-start;
        gap: 10px;
    }

    .cx-log-list-page-actions {
        width: auto;
        margin-left: auto;
        flex-wrap: nowrap;
    }

        .cx-log-list-page-actions .cx-page-action {
            width: 40px;
            min-width: 40px;
            padding: 0;
            font-size: 0;
        }

            .cx-log-list-page-actions .cx-page-action > i {
                font-size: 15px;
            }

    .cx-log-list-toolbar {
        padding: 10px;
    }

        .cx-log-list-toolbar > .row {
            grid-template-columns: 38px minmax(0, 1fr);
            gap: 9px;
        }
}

.cx-log-list-page-header {
    margin-bottom: 14px;
}

.cx-log-list-page-actions {
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 8px;
}

.cx-log-list-card {
    overflow: hidden;
}

.cx-log-list-toolbar {
    width: 100%;
    margin: 0;
    padding: 12px 14px;
    border: 0;
    border-radius: 8px 8px 0 0;
    background: #2c4c6c !important;
}

    .cx-log-list-toolbar > .row {
        width: 100%;
        margin: 0;
        display: grid;
        grid-template-columns: minmax(0, 1fr) minmax(280px, 480px);
        align-items: center;
        gap: 12px;
    }

        .cx-log-list-toolbar > .row > [class*="col-"] {
            width: auto;
            max-width: none;
            min-width: 0;
            margin: 0;
            padding: 0;
        }

    .cx-log-list-toolbar .dataTables_filter,
    .cx-log-list-toolbar .dataTables_filter > label {
        width: 100%;
        margin: 0;
        display: block;
        text-align: right;
    }

@media (max-width: 767.98px) {
    .cx-log-list-page-header {
        align-items: flex-start;
        gap: 10px;
    }

    .cx-log-list-page-actions {
        width: auto;
        margin-left: auto;
        flex-wrap: nowrap;
    }

        .cx-log-list-page-actions .cx-page-action {
            width: 40px;
            min-width: 40px;
            padding: 0;
            font-size: 0;
        }

            .cx-log-list-page-actions .cx-page-action > i {
                font-size: 15px;
            }

    .cx-log-list-toolbar {
        padding: 10px;
    }

        .cx-log-list-toolbar > .row {
            grid-template-columns: 38px minmax(0, 1fr);
            gap: 9px;
        }
}

.state-prov-list-card {
    overflow: hidden;
}

.state-prov-list-toolbar {
    min-height: 72px;
    margin: 0 !important;
    padding: 12px 16px;
    display: flex;
    align-items: center;
    border: 0;
    border-radius: 0;
    background: #2c4c6c;
}

.state-prov-list-toolbar-row {
    width: 100%;
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(280px, 480px);
    align-items: center;
    gap: 12px;
}

.state-prov-list-toolbar-back {
    min-width: 0;
    display: flex;
    align-items: center;
}

.state-prov-list-toolbar-search {
    width: 100%;
    min-width: 0;
    grid-column: 2;
}

    .state-prov-list-toolbar-search .dataTables_filter,
    .state-prov-list-toolbar-search .dataTables_filter > label {
        width: 100%;
        margin: 0;
        display: block;
        text-align: right;
    }

.state-prov-list-sorting {
    min-height: 40px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    color: #ffffff;
}

.state-prov-list-card-body {
    padding-top: 1rem;
}

@media (max-width: 991.98px) {
    .state-prov-list-toolbar {
        min-height: 62px;
        padding: 10px 12px;
    }

    .state-prov-list-toolbar-row {
        grid-template-columns: auto minmax(0, 1fr);
        gap: 10px;
    }

    .state-prov-list-toolbar-search {
        grid-column: 2;
    }
}

@media (max-width: 575.98px) {
    .state-prov-list-toolbar {
        padding: 9px 10px;
    }
}

.string-resource-list-card {
    overflow: hidden;
}

.string-resource-list-toolbar {
    min-height: 72px;
    margin: 0 !important;
    padding: 12px 16px;
    display: flex;
    align-items: center;
    border: 0;
    border-radius: 0;
    background: #2c4c6c;
}

.string-resource-list-toolbar-row {
    width: 100%;
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(280px, 480px);
    align-items: center;
    gap: 12px;
}

.string-resource-list-toolbar-back {
    min-width: 0;
    display: flex;
    align-items: center;
}

.string-resource-list-toolbar-search {
    width: 100%;
    min-width: 0;
    grid-column: 2;
}

    .string-resource-list-toolbar-search .dataTables_filter,
    .string-resource-list-toolbar-search .dataTables_filter > label {
        width: 100%;
        margin: 0;
        display: block;
        text-align: right;
    }

.string-resource-list-sorting {
    min-height: 40px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    color: #ffffff;
}

.string-resource-list-card-body {
    padding-top: 1rem;
}

@media (max-width: 991.98px) {
    .string-resource-list-toolbar {
        min-height: 62px;
        padding: 10px 12px;
    }

    .string-resource-list-toolbar-row {
        grid-template-columns: auto minmax(0, 1fr);
        gap: 10px;
    }

    .string-resource-list-toolbar-search {
        grid-column: 2;
    }
}

@media (max-width: 575.98px) {
    .string-resource-list-toolbar {
        padding: 9px 10px;
    }
}

.cx-r1-string-addedit .cx-modal-layout-v21 {
    width: 100%;
    display: grid;
    gap: 22px;
}

.cx-r1-string-addedit .cx-r1-section {
    min-width: 0;
    margin: 0;
    padding: .85rem .95rem .95rem;
    border: 1px solid #d7e1ea;
    border-radius: 12px;
    background: #ffffff;
    box-shadow: 0 4px 14px rgba(35, 60, 85, .045);
}

.cx-r1-string-addedit .cx-r1-section-title {
    max-width: calc(100% - 1rem);
    display: inline-flex;
    align-items: center;
    gap: .55rem;
    margin: 0 0 .15rem;
    padding: 0 .45rem;
    color: #2c4c6c;
    font-size: .92rem;
    font-weight: 800;
    line-height: 1.35;
}

.cx-r1-string-addedit .cx-r1-section-icon {
    width: 28px;
    height: 28px;
    min-width: 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    background: #edf3f8;
    color: #3d6287;
    font-size: .78rem;
}

.cx-r1-string-addedit .cx-r1-section-description {
    display: flex;
    align-items: flex-start;
    gap: .45rem;
    margin: .1rem 0 .75rem;
    color: #687787;
    font-size: .82rem;
    line-height: 1.5;
}

    .cx-r1-string-addedit .cx-r1-section-description > i {
        margin-top: .22rem;
        color: #6d88a2;
        font-size: .72rem;
    }

.cx-r1-string-addedit .cx-r1-form-row {
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(175px, 225px) minmax(0, 1fr);
    align-items: start;
    gap: .45rem .9rem;
    margin: 0 0 .75rem;
}

    .cx-r1-string-addedit .cx-r1-form-row:last-child {
        margin-bottom: 0;
    }

    .cx-r1-string-addedit .cx-r1-form-row > [class*="col-"] {
        width: auto;
        max-width: none;
        min-width: 0;
        margin: 0;
        padding: 0;
    }

    .cx-r1-string-addedit .cx-r1-form-row > .form-label {
        padding-top: .62rem;
        text-align: right !important;
    }

.cx-r1-string-addedit .form-label > label:not(.custom-switch),
.cx-r1-string-addedit label[aspfor] {
    color: #52677a;
    font-size: .72rem;
    font-weight: 800;
    letter-spacing: .045em;
    line-height: 1.35;
    text-transform: uppercase;
}

    .cx-r1-string-addedit .form-label > label:not(.custom-switch)::after,
    .cx-r1-string-addedit label[aspfor]::after {
        content: ":";
    }

.cx-r1-string-addedit input.form-control,
.cx-r1-string-addedit select.form-control,
.cx-r1-string-addedit textarea.form-control {
    width: 100%;
    min-width: 0;
    border-color: #cfd9e3;
    border-radius: 8px;
    box-shadow: none;
}

.cx-r1-string-addedit textarea.form-control,
.cx-r1-string-addedit .cx-dialog-textarea {
    width: 100%;
    height: 132px;
    min-height: 84px !important;
    max-height: none !important;
    resize: both !important;
    overflow: auto !important;
}

.cx-r1-string-addedit input:disabled,
.cx-r1-string-addedit select:disabled,
.cx-r1-string-addedit textarea:disabled {
    background: #f3f6f8;
    color: #526170;
    opacity: 1;
}

@media (max-width: 767.98px) {
    .cx-r1-string-addedit .cx-r1-section {
        padding: .85rem;
    }

    .cx-r1-string-addedit .cx-r1-form-row {
        grid-template-columns: minmax(0, 1fr);
        gap: .35rem;
        margin-bottom: .85rem;
    }

        .cx-r1-string-addedit .cx-r1-form-row > .form-label {
            padding-top: 0;
            text-align: left !important;
        }

    .cx-r1-string-addedit .cx-r1-section-description {
        margin-bottom: .8rem;
    }
}

.cx-r1-string-addedit .cx-modal-layout-v21,
.cx-r1-string-addedit form.cx-dialog-v17-form {
    display: grid;
    gap: 22px;
}

.cx-r1-string-addedit .cx-r1-section + .cx-r1-section,
.cx-r1-string-addedit fieldset + fieldset {
    margin-top: 0;
}

@media (max-width: 767.98px) {
    .cx-r1-string-addedit .cx-modal-layout-v21,
    .cx-r1-string-addedit form.cx-dialog-v17-form {
        gap: 16px;
    }
}

.cx-r1-stateprov-addedit .cx-modal-layout-v21 {
    width: 100%;
    display: grid;
    gap: 22px;
}

.cx-r1-stateprov-addedit .cx-r1-section {
    min-width: 0;
    margin: 0;
    padding: .85rem .95rem .95rem;
    border: 1px solid #d7e1ea;
    border-radius: 12px;
    background: #ffffff;
    box-shadow: 0 4px 14px rgba(35, 60, 85, .045);
}

.cx-r1-stateprov-addedit .cx-r1-section-title {
    max-width: calc(100% - 1rem);
    display: inline-flex;
    align-items: center;
    gap: .55rem;
    margin: 0 0 .15rem;
    padding: 0 .45rem;
    color: #2c4c6c;
    font-size: .92rem;
    font-weight: 800;
    line-height: 1.35;
}

.cx-r1-stateprov-addedit .cx-r1-section-icon {
    width: 28px;
    height: 28px;
    min-width: 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    background: #edf3f8;
    color: #3d6287;
    font-size: .78rem;
}

.cx-r1-stateprov-addedit .cx-r1-section-description {
    display: flex;
    align-items: flex-start;
    gap: .45rem;
    margin: .1rem 0 .75rem;
    color: #687787;
    font-size: .82rem;
    line-height: 1.5;
}

    .cx-r1-stateprov-addedit .cx-r1-section-description > i {
        margin-top: .22rem;
        color: #6d88a2;
        font-size: .72rem;
    }

.cx-r1-stateprov-addedit .cx-r1-form-row {
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(175px, 225px) minmax(0, 1fr);
    align-items: start;
    gap: .45rem .9rem;
    margin: 0 0 .75rem;
}

    .cx-r1-stateprov-addedit .cx-r1-form-row:last-child {
        margin-bottom: 0;
    }

    .cx-r1-stateprov-addedit .cx-r1-form-row > [class*="col-"] {
        width: auto;
        max-width: none;
        min-width: 0;
        margin: 0;
        padding: 0;
    }

    .cx-r1-stateprov-addedit .cx-r1-form-row > .form-label {
        padding-top: .62rem;
        text-align: right !important;
    }

.cx-r1-stateprov-addedit .form-label > label:not(.custom-switch),
.cx-r1-stateprov-addedit label[aspfor] {
    color: #52677a;
    font-size: .72rem;
    font-weight: 800;
    letter-spacing: .045em;
    line-height: 1.35;
    text-transform: uppercase;
}

    .cx-r1-stateprov-addedit .form-label > label:not(.custom-switch)::after,
    .cx-r1-stateprov-addedit label[aspfor]::after {
        content: ":";
    }

.cx-r1-stateprov-addedit input.form-control,
.cx-r1-stateprov-addedit select.form-control,
.cx-r1-stateprov-addedit textarea.form-control {
    width: 100%;
    min-width: 0;
    border-color: #cfd9e3;
    border-radius: 8px;
    box-shadow: none;
}

.cx-r1-stateprov-addedit textarea.form-control,
.cx-r1-stateprov-addedit .cx-dialog-textarea {
    width: 100%;
    height: 132px;
    min-height: 84px !important;
    max-height: none !important;
    resize: both !important;
    overflow: auto !important;
}

.cx-r1-stateprov-addedit input:disabled,
.cx-r1-stateprov-addedit select:disabled,
.cx-r1-stateprov-addedit textarea:disabled {
    background: #f3f6f8;
    color: #526170;
    opacity: 1;
}

@media (max-width: 767.98px) {
    .cx-r1-stateprov-addedit .cx-r1-section {
        padding: .85rem;
    }

    .cx-r1-stateprov-addedit .cx-r1-form-row {
        grid-template-columns: minmax(0, 1fr);
        gap: .35rem;
        margin-bottom: .85rem;
    }

        .cx-r1-stateprov-addedit .cx-r1-form-row > .form-label {
            padding-top: 0;
            text-align: left !important;
        }

    .cx-r1-stateprov-addedit .cx-r1-section-description {
        margin-bottom: .8rem;
    }
}

.cx-r1-stateprov-addedit .cx-modal-layout-v21,
.cx-r1-stateprov-addedit form.cx-dialog-v17-form {
    display: grid;
    gap: 22px;
}

.cx-r1-stateprov-addedit .cx-r1-section + .cx-r1-section,
.cx-r1-stateprov-addedit fieldset + fieldset {
    margin-top: 0;
}

@media (max-width: 767.98px) {
    .cx-r1-stateprov-addedit .cx-modal-layout-v21,
    .cx-r1-stateprov-addedit form.cx-dialog-v17-form {
        gap: 16px;
    }
}

.country-list-card {
    overflow: hidden;
}

.country-list-toolbar {
    min-height: 72px;
    margin: 0 !important;
    padding: 12px 16px;
    display: flex;
    align-items: center;
    border: 0;
    border-radius: 0;
    background: #2c4c6c;
}

.country-list-toolbar-row {
    width: 100%;
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(280px, 480px);
    align-items: center;
    gap: 12px;
}

.country-list-toolbar-back {
    min-width: 0;
    display: flex;
    align-items: center;
}

.country-list-toolbar-search {
    width: 100%;
    min-width: 0;
    grid-column: 2;
}

    .country-list-toolbar-search .dataTables_filter,
    .country-list-toolbar-search .dataTables_filter > label {
        width: 100%;
        margin: 0;
        display: block;
        text-align: right;
    }

.country-list-sorting {
    min-height: 40px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    color: #ffffff;
}

.country-list-card-body {
    padding-top: 1rem;
}

@media (max-width: 991.98px) {
    .country-list-toolbar {
        min-height: 62px;
        padding: 10px 12px;
    }

    .country-list-toolbar-row {
        grid-template-columns: auto minmax(0, 1fr);
        gap: 10px;
    }

    .country-list-toolbar-search {
        grid-column: 2;
    }
}

@media (max-width: 575.98px) {
    .country-list-toolbar {
        padding: 9px 10px;
    }
}

.cx-r1-country-addedit .cx-modal-layout-v21 {
    width: 100%;
    display: grid;
    gap: 22px;
}

.cx-r1-country-addedit .cx-r1-section {
    min-width: 0;
    margin: 0;
    padding: .85rem .95rem .95rem;
    border: 1px solid #d7e1ea;
    border-radius: 12px;
    background: #ffffff;
    box-shadow: 0 4px 14px rgba(35, 60, 85, .045);
}

.cx-r1-country-addedit .cx-r1-section-title {
    max-width: calc(100% - 1rem);
    display: inline-flex;
    align-items: center;
    gap: .55rem;
    margin: 0 0 .15rem;
    padding: 0 .45rem;
    color: #2c4c6c;
    font-size: .92rem;
    font-weight: 800;
    line-height: 1.35;
}

.cx-r1-country-addedit .cx-r1-section-icon {
    width: 28px;
    height: 28px;
    min-width: 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    background: #edf3f8;
    color: #3d6287;
    font-size: .78rem;
}

.cx-r1-country-addedit .cx-r1-section-description {
    display: flex;
    align-items: flex-start;
    gap: .45rem;
    margin: .1rem 0 .75rem;
    color: #687787;
    font-size: .82rem;
    line-height: 1.5;
}

    .cx-r1-country-addedit .cx-r1-section-description > i {
        margin-top: .22rem;
        color: #6d88a2;
        font-size: .72rem;
    }

.cx-r1-country-addedit .cx-r1-form-row {
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(175px, 225px) minmax(0, 1fr);
    align-items: start;
    gap: .45rem .9rem;
    margin: 0 0 .75rem;
}

    .cx-r1-country-addedit .cx-r1-form-row:last-child {
        margin-bottom: 0;
    }

    .cx-r1-country-addedit .cx-r1-form-row > [class*="col-"] {
        width: auto;
        max-width: none;
        min-width: 0;
        margin: 0;
        padding: 0;
    }

    .cx-r1-country-addedit .cx-r1-form-row > .form-label {
        padding-top: .62rem;
        text-align: right !important;
    }

.cx-r1-country-addedit .form-label > label:not(.custom-switch),
.cx-r1-country-addedit label[aspfor] {
    color: #52677a;
    font-size: .72rem;
    font-weight: 800;
    letter-spacing: .045em;
    line-height: 1.35;
    text-transform: uppercase;
}

    .cx-r1-country-addedit .form-label > label:not(.custom-switch)::after,
    .cx-r1-country-addedit label[aspfor]::after {
        content: ":";
    }

.cx-r1-country-addedit input.form-control,
.cx-r1-country-addedit select.form-control,
.cx-r1-country-addedit textarea.form-control {
    width: 100%;
    min-width: 0;
    border-color: #cfd9e3;
    border-radius: 8px;
    box-shadow: none;
}

.cx-r1-country-addedit textarea.form-control,
.cx-r1-country-addedit .cx-dialog-textarea {
    width: 100%;
    height: 132px;
    min-height: 84px !important;
    max-height: none !important;
    resize: both !important;
    overflow: auto !important;
}

.cx-r1-country-addedit input:disabled,
.cx-r1-country-addedit select:disabled,
.cx-r1-country-addedit textarea:disabled {
    background: #f3f6f8;
    color: #526170;
    opacity: 1;
}

@media (max-width: 767.98px) {
    .cx-r1-country-addedit .cx-r1-section {
        padding: .85rem;
    }

    .cx-r1-country-addedit .cx-r1-form-row {
        grid-template-columns: minmax(0, 1fr);
        gap: .35rem;
        margin-bottom: .85rem;
    }

        .cx-r1-country-addedit .cx-r1-form-row > .form-label {
            padding-top: 0;
            text-align: left !important;
        }

    .cx-r1-country-addedit .cx-r1-section-description {
        margin-bottom: .8rem;
    }
}

.cx-r1-country-addedit .cx-modal-layout-v21,
.cx-r1-country-addedit form.cx-dialog-v17-form {
    display: grid;
    gap: 22px;
}

.cx-r1-country-addedit .cx-r1-section + .cx-r1-section,
.cx-r1-country-addedit fieldset + fieldset {
    margin-top: 0;
}

@media (max-width: 767.98px) {
    .cx-r1-country-addedit .cx-modal-layout-v21,
    .cx-r1-country-addedit form.cx-dialog-v17-form {
        gap: 16px;
    }
}

.device-model-list-card {
    overflow: hidden;
}

.device-model-list-toolbar {
    min-height: 72px;
    margin: 0 !important;
    padding: 12px 16px;
    display: flex;
    align-items: center;
    border: 0;
    border-radius: 0;
    background: #2c4c6c;
}

.device-model-list-toolbar-row {
    width: 100%;
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(280px, 480px);
    align-items: center;
    gap: 12px;
}

.device-model-list-toolbar-back {
    min-width: 0;
    display: flex;
    align-items: center;
}

.device-model-list-toolbar-search {
    width: 100%;
    min-width: 0;
    grid-column: 2;
}

    .device-model-list-toolbar-search .dataTables_filter,
    .device-model-list-toolbar-search .dataTables_filter > label {
        width: 100%;
        margin: 0;
        display: block;
        text-align: right;
    }

.device-model-list-sorting {
    min-height: 40px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    color: #ffffff;
}

.device-model-list-card-body {
    padding-top: 1rem;
}

@media (max-width: 991.98px) {
    .device-model-list-toolbar {
        min-height: 62px;
        padding: 10px 12px;
    }

    .device-model-list-toolbar-row {
        grid-template-columns: auto minmax(0, 1fr);
        gap: 10px;
    }

    .device-model-list-toolbar-search {
        grid-column: 2;
    }
}

@media (max-width: 575.98px) {
    .device-model-list-toolbar {
        padding: 9px 10px;
    }
}

.cx-r1-devicemodel-addedit .cx-modal-layout-v21 {
    width: 100%;
    display: grid;
    gap: 22px;
}

.cx-r1-devicemodel-addedit .cx-r1-section {
    min-width: 0;
    margin: 0;
    padding: .85rem .95rem .95rem;
    border: 1px solid #d7e1ea;
    border-radius: 12px;
    background: #ffffff;
    box-shadow: 0 4px 14px rgba(35, 60, 85, .045);
}

.cx-r1-devicemodel-addedit .cx-r1-section-title {
    max-width: calc(100% - 1rem);
    display: inline-flex;
    align-items: center;
    gap: .55rem;
    margin: 0 0 .15rem;
    padding: 0 .45rem;
    color: #2c4c6c;
    font-size: .92rem;
    font-weight: 800;
    line-height: 1.35;
}

.cx-r1-devicemodel-addedit .cx-r1-section-icon {
    width: 28px;
    height: 28px;
    min-width: 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    background: #edf3f8;
    color: #3d6287;
    font-size: .78rem;
}

.cx-r1-devicemodel-addedit .cx-r1-section-description {
    display: flex;
    align-items: flex-start;
    gap: .45rem;
    margin: .1rem 0 .75rem;
    color: #687787;
    font-size: .82rem;
    line-height: 1.5;
}

    .cx-r1-devicemodel-addedit .cx-r1-section-description > i {
        margin-top: .22rem;
        color: #6d88a2;
        font-size: .72rem;
    }

.cx-r1-devicemodel-addedit .cx-r1-form-row {
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(175px, 225px) minmax(0, 1fr);
    align-items: start;
    gap: .45rem .9rem;
    margin: 0 0 .75rem;
}

    .cx-r1-devicemodel-addedit .cx-r1-form-row:last-child {
        margin-bottom: 0;
    }

    .cx-r1-devicemodel-addedit .cx-r1-form-row > [class*="col-"] {
        width: auto;
        max-width: none;
        min-width: 0;
        margin: 0;
        padding: 0;
    }

    .cx-r1-devicemodel-addedit .cx-r1-form-row > .form-label {
        padding-top: .62rem;
        text-align: right !important;
    }

.cx-r1-devicemodel-addedit .form-label > label:not(.custom-switch),
.cx-r1-devicemodel-addedit label[aspfor] {
    color: #52677a;
    font-size: .72rem;
    font-weight: 800;
    letter-spacing: .045em;
    line-height: 1.35;
    text-transform: uppercase;
}

    .cx-r1-devicemodel-addedit .form-label > label:not(.custom-switch)::after,
    .cx-r1-devicemodel-addedit label[aspfor]::after {
        content: ":";
    }

.cx-r1-devicemodel-addedit input.form-control,
.cx-r1-devicemodel-addedit select.form-control,
.cx-r1-devicemodel-addedit textarea.form-control {
    width: 100%;
    min-width: 0;
    border-color: #cfd9e3;
    border-radius: 8px;
    box-shadow: none;
}

.cx-r1-devicemodel-addedit textarea.form-control,
.cx-r1-devicemodel-addedit .cx-dialog-textarea {
    width: 100%;
    height: 132px;
    min-height: 84px !important;
    max-height: none !important;
    resize: both !important;
    overflow: auto !important;
}

.cx-r1-devicemodel-addedit input:disabled,
.cx-r1-devicemodel-addedit select:disabled,
.cx-r1-devicemodel-addedit textarea:disabled {
    background: #f3f6f8;
    color: #526170;
    opacity: 1;
}

@media (max-width: 767.98px) {
    .cx-r1-devicemodel-addedit .cx-r1-section {
        padding: .85rem;
    }

    .cx-r1-devicemodel-addedit .cx-r1-form-row {
        grid-template-columns: minmax(0, 1fr);
        gap: .35rem;
        margin-bottom: .85rem;
    }

        .cx-r1-devicemodel-addedit .cx-r1-form-row > .form-label {
            padding-top: 0;
            text-align: left !important;
        }

    .cx-r1-devicemodel-addedit .cx-r1-section-description {
        margin-bottom: .8rem;
    }
}

.mud-dialog.cx-r1-devicemodel-addedit,
.cx-r1-devicemodel-addedit {
    width: min(1120px, calc(100vw - 32px)) !important;
    max-width: min(1120px, calc(100vw - 32px)) !important;
    max-height: min(88dvh, 920px) !important;
}

    .cx-r1-devicemodel-addedit .cx-dialog-v17-content {
        padding: 18px 20px !important;
        overflow-x: hidden !important;
        scroll-padding-bottom: 88px;
    }

    .cx-r1-devicemodel-addedit .cx-devicemodel-alert-settings {
        min-width: 0;
        margin-top: 18px;
        padding-top: 16px;
        border-top: 1px solid #e1e7ee;
    }

    .cx-r1-devicemodel-addedit .cx-devicemodel-alert-settings-heading h3 {
        margin: 0;
        color: #2c4c6c;
        font-size: 1rem;
        font-weight: 800;
    }

    .cx-r1-devicemodel-addedit .cx-devicemodel-alert-settings-heading p {
        max-width: 760px;
        margin: 6px 0 14px;
        color: #667585;
        font-size: .86rem;
        line-height: 1.55;
    }

    .cx-r1-devicemodel-addedit .cx-devicemodel-alert-table-shell {
        width: 100%;
        max-width: 100%;
        overflow-x: auto;
        border: 1px solid #d7e1ea;
        border-radius: 10px;
        background: #ffffff;
        scrollbar-width: thin;
        -webkit-overflow-scrolling: touch;
    }

    .cx-r1-devicemodel-addedit .cx-devicemodel-alert-table {
        width: 100%;
        min-width: 620px;
        border-collapse: collapse;
        table-layout: fixed;
    }

        .cx-r1-devicemodel-addedit .cx-devicemodel-alert-table th,
        .cx-r1-devicemodel-addedit .cx-devicemodel-alert-table td {
            padding: 12px 14px;
            border-bottom: 1px solid #e4eaf0;
            color: #2f4760;
            text-align: left;
            vertical-align: middle;
        }

        .cx-r1-devicemodel-addedit .cx-devicemodel-alert-table th {
            background: #edf3f0;
            color: #2c4c6c;
            font-size: .78rem;
            font-weight: 800;
            letter-spacing: .025em;
            text-transform: uppercase;
        }

            .cx-r1-devicemodel-addedit .cx-devicemodel-alert-table th:first-child,
            .cx-r1-devicemodel-addedit .cx-devicemodel-alert-table td:first-child {
                width: 150px;
                text-align: center;
            }

    .cx-r1-devicemodel-addedit
    .cx-devicemodel-alert-table
    .cx-r18-108-answerable-header
    .cx-table-column-header__layout {
        gap: 20px !important;
    }

    .cx-r1-devicemodel-addedit .cx-devicemodel-alert-default-column {
        width: 150px;
        text-align: center !important;
    }

    .cx-r1-devicemodel-addedit .cx-devicemodel-alert-table tbody tr:last-child td {
        border-bottom: 0;
    }

    .cx-r1-devicemodel-addedit .cx-devicemodel-alert-table tbody tr:hover {
        background: #f8fbfd;
    }

    .cx-r1-devicemodel-addedit .cx-devicemodel-alert-table input[type="checkbox"],
    .cx-r1-devicemodel-addedit .cx-devicemodel-alert-table input[type="radio"] {
        width: 20px;
        height: 20px;
        margin: 0;
        accent-color: #3e6a99;
        cursor: pointer;
    }

    .cx-r1-devicemodel-addedit .cx-devicemodel-alert-name {
        display: block;
        overflow-wrap: anywhere;
        font-weight: 650;
    }

@media (max-width: 767.98px) {
    .mud-dialog.cx-r1-devicemodel-addedit,
    .cx-r1-devicemodel-addedit {
        width: calc(100vw - 14px) !important;
        max-width: calc(100vw - 14px) !important;
        max-height: calc(100dvh - 14px) !important;
    }

        .cx-r1-devicemodel-addedit .cx-dialog-v17-content {
            padding: 12px !important;
        }
}

.cx-r1-devicemodel-addedit .cx-modal-layout-v21,
.cx-r1-devicemodel-addedit form.cx-dialog-v17-form {
    display: grid;
    gap: 22px;
}

.cx-r1-devicemodel-addedit .cx-r1-section + .cx-r1-section,
.cx-r1-devicemodel-addedit fieldset + fieldset {
    margin-top: 0;
}

@media (max-width: 767.98px) {
    .cx-r1-devicemodel-addedit .cx-modal-layout-v21,
    .cx-r1-devicemodel-addedit form.cx-dialog-v17-form {
        gap: 16px;
    }
}

.conexgo-notification-overlay {
    position: fixed;
    inset: 0;
    z-index: 99998;
    background: rgba(15, 23, 42, .42);
    backdrop-filter: blur(4px);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 18px;
}

.conexgo-notification-modal {
    width: 100%;
    max-width: 510px;
    background: #ffffff;
    border-radius: 18px;
    border: 1px solid #e3e8ef;
    box-shadow: 0 24px 70px rgba(15, 23, 42, .26);
    overflow: hidden;
    animation: conexgoNotificationIn .18s ease-out;
}

.conexgo-notification-header {
    min-height: 74px;
    padding: 18px 20px 0 20px;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
}

.conexgo-notification-icon {
    width: 48px;
    height: 48px;
    border-radius: 15px;
    background: #edf5f3;
    color: #3f6f68;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 17pt;
}

.conexgo-notification-close {
    width: 34px;
    height: 34px;
    border: 0;
    border-radius: 999px;
    background: #f1f5f9;
    color: #6c757d;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
}

    .conexgo-notification-close:hover {
        background: #e5ebf2;
        color: #2c4c6c;
    }

.conexgo-notification-content {
    padding: 8px 24px 20px 24px;
}

.conexgo-notification-kicker {
    color: #3f6f68;
    font-size: 8.5pt;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .08em;
    margin-bottom: 8px;
}

.conexgo-notification-title {
    margin: 0;
    color: #172b3f;
    font-size: 17pt;
    font-weight: 800;
    line-height: 1.25;
}

.conexgo-notification-description {
    margin: 10px 0 0 0;
    color: #5f6b7a;
    font-size: 10pt;
    line-height: 1.55;
}

.conexgo-notification-result {
    min-height: 110px;
    padding: 16px;
    display: flex;
    align-items: center;
    gap: 14px;
    border: 1px solid #d7e2ea;
    border-radius: 13px;
    background: #f8fafc;
}

    .conexgo-notification-result.is-enabled {
        border-color: #b9d9c4;
        background: #f1f8f3;
    }

    .conexgo-notification-result.is-disabled {
        border-color: #e6c4c9;
        background: #fff5f6;
    }

.conexgo-notification-result-icon {
    width: 48px;
    height: 48px;
    flex: 0 0 48px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    background: #ffffff;
    color: #3f6f68;
    box-shadow: 0 2px 8px rgba(15, 23, 42, .09);
}

.conexgo-notification-list {
    margin-top: 18px;
    display: flex;
    flex-direction: column;
    gap: 9px;
}

.conexgo-notification-list-item {
    min-height: 42px;
    padding: 10px 12px;
    border: 1px solid #edf1f5;
    border-radius: 11px;
    background: #f8fafc;
    display: flex;
    align-items: center;
    gap: 10px;
    color: #334155;
    font-size: 9.5pt;
    font-weight: 600;
}

.conexgo-notification-list-icon {
    width: 28px;
    height: 28px;
    border-radius: 999px;
    background: #ffffff;
    color: #3f6f68;
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 28px;
    box-shadow: 0 1px 3px rgba(15, 23, 42, .08);
}

.conexgo-notification-actions {
    padding: 16px 20px 20px 20px;
    background: #f8fafc;
    border-top: 1px solid #edf1f5;
    display: flex;
    justify-content: flex-end;
    gap: 10px;
}

.conexgo-notification-secondary {
    height: 40px;
    padding: 0 16px;
    border-radius: 10px;
    background: #ffffff;
    border: 1px solid #d8e1ea;
    color: #475569;
    font-size: 9.5pt;
    font-weight: 700;
    box-shadow: none;
}

    .conexgo-notification-secondary:hover {
        background: #f1f5f9;
        color: #2c4c6c;
    }

.conexgo-notification-primary {
    height: 40px;
    padding: 0 18px;
    border-radius: 10px;
    background: #3f6f68;
    border: 1px solid #3f6f68;
    color: #ffffff;
    font-size: 9.5pt;
    font-weight: 800;
    box-shadow: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}

    .conexgo-notification-primary:hover {
        background: #345f59;
        border-color: #345f59;
        color: #ffffff;
    }

    .conexgo-notification-primary:disabled,
    .conexgo-notification-secondary:disabled {
        opacity: .75;
        cursor: wait;
    }

@keyframes conexgoNotificationIn {
    from {
        opacity: 0;
        transform: translateY(8px) scale(.98);
    }

    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

@media (max-width: 576px) {
    .conexgo-notification-overlay {
        align-items: flex-end;
        padding: 12px;
    }

    .conexgo-notification-modal {
        max-width: none;
        border-radius: 16px;
    }

    .conexgo-notification-actions {
        flex-direction: column-reverse;
    }

    .conexgo-notification-primary,
    .conexgo-notification-secondary {
        width: 100%;
    }
}

@media (max-width: 767.98px) {
    .conexgo-header-profile .conexgo-profile-dropdown {
        position: fixed !important;
        top: 76px !important;
        left: 10px !important;
        right: 10px !important;
        width: auto !important;
        min-width: 0 !important;
        max-width: none !important;
        max-height: calc(100dvh - 160px) !important;
        overflow-y: auto !important;
        transform: none !important;
    }

        .conexgo-header-profile .conexgo-profile-dropdown .dropdown-item {
            min-height: 44px;
            font-size: .9rem;
        }
}

.change-password-modal {
    background: #ffffff;
    border-radius: 6px;
    overflow: hidden;
}

.change-password-header {
    padding: 14px 18px;
    background: #2c4c6c;
    color: #ffffff;
}

.change-password-title-zone {
    display: flex;
    align-items: center;
    gap: 10px;
}

.change-password-icon {
    width: 34px;
    height: 34px;
    border-radius: 50%;
    background: rgba(255, 255, 255, .14);
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 34px;
    color: #ffffff;
}

.change-password-title {
    margin: 0;
    color: #ffffff;
    font-size: 12pt;
    font-weight: 700;
    line-height: 1.2;
}

.change-password-subtitle {
    margin-top: 2px;
    color: rgba(255, 255, 255, .78);
    font-size: 9pt;
    line-height: 1.35;
}

.change-password-body {
    padding: 18px;
    background: #ffffff;
}

    .change-password-body .row {
        margin-bottom: 14px;
    }

        .change-password-body .row:last-child {
            margin-bottom: 0;
        }

.change-password-note {
    margin-bottom: 16px;
    padding: 11px 12px;
    border: 1px solid #dfe7ef;
    border-radius: 6px;
    background: #f8fafc;
    color: #5f6b7a;
    font-size: 9.3pt;
    line-height: 1.45;
    display: flex;
    align-items: flex-start;
    gap: 8px;
}

    .change-password-note i {
        color: #2c4c6c;
        margin-top: 2px;
        flex: 0 0 auto;
    }

.change-password-actions {
    padding: 12px 18px 14px 18px;
    background: #f8fafc;
    border-top: 1px solid #edf0f2;
    display: flex;
    justify-content: flex-end;
    gap: 8px;
}

.change-password-loading {
    min-height: 220px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 12px;
    color: #6c757d;
    background: #ffffff;
    border-radius: 6px;
}

.change-password-loading-text {
    font-size: 9.5pt;
    font-weight: 600;
}

.validation-message {
    margin-top: 6px;
    color: #b45353;
    font-size: 8.7pt;
    font-weight: 600;
}

.conexgo-blue-button.mud-button-root {
    background-color: #2c4c6c !important;
    border: 1px solid #2c4c6c !important;
    color: #ffffff !important;
    min-height: 38px;
    min-width: 120px;
    padding: 0 16px;
    border-radius: 4px;
    font-size: 9.5pt;
    font-weight: 600;
    box-shadow: none !important;
    text-transform: none !important;
}

    .conexgo-blue-button.mud-button-root:hover {
        background-color: #2c4c6c !important;
        border-color: #2c4c6c !important;
        color: #ffffff !important;
        box-shadow: none !important;
        transform: none !important;
    }

.conexgo-outline-blue-button.mud-button-root {
    background-color: #ffffff !important;
    border: 1px solid #c8d3df !important;
    color: #2c4c6c !important;
    min-height: 38px;
    min-width: 110px;
    padding: 0 16px;
    border-radius: 4px;
    font-size: 9.5pt;
    font-weight: 600;
    box-shadow: none !important;
    text-transform: none !important;
}

    .conexgo-outline-blue-button.mud-button-root:hover {
        background-color: #ffffff !important;
        border-color: #c8d3df !important;
        color: #2c4c6c !important;
        box-shadow: none !important;
        transform: none !important;
    }

    .conexgo-blue-button.mud-button-root:disabled,
    .conexgo-outline-blue-button.mud-button-root:disabled {
        opacity: .65;
        cursor: wait;
    }

@media (max-width: 576px) {
    .change-password-body {
        padding: 16px;
    }

    .change-password-actions {
        flex-direction: row;
        flex-wrap: nowrap;
        justify-content: flex-end;
    }

        .change-password-actions .mud-button-root {
            width: auto;
            min-width: 38px;
        }
}

.conexgo-simple-modal {
    background: #ffffff;
    border-radius: 6px;
    overflow: hidden;
}

.conexgo-simple-header {
    padding: 14px 18px;
    background: #2c4c6c;
    color: #ffffff;
}

.conexgo-simple-title-zone {
    display: flex;
    align-items: center;
    gap: 10px;
}

.conexgo-simple-icon {
    width: 34px;
    height: 34px;
    border-radius: 50%;
    background: rgba(255, 255, 255, .14);
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 34px;
    color: #ffffff;
}

.conexgo-simple-title {
    margin: 0;
    color: #ffffff;
    font-size: 12pt;
    font-weight: 700;
    line-height: 1.2;
}

.conexgo-simple-subtitle {
    margin-top: 2px;
    color: rgba(255, 255, 255, .78);
    font-size: 9pt;
    line-height: 1.35;
}

.conexgo-simple-body {
    padding: 18px;
    background: #ffffff;
}

.conexgo-simple-field {
    padding-top: 4px;
}

.conexgo-simple-help {
    color: #5f6b7a;
    font-size: 9.3pt;
    line-height: 1.5;
}

.conexgo-simple-actions {
    padding: 12px 18px 14px 18px;
    background: #f8fafc;
    border-top: 1px solid #edf0f2;
    display: flex;
    justify-content: flex-end;
    gap: 8px;
}

.conexgo-simple-loading {
    min-height: 220px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 12px;
    color: #6c757d;
    background: #ffffff;
    border-radius: 6px;
}

.conexgo-simple-loading-text {
    font-size: 9.5pt;
    font-weight: 600;
}

.validation-message {
    margin-top: 6px;
    color: #b45353;
    font-size: 8.7pt;
    font-weight: 600;
}

.conexgo-blue-button.mud-button-root {
    background-color: #2c4c6c !important;
    border: 1px solid #2c4c6c !important;
    color: #ffffff !important;
    min-height: 38px;
    min-width: 120px;
    padding: 0 16px;
    border-radius: 4px;
    font-size: 9.5pt;
    font-weight: 600;
    box-shadow: none !important;
    text-transform: none !important;
}

    .conexgo-blue-button.mud-button-root:hover {
        background-color: #2c4c6c !important;
        border-color: #2c4c6c !important;
        color: #ffffff !important;
        box-shadow: none !important;
        transform: none !important;
    }

.conexgo-outline-blue-button.mud-button-root {
    background-color: #ffffff !important;
    border: 1px solid #c8d3df !important;
    color: #2c4c6c !important;
    min-height: 38px;
    min-width: 110px;
    padding: 0 16px;
    border-radius: 4px;
    font-size: 9.5pt;
    font-weight: 600;
    box-shadow: none !important;
    text-transform: none !important;
}

    .conexgo-outline-blue-button.mud-button-root:hover {
        background-color: #ffffff !important;
        border-color: #c8d3df !important;
        color: #2c4c6c !important;
        box-shadow: none !important;
        transform: none !important;
    }

    .conexgo-blue-button.mud-button-root:disabled,
    .conexgo-outline-blue-button.mud-button-root:disabled {
        opacity: .65;
        cursor: wait;
    }

@media (max-width: 576px) {
    .conexgo-simple-actions {
        flex-direction: row;
        flex-wrap: nowrap;
        justify-content: flex-end;
    }

        .conexgo-simple-actions .mud-button-root {
            width: auto;
            min-width: 38px;
        }
}

.about-page {
    --about-primary: #2c4c6c;
    --about-secondary: #3E6A99;
    --about-surface: #ffffff;
    --about-soft: #EEF2F7;
    --about-border: #D9E2EC;
    --about-text: #26384A;
    --about-muted: #6B7C8F;
}

.about-shell {
    border: 1px solid var(--about-border);
    border-radius: 8px;
    background: var(--about-surface);
    overflow: hidden;
}

.about-hero {
    padding: 26px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 24px;
    background: var(--about-primary);
    color: #ffffff;
}

.about-hero-main {
    min-width: 0;
}

.about-kicker {
    margin-bottom: 8px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #D9E5F1;
    font-size: 8.5pt;
    font-weight: 700;
    letter-spacing: .7px;
    text-transform: uppercase;
}

    .about-kicker i {
        font-size: 10pt;
    }

.about-hero-title {
    margin: 0;
    color: #ffffff;
    font-size: clamp(20px, 2.4vw, 30px);
    font-weight: 800;
    line-height: 1.15;
}

.about-hero-summary {
    max-width: 850px;
    margin: 10px 0 0;
    color: #E8EEF5;
    font-size: 10pt;
    line-height: 1.65;
}

.about-version-panel {
    min-width: 190px;
    padding: 18px 20px;
    border: 1px solid rgba(255, 255, 255, .22);
    border-radius: 8px;
    background: rgba(255, 255, 255, .08);
    text-align: right;
}

.about-version-label {
    display: block;
    color: #C9D7E5;
    font-size: 8pt;
    font-weight: 700;
    letter-spacing: .55px;
    text-transform: uppercase;
}

.about-version-number {
    display: block;
    margin-top: 5px;
    color: #ffffff;
    font-size: 21pt;
    font-weight: 800;
    font-variant-numeric: tabular-nums;
}

.about-version-date {
    display: block;
    margin-top: 6px;
    color: #DCE6EF;
    font-size: 8.7pt;
    font-weight: 600;
}

.about-latest {
    padding: 24px 26px 28px;
    border-bottom: 1px solid var(--about-border);
    background: #F8FAFC;
}

.about-section-heading {
    margin-bottom: 16px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
}

    .about-section-heading h2 {
        margin: 0;
        color: var(--about-primary);
        font-size: 14pt;
        font-weight: 800;
    }

.about-major-badge {
    padding: 6px 10px;
    border: 1px solid #CCD9E6;
    border-radius: 6px;
    background: #ffffff;
    color: var(--about-secondary);
    font-size: 8pt;
    font-weight: 800;
    letter-spacing: .25px;
    text-transform: uppercase;
}

.about-feature-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px 14px;
}

.about-feature {
    min-width: 0;
    padding: 12px 13px;
    display: flex;
    align-items: flex-start;
    gap: 10px;
    border: 1px solid #E1E7EE;
    border-radius: 7px;
    background: #ffffff;
    color: var(--about-text);
    font-size: 9pt;
    line-height: 1.45;
}

    .about-feature i {
        margin-top: 2px;
        color: var(--about-secondary);
        font-size: 9pt;
        flex: 0 0 auto;
    }

.about-history {
    padding: 24px 26px 30px;
}

.about-history-header {
    margin-bottom: 18px;
}

    .about-history-header h2 {
        margin: 0;
        color: var(--about-primary);
        font-size: 14pt;
        font-weight: 800;
    }

    .about-history-header p {
        margin: 5px 0 0;
        color: var(--about-muted);
        font-size: 9pt;
    }

.about-timeline {
    position: relative;
    margin: 0;
    padding: 0;
    list-style: none;
}

    .about-timeline::before {
        content: "";
        position: absolute;
        top: 6px;
        bottom: 6px;
        left: 116px;
        width: 1px;
        background: #DCE4EC;
    }

.about-release {
    position: relative;
    display: grid;
    grid-template-columns: 96px 1fr;
    gap: 32px;
    padding: 0 0 18px;
}

    .about-release:last-child {
        padding-bottom: 0;
    }

.about-release-date {
    padding-top: 14px;
    color: var(--about-muted);
    font-size: 8.5pt;
    font-weight: 700;
    line-height: 1.3;
    text-align: right;
}

.about-release-marker {
    width: 11px;
    height: 11px;
    position: absolute;
    top: 17px;
    left: 111px;
    border: 2px solid #ffffff;
    border-radius: 999px;
    background: var(--about-secondary);
    box-shadow: 0 0 0 1px #B9C8D8;
}

.about-release-card {
    padding: 15px 17px;
    border: 1px solid #E0E6ED;
    border-radius: 7px;
    background: #ffffff;
}

.about-release-title {
    margin: 0;
    color: var(--about-primary);
    font-size: 11pt;
    font-weight: 800;
    font-variant-numeric: tabular-nums;
}

.about-release-summary {
    margin: 7px 0 0;
    color: var(--about-muted);
    font-size: 9pt;
    line-height: 1.5;
}

.about-release-items {
    margin: 10px 0 0;
    padding: 0;
    list-style: none;
}

    .about-release-items li {
        position: relative;
        padding: 5px 0 5px 17px;
        color: var(--about-text);
        font-size: 8.8pt;
        line-height: 1.48;
    }

        .about-release-items li::before {
            content: "";
            width: 5px;
            height: 5px;
            position: absolute;
            top: 11px;
            left: 0;
            border-radius: 999px;
            background: #7E96AF;
        }

.about-empty {
    padding: 28px;
    color: var(--about-muted);
    text-align: center;
}

@media (max-width: 991.98px) {
    .about-hero {
        grid-template-columns: 1fr;
    }

    .about-version-panel {
        width: 100%;
        min-width: 0;
        text-align: left;
    }

    .about-feature-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 767.98px) {
    .about-hero,
    .about-latest,
    .about-history {
        padding-left: 16px;
        padding-right: 16px;
    }

    .about-timeline::before {
        left: 5px;
    }

    .about-release {
        grid-template-columns: 1fr;
        gap: 7px;
        padding-left: 22px;
    }

    .about-release-date {
        padding-top: 0;
        text-align: left;
    }

    .about-release-marker {
        top: 5px;
        left: 0;
    }
}

@media (max-width: 575.98px) {
    .about-hero {
        padding-top: 20px;
        padding-bottom: 20px;
    }

    .about-section-heading {
        align-items: flex-start;
        flex-direction: column;
    }

    .about-release-card {
        padding: 13px 14px;
    }
}

.conexgo-support-page {
    overflow: hidden;
    border: 1px solid #dfe6ed;
    border-radius: 10px;
    background: #ffffff;
    box-shadow: 0 4px 16px rgba(44, 76, 108, .07);
}

    .conexgo-support-page > .card-header {
        min-height: 62px;
        display: flex;
        align-items: center;
    }

    .conexgo-support-page > .card-body {
        padding: 22px;
    }

    .conexgo-support-page .container {
        width: 100%;
        max-width: none;
        padding: 0;
    }

    .conexgo-support-page .row-sm {
        row-gap: 16px;
    }

    .conexgo-support-page .panel .card {
        height: 100%;
        margin: 0;
        border: 1px solid #e1e8ef;
        border-radius: 9px;
        background: #ffffff;
        box-shadow: 0 2px 8px rgba(44, 76, 108, .05);
        transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease, background-color .18s ease;
    }

        .conexgo-support-page .panel .card:hover,
        .conexgo-support-page .panel .card:focus-within {
            transform: translateY(-2px);
            border-color: #c9d7e3;
            background: #fbfdff;
            box-shadow: 0 8px 20px rgba(44, 76, 108, .10);
        }

    .conexgo-support-page .panel .card-body {
        min-height: 112px;
        padding: 18px 20px;
        display: flex;
        align-items: center;
    }

        .conexgo-support-page .panel .card-body > .row {
            width: 100%;
            align-items: center;
            margin: 0;
        }

        .conexgo-support-page .panel .card-body [class*="col-"] {
            padding-top: 0 !important;
        }

    .conexgo-support-page .settings-icon {
        width: 52px;
        height: 52px;
        margin: 0 !important;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        border-radius: 10px;
        font-size: 17pt;
    }

    .conexgo-support-page .panel a {
        color: #243b57;
        text-decoration: none;
    }

        .conexgo-support-page .panel a:hover,
        .conexgo-support-page .panel a:focus-visible {
            color: #2c4c6c;
            outline: none;
        }

    .conexgo-support-page .panel h4 {
        margin: 0 !important;
        color: inherit !important;
        font-size: 12pt;
        font-weight: 750;
    }

@media (max-width: 767.98px) {
    .conexgo-support-page > .card-body {
        padding: 14px;
    }

    .conexgo-support-page .panel .card-body {
        min-height: 96px;
        padding: 14px;
    }

    .conexgo-support-page .settings-icon {
        width: 46px;
        height: 46px;
        font-size: 15pt;
    }
}

@media (prefers-reduced-motion: reduce) {
    .conexgo-support-page .panel .card {
        transition: none !important;
    }
}

.cx-shared-form-label {
    display: inline-flex;
    align-items: center;
    min-height: 24px;
    color: #2f3d4f;
    font-size: 13px;
    font-weight: 700;
    line-height: 1.35;
    margin: 0;
}

@media (max-width: 767.98px) {
    .cx-shared-form-label {
        font-size: 13.5px;
    }
}

.conexgo-header-language .conexgo-header-language-field {
    width: 100%;
    margin: 0;
}

.conexgo-header-language .conexgo-header-language-select {
    width: 100%;
    min-height: 42px;
    border-radius: 8px;
    border-color: #cfd9e3;
    background: #ffffff;
    color: #2c4c6c;
    font-size: 9.5pt;
    font-weight: 700;
    box-shadow: none;
}

    .conexgo-header-language .conexgo-header-language-select:hover {
        border-color: #9eb5c9;
        background: #f8fbfd;
    }

    .conexgo-header-language .conexgo-header-language-select:focus-visible,
    .conexgo-header-language .conexgo-header-language-select.is-open {
        border-color: #3e6a99;
        box-shadow: 0 0 0 3px rgba(62, 106, 153, .14);
    }

.conexgo-header-language-menu {
    min-width: 210px;
}

.conexgo-search-wrapper {
    width: auto;
    max-width: 100%;
    min-width: 0;
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    gap: 7px;
    vertical-align: middle;
}

.conexgo-search-field {
    position: relative;
    width: 255px;
    min-width: 210px;
    height: 42px;
}

.conexgo-search-leading-icon {
    position: absolute;
    left: 7px;
    top: 50%;
    width: 28px;
    height: 28px;
    transform: translateY(-50%);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 5px;
    background: #f1f4f8;
    color: #65768a;
    font-size: 8.8pt;
    pointer-events: none;
    z-index: 2;
}

.conexgo-search-input {
    width: 100%;
    height: 42px;
    padding: 0 38px 0 43px;
    border: 1px solid #d8e0ea;
    border-radius: 6px;
    background: #ffffff;
    color: #2c3e50;
    font-size: 9.3pt;
    font-weight: 500;
    line-height: 42px;
    box-shadow: none !important;
    outline: none;
    transition: border-color .15s ease, box-shadow .15s ease;
}

    .conexgo-search-input::placeholder {
        color: #8b98a7;
        opacity: 1;
    }

    .conexgo-search-input:focus {
        border-color: #a7b3c2;
        background: #ffffff;
        box-shadow: 0 0 0 2px rgba(62, 106, 153, .12) !important;
    }

        .conexgo-search-input:focus + .conexgo-search-clear {
            color: #66778a;
        }

.conexgo-search-clear {
    position: absolute;
    right: 8px;
    top: 50%;
    width: 26px;
    height: 26px;
    transform: translateY(-50%);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    border: 0;
    border-radius: 5px;
    background: transparent;
    color: #8a97a6;
    font-size: 10pt;
    line-height: 1;
    box-shadow: none;
}

    .conexgo-search-clear:hover,
    .conexgo-search-clear:focus,
    .conexgo-search-clear:active {
        background: #eef2f6;
        color: #2c4c6c;
        outline: none;
        box-shadow: none;
        transform: translateY(-50%);
    }

.conexgo-search-button {
    min-width: 104px;
    height: 42px;
    padding: 0 15px;
    display: inline-grid;
    grid-auto-flow: column;
    place-items: center;
    align-content: center;
    justify-content: center;
    gap: 7px;
    border: 1px solid #8493a3;
    border-radius: 6px;
    background: #8493a3;
    color: #ffffff;
    font-size: 9.3pt;
    font-weight: 700;
    white-space: nowrap;
    box-shadow: none;
    transition: none;
}

    .conexgo-search-button:hover,
    .conexgo-search-button:focus,
    .conexgo-search-button:active {
        border-color: #8493a3;
        background: #8493a3;
        color: #ffffff;
        outline: none;
        box-shadow: none;
        transform: none;
    }

    .conexgo-search-button:disabled {
        border-color: #8493a3;
        background: #8493a3;
        color: #ffffff;
        opacity: .9;
        cursor: default;
    }

.conexgo-search-button-icon {
    width: 16px;
    height: 16px;
    margin: 0;
    display: inline-grid;
    place-items: center;
    color: #ffffff;
    font-size: 14px;
    line-height: 1;
    flex: 0 0 16px;
}

.conexgo-search-spinner {
    width: 15px;
    height: 15px;
    display: inline-block;
    border: 2px solid rgba(255, 255, 255, .38);
    border-top-color: #ffffff;
    border-radius: 50%;
    animation: conexgo-search-spin .8s linear infinite;
    flex: 0 0 auto;
}

@keyframes conexgo-search-spin {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }
}

@media (max-width: 991.98px) {
    .conexgo-search-wrapper {
        width: 100%;
        display: flex;
    }

    .conexgo-search-field {
        width: auto;
        min-width: 0;
        flex: 1 1 auto;
    }

    .conexgo-search-button {
        min-width: 100px;
        padding-left: 12px;
        padding-right: 12px;
        flex: 0 0 auto;
    }
}

@media (max-width: 767.98px) {
    .conexgo-search-wrapper {
        width: 100%;
        min-width: 0;
        display: grid;
        grid-template-columns: minmax(0, 1fr) 40px;
        align-items: center;
        gap: 7px;
    }

    .conexgo-search-field {
        width: 100%;
        min-width: 0;
        height: 40px;
    }

    .conexgo-search-input {
        height: 40px;
        min-height: 40px;
        padding-right: 36px;
        font-size: 16px;
        line-height: 40px;
    }

    .conexgo-search-leading-icon {
        width: 28px;
        height: 28px;
    }

    .conexgo-search-button {
        width: 40px;
        height: 40px;
        min-width: 40px;
        min-height: 40px;
        max-width: 40px;
        padding: 0;
        display: inline-grid;
        place-items: center;
        align-content: center;
        justify-content: center;
        gap: 0;
        line-height: 1;
    }

    .conexgo-search-button-icon {
        margin: 0;
        font-size: 14px;
        line-height: 1;
    }

    .conexgo-search-button-label {
        position: absolute;
        width: 1px;
        height: 1px;
        margin: -1px;
        overflow: hidden;
        clip: rect(0, 0, 0, 0);
        white-space: nowrap;
        border: 0;
    }
}

.cx-access-denied {
    width: min(100%, 760px);
    min-height: 330px;
    margin: clamp(28px, 8vh, 90px) auto;
    padding: clamp(24px, 4vw, 44px);
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: start;
    gap: 22px;
    border: 1px solid #d7e1ea;
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 18px 45px rgba(35, 60, 85, .1);
}

.cx-access-denied__icon {
    width: 64px;
    height: 64px;
    display: grid;
    place-items: center;
    border-radius: 18px;
    background: #edf4f9;
    color: #315879;
    font-size: 1.55rem;
}

.cx-access-denied__eyebrow {
    margin: 0 0 5px;
    color: #6d8194;
    font-size: .75rem;
    font-weight: 800;
    letter-spacing: .12em;
    text-transform: uppercase;
}

.cx-access-denied h1 {
    margin: 0 0 12px;
    color: #253f5c;
    font-size: clamp(1.55rem, 1.2rem + 1vw, 2.15rem);
    line-height: 1.15;
}

.cx-access-denied p:not(.cx-access-denied__eyebrow) {
    max-width: 58ch;
    margin: 0;
    color: #627487;
    line-height: 1.65;
}

.cx-access-denied__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 24px;
}

    .cx-access-denied__actions .btn {
        min-height: 42px;
        display: inline-flex;
        align-items: center;
        gap: 8px;
        border-radius: 9px;
        font-weight: 750;
    }

@media (max-width: 575.98px) {
    .cx-access-denied {
        min-height: 0;
        grid-template-columns: 1fr;
        margin: 20px auto;
        padding: 22px 18px;
    }

    .cx-access-denied__icon {
        width: 54px;
        height: 54px;
        border-radius: 15px;
    }

    .cx-access-denied__actions {
        flex-direction: column;
    }

        .cx-access-denied__actions .btn {
            width: 100%;
            justify-content: center;
        }
}

.cx-shared-form-row {
    display: grid;
    grid-template-columns: minmax(150px, 190px) minmax(0, 1fr);
    align-items: start;
    gap: 8px 16px;
    margin-bottom: 16px;
}

.cx-shared-form-label {
    min-height: 42px;
    display: flex;
    align-items: center;
    color: #2f3d4f;
    font-size: 13px;
    font-weight: 700;
    line-height: 1.35;
    margin: 0;
}

.cx-shared-form-control-zone {
    min-width: 0;
    width: 100%;
}

.cx-shared-checkbox-card {
    min-height: 42px;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 12px;
    border: 1px solid #d7e0e9;
    border-radius: 7px;
    background: #ffffff;
    box-shadow: none;
}

.cx-shared-checkbox {
    width: 18px;
    height: 18px;
    flex: 0 0 18px;
    margin: 0;
    cursor: pointer;
    border-color: #bcc9d6;
}

    .cx-shared-checkbox:checked {
        background-color: #2c4c6c;
        border-color: #2c4c6c;
    }

    .cx-shared-checkbox:focus {
        box-shadow: 0 0 0 3px rgba(61, 98, 135, .11);
    }

.cx-shared-checkbox-text {
    min-width: 0;
    color: #2f3d4f;
    font-size: 13px;
    font-weight: 600;
    line-height: 1.35;
    margin: 0;
    cursor: pointer;
    overflow-wrap: anywhere;
}

@media (max-width: 767.98px) {
    .cx-shared-form-row {
        grid-template-columns: minmax(0, 1fr);
        gap: 6px;
        margin-bottom: 14px;
    }

    .cx-shared-form-label {
        min-height: auto;
        font-size: 13.5px;
    }

    .cx-shared-checkbox-card {
        min-height: 44px;
    }

    .cx-shared-checkbox-text {
        font-size: 14px;
    }
}

.cx-column-not-sortable::before,
.cx-column-not-sortable::after {
    display: none !important;
    content: none !important;
}

.cx-confirm-dialog .mud-dialog-title::before,
.cx-confirm-dialog .dialog-background-title::before {
    width: 36px;
    height: 36px;
    min-width: 36px;
    display: inline-grid;
    place-items: center;
    border: 1px solid rgba(255, 255, 255, .22);
    border-radius: 9px;
    background: rgba(255, 255, 255, .10);
    color: #ffffff;
    font-family: "Font Awesome 6 Free";
    font-size: 15px;
    font-weight: 900;
    line-height: 1;
    content: "\f059";
}

.cx-confirm-dialog--danger .mud-dialog-title::before,
.cx-confirm-dialog--danger .dialog-background-title::before {
    content: "\f071";
}

.cx-confirm-dialog--warning .mud-dialog-title::before,
.cx-confirm-dialog--warning .dialog-background-title::before {
    content: "\f071";
}

.cx-confirm-dialog--success .mud-dialog-title::before,
.cx-confirm-dialog--success .dialog-background-title::before {
    content: "\f058";
}

.cx-confirm-dialog {
    width: min(560px, calc(100vw - 24px)) !important;
    max-width: min(560px, calc(100vw - 24px)) !important;
    border-radius: 14px !important;
    overflow: hidden;
}

.cx-confirm-dialog-content {
    padding: 26px !important;
}

.cx-confirm-dialog-body {
    display: grid;
    grid-template-columns: 52px minmax(0, 1fr);
    align-items: center;
    gap: 17px;
}

.cx-confirm-dialog-icon {
    width: 52px;
    height: 52px;
    display: inline-grid;
    place-items: center;
    border-radius: 13px;
    font-size: 20px;
}

.cx-confirm-dialog--danger .cx-confirm-dialog-icon {
    background: #f8e9eb;
    color: #a44952;
}

.cx-confirm-dialog--warning .cx-confirm-dialog-icon {
    background: #fff3dc;
    color: #a56b10;
}

.cx-confirm-dialog--success .cx-confirm-dialog-icon {
    background: #e8f3eb;
    color: #4f7b59;
}

.cx-confirm-dialog--primary .cx-confirm-dialog-icon {
    background: #e8f0f7;
    color: #31597f;
}

.cx-confirm-dialog-message {
    color: #344b66;
    font-size: 15.5px;
    line-height: 1.6;
    overflow-wrap: anywhere;
}

.cx-confirm-dialog-actions {
    padding: 14px 18px 18px !important;
    border-top: 1px solid #dbe3eb;
}

.cx-confirm-dialog-button {
    min-width: 132px !important;
    min-height: 42px !important;
    border-radius: 8px !important;
    font-weight: 800 !important;
}

    .cx-confirm-dialog-button .mud-button-label {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 8px !important;
    }

.cx-confirm-dialog-button--cancel {
    border-color: #c6d1dc !important;
    background: #ffffff !important;
    color: #566575 !important;
}

.cx-confirm-dialog-button--danger {
    border-color: #a44952 !important;
    background: #a44952 !important;
    color: #ffffff !important;
}

.cx-confirm-dialog-button--warning {
    border-color: #b27719 !important;
    background: #b27719 !important;
    color: #ffffff !important;
}

.cx-confirm-dialog-button--success {
    border-color: #5f8667 !important;
    background: #5f8667 !important;
    color: #ffffff !important;
}

.cx-confirm-dialog-button--primary {
    border-color: #3e6a99 !important;
    background: #3e6a99 !important;
    color: #ffffff !important;
}

.cx-confirm-dialog-button:hover {
    transform: translateY(-1px);
    box-shadow: 0 5px 12px rgba(31, 62, 91, .14) !important;
}

@media (max-width: 575.98px) {
    .cx-confirm-dialog-content {
        padding: 20px !important;
    }

    .cx-confirm-dialog-body {
        grid-template-columns: 42px minmax(0, 1fr);
        gap: 12px;
    }

    .cx-confirm-dialog-icon {
        width: 42px;
        height: 42px;
        border-radius: 10px;
        font-size: 17px;
    }

    .cx-confirm-dialog-button {
        width: 100% !important;
        min-width: 0 !important;
    }
}

.device-customer-access {
    width: 100%;
    min-width: 0;
    display: inline-grid;
    grid-template-columns: minmax(0, max-content);
    grid-template-rows: auto auto;
    justify-items: start;
    align-items: start;
    gap: 7px;
}

.device-customer-access-switch {
    margin: 0;
    flex: 0 0 auto;
}

.device-customer-access-copy {
    min-width: 0;
    display: inline-flex;
    align-items: baseline;
    flex-wrap: wrap;
    gap: 4px;
    padding-left: 1px;
    color: #2c4c6c;
    font-size: 12.5px;
    font-weight: 750;
    line-height: 1.3;
    white-space: normal;
    overflow-wrap: anywhere;
}

@media (max-width: 575.98px) {
    .device-customer-access {
        width: 100%;
        justify-content: flex-start;
    }

    .device-customer-access-copy {
        white-space: normal;
        overflow-wrap: normal;
        word-break: keep-all;
    }
}

.cx-shared-form-row {
    display: grid;
    grid-template-columns: minmax(150px, 190px) minmax(0, 1fr);
    align-items: start;
    gap: 8px 16px;
    margin-bottom: 16px;
}

.cx-shared-form-label {
    min-height: 42px;
    display: flex;
    align-items: center;
    color: #2f3d4f;
    font-size: 13px;
    font-weight: 700;
    line-height: 1.35;
    margin: 0;
}

.cx-shared-form-control-zone {
    min-width: 0;
    width: 100%;
}

.cx-shared-form-control {
    width: 100%;
    min-width: 0;
    min-height: 42px;
    border: 1px solid #d7e0e9;
    border-radius: 7px;
    background: #ffffff;
    color: #2f3d4f;
    font-size: 14px;
    font-weight: 500;
    line-height: 1.35;
    padding: 9px 12px;
    box-shadow: none;
    transition: border-color .12s ease, box-shadow .12s ease;
}

    .cx-shared-form-control::placeholder {
        color: #8794a4;
        font-weight: 500;
    }

    .cx-shared-form-control:hover {
        border-color: #bcc9d6;
        background: #ffffff;
    }

    .cx-shared-form-control:focus {
        border-color: #3d6287;
        box-shadow: 0 0 0 3px rgba(61, 98, 135, .11);
        background: #ffffff;
        outline: none;
    }

.cx-shared-field-helper {
    margin-top: 5px;
    color: #7b8794;
    font-size: 11.5px;
    font-weight: 600;
    line-height: 1.3;
    text-align: right;
}

@media (max-width: 767.98px) {
    .cx-shared-form-row {
        grid-template-columns: minmax(0, 1fr);
        gap: 6px;
        margin-bottom: 14px;
    }

    .cx-shared-form-label {
        min-height: auto;
        font-size: 13.5px;
    }

    .cx-shared-form-control {
        min-height: 44px;
        font-size: 16px;
        padding: 10px 12px;
    }
}

.cx-r1-document-addedit .cx-modal-layout-v21 {
    width: 100%;
    display: grid;
    gap: 22px;
}

.cx-r1-document-addedit .cx-r1-section {
    min-width: 0;
    margin: 0;
    padding: .85rem .95rem .95rem;
    border: 1px solid #d7e1ea;
    border-radius: 12px;
    background: #ffffff;
    box-shadow: 0 4px 14px rgba(35, 60, 85, .045);
}

.cx-r1-document-addedit .cx-r1-section-title {
    max-width: calc(100% - 1rem);
    display: inline-flex;
    align-items: center;
    gap: .55rem;
    margin: 0 0 .15rem;
    padding: 0 .45rem;
    color: #2c4c6c;
    font-size: .92rem;
    font-weight: 800;
    line-height: 1.35;
}

.cx-r1-document-addedit .cx-r1-section-icon {
    width: 28px;
    height: 28px;
    min-width: 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    background: #edf3f8;
    color: #3d6287;
    font-size: .78rem;
}

.cx-r1-document-addedit .cx-r1-section-description {
    display: flex;
    align-items: flex-start;
    gap: .45rem;
    margin: .1rem 0 .75rem;
    color: #687787;
    font-size: .82rem;
    line-height: 1.5;
}

    .cx-r1-document-addedit .cx-r1-section-description > i {
        margin-top: .22rem;
        color: #6d88a2;
        font-size: .72rem;
    }

.cx-r1-document-addedit .cx-r1-form-row {
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(175px, 225px) minmax(0, 1fr);
    align-items: start;
    gap: .45rem .9rem;
    margin: 0 0 .75rem;
}

    .cx-r1-document-addedit .cx-r1-form-row:last-child {
        margin-bottom: 0;
    }

    .cx-r1-document-addedit .cx-r1-form-row > [class*="col-"] {
        width: auto;
        max-width: none;
        min-width: 0;
        margin: 0;
        padding: 0;
    }

    .cx-r1-document-addedit .cx-r1-form-row > .form-label {
        padding-top: .62rem;
        text-align: right !important;
    }

.cx-r1-document-addedit .form-label > label:not(.custom-switch),
.cx-r1-document-addedit label[aspfor] {
    color: #52677a;
    font-size: .72rem;
    font-weight: 800;
    letter-spacing: .045em;
    line-height: 1.35;
    text-transform: uppercase;
}

    .cx-r1-document-addedit .form-label > label:not(.custom-switch)::after,
    .cx-r1-document-addedit label[aspfor]::after {
        content: ":";
    }

.cx-r1-document-addedit input.form-control,
.cx-r1-document-addedit select.form-control,
.cx-r1-document-addedit textarea.form-control {
    width: 100%;
    min-width: 0;
    border-color: #cfd9e3;
    border-radius: 8px;
    box-shadow: none;
}

.cx-r1-document-addedit textarea.form-control,
.cx-r1-document-addedit .cx-dialog-textarea {
    width: 100%;
    height: 132px;
    min-height: 84px !important;
    max-height: none !important;
    resize: both !important;
    overflow: auto !important;
}

.cx-r1-document-addedit input:disabled,
.cx-r1-document-addedit select:disabled,
.cx-r1-document-addedit textarea:disabled {
    background: #f3f6f8;
    color: #526170;
    opacity: 1;
}

@media (max-width: 767.98px) {
    .cx-r1-document-addedit .cx-r1-section {
        padding: .85rem;
    }

    .cx-r1-document-addedit .cx-r1-form-row {
        grid-template-columns: minmax(0, 1fr);
        gap: .35rem;
        margin-bottom: .85rem;
    }

        .cx-r1-document-addedit .cx-r1-form-row > .form-label {
            padding-top: 0;
            text-align: left !important;
        }

    .cx-r1-document-addedit .cx-r1-section-description {
        margin-bottom: .8rem;
    }
}

.cx-shared-form-row {
    display: grid;
    grid-template-columns: minmax(150px, 190px) minmax(0, 1fr);
    align-items: start;
    gap: 8px 16px;
    margin-bottom: 16px;
}

.cx-shared-form-label {
    min-height: 42px;
    display: flex;
    align-items: center;
    color: #2f3d4f;
    font-size: 13px;
    font-weight: 700;
    line-height: 1.35;
    margin: 0;
}

.cx-shared-form-control-zone {
    min-width: 0;
    width: 100%;
}

.cx-shared-form-control {
    width: 100%;
    min-width: 0;
    min-height: 42px;
    border: 1px solid #d7e0e9;
    border-radius: 7px;
    background: #ffffff;
    color: #2f3d4f;
    font-size: 14px;
    font-weight: 500;
    line-height: 1.35;
    padding: 9px 12px;
    box-shadow: none;
    transition: border-color .12s ease, box-shadow .12s ease;
}

    .cx-shared-form-control::placeholder {
        color: #8794a4;
        font-weight: 500;
    }

    .cx-shared-form-control:hover {
        border-color: #bcc9d6;
        background: #ffffff;
    }

    .cx-shared-form-control:focus {
        border-color: #3d6287;
        box-shadow: 0 0 0 3px rgba(61, 98, 135, .11);
        background: #ffffff;
        outline: none;
    }

.cx-shared-field-helper {
    margin-top: 5px;
    color: #7b8794;
    font-size: 11.5px;
    font-weight: 600;
    line-height: 1.3;
    text-align: right;
}

@media (max-width: 767.98px) {
    .cx-shared-form-row {
        grid-template-columns: minmax(0, 1fr);
        gap: 6px;
        margin-bottom: 14px;
    }

    .cx-shared-form-label {
        min-height: auto;
        font-size: 13.5px;
    }

    .cx-shared-form-control {
        min-height: 44px;
        font-size: 16px;
        padding: 10px 12px;
    }
}

.cx-shared-form-row {
    display: grid;
    grid-template-columns: minmax(150px, 190px) minmax(0, 1fr);
    align-items: start;
    gap: 8px 16px;
    margin-bottom: 16px;
}

.cx-shared-form-label {
    min-height: 42px;
    display: flex;
    align-items: center;
    color: #2f3d4f;
    font-size: 13px;
    font-weight: 700;
    line-height: 1.35;
    margin: 0;
}

.cx-shared-form-control-zone {
    min-width: 0;
    width: 100%;
}

.cx-shared-form-control {
    width: 100%;
    min-width: 0;
    min-height: 42px;
    border: 1px solid #d7e0e9;
    border-radius: 7px;
    background: #ffffff;
    color: #2f3d4f;
    font-size: 14px;
    font-weight: 500;
    line-height: 1.35;
    padding: 9px 12px;
    box-shadow: none;
    transition: border-color .12s ease, box-shadow .12s ease;
}

    .cx-shared-form-control::placeholder {
        color: #8794a4;
        font-weight: 500;
    }

    .cx-shared-form-control:hover {
        border-color: #bcc9d6;
        background: #ffffff;
    }

    .cx-shared-form-control:focus {
        border-color: #3d6287;
        box-shadow: 0 0 0 3px rgba(61, 98, 135, .11);
        background: #ffffff;
        outline: none;
    }

.cx-shared-field-helper {
    margin-top: 5px;
    color: #7b8794;
    font-size: 11.5px;
    font-weight: 600;
    line-height: 1.3;
    text-align: right;
}

@media (max-width: 767.98px) {
    .cx-shared-form-row {
        grid-template-columns: minmax(0, 1fr);
        gap: 6px;
        margin-bottom: 14px;
    }

    .cx-shared-form-label {
        min-height: auto;
        font-size: 13.5px;
    }

    .cx-shared-form-control {
        min-height: 44px;
        font-size: 16px;
        padding: 10px 12px;
    }
}

.cx-shared-form-row {
    display: grid;
    grid-template-columns: minmax(150px, 190px) minmax(0, 1fr);
    align-items: start;
    gap: 8px 16px;
    margin-bottom: 16px;
}

.cx-shared-form-label {
    min-height: 42px;
    display: flex;
    align-items: center;
    color: #2f3d4f;
    font-size: 13px;
    font-weight: 700;
    line-height: 1.35;
    margin: 0;
}

.cx-shared-form-control-zone {
    min-width: 0;
    width: 100%;
}

.cx-shared-form-control {
    width: 100%;
    min-width: 0;
    min-height: 42px;
    border: 1px solid #d7e0e9;
    border-radius: 7px;
    background: #ffffff;
    color: #2f3d4f;
    font-size: 14px;
    font-weight: 500;
    line-height: 1.35;
    padding: 9px 12px;
    box-shadow: none;
    transition: border-color .12s ease, box-shadow .12s ease;
}

    .cx-shared-form-control::placeholder {
        color: #8794a4;
        font-weight: 500;
    }

    .cx-shared-form-control:hover {
        border-color: #bcc9d6;
        background: #ffffff;
    }

    .cx-shared-form-control:focus {
        border-color: #3d6287;
        box-shadow: 0 0 0 3px rgba(61, 98, 135, .11);
        background: #ffffff;
        outline: none;
    }

.cx-shared-field-helper {
    margin-top: 5px;
    color: #7b8794;
    font-size: 11.5px;
    font-weight: 600;
    line-height: 1.3;
    text-align: right;
}

@media (max-width: 767.98px) {
    .cx-shared-form-row {
        grid-template-columns: minmax(0, 1fr);
        gap: 6px;
        margin-bottom: 14px;
    }

    .cx-shared-form-label {
        min-height: auto;
        font-size: 13.5px;
    }

    .cx-shared-form-control {
        min-height: 44px;
        font-size: 16px;
        padding: 10px 12px;
    }
}

.cx-shared-form-row {
    display: grid;
    grid-template-columns: minmax(150px, 190px) minmax(0, 1fr);
    align-items: start;
    gap: 8px 16px;
    margin-bottom: 16px;
}

.cx-shared-form-label {
    min-height: 42px;
    display: flex;
    align-items: center;
    color: #2f3d4f;
    font-size: 13px;
    font-weight: 700;
    line-height: 1.35;
    margin: 0;
}

.cx-shared-form-control-zone {
    min-width: 0;
    width: 100%;
}

.cx-shared-form-control {
    width: 100%;
    min-width: 0;
    min-height: 42px;
    border: 1px solid #d7e0e9;
    border-radius: 7px;
    background: #ffffff;
    color: #2f3d4f;
    font-size: 14px;
    font-weight: 500;
    line-height: 1.35;
    padding: 9px 12px;
    box-shadow: none;
    transition: border-color .12s ease, box-shadow .12s ease;
}

    .cx-shared-form-control::placeholder {
        color: #8794a4;
        font-weight: 500;
    }

    .cx-shared-form-control:hover {
        border-color: #bcc9d6;
        background: #ffffff;
    }

    .cx-shared-form-control:focus {
        border-color: #3d6287;
        box-shadow: 0 0 0 3px rgba(61, 98, 135, .11);
        background: #ffffff;
        outline: none;
    }

.cx-shared-field-helper {
    margin-top: 5px;
    color: #7b8794;
    font-size: 11.5px;
    font-weight: 600;
    line-height: 1.3;
    text-align: right;
}

@media (max-width: 767.98px) {
    .cx-shared-form-row {
        grid-template-columns: minmax(0, 1fr);
        gap: 6px;
        margin-bottom: 14px;
    }

    .cx-shared-form-label {
        min-height: auto;
        font-size: 13.5px;
    }

    .cx-shared-form-control {
        min-height: 44px;
        font-size: 16px;
        padding: 10px 12px;
    }
}

.cx-shared-form-row {
    display: grid;
    grid-template-columns: minmax(150px, 190px) minmax(0, 1fr);
    align-items: start;
    gap: 8px 16px;
    margin-bottom: 16px;
}

.cx-shared-form-label {
    min-height: 42px;
    display: flex;
    align-items: center;
    color: #2f3d4f;
    font-size: 13px;
    font-weight: 700;
    line-height: 1.35;
    margin: 0;
}

.cx-shared-form-control-zone {
    min-width: 0;
    width: 100%;
}

.cx-shared-form-control {
    width: 100%;
    min-width: 0;
    min-height: 42px;
    border: 1px solid #d7e0e9;
    border-radius: 7px;
    background: #ffffff;
    color: #2f3d4f;
    font-size: 14px;
    font-weight: 500;
    line-height: 1.35;
    padding: 9px 12px;
    box-shadow: none;
    transition: border-color .12s ease, box-shadow .12s ease;
}

    .cx-shared-form-control::placeholder {
        color: #8794a4;
        font-weight: 500;
    }

    .cx-shared-form-control:hover {
        border-color: #bcc9d6;
        background: #ffffff;
    }

    .cx-shared-form-control:focus {
        border-color: #3d6287;
        box-shadow: 0 0 0 3px rgba(61, 98, 135, .11);
        background: #ffffff;
        outline: none;
    }

.cx-shared-field-helper {
    margin-top: 5px;
    color: #7b8794;
    font-size: 11.5px;
    font-weight: 600;
    line-height: 1.3;
    text-align: right;
}

@media (max-width: 767.98px) {
    .cx-shared-form-row {
        grid-template-columns: minmax(0, 1fr);
        gap: 6px;
        margin-bottom: 14px;
    }

    .cx-shared-form-label {
        min-height: auto;
        font-size: 13.5px;
    }

    .cx-shared-form-control {
        min-height: 44px;
        font-size: 16px;
        padding: 10px 12px;
    }
}

.cx-shared-form-row {
    display: grid;
    grid-template-columns: minmax(150px, 190px) minmax(0, 1fr);
    align-items: start;
    gap: 8px 16px;
    margin-bottom: 16px;
}

.cx-shared-form-label {
    min-height: 42px;
    display: flex;
    align-items: center;
    color: #2f3d4f;
    font-size: 13px;
    font-weight: 700;
    line-height: 1.35;
    margin: 0;
}

.cx-shared-form-control-zone {
    min-width: 0;
    width: 100%;
}

.cx-shared-form-control {
    width: 100%;
    min-width: 0;
    min-height: 42px;
    border: 1px solid #d7e0e9;
    border-radius: 7px;
    background: #ffffff;
    color: #2f3d4f;
    font-size: 14px;
    font-weight: 500;
    line-height: 1.35;
    padding: 9px 12px;
    box-shadow: none;
    transition: border-color .12s ease, box-shadow .12s ease;
}

    .cx-shared-form-control::placeholder {
        color: #8794a4;
        font-weight: 500;
    }

    .cx-shared-form-control:hover {
        border-color: #bcc9d6;
        background: #ffffff;
    }

    .cx-shared-form-control:focus {
        border-color: #3d6287;
        box-shadow: 0 0 0 3px rgba(61, 98, 135, .11);
        background: #ffffff;
        outline: none;
    }

.cx-shared-field-helper {
    margin-top: 5px;
    color: #7b8794;
    font-size: 11.5px;
    font-weight: 600;
    line-height: 1.3;
    text-align: right;
}

@media (max-width: 767.98px) {
    .cx-shared-form-row {
        grid-template-columns: minmax(0, 1fr);
        gap: 6px;
        margin-bottom: 14px;
    }

    .cx-shared-form-label {
        min-height: auto;
        font-size: 13.5px;
    }

    .cx-shared-form-control {
        min-height: 44px;
        font-size: 16px;
        padding: 10px 12px;
    }
}

.conexgo-pagedlist-toolbar {
    width: 100%;
    min-width: 0;
    margin: 0 0 12px;
    padding: 8px 0 0;
    display: grid;
    grid-template-columns: max-content minmax(0, 1fr);
    align-items: end;
    gap: 14px 20px;
}

.conexgo-pagedlist-filters {
    min-width: 0;
    display: flex;
    align-items: end;
    gap: 12px;
    flex-wrap: nowrap;
}

.conexgo-pagedlist-field {
    min-width: 0;
    display: grid;
    gap: 5px;
}

.conexgo-pagedlist-field-label {
    margin: 0;
    color: #667085;
    font-size: .78rem;
    font-weight: 700;
    line-height: 1.25;
}

.conexgo-pagedlist-field-label--icon {
    min-height: 30px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.conexgo-pagedlist-label-icon {
    width: 30px;
    height: 30px;
    flex: 0 0 30px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #d8e2eb;
    border-radius: 8px;
    background: #f8fbfd;
    color: #315879;
}

.conexgo-pagedlist-size-select {
    width: 126px !important;
    min-width: 126px !important;
}

.conexgo-pagedlist-range-select {
    width: 230px !important;
    min-width: 230px !important;
}

.conexgo-pagedlist-pagination {
    min-width: 0;
    margin-left: auto;
    justify-self: end;
}

    .conexgo-pagedlist-pagination .pagination {
        margin: 0;
        display: flex;
        align-items: center;
        justify-content: flex-end;
        gap: 6px;
        flex-wrap: nowrap;
    }

    .conexgo-pagedlist-pagination .page-link {
        min-width: 34px;
        height: 34px;
        padding: 0 7px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        border: 1px solid #cfd8e3;
        border-radius: 7px !important;
        background: #ffffff;
        color: #2c4c6c;
        font-size: .84rem;
        font-weight: 650;
        box-shadow: none;
    }

        .conexgo-pagedlist-pagination .page-link:hover {
            border-color: #cfd8e3;
            background: #ffffff;
            color: #2c4c6c;
        }

    .conexgo-pagedlist-pagination .page-item.disabled .page-link {
        border-color: #e2e8ee;
        background: #f7f9fb;
        color: #a2aebb;
        opacity: 1;
    }

    .conexgo-pagedlist-pagination .conexgo-pagedlist-page-status .page-link {
        min-width: 86px;
        border-color: #315879;
        background: #315879;
        color: #ffffff;
        cursor: default;
        white-space: nowrap;
    }

.conexgo-pagedlist-custom-fields {
    min-width: 0;
}

.conexgo-pagedlist-field,
.conexgo-pagedlist-date-input,
.conexgo-pagedlist-time-input {
    width: 100%;
    min-width: 0;
}

.conexgo-pagedlist-loading {
    width: 100%;
    min-height: 160px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.conexgo-pagedlist-table-region,
.conexgo-pagedlist-table-column,
.conexgo-pagedlist-table {
    width: 100%;
    min-width: 0;
    margin-right: 0;
    margin-left: 0;
}

.conexgo-pagedlist-table-column {
    padding-right: 0;
    padding-left: 0;
}

.conexgo-pagedlist-empty {
    width: 100%;
    min-height: 96px;
    margin: 10px 0 14px;
    padding: 18px 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 13px;
    border: 1px dashed #c9d8e5;
    border-radius: 12px;
    background: linear-gradient(135deg, #f8fbfd, #f1f6fa);
    color: #48627b;
    text-align: left;
}

.conexgo-pagedlist-empty__icon {
    width: 46px;
    height: 46px;
    flex: 0 0 46px;
    display: grid;
    place-items: center;
    border: 1px solid #d5e2ec;
    border-radius: 13px;
    background: #ffffff;
    color: #3d6287;
    font-size: 1.05rem;
    box-shadow: 0 5px 14px rgba(44, 76, 108, .07);
}

.conexgo-pagedlist-empty__content {
    display: grid;
    gap: 3px;
}

    .conexgo-pagedlist-empty__content strong {
        color: #2c4c6c;
        font-size: .94rem;
    }

    .conexgo-pagedlist-empty__content small {
        color: #718092;
        font-size: .78rem;
    }

@media (max-width: 900px) {
    .conexgo-pagedlist-toolbar {
        grid-template-columns: minmax(0, 1fr);
    }

    .conexgo-pagedlist-pagination {
        width: 100%;
        margin-left: 0;
    }

        .conexgo-pagedlist-pagination .pagination {
            justify-content: center;
        }
}

@media (max-width: 767.98px) {
    .conexgo-pagedlist-filters {
        width: 100%;
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .conexgo-pagedlist-size-select,
    .conexgo-pagedlist-range-select {
        width: 100% !important;
        min-width: 0 !important;
    }

    .conexgo-pagedlist-mobile-cards {
        width: 100% !important;
        border: 0 !important;
        background: transparent !important;
    }

        .conexgo-pagedlist-mobile-cards thead {
            position: absolute !important;
            width: 1px !important;
            height: 1px !important;
            padding: 0 !important;
            margin: -1px !important;
            overflow: hidden !important;
            clip: rect(0, 0, 0, 0) !important;
            white-space: nowrap !important;
            border: 0 !important;
        }

        .conexgo-pagedlist-mobile-cards tbody,
        .conexgo-pagedlist-mobile-cards tbody tr {
            width: 100% !important;
            display: block !important;
        }

            .conexgo-pagedlist-mobile-cards tbody tr {
                margin: 0 0 10px !important;
                overflow: hidden;
                border: 1px solid #dde5ee !important;
                border-radius: 10px;
                background: #ffffff !important;
                box-shadow: 0 2px 8px rgba(44, 76, 108, .06);
            }

            .conexgo-pagedlist-mobile-cards tbody td:not(.d-none) {
                width: 100% !important;
                min-width: 0 !important;
                padding: 9px 11px !important;
                display: grid !important;
                grid-template-columns: minmax(92px, 34%) minmax(0, 1fr);
                align-items: start;
                gap: 10px;
                border: 0 !important;
                border-bottom: 1px solid #edf1f5 !important;
                background: transparent !important;
                color: #344054;
                font-size: .88rem;
                line-height: 1.35;
                text-align: left !important;
                white-space: normal !important;
                overflow-wrap: anywhere;
            }

            .conexgo-pagedlist-mobile-cards tbody td.d-none {
                display: none !important;
            }

            .conexgo-pagedlist-mobile-cards tbody td:not(.d-none)::before {
                content: attr(data-label);
                color: #2c4c6c;
                font-size: .76rem;
                font-weight: 800;
                text-transform: uppercase;
                letter-spacing: .02em;
            }

            .conexgo-pagedlist-mobile-cards tbody td:last-child {
                border-bottom: 0 !important;
            }
}

@media (max-width: 575.98px) {
    .conexgo-pagedlist-filters {
        grid-template-columns: minmax(96px, .72fr) minmax(150px, 1.28fr);
        gap: 10px;
    }

    .conexgo-pagedlist-pagination .pagination {
        width: 100%;
        display: grid;
        grid-template-columns: repeat(2, 38px) minmax(88px, 1fr) repeat(2, 38px);
        gap: 5px;
    }

    .conexgo-pagedlist-pagination .page-link,
    .conexgo-pagedlist-pagination .conexgo-pagedlist-page-status .page-link {
        width: 100%;
        min-width: 0;
    }

    .conexgo-pagedlist-mobile-cards tbody td:not(.d-none) {
        grid-template-columns: minmax(0, 1fr) !important;
        gap: 5px !important;
    }

    .conexgo-pagedlist-empty {
        min-height: 86px;
        padding: 15px;
        justify-content: flex-start;
    }
}

.table-wait-indicator {
    width: 100%;
    min-width: 0;
    min-height: 170px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 22px;
    background: #f8fafc;
    border: 1px solid #e5eaf1;
    border-radius: 10px;
}

.table-wait-indicator__card {
    width: min(100%, 420px);
    min-width: 0;
    max-width: 420px;
    padding: 22px 30px;
    text-align: center;
    background: #ffffff;
    border: 1px solid #dee2e6;
    border-radius: 10px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, .06);
}

.table-wait-indicator__spinner {
    width: 38px;
    height: 38px;
    margin: 0 auto 12px auto;
    border: 4px solid #edf0f2;
    border-top-color: #2c4c6c;
    border-radius: 50%;
    animation: conexgo-table-spin .8s linear infinite;
}

.table-wait-indicator__title {
    color: #2c4c6c;
    font-size: 10.5pt;
    font-weight: 750;
    line-height: 1.3;
}

.table-wait-indicator__subtitle {
    margin-top: 4px;
    color: #6c757d;
    font-size: 8.8pt;
    line-height: 1.35;
}

@media (max-width: 479.98px) {
    .table-wait-indicator {
        min-height: 150px;
        padding: 14px;
    }

    .table-wait-indicator__card {
        padding: 18px 16px;
    }

    .table-wait-indicator__title {
        font-size: 10pt;
    }

    .table-wait-indicator__subtitle {
        font-size: 8.5pt;
    }
}

@media (prefers-reduced-motion: reduce) {
    .table-wait-indicator__spinner {
        animation-duration: 1.6s;
    }
}

@keyframes conexgo-table-spin {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }
}

.conexgo-simple-modal {
    background: #ffffff;
    border-radius: 6px;
    overflow: hidden;
}

.conexgo-simple-header {
    padding: 14px 18px;
    background: #2c4c6c;
    color: #ffffff;
}

.conexgo-simple-title-zone {
    display: flex;
    align-items: center;
    gap: 10px;
}

.conexgo-simple-icon {
    width: 34px;
    height: 34px;
    border-radius: 50%;
    background: rgba(255, 255, 255, .14);
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 34px;
    color: #ffffff;
}

.conexgo-simple-title {
    margin: 0;
    color: #ffffff;
    font-size: 12pt;
    font-weight: 700;
    line-height: 1.2;
}

.conexgo-simple-subtitle {
    margin-top: 2px;
    color: rgba(255, 255, 255, .78);
    font-size: 9pt;
    line-height: 1.35;
}

.conexgo-simple-body {
    padding: 0;
    background: #ffffff;
}

.conexgo-terms-document {
    max-height: 56vh;
    overflow-y: auto;
    padding: 20px 22px;
    color: #1f2937;
    font-size: 9.5pt;
    line-height: 1.6;
}

    .conexgo-terms-document p {
        margin-bottom: .85rem;
    }

    .conexgo-terms-document h1,
    .conexgo-terms-document h2,
    .conexgo-terms-document h3,
    .conexgo-terms-document h4 {
        color: #263b59;
        font-weight: 700;
    }

.conexgo-simple-loading {
    min-height: 220px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 12px;
    color: #6c757d;
}

.conexgo-simple-loading-text {
    font-size: 9.5pt;
    font-weight: 600;
}

.conexgo-simple-actions {
    padding: 12px 18px 14px 18px;
    background: #f8fafc;
    border-top: 1px solid #edf0f2;
    display: flex;
    justify-content: flex-end;
    gap: 8px;
}

.conexgo-blue-button.mud-button-root {
    background-color: #2c4c6c !important;
    border: 1px solid #2c4c6c !important;
    color: #ffffff !important;
    min-height: 38px;
    min-width: 120px;
    padding: 0 16px;
    border-radius: 4px;
    font-size: 9.5pt;
    font-weight: 600;
    box-shadow: none !important;
    text-transform: none !important;
}

    .conexgo-blue-button.mud-button-root:hover {
        background-color: #2c4c6c !important;
        border-color: #2c4c6c !important;
        color: #ffffff !important;
        box-shadow: none !important;
        transform: none !important;
    }

.conexgo-outline-blue-button.mud-button-root {
    background-color: #ffffff !important;
    border: 1px solid #c8d3df !important;
    color: #2c4c6c !important;
    min-height: 38px;
    min-width: 110px;
    padding: 0 16px;
    border-radius: 4px;
    font-size: 9.5pt;
    font-weight: 600;
    box-shadow: none !important;
    text-transform: none !important;
}

    .conexgo-outline-blue-button.mud-button-root:hover {
        background-color: #ffffff !important;
        border-color: #c8d3df !important;
        color: #2c4c6c !important;
        box-shadow: none !important;
        transform: none !important;
    }

    .conexgo-blue-button.mud-button-root:disabled,
    .conexgo-outline-blue-button.mud-button-root:disabled {
        opacity: .65;
        cursor: wait;
    }

@media (max-width: 576px) {
    .conexgo-simple-actions {
        flex-direction: row;
        flex-wrap: nowrap;
        justify-content: flex-end;
    }

        .conexgo-simple-actions .mud-button-root {
            width: auto;
            min-width: 38px;
        }

    .conexgo-terms-document {
        max-height: 54vh;
        padding: 18px;
    }
}

@keyframes conexgo-spin {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }
}

a#back-to-top.conexgo-back-to-top {
    position: fixed !important;
    right: 20px !important;
    bottom: 20px !important;
    z-index: 1200 !important;
    display: none;
    align-items: center !important;
    justify-content: center !important;
    width: 44px !important;
    height: 44px !important;
    min-width: 44px !important;
    min-height: 44px !important;
    padding: 0 !important;
    margin: 0 !important;
    color: #ffffff !important;
    background: #2c4c6c !important;
    border: 1px solid rgba(255, 255, 255, 0.18) !important;
    border-radius: 8px !important;
    box-sizing: border-box !important;
    text-align: center !important;
    text-decoration: none !important;
    box-shadow: 0 2px 7px rgba(44, 76, 108, 0.22) !important;
    transition: background-color 0.15s ease, border-color 0.15s ease, transform 0.15s ease, box-shadow 0.15s ease !important;
}

    a#back-to-top.conexgo-back-to-top[style*="display: inline"],
    a#back-to-top.conexgo-back-to-top[style*="display: block"],
    a#back-to-top.conexgo-back-to-top[style*="display: inline-block"] {
        display: inline-flex !important;
    }

    a#back-to-top.conexgo-back-to-top i {
        display: block !important;
        margin: 0 !important;
        padding: 0 !important;
        color: #ffffff !important;
        font-size: 16px !important;
        line-height: 1 !important;
    }

    a#back-to-top.conexgo-back-to-top:hover {
        color: #ffffff !important;
        background: #3d6287 !important;
        border-color: #3d6287 !important;
        transform: translateY(-1px) !important;
        box-shadow: 0 3px 9px rgba(44, 76, 108, 0.26) !important;
    }

    a#back-to-top.conexgo-back-to-top:focus-visible {
        outline: 3px solid rgba(61, 98, 135, 0.25) !important;
        outline-offset: 3px !important;
    }

    a#back-to-top.conexgo-back-to-top:active {
        transform: translateY(0) !important;
    }

@media (max-width: 576px) {
    a#back-to-top.conexgo-back-to-top {
        right: 14px !important;
        bottom: 14px !important;
        width: 42px !important;
        height: 42px !important;
        min-width: 42px !important;
        min-height: 42px !important;
    }

        a#back-to-top.conexgo-back-to-top i {
            font-size: 15px !important;
        }
}

#blazor-error-ui {
    position: fixed !important;
    inset: auto 18px 18px auto !important;
    width: min(480px, calc(100vw - 36px)) !important;
    min-height: 0;
    padding: 14px 14px 12px !important;
    display: none;
    border: 1px solid #e3b7b7;
    border-left: 4px solid #b84949;
    border-radius: 14px;
    background: rgba(255, 249, 249, .98) !important;
    color: #6f3636 !important;
    box-shadow: 0 18px 44px rgba(52, 31, 31, .22);
    font-size: .88rem;
    line-height: 1.4;
    z-index: 5000;
    backdrop-filter: blur(12px);
}

#blazor-error-ui .cx-blazor-error-main {
    display: flex;
    align-items: flex-start;
    gap: 11px;
    padding-right: 34px;
}

#blazor-error-ui .cx-blazor-error-icon {
    width: 38px;
    height: 38px;
    flex: 0 0 38px;
    display: grid;
    place-items: center;
    border-radius: 11px;
    background: #f9e1e1;
    color: #a63f3f;
    font-size: 1rem;
}

#blazor-error-ui .cx-blazor-error-copy {
    min-width: 0;
    display: grid;
    gap: 2px;
    padding-top: 1px;
}

#blazor-error-ui .cx-blazor-error-title {
    color: #743838;
    font-size: .92rem;
    font-weight: 800;
}

#blazor-error-ui .cx-blazor-error-message { color: #8c5656; }

#blazor-error-ui .cx-blazor-error-actions {
    display: flex;
    justify-content: flex-end;
    margin-top: 10px;
    padding-top: 9px;
    border-top: 1px solid #efdada;
}

#blazor-error-ui .reload {
    min-height: 36px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    padding: 0 13px;
    border: 1px solid #a94343;
    border-radius: 9px;
    background: #a94343;
    color: #fff !important;
    font-size: .82rem;
    font-weight: 800;
    text-decoration: none !important;
    box-shadow: 0 5px 12px rgba(130, 48, 48, .18);
}

#blazor-error-ui .reload:hover,
#blazor-error-ui .reload:focus-visible {
    background: #923838;
    border-color: #923838;
    transform: translateY(-1px);
}

#blazor-error-ui .dismiss {
    position: absolute;
    top: 9px;
    right: 9px;
    width: 30px;
    height: 30px;
    display: grid;
    place-items: center;
    padding: 0;
    border: 1px solid #e2bcbc;
    border-radius: 8px;
    background: #fff;
    color: #874747;
    cursor: pointer;
}

#blazor-error-ui .dismiss:hover,
#blazor-error-ui .dismiss:focus-visible { background: #f8e8e8; }

html[lang^="fr"] #blazor-error-ui .cx-blazor-error-title--en,
html[lang^="fr"] #blazor-error-ui .cx-blazor-error-message--en,
html[lang^="fr"] #blazor-error-ui .cx-blazor-error-reload--en { display: none; }

html:not([lang^="fr"]) #blazor-error-ui .cx-blazor-error-title--fr,
html:not([lang^="fr"]) #blazor-error-ui .cx-blazor-error-message--fr,
html:not([lang^="fr"]) #blazor-error-ui .cx-blazor-error-reload--fr { display: none; }

@media (max-width: 767.98px) {
    #blazor-error-ui {
        left: 9px !important;
        right: 9px !important;
        bottom: calc(82px + env(safe-area-inset-bottom, 0px)) !important;
        width: auto !important;
        padding: 12px !important;
        font-size: .8rem;
    }

    #blazor-error-ui .cx-blazor-error-main { gap: 9px; padding-right: 30px; }
    #blazor-error-ui .cx-blazor-error-icon { width: 34px; height: 34px; flex-basis: 34px; }
    #blazor-error-ui .cx-blazor-error-actions { margin-top: 9px; padding-top: 8px; }
    #blazor-error-ui .reload { width: 100%; min-height: 38px; }
    #blazor-error-ui .dismiss { top: 7px; right: 7px; width: 29px; height: 29px; }
}

.cx-device-addedit-loading,
.cx-device-addedit-load-error,
.cx-notification-addedit-loading,
.cx-notification-addedit-load-error {
    min-height: 250px;
    display: grid;
    place-items: center;
    padding: 28px;
}

.cx-device-addedit-loading,
.cx-device-addedit-load-error { min-height: 260px; }

.cx-device-addedit-load-error__card,
.cx-notification-addedit-load-error__card {
    width: min(100%, 560px);
    padding: 18px 20px;
    border: 1px solid #e4b9b9;
    border-radius: 12px;
    background: #fff8f8;
    color: #7a3d3d;
    text-align: center;
}

.alert-filter-panel { width: 100% !important; }
.alert-filter-panel > .col-12 {
    width: 100% !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

.alert-filter-inline,
#basic-datatable_filter.alert-filter-inline {
    float: none !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 7px !important;
    margin: 0 !important;
    padding: 8px 2px 8px 0 !important;
    white-space: nowrap !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    scrollbar-width: thin;
    -webkit-overflow-scrolling: touch;
}

.alert-filter-inline .alert-filter-option,
#basic-datatable_filter.alert-filter-inline .alert-filter-option {
    flex: 0 0 auto !important;
    min-width: 0 !important;
    min-height: 36px !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    margin: 0 !important;
    padding: 5px 7px !important;
    border: 1px solid transparent;
    border-radius: 8px !important;
    background: transparent;
    white-space: nowrap !important;
    font-size: 14px !important;
    transition: background-color .16s ease, border-color .16s ease, box-shadow .16s ease;
}

.alert-filter-inline .alert-filter-option input[type="checkbox"],
#basic-datatable_filter.alert-filter-inline .alert-filter-option input[type="checkbox"] {
    width: 16px !important;
    height: 16px !important;
    margin: 0 !important;
    flex: 0 0 16px !important;
}

.alert-filter-inline .alert-filter-option .device-filter-label-icon,
#basic-datatable_filter.alert-filter-inline .alert-filter-option .device-filter-label-icon {
    width: 24px !important;
    height: 24px !important;
    min-width: 24px !important;
    flex: 0 0 24px !important;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #dae5ee;
    border-radius: 7px !important;
    background: #ffffff;
    color: #4f7396;
    font-size: 10.5px;
}

.alert-filter-inline .alert-filter-option:hover,
.alert-filter-inline .alert-filter-option:focus-within {
    border-color: #d4e2ee;
    background: #f6faff;
}

.alert-filter-inline .alert-filter-option:hover .device-filter-label-icon,
.alert-filter-inline .alert-filter-option:focus-within .device-filter-label-icon {
    border-color: #b7cadb;
    background: #edf4fa;
    color: #24435f;
}

.alert-filter-inline .alert-filter-option:has(input[type="checkbox"]:checked) {
    border-color: #c9dbea !important;
    background: #f3f8fc !important;
}

@media (max-width: 1200px) {
    .alert-filter-inline,
    #basic-datatable_filter.alert-filter-inline {
        gap: 6px !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    .alert-filter-inline .alert-filter-option,
    #basic-datatable_filter.alert-filter-inline .alert-filter-option {
        padding: 5px 6px !important;
        gap: 5px !important;
        font-size: 13.5px !important;
    }
}

@media (max-width: 767.98px) {
    .alert-filter-inline,
    #basic-datatable_filter.alert-filter-inline {
        display: flex !important;
        flex-wrap: nowrap !important;
        justify-content: flex-start !important;
    }
}

.cx-dashboard-page .conexgo-dashboard-resizable-card:hover,
.cx-dashboard-page .conexgo-dashboard-configuration-card:hover,
.cx-dashboard-page #conexgoDashboardSmartGrid > .conexgo-dashboard-smart-item > .card:hover {
    transform: none !important;
}

.cx-dashboard-page :is(
    .conexgo-dashboard-active-user,
    .conexgo-dashboard-latest-item,
    .conexgo-dashboard-ranked-item,
    .cx-dashboard-offline-item,
    .conexgo-dashboard-latest-breakdown-item
) {
    position: relative;
    transition: background-color .16s ease, border-color .16s ease, box-shadow .16s ease !important;
}

.cx-dashboard-page :is(
    .conexgo-dashboard-active-user,
    .conexgo-dashboard-latest-item,
    .conexgo-dashboard-ranked-item,
    .cx-dashboard-offline-item,
    .conexgo-dashboard-latest-breakdown-item
):hover,
.cx-dashboard-page :is(
    .conexgo-dashboard-active-user,
    .conexgo-dashboard-latest-item,
    .conexgo-dashboard-ranked-item,
    .cx-dashboard-offline-item,
    .conexgo-dashboard-latest-breakdown-item
):focus-within {
    background: #f3f8fc !important;
    border-color: #c9dbea !important;
    box-shadow: inset 3px 0 0 #3e6a99 !important;
    transform: none !important;
}

.cx-dashboard-page [data-dashboard-key="totalDevices"] :is(
    .conexgo-device-overview-metric,
    .conexgo-device-overview-model
) {
    transition: background-color .18s ease-out, border-color .18s ease-out, box-shadow .18s ease-out !important;
}

.cx-dashboard-page [data-dashboard-key="totalDevices"] :is(
    .conexgo-device-overview-metric,
    .conexgo-device-overview-model
):is(:hover, :focus-within) {
    background: #fbfdfe !important;
    border-color: #d3e0e9 !important;
    box-shadow: 0 2px 6px rgba(44, 76, 108, .035) !important;
    transform: none !important;
}

.cx-dashboard-page .conexgo-dashboard-resizable-card .card-body table tbody tr {
    transition: background-color .16s ease, box-shadow .16s ease !important;
}

.cx-dashboard-page .conexgo-dashboard-resizable-card .card-body table tbody tr:hover,
.cx-dashboard-page .conexgo-dashboard-resizable-card .card-body table tbody tr:focus-within {
    background: #f3f8fc !important;
    box-shadow: inset 3px 0 0 #3e6a99 !important;
    transform: none !important;
}

.cx-dashboard-page .conexgo-dashboard-resizable-card .card-body table tbody tr:hover > td,
.cx-dashboard-page .conexgo-dashboard-resizable-card .card-body table tbody tr:focus-within > td {
    background-color: transparent !important;
}

@media (prefers-reduced-motion: reduce) {
    .cx-dashboard-page :is(
        .conexgo-dashboard-active-user,
        .conexgo-dashboard-latest-item,
        .conexgo-dashboard-ranked-item,
        .cx-dashboard-offline-item,
        .conexgo-device-overview-metric,
        .conexgo-device-overview-model,
        .conexgo-dashboard-latest-breakdown-item
    ),
    .cx-dashboard-page .conexgo-dashboard-resizable-card .card-body table tbody tr {
        transition: none !important;
    }
}

.cx-list-toolbar .cx-shared-search {
    max-width: 100%;
}

.cx-list-toolbar .cx-shared-search .conexgo-search-button {
    border-color: #8493a3;
    background: #8493a3;
    color: #ffffff;
}

.cx-log-list-card--data .conexgo-pagedlist-table td:nth-child(2),
.cx-log-list-card--sms .conexgo-pagedlist-table td:nth-child(2) {
    overflow: hidden;
}

.cx-log-list-card--data .cx-data-log-trigger,
.cx-log-list-card--data .cx-data-log-message {
    width: 100%;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.cx-log-list-card--data .conexgo-pagedlist-table td:not(:nth-child(2)),
.cx-log-list-card--sms .conexgo-pagedlist-table td:not(:nth-child(2)),
.cx-log-list-card--voice .conexgo-pagedlist-table td {
    overflow-wrap: anywhere;
}

@media (min-width: 992px) {

    
    .mud-dialog.cx-device-config-dialog {
        width: min(900px, calc(100vw - 72px)) !important;
        max-width: min(900px, calc(100vw - 72px)) !important;
    }

    
    .mud-dialog.cx-r1-device-addedit,
    .mud-dialog.cx-r1-device-geofence,
    .mud-dialog.cx-r1-device-message,
    .mud-dialog.cx-r1-account-addedit,
    .mud-dialog.cx-r1-devicemodel-addedit,
    .mud-dialog.cx-terms-dialog,
    .mud-dialog.cx-report-subscribe-dialog {
        width: min(960px, calc(100vw - 72px)) !important;
        max-width: min(960px, calc(100vw - 72px)) !important;
    }

    
    .mud-dialog.cx-r1-notification-addedit,
    .mud-dialog.cx-r1-account-blocknotice,
    .mud-dialog.cx-r1-document-addedit,
    .mud-dialog.cx-r1-group-addeditname,
    .mud-dialog.cx-r1-country-addedit,
    .mud-dialog.cx-r1-stateprov-addedit,
    .mud-dialog.cx-r1-string-addedit {
        width: min(900px, calc(100vw - 72px)) !important;
        max-width: min(900px, calc(100vw - 72px)) !important;
    }
}

.cx-dashboard-page :is(
    .conexgo-dashboard-active-user,
    .conexgo-dashboard-latest-item,
    .conexgo-dashboard-ranked-item,
    .cx-dashboard-offline-item,
    .conexgo-device-overview-metric,
    .conexgo-device-overview-model,
    .conexgo-dashboard-latest-breakdown-item
):hover,
.cx-dashboard-page :is(
    .conexgo-dashboard-active-user,
    .conexgo-dashboard-latest-item,
    .conexgo-dashboard-ranked-item,
    .cx-dashboard-offline-item,
    .conexgo-device-overview-metric,
    .conexgo-device-overview-model,
    .conexgo-dashboard-latest-breakdown-item
):focus-within {
    box-shadow: none !important;
}

.cx-dashboard-page .conexgo-dashboard-resizable-card .card-body table tbody tr:hover,
.cx-dashboard-page .conexgo-dashboard-resizable-card .card-body table tbody tr:focus-within {
    box-shadow: none !important;
}

.cx-dashboard-page #conexgoDashboardSmartGrid .conexgo-dashboard-ranked-item:hover,
.cx-dashboard-page #conexgoDashboardSmartGrid .conexgo-dashboard-ranked-item:focus-within,
.cx-dashboard-page #conexgoDashboardSmartGrid .cx-dashboard-offline-item:hover,
.cx-dashboard-page #conexgoDashboardSmartGrid .cx-dashboard-offline-item:focus-within {
    border-inline-start: 0 !important;
    border-left: 0 !important;
}

@media (min-width: 901px) {
    html body.cx-design-system .cx-paged-list .conexgo-pagedlist-toolbar {
        width: 100% !important;
        display: grid !important;
        grid-template-columns: max-content minmax(300px, 1fr) !important;
        align-items: end !important;
        column-gap: 22px !important;
        row-gap: 0 !important;
        padding: 10px 0 0 !important;
        margin: 0 0 14px !important;
    }

    html body.cx-design-system .cx-paged-list .conexgo-pagedlist-filters {
        width: auto !important;
        min-width: 0 !important;
        display: grid !important;
        grid-template-columns: 150px 240px !important;
        align-items: end !important;
        gap: 14px !important;
        flex-wrap: nowrap !important;
    }

    html body.cx-design-system .cx-paged-list .conexgo-pagedlist-filters > .conexgo-pagedlist-field {
        width: 100% !important;
        min-width: 0 !important;
        margin: 0 !important;
    }

    html body.cx-design-system .cx-paged-list .conexgo-pagedlist-size-select,
    html body.cx-design-system .cx-paged-list .conexgo-pagedlist-range-select {
        width: 100% !important;
        min-width: 0 !important;
        max-width: none !important;
    }

    html body.cx-design-system .cx-paged-list .conexgo-pagedlist-filters .cx-custom-select-trigger {
        width: 100% !important;
        min-height: 48px !important;
        height: 48px !important;
    }

    html body.cx-design-system .cx-paged-list .conexgo-pagedlist-pagination {
        width: auto !important;
        min-width: 0 !important;
        margin: 0 !important;
        justify-self: end !important;
        align-self: end !important;
    }

    html body.cx-design-system .cx-paged-list .conexgo-pagedlist-pagination .pagination {
        width: auto !important;
        margin: 0 !important;
        display: flex !important;
        align-items: center !important;
        justify-content: flex-end !important;
        flex-wrap: nowrap !important;
        gap: 6px !important;
    }

    html body.cx-design-system .cx-paged-list .conexgo-pagedlist-pagination .page-link {
        height: 48px !important;
        min-height: 48px !important;
    }
}

@media (min-width: 901px) and (max-width: 1180px) {
    html body.cx-design-system .cx-paged-list .conexgo-pagedlist-toolbar {
        grid-template-columns: max-content minmax(270px, 1fr) !important;
        column-gap: 16px !important;
    }

    html body.cx-design-system .cx-paged-list .conexgo-pagedlist-filters {
        grid-template-columns: 130px 205px !important;
        gap: 10px !important;
    }

    html body.cx-design-system .cx-paged-list .conexgo-pagedlist-pagination .pagination {
        gap: 5px !important;
    }

    html body.cx-design-system .cx-paged-list .conexgo-pagedlist-pagination .page-link {
        min-width: 38px !important;
        padding-inline: 8px !important;
    }
}

@media (max-width: 900px) {
    html body.cx-design-system .cx-paged-list .conexgo-pagedlist-toolbar {
        margin-bottom: 12px !important;
    }
}

html body.cx-design-system .cx-group-member-status-cell {
    vertical-align: middle !important;
    text-align: center !important;
}

html body.cx-design-system .cx-group-member-status-icons {
    min-width: 70px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    white-space: nowrap;
}

html body.cx-design-system .cx-group-member-status-icon {
    width: 22px;
    min-width: 22px;
    height: 22px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    line-height: 1;
    text-align: center;
}

.cx-r1-alert-view .alert-view-comments-section,
.cx-r1-alert-answer .alert-answer-comment-card {
    overflow: hidden !important;
    border: 1px solid #dfc45e !important;
    border-radius: 11px !important;
    background: #fff9df !important;
    box-shadow: 0 3px 10px rgba(93, 76, 19, .06) !important;
}

.cx-r1-alert-view .alert-view-comments-toggle,
.cx-r1-alert-answer .alert-answer-comment-header {
    min-height: 48px !important;
    padding: 9px 12px !important;
    border-bottom: 1px solid #ead889 !important;
    background: #fff0ae !important;
    color: #2c4c6c !important;
    box-shadow: inset 3px 0 0 #d3ac24 !important;
}

.cx-r1-alert-view .alert-view-comments-toggle:hover,
.cx-r1-alert-view .alert-view-comments-toggle:focus,
.cx-r1-alert-answer .alert-answer-comment-header:hover {
    background: #ffed9f !important;
    color: #2c4c6c !important;
}

.cx-r1-alert-view .alert-view-comments-toggle-main,
.cx-r1-alert-answer .alert-answer-comment-title {
    color: #2c4c6c !important;
    font-size: 13.5px !important;
    font-weight: 780 !important;
}

.cx-r1-alert-view .alert-view-comments-toggle-main > i,
.cx-r1-alert-answer .alert-answer-comment-title > i {
    color: #315f82 !important;
}

.cx-r1-alert-view .alert-view-count-badge,
.cx-r1-alert-answer .alert-answer-count {
    min-width: 24px !important;
    height: 24px !important;
    padding: 0 7px !important;
    border: 2px solid rgba(255,255,255,.92) !important;
    border-radius: 999px !important;
    background: #df4b42 !important;
    color: #fff !important;
    box-shadow: 0 2px 7px rgba(121, 39, 34, .15) !important;
    font-size: 11.5px !important;
    font-weight: 800 !important;
}

.cx-r1-alert-view .alert-view-comments-body,
.cx-r1-alert-answer .alert-answer-comment-history,
.cx-r1-alert-answer .alert-answer-comment-editor {
    background: #fffaf0 !important;
}

.cx-r1-alert-view .alert-view-comments-body,
.cx-r1-alert-answer .alert-answer-comment-history {
    padding: 8px 12px 10px !important;
}

.cx-r1-alert-answer .alert-answer-comment-editor {
    padding: 10px 12px 12px !important;
    border-top: 1px solid #efe1a7 !important;
}

.cx-r1-alert-answer .alert-answer-comment-card.is-action-required,
.cx-r1-alert-answer .alert-answer-comment-card.is-action-required .alert-answer-comment-editor {
    background: #fff9df !important;
}

.cx-r1-alert-answer .alert-answer-comment-card.is-action-required .alert-answer-comment-header {
    background: #fff0ae !important;
}

.cx-r1-alert-answer .alert-answer-next-action.is-pending {
    animation: none !important;
    border-color: #d9bd4c !important;
    background: #fff7d2 !important;
    color: #315f82 !important;
    box-shadow: none !important;
}

.cx-r1-alert-answer .alert-answer-textarea,
.cx-r1-alert-answer .alert-answer-comment-card.is-action-required .alert-answer-textarea {
    min-height: 112px !important;
    border: 1px solid #d9c873 !important;
    border-radius: 9px !important;
    background: #ffffff !important;
    box-shadow: none !important;
}

.cx-r1-alert-answer .alert-answer-textarea:focus,
.cx-r1-alert-answer .alert-answer-comment-card.is-action-required .alert-answer-textarea:focus {
    border-color: #6e91ad !important;
    background: #ffffff !important;
    box-shadow: 0 0 0 3px rgba(49, 95, 130, .12) !important;
}

.cx-alert-comment-day + .cx-alert-comment-day {
    margin-top: 9px;
    padding-top: 8px;
    border-top: 1px solid #eadfae;
}

.cx-alert-comment-date {
    margin-bottom: 5px;
    color: #315f82;
    font-size: 11.5px;
    font-weight: 800;
    letter-spacing: .035em;
}

.cx-alert-comment-entry {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
    padding: 4px 0;
    color: #273a50;
    line-height: 1.45;
}

.cx-alert-comment-text {
    min-width: 0;
    overflow-wrap: anywhere;
}

.cx-alert-comment-meta {
    display: inline-flex;
    align-items: baseline;
    gap: 6px;
    flex: 0 0 auto;
    color: #6b7c8d;
    font-size: 11.5px;
    font-style: italic;
    white-space: nowrap;
}

.cx-alert-comment-meta strong {
    color: #315f82;
    font-weight: 760;
}

.conexgo-header-alerts .conexgo-alert-trigger {
    overflow: visible !important;
}

.conexgo-header-alerts .alertqueue-badge {
    top: -10px !important;
    right: -10px !important;
    min-width: 25px !important;
    height: 25px !important;
    padding: 0 7px !important;
    border: 2px solid #ffffff !important;
    box-shadow: 0 3px 9px rgba(75, 51, 19, .20) !important;
    font-size: 10.5px !important;
    font-weight: 820 !important;
    letter-spacing: -.015em !important;
}

.cx-dialog--document-view,
.cx-r1-document-view {
    width: min(1160px, calc(100vw - 40px)) !important;
    max-width: min(1160px, calc(100vw - 40px)) !important;
    max-height: min(92dvh, 900px) !important;
}

.cx-dialog--document-view .mud-dialog-content {
    min-height: 0 !important;
    padding: 12px 14px !important;
    overflow: auto !important;
}

.cx-dialog--document-view .conexgo-document-view-header {
    margin: 0 0 10px !important;
    padding: 10px 12px !important;
    border: 1px solid #dbe5ed !important;
    border-radius: 9px !important;
    background: #f8fbfd !important;
}

.cx-dialog--document-view .conexgo-document-view-title {
    margin: 0 !important;
    color: #294f6d !important;
    font-size: 1.12rem !important;
    line-height: 1.3 !important;
}

.cx-dialog--document-view .conexgo-document-view-description {
    margin-top: 3px !important;
    color: #65788a !important;
    font-size: .86rem !important;
}

.cx-dialog--document-view .conexgo-document-resize-shell {
    height: min(62dvh, 690px) !important;
    min-height: 400px !important;
    border: 1px solid #c9d7e2 !important;
    border-radius: 9px !important;
    background: #edf2f6 !important;
    box-shadow: inset 0 0 0 1px rgba(255,255,255,.55) !important;
}

.device-list-action-menu .dropdown-item,
.device-list-action-menu .dropdown-item:hover,
.device-list-action-menu .dropdown-item:focus,
.device-list-action-menu .dropdown-item:focus-visible {
    background: transparent !important;
    color: #294f6d !important;
    box-shadow: none !important;
    transform: none !important;
    filter: none !important;
    text-decoration: none !important;
}

.device-list-action-menu .dropdown-item:hover,
.device-list-action-menu .dropdown-item:focus-visible {
    background: #f5f8fa !important;
    color: #294f6d !important;
}

.device-list-action-menu .dropdown-item i,
.device-list-action-menu .dropdown-item span[class*="fa"] {
    color: #668299 !important;
}

.device-list-action-menu .dropdown-item:hover i,
.device-list-action-menu .dropdown-item:hover span[class*="fa"] {
    color: #315f82 !important;
}

.device-map-settings .conexgo-device-setting-toolbar .dashboard > li:hover,
.device-map-settings .setting-header .dashboard > li:hover,
.device-map-settings .conexgo-device-setting-toolbar .dashboard > li:focus-within,
.device-map-settings .setting-header .dashboard > li:focus-within {
    background: transparent !important;
    box-shadow: none !important;
    transform: none !important;
    filter: none !important;
}

@media (max-width: 767.98px) {
    .cx-alert-comment-entry {
        align-items: flex-start;
        flex-direction: column;
        gap: 2px;
    }

    .cx-alert-comment-meta {
        white-space: normal;
    }

    .conexgo-header-alerts .alertqueue-badge {
        top: -8px !important;
        right: -8px !important;
    }

    .cx-dialog--document-view,
    .cx-r1-document-view {
        width: calc(100vw - 12px) !important;
        max-width: calc(100vw - 12px) !important;
    }

    .cx-dialog--document-view .conexgo-document-resize-shell {
        height: 58dvh !important;
        min-height: 320px !important;
    }
}

    @media (min-width: 992px) {
        html body.cx-design-system .device-config-card .device-config-main-header,
        html body.cx-design-system .device-config-card .device-config-sections-shell,
        html body.cx-design-system .device-config-card .device-config-sections-row,
        html body.cx-design-system .device-config-card .device-config-sections-row > [class*="col-"] {
            width: 100% !important;
            max-width: none !important;
            margin-inline: 0 !important;
        }

        html body.cx-design-system .device-config-card,
        html body.cx-design-system .device-config-card .device-config-card-body,
        html body.cx-design-system .device-config-card .device-config-sections-shell,
        html body.cx-design-system .device-config-card .device-config-sections-row,
        html body.cx-design-system .device-config-card .device-config-sections-row > [class*="col-"] {
            overflow: visible !important;
        }

        html body.cx-design-system .device-config-card .device-config-section-header,
        html body.cx-design-system .device-config-card .device-config-section-content {
            position: relative !important;
            width: 100% !important;
            max-width: none !important;
            padding-right: 54px !important;
            overflow: visible !important;
        }

        
        html body.cx-design-system .device-config-card .device-config-section-content > .device-config-col-toggle[aria-hidden="true"] {
            display: none !important;
        }

        html body.cx-design-system .device-config-card .device-config-col-customer { grid-column: 1 !important; }
        html body.cx-design-system .device-config-card .device-config-col-edit { grid-column: 2 !important; }
        html body.cx-design-system .device-config-card .device-config-col-edit--standalone { grid-column: 1 / 3 !important; }
        html body.cx-design-system .device-config-card .device-config-col-value { grid-column: 3 !important; }
        html body.cx-design-system .device-config-card .device-config-col-email { grid-column: 4 !important; }
        html body.cx-design-system .device-config-card .device-config-col-sms { grid-column: 5 !important; }
        html body.cx-design-system .device-config-card .device-config-col-updated { grid-column: 6 !important; }

        html body.cx-design-system .device-config-card .device-config-section--schedule .device-config-col-feature { grid-column: 1 / 3 !important; }
        html body.cx-design-system .device-config-card .device-config-col-schedule { grid-column: 3 / 6 !important; }
        html body.cx-design-system .device-config-card .device-config-section--schedule.device-config-section-content .device-config-col-value { grid-column: 3 !important; }
        html body.cx-design-system .device-config-card .device-config-section--schedule.device-config-section-content .device-config-col-schedule { grid-column: 4 / 6 !important; }
        html body.cx-design-system .device-config-card .device-config-section--schedule.device-config-section-content .device-config-col-updated { grid-column: 6 !important; }
        html body.cx-design-system .device-config-card .device-config-section--ringtone.device-config-section-content .device-config-col-value--wide { grid-column: 3 / 6 !important; }

        html body.cx-design-system .device-config-card .device-config-col-email,
        html body.cx-design-system .device-config-card .device-config-col-email * {
            min-width: 0 !important;
            max-width: 100% !important;
            white-space: nowrap !important;
            overflow: hidden !important;
            text-overflow: ellipsis !important;
            overflow-wrap: normal !important;
            word-break: normal !important;
            font-size: .82rem !important;
            line-height: 1.25 !important;
        }

        html body.cx-design-system .device-config-card .device-config-col-updated {
            min-width: 0 !important;
            max-width: 100% !important;
            padding-right: 0 !important;
            overflow: hidden !important;
            overflow-wrap: anywhere !important;
            word-break: normal !important;
        }

        html body.cx-design-system .device-config-card .device-config-col-updated * {
            max-width: 100% !important;
        }

        
        html body.cx-design-system .device-config-card .device-config-section-header > .cx-device-config-edge-toggle {
            position: absolute !important;
            top: 50% !important;
            right: 8px !important;
            width: 44px !important;
            min-width: 44px !important;
            max-width: 44px !important;
            height: 44px !important;
            min-height: 44px !important;
            margin: 0 !important;
            padding: 0 !important;
            display: grid !important;
            place-items: center !important;
            transform: translateY(-50%) !important;
            overflow: visible !important;
            z-index: 8 !important;
            pointer-events: auto !important;
        }

        html body.cx-design-system .device-config-card .device-config-section-header > .cx-device-config-edge-toggle .device-config-collapse-button {
            position: static !important;
            inset: auto !important;
            width: 42px !important;
            min-width: 42px !important;
            height: 42px !important;
            min-height: 42px !important;
            margin: 0 !important;
            transform: none !important;
            border-radius: 11px !important;
            background: #f8fbfd !important;
            border: 1px solid #b9cfde !important;
            box-shadow: 0 3px 10px rgba(36, 69, 96, .10) !important;
        }

        html body.cx-design-system .device-config-card .device-config-section-header > .cx-device-config-edge-toggle .device-config-collapse-button:is(:hover, :focus-visible) {
            background: #fff !important;
            border-color: #6f94b3 !important;
            box-shadow: 0 5px 14px rgba(36, 69, 96, .16) !important;
        }
    }

    
    @media (min-width: 992px) {
        html body.cx-design-system .device-config-card .device-config-sections-shell {
            width: 100% !important;
            min-width: 0 !important;
            max-width: 100% !important;
            padding-right: 0 !important;
            box-sizing: border-box !important;
            overflow: visible !important;
        }

        html body.cx-design-system .device-config-card .device-config-sections-row,
        html body.cx-design-system .device-config-card .device-config-sections-row > [class*="col-"] {
            width: 100% !important;
            min-width: 0 !important;
            max-width: 100% !important;
            margin-left: 0 !important;
            margin-right: 0 !important;
            padding-left: 0 !important;
            padding-right: 0 !important;
            box-sizing: border-box !important;
            overflow: visible !important;
        }

        html body.cx-design-system .device-config-card
        :is(.device-config-section-header, .device-config-section-content) {
            position: relative !important;
            display: grid !important;
            width: 100% !important;
            min-width: 0 !important;
            max-width: 100% !important;
            margin-left: 0 !important;
            margin-right: 0 !important;
            padding-left: 18px !important;
            padding-right: 12px !important;
            box-sizing: border-box !important;
            align-items: center !important;
            column-gap: 10px !important;
            overflow: visible !important;
        }

        html body.cx-design-system .device-config-card .device-config-section-header {
            min-height: 64px !important;
        }

        html body.cx-design-system .device-config-card .device-config-section-content {
            min-height: 88px !important;
            padding-top: 14px !important;
            padding-bottom: 14px !important;
        }

        
        html body.cx-design-system .device-config-card
        .device-config-col-customer {
            grid-column: 1 !important;
            min-width: 0 !important;
        }

        html body.cx-design-system .device-config-card
        .device-config-col-edit {
            grid-column: 2 !important;
            min-width: 0 !important;
            width: 100% !important;
            display: grid !important;
            place-items: center !important;
            justify-self: stretch !important;
        }

        html body.cx-design-system .device-config-card
        .device-config-col-edit--standalone {
            grid-column: 1 / 3 !important;
            justify-items: start !important;
        }

        html body.cx-design-system .device-config-card
        .device-config-col-edit:not(.device-config-col-edit--standalone)
        .device-config-edit-button {
            width: 32px !important;
            min-width: 32px !important;
            height: 32px !important;
            min-height: 32px !important;
            margin: 0 auto !important;
            padding: 0 !important;
            display: grid !important;
            place-items: center !important;
        }

        html body.cx-design-system .device-config-card
        .device-config-col-value {
            grid-column: 3 !important;
            min-width: 0 !important;
        }

        html body.cx-design-system .device-config-card
        .device-config-col-email {
            grid-column: 4 !important;
            min-width: 0 !important;
        }

        html body.cx-design-system .device-config-card
        .device-config-col-sms {
            grid-column: 5 !important;
            min-width: 0 !important;
        }

        html body.cx-design-system .device-config-card
        .device-config-col-updated {
            grid-column: 6 !important;
            min-width: 0 !important;
        }

        html body.cx-design-system .device-config-card
        .device-config-section-header .device-config-col-feature {
            grid-column: 1 / 4 !important;
            min-width: 0 !important;
        }

        html body.cx-design-system .device-config-card
        .device-config-section-header .device-config-col-email {
            grid-column: 4 !important;
        }

        html body.cx-design-system .device-config-card
        .device-config-section-header .device-config-col-sms {
            grid-column: 5 !important;
        }

        html body.cx-design-system .device-config-card
        .device-config-section-header .device-config-col-updated {
            grid-column: 6 !important;
        }

        
        html body.cx-design-system .device-config-card
        .device-config-section--schedule .device-config-col-feature {
            grid-column: 1 / 4 !important;
        }

        html body.cx-design-system .device-config-card
        .device-config-section--schedule.device-config-section-header
        .device-config-col-schedule {
            grid-column: 4 / 6 !important;
            min-width: 0 !important;
        }

        html body.cx-design-system .device-config-card
        .device-config-section--schedule.device-config-section-content
        .device-config-col-value {
            grid-column: 3 !important;
        }

        html body.cx-design-system .device-config-card
        .device-config-section--schedule.device-config-section-content
        .device-config-col-schedule {
            grid-column: 4 / 6 !important;
            min-width: 0 !important;
        }

        html body.cx-design-system .device-config-card
        .device-config-section--schedule .device-config-col-updated {
            grid-column: 6 !important;
        }

        html body.cx-design-system .device-config-card
        .device-config-section--ringtone.device-config-section-content
        .device-config-col-value--wide {
            grid-column: 3 / 6 !important;
        }

        
        html body.cx-design-system .device-config-card
        :is(
            .device-config-col-value,
            .device-config-col-email,
            .device-config-col-sms,
            .device-config-col-schedule,
            .device-config-col-updated
        ) {
            min-width: 0 !important;
            max-width: 100% !important;
            width: 100% !important;
            box-sizing: border-box !important;
            overflow: hidden !important;
            text-overflow: clip !important;
            white-space: normal !important;
            overflow-wrap: anywhere !important;
            word-break: normal !important;
        }

        html body.cx-design-system .device-config-card
        :is(
            .device-config-col-value,
            .device-config-col-email,
            .device-config-col-sms,
            .device-config-col-schedule,
            .device-config-col-updated
        ) * {
            min-width: 0 !important;
            max-width: 100% !important;
            box-sizing: border-box !important;
            white-space: normal !important;
            overflow-wrap: anywhere !important;
            word-break: normal !important;
        }

        html body.cx-design-system .device-config-card
        .device-config-col-updated {
            padding-right: 8px !important;
        }

        html body.cx-design-system .device-config-card
        .device-config-col-updated .cx-r1878-last-updated-date {
            display: inline !important;
            white-space: normal !important;
            overflow-wrap: anywhere !important;
        }

        html body.cx-design-system .device-config-card
        .device-config-column-heading {
            min-width: 0 !important;
            max-width: 100% !important;
            white-space: normal !important;
            overflow: hidden !important;
            overflow-wrap: normal !important;
            word-break: normal !important;
            line-height: 1.16 !important;
        }

        
        html body.cx-design-system .device-config-card
        .device-config-section-header > .cx-device-config-edge-toggle {
            position: absolute !important;
            top: 50% !important;
            right: -27px !important;
            width: 44px !important;
            min-width: 44px !important;
            max-width: 44px !important;
            height: 44px !important;
            min-height: 44px !important;
            margin: 0 !important;
            padding: 0 !important;
            display: grid !important;
            place-items: center !important;
            transform: translateY(-50%) !important;
            overflow: visible !important;
            z-index: 10 !important;
            pointer-events: auto !important;
        }

        html body.cx-design-system .device-config-card
        .device-config-section-header > .cx-device-config-edge-toggle
        .device-config-collapse-button {
            position: static !important;
            inset: auto !important;
            width: 42px !important;
            min-width: 42px !important;
            height: 42px !important;
            min-height: 42px !important;
            margin: 0 !important;
            transform: none !important;
        }

        html body.cx-design-system .device-config-card
        .device-config-section-content > .device-config-col-toggle[aria-hidden="true"] {
            display: none !important;
        }
    }

    @media (min-width: 1200px) {
        html body.cx-design-system .device-config-card
        :is(.device-config-section-header, .device-config-section-content) {
            
            grid-template-columns:
                minmax(0, .78fr)
                34px
                minmax(0, 1.10fr)
                minmax(230px, 1.72fr)
                minmax(132px, .82fr)
                minmax(220px, 1.48fr) !important;
        }

        html body.cx-design-system .device-config-card
        .device-config-section-content
        :is(.device-config-col-value,
            .device-config-col-email,
            .device-config-col-sms,
            .device-config-col-schedule,
            .device-config-col-updated) {
            font-size: .86rem !important;
            line-height: 1.34 !important;
        }

        html body.cx-design-system .device-config-card
        .device-config-column-heading {
            font-size: .74rem !important;
        }
    }

    @media (min-width: 992px) and (max-width: 1199.98px) {
        html body.cx-design-system .device-config-card
        :is(.device-config-section-header, .device-config-section-content) {
            grid-template-columns: minmax(150px, .82fr) 36px minmax(0, 1.7fr) !important;
            column-gap: 12px !important;
            row-gap: 10px !important;
        }

        html body.cx-design-system .device-config-card .device-config-col-feature {
            grid-column: 1 !important;
            grid-row: 1 !important;
        }
        html body.cx-design-system .device-config-card .device-config-col-edit {
            grid-column: 2 !important;
            grid-row: 1 !important;
        }
        html body.cx-design-system .device-config-card .device-config-col-edit--standalone {
            grid-column: 1 / 3 !important;
        }
        html body.cx-design-system .device-config-card .device-config-col-value {
            grid-column: 3 !important;
            grid-row: 1 !important;
        }
        html body.cx-design-system .device-config-card .device-config-col-email {
            grid-column: 1 / 3 !important;
            grid-row: 2 !important;
        }
        html body.cx-design-system .device-config-card .device-config-col-sms {
            grid-column: 3 !important;
            grid-row: 2 !important;
            text-align: left !important;
            justify-self: stretch !important;
        }
        html body.cx-design-system .device-config-card .device-config-col-schedule {
            grid-column: 1 / -1 !important;
            grid-row: 2 !important;
        }
        html body.cx-design-system .device-config-card .device-config-col-updated {
            grid-column: 1 / -1 !important;
            grid-row: 3 !important;
        }

        html body.cx-design-system .device-config-card
        .device-config-section--schedule.device-config-section-content .device-config-col-value {
            grid-column: 3 !important;
            grid-row: 1 !important;
        }
        html body.cx-design-system .device-config-card
        .device-config-section--schedule.device-config-section-content .device-config-col-schedule {
            grid-column: 1 / -1 !important;
            grid-row: 2 !important;
        }
        html body.cx-design-system .device-config-card
        .device-config-section--schedule .device-config-col-updated {
            grid-column: 1 / -1 !important;
            grid-row: 3 !important;
        }
        html body.cx-design-system .device-config-card
        .device-config-section--ringtone.device-config-section-content .device-config-col-value--wide {
            grid-column: 3 !important;
            grid-row: 1 !important;
        }

        html body.cx-design-system .device-config-card
        .device-config-section-content
        :is(.device-config-col-value,
            .device-config-col-email,
            .device-config-col-sms,
            .device-config-col-schedule,
            .device-config-col-updated) {
            font-size: .84rem !important;
            line-height: 1.38 !important;
            min-width: 0 !important;
            white-space: normal !important;
            overflow-wrap: anywhere !important;
        }

        html body.cx-design-system .device-config-card
        .device-config-section-header .device-config-col-feature {
            grid-column: 1 / -1 !important;
        }
        html body.cx-design-system .device-config-card
        .device-config-section-header :is(.device-config-col-edit,
            .device-config-col-value,
            .device-config-col-email,
            .device-config-col-sms,
            .device-config-col-schedule,
            .device-config-col-updated) {
            display: none !important;
        }

        html body.cx-design-system .device-config-card .device-config-column-heading {
            font-size: .74rem !important;
        }
    }
    
    @media (min-width: 1200px) {
        html body.cx-design-system .device-config-card
        .device-config-col-email,
        html body.cx-design-system .device-config-card
        .device-config-col-email * {
            min-width: 0 !important;
            max-width: 100% !important;
            white-space: normal !important;
            overflow: visible !important;
            text-overflow: clip !important;
            overflow-wrap: normal !important;
            word-break: normal !important;
        }

        html body.cx-design-system .device-config-card
        .device-config-col-email {
            padding-right: 8px !important;
        }

        html body.cx-design-system .device-config-card
        .device-config-col-sms,
        html body.cx-design-system .device-config-card
        .device-config-col-sms * {
            min-width: 0 !important;
            max-width: 100% !important;
            white-space: nowrap !important;
            overflow-wrap: normal !important;
            word-break: normal !important;
            text-overflow: clip !important;
        }

        html body.cx-design-system .device-config-card
        .device-config-col-sms {
            width: 100% !important;
            padding-inline: 4px !important;
            box-sizing: border-box !important;
            text-align: center !important;
            justify-self: stretch !important;
        }

        html body.cx-design-system .device-config-card
        .device-config-col-sms.device-config-column-heading {
            text-align: center !important;
        }
    }

    @media (min-width: 1200px) {
        html body.cx-design-system .device-config-card
        .device-config-col-email {
            font-size: .84rem !important;
        }

        html body.cx-design-system .device-config-card
        .device-config-col-sms {
            font-size: .84rem !important;
        }
    }

    @media (min-width: 992px) and (max-width: 1199.98px) {
        html body.cx-design-system .device-config-card
        .device-config-col-sms {
            font-size: .78rem !important;
        }
    }

    
    @media (max-width: 767.98px) {
        html body.cx-design-system .device-config-page-header {
            width: 100% !important;
            display: grid !important;
            grid-template-columns: minmax(0, 1fr) 48px !important;
            gap: 10px 12px !important;
            align-items: start !important;
            margin-bottom: 14px !important;
        }

        html body.cx-design-system .device-config-page-heading {
            min-width: 0 !important;
            grid-column: 1 !important;
        }

        html body.cx-design-system .device-config-page-header .page-title {
            margin: 0 0 6px !important;
            line-height: 1.08 !important;
        }

        html body.cx-design-system .device-config-page-header .breadcrumb {
            min-width: 0 !important;
            max-width: 100% !important;
            margin: 0 !important;
            display: flex !important;
            flex-wrap: wrap !important;
            align-items: baseline !important;
            gap: 3px 0 !important;
            line-height: 1.35 !important;
        }

        html body.cx-design-system .device-config-page-header .breadcrumb-item {
            min-width: 0 !important;
            max-width: 100% !important;
            white-space: normal !important;
        }

        html body.cx-design-system .device-config-page-header .device-config-breadcrumb-break {
            flex: 0 0 100% !important;
            width: 100% !important;
            height: 0 !important;
            margin: 0 !important;
            padding: 0 !important;
            list-style: none !important;
        }

        html body.cx-design-system .device-config-page-header .device-config-breadcrumb-break::before {
            content: none !important;
            display: none !important;
        }

        html body.cx-design-system .device-config-page-header .device-config-breadcrumb-device {
            flex: 1 1 0 !important;
            min-width: 0 !important;
            padding-left: 0 !important;
            margin-top: 2px !important;
            color: #294d68 !important;
            font-weight: 700 !important;
            white-space: nowrap !important;
            overflow: hidden !important;
            text-overflow: ellipsis !important;
            overflow-wrap: normal !important;
            word-break: normal !important;
        }

        html body.cx-design-system .device-config-page-header .device-config-breadcrumb-device::before {
            content: none !important;
            display: none !important;
        }

        html body.cx-design-system .device-config-page-header .device-config-breadcrumb-current {
            flex: 0 0 auto !important;
            white-space: nowrap !important;
        }

        html body.cx-design-system .device-config-page-actions {
            grid-column: 2 !important;
            grid-row: 1 !important;
            width: 48px !important;
            min-width: 48px !important;
            margin: 0 !important;
            justify-self: end !important;
            align-self: start !important;
        }

        html body.cx-design-system .device-config-page-actions .device-config-download-button {
            width: 48px !important;
            min-width: 48px !important;
            height: 48px !important;
            min-height: 48px !important;
            margin: 0 !important;
            padding: 0 !important;
            display: inline-grid !important;
            place-items: center !important;
            border-radius: 10px !important;
            font-size: 0 !important;
        }

        html body.cx-design-system .device-config-page-actions .device-config-download-button > i {
            font-size: 1rem !important;
        }

        html body.cx-design-system .device-config-card .device-config-section-content,
        html body.cx-design-system .device-config-card .device-config-section-content.device-config-section-content--bdot {
            width: 100% !important;
            min-width: 0 !important;
            max-width: 100% !important;
            padding: 14px !important;
            display: grid !important;
            grid-template-columns: 46px minmax(0, 1fr) !important;
            gap: 10px 12px !important;
            align-items: start !important;
            overflow: visible !important;
        }

        html body.cx-design-system .device-config-card .device-config-section-content > .device-config-col-customer,
        html body.cx-design-system .device-config-card .device-config-section-content.device-config-section-content--bdot > .device-config-col-customer {
            grid-column: 1 / -1 !important;
            grid-row: auto !important;
            width: 100% !important;
            min-width: 0 !important;
            padding-bottom: 10px !important;
        }

        html body.cx-design-system .device-config-card .device-config-section-content > .device-config-col-edit,
        html body.cx-design-system .device-config-card .device-config-section-content > .device-config-col-edit--standalone,
        html body.cx-design-system .device-config-card .device-config-section-content.device-config-section-content--bdot > .device-config-col-edit,
        html body.cx-design-system .device-config-card .device-config-section-content.device-config-section-content--bdot > .device-config-col-edit--standalone {
            grid-column: 1 !important;
            grid-row: auto !important;
            width: 46px !important;
            min-width: 46px !important;
            max-width: 46px !important;
            margin: 0 !important;
            display: flex !important;
            justify-content: center !important;
            align-items: flex-start !important;
        }

        html body.cx-design-system .device-config-card .device-config-section-content > .device-config-col-value,
        html body.cx-design-system .device-config-card .device-config-section-content > .device-config-col-value--wide,
        html body.cx-design-system .device-config-card .device-config-section-content > .device-config-col-value--geofence,
        html body.cx-design-system .device-config-card .device-config-section-content > .device-config-col-value--bdot-overview,
        html body.cx-design-system .device-config-card .device-config-section-content.device-config-section-content--bdot > .device-config-col-value--bdot-overview {
            grid-column: 2 !important;
            grid-row: auto !important;
            width: 100% !important;
            min-width: 0 !important;
            max-width: 100% !important;
            min-height: 44px !important;
            margin: 0 !important;
            display: block !important;
            align-self: start !important;
            overflow: visible !important;
            white-space: normal !important;
            overflow-wrap: break-word !important;
            word-break: normal !important;
            line-height: 1.48 !important;
        }

        html body.cx-design-system .device-config-card .device-config-section-content
        > :is(.device-config-col-email, .device-config-col-sms, .device-config-col-schedule, .device-config-col-updated),
        html body.cx-design-system .device-config-card .device-config-section-content.device-config-section-content--bdot
        > :is(.device-config-col-email, .device-config-col-sms, .device-config-col-updated) {
            grid-column: 1 / -1 !important;
            grid-row: auto !important;
            width: 100% !important;
            min-width: 0 !important;
            max-width: 100% !important;
            margin: 0 !important;
            padding: 10px 0 0 !important;
            display: block !important;
            border-top: 1px solid #e1e9ef !important;
            text-align: left !important;
            white-space: normal !important;
            overflow: visible !important;
            text-overflow: clip !important;
            overflow-wrap: break-word !important;
            word-break: normal !important;
            line-height: 1.48 !important;
        }

        html body.cx-design-system .device-config-card .device-config-section-content
        > :is(.device-config-col-email, .device-config-col-sms, .device-config-col-schedule, .device-config-col-updated)::before,
        html body.cx-design-system .device-config-card .device-config-section-content.device-config-section-content--bdot
        > :is(.device-config-col-email, .device-config-col-sms, .device-config-col-updated)::before {
            content: attr(data-label) !important;
            width: auto !important;
            min-width: 0 !important;
            margin: 0 0 6px !important;
            padding: 0 !important;
            display: block !important;
            color: #52677a !important;
            font-size: .72rem !important;
            font-weight: 800 !important;
            letter-spacing: .035em !important;
            line-height: 1.25 !important;
            text-transform: uppercase !important;
        }

        html body.cx-design-system .device-config-card .device-config-section-content > .device-config-col-email,
        html body.cx-design-system .device-config-card .device-config-section-content > .device-config-col-email * {
            overflow-wrap: anywhere !important;
            word-break: normal !important;
        }

        html body.cx-design-system .device-config-card .device-config-section-content > .device-config-col-sms,
        html body.cx-design-system .device-config-card .device-config-section-content > .device-config-col-sms * {
            overflow-wrap: normal !important;
            word-break: keep-all !important;
        }

        html body.cx-design-system .device-config-card .device-config-section-content > .device-config-col-schedule,
        html body.cx-design-system .device-config-card .device-config-section-content > .device-config-col-schedule * {
            width: 100% !important;
            min-width: 0 !important;
            max-width: 100% !important;
            white-space: normal !important;
            overflow-wrap: normal !important;
            word-break: normal !important;
            line-height: 1.55 !important;
        }

        html body.cx-design-system .device-config-card .device-config-section-content > .device-config-col-updated,
        html body.cx-design-system .device-config-card .device-config-section-content > .device-config-col-updated *,
        html body.cx-design-system .device-config-card .device-config-section-content > .device-config-col-updated .cx-r1878-last-updated-date {
            white-space: normal !important;
            overflow-wrap: normal !important;
            word-break: normal !important;
        }

        html body.cx-design-system .device-config-card .device-config-section-content > .device-config-col-toggle[aria-hidden="true"] {
            display: none !important;
        }

        
        html body.cx-design-system .device-config-card
        .device-config-section-content.device-config-section-content--bdot
        > :is(.device-config-col-email, .device-config-col-sms, .device-config-col-updated) {
            grid-column: 1 / -1 !important;
            width: 100% !important;
        }

        html body.cx-design-system .device-config-card
        .device-config-section-content.device-config-section-content--bdot
        .cx-device-config-bdot-value,
        html body.cx-design-system .device-config-card
        .device-config-section-content.device-config-section-content--bdot
        .cx-device-config-bdot-value-text {
            width: 100% !important;
            min-width: 0 !important;
            max-width: 100% !important;
        }
    }

    
    @media (max-width: 767.98px) {
        html body.cx-design-system .device-config-content-row {
            width: auto !important;
            max-width: none !important;
            margin-left: -8px !important;
            margin-right: -8px !important;
        }

        html body.cx-design-system .device-config-content-column {
            width: 100% !important;
            max-width: 100% !important;
            padding-left: 4px !important;
            padding-right: 4px !important;
        }

        html body.cx-design-system .device-config-card {
            width: 100% !important;
            min-width: 0 !important;
            max-width: none !important;
            margin-left: 0 !important;
            margin-right: 0 !important;
        }

        html body.cx-design-system .device-config-card .device-config-card-body {
            width: 100% !important;
            min-width: 0 !important;
            max-width: none !important;
            padding-left: 5px !important;
            padding-right: 5px !important;
            box-sizing: border-box !important;
        }

        html body.cx-design-system .device-config-card .device-config-main-header,
        html body.cx-design-system .device-config-card .device-config-sections-shell,
        html body.cx-design-system .device-config-card .device-config-sections-row,
        html body.cx-design-system .device-config-card .device-config-sections-row > [class*="col-"] {
            width: 100% !important;
            min-width: 0 !important;
            max-width: none !important;
            margin-left: 0 !important;
            margin-right: 0 !important;
            box-sizing: border-box !important;
        }

        html body.cx-design-system .device-config-card .device-config-sections-row > [class*="col-"] {
            padding-left: 0 !important;
            padding-right: 0 !important;
        }

        html body.cx-design-system .device-config-card .device-config-section-header {
            width: 100% !important;
            min-width: 0 !important;
            max-width: none !important;
            grid-template-columns: minmax(0, 1fr) 48px !important;
            gap: 8px !important;
            padding: 10px 11px !important;
            box-sizing: border-box !important;
        }

        html body.cx-design-system .device-config-card .device-config-section-content,
        html body.cx-design-system .device-config-card .device-config-section-content.device-config-section-content--bdot {
            width: 100% !important;
            min-width: 0 !important;
            max-width: none !important;
            grid-template-columns: 40px minmax(0, 1fr) !important;
            gap: 8px 9px !important;
            padding: 11px !important;
            box-sizing: border-box !important;
        }

        html body.cx-design-system .device-config-card .device-config-section-content > .device-config-col-edit,
        html body.cx-design-system .device-config-card .device-config-section-content > .device-config-col-edit--standalone,
        html body.cx-design-system .device-config-card .device-config-section-content.device-config-section-content--bdot > .device-config-col-edit,
        html body.cx-design-system .device-config-card .device-config-section-content.device-config-section-content--bdot > .device-config-col-edit--standalone {
            width: 40px !important;
            min-width: 40px !important;
            max-width: 40px !important;
        }
    }

    @media (min-width: 1200px) {
        html body.cx-design-system
        .device-config-card.device-config-card.device-config-card {
            --cx-r18150-rails:
                110px
                32px
                minmax(180px, .95fr)
                minmax(150px, .90fr)
                minmax(90px, .55fr)
                minmax(190px, 1fr);
            --cx-r18150-rail-gap: 7px;
        }

        html body.cx-design-system
        .device-config-card.device-config-card.device-config-card
        :is(.device-config-section-header, .device-config-section-content) {
            grid-template-columns: var(--cx-r18150-rails) !important;
            column-gap: var(--cx-r18150-rail-gap) !important;
            width: 100% !important;
            min-width: 0 !important;
            max-width: 100% !important;
            box-sizing: border-box !important;
        }

        
        html body.cx-design-system
        .device-config-card.device-config-card.device-config-card
        .device-config-section-header.device-config-section-header--bdot,
        html body.cx-design-system
        .device-config-card.device-config-card.device-config-card
        .device-config-section-content.device-config-section-content--bdot {
            grid-template-columns: var(--cx-r18150-rails) !important;
            column-gap: var(--cx-r18150-rail-gap) !important;
        }

        html body.cx-design-system
        .device-config-card.device-config-card.device-config-card
        .device-config-section-content {
            overflow: hidden !important;
        }

        html body.cx-design-system
        .device-config-card.device-config-card.device-config-card
        .device-config-section-header {
            overflow: hidden !important;
        }

        
        html body.cx-design-system
        .device-config-card.device-config-card.device-config-card
        .device-config-section-header > .cx-device-config-edge-toggle {
            position: absolute !important;
            top: 50% !important;
            right: 10px !important;
            width: 44px !important;
            min-width: 44px !important;
            max-width: 44px !important;
            height: 44px !important;
            min-height: 44px !important;
            margin: 0 !important;
            padding: 0 !important;
            display: grid !important;
            place-items: center !important;
            transform: translateY(-50%) !important;
            overflow: visible !important;
            z-index: 10 !important;
        }

        
        html body.cx-design-system
        .device-config-card.device-config-card.device-config-card
        .device-config-section-header
        .device-config-col-updated.device-config-column-heading {
            padding-right: 54px !important;
        }

        html body.cx-design-system
        .device-config-card.device-config-card.device-config-card
        .device-config-col-updated,
        html body.cx-design-system
        .device-config-card.device-config-card.device-config-card
        .device-config-col-updated * {
            min-width: 0 !important;
            max-width: 100% !important;
            box-sizing: border-box !important;
            white-space: normal !important;
            overflow-wrap: break-word !important;
            word-break: normal !important;
        }

        html body.cx-design-system
        .device-config-card.device-config-card.device-config-card
        .device-config-section-content .device-config-col-updated {
            display: block !important;
            width: 100% !important;
            overflow: hidden !important;
            padding-right: 6px !important;
            line-height: 1.32 !important;
        }

        html body.cx-design-system
        .device-config-card.device-config-card.device-config-card
        .device-config-section-content
        .device-config-col-updated .cx-r1878-last-updated-date {
            display: block !important;
            width: 100% !important;
            max-width: 100% !important;
            white-space: normal !important;
            overflow-wrap: normal !important;
            word-break: normal !important;
        }

        
        html body.cx-design-system
        .device-config-card.device-config-card.device-config-card
        .device-config-section-content
        > .device-config-col-toggle[aria-hidden="true"] {
            display: none !important;
        }

        
        html body.cx-design-system
        .device-config-card.device-config-card.device-config-card
        .device-config-section-content
        .device-config-col-value .cx-generated-phone-event-icon {
            flex: 0 0 auto !important;
        }
    }

    @media (min-width: 1200px) {
        html body.cx-design-system
        .device-config-card.device-config-card.device-config-card {
            --cx-r18150-rails:
                130px
                34px
                minmax(0, .90fr)
                minmax(0, .90fr)
                minmax(145px, .70fr)
                minmax(185px, 1.10fr);
            --cx-r18150-rail-gap: 9px;
        }
    }

    @media (min-width: 1400px) {
        html body.cx-design-system
        .device-config-card.device-config-card.device-config-card {
            --cx-r18150-rails:
                150px
                36px
                minmax(0, .90fr)
                minmax(0, .90fr)
                minmax(165px, .78fr)
                minmax(190px, 1.08fr);
            --cx-r18150-rail-gap: 10px;
        }
    }

    
    @media (min-width: 1200px) {
        html body.cx-design-system
        .device-config-card.device-config-card.device-config-card
        .device-config-section-content .device-config-col-sms,
        html body.cx-design-system
        .device-config-card.device-config-card.device-config-card
        .device-config-section-header .device-config-col-sms {
            min-width: 0 !important;
            width: 100% !important;
            max-width: 100% !important;
            box-sizing: border-box !important;
            white-space: nowrap !important;
            overflow: hidden !important;
            text-overflow: clip !important;
        }

        html body.cx-design-system
        .device-config-card.device-config-card.device-config-card
        .device-config-section-content .device-config-col-updated {
            padding-left: 18px !important;
            padding-right: 8px !important;
        }

        html body.cx-design-system
        .device-config-card.device-config-card.device-config-card
        .device-config-section-header
        .device-config-col-updated.device-config-column-heading.cx-r18163-last-updated-heading {
            padding-left: 14px !important;
            padding-right: 40px !important;
            font-size: 10.75px !important;
            line-height: 1 !important;
            letter-spacing: .008em !important;
            white-space: nowrap !important;
        }

        html body.cx-design-system
        .device-config-card.device-config-card.device-config-card
        .cx-r18163-last-updated-heading .cx-r18163-last-updated-line {
            display: inline-block !important;
            width: auto !important;
            max-width: 100% !important;
            white-space: nowrap !important;
        }
    }

    
    @media (min-width: 1200px) {
        html body.cx-design-system
        .device-config-card.device-config-card.device-config-card
        .device-config-section-content .device-config-col-updated {
            min-width: 0 !important;
            width: 100% !important;
            max-width: 100% !important;
            overflow: hidden !important;
            padding-right: 8px !important;
            box-sizing: border-box !important;
        }

        html body.cx-design-system
        .device-config-card.device-config-card.device-config-card
        .device-config-section-content .device-config-col-updated,
        html body.cx-design-system
        .device-config-card.device-config-card.device-config-card
        .device-config-section-content .device-config-col-updated * {
            white-space: normal !important;
            overflow-wrap: break-word !important;
            word-break: normal !important;
        }
    }

    
    @media (max-width: 767.98px) {
        html body.cx-design-system .device-config-page-header {
            position: relative !important;
            display: block !important;
            width: 100% !important;
            min-width: 0 !important;
            max-width: 100% !important;
        }

        html body.cx-design-system
        .device-config-page-header > div:first-child {
            width: 100% !important;
            min-width: 0 !important;
            max-width: 100% !important;
        }

        html body.cx-design-system
        .device-config-page-header .page-title {
            width: 100% !important;
            max-width: none !important;
            margin: 0 0 10px !important;
            padding-right: 74px !important;
            box-sizing: border-box !important;
        }

        html body.cx-design-system
        .device-config-page-header .device-config-page-actions {
            position: absolute !important;
            top: 0 !important;
            right: 0 !important;
            width: auto !important;
            min-width: 0 !important;
            margin: 0 !important;
        }

        html body.cx-design-system
        .device-config-page-header .breadcrumb {
            width: 100% !important;
            min-width: 0 !important;
            max-width: 100% !important;
            margin: 0 !important;
            padding: 0 2px 4px 0 !important;
            display: flex !important;
            flex-flow: row nowrap !important;
            align-items: center !important;
            justify-content: flex-start !important;
            gap: 0 !important;
            overflow-x: auto !important;
            overflow-y: hidden !important;
            white-space: nowrap !important;
            scrollbar-width: none !important;
            -webkit-overflow-scrolling: touch;
        }

        html body.cx-design-system
        .device-config-page-header .breadcrumb::-webkit-scrollbar {
            display: none !important;
        }

        html body.cx-design-system
        .device-config-page-header .breadcrumb .breadcrumb-item {
            width: auto !important;
            min-width: max-content !important;
            max-width: none !important;
            margin: 0 !important;
            padding: 0 !important;
            display: inline-flex !important;
            align-items: center !important;
            flex: 0 0 auto !important;
            white-space: nowrap !important;
            font-size: .94rem !important;
            line-height: 1.35 !important;
        }

        
        html body.cx-design-system
        .device-config-page-header .breadcrumb .breadcrumb-item:nth-child(3) {
            display: none !important;
        }

        html body.cx-design-system
        .device-config-page-header
        .breadcrumb .breadcrumb-item + .breadcrumb-item::before {
            float: none !important;
            flex: 0 0 auto !important;
            padding-left: .48rem !important;
            padding-right: .48rem !important;
        }
    }
    

    

    
    html body.cx-design-system
    .device-config-page-header .device-config-breadcrumb-separator {
        display: inline-flex !important;
        flex: 0 0 auto !important;
        align-items: center !important;
        justify-content: center !important;
        width: auto !important;
        min-width: 0 !important;
        margin: 0 !important;
        padding: 0 .48rem !important;
        color: #aebbc6 !important;
        font-weight: 400 !important;
        line-height: 1.35 !important;
        list-style: none !important;
        white-space: nowrap !important;
    }

    html body.cx-design-system
    .device-config-page-header .device-config-breadcrumb-separator::before {
        content: none !important;
        display: none !important;
    }

    
    html body.cx-design-system
    .device-config-page-header .device-config-breadcrumb-device::before {
        content: none !important;
        display: none !important;
    }

    @media (max-width: 767.98px) {
        
        html body.cx-design-system
        .device-config-page-header .device-config-breadcrumb-separator,
        html body.cx-design-system
        .device-config-page-header .device-config-breadcrumb-device {
            display: none !important;
        }

        html body.cx-design-system
        .device-config-page-header .device-config-breadcrumb-current::before {
            content: "/" !important;
            display: inline-block !important;
            float: none !important;
            padding-left: .48rem !important;
            padding-right: .48rem !important;
            color: #aebbc6 !important;
            font-weight: 400 !important;
        }
    }

    @media (min-width: 992px) {
        
        html body.cx-design-system
        .device-config-card.device-config-card.device-config-card
        .device-config-section-header > .cx-device-config-edge-toggle {
            right: 2px !important;
        }

        
        html body.cx-design-system
        .device-config-card.device-config-card.device-config-card
        .device-config-section-header
        .device-config-col-updated.device-config-column-heading.cx-r18163-last-updated-heading {
            min-width: 0 !important;
            max-width: calc(100% - 46px) !important;
            padding-left: 10px !important;
            padding-right: 0 !important;
            overflow: visible !important;
            white-space: nowrap !important;
            font-family: inherit !important;
            font-size: 10.4px !important;
            line-height: 1 !important;
            letter-spacing: 0 !important;
        }

        html body.cx-design-system
        .device-config-card.device-config-card.device-config-card
        .cx-r18163-last-updated-heading .cx-r18163-last-updated-line {
            display: inline-block !important;
            width: max-content !important;
            max-width: none !important;
            white-space: nowrap !important;
            overflow-wrap: normal !important;
            word-break: keep-all !important;
        }
    }

    
    @media (min-width: 768px) {
        html body.cx-design-system
        .device-config-page-header .device-config-breadcrumb-device {
            display: inline-flex !important;
            align-items: center !important;
            gap: .48rem !important;
            min-width: 0 !important;
            white-space: nowrap !important;
        }

        html body.cx-design-system
        .device-config-page-header .device-config-breadcrumb-device::before {
            content: none !important;
            display: none !important;
        }

        html body.cx-design-system
        .device-config-page-header .device-config-breadcrumb-device-separator {
            display: inline-block !important;
            flex: 0 0 auto !important;
            color: #aebbc6 !important;
            font-weight: 400 !important;
            line-height: 1 !important;
        }

        html body.cx-design-system
        .device-config-page-header .device-config-breadcrumb-device-name {
            display: inline-block !important;
            min-width: 0 !important;
            white-space: nowrap !important;
        }
    }

    @media (max-width: 767.98px) {
        html body.cx-design-system
        .device-config-page-header .device-config-breadcrumb-device {
            display: none !important;
        }
    }

    @media (min-width: 992px) {
        
        html body.cx-design-system
        .device-config-card.device-config-card.device-config-card
        .device-config-section-header > .cx-device-config-edge-toggle {
            right: -10px !important;
        }
    }

    
    @media (min-width: 992px) {
        html body.cx-design-system
        .device-config-card.device-config-card.device-config-card
        .device-config-section-header > .cx-device-config-edge-toggle {
            right: -4px !important;
        }
    }

    
    @media (min-width: 992px) {
        html body.cx-design-system
        .device-config-card.device-config-card.device-config-card,
        html body.cx-design-system
        .device-config-card.device-config-card.device-config-card .device-config-card-body,
        html body.cx-design-system
        .device-config-card.device-config-card.device-config-card .device-config-sections-shell,
        html body.cx-design-system
        .device-config-card.device-config-card.device-config-card .device-config-sections-row,
        html body.cx-design-system
        .device-config-card.device-config-card.device-config-card .device-config-sections-row > [class*="col-"],
        html body.cx-design-system
        .device-config-card.device-config-card.device-config-card .device-config-section-header {
            overflow: visible !important;
        }

        html body.cx-design-system
        .device-config-card.device-config-card.device-config-card
        .device-config-section-header > .cx-device-config-edge-toggle {
            right: -40px !important;
            z-index: 30 !important;
            overflow: visible !important;
        }

        html body.cx-design-system
        .device-config-card.device-config-card.device-config-card
        .device-config-section-header > .cx-device-config-edge-toggle
        .device-config-collapse-button {
            position: relative !important;
            z-index: 31 !important;
        }
    }

    
    @media (min-width: 1200px) {
        html body.cx-design-system
        .device-config-card.device-config-card.device-config-card
        .device-config-section-header
        .device-config-col-updated.device-config-column-heading.cx-r18163-last-updated-heading {
            font-family: inherit !important;
            font-size: .74rem !important;
            font-weight: 800 !important;
            line-height: 1.16 !important;
            letter-spacing: .035em !important;
            text-transform: uppercase !important;
        }
    }

    .cx-group-view-map-stage {
        position: relative;
        width: 100%;
        min-width: 0;
        min-height: 0;
        flex: 1 1 auto;
    }

    .cx-group-view-map-stage > .cx-group-view-map-canvas {
        width: 100%;
        height: 100%;
        min-height: 100%;
    }

    .cx-group-view-map-server-error.cx-map-state {
        position: absolute !important;
        inset: 0 !important;
        z-index: 5 !important;
        min-height: 100% !important;
    }

    html body .cx-notification-view-dialog
    .notification-view-block:is(.notification-view-block--priority, .notification-view-block--title) {
        display: grid !important;
        grid-template-columns: 112px minmax(0, 1fr) !important;
        align-items: center !important;
        gap: 12px !important;
        margin: 0 !important;
    }

    html body .cx-notification-view-dialog
    .notification-view-block:is(.notification-view-block--priority, .notification-view-block--title)
    > .notification-view-block-label {
        margin: 0 !important;
        align-self: center !important;
        color: #50687d !important;
        font-size: .74rem !important;
        font-weight: 800 !important;
        line-height: 1.2 !important;
        letter-spacing: .045em !important;
    }

    html body .cx-notification-view-dialog
    .notification-view-block--priority .notification-view-priority-card {
        min-height: 56px !important;
        padding: 9px 12px !important;
        border-radius: 10px !important;
        gap: 11px !important;
        align-items: center !important;
    }

    html body .cx-notification-view-dialog
    .notification-view-block--priority .notification-view-priority-icon {
        width: 38px !important;
        min-width: 38px !important;
        height: 38px !important;
        flex-basis: 38px !important;
    }

    html body .cx-notification-view-dialog
    .notification-view-block--title .notification-view-title-box {
        min-height: 54px !important;
        padding: 11px 14px 11px 16px !important;
        display: flex !important;
        align-items: center !important;
        border: 1px solid #cbdbe7 !important;
        border-left: 4px solid #3d7398 !important;
        border-radius: 10px !important;
        background: #f7fafc !important;
        color: #294963 !important;
        font-size: 1rem !important;
        font-weight: 760 !important;
        line-height: 1.35 !important;
        box-shadow: none !important;
        overflow-wrap: anywhere !important;
    }

    @media (max-width: 640px) {
        html body .cx-notification-view-dialog
        .notification-view-block:is(.notification-view-block--priority, .notification-view-block--title) {
            grid-template-columns: minmax(0, 1fr) !important;
            gap: 6px !important;
        }
    }

    @media (min-width: 768px) {
        html body.app.sidebar-mini.cx-design-system:is(.sidenav-toggled, [data-cx-sidebar-state="compact"])
        .app-sidebar-shell,
        html body.app.sidebar-mini.cx-design-system:is(.sidenav-toggled, [data-cx-sidebar-state="compact"])
        .app-sidebar-shell:hover,
        html body.app.sidebar-mini.cx-design-system:is(.sidenav-toggled, [data-cx-sidebar-state="compact"])
        .app-sidebar,
        html body.app.sidebar-mini.cx-design-system:is(.sidenav-toggled, [data-cx-sidebar-state="compact"])
        .app-sidebar:hover,
        html body.app.sidebar-mini.cx-design-system:is(.sidenav-toggled, [data-cx-sidebar-state="compact"])
        .app-sidebar:focus-within {
            box-sizing: border-box !important;
            flex: 0 0 124px !important;
            width: 124px !important;
            min-width: 124px !important;
            max-width: 124px !important;
            left: 0 !important;
            right: auto !important;
            margin-left: 0 !important;
            margin-right: 0 !important;
            transform: none !important;
            translate: none !important;
            scale: 1 !important;
            transition: none !important;
        }

        html body.app.sidebar-mini.cx-design-system:is(.sidenav-toggled, [data-cx-sidebar-state="compact"])
        .app-sidebar .side-header,
        html body.app.sidebar-mini.cx-design-system:is(.sidenav-toggled, [data-cx-sidebar-state="compact"])
        .app-sidebar .main-sidemenu {
            box-sizing: border-box !important;
            flex-basis: 124px !important;
            width: 124px !important;
            min-width: 124px !important;
            max-width: 124px !important;
            transform: none !important;
            translate: none !important;
            transition: none !important;
        }

        html body.app.sidebar-mini.cx-design-system:is(.sidenav-toggled, [data-cx-sidebar-state="compact"])
        .app-sidebar .sub-category,
        html body.app.sidebar-mini.cx-design-system:is(.sidenav-toggled, [data-cx-sidebar-state="compact"])
        .app-sidebar .sub-category:hover,
        html body.app.sidebar-mini.cx-design-system:is(.sidenav-toggled, [data-cx-sidebar-state="compact"])
        .app-sidebar .sub-category:focus-within,
        html body.app.sidebar-mini.cx-design-system:is(.sidenav-toggled, [data-cx-sidebar-state="compact"])
        .app-sidebar .sub-category.active,
        html body.app.sidebar-mini.cx-design-system:is(.sidenav-toggled, [data-cx-sidebar-state="compact"])
        .app-sidebar .sub-category.is-open {
            box-sizing: border-box !important;
            flex: 0 0 88px !important;
            width: 88px !important;
            min-width: 88px !important;
            max-width: 88px !important;
            height: 58px !important;
            min-height: 58px !important;
            max-height: 58px !important;
            margin: 4px auto !important;
            padding: 0 !important;
            display: block !important;
            opacity: 1 !important;
            visibility: visible !important;
            overflow: hidden !important;
            transform: none !important;
            translate: none !important;
            scale: 1 !important;
            transition: none !important;
        }

        html body.app.sidebar-mini.cx-design-system:is(.sidenav-toggled, [data-cx-sidebar-state="compact"])
        .app-sidebar .sub-category > .conexgo-sidebar-section-toggle,
        html body.app.sidebar-mini.cx-design-system:is(.sidenav-toggled, [data-cx-sidebar-state="compact"])
        .app-sidebar .sub-category > .conexgo-sidebar-section-toggle:hover,
        html body.app.sidebar-mini.cx-design-system:is(.sidenav-toggled, [data-cx-sidebar-state="compact"])
        .app-sidebar .sub-category > .conexgo-sidebar-section-toggle:focus,
        html body.app.sidebar-mini.cx-design-system:is(.sidenav-toggled, [data-cx-sidebar-state="compact"])
        .app-sidebar .sub-category > .conexgo-sidebar-section-toggle:focus-visible,
        html body.app.sidebar-mini.cx-design-system:is(.sidenav-toggled, [data-cx-sidebar-state="compact"])
        .app-sidebar .sub-category > .conexgo-sidebar-section-toggle[aria-expanded="true"],
        html body.app.sidebar-mini.cx-design-system:is(.sidenav-toggled, [data-cx-sidebar-state="compact"])
        .app-sidebar .sub-category > .conexgo-sidebar-section-toggle[aria-expanded="false"] {
            box-sizing: border-box !important;
            flex: 0 0 84px !important;
            width: 84px !important;
            min-width: 84px !important;
            max-width: 84px !important;
            height: 56px !important;
            min-height: 56px !important;
            max-height: 56px !important;
            margin: 0 !important;
            padding: 0 !important;
            overflow: hidden !important;
            transform: none !important;
            translate: none !important;
            scale: 1 !important;
            animation: none !important;
            transition: none !important;
        }

        
        html body.app.sidebar-mini.cx-design-system:is(.sidenav-toggled, [data-cx-sidebar-state="compact"])
        .app-sidebar .sub-category:is(:hover, :focus-within, .active, .is-open) {
            transform: none !important;
            translate: none !important;
            scale: 1 !important;
            animation: none !important;
            transition: none !important;
        }

        html body.app.sidebar-mini.cx-design-system:is(.sidenav-toggled, [data-cx-sidebar-state="compact"])
        .app-sidebar .sub-category > .conexgo-sidebar-section-toggle:is(
            :hover, :focus, :focus-visible, [aria-expanded="true"], [aria-expanded="false"]
        ) {
            transform: none !important;
            translate: none !important;
            scale: 1 !important;
            animation: none !important;
            transition: none !important;
            box-shadow: none !important;
        }

        html body.app.sidebar-mini.cx-design-system:is(.sidenav-toggled, [data-cx-sidebar-state="compact"])
        .app-sidebar .sub-category > .conexgo-sidebar-section-toggle
        .conexgo-sidebar-section-icon,
        html body.app.sidebar-mini.cx-design-system:is(.sidenav-toggled, [data-cx-sidebar-state="compact"])
        .app-sidebar .sub-category > .conexgo-sidebar-section-toggle:hover
        .conexgo-sidebar-section-icon,
        html body.app.sidebar-mini.cx-design-system:is(.sidenav-toggled, [data-cx-sidebar-state="compact"])
        .app-sidebar .sub-category > .conexgo-sidebar-section-toggle:focus-visible
        .conexgo-sidebar-section-icon {
            transform: none !important;
            translate: none !important;
            scale: 1 !important;
            animation: none !important;
            transition: none !important;
        }

        html body.app.sidebar-mini.cx-design-system:is(.sidenav-toggled, [data-cx-sidebar-state="compact"])
        .app-sidebar .conexgo-sidebar-section-title,
        html body.app.sidebar-mini.cx-design-system:is(.sidenav-toggled, [data-cx-sidebar-state="compact"])
        .app-sidebar .conexgo-sidebar-section-chevron,
        html body.app.sidebar-mini.cx-design-system:is(.sidenav-toggled, [data-cx-sidebar-state="compact"])
        .app-sidebar .side-menu__label,
        html body.app.sidebar-mini.cx-design-system:is(.sidenav-toggled, [data-cx-sidebar-state="compact"])
        .app-sidebar .angle {
            display: none !important;
            width: 0 !important;
            min-width: 0 !important;
            max-width: 0 !important;
            margin: 0 !important;
            padding: 0 !important;
            opacity: 0 !important;
            visibility: hidden !important;
            overflow: hidden !important;
            transform: none !important;
            transition: none !important;
        }

        html body.app.sidebar-mini.cx-design-system:is(.sidenav-toggled, [data-cx-sidebar-state="compact"])
        .app-sidebar .side-menu__item,
        html body.app.sidebar-mini.cx-design-system:is(.sidenav-toggled, [data-cx-sidebar-state="compact"])
        .app-sidebar .side-menu__item:hover,
        html body.app.sidebar-mini.cx-design-system:is(.sidenav-toggled, [data-cx-sidebar-state="compact"])
        .app-sidebar .side-menu__item:focus-visible,
        html body.app.sidebar-mini.cx-design-system:is(.sidenav-toggled, [data-cx-sidebar-state="compact"])
        .app-sidebar .side-menu__item.active {
            box-sizing: border-box !important;
            flex: 0 0 88px !important;
            width: 88px !important;
            min-width: 88px !important;
            max-width: 88px !important;
            height: 64px !important;
            min-height: 64px !important;
            max-height: 64px !important;
            margin: 3px auto !important;
            padding: 6px !important;
            transform: none !important;
            translate: none !important;
            transition: none !important;
        }

        
        html body.app.sidebar-mini.cx-design-system:is(.sidenav-toggled, [data-cx-sidebar-state="compact"])
        .app-sidebar .side-menu__item:hover .side-menu__icon,
        html body.app.sidebar-mini.cx-design-system:is(.sidenav-toggled, [data-cx-sidebar-state="compact"])
        .app-sidebar .side-menu__item:focus-visible .side-menu__icon {
            transform: none !important;
            translate: none !important;
            scale: 1 !important;
            transform-origin: center !important;
            transition:
                background-color .14s ease,
                color .14s ease,
                box-shadow .14s ease !important;
        }

        
        html body.app.sidebar-mini.cx-design-system:is(.sidenav-toggled, [data-cx-sidebar-state="compact"])
        .app-content {
            margin-left: 124px !important;
            transition-property: none !important;
        }

        html body.app.sidebar-mini.cx-design-system:is(.sidenav-toggled, [data-cx-sidebar-state="compact"])
        .app-header.header {
            padding-left: 144px !important;
            transition-property: none !important;
        }
    }

        
        html body.app.sidebar-mini.cx-design-system:is(.sidenav-toggled, [data-cx-sidebar-state="compact"])
        .app-sidebar .side-menu > li:not(.sub-category),
        html body.app.sidebar-mini.cx-design-system:is(.sidenav-toggled, [data-cx-sidebar-state="compact"])
        .app-sidebar .side-menu > li:not(.sub-category):is(:hover, :focus-within, .active) {
            box-sizing: border-box !important;
            flex: 0 0 88px !important;
            width: 88px !important;
            min-width: 88px !important;
            max-width: 88px !important;
            margin-left: auto !important;
            margin-right: auto !important;
            padding: 0 !important;
            position: relative !important;
            left: auto !important;
            right: auto !important;
            inset-inline: auto !important;
            transform: none !important;
            translate: none !important;
            scale: 1 !important;
            animation: none !important;
            transition: none !important;
            background: transparent !important;
            border: 0 !important;
            box-shadow: none !important;
        }

        html body.app.sidebar-mini.cx-design-system:is(.sidenav-toggled, [data-cx-sidebar-state="compact"])
        .app-sidebar .side-menu > li:not(.sub-category) > .side-menu__item,
        html body.app.sidebar-mini.cx-design-system:is(.sidenav-toggled, [data-cx-sidebar-state="compact"])
        .app-sidebar .side-menu > li:not(.sub-category) > .side-menu__item:is(:hover, :focus-visible, .active) {
            box-sizing: border-box !important;
            flex: 0 0 88px !important;
            width: 88px !important;
            min-width: 88px !important;
            max-width: 88px !important;
            margin: 0 auto !important;
            transform: none !important;
            translate: none !important;
            scale: 1 !important;
            animation: none !important;
            transition: none !important;
        }

        
        html body.app.sidebar-mini.cx-design-system:is(.sidenav-toggled, [data-cx-sidebar-state="compact"])
        .app-sidebar .side-menu > .sub-category,
        html body.app.sidebar-mini.cx-design-system:is(.sidenav-toggled, [data-cx-sidebar-state="compact"])
        .app-sidebar .side-menu > .sub-category:is(:hover, :focus-within, .active, .is-open) {
            box-sizing: border-box !important;
            flex: 0 0 88px !important;
            width: 88px !important;
            min-width: 88px !important;
            max-width: 88px !important;
            height: 58px !important;
            min-height: 58px !important;
            max-height: 58px !important;
            margin: 4px auto !important;
            padding: 0 !important;
            position: relative !important;
            left: auto !important;
            right: auto !important;
            transform: none !important;
            translate: none !important;
            scale: 1 !important;
            animation: none !important;
            transition: none !important;
            background: #2c4c6c !important;
            border: 1px solid #89c540 !important;
            border-left-width: 4px !important;
            border-radius: 14px !important;
            box-shadow: 0 3px 10px rgba(44, 76, 108, .16) !important;
            overflow: hidden !important;
        }

        html body.app.sidebar-mini.cx-design-system:is(.sidenav-toggled, [data-cx-sidebar-state="compact"])
        .app-sidebar .side-menu > .sub-category > .conexgo-sidebar-section-toggle,
        html body.app.sidebar-mini.cx-design-system:is(.sidenav-toggled, [data-cx-sidebar-state="compact"])
        .app-sidebar .side-menu > .sub-category > .conexgo-sidebar-section-toggle:is(
            :hover, :focus, :focus-visible, [aria-expanded="true"], [aria-expanded="false"]
        ) {
            box-sizing: border-box !important;
            flex: 0 0 84px !important;
            width: 84px !important;
            min-width: 84px !important;
            max-width: 84px !important;
            height: 56px !important;
            min-height: 56px !important;
            max-height: 56px !important;
            margin: 0 !important;
            padding: 0 !important;
            background: transparent !important;
            border: 0 !important;
            border-radius: 0 !important;
            box-shadow: none !important;
            outline-offset: 0 !important;
            transform: none !important;
            translate: none !important;
            scale: 1 !important;
            animation: none !important;
            transition: none !important;
        }

        html body.app.sidebar-mini.cx-design-system:is(.sidenav-toggled, [data-cx-sidebar-state="compact"])
        .app-sidebar .side-menu > .sub-category > .conexgo-sidebar-section-toggle::before,
        html body.app.sidebar-mini.cx-design-system:is(.sidenav-toggled, [data-cx-sidebar-state="compact"])
        .app-sidebar .side-menu > .sub-category > .conexgo-sidebar-section-toggle::after {
            content: none !important;
            display: none !important;
        }

        
        @media (min-width: 992px) {
            
            html body.app.sidebar-mini.cx-design-system.sidenav-toggled
            .app-sidebar .side-menu > li.sub-category,
            html body.app.sidebar-mini.cx-design-system.sidenav-toggled
            .app-sidebar:hover .side-menu > li.sub-category,
            html body.app.sidebar-mini.cx-design-system.sidenav-toggled
            .app-sidebar .side-menu > li.sub-category:is(:hover, :focus-within, .active, .is-open) {
                box-sizing: border-box !important;
                flex: 0 0 88px !important;
                width: 88px !important;
                min-width: 88px !important;
                max-width: 88px !important;
                height: 50px !important;
                min-height: 50px !important;
                max-height: 50px !important;
                margin: 5px auto 3px !important;
                padding: 0 !important;
                display: flex !important;
                align-items: center !important;
                justify-content: center !important;
                position: relative !important;
                left: auto !important;
                right: auto !important;
                transform: none !important;
                translate: none !important;
                scale: 1 !important;
                transition: none !important;
                animation: none !important;
            }

            html body.app.sidebar-mini.cx-design-system.sidenav-toggled
            .app-sidebar .side-menu > li.sub-category > .conexgo-sidebar-section-toggle,
            html body.app.sidebar-mini.cx-design-system.sidenav-toggled
            .app-sidebar:hover .side-menu > li.sub-category > .conexgo-sidebar-section-toggle,
            html body.app.sidebar-mini.cx-design-system.sidenav-toggled
            .app-sidebar .side-menu > li.sub-category > .conexgo-sidebar-section-toggle:is(:hover, :focus, :focus-visible, :active) {
                box-sizing: border-box !important;
                width: 84px !important;
                min-width: 84px !important;
                max-width: 84px !important;
                height: 48px !important;
                min-height: 48px !important;
                max-height: 48px !important;
                margin: 0 !important;
                padding: 0 !important;
                display: grid !important;
                place-items: center !important;
                position: static !important;
                transform: none !important;
                translate: none !important;
                scale: 1 !important;
                transition: none !important;
                animation: none !important;
                box-shadow: none !important;
            }

            html body.app.sidebar-mini.cx-design-system.sidenav-toggled
            .app-sidebar .side-menu > li.sub-category > .conexgo-sidebar-section-toggle .conexgo-sidebar-section-icon,
            html body.app.sidebar-mini.cx-design-system.sidenav-toggled
            .app-sidebar:hover .side-menu > li.sub-category > .conexgo-sidebar-section-toggle .conexgo-sidebar-section-icon,
            html body.app.sidebar-mini.cx-design-system.sidenav-toggled
            .app-sidebar .side-menu > li.sub-category > .conexgo-sidebar-section-toggle:hover .conexgo-sidebar-section-icon {
                box-sizing: border-box !important;
                flex: 0 0 44px !important;
                width: 44px !important;
                min-width: 44px !important;
                max-width: 44px !important;
                height: 44px !important;
                min-height: 44px !important;
                max-height: 44px !important;
                margin: 0 !important;
                padding: 0 !important;
                display: grid !important;
                place-items: center !important;
                line-height: 1 !important;
                justify-self: center !important;
                align-self: center !important;
                transform: none !important;
                translate: none !important;
                scale: 1 !important;
                transition: none !important;
                animation: none !important;
            }

            
            html body.app.sidebar-mini.cx-design-system.sidenav-toggled
            .app-sidebar .side-menu > li:not(.sub-category),
            html body.app.sidebar-mini.cx-design-system.sidenav-toggled
            .app-sidebar:hover .side-menu > li:not(.sub-category),
            html body.app.sidebar-mini.cx-design-system.sidenav-toggled
            .app-sidebar .side-menu > li:not(.sub-category):is(:hover, :focus-within, .active) {
                box-sizing: border-box !important;
                flex: 0 0 70px !important;
                width: 88px !important;
                min-width: 88px !important;
                max-width: 88px !important;
                height: 70px !important;
                min-height: 70px !important;
                max-height: 70px !important;
                margin: 0 auto !important;
                padding: 0 !important;
                display: flex !important;
                align-items: center !important;
                justify-content: center !important;
                position: relative !important;
                left: auto !important;
                right: auto !important;
                transform: none !important;
                translate: none !important;
                scale: 1 !important;
                transition: none !important;
                animation: none !important;
            }

            html body.app.sidebar-mini.cx-design-system.sidenav-toggled
            .app-sidebar .side-menu > li:not(.sub-category) > .side-menu__item,
            html body.app.sidebar-mini.cx-design-system.sidenav-toggled
            .app-sidebar:hover .side-menu > li:not(.sub-category) > .side-menu__item,
            html body.app.sidebar-mini.cx-design-system.sidenav-toggled
            .app-sidebar .side-menu > li:not(.sub-category) > .side-menu__item:is(:hover, :focus, :focus-visible, .active) {
                box-sizing: border-box !important;
                flex: 0 0 64px !important;
                width: 88px !important;
                min-width: 88px !important;
                max-width: 88px !important;
                height: 64px !important;
                min-height: 64px !important;
                max-height: 64px !important;
                margin: 0 auto !important;
                padding: 6px !important;
                display: grid !important;
                place-items: center !important;
                transform: none !important;
                translate: none !important;
                scale: 1 !important;
                transition: background-color .14s ease, border-color .14s ease,
                            color .14s ease, box-shadow .14s ease !important;
                animation: none !important;
            }

            
            html body.app.sidebar-mini.cx-design-system.sidenav-toggled
            .app-sidebar .side-menu > li:not(.sub-category) > .side-menu__item .side-menu__icon,
            html body.app.sidebar-mini.cx-design-system.sidenav-toggled
            .app-sidebar:hover .side-menu > li:not(.sub-category) > .side-menu__item .side-menu__icon,
            html body.app.sidebar-mini.cx-design-system.sidenav-toggled
            .app-sidebar .side-menu > li:not(.sub-category) > .side-menu__item:is(:hover, :focus-visible, .active) .side-menu__icon {
                box-sizing: border-box !important;
                width: 52px !important;
                min-width: 52px !important;
                max-width: 52px !important;
                height: 52px !important;
                min-height: 52px !important;
                max-height: 52px !important;
                margin: 0 !important;
                padding: 0 !important;
                display: grid !important;
                place-items: center !important;
                justify-self: center !important;
                align-self: center !important;
                line-height: 1 !important;
                transform: none !important;
                translate: none !important;
                scale: 1 !important;
                animation: none !important;
                transition: background-color .14s ease, color .14s ease,
                            box-shadow .14s ease !important;
                transform-origin: center center !important;
            }
        }

@media (min-width: 992px) {
    html body.app.sidebar-mini.cx-design-system.sidenav-toggled
    .app-sidebar-modern.cx-app-sidebar :is(.main-sidemenu, .side-menu),
    html body.app.sidebar-mini.cx-design-system.sidenav-toggled
    .app-sidebar-modern.cx-app-sidebar:hover :is(.main-sidemenu, .side-menu),
    html body.app.sidebar-mini.cx-design-system.sidenav-toggled
    .app-sidebar-modern.cx-app-sidebar:focus-within :is(.main-sidemenu, .side-menu) {
        box-sizing: border-box !important;
        width: 124px !important;
        min-width: 124px !important;
        max-width: 124px !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        transform: none !important;
        translate: none !important;
        scale: 1 !important;
    }

    html body.app.sidebar-mini.cx-design-system.sidenav-toggled
    .app-sidebar-modern.cx-app-sidebar .main-sidemenu,
    html body.app.sidebar-mini.cx-design-system.sidenav-toggled
    .app-sidebar-modern.cx-app-sidebar:hover .main-sidemenu,
    html body.app.sidebar-mini.cx-design-system.sidenav-toggled
    .app-sidebar-modern.cx-app-sidebar:focus-within .main-sidemenu {
        padding: 10px 0 24px !important;
        transition: none !important;
    }

    html body.app.sidebar-mini.cx-design-system.sidenav-toggled
    .app-sidebar-modern.cx-app-sidebar .side-menu,
    html body.app.sidebar-mini.cx-design-system.sidenav-toggled
    .app-sidebar-modern.cx-app-sidebar:hover .side-menu {
        padding-left: 0 !important;
        padding-right: 0 !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
    }

    html body.app.sidebar-mini.cx-design-system.sidenav-toggled
    .app-sidebar-modern.cx-app-sidebar .side-menu > li,
    html body.app.sidebar-mini.cx-design-system.sidenav-toggled
    .app-sidebar-modern.cx-app-sidebar:hover .side-menu > li,
    html body.app.sidebar-mini.cx-design-system.sidenav-toggled
    .app-sidebar-modern.cx-app-sidebar .side-menu > li:is(:hover, :focus-within, .active, .is-open) {
        margin-left: auto !important;
        margin-right: auto !important;
        left: auto !important;
        right: auto !important;
        inset-inline: auto !important;
        transform: none !important;
        translate: none !important;
        scale: 1 !important;
    }

    
    html body.app.sidebar-mini.cx-design-system.sidenav-toggled
    .app-sidebar-modern.cx-app-sidebar
    .side-menu > li:not(.sub-category) > .side-menu__item,
    html body.app.sidebar-mini.cx-design-system.sidenav-toggled
    .app-sidebar-modern.cx-app-sidebar
    .side-menu > li:not(.sub-category) > .side-menu__item:is(:hover, :focus, :focus-visible, .active) {
        margin: 0 auto !important;
        transform: none !important;
        translate: none !important;
        scale: 1 !important;
    }

    html body.app.sidebar-mini.cx-design-system.sidenav-toggled
    .app-sidebar-modern.cx-app-sidebar
    .side-menu > li:not(.sub-category) > .side-menu__item .side-menu__icon,
    html body.app.sidebar-mini.cx-design-system.sidenav-toggled
    .app-sidebar-modern.cx-app-sidebar
    .side-menu > li:not(.sub-category) > .side-menu__item:is(:hover, :focus-visible, .active) .side-menu__icon {
        position: static !important;
        inset: auto !important;
        margin: 0 !important;
        display: grid !important;
        place-items: center !important;
        text-align: center !important;
        transform: none !important;
        translate: none !important;
        scale: 1 !important;
    }

    html body.app.sidebar-mini.cx-design-system.sidenav-toggled
    .app-sidebar-modern.cx-app-sidebar
    .side-menu > li:not(.sub-category) > .side-menu__item .side-menu__icon::before {
        display: block !important;
        margin-left: auto !important;
        margin-right: auto !important;
        text-align: center !important;
    }

    
    html body.app.sidebar-mini.cx-design-system.sidenav-toggled
    .app-sidebar-modern.cx-app-sidebar .side-menu > li.sub-category,
    html body.app.sidebar-mini.cx-design-system.sidenav-toggled
    .app-sidebar-modern.cx-app-sidebar .side-menu > li.sub-category:is(:hover, :focus-within, .active, .is-open) {
        margin-left: auto !important;
        margin-right: auto !important;
        transform: none !important;
        translate: none !important;
        scale: 1 !important;
    }

    html body.app.sidebar-mini.cx-design-system.sidenav-toggled
    .app-sidebar-modern.cx-app-sidebar
    .side-menu > li.sub-category > .conexgo-sidebar-section-toggle,
    html body.app.sidebar-mini.cx-design-system.sidenav-toggled
    .app-sidebar-modern.cx-app-sidebar
    .side-menu > li.sub-category > .conexgo-sidebar-section-toggle:is(:hover, :focus, :focus-visible, :active) {
        display: grid !important;
        place-items: center !important;
        margin: 0 !important;
        transform: none !important;
        translate: none !important;
        scale: 1 !important;
    }

    html body.app.sidebar-mini.cx-design-system.sidenav-toggled
    .app-sidebar-modern.cx-app-sidebar
    .conexgo-sidebar-section-icon,
    html body.app.sidebar-mini.cx-design-system.sidenav-toggled
    .app-sidebar-modern.cx-app-sidebar
    .conexgo-sidebar-section-toggle:hover .conexgo-sidebar-section-icon {
        margin: 0 !important;
        display: grid !important;
        place-items: center !important;
        text-align: center !important;
        transform: none !important;
        translate: none !important;
        scale: 1 !important;
    }

    html body.app.sidebar-mini.cx-design-system.sidenav-toggled
    .app-sidebar-modern.cx-app-sidebar
    .conexgo-sidebar-section-icon > i {
        display: block !important;
        margin: 0 auto !important;
        text-align: center !important;
        transform: none !important;
    }
}

    
    @media (min-width: 992px) {
        html body.app.sidebar-mini.cx-design-system:is(.sidenav-toggled, [data-cx-sidebar-state="compact"])
        .app-sidebar-modern.cx-app-sidebar,
        html body.app.sidebar-mini.cx-design-system:is(.sidenav-toggled, [data-cx-sidebar-state="compact"])
        .app-sidebar-modern.cx-app-sidebar:hover,
        html body.app.sidebar-mini.cx-design-system:is(.sidenav-toggled, [data-cx-sidebar-state="compact"])
        .app-sidebar-modern.cx-app-sidebar:focus-within,
        html body.app.sidebar-mini.cx-design-system:is(.sidenav-toggled, [data-cx-sidebar-state="compact"])
        .app-sidebar-modern.cx-app-sidebar .side-menu > li,
        html body.app.sidebar-mini.cx-design-system:is(.sidenav-toggled, [data-cx-sidebar-state="compact"])
        .app-sidebar-modern.cx-app-sidebar .side-menu > li:is(:hover, :focus-within, .active, .is-open),
        html body.app.sidebar-mini.cx-design-system:is(.sidenav-toggled, [data-cx-sidebar-state="compact"])
        .app-sidebar-modern.cx-app-sidebar .side-menu__item,
        html body.app.sidebar-mini.cx-design-system:is(.sidenav-toggled, [data-cx-sidebar-state="compact"])
        .app-sidebar-modern.cx-app-sidebar .side-menu__item:is(:hover, :focus, :focus-visible, .active),
        html body.app.sidebar-mini.cx-design-system:is(.sidenav-toggled, [data-cx-sidebar-state="compact"])
        .app-sidebar-modern.cx-app-sidebar .conexgo-sidebar-section-toggle,
        html body.app.sidebar-mini.cx-design-system:is(.sidenav-toggled, [data-cx-sidebar-state="compact"])
        .app-sidebar-modern.cx-app-sidebar .conexgo-sidebar-section-toggle:is(:hover, :focus, :focus-visible, :active) {
            transform: none !important;
            translate: none !important;
            scale: 1 !important;
        }

        html body.app.sidebar-mini.cx-design-system:is(.sidenav-toggled, [data-cx-sidebar-state="compact"])
        .app-sidebar-modern.cx-app-sidebar .side-menu__icon,
        html body.app.sidebar-mini.cx-design-system:is(.sidenav-toggled, [data-cx-sidebar-state="compact"])
        .app-sidebar-modern.cx-app-sidebar .side-menu__item:hover .side-menu__icon,
        html body.app.sidebar-mini.cx-design-system:is(.sidenav-toggled, [data-cx-sidebar-state="compact"])
        .app-sidebar-modern.cx-app-sidebar .conexgo-sidebar-section-icon,
        html body.app.sidebar-mini.cx-design-system:is(.sidenav-toggled, [data-cx-sidebar-state="compact"])
        .app-sidebar-modern.cx-app-sidebar
        .conexgo-sidebar-section-toggle:hover .conexgo-sidebar-section-icon {
            transform: none !important;
            translate: none !important;
            scale: 1 !important;
            animation: none !important;
        }

        html body.app.sidebar-mini.cx-design-system:is(.sidenav-toggled, [data-cx-sidebar-state="compact"])
        .app-sidebar-modern.cx-app-sidebar
        .side-menu > li:not(.sub-category) > .side-menu__item:hover .side-menu__icon::before,
        html body.app.sidebar-mini.cx-design-system:is(.sidenav-toggled, [data-cx-sidebar-state="compact"])
        .app-sidebar-modern.cx-app-sidebar
        .side-menu > li:not(.sub-category) > .side-menu__item:focus-visible .side-menu__icon::before,
        html body.app.sidebar-mini.cx-design-system:is(.sidenav-toggled, [data-cx-sidebar-state="compact"])
        .app-sidebar-modern.cx-app-sidebar
        .side-menu > li.sub-category
        > .conexgo-sidebar-section-toggle:hover
        > .conexgo-sidebar-section-icon::before,
        html body.app.sidebar-mini.cx-design-system:is(.sidenav-toggled, [data-cx-sidebar-state="compact"])
        .app-sidebar-modern.cx-app-sidebar
        .side-menu > li.sub-category
        > .conexgo-sidebar-section-toggle:focus-visible
        > .conexgo-sidebar-section-icon::before {
            animation: none !important;
        }
    }

    
    @media (min-width: 992px) {
        html body.app.sidebar-mini.cx-design-system:is(.sidenav-toggled, [data-cx-sidebar-state="compact"])
        .app-sidebar-modern.cx-app-sidebar .side-menu > li,
        html body.app.sidebar-mini.cx-design-system:is(.sidenav-toggled, [data-cx-sidebar-state="compact"])
        .app-sidebar-modern.cx-app-sidebar .side-menu > li:is(:hover, :focus-within, .active, .is-open),
        html body.app.sidebar-mini.cx-design-system:is(.sidenav-toggled, [data-cx-sidebar-state="compact"])
        .app-sidebar-modern.cx-app-sidebar .side-menu__item,
        html body.app.sidebar-mini.cx-design-system:is(.sidenav-toggled, [data-cx-sidebar-state="compact"])
        .app-sidebar-modern.cx-app-sidebar .side-menu__item:is(:hover, :focus, :focus-visible, .active),
        html body.app.sidebar-mini.cx-design-system:is(.sidenav-toggled, [data-cx-sidebar-state="compact"])
        .app-sidebar-modern.cx-app-sidebar .conexgo-sidebar-section-toggle,
        html body.app.sidebar-mini.cx-design-system:is(.sidenav-toggled, [data-cx-sidebar-state="compact"])
        .app-sidebar-modern.cx-app-sidebar .conexgo-sidebar-section-toggle:is(:hover, :focus, :focus-visible, :active) {
            transform: none !important;
            translate: none !important;
            scale: 1 !important;
        }

        html body.app.sidebar-mini.cx-design-system:is(.sidenav-toggled, [data-cx-sidebar-state="compact"])
        .app-sidebar-modern.cx-app-sidebar .side-menu__icon,
        html body.app.sidebar-mini.cx-design-system:is(.sidenav-toggled, [data-cx-sidebar-state="compact"])
        .app-sidebar-modern.cx-app-sidebar .side-menu__item:hover .side-menu__icon,
        html body.app.sidebar-mini.cx-design-system:is(.sidenav-toggled, [data-cx-sidebar-state="compact"])
        .app-sidebar-modern.cx-app-sidebar .conexgo-sidebar-section-icon,
        html body.app.sidebar-mini.cx-design-system:is(.sidenav-toggled, [data-cx-sidebar-state="compact"])
        .app-sidebar-modern.cx-app-sidebar
        .conexgo-sidebar-section-toggle:hover .conexgo-sidebar-section-icon {
            transform: none !important;
            translate: none !important;
            scale: 1 !important;
            animation: none !important;
        }
    }

        
        @media (min-width: 992px) {
            html body.app.sidebar-mini.cx-design-system:is(.sidenav-toggled, [data-cx-sidebar-state="compact"])
            .app-sidebar-modern.cx-app-sidebar .side-menu > li:not(.sub-category) {
                width: 88px !important;
                min-width: 88px !important;
                max-width: 88px !important;
                display: flex !important;
                align-items: center !important;
                justify-content: center !important;
                margin-left: auto !important;
                margin-right: auto !important;
                transform: none !important;
                translate: none !important;
            }

            html body.app.sidebar-mini.cx-design-system:is(.sidenav-toggled, [data-cx-sidebar-state="compact"])
            .app-sidebar-modern.cx-app-sidebar .side-menu__item,
            html body.app.sidebar-mini.cx-design-system:is(.sidenav-toggled, [data-cx-sidebar-state="compact"])
            .app-sidebar-modern.cx-app-sidebar .side-menu__item:is(:hover, :focus, :focus-visible, .active) {
                display: grid !important;
                grid-template-columns: minmax(0, 1fr) !important;
                grid-template-rows: minmax(0, 1fr) !important;
                place-items: center !important;
                justify-content: center !important;
                column-gap: 0 !important;
                row-gap: 0 !important;
                transform: none !important;
                translate: none !important;
                scale: 1 !important;
                animation: none !important;
            }

            html body.app.sidebar-mini.cx-design-system:is(.sidenav-toggled, [data-cx-sidebar-state="compact"])
            .app-sidebar-modern.cx-app-sidebar .side-menu__icon,
            html body.app.sidebar-mini.cx-design-system:is(.sidenav-toggled, [data-cx-sidebar-state="compact"])
            .app-sidebar-modern.cx-app-sidebar .side-menu__item:is(:hover, :focus-visible) .side-menu__icon,
            html body.app.sidebar-mini.cx-design-system:is(.sidenav-toggled, [data-cx-sidebar-state="compact"])
            .app-sidebar-modern.cx-app-sidebar .side-menu__icon::before {
                grid-column: 1 !important;
                grid-row: 1 !important;
                justify-self: center !important;
                align-self: center !important;
                margin: 0 auto !important;
                transform: none !important;
                translate: none !important;
                scale: 1 !important;
                animation: none !important;
            }

            html body.app.sidebar-mini.cx-design-system:is(.sidenav-toggled, [data-cx-sidebar-state="compact"])
            .app-sidebar-modern.cx-app-sidebar .sub-category,
            html body.app.sidebar-mini.cx-design-system:is(.sidenav-toggled, [data-cx-sidebar-state="compact"])
            .app-sidebar-modern.cx-app-sidebar .sub-category:is(:hover, :focus-within, .active, .is-open) {
                margin-left: auto !important;
                margin-right: auto !important;
                transform: none !important;
                translate: none !important;
            }

            html body.app.sidebar-mini.cx-design-system:is(.sidenav-toggled, [data-cx-sidebar-state="compact"])
            .app-sidebar-modern.cx-app-sidebar .conexgo-sidebar-section-toggle,
            html body.app.sidebar-mini.cx-design-system:is(.sidenav-toggled, [data-cx-sidebar-state="compact"])
            .app-sidebar-modern.cx-app-sidebar .conexgo-sidebar-section-toggle:is(:hover, :focus, :focus-visible, :active) {
                display: grid !important;
                grid-template-columns: minmax(0, 1fr) !important;
                place-items: center !important;
                margin: 0 !important;
                transform: none !important;
                translate: none !important;
                animation: none !important;
            }

            html body.app.sidebar-mini.cx-design-system:is(.sidenav-toggled, [data-cx-sidebar-state="compact"])
            .app-sidebar-modern.cx-app-sidebar
            :is(.conexgo-sidebar-section-icon, .conexgo-sidebar-section-icon::before) {
                justify-self: center !important;
                align-self: center !important;
                margin: 0 auto !important;
                transform: none !important;
                translate: none !important;
                scale: 1 !important;
                animation: none !important;
            }
        }

    
    @keyframes cx-r171-compact-glyph-hop {
        0%, 100% { transform: translateY(0); }
        50% { transform: translateY(-2px); }
    }

    @media (min-width: 992px) {
        html body.app.sidebar-mini.cx-design-system[data-cx-sidebar-state="compact"]
        :is(.app-sidebar-shell, .app-sidebar-modern.cx-app-sidebar),
        html body.app.sidebar-mini.cx-design-system[data-cx-sidebar-state="expanded"]
        :is(.app-sidebar-shell, .app-sidebar-modern.cx-app-sidebar) {
            transition: width .20s ease, min-width .20s ease, max-width .20s ease, flex-basis .20s ease !important;
        }

        html body.app.sidebar-mini.cx-design-system[data-cx-sidebar-state="compact"]
        .app-sidebar-modern.cx-app-sidebar,
        html body.app.sidebar-mini.cx-design-system[data-cx-sidebar-state="compact"]
        .app-sidebar-modern.cx-app-sidebar:hover,
        html body.app.sidebar-mini.cx-design-system[data-cx-sidebar-state="compact"]
        .app-sidebar-modern.cx-app-sidebar:focus-within,
        html body.app.sidebar-mini.cx-design-system[data-cx-sidebar-state="compact"]
        .app-sidebar-shell {
            flex: 0 0 124px !important;
            width: 124px !important;
            min-width: 124px !important;
            max-width: 124px !important;
            transform: none !important;
            translate: none !important;
        }

        html body.app.sidebar-mini.cx-design-system[data-cx-sidebar-state="expanded"]
        .app-sidebar-modern.cx-app-sidebar,
        html body.app.sidebar-mini.cx-design-system[data-cx-sidebar-state="expanded"]
        .app-sidebar-modern.cx-app-sidebar:hover,
        html body.app.sidebar-mini.cx-design-system[data-cx-sidebar-state="expanded"]
        .app-sidebar-modern.cx-app-sidebar:focus-within,
        html body.app.sidebar-mini.cx-design-system[data-cx-sidebar-state="expanded"]
        .app-sidebar-shell {
            flex: 0 0 270px !important;
            width: 270px !important;
            min-width: 270px !important;
            max-width: 270px !important;
            transform: none !important;
            translate: none !important;
        }

        html body.app.sidebar-mini.cx-design-system[data-cx-sidebar-state="compact"]
        .app-sidebar-modern.cx-app-sidebar :is(.side-header, .main-sidemenu) {
            width: 124px !important;
            min-width: 124px !important;
            max-width: 124px !important;
            flex-basis: 124px !important;
            transition: width .20s ease, min-width .20s ease, max-width .20s ease, flex-basis .20s ease !important;
        }

        html body.app.sidebar-mini.cx-design-system[data-cx-sidebar-state="expanded"]
        .app-sidebar-modern.cx-app-sidebar :is(.side-header, .main-sidemenu) {
            width: 270px !important;
            min-width: 270px !important;
            max-width: 270px !important;
            flex-basis: 270px !important;
            transition: width .20s ease, min-width .20s ease, max-width .20s ease, flex-basis .20s ease !important;
        }

        
        html body.app.sidebar-mini.cx-design-system[data-cx-sidebar-state="expanded"]
        .app-sidebar-modern.cx-app-sidebar .side-header,
        html body.app.sidebar-mini.cx-design-system[data-cx-sidebar-state="expanded"]
        .app-sidebar-modern.cx-app-sidebar .side-header .header-brand1 {
            display: flex !important;
            opacity: 1 !important;
            visibility: visible !important;
        }

        html body.app.sidebar-mini.cx-design-system[data-cx-sidebar-state="expanded"]
        .app-sidebar-modern.cx-app-sidebar .cx-sidebar-brand-expanded-source-v2 {
            display: block !important;
            opacity: 1 !important;
            visibility: visible !important;
        }

        html body.app.sidebar-mini.cx-design-system[data-cx-sidebar-state="expanded"]
        .app-sidebar-modern.cx-app-sidebar .cx-sidebar-brand-compact-source-v2 {
            display: none !important;
            opacity: 0 !important;
            visibility: hidden !important;
        }

        html body.app.sidebar-mini.cx-design-system[data-cx-sidebar-state="compact"]
        .app-sidebar-modern.cx-app-sidebar .cx-sidebar-brand-expanded-source-v2 {
            display: none !important;
            opacity: 0 !important;
            visibility: hidden !important;
        }

        html body.app.sidebar-mini.cx-design-system[data-cx-sidebar-state="compact"]
        .app-sidebar-modern.cx-app-sidebar .cx-sidebar-brand-compact-source-v2 {
            display: block !important;
            opacity: 1 !important;
            visibility: visible !important;
            margin-inline: auto !important;
        }

        
        html body.app.sidebar-mini.cx-design-system[data-cx-sidebar-state="compact"]
        .app-sidebar-modern.cx-app-sidebar :is(
            .side-menu > li,
            .side-menu > li:hover,
            .side-menu__item,
            .side-menu__item:hover,
            .conexgo-sidebar-section-toggle,
            .conexgo-sidebar-section-toggle:hover
        ) {
            transform: none !important;
            translate: none !important;
        }

        
        html body.app.sidebar-mini.cx-design-system[data-cx-sidebar-state="compact"]
        .app-sidebar-modern.cx-app-sidebar
        .side-menu > li:not(.sub-category) > .side-menu__item:is(:hover, :focus-visible)
        > .side-menu__icon::before,
        html body.app.sidebar-mini.cx-design-system[data-cx-sidebar-state="compact"]
        .app-sidebar-modern.cx-app-sidebar
        .side-menu > li.sub-category > .conexgo-sidebar-section-toggle:is(:hover, :focus-visible)
        > .conexgo-sidebar-section-icon::before {
            animation: cx-r171-compact-glyph-hop .22s ease-out 1 !important;
            transform-origin: center !important;
        }
    }

    
    @keyframes cx-r173-compact-glyph-hop {
        0%, 100% { top: 0; }
        45% { top: -3px; }
    }

    @media (min-width: 992px) {
        html body.app.sidebar-mini.cx-design-system[data-cx-sidebar-state="compact"]
        .app-sidebar-modern.cx-app-sidebar
        .side-menu > li:not(.sub-category) > .side-menu__item
        > .side-menu__icon::before {
            position: relative !important;
        }

        html body.app.sidebar-mini.cx-design-system[data-cx-sidebar-state="compact"]
        .app-sidebar-modern.cx-app-sidebar
        .side-menu > li:not(.sub-category) > .side-menu__item:is(:hover, :focus-visible)
        > .side-menu__icon::before {
            animation: cx-r173-compact-glyph-hop .24s ease-out 1 !important;
        }

        
        html body.app.sidebar-mini.cx-design-system[data-cx-sidebar-state="compact"]
        .app-sidebar-modern.cx-app-sidebar
        .side-menu > li.sub-category > .conexgo-sidebar-section-toggle,
        html body.app.sidebar-mini.cx-design-system[data-cx-sidebar-state="compact"]
        .app-sidebar-modern.cx-app-sidebar
        .side-menu > li.sub-category > .conexgo-sidebar-section-toggle:is(:hover, :focus, :focus-visible, :active),
        html body.app.sidebar-mini.cx-design-system[data-cx-sidebar-state="compact"]
        .app-sidebar-modern.cx-app-sidebar
        .side-menu > li.sub-category > .conexgo-sidebar-section-toggle
        > .conexgo-sidebar-section-icon,
        html body.app.sidebar-mini.cx-design-system[data-cx-sidebar-state="compact"]
        .app-sidebar-modern.cx-app-sidebar
        .side-menu > li.sub-category > .conexgo-sidebar-section-toggle
        > .conexgo-sidebar-section-icon::before {
            animation: none !important;
            transform: none !important;
            translate: none !important;
            top: 0 !important;
        }
    }

    
    @media (max-width: 991.98px) {
        html body.app.sidebar-mini.cx-design-system:is(
            [data-cx-sidebar-state="mobile-open"],
            [data-cx-sidebar-state="mobile-closed"]
        )
        .cx-final8-mobile-sidebar-shell {
            position: fixed !important;
            inset: 0 !important;
            width: 100vw !important;
            min-width: 100vw !important;
            max-width: 100vw !important;
            height: 100vh !important;
            height: 100dvh !important;
            max-height: 100dvh !important;
            margin: 0 !important;
            padding: 0 !important;
            overflow: visible !important;
            z-index: 2147481000 !important;
            pointer-events: none !important;
        }

        html body.app.sidebar-mini.cx-design-system:is(
            [data-cx-sidebar-state="mobile-open"],
            [data-cx-sidebar-state="mobile-closed"]
        )
        .cx-final8-mobile-sidebar-drawer,
        html body.app.sidebar-mini.cx-design-system:is(
            [data-cx-sidebar-state="mobile-open"],
            [data-cx-sidebar-state="mobile-closed"]
        )
        .cx-final8-mobile-sidebar-drawer:hover,
        html body.app.sidebar-mini.cx-design-system:is(
            [data-cx-sidebar-state="mobile-open"],
            [data-cx-sidebar-state="mobile-closed"]
        )
        .cx-final8-mobile-sidebar-drawer:focus-within {
            position: fixed !important;
            inset: 0 auto 0 0 !important;
            left: 0 !important;
            right: auto !important;
            flex: 0 0 auto !important;
            width: min(286px, calc(100vw - 56px)) !important;
            min-width: min(286px, calc(100vw - 56px)) !important;
            max-width: min(286px, calc(100vw - 56px)) !important;
            height: 100vh !important;
            height: 100dvh !important;
            min-height: 100dvh !important;
            max-height: 100dvh !important;
            margin: 0 !important;
            padding: 0 !important;
            display: flex !important;
            flex-direction: column !important;
            overflow: hidden !important;
            background: #ffffff !important;
            border-right: 1px solid #dce5ec !important;
            box-shadow: 10px 0 28px rgba(31, 61, 89, .18) !important;
            translate: none !important;
            scale: 1 !important;
            transition:
                transform .20s ease,
                opacity .12s ease,
                visibility .12s ease !important;
            z-index: 2147481001 !important;
        }

        html body.app.sidebar-mini.cx-design-system[data-cx-sidebar-state="mobile-closed"]
        .cx-final8-mobile-sidebar-drawer,
        html body.app.sidebar-mini.cx-design-system[data-cx-sidebar-state="mobile-closed"]
        .cx-final8-mobile-sidebar-drawer:hover,
        html body.app.sidebar-mini.cx-design-system[data-cx-sidebar-state="mobile-closed"]
        .cx-final8-mobile-sidebar-drawer:focus-within {
            transform: translate3d(calc(-100% - 32px), 0, 0) !important;
            opacity: 0 !important;
            visibility: hidden !important;
            pointer-events: none !important;
        }

        html body.app.sidebar-mini.cx-design-system[data-cx-sidebar-state="mobile-open"]
        .cx-final8-mobile-sidebar-drawer,
        html body.app.sidebar-mini.cx-design-system[data-cx-sidebar-state="mobile-open"]
        .cx-final8-mobile-sidebar-drawer:hover,
        html body.app.sidebar-mini.cx-design-system[data-cx-sidebar-state="mobile-open"]
        .cx-final8-mobile-sidebar-drawer:focus-within {
            transform: translate3d(0, 0, 0) !important;
            opacity: 1 !important;
            visibility: visible !important;
            pointer-events: auto !important;
        }

        html body.app.sidebar-mini.cx-design-system:is(
            [data-cx-sidebar-state="mobile-open"],
            [data-cx-sidebar-state="mobile-closed"]
        )
        .cx-final8-mobile-sidebar-drawer .side-header,
        html body.app.sidebar-mini.cx-design-system:is(
            [data-cx-sidebar-state="mobile-open"],
            [data-cx-sidebar-state="mobile-closed"]
        )
        .cx-final8-mobile-sidebar-drawer:hover .side-header {
            flex: 0 0 64px !important;
            width: 100% !important;
            min-width: 0 !important;
            max-width: 100% !important;
            height: 64px !important;
            min-height: 64px !important;
            max-height: 64px !important;
            margin: 0 !important;
            padding: 8px 10px 8px 12px !important;
            display: flex !important;
            align-items: center !important;
            justify-content: space-between !important;
            overflow: hidden !important;
        }

        html body.app.sidebar-mini.cx-design-system:is(
            [data-cx-sidebar-state="mobile-open"],
            [data-cx-sidebar-state="mobile-closed"]
        )
        .cx-final8-mobile-sidebar-drawer .side-header .header-brand1 {
            flex: 1 1 auto !important;
            width: auto !important;
            min-width: 0 !important;
            max-width: calc(100% - 48px) !important;
            height: 48px !important;
            min-height: 48px !important;
            max-height: 48px !important;
            margin: 0 !important;
            padding: 0 !important;
            display: flex !important;
            align-items: center !important;
            justify-content: flex-start !important;
            opacity: 1 !important;
            visibility: visible !important;
            overflow: hidden !important;
        }

        html body.app.sidebar-mini.cx-design-system:is(
            [data-cx-sidebar-state="mobile-open"],
            [data-cx-sidebar-state="mobile-closed"]
        )
        .cx-final8-mobile-sidebar-drawer .cx-sidebar-brand-expanded-source-v2 {
            display: block !important;
            width: auto !important;
            max-width: 138px !important;
            height: auto !important;
            max-height: 42px !important;
            margin: 0 !important;
            opacity: 1 !important;
            visibility: visible !important;
            object-fit: contain !important;
            transform: none !important;
        }

        html body.app.sidebar-mini.cx-design-system:is(
            [data-cx-sidebar-state="mobile-open"],
            [data-cx-sidebar-state="mobile-closed"]
        )
        .cx-final8-mobile-sidebar-drawer .cx-sidebar-brand-compact-source-v2 {
            display: none !important;
            width: 0 !important;
            height: 0 !important;
            opacity: 0 !important;
            visibility: hidden !important;
        }

        html body.app.sidebar-mini.cx-design-system:is(
            [data-cx-sidebar-state="mobile-open"],
            [data-cx-sidebar-state="mobile-closed"]
        )
        .cx-final8-mobile-sidebar-drawer .app-sidebar-mobile-close {
            flex: 0 0 38px !important;
            width: 38px !important;
            min-width: 38px !important;
            height: 38px !important;
            min-height: 38px !important;
            margin: 0 !important;
            display: inline-flex !important;
            align-items: center !important;
            justify-content: center !important;
            opacity: 1 !important;
            visibility: visible !important;
            pointer-events: auto !important;
        }

        html body.app.sidebar-mini.cx-design-system:is(
            [data-cx-sidebar-state="mobile-open"],
            [data-cx-sidebar-state="mobile-closed"]
        )
        .cx-final8-mobile-sidebar-drawer .main-sidemenu {
            flex: 1 1 auto !important;
            width: 100% !important;
            min-width: 0 !important;
            max-width: 100% !important;
            height: auto !important;
            min-height: 0 !important;
            max-height: calc(100dvh - 64px) !important;
            margin: 0 !important;
            padding: 8px 8px calc(18px + env(safe-area-inset-bottom, 0px)) !important;
            overflow-x: hidden !important;
            overflow-y: auto !important;
            overscroll-behavior: contain !important;
            scrollbar-gutter: stable !important;
            -webkit-overflow-scrolling: touch !important;
            transform: none !important;
            translate: none !important;
        }

        html body.app.sidebar-mini.cx-design-system:is(
            [data-cx-sidebar-state="mobile-open"],
            [data-cx-sidebar-state="mobile-closed"]
        )
        .cx-final8-mobile-sidebar-drawer .side-menu {
            width: 100% !important;
            min-width: 0 !important;
            max-width: 100% !important;
            margin: 0 !important;
            padding: 0 !important;
            overflow: visible !important;
        }

        html body.app.sidebar-mini.cx-design-system:is(
            [data-cx-sidebar-state="mobile-open"],
            [data-cx-sidebar-state="mobile-closed"]
        )
        .cx-final8-mobile-sidebar-drawer .sub-category {
            width: 100% !important;
            min-width: 0 !important;
            max-width: 100% !important;
            height: auto !important;
            min-height: 52px !important;
            max-height: none !important;
            margin: 8px 0 5px !important;
            padding: 0 !important;
            display: block !important;
            opacity: 1 !important;
            visibility: visible !important;
            overflow: visible !important;
            transform: none !important;
            translate: none !important;
        }

        html body.app.sidebar-mini.cx-design-system:is(
            [data-cx-sidebar-state="mobile-open"],
            [data-cx-sidebar-state="mobile-closed"]
        )
        .cx-final8-mobile-sidebar-drawer .conexgo-sidebar-section-toggle {
            width: 100% !important;
            min-width: 0 !important;
            max-width: 100% !important;
            height: auto !important;
            min-height: 52px !important;
            max-height: none !important;
            margin: 0 !important;
            padding: 0 12px !important;
            display: grid !important;
            grid-template-columns: 42px minmax(0, 1fr) 24px !important;
            column-gap: 8px !important;
            align-items: center !important;
            justify-content: stretch !important;
            text-align: left !important;
            opacity: 1 !important;
            visibility: visible !important;
            pointer-events: auto !important;
            transform: none !important;
            translate: none !important;
            animation: none !important;
        }

        html body.app.sidebar-mini.cx-design-system:is(
            [data-cx-sidebar-state="mobile-open"],
            [data-cx-sidebar-state="mobile-closed"]
        )
        .cx-final8-mobile-sidebar-drawer .conexgo-sidebar-section-icon {
            grid-column: 1 !important;
            width: 38px !important;
            min-width: 38px !important;
            max-width: 38px !important;
            height: 38px !important;
            min-height: 38px !important;
            max-height: 38px !important;
            margin: 0 !important;
            display: inline-flex !important;
            align-items: center !important;
            justify-content: center !important;
            justify-self: start !important;
            opacity: 1 !important;
            visibility: visible !important;
            transform: none !important;
            translate: none !important;
            animation: none !important;
        }

        html body.app.sidebar-mini.cx-design-system:is(
            [data-cx-sidebar-state="mobile-open"],
            [data-cx-sidebar-state="mobile-closed"]
        )
        .cx-final8-mobile-sidebar-drawer .conexgo-sidebar-section-title {
            grid-column: 2 !important;
            display: block !important;
            width: auto !important;
            min-width: 0 !important;
            max-width: 100% !important;
            max-height: none !important;
            margin: 0 !important;
            padding: 0 !important;
            opacity: 1 !important;
            visibility: visible !important;
            pointer-events: auto !important;
            white-space: nowrap !important;
            overflow: hidden !important;
            text-overflow: ellipsis !important;
            transform: none !important;
        }

        html body.app.sidebar-mini.cx-design-system:is(
            [data-cx-sidebar-state="mobile-open"],
            [data-cx-sidebar-state="mobile-closed"]
        )
        .cx-final8-mobile-sidebar-drawer .conexgo-sidebar-section-chevron {
            grid-column: 3 !important;
            width: 24px !important;
            min-width: 24px !important;
            max-width: 24px !important;
            height: 28px !important;
            margin: 0 !important;
            display: inline-grid !important;
            place-items: center !important;
            justify-self: end !important;
            opacity: 1 !important;
            visibility: visible !important;
            pointer-events: auto !important;
        }

        html body.app.sidebar-mini.cx-design-system:is(
            [data-cx-sidebar-state="mobile-open"],
            [data-cx-sidebar-state="mobile-closed"]
        )
        .cx-final8-mobile-sidebar-drawer .conexgo-sidebar-section-item {
            width: 100% !important;
            min-width: 0 !important;
            max-width: 100% !important;
        }

        html body.app.sidebar-mini.cx-design-system:is(
            [data-cx-sidebar-state="mobile-open"],
            [data-cx-sidebar-state="mobile-closed"]
        )
        .cx-final8-mobile-sidebar-drawer .side-menu__item {
            width: 100% !important;
            min-width: 0 !important;
            max-width: 100% !important;
            height: auto !important;
            min-height: 50px !important;
            max-height: none !important;
            margin: 3px 0 !important;
            padding: 6px 8px !important;
            display: grid !important;
            grid-template-columns: 42px minmax(0, 1fr) 22px !important;
            column-gap: 8px !important;
            align-items: center !important;
            justify-content: stretch !important;
            overflow: hidden !important;
            transform: none !important;
            translate: none !important;
        }

        html body.app.sidebar-mini.cx-design-system:is(
            [data-cx-sidebar-state="mobile-open"],
            [data-cx-sidebar-state="mobile-closed"]
        )
        .cx-final8-mobile-sidebar-drawer .side-menu__icon {
            grid-column: 1 !important;
            width: 40px !important;
            min-width: 40px !important;
            max-width: 40px !important;
            height: 40px !important;
            min-height: 40px !important;
            max-height: 40px !important;
            margin: 0 !important;
            padding: 0 !important;
            display: inline-flex !important;
            align-items: center !important;
            justify-content: center !important;
            justify-self: start !important;
            transform: none !important;
            translate: none !important;
        }

        html body.app.sidebar-mini.cx-design-system:is(
            [data-cx-sidebar-state="mobile-open"],
            [data-cx-sidebar-state="mobile-closed"]
        )
        .cx-final8-mobile-sidebar-drawer .side-menu__label {
            position: static !important;
            inset: auto !important;
            grid-column: 2 !important;
            display: block !important;
            flex: 1 1 auto !important;
            width: auto !important;
            min-width: 0 !important;
            max-width: 100% !important;
            max-height: none !important;
            margin: 0 !important;
            padding: 0 !important;
            color: inherit !important;
            opacity: 1 !important;
            visibility: visible !important;
            pointer-events: auto !important;
            white-space: normal !important;
            overflow: hidden !important;
            text-overflow: ellipsis !important;
            overflow-wrap: anywhere !important;
            transform: none !important;
        }

        html body.app.sidebar-mini.cx-design-system:is(
            [data-cx-sidebar-state="mobile-open"],
            [data-cx-sidebar-state="mobile-closed"]
        )
        .cx-final8-mobile-sidebar-drawer .side-menu__item > .angle {
            position: static !important;
            inset: auto !important;
            grid-column: 3 !important;
            width: 22px !important;
            min-width: 22px !important;
            max-width: 22px !important;
            height: auto !important;
            margin: 0 !important;
            padding: 0 !important;
            display: inline-flex !important;
            align-items: center !important;
            justify-content: center !important;
            justify-self: end !important;
            opacity: 1 !important;
            visibility: visible !important;
            pointer-events: auto !important;
            transform: none !important;
        }

        
        html body.app.sidebar-mini.cx-design-system:is(
            [data-cx-sidebar-state="mobile-open"],
            [data-cx-sidebar-state="mobile-closed"]
        )
        .main-content.app-content {
            width: 100% !important;
            max-width: 100% !important;
            margin-left: 0 !important;
            margin-right: 0 !important;
            transform: none !important;
            translate: none !important;
        }

        html body.app.sidebar-mini.cx-design-system:is(
            [data-cx-sidebar-state="mobile-open"],
            [data-cx-sidebar-state="mobile-closed"]
        )
        .app-header.header {
            width: 100% !important;
            max-width: 100% !important;
            margin-left: 0 !important;
            margin-right: 0 !important;
            padding-left: 0 !important;
            transform: none !important;
            translate: none !important;
        }
    }

    @media (max-width: 575.98px) {
        html body.app.sidebar-mini.cx-design-system:is(
            [data-cx-sidebar-state="mobile-open"],
            [data-cx-sidebar-state="mobile-closed"]
        )
        .cx-final8-mobile-sidebar-drawer,
        html body.app.sidebar-mini.cx-design-system:is(
            [data-cx-sidebar-state="mobile-open"],
            [data-cx-sidebar-state="mobile-closed"]
        )
        .cx-final8-mobile-sidebar-drawer:hover,
        html body.app.sidebar-mini.cx-design-system:is(
            [data-cx-sidebar-state="mobile-open"],
            [data-cx-sidebar-state="mobile-closed"]
        )
        .cx-final8-mobile-sidebar-drawer:focus-within {
            width: min(278px, calc(100vw - 44px)) !important;
            min-width: min(278px, calc(100vw - 44px)) !important;
            max-width: min(278px, calc(100vw - 44px)) !important;
        }
    }

@keyframes cx-alertqueue-permanent-bounce-v72 {
        0%, 18%, 52%, 78%, 100% {
            transform: translate3d(0, 0, 0);
        }

        36%, 40% {
            transform: translate3d(0, -9px, 0);
        }

        66% {
            transform: translate3d(0, -4px, 0);
        }

        90% {
            transform: translate3d(0, -1px, 0);
        }
    }

    .conexgo-header-alerts .cx-alert-permanent-bounce-v72 {
        width: 24px;
        height: 24px;
        display: inline-grid;
        place-items: center;
        transform-origin: center bottom;
        overflow: visible;
    }

    .conexgo-header-alerts .cx-alert-permanent-bounce-v72.is-active {
        animation-name: cx-alertqueue-permanent-bounce-v72 !important;
        animation-duration: .82s !important;
        animation-timing-function: cubic-bezier(.28, .84, .42, 1) !important;
        animation-iteration-count: infinite !important;
        animation-delay: 0s !important;
        animation-fill-mode: both !important;
        will-change: transform !important;
    }

    .conexgo-header-alerts .cx-alert-permanent-bounce-v72:not(.is-active) {
        animation: none !important;
        transform: none !important;
        will-change: auto !important;
    }

    
    .conexgo-header-alerts .conexgo-alert-trigger.has-alerts .alertqueue-badge,
    .conexgo-header-alerts .conexgo-alert-dropdown .conexgo-alert-header-count {
        background: #cc3657 !important;
        border-color: #cc3657 !important;
        color: #ffffff !important;
    }

    .conexgo-header-alerts .conexgo-alert-dropdown .conexgo-alert-header-icon {
        color: #cc3657 !important;
        border-color: rgba(204, 54, 87, .34) !important;
        background: rgba(204, 54, 87, .10) !important;
    }

    .conexgo-header-alerts .conexgo-alert-dropdown .conexgo-alert-header-icon i {
        color: #cc3657 !important;
    }

.cx-group-member-row {
    cursor: pointer;
}

.conexgo-header-alerts .conexgo-alert-icon {
    color: #cc3657 !important;
    animation: none !important;
    transform: none !important;
}

html,
body {
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}

h1:focus {
    outline: none;
}

a,
.btn-link {
    color: #0071c1;
}

.btn-primary {
    color: #fff !important;
    
    background-color: #2369ca;
    border-color: #1861ac;
}

.btn-primary:is(:hover, :focus, :focus-visible, :active) {
    color: #fff !important;
}

.btn-primary:is(:hover, :focus, :focus-visible, :active) :is(i, span, svg) {
    color: inherit !important;
}

.center {
    height: 200px;
    position: relative;
}

    .center p {
        margin: 0;
        position: absolute;
        top: 50%;
        left: 50%;
        -ms-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
    }

        .center p img {
            padding-left: 20px;
        }

.content {
    padding-top: 1.1rem;
}

.valid.modified:not([type="checkbox"]) {
    outline: 1px solid #26b050;
}

.invalid {
    outline: 1px solid red;
}

.validation-message {
    color: red;
}

#blazor-error-ui {
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

    #blazor-error-ui .dismiss {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }

.blazor-error-boundary {
    background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTYiIGhlaWdodD0iNDkiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIG92ZXJmbG93PSJoaWRkZW4iPjxkZWZzPjxjbGlwUGF0aCBpZD0iY2xpcDAiPjxyZWN0IHg9IjIzNSIgeT0iNTEiIHdpZHRoPSI1NiIgaGVpZ2h0PSI0OSIvPjwvY2xpcFBhdGg+PC9kZWZzPjxnIGNsaXAtcGF0aD0idXJsKCNjbGlwMCkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0yMzUgLTUxKSI+PHBhdGggZD0iTTI2My41MDYgNTFDMjY0LjcxNyA1MSAyNjUuODEzIDUxLjQ4MzcgMjY2LjYwNiA1Mi4yNjU4TDI2Ny4wNTIgNTIuNzk4NyAyNjcuNTM5IDUzLjYyODMgMjkwLjE4NSA5Mi4xODMxIDI5MC41NDUgOTIuNzk1IDI5MC42NTYgOTIuOTk2QzI5MC44NzcgOTMuNTEzIDI5MSA5NC4wODE1IDI5MSA5NC42NzgyIDI5MSA5Ny4wNjUxIDI4OS4wMzggOTkgMjg2LjYxNyA5OUwyNDAuMzgzIDk5QzIzNy45NjMgOTkgMjM2IDk3LjA2NTEgMjM2IDk0LjY3ODIgMjM2IDk0LjM3OTkgMjM2LjAzMSA5NC4wODg2IDIzNi4wODkgOTMuODA3MkwyMzYuMzM4IDkzLjAxNjIgMjM2Ljg1OCA5Mi4xMzE0IDI1OS40NzMgNTMuNjI5NCAyNTkuOTYxIDUyLjc5ODUgMjYwLjQwNyA1Mi4yNjU4QzI2MS4yIDUxLjQ4MzcgMjYyLjI5NiA1MSAyNjMuNTA2IDUxWk0yNjMuNTg2IDY2LjAxODNDMjYwLjczNyA2Ni4wMTgzIDI1OS4zMTMgNjcuMTI0NSAyNTkuMzEzIDY5LjMzNyAyNTkuMzEzIDY5LjYxMDIgMjU5LjMzMiA2OS44NjA4IDI1OS4zNzEgNzAuMDg4N0wyNjEuNzk1IDg0LjAxNjEgMjY1LjM4IDg0LjAxNjEgMjY3LjgyMSA2OS43NDc1QzI2Ny44NiA2OS43MzA5IDI2Ny44NzkgNjkuNTg3NyAyNjcuODc5IDY5LjMxNzkgMjY3Ljg3OSA2Ny4xMTgyIDI2Ni40NDggNjYuMDE4MyAyNjMuNTg2IDY2LjAxODNaTTI2My41NzYgODYuMDU0N0MyNjEuMDQ5IDg2LjA1NDcgMjU5Ljc4NiA4Ny4zMDA1IDI1OS43ODYgODkuNzkyMSAyNTkuNzg2IDkyLjI4MzcgMjYxLjA0OSA5My41Mjk1IDI2My41NzYgOTMuNTI5NSAyNjYuMTE2IDkzLjUyOTUgMjY3LjM4NyA5Mi4yODM3IDI2Ny4zODcgODkuNzkyMSAyNjcuMzg3IDg3LjMwMDUgMjY2LjExNiA4Ni4wNTQ3IDI2My41NzYgODYuMDU0N1oiIGZpbGw9IiNGRkU1MDAiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPjwvZz48L3N2Zz4=) no-repeat 1rem/1.8rem, #b32121;
    padding: 1rem 1rem 1rem 3.7rem;
    color: white;
}

    .blazor-error-boundary::after {
        content: "An error has occurred.";
    }

.position-bottomcenter {
    bottom: 2rem;
    left: 50%;
    margin-left: -15rem;
    margin: auto;
    top: 50%;
}

.sort-link {
    cursor: pointer;
    color: blue;
    text-decoration: underline;
}

.addressform {
    margin-bottom: 0rem !important;
}

.dashboard {
    border-bottom: 1px solid rgba(0, 0, 0, 0.04);
    margin: 0;
    overflow: hidden;
    padding: 5px 0 5px 5px;
    width: 100%;
    background: none repeat scroll 0 0 #dddddd;
    border-top: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
}

    .dashboard li {
        list-style-type: none;
        float: left;
        padding-left: 10px;
        padding-right: 10px;
        border-left: 1px solid #000;
    }

        .dashboard li.spacer {
            list-style-type: none;
            float: left;
            width: 50px;
            border: none;
        }

    .dashboard a {
        display: block;
        background-image: url("");
        background-repeat: no-repeat;
        background-position: right;
        padding-right: 0;
        text-decoration: none;
        color: #000;
        float: left;
        margin-right: 8px;
    }

.dashboard_mobile {
    height: 40px;
    margin: 0;
    overflow: hidden;
    padding: 5px 0 0 5px;
    width: 100%;
    background: none repeat scroll 0 0 #eeeeee;
    font-size: 9pt;
}

    .dashboard_mobile li {
        list-style-type: none;
        float: left;
        padding-left: 10px;
        padding-right: 10px;
        border-left: 1px solid #000;
    }

        .dashboard_mobile li.spacer {
            list-style-type: none;
            float: left;
            width: 50px;
            border: none;
        }

    .dashboard_mobile a {
        display: block;
        background-image: url("");
        background-repeat: no-repeat;
        background-position: right;
        padding-right: 0;
        text-decoration: none;
        color: #000;
        float: left;
    }

.blazored-toast-container {
    z-index: 200;
}

#clock li,
#clock2 li {
    display: inline;
    color: #333333;
    font-size: 11px;
    font-weight: bold;
}

#clock,
#clock2 {
    padding-left: 0;
    margin: 5px 0;
}

.title {
    color: #333333;
    font-size: 11px;
    font-weight: bold;
    margin: 0 10px;
}

.running-text {
    background: none repeat scroll 0 0 #eee;
    border: 1px solid rgba(0, 0, 0, 0.2);
    border-radius: 30px;
    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.1);
    color: #ffffff;
    padding: 10px 20px 10px 20px;
    color: black;
}

@media (min-width: 768px) {
    .running-text {
        margin-left: 150px;
    }
}

@media (max-width: 768px) {
    .running-text {
        font-size: 9pt;
    }
}

@font-face {
    font-family: "BebasNeueRegular";
    src: url("../font/bebasneue-webfont.eot");
    src: url("../font/bebasneue-webfont.eot?#iefix") format("embedded-opentype"), url("../font/bebasneue-webfont.woff") format("woff"), url("../font/bebasneue-webfont.ttf") format("truetype"), url("../font/bebasneue-webfont.svg#bebas_neueregular") format("svg");
    font-weight: normal;
    font-style: normal;
}

.clock {
    position: fixed;
    top: 15px;
    right: 10px;
}

.date-top {
    box-shadow: 1px 0 0 rgba(255, 255, 255, 0.1);
    float: left;
    padding-right: 15px;
}

    .date-top > li {
    }

#nt-title {
    margin: 0;
}

    #nt-title li {
        list-style: none outside none;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

.navbar-left {
    float: left !important;
}

.digital {
    box-shadow: 1px 0 0 rgba(255, 255, 255, 0.1);
    float: left;
    padding-right: 15px;
}

    .digital li {
        display: inline;
    }

.meridiem {
    font-size: 10px;
}

.tickercontainer {
    
    background: rgba(0, 0, 0, 1);
    width: 100%;
    height: 45px;
    margin: 0;
    padding: 0;
    overflow: hidden;
    position: fixed;
    bottom: 0;
    z-index: 999;
}

    .tickercontainer .mask {
        
        position: relative;
        padding-left: 10px;
        padding-right: 10px;
        top: 13px;
        height: 20px;
        width: 100%;
        overflow: hidden;
    }

.features {
    list-style-type: circle;
    padding-left: 20px;
}

.none-indicator {
    text-align: center;
    margin-top: 20px;
    padding: 10px;
    background-color: #eeeeee;
}

a.tip {
    
    text-decoration: none;
}

    a.tip:hover {
        cursor: help;
        position: relative;
    }

    a.tip span {
        display: none;
    }

    a.tip:hover span {
        border: #c0c0c0 1px dotted;
        padding: 5px 20px 5px 5px;
        display: block;
        z-index: 100;
        
        left: 0px;
        margin: 10px;
        width: 350px;
        position: absolute;
        top: 10px;
        text-decoration: none;
    }

.battery-full {
    color: green;
}

.battery-warning {
    color: orange;
}

.battery-low {
    color: red;
}

.dashboard-item {
    font-size: 9pt;
    height: 26px;
    text-align: center;
}

@media (max-width: 768px) {
    .dashboard-item {
        display: none;
    }
}

.language {
    text-align: center;
    padding-top: 10px;
}

@media (max-width: 768px) {
    .language {
    }
}

.icon-badge {
    position: relative;
    display: inline-block; 
}

.operator-badge {
    position: absolute;
    top: -5px;
    right: -2px;
    color: white;
    padding: 2px 5px;
    border-radius: 50%;
    font-size: 0.5em; 
}

.alertqueue-badge {
    position: absolute;
    top: -5px;
    right: -2px;
    background-color: red;
    color: white;
    padding: 2px 5px;
    border-radius: 50%;
    font-size: 0.5em; 
}

.notification-badge {
    position: absolute;
    top: -5px;
    right: -2px;
    background-color: red;
    color: white;
    padding: 2px 5px;
    border-radius: 50%;
    font-size: 0.5em; 
}

.callcenter-badge {
    background-color: red;
    color: white;
    padding: 2px 5px;
    margin-right: 5px;
    border-radius: 50%;
    font-size: 0.5em; 
}

#container {
    width: 100%;
    height: 450px;
    margin: 0;
    padding: 0;
}

.div-info {
    font-family: Arial, sans-serif;
    line-height: 1.3;
}

.info-title {
    margin: 0 0 6px 0;
    font-size: 16px;
    font-weight: bold;
    color: #2a5d84;
    border-bottom: 1px solid #ccc;
    padding-bottom: 4px;
}

.custom-infowindow,
.custom-infowindow * {
    cursor: default !important;
}

.signal {
    display: flex;
    align-items: flex-end;
    gap: 2px;
    width: 35px;
    user-select: none;
}

    .signal .bar {
        width: 14%;
        background: #bbb;
        border-radius: 2px 2px 0 0;
        transition: background 0.18s, transform 0.12s;
        transform-origin: bottom center;
    }
        
        .signal .bar:nth-child(1) {
            height: 5px;
        }

        .signal .bar:nth-child(2) {
            height: 10px;
        }

        .signal .bar:nth-child(3) {
            height: 15px;
        }

        .signal .bar:nth-child(4) {
            height: 20px;
        }

        .signal .bar:nth-child(5) {
            height: 25px;
        }

        
        .signal .bar.active {
            background: linear-gradient(180deg, #00c853, #00796b);
            transform: scaleY(1.05);
            box-shadow: 0 1px 4px rgba(0, 0, 0, 0.12);
        }

.blur {
    backdrop-filter: blur(10px);
}

.dialog-background {
}

.dialog-background-title {
    background: #0562a9;
    color: var(--mud-palette-white);
}

.dialog-background-surface {
    background: rgba(var(--mud-palette-surface-rgb), 0.75);
}

.m3-dialog.mud-dialog {
    transform-origin: center;
    animation: m3-dialog-enter 260ms cubic-bezier(0.2, 0, 0, 1);
    background-color: gray;
    border-radius: 10px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3), 0 2px 6px rgba(0, 0, 0, 0.15);
}

    
    .m3-dialog.mud-dialog.mud-dialog-closing {
        animation: m3-dialog-exit 180ms cubic-bezier(0.4, 0, 1, 1);
    }

.mud-overlay-scrim {
    animation: m3-scrim-enter 260ms cubic-bezier(0.2, 0, 0, 1);
}

    .mud-overlay-scrim.mud-overlay-leaving {
        animation: m3-scrim-exit 180ms cubic-bezier(0.4, 0, 1, 1);
    }

@keyframes m3-dialog-enter {
    from {
        opacity: 0;
        transform: scale(0.92) translateY(8px);
    }

    to {
        opacity: 1;
        transform: scale(1) translateY(0);
    }
}

@keyframes m3-dialog-exit {
    from {
        opacity: 1;
        transform: scale(1) translateY(0);
    }

    to {
        opacity: 0;
        transform: scale(0.92) translateY(8px);
    }
}

@keyframes m3-scrim-enter {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@keyframes m3-scrim-exit {
    from {
        opacity: 1;
    }

    to {
        opacity: 0;
    }
}

.permissions {
    display: flex;
    justify-content: space-between; 
    align-items: flex-start; 
}

.permission-item {
    display: flex;
    flex-direction: column;
    align-items: center; 
    width: 50px;
}

@media (min-width: 992px) {
    html body .mud-dialog.cx-dialog-root.cx-standard-form-dialog,
    html body .mud-dialog.cx-dialog-root.cx-device-config-dialog,
    html body .mud-dialog.cx-dialog-root.cx-r8-account-email {
        width: min(1040px, calc(100vw - 48px)) !important;
        max-width: min(1040px, calc(100vw - 48px)) !important;
    }

    html body .mud-dialog.cx-dialog-root:is( .cx-r1-device-addedit, .cx-r1-device-geofence, .cx-r1-device-message, .cx-r1-account-addedit, .cx-r1-devicemodel-addedit, .cx-terms-dialog, .cx-report-subscribe-dialog ) {
        width: min(1180px, calc(100vw - 48px)) !important;
        max-width: min(1180px, calc(100vw - 48px)) !important;
    }
}

html body .mud-dialog :is( .cx-device-config-last-updated, .device-dot-last-updated, .device-geofence-last-updated ) {
    border: 1px solid #d6e0ea !important;
    border-left: 4px solid #315879 !important;
    border-inline-start: 4px solid #315879 !important;
    border-radius: 10px !important;
    background: #f2f7fb !important;
    color: #526170 !important;
    box-shadow: none !important;
}

html body .mud-dialog .device-dot-last-updated {
    width: min(100%, var(--cx-device-modal-content-width, 960px)) !important;
    min-width: 0 !important;
    margin: 18px auto 0 !important;
    padding: 14px 16px !important;
    display: grid !important;
    grid-template-columns: 34px minmax(0, 1fr) !important;
    align-items: start !important;
    gap: 11px !important;
}

html body .mud-dialog .device-dot-last-updated-icon {
    width: 32px !important;
    height: 32px !important;
    display: grid !important;
    place-items: center !important;
    border-radius: 8px !important;
    background: #e2edf6 !important;
    color: #315879 !important;
}

html body .mud-dialog .device-dot-last-updated-label,
html body .mud-dialog .device-geofence-last-updated-label {
    color: #2c4c6c !important;
    font-size: .78rem !important;
    font-weight: 800 !important;
    letter-spacing: .04em !important;
    text-transform: uppercase !important;
}

html body .mud-dialog .device-dot-last-updated-value:not(.cx-r1878-last-updated-date),
html body .mud-dialog .device-geofence-last-updated-value:not(.cx-r1878-last-updated-date) {
    margin-top: 3px !important;
    color: #344054 !important;
    font-size: .9rem !important;
    font-weight: 650 !important;
}

html body .mud-dialog .device-dot-last-updated-by,
html body .mud-dialog .device-geofence-last-updated-by {
    margin-top: 2px !important;
    color: #667585 !important;
    font-size: .84rem !important;
}

html body .mud-dialog .device-geofence-last-updated {
    width: 100% !important;
    min-width: 0 !important;
    margin: 16px 0 0 !important;
    padding: 14px 16px !important;
}

html body .conexgo-pagedlist-table .dropdown-menu,
html body .account-list-cell-name .dropdown-menu,
html body .device-list-action-menu,
html body .conexgo-row-action-menu {
    min-width: 246px !important;
    max-width: min(310px, calc(100vw - 28px)) !important;
    max-height: var(--cx-row-menu-max-height, min(360px, calc(100dvh - 96px))) !important;
    padding: 6px !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    overscroll-behavior: contain !important;
    border: 1px solid #c7d6e2 !important;
    border-radius: 9px !important;
    background: #ffffff !important;
    color: #2c4c6c !important;
    box-shadow: 0 12px 28px rgba(31, 61, 89, .16) !important;
    scrollbar-width: thin !important;
    scrollbar-color: #9eafbd transparent !important;
    z-index: 2800 !important;
}

    html body .conexgo-pagedlist-table .dropdown-menu .dropdown-item,
    html body .account-list-cell-name .dropdown-menu .dropdown-item,
    html body .device-list-action-menu .dropdown-item,
    html body .conexgo-row-action-menu .dropdown-item {
        min-height: 38px !important;
        margin: 0 !important;
        padding: 8px 10px !important;
        display: flex !important;
        align-items: center !important;
        gap: 9px !important;
        border-radius: 6px !important;
        background: transparent !important;
        color: #2c4c6c !important;
        font-size: 13.5px !important;
        font-weight: 650 !important;
        line-height: 1.2 !important;
        text-decoration: none !important;
    }

        html body .conexgo-pagedlist-table .dropdown-menu .dropdown-item > :is(i, span[class*="fa"]),
        html body .account-list-cell-name .dropdown-menu .dropdown-item > :is(i, span[class*="fa"]),
        html body .device-list-action-menu .dropdown-item > :is(i, span[class*="fa"]),
        html body .conexgo-row-action-menu .dropdown-item > :is(i, span[class*="fa"]) {
            width: 18px !important;
            min-width: 18px !important;
            padding-right: 0 !important;
            color: #537594 !important;
            font-size: 13px !important;
            text-align: center !important;
        }

        html body .conexgo-pagedlist-table .dropdown-menu .dropdown-item:hover,
        html body .conexgo-pagedlist-table .dropdown-menu .dropdown-item:focus-visible,
        html body .account-list-cell-name .dropdown-menu .dropdown-item:hover,
        html body .account-list-cell-name .dropdown-menu .dropdown-item:focus-visible,
        html body .device-list-action-menu .dropdown-item:hover,
        html body .device-list-action-menu .dropdown-item:focus-visible,
        html body .conexgo-row-action-menu .dropdown-item:hover,
        html body .conexgo-row-action-menu .dropdown-item:focus-visible {
            background: #edf4f8 !important;
            color: #2c4c6c !important;
            outline: none !important;
            transform: none !important;
        }

html body :is( .conexgo-pagedlist-table .dropdown-menu, .account-list-cell-name .dropdown-menu, .device-list-action-menu, .conexgo-row-action-menu ) .dropdown-item.text-danger {
    color: #bd3448 !important;
}

html body .device-list-action-group,
html body .account-list-cell-name .conexgo-row-action-group {
    position: relative !important;
    overflow: visible !important;
}

html body .device-list-action-group {
    width: min(100%, 380px) !important;
    min-width: min(330px, 100%) !important;
}

html body .account-list-cell-name .conexgo-row-action-group {
    width: 100% !important;
    min-width: 270px !important;
}

html body .device-list-action-group .device-list-name-button,
html body .account-list-cell-name .account-list-name-button {
    min-width: 0 !important;
    min-height: 48px !important;
    height: 48px !important;
    border-color: #315879 !important;
    background: #ffffff !important;
    color: #2c4c6c !important;
    font-size: 14px !important;
    font-weight: 650 !important;
    box-shadow: none !important;
    transform: none !important;
    filter: none !important;
}

    html body .device-list-action-group .device-list-name-button:is(:hover, :focus-visible, :active),
    html body .account-list-cell-name .account-list-name-button:is(:hover, :focus-visible, :active) {
        border-color: #315879 !important;
        background: #ffffff !important;
        color: #2c4c6c !important;
        box-shadow: none !important;
        transform: none !important;
        filter: none !important;
    }

html body .account-list-cell-name .account-list-name-button {
    max-width: none !important;
    padding-inline: 14px !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

html body .account-list-cell-name .conexgo-row-action-toggle,
html body .device-list-action-toggle,
html body .account-list-cell-name .conexgo-row-action-toggle:hover,
html body .account-list-cell-name .conexgo-row-action-toggle:focus-visible,
html body .account-list-cell-name .conexgo-row-action-toggle:active,
html body .device-list-action-toggle:hover,
html body .device-list-action-toggle:focus-visible,
html body .device-list-action-toggle:active {
    width: 48px !important;
    min-width: 48px !important;
    flex: 0 0 48px !important;
    min-height: 48px !important;
    height: 48px !important;
    border-color: #315879 !important;
    background: #315879 !important;
    color: #ffffff !important;
    transform: none !important;
    filter: none !important;
    box-shadow: none !important;
}

@media (min-width: 768px) {
    html body :is(.device-list-action-group, .account-list-cell-name .conexgo-row-action-group) > :is(.device-list-action-menu, .conexgo-row-action-menu),
    html body :is(.device-list-action-group, .account-list-cell-name .conexgo-row-action-group) > :is(.device-list-action-menu, .conexgo-row-action-menu).show {
        position: absolute !important;
        inset: calc(100% + 5px) -8px auto auto !important;
        top: calc(100% + 5px) !important;
        right: -8px !important;
        bottom: auto !important;
        left: auto !important;
        transform: none !important;
        margin: 0 !important;
    }

    html body .conexgo-pagedlist-table tbody tr:has(:is(.device-list-action-menu, .conexgo-row-action-menu).show),
    html body .conexgo-pagedlist-table tbody td:has(:is(.device-list-action-menu, .conexgo-row-action-menu).show),
    html body .table-responsive:has(:is(.device-list-action-menu, .conexgo-row-action-menu).show),
    html body .conexgo-pagedlist-table-region:has(:is(.device-list-action-menu, .conexgo-row-action-menu).show) {
        position: relative !important;
        overflow: visible !important;
        z-index: 2750 !important;
    }
}

@media (max-width: 767.98px) {
    html body .device-list-action-group,
    html body .account-list-cell-name .conexgo-row-action-group {
        width: 100% !important;
        min-width: 0 !important;
    }
}

html body .conexgo-pagedlist-pagination
.page-item:not(.disabled):not(.conexgo-pagedlist-page-status)
.page-link,
html body .conexgo-pagedlist-pagination
.page-item:not(.disabled):not(.conexgo-pagedlist-page-status)
.page-link:hover,
html body .conexgo-pagedlist-pagination
.page-item:not(.disabled):not(.conexgo-pagedlist-page-status)
.page-link:focus-visible,
html body .conexgo-pagedlist-pagination
.page-item:not(.disabled):not(.conexgo-pagedlist-page-status)
.page-link:active {
    border-color: #cfd8e3 !important;
    background: #ffffff !important;
    color: #2c4c6c !important;
    box-shadow: none !important;
    transform: none !important;
    filter: none !important;
    outline: none !important;
    transition: none !important;
}

@media (max-width: 767.98px) {
    html body .mud-dialog.cx-dialog-root.cx-standard-form-dialog,
    html body .mud-dialog.cx-dialog-root.cx-device-config-dialog,
    html body .mud-dialog.cx-dialog-root.cx-r8-account-email {
        width: calc(100vw - 14px) !important;
        max-width: calc(100vw - 14px) !important;
    }
}

html body .device-status-icons > .fa-stack,
html body .device-status-icons .conexgo-device-battery-stack {
    transform: translateY(3px) !important;
}

@media (max-width: 991.98px) {
    html body .device-mobile-battery,
    html body .device-mobile-battery > .fa-stack-1x,
    html body .device-mobile-status-icons > .fa-stack {
        transform: translateY(2px) !important;
    }

    html body .device-mobile-status-icons {
        min-width: 0 !important;
        max-width: 118px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: flex-end !important;
        flex-wrap: nowrap !important;
        gap: 2px !important;
        overflow: visible !important;
    }

        html body .device-mobile-status-icons > * {
            flex: 0 0 24px !important;
            width: 24px !important;
            min-width: 24px !important;
            max-width: 24px !important;
        }
}

@media (min-width: 992px) {
    html body .table-responsive:has(.conexgo-row-action-menu.show),
    html body .table-responsive:has(.device-list-action-menu.show),
    html body .conexgo-pagedlist-table-region:has(.conexgo-row-action-menu.show),
    html body .conexgo-pagedlist-table-region:has(.device-list-action-menu.show) {
        position: relative !important;
        padding-bottom: 0 !important;
        overflow-y: visible !important;
    }
}

@media (max-width: 991.98px) {
    html body .cx-restricted-mobile-sidebar-toggle {
        display: none !important;
    }
}

@media (max-width: 767.98px) {
    html,
    body {
        overflow-x: hidden !important;
    }

        
        html body .main-content.app-content {
            padding-bottom: 8px !important;
        }

        html body .footer,
        html body .conexgo-enterprise-footer {
            margin-top: 8px !important;
            padding-bottom: 0 !important;
        }

        html body .conexgo-enterprise-footer__inner {
            min-height: 0 !important;
            padding: 9px 12px calc(74px + env(safe-area-inset-bottom, 0px)) !important;
        }

        html body .device-list-data-row {
            padding-bottom: 0 !important;
            margin-bottom: 0 !important;
        }

            html body .device-list-data-row,
            html body .device-list-data-row > div,
            html body .device-list-data-row .table-responsive,
            html body .device-list-data-row .conexgo-pagedlist-table-region,
            html body .device-list-data-row .conexgo-pagedlist-table-column,
            html body .device-list-data-row .conexgo-pagedlist-native-mobile {
                max-width: 100% !important;
                min-width: 0 !important;
            }

                html body .device-list-data-row .conexgo-pagedlist-native-mobile tbody tr {
                    max-width: 100% !important;
                    min-width: 0 !important;
                }

        html body .device-list-action-menu,
        html body .device-list-action-menu.show,
        html body .conexgo-row-action-menu.show {
            position: fixed !important;
            top: auto !important;
            right: 10px !important;
            bottom: calc(76px + env(safe-area-inset-bottom, 0px)) !important;
            left: 10px !important;
            width: min(430px, calc(100vw - 20px)) !important;
            max-width: min(430px, calc(100vw - 20px)) !important;
            max-height: min(58dvh, 500px) !important;
            margin-inline: auto !important;
            transform: none !important;
            overflow-x: hidden !important;
            overflow-y: auto !important;
            background: #fff !important;
            opacity: 1 !important;
            z-index: 3000 !important;
        }
}

.cx-dashboard-customer-order > .conexgo-dashboard-smart-item[data-dashboard-key="deviceStatus"] {
    order: 1 !important;
}

.cx-dashboard-customer-order > .conexgo-dashboard-smart-item[data-dashboard-key="latestAlerts"] {
    order: 2 !important;
}

.cx-dashboard-customer-order > .conexgo-dashboard-smart-item[data-dashboard-key="alertTrend"] {
    order: 3 !important;
}

.cx-dashboard-customer-order > .conexgo-dashboard-smart-item[data-dashboard-key="topAlertDevices"] {
    order: 4 !important;
}

.cx-dashboard-customer-order > .conexgo-dashboard-smart-item[data-dashboard-key="totalDevices"] {
    order: 5 !important;
}

.cx-dashboard-customer-order > .conexgo-dashboard-smart-item[data-dashboard-key="offlineDevices"] {
    order: 6 !important;
}

.cx-dashboard-customer-order > .conexgo-dashboard-smart-item[data-dashboard-key="activeUsers"] {
    order: 7 !important;
}

@media (max-width: 767.98px) {
    html body .cx-dashboard-page #conexgoDashboardSmartGrid.conexgo-dashboard-content-grid {
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
        align-content: flex-start !important;
        gap: 10px !important;
        height: auto !important;
        min-height: 0 !important;
    }

    html body .cx-dashboard-page #conexgoDashboardSmartGrid > .conexgo-dashboard-smart-item,
    html body .cx-dashboard-page #conexgoDashboardSmartGrid > .conexgo-dashboard-smart-item[data-masonry-positioned="true"] {
        position: static !important;
        inset: auto !important;
        transform: none !important;
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        margin: 0 !important;
        grid-row: auto !important;
    }

        html body .cx-dashboard-page #conexgoDashboardSmartGrid > .conexgo-dashboard-smart-item:has(> .conexgo-dashboard-minimized-card),
        html body .cx-dashboard-page #conexgoDashboardSmartGrid > .conexgo-dashboard-smart-item:has(> .conexgo-dashboard-card-closing) {
            flex: 0 0 auto !important;
            height: auto !important;
            min-height: 0 !important;
            max-height: none !important;
        }

    html body .cx-dashboard-page .conexgo-dashboard-minimized-card,
    html body .cx-dashboard-page .conexgo-dashboard-card-closing {
        height: 48px !important;
        min-height: 48px !important;
        max-height: 48px !important;
        resize: none !important;
    }
}

html body .cx-device-contact-template,
html body textarea.cx-device-contact-template {
    line-height: 1.2 !important;
    white-space: pre-wrap;
}

html body .cx-device-contact-template--readonly {
    padding: 10px 12px !important;
    border: 1px solid #dce5ed !important;
    border-radius: 8px !important;
    background: #f8fafc !important;
    color: #34495e !important;
}

html body .cx-device-dati-managed-note,
html body .cx-device-emergency-access-note {
    display: flex !important;
    align-items: flex-start !important;
    gap: 9px !important;
    margin: 10px 0 14px !important;
    padding: 11px 13px !important;
    border: 1px solid #d7e2ec !important;
    border-left: 4px solid #315879 !important;
    border-radius: 9px !important;
    background: #f2f7fb !important;
    color: #3f5265 !important;
    line-height: 1.4 !important;
}

html body .cx-device-emergency-access-note--locked {
    border-left-color: #b85b66 !important;
    background: #fff5f6 !important;
}

html body .cx-device-emergency-access-note--editable {
    border-left-color: #4c8362 !important;
    background: #f2faf5 !important;
}

html body .cx-password-input-shell,
html body .cx-password-dialog__control {
    position: relative !important;
    width: 100% !important;
    min-width: 0 !important;
}

    html body .cx-password-input-shell .form-control,
    html body .cx-password-dialog__control .form-control {
        width: 100% !important;
        min-width: 0 !important;
        padding-right: 42px !important;
        box-sizing: border-box !important;
    }

html body .cx-password-visibility-toggle {
    position: absolute !important;
    top: 50% !important;
    right: 9px !important;
    width: 28px !important;
    height: 28px !important;
    padding: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    transform: translateY(-50%) !important;
    border: 0 !important;
    border-radius: 6px !important;
    background: transparent !important;
    color: #496985 !important;
    cursor: pointer !important;
    z-index: 2 !important;
}

    html body .cx-password-visibility-toggle i {
        font-size: 13px !important;
        line-height: 1 !important;
    }

    html body .cx-password-visibility-toggle:hover,
    html body .cx-password-visibility-toggle:focus-visible {
        background: #edf3f7 !important;
        color: #244e73 !important;
        outline: none !important;
        transform: translateY(-50%) !important;
        box-shadow: none !important;
        filter: none !important;
    }

html body .cx-logs-hub,
html body .cx-support-hub {
    overflow: hidden !important;
    border: 1px solid #dce5ed !important;
    border-radius: 12px !important;
    box-shadow: 0 5px 18px rgba(44, 76, 108, .07) !important;
}

html body .cx-logs-hub__intro,
html body .cx-support-hub__header {
    padding: 16px 18px !important;
    background: #2c4c6c !important;
    color: #fff !important;
}

    html body .cx-support-hub__header .card-title {
        margin: 0 !important;
        color: #fff !important;
    }

html body .cx-logs-hub__grid,
html body .cx-support-hub__grid {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)) !important;
    gap: 12px !important;
}

html body .cx-logs-hub__card,
html body .cx-support-hub__card {
    min-width: 0 !important;
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    padding: 14px !important;
    border: 1px solid #e0e7ee !important;
    border-radius: 10px !important;
    background: #fff !important;
    color: #2c4c6c !important;
    text-decoration: none !important;
    transition: background-color .15s ease, border-color .15s ease, box-shadow .15s ease, transform .15s ease !important;
}

    html body .cx-logs-hub__card:hover,
    html body .cx-logs-hub__card:focus-visible,
    html body .cx-support-hub__card:hover,
    html body .cx-support-hub__card:focus-visible {
        border-color: #aac0d3 !important;
        background: #f3f8fb !important;
        box-shadow: 0 6px 16px rgba(44, 76, 108, .09) !important;
        transform: translateY(-1px) !important;
        outline: none !important;
    }

html body .cx-support-hub__label {
    min-width: 0 !important;
    flex: 1 1 auto !important;
    font-weight: 750 !important;
}

html body .cx-support-hub__external {
    color: #7890a5 !important;
    font-size: .8rem !important;
}

html body .cx-report-not-subscribed {
    color: #7b8794 !important;
    font-weight: 600 !important;
}

html body .mud-dialog :is( .cx-device-config-last-updated, .device-dot-last-updated, .device-geofence-last-updated ) {
    border-left: 4px solid #315879 !important;
    border-inline-start: 4px solid #315879 !important;
}

html body .conexgo-pagedlist-pagination .page-item:not(.disabled):not(.conexgo-pagedlist-page-status) .page-link:hover,
html body .conexgo-pagedlist-pagination .page-item:not(.disabled):not(.conexgo-pagedlist-page-status) .page-link:focus-visible {
    border-color: #cfd8e3 !important;
    background: #ffffff !important;
    color: #2c4c6c !important;
    box-shadow: none !important;
    transform: none !important;
}

html body .cx-design-system .cx-filter-disclosure,
html body .cx-filter-disclosure,
html body .alert-list-card-body > .cx-filter-disclosure,
html body .cx-log-list-card .cx-filter-disclosure {
    width: 100% !important;
    max-width: none !important;
    margin-inline: 0 !important;
    box-sizing: border-box !important;
}

html body .cx-filter-disclosure-region,
html body .cx-filter-disclosure-inner,
html body .cx-filter-disclosure-inner > .device-filter-panel--professional,
html body .cx-filter-disclosure-inner > .alert-filter-panel {
    width: 100% !important;
    max-width: none !important;
    box-sizing: border-box !important;
}

html body .alert-list-card-body > .table-responsive,
html body .cx-log-list-card .card-body > .table-responsive {
    width: 100% !important;
    max-width: none !important;
    margin-inline: 0 !important;
}

html body .alert-list-card-body .alert-filter-panel {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding-inline: 12px !important;
}

    html body .alert-list-card-body .alert-filter-panel > [class*="col-"],
    html body .alert-list-card-body .alert-filter-inline {
        width: 100% !important;
        max-width: none !important;
        margin-inline: 0 !important;
    }

html body .device-filter-toolbar {
    width: 100% !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    align-items: end !important;
    gap: 12px 18px !important;
}

html body .device-filter-toolbar-actions {
    display: flex !important;
    align-items: flex-end !important;
    justify-content: flex-end !important;
    gap: 10px !important;
    min-width: 0 !important;
}

html body .device-filter-field--battery-toolbar {
    width: clamp(250px, 24vw, 390px) !important;
    min-width: 220px !important;
    max-width: 390px !important;
    flex: 0 1 390px !important;
}

    html body .device-filter-field--battery-toolbar .device-filter-control,
    html body .device-filter-field--battery-toolbar .cx-custom-select,
    html body .device-filter-field--battery-toolbar .cx-custom-select-trigger {
        width: 100% !important;
    }

html body .cx-filter-disclosure-inner .device-filter-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 10px 12px !important;
}

@media (min-width: 1800px) {
    html body .cx-filter-disclosure-inner .device-filter-grid {
        grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
    }
}

html body .cx-data-log-responsive-filter {
    width: 100% !important;
    max-width: none !important;
}

html body .cx-data-log-unified-toolbar {
    margin-bottom: 10px !important;
}

html body .cx-data-log-unified-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}

html body .cx-data-log-unified-filter .device-filter-summary {
    display: flex !important;
    align-items: center !important;
    min-height: 34px !important;
}

html body .cx-data-log-unified-filter .device-filter-count {
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    color: #50677d !important;
    font-weight: 650 !important;
}

@media (max-width: 991.98px) {
    html body .device-filter-toolbar {
        grid-template-columns: minmax(0, 1fr) !important;
        align-items: stretch !important;
    }

    html body .device-filter-toolbar-actions {
        width: 100% !important;
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) auto !important;
        align-items: end !important;
    }

    html body .device-filter-field--battery-toolbar {
        width: 100% !important;
        min-width: 0 !important;
        max-width: none !important;
    }

    html body .cx-filter-disclosure-inner .device-filter-grid,
    html body .cx-data-log-unified-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 639.98px) {
    html body .device-filter-toolbar-actions {
        grid-template-columns: minmax(0, 1fr) !important;
    }

        html body .device-filter-toolbar-actions .device-filter-reset {
            width: 100% !important;
        }

    html body .cx-filter-disclosure-inner .device-filter-grid,
    html body .cx-data-log-unified-grid {
        grid-template-columns: minmax(0, 1fr) !important;
    }
}

html body .cx-r1-device-created-row .cx-readonly-value {
    width: 100% !important;
    min-height: 46px !important;
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    padding: 9px 12px !important;
    border: 1px solid #d2dee9 !important;
    border-radius: 9px !important;
    background: #f5f8fb !important;
    color: #294b6b !important;
    font-weight: 650 !important;
}

    html body .cx-r1-device-created-row .cx-readonly-value > i {
        width: 32px !important;
        height: 32px !important;
        display: inline-grid !important;
        place-items: center !important;
        flex: 0 0 32px !important;
        border-radius: 8px !important;
        background: #e9f1f7 !important;
        color: #315879 !important;
    }

html body .mud-dialog .cx-r1-form-row {
    margin-bottom: clamp(.55rem, .42rem + .12vw, .85rem) !important;
}

    html body .mud-dialog .cx-r1-form-row:last-child {
        margin-bottom: 0 !important;
    }

@media (min-width: 1600px) {
    html body .main-content.app-content .main-container.container-fluid {
        width: 100% !important;
        max-width: min(3200px, calc(100vw - clamp(56px, 4vw, 132px))) !important;
        margin-inline: auto !important;
        padding-inline: clamp(26px, 2.25vw, 68px) !important;
    }

    html body .main-content.app-content {
        font-size: clamp(.94rem, .83rem + .11vw, 1.08rem) !important;
    }

    html body .page-title {
        font-size: clamp(1.65rem, 1.32rem + .34vw, 2.15rem) !important;
    }

    html body .breadcrumb,
    html body .form-label,
    html body .device-filter-label,
    html body .conexgo-pagedlist-table {
        font-size: clamp(.84rem, .76rem + .09vw, 1rem) !important;
    }

    html body .form-control,
    html body .form-select,
    html body .cx-custom-select-trigger,
    html body .cx-control,
    html body .mud-input-control {
        min-height: clamp(44px, 40px + .25vw, 52px) !important;
        font-size: clamp(.9rem, .82rem + .08vw, 1.04rem) !important;
    }

    html body .btn:not(.btn-sm):not(.btn-icon),
    html body .cx-page-action,
    html body .device-filter-reset {
        min-height: clamp(40px, 37px + .22vw, 48px) !important;
        font-size: clamp(.85rem, .78rem + .07vw, 1rem) !important;
    }

    html body .conexgo-pagedlist-table th,
    html body .conexgo-pagedlist-table td {
        padding-block: clamp(10px, 8px + .18vw, 15px) !important;
        padding-inline: clamp(11px, 9px + .18vw, 17px) !important;
    }

    html body .cx-filter-disclosure-toggle {
        min-height: clamp(50px, 46px + .22vw, 58px) !important;
        padding-inline: clamp(14px, 1vw, 22px) !important;
    }

    html body .cx-filter-disclosure-title {
        font-size: clamp(.88rem, .8rem + .08vw, 1.03rem) !important;
    }
}

@media (min-width: 1920px) {
    html {
        font-size: 17px;
    }

        html body .main-header,
        html body .app-sidebar {
            font-size: 1rem !important;
        }

        html body .mud-dialog.cx-dialog-root.cx-standard-form-dialog,
        html body .mud-dialog.cx-dialog-root.cx-device-config-dialog,
        html body .mud-dialog.cx-dialog-root.cx-r8-account-email {
            width: min(clamp(1120px, 58vw, 1760px), calc(100vw - 96px)) !important;
            max-width: min(clamp(1120px, 58vw, 1760px), calc(100vw - 96px)) !important;
        }

        html body .mud-dialog.cx-dialog-root:is( .cx-r1-device-addedit, .cx-r1-device-geofence, .cx-r1-device-message, .cx-r1-account-addedit, .cx-r1-devicemodel-addedit, .cx-terms-dialog, .cx-report-subscribe-dialog ) {
            width: min(clamp(1260px, 68vw, 1960px), calc(100vw - 96px)) !important;
            max-width: min(clamp(1260px, 68vw, 1960px), calc(100vw - 96px)) !important;
        }

        html body .mud-dialog .cx-dialog-content,
        html body .mud-dialog .mud-dialog-content {
            padding-inline: clamp(22px, 1.55vw, 42px) !important;
        }
}

@media (min-width: 2560px) {
    html {
        font-size: 18px;
    }

        html body .main-content.app-content .main-container.container-fluid {
            max-width: min(3400px, calc(100vw - clamp(96px, 4vw, 180px))) !important;
        }

        html body .main-header .header-link-icon,
        html body .main-header .header-icon {
            transform: scale(1.06);
            transform-origin: center;
        }

        html body .conexgo-pagedlist-table {
            font-size: 1rem !important;
        }

        html body .mud-dialog.cx-dialog-root.cx-standard-form-dialog,
        html body .mud-dialog.cx-dialog-root.cx-device-config-dialog,
        html body .mud-dialog.cx-dialog-root.cx-r8-account-email {
            width: min(64vw, 1860px) !important;
            max-width: min(64vw, 1860px) !important;
        }

        html body .mud-dialog.cx-dialog-root:is( .cx-r1-device-addedit, .cx-r1-device-geofence, .cx-r1-device-message, .cx-r1-account-addedit, .cx-r1-devicemodel-addedit, .cx-terms-dialog, .cx-report-subscribe-dialog ) {
            width: min(72vw, 2140px) !important;
            max-width: min(72vw, 2140px) !important;
        }
}

@media (max-width: 767.98px) {
    html {
        font-size: 16px;
    }

        html body .mud-dialog.cx-dialog-root.cx-standard-form-dialog,
        html body .mud-dialog.cx-dialog-root.cx-device-config-dialog,
        html body .mud-dialog.cx-dialog-root.cx-r8-account-email,
        html body .mud-dialog.cx-dialog-root.cx-r1-device-addedit,
        html body .mud-dialog.cx-dialog-root.cx-r1-account-addedit {
            width: calc(100vw - 14px) !important;
            max-width: calc(100vw - 14px) !important;
        }
}

@media (min-width: 1600px) {
    html {
        font-size: 16px !important;
    }

        html body .main-content.app-content {
            font-size: inherit !important;
        }

            
            html body .main-content.app-content .main-container.container-fluid {
                width: 100% !important;
                max-width: min(3200px, calc(100vw - clamp(48px, 3.25vw, 120px))) !important;
                margin-inline: auto !important;
                padding-inline: clamp(22px, 1.55vw, 48px) !important;
            }

        html body .page-title {
            font-size: 1.55rem !important;
        }

        html body .breadcrumb {
            font-size: .82rem !important;
        }

        html body .form-label,
        html body .device-filter-label {
            font-size: 12px !important;
        }

        html body .form-control,
        html body .form-select,
        html body .cx-custom-select-trigger,
        html body .cx-control {
            min-height: 40px !important;
            font-size: 13.5px !important;
        }

        html body .btn:not(.btn-sm):not(.btn-icon),
        html body .cx-page-action,
        html body .device-filter-reset {
            min-height: 38px !important;
            font-size: 13px !important;
        }

        html body .conexgo-pagedlist-table {
            font-size: 13px !important;
        }

            html body .conexgo-pagedlist-table th {
                padding: 9px 10px !important;
                font-size: 12px !important;
                line-height: 1.25 !important;
            }

            html body .conexgo-pagedlist-table td {
                padding: 9px 10px !important;
                font-size: 13px !important;
                line-height: 1.35 !important;
            }

        html body .cx-filter-disclosure-toggle {
            min-height: 46px !important;
            padding: 7px 12px !important;
        }

        html body .cx-filter-disclosure-title {
            font-size: 13px !important;
        }

        html body .cx-filter-disclosure-chevron {
            width: 34px !important;
            height: 34px !important;
            min-width: 34px !important;
        }

        html body .cx-list-search .form-control,
        html body .cx-list-search input,
        html body .dataTables_filter .form-control,
        html body .dataTables_filter input {
            min-height: 40px !important;
            height: 40px !important;
            font-size: 13px !important;
        }

        html body .cx-list-search .btn,
        html body .dataTables_filter .btn {
            min-height: 40px !important;
            height: 40px !important;
            font-size: 13px !important;
        }
}

html body .cx-filter-disclosure-inner > .device-filter-panel--professional {
    padding: 10px 12px 12px !important;
}

html body .device-filter-toolbar {
    width: 100% !important;
    min-height: 0 !important;
    margin: 0 0 8px !important;
    display: flex !important;
    align-items: flex-end !important;
    justify-content: flex-end !important;
    gap: 10px !important;
}

html body .device-filter-toolbar-actions {
    width: auto !important;
    max-width: 100% !important;
    display: flex !important;
    align-items: flex-end !important;
    justify-content: flex-end !important;
    gap: 9px !important;
}

html body .device-filter-field--battery-toolbar {
    width: clamp(230px, 20vw, 300px) !important;
    min-width: 230px !important;
    max-width: 300px !important;
    flex: 0 1 300px !important;
}

html body .cx-filter-disclosure-inner .device-filter-label {
    min-height: 22px !important;
    gap: 5px !important;
    font-size: 11.5px !important;
}

html body .cx-filter-disclosure-inner .device-filter-label-icon {
    width: 23px !important;
    height: 23px !important;
    min-width: 23px !important;
    border-radius: 7px !important;
}

html body .cx-filter-disclosure-inner .device-filter-control .cx-custom-select-trigger,
html body .device-filter-field--battery-toolbar .cx-custom-select-trigger {
    height: 40px !important;
    min-height: 40px !important;
    border-radius: 8px !important;
    font-size: 13px !important;
}

html body .cx-filter-disclosure-inner .device-filter-grid {
    gap: 8px 10px !important;
}

html body .cx-filter-disclosure-inner .device-filter-reset {
    min-height: 40px !important;
    height: 40px !important;
    padding: 0 11px !important;
    border-radius: 8px !important;
    font-size: 12px !important;
}

html body .cx-paged-list .conexgo-pagedlist-toolbar {
    margin-bottom: 10px !important;
    padding-block: 2px 4px !important;
    gap: 10px 14px !important;
}

html body .cx-paged-list .conexgo-pagedlist-pagination .pagination {
    gap: 4px !important;
}

html body .cx-paged-list .conexgo-pagedlist-pagination .page-link {
    min-width: 34px !important;
    height: 34px !important;
    padding: 0 7px !important;
    border-radius: 7px !important;
    font-size: 12px !important;
}

html body .cx-paged-list .conexgo-pagedlist-page-status .page-link {
    min-width: 86px !important;
    font-size: 12px !important;
}

html body .cx-paged-list .conexgo-pagedlist-page-size .cx-custom-select-trigger,
html body .cx-paged-list .conexgo-pagedlist-page-size select,
html body .conexgo-pagedlist-page-size .cx-custom-select-trigger,
html body .conexgo-pagedlist-page-size select {
    min-height: 36px !important;
    height: 36px !important;
    font-size: 12.5px !important;
}

html body .conexgo-pagedlist-table td .small,
html body .conexgo-pagedlist-table td small {
    font-size: 11.5px !important;
    line-height: 1.35 !important;
}

html body .conexgo-pagedlist-table td p {
    margin-bottom: 4px !important;
    line-height: 1.4 !important;
}

@media (min-width: 1920px) {
    html {
        font-size: 16px !important;
    }

        html body .mud-dialog.cx-dialog-root.cx-standard-form-dialog,
        html body .mud-dialog.cx-dialog-root.cx-device-config-dialog,
        html body .mud-dialog.cx-dialog-root.cx-r8-account-email {
            width: min(62vw, 1620px) !important;
            max-width: min(62vw, 1620px) !important;
        }

        html body .mud-dialog.cx-dialog-root:is( .cx-r1-device-addedit, .cx-r1-device-geofence, .cx-r1-device-message, .cx-r1-account-addedit, .cx-r1-devicemodel-addedit, .cx-terms-dialog, .cx-report-subscribe-dialog ) {
            width: min(70vw, 1840px) !important;
            max-width: min(70vw, 1840px) !important;
        }
}

@media (min-width: 2560px) {
    html {
        font-size: 16px !important;
    }

        html body .main-content.app-content .main-container.container-fluid {
            max-width: min(3400px, calc(100vw - clamp(88px, 3.5vw, 160px))) !important;
        }

        
        html body .conexgo-pagedlist-table td {
            font-size: 13.5px !important;
        }

        html body .conexgo-pagedlist-table th {
            font-size: 12.5px !important;
        }

        html body .form-control,
        html body .form-select,
        html body .cx-custom-select-trigger,
        html body .cx-control {
            min-height: 42px !important;
            font-size: 14px !important;
        }
}

@media (max-width: 767.98px) {
    html {
        font-size: 16px !important;
    }

        html body .device-filter-toolbar,
        html body .device-filter-toolbar-actions {
            width: 100% !important;
            display: grid !important;
            grid-template-columns: minmax(0, 1fr) !important;
            align-items: stretch !important;
        }

        html body .device-filter-field--battery-toolbar {
            width: 100% !important;
            min-width: 0 !important;
            max-width: none !important;
        }

        html body .device-filter-toolbar-actions .device-filter-reset {
            width: 100% !important;
        }
}

html body .mud-dialog.cx-terms-dialog .cx-terms-dialog-actions,
html body .mud-dialog.cx-terms-dialog .mud-dialog-actions {
    gap: 10px !important;
    padding: 12px 18px !important;
    align-items: center !important;
}

html body .mud-dialog.cx-terms-dialog .cx-dialog-action {
    min-height: 40px !important;
    padding: 0 14px !important;
    gap: 8px !important;
    border-radius: 9px !important;
    font-size: 12.5px !important;
    font-weight: 750 !important;
    letter-spacing: .005em !important;
}

html body .mud-dialog.cx-terms-dialog .cx-terms-action-icon {
    width: 25px !important;
    height: 25px !important;
    min-width: 25px !important;
    display: inline-grid !important;
    place-items: center !important;
    border-radius: 7px !important;
    line-height: 1 !important;
    transition: transform .16s ease, background-color .16s ease !important;
}

    html body .mud-dialog.cx-terms-dialog .cx-terms-action-icon i {
        margin: 0 !important;
        font-size: 12px !important;
        line-height: 1 !important;
    }

html body .mud-dialog.cx-terms-dialog .cx-terms-action-icon--agree {
    color: #ffffff !important;
    background: rgba(255, 255, 255, .14) !important;
}

html body .mud-dialog.cx-terms-dialog .cx-terms-action-icon--logout {
    color: #536477 !important;
    background: #eef3f7 !important;
    border: 1px solid #dde6ed !important;
}

html body .mud-dialog.cx-terms-dialog .cx-dialog-action:hover .cx-terms-action-icon {
    transform: translateY(-1px) !important;
}

html body .mud-dialog.cx-terms-dialog .cx-dialog-action--save-close:hover .cx-terms-action-icon--agree {
    background: rgba(255, 255, 255, .22) !important;
}

html body .mud-dialog.cx-terms-dialog .cx-dialog-action--cancel:hover .cx-terms-action-icon--logout {
    background: #e5edf4 !important;
}

@media (max-width: 767.98px) {
    html body .mud-dialog.cx-terms-dialog .cx-terms-dialog-actions,
    html body .mud-dialog.cx-terms-dialog .mud-dialog-actions {
        padding: 10px 12px !important;
        gap: 8px !important;
    }

    html body .mud-dialog.cx-terms-dialog .cx-dialog-action {
        min-height: 40px !important;
        padding-inline: 12px !important;
    }
}

@media (min-width: 576px) {
    html body .alert-list-card-body > .cx-filter-disclosure.cx-filter-table-width,
    html body .notification-list-card-body > .cx-filter-disclosure.cx-filter-table-width,
    html body .cx-log-list-card > .card-body > .cx-filter-disclosure.cx-filter-table-width {
        width: calc(100% + 2rem) !important;
        max-width: none !important;
        margin-left: -1rem !important;
        margin-right: -1rem !important;
        box-sizing: border-box !important;
    }
}

@media (max-width: 575.98px) {
    html body .cx-filter-disclosure.cx-filter-table-width {
        width: 100% !important;
        max-width: none !important;
        margin-inline: 0 !important;
    }
}

@media (min-width: 768px) {
    html body .cx-filter-disclosure-inner .device-filter-toolbar {
        width: 100% !important;
        display: grid !important;
        grid-template-columns: minmax(240px, 320px) minmax(0, 1fr) auto !important;
        align-items: end !important;
        column-gap: 14px !important;
        row-gap: 8px !important;
    }

    html body .cx-filter-disclosure-inner .device-filter-toolbar-actions {
        display: contents !important;
    }

    html body .cx-filter-disclosure-inner .device-filter-field--battery-toolbar {
        grid-column: 1 !important;
        justify-self: start !important;
        width: 100% !important;
        min-width: 0 !important;
        max-width: 320px !important;
    }

    html body .cx-filter-disclosure-inner .device-filter-toolbar-actions > .device-filter-reset {
        grid-column: 3 !important;
        justify-self: end !important;
        align-self: end !important;
        width: auto !important;
        white-space: nowrap !important;
    }
}

@media (max-width: 900px) {
    html body .cx-notification-device-filter .device-filter-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 767.98px) {
    html body .cx-filter-disclosure-inner .device-filter-toolbar,
    html body .cx-filter-disclosure-inner .device-filter-toolbar-actions {
        width: 100% !important;
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
        align-items: stretch !important;
    }

    html body .cx-filter-disclosure-inner .device-filter-field--battery-toolbar {
        width: 100% !important;
        max-width: none !important;
    }

    html body .cx-filter-disclosure-inner .device-filter-toolbar-actions > .device-filter-reset {
        width: 100% !important;
    }
}

html body .cx-logs-hub__grid {
    padding: 12px !important;
    background: #f6f8fb !important;
}

html body .cx-logs-hub__copy {
    min-width: 0 !important;
    flex: 1 1 auto !important;
    display: grid !important;
    align-content: center !important;
    gap: 4px !important;
}

    html body .cx-logs-hub__copy strong {
        display: block !important;
        color: #294d70 !important;
        font-size: .94rem !important;
        font-weight: 760 !important;
        line-height: 1.25 !important;
    }

    html body .cx-logs-hub__copy small {
        display: block !important;
        color: #60758a !important;
        font-size: .78rem !important;
        font-weight: 500 !important;
        line-height: 1.42 !important;
        overflow-wrap: anywhere !important;
    }

html body .cx-logs-hub__icon {
    width: 34px !important;
    height: 34px !important;
    min-width: 34px !important;
    display: inline-grid !important;
    place-items: center !important;
    border-radius: 9px !important;
    background: #edf4f9 !important;
    color: #315f88 !important;
}

html body .cx-logs-hub__arrow {
    margin-left: auto !important;
    color: #557794 !important;
    font-size: .78rem !important;
}

html body .cx-logs-hub__card {
    min-height: 96px !important;
    align-items: center !important;
}

@media (max-width: 767.98px) {
    html body .page,
    html body .page-main,
    html body .main-content.app-content,
    html body .main-content.app-content .side-app,
    html body .main-content.app-content .main-container.container-fluid,
    html body #conexgo-page-content {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
    }

    html body .main-content.app-content {
        margin-left: 0 !important;
        margin-right: 0 !important;
        margin-inline: 0 !important;
    }

        html body .main-content.app-content .side-app {
            margin: 0 !important;
            padding: 0 !important;
        }

        html body .main-content.app-content .main-container.container-fluid {
            margin: 0 !important;
            padding-left: 8px !important;
            padding-right: 8px !important;
        }
}

:root {
    --cx-r38-9-text: #264765;
    --cx-r38-9-muted: #66798b;
    --cx-r38-9-line: #d8e3ec;
    --cx-r38-9-soft: #f7f9fb;
    --cx-r38-9-soft-blue: #edf4f8;
}

html body :is(.mud-dialog, .cx-dialog-root, .nt-clock-card, .topbar-version-pill)
:is(.fa, .fas, .fa-solid) {
    font-family: "Font Awesome 6 Free" !important;
    font-weight: 900 !important;
    font-style: normal !important;
}

html body :is(.mud-dialog, .cx-dialog-root, .nt-clock-card, .topbar-version-pill)
:is(.far, .fa-regular) {
    font-family: "Font Awesome 6 Free" !important;
    font-weight: 400 !important;
    font-style: normal !important;
}

html body :is(.mud-dialog, .cx-dialog-root, .nt-clock-card, .topbar-version-pill)
:is(.fab, .fa-brands) {
    font-family: "Font Awesome 6 Brands" !important;
    font-weight: 400 !important;
    font-style: normal !important;
}

html body :is(.mud-dialog, .cx-dialog-root, .nt-clock-card, .topbar-version-pill)
[class^="fe "],
html body :is(.mud-dialog, .cx-dialog-root, .nt-clock-card, .topbar-version-pill)
[class*=" fe-"] {
    font-family: "feather" !important;
}

html body .page-title {
    color: #244765 !important;
    font-size: clamp(1.42rem, 1.38rem + .12vw, 1.58rem) !important;
    font-weight: 700 !important;
    letter-spacing: -.012em !important;
    line-height: 1.18 !important;
}

html body .breadcrumb,
html body .breadcrumb a {
    font-size: .86rem !important;
    font-weight: 560 !important;
}

html body .conexgo-dashboard-smart-grid .card-header .card-title,
html body .conexgo-dashboard-card-header .card-title,
html body .conexgo-dashboard-config-section-title,
html body .conexgo-dashboard-visibility-heading,
html body .conexgo-dashboard-config-header-button {
    font-weight: 700 !important;
    letter-spacing: -.008em !important;
}

html body .conexgo-dashboard-smart-grid .card-header .card-title {
    font-size: 1rem !important;
    line-height: 1.25 !important;
}

html body .form-control:not(textarea),
html body .form-select,
html body .cx-custom-select-trigger,
html body .cx-control:not(textarea),
html body .device-filter-control .cx-custom-select-trigger,
html body .cx-filter-disclosure .cx-custom-select-trigger {
    min-height: 41px !important;
    height: 41px !important;
    font-size: 13.5px !important;
    line-height: 1.25 !important;
}

html body textarea.form-control,
html body textarea.cx-control {
    height: auto;
    min-height: 100px !important;
}

html body .form-label,
html body label.form-label,
html body .device-filter-label {
    color: #294b69 !important;
    font-size: 12px !important;
    font-weight: 650 !important;
}

html body .btn:not(.btn-sm):not(.btn-icon),
html body .cx-page-action,
html body .cx-dialog-action,
html body .device-filter-reset {
    min-height: 39px !important;
    font-size: 13px !important;
    font-weight: 650 !important;
}

html body .mud-dialog.cx-dialog-root {
    color: var(--cx-r38-9-text) !important;
}

    html body .mud-dialog.cx-dialog-root :is( .mud-dialog-title, .mud-dialog-content, .mud-dialog-actions, label, input, textarea, select, button, p ) {
        font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    }

    
    html body .mud-dialog.cx-dialog-root .cx-r1-section,
    html body .mud-dialog.cx-dialog-root .cx-modal-group-v21 {
        border: 1.6px solid #6f8da5 !important;
        border-radius: 11px !important;
        background: #fff !important;
        box-shadow: 0 1px 4px rgba(35, 60, 85, .05) !important;
    }

    html body .mud-dialog.cx-dialog-root .cx-r1-section-title,
    html body .mud-dialog.cx-dialog-root .cx-device-config-section-title {
        color: #244b6b !important;
        font-family: "Helvetica Neue", Helvetica, Arial, sans-serif !important;
        font-size: .96rem !important;
        font-weight: 700 !important;
        line-height: 1.22 !important;
        letter-spacing: -.006em !important;
    }

    html body .mud-dialog.cx-dialog-root .cx-r1-section-icon,
    html body .mud-dialog.cx-dialog-root .cx-device-config-section-icon {
        width: 34px !important;
        height: 34px !important;
        min-width: 34px !important;
        display: inline-grid !important;
        place-items: center !important;
        border-radius: 9px !important;
        background: var(--cx-r38-9-soft-blue) !important;
        color: #35678f !important;
        border: 1px solid #d8e5ee !important;
    }

    html body .mud-dialog.cx-dialog-root .cx-r1-section-description,
    html body .mud-dialog.cx-dialog-root .cx-device-config-section-description {
        color: #64788b !important;
        font-size: .87rem !important;
        font-weight: 450 !important;
        line-height: 1.45 !important;
    }

    
    html body .mud-dialog.cx-dialog-root.cx-standard-form-dialog {
        width: min(78vw, 1100px) !important;
        max-width: min(78vw, 1100px) !important;
        max-height: min(84dvh, 820px) !important;
    }

    html body .mud-dialog.cx-dialog-root.cx-terms-dialog {
        width: min(74vw, 1080px) !important;
        max-width: min(74vw, 1080px) !important;
        max-height: min(78dvh, 720px) !important;
    }

    html body .mud-dialog.cx-dialog-root.cx-report-subscribe-dialog {
        width: min(68vw, 920px) !important;
        max-width: min(68vw, 920px) !important;
        max-height: min(76dvh, 720px) !important;
    }

    html body .mud-dialog.cx-dialog-root:is( .cx-r1-device-addedit, .cx-r1-account-addedit, .cx-device-config-dialog, .cx-r1-device-geofence, .cx-r1-device-message ) {
        width: min(84vw, 1260px) !important;
        max-width: min(84vw, 1260px) !important;
        max-height: min(86dvh, 860px) !important;
    }

    html body .mud-dialog.cx-dialog-root .mud-dialog-content,
    html body .mud-dialog.cx-dialog-root .cx-dialog-content {
        min-height: 0 !important;
        overflow-y: auto !important;
        overscroll-behavior: contain !important;
    }

@media (min-width: 1920px) {
    html body .mud-dialog.cx-dialog-root.cx-standard-form-dialog {
        width: min(58vw, 1180px) !important;
        max-width: min(58vw, 1180px) !important;
    }

    html body .mud-dialog.cx-dialog-root.cx-terms-dialog {
        width: min(56vw, 1180px) !important;
        max-width: min(56vw, 1180px) !important;
    }

    html body .mud-dialog.cx-dialog-root.cx-report-subscribe-dialog {
        width: min(48vw, 940px) !important;
        max-width: min(48vw, 940px) !important;
    }

    html body .mud-dialog.cx-dialog-root:is( .cx-r1-device-addedit, .cx-r1-account-addedit, .cx-device-config-dialog, .cx-r1-device-geofence, .cx-r1-device-message ) {
        width: min(66vw, 1420px) !important;
        max-width: min(66vw, 1420px) !important;
    }
}

@media (max-width: 991.98px) {
    html body .mud-dialog.cx-dialog-root,
    html body .mud-dialog.cx-dialog-root.cx-standard-form-dialog,
    html body .mud-dialog.cx-dialog-root.cx-terms-dialog,
    html body .mud-dialog.cx-dialog-root.cx-report-subscribe-dialog {
        width: calc(100vw - 24px) !important;
        max-width: calc(100vw - 24px) !important;
        max-height: calc(100dvh - 24px) !important;
        margin: 12px !important;
    }
}

@media (max-width: 575.98px) {
    html body .mud-dialog.cx-dialog-root,
    html body .mud-dialog.cx-dialog-root.cx-standard-form-dialog,
    html body .mud-dialog.cx-dialog-root.cx-terms-dialog,
    html body .mud-dialog.cx-dialog-root.cx-report-subscribe-dialog {
        width: calc(100vw - 10px) !important;
        max-width: calc(100vw - 10px) !important;
        max-height: calc(100dvh - 10px) !important;
        margin: 5px !important;
        border-radius: 12px !important;
    }
}

html body .topbar-version-label {
    font-size: .7rem !important;
    font-weight: 500 !important;
    letter-spacing: .04em !important;
}

html body .topbar-version-value {
    font-size: .88rem !important;
    font-weight: 620 !important;
}

html body .nt-date-text {
    font-size: .84rem !important;
    font-weight: 560 !important;
}

html body .nt-clock-value {
    font-size: .89rem !important;
    font-weight: 600 !important;
}

html body .nt-clock-separator,
html body .nt-meridiem {
    font-size: .86rem !important;
    font-weight: 520 !important;
}

html body .conexgo-header-alerts .conexgo-alert-card {
    border-width: 2px !important;
    border-radius: 10px !important;
    box-shadow: 0 4px 12px rgba(31, 61, 90, .08) !important;
}

    html body .conexgo-header-alerts .conexgo-alert-card::before {
        width: 4px !important;
    }

html body .conexgo-header-alerts .conexgo-alert-card-title {
    color: #b42343 !important;
    font-size: 9.7pt !important;
    font-weight: 760 !important;
    letter-spacing: 0 !important;
}

html body .conexgo-header-alerts .conexgo-alert-card-icon {
    width: 39px !important;
    height: 39px !important;
    min-width: 39px !important;
    border-width: 1.5px !important;
    box-shadow: none !important;
}

html body .cx-log-list-card .cx-log-filter-panel {
    width: 100% !important;
    max-width: none !important;
    margin: 0 0 10px !important;
}

html body .cx-log-filter-unified {
    padding: 10px 12px 12px !important;
}

html body .cx-log-filter-grid {
    grid-template-columns: repeat(auto-fit, minmax(min(230px, 100%), 1fr)) !important;
    gap: 9px 12px !important;
}

    html body .cx-log-filter-grid .cx-custom-select,
    html body .cx-log-filter-grid .cx-custom-select-trigger,
    html body .cx-data-log-unified-grid .cx-custom-select,
    html body .cx-data-log-unified-grid .cx-custom-select-trigger,
    html body .device-filter-grid .cx-custom-select,
    html body .device-filter-grid .cx-custom-select-trigger {
        width: 100% !important;
        min-height: 41px !important;
        height: 41px !important;
    }

html body .cx-log-list-card .table-responsive,
html body .cx-list-card .table-responsive {
    overflow-x: auto !important;
    overscroll-behavior-inline: contain !important;
}

html body .cx-log-list-card .conexgo-pagedlist-table {
    min-width: 760px !important;
    table-layout: auto !important;
}

html body .conexgo-pagedlist-table th,
html body .conexgo-pagedlist-table td {
    word-break: normal !important;
    hyphens: none !important;
    vertical-align: top !important;
}

html body .conexgo-pagedlist-table td {
    overflow-wrap: break-word !important;
    line-height: 1.4 !important;
}

html body .conexgo-profile-tabs {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 7px !important;
}

    html body .conexgo-profile-tabs > li > a {
        min-height: 40px !important;
        display: inline-flex !important;
        align-items: center !important;
        gap: 8px !important;
        padding: 8px 12px !important;
        border-radius: 9px !important;
        color: #315270 !important;
        font-size: .88rem !important;
        font-weight: 630 !important;
    }

        html body .conexgo-profile-tabs > li > a.active {
            color: #fff !important;
            background: #315879 !important;
        }

html body .cx-profile-terms {
    display: grid !important;
    gap: 14px !important;
}

html body .cx-profile-terms-header {
    display: flex !important;
    align-items: flex-start !important;
    justify-content: space-between !important;
    gap: 14px !important;
    padding: 14px !important;
    border: 1px solid var(--cx-r38-9-line) !important;
    border-radius: 11px !important;
    background: var(--cx-r38-9-soft) !important;
}

html body .cx-profile-terms-heading {
    min-width: 0 !important;
    display: flex !important;
    gap: 11px !important;
}

html body .cx-profile-terms-icon {
    width: 38px !important;
    height: 38px !important;
    min-width: 38px !important;
    display: inline-grid !important;
    place-items: center !important;
    border-radius: 9px !important;
    color: #315f87 !important;
    background: #e9f2f8 !important;
    border: 1px solid #d5e3ed !important;
}

html body .cx-profile-terms-heading h2 {
    margin: 0 !important;
    color: #244b6d !important;
    font-size: 1rem !important;
    font-weight: 700 !important;
}

html body .cx-profile-terms-heading p {
    margin: 4px 0 0 !important;
    color: var(--cx-r38-9-muted) !important;
    font-size: .87rem !important;
    line-height: 1.45 !important;
}

html body .cx-profile-terms-status {
    flex: 0 0 auto !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 7px !important;
    padding: 7px 9px !important;
    border-radius: 9px !important;
    font-size: .8rem !important;
    font-weight: 630 !important;
}

    html body .cx-profile-terms-status.is-accepted {
        color: #2f6b46 !important;
        background: #edf8f1 !important;
        border: 1px solid #cbe7d5 !important;
    }

    html body .cx-profile-terms-status.is-declined {
        color: #8c4550 !important;
        background: #fff3f4 !important;
        border: 1px solid #efd2d6 !important;
    }

html body .cx-profile-terms-document {
    max-height: 48vh !important;
    overflow-y: auto !important;
    padding: 16px 18px !important;
    border: 1px solid var(--cx-r38-9-line) !important;
    border-radius: 11px !important;
    background: #fff !important;
    color: #253e57 !important;
    font-size: .9rem !important;
    line-height: 1.58 !important;
}

html body .cx-profile-terms-actions {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 12px !important;
    padding: 12px 14px !important;
    border: 1px solid #ead9dc !important;
    border-radius: 10px !important;
    background: #fff9f9 !important;
}

html body .account-list-inline-add,
html body .account-list-document-add {
    width: 36px !important;
    height: 36px !important;
    min-width: 36px !important;
    display: inline-grid !important;
    place-items: center !important;
    padding: 0 !important;
    border: 1px solid #a8c8b1 !important;
    border-radius: 8px !important;
    background: #f7fbf8 !important;
    color: #37814e !important;
    font-size: 13px !important;
}

@media (max-width: 767.98px) {
    html body .page-title {
        font-size: 1.34rem !important;
    }

    html body .cx-log-list-card .conexgo-pagedlist-table {
        min-width: 680px !important;
    }

    html body .cx-profile-terms-header,
    html body .cx-profile-terms-actions {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
    }
}

html body .notification-list-card > .cx-notification-filter-panel {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    border-radius: 0 !important;
}

    html body .notification-list-card > .cx-notification-filter-panel .cx-filter-disclosure-header {
        min-height: 48px !important;
    }

html body .notification-list-card-body {
    padding-top: 12px !important;
}

html body .cx-notification-device-filter {
    width: 100% !important;
    min-width: 0 !important;
}

    html body .cx-notification-device-filter .cx-notification-priority-toolbar {
        min-width: 0 !important;
    }

    html body .cx-notification-device-filter .device-filter-grid {
        grid-template-columns: repeat(2, minmax(220px, 320px)) !important;
        align-items: end !important;
        justify-content: start !important;
        gap: 10px 12px !important;
    }

    html body .cx-notification-device-filter .device-filter-field,
    html body .cx-notification-device-filter .device-filter-control,
    html body .cx-notification-device-filter .cx-custom-select,
    html body .cx-notification-device-filter .cx-custom-select-trigger,
    html body .cx-notification-device-filter .cx-notification-filter-date {
        width: 100% !important;
        min-width: 0 !important;
    }

        html body .cx-notification-device-filter .cx-custom-select-trigger,
        html body .cx-notification-device-filter .cx-notification-filter-date,
        html body .cx-notification-device-filter .cx-notification-filter-date input {
            min-height: 41px !important;
            height: 41px !important;
        }

    html body .cx-notification-device-filter .device-filter-label {
        min-height: 26px !important;
        margin-bottom: 5px !important;
    }

    
    html body .cx-notification-device-filter .device-filter-updating {
        min-height: 26px !important;
    }

@media (max-width: 767.98px) {
    html body .device-list-data-row,
    html body .device-list-data-row > div,
    html body .device-list-data-row .table-responsive,
    html body .device-list-data-row .conexgo-pagedlist-table-region,
    html body .device-list-data-row .conexgo-pagedlist-table-column,
    html body .device-list-data-row .conexgo-pagedlist-native-mobile,
    html body .device-list-data-row .conexgo-pagedlist-native-mobile table,
    html body .device-list-data-row .conexgo-pagedlist-native-mobile tbody,
    html body .device-list-data-row .conexgo-pagedlist-native-mobile tr,
    html body .device-list-data-row .conexgo-pagedlist-native-mobile td {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        box-sizing: border-box !important;
    }

        html body .device-list-data-row .conexgo-pagedlist-native-mobile table,
        html body .device-list-data-row .conexgo-pagedlist-native-mobile tbody {
            display: block !important;
        }

            html body .device-list-data-row .conexgo-pagedlist-native-mobile tbody tr {
                display: block !important;
                margin-inline: 0 !important;
            }

                html body .device-list-data-row .conexgo-pagedlist-native-mobile tbody tr > td:first-child {
                    display: block !important;
                    padding-inline: 8px !important;
                }

    html body .device-list-action-group {
        width: 100% !important;
        max-width: 100% !important;
        display: flex !important;
        align-items: stretch !important;
    }

        html body .device-list-action-group .device-list-name-button {
            width: auto !important;
            min-width: 0 !important;
            max-width: none !important;
            flex: 1 1 auto !important;
        }

        html body .device-list-action-group .device-list-action-toggle {
            width: 42px !important;
            min-width: 42px !important;
            flex: 0 0 42px !important;
        }

    html body .device-list-meta {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
    }

    html body .device-mobile-status.cx-device-mobile-status {
        width: 100% !important;
        min-width: 0 !important;
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) auto !important;
        align-items: center !important;
        gap: 7px !important;
    }

    html body .device-mobile-status .device-mobile-status-pill {
        width: 100% !important;
        min-width: 0 !important;
        max-width: none !important;
    }

    html body .device-mobile-status .device-mobile-status-icons {
        width: auto !important;
        min-width: max-content !important;
        justify-content: flex-end !important;
        gap: 4px !important;
    }

    html body .cx-notification-device-filter .device-filter-grid {
        grid-template-columns: minmax(0, 1fr) !important;
    }

    html body .cx-notification-device-filter .device-filter-toolbar,
    html body .cx-notification-device-filter .device-filter-toolbar-actions {
        width: 100% !important;
    }

    html body .cx-notification-device-filter .device-filter-reset {
        width: 100% !important;
    }
}

@media (min-width: 992px) {
    html body .device-list-card,
    html body .device-list-card .card-body,
    html body .device-list-data-row,
    html body .device-list-data-row > div,
    html body .device-list-data-row .table-responsive,
    html body .device-list-data-row .conexgo-pagedlist-table-region,
    html body .device-list-data-row .conexgo-pagedlist-table-column {
        min-height: 0 !important;
        margin-bottom: 0 !important;
        padding-bottom: 0 !important;
    }

        html body .device-list-card:has(.device-list-action-menu.show),
        html body .device-list-data-row:has(.device-list-action-menu.show),
        html body .device-list-data-row .table-responsive:has(.device-list-action-menu.show) {
            min-height: 0 !important;
            padding-bottom: 0 !important;
            margin-bottom: 0 !important;
            overflow-y: visible !important;
        }
}

.cx-dashboard-priority-order > .conexgo-dashboard-smart-item[data-dashboard-key="deviceStatus"] {
    order: 1 !important;
}

.cx-dashboard-priority-order > .conexgo-dashboard-smart-item[data-dashboard-key="latestAlerts"] {
    order: 2 !important;
}

.cx-dashboard-priority-order > .conexgo-dashboard-smart-item[data-dashboard-key="alertTrend"] {
    order: 3 !important;
}

.cx-dashboard-priority-order > .conexgo-dashboard-smart-item[data-dashboard-key="topAlertDevices"] {
    order: 4 !important;
}

.cx-dashboard-priority-order > .conexgo-dashboard-smart-item[data-dashboard-key="totalDevices"] {
    order: 5 !important;
}

.cx-dashboard-priority-order > .conexgo-dashboard-smart-item[data-dashboard-key="offlineDevices"] {
    order: 6 !important;
}

.cx-dashboard-priority-order > .conexgo-dashboard-smart-item[data-dashboard-key="activeUsers"] {
    order: 7 !important;
}

@media (min-width: 1200px) {
    html body #conexgoDashboardSmartGrid > .conexgo-dashboard-smart-item > .conexgo-dashboard-resizable-card:not(.conexgo-dashboard-minimized-card) {
        min-height: 0 !important;
        resize: vertical !important;
        overflow: hidden !important;
    }
}

@media (max-width: 1199.98px) {
    html body #conexgoDashboardSmartGrid > .conexgo-dashboard-smart-item > .conexgo-dashboard-resizable-card {
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        resize: none !important;
        overflow: visible !important;
    }
}

html body #conexgoDashboardSmartGrid .conexgo-dashboard-card-body-auto,
html body #conexgoDashboardSmartGrid .conexgo-dashboard-resizable-list,
html body #conexgoDashboardSmartGrid .card-body {
    min-height: 0 !important;
    max-height: none !important;
}

html body #conexgoDashboardSmartGrid .conexgo-dashboard-empty-state,
html body #conexgoDashboardSmartGrid .conexgo-dashboard-empty-state.compact {
    min-height: 0 !important;
}

    html body #conexgoDashboardSmartGrid .conexgo-dashboard-empty-state.compact {
        padding-block: 16px !important;
    }

html body .conexgo-dashboard-visibility-panel {
    align-items: stretch !important;
}

html body .conexgo-dashboard-visibility-option {
    min-height: 64px !important;
    border: 1px solid #d7e2ec !important;
    border-radius: 9px !important;
    background: #fff !important;
    transition: background-color .14s ease, border-color .14s ease, box-shadow .14s ease !important;
}

    html body .conexgo-dashboard-visibility-option:hover,
    html body .conexgo-dashboard-visibility-option:focus-within {
        border-color: #b9cfdf !important;
        background: #f8fbfd !important;
        box-shadow: 0 2px 8px rgba(44, 76, 108, .06) !important;
    }

    html body .conexgo-dashboard-visibility-option:has(input:checked) {
        border-color: #aec8db !important;
        background: #f2f7fb !important;
    }

html body .conexgo-dashboard-config-section,
html body .conexgo-dashboard-visibility-section {
    transition: background-color .14s ease, border-color .14s ease !important;
}

    html body .conexgo-dashboard-config-section:hover,
    html body .conexgo-dashboard-visibility-section:hover {
        border-color: #c6d8e6 !important;
        background: #fbfdff !important;
    }

@media (min-width: 1800px) {
    html body .cx-dashboard-page {
        --cx-dashboard-wide-gap: 18px;
    }

    html body #conexgoDashboardSmartGrid .card-header .card-title {
        font-size: 1.04rem !important;
    }

    html body #conexgoDashboardSmartGrid .card-body {
        font-size: .94rem !important;
    }
}

html body .conexgo-header-alerts .conexgo-alert-dropdown {
    width: 500px !important;
    max-width: calc(100vw - 20px) !important;
    padding: 0 !important;
    overflow: hidden !important;
    border: 1px solid #d9e1e8 !important;
    border-radius: 8px !important;
    background: #fff !important;
    box-shadow: 0 12px 28px rgba(31, 61, 89, .14) !important;
}

html body .conexgo-header-alerts .conexgo-alert-dropdown-header--classic {
    min-height: 58px !important;
    padding: 10px 12px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 10px !important;
    border-bottom: 1px solid #24425e !important;
    background: #2c4c6c !important;
    color: #ffffff !important;
}

html body .conexgo-alert-classic-header-title {
    min-width: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 7px !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
}

    html body .conexgo-alert-classic-header-title i {
        color: #ffffff !important;
        font-size: 17px !important;
    }

html body .conexgo-alert-classic-clear-all {
    min-height: 36px !important;
    padding: 0 14px !important;
    border: 1px solid #83a0b9 !important;
    border-radius: 4px !important;
    background: #3e6a99 !important;
    color: #fff !important;
    font-size: 12.5px !important;
    font-weight: 650 !important;
    box-shadow: none !important;
}

html body .conexgo-alert-list--classic {
    max-height: min(430px, calc(100dvh - 190px)) !important;
    padding: 0 !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    background: #fff !important;
    scrollbar-width: thin;
    scrollbar-color: #a9b6c2 transparent;
}

html body .conexgo-header-alerts .conexgo-alert-card--classic {
    min-height: 0 !important;
    margin: 0 !important;
    padding: 11px 14px 10px !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    align-items: center !important;
    gap: 12px !important;
    border: 3px solid #0b4ff0 !important;
    border-radius: 0 !important;
    background: #fff !important;
    box-shadow: none !important;
    transform: none !important;
    transition: none !important;
}

    html body .conexgo-header-alerts .conexgo-alert-card--classic + .conexgo-alert-card--classic {
        margin-top: 7px !important;
    }

    html body .conexgo-header-alerts .conexgo-alert-card--classic.conexgo-alert-card--english {
        border-color: #ef334d !important;
    }

    html body .conexgo-header-alerts .conexgo-alert-card--classic.conexgo-alert-card--default {
        border-color: #0b4ff0 !important;
    }

    html body .conexgo-header-alerts .conexgo-alert-card--classic::before {
        display: none !important;
        content: none !important;
    }

    html body .conexgo-header-alerts .conexgo-alert-card--classic:hover,
    html body .conexgo-header-alerts .conexgo-alert-card--classic:focus-within {
        background: #fff !important;
        box-shadow: none !important;
        transform: none !important;
    }

    html body .conexgo-header-alerts .conexgo-alert-card--classic.conexgo-alert-card--english:hover,
    html body .conexgo-header-alerts .conexgo-alert-card--classic.conexgo-alert-card--english:focus-within {
        border-color: #ef334d !important;
    }

    html body .conexgo-header-alerts .conexgo-alert-card--classic.conexgo-alert-card--default:hover,
    html body .conexgo-header-alerts .conexgo-alert-card--classic.conexgo-alert-card--default:focus-within {
        border-color: #0b4ff0 !important;
    }

html body .conexgo-alert-classic-copy {
    min-width: 0 !important;
}

html body .conexgo-header-alerts .conexgo-alert-card-title {
    color: #e31d35 !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    font-style: italic !important;
    line-height: 1.25 !important;
    letter-spacing: 0 !important;
    overflow-wrap: anywhere !important;
}

html body .conexgo-header-alerts .conexgo-alert-card-device {
    margin-top: 2px !important;
    color: #23364b !important;
    font-size: 12px !important;
    font-weight: 650 !important;
    line-height: 1.25 !important;
    overflow-wrap: anywhere !important;
}

html body .conexgo-alert-classic-meta {
    margin-top: 2px !important;
    display: flex !important;
    align-items: center !important;
    flex-wrap: wrap !important;
    gap: 4px !important;
}

html body .conexgo-header-alerts .conexgo-alert-card-time {
    margin: 0 !important;
    color: #526375 !important;
    font-size: 11px !important;
    line-height: 1.2 !important;
}

html body .conexgo-alert-classic-language {
    min-width: 28px !important;
    padding: 2px 5px !important;
    border: 1px solid #0d6efd !important;
    border-radius: 4px !important;
    background: #ffffff !important;
    color: #0d6efd !important;
    font-size: 9.5px !important;
    font-weight: 700 !important;
    line-height: 1.1 !important;
    text-align: center !important;
}

html body .conexgo-alert-card--english .conexgo-alert-classic-language {
    border-color: #ef334d !important;
    color: #d9223c !important;
}

html body .conexgo-alert-classic-assignment {
    margin-top: 7px !important;
    padding-top: 6px !important;
    display: grid !important;
    gap: 1px !important;
    border-top: 1px solid #e3e9ef !important;
    color: #667789 !important;
    font-size: 10.5px !important;
    line-height: 1.2 !important;
}

    html body .conexgo-alert-classic-assignment strong {
        color: #284c70 !important;
        font-size: 11.5px !important;
        font-weight: 700 !important;
    }

html body .conexgo-alert-classic-side {
    min-width: 38px !important;
    align-self: stretch !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-end !important;
    justify-content: space-between !important;
    gap: 9px !important;
}

html body .conexgo-alert-classic-actions {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 7px !important;
}

html body .conexgo-alert-classic-action {
    min-height: 34px !important;
    height: 34px !important;
    padding: 0 12px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 4px !important;
    color: #fff !important;
    font-size: 11.5px !important;
    font-weight: 650 !important;
    box-shadow: none !important;
    transform: none !important;
}

html body .conexgo-alert-classic-action.is-answer {
    width: auto !important;
    min-width: 48px !important;
    padding: 0 13px !important;
    gap: 7px !important;
    white-space: nowrap !important;
    border: 1px solid #78B842 !important;
    background: #78B842 !important;
}

    html body .conexgo-alert-classic-action.is-clear {
        border: 1px solid #1267c7 !important;
        background: #0d6efd !important;
    }

html body .conexgo-alert-empty--classic {
    padding: 22px 14px !important;
    color: #6d7b89 !important;
    font-size: 12px !important;
    text-align: center !important;
}

html body .conexgo-alert-see-all--classic,
html body .conexgo-alert-see-all--classic:hover,
html body .conexgo-alert-see-all--classic:focus-visible {
    min-height: 38px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-top: 1px solid #e2e6ea !important;
    background: #fff !important;
    color: #627083 !important;
    font-size: 11.5px !important;
    font-weight: 500 !important;
    text-decoration: none !important;
}

@media (max-width: 575.98px) {
    html body .conexgo-header-alerts .conexgo-alert-dropdown {
        width: min(430px, calc(100vw - 12px)) !important;
    }

    html body .conexgo-header-alerts .conexgo-alert-card--classic {
        grid-template-columns: minmax(0, 1fr) !important;
    }

    html body .conexgo-alert-classic-side {
        width: 100% !important;
        flex-direction: row !important;
        align-items: center !important;
        justify-content: space-between !important;
    }

    html body .conexgo-alert-classic-actions {
        justify-content: flex-start !important;
    }
}

html body .device-list-table-shell td.device-location-cell {
    min-width: 300px !important;
    padding-top: 11px !important;
    padding-bottom: 11px !important;
    vertical-align: top !important;
}

html body .device-location-summary {
    min-width: 0 !important;
    display: grid !important;
    gap: 2px !important;
    color: #34495e !important;
    font-size: 13px !important;
    line-height: 1.34 !important;
}

html body .device-location-reported {
    color: #2c4c6c !important;
    font-size: 12.5px !important;
    font-weight: 700 !important;
}

html body .device-location-address {
    max-width: 100% !important;
    color: #34495e !important;
    font-size: 13px !important;
    font-weight: 400 !important;
    overflow-wrap: anywhere !important;
}

html body .device-location-fix {
    color: #657586 !important;
    font-size: 11.5px !important;
}

    html body .device-location-fix > span {
        color: #52677a !important;
        font-weight: 650 !important;
    }

html body .alert-list-customer-cell {
    min-width: 0 !important;
    display: grid !important;
    gap: 4px !important;
    color: #34495e !important;
    line-height: 1.35 !important;
}

html body .alert-list-customer-name {
    color: #2c4c6c !important;
    font-size: 13px !important;
    font-weight: 700 !important;
}

html body .alert-list-customer-address {
    color: #647486 !important;
    font-size: 11.5px !important;
    font-weight: 400 !important;
}

html body .alert-list-customer-empty {
    color: #8794a1 !important;
}

html body .alert-list-card td:has(> .alert-list-customer-cell) {
    width: 230px !important;
    min-width: 230px !important;
    max-width: 260px !important;
}

html body .alert-list-customer-address {
    overflow-wrap: normal !important;
    word-break: normal !important;
}

html body .mud-dialog.cx-report-preview-dialog {
    height: min(88dvh, 900px) !important;
    max-height: min(88dvh, 900px) !important;
}

    html body .mud-dialog.cx-report-preview-dialog .mud-dialog-content {
        min-height: 0 !important;
        overflow: hidden !important;
        display: flex !important;
        flex-direction: column !important;
    }

    html body .mud-dialog.cx-report-preview-dialog .cx-report-preview-layout,
    html body .mud-dialog.cx-report-preview-dialog .cx-report-preview-section {
        min-height: 0 !important;
        height: 100% !important;
        display: flex !important;
        flex-direction: column !important;
    }

    html body .mud-dialog.cx-report-preview-dialog .report-preview-summary {
        flex: 0 0 auto !important;
    }

    html body .mud-dialog.cx-report-preview-dialog .report-preview-panel {
        min-height: 0 !important;
        flex: 1 1 auto !important;
        display: flex !important;
        flex-direction: column !important;
        overflow: hidden !important;
    }

    html body .mud-dialog.cx-report-preview-dialog .report-preview-toolbar {
        flex: 0 0 auto !important;
    }

    html body .mud-dialog.cx-report-preview-dialog .report-preview-scroll {
        min-height: 0 !important;
        max-height: none !important;
        flex: 1 1 auto !important;
        overflow: auto !important;
        overscroll-behavior: contain !important;
        scrollbar-gutter: stable !important;
        scrollbar-width: thin !important;
        scrollbar-color: #9db3c5 #eef3f7 !important;
    }

        html body .mud-dialog.cx-report-preview-dialog .report-preview-scroll::-webkit-scrollbar {
            width: 8px;
            height: 8px;
        }

        html body .mud-dialog.cx-report-preview-dialog .report-preview-scroll::-webkit-scrollbar-track {
            background: #eef3f7;
        }

        html body .mud-dialog.cx-report-preview-dialog .report-preview-scroll::-webkit-scrollbar-thumb {
            border: 2px solid #eef3f7;
            border-radius: 999px;
            background: #9db3c5;
        }

    html body .mud-dialog.cx-report-preview-dialog .report-preview-rendered-content {
        overflow: visible !important;
    }

        html body .mud-dialog.cx-report-preview-dialog .report-preview-rendered-content table {
            width: 100% !important;
            min-width: 720px !important;
            max-width: none !important;
        }

@media (max-width: 767.98px) {
    html body .mud-dialog.cx-report-preview-dialog {
        height: calc(100dvh - 12px) !important;
        max-height: calc(100dvh - 12px) !important;
    }

        html body .mud-dialog.cx-report-preview-dialog .report-preview-summary {
            margin-bottom: 10px !important;
            padding: 10px 12px !important;
        }

        html body .mud-dialog.cx-report-preview-dialog .report-preview-scroll {
            padding: 8px !important;
        }

        html body .mud-dialog.cx-report-preview-dialog .report-preview-rendered-content table {
            min-width: 620px !important;
        }
}

html body .mud-dialog.cx-dialog-root .cx-r1-section,
html body .mud-dialog.cx-dialog-root .cx-modal-group-v21 {
    transition: background-color .14s ease, border-color .14s ease !important;
}

    html body .mud-dialog.cx-dialog-root .cx-r1-section:hover,
    html body .mud-dialog.cx-dialog-root .cx-r1-section:focus-within,
    html body .mud-dialog.cx-dialog-root .cx-modal-group-v21:hover,
    html body .mud-dialog.cx-dialog-root .cx-modal-group-v21:focus-within {
        border-color: #6f8da5 !important;
        background: #ffffff !important;
    }

html body .device-list-card,
html body .device-list-card-body,
html body .device-list-data-row,
html body .device-list-data-row > div,
html body .device-list-table-shell,
html body .device-list-data-row .conexgo-pagedlist-table-region,
html body .device-list-data-row .conexgo-pagedlist-table-column {
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    padding-bottom: 0 !important;
    margin-bottom: 0 !important;
}

@media (min-width: 992px) {
    html body .device-list-card:has(.device-list-action-menu.show),
    html body .device-list-table-shell:has(.device-list-action-menu.show),
    html body .device-list-data-row:has(.device-list-action-menu.show),
    html body .device-list-data-row .table-responsive:has(.device-list-action-menu.show),
    html body .device-list-data-row .conexgo-pagedlist-table-region:has(.device-list-action-menu.show),
    html body .device-list-data-row .conexgo-pagedlist-table-column:has(.device-list-action-menu.show),
    html body .device-list-data-row .conexgo-pagedlist-table-column:has( tbody > tr:nth-last-child(-n+4) .device-list-action-menu.show ) {
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        padding-bottom: 0 !important;
        margin-bottom: 0 !important;
        overflow: visible !important;
    }
}

@media (min-width: 992px) {
    html body .device-list-card .conexgo-pagedlist-table tbody td {
        vertical-align: top !important;
        line-height: 1.34 !important;
        word-break: normal !important;
        overflow-wrap: break-word !important;
        hyphens: none !important;
    }

        html body .device-list-card .conexgo-pagedlist-table tbody td:first-child,
        html body .device-list-card .conexgo-pagedlist-table tbody td:nth-child(2) {
            vertical-align: middle !important;
        }
}

html body #conexgoDashboardSmartGrid .card-header {
    min-height: 50px !important;
    padding: 10px 12px !important;
}

    html body #conexgoDashboardSmartGrid .card-header .card-title,
    html body .conexgo-dashboard-configuration-card .card-header .card-title {
        min-width: 0 !important;
        margin: 0 !important;
        font-family: "Helvetica Neue", Helvetica, Arial, sans-serif !important;
        font-size: 15px !important;
        font-weight: 700 !important;
        letter-spacing: -.005em !important;
        line-height: 1.2 !important;
        white-space: normal !important;
        overflow-wrap: anywhere !important;
    }

html body #conexgoDashboardSmartGrid .card-body {
    min-width: 0 !important;
    min-height: 0 !important;
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif !important;
    font-size: 13px !important;
    font-weight: 400 !important;
    line-height: 1.4 !important;
}

html body #conexgoDashboardSmartGrid.conexgo-dashboard-single-column {
    grid-template-columns: minmax(0, 1fr) !important;
}

html body #conexgoDashboardSmartGrid .conexgo-dashboard-resizable-card {
    min-width: 0 !important;
    overflow: hidden !important;
}

html body #conexgoDashboardSmartGrid .conexgo-dashboard-content-fit-card {
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    resize: none !important;
    overflow: hidden !important;
}

html body #conexgoDashboardSmartGrid
.conexgo-dashboard-smart-item[data-dashboard-key="deviceStatus"]
.conexgo-dashboard-table-card-body {
    min-height: 0 !important;
    overflow: hidden !important;
}

html body #conexgoDashboardSmartGrid
.conexgo-dashboard-smart-item[data-dashboard-key="deviceStatus"]
.conexgo-dashboard-table-scroll {
    max-height: none !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    scrollbar-width: thin !important;
}

html body #conexgoDashboardSmartGrid
.conexgo-dashboard-smart-item[data-dashboard-key="deviceStatus"]
.conexgo-device-status-table {
    width: 100% !important;
    min-width: 560px !important;
    table-layout: fixed !important;
}

html body #conexgoDashboardSmartGrid .conexgo-device-status-table th {
    padding: 8px 7px !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
    white-space: normal !important;
}

html body #conexgoDashboardSmartGrid .conexgo-device-status-table td {
    padding: 9px 7px !important;
    font-size: 12.5px !important;
    font-weight: 400 !important;
    line-height: 1.3 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

html body #conexgoDashboardSmartGrid
.conexgo-dashboard-smart-item[data-dashboard-key="deviceStatus"]
.conexgo-device-status-table th:first-child,
html body #conexgoDashboardSmartGrid
.conexgo-dashboard-smart-item[data-dashboard-key="deviceStatus"]
.conexgo-device-status-table td:first-child {
    width: 34% !important;
}

html body #conexgoDashboardSmartGrid .conexgo-dashboard-card-body-auto {
    display: flex !important;
    flex-direction: column !important;
    min-height: 0 !important;
    overflow: hidden !important;
}

html body #conexgoDashboardSmartGrid :is( .conexgo-dashboard-resizable-list, .conexgo-dashboard-active-users-list ) {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    max-height: 100% !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    overscroll-behavior: contain !important;
    scrollbar-width: thin !important;
    scrollbar-color: #a7b7c5 transparent !important;
}

html body #conexgoDashboardSmartGrid .conexgo-dashboard-ranked-item,
html body #conexgoDashboardSmartGrid .conexgo-dashboard-latest-item,
html body #conexgoDashboardSmartGrid .conexgo-dashboard-active-user {
    min-width: 0 !important;
}

html body #conexgoDashboardSmartGrid .conexgo-dashboard-ranked-title,
html body #conexgoDashboardSmartGrid .conexgo-dashboard-latest-title,
html body #conexgoDashboardSmartGrid .conexgo-dashboard-ranked-subtitle {
    min-width: 0 !important;
    overflow-wrap: break-word !important;
    word-break: normal !important;
}

html body #conexgoDashboardSmartGrid .conexgo-dashboard-filter-grid,
html body #conexgoDashboardSmartGrid .conexgo-dashboard-card-filter-row {
    min-width: 0 !important;
}

html body #conexgoDashboardSmartGrid .conexgo-dashboard-config-section-title,
html body #conexgoDashboardSmartGrid .form-label {
    font-size: 12px !important;
    font-weight: 650 !important;
}

@media (min-width: 1200px) {
    html body #conexgoDashboardSmartGrid
    .conexgo-dashboard-smart-item[data-dashboard-key="latestAlerts"] > .conexgo-dashboard-resizable-card:not(.conexgo-dashboard-minimized-card),
    html body #conexgoDashboardSmartGrid
    .conexgo-dashboard-smart-item[data-dashboard-key="topAlertDevices"] > .conexgo-dashboard-resizable-card:not(.conexgo-dashboard-minimized-card),
    html body #conexgoDashboardSmartGrid
    .conexgo-dashboard-smart-item[data-dashboard-key="offlineDevices"] > .conexgo-dashboard-resizable-card:not(.conexgo-dashboard-minimized-card),
    html body #conexgoDashboardSmartGrid
    .conexgo-dashboard-smart-item[data-dashboard-key="activeUsers"] > .conexgo-dashboard-resizable-card:not(.conexgo-dashboard-minimized-card) {
        resize: vertical !important;
        overflow: hidden !important;
    }
}

@media (max-width: 1199.98px) {
    html body #conexgoDashboardSmartGrid > .conexgo-dashboard-smart-item > .conexgo-dashboard-resizable-card {
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        resize: none !important;
        overflow: visible !important;
    }

    html body #conexgoDashboardSmartGrid :is( .conexgo-dashboard-resizable-list, .conexgo-dashboard-active-users-list ) {
        max-height: none !important;
        overflow-y: visible !important;
    }
}

html body .conexgo-pagedlist-pagination .conexgo-pagedlist-page-status .page-link,
html body .conexgo-pagedlist-pagination .conexgo-pagedlist-page-status .page-link:hover,
html body .conexgo-pagedlist-pagination .conexgo-pagedlist-page-status .page-link:focus-visible,
html body .conexgo-pagedlist-pagination .conexgo-pagedlist-page-status .page-link:active {
    background: #315879 !important;
    border-color: #315879 !important;
    color: #fff !important;
    box-shadow: none !important;
    transform: none !important;
}

button.btn:not(.dropdown-toggle):not([data-bs-toggle="dropdown"]):not([data-toggle="dropdown"]):not(:disabled):hover,
a.btn[role="button"]:not(.dropdown-toggle):hover,
input.btn[type="button"]:not(:disabled):hover,
input.btn[type="submit"]:not(:disabled):hover,
.mud-button-root:not(.mud-icon-button-root):not(.mud-tab):not(.mud-disabled):hover {
    transform: translateY(-1px) !important;
    box-shadow: 0 3px 10px rgba(44, 76, 108, .09) !important;
    filter: brightness(.99) !important;
    transition: transform .14s ease, box-shadow .14s ease, filter .14s ease !important;
}

.device-list-name-button:hover,
.device-list-name-button:focus-visible {
    border-color: #315879 !important;
    background: #fff !important;
    color: #2c4c6c !important;
    filter: none !important;
}

.dropdown-toggle:hover,
button[data-bs-toggle="dropdown"]:hover,
button[data-toggle="dropdown"]:hover,
button[aria-haspopup="listbox"]:hover,
button[role="combobox"]:hover,
.mud-select button:hover,
.mud-input-adornment button:hover,
.mud-picker button:hover,
.mud-date-picker button:hover,
.mud-time-picker button:hover,
.conexgo-pagedlist-page-status .page-link:hover {
    transform: none !important;
    box-shadow: none !important;
    filter: none !important;
}

button.btn:not(.dropdown-toggle):not(:disabled):active,
a.btn[role="button"]:not(.dropdown-toggle):active,
input.btn:not(:disabled):active,
.mud-button-root:not(.mud-icon-button-root):not(.mud-tab):not(.mud-disabled):active {
    transform: translateY(0) !important;
    box-shadow: 0 1px 4px rgba(44, 76, 108, .07) !important;
}

html body .cx-custom-select-menu[data-cx-select-owner],
html body .cx-custom-select-menu--top-layer[popover] {
    padding: 5px !important;
    border-radius: 9px !important;
}

    html body .cx-custom-select-menu[data-cx-select-owner] .cx-custom-select-option,
    html body .cx-custom-select-menu--top-layer[popover] .cx-custom-select-option {
        min-height: 36px !important;
        padding: 6px 9px !important;
        grid-template-columns: minmax(0, 1fr) 24px !important;
        gap: 7px !important;
        border-radius: 7px !important;
        font-size: 13px !important;
        font-weight: 560 !important;
    }

    html body .cx-custom-select-menu[data-cx-select-owner] .cx-custom-select-option-check,
    html body .cx-custom-select-menu--top-layer[popover] .cx-custom-select-option-check {
        width: 24px !important;
        height: 24px !important;
    }

html body .cx-paged-list .conexgo-pagedlist-size-select,
html body .cx-paged-list .conexgo-pagedlist-range-select {
    min-height: 36px !important;
    height: 36px !important;
    padding-block: 0 !important;
    font-size: 12.5px !important;
}

    html body .cx-paged-list .conexgo-pagedlist-size-select .cx-custom-select-value,
    html body .cx-paged-list .conexgo-pagedlist-range-select .cx-custom-select-value {
        font-size: 13px !important;
        font-weight: 600 !important;
    }

html body :is(.account-list-device-link, .account-list-email-link) {
    text-decoration: none !important;
    text-underline-offset: 2px !important;
}

    html body :is(.account-list-device-link, .account-list-email-link):is(:hover, :focus-visible) {
        text-decoration: underline !important;
    }

html body .account-list-cell-name {
    width: 285px !important;
    min-width: 285px !important;
}

html body .account-list-table-shell table {
    min-width: 1120px !important;
}

html body .conexgo-pagedlist-pagination .pagination {
    gap: 4px !important;
}

html body .conexgo-pagedlist-pagination .page-link {
    min-width: 34px !important;
    height: 34px !important;
    padding-inline: 7px !important;
    border-radius: 7px !important;
    font-size: 12px !important;
}

html body .conexgo-pagedlist-pagination .conexgo-pagedlist-page-status .page-link {
    min-width: 86px !important;
}

html body .conexgo-pagedlist-page-size .cx-custom-select-trigger,
html body .conexgo-pagedlist-range-select.cx-custom-select-trigger {
    min-height: 36px !important;
    height: 36px !important;
}

html body .cx-report-subscribe-dialog .report-subscribe-form {
    gap: 14px !important;
}

html body .cx-report-subscribe-dialog .report-subscribe-section {
    padding: 16px 18px 18px !important;
}

html body .cx-report-subscribe-dialog .report-subscribe-time-menu {
    max-height: 260px !important;
    overflow-y: auto !important;
}

html body .conexgo-header-notifications .conexgo-notification-dropdown {
    width: min(400px, calc(100vw - 24px)) !important;
    min-width: 320px !important;
    max-width: 400px !important;
    max-height: min(520px, calc(100dvh - 92px)) !important;
    margin-top: 10px !important;
    padding: 0 !important;
    overflow: hidden !important;
    border: 1px solid #cbd8e3 !important;
    border-radius: 11px !important;
    background: #ffffff !important;
    box-shadow: 0 18px 38px rgba(31, 61, 89, .18) !important;
    color: #263f58 !important;
    z-index: 3200 !important;
}

html body .conexgo-notification-dropdown .conexgo-notification-dropdown-header {
    min-height: 64px !important;
    padding: 12px 14px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 12px !important;
    background: #2c4c6c !important;
    color: #ffffff !important;
}

html body .conexgo-notification-dropdown .conexgo-notification-header-main {
    min-width: 0 !important;
    display: flex !important;
    align-items: center !important;
    gap: 11px !important;
}

html body .conexgo-notification-dropdown .conexgo-notification-header-icon {
    width: 36px !important;
    height: 36px !important;
    flex: 0 0 36px !important;
    display: grid !important;
    place-items: center !important;
    border: 1px solid rgba(255,255,255,.22) !important;
    border-radius: 9px !important;
    background: rgba(255,255,255,.09) !important;
    color: #fff !important;
}

html body .conexgo-notification-dropdown .conexgo-notification-header-title-wrap {
    min-width: 0 !important;
}

html body .conexgo-notification-dropdown .conexgo-notification-header-title {
    font-size: 14px !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
    color: #fff !important;
}

html body .conexgo-notification-dropdown .conexgo-notification-header-meta {
    margin-top: 2px !important;
    color: rgba(255,255,255,.78) !important;
    font-size: 11.5px !important;
    line-height: 1.25 !important;
}

html body .conexgo-notification-dropdown .conexgo-notification-header-count {
    min-width: 28px !important;
    height: 28px !important;
    padding: 0 8px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 999px !important;
    font-size: 11px !important;
    font-weight: 750 !important;
}

html body .conexgo-notification-dropdown .conexgo-notification-list {
    max-height: min(340px, calc(100dvh - 220px)) !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    overscroll-behavior: contain !important;
    scrollbar-width: thin !important;
}

html body .conexgo-notification-dropdown .conexgo-notification-item {
    min-width: 0 !important;
    padding: 11px 13px !important;
    display: grid !important;
    grid-template-columns: 36px minmax(0, 1fr) !important;
    align-items: start !important;
    gap: 10px !important;
    border: 1px solid #e6edf3 !important;
    border-left-width: 4px !important;
    border-radius: 9px !important;
    margin: 6px 8px !important;
    width: calc(100% - 16px) !important;
    background: #fff !important;
    color: #263f58 !important;
    text-decoration: none !important;
    transform: none !important;
}

html body .conexgo-notification-dropdown .conexgo-notification-item.is-high {
    border-left-color: #cc3657 !important;
}

html body .conexgo-notification-dropdown .conexgo-notification-item.is-medium {
    border-left-color: #d88418 !important;
}

html body .conexgo-notification-dropdown .conexgo-notification-item.is-information {
    border-left-color: #2f5fa8 !important;
}

    html body .conexgo-notification-dropdown .conexgo-notification-item:is(:hover, :focus-visible) {
    background: #fbfcfd !important;
    color: #263f58 !important;
    box-shadow: none !important;
    transform: none !important;
    filter: none !important;
}

html body .conexgo-notification-dropdown .conexgo-notification-item-icon {
    width: 36px !important;
    height: 36px !important;
    display: grid !important;
    place-items: center !important;
    border-radius: 50% !important;
    background: var(--cx-notification-icon-bg, #eef4f8) !important;
    color: var(--cx-notification-icon-color, #315879) !important;
}

html body .conexgo-notification-dropdown .conexgo-notification-item-content {
    min-width: 0 !important;
}

html body .conexgo-notification-dropdown .conexgo-notification-item-title {
    color: #2c4c6c !important;
    font-size: 12.5px !important;
    font-weight: 650 !important;
    line-height: 1.35 !important;
    overflow-wrap: anywhere !important;
}

html body .conexgo-notification-dropdown .conexgo-notification-item-time {
    margin-top: 3px !important;
    color: #748493 !important;
    font-size: 11px !important;
}

html body .conexgo-notification-dropdown .conexgo-notification-empty {
    min-height: 128px !important;
    padding: 24px 16px !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 9px !important;
    color: #6d7e8e !important;
    font-size: 12.5px !important;
    text-align: center !important;
}

html body .conexgo-notification-dropdown .conexgo-notification-empty-icon {
    width: 42px !important;
    height: 42px !important;
    display: grid !important;
    place-items: center !important;
    border-radius: 50% !important;
    background: #eef4f8 !important;
    color: #527493 !important;
    font-size: 16px !important;
}

html body .conexgo-notification-dropdown .conexgo-notification-see-all-wrap {
    border-top: 1px solid #e3ebf2 !important;
    background: #fbfcfd !important;
}

html body .conexgo-notification-dropdown .conexgo-notification-see-all {
    min-height: 42px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 8px 12px !important;
    background: #fbfcfd !important;
    color: #2c4c6c !important;
    font-size: 12.5px !important;
    font-weight: 700 !important;
    text-decoration: none !important;
    transform: none !important;
}

    html body .conexgo-notification-dropdown .conexgo-notification-see-all:is(:hover, :focus-visible) {
        background: #f1f6fa !important;
        color: #2c4c6c !important;
        transform: none !important;
    }

html body :is( .device-list-action-group .device-list-name-button, .account-list-cell-name .account-list-name-button, .device-list-action-group .device-list-action-toggle, .account-list-cell-name .conexgo-row-action-toggle ),
html body :is( .device-list-action-group .device-list-name-button, .account-list-cell-name .account-list-name-button, .device-list-action-group .device-list-action-toggle, .account-list-cell-name .conexgo-row-action-toggle ):is(:hover, :focus-visible, :active) {
    min-height: 44px !important;
    height: 44px !important;
    border-color: #315879 !important;
    background: #315879 !important;
    color: #ffffff !important;
    box-shadow: none !important;
    transform: none !important;
    filter: none !important;
    transition: none !important;
}

html body .device-list-action-group {
    width: min(100%, 340px) !important;
    min-width: min(300px, 100%) !important;
}

html body .account-list-cell-name {
    width: 255px !important;
    min-width: 255px !important;
}

    html body .account-list-cell-name .conexgo-row-action-group {
        width: 100% !important;
        min-width: 245px !important;
    }

html body :is( .device-list-action-group .device-list-action-toggle, .account-list-cell-name .conexgo-row-action-toggle ) {
    width: 44px !important;
    min-width: 44px !important;
    flex: 0 0 44px !important;
}

html body :is( .device-list-action-group .device-list-name-button, .account-list-cell-name .account-list-name-button ) {
    padding-inline: 12px !important;
    font-size: 13.5px !important;
    font-weight: 650 !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

html body :is( .device-list-action-group, .account-list-cell-name .conexgo-row-action-group ) > :is(.device-list-action-menu, .conexgo-row-action-menu),
html body :is( .device-list-action-group, .account-list-cell-name .conexgo-row-action-group ) > :is(.device-list-action-menu, .conexgo-row-action-menu).show {
    max-height: none !important;
    overflow-y: visible !important;
    overflow-x: hidden !important;
}

    html body :is( .device-list-action-group, .account-list-cell-name .conexgo-row-action-group ) > :is(.device-list-action-menu, .conexgo-row-action-menu).cx-row-menu-scrollable {
        max-height: var(--cx-row-menu-max-height) !important;
        overflow-y: auto !important;
        overscroll-behavior: contain !important;
        scrollbar-width: thin !important;
    }

@media (min-width: 768px) {
    html body :is(.device-list-action-group, .account-list-cell-name .conexgo-row-action-group) > :is(.device-list-action-menu, .conexgo-row-action-menu),
    html body :is(.device-list-action-group, .account-list-cell-name .conexgo-row-action-group) > :is(.device-list-action-menu, .conexgo-row-action-menu).show {
        position: absolute !important;
        top: calc(100% + 6px) !important;
        right: -4px !important;
        bottom: auto !important;
        left: auto !important;
        inset: calc(100% + 6px) -4px auto auto !important;
        width: min(300px, calc(100vw - 28px)) !important;
        min-width: 250px !important;
        margin: 0 !important;
        transform: none !important;
    }
}

html body .cx-notification-device-filter {
    display: grid !important;
    grid-template-columns: repeat(5, minmax(150px, 1fr)) max-content !important;
    align-items: end !important;
    gap: 10px 12px !important;
    padding: 12px 14px 14px !important;
}

    html body .cx-notification-device-filter > .device-filter-toolbar,
    html body .cx-notification-device-filter .device-filter-toolbar-actions,
    html body .cx-notification-device-filter > .device-filter-grid {
        display: contents !important;
    }

    html body .cx-notification-device-filter .device-filter-summary {
        display: none !important;
    }

    html body .cx-notification-device-filter .device-filter-field,
    html body .cx-notification-device-filter .cx-notification-priority-toolbar {
        width: auto !important;
        min-width: 0 !important;
        margin: 0 !important;
    }

    html body .cx-notification-device-filter .cx-notification-priority-toolbar {
        order: 1 !important;
    }

    html body .cx-notification-device-filter > .device-filter-grid > .device-filter-field:nth-child(1) {
        order: 2 !important;
    }

    html body .cx-notification-device-filter > .device-filter-grid > .device-filter-field:nth-child(2) {
        order: 3 !important;
    }

    html body .cx-notification-device-filter > .device-filter-grid > .device-filter-field:nth-child(3) {
        order: 4 !important;
    }

    html body .cx-notification-device-filter > .device-filter-grid > .device-filter-field:nth-child(4) {
        order: 5 !important;
    }

    html body .cx-notification-device-filter .device-filter-reset {
        order: 6 !important;
    }

    html body .cx-notification-device-filter .device-filter-label {
        min-height: 24px !important;
        margin: 0 0 5px !important;
        font-size: 12px !important;
        line-height: 1.2 !important;
    }

    html body .cx-notification-device-filter :is( .cx-custom-select-trigger, .cx-notification-filter-date, .cx-notification-filter-date input ) {
        width: 100% !important;
        min-height: 38px !important;
        height: 38px !important;
        font-size: 13px !important;
    }

    html body .cx-notification-device-filter .device-filter-reset {
        min-width: 104px !important;
        min-height: 38px !important;
        height: 38px !important;
        margin: 0 !important;
        align-self: end !important;
        white-space: nowrap !important;
    }

@media (max-width: 1199.98px) {
    html body .cx-notification-device-filter {
        grid-template-columns: repeat(3, minmax(180px, 1fr)) !important;
    }

        html body .cx-notification-device-filter .device-filter-reset {
            justify-self: start !important;
        }
}

@media (max-width: 899.98px) {
    html body .cx-notification-device-filter {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 575.98px) {
    html body .cx-notification-device-filter {
        grid-template-columns: minmax(0, 1fr) !important;
        padding: 10px !important;
    }

        html body .cx-notification-device-filter .device-filter-reset {
            width: 100% !important;
        }
}

html body .cx-paged-list .conexgo-pagedlist-size-select {
    width: 112px !important;
    min-width: 112px !important;
    min-height: 36px !important;
    height: 36px !important;
}

    html body .cx-paged-list .conexgo-pagedlist-size-select .cx-custom-select-trigger {
        min-height: 36px !important;
        height: 36px !important;
        padding-inline: 10px !important;
    }

html body .conexgo-pagedlist-pagination .page-link,
html body .conexgo-pagedlist-pagination .page-link:hover,
html body .conexgo-pagedlist-pagination .page-link:focus-visible,
html body .conexgo-pagedlist-pagination .page-link:active {
    transform: none !important;
    filter: none !important;
    box-shadow: none !important;
}

@media (max-width: 767.98px) {
    html body .device-list-action-group,
    html body .account-list-cell-name .conexgo-row-action-group {
        width: 100% !important;
        min-width: 0 !important;
    }

    html body .account-list-cell-name {
        width: auto !important;
        min-width: 0 !important;
    }
}

html body .mud-dialog.cx-dialog-root :is( .cx-r1-section, fieldset.cx-modal-group-v21, .cx-device-config-section, .alert-email-form, .alert-sms-form ) {
    border: 1.6px solid #6f8da5 !important;
    background: #ffffff !important;
    box-shadow: 0 1px 4px rgba(35, 60, 85, .05) !important;
    transition: background-color .14s ease, border-color .14s ease, box-shadow .14s ease !important;
    transform: none !important;
}

    html body .mud-dialog.cx-dialog-root :is( .cx-r1-section, fieldset.cx-modal-group-v21, .cx-device-config-section, .alert-email-form, .alert-sms-form ):is(:hover, :focus-within) {
        border-color: #567c9c !important;
        background: #f4f8fc !important;
        box-shadow: 0 4px 12px rgba(44, 76, 108, .08) !important;
        transform: none !important;
    }

@media (min-width: 1241px) {
    html body .app-header-modern .app-header-main-row {
        grid-template-columns: minmax(210px, 1fr) minmax(320px, 390px) minmax(330px, 1fr) !important;
        column-gap: clamp(12px, 1.4vw, 22px) !important;
    }

    html body .app-header-modern .app-header-left-zone {
        gap: 11px !important;
    }

    html body .app-header-modern .topbar-version-pill {
        min-width: 124px !important;
        height: 40px !important;
        padding-inline: 12px !important;
    }

    html body .app-header-modern .app-header-center-zone .nt-clock-card {
        width: 100% !important;
        min-width: 300px !important;
        max-width: 390px !important;
        height: 40px !important;
    }
}

@media (max-width: 991.98px) {
    html body .app-header-modern .app-header-left-zone:not(:has(> .app-sidebar__toggle)) {
        grid-template-columns: minmax(0, 1fr) auto !important;
        gap: 8px !important;
    }

        html body .app-header-modern .app-header-left-zone:not(:has(> .app-sidebar__toggle)) > .app-header-brand-link {
            grid-column: 1 !important;
            justify-self: start !important;
            justify-content: flex-start !important;
            padding-left: 2px !important;
        }

        html body .app-header-modern .app-header-left-zone:not(:has(> .app-sidebar__toggle)) > .topbar-version-pill {
            grid-column: 2 !important;
            justify-self: end !important;
        }

    html body .app-header-modern .app-header-center-zone {
        padding-top: 2px !important;
    }

        html body .app-header-modern .app-header-center-zone .nt-clock-card {
            width: min(100%, 440px) !important;
            max-width: 440px !important;
        }
}

@media (max-width: 575.98px) {
    html body .app-header-modern .main-container {
        padding: 6px 8px !important;
    }

    html body .app-header-modern .app-header-main-row {
        row-gap: 4px !important;
    }

    html body .app-header-modern .app-header-left-zone {
        gap: 6px !important;
    }

    html body .app-header-modern .app-sidebar__toggle {
        width: 36px !important;
        min-width: 36px !important;
        height: 36px !important;
        border-radius: 9px !important;
    }

    html body .app-header-modern .app-header-left-zone:not(:has(> .app-sidebar__toggle)) {
        grid-template-columns: minmax(0, 1fr) auto !important;
    }

    html body .app-header-modern .app-header-brand-link {
        height: 36px !important;
    }

    html body .app-header-modern .header-brand-img {
        max-width: 102px !important;
        max-height: 28px !important;
    }

    html body .app-header-modern .topbar-version-pill {
        height: 36px !important;
        min-width: 84px !important;
        max-width: 98px !important;
        padding-inline: 7px !important;
        gap: 5px !important;
    }

    html body .app-header-modern .nt-clock-card {
        width: min(100%, 390px) !important;
        min-width: 0 !important;
        height: 36px !important;
        padding-inline: 9px !important;
        gap: 7px !important;
    }

    html body .app-header-modern .nt-date-text {
        font-size: 8.4pt !important;
    }

    html body .app-header-modern .nt-clock {
        padding-left: 8px !important;
        font-size: 8.8pt !important;
    }

    html body .app-header-modern .nt-seconds,
    html body .app-header-modern .nt-clock-separator-secondary {
        display: none !important;
    }
}

@media (min-width: 1200px) {
    html body .cx-dashboard-page .conexgo-dashboard-config-layout {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 12px !important;
    }

    html body .cx-dashboard-page .conexgo-dashboard-configuration-card > .card-body {
        padding: 14px !important;
    }

    html body .cx-dashboard-page .conexgo-dashboard-config-section,
    html body .cx-dashboard-page .conexgo-dashboard-visibility-section {
        padding: 11px 12px !important;
    }

    html body .cx-dashboard-page .conexgo-dashboard-visibility-section {
        margin-top: 12px !important;
    }

    html body .cx-dashboard-page .conexgo-dashboard-config-section-header,
    html body .cx-dashboard-page .conexgo-dashboard-visibility-heading {
        min-height: 44px !important;
        align-items: center !important;
    }

    html body .cx-dashboard-page .conexgo-dashboard-config-section.is-collapsed
    .conexgo-dashboard-config-section-header,
    html body .cx-dashboard-page .conexgo-dashboard-visibility-section.is-collapsed
    .conexgo-dashboard-visibility-heading {
        margin-bottom: 0 !important;
    }
}

@media (max-width: 767.98px) {
    html body .device-config-page-header,
    html body .device-config-card,
    html body .device-config-card-body,
    html body .device-config-sections-shell,
    html body .device-config-sections-shell .dataTables_wrapper,
    html body .device-config-sections-shell .row,
    html body .device-config-sections-shell .col-sm-12,
    html body .device-config-sections-shell .col-md-12 {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
    }

    html body .device-config-card {
        overflow: hidden !important;
    }

    html body .device-config-card-body {
        padding: 8px !important;
    }

    html body .device-config-section-header {
        grid-template-columns: minmax(0, 1fr) 36px !important;
        gap: 8px !important;
        padding: 9px 10px !important;
    }

        html body .device-config-section-header .device-config-col-feature {
            grid-column: 1 !important;
            min-width: 0 !important;
            overflow-wrap: break-word !important;
            word-break: normal !important;
        }

        html body .device-config-section-header .device-config-col-toggle {
            grid-column: 2 !important;
        }

        html body .device-config-section-header .device-config-column-heading {
            display: none !important;
        }

    html body .device-config-section-content {
        grid-template-columns: 40px minmax(0, 1fr) !important;
        gap: 8px 10px !important;
        padding: 10px !important;
        overflow: hidden !important;
        align-items: start !important;
    }

        html body .device-config-section-content .device-config-col-customer {
            grid-column: 1 / -1 !important;
            grid-row: auto !important;
            width: 100% !important;
            min-width: 0 !important;
            padding-bottom: 8px !important;
        }

        html body .device-config-section-content .device-config-col-edit,
        html body .device-config-section-content .device-config-col-edit--standalone {
            grid-column: 1 !important;
            grid-row: 2 !important;
            width: 40px !important;
            min-width: 40px !important;
            align-self: start !important;
        }

        html body .device-config-section-content .device-config-col-value,
        html body .device-config-section--schedule.device-config-section-content .device-config-col-value,
        html body .device-config-section--ringtone.device-config-section-content .device-config-col-value--wide,
        html body .device-config-section--geofence.device-config-section-content .device-config-col-value--geofence {
            grid-column: 2 !important;
            grid-row: 2 !important;
            width: 100% !important;
            min-width: 0 !important;
            max-width: 100% !important;
            display: block !important;
            align-self: center !important;
            word-break: normal !important;
            overflow-wrap: break-word !important;
            white-space: normal !important;
        }

        html body .device-config-section-content :is( .device-config-col-email, .device-config-col-sms, .device-config-col-updated, .device-config-col-schedule ) {
            grid-column: 1 / -1 !important;
            grid-row: auto !important;
            width: 100% !important;
            min-width: 0 !important;
            max-width: 100% !important;
            display: grid !important;
            grid-template-columns: minmax(86px, 112px) minmax(0, 1fr) !important;
            gap: 8px !important;
            padding-top: 8px !important;
            word-break: normal !important;
            overflow-wrap: break-word !important;
            white-space: normal !important;
        }

            html body .device-config-section-content :is( .device-config-col-email, .device-config-col-sms, .device-config-col-updated, .device-config-col-schedule ) * {
                min-width: 0 !important;
                max-width: 100% !important;
                word-break: normal !important;
                overflow-wrap: break-word !important;
                white-space: normal !important;
            }
}

html body .alert-answer-map-canvas--empty {
    min-height: 150px !important;
    height: 150px !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    color: #6b7e90 !important;
    background: #f8fafc !important;
}

    html body .alert-answer-map-canvas--empty > i {
        color: #6f8da5 !important;
        font-size: 20px !important;
    }

@media (min-width: 768px) {
    html body textarea.form-control:not(:disabled):not([readonly]):not(.note-codable):not(.fr-code),
    html body .mud-dialog textarea:not(:disabled):not([readonly]):not(.note-codable):not(.fr-code),
    html body .panel-body textarea:not(:disabled):not([readonly]):not(.note-codable):not(.fr-code) {
        resize: both !important;
        overflow: auto !important;
        min-width: 180px !important;
        max-width: 100% !important;
        min-height: 72px !important;
        max-height: 60dvh !important;
    }

    html body .mud-dialog.cx-r1-device-addedit textarea.cx-direct-large-textarea {
        resize: both !important;
        min-width: 240px !important;
        min-height: 92px !important;
        max-width: 100% !important;
        max-height: 60dvh !important;
    }
}

@media (max-width: 767.98px) {
    html body textarea.form-control:not(:disabled):not([readonly]):not(.note-codable):not(.fr-code),
    html body .mud-dialog textarea:not(:disabled):not([readonly]):not(.note-codable):not(.fr-code),
    html body .panel-body textarea:not(:disabled):not([readonly]):not(.note-codable):not(.fr-code) {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        resize: vertical !important;
        overflow: auto !important;
    }
}

html body ul.nav.panel-tabs {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    gap: 7px !important;
    width: 100% !important;
    margin: 0 0 14px !important;
    padding: 6px !important;
    list-style: none !important;
    border: 1px solid #dce6ee !important;
    border-radius: 10px !important;
    background: #f7fafc !important;
    box-shadow: none !important;
}

    html body ul.nav.panel-tabs > li {
        flex: 0 0 auto !important;
        width: auto !important;
        margin: 0 !important;
        padding: 0 !important;
        border: 0 !important;
        background: transparent !important;
    }

        html body ul.nav.panel-tabs > li > a {
            display: inline-flex !important;
            align-items: center !important;
            justify-content: center !important;
            gap: 8px !important;
            min-height: 42px !important;
            margin: 0 !important;
            padding: 8px 13px !important;
            border: 1px solid transparent !important;
            border-radius: 8px !important;
            background: transparent !important;
            color: #315270 !important;
            font-family: "Helvetica Neue", Helvetica, Arial, sans-serif !important;
            font-size: .92rem !important;
            font-weight: 700 !important;
            line-height: 1.15 !important;
            text-decoration: none !important;
            white-space: nowrap !important;
            transform: none !important;
            box-shadow: none !important;
            transition: background-color .14s ease, border-color .14s ease, color .14s ease !important;
        }

            html body ul.nav.panel-tabs > li > a:hover,
            html body ul.nav.panel-tabs > li > a:focus-visible {
                background: #edf4f8 !important;
                border-color: #d2dfe9 !important;
                color: #244b6b !important;
                transform: none !important;
                box-shadow: none !important;
            }

            html body ul.nav.panel-tabs > li > a.active,
            html body ul.nav.panel-tabs > li.active > a,
            html body ul.nav.panel-tabs > li > a[aria-selected="true"] {
                background: #315879 !important;
                border-color: #315879 !important;
                color: #ffffff !important;
                box-shadow: 0 2px 6px rgba(37, 72, 101, .14) !important;
                transform: none !important;
            }

            html body ul.nav.panel-tabs > li > a :is(i, svg) {
                flex: 0 0 auto !important;
            }

            html body ul.nav.panel-tabs > li > a img {
                width: 22px !important;
                height: 22px !important;
                max-width: 22px !important;
                max-height: 22px !important;
                object-fit: contain !important;
                flex: 0 0 22px !important;
                transform: none !important;
            }

            html body ul.nav.panel-tabs > li > a.active img,
            html body ul.nav.panel-tabs > li.active > a img,
            html body ul.nav.panel-tabs > li > a[aria-selected="true"] img {
                filter: brightness(0) invert(1) !important;
            }

html body .device-geofence-tabs {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    gap: 7px !important;
    padding: 6px !important;
    margin: 0 0 14px !important;
    border: 1px solid #dce6ee !important;
    border-radius: 10px !important;
    background: #f7fafc !important;
}

    html body .device-geofence-tabs .nav-link {
        min-height: 42px !important;
        margin: 0 !important;
        padding: 8px 13px !important;
        border: 1px solid transparent !important;
        border-radius: 8px !important;
        background: transparent !important;
        color: #315270 !important;
        font-weight: 700 !important;
        transform: none !important;
        box-shadow: none !important;
    }

        html body .device-geofence-tabs .nav-link:hover,
        html body .device-geofence-tabs .nav-link:focus-visible {
            background: #edf4f8 !important;
            border-color: #d2dfe9 !important;
            color: #244b6b !important;
            transform: none !important;
        }

        html body .device-geofence-tabs .nav-link.active {
            background: #315879 !important;
            border-color: #315879 !important;
            color: #fff !important;
            transform: none !important;
        }

@media (max-width: 575.98px) {
    html body ul.nav.panel-tabs,
    html body .device-geofence-tabs {
        flex-wrap: nowrap !important;
        overflow-x: auto !important;
        overscroll-behavior-inline: contain !important;
        scrollbar-width: thin !important;
    }
}

html body .account-list-card .cx-account-filter-panel {
    margin: 0 !important;
    border-top: 1px solid #e1e9f0 !important;
    border-bottom: 1px solid #e1e9f0 !important;
    background: #fbfdff !important;
}

html body .cx-account-filter-panel .cx-filter-disclosure-toggle {
    min-height: 52px !important;
}

html body .cx-account-filter-panel .cx-filter-disclosure-inner {
    overflow: visible !important;
}

html body .cx-account-filter-grid {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(150px, 1fr)) max-content !important;
    align-items: end !important;
    gap: 10px 12px !important;
    padding: 12px 14px 14px !important;
}

    html body .cx-account-filter-grid .device-filter-field {
        width: auto !important;
        min-width: 0 !important;
        margin: 0 !important;
    }

    html body .cx-account-filter-grid .device-filter-label {
        min-height: 24px !important;
        margin: 0 0 5px !important;
        font-size: 12px !important;
        line-height: 1.2 !important;
    }

    html body .cx-account-filter-grid .cx-custom-select-trigger {
        width: 100% !important;
        min-height: 38px !important;
        height: 38px !important;
        font-size: 13px !important;
    }

html body .cx-account-filter-reset {
    min-width: 112px !important;
    min-height: 38px !important;
    height: 38px !important;
    margin: 0 !important;
    align-self: end !important;
    white-space: nowrap !important;
}

html body .cx-account-filter-progress {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    min-height: 34px !important;
    padding: 0 14px 12px !important;
    color: #5a7084 !important;
    font-size: 12px !important;
}

@media (max-width: 899.98px) {
    html body .cx-account-filter-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    html body .cx-account-filter-reset {
        justify-self: start !important;
    }
}

@media (max-width: 575.98px) {
    html body .cx-account-filter-grid {
        grid-template-columns: minmax(0, 1fr) !important;
        padding: 10px !important;
    }

    html body .cx-account-filter-reset {
        width: 100% !important;
    }
}

@media (min-width: 992px) {
    html body .cx-notification-device-filter {
        grid-template-columns: minmax(108px, .78fr) minmax(150px, 1.05fr) minmax(140px, .95fr) minmax(150px, 1fr) minmax(150px, 1fr) max-content !important;
        gap: 8px 9px !important;
        padding: 11px 12px 13px !important;
    }

        html body .cx-notification-device-filter .device-filter-reset {
            min-width: 96px !important;
            width: auto !important;
            justify-self: end !important;
        }
}

@media (min-width: 768px) {
    html body .device-list-action-group {
        width: min(100%, 340px) !important;
        min-width: 0 !important;
        max-width: 340px !important;
    }

    html body .device-list-name-button,
    html body .device-list-action-toggle,
    html body .account-list-name-button,
    html body .conexgo-row-action-toggle {
        min-height: 42px !important;
        height: 42px !important;
    }

    html body .account-list-cell-name {
        width: 255px !important;
        min-width: 220px !important;
        max-width: 255px !important;
    }

        html body .account-list-cell-name .conexgo-row-action-group {
            width: 100% !important;
            min-width: 0 !important;
            max-width: 255px !important;
        }
}

html body .conexgo-pagedlist-table > thead > tr > th.sorting::before,
html body .conexgo-pagedlist-table > thead > tr > th.sorting::after,
html body .conexgo-pagedlist-table > thead > tr > th.sorting_asc::before,
html body .conexgo-pagedlist-table > thead > tr > th.sorting_asc::after,
html body .conexgo-pagedlist-table > thead > tr > th.sorting_desc::before,
html body .conexgo-pagedlist-table > thead > tr > th.sorting_desc::after {
    content: none !important;
    display: none !important;
    opacity: 0 !important;
}

html body .device-model-list-card .conexgo-pagedlist-table > thead > tr > th:first-child,
html body .device-model-list-card .conexgo-pagedlist-table > tbody > tr > td:first-child {
    width: 92px !important;
    min-width: 92px !important;
    max-width: 92px !important;
    text-align: center !important;
}

html body .device-model-list-card td.bstable-actions {
    padding-inline: 8px !important;
    white-space: nowrap !important;
}

    html body .device-model-list-card td.bstable-actions .btn-list {
        display: flex !important;
        flex-flow: row nowrap !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 6px !important;
        margin: 0 !important;
    }

    html body .device-model-list-card td.bstable-actions .btn {
        width: 36px !important;
        min-width: 36px !important;
        height: 36px !important;
        min-height: 36px !important;
        padding: 0 !important;
        display: inline-grid !important;
        place-items: center !important;
        margin: 0 !important;
        transform: none !important;
    }

html body .device-model-list-card .conexgo-pagedlist-table > thead > tr > th {
    padding-block: 11px !important;
    vertical-align: middle !important;
}

html body .mud-dialog.cx-notification-view-dialog,
html body .mud-dialog.cx-r1-notification-view {
    width: min(840px, calc(100vw - 32px)) !important;
    max-width: min(840px, calc(100vw - 32px)) !important;
    max-height: min(82dvh, 760px) !important;
}

    html body .mud-dialog.cx-notification-view-dialog .mud-dialog-content,
    html body .mud-dialog.cx-r1-notification-view .mud-dialog-content {
        min-height: 0 !important;
        overflow-y: auto !important;
        padding: 14px 16px !important;
    }

    html body .mud-dialog.cx-notification-view-dialog .cx-r1-section,
    html body .mud-dialog.cx-r1-notification-view .cx-r1-section {
        padding: 14px !important;
    }

    html body .mud-dialog.cx-notification-view-dialog .mud-dialog-actions,
    html body .mud-dialog.cx-r1-notification-view .mud-dialog-actions {
        position: sticky !important;
        bottom: 0 !important;
        z-index: 3 !important;
        background: #f7fafc !important;
    }

@media (max-width: 767.98px) {
    html body .mud-dialog.cx-notification-view-dialog,
    html body .mud-dialog.cx-r1-notification-view {
        width: calc(100vw - 14px) !important;
        max-width: calc(100vw - 14px) !important;
        max-height: calc(100dvh - 14px) !important;
    }
}

@media (min-width: 768px) {
    html body .mud-dialog.cx-r1-account-addedit .cx-r1-form-row {
        display: grid !important;
        grid-template-columns: minmax(170px, 200px) minmax(0, 1fr) !important;
        align-items: center !important;
        column-gap: 18px !important;
        row-gap: 6px !important;
        width: 100% !important;
        margin: 0 0 14px !important;
    }

        html body .mud-dialog.cx-r1-account-addedit .cx-r1-form-row > .form-label,
        html body .mud-dialog.cx-r1-account-addedit .cx-r1-form-row > .col-md-3 {
            grid-column: 1 !important;
            width: 100% !important;
            max-width: none !important;
            padding: 0 !important;
            margin: 0 !important;
            text-align: right !important;
            align-self: center !important;
        }

        html body .mud-dialog.cx-r1-account-addedit .cx-r1-form-row > .col-md-9 {
            grid-column: 2 !important;
            width: 100% !important;
            max-width: none !important;
            min-width: 0 !important;
            padding: 0 !important;
            margin: 0 !important;
        }

        html body .mud-dialog.cx-r1-account-addedit .cx-r1-form-row :is( .form-control, .cx-custom-select-root, .cx-control, .cx-readonly-value ) {
            width: 100% !important;
            min-width: 0 !important;
            margin-bottom: 0 !important;
        }

    html body .mud-dialog.cx-r1-account-addedit .cx-r1-section-description {
        margin: 0 0 16px !important;
    }
}

@media (max-width: 767.98px) {
    html body .mud-dialog.cx-r1-account-addedit .cx-r1-form-row {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
        gap: 6px !important;
        width: 100% !important;
        margin: 0 0 13px !important;
    }

        html body .mud-dialog.cx-r1-account-addedit .cx-r1-form-row > .form-label,
        html body .mud-dialog.cx-r1-account-addedit .cx-r1-form-row > .col-md-3,
        html body .mud-dialog.cx-r1-account-addedit .cx-r1-form-row > .col-md-9 {
            grid-column: 1 !important;
            width: 100% !important;
            max-width: 100% !important;
            padding: 0 !important;
            margin: 0 !important;
            text-align: left !important;
        }
}

@media (min-width: 768px) {
    html body .mud-dialog.cx-dialog-root textarea.cx-dialog-textarea:not([readonly]):not(:disabled),
    html body .mud-dialog textarea.cx-direct-large-textarea:not([readonly]):not(:disabled),
    html body .panel-body textarea.cx-dialog-textarea:not([readonly]):not(:disabled) {
        display: block !important;
        box-sizing: border-box !important;
        width: min(86%, 920px);
        min-width: min(280px, 100%);
        max-width: 100% !important;
        min-height: 92px !important;
        max-height: min(62dvh, 680px) !important;
        resize: both !important;
        overflow: auto !important;
        overscroll-behavior: contain;
    }

    html body .mud-dialog.cx-dialog-root textarea.form-control:not(.cx-dialog-textarea):not([readonly]):not(:disabled),
    html body .panel-body textarea.form-control:not(.cx-dialog-textarea):not([readonly]):not(:disabled) {
        min-width: min(240px, 100%);
        max-width: 100% !important;
        max-height: min(62dvh, 680px) !important;
        resize: both !important;
        overflow: auto !important;
    }

    html body .mud-dialog.cx-dialog-root textarea:is( .cx-dialog-textarea, .cx-direct-large-textarea ):focus {
        border-color: #6f96b8 !important;
        box-shadow: 0 0 0 3px rgba(62, 106, 153, .10) !important;
    }
}

@media (max-width: 767.98px) {
    html body textarea.cx-dialog-textarea:not([readonly]):not(:disabled),
    html body textarea.cx-direct-large-textarea:not([readonly]):not(:disabled) {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        resize: vertical !important;
        overflow: auto !important;
    }
}

html body .cx-notification-device-filter {
    display: block !important;
    width: 100% !important;
    padding: 0 !important;
}

html body .cx-notification-filter-main-grid {
    display: grid !important;
    grid-template-columns: minmax(150px, 1.05fr) minmax(120px, .78fr) minmax(165px, 1fr) minmax(150px, .95fr) max-content !important;
    align-items: end !important;
    gap: 10px 12px !important;
    width: 100% !important;
    padding: 14px 16px !important;
}

    html body .cx-notification-filter-main-grid > .device-filter-field {
        min-width: 0 !important;
        width: auto !important;
        margin: 0 !important;
    }

    html body .cx-notification-filter-main-grid .device-filter-label,
    html body .cx-notification-custom-range .device-filter-label {
        min-height: 24px !important;
        margin: 0 0 6px !important;
        font-size: 12px !important;
        line-height: 1.2 !important;
    }

    html body .cx-notification-filter-main-grid :is( .device-filter-control, .cx-custom-select-root, .cx-custom-select-trigger ),
    html body .cx-notification-custom-range :is( .cx-notification-filter-date, .cx-notification-filter-date input ) {
        min-width: 0 !important;
        width: 100% !important;
    }

    html body .cx-notification-filter-main-grid .cx-notification-filter-reset {
        min-width: 112px !important;
        width: auto !important;
        height: 42px !important;
        min-height: 42px !important;
        margin: 0 !important;
        padding: 0 14px !important;
        align-self: end !important;
        justify-self: end !important;
        white-space: nowrap !important;
    }

html body .cx-notification-custom-range {
    margin: 0 16px 16px !important;
    padding: 14px !important;
    border: 1px solid #d9e4ec !important;
    border-left: 4px solid #5c83a7 !important;
    border-radius: 10px !important;
    background: linear-gradient(180deg, #fbfcfd 0%, #f7fafc 100%) !important;
    box-shadow: 0 3px 12px rgba(34, 70, 105, .045) !important;
}

html body .cx-notification-custom-range-grid {
    display: grid !important;
    grid-template-columns: minmax(180px, 1fr) minmax(180px, 1fr) max-content !important;
    align-items: end !important;
    gap: 10px 12px !important;
}

html body .cx-notification-custom-apply {
    min-width: 118px !important;
    height: 42px !important;
    min-height: 42px !important;
    padding: 0 16px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    border: 1px solid #315a80 !important;
    border-radius: 8px !important;
    background: #315a80 !important;
    color: #fff !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    white-space: nowrap !important;
    box-shadow: 0 2px 5px rgba(34, 70, 105, .10) !important;
}

    html body .cx-notification-custom-apply:hover:not(:disabled),
    html body .cx-notification-custom-apply:focus-visible:not(:disabled) {
        background: #294e70 !important;
        border-color: #294e70 !important;
    }

    html body .cx-notification-custom-apply:disabled {
        opacity: .58 !important;
        cursor: not-allowed !important;
    }

@media (max-width: 1199.98px) {
    html body .cx-notification-filter-main-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

        html body .cx-notification-filter-main-grid .cx-notification-filter-reset {
            justify-self: start !important;
        }
}

@media (max-width: 767.98px) {
    html body .cx-notification-filter-main-grid {
        grid-template-columns: minmax(0, 1fr) !important;
        padding: 12px !important;
    }

    html body .cx-notification-custom-range {
        margin: 0 12px 12px !important;
        padding: 12px !important;
    }

    html body .cx-notification-custom-range-grid {
        grid-template-columns: minmax(0, 1fr) !important;
    }

    html body .cx-notification-filter-main-grid .cx-notification-filter-reset,
    html body .cx-notification-custom-apply {
        width: 100% !important;
        justify-self: stretch !important;
    }
}

html body :is(.device-list-action-menu, .conexgo-row-action-menu) {
    min-width: 224px !important;
    width: max-content !important;
    max-width: min(276px, calc(100vw - 24px)) !important;
    max-height: 320px !important;
    padding: 4px !important;
    border: 1px solid #cad7e2 !important;
    border-radius: 10px !important;
    background: #ffffff !important;
    box-shadow: 0 12px 30px rgba(18, 49, 78, .15), 0 2px 8px rgba(18, 49, 78, .07) !important;
    overflow-x: hidden !important;
}

    html body :is(.device-list-action-menu, .conexgo-row-action-menu) .dropdown-item {
        min-height: 34px !important;
        display: flex !important;
        align-items: center !important;
        gap: 9px !important;
        padding: 7px 9px !important;
        border-radius: 7px !important;
        color: #214467 !important;
        font-size: 13px !important;
        font-weight: 600 !important;
        line-height: 1.25 !important;
        white-space: normal !important;
        transform: none !important;
    }

        html body :is(.device-list-action-menu, .conexgo-row-action-menu) .dropdown-item:hover,
        html body :is(.device-list-action-menu, .conexgo-row-action-menu) .dropdown-item:focus-visible {
            background: #f1f6f9 !important;
            color: #173b62 !important;
            transform: none !important;
        }

    html body :is(.device-list-action-menu, .conexgo-row-action-menu) .dropdown-divider {
        height: 1px !important;
        margin: 4px 5px !important;
        border: 0 !important;
        background: #e3ebf1 !important;
    }

@media (min-width: 768px) {
    html body :is(.device-list-action-group, .conexgo-row-action-group).cx-row-menu-open-above > :is(.device-list-action-menu, .conexgo-row-action-menu),
    html body :is(.device-list-action-group, .conexgo-row-action-group).cx-row-menu-open-above > :is(.device-list-action-menu, .conexgo-row-action-menu).show {
        top: auto !important;
        right: -4px !important;
        bottom: calc(100% + 6px) !important;
        left: auto !important;
        inset: auto -4px calc(100% + 6px) auto !important;
        transform: none !important;
    }
}

html body .conexgo-profile-icon-picker {
    position: relative !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
}

html body .conexgo-profile-icon-picker__trigger {
    width: 100% !important;
    min-height: 44px !important;
    display: grid !important;
    grid-template-columns: 36px minmax(0, 1fr) 30px !important;
    align-items: center !important;
    gap: 9px !important;
    padding: 4px 5px 4px 6px !important;
    border: 1px solid #c9d7e3 !important;
    border-radius: 10px !important;
    background: #ffffff !important;
    color: #173b62 !important;
    text-align: left !important;
    box-shadow: 0 1px 2px rgba(22, 55, 87, .035) !important;
}

    html body .conexgo-profile-icon-picker__trigger:hover {
        border-color: #91a9bd !important;
    }

    html body .conexgo-profile-icon-picker__trigger[aria-expanded="true"] {
        border-color: #6f8faa !important;
        box-shadow: 0 0 0 3px rgba(62, 106, 153, .12) !important;
    }

html body .conexgo-profile-icon-picker__preview {
    width: 34px !important;
    height: 34px !important;
    display: inline-grid !important;
    place-items: center !important;
    overflow: hidden !important;
    border: 1px solid #d8e2ea !important;
    border-radius: 50% !important;
    background: #f5f8fa !important;
    color: #64809a !important;
}

    html body .conexgo-profile-icon-picker__preview img,
    html body .conexgo-profile-icon-picker__panel button > img {
        width: 100% !important;
        height: 100% !important;
        object-fit: cover !important;
        border-radius: 50% !important;
    }

html body .conexgo-profile-icon-picker__label {
    min-width: 0 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    font-size: 13.5px !important;
    font-weight: 600 !important;
}

html body .conexgo-profile-icon-picker__chevron {
    width: 30px !important;
    height: 30px !important;
    display: inline-grid !important;
    place-items: center !important;
    border-radius: 7px !important;
    background: #f3f7fa !important;
    color: #3e6386 !important;
}

html body .conexgo-profile-icon-picker__panel {
    position: absolute !important;
    top: calc(100% + 6px) !important;
    left: 0 !important;
    right: auto !important;
    width: min(100%, 520px) !important;
    z-index: 3200 !important;
    display: grid !important;
    gap: 2px !important;
    max-height: 300px !important;
    padding: 5px !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    border: 1px solid #cbd8e3 !important;
    border-radius: 10px !important;
    background: #ffffff !important;
    box-shadow: 0 12px 30px rgba(18, 49, 78, .15), 0 2px 8px rgba(18, 49, 78, .07) !important;
    scrollbar-width: thin !important;
}

    html body .conexgo-profile-icon-picker__panel > button {
        width: 100% !important;
        min-height: 40px !important;
        display: grid !important;
        grid-template-columns: 32px minmax(0, 1fr) 24px !important;
        align-items: center !important;
        gap: 9px !important;
        padding: 4px 8px !important;
        border: 0 !important;
        border-radius: 7px !important;
        background: transparent !important;
        color: #214467 !important;
        font-size: 13px !important;
        font-weight: 600 !important;
        text-align: left !important;
    }

        html body .conexgo-profile-icon-picker__panel > button > img,
        html body .conexgo-profile-icon-picker__option-none {
            width: 30px !important;
            height: 30px !important;
            display: inline-grid !important;
            place-items: center !important;
            border-radius: 50% !important;
            background: #f5f8fa !important;
        }

        html body .conexgo-profile-icon-picker__panel > button:hover,
        html body .conexgo-profile-icon-picker__panel > button[aria-selected="true"] {
            background: #eef4f8 !important;
        }

        html body .conexgo-profile-icon-picker__panel > button[aria-selected="true"] {
            box-shadow: inset 3px 0 0 #3e6a99 !important;
        }

html body .conexgo-profile-icon-picker__check {
    width: 24px !important;
    height: 24px !important;
    display: inline-grid !important;
    place-items: center !important;
    justify-self: end !important;
    color: #3e6a99 !important;
}

html body .conexgo-account-profile {
    margin-bottom: 16px !important;
}

    html body .conexgo-account-profile > .card-body {
        padding-bottom: 18px !important;
    }

    html body .conexgo-account-profile .tabs-menu-body,
    html body .conexgo-account-profile .tab-content {
        padding-bottom: 0 !important;
    }

    html body .conexgo-account-profile .form-horizontal {
        width: min(100%, 1040px) !important;
    }

        html body .conexgo-account-profile .form-horizontal > .row:last-of-type {
            margin-bottom: 0 !important;
        }

    html body .conexgo-account-profile .mt-4 {
        margin-top: 16px !important;
    }

html body .mud-dialog.cx-dialog-root :is( .mud-dialog-actions, .dialog-background-surface.mud-dialog-actions, .cx-dialog-actions ) {
    min-height: 62px !important;
    padding: 10px 14px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 8px !important;
    flex-wrap: nowrap !important;
    border-top: 1px solid #d8e2eb !important;
    background: #f7f9fb !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
}

html body .mud-dialog.cx-dialog-root :is( .mud-dialog-actions, .cx-dialog-actions ) > * {
    flex: 0 0 auto !important;
}

html body .mud-dialog.cx-dialog-root .cx-dialog-action,
html body .mud-dialog.cx-dialog-root .mud-dialog-actions .mud-button-root.cx-dialog-action,
html body .mud-dialog.cx-dialog-root .mud-dialog-actions .btn.cx-dialog-action {
    box-sizing: border-box !important;
    width: auto !important;
    min-width: 96px !important;
    max-width: none !important;
    height: 42px !important;
    min-height: 42px !important;
    max-height: 42px !important;
    padding: 0 14px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 7px !important;
    border-radius: 8px !important;
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif !important;
    font-size: 12.5px !important;
    font-weight: 750 !important;
    line-height: 1 !important;
    letter-spacing: .004em !important;
    white-space: nowrap !important;
    box-shadow: 0 1px 2px rgba(25, 54, 82, .05) !important;
    transform: none !important;
}

html body .mud-dialog.cx-dialog-root .cx-dialog-action--save-close {
    min-width: 146px !important;
}

html body .mud-dialog.cx-dialog-root .cx-dialog-action--publish,
html body .mud-dialog.cx-dialog-root .cx-dialog-action--send {
    min-width: 112px !important;
}

html body .mud-dialog.cx-dialog-root .cx-dialog-action :is(i, svg),
html body .mud-dialog.cx-dialog-root .mud-dialog-actions .cx-dialog-action :is(i, svg) {
    width: 15px !important;
    min-width: 15px !important;
    height: 15px !important;
    margin: 0 !important;
    display: inline-grid !important;
    place-items: center !important;
    font-size: 13px !important;
    line-height: 1 !important;
}

html body .mud-dialog.cx-dialog-root .cx-dialog-action .mud-button-label {
    width: auto !important;
    min-width: 0 !important;
    height: auto !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 7px !important;
    line-height: 1 !important;
}

html body .mud-dialog.cx-dialog-root .cx-dialog-action:hover:not(:disabled):not(.mud-disabled) {
    transform: translateY(-1px) !important;
    box-shadow: 0 4px 10px rgba(31, 62, 91, .11) !important;
}

html body .mud-dialog.cx-dialog-root .cx-dialog-action:active:not(:disabled):not(.mud-disabled) {
    transform: none !important;
    box-shadow: 0 1px 2px rgba(25, 54, 82, .06) !important;
}

@media (max-width: 767.98px) {
    
    html body .mud-dialog.cx-dialog-root .cx-dialog-action,
    html body .mud-dialog.cx-dialog-root .mud-dialog-actions .mud-button-root.cx-dialog-action,
    html body .mud-dialog.cx-dialog-root .mud-dialog-actions .btn.cx-dialog-action {
        width: 44px !important;
        min-width: 44px !important;
        max-width: 44px !important;
        height: 44px !important;
        min-height: 44px !important;
        max-height: 44px !important;
        padding: 0 !important;
        flex: 0 0 44px !important;
        font-size: 0 !important;
        overflow: hidden !important;
    }

        html body .mud-dialog.cx-dialog-root .cx-dialog-action .mud-button-label {
            width: 100% !important;
            height: 100% !important;
            gap: 0 !important;
        }

        html body .mud-dialog.cx-dialog-root .cx-dialog-action :is(i, svg) {
            width: 18px !important;
            min-width: 18px !important;
            height: 18px !important;
            font-size: 16px !important;
        }
}

@media (min-width: 768px) {
    html body textarea.form-control:not(:disabled):not([readonly]):not(.note-codable):not(.fr-code),
    html body .mud-dialog.cx-dialog-root textarea:not(:disabled):not([readonly]):not(.note-codable):not(.fr-code),
    html body .panel-body textarea.form-control:not(:disabled):not([readonly]):not(.note-codable):not(.fr-code) {
        box-sizing: border-box !important;
        width: 100%;
        height: auto;
        min-width: min(240px, 100%) !important;
        max-width: 100% !important;
        min-height: 84px !important;
        max-height: min(65dvh, 720px) !important;
        resize: both !important;
        overflow: auto !important;
        overscroll-behavior: contain !important;
    }

    html body .mud-dialog.cx-r1-device-addedit textarea.cx-direct-large-textarea:not(:disabled):not([readonly]) {
        width: min(88%, 980px);
        height: 148px;
        min-width: min(300px, 100%) !important;
        min-height: 92px !important;
    }
}

@media (max-width: 767.98px) {
    html body textarea.form-control:not(:disabled):not([readonly]):not(.note-codable):not(.fr-code),
    html body .mud-dialog.cx-dialog-root textarea:not(:disabled):not([readonly]):not(.note-codable):not(.fr-code) {
        width: 100% !important;
        height: auto !important;
        min-width: 0 !important;
        max-width: 100% !important;
        resize: vertical !important;
        overflow: auto !important;
    }
}

html body .account-list-cell-name {
    width: 340px !important;
    min-width: 320px !important;
    max-width: 380px !important;
}

    html body .account-list-cell-name .conexgo-row-action-group {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 380px !important;
        display: flex !important;
        flex-wrap: nowrap !important;
    }

    html body .account-list-cell-name .account-list-name-button {
        flex: 1 1 auto !important;
        min-width: 0 !important;
        width: auto !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
    }

    html body .account-list-cell-name .conexgo-row-action-toggle,
    html body .device-list-action-group .device-list-action-toggle {
        flex: 0 0 42px !important;
        width: 42px !important;
        min-width: 42px !important;
        max-width: 42px !important;
        padding-inline: 0 !important;
    }

html body :is(.account-list-cell-name, .device-list-action-group)
:is(.conexgo-row-action-menu, .device-list-action-menu) {
    min-width: 238px !important;
    width: max-content !important;
    max-width: min(300px, calc(100vw - 24px)) !important;
}

@media (min-width: 768px) {
    html body .account-list-cell-name .conexgo-row-action-group > .conexgo-row-action-menu,
    html body .account-list-cell-name .conexgo-row-action-group > .conexgo-row-action-menu.show {
        left: 0 !important;
        right: auto !important;
        inset-inline-start: 0 !important;
        inset-inline-end: auto !important;
        transform: none !important;
    }
}

html body .cx-r1-device-geofence .device-geofence-tabs {
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    gap: 5px !important;
    width: 100% !important;
    margin: 2px 0 14px !important;
    padding: 5px !important;
    overflow-x: auto !important;
    overscroll-behavior-inline: contain !important;
    border: 1px solid #dce6ee !important;
    border-radius: 11px !important;
    background: #f5f8fb !important;
    scrollbar-width: thin !important;
}

html body .cx-r1-device-geofence .device-geofence-tab {
    flex: 0 0 auto !important;
    min-width: 118px !important;
    max-width: 190px !important;
    min-height: 42px !important;
    height: 42px !important;
    display: grid !important;
    grid-template-columns: auto minmax(0, 1fr) 10px !important;
    align-items: center !important;
    gap: 6px !important;
    padding: 0 10px !important;
    border: 1px solid transparent !important;
    border-radius: 8px !important;
    background: transparent !important;
    color: #315879 !important;
    box-shadow: none !important;
    transform: none !important;
}

    html body .cx-r1-device-geofence .device-geofence-tab:hover:not(:disabled),
    html body .cx-r1-device-geofence .device-geofence-tab:focus-visible {
        border-color: #cfdee9 !important;
        background: #eaf2f8 !important;
        color: #244b6b !important;
        transform: none !important;
    }

    html body .cx-r1-device-geofence .device-geofence-tab.active {
        border-color: #315879 !important;
        background: #315879 !important;
        color: #fff !important;
        box-shadow: 0 3px 9px rgba(49, 88, 121, .14) !important;
    }

html body .cx-r1-device-geofence .device-geofence-tab-number {
    opacity: .78 !important;
    font-size: 11.5px !important;
    font-weight: 750 !important;
}

html body .cx-r1-device-geofence .device-geofence-tab-name {
    min-width: 0 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

html body .cx-r1-device-geofence .device-geofence-tab-status {
    width: 9px !important;
    height: 9px !important;
    display: block !important;
    border-radius: 999px !important;
    background: #b7c4cf !important;
}

html body .cx-r1-device-geofence .device-geofence-tab-status-enabled {
    background: #5da873 !important;
}

html body .cx-r1-device-geofence .device-geofence-tab.active .device-geofence-tab-status-enabled {
    background: #bde8c9 !important;
}

html body .cx-r1-device-geofence .device-geofence-tab.active .device-geofence-tab-status-disabled {
    background: rgba(255, 255, 255, .58) !important;
}

html body .device-geofence-topbar {
    gap: 10px !important;
    margin-bottom: 12px !important;
}

html body .device-geofence-preview-button {
    min-height: 40px !important;
    padding: 0 13px !important;
    border-radius: 9px !important;
    box-shadow: none !important;
}

html body .device-geofence-configuration-layout-with-preview {
    display: grid !important;
    grid-template-columns: minmax(0, 1.4fr) minmax(290px, .6fr) !important;
    align-items: stretch !important;
    gap: 14px !important;
}

html body .device-geofence-map-card {
    width: 100% !important;
    min-width: 0 !important;
    min-height: 300px !important;
    max-height: 500px !important;
    border: 1px solid #ccdbe6 !important;
    border-radius: 11px !important;
    background: #fff !important;
    box-shadow: 0 5px 16px rgba(44, 76, 108, .07) !important;
    resize: vertical !important;
    overflow: hidden !important;
}

html body .device-geofence-map-header {
    min-height: 42px !important;
    padding: 8px 10px !important;
    background: #f5f8fb !important;
    border-bottom: 1px solid #dce6ee !important;
}

html body .device-geofence-map-preview {
    min-height: 240px !important;
}

html body .device-geofence-dialog-actions .device-geofence-delete {
    margin-right: auto !important;
}

html body .app-header-modern .topbar-version-pill {
    min-width: 128px !important;
    height: 40px !important;
    padding: 0 11px 0 9px !important;
    gap: 8px !important;
    border: 1px solid #dbe5ed !important;
    border-radius: 11px !important;
    background: linear-gradient(180deg, #fff 0%, #f8fafc 100%) !important;
    box-shadow: 0 2px 6px rgba(44, 76, 108, .05) !important;
}

html body .app-header-modern .topbar-version-icon {
    width: 27px !important;
    height: 27px !important;
    display: inline-grid !important;
    place-items: center !important;
    border-radius: 8px !important;
    background: #eef4f8 !important;
    color: #3e6a99 !important;
}

html body .app-header-modern .topbar-version-content {
    display: flex !important;
    align-items: baseline !important;
    gap: 5px !important;
    min-width: 0 !important;
}

html body .app-header-modern .topbar-version-label {
    font-size: 10.5px !important;
    font-weight: 650 !important;
    letter-spacing: .04em !important;
    text-transform: uppercase !important;
    color: #74879a !important;
}

html body .app-header-modern .topbar-version-value {
    font-size: 13.5px !important;
    font-weight: 750 !important;
    color: #274c6c !important;
}

html body .app-header-modern .nt-clock-card {
    min-width: 330px !important;
    max-width: 410px !important;
    height: 40px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 11px !important;
    padding: 0 13px !important;
    border: 1px solid #dbe5ed !important;
    border-radius: 11px !important;
    background: linear-gradient(180deg, #fff 0%, #f8fafc 100%) !important;
    box-shadow: 0 2px 6px rgba(44, 76, 108, .045) !important;
}

html body .app-header-modern .nt-date,
html body .app-header-modern .nt-clock {
    display: flex !important;
    align-items: center !important;
    gap: 6px !important;
    margin: 0 !important;
    padding-block: 0 !important;
}

html body .app-header-modern .nt-clock {
    padding-left: 11px !important;
    border-left: 1px solid #dbe5ed !important;
    font-variant-numeric: tabular-nums !important;
}

html body .app-header-modern .nt-clock-value {
    min-width: 18px !important;
    text-align: center !important;
    font-variant-numeric: tabular-nums !important;
    font-weight: 720 !important;
}

html body .app-header-modern .conexgo-header-profile > .nav-link {
    border-radius: 999px !important;
    transition: transform .16s ease, background-color .16s ease, box-shadow .16s ease !important;
}

    html body .app-header-modern .conexgo-header-profile > .nav-link:hover,
    html body .app-header-modern .conexgo-header-profile > .nav-link:focus-visible {
        transform: translateY(-1px) !important;
        background: #eef4f8 !important;
        box-shadow: 0 4px 12px rgba(44, 76, 108, .10) !important;
    }

html body .app-header-modern .conexgo-header-profile .profile-user {
    transition: transform .16s ease, box-shadow .16s ease !important;
}

html body .app-header-modern .conexgo-header-profile > .nav-link:hover .profile-user,
html body .app-header-modern .conexgo-header-profile > .nav-link:focus-visible .profile-user {
    transform: scale(1.035) !important;
}

@media (max-width: 1199.98px) {
    html body .cx-account-filter-grid,
    html body .cx-notification-filter-business-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    html body .device-geofence-configuration-layout-with-preview {
        grid-template-columns: minmax(0, 1fr) !important;
    }

    html body .device-geofence-map-card {
        max-height: 440px !important;
    }

    html body .app-header-modern .nt-clock-card {
        min-width: 280px !important;
        max-width: 350px !important;
    }

    html body .app-header-modern .nt-seconds,
    html body .app-header-modern .nt-clock-separator-secondary {
        display: none !important;
    }
}

@media (max-width: 767.98px) {
    html body .cx-account-filter-toolbar,
    html body .cx-notification-filter-toolbar {
        align-items: stretch !important;
        flex-direction: column !important;
        padding: 10px !important;
    }

        html body .cx-account-filter-toolbar .device-filter-toolbar-actions,
        html body .cx-notification-filter-toolbar-actions {
            width: 100% !important;
            margin-left: 0 !important;
            justify-content: stretch !important;
        }

    html body .cx-account-filter-reset,
    html body .cx-notification-filter-reset {
        width: 100% !important;
    }

    html body .cx-notification-filter-toolbar .cx-notification-period-field {
        width: 100% !important;
        min-width: 0 !important;
        flex-basis: auto !important;
    }

    html body .cx-account-filter-grid,
    html body .cx-notification-filter-business-grid {
        grid-template-columns: minmax(0, 1fr) !important;
        padding: 10px !important;
    }

    html body .cx-notification-custom-range {
        margin: 0 10px 10px !important;
    }

    html body .cx-notification-custom-range-grid {
        grid-template-columns: minmax(0, 1fr) !important;
        padding: 12px !important;
    }

    html body .cx-notification-custom-apply {
        width: 100% !important;
    }

    html body .account-list-cell-name {
        width: auto !important;
        min-width: 260px !important;
        max-width: none !important;
    }

        html body .account-list-cell-name .conexgo-row-action-group {
            max-width: none !important;
        }

    html body .cx-r1-device-geofence .device-geofence-tab {
        min-width: 110px !important;
    }

    html body .device-geofence-map-card {
        min-height: 270px !important;
        max-height: 410px !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    html body .app-header-modern .conexgo-header-profile > .nav-link,
    html body .app-header-modern .conexgo-header-profile .profile-user,
    html body .cx-custom-select-chevron i {
        transition: none !important;
        transform: none !important;
    }
}

html body.cx-design-system :is( .device-list-action-group, .account-list-cell-name .conexgo-row-action-group ) {
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: stretch !important;
    overflow: visible !important;
    border-radius: 9px !important;
}

html body.cx-design-system :is( .device-list-action-group .device-list-name-button, .account-list-cell-name .account-list-name-button ),
html body.cx-design-system :is( .device-list-action-group .device-list-name-button, .account-list-cell-name .account-list-name-button ):is(:hover, :focus, :active) {
    min-height: 44px !important;
    height: 44px !important;
    border-color: #315879 !important;
    border-right-color: #547b9d !important;
    border-radius: 9px 0 0 9px !important;
    background: #315879 !important;
    color: #ffffff !important;
    box-shadow: none !important;
    transform: none !important;
    filter: none !important;
}

html body.cx-design-system :is( .device-list-action-group .device-list-action-toggle, .account-list-cell-name .conexgo-row-action-toggle ),
html body.cx-design-system :is( .device-list-action-group .device-list-action-toggle, .account-list-cell-name .conexgo-row-action-toggle ):focus-visible {
    flex: 0 0 42px !important;
    width: 42px !important;
    min-width: 42px !important;
    max-width: 42px !important;
    min-height: 44px !important;
    height: 44px !important;
    padding: 0 !important;
    border: 1px solid #274d6d !important;
    border-left-color: #6889a5 !important;
    border-radius: 0 9px 9px 0 !important;
    background: #264f71 !important;
    color: #eef6fb !important;
    box-shadow: none !important;
    transform: none !important;
    transition: background-color .14s ease, border-color .14s ease, color .14s ease !important;
}

    html body.cx-design-system :is( .device-list-action-group .device-list-action-toggle, .account-list-cell-name .conexgo-row-action-toggle ):hover {
        border-color: #1d405e !important;
        border-left-color: #7e9bb4 !important;
        background: #1f4666 !important;
        color: #ffffff !important;
        transform: none !important;
    }

    html body.cx-design-system :is( .device-list-action-group .device-list-action-toggle, .account-list-cell-name .conexgo-row-action-toggle )[aria-expanded="true"] {
        border-color: #173a56 !important;
        background: #193f5d !important;
        color: #ffffff !important;
    }

html body.cx-design-system .account-list-cell-name {
    width: 310px !important;
    min-width: 300px !important;
    max-width: 340px !important;
}

    html body.cx-design-system .account-list-cell-name .conexgo-row-action-group,
    html body.cx-design-system .device-list-action-group {
        width: 100% !important;
        max-width: 340px !important;
        min-width: 0 !important;
    }

        html body.cx-design-system .account-list-cell-name .account-list-name-button,
        html body.cx-design-system .device-list-action-group .device-list-name-button {
            flex: 1 1 auto !important;
            min-width: 0 !important;
            overflow: hidden !important;
            text-overflow: ellipsis !important;
            white-space: nowrap !important;
        }

html body.cx-design-system .account-list-table-shell {
    overflow-x: auto !important;
    overscroll-behavior-inline: contain !important;
    scrollbar-gutter: stable both-edges !important;
}

    html body.cx-design-system .account-list-table-shell .conexgo-pagedlist-table {
        min-width: 980px !important;
        table-layout: auto !important;
    }

html body.cx-design-system .account-list-cell-contact {
    min-width: 280px !important;
}

html body.cx-design-system .account-list-cell-devices {
    min-width: 240px !important;
    width: 270px !important;
    vertical-align: top !important;
}

html body.cx-design-system .account-list-device-links {
    display: grid !important;
    gap: 5px !important;
    margin-bottom: 7px !important;
}

html body.cx-design-system .account-list-device-link {
    width: fit-content !important;
    max-width: 100% !important;
    line-height: 1.35 !important;
    overflow-wrap: anywhere !important;
}

html body.cx-design-system .account-list-cell-comment {
    min-width: 190px !important;
}

html body.cx-design-system .cx-paged-list .conexgo-pagedlist-toolbar {
    width: 100% !important;
    min-height: 0 !important;
    margin: 0 0 9px !important;
    padding: 9px 10px !important;
    display: grid !important;
    grid-template-columns: minmax(0, auto) minmax(0, 1fr) !important;
    align-items: end !important;
    gap: 10px 16px !important;
    border: 1px solid #e0e8ef !important;
    border-radius: 11px !important;
    background: #fbfdff !important;
    box-shadow: none !important;
}

html body.cx-design-system .cx-paged-list .conexgo-pagedlist-filters {
    display: flex !important;
    align-items: end !important;
    flex-wrap: wrap !important;
    gap: 10px !important;
}

html body.cx-design-system .cx-paged-list .conexgo-pagedlist-field {
    gap: 5px !important;
}

html body.cx-design-system .cx-paged-list .conexgo-pagedlist-size-select {
    width: 118px !important;
    min-width: 118px !important;
}

html body.cx-design-system .cx-paged-list .conexgo-pagedlist-range-select {
    width: 210px !important;
    min-width: 210px !important;
}

html body.cx-design-system .cx-paged-list .conexgo-pagedlist-pagination {
    justify-self: end !important;
    align-self: end !important;
    margin: 0 !important;
}

    html body.cx-design-system .cx-paged-list .conexgo-pagedlist-pagination .pagination {
        margin: 0 !important;
        gap: 5px !important;
    }

html body.cx-design-system .cx-paged-list .conexgo-pagedlist-custom {
    margin: 0 0 10px !important;
    padding: 10px !important;
    border: 1px solid #d8e4ed !important;
    border-left: 3px solid #4e7ba3 !important;
    border-top-width: 1px !important;
    border-radius: 11px !important;
    background: #f8fbfd !important;
    box-shadow: none !important;
}

    html body.cx-design-system .cx-paged-list .conexgo-pagedlist-custom::before {
        display: none !important;
    }

html body.cx-design-system .cx-paged-list .conexgo-pagedlist-custom-fields {
    width: 100% !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 20px minmax(0, 1fr) auto !important;
    align-items: end !important;
    gap: 10px !important;
}

html body.cx-design-system .cx-paged-list .conexgo-pagedlist-custom-group {
    display: grid !important;
    grid-template-columns: minmax(180px, 1fr) minmax(130px, .58fr) !important;
    align-items: end !important;
    gap: 10px !important;
}

html body.cx-design-system .cx-paged-list .conexgo-pagedlist-custom-separator {
    display: grid !important;
    width: 20px !important;
    min-width: 20px !important;
    height: 42px !important;
    place-items: center !important;
}

html body.cx-design-system .cx-paged-list .conexgo-pagedlist-apply {
    width: auto !important;
    min-width: 112px !important;
    max-width: none !important;
    height: 42px !important;
    min-height: 42px !important;
    grid-column: auto !important;
    align-self: end !important;
    padding: 0 14px !important;
}

html body.cx-design-system .cx-paged-list .conexgo-pagedlist-table-region {
    margin-top: 0 !important;
}

html body.cx-design-system .alert-list-card-body .cx-filter-disclosure-inner > .alert-filter-panel {
    padding: 9px 10px 10px !important;
}

    html body.cx-design-system .alert-list-card-body .alert-filter-inline > label {
        min-height: 36px !important;
        margin: 0 !important;
        padding: 5px 9px !important;
        display: inline-flex !important;
        align-items: center !important;
        gap: 7px !important;
        border: 1px solid #dce5ed !important;
        border-radius: 9px !important;
        background: #fbfdff !important;
        color: #31516f !important;
    }

        html body.cx-design-system .alert-list-card-body .alert-filter-inline > label:hover {
            border-color: #bfd0dd !important;
            background: #f2f7fa !important;
        }

html body.cx-design-system .mud-dialog.cx-report-subscribe-dialog {
    width: min(1040px, calc(100vw - 32px)) !important;
    max-width: min(1040px, calc(100vw - 32px)) !important;
}

html body.cx-design-system .cx-report-subscribe-dialog .mud-dialog-content {
    padding: 10px 12px !important;
    max-height: min(72dvh, 760px) !important;
}

html body.cx-design-system .cx-report-subscribe-dialog .cx-modal-layout-v21,
html body.cx-design-system .cx-report-subscribe-dialog .report-subscribe-form {
    gap: 10px !important;
}

html body.cx-design-system .cx-report-subscribe-dialog .report-subscribe-section {
    padding: 12px 14px 13px !important;
    border-radius: 11px !important;
}

html body.cx-design-system .cx-report-subscribe-dialog .cx-r1-section-title {
    margin-bottom: 4px !important;
    font-size: 16px !important;
}

html body.cx-design-system .cx-report-subscribe-dialog .cx-r1-section-icon {
    width: 38px !important;
    height: 38px !important;
    min-width: 38px !important;
    flex-basis: 38px !important;
}

html body.cx-design-system .cx-report-subscribe-dialog .cx-r1-section-description {
    margin-bottom: 10px !important;
    font-size: 13px !important;
}

html body.cx-design-system .cx-report-subscribe-dialog .report-subscribe-schedule-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 10px 12px !important;
}

html body.cx-design-system .cx-report-subscribe-dialog .report-subscribe-next-send {
    margin-top: 10px !important;
    padding: 9px 11px !important;
    grid-template-columns: 34px minmax(0, 1fr) !important;
    gap: 9px !important;
    border-radius: 9px !important;
    background: #f6f9fc !important;
}

html body.cx-design-system .cx-report-subscribe-dialog .report-subscribe-next-send-icon {
    width: 34px !important;
    height: 34px !important;
    border-radius: 8px !important;
}

html body.cx-design-system .cx-report-subscribe-dialog .report-subscribe-next-send-value {
    margin-top: 0 !important;
    font-size: .88rem !important;
}

html body.cx-design-system .cx-report-subscribe-dialog .report-subscribe-next-send-summary {
    margin-top: 1px !important;
    font-size: .74rem !important;
}

html body.cx-design-system .mud-dialog.cx-r8-account-email {
    width: min(980px, calc(100vw - 32px)) !important;
    max-width: min(980px, calc(100vw - 32px)) !important;
}

html body.cx-design-system .cx-r8-account-email .mud-dialog-content {
    padding: 12px 14px !important;
    max-height: min(74dvh, 760px) !important;
}

html body.cx-design-system .cx-r8-account-email .cx-modal-layout-v21 {
    gap: 10px !important;
}

html body.cx-design-system .cx-r8-account-email .cx-r8-email-section {
    width: 100% !important;
    max-width: none !important;
    padding: 12px 14px 14px !important;
    border-radius: 11px !important;
}

html body.cx-design-system .cx-r8-account-email .cx-r8-section-description {
    margin: 0 0 10px !important;
}

html body.cx-design-system .cx-r8-account-email .cx-r8-email-tabs {
    margin-bottom: 10px !important;
    padding: 4px !important;
    gap: 5px !important;
}

html body.cx-design-system .cx-r8-account-email .cx-r8-email-tab {
    min-height: 38px !important;
    height: 38px !important;
    padding: 0 12px !important;
}

html body.cx-design-system .cx-r8-account-email .cx-r8-form-row {
    grid-template-columns: 126px minmax(0, 1fr) !important;
    gap: 7px 12px !important;
    margin-bottom: 9px !important;
}

    html body.cx-design-system .cx-r8-account-email .cx-r8-form-row > .form-label {
        padding-top: 10px !important;
    }

html body.cx-design-system .cx-r8-account-email .form-control:not(textarea),
html body.cx-design-system .cx-r8-account-email .cx-custom-select-trigger {
    min-height: 42px !important;
    height: 42px !important;
}

html body.cx-design-system .cx-r8-account-email textarea.form-control {
    height: 168px;
    min-height: 120px !important;
    max-height: min(60dvh, 620px) !important;
    resize: both !important;
    overflow: auto !important;
}

html body.cx-design-system .mud-dialog.cx-r1-alert-view,
html body.cx-design-system .mud-dialog.cx-r1-alert-answer {
    width: min(1020px, calc(100vw - 32px)) !important;
    max-width: min(1020px, calc(100vw - 32px)) !important;
}

html body.cx-design-system :is(.cx-r1-alert-view, .cx-r1-alert-answer) .mud-dialog-content {
    padding: 12px 14px !important;
    max-height: min(76dvh, 780px) !important;
}

html body.cx-design-system :is(.cx-r1-alert-view, .cx-r1-alert-answer) .cx-modal-layout-v21 {
    gap: 10px !important;
}

html body.cx-design-system :is(.cx-r1-alert-view, .cx-r1-alert-answer) .cx-r1-section {
    padding: 12px 14px 14px !important;
}

html body.cx-design-system :is(.cx-r1-alert-view, .cx-r1-alert-answer) .cx-r1-section-description {
    margin: 0 0 10px !important;
    font-size: 13px !important;
}

html body.cx-design-system :is(.alert-view-summary, .alert-answer-summary) {
    padding: 9px 11px !important;
    gap: 10px !important;
    border-width: 1.5px !important;
    border-radius: 9px !important;
    box-shadow: none !important;
}

html body.cx-design-system :is(.alert-view-device-title, .alert-answer-device-title) {
    font-size: 15px !important;
    line-height: 1.25 !important;
}

html body.cx-design-system :is(.alert-view-table, .alert-answer-table) {
    margin-bottom: 8px !important;
    font-size: 12.5px !important;
}

    html body.cx-design-system :is(.alert-view-table, .alert-answer-table) th,
    html body.cx-design-system :is(.alert-view-table, .alert-answer-table) td {
        padding: 7px 9px !important;
    }

html body.cx-design-system :is(.alert-view-map-canvas, .alert-answer-map-canvas) {
    min-height: 250px !important;
    height: 250px !important;
}

@media (max-width: 1199.98px) {
    html body.cx-design-system .cx-filter-disclosure-inner .cx-notification-device-filter > .cx-notification-filter-business-grid,
    html body.cx-design-system .cx-filter-disclosure-inner .cx-account-filter-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    html body.cx-design-system .cx-paged-list .conexgo-pagedlist-custom-fields {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto !important;
    }

    html body.cx-design-system .cx-paged-list .conexgo-pagedlist-custom-separator {
        display: none !important;
    }

    html body.cx-design-system .cx-paged-list .conexgo-pagedlist-custom-group {
        grid-template-columns: minmax(0, 1fr) minmax(130px, .55fr) !important;
    }

    html body.cx-design-system .cx-paged-list .conexgo-pagedlist-apply {
        width: auto !important;
        min-width: 112px !important;
        grid-column: auto !important;
    }
}

@media (max-width: 1199.98px) and (min-width: 768px) {
    html body.cx-design-system .account-list-table-shell .conexgo-pagedlist-table {
        min-width: 860px !important;
    }

    html body.cx-design-system .account-list-cell-name {
        width: 250px !important;
        min-width: 240px !important;
        max-width: 270px !important;
    }

    html body.cx-design-system .account-list-cell-contact {
        min-width: 225px !important;
    }

    html body.cx-design-system .account-list-cell-devices {
        width: 210px !important;
        min-width: 200px !important;
    }

    html body.cx-design-system .account-list-cell-comment {
        min-width: 170px !important;
    }
}

@media (max-width: 991.98px) {
    html body.cx-design-system .cx-filter-disclosure-inner .cx-notification-device-filter > .cx-notification-filter-toolbar {
        grid-template-columns: minmax(0, 1fr) auto !important;
    }

    html body.cx-design-system .cx-filter-disclosure-inner .cx-notification-period-field {
        grid-column: 1 !important;
        max-width: none !important;
    }

    html body.cx-design-system .cx-filter-disclosure-inner .cx-notification-filter-toolbar-actions {
        grid-column: 2 !important;
    }

    html body.cx-design-system .cx-paged-list .conexgo-pagedlist-toolbar {
        grid-template-columns: minmax(0, 1fr) !important;
    }

    html body.cx-design-system .cx-paged-list .conexgo-pagedlist-pagination {
        justify-self: start !important;
    }

    html body.cx-design-system .cx-paged-list .conexgo-pagedlist-custom-fields {
        grid-template-columns: minmax(0, 1fr) !important;
    }

    html body.cx-design-system .cx-paged-list .conexgo-pagedlist-custom-group {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    html body.cx-design-system .cx-paged-list .conexgo-pagedlist-apply {
        justify-self: start !important;
    }

    html body.cx-design-system .cx-report-subscribe-dialog .report-subscribe-schedule-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 767.98px) {
    html body.cx-design-system .cx-filter-disclosure-inner .cx-notification-device-filter > .cx-notification-filter-toolbar,
    html body.cx-design-system .cx-filter-disclosure-inner .cx-notification-device-filter > .cx-notification-filter-business-grid,
    html body.cx-design-system .cx-filter-disclosure-inner .cx-account-filter-grid {
        grid-template-columns: minmax(0, 1fr) !important;
    }

    html body.cx-design-system .cx-filter-disclosure-inner .cx-notification-filter-toolbar-actions {
        grid-column: 1 !important;
        justify-content: stretch !important;
    }

    html body.cx-design-system .cx-filter-disclosure-inner .cx-notification-filter-reset,
    html body.cx-design-system .cx-account-filter-reset,
    html body.cx-design-system .cx-notification-custom-apply {
        width: 100% !important;
    }

    html body.cx-design-system .cx-account-filter-toolbar {
        padding: 8px 10px !important;
    }

    html body.cx-design-system .cx-paged-list .conexgo-pagedlist-filters {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        width: 100% !important;
    }

    html body.cx-design-system .cx-paged-list .conexgo-pagedlist-size-select,
    html body.cx-design-system .cx-paged-list .conexgo-pagedlist-range-select {
        width: 100% !important;
        min-width: 0 !important;
    }

    html body.cx-design-system .cx-paged-list .conexgo-pagedlist-pagination {
        width: 100% !important;
        overflow-x: auto !important;
    }

    html body.cx-design-system .cx-paged-list .conexgo-pagedlist-custom-group,
    html body.cx-design-system .cx-paged-list .conexgo-pagedlist-filters,
    html body.cx-design-system .cx-report-subscribe-dialog .report-subscribe-schedule-grid,
    html body.cx-design-system .cx-r8-account-email .cx-r8-form-row {
        grid-template-columns: minmax(0, 1fr) !important;
    }

    html body.cx-design-system .cx-paged-list .conexgo-pagedlist-apply {
        width: 100% !important;
    }

    html body.cx-design-system .account-list-table-shell {
        overflow-x: visible !important;
        scrollbar-gutter: auto !important;
    }

    html body.cx-design-system .account-list-table-shell .conexgo-pagedlist-mobile-cards {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        table-layout: fixed !important;
    }

    html body.cx-design-system :is(
        .account-list-cell-name,
        .account-list-cell-contact,
        .account-list-cell-devices,
        .account-list-cell-comment,
        .account-list-cell-documents
    ) {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
    }

    html body.cx-design-system .cx-r8-account-email .cx-r8-form-row > .form-label {
        padding-top: 0 !important;
        text-align: left !important;
    }

    html body.cx-design-system .cx-r8-account-email textarea.form-control {
        height: 150px;
        resize: vertical !important;
    }
}

@media (max-width: 479.98px) {
    html body.cx-design-system .cx-paged-list .conexgo-pagedlist-filters {
        grid-template-columns: minmax(0, 1fr) !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    html body.cx-design-system .cx-custom-select-chevron,
    html body.cx-design-system :is( .device-list-action-group .device-list-action-toggle, .account-list-cell-name .conexgo-row-action-toggle ) {
        transition: none !important;
    }
}

html body.cx-design-system .cx-custom-select-trigger {
    min-height: 42px !important;
    height: 42px !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 30px !important;
    align-items: center !important;
    gap: 6px !important;
    padding: 0 5px 0 12px !important;
    overflow: hidden !important;
    border: 1px solid #c9d7e3 !important;
    border-radius: 10px !important;
    background: #ffffff !important;
    color: #173b62 !important;
    box-shadow: 0 1px 2px rgba(22, 55, 87, .035) !important;
    transform: none !important;
    transition: border-color .14s ease, box-shadow .14s ease, background-color .14s ease !important;
}

    html body.cx-design-system .cx-custom-select-trigger:has(.cx-custom-select-leading-icon) {
        grid-template-columns: 26px minmax(0, 1fr) 30px !important;
        padding-left: 8px !important;
    }

html body.cx-design-system .cx-custom-select-value {
    min-width: 0 !important;
    padding-inline: 0 !important;
}

html body.cx-design-system .cx-custom-select-trigger:hover:not(:disabled) {
    border-color: #91a9bd !important;
    background: #ffffff !important;
    box-shadow: 0 2px 5px rgba(22, 55, 87, .06) !important;
    transform: none !important;
}

html body.cx-design-system .cx-custom-select-trigger:focus-visible,
html body.cx-design-system .cx-custom-select-trigger.is-open,
html body.cx-design-system .cx-custom-select-trigger[data-cx-open="True"],
html body.cx-design-system .cx-custom-select-trigger[data-cx-open="true"] {
    border-color: #6f8faa !important;
    outline: none !important;
    background: #ffffff !important;
    box-shadow: 0 0 0 3px rgba(62, 106, 153, .12) !important;
    transform: none !important;
}

html body.cx-design-system .cx-custom-select-chevron,
html body.cx-design-system .cx-custom-select-trigger:hover:not(:disabled) .cx-custom-select-chevron {
    width: 30px !important;
    min-width: 30px !important;
    height: 30px !important;
    min-height: 30px !important;
    display: inline-grid !important;
    place-items: center !important;
    align-self: center !important;
    justify-self: end !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-left: 0 !important;
    border-radius: 7px !important;
    background: #f3f7fa !important;
    color: #3e6386 !important;
    box-shadow: none !important;
}

html body.cx-design-system .cx-custom-select-trigger:hover:not(:disabled) .cx-custom-select-chevron {
    background: #eaf1f6 !important;
}

html body.cx-design-system .cx-custom-select-trigger.is-open .cx-custom-select-chevron,
html body.cx-design-system .cx-custom-select-trigger[data-cx-open="True"] .cx-custom-select-chevron,
html body.cx-design-system .cx-custom-select-trigger[data-cx-open="true"] .cx-custom-select-chevron {
    background: #eaf2f8 !important;
    color: #2c4c6c !important;
}

html body.cx-design-system .cx-device-list-filter {
    padding: 10px 12px 12px !important;
}

    html body.cx-design-system .cx-device-list-filter > .device-filter-toolbar {
        width: 100% !important;
        min-height: 0 !important;
        margin: 0 0 8px !important;
        display: grid !important;
        grid-template-columns: minmax(240px, 320px) minmax(0, 1fr) auto !important;
        align-items: end !important;
        gap: 8px 14px !important;
    }

        html body.cx-design-system .cx-device-list-filter > .device-filter-toolbar > .device-filter-field--battery-toolbar {
            grid-column: 1 !important;
            grid-row: 1 !important;
            width: 100% !important;
            min-width: 0 !important;
            max-width: 320px !important;
        }

        html body.cx-design-system .cx-device-list-filter > .device-filter-toolbar > .device-filter-summary {
            grid-column: 2 !important;
            grid-row: 1 !important;
            align-self: end !important;
            min-width: 0 !important;
        }

        html body.cx-design-system .cx-device-list-filter > .device-filter-toolbar > .device-filter-reset {
            grid-column: 3 !important;
            grid-row: 1 !important;
            justify-self: end !important;
            width: auto !important;
            min-height: 40px !important;
            height: 40px !important;
            padding: 0 11px !important;
            white-space: nowrap !important;
        }

    html body.cx-design-system .cx-device-list-filter > .device-filter-grid {
        display: grid !important;
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        align-items: end !important;
        gap: 8px 10px !important;
        width: 100% !important;
    }

html body.cx-design-system .cx-account-filter-grid {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(150px, 1fr)) max-content !important;
    align-items: end !important;
    gap: 10px 12px !important;
    width: 100% !important;
    padding: 12px 14px 14px !important;
}

    html body.cx-design-system .cx-account-filter-grid > .device-filter-field {
        width: auto !important;
        min-width: 0 !important;
        margin: 0 !important;
    }

    html body.cx-design-system .cx-account-filter-grid .cx-custom-select-trigger {
        width: 100% !important;
        min-height: 38px !important;
        height: 38px !important;
        font-size: 13px !important;
    }

    html body.cx-design-system .cx-account-filter-grid .cx-account-filter-reset {
        min-width: 112px !important;
        width: auto !important;
        min-height: 38px !important;
        height: 38px !important;
        margin: 0 !important;
        justify-self: end !important;
        align-self: end !important;
    }

html body.cx-design-system .cx-notification-device-filter {
    display: block !important;
    width: 100% !important;
    padding: 0 !important;
}

html body.cx-design-system .cx-notification-filter-main-grid {
    display: grid !important;
    grid-template-columns: minmax(150px, 1.05fr) minmax(120px, .78fr) minmax(165px, 1fr) minmax(150px, .95fr) max-content !important;
    align-items: end !important;
    gap: 10px 12px !important;
    width: 100% !important;
    padding: 14px 16px !important;
}

    html body.cx-design-system .cx-notification-filter-main-grid > .device-filter-field {
        min-width: 0 !important;
        width: auto !important;
        margin: 0 !important;
    }

    html body.cx-design-system .cx-notification-filter-main-grid .cx-notification-filter-reset {
        min-width: 112px !important;
        width: auto !important;
        min-height: 42px !important;
        height: 42px !important;
        margin: 0 !important;
        padding: 0 14px !important;
        justify-self: end !important;
        align-self: end !important;
    }

@media (min-width: 1800px) {
    html body.cx-design-system .cx-device-list-filter > .device-filter-grid {
        grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 1199.98px) {
    html body.cx-design-system .cx-notification-filter-main-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

        html body.cx-design-system .cx-notification-filter-main-grid .cx-notification-filter-reset {
            justify-self: start !important;
        }
}

@media (max-width: 991.98px) {
    html body.cx-design-system .cx-device-list-filter > .device-filter-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 899.98px) {
    html body.cx-design-system .cx-account-filter-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

        html body.cx-design-system .cx-account-filter-grid .cx-account-filter-reset {
            justify-self: start !important;
        }
}

@media (max-width: 767.98px) {
    html body.cx-design-system .cx-device-list-filter > .device-filter-toolbar,
    html body.cx-design-system .cx-device-list-filter > .device-filter-grid,
    html body.cx-design-system .cx-account-filter-grid,
    html body.cx-design-system .cx-notification-filter-main-grid {
        grid-template-columns: minmax(0, 1fr) !important;
    }

        html body.cx-design-system .cx-device-list-filter > .device-filter-toolbar > .device-filter-field--battery-toolbar,
        html body.cx-design-system .cx-device-list-filter > .device-filter-toolbar > .device-filter-summary,
        html body.cx-design-system .cx-device-list-filter > .device-filter-toolbar > .device-filter-reset {
            grid-column: 1 !important;
            grid-row: auto !important;
            width: 100% !important;
            max-width: none !important;
            justify-self: stretch !important;
        }

    html body.cx-design-system .cx-account-filter-grid {
        padding: 10px !important;
    }

        html body.cx-design-system .cx-account-filter-grid .cx-account-filter-reset,
        html body.cx-design-system .cx-notification-filter-main-grid .cx-notification-filter-reset {
            width: 100% !important;
            justify-self: stretch !important;
        }
}

html body.cx-design-system .cx-custom-select-trigger {
    min-height: 42px !important;
    height: 42px !important;
    grid-template-columns: minmax(0, 1fr) 30px !important;
    gap: 6px !important;
    padding: 0 5px 0 12px !important;
    border-color: #c8d8e5 !important;
    border-radius: 10px !important;
    background: #ffffff !important;
    color: #173b62 !important;
    box-shadow: 0 1px 2px rgba(23, 59, 98, .035) !important;
    transition: border-color .14s ease, box-shadow .14s ease, background-color .14s ease !important;
}

    html body.cx-design-system .cx-custom-select-trigger:has(.cx-custom-select-leading-icon) {
        grid-template-columns: 26px minmax(0, 1fr) 30px !important;
    }

html body.cx-design-system .cx-custom-select-value {
    font-size: 13.75px !important;
    font-weight: 620 !important;
    line-height: 1.25 !important;
    color: #173b62 !important;
}

html body.cx-design-system .cx-custom-select-chevron {
    width: 30px !important;
    min-width: 30px !important;
    height: 30px !important;
    min-height: 30px !important;
    border: 1px solid #d9e7f0 !important;
    border-radius: 7px !important;
    background: #edf4f8 !important;
    color: #315d7d !important;
    box-shadow: 0 1px 2px rgba(32, 72, 105, .035) !important;
    transition: background-color .14s ease, border-color .14s ease, color .14s ease, box-shadow .14s ease, transform .14s ease !important;
}

html body.cx-design-system .cx-custom-select-trigger:hover:not(:disabled) {
    border-color: #96afc2 !important;
    background: #ffffff !important;
    box-shadow: 0 2px 6px rgba(28, 65, 97, .065) !important;
}

    html body.cx-design-system .cx-custom-select-trigger:hover:not(:disabled) .cx-custom-select-chevron {
        border-color: #c4d8e6 !important;
        background: #dceaf4 !important;
        color: #214f73 !important;
        box-shadow: 0 2px 5px rgba(36, 79, 112, .08) !important;
    }

html body.cx-design-system .cx-custom-select-trigger:is( :focus-visible, .is-open, [data-cx-open="True"], [data-cx-open="true"] ) {
    border-color: #7294ad !important;
    background: #ffffff !important;
    box-shadow: 0 0 0 3px rgba(62, 106, 153, .11) !important;
}

html body.cx-design-system .cx-custom-select-trigger:is( .is-open, [data-cx-open="True"], [data-cx-open="true"] ) .cx-custom-select-chevron {
    border-color: #bcd3e3 !important;
    background: #d4e6f1 !important;
    color: #1f4c6e !important;
}

html body.cx-design-system .cx-custom-select-menu--top-layer[popover],
html body.cx-design-system .cx-custom-select-menu[data-cx-select-owner] {
    padding: 6px !important;
    border: 1px solid #c9d9e5 !important;
    border-radius: 11px !important;
    background: #ffffff !important;
    box-shadow: 0 14px 34px rgba(23, 59, 98, .16), 0 3px 10px rgba(23, 59, 98, .08) !important;
}

    html body.cx-design-system .cx-custom-select-menu--top-layer[popover] .cx-custom-select-option,
    html body.cx-design-system .cx-custom-select-menu[data-cx-select-owner] .cx-custom-select-option {
        min-height: 38px !important;
        border-radius: 7px !important;
        font-size: 13.5px !important;
        font-weight: 600 !important;
    }

        html body.cx-design-system .cx-custom-select-menu--top-layer[popover] .cx-custom-select-option:hover:not(:disabled),
        html body.cx-design-system .cx-custom-select-menu[data-cx-select-owner] .cx-custom-select-option:hover:not(:disabled),
        html body.cx-design-system .cx-custom-select-menu--top-layer[popover] .cx-custom-select-option.is-active,
        html body.cx-design-system .cx-custom-select-menu[data-cx-select-owner] .cx-custom-select-option.is-active {
            background: #eef5f9 !important;
            color: #173b62 !important;
        }

html body .app-header-modern .nt-clock-card {
    min-width: 300px !important;
    max-width: 360px !important;
    gap: 8px !important;
    padding-inline: 12px !important;
}

html body .app-header-modern .nt-date {
    gap: 5px !important;
}

html body .app-header-modern .nt-clock {
    gap: 2px !important;
    padding-left: 9px !important;
}

html body .app-header-modern .nt-clock-value {
    min-width: 13px !important;
    width: auto !important;
    padding: 0 !important;
    letter-spacing: 0 !important;
    font-size: 13.5px !important;
    font-weight: 720 !important;
    font-variant-numeric: tabular-nums !important;
}

html body .app-header-modern .nt-clock-separator {
    min-width: 4px !important;
    margin: 0 1px !important;
    padding: 0 !important;
    text-align: center !important;
    opacity: .66 !important;
}

html body.cx-design-system .cx-dashboard-page,
html body.cx-design-system #conexgoDashboardSmartGrid {
    font-family: "IBM Plex Sans", "Segoe UI", Arial, sans-serif !important;
    color: #263f58 !important;
}

    html body.cx-design-system .conexgo-dashboard-configuration-card,
    html body.cx-design-system #conexgoDashboardSmartGrid > .conexgo-dashboard-smart-item > .card {
        border: 1px solid #d6e1e9 !important;
        border-radius: 12px !important;
        background: #ffffff !important;
        box-shadow: 0 1px 2px rgba(24, 55, 83, .035), 0 7px 20px rgba(24, 55, 83, .055) !important;
        transition: border-color .16s ease, box-shadow .16s ease !important;
    }

        html body.cx-design-system #conexgoDashboardSmartGrid > .conexgo-dashboard-smart-item:not([data-dashboard-key="totalDevices"]) > .card:hover {
            border-color: #c5d7e4 !important;
            box-shadow: 0 2px 4px rgba(24, 55, 83, .05), 0 12px 28px rgba(24, 55, 83, .085) !important;
        }

        html body.cx-design-system #conexgoDashboardSmartGrid > .conexgo-dashboard-smart-item[data-dashboard-key="totalDevices"] > .card:hover {
            border-color: #cfdee8 !important;
            box-shadow: 0 1px 2px rgba(24, 55, 83, .03), 0 5px 14px rgba(24, 55, 83, .045) !important;
        }

html body.cx-design-system .conexgo-dashboard-card-header-surface {
    min-height: 50px !important;
    display: flex !important;
    align-items: center !important;
    padding: 10px 13px 10px 16px !important;
    border: 0 !important;
    border-radius: 11px 11px 0 0 !important;
    background: linear-gradient(135deg, #31597b 0%, #2a4d6d 100%) !important;
}

html body.cx-design-system .conexgo-dashboard-card-title,
html body.cx-design-system #conexgoDashboardSmartGrid .card-header .card-title {
    margin: 0 !important;
    color: #ffffff !important;
    font-family: "IBM Plex Sans", "Segoe UI", Arial, sans-serif !important;
    font-size: 15.5px !important;
    font-weight: 700 !important;
    letter-spacing: -.012em !important;
    line-height: 1.28 !important;
}

html body.cx-design-system .conexgo-dashboard-card-action {
    width: 34px !important;
    height: 34px !important;
    border: 1px solid rgba(255,255,255,.34) !important;
    border-radius: 8px !important;
    background: rgba(255,255,255,.08) !important;
    color: #ffffff !important;
    transition: background-color .14s ease, border-color .14s ease !important;
}

    html body.cx-design-system .conexgo-dashboard-card-action:hover,
    html body.cx-design-system .conexgo-dashboard-card-action:focus-visible {
        border-color: rgba(255,255,255,.52) !important;
        background: rgba(255,255,255,.16) !important;
    }

html body.cx-design-system #conexgoDashboardSmartGrid .card-body {
    padding: 15px !important;
    font-family: "IBM Plex Sans", "Segoe UI", Arial, sans-serif !important;
    font-size: 13.75px !important;
    font-weight: 400 !important;
    line-height: 1.48 !important;
    color: #304a63 !important;
}

html body.cx-design-system .conexgo-dashboard-configuration-card .card-body {
    padding: 16px 18px 18px !important;
}

html body.cx-design-system .conexgo-dashboard-config-layout {
    gap: 12px !important;
}

html body.cx-design-system .conexgo-dashboard-config-section,
html body.cx-design-system .conexgo-dashboard-visibility-section {
    border-color: #dce6ed !important;
    border-radius: 10px !important;
    background: #fbfdfe !important;
}

html body.cx-design-system .conexgo-dashboard-config-section-header,
html body.cx-design-system .conexgo-dashboard-visibility-heading {
    min-height: 52px !important;
    padding: 10px 12px !important;
}

html body.cx-design-system .conexgo-dashboard-config-section-title {
    color: #294865 !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    line-height: 1.3 !important;
}

html body.cx-design-system .conexgo-dashboard-config-section-description {
    margin-top: 2px !important;
    color: #6c7f90 !important;
    font-size: 12px !important;
    font-weight: 500 !important;
    line-height: 1.35 !important;
}

html body.cx-design-system .conexgo-dashboard-visibility-panel {
    gap: 10px 12px !important;
}

html body.cx-design-system .conexgo-dashboard-visibility-option {
    min-height: 54px !important;
    padding: 10px 12px !important;
    border-radius: 9px !important;
    background: #f8fbfd !important;
}

    html body.cx-design-system .conexgo-dashboard-visibility-option:hover,
    html body.cx-design-system .conexgo-dashboard-visibility-option:focus-within {
        border-color: #abc6d8 !important;
        background: #f1f7fb !important;
        box-shadow: 0 4px 12px rgba(43, 80, 112, .065) !important;
    }

html body.cx-design-system #conexgoDashboardSmartGrid .conexgo-dashboard-filter-label {
    margin-bottom: 5px !important;
    color: #536b80 !important;
    font-size: 12.25px !important;
    font-weight: 700 !important;
    line-height: 1.25 !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .conexgo-dashboard-filter-label--compact {
    font-size: 11.75px !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .conexgo-dashboard-muted {
    color: #6f8190 !important;
    font-size: 13px !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .conexgo-dashboard-filter-surface,
html body.cx-design-system #conexgoDashboardSmartGrid .conexgo-dashboard-offline-filter-surface {
    flex: 0 0 auto !important;
    background: #fbfdfe !important;
    border-bottom: 1px solid #e4ebf0 !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .conexgo-dashboard-summary-number {
    color: #315f85 !important;
    font-size: 27px !important;
    font-weight: 760 !important;
    line-height: 1 !important;
    font-variant-numeric: tabular-nums !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .conexgo-dashboard-summary-caption {
    color: #718292 !important;
    font-size: 11.75px !important;
    font-weight: 600 !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .conexgo-dashboard-latest-dot.is-sos {
    background: #c94b62 !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .conexgo-dashboard-latest-dot.is-standard {
    background: #426f94 !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .conexgo-dashboard-latest-item,
html body.cx-design-system #conexgoDashboardSmartGrid .conexgo-dashboard-ranked-item,
html body.cx-design-system #conexgoDashboardSmartGrid .cx-dashboard-offline-item,
html body.cx-design-system #conexgoDashboardSmartGrid .conexgo-dashboard-active-user {
    transition: background-color .14s ease !important;
}

    html body.cx-design-system #conexgoDashboardSmartGrid .conexgo-dashboard-latest-item:hover,
    html body.cx-design-system #conexgoDashboardSmartGrid .conexgo-dashboard-ranked-item:hover,
    html body.cx-design-system #conexgoDashboardSmartGrid .cx-dashboard-offline-item:hover,
    html body.cx-design-system #conexgoDashboardSmartGrid .conexgo-dashboard-active-user:hover {
        background: #f6fafc !important;
    }

@media (min-width: 900px) {
    html body.cx-design-system #conexgoDashboardSmartGrid
    .conexgo-dashboard-smart-item[data-dashboard-key="deviceStatus"]
    .conexgo-dashboard-table-scroll {
        overflow-x: hidden !important;
    }

    html body.cx-design-system #conexgoDashboardSmartGrid
    .conexgo-dashboard-smart-item[data-dashboard-key="deviceStatus"]
    .conexgo-device-status-table {
        width: 100% !important;
        min-width: 0 !important;
        table-layout: auto !important;
    }
}

html body.cx-design-system #conexgoDashboardSmartGrid .conexgo-dashboard-table-head-row {
    background: #f3f8f6 !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .conexgo-dashboard-model-icon {
    background: rgba(61, 98, 135, .09) !important;
    color: #3d6287 !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .conexgo-dashboard-empty-cell {
    padding: 0 !important;
    border-bottom: 0 !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .conexgo-device-status-table th {
    padding: 9px 8px !important;
    color: #324d65 !important;
    font-size: 11.5px !important;
    font-weight: 720 !important;
    letter-spacing: .01em !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .conexgo-device-status-table td {
    padding: 10px 8px !important;
    color: #314b63 !important;
    font-size: 13px !important;
    line-height: 1.3 !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .conexgo-dashboard-trend-summary {
    padding: 2px 1px 6px !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .conexgo-dashboard-trend-stat {
    color: #667b8e !important;
    font-size: 12.25px !important;
    font-weight: 560 !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .conexgo-dashboard-trend-stat-value {
    color: #315f85 !important;
    font-weight: 750 !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .conexgo-dashboard-trend-chart {
    height: 126px !important;
    display: flex !important;
    align-items: flex-end !important;
    gap: 7px !important;
    padding: 12px 5px 0 !important;
    overflow-x: auto !important;
    overflow-y: visible !important;
    scrollbar-width: thin !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .conexgo-dashboard-trend-point {
    position: relative !important;
    flex: 1 0 24px !important;
    min-width: 24px !important;
    height: 100% !important;
    display: flex !important;
    align-items: flex-end !important;
    justify-content: center !important;
    cursor: help !important;
    outline: none !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .conexgo-dashboard-trend-bar {
    --cx-dashboard-percent: 4%;
    width: min(28px, 72%) !important;
    height: max(4px, var(--cx-dashboard-percent)) !important;
    border-radius: 6px 6px 2px 2px !important;
    background: linear-gradient(180deg, #4c789c 0%, #3b6487 100%) !important;
    box-shadow: 0 2px 4px rgba(38, 82, 116, .12) !important;
    transform-origin: bottom center !important;
    transition: transform .14s ease, filter .14s ease, box-shadow .14s ease, background-color .14s ease !important;
}

    html body.cx-design-system #conexgoDashboardSmartGrid .conexgo-dashboard-trend-bar.is-peak {
        background: linear-gradient(180deg, #3979ab 0%, #2e648f 100%) !important;
        box-shadow: 0 3px 8px rgba(46, 100, 143, .18) !important;
    }

html body.cx-design-system #conexgoDashboardSmartGrid .conexgo-dashboard-trend-point:hover .conexgo-dashboard-trend-bar,
html body.cx-design-system #conexgoDashboardSmartGrid .conexgo-dashboard-trend-point:focus-visible .conexgo-dashboard-trend-bar {
    transform: translateY(-3px) scaleX(1.07) !important;
    filter: saturate(1.08) brightness(.98) !important;
    box-shadow: 0 6px 14px rgba(39, 82, 116, .20) !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .conexgo-dashboard-trend-axis {
    display: flex !important;
    gap: 7px !important;
    margin-top: 6px !important;
    padding-inline: 5px !important;
    overflow-x: auto !important;
    scrollbar-width: none !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .conexgo-dashboard-trend-label {
    flex: 1 0 24px !important;
    min-width: 24px !important;
    color: #718292 !important;
    font-size: 10px !important;
    font-weight: 560 !important;
    line-height: 1.2 !important;
    text-align: center !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .conexgo-dashboard-ranked-meter {
    width: 100% !important;
    max-width: 230px !important;
    min-width: 0 !important;
    flex: 0 1 230px !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .conexgo-dashboard-progress {
    width: 100% !important;
    min-width: 0 !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .conexgo-dashboard-ranked-count {
    min-width: 34px !important;
    color: #315f85 !important;
    font-weight: 750 !important;
    text-align: right !important;
    font-variant-numeric: tabular-nums !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .conexgo-dashboard-progress-fill,
html body.cx-design-system #conexgoDashboardSmartGrid .conexgo-device-overview-progress-fill {
    --cx-dashboard-percent: 0%;
    width: var(--cx-dashboard-percent) !important;
    background: linear-gradient(90deg, #426f94 0%, #315f85 100%) !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .conexgo-device-overview-progress-fill {
    display: block !important;
    height: 100% !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .cx-dashboard-offline-item {
    min-width: 0 !important;
    margin-bottom: 5px !important;
    border-bottom: 1px solid #e6edf2 !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .cx-dashboard-offline-main {
    min-width: 0 !important;
    flex: 1 1 auto !important;
    padding-right: 10px !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .conexgo-dashboard-offline-device-link {
    display: block !important;
    overflow: hidden !important;
    color: #2d526f !important;
    font-size: 13.25px !important;
    font-weight: 700 !important;
    text-decoration: none !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .conexgo-dashboard-offline-customer {
    overflow: hidden !important;
    color: #6a7d8e !important;
    font-size: 12px !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .conexgo-dashboard-offline-duration {
    margin-top: 4px !important;
    color: #697c8d !important;
    font-size: 11.75px !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .conexgo-dashboard-offline-duration-value {
    color: #315f85 !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .cx-dashboard-offline-meta {
    min-width: 96px !important;
    flex: 0 0 auto !important;
    text-align: right !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .conexgo-dashboard-offline-severity {
    display: inline-block !important;
    padding: 3px 8px !important;
    border: 1px solid #dce5eb !important;
    border-radius: 999px !important;
    background: #f6f8fa !important;
    font-size: 10.5px !important;
    font-weight: 720 !important;
    white-space: nowrap !important;
}

    html body.cx-design-system #conexgoDashboardSmartGrid .conexgo-dashboard-offline-severity.is-critical {
        color: #8a4f4f !important;
        border-color: #e6cccc !important;
        background: #fbf4f4 !important;
    }

    html body.cx-design-system #conexgoDashboardSmartGrid .conexgo-dashboard-offline-severity.is-investigate {
        color: #8a641f !important;
        border-color: #ead9b8 !important;
        background: #fcf8ef !important;
    }

    html body.cx-design-system #conexgoDashboardSmartGrid .conexgo-dashboard-offline-severity.is-validate {
        color: #315f85 !important;
        border-color: #cfdeea !important;
        background: #f1f6fa !important;
    }

html body.cx-design-system #conexgoDashboardSmartGrid .conexgo-dashboard-offline-threshold {
    margin-top: 6px !important;
    color: #758695 !important;
    font-size: 10.75px !important;
    white-space: nowrap !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .conexgo-dashboard-list-footer {
    border-top: 1px solid #e6edf2 !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .conexgo-dashboard-list-count {
    color: #718292 !important;
    font-size: 11px !important;
    font-weight: 600 !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .conexgo-dashboard-view-all-link {
    color: #315f85 !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    text-decoration: none !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .conexgo-dashboard-active-user-copy {
    min-width: 0 !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .conexgo-dashboard-active-user-heading {
    min-width: 0 !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .conexgo-dashboard-active-user-name {
    min-width: 0 !important;
    flex: 1 1 auto !important;
    color: #2b4e6b !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    line-height: 1.3 !important;
    white-space: normal !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .conexgo-dashboard-active-user-score {
    color: #6c7f90 !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    font-variant-numeric: tabular-nums !important;
    white-space: nowrap !important;
}

html body.cx-design-system .conexgo-dashboard-mobile-shortcut-row {
    background: #ffffff !important;
}

html body.cx-design-system .conexgo-dashboard-mobile-shortcut-link {
    display: block !important;
    width: 100% !important;
    font-weight: 700 !important;
}

html body.cx-design-system .conexgo-dashboard-mobile-shortcut-icon {
    margin-right: 5px !important;
    font-size: 16pt !important;
}

html body.cx-design-system .cx-dashboard-percent-0 {
    --cx-dashboard-percent: 0%;
}

html body.cx-design-system .cx-dashboard-percent-1 {
    --cx-dashboard-percent: 1%;
}

html body.cx-design-system .cx-dashboard-percent-2 {
    --cx-dashboard-percent: 2%;
}

html body.cx-design-system .cx-dashboard-percent-3 {
    --cx-dashboard-percent: 3%;
}

html body.cx-design-system .cx-dashboard-percent-4 {
    --cx-dashboard-percent: 4%;
}

html body.cx-design-system .cx-dashboard-percent-5 {
    --cx-dashboard-percent: 5%;
}

html body.cx-design-system .cx-dashboard-percent-6 {
    --cx-dashboard-percent: 6%;
}

html body.cx-design-system .cx-dashboard-percent-7 {
    --cx-dashboard-percent: 7%;
}

html body.cx-design-system .cx-dashboard-percent-8 {
    --cx-dashboard-percent: 8%;
}

html body.cx-design-system .cx-dashboard-percent-9 {
    --cx-dashboard-percent: 9%;
}

html body.cx-design-system .cx-dashboard-percent-10 {
    --cx-dashboard-percent: 10%;
}

html body.cx-design-system .cx-dashboard-percent-11 {
    --cx-dashboard-percent: 11%;
}

html body.cx-design-system .cx-dashboard-percent-12 {
    --cx-dashboard-percent: 12%;
}

html body.cx-design-system .cx-dashboard-percent-13 {
    --cx-dashboard-percent: 13%;
}

html body.cx-design-system .cx-dashboard-percent-14 {
    --cx-dashboard-percent: 14%;
}

html body.cx-design-system .cx-dashboard-percent-15 {
    --cx-dashboard-percent: 15%;
}

html body.cx-design-system .cx-dashboard-percent-16 {
    --cx-dashboard-percent: 16%;
}

html body.cx-design-system .cx-dashboard-percent-17 {
    --cx-dashboard-percent: 17%;
}

html body.cx-design-system .cx-dashboard-percent-18 {
    --cx-dashboard-percent: 18%;
}

html body.cx-design-system .cx-dashboard-percent-19 {
    --cx-dashboard-percent: 19%;
}

html body.cx-design-system .cx-dashboard-percent-20 {
    --cx-dashboard-percent: 20%;
}

html body.cx-design-system .cx-dashboard-percent-21 {
    --cx-dashboard-percent: 21%;
}

html body.cx-design-system .cx-dashboard-percent-22 {
    --cx-dashboard-percent: 22%;
}

html body.cx-design-system .cx-dashboard-percent-23 {
    --cx-dashboard-percent: 23%;
}

html body.cx-design-system .cx-dashboard-percent-24 {
    --cx-dashboard-percent: 24%;
}

html body.cx-design-system .cx-dashboard-percent-25 {
    --cx-dashboard-percent: 25%;
}

html body.cx-design-system .cx-dashboard-percent-26 {
    --cx-dashboard-percent: 26%;
}

html body.cx-design-system .cx-dashboard-percent-27 {
    --cx-dashboard-percent: 27%;
}

html body.cx-design-system .cx-dashboard-percent-28 {
    --cx-dashboard-percent: 28%;
}

html body.cx-design-system .cx-dashboard-percent-29 {
    --cx-dashboard-percent: 29%;
}

html body.cx-design-system .cx-dashboard-percent-30 {
    --cx-dashboard-percent: 30%;
}

html body.cx-design-system .cx-dashboard-percent-31 {
    --cx-dashboard-percent: 31%;
}

html body.cx-design-system .cx-dashboard-percent-32 {
    --cx-dashboard-percent: 32%;
}

html body.cx-design-system .cx-dashboard-percent-33 {
    --cx-dashboard-percent: 33%;
}

html body.cx-design-system .cx-dashboard-percent-34 {
    --cx-dashboard-percent: 34%;
}

html body.cx-design-system .cx-dashboard-percent-35 {
    --cx-dashboard-percent: 35%;
}

html body.cx-design-system .cx-dashboard-percent-36 {
    --cx-dashboard-percent: 36%;
}

html body.cx-design-system .cx-dashboard-percent-37 {
    --cx-dashboard-percent: 37%;
}

html body.cx-design-system .cx-dashboard-percent-38 {
    --cx-dashboard-percent: 38%;
}

html body.cx-design-system .cx-dashboard-percent-39 {
    --cx-dashboard-percent: 39%;
}

html body.cx-design-system .cx-dashboard-percent-40 {
    --cx-dashboard-percent: 40%;
}

html body.cx-design-system .cx-dashboard-percent-41 {
    --cx-dashboard-percent: 41%;
}

html body.cx-design-system .cx-dashboard-percent-42 {
    --cx-dashboard-percent: 42%;
}

html body.cx-design-system .cx-dashboard-percent-43 {
    --cx-dashboard-percent: 43%;
}

html body.cx-design-system .cx-dashboard-percent-44 {
    --cx-dashboard-percent: 44%;
}

html body.cx-design-system .cx-dashboard-percent-45 {
    --cx-dashboard-percent: 45%;
}

html body.cx-design-system .cx-dashboard-percent-46 {
    --cx-dashboard-percent: 46%;
}

html body.cx-design-system .cx-dashboard-percent-47 {
    --cx-dashboard-percent: 47%;
}

html body.cx-design-system .cx-dashboard-percent-48 {
    --cx-dashboard-percent: 48%;
}

html body.cx-design-system .cx-dashboard-percent-49 {
    --cx-dashboard-percent: 49%;
}

html body.cx-design-system .cx-dashboard-percent-50 {
    --cx-dashboard-percent: 50%;
}

html body.cx-design-system .cx-dashboard-percent-51 {
    --cx-dashboard-percent: 51%;
}

html body.cx-design-system .cx-dashboard-percent-52 {
    --cx-dashboard-percent: 52%;
}

html body.cx-design-system .cx-dashboard-percent-53 {
    --cx-dashboard-percent: 53%;
}

html body.cx-design-system .cx-dashboard-percent-54 {
    --cx-dashboard-percent: 54%;
}

html body.cx-design-system .cx-dashboard-percent-55 {
    --cx-dashboard-percent: 55%;
}

html body.cx-design-system .cx-dashboard-percent-56 {
    --cx-dashboard-percent: 56%;
}

html body.cx-design-system .cx-dashboard-percent-57 {
    --cx-dashboard-percent: 57%;
}

html body.cx-design-system .cx-dashboard-percent-58 {
    --cx-dashboard-percent: 58%;
}

html body.cx-design-system .cx-dashboard-percent-59 {
    --cx-dashboard-percent: 59%;
}

html body.cx-design-system .cx-dashboard-percent-60 {
    --cx-dashboard-percent: 60%;
}

html body.cx-design-system .cx-dashboard-percent-61 {
    --cx-dashboard-percent: 61%;
}

html body.cx-design-system .cx-dashboard-percent-62 {
    --cx-dashboard-percent: 62%;
}

html body.cx-design-system .cx-dashboard-percent-63 {
    --cx-dashboard-percent: 63%;
}

html body.cx-design-system .cx-dashboard-percent-64 {
    --cx-dashboard-percent: 64%;
}

html body.cx-design-system .cx-dashboard-percent-65 {
    --cx-dashboard-percent: 65%;
}

html body.cx-design-system .cx-dashboard-percent-66 {
    --cx-dashboard-percent: 66%;
}

html body.cx-design-system .cx-dashboard-percent-67 {
    --cx-dashboard-percent: 67%;
}

html body.cx-design-system .cx-dashboard-percent-68 {
    --cx-dashboard-percent: 68%;
}

html body.cx-design-system .cx-dashboard-percent-69 {
    --cx-dashboard-percent: 69%;
}

html body.cx-design-system .cx-dashboard-percent-70 {
    --cx-dashboard-percent: 70%;
}

html body.cx-design-system .cx-dashboard-percent-71 {
    --cx-dashboard-percent: 71%;
}

html body.cx-design-system .cx-dashboard-percent-72 {
    --cx-dashboard-percent: 72%;
}

html body.cx-design-system .cx-dashboard-percent-73 {
    --cx-dashboard-percent: 73%;
}

html body.cx-design-system .cx-dashboard-percent-74 {
    --cx-dashboard-percent: 74%;
}

html body.cx-design-system .cx-dashboard-percent-75 {
    --cx-dashboard-percent: 75%;
}

html body.cx-design-system .cx-dashboard-percent-76 {
    --cx-dashboard-percent: 76%;
}

html body.cx-design-system .cx-dashboard-percent-77 {
    --cx-dashboard-percent: 77%;
}

html body.cx-design-system .cx-dashboard-percent-78 {
    --cx-dashboard-percent: 78%;
}

html body.cx-design-system .cx-dashboard-percent-79 {
    --cx-dashboard-percent: 79%;
}

html body.cx-design-system .cx-dashboard-percent-80 {
    --cx-dashboard-percent: 80%;
}

html body.cx-design-system .cx-dashboard-percent-81 {
    --cx-dashboard-percent: 81%;
}

html body.cx-design-system .cx-dashboard-percent-82 {
    --cx-dashboard-percent: 82%;
}

html body.cx-design-system .cx-dashboard-percent-83 {
    --cx-dashboard-percent: 83%;
}

html body.cx-design-system .cx-dashboard-percent-84 {
    --cx-dashboard-percent: 84%;
}

html body.cx-design-system .cx-dashboard-percent-85 {
    --cx-dashboard-percent: 85%;
}

html body.cx-design-system .cx-dashboard-percent-86 {
    --cx-dashboard-percent: 86%;
}

html body.cx-design-system .cx-dashboard-percent-87 {
    --cx-dashboard-percent: 87%;
}

html body.cx-design-system .cx-dashboard-percent-88 {
    --cx-dashboard-percent: 88%;
}

html body.cx-design-system .cx-dashboard-percent-89 {
    --cx-dashboard-percent: 89%;
}

html body.cx-design-system .cx-dashboard-percent-90 {
    --cx-dashboard-percent: 90%;
}

html body.cx-design-system .cx-dashboard-percent-91 {
    --cx-dashboard-percent: 91%;
}

html body.cx-design-system .cx-dashboard-percent-92 {
    --cx-dashboard-percent: 92%;
}

html body.cx-design-system .cx-dashboard-percent-93 {
    --cx-dashboard-percent: 93%;
}

html body.cx-design-system .cx-dashboard-percent-94 {
    --cx-dashboard-percent: 94%;
}

html body.cx-design-system .cx-dashboard-percent-95 {
    --cx-dashboard-percent: 95%;
}

html body.cx-design-system .cx-dashboard-percent-96 {
    --cx-dashboard-percent: 96%;
}

html body.cx-design-system .cx-dashboard-percent-97 {
    --cx-dashboard-percent: 97%;
}

html body.cx-design-system .cx-dashboard-percent-98 {
    --cx-dashboard-percent: 98%;
}

html body.cx-design-system .cx-dashboard-percent-99 {
    --cx-dashboard-percent: 99%;
}

html body.cx-design-system .cx-dashboard-percent-100 {
    --cx-dashboard-percent: 100%;
}

@media (max-width: 899.98px) {
    html body.cx-design-system #conexgoDashboardSmartGrid
    .conexgo-dashboard-smart-item[data-dashboard-key="deviceStatus"]
    .conexgo-dashboard-table-scroll {
        overflow-x: auto !important;
    }

    html body.cx-design-system #conexgoDashboardSmartGrid
    .conexgo-dashboard-smart-item[data-dashboard-key="deviceStatus"]
    .conexgo-device-status-table {
        min-width: 560px !important;
    }
}

@media (max-width: 767.98px) {
    html body.cx-design-system .conexgo-dashboard-card-header-surface {
        min-height: 48px !important;
        padding: 9px 10px 9px 12px !important;
    }

    html body.cx-design-system .conexgo-dashboard-card-title,
    html body.cx-design-system #conexgoDashboardSmartGrid .card-header .card-title {
        font-size: 14.5px !important;
    }

    html body.cx-design-system #conexgoDashboardSmartGrid .card-body {
        padding: 12px !important;
        font-size: 13.25px !important;
    }

    html body.cx-design-system #conexgoDashboardSmartGrid .conexgo-dashboard-trend-chart {
        height: 112px !important;
        gap: 5px !important;
    }

    html body.cx-design-system #conexgoDashboardSmartGrid .conexgo-dashboard-trend-point,
    html body.cx-design-system #conexgoDashboardSmartGrid .conexgo-dashboard-trend-label {
        flex-basis: 22px !important;
        min-width: 22px !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    html body.cx-design-system #conexgoDashboardSmartGrid > .conexgo-dashboard-smart-item > .card,
    html body.cx-design-system #conexgoDashboardSmartGrid .conexgo-dashboard-trend-bar,
    html body.cx-design-system .cx-custom-select-chevron {
        transition: none !important;
    }
}

html body.cx-design-system .conexgo-dashboard-configuration-card > .conexgo-dashboard-card-header-surface,
html body.cx-design-system #conexgoDashboardSmartGrid > .conexgo-dashboard-smart-item > .card:not(.conexgo-dashboard-minimized-card) > .conexgo-dashboard-card-header-surface {
    background: linear-gradient(135deg, #315d80 0%, #294f70 100%) !important;
}

html body.cx-design-system .conexgo-dashboard-configuration-card.conexgo-dashboard-minimized-card > .conexgo-dashboard-card-header-surface,
html body.cx-design-system #conexgoDashboardSmartGrid > .conexgo-dashboard-smart-item > .conexgo-dashboard-minimized-card > .conexgo-dashboard-card-header-surface {
    background: linear-gradient(135deg, #6686a0 0%, #587b98 100%) !important;
    box-shadow: inset 0 -1px 0 rgba(255,255,255,.10) !important;
}

html body.cx-design-system .conexgo-dashboard-configuration-card > .conexgo-dashboard-card-header-surface .conexgo-dashboard-card-title,
html body.cx-design-system .conexgo-dashboard-configuration-card > .conexgo-dashboard-card-header-surface .card-title,
html body.cx-design-system #conexgoDashboardSmartGrid .conexgo-dashboard-card-header-surface .conexgo-dashboard-card-title,
html body.cx-design-system #conexgoDashboardSmartGrid .conexgo-dashboard-card-header-surface .card-title {
    color: #ffffff !important;
    text-shadow: 0 1px 1px rgba(10,35,55,.12) !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .conexgo-dashboard-minimized-card .conexgo-dashboard-card-action,
html body.cx-design-system .conexgo-dashboard-configuration-card.conexgo-dashboard-minimized-card .conexgo-dashboard-card-action {
    border-color: rgba(255,255,255,.40) !important;
    background: rgba(255,255,255,.11) !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .cx-dashboard-percent-0 {
    --cx-dashboard-percent: 0% !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .cx-dashboard-percent-1 {
    --cx-dashboard-percent: 1% !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .cx-dashboard-percent-2 {
    --cx-dashboard-percent: 2% !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .cx-dashboard-percent-3 {
    --cx-dashboard-percent: 3% !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .cx-dashboard-percent-4 {
    --cx-dashboard-percent: 4% !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .cx-dashboard-percent-5 {
    --cx-dashboard-percent: 5% !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .cx-dashboard-percent-6 {
    --cx-dashboard-percent: 6% !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .cx-dashboard-percent-7 {
    --cx-dashboard-percent: 7% !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .cx-dashboard-percent-8 {
    --cx-dashboard-percent: 8% !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .cx-dashboard-percent-9 {
    --cx-dashboard-percent: 9% !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .cx-dashboard-percent-10 {
    --cx-dashboard-percent: 10% !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .cx-dashboard-percent-11 {
    --cx-dashboard-percent: 11% !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .cx-dashboard-percent-12 {
    --cx-dashboard-percent: 12% !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .cx-dashboard-percent-13 {
    --cx-dashboard-percent: 13% !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .cx-dashboard-percent-14 {
    --cx-dashboard-percent: 14% !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .cx-dashboard-percent-15 {
    --cx-dashboard-percent: 15% !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .cx-dashboard-percent-16 {
    --cx-dashboard-percent: 16% !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .cx-dashboard-percent-17 {
    --cx-dashboard-percent: 17% !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .cx-dashboard-percent-18 {
    --cx-dashboard-percent: 18% !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .cx-dashboard-percent-19 {
    --cx-dashboard-percent: 19% !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .cx-dashboard-percent-20 {
    --cx-dashboard-percent: 20% !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .cx-dashboard-percent-21 {
    --cx-dashboard-percent: 21% !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .cx-dashboard-percent-22 {
    --cx-dashboard-percent: 22% !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .cx-dashboard-percent-23 {
    --cx-dashboard-percent: 23% !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .cx-dashboard-percent-24 {
    --cx-dashboard-percent: 24% !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .cx-dashboard-percent-25 {
    --cx-dashboard-percent: 25% !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .cx-dashboard-percent-26 {
    --cx-dashboard-percent: 26% !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .cx-dashboard-percent-27 {
    --cx-dashboard-percent: 27% !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .cx-dashboard-percent-28 {
    --cx-dashboard-percent: 28% !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .cx-dashboard-percent-29 {
    --cx-dashboard-percent: 29% !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .cx-dashboard-percent-30 {
    --cx-dashboard-percent: 30% !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .cx-dashboard-percent-31 {
    --cx-dashboard-percent: 31% !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .cx-dashboard-percent-32 {
    --cx-dashboard-percent: 32% !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .cx-dashboard-percent-33 {
    --cx-dashboard-percent: 33% !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .cx-dashboard-percent-34 {
    --cx-dashboard-percent: 34% !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .cx-dashboard-percent-35 {
    --cx-dashboard-percent: 35% !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .cx-dashboard-percent-36 {
    --cx-dashboard-percent: 36% !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .cx-dashboard-percent-37 {
    --cx-dashboard-percent: 37% !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .cx-dashboard-percent-38 {
    --cx-dashboard-percent: 38% !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .cx-dashboard-percent-39 {
    --cx-dashboard-percent: 39% !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .cx-dashboard-percent-40 {
    --cx-dashboard-percent: 40% !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .cx-dashboard-percent-41 {
    --cx-dashboard-percent: 41% !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .cx-dashboard-percent-42 {
    --cx-dashboard-percent: 42% !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .cx-dashboard-percent-43 {
    --cx-dashboard-percent: 43% !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .cx-dashboard-percent-44 {
    --cx-dashboard-percent: 44% !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .cx-dashboard-percent-45 {
    --cx-dashboard-percent: 45% !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .cx-dashboard-percent-46 {
    --cx-dashboard-percent: 46% !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .cx-dashboard-percent-47 {
    --cx-dashboard-percent: 47% !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .cx-dashboard-percent-48 {
    --cx-dashboard-percent: 48% !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .cx-dashboard-percent-49 {
    --cx-dashboard-percent: 49% !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .cx-dashboard-percent-50 {
    --cx-dashboard-percent: 50% !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .cx-dashboard-percent-51 {
    --cx-dashboard-percent: 51% !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .cx-dashboard-percent-52 {
    --cx-dashboard-percent: 52% !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .cx-dashboard-percent-53 {
    --cx-dashboard-percent: 53% !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .cx-dashboard-percent-54 {
    --cx-dashboard-percent: 54% !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .cx-dashboard-percent-55 {
    --cx-dashboard-percent: 55% !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .cx-dashboard-percent-56 {
    --cx-dashboard-percent: 56% !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .cx-dashboard-percent-57 {
    --cx-dashboard-percent: 57% !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .cx-dashboard-percent-58 {
    --cx-dashboard-percent: 58% !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .cx-dashboard-percent-59 {
    --cx-dashboard-percent: 59% !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .cx-dashboard-percent-60 {
    --cx-dashboard-percent: 60% !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .cx-dashboard-percent-61 {
    --cx-dashboard-percent: 61% !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .cx-dashboard-percent-62 {
    --cx-dashboard-percent: 62% !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .cx-dashboard-percent-63 {
    --cx-dashboard-percent: 63% !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .cx-dashboard-percent-64 {
    --cx-dashboard-percent: 64% !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .cx-dashboard-percent-65 {
    --cx-dashboard-percent: 65% !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .cx-dashboard-percent-66 {
    --cx-dashboard-percent: 66% !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .cx-dashboard-percent-67 {
    --cx-dashboard-percent: 67% !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .cx-dashboard-percent-68 {
    --cx-dashboard-percent: 68% !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .cx-dashboard-percent-69 {
    --cx-dashboard-percent: 69% !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .cx-dashboard-percent-70 {
    --cx-dashboard-percent: 70% !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .cx-dashboard-percent-71 {
    --cx-dashboard-percent: 71% !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .cx-dashboard-percent-72 {
    --cx-dashboard-percent: 72% !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .cx-dashboard-percent-73 {
    --cx-dashboard-percent: 73% !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .cx-dashboard-percent-74 {
    --cx-dashboard-percent: 74% !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .cx-dashboard-percent-75 {
    --cx-dashboard-percent: 75% !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .cx-dashboard-percent-76 {
    --cx-dashboard-percent: 76% !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .cx-dashboard-percent-77 {
    --cx-dashboard-percent: 77% !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .cx-dashboard-percent-78 {
    --cx-dashboard-percent: 78% !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .cx-dashboard-percent-79 {
    --cx-dashboard-percent: 79% !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .cx-dashboard-percent-80 {
    --cx-dashboard-percent: 80% !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .cx-dashboard-percent-81 {
    --cx-dashboard-percent: 81% !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .cx-dashboard-percent-82 {
    --cx-dashboard-percent: 82% !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .cx-dashboard-percent-83 {
    --cx-dashboard-percent: 83% !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .cx-dashboard-percent-84 {
    --cx-dashboard-percent: 84% !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .cx-dashboard-percent-85 {
    --cx-dashboard-percent: 85% !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .cx-dashboard-percent-86 {
    --cx-dashboard-percent: 86% !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .cx-dashboard-percent-87 {
    --cx-dashboard-percent: 87% !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .cx-dashboard-percent-88 {
    --cx-dashboard-percent: 88% !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .cx-dashboard-percent-89 {
    --cx-dashboard-percent: 89% !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .cx-dashboard-percent-90 {
    --cx-dashboard-percent: 90% !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .cx-dashboard-percent-91 {
    --cx-dashboard-percent: 91% !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .cx-dashboard-percent-92 {
    --cx-dashboard-percent: 92% !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .cx-dashboard-percent-93 {
    --cx-dashboard-percent: 93% !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .cx-dashboard-percent-94 {
    --cx-dashboard-percent: 94% !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .cx-dashboard-percent-95 {
    --cx-dashboard-percent: 95% !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .cx-dashboard-percent-96 {
    --cx-dashboard-percent: 96% !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .cx-dashboard-percent-97 {
    --cx-dashboard-percent: 97% !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .cx-dashboard-percent-98 {
    --cx-dashboard-percent: 98% !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .cx-dashboard-percent-99 {
    --cx-dashboard-percent: 99% !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .cx-dashboard-percent-100 {
    --cx-dashboard-percent: 100% !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .conexgo-dashboard-trend-chart {
    position: relative !important;
    height: 132px !important;
    padding: 13px 7px 0 !important;
    border-bottom: 1px solid #d8e4ec !important;
    background: linear-gradient(to top, transparent 24%, rgba(99,132,156,.08) 25%, transparent 26%, transparent 49%, rgba(99,132,156,.08) 50%, transparent 51%, transparent 74%, rgba(99,132,156,.08) 75%, transparent 76%) !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .conexgo-dashboard-trend-bar {
    min-height: 5px !important;
    width: min(30px, 74%) !important;
    border-radius: 7px 7px 2px 2px !important;
    background: linear-gradient(180deg, #5c8db2 0%, #35688f 100%) !important;
    box-shadow: 0 2px 6px rgba(37,82,116,.16) !important;
}

    html body.cx-design-system #conexgoDashboardSmartGrid .conexgo-dashboard-trend-bar.is-peak {
        background: linear-gradient(180deg, #3f86b8 0%, #255f8a 100%) !important;
        box-shadow: 0 4px 10px rgba(32,91,133,.22) !important;
    }

html body.cx-design-system #conexgoDashboardSmartGrid .conexgo-dashboard-trend-point:hover .conexgo-dashboard-trend-bar,
html body.cx-design-system #conexgoDashboardSmartGrid .conexgo-dashboard-trend-point:focus-visible .conexgo-dashboard-trend-bar {
    transform: translateY(-3px) scaleX(1.08) !important;
    filter: saturate(1.08) brightness(1.03) !important;
    box-shadow: 0 7px 16px rgba(31,79,113,.24) !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .conexgo-dashboard-progress,
html body.cx-design-system #conexgoDashboardSmartGrid .conexgo-dashboard-active-user .progress {
    height: 8px !important;
    min-height: 8px !important;
    overflow: hidden !important;
    border-radius: 999px !important;
    background: #e8eff5 !important;
    box-shadow: inset 0 1px 2px rgba(34,70,97,.06) !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .conexgo-dashboard-progress-fill {
    min-width: 0 !important;
    border-radius: 999px !important;
    background: linear-gradient(90deg, #5b8db2 0%, #32688f 100%) !important;
    box-shadow: 0 1px 2px rgba(40,91,127,.12) !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .conexgo-dashboard-ranked-item:hover,
html body.cx-design-system #conexgoDashboardSmartGrid .conexgo-dashboard-active-user:hover {
    background: #f7fafc !important;
}

html body.cx-design-system :is( .device-list-action-group .device-list-name-button, .account-list-cell-name .account-list-name-button ),
html body.cx-design-system :is( .device-list-action-group .device-list-name-button, .account-list-cell-name .account-list-name-button ):is(:hover, :focus, :active) {
    border-color: #315f82 !important;
    border-right-color: #6689a6 !important;
    background: #315f82 !important;
    color: #ffffff !important;
    transform: none !important;
    filter: none !important;
}

html body.cx-design-system :is( .device-list-action-group .device-list-action-toggle, .account-list-cell-name .conexgo-row-action-toggle ) {
    border-color: #356381 !important;
    border-left-color: #7f9cb3 !important;
    background: #426f91 !important;
    color: #f7fbfe !important;
}

    html body.cx-design-system :is( .device-list-action-group .device-list-action-toggle, .account-list-cell-name .conexgo-row-action-toggle ):hover {
        border-color: #244e6e !important;
        border-left-color: #87a3b9 !important;
        background: #285775 !important;
        color: #ffffff !important;
    }

    html body.cx-design-system :is( .device-list-action-group .device-list-action-toggle, .account-list-cell-name .conexgo-row-action-toggle )[aria-expanded="true"] {
        border-color: #1e4665 !important;
        border-left-color: #7697b0 !important;
        background: #234f70 !important;
        color: #ffffff !important;
    }

html body.cx-design-system .cx-custom-select-trigger {
    grid-template-columns: minmax(0, 1fr) 32px !important;
}

html body.cx-design-system .cx-custom-select-chevron {
    width: 30px !important;
    height: 30px !important;
    border: 1px solid #d3e1eb !important;
    border-radius: 8px !important;
    background: #edf4f8 !important;
    color: #285b80 !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.70) !important;
}

html body.cx-design-system .cx-custom-select-trigger:hover:not(:disabled) .cx-custom-select-chevron {
    border-color: #bfd3e1 !important;
    background: #e1edf4 !important;
    color: #1f5278 !important;
}

html body.cx-design-system .cx-custom-select-trigger.is-open .cx-custom-select-chevron,
html body.cx-design-system .cx-custom-select-trigger[data-cx-open="True"] .cx-custom-select-chevron,
html body.cx-design-system .cx-custom-select-trigger[data-cx-open="true"] .cx-custom-select-chevron {
    border-color: #aec8da !important;
    background: #d8e8f2 !important;
    color: #194c72 !important;
}

html body .app-header-modern .app-header-center-zone .nt-clock-card,
html body .app-header-modern .nt-clock-card {
    width: auto !important;
    min-width: 0 !important;
    max-width: 370px !important;
    height: 40px !important;
    justify-content: center !important;
    gap: 9px !important;
    padding: 0 12px !important;
}

html body .app-header-modern .nt-date {
    gap: 6px !important;
}

html body .app-header-modern .nt-clock {
    gap: 0 !important;
    padding-left: 8px !important;
}

    html body .app-header-modern .nt-clock > li {
        margin: 0 !important;
    }

html body .app-header-modern .nt-time-icon {
    margin-right: 5px !important;
}

html body .app-header-modern .nt-clock-value {
    min-width: 14px !important;
    width: auto !important;
    padding: 0 !important;
    font-size: 13px !important;
    font-weight: 720 !important;
    letter-spacing: 0 !important;
}

html body .app-header-modern .nt-clock-separator {
    width: 3px !important;
    min-width: 3px !important;
    margin: 0 !important;
    opacity: .62 !important;
}

html body .app-header-modern .nt-meridiem {
    margin-left: 4px !important;
    font-size: 10px !important;
    letter-spacing: .06em !important;
}

@media (min-width: 1241px) {
    html body .app-header-modern .app-header-main-row {
        grid-template-columns: minmax(210px, 1fr) minmax(300px, 370px) minmax(330px, 1fr) !important;
    }

    html body .app-header-modern .app-header-center-zone .nt-clock-card {
        width: auto !important;
        min-width: 0 !important;
        max-width: 370px !important;
    }
}

@media (max-width: 767.98px) {
    html body .app-header-modern .nt-clock-separator-secondary,
    html body .app-header-modern .nt-seconds {
        display: none !important;
    }

    html body .app-header-modern .nt-clock-card {
        max-width: 330px !important;
    }
}

@media (min-width: 768px) {
    html body.cx-design-system :is( .mud-dialog.cx-dialog-root, .mud-dialog.cx-standard-form-dialog, .cx-r8-account-email, .panel-body ) textarea:not([readonly]):not(:disabled):not(.note-codable):not(.fr-code),
    html body.cx-design-system textarea.cx-template-textarea:not([readonly]):not(:disabled) {
        box-sizing: border-box !important;
        width: 100%;
        height: auto;
        min-width: min(240px, 100%) !important;
        max-width: 100% !important;
        min-height: 88px !important;
        max-height: min(68dvh, 760px) !important;
        resize: both !important;
        overflow: auto !important;
        overscroll-behavior: contain !important;
    }

    html body.cx-design-system .cx-r8-account-email textarea.cx-email-compose-textarea {
        width: 100%;
        height: 168px;
        min-height: 118px !important;
        max-height: min(64dvh, 680px) !important;
        resize: both !important;
    }

    html body.cx-design-system textarea.cx-template-textarea {
        height: 150px;
        min-height: 104px !important;
    }
}

@media (max-width: 767.98px) {
    html body.cx-design-system :is( .mud-dialog.cx-dialog-root, .mud-dialog.cx-standard-form-dialog, .cx-r8-account-email, .panel-body ) textarea:not([readonly]):not(:disabled):not(.note-codable):not(.fr-code),
    html body.cx-design-system textarea.cx-template-textarea:not([readonly]):not(:disabled) {
        width: 100% !important;
        height: auto;
        min-width: 0 !important;
        max-width: 100% !important;
        min-height: 96px !important;
        max-height: 62dvh !important;
        resize: vertical !important;
        overflow: auto !important;
    }
}

html body.cx-design-system .cx-template-label {
    padding-top: 8px !important;
    color: #294c6b !important;
    font-size: 13px !important;
    font-weight: 700 !important;
}

html body.cx-design-system .cx-template-textarea {
    display: block !important;
    border: 1px solid #c9d8e4 !important;
    border-radius: 10px !important;
    background: #ffffff !important;
    color: #203b55 !important;
    line-height: 1.48 !important;
}

    html body.cx-design-system .cx-template-textarea:focus {
        border-color: #6f96b8 !important;
        box-shadow: 0 0 0 3px rgba(62, 106, 153, .10) !important;
    }

html body.cx-design-system .cx-template-save {
    min-height: 40px !important;
    padding: 8px 14px !important;
    border: 1px solid #315879 !important;
    border-radius: 9px !important;
    background: #315879 !important;
    color: #ffffff !important;
    font-weight: 700 !important;
}

html body.cx-design-system .cx-email-history-head-row > th {
    background: #edf8f2 !important;
    color: #294b69 !important;
}

html body.cx-design-system .conexgo-pagedlist-pagination
.conexgo-pagedlist-page-status .page-link,
html body.cx-design-system .conexgo-pagedlist-pagination
.conexgo-pagedlist-page-status .page-link:hover,
html body.cx-design-system .conexgo-pagedlist-pagination
.conexgo-pagedlist-page-status .page-link:focus,
html body.cx-design-system .conexgo-pagedlist-pagination
.conexgo-pagedlist-page-status .page-link:focus-visible,
html body.cx-design-system .conexgo-pagedlist-pagination
.conexgo-pagedlist-page-status .page-link:active {
    min-width: 112px !important;
    cursor: default !important;
    user-select: none !important;
    pointer-events: none !important;
    border-color: #315879 !important;
    background: #315879 !important;
    color: #ffffff !important;
    box-shadow: none !important;
    filter: none !important;
    transform: none !important;
    transition: none !important;
}

html body.cx-design-system .account-list-cell-name .conexgo-row-action-group,
html body.cx-design-system .device-list-action-group {
    position: relative !important;
}

html body.cx-design-system .account-list-cell-name .account-list-name-button {
    width: auto !important;
    text-align: left !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

html body.cx-design-system :is(.conexgo-row-action-menu, .device-list-action-menu).show {
    z-index: 1250 !important;
}

html body.cx-design-system :is( .conexgo-pagedlist-table tbody tr, .conexgo-pagedlist-table tbody td, .conexgo-pagedlist-table-region, .table-responsive ):has(:is(.conexgo-row-action-menu, .device-list-action-menu).show) {
    overflow-y: visible !important;
}

@media (min-width: 768px) {
    html body.cx-design-system :is( .conexgo-row-action-group, .device-list-action-group ).cx-row-menu-open-above > :is( .conexgo-row-action-menu, .device-list-action-menu ),
    html body.cx-design-system :is( .conexgo-row-action-group, .device-list-action-group ).cx-row-menu-open-above > :is( .conexgo-row-action-menu, .device-list-action-menu ).show {
        top: auto !important;
        right: -4px !important;
        bottom: calc(100% + 6px) !important;
        left: auto !important;
        inset: auto -4px calc(100% + 6px) auto !important;
        transform: none !important;
    }
}

html body.cx-design-system .conexgo-account-profile {
    overflow: visible !important;
    border: 1px solid #d6e1ea !important;
    border-radius: 13px !important;
    background: #ffffff !important;
    box-shadow: 0 7px 22px rgba(27, 62, 91, .06) !important;
}

html body.cx-design-system .conexgo-account-profile-header {
    min-height: 58px !important;
    padding: 13px 18px !important;
    display: flex !important;
    align-items: center !important;
    border: 0 !important;
    border-radius: 13px 13px 0 0 !important;
    background: linear-gradient(135deg, #315879 0%, #294d6d 100%) !important;
}

html body.cx-design-system .conexgo-account-profile-header-row {
    width: 100% !important;
    margin: 0 !important;
}

html body.cx-design-system .conexgo-account-profile-header .card-title {
    margin: 0 !important;
    color: #ffffff !important;
    font-size: clamp(20px, 1.7vw, 26px) !important;
    font-weight: 760 !important;
    line-height: 1.2 !important;
}

html body.cx-design-system .conexgo-account-profile > .card-body {
    padding: 16px 18px 18px !important;
}

html body.cx-design-system .conexgo-account-profile .tab-menu-heading-boxed {
    padding: 7px !important;
    border: 1px solid #d8e3ec !important;
    border-radius: 11px !important;
    background: #f7fafc !important;
}

html body.cx-design-system .conexgo-account-profile .panel-body.tabs-menu-body {
    padding: 18px 8px 2px !important;
}

html body.cx-design-system .conexgo-account-profile-form {
    width: min(100%, 900px) !important;
    margin-inline: auto !important;
}

    html body.cx-design-system .conexgo-account-profile-form > .row {
        align-items: center !important;
        margin-bottom: 10px !important;
    }

html body.cx-design-system .conexgo-account-profile-label {
    padding-top: 0 !important;
    text-align: right !important;
    color: #294b69 !important;
    font-size: 13px !important;
    font-weight: 700 !important;
}

html body.cx-design-system .conexgo-account-profile-form :is( .form-control, .cx-custom-select-trigger ) {
    min-height: 42px !important;
    height: 42px !important;
    border-radius: 10px !important;
    font-size: 14px !important;
}

html body.cx-design-system .conexgo-account-profile-save {
    min-height: 40px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    padding: 8px 15px !important;
    border: 1px solid #315879 !important;
    border-radius: 9px !important;
    background: #315879 !important;
    color: #ffffff !important;
    font-weight: 700 !important;
}

html body.cx-design-system .conexgo-account-profile-save:is(:hover, :focus, :focus-visible, :active) {
    border-color: #24445f !important;
    background: #24445f !important;
    color: #ffffff !important;
    transform: none !important;
}

html body.cx-design-system .conexgo-account-profile-save > :is(i, span, svg),
html body.cx-design-system .conexgo-account-profile-save:is(:hover, :focus, :focus-visible, :active) > :is(i, span, svg) {
    color: inherit !important;
}

html body.cx-design-system .cx-profile-terms-decline {
    min-height: 40px !important;
    flex: 0 0 auto !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    padding: 8px 13px !important;
    border: 1px solid #d56a72 !important;
    border-radius: 9px !important;
    background: #ffffff !important;
    color: #ad3e48 !important;
    font-size: 13px !important;
    font-weight: 720 !important;
    box-shadow: none !important;
}

    html body.cx-design-system .cx-profile-terms-decline > :is(i, span) {
        color: inherit !important;
    }

    html body.cx-design-system .cx-profile-terms-decline:hover,
    html body.cx-design-system .cx-profile-terms-decline:focus-visible {
        border-color: #bd4f59 !important;
        background: #fff2f3 !important;
        color: #96313a !important;
        transform: none !important;
    }

    html body.cx-design-system .cx-profile-terms-decline:disabled {
        opacity: .62 !important;
        cursor: wait !important;
    }

@media (max-width: 767.98px) {
    html body.cx-design-system .conexgo-account-profile > .card-body {
        padding: 12px !important;
    }

    html body.cx-design-system .conexgo-account-profile .panel-body.tabs-menu-body {
        padding: 12px 0 0 !important;
    }

    html body.cx-design-system .conexgo-account-profile-label {
        margin-bottom: 5px !important;
        text-align: left !important;
    }

    html body.cx-design-system .cx-profile-terms-decline {
        width: 100% !important;
    }
}

html body.cx-design-system .device-map-settings .conexgo-device-status-item {
    color: #8998a6 !important;
}

html body.cx-design-system .device-map-settings .cx-device-tone-primary {
    color: #376b93 !important;
}

html body.cx-design-system .device-map-settings .cx-device-tone-success {
    color: #4f8b63 !important;
}

html body.cx-design-system .device-map-settings .cx-device-tone-warning {
    color: #c4932d !important;
}

html body.cx-design-system .device-map-settings .cx-device-tone-danger {
    color: #b84d59 !important;
}

html body.cx-design-system .device-map-settings .cx-device-tone-light {
    color: #477493 !important;
}

html body.cx-design-system .device-map-settings .cx-device-tone-neutral {
    color: #9aa5b1 !important;
}

html body.cx-design-system .device-map-settings
.conexgo-device-cellular .signal .bar.active {
    background: currentColor !important;
    opacity: 1 !important;
}

html body.cx-design-system .conexgo-device-battery-charge {
    display: none !important;
}

    html body.cx-design-system .conexgo-device-battery-charge.is-visible {
        display: inline-block !important;
    }

html body.cx-design-system .cx-device-phone-event {
    margin-left: 5px !important;
}

html body.cx-design-system .cx-device-phone-event--on {
    color: #37814e !important;
}

html body.cx-design-system .cx-device-phone-event--off {
    color: #8e99a4 !important;
}

html body.cx-design-system .device-map-back-icon {
    font-size: 18pt !important;
}

html body.cx-design-system .device-map-settings #waitIndicator.conexgo-history-wait {
    display: none;
    position: static !important;
    width: 20px !important;
    height: 20px !important;
    min-width: 20px !important;
    margin: 0 0 0 8px !important;
    padding: 0 !important;
    overflow: visible !important;
    opacity: 1 !important;
    pointer-events: none !important;
    object-fit: contain !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    animation: none !important;
}

html body.cx-design-system .conexgo-map-controller {
    height: 0 !important;
    min-height: 0 !important;
    padding-block: 0 !important;
    overflow: hidden !important;
    opacity: 0 !important;
    border-width: 0 !important;
    transition: height .16s ease, opacity .16s ease !important;
}

    html body.cx-design-system .conexgo-map-controller.is-visible {
        height: 50px !important;
        min-height: 50px !important;
        opacity: 1 !important;
        border-bottom-width: 1px !important;
    }

html body.cx-design-system .device-map-loading-overlay {
    padding: 16px !important;
    background: rgba(247, 250, 252, .82) !important;
}

html body.cx-design-system .device-map-loading-card {
    width: min(300px, calc(100% - 24px)) !important;
    min-height: 0 !important;
    gap: 9px !important;
    padding: 18px 20px !important;
    border-radius: 12px !important;
    box-shadow: 0 8px 28px rgba(34, 67, 94, .12) !important;
}

html body.cx-design-system .device-map-loading-spinner {
    width: 36px !important;
    height: 36px !important;
    border-width: 4px !important;
}

html body.cx-design-system .device-map-loading-title {
    margin-top: 1px !important;
    font-size: 14px !important;
}

html body.cx-design-system .device-map-loading-description {
    max-width: 240px !important;
    font-size: 12px !important;
    line-height: 1.42 !important;
}

@media (prefers-reduced-motion: reduce) {
    html body.cx-design-system .device-map-settings #waitIndicator.conexgo-history-wait,
    html body.cx-design-system .device-map-loading-spinner {
        animation-duration: 1.6s !important;
    }
}

html body.cx-design-system .account-list-table-head-row > th {
    background: #eaf8f1 !important;
}

html body.cx-design-system .account-list-row.is-suspended > td {
    background: #fff2f3 !important;
}

html body.cx-design-system .cx-row-action-icon-gap {
    margin-right: 5px !important;
}

html body.cx-design-system .account-list-last-login {
    margin-top: 8px !important;
    margin-left: 5px !important;
    color: #405a72 !important;
    font-size: 12px !important;
    line-height: 1.35 !important;
}

html body.cx-design-system .conexgo-dashboard-configuration-card:not(.conexgo-dashboard-minimized-card) > .conexgo-dashboard-card-header-surface,
html body.cx-design-system #conexgoDashboardSmartGrid > .conexgo-dashboard-smart-item > .card:not(.conexgo-dashboard-minimized-card) > .conexgo-dashboard-card-header-surface {
    background: #315879 !important;
    border-color: #315879 !important;
}

html body.cx-design-system .conexgo-dashboard-configuration-card.conexgo-dashboard-minimized-card > .conexgo-dashboard-card-header-surface,
html body.cx-design-system #conexgoDashboardSmartGrid > .conexgo-dashboard-smart-item > .conexgo-dashboard-minimized-card > .conexgo-dashboard-card-header-surface {
    background: #e7f0f6 !important;
    border: 1px solid #c7d8e5 !important;
    box-shadow: inset 0 -1px 0 rgba(41, 79, 112, .04) !important;
}

html body.cx-design-system .conexgo-dashboard-card-title,
html body.cx-design-system #conexgoDashboardSmartGrid .card-header .card-title {
    text-transform: uppercase !important;
    letter-spacing: .025em !important;
    font-size: 14px !important;
    font-weight: 760 !important;
}

html body.cx-design-system .conexgo-dashboard-configuration-card:not(.conexgo-dashboard-minimized-card) .conexgo-dashboard-card-title,
html body.cx-design-system #conexgoDashboardSmartGrid .card:not(.conexgo-dashboard-minimized-card) .conexgo-dashboard-card-header-surface .conexgo-dashboard-card-title {
    color: #ffffff !important;
    text-shadow: none !important;
}

html body.cx-design-system .conexgo-dashboard-configuration-card.conexgo-dashboard-minimized-card .conexgo-dashboard-card-title,
html body.cx-design-system #conexgoDashboardSmartGrid .conexgo-dashboard-minimized-card .conexgo-dashboard-card-title {
    color: #244b6b !important;
    text-shadow: none !important;
}

html body.cx-design-system .conexgo-dashboard-configuration-card.conexgo-dashboard-minimized-card .conexgo-dashboard-card-action,
html body.cx-design-system #conexgoDashboardSmartGrid .conexgo-dashboard-minimized-card .conexgo-dashboard-card-action {
    border-color: #adc4d5 !important;
    background: #f4f8fb !important;
    color: #315879 !important;
}

    html body.cx-design-system .conexgo-dashboard-configuration-card.conexgo-dashboard-minimized-card .conexgo-dashboard-card-action:hover,
    html body.cx-design-system #conexgoDashboardSmartGrid .conexgo-dashboard-minimized-card .conexgo-dashboard-card-action:hover {
        border-color: #94b0c4 !important;
        background: #dce9f2 !important;
        color: #244b6b !important;
    }

html body.cx-design-system #conexgoDashboardSmartGrid > .conexgo-dashboard-smart-item:is( [data-dashboard-key="latestAlerts"], [data-dashboard-key="topAlertDevices"], [data-dashboard-key="offlineDevices"], [data-dashboard-key="activeUsers"] ) > .conexgo-dashboard-resizable-card:not(.conexgo-dashboard-minimized-card) {
    display: flex !important;
    flex-direction: column !important;
    min-height: 300px !important;
    max-height: 500px !important;
    overflow: hidden !important;
}

    html body.cx-design-system #conexgoDashboardSmartGrid > .conexgo-dashboard-smart-item:is( [data-dashboard-key="latestAlerts"], [data-dashboard-key="topAlertDevices"], [data-dashboard-key="offlineDevices"], [data-dashboard-key="activeUsers"] ) > .conexgo-dashboard-resizable-card:not(.conexgo-dashboard-minimized-card) > .card-body {
        flex: 1 1 auto !important;
        display: flex !important;
        flex-direction: column !important;
        min-height: 0 !important;
        overflow: hidden !important;
    }

html body.cx-design-system #conexgoDashboardSmartGrid > .conexgo-dashboard-smart-item:is( [data-dashboard-key="latestAlerts"], [data-dashboard-key="topAlertDevices"], [data-dashboard-key="offlineDevices"], [data-dashboard-key="activeUsers"] ) :is(.conexgo-dashboard-resizable-list, .conexgo-dashboard-active-users-list) {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    scrollbar-gutter: stable !important;
    scrollbar-width: thin !important;
    scrollbar-color: #9eb2c2 transparent !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid > .conexgo-dashboard-smart-item:is( [data-dashboard-key="latestAlerts"], [data-dashboard-key="topAlertDevices"], [data-dashboard-key="offlineDevices"], [data-dashboard-key="activeUsers"] ) :is(.conexgo-dashboard-card-filter-row, .conexgo-dashboard-filter-grid, .conexgo-dashboard-latest-summary, .conexgo-dashboard-list-footer) {
    flex: 0 0 auto !important;
}

html body.cx-design-system .conexgo-pagedlist-pagination .conexgo-pagedlist-page-status .page-link,
html body.cx-design-system .conexgo-pagedlist-pagination .conexgo-pagedlist-page-status .page-link:hover,
html body.cx-design-system .conexgo-pagedlist-pagination .conexgo-pagedlist-page-status .page-link:focus,
html body.cx-design-system .conexgo-pagedlist-pagination .conexgo-pagedlist-page-status .page-link:focus-visible,
html body.cx-design-system .conexgo-pagedlist-pagination .conexgo-pagedlist-page-status .page-link:active {
    min-width: 112px !important;
    border-color: #315879 !important;
    background: #315879 !important;
    color: #ffffff !important;
    box-shadow: none !important;
    filter: none !important;
    transform: none !important;
    transition: none !important;
    cursor: default !important;
    pointer-events: none !important;
    user-select: none !important;
}

html body.cx-design-system .cx-custom-select-trigger {
    grid-template-columns: minmax(0, 1fr) 34px !important;
    column-gap: 6px !important;
}

    html body.cx-design-system .cx-custom-select-trigger:has(.cx-custom-select-leading-icon) {
        grid-template-columns: 26px minmax(0, 1fr) 34px !important;
    }

html body.cx-design-system .cx-custom-select-chevron {
    display: grid !important;
    place-items: center !important;
    align-self: center !important;
    justify-self: center !important;
    width: 30px !important;
    min-width: 30px !important;
    height: 30px !important;
    min-height: 30px !important;
    padding: 0 !important;
    margin: 0 !important;
    line-height: 1 !important;
}

    html body.cx-design-system .cx-custom-select-chevron > i {
        display: block !important;
        margin: 0 !important;
        line-height: 1 !important;
        transform-origin: center !important;
    }

html body.cx-design-system .cx-custom-select-menu--top-layer[popover] {
    border-color: #bfd1df !important;
    border-radius: 10px !important;
    box-shadow: 0 16px 36px rgba(31, 68, 98, .16), 0 3px 10px rgba(31, 68, 98, .08) !important;
}

html body.cx-design-system :is(.conexgo-row-action-group, .device-list-action-group) {
    display: flex !important;
    align-items: stretch !important;
}

html body.cx-design-system :is( .account-list-cell-name .conexgo-row-action-toggle, .device-list-action-group .device-list-action-toggle ) {
    position: relative !important;
    flex: 0 0 48px !important;
    width: 48px !important;
    min-width: 48px !important;
    padding: 0 !important;
    margin: 0 !important;
    display: grid !important;
    place-items: center !important;
    line-height: 1 !important;
}

    html body.cx-design-system :is( .account-list-cell-name .conexgo-row-action-toggle, .device-list-action-group .device-list-action-toggle )::after {
        position: absolute !important;
        top: 50% !important;
        left: 50% !important;
        margin: 0 !important;
        transform: translate(-50%, -50%) !important;
        transform-origin: center !important;
    }

    html body.cx-design-system :is( .account-list-cell-name .conexgo-row-action-toggle, .device-list-action-group .device-list-action-toggle ) > .caret {
        display: none !important;
    }

html body.cx-design-system :is(.conexgo-row-action-menu, .device-list-action-menu) {
    z-index: 2000 !important;
    padding: 6px !important;
    border: 1px solid #c4d4e0 !important;
    border-radius: 10px !important;
    background: #ffffff !important;
    box-shadow: 0 18px 40px rgba(30, 63, 91, .18), 0 4px 12px rgba(30, 63, 91, .08) !important;
}

    html body.cx-design-system :is(.conexgo-row-action-menu, .device-list-action-menu) .dropdown-item {
        min-height: 38px !important;
        display: flex !important;
        align-items: center !important;
        gap: 10px !important;
        padding: 8px 10px !important;
        border-radius: 7px !important;
    }

    html body.cx-design-system :is(.conexgo-row-action-menu, .device-list-action-menu).cx-row-menu-scrollable {
        scrollbar-width: thin !important;
        scrollbar-color: #a5b6c4 transparent !important;
    }

html body.cx-design-system .device-map-settings #waitIndicator.conexgo-history-wait {
    display: none;
    position: static !important;
    width: 20px !important;
    height: 20px !important;
    min-width: 20px !important;
    margin-inline-start: 8px !important;
    object-fit: contain !important;
    border: 0 !important;
    background: transparent !important;
    animation: none !important;
}

html body.cx-design-system :is( .device-list-action-group, .account-list-cell-name .conexgo-row-action-group ) {
    position: relative !important;
    overflow: visible !important;
}

    html body.cx-design-system :is( .device-list-action-group, .account-list-cell-name .conexgo-row-action-group ) > :is(.device-list-action-menu, .conexgo-row-action-menu),
    html body.cx-design-system :is( .device-list-action-group, .account-list-cell-name .conexgo-row-action-group ) > :is(.device-list-action-menu, .conexgo-row-action-menu).show {
        position: absolute !important;
        inset: calc(100% + 6px) auto auto 0 !important;
        top: calc(100% + 6px) !important;
        right: auto !important;
        bottom: auto !important;
        left: 0 !important;
        transform: none !important;
        width: 100% !important;
        min-width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        margin: 0 !important;
        padding: 7px !important;
        box-sizing: border-box !important;
        overflow-x: hidden !important;
        overflow-y: visible !important;
        overscroll-behavior: auto !important;
        scrollbar-gutter: auto !important;
        background: #ffffff !important;
        border: 1px solid #c5d5e2 !important;
        border-radius: 10px !important;
        box-shadow: 0 16px 34px rgba(29, 61, 89, .18) !important;
        z-index: 5200 !important;
        transition: none !important;
    }

        html body.cx-design-system :is( .device-list-action-group, .account-list-cell-name .conexgo-row-action-group ) > :is(.device-list-action-menu, .conexgo-row-action-menu).cx-r62-row-menu-scrollable {
            max-height: var(--cx-r62-row-menu-max-height) !important;
            overflow-x: hidden !important;
            overflow-y: auto !important;
            overscroll-behavior: contain !important;
            scrollbar-gutter: stable !important;
            scrollbar-width: thin !important;
            scrollbar-color: #9fb2c1 transparent !important;
        }

html body.cx-design-system :is( .device-list-action-menu, .conexgo-row-action-menu ) .dropdown-item {
    width: 100% !important;
    min-width: 0 !important;
    min-height: 40px !important;
    display: grid !important;
    grid-template-columns: 20px minmax(0, 1fr) !important;
    align-items: center !important;
    column-gap: 10px !important;
    margin: 0 !important;
    padding: 8px 10px !important;
    border-radius: 7px !important;
    white-space: normal !important;
    line-height: 1.25 !important;
}

    html body.cx-design-system :is( .device-list-action-menu, .conexgo-row-action-menu ) .dropdown-item > :is(i, span[class*="fa"]) {
        width: 20px !important;
        min-width: 20px !important;
        height: 20px !important;
        margin: 0 !important;
        padding: 0 !important;
        display: inline-grid !important;
        place-items: center !important;
        justify-self: center !important;
        font-size: 14px !important;
        line-height: 1 !important;
        text-align: center !important;
    }

html body.cx-design-system .account-list-cell-name
.conexgo-row-action-menu .dropdown-item > .fa-mobile {
    font-size: 14px !important;
}

html body.cx-design-system :is( .conexgo-pagedlist-table tbody tr, .conexgo-pagedlist-table tbody td, .conexgo-pagedlist-table-region, .conexgo-pagedlist-table-column, .table-responsive ):has(:is(.conexgo-row-action-menu, .device-list-action-menu).show) {
    position: relative !important;
    overflow: visible !important;
    z-index: 5100 !important;
}

html body.cx-design-system .alert-list-device-cell {
    min-width: 320px !important;
    vertical-align: middle !important;
}

html body.cx-design-system .alert-list-device-line {
    min-width: 0 !important;
    display: flex !important;
    align-items: center !important;
    flex-wrap: nowrap !important;
    gap: 9px !important;
    white-space: nowrap !important;
}

html body.cx-design-system .alert-list-device-name {
    min-width: 0 !important;
}

html body.cx-design-system .alert-list-callcenter {
    flex: 0 0 auto !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 5px !important;
}

    html body.cx-design-system .alert-list-callcenter > i {
        width: 18px !important;
        min-width: 18px !important;
        height: 18px !important;
        display: inline-grid !important;
        place-items: center !important;
        margin: 0 !important;
        color: #12863c !important;
        font-size: 14px !important;
        line-height: 1 !important;
    }

@media (min-width: 992px) {
    html body.cx-design-system .conexgo-pagedlist-toolbar {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) auto !important;
        align-items: end !important;
        column-gap: 18px !important;
        row-gap: 10px !important;
    }

    html body.cx-design-system .conexgo-pagedlist-filters {
        min-width: 0 !important;
        display: flex !important;
        flex-flow: row nowrap !important;
        align-items: end !important;
        gap: 12px !important;
    }

    html body.cx-design-system .conexgo-pagedlist-pagination {
        width: auto !important;
        min-width: max-content !important;
        justify-self: end !important;
        align-self: end !important;
        overflow: visible !important;
    }

        html body.cx-design-system .conexgo-pagedlist-pagination .pagination {
            flex-wrap: nowrap !important;
            margin: 0 !important;
        }
}

html body.cx-design-system .conexgo-pagedlist-pagination
.conexgo-pagedlist-page-status .page-link,
html body.cx-design-system .conexgo-pagedlist-pagination
.conexgo-pagedlist-page-status .page-link:is(:hover, :focus, :focus-visible, :active) {
    border-color: #315879 !important;
    background: #315879 !important;
    color: #ffffff !important;
    box-shadow: none !important;
    filter: none !important;
    transform: none !important;
    transition: none !important;
    cursor: default !important;
    pointer-events: none !important;
}

html body.cx-design-system .app-header-modern .nt-clock {
    display: grid !important;
    grid-template-columns: 18px 2ch .55ch 2ch .55ch 2ch 2.8em !important;
    align-items: center !important;
    justify-content: center !important;
    column-gap: 3px !important;
    padding-left: 8px !important;
    white-space: nowrap !important;
    font-variant-numeric: tabular-nums !important;
}

    html body.cx-design-system .app-header-modern .nt-clock > .nt-time-icon {
        width: 18px !important;
        min-width: 18px !important;
        margin: 0 !important;
        text-align: center !important;
    }

    html body.cx-design-system .app-header-modern .nt-clock > .nt-clock-value {
        min-width: 2ch !important;
        width: 2ch !important;
        margin: 0 !important;
        padding: 0 !important;
        text-align: center !important;
        font-variant-numeric: tabular-nums !important;
    }

    html body.cx-design-system .app-header-modern .nt-clock > .nt-clock-separator {
        width: .55ch !important;
        min-width: .55ch !important;
        margin: 0 !important;
        text-align: center !important;
    }

    html body.cx-design-system .app-header-modern .nt-clock > .nt-meridiem {
        min-width: 2.8em !important;
        margin: 0 0 0 3px !important;
        text-align: left !important;
        white-space: nowrap !important;
    }

@media (max-width: 767.98px) {
    html body.cx-design-system .app-header-modern .nt-clock {
        grid-template-columns: 18px 2ch .55ch 2ch 2.8em !important;
        column-gap: 2px !important;
    }
}

html body.cx-design-system .conexgo-header-notifications
.conexgo-notification-dropdown {
    width: min(400px, calc(100vw - 24px)) !important;
    min-width: min(320px, calc(100vw - 24px)) !important;
    max-width: 400px !important;
    max-height: min(480px, calc(100dvh - 96px)) !important;
    display: grid !important;
    grid-template-rows: auto minmax(0, 1fr) auto !important;
    overflow: hidden !important;
}

html body.cx-design-system .conexgo-notification-dropdown
.conexgo-notification-list {
    min-height: 0 !important;
    max-height: none !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    overscroll-behavior: contain !important;
    scrollbar-gutter: stable !important;
    scrollbar-width: thin !important;
}

html body.cx-design-system .conexgo-notification-dropdown
.conexgo-notification-item-title {
    display: -webkit-box !important;
    overflow: hidden !important;
    overflow-wrap: anywhere !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important;
    line-clamp: 2 !important;
}

html body.cx-design-system :is( .conexgo-notification-badge, .conexgo-notification-header-count ).is-high {
    background: #cc3657 !important;
    color: #ffffff !important;
}

html body.cx-design-system :is( .conexgo-notification-badge, .conexgo-notification-header-count ).is-medium {
    background: #f4c542 !important;
    color: #1f2937 !important;
}

html body.cx-design-system :is( .conexgo-notification-badge, .conexgo-notification-header-count ).is-information {
    background: #2f5fa8 !important;
    color: #ffffff !important;
}

html body.cx-design-system .conexgo-notification-item-icon.is-high {
    background: #fff1f3 !important;
    color: #cc3657 !important;
}

html body.cx-design-system .conexgo-notification-item-icon.is-medium {
    background: #fff4e6 !important;
    color: #d88418 !important;
}

html body.cx-design-system .conexgo-notification-item-icon.is-information {
    background: #eef4ff !important;
    color: #2f5fa8 !important;
}

html body .mud-dialog.cx-notification-view-dialog,
html body .mud-dialog.cx-r1-notification-view {
    width: min(760px, calc(100vw - 32px)) !important;
    max-width: min(760px, calc(100vw - 32px)) !important;
    max-height: min(78dvh, 680px) !important;
    display: flex !important;
    flex-direction: column !important;
    overflow: hidden !important;
}

    html body .mud-dialog.cx-notification-view-dialog .mud-dialog-content,
    html body .mud-dialog.cx-r1-notification-view .mud-dialog-content {
        flex: 1 1 auto !important;
        min-height: 0 !important;
        overflow-x: hidden !important;
        overflow-y: auto !important;
        overscroll-behavior: contain !important;
        padding: 14px 16px !important;
    }

    html body .mud-dialog.cx-notification-view-dialog .mud-dialog-actions,
    html body .mud-dialog.cx-r1-notification-view .mud-dialog-actions {
        position: static !important;
        flex: 0 0 auto !important;
        margin-top: auto !important;
        background: #f7fafc !important;
    }

html body .cx-notification-view-dialog .notification-view-priority-card {
    border-left: 4px solid #2f5fa8 !important;
}

    html body .cx-notification-view-dialog
    .notification-view-priority-card.is-high {
        border-left-color: #dc3545 !important;
    }

    html body .cx-notification-view-dialog
    .notification-view-priority-card.is-medium {
        border-left-color: #b7791f !important;
    }

    html body .cx-notification-view-dialog
    .notification-view-priority-card.is-information {
        border-left-color: #2f5fa8 !important;
    }

    html body .cx-notification-view-dialog
    .notification-view-priority-card.is-high .notification-view-priority-icon {
        background: #fff1f1 !important;
        color: #dc3545 !important;
    }

    html body .cx-notification-view-dialog
    .notification-view-priority-card.is-medium .notification-view-priority-icon {
        background: #fff7e6 !important;
        color: #b7791f !important;
    }

    html body .cx-notification-view-dialog
    .notification-view-priority-card.is-information .notification-view-priority-icon {
        background: #eef4fa !important;
        color: #2f5fa8 !important;
    }

html body .mud-dialog .cx-dialog-action--acknowledge,
html body .mud-dialog .cx-dialog-action--acknowledge:is(:hover, :focus-visible, :active) {
    border-color: #4f5fb8 !important;
    background: #4f5fb8 !important;
    color: #ffffff !important;
    box-shadow: none !important;
    filter: none !important;
    transform: none !important;
}

html body .mud-dialog .cx-dialog-action--acknowledge :is(.mud-button-label, i, span, svg, .mud-icon-root) {
    color: inherit !important;
}

@media (max-width: 767.98px) {
    html body .mud-dialog.cx-notification-view-dialog,
    html body .mud-dialog.cx-r1-notification-view {
        width: calc(100vw - 14px) !important;
        max-width: calc(100vw - 14px) !important;
        max-height: calc(100dvh - 14px) !important;
    }
}

html body.cx-design-system .conexgo-header-notifications .conexgo-notification-list {
    margin: 0 !important;
    gap: 0 !important;
    display: block !important;
    min-height: 0 !important;
    height: auto !important;
}

html body.cx-design-system .conexgo-header-notifications .conexgo-notification-empty {
    min-height: 88px !important;
    padding: 16px 14px !important;
}

html body.cx-design-system .conexgo-header-notifications .conexgo-notification-dropdown {
    height: auto !important;
}

html body.cx-design-system .cx-custom-select-menu--top-layer[popover],
html body.cx-design-system .cx-custom-select-menu[data-cx-select-owner] {
    min-width: 0 !important;
}

    html body.cx-design-system .cx-custom-select-menu--top-layer[popover] .cx-custom-select-option,
    html body.cx-design-system .cx-custom-select-menu[data-cx-select-owner] .cx-custom-select-option {
        box-sizing: border-box !important;
    }

html body.cx-design-system #conexgoDashboardSmartGrid
[data-dashboard-key="latestAlerts"] .conexgo-dashboard-latest-item,
html body.cx-design-system #conexgoDashboardSmartGrid
[data-dashboard-key="topAlertDevices"] .conexgo-dashboard-ranked-item,
html body.cx-design-system #conexgoDashboardSmartGrid
[data-dashboard-key="offlineDevices"] .cx-dashboard-offline-item {
    padding: 9px 10px !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid
[data-dashboard-key="latestAlerts"] .conexgo-dashboard-latest-item {
    gap: 10px !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid
[data-dashboard-key="topAlertDevices"] .conexgo-dashboard-ranked-item {
    gap: 10px !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid
[data-dashboard-key="topAlertDevices"] .conexgo-dashboard-ranked-meter {
    max-width: 210px !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid
[data-dashboard-key="offlineDevices"] .conexgo-dashboard-offline-duration {
    margin-top: 2px !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid
[data-dashboard-key="offlineDevices"] .conexgo-dashboard-offline-threshold {
    margin-top: 3px !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid
[data-dashboard-key="offlineDevices"] .conexgo-dashboard-list-footer {
    padding: 8px 10px !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid
[data-dashboard-key="topAlertDevices"] .conexgo-dashboard-ranked-item {
    min-height: 58px !important;
    padding: 7px 10px !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(145px, 42%) !important;
    column-gap: 10px !important;
    row-gap: 2px !important;
    align-items: center !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid
[data-dashboard-key="topAlertDevices"] .conexgo-dashboard-ranked-copy {
    align-self: center !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid
[data-dashboard-key="topAlertDevices"] .conexgo-dashboard-ranked-title {
    margin: 0 !important;
    font-size: 13px !important;
    line-height: 1.2 !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid
[data-dashboard-key="topAlertDevices"] .conexgo-dashboard-ranked-subtitle {
    margin-top: 2px !important;
    font-size: 11.5px !important;
    line-height: 1.2 !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid
[data-dashboard-key="topAlertDevices"] .conexgo-dashboard-ranked-meter {
    width: 100% !important;
    max-width: 190px !important;
    gap: 7px !important;
    justify-self: end !important;
    align-self: center !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid
[data-dashboard-key="topAlertDevices"] .conexgo-dashboard-progress {
    height: 7px !important;
    min-height: 7px !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid
[data-dashboard-key="topAlertDevices"] .conexgo-dashboard-ranked-count {
    min-width: 26px !important;
    font-size: 12px !important;
    line-height: 1 !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid
[data-dashboard-key="latestAlerts"] .conexgo-dashboard-latest-item {
    min-height: 58px !important;
    padding: 7px 10px !important;
    gap: 8px !important;
    align-items: center !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid
[data-dashboard-key="latestAlerts"] .conexgo-dashboard-latest-mainline {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    gap: 6px !important;
    align-items: baseline !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid
[data-dashboard-key="latestAlerts"] .conexgo-dashboard-latest-title {
    margin: 0 !important;
    font-size: 13px !important;
    line-height: 1.2 !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid
[data-dashboard-key="latestAlerts"] .conexgo-dashboard-latest-time {
    font-size: 10.75px !important;
    line-height: 1.2 !important;
    text-align: right !important;
    white-space: nowrap !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid
[data-dashboard-key="latestAlerts"] .conexgo-dashboard-latest-device {
    margin-top: 2px !important;
    font-size: 11.5px !important;
    line-height: 1.2 !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid
[data-dashboard-key="offlineDevices"] .cx-dashboard-offline-item {
    min-height: 64px !important;
    padding: 7px 10px !important;
    gap: 8px !important;
    align-items: center !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid
[data-dashboard-key="offlineDevices"] .conexgo-dashboard-offline-device-link {
    font-size: 13px !important;
    line-height: 1.2 !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid
[data-dashboard-key="offlineDevices"] .conexgo-dashboard-offline-customer,
html body.cx-design-system #conexgoDashboardSmartGrid
[data-dashboard-key="offlineDevices"] .conexgo-dashboard-offline-duration {
    margin-top: 2px !important;
    font-size: 11.5px !important;
    line-height: 1.2 !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid
[data-dashboard-key="offlineDevices"] .conexgo-dashboard-offline-threshold {
    margin-top: 2px !important;
    font-size: 10.5px !important;
    line-height: 1.2 !important;
}

@container (max-width: 430px) {
    html body.cx-design-system #conexgoDashboardSmartGrid
    [data-dashboard-key="topAlertDevices"] .conexgo-dashboard-ranked-item {
        grid-template-columns: minmax(0, 1fr) !important;
        row-gap: 4px !important;
    }

    html body.cx-design-system #conexgoDashboardSmartGrid
    [data-dashboard-key="topAlertDevices"] .conexgo-dashboard-ranked-meter {
        max-width: none !important;
        justify-self: stretch !important;
    }

    html body.cx-design-system #conexgoDashboardSmartGrid
    [data-dashboard-key="latestAlerts"] .conexgo-dashboard-latest-mainline {
        grid-template-columns: minmax(0, 1fr) !important;
        gap: 2px !important;
    }

    html body.cx-design-system #conexgoDashboardSmartGrid
    [data-dashboard-key="latestAlerts"] .conexgo-dashboard-latest-time {
        text-align: left !important;
        white-space: normal !important;
    }
}

html body.cx-design-system .conexgo-header-notifications .conexgo-notification-empty {
    min-height: 0 !important;
    padding: 10px 14px !important;
    gap: 5px !important;
}

html body.cx-design-system .conexgo-header-notifications
.conexgo-notification-empty-icon {
    width: 32px !important;
    height: 32px !important;
    font-size: 13px !important;
}

html body.cx-design-system .conexgo-header-notifications
.conexgo-notification-dropdown:not(.show) {
    display: none !important;
    visibility: hidden !important;
    pointer-events: none !important;
}

html body.cx-design-system .conexgo-header-notifications
.conexgo-notification-dropdown.show {
    display: grid !important;
    visibility: visible !important;
    pointer-events: auto !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid > .conexgo-dashboard-smart-item:has(> .conexgo-dashboard-minimized-card),
html body.cx-design-system #conexgoDashboardSmartGrid > .conexgo-dashboard-smart-item:has(> .conexgo-dashboard-card-closing) {
    height: 48px !important;
    min-height: 48px !important;
    max-height: 48px !important;
    overflow: visible !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid > .conexgo-dashboard-smart-item > .conexgo-dashboard-resizable-card.conexgo-dashboard-minimized-card,
html body.cx-design-system #conexgoDashboardSmartGrid > .conexgo-dashboard-smart-item > .conexgo-dashboard-resizable-card.conexgo-dashboard-card-closing,
html body.cx-design-system
.conexgo-dashboard-configuration-card.conexgo-dashboard-minimized-card,
html body.cx-design-system
.conexgo-dashboard-configuration-card.conexgo-dashboard-card-closing {
    height: 48px !important;
    min-height: 48px !important;
    max-height: 48px !important;
    resize: none !important;
    overflow: hidden !important;
}

    html body.cx-design-system #conexgoDashboardSmartGrid
    .conexgo-dashboard-minimized-card > .card-body,
    html body.cx-design-system #conexgoDashboardSmartGrid
    .conexgo-dashboard-card-closing > .card-body,
    html body.cx-design-system
    .conexgo-dashboard-configuration-card.conexgo-dashboard-minimized-card > .card-body,
    html body.cx-design-system
    .conexgo-dashboard-configuration-card.conexgo-dashboard-card-closing > .card-body {
        display: none !important;
    }

html body.cx-design-system .card > .cx-list-toolbar,
html body.cx-design-system .card > .cx-list-toolbar.mb-1 {
    margin-bottom: 0 !important;
    border-bottom-left-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
}

    html body.cx-design-system .card > .cx-list-toolbar + .cx-filter-disclosure {
        margin-top: 0 !important;
        border-top: 0 !important;
        border-top-left-radius: 0 !important;
        border-top-right-radius: 0 !important;
    }

    html body.cx-design-system .card > .cx-list-toolbar + .card-body:has(> .cx-filter-disclosure:first-child) {
        padding-top: 0 !important;
    }

    html body.cx-design-system .card > .cx-list-toolbar + .card-body > .cx-filter-disclosure:first-child {
        margin-top: 0 !important;
        border-top: 0 !important;
        border-top-left-radius: 0 !important;
        border-top-right-radius: 0 !important;
    }

@media (min-width: 576px) {
    html body.cx-design-system .card > .cx-list-toolbar + .card-body > .cx-filter-disclosure:first-child.cx-filter-table-width {
        width: calc(100% + 2rem) !important;
        margin-left: -1rem !important;
        margin-right: -1rem !important;
    }
}

@media (min-width: 992px) {
    html body.cx-design-system .cx-paged-list .conexgo-pagedlist-toolbar {
        width: 100% !important;
        min-height: 0 !important;
        margin: 0 0 10px !important;
        padding: 10px 12px !important;
        display: flex !important;
        flex-flow: row nowrap !important;
        align-items: flex-end !important;
        justify-content: flex-start !important;
        gap: 12px !important;
        border: 1px solid #e0e8ef !important;
        border-radius: 11px !important;
        background: #fbfdff !important;
        box-shadow: none !important;
    }

    html body.cx-design-system .cx-paged-list .conexgo-pagedlist-filters {
        flex: 0 1 auto !important;
        min-width: 0 !important;
        width: auto !important;
        display: flex !important;
        flex-flow: row nowrap !important;
        align-items: flex-end !important;
        gap: 12px !important;
    }

    html body.cx-design-system .cx-paged-list .conexgo-pagedlist-field {
        min-width: 0 !important;
        display: grid !important;
        grid-template-rows: minmax(20px, auto) 42px !important;
        align-content: end !important;
        gap: 5px !important;
        margin: 0 !important;
    }

    html body.cx-design-system .cx-paged-list .conexgo-pagedlist-field-label {
        min-height: 20px !important;
        margin: 0 !important;
        align-self: center !important;
    }

    html body.cx-design-system .cx-paged-list .conexgo-pagedlist-size-select {
        width: 150px !important;
        min-width: 150px !important;
        max-width: 150px !important;
    }

    html body.cx-design-system .cx-paged-list .conexgo-pagedlist-range-select {
        width: 220px !important;
        min-width: 220px !important;
        max-width: 220px !important;
    }

    html body.cx-design-system .cx-paged-list
    :is(.conexgo-pagedlist-size-select, .conexgo-pagedlist-range-select)
    .cx-custom-select-trigger {
        height: 42px !important;
        min-height: 42px !important;
    }

    html body.cx-design-system .cx-paged-list .conexgo-pagedlist-pagination {
        flex: 0 0 auto !important;
        width: auto !important;
        min-width: max-content !important;
        height: 42px !important;
        margin: 0 0 0 auto !important;
        display: flex !important;
        align-items: flex-end !important;
        justify-content: flex-end !important;
        align-self: flex-end !important;
        overflow: visible !important;
    }

        html body.cx-design-system .cx-paged-list
        .conexgo-pagedlist-pagination .pagination {
            height: 42px !important;
            margin: 0 !important;
            display: flex !important;
            flex-wrap: nowrap !important;
            align-items: stretch !important;
            gap: 5px !important;
        }

        html body.cx-design-system .cx-paged-list
        .conexgo-pagedlist-pagination .page-link {
            min-width: 42px !important;
            height: 42px !important;
            padding: 0 10px !important;
            display: inline-flex !important;
            align-items: center !important;
            justify-content: center !important;
        }

    html body.cx-design-system .cx-paged-list
    .conexgo-pagedlist-page-status .page-link {
        min-width: 126px !important;
    }
}

@media (min-width: 768px) and (max-width: 991.98px) {
    html body.cx-design-system .cx-paged-list .conexgo-pagedlist-toolbar {
        display: flex !important;
        flex-wrap: wrap !important;
        align-items: flex-end !important;
        gap: 10px 12px !important;
    }

    html body.cx-design-system .cx-paged-list .conexgo-pagedlist-pagination {
        margin-left: auto !important;
        align-self: flex-end !important;
    }
}

html body.cx-design-system :is( .device-list-action-group, .account-list-cell-name .conexgo-row-action-group ) {
    position: relative !important;
    overflow: visible !important;
}

@media (min-width: 768px) {
    html body.cx-design-system :is( .device-list-action-group, .account-list-cell-name .conexgo-row-action-group ) > :is( .device-list-action-menu, .conexgo-row-action-menu ),
    html body.cx-design-system :is( .device-list-action-group, .account-list-cell-name .conexgo-row-action-group ) > :is( .device-list-action-menu, .conexgo-row-action-menu ).show {
        position: absolute !important;
        inset: calc(100% + 6px) 0 auto 0 !important;
        top: calc(100% + 6px) !important;
        right: 0 !important;
        bottom: auto !important;
        left: 0 !important;
        width: 100% !important;
        min-width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        margin: 0 !important;
        box-sizing: border-box !important;
        overflow-x: hidden !important;
        overflow-y: visible !important;
        overscroll-behavior: auto !important;
        scrollbar-gutter: auto !important;
        transform: none !important;
        z-index: 5200 !important;
    }

    
    html body.cx-design-system :is( .device-list-action-group, .account-list-cell-name .conexgo-row-action-group, .conexgo-row-action-group ).cx-row-menu-open-above > :is( .device-list-action-menu, .conexgo-row-action-menu ),
    html body.cx-design-system :is( .device-list-action-group, .account-list-cell-name .conexgo-row-action-group, .conexgo-row-action-group ).cx-row-menu-open-above > :is( .device-list-action-menu, .conexgo-row-action-menu ).show {
        position: absolute !important;
        inset: auto 0 calc(100% + 6px) 0 !important;
        top: auto !important;
        right: 0 !important;
        bottom: calc(100% + 6px) !important;
        left: 0 !important;
        margin: 0 !important;
        transform: none !important;
    }
}

html body.cx-design-system :is( .device-list-action-menu, .conexgo-row-action-menu ).cx-r64-row-menu-scrollable {
    max-height: var(--cx-r64-row-menu-max-height, 430px) !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    overscroll-behavior: contain !important;
    scrollbar-gutter: stable !important;
    scrollbar-width: thin !important;
    scrollbar-color: #9fb2c1 transparent !important;
}

html body.cx-design-system :is( .conexgo-pagedlist-table tbody tr, .conexgo-pagedlist-table tbody td, .conexgo-pagedlist-table-region, .conexgo-pagedlist-table-column, .table-responsive ):has(:is( .device-list-action-menu, .conexgo-row-action-menu ).show) {
    position: relative !important;
    overflow: visible !important;
    z-index: 5100 !important;
}

html body.cx-design-system :is( .device-list-action-menu, .conexgo-row-action-menu ) .dropdown-item {
    min-height: 38px !important;
    padding: 7px 10px !important;
}

html body .mud-dialog.cx-r1-device-geofence
.device-geofence-dialog-actions {
    justify-content: flex-end !important;
}

html body .mud-dialog.cx-r1-device-geofence
.device-geofence-dialog-actions .device-geofence-delete {
    margin-left: 0 !important;
    margin-right: 0 !important;
}

html body .cx-r1-device-geofence .device-geofence-map-card {
    display: flex !important;
    flex-direction: column !important;
    align-self: stretch !important;
    min-height: 320px !important;
}

html body .cx-r1-device-geofence .device-geofence-map-preview {
    width: 100% !important;
    min-width: 0 !important;
    min-height: 270px !important;
    flex: 1 1 270px !important;
    background: #eef3f7 !important;
}

html body .mud-dialog.cx-r1-device-lowbattery
.cx-device-config-field-grid {
    grid-template-columns: minmax(240px, 380px) !important;
    justify-content: start !important;
}

html body .mud-dialog.cx-r1-device-lowbattery
.cx-control--battery-threshold {
    width: 100% !important;
    max-width: 380px !important;
}

html body.cx-design-system .cx-row-action-icon--manage-devices {
    width: 18px !important;
    min-width: 18px !important;
    height: 18px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin-right: 8px !important;
    font-size: 15px !important;
    line-height: 1 !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid
[data-dashboard-key="latestAlerts"]
.conexgo-dashboard-latest-period-row {
    display: block !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid
[data-dashboard-key="latestAlerts"]
.conexgo-dashboard-latest-period-field {
    width: min(100%, 390px) !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 7px !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid
[data-dashboard-key="latestAlerts"]
.conexgo-dashboard-latest-period-select {
    width: 100% !important;
    max-width: 390px !important;
    margin-top: 1px !important;
}

html body.cx-design-system .alert-list-device-line {
    column-gap: 14px !important;
}

html body.cx-design-system .alert-list-callcenter {
    gap: 7px !important;
}

html body.cx-design-system .alert-list-callcenter > i {
    margin-left: 1px !important;
}

html body.cx-design-system .cx-paged-list .conexgo-pagedlist-field {
    gap: 8px !important;
}

html body.cx-design-system .cx-paged-list
.conexgo-pagedlist-field-label--icon {
    min-height: 24px !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    margin: 0 !important;
    line-height: 1.2 !important;
}

html body.cx-design-system .cx-paged-list
.conexgo-pagedlist-label-icon {
    width: 24px !important;
    min-width: 24px !important;
    height: 24px !important;
    flex: 0 0 24px !important;
    margin: 0 !important;
}

html body.cx-design-system :is(
    .device-list-action-menu,
    .conexgo-row-action-menu
).cx-r66-row-menu-scrollable {
    max-height: var(--cx-r66-row-menu-max-height) !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    overscroll-behavior: contain !important;
    scrollbar-gutter: stable !important;
    scrollbar-width: thin !important;
    scrollbar-color: #9fb2c1 transparent !important;
}

html body.cx-design-system :is(
    .device-list-action-menu,
    .conexgo-row-action-menu
):not(.cx-r66-row-menu-scrollable) {
    max-height: none !important;
    overflow-y: visible !important;
    scrollbar-gutter: auto !important;
}

@media (max-width: 767.98px) {
    html body .mud-dialog.cx-r1-device-lowbattery
    .cx-device-config-field-grid {
        grid-template-columns: minmax(0, 1fr) !important;
    }

    html body .mud-dialog.cx-r1-device-lowbattery
    .cx-control--battery-threshold {
        max-width: none !important;
    }
}

html body .blazored-modal:has(.cx-modal-title-shared-password),
html body .blazored-modal:has(.cx-modal-title-timezone) {
    width: min(760px, calc(100vw - 32px)) !important;
    max-width: min(760px, calc(100vw - 32px)) !important;
    max-height: min(760px, calc(100dvh - 32px)) !important;
    padding: 0 !important;
    overflow: hidden !important;
    border: 1px solid #9fb5c8 !important;
    border-radius: 14px !important;
    background: #f6f9fc !important;
    box-shadow: 0 24px 64px rgba(31, 58, 82, .24) !important;
}

html body .blazored-modal:has(.cx-modal-title-shared-password)
.blazored-modal-header,
html body .blazored-modal:has(.cx-modal-title-timezone)
.blazored-modal-header {
    min-height: 64px !important;
    margin: 0 !important;
    padding: 14px 18px !important;
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: linear-gradient(135deg, #31597b 0%, #2a4d6d 100%) !important;
    color: #fff !important;
}

html body .blazored-modal:has(.cx-modal-title-shared-password)
.blazored-modal-title,
html body .blazored-modal:has(.cx-modal-title-timezone)
.blazored-modal-title {
    margin: 0 !important;
    color: #fff !important;
    font-size: 1.15rem !important;
    font-weight: 800 !important;
    line-height: 1.2 !important;
    letter-spacing: -.01em !important;
}

html body .blazored-modal:has(.cx-modal-title-shared-password)
.blazored-modal-close,
html body .blazored-modal:has(.cx-modal-title-timezone)
.blazored-modal-close {
    width: 38px !important;
    min-width: 38px !important;
    height: 38px !important;
    margin-left: auto !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border: 1px solid rgba(255,255,255,.28) !important;
    border-radius: 9px !important;
    background: rgba(255,255,255,.08) !important;
    color: #fff !important;
    opacity: 1 !important;
}

html body .blazored-modal:has(.cx-modal-title-shared-password)
.blazored-modal-content,
html body .blazored-modal:has(.cx-modal-title-timezone)
.blazored-modal-content {
    max-height: calc(100dvh - 100px) !important;
    padding: 16px !important;
    overflow: auto !important;
    background: #f6f9fc !important;
}

html body .cx-legacy-password-modal,
html body .cx-legacy-timezone-modal {
    width: 100% !important;
    padding: 0 !important;
    background: transparent !important;
}

html body .cx-legacy-password-modal .cx-modal-layout-v21,
html body .cx-legacy-timezone-modal .cx-modal-layout-v21 {
    padding: 0 !important;
}

html body .cx-legacy-password-modal .cx-modal-group-v21,
html body .cx-legacy-timezone-modal .cx-modal-group-v21 {
    margin: 0 !important;
    padding: 18px !important;
    border: 1px solid #9fb8ca !important;
    border-radius: 12px !important;
    background: #fff !important;
    box-shadow: 0 4px 14px rgba(36, 67, 95, .07) !important;
}

html body .cx-legacy-password-modal .cx-r1-section-description,
html body .cx-legacy-timezone-modal .cx-r1-section-description {
    margin-bottom: 14px !important;
}

html body .cx-legacy-password-modal .cx-legacy-note {
    margin: 0 0 16px !important;
    border-color: #c8d8e5 !important;
    border-left: 4px solid #4d7ca5 !important;
    border-radius: 9px !important;
    background: #f7fafc !important;
}

html body .cx-legacy-password-modal .cx-legacy-form-row,
html body .cx-legacy-timezone-modal .cx-legacy-form-row {
    display: grid !important;
    grid-template-columns: minmax(180px, 220px) minmax(0, 1fr) !important;
    align-items: center !important;
    column-gap: 16px !important;
    row-gap: 7px !important;
    margin: 0 0 14px !important;
}

html body .cx-legacy-password-modal .cx-legacy-form-row:last-child,
html body .cx-legacy-timezone-modal .cx-legacy-form-row:last-child {
    margin-bottom: 0 !important;
}

html body .cx-legacy-password-modal .cx-legacy-form-label,
html body .cx-legacy-timezone-modal .cx-legacy-form-label {
    margin: 0 !important;
    color: #344f69 !important;
    font-weight: 750 !important;
    line-height: 1.35 !important;
}

html body .cx-legacy-password-modal .cx-password-input-shell,
html body .cx-legacy-timezone-modal .cx-control--timezone {
    width: 100% !important;
}

html body .cx-legacy-password-modal .form-control {
    min-height: 46px !important;
    border: 1px solid #b7cada !important;
    border-radius: 9px !important;
    background: #fff !important;
    box-shadow: none !important;
}

html body .cx-legacy-password-modal .form-control:focus {
    border-color: #4d7ca5 !important;
    box-shadow: 0 0 0 3px rgba(77,124,165,.12) !important;
}

html body .cx-legacy-password-modal .cx-legacy-fieldset-actions,
html body .cx-legacy-timezone-modal .cx-legacy-fieldset-actions {
    width: 100% !important;
    margin: 14px 0 0 !important;
    padding: 14px 0 0 !important;
    display: flex !important;
    justify-content: flex-end !important;
    border-top: 1px solid #d8e2eb !important;
}

html body .cx-legacy-password-modal .conexgo-blue-button,
html body .cx-legacy-timezone-modal .conexgo-blue-button {
    min-height: 44px !important;
    margin-left: auto !important;
    padding-inline: 18px !important;
    border-radius: 9px !important;
}

html body .mud-dialog.cx-notification-view-dialog,
html body .mud-dialog:has(.cx-notification-view-dialog) {
    width: min(900px, calc(100vw - 32px)) !important;
    max-width: min(900px, calc(100vw - 32px)) !important;
}

html body .cx-notification-view-dialog .notification-view-form {
    width: min(100%, 820px) !important;
    margin: 0 auto !important;
    display: grid !important;
    gap: 14px !important;
}

html body .cx-notification-view-dialog .notification-view-field {
    display: grid !important;
    gap: 7px !important;
    margin: 0 !important;
}

html body .cx-notification-view-dialog .notification-view-label {
    margin: 0 !important;
    color: #48617a !important;
    font-size: .76rem !important;
    font-weight: 850 !important;
    line-height: 1.2 !important;
    letter-spacing: .055em !important;
    text-transform: uppercase !important;
}

html body .cx-notification-view-dialog .notification-view-priority-card {
    min-height: 66px !important;
    padding: 11px 13px !important;
    gap: 12px !important;
    border: 1px solid #cbd9e5 !important;
    border-radius: 10px !important;
    background: linear-gradient(180deg, #fff 0%, #fbfdff 100%) !important;
    box-shadow: 0 2px 7px rgba(39, 70, 98, .045) !important;
}

html body .cx-notification-view-dialog .notification-view-priority-icon {
    width: 40px !important;
    min-width: 40px !important;
    height: 40px !important;
    flex-basis: 40px !important;
}

html body .cx-notification-view-dialog .notification-view-title-box {
    min-height: 50px !important;
    padding: 12px 14px !important;
    display: flex !important;
    align-items: center !important;
    border: 1px solid #c8d8e5 !important;
    border-left: 4px solid #4d7ca5 !important;
    border-radius: 9px !important;
    background: #f8fbfd !important;
    color: #243d57 !important;
    font-size: 1rem !important;
    font-weight: 800 !important;
    line-height: 1.4 !important;
}

html body .cx-notification-view-dialog .notification-view-message-box {
    min-height: 110px !important;
    max-height: 260px !important;
    padding: 13px 14px !important;
    overflow: auto !important;
    border: 1px solid #c8d8e5 !important;
    border-radius: 9px !important;
    background: #fff !important;
    color: #30475f !important;
    font-size: .95rem !important;
    line-height: 1.55 !important;
    box-shadow: inset 0 1px 2px rgba(34, 61, 84, .025) !important;
}

html body .cx-notification-view-dialog .notification-view-acknowledged {
    min-height: 38px !important;
    padding: 8px 12px !important;
    border-radius: 9px !important;
}

html body.cx-design-system .conexgo-account-profile .form-horizontal > .row,
html body.cx-design-system .conexgo-account-profile .tab-pane .form-horizontal > .row {
    margin-bottom: 12px !important;
    row-gap: 6px !important;
}

html body.cx-design-system .conexgo-account-profile .form-horizontal > .row:last-child,
html body.cx-design-system .conexgo-account-profile .tab-pane .form-horizontal > .row:last-child {
    margin-bottom: 0 !important;
}

html body.cx-design-system .conexgo-account-profile .form-label {
    padding-top: 9px !important;
    padding-bottom: 4px !important;
}

html body.cx-design-system .conexgo-profile-icon-picker {
    margin-top: 3px !important;
    margin-bottom: 10px !important;
}

html body.cx-design-system .conexgo-profile-icon-picker__trigger {
    min-height: 48px !important;
    gap: 10px !important;
    padding: 6px 8px !important;
}

html body.cx-design-system .conexgo-profile-icon-picker__preview {
    margin-right: 2px !important;
}

html body.cx-design-system .conexgo-profile-icon-picker__panel {
    top: calc(100% + 10px) !important;
    max-height: min(270px, 38dvh) !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    overscroll-behavior: contain !important;
    scrollbar-gutter: stable !important;
    z-index: 4500 !important;
}

html body.cx-design-system .conexgo-profile-icon-picker__option {
    min-height: 48px !important;
    gap: 11px !important;
    padding: 7px 10px !important;
}

html body.cx-design-system .device-list-action-group .device-list-name-button,
html body.cx-design-system .device-list-action-group .device-list-name-button:hover,
html body.cx-design-system .device-list-action-group .device-list-name-button:focus,
html body.cx-design-system .device-list-action-group .device-list-name-button:active {
    min-height: 46px !important;
    padding: 7px 12px !important;
    gap: 9px !important;
    border-color: #b8cbd9 !important;
    border-right-color: #9fb8ca !important;
    background: #fff !important;
    color: #274966 !important;
    box-shadow: none !important;
}

html body.cx-design-system .device-list-action-group .device-list-name-button:hover,
html body.cx-design-system .device-list-action-group .device-list-name-button:focus-visible {
    background: #f7fafc !important;
    border-color: #8eacbf !important;
}

html body.cx-design-system .device-list-action-group .device-list-name-button img {
    width: 28px !important;
    min-width: 28px !important;
    height: 28px !important;
    flex: 0 0 28px !important;
    padding: 0 !important;
    object-fit: contain !important;
    opacity: 1 !important;
    filter: none !important;
}

html body.cx-design-system .device-list-action-group .device-list-name-text {
    color: #274966 !important;
    font-weight: 800 !important;
}

html body.cx-design-system .device-list-action-group .device-list-action-toggle,
html body.cx-design-system .device-list-action-group .device-list-action-toggle:hover,
html body.cx-design-system .device-list-action-group .device-list-action-toggle:focus,
html body.cx-design-system .device-list-action-group .device-list-action-toggle:active,
html body.cx-design-system .device-list-action-group .device-list-action-toggle.show {
    width: 48px !important;
    min-width: 48px !important;
    flex-basis: 48px !important;
    border-color: #315879 !important;
    background: #315879 !important;
    color: #fff !important;
    box-shadow: none !important;
}

html body.cx-design-system .device-list-action-group .device-list-action-toggle:hover,
html body.cx-design-system .device-list-action-group .device-list-action-toggle:focus-visible {
    background: #294c69 !important;
    border-color: #294c69 !important;
}

html body.cx-design-system .device-list-action-group .device-list-action-toggle::after,
html body.cx-design-system .device-list-action-group .device-list-action-toggle .caret {
    color: #fff !important;
    opacity: 1 !important;
    filter: none !important;
}

html body.cx-design-system .device-list-action-group {
    border-radius: 10px !important;
    box-shadow: 0 2px 7px rgba(37, 66, 92, .075) !important;
}

html body.cx-design-system .device-list-action-group .device-list-name-button {
    border-radius: 10px 0 0 10px !important;
}

html body.cx-design-system .device-list-action-group .device-list-action-toggle {
    border-radius: 0 10px 10px 0 !important;
}

@media (max-width: 767.98px) {
    html body .blazored-modal:has(.cx-modal-title-shared-password),
    html body .blazored-modal:has(.cx-modal-title-timezone) {
        width: calc(100vw - 16px) !important;
        max-width: calc(100vw - 16px) !important;
        max-height: calc(100dvh - 16px) !important;
    }

    html body .cx-legacy-password-modal .cx-legacy-form-row,
    html body .cx-legacy-timezone-modal .cx-legacy-form-row {
        grid-template-columns: minmax(0, 1fr) !important;
        gap: 7px !important;
    }

    html body .cx-legacy-password-modal .cx-legacy-form-label,
    html body .cx-legacy-timezone-modal .cx-legacy-form-label {
        text-align: left !important;
    }

    html body .mud-dialog.cx-notification-view-dialog,
    html body .mud-dialog:has(.cx-notification-view-dialog) {
        width: calc(100vw - 16px) !important;
        max-width: calc(100vw - 16px) !important;
    }
}

html body.cx-design-system .cx-data-log-unified-toolbar {
    width: 100% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 10px 14px !important;
}

html body.cx-design-system .cx-data-log-unified-toolbar > .device-filter-summary {
    min-width: 0 !important;
    flex: 1 1 auto !important;
}

html body.cx-design-system .cx-data-log-unified-toolbar > .device-filter-reset {
    width: auto !important;
    min-width: 0 !important;
    max-width: max-content !important;
    min-height: 36px !important;
    height: 36px !important;
    padding: 0 12px !important;
    flex: 0 0 auto !important;
    justify-self: auto !important;
    align-self: center !important;
    border-radius: 8px !important;
    font-size: 12px !important;
    line-height: 1 !important;
    white-space: nowrap !important;
}

@media (max-width: 575.98px) {
    html body.cx-design-system .cx-data-log-unified-toolbar {
        align-items: flex-start !important;
    }

    html body.cx-design-system .cx-data-log-unified-toolbar > .device-filter-reset {
        min-height: 38px !important;
        height: 38px !important;
        padding-inline: 11px !important;
    }
}

html body.cx-design-system :is(
    .device-list-action-group,
    .account-list-cell-name .conexgo-row-action-group
) {
    width: min(100%, 380px) !important;
    min-width: 0 !important;
    max-width: 380px !important;
    display: flex !important;
    align-items: stretch !important;
    border-radius: 9px !important;
    box-shadow: 0 2px 7px rgba(37, 66, 92, .07) !important;
}

html body.cx-design-system :is(
    .device-list-action-group .device-list-name-button,
    .account-list-cell-name .account-list-name-button
),
html body.cx-design-system :is(
    .device-list-action-group .device-list-name-button,
    .account-list-cell-name .account-list-name-button
):is(:hover, :focus, :focus-visible, :active) {
    min-width: 0 !important;
    min-height: 42px !important;
    height: 42px !important;
    flex: 1 1 auto !important;
    padding: 6px 11px !important;
    border: 1px solid #b8cbd9 !important;
    border-right-color: #9fb8ca !important;
    border-radius: 9px 0 0 9px !important;
    background: #ffffff !important;
    color: #274966 !important;
    text-align: left !important;
    font-size: 13.5px !important;
    font-weight: 720 !important;
    line-height: 1.2 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    box-shadow: none !important;
    filter: none !important;
    transform: none !important;
}

html body.cx-design-system :is(
    .device-list-action-group .device-list-name-button,
    .account-list-cell-name .account-list-name-button
):is(:hover, :focus-visible) {
    border-color: #8eacbf !important;
    background: #f7fafc !important;
}

html body.cx-design-system .device-list-action-group .device-list-name-button {
    gap: 8px !important;
}

html body.cx-design-system .device-list-action-group .device-list-name-button img {
    width: 26px !important;
    min-width: 26px !important;
    height: 26px !important;
    flex: 0 0 26px !important;
    padding: 0 !important;
    object-fit: contain !important;
    opacity: 1 !important;
    filter: none !important;
}

html body.cx-design-system .device-list-action-group .device-list-name-text {
    min-width: 0 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    color: #274966 !important;
    font-size: 13.5px !important;
    font-weight: 720 !important;
}

html body.cx-design-system :is(
    .device-list-action-group .device-list-action-toggle,
    .account-list-cell-name .conexgo-row-action-toggle
),
html body.cx-design-system :is(
    .device-list-action-group .device-list-action-toggle,
    .account-list-cell-name .conexgo-row-action-toggle
):is(:hover, :focus, :focus-visible, :active),
html body.cx-design-system :is(
    .device-list-action-group .device-list-action-toggle,
    .account-list-cell-name .conexgo-row-action-toggle
)[aria-expanded="true"] {
    width: 42px !important;
    min-width: 42px !important;
    height: 42px !important;
    min-height: 42px !important;
    flex: 0 0 42px !important;
    padding: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border: 1px solid #315879 !important;
    border-left-color: #486f8d !important;
    border-radius: 0 9px 9px 0 !important;
    background: #315879 !important;
    color: #ffffff !important;
    box-shadow: none !important;
    filter: none !important;
    transform: none !important;
}

html body.cx-design-system :is(
    .device-list-action-group .device-list-action-toggle,
    .account-list-cell-name .conexgo-row-action-toggle
):is(:hover, :focus-visible),
html body.cx-design-system :is(
    .device-list-action-group .device-list-action-toggle,
    .account-list-cell-name .conexgo-row-action-toggle
)[aria-expanded="true"] {
    border-color: #294c69 !important;
    background: #294c69 !important;
}

html body.cx-design-system :is(
    .device-list-action-group .device-list-action-toggle,
    .account-list-cell-name .conexgo-row-action-toggle
)::after,
html body.cx-design-system :is(
    .device-list-action-group .device-list-action-toggle,
    .account-list-cell-name .conexgo-row-action-toggle
) .caret {
    color: #ffffff !important;
    opacity: 1 !important;
    filter: none !important;
}

html body.cx-design-system :is(
    .device-list-action-menu,
    .conexgo-row-action-menu
).cx-r64-row-menu-scrollable {
    max-height: var(--cx-r64-row-menu-max-height, 430px) !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    overscroll-behavior: contain !important;
    scrollbar-gutter: stable !important;
    scrollbar-width: thin !important;
    scrollbar-color: #9fb2c1 transparent !important;
}

html body.cx-design-system :is(
    .device-list-action-menu,
    .conexgo-row-action-menu
):not(.cx-r64-row-menu-scrollable) {
    max-height: none !important;
    overflow-y: visible !important;
    scrollbar-gutter: auto !important;
}

html body.cx-design-system :is(
    .device-list-action-menu,
    .conexgo-row-action-menu
) {
    padding: 6px !important;
    border: 1px solid #c7d7e2 !important;
    border-radius: 9px !important;
    background: #ffffff !important;
    box-shadow: 0 12px 30px rgba(32, 61, 87, .14) !important;
}

html body.cx-design-system :is(
    .device-list-action-menu,
    .conexgo-row-action-menu
) .dropdown-item {
    min-height: 36px !important;
    padding: 7px 9px !important;
    display: flex !important;
    align-items: center !important;
    gap: 9px !important;
    border-radius: 6px !important;
    color: #294865 !important;
    font-size: 13px !important;
    font-weight: 620 !important;
    line-height: 1.22 !important;
    white-space: normal !important;
}

html body.cx-design-system :is(
    .device-list-action-menu,
    .conexgo-row-action-menu
) .dropdown-item > :is(i, span[class*="fa"]) {
    width: 18px !important;
    min-width: 18px !important;
    margin: 0 !important;
    padding: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    color: #5b7d99 !important;
    font-size: 14px !important;
}

html body.cx-design-system :is(
    .device-list-action-menu,
    .conexgo-row-action-menu
) .dropdown-item:is(:hover, :focus-visible) {
    background: #eef5fa !important;
    color: #214763 !important;
}

html body.cx-design-system :is(
    .device-list-action-menu,
    .conexgo-row-action-menu
) :is(li.divider, .dropdown-divider) {
    height: 1px !important;
    min-height: 1px !important;
    margin: 5px 4px !important;
    padding: 0 !important;
    overflow: hidden !important;
    border: 0 !important;
    background: #e1e9ef !important;
}

html body.cx-design-system :is(
    .device-list-action-menu,
    .conexgo-row-action-menu
) .dropdown-item.text-danger {
    color: #b93a4e !important;
}

@media (max-width: 767.98px) {
    html body.cx-design-system :is(
        .device-list-action-group,
        .account-list-cell-name .conexgo-row-action-group
    ) {
        width: 100% !important;
        max-width: 100% !important;
    }
}

html body.cx-design-system .conexgo-dashboard-configuration-row {
    margin-bottom: 12px !important;
}

html body.cx-design-system .conexgo-dashboard-configuration-card:not(.conexgo-dashboard-minimized-card)
> .conexgo-dashboard-card-header-surface {
    min-height: 44px !important;
    height: 44px !important;
    padding: 6px 9px 6px 13px !important;
}

html body.cx-design-system .conexgo-dashboard-configuration-card
.conexgo-dashboard-card-header {
    min-height: 0 !important;
    gap: 8px !important;
}

html body.cx-design-system .conexgo-dashboard-configuration-card
.conexgo-dashboard-card-title {
    font-size: 13.25px !important;
    letter-spacing: .02em !important;
    line-height: 1.15 !important;
}

html body.cx-design-system .conexgo-dashboard-configuration-card
.conexgo-dashboard-card-action {
    width: 30px !important;
    min-width: 30px !important;
    height: 30px !important;
    min-height: 30px !important;
    border-radius: 7px !important;
    font-size: 13px !important;
}

html body.cx-design-system .conexgo-dashboard-configuration-card > .card-body {
    padding: 10px 12px 12px !important;
}

html body.cx-design-system .conexgo-dashboard-config-layout {
    gap: 8px !important;
}

html body.cx-design-system .conexgo-dashboard-config-section,
html body.cx-design-system .conexgo-dashboard-visibility-section {
    padding: 8px 9px !important;
    border-radius: 9px !important;
}

html body.cx-design-system .conexgo-dashboard-config-section-header {
    min-height: 38px !important;
    padding: 0 !important;
    display: grid !important;
    grid-template-columns: 32px minmax(0, 1fr) 24px !important;
    align-items: center !important;
    gap: 8px !important;
}

html body.cx-design-system .conexgo-dashboard-config-section-icon {
    width: 32px !important;
    min-width: 32px !important;
    height: 32px !important;
    min-height: 32px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border: 1px solid #d5e2eb !important;
    border-radius: 8px !important;
    background: #f8fbfd !important;
    color: #315879 !important;
    font-size: 13px !important;
}

html body.cx-design-system .conexgo-dashboard-config-section-copy {
    min-width: 0 !important;
    gap: 1px !important;
}

html body.cx-design-system .conexgo-dashboard-config-section-title {
    font-size: 12.75px !important;
    font-weight: 720 !important;
    line-height: 1.22 !important;
}

html body.cx-design-system .conexgo-dashboard-config-section-description {
    margin-top: 1px !important;
    font-size: 11px !important;
    font-weight: 500 !important;
    line-height: 1.2 !important;
}

html body.cx-design-system .conexgo-dashboard-config-section-toggle {
    width: 24px !important;
    min-width: 24px !important;
    height: 24px !important;
    min-height: 24px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 11px !important;
}

html body.cx-design-system .conexgo-dashboard-config-collapse-inner {
    padding-top: 7px !important;
}

html body.cx-design-system .conexgo-dashboard-config-add-row {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 40px !important;
    align-items: center !important;
    gap: 7px !important;
}

html body.cx-design-system .cx-control--dashboard-config .cx-custom-select-trigger {
    min-height: 38px !important;
    height: 38px !important;
    border-radius: 8px !important;
}

html body.cx-design-system .conexgo-dashboard-config-icon-button {
    width: 40px !important;
    min-width: 40px !important;
    height: 38px !important;
    min-height: 38px !important;
    padding: 0 !important;
    border-radius: 8px !important;
}

html body.cx-design-system .conexgo-dashboard-config-actions {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 7px !important;
}

html body.cx-design-system .conexgo-dashboard-config-action {
    min-height: 38px !important;
    height: 38px !important;
    padding: 0 9px !important;
    gap: 6px !important;
    border-radius: 8px !important;
    font-size: 12px !important;
    line-height: 1 !important;
    white-space: nowrap !important;
}

html body.cx-design-system .conexgo-dashboard-visibility-section {
    margin-top: 8px !important;
}

html body.cx-design-system .conexgo-dashboard-visibility-heading {
    min-height: 38px !important;
    padding: 0 !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto 24px !important;
    align-items: center !important;
    gap: 8px !important;
}

html body.cx-design-system .conexgo-dashboard-visibility-count {
    min-width: 46px !important;
    height: 28px !important;
    padding: 0 8px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border: 1px solid #d2e0e9 !important;
    border-radius: 999px !important;
    background: #f6f9fb !important;
    color: #3b5b74 !important;
    font-size: 11.5px !important;
    font-weight: 700 !important;
}

html body.cx-design-system .conexgo-dashboard-visibility-panel {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    align-items: stretch !important;
    gap: 7px !important;
}

html body.cx-design-system .conexgo-dashboard-visibility-option {
    min-height: 42px !important;
    padding: 7px 9px !important;
    border-radius: 8px !important;
    font-size: 12.25px !important;
    line-height: 1.2 !important;
}

@media (min-width: 1200px) {
    html body.cx-design-system .conexgo-dashboard-config-layout {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (min-width: 768px) and (max-width: 1199.98px) {
    html body.cx-design-system .conexgo-dashboard-visibility-panel {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 767.98px) {
    html body.cx-design-system .conexgo-dashboard-configuration-card:not(.conexgo-dashboard-minimized-card)
    > .conexgo-dashboard-card-header-surface {
        height: auto !important;
        min-height: 44px !important;
    }

    html body.cx-design-system .conexgo-dashboard-configuration-card > .card-body {
        padding: 8px !important;
    }

    html body.cx-design-system .conexgo-dashboard-config-layout {
        grid-template-columns: minmax(0, 1fr) !important;
        gap: 8px !important;
    }

    html body.cx-design-system .conexgo-dashboard-config-actions {
        grid-template-columns: minmax(0, 1fr) !important;
    }

    html body.cx-design-system .conexgo-dashboard-config-action {
        width: 100% !important;
    }

    html body.cx-design-system .conexgo-dashboard-visibility-panel {
        grid-template-columns: minmax(0, 1fr) !important;
    }

    html body.cx-design-system .conexgo-dashboard-visibility-option {
        min-height: 40px !important;
    }
}

html body.cx-design-system #conexgoDashboardSmartGrid
.conexgo-dashboard-filter-stack {
    min-width: 0 !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid
.conexgo-dashboard-primary-filter-row {
    width: 100% !important;
    min-width: 0 !important;
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    align-items: end !important;
    gap: 10px !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid
.conexgo-dashboard-custom-range-grid {
    width: 100% !important;
    min-width: 0 !important;
    margin-top: 9px !important;
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    align-items: end !important;
    gap: 8px !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid
.conexgo-dashboard-filter-field {
    min-width: 0 !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid
.conexgo-dashboard-filter-field .cx-control--dashboard-filter,
html body.cx-design-system #conexgoDashboardSmartGrid
.conexgo-dashboard-filter-field .cx-custom-select,
html body.cx-design-system #conexgoDashboardSmartGrid
.conexgo-dashboard-filter-field .cx-custom-select-trigger {
    width: 100% !important;
    min-width: 0 !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid
.conexgo-dashboard-filter-field .cx-custom-select-value {
    min-width: 0 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    text-align: left !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid
> .conexgo-dashboard-smart-item
> .conexgo-dashboard-resizable-card:not(.conexgo-dashboard-minimized-card) {
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    resize: none !important;
    overflow: visible !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid
> .conexgo-dashboard-smart-item
> .conexgo-dashboard-resizable-card:not(.conexgo-dashboard-minimized-card)
> .card-body {
    min-height: 0 !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid
:is(.conexgo-dashboard-resizable-list, .conexgo-dashboard-active-users-list) {
    min-height: 0 !important;
    max-height: 300px !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    overscroll-behavior: contain !important;
    scrollbar-gutter: stable !important;
    scrollbar-width: thin !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid
.conexgo-dashboard-no-data-card
:is(.conexgo-dashboard-resizable-list, .conexgo-dashboard-active-users-list) {
    max-height: none !important;
    overflow-y: visible !important;
    scrollbar-gutter: auto !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid
.conexgo-dashboard-no-data-card > .card-body {
    padding-top: 12px !important;
    padding-bottom: 14px !important;
    overflow: visible !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid
.conexgo-dashboard-no-data-card
.conexgo-dashboard-empty-state,
html body.cx-design-system #conexgoDashboardSmartGrid
.conexgo-dashboard-no-data-card
.conexgo-dashboard-empty-state.compact {
    min-height: 0 !important;
    padding: 10px 8px 8px !important;
    gap: 5px !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid
.conexgo-dashboard-no-data-card
.conexgo-dashboard-empty-icon {
    width: 42px !important;
    min-width: 42px !important;
    height: 42px !important;
    min-height: 42px !important;
    margin-bottom: 2px !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid
.conexgo-dashboard-no-data-card
.conexgo-dashboard-empty-title {
    margin-top: 0 !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid
.conexgo-dashboard-no-data-card
.conexgo-dashboard-empty-description {
    margin-top: 0 !important;
}

html body.cx-design-system .account-list-row > td {
    padding-top: 12px !important;
    padding-bottom: 12px !important;
    vertical-align: top !important;
}

html body.cx-design-system
:is(.account-list-cell-name, .account-list-cell-contact, .account-list-cell-devices) {
    vertical-align: top !important;
}

html body.cx-design-system .account-list-last-login {
    margin-top: 6px !important;
    margin-left: 5px !important;
}

html body.cx-design-system
:is(.account-list-device-links, .account-list-document-stack) {
    max-height: 132px !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    overscroll-behavior: contain !important;
    scrollbar-gutter: stable !important;
    scrollbar-width: thin !important;
    scrollbar-color: #a7b8c6 transparent !important;
}

html body.cx-design-system .account-list-device-links {
    align-content: start !important;
    padding-right: 4px !important;
    margin-bottom: 6px !important;
}

html body.cx-design-system
:is(.device-list-action-menu, .conexgo-row-action-menu) {
    padding: 5px !important;
}

html body.cx-design-system
:is(.device-list-action-menu, .conexgo-row-action-menu) > li {
    width: 100% !important;
    min-width: 0 !important;
}

html body.cx-design-system
:is(.device-list-action-menu, .conexgo-row-action-menu) .dropdown-item {
    width: 100% !important;
    min-width: 0 !important;
    min-height: 34px !important;
    padding: 6px 8px !important;
    display: flex !important;
    flex-flow: row nowrap !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 8px !important;
    text-align: left !important;
    white-space: normal !important;
}

html body.cx-design-system
:is(.device-list-action-menu, .conexgo-row-action-menu)
.dropdown-item > :is(i, span[class*="fa"]) {
    width: 18px !important;
    min-width: 18px !important;
    height: 18px !important;
    flex: 0 0 18px !important;
    margin: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
}

html body.cx-design-system
:is(.device-list-action-menu, .conexgo-row-action-menu)
.dropdown-item > *:not(i):not(span[class*="fa"]) {
    min-width: 0 !important;
    text-align: left !important;
}

html body.cx-design-system .app-header-modern
:is(.app-header-left-zone, .app-header-center-zone, .app-header-right-zone) {
    min-width: 0 !important;
}

html body.cx-design-system .app-header-modern .app-header-center-zone {
    overflow: visible !important;
}

html body.cx-design-system .app-header-modern .app-header-center-zone .nt-clock-card {
    min-width: 0 !important;
    width: min(100%, 350px) !important;
    max-width: 350px !important;
}

@media (min-width: 1241px) and (max-width: 1599.98px) {
    html body.cx-design-system .app-header-modern .app-header-main-row {
        grid-template-columns:
            minmax(240px, .9fr)
            minmax(300px, 350px)
            minmax(360px, 1.1fr) !important;
        column-gap: 12px !important;
    }

    html body.cx-design-system .app-header-modern .nt-clock-card {
        padding-inline: 10px !important;
        gap: 7px !important;
    }
}

@media (max-width: 767.98px) {
    html body.cx-design-system #conexgoDashboardSmartGrid
    .conexgo-dashboard-primary-filter-row {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 6px !important;
    }

    html body.cx-design-system #conexgoDashboardSmartGrid
    .conexgo-dashboard-custom-range-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 6px !important;
    }

    html body.cx-design-system #conexgoDashboardSmartGrid
    .conexgo-dashboard-primary-filter-row .conexgo-dashboard-filter-label {
        font-size: 11px !important;
    }

    html body.cx-design-system #conexgoDashboardSmartGrid
    .conexgo-dashboard-primary-filter-row .cx-custom-select-trigger {
        min-height: 38px !important;
        height: 38px !important;
        font-size: 11.5px !important;
    }
}

html body.cx-design-system .mud-dialog.cx-r18-72-security-dialog {
    width: min(760px, calc(100vw - 32px)) !important;
    max-width: 760px !important;
    border: 1px solid #c8d9e7 !important;
    border-radius: 14px !important;
    overflow: hidden !important;
    background: #f8fbfd !important;
    box-shadow: 0 22px 60px rgba(31, 61, 88, .20) !important;
}

html body.cx-design-system .mud-dialog.cx-r18-72-security-dialog .mud-dialog-title.cx-r18-72-security-title,
html body.cx-design-system .mud-dialog.cx-r18-72-security-dialog .cx-r18-72-security-title {
    min-height: 54px !important;
    padding: 13px 18px !important;
    display: flex !important;
    align-items: center !important;
    background: #315f82 !important;
    border-bottom: 1px solid #294f6d !important;
    color: #fff !important;
    font-size: 17px !important;
    font-weight: 750 !important;
    letter-spacing: .01em !important;
}

html body.cx-design-system .mud-dialog.cx-r18-72-security-dialog .cx-r18-72-security-content {
    padding: 16px 18px !important;
    background: #f8fbfd !important;
}

html body.cx-design-system .mud-dialog.cx-r18-72-security-dialog .cx-r18-72-security-layout,
html body.cx-design-system .mud-dialog.cx-r18-72-security-dialog .cx-r18-72-security-form {
    width: 100% !important;
    min-width: 0 !important;
}

html body.cx-design-system .mud-dialog.cx-r18-72-security-dialog .cx-r18-72-security-section {
    margin: 0 !important;
    padding: 18px 18px 16px !important;
    background: #fff !important;
    border: 1px solid #9fbdd4 !important;
    border-radius: 12px !important;
}

html body.cx-design-system .mud-dialog.cx-r18-72-security-dialog .cx-r1-section-title {
    color: #173f60 !important;
    font-size: 14px !important;
    font-weight: 750 !important;
}

html body.cx-design-system .mud-dialog.cx-r18-72-security-dialog .cx-r1-section-description {
    margin: 2px 0 14px !important;
    color: #5d7489 !important;
    font-size: 12px !important;
    line-height: 1.45 !important;
}

html body.cx-design-system .mud-dialog.cx-r18-72-security-dialog .cx-r1-form-row {
    margin: 0 !important;
    padding: 9px 0 !important;
    display: flex !important;
    align-items: center !important;
    row-gap: 6px !important;
}

html body.cx-design-system .mud-dialog.cx-r18-72-security-dialog .cx-r1-form-row > .form-label {
    padding-right: 16px !important;
    text-align: right !important;
}

html body.cx-design-system .mud-dialog.cx-r18-72-security-dialog .cx-r1-form-row > .form-label > label {
    margin: 0 !important;
    color: #294a67 !important;
    font-size: 12px !important;
    font-weight: 700 !important;
}

html body.cx-design-system .mud-dialog.cx-r18-72-security-dialog .form-control,
html body.cx-design-system .mud-dialog.cx-r18-72-security-dialog .cx-custom-select-trigger {
    min-height: 42px !important;
    height: 42px !important;
    border-radius: 9px !important;
}

html body.cx-design-system .mud-dialog.cx-r18-72-security-dialog .cx-r18-72-password-shell {
    position: relative !important;
}

html body.cx-design-system .mud-dialog.cx-r18-72-security-dialog .cx-password-visibility-toggle {
    width: 38px !important;
    height: 38px !important;
    right: 2px !important;
    top: 2px !important;
    border: 0 !important;
    border-radius: 8px !important;
    color: #4d7392 !important;
    background: transparent !important;
}

html body.cx-design-system .mud-dialog.cx-r18-72-security-dialog .cx-password-visibility-toggle:hover {
    color: #2f5f83 !important;
    background: #edf5fa !important;
}

html body.cx-design-system .cx-r18-72-security-note {
    margin: 0 0 12px !important;
    padding: 9px 11px !important;
    display: flex !important;
    align-items: flex-start !important;
    gap: 9px !important;
    border: 1px solid #c8dbe9 !important;
    border-left: 3px solid #4d7fa5 !important;
    border-radius: 9px !important;
    background: #f5f9fc !important;
    color: #4e687f !important;
    font-size: 11.5px !important;
    line-height: 1.4 !important;
}

html body.cx-design-system .cx-r18-72-security-note__icon {
    color: #4d7fa5 !important;
    flex: 0 0 auto !important;
}

html body.cx-design-system .cx-r18-72-timezone-help {
    margin-top: 9px !important;
    padding: 9px 11px !important;
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    gap: 5px 8px !important;
    border-radius: 9px !important;
    background: #f5f9fc !important;
    color: #5a7185 !important;
    font-size: 11.5px !important;
}

html body.cx-design-system .cx-r18-72-timezone-help__label {
    font-weight: 700 !important;
    color: #355977 !important;
}

html body.cx-design-system .cx-r18-72-timezone-help__value {
    font-variant-numeric: tabular-nums !important;
}

html body.cx-design-system .mud-dialog.cx-r18-72-security-dialog .cx-r18-72-security-actions {
    min-height: 62px !important;
    padding: 10px 16px !important;
    display: flex !important;
    justify-content: flex-end !important;
    gap: 8px !important;
    border-top: 1px solid #d8e4ed !important;
    background: #f8fbfd !important;
}

html body.cx-design-system .cx-r18-72-dialog-loading {
    min-height: 160px !important;
    display: grid !important;
    place-items: center !important;
}

html body.cx-design-system .cx-custom-select-trigger {
    min-height: 40px !important;
    color: #294b68 !important;
    background: #fbfdff !important;
    border-color: #c8d9e7 !important;
    border-radius: 9px !important;
    box-shadow: 0 1px 2px rgba(28, 61, 88, .025) !important;
    font-weight: 620 !important;
    text-align: left !important;
}

html body.cx-design-system .cx-custom-select-value {
    min-width: 0 !important;
    color: #294b68 !important;
    text-align: left !important;
    line-height: 1.25 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

html body.cx-design-system .cx-custom-select-trigger:hover:not(:disabled) {
    color: #244560 !important;
    background: #f7fbfd !important;
    border-color: #aec8dc !important;
    box-shadow: 0 2px 7px rgba(35, 76, 108, .07) !important;
}

html body.cx-design-system .cx-custom-select-trigger.is-open,
html body.cx-design-system .cx-custom-select-trigger:focus-visible {
    background: #fff !important;
    border-color: #7fa8c7 !important;
    box-shadow: 0 0 0 3px rgba(83, 132, 169, .11) !important;
}

html body.cx-design-system .cx-custom-select-chevron {
    width: 34px !important;
    min-width: 34px !important;
    height: 34px !important;
    border: 1px solid #d3e1eb !important;
    border-radius: 8px !important;
    background: #eef5f9 !important;
    color: #315f82 !important;
}

html body.cx-design-system .cx-custom-select-trigger:hover:not(:disabled) .cx-custom-select-chevron {
    background: #e7f1f7 !important;
    border-color: #c4d8e6 !important;
    color: #264f70 !important;
}

html body.cx-design-system .cx-custom-select-menu--top-layer[popover],
html body.cx-design-system .cx-custom-select-menu[data-cx-select-owner] {
    padding: 5px !important;
    border: 1px solid #c8d9e7 !important;
    border-radius: 10px !important;
    background: #fff !important;
    box-shadow: 0 14px 34px rgba(27, 59, 84, .15) !important;
}

html body.cx-design-system .cx-custom-select-option {
    min-height: 34px !important;
    padding: 7px 9px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 8px !important;
    border-radius: 7px !important;
    color: #35536c !important;
    background: transparent !important;
    font-size: 12px !important;
    font-weight: 560 !important;
    line-height: 1.25 !important;
    text-align: left !important;
}

html body.cx-design-system .cx-custom-select-option-label {
    min-width: 0 !important;
    flex: 1 1 auto !important;
    text-align: left !important;
    overflow-wrap: anywhere !important;
}

html body.cx-design-system .cx-custom-select-option:hover:not(:disabled),
html body.cx-design-system .cx-custom-select-option.is-active {
    color: #244963 !important;
    background: #f1f7fb !important;
}

html body.cx-design-system .cx-custom-select-option.is-selected {
    color: #234d6b !important;
    background: #eaf3f9 !important;
    font-weight: 680 !important;
}

html body.cx-design-system .cx-custom-select-option-check {
    width: 18px !important;
    min-width: 18px !important;
    color: #4e7fa4 !important;
    text-align: center !important;
}

html body.cx-design-system .conexgo-profile-icon-picker {
    position: relative !important;
    z-index: 5000 !important;
}

html body.cx-design-system .conexgo-profile-icon-picker__trigger {
    min-height: 44px !important;
    padding: 5px 8px !important;
    border: 1px solid #b9d0e1 !important;
    border-radius: 10px !important;
    background: #fff !important;
    color: #294b68 !important;
    box-shadow: 0 1px 3px rgba(32, 68, 95, .05) !important;
}

html body.cx-design-system .conexgo-profile-icon-picker__panel {
    position: absolute !important;
    top: calc(100% + 7px) !important;
    left: 0 !important;
    right: 0 !important;
    z-index: 5100 !important;
    width: 100% !important;
    max-height: 220px !important;
    margin: 0 !important;
    padding: 8px !important;
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 7px !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    overscroll-behavior: contain !important;
    scrollbar-width: thin !important;
    border: 1px solid #c5d8e6 !important;
    border-radius: 11px !important;
    background: #fff !important;
    box-shadow: 0 18px 42px rgba(26, 57, 82, .17) !important;
}

html body.cx-design-system .conexgo-profile-icon-picker__option {
    position: relative !important;
    min-width: 0 !important;
    min-height: 76px !important;
    padding: 7px 5px !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 5px !important;
    border: 1px solid #d7e3ec !important;
    border-radius: 9px !important;
    background: #fbfdff !important;
    color: #47637a !important;
    font-size: 10.5px !important;
    font-weight: 650 !important;
    text-align: center !important;
}

html body.cx-design-system .conexgo-profile-icon-picker__option:hover {
    border-color: #aac6da !important;
    background: #f1f7fb !important;
    color: #2d5878 !important;
}

html body.cx-design-system .conexgo-profile-icon-picker__option.is-selected {
    border-color: #6f9dbe !important;
    background: #eaf3f9 !important;
    box-shadow: inset 0 0 0 1px rgba(76, 127, 165, .12) !important;
}

html body.cx-design-system .conexgo-profile-icon-picker__option img,
html body.cx-design-system .conexgo-profile-icon-picker__option-none {
    width: 38px !important;
    height: 38px !important;
    object-fit: contain !important;
}

html body.cx-design-system .conexgo-profile-icon-picker__check {
    position: absolute !important;
    top: 5px !important;
    right: 5px !important;
    width: 18px !important;
    height: 18px !important;
    display: grid !important;
    place-items: center !important;
    border-radius: 999px !important;
    background: #3f7297 !important;
    color: #fff !important;
    font-size: 9px !important;
}

html body.cx-design-system .conexgo-account-profile,
html body.cx-design-system .conexgo-account-profile .card-body,
html body.cx-design-system .conexgo-account-profile .panel,
html body.cx-design-system .conexgo-account-profile .panel-body,
html body.cx-design-system .conexgo-account-profile .tab-content,
html body.cx-design-system .conexgo-account-profile .tab-pane.active {
    overflow: visible !important;
}

html body.cx-design-system .app-header-modern .nt-clock-card {
    width: auto !important;
    max-width: 390px !important;
    min-width: 0 !important;
    padding: 6px 10px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 9px !important;
    border: 1px solid #d7e4ed !important;
    border-radius: 10px !important;
    background: #fff !important;
    box-shadow: 0 2px 8px rgba(30, 64, 91, .045) !important;
}

html body.cx-design-system .app-header-modern .nt-clock-list {
    margin: 0 !important;
    padding: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    list-style: none !important;
}

html body.cx-design-system .app-header-modern .nt-date {
    gap: 6px !important;
    padding-right: 9px !important;
    border-right: 1px solid #e0e9ef !important;
    color: #45647e !important;
}

html body.cx-design-system .app-header-modern .nt-date-icon,
html body.cx-design-system .app-header-modern .nt-time-icon {
    width: 18px !important;
    min-width: 18px !important;
    display: inline-grid !important;
    place-items: center !important;
    color: #3f739a !important;
}

html body.cx-design-system .app-header-modern .nt-date-text {
    color: #45647e !important;
    font-size: 11.5px !important;
    font-weight: 650 !important;
    white-space: nowrap !important;
}

html body.cx-design-system .app-header-modern .nt-clock {
    gap: 0 !important;
    padding: 3px 6px !important;
    border-radius: 8px !important;
    background: #f5f9fc !important;
    color: #294d69 !important;
    font-variant-numeric: tabular-nums !important;
}

html body.cx-design-system .app-header-modern .nt-clock-value {
    min-width: 1.45em !important;
    padding: 0 !important;
    color: #294d69 !important;
    font-size: 12px !important;
    font-weight: 720 !important;
    line-height: 1 !important;
    text-align: center !important;
    font-variant-numeric: tabular-nums !important;
}

html body.cx-design-system .app-header-modern .nt-clock-separator {
    width: auto !important;
    min-width: 0 !important;
    margin: 0 1px !important;
    color: #7790a4 !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
}

html body.cx-design-system .app-header-modern .nt-seconds {
    color: #71899c !important;
    font-size: 10px !important;
    font-weight: 650 !important;
}

html body.cx-design-system .app-header-modern .nt-meridiem {
    margin-left: 5px !important;
    padding: 2px 4px !important;
    border-radius: 5px !important;
    background: #eaf2f7 !important;
    color: #52748e !important;
    font-size: 8.5px !important;
    font-weight: 750 !important;
    line-height: 1 !important;
    letter-spacing: .035em !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid > .conexgo-dashboard-smart-item:has(> .conexgo-dashboard-card-closing),
html body.cx-design-system .conexgo-dashboard-configuration-row :has(> .conexgo-dashboard-card-closing) {
    height: auto !important;
    min-height: 48px !important;
    max-height: none !important;
    overflow: hidden !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .conexgo-dashboard-card-closing,
html body.cx-design-system .conexgo-dashboard-configuration-card.conexgo-dashboard-card-closing {
    height: auto !important;
    min-height: 48px !important;
    max-height: none !important;
    overflow: hidden !important;
    resize: none !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .conexgo-dashboard-card-closing > .card-body,
html body.cx-design-system .conexgo-dashboard-configuration-card.conexgo-dashboard-card-closing > .card-body {
    display: block !important;
    overflow: hidden !important;
    transform-origin: top !important;
    animation: cx-r18-72-dashboard-close 240ms cubic-bezier(.4, 0, .2, 1) both !important;
    pointer-events: none !important;
}

html body.cx-design-system #conexgoDashboardSmartGrid .conexgo-dashboard-resizable-card:not(.conexgo-dashboard-minimized-card):not(.conexgo-dashboard-card-closing) > .card-body,
html body.cx-design-system .conexgo-dashboard-configuration-card:not(.conexgo-dashboard-minimized-card):not(.conexgo-dashboard-card-closing) > .card-body {
    animation: cx-r18-72-dashboard-open 200ms cubic-bezier(.2, .7, .2, 1) both;
}

html body.cx-design-system .conexgo-dashboard-chevron {
    transition: transform 220ms cubic-bezier(.2, .7, .2, 1), color 160ms ease, opacity 160ms ease !important;
}

@keyframes cx-r18-72-dashboard-close {
    0% { opacity: 1; transform: translateY(0) scaleY(1); max-height: 900px; }
    100% { opacity: 0; transform: translateY(-5px) scaleY(.94); max-height: 0; padding-top: 0; padding-bottom: 0; margin-top: 0; margin-bottom: 0; }
}

@keyframes cx-r18-72-dashboard-open {
    0% { opacity: 0; transform: translateY(-4px); }
    100% { opacity: 1; transform: translateY(0); }
}

html body.cx-design-system .account-list-table-shell {
    overflow-x: auto !important;
    overflow-y: visible !important;
    scrollbar-width: thin !important;
    scrollbar-color: #aec0cd transparent !important;
}

html body.cx-design-system .account-list-table-shell::-webkit-scrollbar {
    height: 7px !important;
}

html body.cx-design-system .account-list-table-shell::-webkit-scrollbar-thumb {
    border-radius: 999px !important;
    background: #aec0cd !important;
}

html body.cx-design-system .account-list-table-shell::-webkit-scrollbar-track {
    background: transparent !important;
}

html body.cx-design-system .account-list-row > td {
    vertical-align: top !important;
}

@media (min-width: 1200px) {
    html body.cx-design-system .account-list-table-shell table,
    html body.cx-design-system .account-list-table-shell .conexgo-pagedlist-table {
        width: 100% !important;
        min-width: 0 !important;
        table-layout: auto !important;
    }

    html body.cx-design-system .account-list-cell-name {
        width: clamp(230px, 27vw, 330px) !important;
        min-width: 230px !important;
        max-width: 330px !important;
    }

    html body.cx-design-system .account-list-cell-contact {
        width: auto !important;
        min-width: 210px !important;
    }

    html body.cx-design-system .account-list-cell-devices {
        width: 210px !important;
        min-width: 165px !important;
    }

    html body.cx-design-system .account-list-cell-comment {
        width: auto !important;
        min-width: 110px !important;
    }
}

html body.cx-design-system .cx-data-log-popover-content--generic,
html body.cx-design-system .cx-data-log-popover-content--raw {
    width: 100% !important;
    min-width: 0 !important;
}

html body.cx-design-system .cx-data-log-popover-content--generic .cx-data-log-section-body {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 0 !important;
}

html body.cx-design-system .cx-data-log-popover-row {
    min-height: 31px !important;
    padding: 5px 7px !important;
    display: grid !important;
    grid-template-columns: minmax(120px, .42fr) minmax(0, .58fr) !important;
    align-items: start !important;
    gap: 10px !important;
    border-bottom: 1px solid #edf2f6 !important;
}

html body.cx-design-system .cx-data-log-popover-row:last-child {
    border-bottom: 0 !important;
}

html body.cx-design-system .cx-data-log-popover-key {
    color: #617a8f !important;
    font-size: 10.5px !important;
    font-weight: 700 !important;
    text-align: left !important;
}

html body.cx-design-system .cx-data-log-popover-value {
    min-width: 0 !important;
    color: #294b68 !important;
    font-size: 11px !important;
    font-weight: 590 !important;
    text-align: left !important;
    overflow-wrap: anywhere !important;
}

html body.cx-design-system .cx-data-log-raw-toggle {
    margin-top: 8px !important;
    border-top: 1px solid #e5edf3 !important;
}

html body.cx-design-system .cx-data-log-raw-toggle > summary {
    padding-top: 7px !important;
    color: #55758e !important;
    font-size: 10.5px !important;
    font-weight: 700 !important;
    cursor: pointer !important;
}

html body.cx-design-system .cx-data-log-raw-toggle > pre {
    max-height: 180px !important;
    margin: 7px 0 0 !important;
    padding: 8px !important;
    overflow: auto !important;
    border: 1px solid #e1eaf0 !important;
    border-radius: 7px !important;
    background: #f7fafc !important;
    color: #415c72 !important;
    font-size: 9.5px !important;
    line-height: 1.35 !important;
    white-space: pre-wrap !important;
    overflow-wrap: anywhere !important;
}

html body.cx-design-system :is(.device-list-action-menu, .conexgo-row-action-menu) .dropdown-item {
    justify-content: flex-start !important;
    text-align: left !important;
}

@media (max-width: 767.98px) {
    html body.cx-design-system .mud-dialog.cx-r18-72-security-dialog {
        width: calc(100vw - 18px) !important;
        max-width: none !important;
    }

    html body.cx-design-system .mud-dialog.cx-r18-72-security-dialog .cx-r1-form-row {
        align-items: stretch !important;
    }

    html body.cx-design-system .mud-dialog.cx-r18-72-security-dialog .cx-r1-form-row > .form-label,
    html body.cx-design-system .mud-dialog.cx-r18-72-security-dialog .cx-r1-form-row > [class*="col-"] {
        width: 100% !important;
        max-width: 100% !important;
        flex: 0 0 100% !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
        text-align: left !important;
    }

    html body.cx-design-system .mud-dialog.cx-r18-72-security-dialog .cx-r1-form-row > .form-label {
        margin-bottom: 4px !important;
    }

    html body.cx-design-system .conexgo-profile-icon-picker__panel {
        grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
        gap: 5px !important;
        padding: 6px !important;
    }

    html body.cx-design-system .conexgo-profile-icon-picker__option {
        min-height: 66px !important;
        padding: 5px 3px !important;
        font-size: 9px !important;
    }

    html body.cx-design-system .conexgo-profile-icon-picker__option img,
    html body.cx-design-system .conexgo-profile-icon-picker__option-none {
        width: 32px !important;
        height: 32px !important;
    }

    html body.cx-design-system .app-header-modern .nt-clock-card {
        max-width: 100% !important;
        gap: 6px !important;
        padding-inline: 7px !important;
    }

    html body.cx-design-system .app-header-modern .nt-date-text {
        font-size: 10.5px !important;
    }

    html body.cx-design-system .cx-data-log-popover-row {
        grid-template-columns: 1fr !important;
        gap: 2px !important;
    }
}

html body.cx-design-system
.account-list-cell-name
.conexgo-row-action-group {
    align-items: stretch !important;
}

html body.cx-design-system
.account-list-cell-name
.account-list-name-button,
html body.cx-design-system
.account-list-cell-name
.account-list-name-button:hover,
html body.cx-design-system
.account-list-cell-name
.account-list-name-button:focus,
html body.cx-design-system
.account-list-cell-name
.account-list-name-button:focus-visible,
html body.cx-design-system
.account-list-cell-name
.account-list-name-button:active {
    min-width: 0 !important;
    min-height: 42px !important;
    height: 42px !important;
    flex: 1 1 auto !important;

    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;

    padding: 0 12px !important;
    margin: 0 !important;

    color: #274966 !important;
    background: #ffffff !important;

    text-align: left !important;
    text-indent: 0 !important;
    vertical-align: middle !important;

    font-size: 13.5px !important;
    font-weight: 720 !important;
    line-height: 1.2 !important;

    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;

    box-shadow: none !important;
    transform: none !important;
}

html body.cx-design-system
.account-list-cell-name
.conexgo-row-action-toggle,
html body.cx-design-system
.account-list-cell-name
.conexgo-row-action-toggle:hover,
html body.cx-design-system
.account-list-cell-name
.conexgo-row-action-toggle:focus,
html body.cx-design-system
.account-list-cell-name
.conexgo-row-action-toggle:focus-visible,
html body.cx-design-system
.account-list-cell-name
.conexgo-row-action-toggle:active,
html body.cx-design-system
.account-list-cell-name
.conexgo-row-action-toggle[aria-expanded="true"] {
    width: 42px !important;
    min-width: 42px !important;
    max-width: 42px !important;
    height: 42px !important;
    min-height: 42px !important;

    flex: 0 0 42px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    padding: 0 !important;
    margin: 0 !important;
}

html body.cx-design-system
.conexgo-account-profile
.conexgo-account-profile-form {
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
}

html body.cx-design-system
.conexgo-account-profile
.conexgo-account-profile-form
> .row:not(.justify-content-end) {
    margin-top: 0 !important;
    margin-bottom: 12px !important;
    align-items: center !important;
}

html body.cx-design-system
.conexgo-account-profile
.conexgo-account-profile-form
> .row:not(.justify-content-end):last-of-type {
    margin-bottom: 0 !important;
}

html body.cx-design-system
.conexgo-account-profile
.conexgo-account-profile-form
+ .conexgo-account-profile-form {
    margin-top: 12px !important;
}

html body.cx-design-system
.conexgo-account-profile
.conexgo-account-profile-form
.form-control,
html body.cx-design-system
.conexgo-account-profile
.conexgo-account-profile-form
.cx-custom-select-trigger {
    min-height: 42px !important;
    height: 42px !important;
}

html body.cx-design-system
.conexgo-account-profile
.conexgo-account-profile-label {
    margin: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
}

html body.cx-design-system
.conexgo-account-profile
.conexgo-account-profile-label
> label {
    margin: 0 !important;
    line-height: 1.25 !important;
}

html body.cx-design-system
.conexgo-account-profile
.conexgo-profile-icon-picker {
    position: relative !important;
    z-index: 2300 !important;
    overflow: visible !important;
}

html body.cx-design-system
.conexgo-account-profile
.conexgo-profile-icon-picker__panel {
    position: absolute !important;

    top: auto !important;
    bottom: calc(100% + 8px) !important;

    left: 0 !important;
    right: 0 !important;

    width: 100% !important;
    max-width: none !important;
    max-height: 218px !important;

    margin: 0 !important;
    padding: 8px !important;

    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 7px !important;

    overflow-x: hidden !important;
    overflow-y: auto !important;
    overscroll-behavior: contain !important;
    scrollbar-width: thin !important;

    border: 1px solid #c5d8e6 !important;
    border-radius: 11px !important;
    background: #ffffff !important;
    box-shadow: 0 -16px 38px rgba(29, 59, 82, .16) !important;

    z-index: 2400 !important;
    transform-origin: bottom center !important;
}

html body.cx-design-system
.conexgo-account-profile
.conexgo-profile-icon-picker__option {
    min-height: 72px !important;
    padding: 6px 5px !important;
}

html body.cx-design-system
.conexgo-account-profile
:is(
    .card,
    .card-body,
    .panel,
    .panel-body,
    .tabs-menu-body,
    .tab-content,
    .tab-pane,
    .tab-pane.active,
    .conexgo-account-profile-form,
    .row,
    [class*="col-"]
) {
    overflow: visible !important;
}

html body.cx-design-system
.conexgo-account-profile
.conexgo-profile-icon-picker__panel {
    overflow-y: auto !important;
}

html body.cx-design-system
tr:has(
    .device-list-action-menu.show,
    .conexgo-row-action-menu.show
) {
    position: relative !important;
    z-index: 3100 !important;
}

html body.cx-design-system
td:has(
    .device-list-action-menu.show,
    .conexgo-row-action-menu.show
) {
    position: relative !important;
    z-index: 3200 !important;
    overflow: visible !important;
}

html body.cx-design-system
:is(
    .device-list-action-group,
    .conexgo-row-action-group
):has(
    .device-list-action-menu.show,
    .conexgo-row-action-menu.show
) {
    position: relative !important;
    z-index: 3300 !important;
    isolation: isolate !important;
}

html body.cx-design-system
:is(
    .device-list-action-menu,
    .conexgo-row-action-menu
).show {
    z-index: 3400 !important;

    min-width: 100% !important;
    max-width: min(360px, calc(100vw - 32px)) !important;
    max-height: min(
        var(--cx-r64-row-menu-max-height, 360px),
        calc(100vh - 150px)
    ) !important;

    padding: 5px !important;

    overflow-x: hidden !important;
    overflow-y: auto !important;
    overscroll-behavior: contain !important;
    scrollbar-width: thin !important;

    border: 1px solid #c6d7e4 !important;
    border-radius: 10px !important;

    background: #ffffff !important;
    box-shadow: 0 16px 36px rgba(28, 58, 82, .17) !important;
}

html body.cx-design-system
:is(
    .device-list-action-menu,
    .conexgo-row-action-menu
).show
> li {
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
}

html body.cx-design-system
:is(
    .device-list-action-menu,
    .conexgo-row-action-menu
).show
.dropdown-item {
    width: 100% !important;
    min-width: 0 !important;
    min-height: 34px !important;

    margin: 0 !important;
    padding: 6px 8px !important;

    display: flex !important;
    flex-flow: row nowrap !important;
    align-items: center !important;
    justify-content: flex-start !important;

    gap: 8px !important;

    color: #294b68 !important;
    background: transparent !important;

    font-size: 12px !important;
    font-weight: 620 !important;
    line-height: 1.2 !important;

    text-align: left !important;
    white-space: normal !important;

    border-radius: 7px !important;
}

html body.cx-design-system
:is(
    .device-list-action-menu,
    .conexgo-row-action-menu
).show
.dropdown-item:hover,
html body.cx-design-system
:is(
    .device-list-action-menu,
    .conexgo-row-action-menu
).show
.dropdown-item:focus {
    color: #244963 !important;
    background: #f0f6fa !important;
}

html body.cx-design-system
:is(
    .device-list-action-menu,
    .conexgo-row-action-menu
).show
.dropdown-item
> :is(
    .fa,
    .fas,
    .far,
    .fa-solid,
    .fa-regular
) {
    width: 18px !important;
    min-width: 18px !important;
    flex: 0 0 18px !important;

    margin: 0 !important;
    padding: 0 !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    color: #5b82a1 !important;
    text-align: center !important;
}

html body.cx-design-system
:is(
    .device-list-action-menu,
    .conexgo-row-action-menu
).show
.divider {
    height: 1px !important;
    min-height: 1px !important;
    margin: 4px 5px !important;
    background: #e2ebf1 !important;
}

html body.cx-design-system
.table-responsive:has(
    .device-list-action-menu.show,
    .conexgo-row-action-menu.show
) {
    overflow: visible !important;
}

html body.cx-design-system
.table-responsive:not(:has(
    .device-list-action-menu.show,
    .conexgo-row-action-menu.show
)) {
    overflow-x: auto;
}

@media (max-width: 767.98px) {
    html body.cx-design-system
    .conexgo-account-profile
    .conexgo-account-profile-form
    > .row:not(.justify-content-end) {
        margin-bottom: 10px !important;
    }

    html body.cx-design-system
    .conexgo-account-profile
    .conexgo-account-profile-label {
        justify-content: flex-start !important;
        margin-bottom: 4px !important;
    }

    html body.cx-design-system
    .conexgo-account-profile
    .conexgo-profile-icon-picker__panel {
        bottom: calc(100% + 6px) !important;
        grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
        max-height: 190px !important;
        padding: 6px !important;
        gap: 5px !important;
    }

    html body.cx-design-system
    :is(
        .device-list-action-menu,
        .conexgo-row-action-menu
    ).show {
        max-width: min(330px, calc(100vw - 20px)) !important;
    }
}

html body.cx-design-system #conexgo-page-content {
    --cx-content-link: #356b92;
    --cx-content-link-hover: #234f70;
    --cx-content-link-focus: #2d6288;
    --cx-content-link-underline: rgba(53, 107, 146, .38);
    --cx-content-link-underline-hover: rgba(35, 79, 112, .72);
}

html body.cx-design-system #conexgo-page-content
a[href]:not(.btn):not(.nav-link):not([data-bs-toggle="tab"]):not([data-toggle="tab"]):not(.dropdown-item):not(.page-link):not(.cx-page-action):not(.conexgo-dashboard-view-all-link):not(.device-list-name-button):not(.account-list-name-button):not(.conexgo-row-action-toggle):not(.device-list-action-toggle):not(.device-config-toolbar-link):not(.active):not(.cx-support-hub__card):not(.cx-logs-hub__card) {
    color: var(--cx-content-link) !important;
    font-weight: 590 !important;
    text-decoration-line: underline !important;
    text-decoration-color: var(--cx-content-link-underline) !important;
    text-decoration-thickness: 1px !important;
    text-underline-offset: 2.5px !important;
    text-decoration-skip-ink: auto !important;
    transition:
        color 150ms ease,
        text-decoration-color 150ms ease,
        text-decoration-thickness 150ms ease !important;
}

html body.cx-design-system #conexgo-page-content
a[href]:not(.btn):not(.nav-link):not([data-bs-toggle="tab"]):not([data-toggle="tab"]):not(.dropdown-item):not(.page-link):not(.cx-page-action):not(.conexgo-dashboard-view-all-link):not(.device-list-name-button):not(.account-list-name-button):not(.conexgo-row-action-toggle):not(.device-list-action-toggle):not(.device-config-toolbar-link):not(.active):not(.cx-support-hub__card):not(.cx-logs-hub__card):visited {
    color: var(--cx-content-link) !important;
}

html body.cx-design-system #conexgo-page-content
a[href]:not(.btn):not(.nav-link):not([data-bs-toggle="tab"]):not([data-toggle="tab"]):not(.dropdown-item):not(.page-link):not(.cx-page-action):not(.conexgo-dashboard-view-all-link):not(.device-list-name-button):not(.account-list-name-button):not(.conexgo-row-action-toggle):not(.device-list-action-toggle):not(.device-config-toolbar-link):not(.active):not(.cx-support-hub__card):not(.cx-logs-hub__card):hover {
    color: var(--cx-content-link-hover) !important;
    text-decoration-color: var(--cx-content-link-underline-hover) !important;
    text-decoration-thickness: 1.5px !important;
}

html body.cx-design-system #conexgo-page-content
a[href]:not(.btn):not(.nav-link):not([data-bs-toggle="tab"]):not([data-toggle="tab"]):not(.dropdown-item):not(.page-link):not(.cx-page-action):not(.conexgo-dashboard-view-all-link):not(.device-list-name-button):not(.account-list-name-button):not(.conexgo-row-action-toggle):not(.device-list-action-toggle):not(.device-config-toolbar-link):not(.active):not(.cx-support-hub__card):not(.cx-logs-hub__card):focus-visible {
    color: var(--cx-content-link-focus) !important;
    text-decoration-color: currentColor !important;
    text-decoration-thickness: 1.5px !important;
    outline: 2px solid rgba(53, 107, 146, .42) !important;
    outline-offset: 3px !important;
    border-radius: 3px !important;
}

html body.cx-design-system #conexgo-page-content
:is(
    .table,
    table,
    .dataTable,
    .dataTables_wrapper
)
a[href]:not(.btn):not(.dropdown-item):not(.page-link) {
    color: #2f668f !important;
    font-weight: 620 !important;
    text-decoration-color: rgba(47, 102, 143, .42) !important;
    overflow-wrap: anywhere !important;
}

html body.cx-design-system #conexgo-page-content
:is(
    .table,
    table,
    .dataTable,
    .dataTables_wrapper
)
a[href]:not(.btn):not(.dropdown-item):not(.page-link):hover {
    color: #214d6e !important;
    text-decoration-color: rgba(33, 77, 110, .80) !important;
}

html body.cx-design-system #conexgo-page-content
.breadcrumb a[href] {
    color: #4b6f89 !important;
    font-weight: 580 !important;
    text-decoration-color: rgba(75, 111, 137, .30) !important;
}

html body.cx-design-system #conexgo-page-content
.breadcrumb a[href]:hover {
    color: #2e5d7f !important;
    text-decoration-color: rgba(46, 93, 127, .68) !important;
}

html body.cx-design-system {
    --cx-r18741-control-height: 44px;
    --cx-r18741-control-radius: 10px;
    --cx-r18741-control-border: #c7d9e6;
    --cx-r18741-control-border-hover: #acc7d9;
    --cx-r18741-control-bg: #fbfdff;
    --cx-r18741-control-bg-hover: #f7fafc;
    --cx-r18741-control-text: #294b68;
}

html body.cx-design-system
:is(
    .cx-custom-select-trigger,
    .cx-control-select,
    select.form-select
) {
    min-height: var(--cx-r18741-control-height) !important;
    height: var(--cx-r18741-control-height) !important;
    border: 1px solid var(--cx-r18741-control-border) !important;
    border-radius: var(--cx-r18741-control-radius) !important;
    background: var(--cx-r18741-control-bg) !important;
    color: var(--cx-r18741-control-text) !important;
    box-shadow: 0 1px 2px rgba(31, 65, 91, .025) !important;
    font-size: 14px !important;
    font-weight: 620 !important;
    line-height: 1.2 !important;
    transform: none !important;
    transition:
        border-color 140ms ease,
        background-color 140ms ease,
        box-shadow 140ms ease,
        color 140ms ease !important;
}

html body.cx-design-system
.cx-custom-select-trigger {
    padding: 4px 5px 4px 12px !important;
    grid-template-columns: minmax(0, 1fr) 34px !important;
    column-gap: 7px !important;
    text-align: left !important;
}

html body.cx-design-system
.cx-custom-select-trigger:has(.cx-custom-select-leading-icon) {
    grid-template-columns: 25px minmax(0, 1fr) 34px !important;
}

html body.cx-design-system
.cx-custom-select-value {
    min-width: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    color: #294b68 !important;
    font-size: 14px !important;
    font-weight: 620 !important;
    text-align: left !important;
}

html body.cx-design-system
.cx-custom-select-placeholder {
    color: #7b8fa1 !important;
    font-weight: 540 !important;
}

html body.cx-design-system
.cx-custom-select-chevron {
    width: 34px !important;
    min-width: 34px !important;
    height: 34px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border: 1px solid #d4e2eb !important;
    border-radius: 8px !important;
    background: #eef5f9 !important;
    color: #315f82 !important;
    box-shadow: none !important;
    transition:
        border-color 140ms ease,
        background-color 140ms ease,
        color 140ms ease !important;
}

html body.cx-design-system
:is(
    .cx-custom-select-trigger,
    select.form-select
):hover:not(:disabled) {
    border-color: var(--cx-r18741-control-border-hover) !important;
    background: var(--cx-r18741-control-bg-hover) !important;
    color: #244963 !important;
    box-shadow: 0 3px 10px rgba(38, 79, 108, .05) !important;
    transform: none !important;
}

html body.cx-design-system
.cx-custom-select-trigger:hover:not(:disabled)
.cx-custom-select-chevron {
    border-color: #c6d9e6 !important;
    background: #e9f2f7 !important;
    color: #2c5979 !important;
}

html body.cx-design-system
.cx-custom-select-trigger:is(
    .is-open,
    [data-cx-open="True"],
    [data-cx-open="true"],
    :focus-visible
),
html body.cx-design-system
select.form-select:focus {
    border-color: #7ea7c4 !important;
    background: #ffffff !important;
    box-shadow: 0 0 0 3px rgba(70, 119, 155, .10) !important;
    outline: none !important;
}

html body.cx-design-system
.cx-custom-select-trigger:is(
    .is-open,
    [data-cx-open="True"],
    [data-cx-open="true"]
)
.cx-custom-select-chevron {
    border-color: #b8cfdf !important;
    background: #e4eff6 !important;
    color: #244f70 !important;
}

html body.cx-design-system
.cx-custom-select-chevron > i {
    font-size: 12px !important;
    transition: transform 160ms ease !important;
}

html body.cx-design-system
.cx-custom-select-trigger:is(
    .is-open,
    [data-cx-open="True"],
    [data-cx-open="true"]
)
.cx-custom-select-chevron > i {
    transform: rotate(180deg) !important;
}

html body.cx-design-system
.cx-paged-list
:is(
    .conexgo-pagedlist-size-select,
    .conexgo-pagedlist-range-select
)
.cx-custom-select-trigger,
html body.cx-design-system
.cx-paged-list
.conexgo-pagedlist-pagination
.page-link {
    min-height: var(--cx-r18741-control-height) !important;
    height: var(--cx-r18741-control-height) !important;
}

html body.cx-design-system
:is(
    .cx-custom-select-menu--top-layer[popover],
    .cx-custom-select-menu[data-cx-select-owner]
) {
    padding: 5px !important;
    border: 1px solid #c9d9e5 !important;
    border-radius: 10px !important;
    background: #ffffff !important;
    box-shadow: 0 14px 32px rgba(29, 59, 82, .12) !important;
}

html body.cx-design-system
:is(
    .cx-custom-select-menu--top-layer[popover],
    .cx-custom-select-menu[data-cx-select-owner]
)
.cx-custom-select-option {
    min-height: 37px !important;
    padding: 7px 9px !important;
    border: 1px solid transparent !important;
    border-radius: 7px !important;
    background: transparent !important;
    color: #34536c !important;
    font-size: 14px !important;
    font-weight: 590 !important;
    line-height: 1.25 !important;
    text-align: left !important;
    transform: none !important;
    transition:
        background-color 120ms ease,
        border-color 120ms ease,
        color 120ms ease !important;
}

html body.cx-design-system
.cx-custom-select-option-label {
    min-width: 0 !important;
    flex: 1 1 auto !important;
    text-align: left !important;
}

html body.cx-design-system
:is(
    .cx-custom-select-menu--top-layer[popover],
    .cx-custom-select-menu[data-cx-select-owner]
)
.cx-custom-select-option:hover:not(:disabled),
html body.cx-design-system
:is(
    .cx-custom-select-menu--top-layer[popover],
    .cx-custom-select-menu[data-cx-select-owner]
)
.cx-custom-select-option.is-active {
    border-color: #e2ebf1 !important;
    background: #f4f8fb !important;
    color: #284d68 !important;
}

html body.cx-design-system
:is(
    .cx-custom-select-menu--top-layer[popover],
    .cx-custom-select-menu[data-cx-select-owner]
)
.cx-custom-select-option.is-selected {
    border-color: #d6e4ed !important;
    background: #edf5f9 !important;
    color: #234c69 !important;
    font-weight: 680 !important;
}

html body.cx-design-system
:is(
    table,
    .conexgo-pagedlist-table
)
.dropdown-menu
.dropdown-item,
html body.cx-design-system
:is(
    .device-list-action-menu,
    .conexgo-row-action-menu
)
.dropdown-item {
    min-height: 38px !important;
    padding: 7px 9px !important;
    gap: 9px !important;
    border: 1px solid transparent !important;
    border-radius: 7px !important;
    background: transparent !important;
    color: #2e506c !important;
    font-size: 14px !important;
    font-weight: 620 !important;
    line-height: 1.28 !important;
    text-align: left !important;
    text-decoration: none !important;
    transform: none !important;
    transition:
        background-color 120ms ease,
        border-color 120ms ease,
        color 120ms ease !important;
}

html body.cx-design-system
:is(
    table,
    .conexgo-pagedlist-table
)
.dropdown-menu
.dropdown-item:hover,
html body.cx-design-system
:is(
    table,
    .conexgo-pagedlist-table
)
.dropdown-menu
.dropdown-item:focus-visible,
html body.cx-design-system
:is(
    .device-list-action-menu,
    .conexgo-row-action-menu
)
.dropdown-item:hover,
html body.cx-design-system
:is(
    .device-list-action-menu,
    .conexgo-row-action-menu
)
.dropdown-item:focus-visible {
    border-color: #e1eaf0 !important;
    background: #f4f8fb !important;
    color: #244963 !important;
    outline: none !important;
    box-shadow: none !important;
}

html body.cx-design-system
:is(
    table,
    .conexgo-pagedlist-table,
    .device-list-action-menu,
    .conexgo-row-action-menu
)
.dropdown-item
> :is(
    i,
    .fa,
    .fas,
    .far,
    .fa-solid,
    .fa-regular,
    span[class*="fa"]
) {
    width: 19px !important;
    min-width: 19px !important;
    flex: 0 0 19px !important;
    margin: 0 !important;
    padding: 0 !important;
    color: #5a809e !important;
    font-size: 13.5px !important;
    text-align: center !important;
}

html body.cx-design-system
:is(
    .device-list-name-button,
    .account-list-name-button
):hover {
    background: #f8fbfd !important;
    color: #244963 !important;
    box-shadow: inset 0 0 0 1px rgba(100, 143, 174, .04) !important;
    transform: none !important;
}

html body.cx-design-system
:is(
    .device-list-action-toggle,
    .conexgo-row-action-toggle
):hover {
    background: #3a688a !important;
    color: #ffffff !important;
    filter: none !important;
    transform: none !important;
}

html body.cx-design-system {
    --cx-r1875-header-bg: #edf8f3;
    --cx-r1875-header-bg-hover: #e8f4ef;
    --cx-r1875-header-border: #d6e7df;
    --cx-r1875-header-text: #294a65;
    --cx-r1875-header-muted: #748896;
    --cx-r1875-icon-bg: #f8fbfd;
    --cx-r1875-icon-border: #d0e0ea;
    --cx-r1875-icon-text: #4b7595;
}

html body.cx-design-system
.cx-table-header-row,
html body.cx-design-system
.conexgo-pagedlist-table thead tr,
html body.cx-design-system
.cx-native-table thead tr {
    background: var(--cx-r1875-header-bg) !important;
}

html body.cx-design-system
th.cx-table-column-header {
    position: relative !important;
    padding: 0 !important;
    vertical-align: middle !important;
    border-top: 0 !important;
    border-bottom: 1px solid var(--cx-r1875-header-border) !important;
    background: var(--cx-r1875-header-bg) !important;
    color: var(--cx-r1875-header-text) !important;
    user-select: none !important;
}

html body.cx-design-system
th.cx-table-column-header::before,
html body.cx-design-system
th.cx-table-column-header::after {
    content: none !important;
    display: none !important;
}

html body.cx-design-system
.cx-table-column-header__layout {
    min-height: 50px !important;
    width: 100% !important;
    min-width: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 9px !important;
    padding: 9px 11px !important;
}

html body.cx-design-system
.cx-table-column-header__icon {
    width: 28px !important;
    min-width: 28px !important;
    height: 28px !important;
    flex: 0 0 28px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 1px solid var(--cx-r1875-icon-border) !important;
    border-radius: 8px !important;
    background: var(--cx-r1875-icon-bg) !important;
    color: var(--cx-r1875-icon-text) !important;
    box-shadow: 0 1px 2px rgba(31, 65, 91, .035) !important;
    pointer-events: none !important;
    transition:
        background-color 140ms ease,
        border-color 140ms ease,
        color 140ms ease,
        box-shadow 140ms ease !important;
}

html body.cx-design-system
.cx-table-column-header__icon > i {
    display: inline-block !important;
    margin: 0 !important;
    padding: 0 !important;
    color: inherit !important;
    font-size: 12px !important;
    line-height: 1 !important;
}

html body.cx-design-system
.cx-table-column-header__copy {
    min-width: 0 !important;
    display: flex !important;
    flex: 0 1 auto !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    justify-content: center !important;
    gap: 2px !important;
}

html body.cx-design-system
.cx-table-column-header__label {
    display: block !important;
    color: var(--cx-r1875-header-text) !important;
    font-size: 12.5px !important;
    font-weight: 760 !important;
    line-height: 1.18 !important;
    letter-spacing: .012em !important;
    text-transform: uppercase !important;
    white-space: nowrap !important;
    word-break: normal !important;
    overflow-wrap: normal !important;
}

html body.cx-design-system
.cx-table-column-header__description {
    display: block !important;
    max-width: 260px !important;
    color: var(--cx-r1875-header-muted) !important;
    font-size: 10.5px !important;
    font-weight: 520 !important;
    line-height: 1.25 !important;
    text-transform: none !important;
    white-space: normal !important;
    overflow-wrap: normal !important;
}

html body.cx-design-system
.cx-table-column-header__sort {
    width: 18px !important;
    min-width: 18px !important;
    height: 24px !important;
    flex: 0 0 18px !important;
    margin-left: auto !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    color: #91a7b5 !important;
    font-size: 9.5px !important;
    pointer-events: none !important;
}

html body.cx-design-system
th.cx-table-column-header--sortable {
    cursor: pointer !important;
}

html body.cx-design-system
th.cx-table-column-header--sortable:hover {
    background: var(--cx-r1875-header-bg-hover) !important;
}

html body.cx-design-system
th.cx-table-column-header--sortable:hover
.cx-table-column-header__icon {
    border-color: #bfd4e1 !important;
    background: #f4f9fc !important;
    color: #356989 !important;
    box-shadow: 0 2px 6px rgba(34, 77, 107, .065) !important;
}

html body.cx-design-system
th.cx-table-column-header--sortable:focus-visible {
    outline: 2px solid rgba(74, 120, 154, .38) !important;
    outline-offset: -2px !important;
}

html body.cx-design-system
th.cx-table-column-header.sorting_asc,
html body.cx-design-system
th.cx-table-column-header.sorting_desc {
    background: #e6f3ee !important;
}

html body.cx-design-system
th.cx-table-column-header.sorting_asc
.cx-table-column-header__sort,
html body.cx-design-system
th.cx-table-column-header.sorting_desc
.cx-table-column-header__sort {
    color: #356989 !important;
}

html body.cx-design-system
th.cx-table-column-header--align-center
.cx-table-column-header__layout {
    justify-content: center !important;
}

html body.cx-design-system
th.cx-table-column-header--align-center
.cx-table-column-header__copy {
    align-items: center !important;
    text-align: center !important;
}

html body.cx-design-system
th.cx-table-column-header--align-center
.cx-table-column-header__sort {
    margin-left: 0 !important;
}

html body.cx-design-system
th.cx-table-column-header--align-right
.cx-table-column-header__layout {
    justify-content: flex-end !important;
}

html body.cx-design-system
th.cx-table-column-header--align-right
.cx-table-column-header__copy {
    align-items: flex-end !important;
    text-align: right !important;
}

html body.cx-design-system th.cx-table-column-header--action { min-width: 122px !important; }
html body.cx-design-system th.cx-table-column-header--alert { min-width: 148px !important; }
html body.cx-design-system th.cx-table-column-header--datetime { min-width: 168px !important; }
html body.cx-design-system th.cx-table-column-header--device { min-width: 225px !important; }
html body.cx-design-system th.cx-table-column-header--customer { min-width: 210px !important; }
html body.cx-design-system th.cx-table-column-header--name { min-width: 175px !important; }
html body.cx-design-system th.cx-table-column-header--status { min-width: 132px !important; }
html body.cx-design-system th.cx-table-column-header--location { min-width: 245px !important; }
html body.cx-design-system th.cx-table-column-header--phone { min-width: 185px !important; }
html body.cx-design-system th.cx-table-column-header--email { min-width: 215px !important; }
html body.cx-design-system th.cx-table-column-header--comment { min-width: 205px !important; }
html body.cx-design-system th.cx-table-column-header--message { min-width: 220px !important; }
html body.cx-design-system th.cx-table-column-header--direction { min-width: 138px !important; }
html body.cx-design-system th.cx-table-column-header--type { min-width: 145px !important; }
html body.cx-design-system th.cx-table-column-header--model { min-width: 165px !important; }
html body.cx-design-system th.cx-table-column-header--inventory { min-width: 112px !important; }
html body.cx-design-system th.cx-table-column-header--active { min-width: 98px !important; }
html body.cx-design-system th.cx-table-column-header--suspended { min-width: 112px !important; }
html body.cx-design-system th.cx-table-column-header--deactivated { min-width: 118px !important; }
html body.cx-design-system th.cx-table-column-header--document { min-width: 175px !important; }
html body.cx-design-system th.cx-table-column-header--download { min-width: 145px !important; }
html body.cx-design-system th.cx-table-column-header--description { min-width: 220px !important; }
html body.cx-design-system th.cx-table-column-header--role { min-width: 150px !important; }
html body.cx-design-system th.cx-table-column-header--language { min-width: 155px !important; }
html body.cx-design-system th.cx-table-column-header--user { min-width: 175px !important; }
html body.cx-design-system th.cx-table-column-header--identifier { min-width: 100px !important; }
html body.cx-design-system th.cx-table-column-header--reason { min-width: 210px !important; }
html body.cx-design-system th.cx-table-column-header--selected { min-width: 130px !important; }
html body.cx-design-system th.cx-table-column-header--count { min-width: 118px !important; }
html body.cx-design-system th.cx-table-column-header--manufacturer { min-width: 175px !important; }
html body.cx-design-system th.cx-table-column-header--frequency { min-width: 195px !important; }
html body.cx-design-system th.cx-table-column-header--format { min-width: 145px !important; }
html body.cx-design-system th.cx-table-column-header--schedule { min-width: 175px !important; }
html body.cx-design-system th.cx-table-column-header--generic { min-width: 145px !important; }

html body.cx-design-system
#conexgoDashboardSmartGrid
.conexgo-dashboard-smart-item[data-dashboard-key="deviceStatus"]
.conexgo-device-status-table thead,
html body.cx-design-system
#conexgoDashboardSmartGrid
.conexgo-device-status-table thead {
    background: #f3f8f6 !important;
}

html body.cx-design-system
#conexgoDashboardSmartGrid
.conexgo-device-status-table
th.cx-table-column-header--compact {
    padding: 0 !important;
    border-top: 1px solid rgba(205, 224, 216, .72) !important;
    border-bottom: 1px solid #cfe1da !important;
    background: #f3f8f6 !important;
    color: #2f4d63 !important;
}

html body.cx-design-system
#conexgoDashboardSmartGrid
.conexgo-device-status-table
th.cx-table-column-header--compact
.cx-table-column-header__layout {
    min-height: 42px !important;
    gap: 0 !important;
    padding: 9px 12px !important;
}

html body.cx-design-system
#conexgoDashboardSmartGrid
.conexgo-device-status-table
th.cx-table-column-header--compact.cx-table-column-header--no-icon
.cx-table-column-header__copy {
    flex: 1 1 auto !important;
    width: 100% !important;
}

html body.cx-design-system
#conexgoDashboardSmartGrid
.conexgo-device-status-table
th.cx-table-column-header--compact
.cx-table-column-header__label {
    color: #38546a !important;
    font-size: 11.25px !important;
    font-weight: 760 !important;
    line-height: 1.2 !important;
    letter-spacing: .035em !important;
    text-transform: uppercase !important;
    white-space: nowrap !important;
}

html body.cx-design-system
#conexgoDashboardSmartGrid
.conexgo-device-status-table
th.cx-table-column-header--model
.cx-table-column-header__layout {
    padding-left: 14px !important;
}

html body.cx-design-system
#conexgoDashboardSmartGrid
.conexgo-device-status-table
th.cx-table-column-header--align-center
.cx-table-column-header__layout {
    justify-content: center !important;
}

html body.cx-design-system
#conexgoDashboardSmartGrid
.conexgo-device-status-table
th.cx-table-column-header--align-center
.cx-table-column-header__copy {
    align-items: center !important;
    text-align: center !important;
}

html body.cx-design-system
#conexgoDashboardSmartGrid
.conexgo-device-status-table
th.cx-table-column-header--compact + th.cx-table-column-header--compact {
    border-left: 1px solid rgba(209, 225, 219, .66) !important;
}

html body.cx-design-system
#conexgoDashboardSmartGrid
.conexgo-device-status-table tbody tr {
    transition: background-color 130ms ease !important;
}

html body.cx-design-system
#conexgoDashboardSmartGrid
.conexgo-device-status-table tbody tr:hover {
    background: rgba(239, 246, 243, .72) !important;
}

html body.cx-design-system
#conexgoDashboardSmartGrid
.conexgo-device-status-table tbody td {
    border-bottom-color: rgba(219, 228, 235, .82) !important;
}

html body.cx-design-system
#conexgoDashboardSmartGrid
.conexgo-device-status-table tbody tr:last-child td {
    border-bottom-color: transparent !important;
}

html body.cx-design-system
:is(
    .conexgo-pagedlist-table,
    .cx-native-table,
    .cx-devicemodel-alert-table,
    .cx-admin-table,
    .cx-email-history-head-row
)
thead,
html body.cx-design-system
:is(
    .conexgo-pagedlist-table,
    .cx-native-table,
    .cx-devicemodel-alert-table,
    .cx-admin-table
)
thead tr {
    background: var(--cx-r1875-header-bg) !important;
}

html body.cx-design-system
.conexgo-pagedlist-table-region,
html body.cx-design-system
.table-responsive {
    scrollbar-gutter: stable !important;
}

@media (max-width: 767.98px) {
    html body.cx-design-system
    .cx-table-column-header__layout {
        min-height: 46px !important;
        gap: 7px !important;
        padding: 8px 9px !important;
    }

    html body.cx-design-system
    .cx-table-column-header__icon {
        width: 26px !important;
        min-width: 26px !important;
        height: 26px !important;
        flex-basis: 26px !important;
    }

    html body.cx-design-system
    .cx-table-column-header__label {
        font-size: 11.75px !important;
    }
}

html body.cx-design-system
#conexgoDashboardSmartGrid
.conexgo-dashboard-smart-item[data-dashboard-key="deviceStatus"] {
    min-width: 0 !important;
    max-width: 100% !important;
    overflow: hidden !important;
}

html body.cx-design-system
#conexgoDashboardSmartGrid
.conexgo-dashboard-smart-item[data-dashboard-key="deviceStatus"]
> .card {
    min-width: 0 !important;
    max-width: 100% !important;
    width: 100% !important;
    overflow: hidden !important;
}

html body.cx-design-system
#conexgoDashboardSmartGrid
[data-dashboard-key="deviceStatus"]
.conexgo-dashboard-table-card-body {
    min-width: 0 !important;
    max-width: 100% !important;
    width: 100% !important;
    overflow: hidden !important;
}

html body.cx-design-system
#conexgoDashboardSmartGrid
[data-dashboard-key="deviceStatus"]
.conexgo-dashboard-table-viewport {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    overscroll-behavior-inline: contain !important;
    scrollbar-gutter: stable !important;
    -webkit-overflow-scrolling: touch;
}

html body.cx-design-system
#conexgoDashboardSmartGrid
[data-dashboard-key="deviceStatus"]
.conexgo-device-status-table--fit {
    width: 100% !important;
    min-width: 510px !important;
    max-width: none !important;
    table-layout: fixed !important;
    margin: 0 !important;
}

html body.cx-design-system
#conexgoDashboardSmartGrid
[data-dashboard-key="deviceStatus"]
.conexgo-device-status-table--fit
col.conexgo-device-status-col-model {
    width: 36% !important;
}

html body.cx-design-system
#conexgoDashboardSmartGrid
[data-dashboard-key="deviceStatus"]
.conexgo-device-status-table--fit
col.conexgo-device-status-col-metric {
    width: 16% !important;
}

html body.cx-design-system
#conexgoDashboardSmartGrid
[data-dashboard-key="deviceStatus"]
.conexgo-device-status-table--fit
th.cx-table-column-header--compact {
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
}

html body.cx-design-system
#conexgoDashboardSmartGrid
[data-dashboard-key="deviceStatus"]
.conexgo-device-status-table--fit
th.cx-table-column-header--compact
.cx-table-column-header__layout {
    min-width: 0 !important;
    padding: 9px 9px !important;
}

html body.cx-design-system
#conexgoDashboardSmartGrid
[data-dashboard-key="deviceStatus"]
.conexgo-device-status-table--fit
th.cx-table-column-header--compact
.cx-table-column-header__label {
    min-width: 0 !important;
    max-width: 100% !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

html body.cx-design-system
#conexgoDashboardSmartGrid
[data-dashboard-key="deviceStatus"]
.conexgo-device-status-model-cell,
html body.cx-design-system
#conexgoDashboardSmartGrid
[data-dashboard-key="deviceStatus"]
.conexgo-device-status-metric-cell {
    padding: 9px 10px !important;
    vertical-align: middle !important;
    border-bottom-color: rgba(219, 228, 235, .82) !important;
}

html body.cx-design-system
#conexgoDashboardSmartGrid
[data-dashboard-key="deviceStatus"]
.conexgo-device-status-model-cell {
    min-width: 0 !important;
    overflow: hidden !important;
    white-space: nowrap !important;
}

html body.cx-design-system
#conexgoDashboardSmartGrid
[data-dashboard-key="deviceStatus"]
.conexgo-device-status-model-cell
.conexgo-dashboard-model-icon {
    width: 42px !important;
    min-width: 42px !important;
    height: 42px !important;
    margin: 0 9px 0 0 !important;
    padding: 6px !important;
    vertical-align: middle !important;
}

html body.cx-design-system
#conexgoDashboardSmartGrid
[data-dashboard-key="deviceStatus"]
.conexgo-device-status-model-cell
.mobile {
    display: inline-block !important;
    max-width: calc(100% - 58px) !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    vertical-align: middle !important;
}

html body.cx-design-system
#conexgoDashboardSmartGrid
[data-dashboard-key="deviceStatus"]
.conexgo-device-status-metric-cell {
    text-align: center !important;
    white-space: nowrap !important;
    font-variant-numeric: tabular-nums !important;
}

@media (max-width: 620px) {
    html body.cx-design-system
    #conexgoDashboardSmartGrid
    [data-dashboard-key="deviceStatus"]
    .conexgo-device-status-table--fit {
        min-width: 500px !important;
    }
}

html body.cx-design-system
.alert-list-card
.conexgo-pagedlist-table {
    width: 100% !important;
    min-width: 1040px !important;
    table-layout: fixed !important;
}

html body.cx-design-system
.alert-list-card
th.cx-table-column-header--action {
    width: 8% !important;
    min-width: 88px !important;
}

html body.cx-design-system
.alert-list-card
th.cx-table-column-header--alert {
    width: 13% !important;
    min-width: 125px !important;
}

html body.cx-design-system
.alert-list-card
th.cx-table-column-header--datetime {
    width: 15% !important;
    min-width: 145px !important;
}

html body.cx-design-system
.alert-list-card
th.cx-table-column-header--device {
    width: 30% !important;
    min-width: 270px !important;
}

html body.cx-design-system
.alert-list-card
th.cx-table-column-header--customer {
    width: 17% !important;
    min-width: 185px !important;
}

html body.cx-design-system
.alert-list-card
th.cx-table-column-header--comment {
    width: 17% !important;
    min-width: 175px !important;
}

html body.cx-design-system
.alert-list-card
.alert-list-device-cell {
    min-width: 0 !important;
    max-width: none !important;
    overflow: hidden !important;
}

html body.cx-design-system
.alert-list-card
.alert-list-device-line {
    min-width: 0 !important;
    max-width: 100% !important;
    flex-wrap: wrap !important;
    column-gap: 10px !important;
    row-gap: 4px !important;
    white-space: normal !important;
}

html body.cx-design-system
.alert-list-card
.alert-list-device-name {
    min-width: 0 !important;
    max-width: 100% !important;
    overflow-wrap: anywhere !important;
}

html body.cx-design-system
.alert-list-card
.alert-list-customer-cell-container,
html body.cx-design-system
.alert-list-card
.alert-list-comment-cell {
    min-width: 0 !important;
    max-width: none !important;
    overflow: hidden !important;
    overflow-wrap: anywhere !important;
    word-break: normal !important;
    vertical-align: top !important;
}

html body.cx-design-system
.alert-list-card
.alert-list-customer-cell-container
.alert-list-customer-cell {
    min-width: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
}

html body.cx-design-system
.alert-list-card
.alert-list-customer-cell-container
.alert-list-customer-address {
    overflow-wrap: anywhere !important;
}

@media (min-width: 1280px) {
    html body.cx-design-system
    .alert-list-card
    .conexgo-pagedlist-table {
        min-width: 100% !important;
    }
}

html body.cx-design-system
:is(
    .device-list-action-group,
    .account-list-cell-name .conexgo-row-action-group
)
:is(
    .device-list-name-button,
    .account-list-name-button,
    .device-list-action-toggle,
    .conexgo-row-action-toggle
) {
    transition:
        background-color 130ms ease,
        border-color 130ms ease,
        color 130ms ease,
        box-shadow 130ms ease,
        transform 130ms ease !important;
}

html body.cx-design-system
.account-list-cell-name
.account-list-name-button:hover {
    background: #f8fbfd !important;
    border-color: #b8d0df !important;
    color: #234b68 !important;
    box-shadow: 0 3px 10px rgba(35, 76, 105, .05) !important;
    transform: translateY(-1px) !important;
}

html body.cx-design-system
.account-list-cell-name
.account-list-name-button:active {
    transform: translateY(0) !important;
}

html body.cx-design-system
:is(
    .device-list-action-toggle,
    .conexgo-row-action-toggle
):hover {
    background: #3b6a8c !important;
    border-color: #3b6a8c !important;
    box-shadow: 0 3px 9px rgba(39, 79, 109, .12) !important;
    transform: none !important;
}

html body.cx-design-system
:is(
    .device-list-action-toggle,
    .conexgo-row-action-toggle
)[aria-expanded="true"] {
    background: #315f80 !important;
    border-color: #315f80 !important;
    box-shadow: 0 0 0 3px rgba(70, 119, 155, .10) !important;
}

@keyframes cx-r18752-row-menu-in-down {
    from {
        opacity: 0;
        transform: translateY(-5px) scale(.992);
    }

    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

@keyframes cx-r18752-row-menu-in-up {
    from {
        opacity: 0;
        transform: translateY(5px) scale(.992);
    }

    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

html body.cx-design-system
:is(
    .device-list-action-menu,
    .conexgo-row-action-menu
).show {
    transform-origin: top right !important;
    animation: cx-r18752-row-menu-in-down 135ms cubic-bezier(.2, .75, .25, 1) both !important;
}

html body.cx-design-system
:is(
    .device-list-action-group,
    .conexgo-row-action-group
).cx-row-menu-open-above
> :is(
    .device-list-action-menu,
    .conexgo-row-action-menu
).show {
    transform-origin: bottom right !important;
    animation-name: cx-r18752-row-menu-in-up !important;
}

@media (prefers-reduced-motion: reduce) {
    html body.cx-design-system
    :is(
        .device-list-action-menu,
        .conexgo-row-action-menu
    ).show {
        animation: none !important;
    }

    html body.cx-design-system
    :is(
        .device-list-name-button,
        .account-list-name-button,
        .device-list-action-toggle,
        .conexgo-row-action-toggle
    ) {
        transition: none !important;
    }
}

html body.cx-design-system
.alert-list-card
.conexgo-pagedlist-table {
    width: 100% !important;
    min-width: 1030px !important;
    table-layout: fixed !important;
}

html body.cx-design-system
.alert-list-card
th.cx-table-column-header--action {
    width: 10% !important;
    min-width: 110px !important;
}

html body.cx-design-system
.alert-list-card
th.cx-table-column-header--alert {
    width: 12% !important;
    min-width: 120px !important;
}

html body.cx-design-system
.alert-list-card
th.cx-table-column-header--datetime {
    width: 14% !important;
    min-width: 140px !important;
}

html body.cx-design-system
.alert-list-card
th.cx-table-column-header--device {
    width: 30% !important;
    min-width: 280px !important;
}

html body.cx-design-system
.alert-list-card
th.cx-table-column-header--customer {
    width: 17% !important;
    min-width: 170px !important;
}

html body.cx-design-system
.alert-list-card
th.cx-table-column-header--comment {
    width: 17% !important;
    min-width: 170px !important;
}

html body.cx-design-system
.alert-list-card
th.cx-table-column-header
.cx-table-column-header__layout {
    min-height: 50px !important;
    gap: 7px !important;
    padding: 8px 8px !important;
}

html body.cx-design-system
.alert-list-card
th.cx-table-column-header
.cx-table-column-header__icon {
    width: 26px !important;
    min-width: 26px !important;
    height: 26px !important;
    flex: 0 0 26px !important;
    border-radius: 7px !important;
}

html body.cx-design-system
.alert-list-card
th.cx-table-column-header
.cx-table-column-header__icon > i {
    font-size: 11.5px !important;
}

html body.cx-design-system
.alert-list-card
th.cx-table-column-header
.cx-table-column-header__copy {
    min-width: max-content !important;
    flex: 0 1 auto !important;
    overflow: visible !important;
}

html body.cx-design-system
.alert-list-card
th.cx-table-column-header
.cx-table-column-header__label {
    min-width: max-content !important;
    max-width: none !important;
    overflow: visible !important;
    text-overflow: clip !important;
    white-space: nowrap !important;
    font-size: 12px !important;
    line-height: 1.15 !important;
}

html body.cx-design-system
.alert-list-card
th.cx-table-column-header
.cx-table-column-header__sort {
    width: 14px !important;
    min-width: 14px !important;
    height: 22px !important;
    flex: 0 0 14px !important;
    margin-left: 3px !important;
    font-size: 8.75px !important;
}

html body.cx-design-system
.alert-list-card
th.cx-table-column-header--action
.cx-table-column-header__layout {
    padding-left: 9px !important;
    padding-right: 9px !important;
}

html body.cx-design-system
.alert-list-card
.bstable-actions {
    min-width: 0 !important;
    padding-left: 10px !important;
    padding-right: 8px !important;
    vertical-align: middle !important;
}

html body.cx-design-system
.alert-list-card
.alert-list-device-cell,
html body.cx-design-system
.alert-list-card
.alert-list-customer-cell-container,
html body.cx-design-system
.alert-list-card
.alert-list-comment-cell {
    padding-left: 12px !important;
    padding-right: 12px !important;
}

@media (max-width: 1180px) {
    html body.cx-design-system
    .alert-list-card
    .conexgo-pagedlist-table {
        min-width: 1080px !important;
    }
}

html body.cx-design-system
.alert-list-card
.conexgo-pagedlist-table
tbody > tr > :is(
    .alert-list-alert-cell,
    .alert-list-datetime-cell,
    .alert-list-device-cell,
    .alert-list-customer-cell-container,
    .alert-list-comment-cell
) {
    padding-top: 13px !important;
    padding-bottom: 13px !important;
    vertical-align: top !important;
}

html body.cx-design-system
.alert-list-card
.alert-list-device-line {
    align-items: flex-start !important;
}

html body.cx-design-system
.alert-list-card
.alert-list-callcenter {
    margin-top: 1px !important;
}

@media (min-width: 1200px) {
    html body .device-config-card .device-config-main-header,
    html body .device-config-card .device-config-sections-shell {
        width: min(100%, 1160px) !important;
        max-width: 1160px !important;
        margin-inline: auto !important;
    }

    html body .device-config-card .device-config-section-header,
    html body .device-config-card .device-config-section-content {
        grid-template-columns:
            minmax(170px, 1.25fr)
            40px
            minmax(120px, .92fr)
            minmax(120px, .9fr)
            minmax(96px, .7fr)
            minmax(190px, 1.3fr)
            38px !important;
        gap: 7px !important;
    }

    html body .device-config-card .device-config-section-header {
        padding: 9px 11px !important;
    }

    html body .device-config-card .device-config-section-content {
        padding: 10px 11px !important;
    }

    html body .device-config-card .device-config-column-heading {
        font-size: 10px !important;
        letter-spacing: .045em !important;
    }

    html body .device-config-card .device-config-col-updated {
        max-width: 260px !important;
    }
}

@media (min-width: 992px) {
    html body .mud-dialog.cx-dialog-root.cx-device-config-dialog.cx-r1-device-dot {
        width: min(960px, calc(100vw - 48px)) !important;
        max-width: min(960px, calc(100vw - 48px)) !important;
        max-height: min(86dvh, 820px) !important;
    }
}

html body .mud-dialog.cx-dialog-root.cx-r1-device-dot .mud-dialog-content,
html body .mud-dialog.cx-dialog-root.cx-r1-device-dot .cx-dialog-content {
    min-height: 0 !important;
    overflow-y: auto !important;
    overscroll-behavior: contain !important;
}

html body .mud-dialog.cx-dialog-root.cx-r1-device-dot .device-dot-form {
    width: 100% !important;
    min-width: 0 !important;
    display: grid !important;
    gap: 14px !important;
}

html body .mud-dialog.cx-dialog-root.cx-r1-device-dot .device-dot-summary,
html body .mud-dialog.cx-dialog-root.cx-r1-device-dot .device-dot-section {
    width: 100% !important;
    min-width: 0 !important;
    padding: 14px !important;
    border: 1px solid #d9e4ed !important;
    border-radius: 12px !important;
    background: #fff !important;
    box-shadow: 0 3px 10px rgba(36, 66, 95, .035) !important;
}

html body .mud-dialog.cx-dialog-root.cx-r1-device-dot .device-dot-grid {
    width: 100% !important;
    min-width: 0 !important;
    display: grid !important;
    grid-template-columns: repeat(auto-fill, minmax(280px, 340px)) !important;
    align-items: stretch !important;
    justify-content: start !important;
    gap: 12px !important;
}

html body .mud-dialog.cx-dialog-root.cx-r1-device-dot .device-dot-card {
    width: 100% !important;
    min-width: 0 !important;
    min-height: 138px !important;
    margin: 0 !important;
    padding: 12px !important;
    display: grid !important;
    grid-template-columns: 86px minmax(0, 1fr) !important;
    grid-template-rows: auto 1fr !important;
    grid-template-areas:
        "status details"
        "status action" !important;
    gap: 9px 12px !important;
    align-items: start !important;
    overflow: hidden !important;
    border: 1px solid #d7e2eb !important;
    border-radius: 11px !important;
    background: #fbfcfd !important;
    box-shadow: none !important;
}

html body .mud-dialog.cx-dialog-root.cx-r1-device-dot .device-dot-card-status {
    grid-area: status !important;
    min-width: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 7px !important;
}

html body .mud-dialog.cx-dialog-root.cx-r1-device-dot .device-dot-image {
    width: 76px !important;
    height: 76px !important;
    max-width: 76px !important;
    max-height: 76px !important;
    margin: 0 !important;
    display: block !important;
    object-fit: contain !important;
}

html body .mud-dialog.cx-dialog-root.cx-r1-device-dot .device-dot-connection {
    max-width: 100% !important;
    min-height: 25px !important;
    padding: 0 7px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 5px !important;
    border-radius: 999px !important;
    font-size: 10.75px !important;
    line-height: 1 !important;
    white-space: nowrap !important;
}

html body .mud-dialog.cx-dialog-root.cx-r1-device-dot .device-dot-card-details {
    grid-area: details !important;
    min-width: 0 !important;
    padding: 1px 0 0 !important;
    display: grid !important;
    align-content: start !important;
    justify-items: start !important;
    gap: 7px !important;
}

html body .mud-dialog.cx-dialog-root.cx-r1-device-dot .device-dot-name {
    max-width: 100% !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    font-size: 14px !important;
    font-weight: 760 !important;
}

html body .mud-dialog.cx-dialog-root.cx-r1-device-dot .device-dot-battery {
    min-height: 27px !important;
    padding: 0 8px !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    border: 1px solid #dce5ec !important;
    border-radius: 7px !important;
    background: #fff !important;
    font-size: 11.5px !important;
}

html body .mud-dialog.cx-dialog-root.cx-r1-device-dot .device-dot-card-action {
    grid-area: action !important;
    min-width: 0 !important;
    display: flex !important;
    align-items: flex-end !important;
    align-self: end !important;
}

html body .mud-dialog.cx-dialog-root.cx-r1-device-dot .device-dot-locate-button {
    width: auto !important;
    min-width: 0 !important;
    min-height: 34px !important;
    padding: 0 10px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 7px !important;
    border: 1px solid #cbd9e4 !important;
    border-radius: 8px !important;
    background: #fff !important;
    color: #315879 !important;
    font-size: 11.5px !important;
    font-weight: 730 !important;
    line-height: 1.2 !important;
}

html body .mud-dialog.cx-dialog-root.cx-r1-device-dot .device-dot-locate-button > img {
    width: 16px !important;
    height: 16px !important;
    max-width: 16px !important;
    max-height: 16px !important;
    margin: 0 !important;
    object-fit: contain !important;
}

html body .mud-dialog.cx-dialog-root.cx-r1-device-dot .device-dot-count {
    min-width: 26px !important;
    height: 26px !important;
    padding: 0 8px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 999px !important;
    font-size: 11px !important;
}

@media (max-width: 991.98px) {
    html body .mud-dialog.cx-dialog-root.cx-r1-device-dot {
        width: calc(100vw - 24px) !important;
        max-width: calc(100vw - 24px) !important;
        margin: 12px !important;
    }
}

@media (max-width: 575.98px) {
    html body .mud-dialog.cx-dialog-root.cx-r1-device-dot .device-dot-grid {
        grid-template-columns: minmax(0, 1fr) !important;
    }

    html body .mud-dialog.cx-dialog-root.cx-r1-device-dot .device-dot-card {
        grid-template-columns: 76px minmax(0, 1fr) !important;
        gap: 8px 10px !important;
    }

    html body .mud-dialog.cx-dialog-root.cx-r1-device-dot .device-dot-image {
        width: 66px !important;
        height: 66px !important;
        max-width: 66px !important;
        max-height: 66px !important;
    }
}

html body.cx-design-system .cx-custom-select-trigger {
    transition:
        border-color 220ms cubic-bezier(.22, 1, .36, 1),
        background-color 220ms cubic-bezier(.22, 1, .36, 1),
        box-shadow 220ms cubic-bezier(.22, 1, .36, 1),
        color 180ms ease !important;
}

html body.cx-design-system .cx-custom-select-trigger:hover:not(:disabled) {
    border-color: #b5c7d5 !important;
    background: #fbfdff !important;
    box-shadow: 0 2px 8px rgba(31, 65, 91, .035) !important;
    transform: none !important;
}

html body.cx-design-system .cx-custom-select-chevron,
html body.cx-design-system .cx-custom-select-leading-icon {
    transition:
        border-color 220ms cubic-bezier(.22, 1, .36, 1),
        background-color 220ms cubic-bezier(.22, 1, .36, 1),
        color 180ms ease,
        box-shadow 220ms cubic-bezier(.22, 1, .36, 1) !important;
}

html body.cx-design-system
.cx-custom-select-trigger:hover:not(:disabled)
.cx-custom-select-chevron {
    border-color: #d0dee8 !important;
    background: #eef4f8 !important;
    color: #315c7c !important;
}

html body.cx-design-system
.cx-custom-select-trigger:hover:not(:disabled)
.cx-custom-select-leading-icon {
    background: #f0f5f8 !important;
    color: #315c7c !important;
    transform: none !important;
}

html body.cx-design-system
:is(
    .cx-custom-select-menu--top-layer[popover],
    .cx-custom-select-menu[data-cx-select-owner],
    .cx-custom-select-menu
)
.cx-custom-select-option {
    border-color: transparent !important;
    transform: none !important;
    transition:
        background-color 190ms cubic-bezier(.22, 1, .36, 1),
        border-color 190ms cubic-bezier(.22, 1, .36, 1),
        color 170ms ease,
        box-shadow 190ms cubic-bezier(.22, 1, .36, 1) !important;
}

html body.cx-design-system
:is(
    .cx-custom-select-menu--top-layer[popover],
    .cx-custom-select-menu[data-cx-select-owner],
    .cx-custom-select-menu
)
.cx-custom-select-option:hover:not(:disabled),
html body.cx-design-system
:is(
    .cx-custom-select-menu--top-layer[popover],
    .cx-custom-select-menu[data-cx-select-owner],
    .cx-custom-select-menu
)
.cx-custom-select-option.is-active:not(:disabled) {
    border-color: #edf2f6 !important;
    background: #f7fafc !important;
    color: #2d4f69 !important;
    box-shadow: inset 0 0 0 1px rgba(94, 126, 151, .025) !important;
    transform: none !important;
}

html body.cx-design-system
:is(
    .cx-custom-select-menu--top-layer[popover],
    .cx-custom-select-menu[data-cx-select-owner],
    .cx-custom-select-menu
)
.cx-custom-select-option.is-selected {
    border-color: #dbe7ef !important;
    background: #eef5f9 !important;
    color: #294f6d !important;
}

html body.cx-design-system
:is(
    .cx-custom-select-menu--top-layer[popover],
    .cx-custom-select-menu[data-cx-select-owner],
    .cx-custom-select-menu
)
.cx-custom-select-option.is-selected:hover:not(:disabled),
html body.cx-design-system
:is(
    .cx-custom-select-menu--top-layer[popover],
    .cx-custom-select-menu[data-cx-select-owner],
    .cx-custom-select-menu
)
.cx-custom-select-option.is-selected.is-active:not(:disabled) {
    border-color: #d4e2eb !important;
    background: #eaf2f7 !important;
    color: #264c69 !important;
}

html body.cx-design-system .cx-custom-select-option-check {
    transition:
        opacity 170ms ease,
        background-color 190ms cubic-bezier(.22, 1, .36, 1),
        color 170ms ease !important;
}

@media (prefers-reduced-motion: reduce) {
    html body.cx-design-system .cx-custom-select-trigger,
    html body.cx-design-system .cx-custom-select-chevron,
    html body.cx-design-system .cx-custom-select-leading-icon,
    html body.cx-design-system .cx-custom-select-option,
    html body.cx-design-system .cx-custom-select-option-check {
        transition: none !important;
    }
}

html body.cx-design-system
:is(
    .device-config-section-header,
    .device-config-section-content,
    .device-permissions-wrapper,
    .account-config-section-header,
    .account-config-section-content
) {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
}

html body.cx-design-system
:is(
    .device-config-section-header,
    .account-config-section-header,
    .device-permissions-header,
    .alert-answer-comment-header
) {
    cursor: pointer !important;
    user-select: none !important;
    transition:
        background-color 130ms ease,
        border-color 130ms ease,
        box-shadow 130ms ease !important;
}

html body.cx-design-system
:is(
    .device-config-section-header,
    .account-config-section-header,
    .device-permissions-header,
    .alert-answer-comment-header
):hover {
    box-shadow: inset 0 0 0 1px rgba(56, 101, 134, .08) !important;
}

html body.cx-design-system
:is(
    .device-list-action-menu,
    .conexgo-row-action-menu
).show {
    box-sizing: border-box !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    overscroll-behavior: contain !important;
    scrollbar-width: thin !important;
}

html body.cx-design-system
:is(
    .device-list-action-menu,
    .conexgo-row-action-menu
).show
> li,
html body.cx-design-system
:is(
    .device-list-action-menu,
    .conexgo-row-action-menu
).show
.dropdown-item {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
}

html body.cx-design-system
:is(
    .account-list-card,
    .account-list-card-body,
    .account-list-table-shell,
    .cx-paged-list,
    .conexgo-pagedlist-table-region,
    .conexgo-pagedlist-table-column,
    .conexgo-pagedlist-table,
    .table-responsive
):has(
    .device-list-action-menu.show,
    .conexgo-row-action-menu.show
) {
    overflow: visible !important;
}

html body.cx-design-system
.conexgo-pagedlist-table
> tbody
> tr
> td {
    padding-top: 13px !important;
    padding-bottom: 13px !important;
    vertical-align: top !important;
    line-height: 1.35 !important;
}

html body.cx-design-system
.conexgo-pagedlist-table
.bstable-actions {
    vertical-align: top !important;
}

html body.cx-design-system
.conexgo-pagedlist-table
.bstable-actions
> .btn-list {
    align-items: flex-start !important;
    margin-top: 0 !important;
    padding-top: 0 !important;
}

html body.cx-design-system
.conexgo-pagedlist-table
:is(
    .device-list-action-group,
    .conexgo-row-action-group
) {
    vertical-align: top !important;
}

html body.cx-design-system
:is(
    .alert-view-table,
    .alert-answer-table
)
:is(th, td) {
    vertical-align: top !important;
}

html body.cx-design-system
.alert-list-card
.conexgo-pagedlist-table
tbody > tr > .bstable-actions {
    padding-top: 13px !important;
    padding-bottom: 13px !important;
}

html body.cx-design-system
#conexgoDashboardSmartGrid
[data-dashboard-key="deviceStatus"]
.conexgo-dashboard-table-card-body {
    width: 100% !important;
    max-width: 100% !important;
    margin-top: 0 !important;
    padding: 0 !important;
}

html body.cx-design-system
#conexgoDashboardSmartGrid
[data-dashboard-key="deviceStatus"]
.conexgo-dashboard-table-viewport {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}

html body.cx-design-system
#conexgoDashboardSmartGrid
[data-dashboard-key="deviceStatus"]
.conexgo-device-status-table--fit {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
}

@media (min-width: 900px) {
    html body.cx-design-system
    #conexgoDashboardSmartGrid
    [data-dashboard-key="deviceStatus"]
    .conexgo-dashboard-table-viewport {
        overflow-x: hidden !important;
        scrollbar-gutter: auto !important;
    }

    html body.cx-design-system
    #conexgoDashboardSmartGrid
    [data-dashboard-key="deviceStatus"]
    .conexgo-device-status-table--fit {
        min-width: 0 !important;
        table-layout: fixed !important;
    }
}

@media (max-width: 899.98px) {
    html body.cx-design-system
    #conexgoDashboardSmartGrid
    [data-dashboard-key="deviceStatus"]
    .conexgo-dashboard-table-viewport {
        overflow-x: auto !important;
    }
}

html body.cx-design-system
.cx-custom-select-root
.cx-custom-select-trigger,
html body.cx-design-system
select.form-select {
    min-height: 44px !important;
    height: 44px !important;
    border-radius: 8px !important;
}

html body.cx-design-system
.cx-custom-select-root
.cx-custom-select-trigger {
    padding: 4px 5px 4px 12px !important;
}

html body.cx-design-system
.cx-custom-select-root
.cx-custom-select-chevron {
    width: 34px !important;
    min-width: 34px !important;
    height: 34px !important;
    border-radius: 7px !important;
}

html body.cx-design-system .cx-group-filter-grid {
    display: grid !important;
    grid-template-columns: minmax(220px, 360px) max-content !important;
    align-items: end !important;
    gap: 10px 12px !important;
    width: 100% !important;
    padding: 12px 14px 14px !important;
}

html body.cx-design-system .cx-group-filter-grid > .device-filter-field {
    min-width: 0 !important;
    width: 100% !important;
    margin: 0 !important;
}

html body.cx-design-system .cx-group-filter-reset {
    min-width: 112px !important;
    min-height: 44px !important;
    height: 44px !important;
    margin: 0 !important;
    align-self: end !important;
}

html body.cx-design-system .cx-group-filter-progress {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    padding: 0 14px 12px !important;
    color: #5b7489 !important;
    font-size: 13px !important;
}

html body.cx-design-system
:is(
    .device-list-action-group,
    .account-list-cell-name .conexgo-row-action-group
) {
    position: relative !important;
    overflow: visible !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}

html body.cx-design-system
:is(
    .device-list-action-group .device-list-name-button,
    .account-list-cell-name .account-list-name-button
),
html body.cx-design-system
:is(
    .device-list-action-group .device-list-name-button,
    .account-list-cell-name .account-list-name-button
):hover,
html body.cx-design-system
:is(
    .device-list-action-group .device-list-name-button,
    .account-list-cell-name .account-list-name-button
):focus,
html body.cx-design-system
:is(
    .device-list-action-group .device-list-name-button,
    .account-list-cell-name .account-list-name-button
):focus-visible,
html body.cx-design-system
:is(
    .device-list-action-group .device-list-name-button,
    .account-list-cell-name .account-list-name-button
):active {
    min-height: 50px !important;
    height: 50px !important;
    padding-inline: 14px !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: #ffffff !important;
    color: #274966 !important;
    box-shadow: none !important;
    transform: none !important;
    transition: background-color 70ms linear !important;
}

html body.cx-design-system
:is(
    .device-list-action-group .device-list-name-button,
    .account-list-cell-name .account-list-name-button
):hover {
    background: #ffffff !important;
}

html body.cx-design-system
:is(
    .device-list-action-group .device-list-action-toggle,
    .account-list-cell-name .conexgo-row-action-toggle
),
html body.cx-design-system
:is(
    .device-list-action-group .device-list-action-toggle,
    .account-list-cell-name .conexgo-row-action-toggle
):hover,
html body.cx-design-system
:is(
    .device-list-action-group .device-list-action-toggle,
    .account-list-cell-name .conexgo-row-action-toggle
):focus,
html body.cx-design-system
:is(
    .device-list-action-group .device-list-action-toggle,
    .account-list-cell-name .conexgo-row-action-toggle
):focus-visible,
html body.cx-design-system
:is(
    .device-list-action-group .device-list-action-toggle,
    .account-list-cell-name .conexgo-row-action-toggle
):active,
html body.cx-design-system
:is(
    .device-list-action-group .device-list-action-toggle,
    .account-list-cell-name .conexgo-row-action-toggle
)[aria-expanded="true"] {
    width: 50px !important;
    min-width: 50px !important;
    max-width: 50px !important;
    min-height: 50px !important;
    height: 50px !important;
    flex: 0 0 50px !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: #315f80 !important;
    color: #ffffff !important;
    box-shadow: none !important;
    transform: none !important;
    transition: background-color 70ms linear !important;
}

html body.cx-design-system
:is(
    .device-list-action-group .device-list-action-toggle,
    .account-list-cell-name .conexgo-row-action-toggle
):hover,
html body.cx-design-system
:is(
    .device-list-action-group .device-list-action-toggle,
    .account-list-cell-name .conexgo-row-action-toggle
)[aria-expanded="true"] {
    background: #315f80 !important;
}

html body.cx-design-system
:is(.device-list-action-menu, .conexgo-row-action-menu) {
    padding: 4px !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: #ffffff !important;
    box-shadow: 0 10px 22px rgba(29, 59, 82, .10) !important;
    overflow-x: hidden !important;
}

html body.cx-design-system
:is(.device-list-action-menu, .conexgo-row-action-menu)
> li,
html body.cx-design-system
:is(.device-list-action-menu, .conexgo-row-action-menu)
.dropdown-item {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
}

html body.cx-design-system
:is(.device-list-action-menu, .conexgo-row-action-menu)
.dropdown-item,
html body.cx-design-system
:is(.device-list-action-menu, .conexgo-row-action-menu)
.dropdown-item:hover,
html body.cx-design-system
:is(.device-list-action-menu, .conexgo-row-action-menu)
.dropdown-item:active {
    min-height: 48px !important;
    padding: 10px 13px !important;
    gap: 10px !important;
    border: 0 !important;
    border-radius: 0 !important;
    color: #2e506c !important;
    font-size: 14px !important;
    font-weight: 620 !important;
    line-height: 1.25 !important;
    box-shadow: none !important;
    transform: none !important;
}

html body.cx-design-system
:is(.device-list-action-menu, .conexgo-row-action-menu)
.dropdown-item {
    background: #ffffff !important;
    transition: background-color 70ms linear !important;
}

html body.cx-design-system
:is(.device-list-action-menu, .conexgo-row-action-menu)
.dropdown-item:hover {
    background: #fbfcfd !important;
}

html body.cx-design-system
:is(.device-list-action-menu, .conexgo-row-action-menu)
.dropdown-item:focus-visible {
    border: 0 !important;
    border-radius: 0 !important;
    background: #f7fafc !important;
    color: #284d68 !important;
    outline: 2px solid rgba(70, 119, 155, .12) !important;
    outline-offset: -2px !important;
    box-shadow: none !important;
    transform: none !important;
}

html body.cx-design-system
:is(.device-list-action-menu, .conexgo-row-action-menu).show,
html body.cx-design-system
:is(.device-list-action-group, .conexgo-row-action-group).cx-row-menu-open-above
> :is(.device-list-action-menu, .conexgo-row-action-menu).show {
    animation: none !important;
    transform: none !important;
}

@media (min-width: 768px) {
    html body.cx-design-system
    :is(
        .device-list-action-group,
        .account-list-cell-name .conexgo-row-action-group
    )
    > :is(.device-list-action-menu, .conexgo-row-action-menu),
    html body.cx-design-system
    :is(
        .device-list-action-group,
        .account-list-cell-name .conexgo-row-action-group
    )
    > :is(.device-list-action-menu, .conexgo-row-action-menu).show {
        position: absolute !important;
        inset: calc(100% + 5px) 0 auto 0 !important;
        top: calc(100% + 5px) !important;
        right: 0 !important;
        bottom: auto !important;
        left: 0 !important;
        width: 100% !important;
        min-width: 100% !important;
        max-width: 100% !important;
        max-height: none !important;
        margin: 0 !important;
        transform: none !important;
        overflow-y: visible !important;
        z-index: 12000 !important;
    }

    html body.cx-design-system
    :is(
        .device-list-action-group,
        .account-list-cell-name .conexgo-row-action-group
    ).cx-row-menu-open-above
    > :is(.device-list-action-menu, .conexgo-row-action-menu),
    html body.cx-design-system
    :is(
        .device-list-action-group,
        .account-list-cell-name .conexgo-row-action-group
    ).cx-row-menu-open-above
    > :is(.device-list-action-menu, .conexgo-row-action-menu).show {
        inset: auto 0 calc(100% + 5px) 0 !important;
        top: auto !important;
        right: 0 !important;
        bottom: calc(100% + 5px) !important;
        left: 0 !important;
    }

    html body.cx-design-system
    :is(.device-list-action-menu, .conexgo-row-action-menu).cx-r64-row-menu-scrollable {
        max-height: var(--cx-r64-row-menu-max-height) !important;
        overflow-x: hidden !important;
        overflow-y: auto !important;
        overscroll-behavior: contain !important;
        scrollbar-width: thin !important;
    }
}

@media (min-width: 768px) {
    html body.cx-design-system
    .conexgo-account-profile
    .conexgo-account-profile-form
    > .row:not(.justify-content-end)
    > .col-md-9 {
        min-width: 0 !important;
    }

    html body.cx-design-system
    .conexgo-account-profile
    .conexgo-account-profile-form
    .form-control {
        width: 90% !important;
        max-width: 90% !important;
    }

    html body.cx-design-system
    .conexgo-account-profile
    .conexgo-account-profile-form
    :is(
        .cx-custom-select-root,
        .conexgo-profile-icon-picker
    ) {
        width: 90% !important;
        max-width: 90% !important;
        min-width: 0 !important;
        box-sizing: border-box !important;
    }

    html body.cx-design-system
    .conexgo-account-profile
    .conexgo-account-profile-form
    :is(
        .cx-custom-select-trigger,
        .conexgo-profile-icon-picker__trigger
    ) {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        min-height: 42px !important;
        height: 42px !important;
        box-sizing: border-box !important;
    }
}

@media (max-width: 767.98px) {
    html body.cx-design-system
    .conexgo-account-profile
    .conexgo-account-profile-form
    :is(
        .form-control,
        .cx-custom-select-root,
        .cx-custom-select-trigger,
        .conexgo-profile-icon-picker,
        .conexgo-profile-icon-picker__trigger
    ) {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
    }
}

html body.cx-design-system
.mud-dialog.cx-r1-device-addedit
.cx-r1-form-row
> .cx-r1-readonly-value {
    min-height: 48px !important;
    padding: 10px 20px 10px 32px !important;
    align-items: center !important;
    text-indent: 0 !important;
}

html body.cx-design-system
.mud-dialog.cx-r1-device-addedit
.cx-r1-form-row
> .cx-r1-readonly-value
> :first-child {
    margin-left: 0 !important;
    padding-left: 0 !important;
}

html body.cx-design-system
.mud-dialog.cx-r1-device-addedit
.cx-r1-form-row
> .cx-r1-readonly-value.cx-device-activation-readonly {
    padding-left: 32px !important;
    padding-right: 12px !important;
}

html body.cx-design-system
#conexgoDashboardSmartGrid
.conexgo-dashboard-standard-filter-row,
html body.cx-design-system
#conexgoDashboardSmartGrid
[data-dashboard-key="latestAlerts"]
.conexgo-dashboard-latest-period-row {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(190px, 280px) !important;
    align-items: center !important;
    gap: 10px 14px !important;
    width: 100% !important;
}

html body.cx-design-system
#conexgoDashboardSmartGrid
.conexgo-dashboard-standard-filter-row
> .cx-custom-select-root,
html body.cx-design-system
#conexgoDashboardSmartGrid
[data-dashboard-key="latestAlerts"]
.conexgo-dashboard-latest-period-row
> .cx-custom-select-root {
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
}

html body.cx-design-system
#conexgoDashboardSmartGrid
.conexgo-dashboard-primary-filter-row {
    align-items: center !important;
}

html body.cx-design-system
#conexgoDashboardSmartGrid
.conexgo-dashboard-primary-filter-row
> .conexgo-dashboard-filter-field {
    display: grid !important;
    grid-template-columns: max-content minmax(0, 1fr) !important;
    align-items: center !important;
    gap: 8px !important;
}

html body.cx-design-system
#conexgoDashboardSmartGrid
.conexgo-dashboard-primary-filter-row
> .conexgo-dashboard-filter-field
> .conexgo-dashboard-filter-label {
    margin: 0 !important;
    white-space: nowrap !important;
}

html body.cx-design-system
#conexgoDashboardSmartGrid
.conexgo-device-overview-period {
    display: grid !important;
    grid-template-columns: max-content minmax(190px, 270px) !important;
    align-items: center !important;
    gap: 8px !important;
    min-width: 0 !important;
}

html body.cx-design-system
#conexgoDashboardSmartGrid
.conexgo-device-overview-period
> .conexgo-dashboard-filter-label {
    margin: 0 !important;
}

html body.cx-design-system
#conexgoDashboardSmartGrid
.conexgo-dashboard-offline-filter-surface
> .conexgo-dashboard-standard-filter-row {
    padding: 0 !important;
}

@media (max-width: 767.98px) {
    html body.cx-design-system .cx-group-filter-grid {
        grid-template-columns: minmax(0, 1fr) !important;
        padding: 10px !important;
    }

    html body.cx-design-system .cx-group-filter-reset {
        width: 100% !important;
        justify-self: stretch !important;
    }

    html body.cx-design-system
    #conexgoDashboardSmartGrid
    :is(
        .conexgo-dashboard-standard-filter-row,
        [data-dashboard-key="latestAlerts"] .conexgo-dashboard-latest-period-row
    ) {
        grid-template-columns: minmax(0, 1fr) !important;
        align-items: stretch !important;
        gap: 6px !important;
    }

    html body.cx-design-system
    #conexgoDashboardSmartGrid
    .conexgo-dashboard-primary-filter-row {
        grid-template-columns: minmax(0, 1fr) !important;
        align-items: stretch !important;
    }

    html body.cx-design-system
    #conexgoDashboardSmartGrid
    .conexgo-dashboard-primary-filter-row
    > .conexgo-dashboard-filter-field,
    html body.cx-design-system
    #conexgoDashboardSmartGrid
    .conexgo-device-overview-period {
        grid-template-columns: minmax(0, 1fr) !important;
        align-items: stretch !important;
        gap: 5px !important;
    }
}

html body.cx-design-system
:is(form, .mud-dialog, .panel-body, .cx-r8-account-email)
textarea:not([readonly]):not(:disabled):not(.note-codable):not(.fr-code) {
    min-width: 0 !important;
    max-width: 100% !important;
    resize: vertical !important;
    overflow: auto !important;
}

html body.cx-design-system
.mud-dialog.cx-r8-account-email
textarea.cx-email-compose-textarea {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    height: 168px;
    min-height: 118px !important;
    max-height: min(64dvh, 680px) !important;
    resize: vertical !important;
    overflow: auto !important;
}

@media (prefers-reduced-motion: reduce) {
    html body.cx-design-system
    :is(
        .device-list-action-menu .dropdown-item,
        .conexgo-row-action-menu .dropdown-item,
        .device-list-action-group .device-list-name-button,
        .account-list-cell-name .account-list-name-button,
        .device-list-action-group .device-list-action-toggle,
        .account-list-cell-name .conexgo-row-action-toggle
    ) {
        transition: none !important;
    }
}

@media (max-width: 767.98px) {
    html body.cx-design-system .group-list-card > .group-list-toolbar {
        width: 100% !important;
        min-height: 56px !important;
        padding: 8px !important;
        display: block !important;
        background: #2c4c6c !important;
        overflow: visible !important;
    }

    html body.cx-design-system .group-list-toolbar .group-list-toolbar-row {
        width: 100% !important;
        min-width: 0 !important;
        margin: 0 !important;
        display: grid !important;
        grid-template-columns: 40px minmax(0, 1fr) !important;
        align-items: center !important;
        gap: 8px !important;
    }

    html body.cx-design-system .group-list-toolbar .group-list-toolbar-back {
        grid-column: 1 !important;
        grid-row: 1 !important;
        width: 40px !important;
        min-width: 40px !important;
        margin: 0 !important;
        display: flex !important;
        align-items: center !important;
        justify-content: flex-start !important;
        justify-self: start !important;
    }

    html body.cx-design-system .group-list-toolbar .group-list-toolbar-search {
        grid-column: 2 !important;
        grid-row: 1 !important;
        width: 100% !important;
        min-width: 0 !important;
        max-width: none !important;
        margin: 0 !important;
        display: block !important;
    }

    html body.cx-design-system .group-list-toolbar .group-list-toolbar-search :is(.dataTables_filter, label) {
        width: 100% !important;
        min-width: 0 !important;
        max-width: none !important;
        margin: 0 !important;
    }

    html body.cx-design-system .group-list-toolbar .group-list-toolbar-search .dataTables_filter > label {
        display: flex !important;
        align-items: stretch !important;
        gap: 6px !important;
    }

    html body.cx-design-system .group-list-toolbar .group-list-toolbar-search :is(.input-group, .cx-search-control) {
        width: 100% !important;
        min-width: 0 !important;
    }
}

@media (max-width: 767.98px) {
    html body.cx-design-system .cx-dashboard-page,
    html body.cx-design-system #conexgoDashboardSmartGrid {
        width: 100% !important;
        max-width: none !important;
        margin-inline: 0 !important;
    }

    html body.cx-design-system #conexgoDashboardSmartGrid.conexgo-dashboard-content-grid {
        gap: 8px !important;
        padding-inline: 0 !important;
    }

    html body.cx-design-system #conexgoDashboardSmartGrid > .conexgo-dashboard-smart-item,
    html body.cx-design-system #conexgoDashboardSmartGrid > .conexgo-dashboard-smart-item[data-masonry-positioned="true"] {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        margin: 0 !important;
    }

    html body.cx-design-system #conexgoDashboardSmartGrid > .conexgo-dashboard-smart-item > .conexgo-dashboard-resizable-card:not(.conexgo-dashboard-minimized-card):not(.conexgo-dashboard-card-closing),
    html body.cx-design-system .conexgo-dashboard-configuration-card:not(.conexgo-dashboard-minimized-card):not(.conexgo-dashboard-card-closing) {
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        resize: none !important;
        overflow: visible !important;
    }

    html body.cx-design-system #conexgoDashboardSmartGrid > .conexgo-dashboard-smart-item:has(> .conexgo-dashboard-minimized-card),
    html body.cx-design-system #conexgoDashboardSmartGrid > .conexgo-dashboard-smart-item:has(> .conexgo-dashboard-card-closing) {
        height: 46px !important;
        min-height: 46px !important;
        max-height: 46px !important;
    }

    html body.cx-design-system #conexgoDashboardSmartGrid > .conexgo-dashboard-smart-item > .conexgo-dashboard-minimized-card,
    html body.cx-design-system #conexgoDashboardSmartGrid > .conexgo-dashboard-smart-item > .conexgo-dashboard-card-closing,
    html body.cx-design-system .conexgo-dashboard-configuration-card.conexgo-dashboard-minimized-card,
    html body.cx-design-system .conexgo-dashboard-configuration-card.conexgo-dashboard-card-closing {
        height: 46px !important;
        min-height: 46px !important;
        max-height: 46px !important;
        overflow: hidden !important;
    }

    html body.cx-design-system .conexgo-dashboard-card-header-surface {
        min-height: 46px !important;
        height: 46px !important;
        padding: 7px 8px 7px 11px !important;
        overflow: hidden !important;
    }

    html body.cx-design-system .conexgo-dashboard-card-header {
        width: 100% !important;
        min-width: 0 !important;
        display: flex !important;
        align-items: center !important;
        gap: 8px !important;
    }

    html body.cx-design-system .conexgo-dashboard-card-title,
    html body.cx-design-system #conexgoDashboardSmartGrid .card-header .card-title {
        min-width: 0 !important;
        max-width: 100% !important;
        flex: 1 1 auto !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
        font-size: 12.75px !important;
        line-height: 1.2 !important;
    }

    html body.cx-design-system .conexgo-dashboard-card-action {
        width: 32px !important;
        min-width: 32px !important;
        height: 32px !important;
        flex: 0 0 32px !important;
    }

    html body.cx-design-system #conexgoDashboardSmartGrid .card-body {
        padding: 10px !important;
    }

    html body.cx-design-system #conexgoDashboardSmartGrid :is(.conexgo-dashboard-resizable-list, .conexgo-dashboard-active-users-list) {
        min-height: 0 !important;
        max-height: min(44dvh, 320px) !important;
        overflow-y: auto !important;
        overscroll-behavior: contain !important;
    }
}

html body.cx-design-system .conexgo-header-notifications .conexgo-notification-dropdown {
    width: 500px !important;
    min-width: 0 !important;
    max-width: calc(100vw - 20px) !important;
    max-height: min(540px, calc(100dvh - 100px)) !important;
    grid-template-rows: auto minmax(0, 1fr) auto !important;
    border: 1px solid #d9e1e8 !important;
    border-radius: 8px !important;
    background: #ffffff !important;
    box-shadow: 0 12px 28px rgba(31, 61, 89, .14) !important;
    overflow: hidden !important;
}

html body.cx-design-system .conexgo-notification-dropdown .conexgo-notification-dropdown-header {
    min-height: 58px !important;
    padding: 10px 12px !important;
    border-bottom: 1px solid #24425e !important;
    background: #2c4c6c !important;
}

html body.cx-design-system .conexgo-notification-dropdown .conexgo-notification-list {
    width: 100% !important;
    min-width: 0 !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    overscroll-behavior: contain !important;
    scrollbar-gutter: stable !important;
    scrollbar-width: thin !important;
}

html body.cx-design-system .conexgo-notification-dropdown .conexgo-notification-item {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    padding: 11px 14px !important;
    overflow: hidden !important;
}

html body.cx-design-system .conexgo-notification-dropdown .conexgo-notification-item-content {
    min-width: 0 !important;
    max-width: 100% !important;
    overflow: hidden !important;
}

html body.cx-design-system .conexgo-notification-dropdown .conexgo-notification-item-title {
    max-width: 100% !important;
    overflow-wrap: anywhere !important;
    word-break: normal !important;
}

html body.cx-design-system .conexgo-notification-dropdown .conexgo-notification-see-all-wrap,
html body.cx-design-system .conexgo-operator-dropdown .conexgo-operator-see-all-wrap,
html body.cx-design-system .conexgo-header-alerts .conexgo-alert-see-all--classic {
    background: #ffffff !important;
    border-top: 1px solid #e1e8ee !important;
}

html body.cx-design-system .conexgo-notification-dropdown .conexgo-notification-see-all,
html body.cx-design-system .conexgo-operator-dropdown .conexgo-operator-see-all,
html body.cx-design-system .conexgo-header-alerts .conexgo-alert-see-all--classic {
    width: 100% !important;
    min-height: 48px !important;
    margin: 0 !important;
    padding: 10px 12px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 7px !important;
    box-sizing: border-box !important;
    background: #ffffff !important;
    color: #244b6a !important;
    font-size: 12.5px !important;
    font-weight: 700 !important;
    text-decoration: none !important;
    transform: none !important;
    transition: background-color .48s cubic-bezier(.22, 1, .36, 1), color .42s ease, box-shadow .48s cubic-bezier(.22, 1, .36, 1) !important;
}

html body.cx-design-system .conexgo-notification-dropdown .conexgo-notification-see-all:is(:hover, :focus-visible),
html body.cx-design-system .conexgo-operator-dropdown .conexgo-operator-see-all:is(:hover, :focus-visible),
html body.cx-design-system .conexgo-header-alerts .conexgo-alert-see-all--classic:is(:hover, :focus-visible) {
    background: #eef4f8 !important;
    color: #24435f !important;
    box-shadow: inset 0 1px 0 rgba(44, 76, 108, .04) !important;
    text-decoration: none !important;
    transform: none !important;
}

html body.cx-design-system .conexgo-notification-dropdown .conexgo-notification-see-all > i,
html body.cx-design-system .conexgo-operator-dropdown .conexgo-operator-see-all > i,
html body.cx-design-system .conexgo-header-alerts .conexgo-alert-see-all--classic > i {
    flex: 0 0 auto !important;
    font-size: 10.5px !important;
    line-height: 1 !important;
}

@media (max-width: 767.98px) {
    html body.cx-design-system .conexgo-header-notifications .conexgo-notification-dropdown,
    html body.cx-design-system .conexgo-header-alerts .conexgo-alert-dropdown {
        width: calc(100vw - 16px) !important;
        min-width: 0 !important;
        max-width: calc(100vw - 16px) !important;
        max-height: min(68dvh, 560px) !important;
        margin-inline: 8px !important;
        overflow: hidden !important;
    }

    html body.cx-design-system .conexgo-notification-dropdown .conexgo-notification-dropdown-header,
    html body.cx-design-system .conexgo-header-alerts .conexgo-alert-dropdown-header--classic {
        min-height: 52px !important;
        padding: 8px 10px !important;
    }

    html body.cx-design-system .conexgo-notification-dropdown .conexgo-notification-item {
        padding: 9px 10px !important;
    }

    html body.cx-design-system .conexgo-notification-dropdown .conexgo-notification-header-title,
    html body.cx-design-system .conexgo-alert-classic-header-title {
        font-size: 14px !important;
    }

    html body.cx-design-system .conexgo-notification-dropdown .conexgo-notification-see-all,
    html body.cx-design-system .conexgo-operator-dropdown .conexgo-operator-see-all,
    html body.cx-design-system .conexgo-header-alerts .conexgo-alert-see-all--classic {
        min-height: 44px !important;
    }
}

html body.cx-design-system .conexgo-header-profile #profile-image {
    width: 40px !important;
    height: 40px !important;
    border: 2px solid #dfe8ef !important;
    border-radius: 999px !important;
    box-shadow: 0 3px 9px rgba(24, 55, 83, .10) !important;
    object-fit: cover !important;
}

html body.cx-design-system .conexgo-header-profile .conexgo-profile-dropdown {
    overflow-x: hidden !important;
    overflow-y: auto !important;
    max-height: min(520px, calc(100dvh - 100px)) !important;
}

@media (max-width: 767.98px) {
    html body.cx-design-system .conexgo-header-profile #profile-image {
        width: 42px !important;
        height: 42px !important;
        border-width: 2px !important;
        box-shadow: 0 3px 10px rgba(24, 55, 83, .12) !important;
    }

    html body.cx-design-system .conexgo-header-profile .conexgo-profile-dropdown {
        width: calc(100vw - 20px) !important;
        min-width: 0 !important;
        max-width: 380px !important;
        max-height: min(70dvh, 560px) !important;
        border-radius: 10px !important;
        overflow-x: hidden !important;
        overflow-y: auto !important;
    }

    html body.cx-design-system .conexgo-header-profile .conexgo-profile-dropdown > div:first-child img {
        width: 58px !important;
        height: 58px !important;
        border-radius: 999px !important;
    }
}

html body.cx-design-system
:is(
    .device-list-action-group,
    .account-list-cell-name .conexgo-row-action-group
) {
    border-radius: 7px !important;
}

html body.cx-design-system
:is(
    .device-list-action-group .device-list-name-button,
    .account-list-cell-name .account-list-name-button
),
html body.cx-design-system
:is(
    .device-list-action-group .device-list-name-button,
    .account-list-cell-name .account-list-name-button
):is(:hover, :focus, :focus-visible, :active) {
    border-radius: 7px 0 0 7px !important;
    background: #f8fafc !important;
    box-shadow: none !important;
    transform: none !important;
}

html body.cx-design-system
:is(
    .device-list-action-group .device-list-action-toggle,
    .account-list-cell-name .conexgo-row-action-toggle
),
html body.cx-design-system
:is(
    .device-list-action-group .device-list-action-toggle,
    .account-list-cell-name .conexgo-row-action-toggle
):is(:hover, :focus, :focus-visible, :active),
html body.cx-design-system
:is(
    .device-list-action-group .device-list-action-toggle,
    .account-list-cell-name .conexgo-row-action-toggle
)[aria-expanded="true"] {
    border-radius: 0 7px 7px 0 !important;
    background: #315f80 !important;
    box-shadow: none !important;
    transform: none !important;
}

html body.cx-design-system
:is(.device-list-action-menu, .conexgo-row-action-menu) {
    padding: 5px !important;
    border: 0 !important;
    border-radius: 7px !important;
    background: #f3f6f8 !important;
    box-shadow: 0 9px 20px rgba(29, 59, 82, .09) !important;
}

html body.cx-design-system
:is(.device-list-action-menu, .conexgo-row-action-menu)
.dropdown-item,
html body.cx-design-system
:is(.device-list-action-menu, .conexgo-row-action-menu)
.dropdown-item:active {
    min-height: 48px !important;
    padding: 10px 13px !important;
    border: 0 !important;
    border-radius: 5px !important;
    background: transparent !important;
    color: #2e506c !important;
    box-shadow: none !important;
    transform: none !important;
    transition: background-color 90ms ease !important;
}

html body.cx-design-system
:is(.device-list-action-menu, .conexgo-row-action-menu)
.dropdown-item:hover {
    border: 0 !important;
    background: #edf2f5 !important;
    color: #2e506c !important;
    box-shadow: none !important;
    transform: none !important;
}

html body.cx-design-system
:is(.device-list-action-menu, .conexgo-row-action-menu)
.dropdown-item:focus-visible {
    border: 0 !important;
    border-radius: 5px !important;
    background: #edf2f5 !important;
    color: #2e506c !important;
    outline: 2px solid rgba(70, 119, 155, .14) !important;
    outline-offset: -2px !important;
    box-shadow: none !important;
    transform: none !important;
}

html body.cx-design-system
#conexgoDashboardSmartGrid
.conexgo-dashboard-primary-filter-row {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    align-items: start !important;
    gap: 10px 14px !important;
    width: 100% !important;
}

html body.cx-design-system
#conexgoDashboardSmartGrid
.conexgo-dashboard-primary-filter-row
> .conexgo-dashboard-filter-field {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-rows: auto auto !important;
    align-items: stretch !important;
    gap: 5px !important;
    min-width: 0 !important;
}

html body.cx-design-system
#conexgoDashboardSmartGrid
.conexgo-dashboard-primary-filter-row
> .conexgo-dashboard-filter-field
> .conexgo-dashboard-filter-label {
    width: 100% !important;
    margin: 0 !important;
    line-height: 1.25 !important;
    white-space: normal !important;
}

html body.cx-design-system
#conexgoDashboardSmartGrid
.conexgo-dashboard-primary-filter-row
> .conexgo-dashboard-filter-field
> :is(.cx-custom-select-root, .cx-control--dashboard-filter) {
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    margin: 0 !important;
}

@media (max-width: 767.98px) {
    html body.cx-design-system
    #conexgoDashboardSmartGrid
    .conexgo-dashboard-primary-filter-row {
        grid-template-columns: minmax(0, 1fr) !important;
        gap: 8px !important;
    }
}

html body.cx-design-system
.mud-dialog.cx-dialog--alert-view
.alert-view-comments-section {
    border-color: #d8bd54 !important;
    border-radius: 9px !important;
    background: #fff8cf !important;
    box-shadow: 0 0 0 2px rgba(205, 168, 51, .08) !important;
    overflow: hidden !important;
}

html body.cx-design-system
.mud-dialog.cx-dialog--alert-view
.alert-view-comments-toggle {
    border-bottom-color: #dfcc7b !important;
    background: #fff2b8 !important;
    color: #2c4c6c !important;
    box-shadow: inset 4px 0 0 #d2aa25 !important;
}

html body.cx-design-system
.mud-dialog.cx-dialog--alert-view
.alert-view-comments-toggle:is(:hover, :focus-visible) {
    background: #fff0ae !important;
    color: #2c4c6c !important;
    box-shadow: inset 4px 0 0 #d2aa25 !important;
    transform: none !important;
}

html body.cx-design-system
.mud-dialog.cx-dialog--alert-view
:is(.alert-view-comments-collapse, .alert-view-comments-collapse-inner, .alert-view-comments-body) {
    background: #fffbe7 !important;
}

html body.cx-design-system
.mud-dialog.cx-dialog--alert-view
.alert-view-comments-empty {
    color: #75673e !important;
}

@media (max-width: 767.98px) {
    html body.cx-design-system .alert-list-card,
    html body.cx-design-system .alert-list-card-body,
    html body.cx-design-system .alert-list-card-body > .table-responsive,
    html body.cx-design-system .alert-list-card-body .dataTables_wrapper,
    html body.cx-design-system .alert-list-card-body .cx-paged-list,
    html body.cx-design-system .alert-list-card-body .conexgo-pagedlist-table-region,
    html body.cx-design-system .alert-list-card-body .conexgo-pagedlist-table-column {
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        box-sizing: border-box !important;
    }

    html body.cx-design-system .alert-list-card-body {
        padding: 8px !important;
    }

    
    html body.cx-design-system .alert-list-card .conexgo-pagedlist-table {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        table-layout: auto !important;
        margin: 0 !important;
    }

    html body.cx-design-system .alert-list-card-body > .table-responsive,
    html body.cx-design-system .alert-list-card .conexgo-pagedlist-table-region,
    html body.cx-design-system .alert-list-card .conexgo-pagedlist-table-column {
        overflow-x: visible !important;
        overflow-y: visible !important;
    }

    
    html body.cx-design-system .alert-list-card :is(
        th.cx-table-column-header--customer,
        th.cx-table-column-header--comment,
        td.alert-list-customer-cell-container,
        td.alert-list-comment-cell
    ) {
        display: none !important;
    }

    html body.cx-design-system .alert-list-card .bstable-actions .btn-list {
        gap: 6px !important;
        flex-wrap: wrap !important;
    }
}

html body.cx-design-system
:is(
    .device-list-action-group,
    .account-list-cell-name .conexgo-row-action-group
) {
    box-shadow: 0 2px 7px rgba(29, 59, 82, .08) !important;
}

html body.cx-design-system
:is(.device-list-action-menu, .conexgo-row-action-menu) {
    box-shadow: 0 6px 16px rgba(29, 59, 82, .10) !important;
}

html body.cx-design-system
:is(.device-list-action-menu, .conexgo-row-action-menu)
.dropdown-item,
html body.cx-design-system
:is(.device-list-action-menu, .conexgo-row-action-menu)
.dropdown-item:hover,
html body.cx-design-system
:is(.device-list-action-menu, .conexgo-row-action-menu)
.dropdown-item:active {
    background: transparent !important;
    color: #2e506c !important;
    transition: none !important;
    transform: none !important;
    box-shadow: none !important;
}

html body.cx-design-system
:is(.device-list-action-menu, .conexgo-row-action-menu)
.dropdown-item:focus-visible {
    background: rgba(49, 95, 128, .045) !important;
    outline: 2px solid rgba(49, 95, 128, .14) !important;
    outline-offset: -2px !important;
}

html body.cx-design-system
#conexgoDashboardSmartGrid
.conexgo-device-status-table tbody tr:hover {
    background: rgba(49, 95, 128, .075) !important;
}

html body.cx-design-system
#conexgoDashboardSmartGrid
[data-dashboard-key="offlineDevices"]
.conexgo-dashboard-offline-period-row {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(230px, .95fr) !important;
    align-items: center !important;
    gap: 12px 18px !important;
    width: 100% !important;
}

html body.cx-design-system
#conexgoDashboardSmartGrid
[data-dashboard-key="offlineDevices"]
.conexgo-dashboard-offline-period-copy {
    min-width: 0 !important;
}

html body.cx-design-system
#conexgoDashboardSmartGrid
[data-dashboard-key="offlineDevices"]
.conexgo-dashboard-offline-period-copy
.conexgo-dashboard-config-section-description {
    margin-top: 3px !important;
    max-width: 38ch !important;
}

html body.cx-design-system
#conexgoDashboardSmartGrid
[data-dashboard-key="offlineDevices"]
.conexgo-dashboard-offline-period-select {
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
}

html body.cx-design-system
.conexgo-header-notifications
.conexgo-notification-dropdown {
    width: 390px !important;
    min-width: min(300px, calc(100vw - 24px)) !important;
    max-width: min(390px, calc(100vw - 24px)) !important;
    max-height: min(440px, calc(100dvh - 104px)) !important;
    box-shadow: 0 9px 22px rgba(31, 61, 89, .12) !important;
}

html body.cx-design-system
.conexgo-notification-dropdown
.conexgo-notification-dropdown-header {
    min-height: 54px !important;
    padding: 8px 10px !important;
}

html body.cx-design-system
.conexgo-notification-dropdown
.conexgo-notification-item {
    padding: 9px 11px !important;
}

html body.cx-design-system
.conexgo-header-notifications
.conexgo-notification-empty {
    min-height: 72px !important;
    padding: 12px !important;
    gap: 6px !important;
}

html body.cx-design-system
.conexgo-notification-dropdown
.conexgo-notification-empty-icon {
    width: 34px !important;
    height: 34px !important;
    font-size: 14px !important;
}

html body.cx-design-system
.conexgo-notification-dropdown
.conexgo-notification-see-all {
    min-height: 48px !important;
    padding: 10px 12px !important;
}

@media (max-width: 767.98px) {
    html body.cx-design-system
    #conexgoDashboardSmartGrid
    [data-dashboard-key="offlineDevices"]
    .conexgo-dashboard-offline-period-row {
        grid-template-columns: minmax(0, 1fr) !important;
        gap: 8px !important;
    }

    html body.cx-design-system
    .conexgo-header-notifications
    .conexgo-notification-dropdown {
        width: calc(100vw - 24px) !important;
        max-width: calc(100vw - 24px) !important;
        max-height: min(58dvh, 440px) !important;
        margin-inline: 12px !important;
    }
}

html body.cx-design-system
:is(
    .device-list-action-group .device-list-name-button,
    .account-list-cell-name .account-list-name-button
),
html body.cx-design-system
:is(
    .device-list-action-group .device-list-name-button,
    .account-list-cell-name .account-list-name-button
):is(:hover, :focus, :focus-visible, :active) {
    background: #ffffff !important;
    border-color: #cbd9e4 !important;
    box-shadow: none !important;
    transform: none !important;
    filter: none !important;
}

html body.cx-design-system
:is(
    .device-list-action-group,
    .account-list-cell-name .conexgo-row-action-group
) {
    background: #ffffff !important;
    box-shadow: 0 2px 7px rgba(29, 59, 82, .08) !important;
}

html body.cx-design-system
:is(.device-list-action-menu, .conexgo-row-action-menu) {
    background: #ffffff !important;
    border: 1px solid #d7e2ea !important;
    box-shadow: 0 8px 18px rgba(29, 59, 82, .10) !important;
}

html body.cx-design-system
:is(.device-list-action-menu, .conexgo-row-action-menu)
.dropdown-item,
html body.cx-design-system
:is(.device-list-action-menu, .conexgo-row-action-menu)
.dropdown-item:hover,
html body.cx-design-system
:is(.device-list-action-menu, .conexgo-row-action-menu)
.dropdown-item:active {
    background: #ffffff !important;
    color: #2e506c !important;
    border-color: transparent !important;
    box-shadow: none !important;
    transform: none !important;
    filter: none !important;
    transition: none !important;
}

html body.cx-design-system
:is(.device-list-action-menu, .conexgo-row-action-menu)
.dropdown-item:focus-visible {
    background: #f7fafc !important;
    color: #2e506c !important;
    outline: 1px solid #c7d7e3 !important;
    outline-offset: -1px !important;
    box-shadow: none !important;
}

html body.cx-design-system .cx-custom-select-trigger {
    background: #ffffff !important;
    border-color: #cfdae3 !important;
    box-shadow: 0 1px 4px rgba(29, 59, 82, .045) !important;
    transform: none !important;
    filter: none !important;
    transition: border-color 120ms ease, box-shadow 120ms ease !important;
}

html body.cx-design-system .cx-custom-select-trigger:hover:not(:disabled) {
    background: #ffffff !important;
    border-color: #c5d3de !important;
    box-shadow: 0 2px 6px rgba(29, 59, 82, .055) !important;
    transform: none !important;
    filter: none !important;
}

html body.cx-design-system
.cx-custom-select-trigger:hover:not(:disabled)
.cx-custom-select-chevron {
    background: #f3f7fa !important;
    border-color: #d2dfe8 !important;
    color: #315c7c !important;
    box-shadow: none !important;
    transform: none !important;
}

html body.cx-design-system
.conexgo-header-alerts
.conexgo-alert-dropdown-header--classic {
    min-height: 62px !important;
    padding: 9px 11px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 10px !important;
    background: #2c4c6c !important;
    border-bottom: 1px solid #24425e !important;
}

html body.cx-design-system .conexgo-alert-header-main {
    min-width: 0 !important;
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
}

html body.cx-design-system .conexgo-alert-header-icon {
    width: 38px !important;
    height: 38px !important;
    flex: 0 0 38px !important;
    display: inline-grid !important;
    place-items: center !important;
    border: 1px solid rgba(255, 255, 255, .22) !important;
    border-radius: 8px !important;
    background: rgba(255, 255, 255, .09) !important;
    color: #ffffff !important;
    font-size: 15px !important;
}

html body.cx-design-system .conexgo-alert-header-title-wrap {
    min-width: 0 !important;
}

html body.cx-design-system .conexgo-alert-header-title {
    color: #ffffff !important;
    font-size: 15px !important;
    font-weight: 720 !important;
    line-height: 1.15 !important;
}

html body.cx-design-system .conexgo-alert-header-meta {
    margin-top: 2px !important;
    color: rgba(255, 255, 255, .84) !important;
    font-size: 11.5px !important;
    font-weight: 500 !important;
    line-height: 1.2 !important;
}

html body.cx-design-system .conexgo-alert-header-actions {
    flex: 0 0 auto !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 7px !important;
}

html body.cx-design-system .conexgo-alert-header-count {
    min-width: 28px !important;
    height: 28px !important;
    padding: 0 7px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 999px !important;
    color: #ffffff !important;
    font-size: 11px !important;
    font-weight: 750 !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, .10) !important;
}

html body.cx-design-system .conexgo-alert-classic-clear-all {
    min-height: 32px !important;
    padding: 0 10px !important;
    border-radius: 6px !important;
}

html body.cx-design-system .app-header-modern .topbar-version-pill {
    min-width: 132px !important;
    height: 40px !important;
    padding: 0 10px !important;
    border-color: #d7e2ea !important;
    border-radius: 10px !important;
    background: #ffffff !important;
    box-shadow: 0 2px 7px rgba(29, 59, 82, .055) !important;
}

html body.cx-design-system .app-header-modern .topbar-version-icon {
    width: 29px !important;
    height: 29px !important;
    flex: 0 0 29px !important;
    border-radius: 8px !important;
    background: #f0f5f8 !important;
}

html body.cx-design-system .app-header-modern .topbar-version-content {
    flex: 1 1 auto !important;
    min-width: 0 !important;
}

@media (max-width: 575.98px) {
    html body.cx-design-system .app-header-modern .topbar-version-pill {
        width: clamp(108px, 31vw, 132px) !important;
        min-width: 108px !important;
        max-width: 132px !important;
        height: 38px !important;
        padding-inline: 8px !important;
        gap: 6px !important;
    }

    html body.cx-design-system .app-header-modern .topbar-version-icon {
        width: 28px !important;
        height: 28px !important;
        flex-basis: 28px !important;
    }

    html body.cx-design-system .app-header-modern .topbar-version-label {
        font-size: 9.5px !important;
    }

    html body.cx-design-system .app-header-modern .topbar-version-value {
        font-size: 12.5px !important;
    }
}

@media (max-width: 767.98px) {
    html body.cx-design-system #conexgoDashboardSmartGrid.conexgo-dashboard-content-grid {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
        gap: 10px !important;
        align-items: start !important;
        width: 100% !important;
    }

    html body.cx-design-system #conexgoDashboardSmartGrid > .conexgo-dashboard-smart-item,
    html body.cx-design-system #conexgoDashboardSmartGrid > .conexgo-dashboard-smart-item[data-masonry-positioned="true"] {
        position: static !important;
        inset: auto !important;
        transform: none !important;
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        margin: 0 !important;
    }

    html body.cx-design-system #conexgoDashboardSmartGrid > .conexgo-dashboard-smart-item:has(> .conexgo-dashboard-minimized-card),
    html body.cx-design-system #conexgoDashboardSmartGrid > .conexgo-dashboard-smart-item:has(> .conexgo-dashboard-card-closing) {
        height: 54px !important;
        min-height: 54px !important;
        max-height: 54px !important;
    }

    html body.cx-design-system #conexgoDashboardSmartGrid > .conexgo-dashboard-smart-item > .conexgo-dashboard-minimized-card,
    html body.cx-design-system #conexgoDashboardSmartGrid > .conexgo-dashboard-smart-item > .conexgo-dashboard-card-closing,
    html body.cx-design-system .conexgo-dashboard-configuration-card.conexgo-dashboard-minimized-card,
    html body.cx-design-system .conexgo-dashboard-configuration-card.conexgo-dashboard-card-closing {
        height: 54px !important;
        min-height: 54px !important;
        max-height: 54px !important;
        border-radius: 11px !important;
        overflow: hidden !important;
        box-shadow: 0 2px 7px rgba(35, 65, 90, .065) !important;
    }

    html body.cx-design-system #conexgoDashboardSmartGrid .conexgo-dashboard-card-header-surface,
    html body.cx-design-system .conexgo-dashboard-configuration-card .conexgo-dashboard-card-header-surface {
        width: 100% !important;
        min-width: 0 !important;
        height: 54px !important;
        min-height: 54px !important;
        max-height: 54px !important;
        padding: 0 8px 0 13px !important;
        display: flex !important;
        align-items: center !important;
        overflow: hidden !important;
    }

    html body.cx-design-system #conexgoDashboardSmartGrid .conexgo-dashboard-card-header,
    html body.cx-design-system .conexgo-dashboard-configuration-card .conexgo-dashboard-card-header {
        width: 100% !important;
        min-width: 0 !important;
        height: 100% !important;
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        gap: 8px !important;
    }

    html body.cx-design-system #conexgoDashboardSmartGrid .conexgo-dashboard-card-title,
    html body.cx-design-system .conexgo-dashboard-configuration-card .conexgo-dashboard-card-title {
        min-width: 0 !important;
        margin: 0 !important;
        display: block !important;
        color: inherit !important;
        font-size: 12.5px !important;
        font-weight: 720 !important;
        line-height: 1.2 !important;
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
    }

    html body.cx-design-system #conexgoDashboardSmartGrid .conexgo-dashboard-card-action,
    html body.cx-design-system .conexgo-dashboard-configuration-card .conexgo-dashboard-card-action {
        width: 36px !important;
        min-width: 36px !important;
        height: 36px !important;
        min-height: 36px !important;
        flex: 0 0 36px !important;
        margin: 0 !important;
    }

    html body.cx-design-system #conexgoDashboardSmartGrid > .conexgo-dashboard-smart-item > .conexgo-dashboard-resizable-card:not(.conexgo-dashboard-minimized-card):not(.conexgo-dashboard-card-closing) {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        overflow: hidden !important;
        resize: none !important;
    }

    html body.cx-design-system #conexgoDashboardSmartGrid > .conexgo-dashboard-smart-item > .conexgo-dashboard-resizable-card:not(.conexgo-dashboard-minimized-card):not(.conexgo-dashboard-card-closing) > .card-body {
        min-height: 0 !important;
        max-height: none !important;
        overflow: visible !important;
    }
}

html body.cx-design-system .mud-dialog.cx-dialog-root.cx-dialog--document-view {
    width: min(1120px, calc(100vw - 40px)) !important;
    max-width: min(1120px, calc(100vw - 40px)) !important;
    max-height: calc(100dvh - 32px) !important;
}

html body.cx-design-system .mud-dialog.cx-dialog-root.cx-dialog--document-view .mud-dialog-content {
    padding: 10px 12px !important;
}

html body.cx-design-system .mud-dialog.cx-dialog-root.cx-dialog--document-view .cx-modal-layout-v21 {
    gap: 8px !important;
}

html body.cx-design-system .mud-dialog.cx-dialog-root.cx-dialog--document-view .cx-r1-section {
    padding: 14px !important;
}

html body.cx-design-system .mud-dialog.cx-dialog-root.cx-dialog--document-view .cx-r1-section-description {
    margin: 4px 0 10px !important;
}

html body.cx-design-system .mud-dialog.cx-dialog-root.cx-dialog--document-view .conexgo-document-view-header {
    margin: 0 0 8px !important;
}

html body.cx-design-system .mud-dialog.cx-dialog-root.cx-dialog--document-view .conexgo-document-view-title {
    margin: 0 !important;
    font-size: 1.45rem !important;
    line-height: 1.2 !important;
}

html body.cx-design-system .mud-dialog.cx-dialog-root.cx-dialog--document-view .conexgo-document-view-description {
    margin-top: 4px !important;
}

html body.cx-design-system .mud-dialog.cx-dialog-root.cx-dialog--document-view .conexgo-document-resize-shell {
    height: min(60dvh, 680px) !important;
    min-height: 400px !important;
    max-height: 680px !important;
    border-radius: 8px !important;
}

html body.cx-design-system .mud-dialog.cx-dialog-root.cx-r1-document-delete {
    width: min(820px, calc(100vw - 40px)) !important;
    max-width: min(820px, calc(100vw - 40px)) !important;
}

html body.cx-design-system .mud-dialog.cx-dialog-root.cx-r1-document-addedit {
    width: min(900px, calc(100vw - 40px)) !important;
    max-width: min(900px, calc(100vw - 40px)) !important;
}

html body.cx-design-system .mud-dialog.cx-dialog-root:is(.cx-r1-document-delete, .cx-r1-document-addedit) .mud-dialog-content {
    padding: 12px 14px !important;
}

@media (max-width: 767.98px) {
    html body.cx-design-system .mud-dialog.cx-dialog-root:is(.cx-dialog--document-view, .cx-r1-document-delete, .cx-r1-document-addedit) {
        width: calc(100vw - 12px) !important;
        max-width: calc(100vw - 12px) !important;
        margin: 6px !important;
    }

    html body.cx-design-system .mud-dialog.cx-dialog-root.cx-dialog--document-view .conexgo-document-resize-shell {
        height: 54dvh !important;
        min-height: 300px !important;
        max-height: 58dvh !important;
    }
}

html body.cx-design-system textarea:not([readonly]):not(:disabled):not(.note-codable):not(.fr-code),
html body.cx-design-system .mud-input-slot textarea:not([readonly]):not(:disabled),
html body.cx-design-system .mud-input-control textarea:not([readonly]):not(:disabled),
html body.cx-design-system .cx-dialog-textarea:not([readonly]):not(:disabled),
html body.cx-design-system .notification-message-textarea:not([readonly]):not(:disabled) {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    resize: vertical !important;
    overflow: auto !important;
}

html body .mud-dialog.cx-r1-notification-addedit {
    --cx-notification-field-max: 780px;
}

html body .mud-dialog.cx-r1-notification-addedit .notification-priority-field,
html body .mud-dialog.cx-r1-notification-addedit .cx-r1-form-row > .col-md-9,
html body .mud-dialog.cx-r1-notification-addedit .cx-r1-form-row > [class*="col-"]:last-child {
    width: min(100%, var(--cx-notification-field-max)) !important;
    max-width: var(--cx-notification-field-max) !important;
    min-width: 0 !important;
}

html body .mud-dialog.cx-r1-notification-addedit :is(.form-control, .form-select, .cx-custom-select, .cx-control, .cx-datepicker) {
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    box-sizing: border-box !important;
}

html body .cx-notification-view-dialog .notification-view-form {
    width: min(100%, 900px) !important;
    margin-inline: auto !important;
    display: grid !important;
    gap: 12px !important;
}

html body .cx-notification-view-dialog .notification-view-block {
    margin: 0 !important;
}

html body .cx-notification-view-dialog .notification-view-block-label {
    margin-bottom: 6px !important;
    color: #4e6478 !important;
    font-size: .76rem !important;
    font-weight: 800 !important;
    letter-spacing: .035em !important;
    text-transform: uppercase !important;
}

html body .cx-notification-view-dialog .notification-view-priority-card,
html body .cx-notification-view-dialog .notification-view-title-box,
html body .cx-notification-view-dialog .notification-view-message-box {
    border-color: #d5e0e9 !important;
    border-radius: 9px !important;
    box-shadow: 0 2px 8px rgba(39, 67, 94, .045) !important;
}

html body .cx-notification-view-dialog .notification-view-priority-card {
    min-height: 58px !important;
    padding: 10px 13px !important;
}

html body .cx-notification-view-dialog .notification-view-priority-icon {
    width: 38px !important;
    min-width: 38px !important;
    height: 38px !important;
}

html body .cx-notification-view-dialog .notification-view-title-box {
    min-height: 46px !important;
    display: flex !important;
    align-items: center !important;
    padding: 10px 13px !important;
    background: #f7fafc !important;
}

html body .cx-notification-view-dialog .notification-view-message-box {
    min-height: 112px !important;
    max-height: 260px !important;
    padding: 13px 15px !important;
    background: #fff !important;
    line-height: 1.55 !important;
}

html body .cx-notification-view-dialog .notification-view-acknowledged {
    min-height: 40px !important;
    padding: 8px 12px !important;
    border-radius: 9px !important;
}

html body .mud-dialog.cx-r1816-blocknotice .cx-r1876-blocknotice-action-control,
html body .mud-dialog.cx-r1816-blocknotice .cx-r1876-blocknotice-action-control > *,
html body .mud-dialog.cx-r1816-blocknotice .cx-r1-form-row > .col-md-9 > .cx-custom-select {
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
}

@media (max-width: 767.98px) {
    html body .conexgo-dashboard-smart-grid,
    html body .cx-dashboard-grid,
    html body .conexgo-dashboard-smart-grid.cx-dashboard-priority-order {
        grid-template-columns: minmax(0, 1fr) !important;
        grid-auto-rows: auto !important;
        align-items: start !important;
        gap: 12px !important;
    }

    html body .conexgo-dashboard-smart-item,
    html body .conexgo-dashboard-smart-item > .card,
    html body .conexgo-dashboard-resizable-card:not(.conexgo-dashboard-minimized-card) {
        width: 100% !important;
        min-width: 0 !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
    }

    html body .conexgo-dashboard-resizable-card:not(.conexgo-dashboard-minimized-card) > .card-body {
        height: auto !important;
        max-height: none !important;
    }

    html body .conexgo-dashboard-resizable-card .conexgo-dashboard-resizable-list {
        max-height: min(42dvh, 360px) !important;
    }

    html body .conexgo-dashboard-configuration-card.conexgo-dashboard-minimized-card,
    html body .conexgo-dashboard-smart-item .conexgo-dashboard-minimized-card {
        height: 54px !important;
        min-height: 54px !important;
        max-height: 54px !important;
        overflow: hidden !important;
    }
}

@media (min-width: 768px) and (max-width: 1023.98px) {
    html body .conexgo-dashboard-smart-item > .conexgo-dashboard-resizable-card:not(.conexgo-dashboard-minimized-card) {
        height: auto !important;
        max-height: none !important;
    }
}

html body.cx-design-system
:is(
    .device-list-action-menu,
    .conexgo-row-action-menu,
    .conexgo-account-document-menu
).show
.dropdown-item,
html body.cx-design-system
.conexgo-pagedlist-table
.dropdown-menu.show
.dropdown-item,
html body.cx-design-system
.account-list-cell-name
.dropdown-menu.show
.dropdown-item {
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    border-color: transparent !important;
    box-shadow: none !important;
    filter: none !important;
    transform: none !important;
    transition: none !important;
}

html body.cx-design-system
:is(
    .device-list-action-menu,
    .conexgo-row-action-menu,
    .conexgo-account-document-menu
).show
.dropdown-item:hover,
html body.cx-design-system
:is(
    .device-list-action-menu,
    .conexgo-row-action-menu,
    .conexgo-account-document-menu
).show
.dropdown-item:active,
html body.cx-design-system
.conexgo-pagedlist-table
.dropdown-menu.show
.dropdown-item:hover,
html body.cx-design-system
.conexgo-pagedlist-table
.dropdown-menu.show
.dropdown-item:active,
html body.cx-design-system
.account-list-cell-name
.dropdown-menu.show
.dropdown-item:hover,
html body.cx-design-system
.account-list-cell-name
.dropdown-menu.show
.dropdown-item:active {
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    border-color: transparent !important;
    color: #294b68 !important;
    outline: none !important;
    box-shadow: none !important;
    filter: none !important;
    transform: none !important;
}

html body.cx-design-system
:is(
    .device-list-action-menu,
    .conexgo-row-action-menu,
    .conexgo-account-document-menu
).show
.dropdown-item:focus:not(:focus-visible),
html body.cx-design-system
.conexgo-pagedlist-table
.dropdown-menu.show
.dropdown-item:focus:not(:focus-visible),
html body.cx-design-system
.account-list-cell-name
.dropdown-menu.show
.dropdown-item:focus:not(:focus-visible) {
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    border-color: transparent !important;
    color: #294b68 !important;
    outline: none !important;
    box-shadow: none !important;
    filter: none !important;
    transform: none !important;
}

html body.cx-design-system
:is(
    .device-list-action-menu,
    .conexgo-row-action-menu,
    .conexgo-account-document-menu
).show
.dropdown-item:focus-visible,
html body.cx-design-system
.conexgo-pagedlist-table
.dropdown-menu.show
.dropdown-item:focus-visible,
html body.cx-design-system
.account-list-cell-name
.dropdown-menu.show
.dropdown-item:focus-visible {
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    border-color: rgba(62, 106, 153, .24) !important;
    color: #294b68 !important;
    outline: 1px solid rgba(62, 106, 153, .24) !important;
    outline-offset: -2px !important;
    box-shadow: none !important;
    filter: none !important;
    transform: none !important;
}

html body.cx-design-system
:is(
    .device-list-action-menu,
    .conexgo-row-action-menu,
    .conexgo-account-document-menu
).show
.dropdown-item:hover::before,
html body.cx-design-system
:is(
    .device-list-action-menu,
    .conexgo-row-action-menu,
    .conexgo-account-document-menu
).show
.dropdown-item:hover::after,
html body.cx-design-system
.conexgo-pagedlist-table
.dropdown-menu.show
.dropdown-item:hover::before,
html body.cx-design-system
.conexgo-pagedlist-table
.dropdown-menu.show
.dropdown-item:hover::after,
html body.cx-design-system
.account-list-cell-name
.dropdown-menu.show
.dropdown-item:hover::before,
html body.cx-design-system
.account-list-cell-name
.dropdown-menu.show
.dropdown-item:hover::after {
    opacity: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    filter: none !important;
    transform: none !important;
}

html body.cx-design-system
:is(
    .device-list-action-menu,
    .conexgo-row-action-menu,
    .conexgo-account-document-menu
).show
.dropdown-item:hover
> :is(i, span[class*="fa"]),
html body.cx-design-system
.conexgo-pagedlist-table
.dropdown-menu.show
.dropdown-item:hover
> :is(i, span[class*="fa"]),
html body.cx-design-system
.account-list-cell-name
.dropdown-menu.show
.dropdown-item:hover
> :is(i, span[class*="fa"]) {
    color: #5b82a1 !important;
    filter: none !important;
    transform: none !important;
}

html body.cx-design-system :is(.cx-dialog--alert-answer, .cx-dialog--alert-view) .cx-alert-comment-day {
    display: grid !important;
    gap: 7px !important;
    padding: 11px 14px !important;
    border-bottom: 1px solid rgba(205, 169, 55, .28) !important;
}

html body.cx-design-system :is(.cx-dialog--alert-answer, .cx-dialog--alert-view) .cx-alert-comment-day:last-child {
    border-bottom: 0 !important;
}

html body.cx-design-system :is(.cx-dialog--alert-answer, .cx-dialog--alert-view) .cx-alert-comment-date {
    width: fit-content !important;
    padding: 3px 8px !important;
    border: 1px solid rgba(164, 125, 16, .20) !important;
    border-radius: 6px !important;
    background: rgba(255,255,255,.55) !important;
    color: #775d13 !important;
    font-size: 11.5px !important;
    font-weight: 800 !important;
    letter-spacing: .025em !important;
    line-height: 1.25 !important;
}

html body.cx-design-system :is(.cx-dialog--alert-answer, .cx-dialog--alert-view) .cx-alert-comment-entry {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    align-items: baseline !important;
    gap: 10px 18px !important;
    min-width: 0 !important;
}

html body.cx-design-system :is(.cx-dialog--alert-answer, .cx-dialog--alert-view) .cx-alert-comment-text {
    min-width: 0 !important;
    color: #263f55 !important;
    font-size: 13.5px !important;
    line-height: 1.45 !important;
    white-space: pre-wrap !important;
    overflow-wrap: anywhere !important;
}

html body.cx-design-system :is(.cx-dialog--alert-answer, .cx-dialog--alert-view) .cx-alert-comment-meta {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 7px !important;
    color: #687a88 !important;
    font-size: 11.5px !important;
    line-height: 1.3 !important;
    white-space: nowrap !important;
}

html body.cx-design-system :is(.cx-dialog--alert-answer, .cx-dialog--alert-view) .cx-alert-comment-meta strong {
    color: #315a7d !important;
    font-style: italic !important;
    font-weight: 750 !important;
}

html body.cx-design-system .cx-dialog--alert-answer .alert-answer-comment-card,
html body.cx-design-system .cx-dialog--alert-view .alert-view-comments-section {
    border: 1px solid #dfc35a !important;
    border-radius: 12px !important;
    background: #fff9df !important;
    box-shadow: 0 2px 10px rgba(117, 91, 19, .055) !important;
    overflow: hidden !important;
}

html body.cx-design-system .cx-dialog--alert-answer .alert-answer-comment-header,
html body.cx-design-system .cx-dialog--alert-view .alert-view-comments-toggle {
    min-height: 50px !important;
    padding: 9px 12px !important;
    border: 0 !important;
    border-bottom: 1px solid rgba(203, 164, 45, .30) !important;
    background: #fff3b8 !important;
    color: #2c4c6c !important;
    box-shadow: inset 3px 0 0 #d4ac2d !important;
    transform: none !important;
}

html body.cx-design-system .cx-dialog--alert-answer .alert-answer-comment-collapse-inner,
html body.cx-design-system .cx-dialog--alert-answer .alert-answer-comment-history,
html body.cx-design-system .cx-dialog--alert-view :is(.alert-view-comments-collapse-inner,.alert-view-comments-body) {
    background: #fff9df !important;
}

html body.cx-design-system .cx-dialog--alert-answer .alert-answer-comment-editor {
    padding: 12px !important;
    border-top: 1px solid rgba(203, 164, 45, .24) !important;
    background: rgba(255,255,255,.48) !important;
}

html body.cx-design-system :is(.alert-answer-count,.alert-view-count-badge) {
    min-width: 26px !important;
    height: 26px !important;
    padding: 0 7px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 999px !important;
    background: #e94c43 !important;
    color: #fff !important;
    font-size: 12px !important;
    font-weight: 800 !important;
    box-shadow: 0 2px 5px rgba(158,47,42,.18) !important;
}

@media (max-width: 650px) {
    html body.cx-design-system :is(.cx-dialog--alert-answer, .cx-dialog--alert-view) .cx-alert-comment-entry {
        grid-template-columns: minmax(0,1fr) !important;
        gap: 4px !important;
    }
    html body.cx-design-system :is(.cx-dialog--alert-answer, .cx-dialog--alert-view) .cx-alert-comment-meta {
        justify-content: flex-start !important;
    }
}

html body .conexgo-alert-classic-action.is-answer {
    min-width: 96px !important;
    min-height: 42px !important;
    padding: 0 14px !important;
    gap: 7px !important;
    border: 1px solid #78B842 !important;
    background: #78B842 !important;
    color: #fff !important;
    border-radius: 7px !important;
    font-weight: 750 !important;
}
html body .conexgo-alert-classic-action.is-clear,
html body .conexgo-alert-classic-clear-all {
    min-height: 42px !important;
    padding: 0 13px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 7px !important;
    border: 1px solid #3E6A99 !important;
    background: #3E6A99 !important;
    color: #fff !important;
    border-radius: 7px !important;
    font-weight: 750 !important;
    box-shadow: none !important;
}
html body .conexgo-alert-classic-action.is-answer:is(:hover,:focus-visible) {
    background: #6eaa3b !important;
    border-color: #6eaa3b !important;
    transform: none !important;
}
html body :is(.conexgo-alert-classic-action.is-clear,.conexgo-alert-classic-clear-all):is(:hover,:focus-visible) {
    background: #355f8d !important;
    border-color: #355f8d !important;
    transform: none !important;
}

html body.cx-design-system .device-list-action-menu.show {
    max-height: min(390px, calc(100dvh - 150px)) !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    overscroll-behavior: contain !important;
    scrollbar-width: thin !important;
    border-radius: 10px !important;
}
html body.cx-design-system .device-list-action-menu.show .dropdown-item:hover {
    background: #f7f9fb !important;
    color: #294b68 !important;
    box-shadow: none !important;
    transform: none !important;
}

html body.cx-design-system .mud-dialog.cx-dialog--document-view .conexgo-document-view-header {
    margin: 2px 0 12px !important;
    padding: 12px 14px !important;
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    border: 1px solid #d8e4ec !important;
    border-radius: 10px !important;
    background: #f8fbfd !important;
}
html body.cx-design-system .mud-dialog.cx-dialog--document-view .conexgo-document-view-filemark {
    width: 44px !important;
    min-width: 44px !important;
    height: 44px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border: 1px solid #d2e1eb !important;
    border-radius: 9px !important;
    background: #edf5fa !important;
    color: #386b90 !important;
    font-size: 18px !important;
}
html body.cx-design-system .mud-dialog.cx-dialog--document-view .conexgo-document-view-identity {
    min-width: 0 !important;
}
html body.cx-design-system .mud-dialog.cx-dialog--document-view .conexgo-document-view-eyebrow {
    display: block !important;
    margin-bottom: 2px !important;
    color: #6a8091 !important;
    font-size: 10.5px !important;
    font-weight: 800 !important;
    letter-spacing: .08em !important;
}
html body.cx-design-system .mud-dialog.cx-dialog--document-view .conexgo-document-view-title {
    margin: 0 !important;
    color: #234a69 !important;
    font-size: 18px !important;
    font-weight: 760 !important;
    line-height: 1.25 !important;
    overflow-wrap: anywhere !important;
}
html body.cx-design-system .mud-dialog.cx-dialog--document-view .conexgo-document-view-description {
    margin-top: 3px !important;
    color: #65798a !important;
    font-size: 12.5px !important;
    line-height: 1.35 !important;
}
html body.cx-design-system .mud-dialog.cx-dialog--document-view .conexgo-document-image-stage {
    height: 100% !important;
    padding: 16px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    overflow: auto !important;
    background: #263039 !important;
}
html body.cx-design-system .mud-dialog.cx-dialog--document-view .conexgo-document-image-preview {
    max-width: 100% !important;
    max-height: 100% !important;
    object-fit: contain !important;
    border-radius: 4px !important;
}

html body .cx-account-alert-documents-section {
    margin-top: 16px !important;
    padding-top: 16px !important;
    border-top: 1px solid #dfe8ee !important;
}
html body .cx-alert-documents-manager-head {
    display: flex !important;
    align-items: flex-start !important;
    justify-content: space-between !important;
    gap: 14px !important;
    margin-bottom: 10px !important;
}
html body .cx-alert-documents-manager-title {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    color: #2d5877 !important;
    font-size: 14px !important;
    font-weight: 800 !important;
}
html body .cx-alert-documents-manager-description {
    max-width: 760px !important;
    margin-top: 3px !important;
    color: #6a7e8e !important;
    font-size: 12px !important;
    line-height: 1.4 !important;
}
html body .cx-alert-documents-add {
    min-height: 38px !important;
    padding: 0 12px !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 7px !important;
    border: 1px solid #3E6A99 !important;
    border-radius: 8px !important;
    background: #3E6A99 !important;
    color: #fff !important;
    font-weight: 700 !important;
    white-space: nowrap !important;
}
html body .cx-alert-documents-manager-list {
    display: grid !important;
    gap: 7px !important;
}
html body .cx-alert-document-manager-row {
    min-height: 56px !important;
    padding: 7px 9px !important;
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    border: 1px solid #dce6ed !important;
    border-radius: 9px !important;
    background: #fff !important;
}
html body .cx-alert-document-manager-row.is-selected {
    border-color: #a9c8b1 !important;
    background: #f5fbf6 !important;
}
html body .cx-alert-document-selector {
    min-width: 0 !important;
    flex: 1 1 auto !important;
    display: flex !important;
    align-items: center !important;
    gap: 9px !important;
    cursor: pointer !important;
}
html body .cx-alert-document-selector > input { position: absolute !important; opacity: 0 !important; pointer-events: none !important; }
html body .cx-alert-document-check {
    width: 22px !important; height: 22px !important; display:inline-flex !important;align-items:center !important;justify-content:center !important;
    border:1px solid #b8cad6 !important;border-radius:6px !important;background:#fff !important;color:transparent !important;
}
html body .cx-alert-document-manager-row.is-selected .cx-alert-document-check { background:#78B842 !important;border-color:#78B842 !important;color:#fff !important; }
html body .cx-alert-document-file-icon { width:34px !important;height:34px !important;display:inline-flex !important;align-items:center !important;justify-content:center !important;border-radius:8px !important;background:#edf4f8 !important;color:#386b90 !important; }
html body .cx-alert-document-copy { min-width:0 !important;display:grid !important;gap:2px !important; }
html body .cx-alert-document-copy strong { color:#294b68 !important;font-size:13px !important;overflow-wrap:anywhere !important; }
html body .cx-alert-document-copy small { color:#708391 !important;font-size:11.5px !important;overflow-wrap:anywhere !important; }
html body .cx-alert-document-row-actions { display:inline-flex !important;gap:5px !important; }
html body .cx-alert-document-row-actions button { width:34px !important;height:34px !important;display:inline-flex !important;align-items:center !important;justify-content:center !important;border:1px solid #d5e1e9 !important;border-radius:7px !important;background:#fff !important;color:#3E6A99 !important; }
html body .cx-alert-documents-empty { min-height:70px !important;display:flex !important;align-items:center !important;justify-content:center !important;gap:8px !important;border:1px dashed #d5e1e9 !important;border-radius:9px !important;background:#fafcfd !important;color:#718492 !important; }

html body .cx-alert-documents-toggle-row { display:inline-flex !important; }
html body .alert-answer-toggle-documents { border-color:#b9d2e4 !important;background:#f3f8fc !important;color:#2d5d7e !important; }
html body .cx-alert-documents-count { min-width:22px !important;height:22px !important;padding:0 6px !important;display:inline-flex !important;align-items:center !important;justify-content:center !important;border-radius:999px !important;background:#3E6A99 !important;color:#fff !important;font-size:11px !important;font-weight:800 !important; }
html body .cx-alert-documents-preview-list { margin-top:8px !important;display:grid !important;grid-template-columns:repeat(auto-fit,minmax(220px,1fr)) !important;gap:8px !important; }
html body .cx-alert-document-preview-card { min-width:0 !important;padding:10px !important;display:grid !important;grid-template-columns:38px minmax(0,1fr) auto !important;align-items:center !important;gap:9px !important;border:1px solid #d8e5ed !important;border-radius:9px !important;background:#fff !important;color:#294b68 !important;text-align:left !important;box-shadow:none !important; }
html body .cx-alert-document-preview-card:hover { background:#f8fbfd !important;border-color:#c7d9e5 !important;transform:none !important; }
html body .cx-alert-document-preview-icon { width:38px !important;height:38px !important;display:flex !important;align-items:center !important;justify-content:center !important;border-radius:8px !important;background:#edf5fa !important;color:#386b90 !important; }
html body .cx-alert-document-preview-copy { min-width:0 !important;display:grid !important;gap:2px !important; }
html body .cx-alert-document-preview-copy strong { overflow-wrap:anywhere !important; }
html body .cx-alert-document-preview-copy small { color:#718492 !important;font-size:11px !important;overflow-wrap:anywhere !important; }
html body .cx-alert-document-preview-action { display:inline-flex !important;align-items:center !important;gap:5px !important;color:#3E6A99 !important;font-size:11.5px !important;font-weight:750 !important; }
html body .alert-view-secondary-actions { margin:10px 0 !important; }

html body.cx-design-system .mud-dialog.cx-r1-device-addedit .cx-r1-form-row > .col-md-9,
html body.cx-design-system .mud-dialog.cx-r1-device-addedit .cx-r1-form-row > [class*="col-"]:last-child {
    min-width: 0 !important;
}
html body.cx-design-system .mud-dialog.cx-r1-device-addedit :is(.cx-custom-select-root,.cx-control-field,.cx-control--form,.form-control) {
    width: 100% !important;
    max-width: none !important;
    box-sizing: border-box !important;
}
html body.cx-design-system .mud-dialog.cx-r1-device-addedit :is(.cx-custom-select-trigger.cx-control--form,.form-control:not(textarea),.cx-r1-readonly-value) {
    min-height: 54px !important;
}
html body.cx-design-system .mud-dialog.cx-r1-device-addedit .cx-r1-readonly-value,
html body.cx-design-system .cx-standard-form-dialog :is(input.form-control[readonly],textarea.form-control[readonly],.cx-readonly-value) {
    border: 1px solid #cddce6 !important;
    border-left: 3px solid #9bb8cc !important;
    border-radius: 9px !important;
    background: #f5f9fc !important;
    color: #284963 !important;
    box-shadow: none !important;
    opacity: 1 !important;
}
html body .cx-dated-notes-helper { display:block !important;margin-top:5px !important;color:#738694 !important;font-size:11.5px !important;line-height:1.35 !important; }
html body .cx-device-emergency-editor-launch { display:flex !important;justify-content:flex-end !important;margin:0 0 12px !important; }
html body .cx-device-emergency-editor-button { min-height:38px !important;padding:0 12px !important;display:inline-flex !important;align-items:center !important;gap:7px !important;border:1px solid #aac7dc !important;border-radius:8px !important;background:#f3f8fc !important;color:#2d5d7e !important;font-weight:700 !important; }
html body .cx-device-emergency-editor-grid { display:grid !important;grid-template-columns:repeat(2,minmax(0,1fr)) !important;gap:12px !important; }
html body .cx-device-emergency-notes-field { margin-top:12px !important; }
html body .cx-device-emergency-notes-head { display:flex !important;align-items:baseline !important;justify-content:space-between !important;gap:12px !important;margin-bottom:6px !important; }
html body .cx-device-emergency-notes-head span { color:#718492 !important;font-size:11px !important; }

html body .cx-location-schedule-mode { margin:12px 0 !important;padding:4px !important;display:grid !important;grid-template-columns:repeat(2,minmax(0,1fr)) !important;gap:4px !important;border:1px solid #d7e3eb !important;border-radius:10px !important;background:#f4f8fb !important; }
html body .cx-location-schedule-mode-button { min-height:42px !important;padding:7px 10px !important;display:flex !important;align-items:center !important;justify-content:center !important;gap:7px !important;border:1px solid transparent !important;border-radius:8px !important;background:transparent !important;color:#5d7487 !important;font-weight:700 !important; }
html body .cx-location-schedule-mode-button.is-selected { border-color:#bdd2e1 !important;background:#fff !important;color:#2d5d7e !important;box-shadow:0 1px 4px rgba(40,72,97,.08) !important; }
html body .cx-location-daily-schedule { display:grid !important;gap:6px !important;margin-top:10px !important; }
html body .cx-location-daily-schedule-head,
html body .cx-location-day-row { display:grid !important;grid-template-columns:minmax(145px,.7fr) minmax(140px,1fr) minmax(140px,1fr) !important;gap:10px !important;align-items:center !important; }
html body .cx-location-daily-schedule-head { padding:0 10px !important;color:#6b7e8d !important;font-size:10.5px !important;font-weight:800 !important;text-transform:uppercase !important;letter-spacing:.04em !important; }
html body .cx-location-day-row { min-height:56px !important;padding:7px 9px !important;border:1px solid #dce6ed !important;border-radius:9px !important;background:#f9fbfc !important; }
html body .cx-location-day-row.is-enabled { background:#fff !important;border-color:#cbdce7 !important; }
html body .cx-location-day-toggle { display:flex !important;align-items:center !important;gap:8px !important;cursor:pointer !important; }
html body .cx-location-day-toggle > input { position:absolute !important;opacity:0 !important;pointer-events:none !important; }
html body .cx-location-day-row:not(.is-enabled) .form-control { background:#f1f4f6 !important;color:#9aa9b4 !important; }

html body .cx-dialog--ringtone .cx-device-config-choice-card { position:relative !important;padding-right:112px !important; }
html body .cx-ringtone-preview-button { position:absolute !important;right:10px !important;top:50% !important;transform:translateY(-50%) !important;min-height:34px !important;padding:0 10px !important;display:inline-flex !important;align-items:center !important;gap:6px !important;border:1px solid #c8dbe8 !important;border-radius:7px !important;background:#fff !important;color:#356486 !important;font-size:11.5px !important;font-weight:750 !important; }
html body .cx-ringtone-preview-button:hover { background:#edf5fa !important;transform:translateY(-50%) !important; }

html body .mud-dialog.cx-notification-view-dialog,
html body .mud-dialog.cx-r1-notification-view {
    width: min(760px, calc(100vw - 32px)) !important;
    max-width: min(760px, calc(100vw - 32px)) !important;
    max-height: min(760px, calc(100dvh - 28px)) !important;
}
html body .mud-dialog.cx-notification-view-dialog .mud-dialog-content,
html body .mud-dialog.cx-r1-notification-view .mud-dialog-content { padding:12px 14px !important; }
html body .cx-notification-view-dialog .notification-view-form { width:100% !important;gap:9px !important; }
html body .cx-notification-view-dialog .notification-view-message-box { min-height:84px !important;max-height:210px !important;padding:11px 13px !important; }
html body .cx-notification-view-dialog .notification-view-title-box { min-height:42px !important;padding:9px 12px !important; }
html body .cx-notification-view-dialog .notification-view-priority-card { min-height:52px !important;padding:8px 11px !important; }
html body .cx-notification-view-dialog .cx-r1-section { padding:12px !important; }

html body .cx-usage-log-page { display:grid !important;gap:14px !important; }
html body .cx-usage-log-notice { padding:12px 14px !important;display:flex !important;align-items:flex-start !important;gap:10px !important;border:1px solid #cfe0eb !important;border-radius:10px !important;background:#f5f9fc !important;color:#315a76 !important; }
html body .cx-usage-log-notice > div { display:grid !important;gap:2px !important; }
html body .cx-usage-log-notice span { color:#657b8c !important;font-size:12px !important; }
html body .cx-usage-log-toolbar { padding:10px 12px !important;display:flex !important;align-items:end !important;gap:10px !important;border:1px solid #dde7ed !important;border-radius:10px !important;background:#fff !important; }
html body .cx-usage-log-toolbar label { min-width:230px !important;display:grid !important;gap:5px !important;color:#526b7e !important;font-size:11px !important;font-weight:750 !important; }
html body .cx-usage-log-table-shell { border:1px solid #dce6ed !important;border-radius:10px !important;background:#fff !important;overflow:auto !important; }
html body .cx-usage-log-table { margin:0 !important; }
html body .cx-usage-log-table th { padding:10px 12px !important;background:#eef7f2 !important;color:#294b68 !important;font-size:11px !important;text-transform:uppercase !important;letter-spacing:.025em !important;white-space:nowrap !important; }
html body .cx-usage-log-table td { padding:10px 12px !important;vertical-align:top !important;color:#354f64 !important; }
html body .cx-usage-log-table td:first-child { display:grid !important;gap:2px !important; }
html body .cx-usage-log-table td:first-child small { color:#7b8d9a !important;font-size:10.5px !important; }
html body .cx-usage-session-list { display:grid !important;gap:2px !important;font-size:11.5px !important; }

@media (max-width: 767.98px) {
    html body .cx-device-emergency-editor-grid,
    html body .cx-location-schedule-mode { grid-template-columns:minmax(0,1fr) !important; }
    html body .cx-location-daily-schedule-head { display:none !important; }
    html body .cx-location-day-row { grid-template-columns:minmax(0,1fr) !important;gap:7px !important; }
    html body .cx-alert-documents-manager-head { flex-direction:column !important; }
    html body .cx-alert-documents-add { width:100% !important;justify-content:center !important; }
    html body .cx-alert-document-preview-card { grid-template-columns:36px minmax(0,1fr) !important; }
    html body .cx-alert-document-preview-action { grid-column:2 !important;justify-content:flex-start !important; }
    html body .cx-usage-log-toolbar { align-items:stretch !important;flex-direction:column !important; }
    html body .cx-usage-log-toolbar label { min-width:0 !important;width:100% !important; }
}

html body.cx-design-system a:hover,
html body.cx-design-system button:hover,
html body.cx-design-system .btn:hover,
html body.cx-design-system .nav-link:hover,
html body.cx-design-system .dropdown-item:hover,
html body.cx-design-system [role="button"]:hover,
html body.cx-design-system .card:hover,
html body.cx-design-system .cx-page-action:hover,
html body.cx-design-system .device-list-name-button:hover,
html body.cx-design-system .device-list-action-toggle:hover,
html body.cx-design-system .conexgo-dashboard-card-action:hover,
html body.cx-design-system .conexgo-notification-trigger:hover,
html body.cx-design-system .conexgo-mobile-quick-nav a:hover,
html body.cx-design-system .conexgo-device-overview-metric:hover,
html body.cx-design-system .conexgo-dashboard-active-user:hover,
html body.cx-design-system .conexgo-dashboard-config-action:hover,
html body.cx-design-system .conexgo-dashboard-quick-action:hover {
    transform: none !important;
    translate: none !important;
    scale: 1 !important;
}

html body.cx-design-system a,
html body.cx-design-system button,
html body.cx-design-system .btn,
html body.cx-design-system .nav-link,
html body.cx-design-system .dropdown-item,
html body.cx-design-system [role="button"],
html body.cx-design-system .card,
html body.cx-design-system .cx-page-action {
    transform-origin: center center !important;
}

#conexgoDashboardSmartGrid.conexgo-dashboard-smart-grid {
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    grid-auto-flow: dense !important;
    grid-auto-rows: auto !important;
    align-items: start !important;
    gap: 16px !important;
    position: relative !important;
    overflow: visible !important;
}

#conexgoDashboardSmartGrid.conexgo-dashboard-smart-grid:has(> .conexgo-dashboard-smart-item:only-child) {
    grid-template-columns: minmax(0, 1fr) !important;
}

#conexgoDashboardSmartGrid > .conexgo-dashboard-smart-item {
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    visibility: visible !important;
    transform: none !important;
}

#conexgoDashboardSmartGrid > .conexgo-dashboard-smart-item > .card {
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    margin: 0 !important;
    position: relative !important;
    transform: none !important;
}

@media (min-width: 1200px) {
    #conexgoDashboardSmartGrid.cx-r1817-masonry-ready {
        display: block !important;
        min-height: 1px !important;
    }

    #conexgoDashboardSmartGrid.cx-r1817-masonry-ready > .conexgo-dashboard-smart-item {
        position: absolute !important;
        visibility: visible !important;
        transition: none !important;
        will-change: left, top, width;
    }
}

@media (max-width: 1199.98px) {
    #conexgoDashboardSmartGrid.conexgo-dashboard-smart-grid {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
        height: auto !important;
        min-height: 0 !important;
        gap: 12px !important;
    }

    #conexgoDashboardSmartGrid > .conexgo-dashboard-smart-item {
        position: relative !important;
        top: auto !important;
        left: auto !important;
        right: auto !important;
        width: 100% !important;
        height: auto !important;
        visibility: visible !important;
    }

    #conexgoDashboardSmartGrid > .conexgo-dashboard-smart-item > .card {
        width: 100% !important;
        max-width: 100% !important;
    }
}

.conexgo-dashboard-resizable-card {
    position: relative !important;
    resize: none !important;
}

.cx-dashboard-resize-handle-r1817 {
    position: absolute;
    right: 5px;
    bottom: 5px;
    width: 22px;
    height: 22px;
    z-index: 12;
    display: grid;
    place-items: center;
    border: 1px solid #c7d6e4;
    border-radius: 7px;
    background: rgba(248, 251, 253, .96);
    color: #426987;
    cursor: ns-resize;
    touch-action: none;
    user-select: none;
    box-shadow: 0 2px 6px rgba(31, 62, 89, .08);
}

.cx-dashboard-resize-handle-r1817::before {
    content: "";
    width: 9px;
    height: 9px;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    opacity: .72;
}

.cx-dashboard-resize-handle-r1817:hover,
.cx-dashboard-resize-handle-r1817:focus-visible {
    transform: none !important;
    background: #eef5fa;
    border-color: #8eabc2;
    outline: none;
}

.conexgo-dashboard-minimized-card > .cx-dashboard-resize-handle-r1817 {
    display: none !important;
}

@media (max-width: 1199.98px) {
    .cx-dashboard-resize-handle-r1817 {
        display: none !important;
    }
}

.alert-answer-comment-card.is-action-required,
.alert-answer-comment-card:has(textarea:placeholder-shown) {
    border-color: #d49a00 !important;
    border-width: 2px !important;
    background: #ffefad !important;
    box-shadow: 0 0 0 3px rgba(212, 154, 0, .14) !important;
    animation: cx-alert-answer-attention-r1817 1s ease-in-out 6;
}

.alert-answer-comment-card.is-action-required .alert-answer-comment-title,
.alert-answer-comment-card.is-action-required .alert-answer-next-action,
.alert-answer-comment-card:has(textarea:placeholder-shown) .alert-answer-comment-title {
    color: #684800 !important;
    font-weight: 900 !important;
}

.alert-answer-comment-card textarea::placeholder {
    color: #7b5b12 !important;
    opacity: 1 !important;
    font-weight: 700;
}

@keyframes cx-alert-answer-attention-r1817 {
    0%, 100% {
        background-color: #ffefad;
        box-shadow: 0 0 0 3px rgba(212, 154, 0, .14);
    }
    50% {
        background-color: #ffd95b;
        box-shadow: 0 0 0 6px rgba(193, 126, 0, .22);
    }
}

.cx-dialog--device-emergency-info .cx-emergency-info-section {
    width: 100% !important;
    max-width: none !important;
}

.cx-emergency-info-loading {
    min-height: 150px;
    display: grid;
    place-items: center;
}

.cx-emergency-info-device {
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 8px 0 14px;
    padding: 12px 14px;
    border: 1px solid #d8e3ec;
    border-radius: 10px;
    background: #f7fafc;
    color: #2c4c6c;
}

.cx-emergency-info-device > i {
    width: 36px;
    height: 36px;
    display: grid;
    place-items: center;
    border-radius: 9px;
    background: #fdecec;
    color: #b64d57;
}

.cx-emergency-info-device strong,
.cx-emergency-info-device span {
    display: block;
}

.cx-emergency-info-device span {
    margin-top: 2px;
    color: #6a7d8f;
    font-size: .82rem;
}

.cx-emergency-info-readonly {
    min-height: 150px;
    padding: 16px;
    border: 1px solid #cddbe7;
    border-left: 4px solid #b64d57;
    border-radius: 10px;
    background: #f8fbfd;
}

.cx-emergency-info-content {
    white-space: pre-wrap;
    overflow-wrap: anywhere;
    color: #344f68;
    line-height: 1.55;
}

.cx-emergency-info-empty {
    min-height: 110px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    color: #718397;
    text-align: center;
}

#cx-r1817-notification-toast-host {
    position: fixed;
    top: 82px;
    right: 18px;
    z-index: 200000;
    width: min(390px, calc(100vw - 28px));
    display: grid;
    gap: 10px;
    pointer-events: none;
}

.cx-r1817-notification-toast {
    pointer-events: auto;
    display: grid;
    grid-template-columns: 36px minmax(0, 1fr) 30px;
    align-items: start;
    gap: 10px;
    padding: 13px 12px 13px 13px;
    border: 1px solid #cbd9e5;
    border-left: 4px solid #3e6a99;
    border-radius: 12px;
    background: rgba(255, 255, 255, .985);
    color: #263f57;
    box-shadow: 0 16px 38px rgba(28, 51, 73, .18);
    animation: cx-r1817-toast-in .18s ease-out both;
}

.cx-r1817-notification-toast.is-high {
    border-left-color: #bc4050;
}

.cx-r1817-notification-toast.is-medium {
    border-left-color: #c58a1d;
}

.cx-r1817-notification-toast__icon {
    width: 36px;
    height: 36px;
    display: grid;
    place-items: center;
    border-radius: 9px;
    background: #edf4f9;
    color: #3e6a99;
}

.cx-r1817-notification-toast.is-high .cx-r1817-notification-toast__icon {
    background: #fdecef;
    color: #b23c4c;
}

.cx-r1817-notification-toast.is-medium .cx-r1817-notification-toast__icon {
    background: #fff4dc;
    color: #a97010;
}

.cx-r1817-notification-toast__title {
    margin: 0 0 3px;
    font-size: .88rem;
    font-weight: 800;
    line-height: 1.3;
}

.cx-r1817-notification-toast__message {
    margin: 0;
    color: #5d7184;
    font-size: .83rem;
    line-height: 1.4;
    overflow-wrap: anywhere;
}

.cx-r1817-notification-toast__close {
    width: 30px;
    height: 30px;
    padding: 0;
    border: 0;
    border-radius: 8px;
    background: transparent;
    color: #677c8f;
    display: grid;
    place-items: center;
}

.cx-r1817-notification-toast__close:hover {
    transform: none !important;
    background: #edf3f7;
}

@keyframes cx-r1817-toast-in {
    from { opacity: 0; }
    to { opacity: 1; }
}

@media (max-width: 575.98px) {
    #cx-r1817-notification-toast-host {
        top: 66px;
        right: 10px;
        width: calc(100vw - 20px);
    }
}

@media (prefers-reduced-motion: reduce) {
    .alert-answer-comment-card.is-action-required,
    .alert-answer-comment-card:has(textarea:placeholder-shown),
    .cx-r1817-notification-toast {
        animation: none !important;
    }
}

.conexgo-notification-list,
.conexgo-alert-list--classic,
.message-menu-scroll {
    scrollbar-width: auto !important;
    scrollbar-color: #9eacb9 #f4f7f9 !important;
    scrollbar-gutter: stable !important;
    overscroll-behavior: contain !important;
}

.conexgo-notification-list::-webkit-scrollbar,
.conexgo-alert-list--classic::-webkit-scrollbar,
.message-menu-scroll::-webkit-scrollbar {
    width: 11px !important;
    height: 11px !important;
}

.conexgo-notification-list::-webkit-scrollbar-track,
.conexgo-alert-list--classic::-webkit-scrollbar-track,
.message-menu-scroll::-webkit-scrollbar-track {
    background: #f4f7f9 !important;
    border-left: 1px solid #e2e8ee !important;
}

.conexgo-notification-list::-webkit-scrollbar-thumb,
.conexgo-alert-list--classic::-webkit-scrollbar-thumb,
.message-menu-scroll::-webkit-scrollbar-thumb {
    min-height: 44px;
    border: 2px solid #f4f7f9 !important;
    border-radius: 999px !important;
    background: #9eacb9 !important;
}

.conexgo-notification-list::-webkit-scrollbar-thumb:hover,
.conexgo-alert-list--classic::-webkit-scrollbar-thumb:hover,
.message-menu-scroll::-webkit-scrollbar-thumb:hover {
    background: #7f909f !important;
}

tr.cx-map-row-selected > td,
.cx-map-row-selected > td,
.cx-map-row-selected {
    background: #e4f0f7 !important;
    color: #203f5b !important;
}

tr.cx-map-row-selected > td:first-child,
.cx-map-row-selected > td:first-child {
    box-shadow: inset 4px 0 0 #3e6a99 !important;
}

tr.cx-map-row-selected:hover > td,
.cx-map-row-selected:hover > td,
.cx-map-row-selected:hover {
    background: #d9e9f3 !important;
}

.cx-dialog--alert-answer .alert-answer-action-row {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: stretch !important;
    gap: 12px !important;
    margin: 16px 0 12px !important;
}

.cx-dialog--alert-answer .alert-answer-toggle {
    min-width: 190px !important;
    min-height: 46px !important;
    padding: 10px 17px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    border-width: 1px !important;
    border-radius: 9px !important;
    font-size: 14px !important;
    font-weight: 800 !important;
    line-height: 1.2 !important;
    box-shadow: 0 2px 5px rgba(31, 59, 82, .06) !important;
    transform: none !important;
}

.cx-dialog--alert-answer .alert-answer-toggle i {
    font-size: 15px !important;
}

.cx-dialog--alert-answer .alert-answer-toggle-danger {
    border-color: #e6a8ad !important;
    background: #fff1f2 !important;
    color: #a9323d !important;
}

.cx-dialog--alert-answer .alert-answer-toggle-danger:hover,
.cx-dialog--alert-answer .alert-answer-toggle-danger:focus-visible {
    border-color: #d88790 !important;
    background: #fbe5e7 !important;
    color: #922b35 !important;
    transform: none !important;
}

.cx-dialog--alert-answer .alert-answer-toggle-danger.active {
    border-color: #a93743 !important;
    background: #b8424e !important;
    color: #ffffff !important;
    box-shadow: 0 0 0 3px rgba(184, 66, 78, .13) !important;
}

.cx-dialog--alert-answer .alert-answer-toggle-info {
    border-color: #a9c5da !important;
    background: #eef6fb !important;
    color: #294f70 !important;
}

.cx-dialog--alert-answer .alert-answer-toggle-info:hover,
.cx-dialog--alert-answer .alert-answer-toggle-info:focus-visible {
    border-color: #83acc9 !important;
    background: #e2f0f8 !important;
    color: #234661 !important;
    transform: none !important;
}

.cx-dialog--alert-answer .alert-answer-toggle-info.active {
    border-color: #315a7b !important;
    background: #315a7b !important;
    color: #ffffff !important;
    box-shadow: 0 0 0 3px rgba(49, 90, 123, .13) !important;
}

.alert-answer-map-wrap,
.alert-view-map-wrap,
.device-map-canvas-shell,
.group-map-wrap,
.cx-map-wrap {
    min-width: 0 !important;
    max-width: 100% !important;
    overflow: hidden !important;
}

#alert-answer-map-canvas,
.alert-answer-map-canvas,
.alert-view-map-canvas,
.device-map-canvas-shell #map-canvas,
.group-map-wrap #map-canvas,
.cx-map-wrap #map-canvas {
    position: relative !important;
    width: 100% !important;
    min-width: 0 !important;
    min-height: 340px !important;
    overflow: hidden !important;
    background: #f4f7f9 !important;
}

#alert-answer-map-canvas[data-conexgo-map-state="loading"],
#alert-answer-map-canvas[data-conexgo-map-state="empty"],
#alert-answer-map-canvas[data-conexgo-map-state="error"],
.alert-view-map-canvas[data-conexgo-map-state="loading"],
.alert-view-map-canvas[data-conexgo-map-state="empty"],
.alert-view-map-canvas[data-conexgo-map-state="error"],
#map-canvas[data-conexgo-map-state="loading"],
#map-canvas[data-conexgo-map-state="empty"],
#map-canvas[data-conexgo-map-state="error"] {
    display: grid !important;
    place-items: center !important;
    padding: 24px !important;
    color: #687b8e !important;
    text-align: center !important;
}

#alert-answer-map-canvas[data-conexgo-map-state="error"],
.alert-view-map-canvas[data-conexgo-map-state="error"],
#map-canvas[data-conexgo-map-state="error"] {
    color: #a33c46 !important;
    background: #fff6f7 !important;
}

#alert-answer-map-canvas[data-conexgo-map-state="ready"],
.alert-view-map-canvas[data-conexgo-map-state="ready"],
#map-canvas[data-conexgo-map-state="ready"] {
    display: block !important;
    padding: 0 !important;
    text-align: initial !important;
    background: #eef3f7 !important;
}

#alert-answer-map-canvas .gm-style,
.alert-view-map-canvas .gm-style,
#map-canvas .gm-style {
    width: 100% !important;
    height: 100% !important;
}

.row:has(> [class*="col-"] #map-canvas) > [class*="col-"],
.row:has(> [class*="col-"] .group-map-wrap) > [class*="col-"] {
    min-width: 0 !important;
}

.row:has(> [class*="col-"] #map-canvas) .table-responsive,
.row:has(> [class*="col-"] .group-map-wrap) .table-responsive {
    max-width: 100% !important;
}

@media (max-width: 1199.98px) {
    .row:has(> [class*="col-"] #map-canvas) > [class*="col-"],
    .row:has(> [class*="col-"] .group-map-wrap) > [class*="col-"] {
        flex: 0 0 100% !important;
        width: 100% !important;
        max-width: 100% !important;
    }
}

@media (max-width: 575.98px) {
    .cx-dialog--alert-answer .alert-answer-action-row {
        display: grid !important;
        grid-template-columns: 1fr !important;
    }

    .cx-dialog--alert-answer .alert-answer-toggle {
        width: 100% !important;
        min-width: 0 !important;
        min-height: 48px !important;
    }

    #alert-answer-map-canvas,
    .alert-answer-map-canvas,
    .alert-view-map-canvas,
    .device-map-canvas-shell #map-canvas,
    .group-map-wrap #map-canvas,
    .cx-map-wrap #map-canvas {
        min-height: 300px !important;
    }
}

html body.cx-design-system :is(.cx-dialog--alert-answer, .cx-dialog--alert-view) .cx-alert-comment-day {
    display: flex !important;
    flex-direction: column !important;
    gap: 5px !important;
    padding: 9px 12px !important;
}
html body.cx-design-system :is(.cx-dialog--alert-answer, .cx-dialog--alert-view) .cx-alert-comment-entry {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 3px !important;
    padding: 2px 0 5px !important;
    min-width: 0 !important;
}
html body.cx-design-system :is(.cx-dialog--alert-answer, .cx-dialog--alert-view) .cx-alert-comment-entry + .cx-alert-comment-entry {
    margin-top: 3px !important;
    padding-top: 7px !important;
    border-top: 1px solid rgba(205, 169, 55, .20) !important;
}
html body.cx-design-system :is(.cx-dialog--alert-answer, .cx-dialog--alert-view) .cx-alert-comment-meta {
    display: inline-flex !important;
    justify-content: flex-start !important;
    gap: 6px !important;
    font-size: 11px !important;
    white-space: normal !important;
}
html body.cx-design-system .cx-dialog--alert-answer .alert-answer-comment-history {
    max-height: 185px !important;
    overflow: auto !important;
}
html body.cx-design-system .cx-dialog--alert-answer .alert-answer-comment-editor {
    padding: 9px 11px !important;
}
html body.cx-design-system .cx-dialog--alert-answer .alert-answer-textarea {
    min-height: 78px !important;
    max-height: 150px !important;
}

html body .cx-alert-documents-alert-empty {
    display: flex !important;
    align-items: flex-start !important;
    gap: 10px !important;
    padding: 11px 12px !important;
    border: 1px dashed #c9d9e5 !important;
    border-radius: 8px !important;
    background: #f8fbfd !important;
    color: #536d82 !important;
}
html body .cx-alert-documents-alert-empty > i {
    margin-top: 2px !important;
    color: #5b82a1 !important;
}
html body .cx-alert-documents-alert-empty strong,
html body .cx-alert-documents-alert-empty span {
    display: block !important;
}
html body .cx-alert-documents-alert-empty strong {
    margin-bottom: 2px !important;
    color: #315a7d !important;
    font-size: 12px !important;
}
html body .cx-alert-documents-alert-empty span {
    font-size: 11.5px !important;
    line-height: 1.4 !important;
}

html body.cx-design-system :is(
    .dropdown-menu .dropdown-item,
    .dropdown-toggle,
    .slide-menu .slide-item,
    .side-menu__item,
    .device-list-action-menu .dropdown-item,
    .cx-device-config-choice-card,
    .cx-ringtone-preview-button,
    .cx-location-schedule-mode-button,
    .cx-alert-documents-add,
    .cx-alert-document-preview-card,
    .cx-alert-document-row-actions button,
    .cx-document-upload-button,
    .conexgo-account-document-action,
    .cx-dialog-action,
    .alert-answer-toggle,
    .alert-view-comments-toggle
):is(:hover, :focus-visible, :active) {
    transform: none !important;
    translate: none !important;
}
html body.cx-design-system .device-list-action-menu.show {
    max-height: min(360px, calc(100dvh - 170px)) !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    overscroll-behavior: contain !important;
    scrollbar-width: thin !important;
}
html body.cx-design-system .device-list-action-menu.show .dropdown-item:is(:hover, :focus-visible) {
    background: #f4f8fb !important;
    color: #294b68 !important;
    box-shadow: none !important;
}
html body.cx-design-system .slide-menu .slide-item:is(:hover, :focus-visible),
html body.cx-design-system .side-menu__item:is(:hover, :focus-visible) {
    box-shadow: none !important;
}

html body .cx-dialog--ringtone .cx-ringtone-choice-grid .cx-device-config-choice-card {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    align-items: stretch !important;
    min-height: 66px !important;
    padding: 0 !important;
    overflow: hidden !important;
    transform: none !important;
    transition: border-color .14s ease, background-color .14s ease, box-shadow .14s ease !important;
}
html body .cx-dialog--ringtone .cx-ringtone-choice-select {
    position: relative !important;
    min-width: 0 !important;
    min-height: 64px !important;
    margin: 0 !important;
    padding: 14px 10px 14px 48px !important;
    display: flex !important;
    align-items: center !important;
    cursor: pointer !important;
}
html body .cx-dialog--ringtone .cx-ringtone-choice-select--silent {
    grid-column: 1 / -1 !important;
}
html body .cx-dialog--ringtone .cx-ringtone-preview-button {
    position: static !important;
    align-self: center !important;
    min-width: 96px !important;
    min-height: 38px !important;
    margin: 0 11px 0 8px !important;
    padding: 0 12px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 7px !important;
    border: 1px solid #bfd3e2 !important;
    border-radius: 7px !important;
    background: #fff !important;
    color: #315f82 !important;
    box-shadow: none !important;
    transform: none !important;
}
html body .cx-dialog--ringtone .cx-ringtone-preview-button:is(:hover, :focus-visible) {
    background: #edf5fa !important;
    border-color: #9fbed3 !important;
    transform: none !important;
}

html body .cx-location-day-time {
    width: 100% !important;
    min-width: 0 !important;
    min-height: 42px !important;
}

html body .mud-dialog:has(.cx-r187752-notification-marker) {
    width: min(780px, calc(100vw - 28px)) !important;
    max-width: min(780px, calc(100vw - 28px)) !important;
    max-height: min(680px, calc(100dvh - 28px)) !important;
}
html body .mud-dialog:has(.cx-r187752-notification-marker) .mud-dialog-content {
    padding: 10px 12px !important;
    overflow: auto !important;
}
html body .mud-dialog:has(.cx-r187752-notification-marker) .cx-r1-section {
    padding: 11px 12px !important;
}
html body .mud-dialog:has(.cx-r187752-notification-marker) .notification-view-form {
    gap: 8px !important;
}
html body .mud-dialog:has(.cx-r187752-notification-marker) .notification-view-priority-card {
    min-height: 50px !important;
    padding: 8px 10px !important;
}
html body .mud-dialog:has(.cx-r187752-notification-marker) .notification-view-title-box {
    min-height: 40px !important;
    padding: 8px 11px !important;
}
html body .mud-dialog:has(.cx-r187752-notification-marker) .notification-view-message-box {
    min-height: 78px !important;
    max-height: 170px !important;
    padding: 10px 11px !important;
    overflow: auto !important;
}
html body .mud-dialog:has(.cx-r187752-notification-marker) .mud-dialog-actions {
    padding: 9px 12px !important;
}

html body .cx-document-upload-button {
    width: 100% !important;
    min-height: 40px !important;
    padding: 0 12px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 7px !important;
    border-color: #3d6287 !important;
    background: #3d6287 !important;
    color: #fff !important;
    box-shadow: none !important;
}
html body .cx-document-upload-message {
    color: #6c7d8b !important;
    font-size: 12px !important;
}
html body .conexgo-account-document-action .spinner-border {
    width: 14px !important;
    height: 14px !important;
    border-width: 2px !important;
}

@media (max-width: 720px) {
    html body .cx-dialog--ringtone .cx-ringtone-choice-grid .cx-device-config-choice-card {
        grid-template-columns: minmax(0, 1fr) !important;
    }
    html body .cx-dialog--ringtone .cx-ringtone-preview-button {
        width: calc(100% - 22px) !important;
        margin: 0 11px 11px !important;
    }
    html body .mud-dialog:has(.cx-r187752-notification-marker) {
        width: calc(100vw - 16px) !important;
        max-width: calc(100vw - 16px) !important;
        max-height: calc(100dvh - 16px) !important;
    }
}

html body.cx-design-system .cx-alert-product-identity {
    width: 52px;
    height: 52px;
    flex: 0 0 52px;
    display: grid;
    place-items: center;
    border: 1px solid #d7e3ec;
    border-radius: 10px;
    background: #fff;
    overflow: hidden;
}

html body.cx-design-system .cx-alert-product-image {
    width: 100%;
    height: 100%;
    object-fit: contain;
    padding: 5px;
}

html body.cx-design-system .alert-view-summary-main:has(.cx-alert-product-identity) {
    display: grid;
    grid-template-columns: 52px minmax(0, 1fr);
    column-gap: 12px;
    align-items: center;
}

html body.cx-design-system .alert-view-summary-main:has(.cx-alert-product-identity)
> :is(.alert-view-badge, .alert-view-device-title, .alert-view-account-subtitle) {
    grid-column: 2;
}

html body.cx-design-system .cx-alert-workflow-inline-control {
    flex: 0 0 auto !important;
    min-width: 0 !important;
    display: inline-grid !important;
    grid-template-columns: 220px !important;
    grid-template-rows: 13px 42px !important;
    align-items: end !important;
    gap: 2px !important;
    margin: 0 !important;
    padding: 0 !important;
    white-space: nowrap !important;
}

html body.cx-design-system .cx-alert-workflow-inline-label {
    min-width: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 4px !important;
    margin: 0 !important;
    padding: 0 2px !important;
    color: #61758a !important;
    font-size: 10.5px !important;
    font-weight: 800 !important;
    line-height: 1 !important;
    letter-spacing: .025em !important;
    white-space: nowrap !important;
}

html body.cx-design-system .cx-alert-workflow-inline-label .device-filter-label-icon {
    width: 14px !important;
    height: 14px !important;
    min-width: 14px !important;
    margin: 0 !important;
    border: 0 !important;
    background: transparent !important;
    font-size: 9px !important;
}

html body.cx-design-system .cx-alert-workflow-inline-select,
html body.cx-design-system .cx-alert-workflow-inline-select .cx-custom-select-root,
html body.cx-design-system .cx-alert-workflow-inline-select .cx-custom-select-trigger {
    width: 220px !important;
    min-width: 220px !important;
    max-width: 220px !important;
}

html body.cx-design-system .cx-alert-workflow-inline-select .cx-custom-select-trigger {
    min-height: 42px !important;
    height: 42px !important;
    padding-left: 12px !important;
    border-color: #bdd0de !important;
    border-radius: 10px !important;
    background: #ffffff !important;
    box-shadow: 0 1px 3px rgba(35, 76, 105, .05) !important;
}

html body.cx-design-system .cx-alert-workflow-inline-select .cx-custom-select-trigger:hover,
html body.cx-design-system .cx-alert-workflow-inline-select .cx-custom-select-trigger:focus-visible,
html body.cx-design-system .cx-alert-workflow-inline-select .cx-custom-select-root.is-open .cx-custom-select-trigger {
    border-color: #8eacc2 !important;
    background: #f8fbfd !important;
    box-shadow: 0 0 0 3px rgba(64, 112, 148, .08) !important;
}

@media (max-width: 767.98px) {
    html body.cx-design-system .cx-alert-workflow-inline-control {
        grid-template-columns: 190px !important;
    }

    html body.cx-design-system .cx-alert-workflow-inline-label {
        font-size: 10px !important;
    }

    html body.cx-design-system .cx-alert-workflow-inline-select,
    html body.cx-design-system .cx-alert-workflow-inline-select .cx-custom-select-root,
    html body.cx-design-system .cx-alert-workflow-inline-select .cx-custom-select-trigger {
        width: 190px !important;
        min-width: 190px !important;
        max-width: 190px !important;
    }
}

@media (max-width: 767.98px) {
    html body.cx-design-system .cx-alert-product-identity {
        width: 44px;
        height: 44px;
        flex-basis: 44px;
    }

    html body.cx-design-system .alert-view-summary-main:has(.cx-alert-product-identity) {
        grid-template-columns: 44px minmax(0, 1fr);
    }
}

@media (max-width: 767.98px) {
    html body.cx-design-system
    #conexgoDashboardSmartGrid
    > .conexgo-dashboard-smart-item:has(> .conexgo-dashboard-minimized-card),
    html body.cx-design-system
    #conexgoDashboardSmartGrid
    > .conexgo-dashboard-smart-item:has(> .conexgo-dashboard-card-closing) {
        height: auto !important;
        min-height: 52px !important;
        max-height: none !important;
        overflow: visible !important;
    }

    html body.cx-design-system
    #conexgoDashboardSmartGrid
    > .conexgo-dashboard-smart-item
    > .conexgo-dashboard-minimized-card,
    html body.cx-design-system
    #conexgoDashboardSmartGrid
    > .conexgo-dashboard-smart-item
    > .conexgo-dashboard-card-closing {
        height: auto !important;
        min-height: 52px !important;
        max-height: none !important;
        overflow: hidden !important;
    }

    html body.cx-design-system
    #conexgoDashboardSmartGrid
    .conexgo-dashboard-minimized-card
    > .conexgo-dashboard-card-header-surface,
    html body.cx-design-system
    #conexgoDashboardSmartGrid
    .conexgo-dashboard-card-closing
    > .conexgo-dashboard-card-header-surface {
        height: auto !important;
        min-height: 52px !important;
        max-height: none !important;
        padding: 8px 8px 8px 12px !important;
        display: flex !important;
        align-items: center !important;
        overflow: visible !important;
    }

    html body.cx-design-system
    #conexgoDashboardSmartGrid
    .conexgo-dashboard-card-header {
        min-height: 36px !important;
        height: auto !important;
        align-items: center !important;
    }

    html body.cx-design-system
    #conexgoDashboardSmartGrid
    .conexgo-dashboard-card-title {
        margin: 0 !important;
        padding: 1px 0 !important;
        white-space: normal !important;
        overflow: visible !important;
        text-overflow: clip !important;
        line-height: 1.25 !important;
        max-width: 100% !important;
    }

    html body.cx-design-system
    #conexgoDashboardSmartGrid
    .conexgo-dashboard-minimized-card
    > .card-body,
    html body.cx-design-system
    #conexgoDashboardSmartGrid
    .conexgo-dashboard-card-closing
    > .card-body {
        display: none !important;
    }
}

@keyframes cx-alert-incoming-trigger-pulse {
    0%, 100% {
        box-shadow: 0 0 0 0 rgba(44, 82, 116, 0);
        filter: none;
    }
    30% {
        box-shadow: 0 0 0 6px rgba(44, 82, 116, .14), 0 0 16px rgba(44, 82, 116, .10);
        filter: brightness(1.07);
    }
    62% {
        box-shadow: 0 0 0 3px rgba(44, 82, 116, .08);
        filter: brightness(1.02);
    }
}

@keyframes cx-alert-incoming-card-pulse {
    0%, 100% {
        box-shadow: 0 0 0 0 var(--cx-alert-attention-glow, rgba(11, 79, 240, 0));
        filter: none;
    }
    34% {
        box-shadow:
            0 0 0 5px var(--cx-alert-attention-glow, rgba(11, 79, 240, .24)),
            0 0 18px var(--cx-alert-attention-glow, rgba(11, 79, 240, .24));
        filter: brightness(1.035);
    }
    68% {
        box-shadow:
            0 0 0 2px var(--cx-alert-attention-glow-soft, rgba(11, 79, 240, .12)),
            0 0 10px var(--cx-alert-attention-glow-soft, rgba(11, 79, 240, .12));
        filter: brightness(1.015);
    }
}

html body.cx-design-system .conexgo-header-alerts .conexgo-alert-trigger.cx-alert-incoming-attention {
    animation: cx-alert-incoming-trigger-pulse .72s ease-in-out 4 !important;
}

html body.cx-design-system .conexgo-header-alerts .conexgo-alert-card--classic.conexgo-alert-card--default {
    --cx-alert-attention-accent: #0b4ff0;
    --cx-alert-attention-glow: rgba(11, 79, 240, .24);
    --cx-alert-attention-glow-soft: rgba(11, 79, 240, .12);
}

html body.cx-design-system .conexgo-header-alerts .conexgo-alert-card--classic.conexgo-alert-card--english {
    --cx-alert-attention-accent: #ef334d;
    --cx-alert-attention-glow: rgba(239, 51, 77, .24);
    --cx-alert-attention-glow-soft: rgba(239, 51, 77, .12);
}

html body.cx-design-system .conexgo-header-alerts .conexgo-alert-card.cx-alert-incoming-card {
    animation: cx-alert-incoming-card-pulse .82s ease-in-out 4 !important;
    border-color: var(--cx-alert-attention-accent) !important;
    background-color: #fff !important;
}

html body.cx-design-system .cx-alert-description-wrap {
    display: flex;
    align-items: center;
    gap: 7px;
    flex-wrap: wrap;
}

html body.cx-design-system .cx-alert-no-comment-badge {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    min-height: 24px;
    padding: 3px 8px;
    border: 1px solid #e1b45a;
    border-radius: 999px;
    background: #fff8e8;
    color: #8d6112;
    font-size: 11px;
    font-weight: 760;
    line-height: 1;
    white-space: nowrap;
    vertical-align: middle;
}

html body.cx-design-system .cx-alert-no-comment-badge.is-handled {
    border-color: #d89933;
    background: #fff4dc;
    color: #80530d;
}

html body.cx-design-system .cx-alert-no-comment-badge i {
    font-size: 10px;
}

@media (max-width: 767.98px) {
    html body.cx-design-system .cx-alert-no-comment-badge {
        width: 24px;
        min-width: 24px;
        height: 24px;
        padding: 0;
        justify-content: center;
    }

    html body.cx-design-system .cx-alert-no-comment-badge > span {
        display: none;
    }
}

@media (prefers-reduced-motion: reduce) {
    html body.cx-design-system .conexgo-header-alerts .conexgo-alert-trigger.cx-alert-incoming-attention,
    html body.cx-design-system .conexgo-header-alerts .conexgo-alert-card.cx-alert-incoming-card {
        animation: none !important;
    }
}

html body.cx-design-system
:is(.cx-dialog--alert-answer, .cx-dialog--alert-view)
.alert-answer-action-row > .alert-answer-toggle,
html body.cx-design-system
:is(.cx-dialog--alert-answer, .cx-dialog--alert-view)
.alert-answer-action-row > .cx-alert-documents-toggle-row > .alert-answer-toggle {
    font-size: 14.5px !important;
    font-weight: 790 !important;
    line-height: 1.2 !important;
}

html body.cx-design-system
:is(.cx-dialog--alert-answer, .cx-dialog--alert-view)
.alert-answer-action-row .alert-answer-toggle > i {
    font-size: 14px !important;
}

html body.cx-design-system
:is(.cx-dialog--alert-answer, .cx-dialog--alert-view)
.cx-alert-documents-count {
    font-size: 11.5px !important;
}

html body.cx-design-system .cx-alert-map-fallback-note {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    margin: 0;
    padding: 9px 12px;
    border-bottom: 1px solid #dbe6ee;
    background: #f7fafc;
    color: #5d7182;
    font-size: 12.5px;
    line-height: 1.4;
}

html body.cx-design-system .cx-alert-map-fallback-note i {
    margin-top: 2px;
    color: #507b9d;
}

@media (prefers-reduced-motion: reduce) {
    html body.cx-design-system .conexgo-header-alerts .conexgo-alert-trigger.cx-alert-incoming-attention,
    html body.cx-design-system .conexgo-header-alerts .conexgo-alert-card.cx-alert-incoming-card {
        animation: none !important;
    }
}

html body.cx-design-system .mud-dialog.cx-r1816-blocknotice .cx-r1-form-row--with-help {
    grid-template-columns: minmax(175px, 225px) minmax(0, 1fr) !important;
}

html body.cx-design-system .mud-dialog.cx-r1816-blocknotice .cx-r1876-blocknotice-field-grid {
    width: 100% !important;
    min-width: 0 !important;
    display: grid !important;
    grid-template-columns: minmax(280px, 1fr) minmax(230px, .72fr) !important;
    align-items: start !important;
    gap: 14px 18px !important;
}

html body.cx-design-system .mud-dialog.cx-r1816-blocknotice .cx-r1876-blocknotice-primary-control,
html body.cx-design-system .mud-dialog.cx-r1816-blocknotice .cx-r1876-blocknotice-primary-control > *,
html body.cx-design-system .mud-dialog.cx-r1816-blocknotice .cx-r1876-blocknotice-primary-control .cx-control-field,
html body.cx-design-system .mud-dialog.cx-r1816-blocknotice .cx-r1876-blocknotice-primary-control .cx-date-picker-shell,
html body.cx-design-system .mud-dialog.cx-r1816-blocknotice .cx-r1876-blocknotice-primary-control .mud-input-control {
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
}

html body.cx-design-system .mud-dialog.cx-r1816-blocknotice .cx-block-notice-date,
html body.cx-design-system .mud-dialog.cx-r1816-blocknotice .cx-block-notice-date .cx-date-picker-shell,
html body.cx-design-system .mud-dialog.cx-r1816-blocknotice .cx-block-notice-date .mud-picker,
html body.cx-design-system .mud-dialog.cx-r1816-blocknotice .cx-block-notice-date .mud-input-control {
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
}

html body.cx-design-system .mud-dialog.cx-r1816-blocknotice .cx-block-notice-date .mud-input {
    min-height: 44px !important;
}

html body.cx-design-system .mud-dialog.cx-r1816-blocknotice .cx-r1876-blocknotice-field-grid .cx-field-help {
    padding-top: 9px !important;
    line-height: 1.45 !important;
}

html body.cx-design-system .cx-usage-log-error {
    width: 100%;
    margin: 12px 0 14px;
    padding: 11px 13px;
    display: flex;
    align-items: center;
    gap: 10px;
    border: 1px solid #efb6bd;
    border-left: 4px solid #cf3345;
    border-radius: 10px;
    background: #fff6f7;
    color: #8f2532;
    font-size: .9rem;
    font-weight: 650;
}

html body.cx-design-system .cx-usage-log-error > span {
    flex: 1 1 auto;
    min-width: 0;
}

html body.cx-design-system .device-status-icons i,
html body.cx-design-system .device-mobile-status-icons i,
html body.cx-design-system .device-mobile-status-pill,
html body.cx-design-system .device-status-cell > div:first-child {
    transition: color .18s ease, background-color .18s ease, border-color .18s ease, opacity .18s ease !important;
}

@media (max-width: 767.98px) {
    html body.cx-design-system .mud-dialog.cx-r1816-blocknotice .cx-r1-form-row--with-help,
    html body.cx-design-system .mud-dialog.cx-r1816-blocknotice .cx-r1876-blocknotice-field-grid {
        grid-template-columns: minmax(0, 1fr) !important;
    }

    html body.cx-design-system .mud-dialog.cx-r1816-blocknotice .cx-r1876-blocknotice-field-grid .cx-field-help {
        padding-top: 0 !important;
    }

    html body.cx-design-system .cx-usage-log-error {
        align-items: flex-start;
        flex-wrap: wrap;
    }
}


@media (min-width: 992px) {
    html body.cx-design-system .account-config-card .account-config-section-header > [class*="col-"],
    html body.cx-design-system .account-config-card .account-config-section-content > [class*="col-"] {
        width: auto !important;
        max-width: none !important;
        min-width: 0 !important;
        flex: none !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    html body.cx-design-system .account-config-card .account-config-section-content .account-config-col-email,
    html body.cx-design-system .account-config-card .account-config-section-content .account-config-col-sms,
    html body.cx-design-system .account-config-card .account-config-section-content .account-config-col-updated {
        align-self: start !important;
        text-align: left !important;
        line-height: 1.45 !important;
    }
}

html body.cx-design-system .account-config-card .account-config-collapse-button svg {
    transform-origin: center !important;
    transition: transform .24s cubic-bezier(.22, 1, .36, 1) !important;
}

html body.cx-design-system .account-config-card .account-config-collapse-button.is-expanded svg {
    transform: rotate(180deg) !important;
}


html body.cx-design-system .account-config-card .account-config-section-header .account-config-column-label,
html body.cx-design-system .account-config-card .account-config-section-header .account-config-section-title {
    color: #244b6b !important;
}

@media (min-width: 992px) {
    html body.cx-design-system .account-config-card,
    html body.cx-design-system .account-config-card .card-body,
    html body.cx-design-system .account-config-card .table-responsive,
    html body.cx-design-system .account-config-card .dataTables_wrapper,
    html body.cx-design-system .account-config-card .dataTables_wrapper > .row,
    html body.cx-design-system .account-config-card .dataTables_wrapper > .row > .col-sm-12.col-md-12,
    html body.cx-design-system .account-config-section-header {
        overflow: visible !important;
    }

    html body.cx-design-system .account-config-section-header {
        position: relative !important;
    }

    html body.cx-design-system .account-config-section-header > .account-config-col-toggle {
        z-index: 80 !important;
        pointer-events: auto !important;
    }

    html body.cx-design-system .account-config-section-header > .account-config-col-toggle .account-config-collapse-button {
        position: relative !important;
        z-index: 81 !important;
    }
}

html body.cx-design-system .alert-list-card-body .cx-alert-workflow-inline-control .cx-custom-select-root,
html body.cx-design-system .alert-list-card-body .cx-alert-workflow-inline-control .cx-custom-select-trigger {
    margin-bottom: 0 !important;
}

html body.cx-design-system .alert-list-card-body .alert-filter-inline > .alert-filter-item {
    align-self: flex-end !important;
    margin-bottom: 0 !important;
}

/* Shared interaction consistency for lists, alerts, notifications and dialogs. */






html body.cx-design-system .alert-list-card-body .cx-alert-workflow-inline-control > .device-filter-label .device-filter-label-icon {

    width: 18px !important;

    min-width: 18px !important;

    height: 18px !important;

    font-size: 10px !important;

}



html body.cx-design-system .alert-list-card-body .cx-alert-workflow-inline-control :is(

    .device-filter-control,

    .cx-custom-select-root

) {

    width: 100% !important;

    max-width: 100% !important;

    margin: 0 !important;

}






html body.cx-design-system :is(

    .device-list-action-menu,

    .conexgo-row-action-menu,

    .account-list-cell-name .dropdown-menu

) .dropdown-item {

    transition:

        background-color .18s cubic-bezier(.2,.72,.26,1),

        border-color .18s cubic-bezier(.2,.72,.26,1),

        color .18s cubic-bezier(.2,.72,.26,1),

        box-shadow .18s cubic-bezier(.2,.72,.26,1) !important;

}



html body.cx-design-system :is(

    .device-list-action-menu,

    .conexgo-row-action-menu,

    .account-list-cell-name .dropdown-menu

) .dropdown-item:is(:hover, :focus-visible) {

    background: #edf5fa !important;

    border-color: #d5e3ed !important;

    color: #2c4c6c !important;

    box-shadow: inset 3px 0 0 rgba(61, 111, 151, .22) !important;

    transform: none !important;

}



html body.cx-design-system :is(

    .device-list-action-menu,

    .conexgo-row-action-menu,

    .account-list-cell-name .dropdown-menu

) .dropdown-item.cx-row-action-danger {

    color: #a73d4b !important;

    background: #fff7f8 !important;

}



html body.cx-design-system :is(

    .device-list-action-menu,

    .conexgo-row-action-menu,

    .account-list-cell-name .dropdown-menu

) .dropdown-item.cx-row-action-danger:is(:hover, :focus-visible) {

    color: #9c3040 !important;

    background: #fdecee !important;

    border-color: #f0c4ca !important;

    box-shadow: inset 3px 0 0 #c64d5d !important;

}



html body.cx-design-system :is(

    .device-list-action-group .device-list-name-button,

    .account-list-cell-name .account-list-name-button

) {

    transition:

        background-color .18s cubic-bezier(.2,.72,.26,1),

        border-color .18s cubic-bezier(.2,.72,.26,1),

        box-shadow .18s cubic-bezier(.2,.72,.26,1) !important;

}



html body.cx-design-system :is(

    .device-list-action-group .device-list-name-button,

    .account-list-cell-name .account-list-name-button

):is(:hover, :focus-visible) {

    background: #f4f8fb !important;

    border-color: #b9cfde !important;

    box-shadow: 0 4px 12px rgba(44, 76, 108, .08) !important;

    transform: none !important;

}



html body.cx-design-system .conexgo-row-action-toggle .conexgo-row-action-chevron,

html body.cx-design-system .device-list-action-toggle::after,

html body.cx-design-system .conexgo-row-action-toggle::after {

    transform-origin: center !important;

    transition: transform .22s cubic-bezier(.2,.72,.26,1) !important;

}



html body.cx-design-system .conexgo-row-action-toggle[aria-expanded="true"] .conexgo-row-action-chevron,

html body.cx-design-system .device-list-action-toggle[aria-expanded="true"]::after,

html body.cx-design-system .conexgo-row-action-toggle[aria-expanded="true"]::after {

    transform: rotate(180deg) !important;

}



html body.cx-design-system .conexgo-notification-dropdown .conexgo-notification-item {

    --cx-notification-accent: #8aa0b2;

    border: 1px solid #e2e9ef !important;

    border-left: 4px solid var(--cx-notification-accent) !important;

    border-radius: 10px !important;

    background: #ffffff !important;

    transform: translateX(0) !important;

    translate: none !important;

    transition:

        background-color .46s cubic-bezier(.22, 1, .36, 1),

        border-color .46s cubic-bezier(.22, 1, .36, 1),

        color .38s ease,

        box-shadow .46s cubic-bezier(.22, 1, .36, 1),

        transform .34s cubic-bezier(.22, 1, .36, 1) !important;

}



html body.cx-design-system .conexgo-notification-dropdown .conexgo-notification-item.is-high {

    --cx-notification-accent: #c94b5d;

    border-left-color: var(--cx-notification-accent) !important;

}



html body.cx-design-system .conexgo-notification-dropdown .conexgo-notification-item.is-medium {

    --cx-notification-accent: #d3942f;

    border-left-color: var(--cx-notification-accent) !important;

}



html body.cx-design-system .conexgo-notification-dropdown .conexgo-notification-item.is-information {

    --cx-notification-accent: #3f77ad;

    border-left-color: var(--cx-notification-accent) !important;

}



html body.cx-design-system .conexgo-notification-dropdown .conexgo-notification-item:is(:hover, :focus-visible) {
    background: linear-gradient(90deg, #f8fbfd 0%, #edf5f9 100%) !important;
    border-color: #cbdce7 !important;
    border-left-color: var(--cx-notification-accent) !important;
    color: #1f3f5c !important;
    box-shadow: 0 5px 14px rgba(31, 61, 89, .10) !important;
    transform: translateX(3px) !important;
    translate: none !important;
    scale: 1 !important;
    filter: none !important;}
/* R18-289-1 NOTIFICATION ICON HOVER */
html body.cx-design-system
.conexgo-notification-dropdown
.conexgo-notification-item-icon {
    transition: transform .22s cubic-bezier(.22, 1, .36, 1), box-shadow .22s ease !important;
}

html body.cx-design-system
.conexgo-notification-dropdown
.conexgo-notification-item:is(:hover, :focus-visible)
.conexgo-notification-item-icon {
    transform: translateY(-1px) scale(1.06) !important;
    box-shadow: 0 4px 10px rgba(31, 61, 89, .10) !important;
}



html body.cx-design-system .conexgo-header-notifications .conexgo-notification-trigger,
html body.cx-design-system .conexgo-header-alerts .conexgo-alert-trigger {

    transition:

        background-color .28s cubic-bezier(.22, 1, .36, 1),

        border-color .28s cubic-bezier(.22, 1, .36, 1),

        color .28s ease,

        box-shadow .28s cubic-bezier(.22, 1, .36, 1),

        transform .28s cubic-bezier(.22, 1, .36, 1) !important;

}



html body.cx-design-system .conexgo-header-notifications .conexgo-notification-trigger:is(:hover, :focus-visible),
html body.cx-design-system .conexgo-header-notifications.show .conexgo-notification-trigger {

    background: #f4f7f9 !important;

    border-color: #d1dde6 !important;

    box-shadow: 0 3px 10px rgba(44, 76, 108, .075) !important;

    transform: none !important;

}



html body.cx-design-system .conexgo-header-alerts .conexgo-alert-trigger:is(:hover, :focus-visible),
html body.cx-design-system .conexgo-header-alerts.show .conexgo-alert-trigger {

    transform: none !important;

}



html body.cx-design-system .conexgo-header-notifications .conexgo-notification-trigger:is(:hover, :focus-visible) .conexgo-notification-bell,
html body.cx-design-system .conexgo-header-notifications.show .conexgo-notification-bell {

    transform-origin: center !important;

}



html body.cx-design-system .conexgo-notification-row-actions .r18-197-s046,

html body.cx-design-system .conexgo-notification-row-actions .r18-197-s046:is(

    :hover,

    :focus,

    :focus-visible,

    :active,

    .active

) {

    background: #315d8a !important;

    border-color: #315d8a !important;

    color: #fff !important;

    background-image: none !important;

    filter: none !important;

    transform: none !important;

}



html body.cx-design-system .conexgo-notification-row-actions .r18-197-s046:is(:hover, :focus-visible) {

    box-shadow:

        inset 0 0 0 999px rgba(0,0,0,.035),

        0 4px 10px rgba(49, 93, 138, .14) !important;

}



html body.cx-design-system .conexgo-notification-row-actions .r18-197-s046:is(:active, .active) {

    box-shadow: inset 0 0 0 999px rgba(0,0,0,.07) !important;

}



html body.cx-design-system .mud-dialog .cx-dialog-action:not(.mud-disabled) {

    transform: none !important;

    filter: none !important;

    transition:

        box-shadow .18s ease,

        border-color .18s ease,

        background-color .18s ease,

        color .18s ease !important;

}



html body.cx-design-system .mud-dialog .cx-dialog-action:not(.mud-disabled):is(:hover, :focus-visible) {

    transform: none !important;

    filter: none !important;

    box-shadow:

        inset 0 0 0 999px rgba(0,0,0,.035),

        0 4px 10px rgba(29, 59, 82, .10) !important;

}



html body.cx-design-system .mud-dialog .cx-dialog-action:not(.mud-disabled):active {

    transform: none !important;

    filter: none !important;

    box-shadow: inset 0 0 0 999px rgba(0,0,0,.07) !important;

}



html body.cx-design-system .mud-dialog :is(

    .conexgo-action-publish,

    .cx-dialog-action--publish

),

html body.cx-design-system .mud-dialog :is(

    .conexgo-action-publish,

    .cx-dialog-action--publish

):is(:hover, :focus, :focus-visible, :active) {

    background: #315879 !important;

    border-color: #315879 !important;

    color: #fff !important;

}



@media (max-width: 767.98px) {

    html body.cx-design-system .device-config-card .device-config-section-content > :is(

        .device-config-col-edit,

        .device-config-col-edit--standalone

    ) {

        min-height: 44px !important;

        align-self: center !important;

        align-items: center !important;

        justify-content: center !important;

    }



    html body.cx-design-system .device-config-card .device-config-section-content > :is(

        .device-config-col-value,

        .device-config-col-value--wide,

        .device-config-col-value--geofence

    ) {

        min-height: 44px !important;

        padding-top: 0 !important;

        display: flex !important;

        align-items: center !important;

        align-self: center !important;

    }

}



html body.cx-design-system #conexgoDashboardSmartGrid :is(

    .conexgo-dashboard-latest-item,

    .conexgo-dashboard-ranked-item,

    .cx-dashboard-offline-item,

    .conexgo-dashboard-active-user

) {

    margin-bottom: 5px !important;

}



html body.cx-design-system #conexgoDashboardSmartGrid :is(

    .conexgo-dashboard-latest-item,

    .conexgo-dashboard-ranked-item,

    .cx-dashboard-offline-item,

    .conexgo-dashboard-active-user

):last-child {

    margin-bottom: 0 !important;

}

/* End shared interaction consistency. */

/* R18-259 compact alerts + report date controls */
html body.cx-design-system
.alert-list-card-body
.alert-filter-inline {
    width: 100% !important;
    display: flex !important;
    align-items: flex-end !important;
    justify-content: flex-start !important;
    flex-wrap: nowrap !important;
    gap: 12px !important;
    padding-top: 0 !important;
}

html body.cx-design-system
.alert-list-card-body
.cx-alert-workflow-inline-control {
    flex: 0 0 220px !important;
    width: 220px !important;
    min-width: 220px !important;
    max-width: 220px !important;
    display: flex !important;
    flex-direction: column !important;
    align-self: flex-end !important;
    gap: 4px !important;
    margin: 0 !important;
    padding: 0 !important;
}

html body.cx-design-system
.alert-list-card-body
.cx-alert-workflow-inline-control > .device-filter-label {
    position: static !important;
    inset: auto !important;
    margin: 0 0 0 2px !important;
    padding: 0 !important;
    color: #50677d !important;
    font-size: 11px !important;
    font-weight: 760 !important;
    line-height: 1.05 !important;
    white-space: nowrap !important;
}

html body.cx-design-system
.alert-list-card-body
.cx-alert-workflow-inline-control
:is(.device-filter-control, .cx-custom-select-root) {
    width: 220px !important;
    min-width: 220px !important;
    max-width: 220px !important;
    margin: 0 !important;
}

html body.cx-design-system
.alert-list-card-body
.cx-alert-workflow-inline-control
.cx-custom-select-trigger,
html body.cx-design-system
.alert-list-card-body
.alert-filter-option {
    min-height: 36px !important;
    height: 36px !important;
    margin: 0 !important;
}

html body.cx-design-system
.alert-list-card-body
.alert-filter-option {
    padding: 4px 12px !important;
    gap: 7px !important;
    border-radius: 10px !important;
}

/* Report dates use the same compact field language as the custom alert range.
   The date group is narrower than before; the modal itself is not enlarged. */
html body.cx-design-system
.cx-report-subscribe-dialog
.cx-r191-custom-period-range {
    width: min(100%, 760px) !important;
    max-width: 760px !important;
    min-width: 0 !important;
    margin: 12px auto 0 !important;
    padding: 0 !important;
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    align-items: start !important;
    gap: 16px !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}

html body.cx-design-system
.cx-report-subscribe-dialog
.cx-r191-custom-period-card {
    width: 100% !important;
    min-width: 0 !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 6px !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}

html body.cx-design-system
.cx-report-subscribe-dialog
.cx-r191-custom-period-card > label {
    min-width: 0 !important;
    min-height: 0 !important;
    margin: 0 0 0 2px !important;
    padding: 0 !important;
    color: #50677d !important;
    font-size: .78rem !important;
    font-weight: 800 !important;
    line-height: 1.1 !important;
    letter-spacing: .01em !important;
    white-space: nowrap !important;
}

html body.cx-design-system
.cx-report-subscribe-dialog
.cx-r191-custom-period-card
:is(
    .cx-date-picker-v16-1,
    .cx-date-picker-shell,
    .mud-picker,
    .mud-input-control,
    .mud-input-control-input-container
) {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    margin: 0 !important;
}

html body.cx-design-system
.cx-report-subscribe-dialog
.cx-r191-custom-period-card
:is(.cx-date-picker-v16-1, .cx-date-picker-shell) {
    min-height: 46px !important;
    overflow: hidden !important;
    background: #fff !important;
    border: 1px solid #cbdce8 !important;
    border-radius: 10px !important;
    box-shadow: 0 1px 2px rgba(37, 79, 112, .045) !important;
}

html body.cx-design-system
.cx-report-subscribe-dialog
.cx-r191-custom-period-card
.mud-input {
    min-height: 44px !important;
    height: 44px !important;
    margin: 0 !important;
    padding-left: 12px !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}

html body.cx-design-system
.cx-report-subscribe-dialog
.cx-r191-custom-period-card
.mud-input-adornment-end {
    min-width: 46px !important;
    width: 46px !important;
    min-height: 44px !important;
    height: 44px !important;
    margin: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: #eef5f9 !important;
    border-left: 1px solid #d8e5ee !important;
    border-radius: 0 9px 9px 0 !important;
}

html body.cx-design-system
.cx-report-subscribe-dialog
.cx-r191-custom-period-card
:is(.cx-date-picker-v16-1, .cx-date-picker-shell):hover {
    border-color: #a9c4d8 !important;
    box-shadow: 0 3px 10px rgba(37, 79, 112, .07) !important;
}

html body.cx-design-system
.cx-report-subscribe-dialog
.cx-r191-custom-period-card
:is(.cx-date-picker-v16-1, .cx-date-picker-shell):focus-within {
    border-color: #6f9dbc !important;
    box-shadow: 0 0 0 3px rgba(61, 111, 151, .10) !important;
}

@media (max-width: 767.98px) {
    html body.cx-design-system
    .alert-list-card-body
    .alert-filter-inline {
        overflow-x: auto !important;
        overflow-y: visible !important;
        padding-bottom: 4px !important;
        scroll-snap-type: x proximity;
    }

    html body.cx-design-system
    .alert-list-card-body
    .cx-alert-workflow-inline-control {
        flex-basis: 210px !important;
        width: 210px !important;
        min-width: 210px !important;
        max-width: 210px !important;
    }

    html body.cx-design-system
    .alert-list-card-body
    .cx-alert-workflow-inline-control
    :is(.device-filter-control, .cx-custom-select-root) {
        width: 210px !important;
        min-width: 210px !important;
        max-width: 210px !important;
    }

    html body.cx-design-system
    .cx-report-subscribe-dialog
    .cx-r191-custom-period-range {
        width: 100% !important;
        max-width: 100% !important;
        grid-template-columns: minmax(0, 1fr) !important;
        gap: 12px !important;
    }
}
/* END R18-259 compact alerts + report date controls */

/* R18-289-1 DARK BLUE ACTION HOVER */
html body.cx-design-system
.mud-dialog.cx-dialog-root
:is(.conexgo-dialog-save-close, .cx-dialog-action--save-close):is(:hover, :focus-visible) {
    border-color: #234663 !important;
    background: linear-gradient(135deg, #315f86 0%, #244b6d 100%) !important;
    color: #ffffff !important;
    box-shadow: 0 7px 16px rgba(31, 61, 89, .18) !important;
    filter: none !important;
}

/* Document download remains unmistakably violet, including hover/focus. */
html body.cx-design-system .cx-document-download {
    --cx-document-download-accent: #6954d9 !important;
    border-color: #6954d9 !important;
    color: #6954d9 !important;
}

html body.cx-design-system
.cx-document-download:is(:hover, :focus, :focus-visible, :active) {
    border-color: #6954d9 !important;
    background: #6954d9 !important;
    color: #ffffff !important;
    box-shadow: 0 5px 12px rgba(105, 84, 217, .22) !important;
    filter: none !important;
}
/* R18-290-1 CUSTOM NOTICE BEGIN */
html body.cx-ui-notice-open {
    overflow: hidden !important;
}

html body .cx-ui-notice-overlay[hidden] {
    display: none !important;
}

html body .cx-ui-notice-overlay {
    position: fixed !important;
    inset: 0 !important;
    z-index: 17000 !important;
}

html body .cx-ui-notice-backdrop {
    position: absolute !important;
    inset: 0 !important;
    background: rgba(27, 47, 69, .42) !important;
    backdrop-filter: blur(2px) !important;
}

html body .cx-ui-notice-card {
    position: relative !important;
    width: min(560px, calc(100vw - 28px)) !important;
    margin: min(11vh, 80px) auto 0 !important;
    overflow: hidden !important;
    border: 1px solid #d6e1ea !important;
    border-radius: 22px !important;
    background: #ffffff !important;
    box-shadow: 0 18px 44px rgba(27, 47, 69, .16) !important;
}

html body .cx-ui-notice-header {
    padding: 19px 22px 8px !important;
    display: flex !important;
    align-items: center !important;
    gap: 14px !important;
}

html body .cx-ui-notice-icon {
    flex: 0 0 54px !important;
    width: 54px !important;
    height: 54px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border: 1px solid #d7e3ec !important;
    border-radius: 17px !important;
    background: #eef5fa !important;
    color: #2f5b82 !important;
}

html body .cx-ui-notice-icon svg {
    width: 29px !important;
    height: 29px !important;
}

html body .cx-ui-notice-overlay[data-notice-type="warning"] .cx-ui-notice-icon {
    background: #fff5dc !important;
    border-color: #f0d489 !important;
    color: #9a6a08 !important;
}

html body .cx-ui-notice-overlay[data-notice-type="success"] .cx-ui-notice-icon {
    background: #eaf7ef !important;
    border-color: #b9dec6 !important;
    color: #2d7544 !important;
}

html body .cx-ui-notice-overlay[data-notice-type="error"] .cx-ui-notice-icon {
    background: #fdecef !important;
    border-color: #efc2ca !important;
    color: #b23d50 !important;
}

html body .cx-ui-notice-header h2 {
    margin: 0 !important;
    color: #284a68 !important;
    font-size: 21px !important;
    font-weight: 800 !important;
    line-height: 1.2 !important;
}

html body .cx-ui-notice-body {
    padding: 6px 22px 0 !important;
}

html body .cx-ui-notice-body p {
    margin: 0 !important;
    color: #46627c !important;
    font-size: 15px !important;
    line-height: 1.55 !important;
}

html body .cx-ui-notice-footer {
    padding: 18px 22px 22px !important;
    display: flex !important;
    justify-content: flex-end !important;
}

html body .cx-ui-notice-button {
    min-width: 132px !important;
    min-height: 50px !important;
    border: 1px solid #294f72 !important;
    border-radius: 15px !important;
    background: linear-gradient(135deg, #37698f 0%, #2b5579 100%) !important;
    color: #ffffff !important;
    font-size: 15px !important;
    font-weight: 800 !important;
    box-shadow: 0 6px 14px rgba(31, 61, 89, .18) !important;
    transition: transform .18s ease, box-shadow .18s ease, background .18s ease !important;
}

html body .cx-ui-notice-button:is(:hover, :focus-visible) {
    outline: none !important;
    transform: translateY(-1px) !important;
    background: linear-gradient(135deg, #315f86 0%, #244b6d 100%) !important;
    box-shadow: 0 9px 18px rgba(31, 61, 89, .22) !important;
}
/* R18-290-1 CUSTOM NOTICE END */